{"id":33051164,"url":"https://shakee93.github.io/vue-toasted/","last_synced_at":"2025-11-18T21:01:18.039Z","repository":{"id":18189539,"uuid":"83702103","full_name":"shakee93/vue-toasted","owner":"shakee93","description":"🖖 Responsive Touch Compatible Toast plugin for VueJS 2+","archived":false,"fork":false,"pushed_at":"2023-05-30T14:19:57.000Z","size":7604,"stargazers_count":2215,"open_issues_count":65,"forks_count":193,"subscribers_count":21,"default_branch":"master","last_synced_at":"2025-11-06T14:12:15.270Z","etag":null,"topics":["notification","responsive","toast","toast-plugin","toastr","touch-compatible","vue","vue-notification","vue-toasted"],"latest_commit_sha":null,"homepage":"https://shakee93.github.io/vue-toasted/","language":"JavaScript","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/shakee93.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","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},"funding":{"github":null,"patreon":"shakee93","open_collective":null,"ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":null}},"created_at":"2017-03-02T16:51:13.000Z","updated_at":"2025-11-06T13:32:06.000Z","dependencies_parsed_at":"2024-01-14T06:04:26.932Z","dependency_job_id":"63342f6f-2bff-4298-84ee-5bcdb16a5833","html_url":"https://github.com/shakee93/vue-toasted","commit_stats":{"total_commits":128,"total_committers":26,"mean_commits":4.923076923076923,"dds":0.2890625,"last_synced_commit":"db5ccc47b9b7b27f097dde0943d67f4269c6be0d"},"previous_names":[],"tags_count":31,"template":false,"template_full_name":null,"purl":"pkg:github/shakee93/vue-toasted","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shakee93%2Fvue-toasted","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shakee93%2Fvue-toasted/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shakee93%2Fvue-toasted/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shakee93%2Fvue-toasted/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/shakee93","download_url":"https://codeload.github.com/shakee93/vue-toasted/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shakee93%2Fvue-toasted/sbom","scorecard":{"id":815315,"data":{"date":"2025-08-11","repo":{"name":"github.com/shakee93/vue-toasted","commit":"db5ccc47b9b7b27f097dde0943d67f4269c6be0d"},"scorecard":{"version":"v5.2.1-40-gf6ed084d","commit":"f6ed084d17c9236477efd66e5b258b9d4cc7b389"},"score":2.7,"checks":[{"name":"Code-Review","score":7,"reason":"Found 12/16 approved changesets -- score normalized to 7","details":null,"documentation":{"short":"Determines if the project requires human code review before pull requests (aka merge requests) are merged.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#code-review"}},{"name":"Maintained","score":0,"reason":"0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0","details":null,"documentation":{"short":"Determines if the project is \"actively maintained\".","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#maintained"}},{"name":"Token-Permissions","score":-1,"reason":"No tokens found","details":null,"documentation":{"short":"Determines if the project's workflows follow the principle of least privilege.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#token-permissions"}},{"name":"Dangerous-Workflow","score":-1,"reason":"no workflows found","details":null,"documentation":{"short":"Determines if the project's GitHub Action workflows avoid dangerous patterns.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#dangerous-workflow"}},{"name":"Packaging","score":-1,"reason":"packaging workflow not detected","details":["Warn: no GitHub/GitLab publishing workflow detected."],"documentation":{"short":"Determines if the project is published as a package that others can easily download, install, easily update, and uninstall.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#packaging"}},{"name":"Binary-Artifacts","score":10,"reason":"no binaries found in the repo","details":null,"documentation":{"short":"Determines if the project has generated executable (binary) artifacts in the source repository.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#binary-artifacts"}},{"name":"Pinned-Dependencies","score":-1,"reason":"no dependencies found","details":null,"documentation":{"short":"Determines if the project has declared and pinned the dependencies of its build process.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#pinned-dependencies"}},{"name":"CII-Best-Practices","score":0,"reason":"no effort to earn an OpenSSF best practices badge detected","details":null,"documentation":{"short":"Determines if the project has an OpenSSF (formerly CII) Best Practices Badge.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#cii-best-practices"}},{"name":"Security-Policy","score":0,"reason":"security policy file not detected","details":["Warn: no security policy file detected","Warn: no security file to analyze","Warn: no security file to analyze","Warn: no security file to analyze"],"documentation":{"short":"Determines if the project has published a security policy.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#security-policy"}},{"name":"License","score":10,"reason":"license file detected","details":["Info: project has a license file: LICENSE:0","Info: FSF or OSI recognized license: MIT License: LICENSE:0"],"documentation":{"short":"Determines if the project has defined a license.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#license"}},{"name":"Fuzzing","score":0,"reason":"project is not fuzzed","details":["Warn: no fuzzer integrations found"],"documentation":{"short":"Determines if the project uses fuzzing.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#fuzzing"}},{"name":"Signed-Releases","score":-1,"reason":"no releases found","details":null,"documentation":{"short":"Determines if the project cryptographically signs release artifacts.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#signed-releases"}},{"name":"Branch-Protection","score":0,"reason":"branch protection not enabled on development/release branches","details":["Warn: branch protection not enabled for branch 'master'"],"documentation":{"short":"Determines if the default and release branches are protected with GitHub's branch protection settings.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#branch-protection"}},{"name":"SAST","score":0,"reason":"SAST tool is not run on all commits -- score normalized to 0","details":["Warn: 0 commits out of 26 are checked with a SAST tool"],"documentation":{"short":"Determines if the project uses static code analysis.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#sast"}},{"name":"Vulnerabilities","score":0,"reason":"106 existing vulnerabilities detected","details":["Warn: Project is vulnerable to: GHSA-v88g-cgmw-v5xw","Warn: Project is vulnerable to: GHSA-whgm-jr23-g3j9","Warn: Project is vulnerable to: GHSA-fwr7-v2mv-hh25","Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92","Warn: Project is vulnerable to: GHSA-qwcr-r2fm-qrc7","Warn: Project is vulnerable to: GHSA-v6h2-p8h4-qcjw","Warn: Project is vulnerable to: GHSA-cwfw-4gq5-mrqx","Warn: Project is vulnerable to: GHSA-g95f-p29q-9xw4","Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg","Warn: Project is vulnerable to: GHSA-x9w5-v3q2-3rhw","Warn: Project is vulnerable to: GHSA-257v-vj4p-3w2h","Warn: Project is vulnerable to: GHSA-pxg6-pf52-xh8x","Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275","Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c","Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq","Warn: Project is vulnerable to: GHSA-3wcq-x3mq-6r9p","Warn: Project is vulnerable to: GHSA-phwq-j96m-2c2q","Warn: Project is vulnerable to: GHSA-ghr5-ch3p-vcr6","Warn: Project is vulnerable to: GHSA-vh7m-p724-62c2","Warn: Project is vulnerable to: GHSA-r9p9-mrjm-926w","Warn: Project is vulnerable to: GHSA-434g-2637-qmqr","Warn: Project is vulnerable to: GHSA-49q7-c7j4-3p7m","Warn: Project is vulnerable to: GHSA-977x-g7h5-7qgw","Warn: Project is vulnerable to: GHSA-f7q4-pwc6-w24p","Warn: Project is vulnerable to: GHSA-fc9h-whq2-v747","Warn: Project is vulnerable to: GHSA-vjh7-7g9h-fjfh","Warn: Project is vulnerable to: GHSA-6h5x-7c5m-7cr7","Warn: Project is vulnerable to: GHSA-rv95-896h-c2vc","Warn: Project is vulnerable to: GHSA-qw6h-vgh9-j6wx","Warn: Project is vulnerable to: GHSA-74fj-2j2h-c42q","Warn: Project is vulnerable to: GHSA-pw2r-vq6v-hr8c","Warn: Project is vulnerable to: GHSA-jchw-25xp-jwwc","Warn: Project is vulnerable to: GHSA-cxjh-pqwp-8mfp","Warn: Project is vulnerable to: GHSA-fjxv-7rqg-78g4","Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj","Warn: Project is vulnerable to: GHSA-6x33-pw7p-hmpq","Warn: Project is vulnerable to: GHSA-c7qv-q95q-8v27","Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37","Warn: Project is vulnerable to: GHSA-78xj-cgh5-2h22","Warn: Project is vulnerable to: GHSA-2p57-rm9w-gvfp","Warn: Project is vulnerable to: GHSA-7r28-3m3f-r2pr","Warn: Project is vulnerable to: GHSA-r8j5-h5cx-65gg","Warn: Project is vulnerable to: GHSA-2pr6-76vf-7546","Warn: Project is vulnerable to: GHSA-8j8c-7jfh-h6hx","Warn: Project is vulnerable to: GHSA-896r-f27r-55mw","Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h","Warn: Project is vulnerable to: GHSA-6c8f-qphg-qjgp","Warn: Project is vulnerable to: GHSA-76p3-8jx3-jpfq","Warn: Project is vulnerable to: GHSA-3rfm-jhwj-7488","Warn: Project is vulnerable to: GHSA-hhq3-ff78-jv3g","Warn: Project is vulnerable to: GHSA-p6mc-m468-83gw","Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9","Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm","Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv","Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3","Warn: Project is vulnerable to: GHSA-vh95-rmgr-6w4m","Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h","Warn: Project is vulnerable to: GHSA-mwcw-c2x4-8c55","Warn: Project is vulnerable to: GHSA-92xj-mqp7-vmcj","Warn: Project is vulnerable to: GHSA-wxgw-qj99-44c2","Warn: Project is vulnerable to: GHSA-5rrq-pxf6-6jx5","Warn: Project is vulnerable to: GHSA-8fr3-hfg3-gpgp","Warn: Project is vulnerable to: GHSA-gf8q-jrpm-jvxq","Warn: Project is vulnerable to: GHSA-2r2c-g63r-vccr","Warn: Project is vulnerable to: GHSA-cfm4-qjh2-4765","Warn: Project is vulnerable to: GHSA-x4jg-mjrx-434g","Warn: Project is vulnerable to: GHSA-r8f7-9pfq-mjmv","Warn: Project is vulnerable to: GHSA-76c9-3jph-rj3q","Warn: Project is vulnerable to: GHSA-9wv6-86v2-598j","Warn: Project is vulnerable to: GHSA-rhx6-c78j-4q9w","Warn: Project is vulnerable to: GHSA-h7cp-r72f-jxh6","Warn: Project is vulnerable to: GHSA-v62p-rq8g-8h59","Warn: Project is vulnerable to: GHSA-566m-qj78-rww5","Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j","Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp","Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6","Warn: Project is vulnerable to: GHSA-x3m3-4wpv-5vgc","Warn: Project is vulnerable to: GHSA-7mwh-4pqv-wmr8","Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw","Warn: Project is vulnerable to: GHSA-m6fv-jmcg-4jfg","Warn: Project is vulnerable to: GHSA-cm22-4g7w-348p","Warn: Project is vulnerable to: GHSA-c9g6-9335-x697","Warn: Project is vulnerable to: GHSA-3jfq-g458-7qm9","Warn: Project is vulnerable to: GHSA-5955-9wpr-37jh","Warn: Project is vulnerable to: GHSA-f5x3-32g6-xq36","Warn: Project is vulnerable to: GHSA-r628-mhmh-qjhw","Warn: Project is vulnerable to: GHSA-9r2w-394v-53qc","Warn: Project is vulnerable to: GHSA-qq89-hq3f-393p","Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3","Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v","Warn: Project is vulnerable to: GHSA-9m6j-fcg5-2442","Warn: Project is vulnerable to: GHSA-hh27-ffr2-f2jc","Warn: Project is vulnerable to: GHSA-rqff-837h-mm52","Warn: Project is vulnerable to: GHSA-8v38-pw62-9cw2","Warn: Project is vulnerable to: GHSA-hgjh-723h-mx2j","Warn: Project is vulnerable to: GHSA-jf5r-8hm2-f872","Warn: Project is vulnerable to: GHSA-g3ch-rx76-35fx","Warn: Project is vulnerable to: GHSA-pgr8-jg6h-8gw6","Warn: Project is vulnerable to: GHSA-wr3j-pwj9-hqq6","Warn: Project is vulnerable to: GHSA-cf66-xwfp-gvc4","Warn: Project is vulnerable to: GHSA-4v9v-hfq4-rm2v","Warn: Project is vulnerable to: GHSA-9jgg-88mc-972h","Warn: Project is vulnerable to: GHSA-g78m-2chm-r7qv","Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q","Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh","Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp"],"documentation":{"short":"Determines if the project has open, known unfixed vulnerabilities.","url":"https://github.com/ossf/scorecard/blob/f6ed084d17c9236477efd66e5b258b9d4cc7b389/docs/checks.md#vulnerabilities"}}]},"last_synced_at":"2025-08-23T14:09:38.947Z","repository_id":18189539,"created_at":"2025-08-23T14:09:38.948Z","updated_at":"2025-08-23T14:09:38.948Z"},"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":285138471,"owners_count":27121052,"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","status":"online","status_checked_at":"2025-11-18T02:00:05.759Z","response_time":61,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["notification","responsive","toast","toast-plugin","toastr","touch-compatible","vue","vue-notification","vue-toasted"],"created_at":"2025-11-14T03:00:23.832Z","updated_at":"2025-11-18T21:01:18.030Z","avatar_url":"https://github.com/shakee93.png","language":"JavaScript","funding_links":["https://patreon.com/shakee93"],"categories":["Awesome Vue.js [![Awesome](https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg)](https://github.com/sindresorhus/awesome)"],"sub_categories":["Libraries \u0026 Plugins"],"readme":"\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://github.com/shakee93/vue-toasted\" target=\"_blank\"\u003e\n    \u003cimg width=\"250\"src=\"https://freshpixl.com/vue-toasted.png?new\"\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://www.npmjs.com/package/vue-toasted\"\u003e\u003cimg src=\"https://img.shields.io/npm/v/vue-toasted.svg?style=flat-square\"/\u003e \u003cimg src=\"https://img.shields.io/npm/dm/vue-toasted.svg?style=flat-square\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/vuejs/awesome-vue\"\u003e\u003cimg src=\"https://cdn.rawgit.com/sindresorhus/awesome/d7305f38d29fed78fa85652e3a63e154dd8e8829/media/badge.svg\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://vuejs.org/\"\u003e\u003cimg src=\"https://img.shields.io/badge/vue-2.x-brightgreen.svg?style=flat-square\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/shakee93/vue-toasted/\"\u003e\u003cimg src=\"http://img.badgesize.io/shakee93/vue-toasted/master/dist/vue-toasted.min.js?compression=gzip\u0026style=flat-square\"/\u003e\u003c/a\u003e\n  \u003ca href=\"http://packagequality.com/#?package=vue-toasted\"\u003e\u003cimg src=\"http://npm.packagequality.com/shield/vue-toasted.svg?style=flat-square\"/\u003e\u003c/a\u003e\n  \u003ca href=\"https://gitpod.io/from-referrer/\"\u003e\u003cimg src=\"https://img.shields.io/badge/Gitpod-Ready--to--Code-blue?logo=gitpod\" alt=\"Gitpod Ready-to-Code\"\u003e\n  \u003c/a\u003e\n \u003c/p\u003e\n\n## Introduction\n\nVue Toasted is one of the best toast plugins available for VueJS. It's used by VueJS, Laravel, NuxtJS and trusted by many more organizations. It's responsive, touch compatible, easy to use, attractive and feature rich with icons, actions, and more!\n\n#### Interactive Demo\n\nCheckout the \u003ca target=\"_blank\" href=\"https://shakee93.github.io/vue-toasted/\"\u003e Interactive Demo \u003c/a\u003e here.\n\n\u003cp align=\"center\"\u003e\n    \u003cimg src=\"https://shakee93.github.io/vue-toasted/assets/images/vue-toasted-demo-x3.gif\"\u003e\n\u003c/p\u003e\n\n#### Menu\n\n- [Installation](#installation)\n    - [Npm](#install-using-npm)\n    - [Yarn](#install-using-yarn)\n    - [Direct Usage](#direct-usage-with-html)\n    - [Nuxt](#nuxt--officially-uses-vue-toasted-for-their-toast-module)\n- [Usage](#usage)\n    - [Basic Usage](#usage)\n    - [Actions](#actions--fire)\n    - [Icons](#icons-fire)\n    - [Standalone Usage](#browsers-support)\n- [Api](#api)\n    - [Options](#options)\n    - [Methods](#methods)\n    - [Toast Object](#toast-object)\n    - [Custom Toast Registration](#custom-toast-registration)\n    - [Vue Router](#vue-router)\n- [Browser Support](#browsers-support)\n- [Mobile Responsiveness](#mobile-responsiveness)\n- [Credits](#credits)\n\n\n## Installation\n\n#### Install using npm\n```bash\n# install it via npm\nnpm install vue-toasted --save\n```\n\n#### Install using yarn\n```bash\n# install it via yarn\nyarn add vue-toasted\n```\n\n#### Direct usage with html\n```html\n\u003c!-- Insert the vue core before vue-toasted --\u003e\n\u003cscript src=\"https://unpkg.com/vue-toasted\"\u003e\u003c/script\u003e\n\n\u003cscript\u003e\n    Vue.use(Toasted)\n\u003c/script\u003e\n```\n\n\u003chr\u003e\n\n#### [Nuxt](https://github.com/nuxt/nuxt.js) 💓 Officially uses `vue-toasted` for their toast module.\n\ninstallation guide 👉  [@nuxtjs/toast](https://github.com/nuxt-community/modules/tree/master/packages/toast)\n\n## Usage\n\nIt's simple. A couple of lines is all you need.\n\n```javascript\n// register the plugin on vue\nimport Toasted from 'vue-toasted';\n\n// or you can use it with require\nvar Toasted = require('vue-toasted').default\n\nVue.use(Toasted)\n\n// you can also pass options, check options reference below\nVue.use(Toasted, Options)\n\n;\n\n```\n\n```javascript\n// you can call like this in your component\nthis.$toasted.show('hello billo')\n\n// and also\nVue.toasted.show('hola billo');\n```\n\nAll Good Now you have this cool toast in your project..\n\n\n### Icons :fire:\n[Material Icons](http://google.github.io/material-design-icons/), [Fontawesome](http://fontawesome.io/cheatsheet/) and [Material Design Icons](https://materialdesignicons.com/) are supported. you will have to import the icon packs into your project. \u003ca href=\"/examples/using-icons.js\"\u003e example using icons \u003c/a\u003e\n\n```javascript\n{\n    // pass the icon name as string\n    icon : 'check'\n\n    // or you can pass an object\n    icon : {\n        name : 'watch',\n        after : true // this will append the icon to the end of content\n    }\n}\n```\n\n### Actions  :fire:\n\u003cp align=\"center\"\u003e\n    \u003ca href=\"https://github.com/shakee93/vue-toasted\" target=\"_blank\"\u003e\n    \u003cimg width=\"300\" src=\"https://shakee93.github.io/vue-toasted/assets/images/action-preview.jpg\"\u003e\n    \u003c/a\u003e\n\u003c/p\u003e\n\u003cp\u003eYou can have single or multiple actions in the toast. take a look at the example below\u003c/p\u003e\n\u003cp\u003eCheck below Vue Router section for router integration\u003c/p\u003e\n\n**Parameter**|**Type**|**Default**|**Description**\n-----|-----|-----|-----\ntext*|String|-| name of action\nhref|String|`null`| url of action\nicon|String|`null`| name of material for action\ntarget|String|`null`| target of url\nclass|String/Array|`null`| custom css class for the action\npush|Object |`null`|  Vue Router push parameters\nonClick|Function(e,toastObject) |`null`|  onClick Function of action\n\n##### Examples\n```javascript\n{\n    // you can pass a single action as below\n    action : {\n        text : 'Cancel',\n        onClick : (e, toastObject) =\u003e {\n            toastObject.goAway(0);\n        }\n    },\n\n    // you can pass a multiple actions as an array of actions\n    action : [\n        {\n            text : 'Cancel',\n            onClick : (e, toastObject) =\u003e {\n                toastObject.goAway(0);\n            }\n        },\n        {\n            text : 'Undo',\n            // router navigation\n            push : {\n            \tname : 'somewhere',\n            \t// this will prevent toast from closing\n            \tdontClose : true\n             }\n        }\n    ]\n}\n```\n\n\n## API\n\n### Options\n\nbelow are the options you can pass to create a toast\n\n**Option**|**Type**|**Default**|**Description**\n-----|-----|-----|-----\nposition|String|'top-right'|Position of the toast container \u003cbr\u003e **['top-right', 'top-center', 'top-left', 'bottom-right', 'bottom-center', 'bottom-left']**\nduration|Number|null|Display time of the toast in millisecond\nkeepOnHover|Boolean|false|When mouse is over a toast's element, the corresponding `duration` timer is paused until the cursor leaves the element\naction|Object, Array|null|Add single or multiple actions to toast  [explained here](#actions--fire)\nfullWidth|Boolean|false|Enable Full Width\nfitToScreen|Boolean|false|Fits to Screen on Full Width\nclassName|String, Array|null|Custom css class name of the toast\ncontainerClass|String, Array|null|Custom css classes for toast container\niconPack|String|'material'| Icon pack type to be used \u003cbr\u003e **['material', 'fontawesome', 'mdi', 'custom-class', 'callback']**\nIcon|String, Object|null|Material icon name as string.  [explained here](#icons-fire)\ntype|String|'default'| Type of the Toast  **['success', 'info', 'error']**\ntheme|String|'toasted-primary'|Theme of the toast you prefer\u003cbr\u003e **['toasted-primary', 'outline', 'bubble']**\nonComplete|Function|null|Trigger when toast is completed\ncloseOnSwipe|Boolean|true|Closes the toast when the user swipes it\nsingleton|Boolean|false| Only allows one toast at a time.\n\n### Methods\n\nMethods available on Toasted...\n\n```javascript\n// you can pass string or html to message\nVue.toasted.show( 'my message', { /* some option */ })\n```\n\n**Method**|**Parameters**|**Description**\n-----|-----|-----\nshow|message, options| show a toast with default style\nsuccess|message, options| show a toast with success style\ninfo|message, options| show a toast with info style\nerror|message, options | show a toast with error style\nregister | name, message, options | register your own toast with options [explained here](#custom-toast-registration)\nclear | - | clear all toasts\n\n### Toast Object\nEach Toast Returns a Toast Object where you can manipulate the toast.\n\n```javascript\n\n// html element of the toast\nel : HtmlElement\n\n// change text or html of the toast\ntext : Function(text)\n\n// fadeAway the toast. default delay will be 800ms\ngoAway : Function(delay = 800)\n\n```\n\nusing the toast object\n\n```javascript\nlet myToast = this.$toasted.show(\"Holla !!\");\nmyToast.text(\"Changing the text !!!\").goAway(1500);\n```\n\n\n### Vue Router\n\nAdding vue-router to vue-toasted where you can use it on toast actions.\n\n```javascript\n\n// your app router instance\nvar router = new VueRouter({\n\tmode: 'history',\n\troutes: [{\n\t\tpath: '/foo',\n\t\tname : 'foo-name'\n\t}],\n\tlinkActiveClass: \"active\"\n});\n\n// pass it to vue toasted as below..\nVue.use(Toasted, {\n\trouter\n});\n```\n\n### Custom Toast Registration\n\nYou can register your own toasts like below and it will be available all over the application.\n\n`Toasted.register` methods api details...\n\n**Parameter**|**Type**|**Default**|**Description**\n-----|-----|-----|-----\nname*|String|-| name of your toast\nmessage*|String/Function(payload) |-|  Toast Body Content\noptions|String/Object| {} | Toast Options as Object or either of these strings **['success', 'info', 'error']**\n\nTake a look at the below examples\n\n##### Simple Example\n```javascript\nimport Toasted from 'vue-toasted';\nVue.use(Toasted);\n\n// Lets Register a Global Error Notification Toast.\nVue.toasted.register('my_app_error', 'Oops.. Something Went Wrong..', {\n    type : 'error',\n    icon : 'error_outline'\n})\n```\n\nAfter Registering your toast you can easily access it in the vue component like below\n\n```javascript\n// this will show a toast with message 'Oops.. Something Went Wrong..'\n// all the custom toasts will be available under `toasted.global`\nthis.$toasted.global.my_app_error();\n```\n\n##### Advanced Example\n\nYou can also pass message as a function. which will give you more power.\nLets think you need to pass a custom message to the error notification we built above.\n\n```javascript\nthis.$toasted.global.my_app_error({\n    message : 'Not Authorized to Access'\n});\n```\nyou can register a toast with payload like below on the example.\n\n```javascript\nimport Toasted from 'vue-toasted';\nVue.use(Toasted);\n\n// options to the toast\nlet options = {\n    type : 'error',\n    icon : 'error_outline'\n};\n\n// register the toast with the custom message\nVue.toasted.register('my_app_error',\n    (payload) =\u003e {\n\n        // if there is no message passed show default message\n        if(! payload.message) {\n    \t    return \"Oops.. Something Went Wrong..\"\n        }\n\n        // if there is a message show it with the message\n        return \"Oops.. \" + payload.message;\n    },\n    options\n)\n```\n\n\n#### Browsers support\n\n| [\u003cimg src=\"https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/edge.png\" alt=\"IE / Edge\" width=\"16px\" height=\"16px\" /\u003e](http://godban.github.io/browsers-support-badges/)\u003c/br\u003eIE / Edge | [\u003cimg src=\"https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/firefox.png\" alt=\"Firefox\" width=\"16px\" height=\"16px\" /\u003e](http://godban.github.io/browsers-support-badges/)\u003c/br\u003eFirefox | [\u003cimg src=\"https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/chrome.png\" alt=\"Chrome\" width=\"16px\" height=\"16px\" /\u003e](http://godban.github.io/browsers-support-badges/)\u003c/br\u003eChrome | [\u003cimg src=\"https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/safari.png\" alt=\"Safari\" width=\"16px\" height=\"16px\" /\u003e](http://godban.github.io/browsers-support-badges/)\u003c/br\u003eSafari | [\u003cimg src=\"https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/opera.png\" alt=\"Opera\" width=\"16px\" height=\"16px\" /\u003e](http://godban.github.io/browsers-support-badges/)\u003c/br\u003eOpera | [\u003cimg src=\"https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/safari-ios.png\" alt=\"iOS Safari\" width=\"16px\" height=\"16px\" /\u003e](http://godban.github.io/browsers-support-badges/)\u003c/br\u003eiOS Safari | [\u003cimg src=\"https://raw.githubusercontent.com/godban/browsers-support-badges/master/src/images/chrome-android.png\" alt=\"Chrome for Android\" width=\"16px\" height=\"16px\" /\u003e](http://godban.github.io/browsers-support-badges/)\u003c/br\u003eChrome for Android |\n| --------- | --------- | --------- | --------- | --------- | --------- | --------- |\n| IE10, IE11, Edge| last 7 versions| last 7 versions| last 7 versions| last 7 versions| last 3 versions| last 3 versions\n\nPlease Report If You have Found any Issues.\n\n### Mobile Responsiveness\n\nOn Mobile Toasts will be on full width. according to the position the toast will either be on top or bottom.\n\n### Contribute using the one-click online setup.\n\nContribute to Vue Toasted using a fully featured online development environment that will automatically: clone the repo, install the dependencies and start the webserver.\n\n[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/from-referrer/)\n\n### Credits\n\n+ Inspired and developed from [materialize-css](https://github.com/Dogfalo/materialize) toast.\n+ Uses [hammerjs](http://hammerjs.github.io/) for touch events\n+ Uses lightweight and fast [animejs](http://animejs.com/) for animations.\n+ Whoever contributes to this project :wink:\n\nEnjoy Toasting !!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/shakee93.github.io%2Fvue-toasted%2F","html_url":"https://awesome.ecosyste.ms/projects/shakee93.github.io%2Fvue-toasted%2F","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/shakee93.github.io%2Fvue-toasted%2F/lists"}