{"_id":"vue-my-toasts","_rev":"26-d17167fe13b04090bfb8393553085d5e","name":"vue-my-toasts","dist-tags":{"latest":"2.0.1","alpha":"2.0.0-alpha.18"},"versions":{"1.0.0":{"name":"vue-my-toasts","version":"1.0.0","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":{"url":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","type":"MIT"},"scripts":{"serve":"vue-cli-service serve","build":"vue-cli-service build","lint":"vue-cli-service lint","demo":"vue-cli-service demo --watch","demo:build":"vue-cli-service demo --mode build","start":"vue-cli-service serve"},"main":"dist/vue-my-toasts.common.js","module":"dist/vue-my-toasts.esm.js","unpkg":"dist/vue-my-toasts.umd.min.js","dependencies":{"core-js":"^3.6.5"},"devDependencies":{"@vue/cli-plugin-babel":"~4.4.0","@vue/cli-plugin-eslint":"~4.4.0","@vue/cli-service":"~4.4.0","@vue/eslint-config-prettier":"^6.0.0","babel-eslint":"^10.1.0","eslint":"^6.7.2","eslint-plugin-prettier":"^3.1.3","eslint-plugin-vue":"^6.2.2","prettier":"^1.19.1","vue":"^2.6.11","vue-cli-plugin-p11n":"~0.4.0","vue-template-compiler":"^2.6.11"},"jsdelivr":"dist/vue-my-toasts.umd.min.js","sideeffects":false,"gitHead":"f89b2ab2c2c83d8e070155d2270b28068644463e","description":"

","_id":"vue-my-toasts@1.0.0","_nodeVersion":"14.2.0","_npmVersion":"6.14.5","dist":{"integrity":"sha512-zlpSMvxf8UGAR6tmyVmTJEEVWLONrHWTutDH9nYuTKs+R614xsztVN8Nudg75wBPYmcNqYeAoziF909vGtm5BQ==","shasum":"7e76b3ae87c60905580b134620919ddf33417b70","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-1.0.0.tgz","fileCount":18,"unpackedSize":825602,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe1VMrCRA9TVsSAnZWagAAg18QAIlaoADWOUZea1M42LzO\nzBs1cr29u7AWsiTs/WxC69gBkqMVk9wn6jPby93GSqxSghhzKKsH8e1+PJ2W\n7eIvHbcR0IILJMyiUSFzQStLaDsaxtwwBNnUHH+Z4gfemJe3mNLb/EX+kxAW\nb6/LTA/DmwuvTb3lGLlTFWa0Y/hCeCnCOfsXF41iR6k5pMwAqA4gkP0BkFGz\nLPZ6Lsh9WGcdUZZGmoZBDqhjiE1rIa3BkGANwr34xnOVkRvfa87lm1J6DjQl\nOJv5knBHWNWUjPMBliW/u6HouVMR4LLzAE2ELiXn3vbrL8mA9ihzehGteA1L\nn7/gbSeGHScHBHqOqnx3DlLJCk3UBR1njzG6MGEaZXHkA7NSVVExPa9X66e0\nPRx/4nFXafAHS/Z0DilMT68q3yJy6/nzmJuy2gkNbIMQGC+P5UyvpetA8xKh\nJMQa8+s9fwQUaenuqmzS0g/4DmV1sOt/QSKC4lAO7xnhAYbCE0m9KQfGaoJ3\nLwJqNTrXrcqdXmOh9+OYJziMg2VwxVo+OJQA/46XsX04jHR4DmVMMpQzmQwI\nkpztBbuELbgWIUcxSrQSKH1g3dhZKxuniUeR7tEsbRj7yBTRtpeOIzgOqc7R\nluhlSSWQpHcWGHuGuKMXBxVeOYT3BcwibyaxB0BMdkWq8QwlDBe+cG9aMvGu\nEz6i\r\n=1Z6e\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDtrhDXYTeqg7jXZqZ9yobqqRQl/5Hk/s0QL9uaEot/2QIhANV6khWB6fVtKDecCAdvcEGFkE9Rf51p37402AUBNLKO"}]},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_1.0.0_1591038763070_0.8646105497894936"},"_hasShrinkwrap":false},"1.0.1":{"name":"vue-my-toasts","version":"1.0.1","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":{"url":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","type":"MIT"},"scripts":{"serve":"vue-cli-service serve","build":"vue-cli-service build","lint":"vue-cli-service lint","demo":"vue-cli-service demo --watch","demo:build":"vue-cli-service demo --mode build","start":"vue-cli-service serve"},"main":"dist/vue-my-toasts.common.js","module":"dist/vue-my-toasts.esm.js","unpkg":"dist/vue-my-toasts.umd.min.js","dependencies":{"core-js":"^3.6.5"},"devDependencies":{"@vue/cli-plugin-babel":"~4.4.0","@vue/cli-plugin-eslint":"~4.4.0","@vue/cli-service":"~4.4.0","@vue/eslint-config-prettier":"^6.0.0","babel-eslint":"^10.1.0","eslint":"^6.7.2","eslint-plugin-prettier":"^3.1.3","eslint-plugin-vue":"^6.2.2","prettier":"^1.19.1","vue":"^2.6.11","vue-cli-plugin-p11n":"~0.4.0","vue-template-compiler":"^2.6.11"},"jsdelivr":"dist/vue-my-toasts.umd.min.js","sideeffects":false,"gitHead":"ed062a112ca244862bc10ff8c7e1f0a0fa9b5396","description":"

","_id":"vue-my-toasts@1.0.1","_nodeVersion":"14.2.0","_npmVersion":"6.14.5","dist":{"integrity":"sha512-CyghY04F3PLwwfA+r16CMM4obzySAu+q2nwCLB7vnBh5Bq6a34Vf+olgdWKGDAaGg/KleDzLIxgONYEJO9xBVw==","shasum":"d55a6167e23cec059719261832e6ed8407af8cfb","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-1.0.1.tgz","fileCount":18,"unpackedSize":827278,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe1WCvCRA9TVsSAnZWagAAXZYP/2UpS+xgAiaiAtwop/nF\n18fLxNYfEprfx6fYKwRYqr+2ihY07BwfLgh/8ZAP8zWwt67+MPozIvN6D7j8\nQI26Px5wP+xd36dpSPP8pZQXm7MVMEcYRTPrIYBHo56vsoQ4zx53zQrGI0Ee\nw6PAq7LPAEjIYhAZrdyWeIvaxT/6J72V4QuYAosFh003dvw2Esp7ml+uxsxt\nWFZQua7nAL5oeCGG+fDbQUvOZerzYXenBJ3SORQ68OYLZYn6FZzNkHuknw4G\n97uJq/KyLCTF+Eggi/fR4xcvkyu+dqGrsZuKkjWVRWeW1Z3UEZvuVEtor42L\nWb+Id7GDLw1/nRh0kT6nHEQXWSQ8wHIafw+s57sx4l/NF/2YVtiVLEHT6MvA\n264FTkY+P33waVq1M6FtruQIM0wfRIR19tydnznv7HB0SFm26umH5t6rJlt0\nn5J3VKgOHS9Czldfd1l7NW7DRyqBZtvkSHQeaxE5q5co/RpjCXQCG0d13KfT\nJOM0vaS2Eo9iUHhSQVJlfm+f7zMN8pWGlNeubW+LMImZHepfZ69m2z8EHEQT\nQr0unU2XbgkmKecPSFitRnUGm8KaCW2hz7L8E8JekWpvVyXnkMsH74gpXzc5\n7DKZ4NO/XfugZYqwUISHJ/BBo+TAyvynCkH1OThzWo+bhC4YuQ0B0+bmVt6M\nGC3A\r\n=3lf8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIEPk2PeCfUE8VaQOtdhuN+a/4aZvgD5G1EMGHJzLT0HRAiEAkUb1XyUNniaWiXvdCuayP+1g3QX+LgsZD39mbPrKqPU="}]},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_1.0.1_1591042223129_0.9475615600226877"},"_hasShrinkwrap":false},"1.0.2":{"name":"vue-my-toasts","version":"1.0.2","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":{"url":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","type":"MIT"},"scripts":{"serve":"vue-cli-service serve","build":"vue-cli-service build","lint":"vue-cli-service lint","demo":"vue-cli-service demo --watch","demo:build":"vue-cli-service demo --mode build","start":"vue-cli-service serve"},"main":"dist/vue-my-toasts.common.js","module":"dist/vue-my-toasts.esm.js","unpkg":"dist/vue-my-toasts.umd.min.js","dependencies":{"core-js":"^3.6.5"},"devDependencies":{"@vue/cli-plugin-babel":"~4.4.0","@vue/cli-plugin-eslint":"~4.4.0","@vue/cli-service":"~4.4.0","@vue/eslint-config-prettier":"^6.0.0","babel-eslint":"^10.1.0","eslint":"^6.7.2","eslint-plugin-prettier":"^3.1.3","eslint-plugin-vue":"^6.2.2","prettier":"^1.19.1","vue":"^2.6.11","vue-cli-plugin-p11n":"~0.4.0","vue-template-compiler":"^2.6.11"},"jsdelivr":"dist/vue-my-toasts.umd.min.js","sideeffects":false,"gitHead":"279467f5d88fe1c99c8185e736971d41c7e533b7","description":"

","_id":"vue-my-toasts@1.0.2","_nodeVersion":"14.2.0","_npmVersion":"6.14.5","dist":{"integrity":"sha512-2f8sMBjwdfyAnAfRzSU5yXi/Ks9cOLPCe5PPRJkKthIt/tQRzD+JmFiZg8ZKHtYwA9gUmpGWyMNVJbqCDMXoAw==","shasum":"f279a004755506951fc7033e3dee0c034ee1891a","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-1.0.2.tgz","fileCount":18,"unpackedSize":827519,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe1vYnCRA9TVsSAnZWagAAUygP/jOZomkRVB/6T92yvDhz\nbG9GpbdxCRNPCQkEdA8rsVRKnN+WZsgqjlDqqwF6Ms12eM9ahSx/kFiYP1lE\n/wAXF9jbBXE+BdQX6w0HaWKiQnx+ugXTh/M/+Ho6cPb6xc9xN4XJSOIFuBJv\nyTXZ2us+3GTec+G4XZlOZBh5WXRLN6DyNM9w7hmT4tOut+HororX3n8JiEiK\nZ7gNS4cIbgd/bhJR7o/Qm0y2yuSsbcj6YRSpF/VOgRkWBNhrbdrkCJb6tDMM\n/zArOyzYRcQhtU0zGD8jbkWpaplwPlMPImco03sVPtGgA11DzJrdjv8RTPi6\n5hTZaZdxixx7KbmCQoe+JrVIRVGSDAT2VmRqIgMiGH5shv9CJqkQh14Q5RkU\nCGgRol7AcUoPGq563tbMkYOMZoESuP+THDLSXEHp7RGVdvPkemApDuTNSI14\nRp3ay8y2Jlyaikohy1zIYc0zI+YkvHFL9gsVbNZP2G+LGjXwQ39PBWMMvb0M\n6iIAG5mLXpIYt3tBdPVRs1syxKfCgg05tUr4WW68qlMI7uJYYRNjQQfEKcwr\nQWf0YA2JLrZoW3WVToWSW9ILqxqhcvO6DW+e2mmoHl31pK1YwGaVorgk9CBA\niATT7UYUOE3OD/vfwFb0jV7x/56i/4z1uawApuK1OamkrZTA0niT0UFb1RxY\nyjCP\r\n=gT3V\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCKB7D+as5GKI+HSm1/YtIsxzpFMyfA3ZPu6yxj7h4WXwIhANz68bEyovEe18qxBxY4AvfNWbqpQ0v0xPGiKmrxHWXM"}]},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_1.0.2_1591146022527_0.863691429816946"},"_hasShrinkwrap":false},"1.0.3":{"name":"vue-my-toasts","version":"1.0.3","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"MIT","scripts":{"serve":"vue-cli-service serve","build":"vue-cli-service build","lint":"vue-cli-service lint","demo":"vue-cli-service demo --watch","demo:build":"vue-cli-service demo --mode build","start":"vue-cli-service serve"},"main":"dist/vue-my-toasts.common.js","module":"dist/vue-my-toasts.esm.js","unpkg":"dist/vue-my-toasts.umd.min.js","dependencies":{"core-js":"^3.6.5"},"devDependencies":{"@vue/cli-plugin-babel":"~4.4.0","@vue/cli-plugin-eslint":"~4.4.0","@vue/cli-service":"~4.4.0","@vue/eslint-config-prettier":"^6.0.0","babel-eslint":"^10.1.0","eslint":"^6.7.2","eslint-plugin-prettier":"^3.1.3","eslint-plugin-vue":"^6.2.2","prettier":"^1.19.1","vue":"^2.6.11","vue-cli-plugin-p11n":"~0.4.0","vue-template-compiler":"^2.6.11"},"jsdelivr":"dist/vue-my-toasts.umd.min.js","sideeffects":false,"description":"A Vue toast plugin that finally lets you create your own toast component.","licenseText":"MIT License\n\nCopyright (c) 2019 Yaël GUILLOUX \n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.","_id":"vue-my-toasts@1.0.3","dist":{"shasum":"ca92ec4f3f2f8834da85eb44635c3bf09fc60823","integrity":"sha512-2//FcIQ/GdQrgkW+fqPv8/RL6t4qsdTwTQlsXaCV/5Jflt4NhjqRmf9rrZvnwAPwKWYf/GSrIHmHyYgz/tGIFA==","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-1.0.3.tgz","fileCount":25,"unpackedSize":827683,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe/jHoCRA9TVsSAnZWagAAPj0QAJBX9VtbkXEDxACFiLIT\nFqwIKQyTdnp6n574AZfYPqhm4FpQ0gSZapcvc+Ni8V6+GuVr/1UONs0rOUrn\naLaI4wq5WxS59MyGmZdxkE5yMnn8vL8g8G7hB1C5YPn2Fl6wc2LtvOPbvlLv\nnjmGB1m4ERts5XVSl2jVpPGFq9bd/kmLTukJJlU6woikh26skkPv2nwRPxf0\ntHqp3q1roZuApPnqLImqHk5A73un0QjHbUYf58AmrcCK2TPUmLU8tJx0qnoZ\nn/+qMKOFACiB9EQxl+uB80S49h6eBUxVZekFzJfO4K27s9V7mYfuGIYufukL\nf0lYOg8E19nr5NctL17a+4DuaKlPp3vaFCzkzBOUeUe+kyDCX8tZkxWXq5OL\nSHwXaZ/Kf93Ih1b4U+73pnF60TUCPce3uVE1O1Ww5SOY+L5PYI7zpk1PcfMS\nFlLldXxqId84YXJxWdxAJ4+/09L8fxiKwBKa+yfxTm6r3PIwxbLYoTbXhA1H\nNKS33cL3VxJTG7AE96YA+ID2dRaXqHm3HllZEmDdJk9JbiWzzjjZ0NlySFfI\ntIwMHIeeCJMx2o8KLWbRvtJkALws8ylPnyfG0p7l83vQXP/ihC+1ZeK4szg3\nHaKAOGvDiov24DqW4yP+kRqGBN83ClRZIBjq0fsLTx+nL4k/xzaMCiOtgW3u\nF34k\r\n=3ORz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDP4DhfmFpC2XgAIn4ul8bySFS5GirUmWwgyswbI1hAFwIgC9kVAASLe1/GHSdSSPx14k3arrdV4HQYV8qxJQsDcpQ="}]},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_1.0.3_1593717223852_0.16817607711223936"},"_hasShrinkwrap":false},"1.0.4":{"name":"vue-my-toasts","version":"1.0.4","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":{"url":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","type":"MIT"},"scripts":{"serve":"vue-cli-service serve","build":"vue-cli-service build","lint":"vue-cli-service lint","demo":"vue-cli-service demo --watch","demo:build":"vue-cli-service demo --mode build","start":"vue-cli-service serve"},"main":"dist/vue-my-toasts.common.js","module":"dist/vue-my-toasts.esm.js","unpkg":"dist/vue-my-toasts.umd.min.js","dependencies":{"core-js":"^3.6.5"},"devDependencies":{"@vue/cli-plugin-babel":"~4.4.0","@vue/cli-plugin-eslint":"~4.4.0","@vue/cli-service":"~4.4.0","@vue/eslint-config-prettier":"^6.0.0","babel-eslint":"^10.1.0","eslint":"^6.7.2","eslint-plugin-prettier":"^3.1.3","eslint-plugin-vue":"^6.2.2","prettier":"^1.19.1","vue":"^2.6.11","vue-cli-plugin-p11n":"~0.4.0","vue-template-compiler":"^2.6.11"},"jsdelivr":"dist/vue-my-toasts.umd.min.js","sideeffects":false,"gitHead":"5c3c195bb49e3bb5662098eb177f8b01edbde6d4","description":"

","_id":"vue-my-toasts@1.0.4","_nodeVersion":"14.2.0","_npmVersion":"6.14.5","dist":{"integrity":"sha512-njfLnPTT4tqTzKKH0ozQhvkv4qkFz12Y9xUoHjr9rE+BDVFh3dV8FStDH5kiQTn5K5DLKXPDh32RQdwSIclVtQ==","shasum":"8b39f06c02b4ed659f769d7e3f664f83ec33ab55","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-1.0.4.tgz","fileCount":18,"unpackedSize":827683,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe/jIpCRA9TVsSAnZWagAAlswP/3ltJQG99XX7p1EU2JaK\nXlCN1n8evNk50/h2YeMfY2NHBoQIukhdXeLmVc6I3gUYkCKSR69XPYW09Myn\nXxHagoHs6bY1I53kY2HNFxZIPdvSbOnqqd8EUzRFm+pTz/UpjbRDr6Wt4m/B\nQpXoFiF4aEbXM8/tUSlR7a6SLOn+cG6LYsBKxRjDEqgZHZWaP6IkTm5RZSAn\nQjdyUrf2HoBIaCfx1S6LFzs7fUxKWPYlBr5xR/bM02t+D1k5Ai/raAW+zkSK\n0awbzr1czx3hadNTSkc3xxBbXvD0x/R64XhIPxPiW094vUeQ6Kz6BRxq3/yz\ncs+yhsFsg1lqLeuCcJsbgSDH2t2Gih3hifOEUSHKq+WLbJgIaPXpxjzw/nDa\nNSP/GIxzs9t66ZzhRvNCKZG2pgr7JG68EGy7Xgvkbm7K5LR/uHBf6aYatsZN\n1fpIexKnL2W6Eo5nMJUldYLEMkiG11ujpf/hTRgEtGO7Y41qrMR4GoiR3Wxu\nzdd9QAq0Xwt2F62SqCDGLN5t/MKRTOTTsOPpsGWj31NbqOVddDCg9hEDUYS0\nNJzces3LM+xuXrcR3YP5GYq0ZqcCm+I4g58Cx8pkbbDmihrxb2PLnfgltTSx\n/3//lkRtNgFJYRNRtbB4oLzGRiWAm0hSBcDGDc9hWCV/cM3s4XGLUiZSUWwk\nJ1G8\r\n=Pfik\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD/aRRM4njh3uIzChfangTm0R4foZRISBft+Nyka/ylRQIhAJOUKRBULR8gq1dbtW/67TGKp0uPMdMWc5QxyB+PzBS0"}]},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_1.0.4_1593717289034_0.3446815389641671"},"_hasShrinkwrap":false},"1.0.5":{"name":"vue-my-toasts","version":"1.0.5","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":{"url":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","type":"MIT"},"scripts":{"serve":"vue-cli-service serve","lint":"vue-cli-service lint","build":"node build/build.js","demo":"vue-cli-service demo --watch","demo:build":"vue-cli-service demo --mode build","start":"vue-cli-service serve"},"main":"dist/vue-my-toasts.common.js","module":"dist/vue-my-toasts.esm.js","unpkg":"dist/vue-my-toasts.umd.min.js","peerDependencies":{"vue":"^2.6.12"},"devDependencies":{"@babel/preset-env":"^7.12.10","@rollup/plugin-babel":"^5.2.2","@rollup/plugin-commonjs":"^17.0.0","@rollup/plugin-node-resolve":"^11.0.0","@vue/cli-plugin-babel":"~4.5.9","@vue/cli-plugin-eslint":"~4.5.9","@vue/cli-service":"~4.5.9","@vue/compiler-sfc":"^3.0.4","@vue/eslint-config-prettier":"^6.0.0","babel-eslint":"^10.1.0","eslint":"^7.15.0","eslint-plugin-prettier":"^3.3.0","eslint-plugin-vue":"^7.2.0","prettier":"^2.2.1","rollup":"^2.34.2","rollup-plugin-buble":"^0.19.8","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-css-only":"^3.0.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-terser":"^7.0.2","rollup-plugin-vue":"^6.0.0","rollup-plugin-vue2":"^0.8.1","vue":"^2.6.12","vue-cli-plugin-p11n":"~0.4.0","vue-template-compiler":"^2.6.12"},"jsdelivr":"dist/vue-my-toasts.umd.min.js","sideeffects":false,"gitHead":"085d175c9790bd003c2af8bf357f3ae3d188a916","description":"

","_id":"vue-my-toasts@1.0.5","_nodeVersion":"15.0.1","_npmVersion":"7.0.3","dist":{"integrity":"sha512-t2Yfo6PUl7/nE1Ov8TxfMwd68rHgtjOF3i7rek5Cm6dOUFdrargZVsZt1PEAV2enWl5BgSGyJHqV4Ctqgf0QZw==","shasum":"55870dfc6279a5191cec30a920338c9ec2161ace","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-1.0.5.tgz","fileCount":17,"unpackedSize":40087,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf1tQVCRA9TVsSAnZWagAAQJsP/A8pxRYItC+/dfpCUPXN\nNjWHltjj1UXKbITrC2XImBC+5zQpac7ZzWmSA/j2+gG5nDg5tBPRZRkFQTZH\nobwWkeBngmZoWklk/fy1Y4mKtL0qTKNwbohXf5Bs2Zq4tvch3qZfjBnzsXYa\ncuvtvcxbOI0jwwIYzIMHB7OHeKNQFuz2VVWp/P2MhWNqEhedwmjHFN6egKzk\nuUCjseGGQcW3/v23mXaMgYImQkoprIGbjc7CwF9+Ftyoq9iLIwfl4lEOz9Zs\nQD4XCAfY5T9kRnRVzey2Xn+PygiviNespoSRptmY6x+pjUZgwEw/xwgoF3n5\nIEHFROJ/Afha6yBIeNqwoA34uKpqLasm2rh5ViC+HpDvEmYCz7wTlrQLDvCA\nQLnHciD+VRP4r60M1KA/bZMwskuY9CtB21QYsnwXhBqPh68L9weyBVUeSeeO\nWzdfXInZ/zd03sXkbMYkw9IMycdM4wINnEVGwGjsJ2++j3at2Bmq/9fdkPRg\nJCDRnA7u1X/DXAoRCTTeXuFtDKtJsTaW2cYw7tXySCGm0Y4jRx86PYV3jSkl\nVPQruVEoNlMUtlbHHBk+MgyVAnwiF5cT3JUBwlH38mjtYcp1WlU5p/4hgom/\nsYcIpuq0Az+ouYyzPbSVLG/svvctd/3NNLKkMWZVekGLz5LsJ4wXOjEcVXcA\nqCEs\r\n=Zzj9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD1RQULzUjvJxisAoonnqwuhXJQ0RG2Htuw0FE5iR8KgQIgGnIuq29NgVuqGcr8ioCaKvMQYVr4riNXD9BwyaW7hBE="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_1.0.5_1607914517085_0.6326400862294068"},"_hasShrinkwrap":false},"1.1.0":{"name":"vue-my-toasts","version":"1.1.0","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"dev":"vue-cli-service serve","lint":"vue-cli-service lint","build":"node build/build.js","demo":"vue-cli-service demo --watch","demo:build":"vue-cli-service demo --mode build","start":"vue-cli-service serve"},"main":"dist/vue-my-toasts.common.js","module":"dist/vue-my-toasts.esm.js","unpkg":"dist/vue-my-toasts.umd.min.js","peerDependencies":{"vue":"^2.6.12"},"devDependencies":{"@babel/preset-env":"^7.12.10","@rollup/plugin-babel":"^5.2.2","@rollup/plugin-commonjs":"^17.0.0","@rollup/plugin-node-resolve":"^11.0.0","@vue/cli-plugin-babel":"~4.5.9","@vue/cli-plugin-eslint":"~4.5.9","@vue/cli-service":"~4.5.9","@vue/compiler-sfc":"^3.0.4","@vue/eslint-config-prettier":"^6.0.0","babel-eslint":"^10.1.0","eslint":"^7.15.0","eslint-plugin-prettier":"^3.3.0","eslint-plugin-vue":"^7.2.0","prettier":"^2.2.1","rollup":"^2.34.2","rollup-plugin-buble":"^0.19.8","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-css-only":"^3.0.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-terser":"^7.0.2","rollup-plugin-vue":"^6.0.0","rollup-plugin-vue2":"^0.8.1","vue":"^2.6.12","vue-cli-plugin-p11n":"~0.4.0","vue-template-compiler":"^2.6.12"},"jsdelivr":"dist/vue-my-toasts.umd.min.js","sideeffects":false,"gitHead":"dcee9bfd410b10f1980326ca46593c7c65ae910b","description":"

","_id":"vue-my-toasts@1.1.0","_nodeVersion":"15.8.0","_npmVersion":"7.5.6","dist":{"integrity":"sha512-Bv9ptXx3EIcPPxayyqkJRcGnz2YO6mvfwPJzRpUK2vgL31TfR94fHuEEEjI+qy2JO/8naM7ZtBuAoygajbfacA==","shasum":"52dc65fa7d58baa313ee15322760cc3831a5de5b","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-1.1.0.tgz","fileCount":17,"unpackedSize":40344,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgP2EmCRA9TVsSAnZWagAAs2EP/Rjj5buOnNhFYXCrEjzs\nS6D4FHRLMAPPGiuaHoI71wHZIJeNsEV5HKlxk1qaC9qqZ2T7qJCHBYcqfDkD\nCAD4Y+x3hJhmFolCQIp94+wYucKqAvA9VkodCmCQ0Ucbacp/9bL6ZVQrG1xa\nDvwiRAcF/Wao1v9J8H0e09yAdbCCXv8FnJaIn+QWCUXSMykOLQ4KVtOh48/H\nWClbLltFugJVQQUZMHJwJYSuqF/7OQVfv3IhieMn68n5hHieKKdzrhbNsrhr\nbOCyy4x2ck8il/uXMAVlb3/FxBQH4I+Rf6tcZ6yO29tGngv6yqI4AlD6N66R\nCBZQdh4/i6ZSaQcQ+j18v4BEUs8hSDH+JNN/52Bc+zxtjvMBS8lN1LoD+Ifu\nodoObabtkemoPsaiWvGkyVY2dWQVtUlOHlJLglf9QYcuEScd2xpd7uwpbbEK\nM6NEBLh8cTP8yXCiyAIU/pDQp3BlT47/t39z/8VsLbZkOeLpH7QCyEgXDFUG\n4Mz2cM0wLwtS0iwpBRqoiIigYKIXE1Rj9bVAeRqXy1SqXGt8vkPvhQFjpa8d\nqWDF6f8woYJJPFbHQc/D162/QLUK97PFFSWwCaSbUD2hk82DGL3WbQjuefgZ\nsRWmVOJAm6bCnuKk/H4O4u/6LDLvcmB4o3EO3xQHh5dxbPS17ngGjJAs18ql\nYlbn\r\n=EtfY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE3nhtT8V51CA2GGKemL6JrQ+kzpqI+UuJGJQwp8wpkTAiBruBTjv6viWZqXYMgizhYlsgcQXXDj5Y1AzbXLrJLliA=="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_1.1.0_1614766373780_0.21709906971479942"},"_hasShrinkwrap":false},"1.1.1":{"name":"vue-my-toasts","version":"1.1.1","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"dev":"vue-cli-service serve","lint":"vue-cli-service lint","build":"node build/build.js","demo":"vue-cli-service demo --watch","demo:build":"vue-cli-service demo --mode build","start":"vue-cli-service serve"},"main":"dist/vue-my-toasts.common.js","module":"dist/vue-my-toasts.esm.js","unpkg":"dist/vue-my-toasts.umd.min.js","peerDependencies":{"vue":"^2.6.12"},"devDependencies":{"@babel/preset-env":"^7.12.10","@rollup/plugin-babel":"^5.2.2","@rollup/plugin-commonjs":"^17.0.0","@rollup/plugin-node-resolve":"^11.0.0","@vue/cli-plugin-babel":"~4.5.9","@vue/cli-plugin-eslint":"~4.5.9","@vue/cli-service":"~4.5.9","@vue/compiler-sfc":"^3.0.4","@vue/eslint-config-prettier":"^6.0.0","babel-eslint":"^10.1.0","eslint":"^7.15.0","eslint-plugin-prettier":"^3.3.0","eslint-plugin-vue":"^7.2.0","prettier":"^2.2.1","rollup":"^2.34.2","rollup-plugin-buble":"^0.19.8","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-css-only":"^3.0.0","rollup-plugin-node-resolve":"^5.2.0","rollup-plugin-peer-deps-external":"^2.2.4","rollup-plugin-terser":"^7.0.2","rollup-plugin-vue":"^6.0.0","rollup-plugin-vue2":"^0.8.1","vue":"^2.6.12","vue-cli-plugin-p11n":"~0.4.0","vue-template-compiler":"^2.6.12"},"jsdelivr":"dist/vue-my-toasts.umd.min.js","sideeffects":false,"gitHead":"d6ddc6359865bb1c9f1ef5455501f12b8dd3cf06","description":"

","_id":"vue-my-toasts@1.1.1","_nodeVersion":"15.11.0","_npmVersion":"7.6.0","dist":{"integrity":"sha512-zIbdoJwTNycJqiNPc+O+XDgFg5hd3mTNe+WXjwrHtthLKyOzsLnN96DQLeNIB/mKV45yvwfRSS1PpYXk0qcT0A==","shasum":"05a029bc8726c8bb81b07a021dbbfe5124c1b8e6","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-1.1.1.tgz","fileCount":17,"unpackedSize":40380,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgS/+vCRA9TVsSAnZWagAAci0P/R+oefZQkHHusOxUQ6mf\nWbJAh6UutbwwGqeKrfTQtzDvLwX/g9FBGGErrBcvJ5EIIZWaaE1FNtAYdm9G\nefdxqjQ5c1BN3fPIh3BB0SiK+SvLiQR1TnGtzpwqS6/yMFzVSyncIIjX97jI\n85T4InfgOODk59DcOeXbmqvRP+emwrHXS6mer3g/qAL3y2BA0WS4mwmaVn2v\nYEqHe5WoOo7CGY/HIz1Fv7XZnLDskP2yXZjV8O5XeRvtEIRTuUDevyqqFOKh\nu4hzfu792zuckqc6l+KJ3flv0vElNhWNysPDLD0nKnVAM/JaadIzGgDmuKX1\nFEkiN5ns/Mfy4yNuiMfS1kh3QxsKM9s72B1MV0zVdjIn8jMXfJhxe4Znl/Qa\n0hIa7b8n3wFTk0qgoLowCcsQTwXZQS1z5Hz6kRxIqcwJgHf8l3Hp6a9Nrish\nTxj+dnZ8dz+PGHsgB1d8inTkgw6WumV1jZSc6Ov8Q1xFAMJBBbdvVIPa4tQ+\nB504Akig8D7nHTwGnlu73kwyu0ESa2hpU4gwxW/FRzxlmEKY1yvcjklKfs0y\nKI4zaYA2i2rVOOW9l/JF6+6KIgWkkZotvaW2cmoAbFPkSEw8vjgRSHZgUCAI\ntBFQfm5KoYKrGyoEwwhJjM9iK6eEydB7NxG7rsaLzxyaGVM6sVO/vqe321i+\nqL6a\r\n=Q/Hy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCZSICVlSy+Yt7kHXVr1gnnPCVJZiSxp8kwrdH+DA4hVAIhAICGqG6pXe5IwQAFYMSxCbdAChYgo99Lu/ijrKcQSExg"}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_1.1.1_1615593391375_0.5361737923338592"},"_hasShrinkwrap":false},"2.0.0-alpha.1":{"name":"vue-my-toasts","version":"2.0.0-alpha.1","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.1","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-HiUQqectc/3RKe79CJzareZXLg70glbBgD0tCaHLlqHsjyQTfuDGsXeCGXbhVJTdsejvNrXzWPnkuRBkvdOBGg==","shasum":"e1eb4a56b2ab52f247ee20f38492548195f3effd","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.1.tgz","fileCount":30,"unpackedSize":162756,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdIy7CRA9TVsSAnZWagAAHOIP/AsrFCGwNV6cv/wBWnAo\n3wtE24a+lDoCvrWX0543Htzf5hqcR/YF7u1OOBVZ2cJAYp4cjvQw+H9fRPIT\nlMEEG8hqFO/2MlsJtb7URI+hgiE9OFTcS0rLD/tYFm0Awzfq0e9i4RMmcTSo\nht0971qxcZhiQhPYJBTQEBL/bZNz7skI1CyWPo35PfB9MQOdqQkp7DOeP95L\naQ/ksmeo0M92kcSqs8L6mP79SJPZAt5ZrN1+8f2A+vW6ThrjG93U2Ss+LFbK\nyzBmLSgkTKYzLM8INus1n3cxJlbieSr8PEfNB3RE+0ANhyd5bbQW2O59St4E\ndMDt5VXllpume0OyUBfFudrMrmnWTp9XBZXDt9dWX4k1aAT7GVzT1jPWACbQ\n1piFyE4sGXmsieeCY8spHE8uUO/TH5bV1U5iuTGAp3DCkIt25fpIVQuYBVjP\niCJmeH6ERk5QsVVPBsei5HSwjtknnJVMeFNAdP2YiQZns2A65u8b9p9hnDQ0\nbV/w2eqJTmqswUdMtoL9yzQ2fxqn0ntSoAeH6iQ93N1rZX+52K5nUFpFUsnw\n+tQeIMYGtcf17pseSG8I0BK1r57KhMUIY5HFAJn9HMiPgHFGTUCaJ41iHQXH\nOONdgjsI+/y4QrJ9/zZeZs3wuEt8C9ksbj62QCWyTX6205sZn2XgtZCH/s2M\n0f2t\r\n=aT/a\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIE5ybMQAK011EajNeHZ0EW7rIZdRTx5mSZXZB2d2t+bZAiEAr6YhtEBynaY9udXCpZv9pNy3pDYzolcQV9nAvK8O/74="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.1_1618250939134_0.9784879012846162"},"_hasShrinkwrap":false},"2.0.0-alpha.2":{"name":"vue-my-toasts","version":"2.0.0-alpha.2","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.2","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-XHWkEOD/4oUTQFwLuixfL8/QNFGoRvHiykhfk0QRW3P075vFOLxMvoFtQegd62QnjiyPD60shGHk2vLawJGV9A==","shasum":"f19a3475d2632c1c3dfe7c4b8dad4c5ebe5f1389","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.2.tgz","fileCount":30,"unpackedSize":162724,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdI20CRA9TVsSAnZWagAAOTAP/jqDk5nT/K0SMyYi4MjB\nlPp21mvyvpe0Roi1RFY4uECrkH+XeKdZyi8mKf5Y24lVKsVAL9GdRkpW9jqs\nj1WznHWudTj6ixF9o6+orFfdD0LmVBqDIDwHQjLWZ7jBcNZWMZmSBHoAlW2M\n7Nl9mga+qeW9BARZR4D3D+53G0HdZMelT07fRlUJrtRPFc7QXsE2VFOkGMni\neXn7SsKLR16PqaAnr3LAEmnfZtu3bx3lgGF46HyaQ+4rl9uwTvUOvIiSlefJ\n4PEJEMCiPJrAdfov0beVOpliMthQfELuwsA1uYN1P+8mNz4L4ECd6TtHfyUB\n5ADJb5HzZ3SsEHJwCuqAU9mI9ePhO4JAQB+WlDxxE/kjc9gQaRbmHVmQ1Q3C\nqlCecTfWFRhfAV2nMokXTSbyHuTiITFZo7JGXiZAC/basRRuy5z3oD73Ko9h\ncrGLV3+QZ5zoP9q1rLDEScC+mWbWrxZcnYJYgYBZ3oBKpInRoAS9HJPo5xOb\nvYPMfUBwcYZmNn6kPC6UDbD0P3/ei91QlAXgUvpxU7h6fjNNqo3TTOAOVCe9\nB7kjoi+p39B/C/kvDwBy7/wzvHIiGg4Be4l3FExO2FCfcYe1ZNUTe3ZEeCS4\nWJdYbOPFR4FKUHPBjizZtpfkmSIXIa9k+YBHfkpfu/fH7hoyoV+5+EBJ1g6b\nLj3h\r\n=YoZk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDOPKlvc1EmL2/1DhLFMzcWlrLva2lJKgMenhJBE4J+wQIgPXq5zJT93uLNuLNtx5DGKftYb5UdXIpIjGWPXU+LLeM="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.2_1618251188071_0.6163535477378177"},"_hasShrinkwrap":false},"2.0.0-alpha.3":{"name":"vue-my-toasts","version":"2.0.0-alpha.3","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.3","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-BraCaNy4gb89RgqOWLeXpXOEdxKQUXWZpOblqPYUy27iNno+pjE8BpTxJKm6yiNxixcLY7Z0W/OCodDVf5Uwfg==","shasum":"a7ebec0ee3a5f8130ecebfb55d84e8255fa5351d","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.3.tgz","fileCount":39,"unpackedSize":202806,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdI4bCRA9TVsSAnZWagAAXQgQAIlUaK9a5qictII2/CP2\nMT0rPFqDZrJEkNPPM9BUjRKdkU1G2xJvGapq9VHDfcWO9xgUWMgXfPdFCIU4\n3J4h77KIBMMBGacWRjnFVqM/zebhJ4WiN7hFKUmUbGylaFy6TqwlDbqDYl+o\nymix8m7sqmAu5SRcr6ptPqWAHsttCnI5JHls5YnMGmaZpcki6Eb3oN2a6gKd\nXZy+KS4yLfpDJZwaG0kXxg1VxDOs3hnyvGVUMb6e47yWd+LhZcVzfvMc27Vb\nNlwqBy3ixgTDymI8Dxk/8y6pEt1j7zencG5sf6153muJecSUiNDqYQVEF6wE\n139JvZ/NkBbPZg+8MQou6076HSrInP3+Y2EMtCbMEA++31y0HRSFNFeEMsR6\nPdLPpFsnO6VmVoQk6oSJEXyKWBplqmncehIIL8OG4f9MgOMzI2xD4uWdiNo8\nY1Aiej9mumeOyN4SObdQHB1u+Scyy0s8aKqlDn2Hbau2ZVYNhPgcQiZbxIKw\nHZWr+uOQ31DY5t2MapzopuBdNDZCtSEAcN/LnsJWdo4lTTf5hT5sCD+unGGr\nIfXCn+Q1dC7D4dmFvQVniDtcZfM/3st4kzm7oEPWHzAwvMzBeEn/cvXL7qyJ\nf+/S8p1WG2NMFUWBuGLiG80Hn4pyrjPH0kNUh1Mp3kKEBX31infP13XNxT9M\n8uo7\r\n=f0Ln\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC0xoL8/wehxa6Sw1DSBedkCtKqPW635XnrD1mx60+njgIgCEjpY2yoCHDubSBX68zOGBea2A2pTyU25pcVpiZDREQ="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.3_1618251290776_0.38973239015848415"},"_hasShrinkwrap":false},"2.0.0-alpha.4":{"name":"vue-my-toasts","version":"2.0.0-alpha.4","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/composition-api":"^1.0.0-rc.6","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.4","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-MhpbPAlrm/y/47f6xCABgshgs+PuJclIcYG9TY1E3H5bfBmCR28o74ADuKMLVZav4jLpSNbNd2W+VfeI2haT2Q==","shasum":"62b66c95ed5fd7ef0b7a13f40fe4353f31e81fea","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.4.tgz","fileCount":57,"unpackedSize":282382,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdKEFCRA9TVsSAnZWagAAQ20P/0sv+8UCrBtJ361VISJ9\nUh948BcPLoCzl2CyTH+3vkm0lvwiqb1IiBYOOPsFXdiwB1MF9hl8i6Am6BaX\nZ73jTbtgWYN/yZuIaod4Qvdsdej61ow5EId6KUEoeJ0CWL2D2D00MlO+cSDj\nfEVyfcqMQLQ1/Dq9Ok7iHihH3vdkfNOb9S/fZPmpW8cNLXfJnMj0INjS0Hhh\n+qKQpRKm8WdEOuCM+qgLff4pVdSKhHT/Z/8ID4pPpqa8A4znPzlR2W+2X+Vk\nOr7PFEPZbY0/T7Rsvk+V3mMDjOi1qg2zHN2AXRpMee8AZVIYkcNq6N0iXSCy\nqDncCPdPs0q2ZgEHR1KbHXuXTRB9ZaboZQAEyGWmRDoaHqhF8+j5OGgiEKPY\nF2vSHRSVuJHxck4jCF3KHDQtroeZEsYO8aAczWhNVtyN+neKhwRjhU54SEsg\nQTZVyBAcv89/nB0mgOql/DWcbzyMncGcvEr1gu66fMP0MZoJJ0iIRTrsv4uB\n2MbU26EErdW7o7V6am+SR/nu3hWOH1oqy5O9MI0rWBWimEkS4We8MfP0YgCA\nKMdJQ6FTzVVg+Z7YQE2P2or1a+184anUoolKpOJcRv/Btm0Jno269lIZ6b0P\nbNbIlk2LMi1p2gEiGgWUlCKOvsl7jjS7uaP6sBYh9GzXV/yYBKlcru2+Sqf3\n4aq6\r\n=clc1\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCntyD4RfKlmRDqa8cNt/HCLp9noDxST1H3vOWt5R1SfQIhAOU2FBEAIE/nNahnLrygy+R/orhG8FV/c401+h60gBUu"}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.4_1618256133021_0.8753437827136397"},"_hasShrinkwrap":false},"2.0.0-alpha.5":{"name":"vue-my-toasts","version":"2.0.0-alpha.5","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/composition-api":"^1.0.0-rc.6","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","description":"

","_id":"vue-my-toasts@2.0.0-alpha.5","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-u7VujBib87I5y3yLwRpqQqdoLxjZDcZ1vJW6extl6DXBkTKKsn03Pe/aGUZmgpEizATMNV2ZrHGaetFI3jmftA==","shasum":"3611e785917ea11230937c0571a84b1bf5fe7dc1","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.5.tgz","fileCount":66,"unpackedSize":322255,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdKJLCRA9TVsSAnZWagAAh4QP/i5TWEjYksBsfBrkQo0Z\nQXLIXkj+JFtiwBBFddtJr7wUnVFDTH4iF7lgswD4ZkEGLf5ZkjS01LSdUY+r\n3UTauFW7kr/pY3pRvDdb4nxurdWtQxUT1rV3UKNoExJVEPrCB15k2vkGo+Vb\nj+Mp8dq3DtlvQYk+XGFV/LBzkpV54TJdxNmQzShHsB0jab61xxWPvDMhDdBz\nn16iiAciarYqLrCvl9p+A9BUF6oB4J+999P7VzO/wLkodFuZKg7ayZOohtxw\nWSRDLlGbnXha+rts9VGk+fvuwwSvfpQJYih9IcLDmyqyhh9/OLFlziYmXLuE\nSRrg+ex5bqqWwrdo/pbYUCC0jK3nsvnnlrO8yfwTGzF1+I26dm+NY6HR3YkS\n8EXuY1TZTRuneUDNH5pzH/qGaQqrUYfZm5mn23vA0p0AcR516R2c6BdRDXp5\nqd98k9ne2893wV+OoqfZumcB16qAzM6xNBU18vdrvIgPiJZE4KhoOtRAS5rj\nizmOEKJw7owuYabZnuzVj6xtbAFip8KjZHmKUPQux5WzuyleF7rLbhmwUeVx\nsOeTugblZrXs5hFY5uHCDZJQvLTk2/N78YjfaUwHGr3Lmbn3QmTxb8pDDrvF\nENeKPkXvTxFWsX/b9FKUilQ7C7G+jSf4h2SDDabQRi0iDrDrcwN15hF63Bsv\nIUzb\r\n=YZVm\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDLJZ4vRCTgj4PDmSDhTcFQfV0SI+SAwE6sHC6Gkir+8wIhAI7eYIeRQLIVdwuKTzgq8hXD1OIHtFUkx3LXUOpWwCjN"}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.5_1618256458786_0.1348271913498238"},"_hasShrinkwrap":false},"2.0.0-alpha.6":{"name":"vue-my-toasts","version":"2.0.0-alpha.6","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/composition-api":"^1.0.0-rc.6","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.6","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-Ukbmut1a0T/1f+AminWlktvJNvzqvWvoIVEBjq2I71SrrAx5JDJK/2TipXB00tbCyVmR7sCFti1mssF9ajGxCg==","shasum":"da2181622ada17c6c2172ee89de29f45460fdf9e","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.6.tgz","fileCount":21,"unpackedSize":122762,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdKRjCRA9TVsSAnZWagAATMIP/RsBgNeW1Ex5QQ24gliB\n2x0Be/Riy/r4L5PM/1wsK044WVLv6H5yyFj5yqE3s+Ip4ZU9xtDCn8xIHEa2\nLh/2LGbV3POYwlcle6JK1NdEqN77TRybBiYoqyDQ+Pzd1IoUL0I5thvThHSf\nhJE3O7b0jW1NargVuR4+kOEQO3CrlYgCjg0D7aoDlqMQVqmlSaxZ+oN6Edue\n8OgXczkw8a7giDLdniEyzWuRRDYaIEsYNIloEx7coOt7iY41rlpedYBEx5zI\nTlFidhZeK5ocuN6KSMkNJiwpOyp5RkSNT1kWF7xdAKYPHYzsT2dsg0x48F9u\nhiR37WoFR8TKIbp2a+JhI9lHUvShP494xKMTz94kw5Mhi13F0LvWZAYRqW1U\neH6hyApotEuL2CSpS8pb0RruRu1vlOnIga6XoZkpE5TEF5tpigK9oXyBB0dH\nVGzx63P3rSfX4EbF3fKGH/l0BKLyRviBdJ1rx4B1fiUy2rmIyjdgVwT6IfG4\n6ApIoOF7i8p+Dh9X2u5wwP0iLCWor8tBWxg7KlRe/+RK2vATu2rVlKj2cquZ\n+MycowKxd1j3aAOXu7wyTO7vYH9fiytfXlcUd8INhsOK1PwqpAgss+oKDpZL\nwMx9We18oDP27wEa3TLy4LhdoLdGgRmYGwEywHms8krEArY5S3UvdVyYqv5l\niPJL\r\n=0/9L\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDkAy1zScvYnT849F6/KM3pP/pApT1ULGBADL8Q3wNLyAiEAx0wcF2TVJX/f8Chxn7N6wQvVOlTTogawtKWoFflSlk8="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.6_1618256994869_0.4187365507834786"},"_hasShrinkwrap":false},"2.0.0-alpha.7":{"name":"vue-my-toasts","version":"2.0.0-alpha.7","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/composition-api":"^1.0.0-rc.6","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.7","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-0m3+vZKYlTAMvwDei8DrHTVtAUHUW8kXgTsp5wKkokhvKX5MCMc/Ju7nV2TIKHzZouskm2eUbYgTGW0oYK6mPA==","shasum":"4376ce9985a6927c3d5a5050c9f07a19f7d37117","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.7.tgz","fileCount":30,"unpackedSize":162707,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdKXACRA9TVsSAnZWagAAmqUP/0nP1XDrLnSn8bgPkt8r\nU30/njC17SmuKD8oQClU5jIR43Tk5gS8Ge+529yYF5OqPZpCXBUdEm4lPeSg\nDaYRdTSk9Nag/2HK4V+iM5RV107DPiR+/Ds+ldw357hXjYdWMXFuIu+l/E0d\n0E0iIDOTxNDQEV4HtxEtJwu+eJbYsknPVc6RSaILNGRTNLqW8PLtJDdBW8Rg\nKlZGEHJylUEFEZhfSgZIrX3DsL0xrSUUqNHHwHEsTnD0FHrBYo+JInpSTtd3\nZ+/Qqlew+QFuc+y8VdDaLRTmZ+A0fS4TsQDve0vRbtVlN+s6lY4sE3w/vfzC\noDBkRcqA4QdxB3DCjo05qLDGfkR+CavKZ1gQl1rlZ6u3SmlPiTWrXQ9ILnhi\nOn7BfcqrORKbZTLgpPvZd0K5Slo7YAgkqbsUK1F6vR9YHJuBmYotBV8NKwiy\nNVSm/bWbMJphFUa9OY+Lw0nqsXOHt4EdDNSDQNk1U5n5JLe02DsUH1z7xv9j\n9XJ+f1Cq7gjZJ1+l+FxVjhfrLKEuy1/Dctu7KSAwkuh5Nm4jlBKUYl7Tdgjq\ng/Q6T+T2mMhMybw4OQyE4YvMM5fBI5AaugexzfGHT+v8NYaWhtQaHZHmjF2r\nI9kzZ79+aXLRZChkJOBfpcxD00DZH58B9ko/Zckm5JIPEiYzHyxOFYmWyqbC\nLell\r\n=m7z5\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC/pqm1OvkK1EUGR7J2NZ8iELf5Qnh1c+zeiE4mO0wS1QIhANnpZm3UEaUe8pG5ZgW7pFr0p0ne1ycjzF8hp7bsIGn7"}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.7_1618257343773_0.1597908627365996"},"_hasShrinkwrap":false},"2.0.0-alpha.8":{"name":"vue-my-toasts","version":"2.0.0-alpha.8","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/composition-api":"^1.0.0-rc.6","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.8","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-TwNPGGukJ+Fh0X5VmrrhUUc8aaMAwPJeSbKpgMcpcb9uZHMri6j546vLMNHyRLv+yE0lsnuaK90O+pouKPj1Lg==","shasum":"62803e9eea221f511c12a03bdfd2a755345b84d3","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.8.tgz","fileCount":21,"unpackedSize":122796,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdKX0CRA9TVsSAnZWagAA2z8P/063xhWW3ME5eCdxv3o+\nTi9cu+Y2St0GXKX1/CMFoYqKabbb0qpOt4AUNcpj9Q0rFJ38y6/MdSqsR1D4\n4FtTLggUGBtfPtXK7bj86rKiM5PQ2SSUyx2fqlCYRVzOpn1BA1D0WDr603rI\nleQTLKbXY3btBh7ghHUwYCK4E1rQQcrDnWPwfdobjJGQQ5K7PtoH+eyHRiHK\nDv1gL5NI++Jar96VOPxgQK/JFN5o3JDac0qNZVVdUWFJlrWrRmCzPcx2v+lv\nTonkhpEetdhUkQchHU8vtSLN5agfx9nSC/mRzR3SKN06Nlt0ljXdZ0Bx/WqW\n+8ceIMBY4DG5SC4k6CdcwjrOo5I2ROl2Os8Oodh1Z7iRc8C+5vTU+ITXE/DB\ntBRVgmFtI5sCgsdTSRQNh2901psbih8KQHclA8sdWN659rWfwy22hMJYuj8L\n419mdQ/xOBcjBlZgVqlKqMvtEnQxy6qUk8jrFoXnIyd0ceyKIFR35RIpcKvD\n4WIjfLf2yL8SuIaReVg0xTpTlqQYh4kGWCqtsq//Em4wcMjXz0LvXohYsIoF\nVWozU3UHEySTRFJhxqSawpNbGDqWwdnfS8sl6Xck+jEqT3kSnt7XytfwuxDj\n08c+sQeM4/T1qNxMRNbSMXe+Ryv9ebMxJS2Dbxm1a0f3FgA+2sifCWXSPE7t\nxaB0\r\n=/HOC\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCfknHUI14fiTjZf6nCR2PqvlMTUsoFB7P7RX312rY0VAIgWfx8IqCJG5lEZZr3qm9HWoAMrvABBeKUgEF6rWDvwbw="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.8_1618257395950_0.5599904344305644"},"_hasShrinkwrap":false},"2.0.0-alpha.9":{"name":"vue-my-toasts","version":"2.0.0-alpha.9","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/composition-api":"^1.0.0-rc.6","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.9","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-IHwailufgAD4N/TsjKbm1+813uFVzR2EXU2jBr+PLmPxWqaCg8rFPs028zcSE8N+dhYByzvr3FgQpT5MNDi3ug==","shasum":"cab5f8009dfcd2aaf96f96fbf91c58ac2b255967","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.9.tgz","fileCount":21,"unpackedSize":122796,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdKaSCRA9TVsSAnZWagAAboMP/2QF92X3XAmpSIyfq4L8\n0FbcBO16jkEpv4D5JtMHP4DxPbT0hof6NzjjfBKJn4hCMO8/ilKF5jPgIg0R\n0cXrpOKAojhAQ0OWHmUZfVOmmOj62RjP/xmZbnPC/dUQ+Hda6H+uGRbloLcs\nEFU++h9eQuqBpvSwPuqLP2QF9IDZAtQedledTIHRSkagSfkwkXg5V/Ov2zDE\nTxeLR6q6SUdVxEOuQqwI+veePNalZQhfXPxLdc4mr2/CsBCbsiAlzI2hCPjq\n1BjKBlVLfqjEd3lRTsz+F7Ydi9WSbbZ4MiUvsUIAMlQ6yrd6KrdO5SRuomOQ\nYnK99awFvOVyISGrV+AkfKGyw74QKkkgmNlmivmDR+SClmnlgNeLsFJRqaRr\neiyvPyZ38tFTISQoAsopwgAKKSsOEVm/JHiziapi3UFbyDzGW8fD4mhwAYFB\n3FZNXfbvPY6Rw1e8ZMsG/920vWsve2rK+u4ajg/Eyz24IaSsbx0RbJdZC2+y\nj5cH3q5r5+5N/MCk6yrxpZxIIjNS1nKO7u+oGXcKvx3YlOwr0/SiGPjI4U/U\nXFmM9eV1ZmZvmuzn3rwlIlcWlfdLq9LN1iyoriXbDNNUZwZaMBkItnoMf1ek\nFnBU439sTaK5/fNIQ09fWhz+FInHOkqjuBOw292r6HiKiDB9mZWEj6GDZxAl\njg3L\r\n=x2wv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBRrc5aUWGzWFQ8STX0EyhyauTechS7wF8M9y1G8mJB2AiEA992O6LhLgeaj3xfnSQWFhma6GEbFiXj9KtbBt72q3LU="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.9_1618257553725_0.7383694280720432"},"_hasShrinkwrap":false},"2.0.0-alpha.10":{"name":"vue-my-toasts","version":"2.0.0-alpha.10","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/composition-api":"^1.0.0-rc.6","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.10","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-Q8AZfKyUsDRaQdJoEUJ1N+p1DqDqanuxlvWIyFIen1wdlGRbmR4WBDV/H6RYeJOzA5xhh8rWLc8aiJu8x5aelQ==","shasum":"6ad0e59355432cdf821bdb503d7c6395259fe589","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.10.tgz","fileCount":30,"unpackedSize":162571,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdK4fCRA9TVsSAnZWagAAmvsP/RguYRW4D2lPrQoQyUug\ncF+aoBBtUqXXog+YEiDA1ogla1WjFcX+3Vka7EKZCFR7SxSJaRHQdcgS9CRl\ngX5y6K72PovCVJmiWyUOnNYfl0n+lSebai9HQ5BwviTs48l2ux+b2TbguoY9\njTE3dud659RyBINivykSpxeTlrfynzPd/RcJW7PCBJfpXIGf8Fclw09QvYxS\nLKk5PbXDfFx9n1b50Ja9YRLpyztUPaAzylKn0JlbfgrSTiQ7RA/ufr9LzSV0\n+nbNghDUA2hDZK8hHf0QvnUKmSRyD40OcyJUNaBXhKgaPfDp/Pat5gGCJZ3V\ngdQlm+8lGX8SSycWaezDvO7TLe3qEOn5zs2mG4zxPUaE8uJrwqxLFKEu6LFr\n8S2w4n8IbvPhWACSliRzxQBwruTxRFWXx3eLcXPTsNNfL5szuTa5Gi1NMrBf\nwsXVj5xiA7A0pIp+MNXAFtVZrlkKqum7iPJWZ6qqJ6ki5shc09A2G29e+jv2\nrL6hF7vM+yJpFFjOeS45IoLw040Tg0/QmiZsjhAYQKUXBqRh8oP83JtVn59d\nVIP9qNoT/U2h0ueeptHItE+AyCMufm6CpNVN4LBM6G+KxDxLTKm4CMuCNjnd\nhts2QDfwHg6A6dZ5r4RWGqNwdCWSmyAaCCCS7Q0Z/hKduf6gQAc59G2zxs9n\n6+Ss\r\n=Zx1W\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHacInR7oZYXLarJJkcjTkwSmtyStyuK8tA+kX5owT8AAiEAq+sGJzUO+pv917muKYpg+E7MdYqM269EpskV+p9/ohU="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.10_1618259487036_0.581933784997998"},"_hasShrinkwrap":false},"2.0.0-alpha.12":{"name":"vue-my-toasts","version":"2.0.0-alpha.12","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/composition-api":"^1.0.0-rc.6","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.12","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-a2oVD5UoxJOCJCcjUFX+gpuTrkc98f5F8+rqMg8mmQBYP6S89g9ieYE9mmK8cV5V/mch7J1BeK8NPry5KseHiw==","shasum":"05efcb7aae485728d1f368c550f615555e25814e","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.12.tgz","fileCount":39,"unpackedSize":202463,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdK8RCRA9TVsSAnZWagAAYCUP/iucvt6gLtSzQbBJ4DA/\nAF8CMXOplAZV8o5Dq7sDvunJoN9386R/0/zsFPhXmE0uP3OWvSic557ts5GQ\nQoV9BH0OktvPgLjQiMe8Ce/U4cZJ1NQpLWOtEeAn/m2+o5QU3ey9Neje5pcS\nloShqRRcW5lIqfQTWJ8RceA/2yZJm4nto4FxlpoNiqUyIHUo+iM34/gOPPpF\nLe6qn+WWK01QWQj323kKOPBQwIjhq4MgQz3fXDl6Rp5xSSP4PYHlTwguPN0J\nzi73ZzB1pzhRfRJgsKttCIS4vdfS/bPnUM8XhNMW6a0q7IbmeLJKr2mSNFn0\nfgPcqn4pXaW9TGJhkOLt1QjfWtYPZwdDZOzIdP398Pta5T6M7Co7gvg0yHXD\nHMxf4nhGsXonHGMKygMeLnEJhfld0mT7QEFj6z/CvItJY+mRQbIb3fJLZZs9\niimuMfez0ehq/PvyAltC/OG/ajOAjBZP5TSVGWGIlSNIQTzRttNrLkeN1ak5\nXmYBNqicfIuIEy1uTXcd+2AJXQJN3E4+864qqAS7gC8hdlnMinh2p/regqUc\namagXnwuXTb9P4F3OBy6gjul4kNTOVg6iIFA/+UxXR0gEaQq+XMBVbzlkWw4\nEy/ty8U2MbB0U9qpeVfSho5A2OhS/fPvhCCi652iOeZoy9brnv2vRNYvZSHt\nCUdX\r\n=UIIt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICDcmxhfUgxsrmVSEo+t789/OIAZiRs0GcWM4NPRDgqxAiEA8lFssJIy3pLzOq3cXc/46avFbmk8vax7XqCSO8fATwg="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.12_1618259729172_0.26300712200336984"},"_hasShrinkwrap":false},"2.0.0-alpha.13":{"name":"vue-my-toasts","version":"2.0.0-alpha.13","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.13","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-9sYDUTLH8D06xow4bzx3WGql+JfX84R7zYkrWUOfj4CS59w7iXHXKRc/CkfB8U3go4Wif+nO83Yovc6uJ036kg==","shasum":"fd28324ce6d8b1d57b1462a37cdc9de0d1ee3b8f","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.13.tgz","fileCount":39,"unpackedSize":202420,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdLFKCRA9TVsSAnZWagAAB9oP/187oIEANCoRyyxCDu14\nCGko2tgJbEbegbjdnii9QsmA3I7lYmwb/txZrUUv+7SAmCiPC8GXIKr3ICw2\nxEnIMbgLX5pHb1pz3McLud1IOlUPWv9guHEif1yhAwDfIcD9xQA+fEhqBHee\nOW1/YS1F5GezlEqVWOBjzeyMfpBLMMB7MSik9UyEBzM2D/dOseUGo77hub/q\n3omM4asvpHcwO/VgV3J/8qJ7xhPRUajSFgPSis7C1vHNBoXEv+4sN2pBUfFw\n3efpLCffOKliGMEP7wDdKogZRmFKew3GVhKLiXb8Mm1Fl5dpaQDzdPcYDl3a\nVLJeNTpd1TQcx+2IcxIrJ/dLcoQMyin1UvMN7cBLRXiUFUXCDi2oEfz4JBJb\n/hXd5ibXwhCHfx24o8AO5fX03z9Kr7DUFc7/fxPHGvlZNKIhaVkGhE69JPe0\nO+GrXJ0Gyaaxr3EY6hJUv/vS5mg2e6MG2NJBeV/uJf9fw3thsoGMUG6vSe8U\njsZMqy/5y3m7f8ZKU94hwoPsn7d/jiNoWTuwmTmQZlGumAu3M1k4fFO7rTIk\ndzq49EuYio03bmCBE8kyG7TfI5UuYIo2P62LKERBG4+ivaQWt85gkOCsrPMA\nJ7IJsvZ2Ywf6ZmOfvh2fmiSZy50Ticynj667Yb1qs3OOHSm8WyHaGSrAF248\nsPxs\r\n=CYHv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB2KMOOPLxkj4rjfxu7dM662tOf9709w4POrmb2sj5qxAiEAz7gUkaP9Qr19V7Pxc0LqEtN2b3Jjp8tIHm4cSqaLgOU="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.13_1618260298135_0.47932616915956094"},"_hasShrinkwrap":false},"2.0.0-alpha.14":{"name":"vue-my-toasts","version":"2.0.0-alpha.14","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.14","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-3LzpzVTR368m19lhIdmJQrfqUzvLoE8hAUFExUBswrala/t/nX+kRhWHtx8AmaIYoQIw1tPIysDGOfSDdzDPwQ==","shasum":"530c46d0bb65b5d4144fe1fdce0743c39d52a085","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.14.tgz","fileCount":48,"unpackedSize":242312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdLMuCRA9TVsSAnZWagAAxtoP/0NGCmUiD6AaA9dnCKOj\nxk6BjMedb7WlLwqn05ienxHJavsVEGzzU7XXHIkGXuyBv6Auyc6byErOqQ8B\ngrogA7605yO0QgnoBkdadn4aGLQisH7V/siepEiPtZj78DIFAtPoYFS77Y3z\ne/RDRsf+kF6LkNgVeT55zNgym7bfmQIFcIypbFXycLFWO+Rr4/77GD8s6i+7\nDcuQ1aylNzq1irwWk0qk9W4cIB5NoU+krE72UZnrdqiNrY3IC1UYbo82kaW2\nGdD8UNmEPuWgL9FWct60Qi+NJ81BXJr8X6HBg771+Cq655I3avo2Tj/xFAfd\noKcqEVWJgUOltd6M/gKDAp6CgAQOfxgAdDtj92iOs3Wssu5vxCJRcrYxcsGz\nhrf1aDLRMV+VH9UYqFM7gPjzNU9KxjLhhZ78aU1o+yvKyRCYSiyujm/A1CgJ\nxPcRUP5vmdE20062yGWaJMtJL+7iCbrJzOIYPR8Zgr9S5LxyVkAczOCqjmfu\nQ0b3N51g/SytpnVE5ued5XbxWBCqpDDglMfXKrvZqtZdomGY3Ss7adsSk7K7\nw6s8RQfKxTZ3BhBbQT4W8mSNbXS8yV7YB8Bc095R+R9gMa79OlELIswME2+P\n9K/9vvCZ1APNIvBPGnnH6jqaGF3jwbVVtCeZdAL0qO/ZQOO94jdJ3GNxctYF\nnBIG\r\n=IMvh\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD2S9bll+xKRp6MG7MR52pTzOAIlDIbGd5pmWmZT1lUAgIhAI3ozGN6HA1V1KOHk13qoyHlu7xxIiFO/CFvBf/Kzn5n"}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.14_1618260781957_0.925342141982542"},"_hasShrinkwrap":false},"2.0.0-alpha.15":{"name":"vue-my-toasts","version":"2.0.0-alpha.15","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.15","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-ZgkY0ik+IBWHOoJiEXin8KKUDcgfcCE5Gnp2IouJ8jgqMhsWPH/nfFls7sUWWBoyq6WUiVKQLJCeMf40r9VvSA==","shasum":"371727a05627dbfe98d8e30cf26f3fcc544debb9","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.15.tgz","fileCount":57,"unpackedSize":282298,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdLW+CRA9TVsSAnZWagAAVyMQAJsDkmpVB9Vtkm3jXgDC\nVT4zHqC6EcBXLUUHbvpCBwNvLT3V9dOzbcc5ptmNkGRbfzYrdfP1alJfl751\nUEusGMX1aGpWDtRHn8Zb9SV7NSKymEmnXocA4ujWBk2vKz+cEHlTrE+O4tWa\nRgAz9X0HjHy3itJwzwgBptEyM5e2agKvTeG0VTzIZbmvN/HYWnQdppsX8JPx\nDfkt4uVxygjdxS60jVd6zPfUcBrDtLl7XfM7Vn6ISZhM+j+v5pbQVyzeKWby\no7E0l5JoTUbPW2XCvSi/30go5o6dNDuGNL/cC2ZaxXqxzo6ZdkL99KYZPn44\nKup1n8Mpr/HkAjg9puTbNr4sFeHvcQcGNjcFndS4qoHe+aPN2Ro4bmz2V6z+\nXeixWjCSqT5Lr4eQB8XM/bYEnSSNSetp2UDUGp0mXoTEojralDoGN9H7TTyy\nOb+Z3VUAHJHZ9L+fvMVoAnzsXCClkVTEuEyRyZ7LdioLo2+R3ZgbWsf9LS3j\nUgtj7TrJYXCifZp0X+QKeio2wlOjUyBciy5QPM7Jxdqc+OVOx+A10v6sGHcW\ngzp7EmWxbUcYPiR1E4WptdfuZgkI2LuxKUtGdMrwEGEJmOfCU8xTu13FWp0d\nABkwfAwcRf/S+JVCS9tEXmmyYDCyV9zX4WI5LNb7JD0cfBhShEhQArvki2hh\noWlq\r\n=nnBS\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC0fSFnlnraxa4ciidIrwrfwXxQsI+Toe6Q6V7a8ZfW/wIgW9/UhmmXko8mTQvbK0G+Icgh+JGz5hxNZ465n+6SlrM="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.15_1618261438160_0.8791350900638724"},"_hasShrinkwrap":false},"2.0.0-alpha.16":{"name":"vue-my-toasts","version":"2.0.0-alpha.16","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/cjs/index.js","module":"dist/esm-bundler/index.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.prod.js","types":"dist/types/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"9191d7b7d58106f9627ec63a3e622539a2366634","description":"

","_id":"vue-my-toasts@2.0.0-alpha.16","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-u12G+zlCEccJvPIyiVTK4MkTC0t6T5cpvmz+6JCtHP9ruRQivVMr4moyjoVNKN29+HDXOaJckyuQrQhT56ht5A==","shasum":"13a04ea410504feadbf9660fb54241a785dd01eb","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.16.tgz","fileCount":66,"unpackedSize":322216,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdLZcCRA9TVsSAnZWagAAfEsP/i8RKzyWB5WzsUcOIBEp\nfE0nTDHkMcWW+GN5/sxUM7DhVsJH2cgcH4BezqVQdNruHsroUoTkdDG3VSUE\nb4M12mXdqVLFH0FlDBcmw/Om/bdkcpNUKVXDdTD96W9ZVt0W/45Iv1ZGbTCz\nBE0Ulxifn+I+S3+RrF8zPRDNfE7p+g5BR4th6M89FTJjC6LoeUFaNWrm7+EO\nwieBzQkVb3An0xPS3di2fqekbD5EGR/x7C/mfn4btXW9CVs05mGjlcWJaEzM\ni3kTiz/6El6pEOTyrBSjXpvV8Mz+ZL5BfGFS5NYz/wj/I2/JyDENeuxRmbg9\n8jWAPOkbLvmDdu+R7C3fE8819XKMRY12NsR51wVrKXbDXrCYjRoL83AAhVAL\nEr9pIgOuqWv7s39cZzs0zm3Oom7ijSHFAy/yYBxW74Prr550RyIt9xUjMwcp\nRC0VVbDf5sAIjEqQBVO6BWYWr9+RCePCbXFLeeSJKzpx6qilVSgBQfhxY24B\nDKpgaWY4q/p1pxNxJtnyBX/kaXzcAWJ/RKKhbkGk4NOnH0RTF0sXbt64B0dd\nqHI3fI8Fi1b+knz7D7ktRTlk8rzJU4uuuFqPu4IiKLPiZYtgZTe67lDrwrEJ\nJPK1yzqlk2J4I55cX6xipRxlUnqlsqF/nSbGBpAPWPoOCR0ff7ayCN8c0VK/\nSs5g\r\n=GfkA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHulqmZlz0Cua0k94gDUZ5kFvLBou2HlLACFib999X6CAiEA3zw+gHxVX3W+7JhprjmOv/8CXWHDAok2vsCRkX3HwFU="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.16_1618261596500_0.954453460296218"},"_hasShrinkwrap":false},"2.0.0-alpha.18":{"name":"vue-my-toasts","version":"2.0.0-alpha.18","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/index.cjs.js","module":"dist/index.esm-bundler.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.js","types":"dist/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md","gitHead":"03c14cd5a10ee7339add2aac1a4153f8874b31cf","description":"

","_id":"vue-my-toasts@2.0.0-alpha.18","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-UHn8YpII1AGazh0MAM+qmfnvbBCNDNMFoNlMWL5SG6bwL11Z+FU0IukEBWiwV0LMad14+8HqE+tFBi/KM56Uyw==","shasum":"418a0076129f1051d4c1dac641c45af56352a3e3","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0-alpha.18.tgz","fileCount":70,"unpackedSize":845840,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgdL3BCRA9TVsSAnZWagAAtKsP/jWig3993OE4avqxDSC0\nVYGOPsoCO33SE2DzlaA9e6sOH+1lLwI5P09z1DYMESGVGHKCrAAaR02CsfTB\ntE+tQkWhKL7qhHsmfq29NvsSmHZ8uBktfWH5Ka0nN+1EgVogvdu0JI88U5gf\nrK2lJSQDwdOtne+jOPJwadF/PVPawNiNGmQCFTcGm2hIPqABGi846nBvib3L\nifZpZu7cUddJ70WpYcDqldMIO3rbk2wIEUTQ4PILWxl5btbbSVtp48zLpbF4\nK5GOtq6OWymM1JJDr2TmDlkHGpBLz3Jxgh6EJ0JvISsrFIIc2j5gRj7UBifI\n6xDHaN7E7FDbLNWPacmL5cKHSIb3k6sj0fnUI9vSnPTkNoIlyEsggjjNZLRx\n3qr3ljS4UtPC2pMwQFJTx2fJO6izSGnAvoi8HVe91zGP+tZja2rn3NrGRR6z\nJX6fYy9X1K4BW+DWt1qlLa5aFHmUi+dKz0XGZpzaNdXVlb7kDIQOdGAq5QR6\nJ7adftk6VhUesSrZlyi+JiK7nF/dDOaMzKPl/aG/+dw6GJ3KWj/rClfG49d7\nQYXVTSw+VHdTMbRldhyiiKa762kntea2fh5uFh37wSokQgIhxvPvC9xjx2Rb\nrTB+NKZYs03+b7VUeNqem0KDrIV/b9N8x8PcYCIJqSMXgCZ5oInb/nLCezeB\nB7Ob\r\n=Bszk\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCvAzzwIbTxIfkisc64Oht+UAddHlAWIhPNKSWREBagOgIhAKci7PHjM+poe1H8pAt8L38yg/D1boVMKE0cyYBCkMUb"}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0-alpha.18_1618263489271_0.1423732686505932"},"_hasShrinkwrap":false},"2.0.0":{"name":"vue-my-toasts","version":"2.0.0","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/index.cjs.js","module":"dist/index.esm-bundler.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.js","types":"dist/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"gitHead":"61e54ff62e54509d38ff5264b2080e32b11d4aa2","description":"

","_id":"vue-my-toasts@2.0.0","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-ST6f4fSghnDWHH2Uyv6nkZ45GMnPrnG+nPyf+y30ET1VdPakI85/x81ArEI7TJR8REFC91UGQcpuqb8TgzN/Dw==","shasum":"86f13a8025dc2851d8a9a25d74924690aaa3f325","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.0.tgz","fileCount":70,"unpackedSize":820603,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJggwz6CRA9TVsSAnZWagAADhUQAJ5izY7gXCpC9BAKA3Id\nNfDHBBHZ7ip3zZOQ0bKjTdMYpu2tvqrazNKJO8rpb1gmAInAGGYMQY8B5GNx\nSqtL09WWXxWW7U2KzAS7kqzkev7KezCqsrNsTHUHLKAYH233W9m9FyaTeQ75\nPyniqk3C5keXSncBplHQ4dtBJrQpJqYthi5aG3livewNoF/QCTON/JnDiPev\nQ1vPVmZ0m+2iusJii/0lq6JQKEItNUhX/RbWkjl8TZSb5skQV2q+3WYysHdX\nGJeNeBF3FijWxwOi5oPL02cM5/L1MAVLIPcLK3vSZFjqrbPkH0gfLtgoj6mf\nXVJomd2LmU6benGMXqVPZEH5GZ9V2NTy+PJHREsEWzhjXyHee5TN8xuJ18eM\nIKxRi2uTuMjA5xI5tiA3jUxlUlx6EWQTAIZQ6mIeHb+ZkuYhMTf2Ggrtdxg3\n0knsC8K1aXcfwn1JCAHA2vIn2xMX9dlm9gdlShNGDF3K5lufF/5xNWAn7xBS\nJxH1DSFhKzBitqWPGLWKHZOQ3kHdA4GOXDZLl207n7Q10beXvYuoCKcGhCzK\ndmWdUay5+uE15EARtY8sFQ8fssq9gS15nNxzR/2ymzlhLsegUFN75eVwoJ2K\nyl4gAmaA0Ofmmhnd8+kw/UrJBfnycopWl7D9dQgG9Q+6CIZ67TNRCPuCc9us\nESuZ\r\n=9WjW\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA9fJJH+fdRAJHYr/WvqHy4YNSaM79ED8PlPmkFTbLJSAiEAmMywtglUu6v1YjKNOQNj3EsNXfDPDk4DnGjASCPqYsw="}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.0_1619201273414_0.03392778859266721"},"_hasShrinkwrap":false},"2.0.1":{"name":"vue-my-toasts","version":"2.0.1","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","scripts":{"build":"rollup -c rollup.config.js","dev":"rollup -w -c rollup.config.js","lint":"prettier -c --parser typescript \"{src,__tests__,e2e}/**/*.[jt]s?(x)\"","lint:fix":"yarn run lint --write","dev:demo":"vite","build:demo":"vite build","serve:demo":"vite serve demo/dist","dev:docs":"vitepress dev docs","build:docs":"vitepress build docs","serve:docs":"vitepress serve docs"},"main":"dist/index.cjs.js","module":"dist/index.esm-bundler.js","unpkg":"dist/index.global.js","jsdelivr":"dist/index.global.js","types":"dist/index.d.ts","dependencies":{"@vueuse/motion":"^1.5.4","vue-demi":"0.7.4"},"peerDependencies":{"@vue/composition-api":"^1.0.0-beta.1","vue":"^2.0.0 || >=3.0.0-rc.0"},"peerDependenciesMeta":{"@vue/composition-api":{"optional":true}},"devDependencies":{"@rollup/plugin-commonjs":"^18.0.0","@rollup/plugin-node-resolve":"^11.2.1","@rollup/plugin-replace":"^2.4.2","@vitejs/plugin-vue":"^1.2.1","@vue/compiler-sfc":"^3.0.11","@vue/eslint-config-prettier":"^6.0.0","eslint-plugin-prettier":"^3.3.1","eslint-plugin-vue":"^7.8.0","pascalcase":"^1.0.0","postcss":"^8.2.9","prettier":"^2.2.1","rollup":"2.44.0","rollup-plugin-copy":"^3.4.0","rollup-plugin-dts":"^3.0.1","rollup-plugin-ignore-import":"^1.3.2","rollup-plugin-postcss":"^4.0.0","rollup-plugin-terser":"7.0.2","rollup-plugin-typescript2":"^0.30.0","typescript":"^4.2.3","vite":"^2.1.5","vitepress":"^0.12.2","vue":"^3.0.11"},"sideeffects":false,"gitHead":"a42874de503a2e583bd9f4234dc4f32fa5b0de33","description":"

","_id":"vue-my-toasts@2.0.1","_nodeVersion":"15.11.0","_npmVersion":"7.7.6","dist":{"integrity":"sha512-RDX2uOz8SfWxb48iXr+f3GFgf3nSMs/GDrdmXsmjMEs48UPM4rTQFZwBa2MHqvzBhHv5hOUxG8bLy8yo574ohw==","shasum":"b3ecffa80707d73cbfc7f2fea1e26a1808b0f41b","tarball":"https://registry.npmjs.org/vue-my-toasts/-/vue-my-toasts-2.0.1.tgz","fileCount":12,"unpackedSize":544794,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJggw1mCRA9TVsSAnZWagAA4s8P/0nOBsWwmU48Ikss+/NF\nKU42N3IzGDtYXxtKZZAnFX99VyUrgR9Ms5aGBpuK7A2n4Y3bKDnsyJkWccCo\n8LJihMVz2/q0+vf2sTadBn71BXCKCFz6aixcA31pg7o6oc/FBMjoYNIge4OM\neoQ9uU8c49aSWGIpWQVqtQyCJHKUCiHRFR7OcWM95+p1GeebxDaRuBPIYnm2\nrZOjlfcjK9NLjCBkPUEbCpAevd4T4HwLrzm1bYm5J/wnQ1MY1RUT3dllP+D+\n3H6gHXVJzq0UQuVFSLk0RfAawkUa5LPK63SmaVjmft7uwgLruF8mCHrVYs2D\nIu3hXlwMxkbJT7To8VeqYe/vqoGnthIGngVhV74OVGOCDZ49y4hdnyEOJWO3\n7hsvfdv4rtm+SwGf0Am7+JQxZOtJptTTjG2oHDbDKcjgfkpSHECY23J2MZGZ\nZ7HHEK2K/zwVySz50DGBQC2ViTrkgcg3u+4apy+mztjC+8JZoDdYvi/+UMnh\nuMC3q9NMLecviyV1sJdvDSCntING98n5F9Ejt8Y43yjqlIUHZEXmqhz1JVRi\nicQRAghBR6QAD0DOIEni3Xa3CGMOY39h7vFzCOLhPJGt5ouRe/BWoHPjcUMN\nwxM00fT6CcGSJAdRkKPG8c8ihvHOd114SvgyxMlBs1ehx39+VGoyALVyoays\nGfrA\r\n=dWZx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDnKSUyLQ6zwN4I/97A7scolFz2d7u0vXCXAJ+phcuktAIhAPANTmKPq5pwQIYh8Q78DBes/taFx/38moAWuDS5DEJj"}]},"_npmUser":{"name":"tahul","email":"yael@ipseity.fr"},"directories":{},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-my-toasts_2.0.1_1619201382081_0.8855819336273918"},"_hasShrinkwrap":false}},"time":{"created":"2020-06-01T19:12:43.070Z","1.0.0":"2020-06-01T19:12:43.320Z","modified":"2022-05-23T17:02:44.964Z","1.0.1":"2020-06-01T20:10:23.302Z","1.0.2":"2020-06-03T01:00:22.857Z","1.0.3":"2020-07-02T19:13:44.068Z","1.0.4":"2020-07-02T19:14:49.191Z","1.0.5":"2020-12-14T02:55:17.292Z","1.1.0":"2021-03-03T10:12:53.922Z","1.1.1":"2021-03-12T23:56:31.509Z","2.0.0-alpha.1":"2021-04-12T18:08:59.392Z","2.0.0-alpha.2":"2021-04-12T18:13:08.427Z","2.0.0-alpha.3":"2021-04-12T18:14:50.907Z","2.0.0-alpha.4":"2021-04-12T19:35:33.144Z","2.0.0-alpha.5":"2021-04-12T19:40:58.970Z","2.0.0-alpha.6":"2021-04-12T19:49:54.990Z","2.0.0-alpha.7":"2021-04-12T19:55:43.903Z","2.0.0-alpha.8":"2021-04-12T19:56:36.088Z","2.0.0-alpha.9":"2021-04-12T19:59:13.933Z","2.0.0-alpha.10":"2021-04-12T20:31:27.193Z","2.0.0-alpha.12":"2021-04-12T20:35:29.402Z","2.0.0-alpha.13":"2021-04-12T20:44:58.301Z","2.0.0-alpha.14":"2021-04-12T20:53:02.156Z","2.0.0-alpha.15":"2021-04-12T21:03:58.279Z","2.0.0-alpha.16":"2021-04-12T21:06:36.620Z","2.0.0-alpha.18":"2021-04-12T21:38:09.460Z","2.0.0":"2021-04-23T18:07:53.600Z","2.0.1":"2021-04-23T18:09:42.210Z"},"maintainers":[{"name":"tahul","email":"yael@ipseity.fr"}],"description":"

","author":{"name":"Yaël GUILLOUX","email":"yael.guilloux@gmail.com"},"license":"https://github.com/Tahul/vue-my-toasts/raw/master/LICENSE","readme":"

\n \n

\n\n---\n\n# 🍞 vue-my-toasts\n\nA Vue toast plugin that finally lets you create your own toast component.\n\nYou can see a demo of the default behaviour [here](https://vue-my-toasts.netlify.app).\n\n⚠**This repository is being rewritten to be cross-compatible with Vue 2 & 3**⚠\n\n⚠Please stay tuned on [**Twitter**](https://twitter.com/yaeeelglx) for release date.⚠\n\n## ❓ Why another toast plugin ?\n\nMost toast plugins out here comes with a _pre-defined style_.\n\nI love some of these plugins, but you can't assume that your design will be used in _every projects_.\n\nThis plugin aims to _abstract what is boring_ in creating a toast notification plugin, and let you _focus on designing_ your toast component while keeping a simple API to interact with.\n\n## 🛠 Setup\n\nAdd it to your project with your favorite package manager.\n\n```bash\nnpm install vue-my-toasts\n```\n\n```bash\nyarn add vue-my-toasts\n```\n\n## ⚙ Configure\n\nInject the plugin to your Vue instance, and configure it using the parameters.\n\nDo not forget to import the `css` file, it is needed to display the wrapper component properly.\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\nimport 'vue-my-toasts/dist/vue-my-toasts.css'\nimport YourToastComponent from '~/components/toasts/YourToastComponent'\n\nVue.use(VueMyToasts, {\n component: YourToastComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\nThe whole principle of this package is to build your own toast component.\n\nIt comes with two included components, based on Tailwind and Bootstrap.\n\nBoth of those components are ready to be used straight from your app, or to be copy/pasted to create your own implementation.\n\nIf you want to see the included component, you can watch the demo [here](https://vue-my-toasts.netlify.app).\n\n```javascript\nimport VueMyToasts from 'vue-my-toasts'\n// import BootstrapComponent from \"vue-my-toasts/src/components/toasts/BootstrapComponent\";\nimport TailwindComponent from 'vue-my-toasts/src/components/toasts/TailwindComponent'\n\nVue.use(VueMyToasts, {\n // component: BootstrapComponent,\n component: TailwindComponent,\n options: {\n width: '400px',\n position: 'bottom-right',\n padding: '1rem',\n },\n})\n```\n\n### Base parameters\n\n- `width`: The max width for a toast (as CSS attribute)\n- `padding`: The padding of the box handling the toasts list (as CSS attribute)\n- `position`: The position of the toast list, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n\nNote that you can add as many parameters you want, they will be passed as props to your toast component.\n\n## 👨‍💻 Usage\n\nvue-my-toasts come with a simple API that you can use from anywhere in your codebase.\n\nAs it is a Vue plugin, we inject our main functions and helpers in the Vue prototype under the key `$toasts`.\n\nYou can so access this from anywhere in your Vue components, and generally from anywhere you have access to your Vue instance.\n\n```javascript\nexport default {\n name: 'MyComponent',\n\n mounted() {\n // From helpers\n this.$toasts.success('This is my favorite toasts plugin.', {\n // Any other parameter...\n })\n\n // From base function\n this.$toasts.push({\n type: 'warning',\n message: 'This is definitely my favorite toasts plugin.',\n // Any other parameter...\n })\n },\n}\n```\n\n### API\n\n- `$toasts.base('message', options)`: Push a base message (options is facultative)\n- `$toasts.success('message', options)`: Push a success message (options is facultative)\n- `$toasts.warning('message', options)`: Push a warning message (options is facultative)\n- `$toasts.error('message', options)`: Push a error message (options is facultative)\n- `$toasts.push(options)`: Push a message from a raw toast payload\n- `$toasts.remove(id)`: Remove a toast from its unique id\n- `$toasts.updateConfig(newConfig)`: Update the toasts base config\n\nNote that you can add as many parameters you want to `options` object, they will be passed as props to your toast component.\n\n## 👨‍🎨 Create your own\n\nIf you want to create your own component, you can start from the [Demo one](src/components/toasts/TailwindComponent.vue).\n\nYou need to import the [ToastMixin](src/mixins/ToastMixin.js) in your component, so you have a good start with the default configuration.\n\nIf you want to have a timer inside your component, you can import the [TimerMixin](src/mixins/TimerMixin.js).\n\n### Attributes\n\nAttributes accessible by using the included mixins:\n\n- Using [ToastMixin](src/mixins/ToastMixin.js):\n- `this.id`: The ID of the toast, you can provide it yourself or it will be auto-generated.\n- `this.index`: The index of the toast inside the currently visible list\n- `this.type`: The type of the toast, can be: `base`, `warning`, `error`, `success`\n- `this.position`: The position of the toast, can be: `bottom-right`, `bottom-left`, `top-right`, `top-left`, `top-middle`, `bottom-middle`\n- `this.message`: The message of the toast.\n\n- Using [TimerMixin](src/mixins/TimerMixin.js):\n- `this.duration`: The duration for which the toast will be shown (in ms)\n- `this.percentageElapsed`: The percentage elapsed of the toast duration\n- `this.remaining`: The remaining time of the toast visible duration\n\n### Events\n\n- `$emit('remove')`: Remove event, that will close the current current toast.\n\n## 👋 Credits\n\n[Yaël GUILLOUX](mailto:yael.guilloux@gmail.com)\n\nFollow my work on [yael.dev](https://yael.dev).\n\n## 🔏 License\n\nThe MIT License (MIT). Please see [License File](LICENSE) for more information.\n","readmeFilename":"README.md"}