{"id":16229802,"url":"https://github.com/indaco/goaster","last_synced_at":"2025-03-16T12:32:02.096Z","repository":{"id":225776374,"uuid":"764064786","full_name":"indaco/goaster","owner":"indaco","description":"A configurable and themeable toast notification component for Go web applications.","archived":false,"fork":false,"pushed_at":"2024-05-07T06:54:17.000Z","size":9260,"stargazers_count":27,"open_issues_count":1,"forks_count":0,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-02-27T08:53:53.383Z","etag":null,"topics":["component","go","golang","server-side","templ","toast-notifications","ui-component"],"latest_commit_sha":null,"homepage":"","language":"Go","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/indaco.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-02-27T12:19:50.000Z","updated_at":"2025-01-06T09:09:14.000Z","dependencies_parsed_at":"2024-05-07T07:42:24.650Z","dependency_job_id":"c44530dd-9d17-4dec-b416-617e32853308","html_url":"https://github.com/indaco/goaster","commit_stats":null,"previous_names":["indaco/goaster"],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/indaco%2Fgoaster","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/indaco%2Fgoaster/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/indaco%2Fgoaster/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/indaco%2Fgoaster/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/indaco","download_url":"https://codeload.github.com/indaco/goaster/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243814880,"owners_count":20352037,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["component","go","golang","server-side","templ","toast-notifications","ui-component"],"created_at":"2024-10-10T12:59:16.852Z","updated_at":"2025-03-16T12:32:01.544Z","avatar_url":"https://github.com/indaco.png","language":"Go","funding_links":[],"categories":["UI Components"],"sub_categories":[],"readme":"\u003ch1 align=\"center\" style=\"font-size: 2.5rem;\"\u003e\n  goaster\n\u003c/h1\u003e\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/indaco/goaster/blob/main/LICENSE\" target=\"_blank\"\u003e\n    \u003cimg src=\"https://img.shields.io/badge/license-mit-blue?style=flat-square\u0026logo=none\" alt=\"license\" /\u003e\n  \u003c/a\u003e\n  \u0026nbsp;\n  \u003ca href=\"https://goreportcard.com/report/github.com/indaco/goaster/\" target=\"_blank\"\u003e\n    \u003cimg src=\"https://goreportcard.com/badge/github.com/indaco/goaster\" alt=\"go report card\" /\u003e\n  \u003c/a\u003e\n  \u0026nbsp;\n  \u003ca href=\"https://pkg.go.dev/github.com/indaco/goaster/\" target=\"_blank\"\u003e\n      \u003cimg src=\"https://pkg.go.dev/badge/github.com/indaco/goaster/.svg\" alt=\"go reference\" /\u003e\n  \u003c/a\u003e\n  \u0026nbsp;\n  \u003ca href=\"https://www.jetify.com/devbox/docs/contributor-quickstart/\"\u003e\n    \u003cimg src=\"https://www.jetify.com/img/devbox/shield_moon.svg\" alt=\"Built with Devbox\" /\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"#features\"\u003eFeatures\u003c/a\u003e •\n  \u003ca href=\"#installation\"\u003eInstallation\u003c/a\u003e •\n  \u003ca href=\"#usage\"\u003eUsage\u003c/a\u003e •\n  \u003ca href=\"#custom-icons\"\u003eCustom Icons\u003c/a\u003e •\n  \u003ca href=\"#theming\"\u003eTheming\u003c/a\u003e •\n  \u003ca href=\"#examples\"\u003eExamples\u003c/a\u003e •\n  \u003ca href=\"#contributing\"\u003eContributing\u003c/a\u003e\n\u003c/p\u003e\n\nA configurable, themeable and non-intrusive server-rendered toast notification component for Go web applications. Built with [templ](https://github.com/a-h/templ) library for seamless integration with Go-based web frontends.\n\n### Features\n\n- **No External Dependencies**: Built with native Go and the `templ` library, requiring no external frontend dependencies.\n- **Multiple Toasts**: Support to display multiple toast notifications.\n- **Configurable**: Customize appearance (bordered, rounded), behavior, and position.\n- **Variants**: Provide toast style variants like `Accent`, `AccentLight` and `AccentDark`.\n- **Themeable**: Use CSS variables to theme your toasts to match your application's design.\n- **Icon Support**: Include default SVG icons for various toast levels (such as success, error, info, etc.), allowing you to use your preferred icons.\n- **Positioning**: Flexible positioning of toast messages (top-right, bottom-left, etc.).\n- **Progress Bar for Auto-Dismiss**: A visual progress bar indicates the countdown until the toast will automatically dismiss (with auto-dismiss enabled only).\n- **Animations**: Entrance and exit animations for toast notifications.\n  - _Default Animations_: built-in animations for toasts appearing and disappearing.\n  - _Custom Animations_: Customize animations via CSS variables or integrate with external CSS animation libraries.\n  - _Animation Control_: Full control over animation timing, easing, delay and effects, via CSS variables.\n  - _Disable Animations Option_: Ability to completely disable animations, providing flexibility for different application needs and user preferences.\n\n\u003cdiv style=\"display: flex; justify-content: center;\"\u003e\n   \u003cimg src=\"statics/demo.gif\" alt=\"Image\" \u003e\n\u003c/div\u003e\n\n## Installation\n\nEnsure your project is using Go Modules.\n\nTo install the module, use the `go get` command:\n\n```sh\ngo get github.com/indaco/goaster@latest\n```\n\n## Usage\n\nImport `goaster` module into your project:\n\n```go\nimport \"github.com/indaco/goaster\"\n```\n\n### Creating a Toaster\n\nInitialize a `Toaster` with default settings:\n\n```go\ntoaster := goaster.NewToaster()\n```\n\nor customize the toaster with options:\n\n```go\ntoaster := goaster.NewToaster(\n   goaster.WithBorder(false),\n   goaster.WithPosition(goaster.TopRight),\n   goaster.WithAutoDismiss(false)\n   // ...\n)\n```\n\n### Add goester CSS and Javascript\n\n`goaster` leverages the `templ` library's features, including CSS Components and JavaScript Templates, to encapsulate all necessary styling and functionality without relying on external dependencies.\n\n- `GoasterCSS`: it supplies the required CSS, encapsulating the visual design and layout specifics of the toast notifications.\n- `GoasterJS`: it provides the JavaScript logic essential for dynamic behaviors such as displaying, hiding, and managing toast notifications.\n\nTo facilitate integration with Go's `template/html` standard library, `goaster` includes a dedicated `HTMLGenerator` type to seamlessly integrate toast notifications into web applications built with Go's `html/template` standard library.\n\n3 methods, acting as wrappers to the templ's `templ.ToGoHTML`, generate the necessary HTML to be embedded them into server-rendered pages:\n\n- `GoasterCSSToGoHTML`: render the `GoasterCSS` component into a `template.HTML` value.\n- `GoasterJSToGoHTML`: render the `GoasterJS`component into a `template.HTML` value.\n\n\u003e **Note**: refer to the [Examples](#examples) section to see how to use `goaster` with `templ` and `html/template`.\n\n### Displaying Toast Messages\n\nDisplay different levels of toast messages:\n\n```go\ntoaster.Default(\"Sample message.\")\ntoaster.Success(\"Operation completed successfully.\")\ntoaster.Error(\"An error occurred.\")\ntoaster.Info(\"Here's some information.\")\ntoaster.Warning(\"This is a warning message.\")\n```\n\n### Add Toast Messages to the queue and display them\n\nMultiple toast messages in the queue:\n\n```go\ntoaster.PushDefault(\"Sample message.\")\ntoaster.PushSuccess(\"Operation completed successfully.\")\ntoaster.PushError(\"An error occurred.\")\ntoaster.PushInfo(\"Here's some information.\")\ntoaster.PushWarning(\"This is a warning message.\")\n\ntoaster.RenderAll()\n```\n\n## Custom Icons\n\nSpecify custom SVG icons for each toast level:\n\n```go\ntoaster := goaster.NewToaster(\n   goaster.WithIcon(toast.SuccessLevel, \"\u003csvg\u003e...\u003c/svg\u003e\"),\n   goaster.WithIcon(toast.ErrorLevel, \"\u003csvg\u003e...\u003c/svg\u003e\"),\n)\n```\n\n## Theming\n\nCustomizing the appearance of `goaster` notifications to align with your design preferences is both straightforward and flexible, accomplished by using CSS custom properties (CSS variables) prefixed with `gtt`. For a comprehensive list of CSS custom properties, along with their default values and descriptions, please consult the tabber [CSS custom Props](./docs/css-props.md) document.\n\n## Examples\n\n- [use with `a-h/templ` template](_examples/a-h-templ-single-toast)\n- [multiple messages with `a-h/templ`](_examples/a-h-templ-multiple-toasts)\n- [use with `template/html`](_examples/go-html-template-single-toast)\n- [multiple messages with `template/html`](_examples/go-html-template-multiple-toasts)\n- [theming](_examples/theming)\n- [variants](_examples/variants)\n- [custom icons](_examples/custom-icons)\n- [custom animations](_examples/custom-animations)\n\n## Contributing\n\nContributions are welcome! Feel free to open an issue or submit a pull request.\n\n### Development Environment Setup\n\nTo set up a development environment for this repository, you can use [devbox](https://www.jetify.com/devbox) along with the provided `devbox.json` configuration file.\n\n1. Install devbox by following the instructions in the [devbox documentation](https://www.jetify.com/devbox/docs/installing_devbox/).\n2. Clone this repository to your local machine.\n3. Navigate to the root directory of the cloned repository.\n4. Run `devbox install` to install all packages mentioned in the `devbox.json` file.\n5. Run `devbox shell` to start a new shell with access to the environment.\n6. Once the devbox environment is set up, you can start developing, testing, and contributing to the repository.\n\n### Using Makefile\n\nAdditionally, you can make use of the provided `Makefile` to run various tasks:\n\n```bash\nmake build       # The main build target\nmake examples    # Process templ files in the _examples folder\nmake templ       # Process TEMPL files\nmake test        # Run go tests\nmake help        # Print this help message\n```\n\n## License\n\nThis project is licensed under the MIT License - see the LICENSE file for details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Findaco%2Fgoaster","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Findaco%2Fgoaster","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Findaco%2Fgoaster/lists"}