@a7medhassan/react-toast
Version:
react notification library
2 lines (1 loc) • 25.2 kB
JavaScript
import{jsx as n,jsxs as t}from"react/jsx-runtime";import{useRef as e,useEffect as r,useState as o,createContext as a,useContext as i}from"react";function s(n){var t,e,r="";if("string"==typeof n||"number"==typeof n)r+=n;else if("object"==typeof n)if(Array.isArray(n)){var o=n.length;for(t=0;t<o;t++)n[t]&&(e=s(n[t]))&&(r&&(r+=" "),r+=e)}else for(e in n)n[e]&&(r&&(r+=" "),r+=e);return r}function l(){for(var n,t,e=0,r="",o=arguments.length;e<o;e++)(n=arguments[e])&&(t=s(n))&&(r&&(r+=" "),r+=t);return r}!function(n,t){void 0===t&&(t={});var e=t.insertAt;if(n&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===e&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=n:o.appendChild(document.createTextNode(n))}}("/*\n! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com\n*//*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: #e5e7eb; /* 2 */\n}\n\n::before,\n::after {\n --tw-content: '';\n}\n\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured `sans` font-family by default.\n5. Use the user's configured `sans` font-feature-settings by default.\n6. Use the user's configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n -moz-tab-size: 4; /* 3 */\n -o-tab-size: 4;\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\"; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\n\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n\n/*\nRemove the default font size and weight for headings.\n*/\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\na {\n color: inherit;\n text-decoration: inherit;\n}\n\n/*\nAdd the correct font weight in Edge and Safari.\n*/\n\nb,\nstrong {\n font-weight: bolder;\n}\n\n/*\n1. Use the user's configured `mono` font-family by default.\n2. Use the user's configured `mono` font-feature-settings by default.\n3. Use the user's configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\n\ncode,\nkbd,\nsamp,\npre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n\n/*\nAdd the correct font size in all browsers.\n*/\n\nsmall {\n font-size: 80%;\n}\n\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\n\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\n\nsub {\n bottom: -0.25em;\n}\n\nsup {\n top: -0.5em;\n}\n\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\nbutton,\nselect {\n text-transform: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n:-moz-focusring {\n outline: auto;\n}\n\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n:-moz-ui-invalid {\n box-shadow: none;\n}\n\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\nprogress {\n vertical-align: baseline;\n}\n\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n[type='search'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n\n/*\nAdd the correct display in Chrome and Safari.\n*/\n\nsummary {\n display: list-item;\n}\n\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\n\nfieldset {\n margin: 0;\n padding: 0;\n}\n\nlegend {\n padding: 0;\n}\n\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n\n/*\nReset default styling for dialogs.\n*/\ndialog {\n padding: 0;\n}\n\n/*\nPrevent resizing textareas horizontally by default.\n*/\n\ntextarea {\n resize: vertical;\n}\n\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\ninput::-moz-placeholder, textarea::-moz-placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n\n/*\nSet the default cursor for buttons.\n*/\n\nbutton,\n[role=\"button\"] {\n cursor: pointer;\n}\n\n/*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden] {\n display: none;\n}\n\n*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n}\n\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n}\n.sr-only {\n position: absolute !important;\n width: 1px !important;\n height: 1px !important;\n padding: 0 !important;\n margin: -1px !important;\n overflow: hidden !important;\n clip: rect(0, 0, 0, 0) !important;\n white-space: nowrap !important;\n border-width: 0 !important;\n}\n.fixed {\n position: fixed !important;\n}\n.absolute {\n position: absolute !important;\n}\n.relative {\n position: relative !important;\n}\n.bottom-0 {\n bottom: 0px !important;\n}\n.left-0 {\n left: 0px !important;\n}\n.left-1 {\n left: 0.25rem !important;\n}\n.right-0 {\n right: 0px !important;\n}\n.right-1 {\n right: 0.25rem !important;\n}\n.right-1\\/2 {\n right: 50% !important;\n}\n.top-0 {\n top: 0px !important;\n}\n.my-3 {\n margin-top: 0.75rem !important;\n margin-bottom: 0.75rem !important;\n}\n.flex {\n display: flex !important;\n}\n.inline-flex {\n display: inline-flex !important;\n}\n.h-4 {\n height: 1rem !important;\n}\n.h-\\[5px\\] {\n height: 5px !important;\n}\n.h-full {\n height: 100% !important;\n}\n.w-4 {\n width: 1rem !important;\n}\n.w-\\[5\\%\\] {\n width: 5% !important;\n}\n.w-\\[95\\%\\] {\n width: 95% !important;\n}\n.w-full {\n width: 100% !important;\n}\n.w-screen {\n width: 100vw !important;\n}\n.max-w-\\[5\\%\\] {\n max-width: 5% !important;\n}\n.max-w-\\[95\\%\\] {\n max-width: 95% !important;\n}\n.max-w-xs {\n max-width: 20rem !important;\n}\n.flex-1 {\n flex: 1 1 0% !important;\n}\n.translate-x-1\\/2 {\n --tw-translate-x: 50% !important;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;\n}\n@keyframes toastIn {\n\n 0% {\n transform: var(--elm-translate) scale(0.7);\n opacity: 0.7;\n }\n\n 80% {\n transform: translate(0px) scale(0.7);\n opacity: 0.7;\n }\n\n 100% {\n transform: scale(1);\n opacity: 1;\n }\n}\n.animate-toastIn {\n animation: toastIn .8s both !important;\n}\n@keyframes toastOut {\n\n 0% {\n transform: scale(1);\n opacity: 1;\n }\n\n 20% {\n transform: translate(0px) scale(0.7);\n opacity: 0.7;\n }\n\n 100% {\n transform: var(--elm-translate) scale(0.7);\n opacity: 0.7;\n }\n}\n.animate-toastOut {\n animation: toastOut .8s both !important;\n}\n.items-start {\n align-items: flex-start !important;\n}\n.items-center {\n align-items: center !important;\n}\n.justify-start {\n justify-content: flex-start !important;\n}\n.justify-center {\n justify-content: center !important;\n}\n.justify-between {\n justify-content: space-between !important;\n}\n.overflow-y-auto {\n overflow-y: auto !important;\n}\n.overflow-x-hidden {\n overflow-x: hidden !important;\n}\n.break-words {\n overflow-wrap: break-word !important;\n}\n.rounded-full {\n border-radius: 9999px !important;\n}\n.rounded-lg {\n border-radius: 0.5rem !important;\n}\n.rounded-md {\n border-radius: 0.375rem !important;\n}\n.border-none {\n border-style: none !important;\n}\n.bg-blue-400 {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(96 165 250 / var(--tw-bg-opacity)) !important;\n}\n.bg-error {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(231 81 59 / var(--tw-bg-opacity)) !important;\n}\n.bg-info {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(62 152 219 / var(--tw-bg-opacity)) !important;\n}\n.bg-neutral-200 {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(229 229 229 / var(--tw-bg-opacity)) !important;\n}\n.bg-success {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(106 190 16 / var(--tw-bg-opacity)) !important;\n}\n.bg-warning {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(212 173 16 / var(--tw-bg-opacity)) !important;\n}\n.bg-white {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;\n}\n.p-10 {\n padding: 2.5rem !important;\n}\n.p-2 {\n padding: 0.5rem !important;\n}\n.p-3 {\n padding: 0.75rem !important;\n}\n.text-sm {\n font-size: 0.875rem !important;\n line-height: 1.25rem !important;\n}\n.font-semibold {\n font-weight: 600 !important;\n}\n.text-error {\n --tw-text-opacity: 1 !important;\n color: rgb(231 81 59 / var(--tw-text-opacity)) !important;\n}\n.text-gray-200 {\n --tw-text-opacity: 1 !important;\n color: rgb(229 231 235 / var(--tw-text-opacity)) !important;\n}\n.text-info {\n --tw-text-opacity: 1 !important;\n color: rgb(62 152 219 / var(--tw-text-opacity)) !important;\n}\n.text-success {\n --tw-text-opacity: 1 !important;\n color: rgb(106 190 16 / var(--tw-text-opacity)) !important;\n}\n.text-warning {\n --tw-text-opacity: 1 !important;\n color: rgb(212 173 16 / var(--tw-text-opacity)) !important;\n}\n.shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) !important;\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color) !important;\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;\n}\n.outline-none {\n outline: 2px solid transparent !important;\n outline-offset: 2px !important;\n}\n.filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;\n}\n.hover\\:text-gray-900:hover {\n --tw-text-opacity: 1 !important;\n color: rgb(17 24 39 / var(--tw-text-opacity)) !important;\n}\n.focus\\:ring-2:focus {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;\n}\n.focus\\:ring-gray-300:focus {\n --tw-ring-opacity: 1 !important;\n --tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity)) !important;\n}\n@media (prefers-color-scheme: dark) {\n\n .dark\\:bg-error {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(231 81 59 / var(--tw-bg-opacity)) !important;\n }\n\n .dark\\:bg-info {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(62 152 219 / var(--tw-bg-opacity)) !important;\n }\n\n .dark\\:bg-success {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(106 190 16 / var(--tw-bg-opacity)) !important;\n }\n\n .dark\\:bg-warning {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(212 173 16 / var(--tw-bg-opacity)) !important;\n }\n\n .dark\\:bg-white {\n --tw-bg-opacity: 1 !important;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;\n }\n\n .dark\\:text-blue-100 {\n --tw-text-opacity: 1 !important;\n color: rgb(219 234 254 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:text-blue-500 {\n --tw-text-opacity: 1 !important;\n color: rgb(59 130 246 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:text-green-100 {\n --tw-text-opacity: 1 !important;\n color: rgb(220 252 231 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:text-green-500 {\n --tw-text-opacity: 1 !important;\n color: rgb(34 197 94 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:text-orange-100 {\n --tw-text-opacity: 1 !important;\n color: rgb(255 237 213 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:text-orange-500 {\n --tw-text-opacity: 1 !important;\n color: rgb(249 115 22 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:text-red-100 {\n --tw-text-opacity: 1 !important;\n color: rgb(254 226 226 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:text-red-500 {\n --tw-text-opacity: 1 !important;\n color: rgb(239 68 68 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:text-white {\n --tw-text-opacity: 1 !important;\n color: rgb(255 255 255 / var(--tw-text-opacity)) !important;\n }\n\n .dark\\:hover\\:text-white:hover {\n --tw-text-opacity: 1 !important;\n color: rgb(255 255 255 / var(--tw-text-opacity)) !important;\n }\n}");const d={topRight:"top-0 right-1",topCenter:"top-0 right-1/2 translate-x-1/2",topLeft:"top-0 left-1",bottomLeft:"bottom-0 left-1",bottomCenter:"bottom-0 right-1/2 translate-x-1/2",bottomRight:"bottom-0 right-1"},c=n("svg",{"aria-hidden":"true",viewBox:"64 64 896 896",fill:"currentColor",children:n("path",{d:"M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 00203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"})}),p={info:"bg-info dark:bg-info dark:text-blue-100 text-gray-200",success:"bg-success dark:bg-success dark:text-green-100 text-gray-200",warning:"bg-warning dark:bg-warning dark:text-orange-100 text-gray-200",error:"bg-error dark:bg-error dark:text-red-100 text-gray-200"},m={info:"dark:bg-white bg-white text-info dark:text-blue-500",success:"dark:bg-white bg-white text-success dark:text-green-500",warning:"dark:bg-white bg-white text-warning dark:text-orange-500",error:"dark:bg-white bg-white text-error dark:text-red-500"},g={topRight:"translateX(2000px)",topCenter:"translateY(-1300px)",topLeft:"translateX(-2000px)",bottomLeft:"translateX(-2000px)",bottomCenter:"translateY(1300px)",bottomRight:"translateX(2000px)"},w=a=>{let{type:i="info",icon:s="",message:d="---",id:w,duration:h=3e3}=a;s=""===s?(e=>({info:t("svg",{"aria-hidden":"true",viewBox:"64 64 896 896",focusable:"false",fill:"currentColor",children:[n("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"}),n("path",{d:"M464 336a48 48 0 1096 0 48 48 0 10-96 0zm72 112h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8z"})]}),error:t("svg",{"aria-hidden":"true",viewBox:"64 64 896 896",focusable:"false",fill:"currentColor",children:[n("path",{d:"M685.4 354.8c0-4.4-3.6-8-8-8l-66 .3L512 465.6l-99.3-118.4-66.1-.3c-4.4 0-8 3.5-8 8 0 1.9.7 3.7 1.9 5.2l130.1 155L340.5 670a8.32 8.32 0 00-1.9 5.2c0 4.4 3.6 8 8 8l66.1-.3L512 564.4l99.3 118.4 66 .3c4.4 0 8-3.5 8-8 0-1.9-.7-3.7-1.9-5.2L553.5 515l130.1-155c1.2-1.4 1.8-3.3 1.8-5.2z"}),n("path",{d:"M512 65C264.6 65 64 265.6 64 513s200.6 448 448 448 448-200.6 448-448S759.4 65 512 65zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"})]}),success:t("svg",{"aria-hidden":"true",viewBox:"64 64 896 896",focusable:"false",fill:"currentColor",children:[n("path",{d:"M699 353h-46.9c-10.2 0-19.9 4.9-25.9 13.3L469 584.3l-71.2-98.8c-6-8.3-15.6-13.3-25.9-13.3H325c-6.5 0-10.3 7.4-6.5 12.7l124.6 172.8a31.8 31.8 0 0051.7 0l210.6-292c3.9-5.3.1-12.7-6.4-12.7z"}),n("path",{d:"M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"})]}),warning:n("svg",{"aria-hidden":"true",viewBox:"64 64 896 896",focusable:"false",fill:"currentColor",children:n("path",{d:"M464 720a48 48 0 1096 0 48 48 0 10-96 0zm16-304v184c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V416c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8zm475.7 440l-416-720c-6.2-10.7-16.9-16-27.7-16s-21.6 5.3-27.7 16l-416 720C56 877.4 71.4 904 96 904h832c24.6 0 40-26.6 27.7-48zm-783.5-27.9L512 239.9l339.8 588.2H172.2z"})})}[e]))(i):s,h="string"==typeof h?+h:h;const f=e(null),{remove:u,position:x}=b(),y=e();r((()=>(h&&(y.current=setTimeout((()=>{u(w,f)}),h)),()=>{clearTimeout(y.current)})),[]);const v=e(),[k,z]=o(0);return r((()=>(h&&(v.current=setInterval((()=>{k<100?z((n=>n+1)):clearInterval(v.current)}),h/100)),()=>{clearInterval(v.current)})),[k]),t("div",{style:{"--elm-translate":g[x]},className:l(p[i],"animate-toastIn","flex justify-start items-center overflow-x-hidden overflow-y-auto rounded-md shadow-lg my-3 relative p-2"),ref:f,role:"alert",children:[!!h&&n("div",{className:l("absolute bottom-0 right-0 left-0 w-full h-[5px] rounded-md ",`bg-${i} dark:bg-${i}`),children:n("span",{className:"absolute bg-neutral-200 left-0 top-0 bottom-0 h-full",style:{width:`${k}%`}})}),s&&n("div",{className:l(m[i],"flex p-2 rounded-full"),children:t("div",{className:"inline-flex justify-center items-center w-4 h-4",children:[t("span",{className:"sr-only",children:[i," Icon"]}),s]})}),t("div",{className:"flex justify-between items-start flex-1 ",children:[n("div",{className:"text-sm font-semibold break-words w-[95%] max-w-[95%] p-3",children:d}),t("button",{"aria-label":"Close",onClick:()=>{u(w,f)},className:" w-[5%] max-w-[5%] items-center dark:text-white hover:text-gray-900 $round10%ed-md focus:ring-2 focus:ring-gray-300 dark:hover:text-white",children:[n("span",{className:"sr-only",children:"Close"}),c]})]})]})},h=a({add:()=>{},remove:()=>{},position:"topRight"}),b=()=>i(h),f=()=>{const{add:n}=i(h);return{addToast:n}},u=({children:e})=>{const[r,a]=o([]),[i,s]=o("topRight");return t(h.Provider,{value:{add:n=>{n.position&&n.position!==i&&s(n.position),a((t=>[...t,{...n,id:(1e4*Math.random()*Date.now()).toString()}]))},remove:(n,t)=>{t?.current?.classList.remove("animate-toastIn"),t?.current?.classList.add("animate-toastOut"),t?.current?.addEventListener("animationend",(()=>{a((t=>t.filter((t=>t.id!==n))))}))},position:i},children:[e,n("div",{className:l(d[i],"fixed w-screen max-w-xs z-100"),children:r.map((t=>n(w,{...t},t.id)))})]})};export{u as ToastProvider,f as useReactToast};