@konstructio/ui 0.1.2-alpha.98 → 0.1.3

package/dist/components/TimePicker/components/MinutesList/MinutesList.js

@@ -1,68 +1,68 @@
-import { t as s } from "../../../../utils-COaoD3PI.js";
-import { useTimePickerContext as h } from "../../contexts/time-picker.hook.js";
-import { buttonVariants as d, liVariants as M, ulVariants as S } from "../../TimePicker.variants.js";
-import { useCallback as p, useEffect as b, useRef as m } from "react";
-import { jsx as c } from "react/jsx-runtime";
-var D = ({ minutes: o, scrollBehavior: u, onClose: n }) => {
-  const i = m(null), y = m(o), { isTyping: f, onSelectMinute: l } = h();
-  b(() => {
+import { t as l } from "../../../../utils-DnIJruo0.js";
+import { buttonVariants as h, liVariants as k, ulVariants as d } from "../../TimePicker.variants.js";
+import { useTimePickerContext as M } from "../../contexts/time-picker.hook.js";
+import { useEffect as p, useRef as m } from "react";
+import { jsx as n } from "react/jsx-runtime";
+var S = ({ minutes: a, scrollBehavior: s, onClose: c }) => {
+  const i = m(null), y = m(a), { isTyping: u, onSelectMinute: f } = M();
+  p(() => {
     const t = i.current;
     if (t) {
       const e = `0${y.current}`.slice(-2);
       t.querySelector(`[data-value="${e}"]`)?.scrollIntoView({
-        behavior: u,
+        behavior: s,
         block: "center"
       });
     }
-  }, [u]), b(() => {
-    if (!f) return;
+  }, [s]), p(() => {
+    if (!u) return;
     const t = i.current;
     if (t) {
-      const e = `0${o}`.slice(-2);
+      const e = `0${a}`.slice(-2);
       t.querySelector(`[data-value="${e}"]`)?.scrollIntoView({
         behavior: "instant",
         block: "center"
       });
     }
-  }, [o, f]);
-  const k = p((t, e) => {
-    l(t), e.currentTarget?.blur();
-  }, [l]), w = p((t, e) => {
-    const a = i.current?.querySelectorAll("button");
-    if (!a) return;
+  }, [a, u]);
+  const b = (t, e) => {
+    f(t), e.currentTarget?.blur();
+  }, w = (t, e) => {
+    const o = i.current?.querySelectorAll("button");
+    if (!o) return;
     let r = e;
     if (t.key === "ArrowDown" || t.key === "Tab" && !t.shiftKey)
       t.preventDefault(), r = (e + 1) % 60;
     else if (t.key === "ArrowUp" || t.key === "Tab" && t.shiftKey)
       t.preventDefault(), r = (e - 1 + 60) % 60;
     else if (t.key === "Enter") {
-      if (t.preventDefault(), l(e), n) {
-        n();
+      if (t.preventDefault(), f(e), c) {
+        c();
         return;
       }
       document.querySelector('[aria-label="meridian"]')?.querySelector('li[data-active="true"] button')?.focus();
       return;
     }
-    r !== e && a[r]?.focus();
-  }, [l, n]);
-  return /* @__PURE__ */ c("ul", {
+    r !== e && o[r]?.focus();
+  };
+  return /* @__PURE__ */ n("ul", {
     ref: i,
-    className: s(S()),
+    className: l(d()),
     "aria-label": "minutes",
     role: "listbox",
     children: Array.from({ length: 60 }, (t, e) => {
-      const a = o === e;
-      return /* @__PURE__ */ c("li", {
-        className: s(M()),
+      const o = a === e;
+      return /* @__PURE__ */ n("li", {
+        className: l(k()),
         "data-value": `0${e}`.slice(-2),
-        "data-active": a,
+        "data-active": o,
         role: "presentation",
-        children: /* @__PURE__ */ c("button", {
+        children: /* @__PURE__ */ n("button", {
           type: "button",
           role: "option",
-          tabIndex: a ? 0 : -1,
-          className: s(d()),
-          onClick: (r) => k(e, r),
+          tabIndex: o ? 0 : -1,
+          className: l(h()),
+          onClick: (r) => b(e, r),
           onKeyDown: (r) => w(r, e),
           children: `0${e}`.slice(-2)
         })
@@ -70,7 +70,7 @@ var D = ({ minutes: o, scrollBehavior: u, onClose: n }) => {
     })
   });
 };
-D.displayName = "MinutesList";
+S.displayName = "MinutesList";
 export {
-  D as MinutesList
+  S as MinutesList
 };

package/dist/components/TimePicker/components/Wrapper/Wrapper.js

@@ -1,142 +1,153 @@
-import { t as I } from "../../../../utils-COaoD3PI.js";
-import { t as X } from "../../../../chevron-down-T3Rx8Nc7.js";
-import { Typography as N } from "../../../Typography/Typography.js";
-import { parseTimeString as S } from "../../utils/index.js";
-import { useTimePickerContext as Y } from "../../contexts/time-picker.hook.js";
-import { timePickerVariants as Z } from "../../TimePicker.variants.js";
-import { WrapperList as _ } from "../WrapperList/WrapperList.js";
-import { useCallback as u, useEffect as A, useId as ee, useRef as T, useState as $ } from "react";
-import { jsx as d, jsxs as m } from "react/jsx-runtime";
-var ce = ({ name: D, label: M, isRequired: O, scrollBehavior: R, className: V, listClassName: F, listItemClassName: W, listItemButtonClassName: j, disabled: n, mode: E = "select", showList: y = !0, error: B, placeholder: L }) => {
-  const H = ee(), [f, o] = $(!1), g = T(!1), w = T(null), P = T(null), { format: l, formattedTime: c, setTimeDirectly: h, setIsTyping: s } = Y(), x = D ?? `time-${H}`, [v, b] = $(c), [K, i] = $(), k = B || K;
-  A(() => {
-    g.current || (b(c), i(void 0));
-  }, [c]);
-  const U = u(() => {
-    n || o((t) => !t);
-  }, [n]), q = u(() => {
-    !n && y && o(!0), i(void 0);
-  }, [n, y]), z = u((t) => {
-    t.target !== P.current && (g.current = !1, s(!1));
-  }, [s]), G = u((t) => {
-    if (w.current?.contains(t.relatedTarget)) return;
-    g.current = !1, s(!1), o(!1);
+import { t as te } from "../../../../chevron-down-BODx0Q7h.js";
+import { Typography as T } from "../../../Typography/Typography.js";
+import { useClickOutside as re } from "../../../../hooks/useClickOutside.js";
+import { t as M } from "../../../../utils-DnIJruo0.js";
+import { useTimePickerContext as ae } from "../../contexts/time-picker.hook.js";
+import { timePickerVariants as oe } from "../../TimePicker.variants.js";
+import { parseTimeString as V } from "../../utils/index.js";
+import { WrapperList as ne } from "../WrapperList/WrapperList.js";
+import { useCallback as ie, useEffect as F, useId as le, useRef as E, useState as P } from "react";
+import { jsx as d, jsxs as f } from "react/jsx-runtime";
+var xe = ({ ariaLabel: g, id: W, name: j, label: v, isRequired: y, scrollBehavior: B, className: H, listClassName: R, listItemClassName: K, listItemButtonClassName: U, disabled: c, mode: S = "select", showList: k = !0, error: q, placeholder: z }) => {
+  const G = le(), [o, n] = P(!1), h = E(!1), I = E(null), A = E(null), { format: x, formattedTime: p, setTimeDirectly: D, setIsTyping: w } = ae(), i = W ?? `time-${G}`, $ = `${i}-label`, O = `${i}-listbox`, C = `${i}-error`, [N, b] = P(p), [J, l] = P(), r = q || J;
+  F(() => {
+    h.current || (b(p), l(void 0));
+  }, [p]);
+  const Q = () => {
+    c || n((t) => !t);
+  }, X = () => {
+    !c && k && n(!0), l(void 0);
+  }, Y = (t) => {
+    t.target !== A.current && (h.current = !1, w(!1));
+  }, Z = (t) => {
+    if (I.current?.contains(t.relatedTarget)) return;
+    h.current = !1, w(!1), n(!1);
     const a = t.currentTarget.value.trim();
     if (a === "") {
-      i(void 0);
+      l(void 0);
       return;
     }
-    const e = S(a, l);
+    const e = V(a, x);
     if (e) {
-      i(void 0), h(e);
-      const r = e.getHours(), p = e.getMinutes().toString().padStart(2, "0");
-      b(l === "24" ? `${r.toString().padStart(2, "0")}:${p}` : `${r % 12 || 12}:${p} ${r >= 12 ? "PM" : "AM"}`);
-    } else i("Invalid time");
-  }, [
-    l,
-    h,
-    s
-  ]), J = u((t) => {
+      l(void 0), D(e);
+      const s = e.getHours(), u = e.getMinutes().toString().padStart(2, "0");
+      if (x === "24") b(`${s.toString().padStart(2, "0")}:${u}`);
+      else {
+        const m = s % 12 || 12;
+        b(`${m}:${u} ${s >= 12 ? "PM" : "AM"}`);
+      }
+    } else l("Invalid time");
+  }, _ = (t) => {
     const a = t.target.value;
     let e = "";
-    g.current = !0, s(!0);
-    const r = a.length < v.length;
-    if (l === "12") {
-      const C = a.replace(/[^0-9:apmAPM\s]/g, "").replace(/[apm]/gi, (Q) => Q.toUpperCase());
-      C.match(/^(\d{0,2}):?(\d{0,2})\s?(A|AM|P|PM)?$/i) || C === "" ? (e = C.slice(0, 8), !r && /^\d{2}$/.test(e) && (e = e + ":")) : e = v;
+    h.current = !0, w(!0);
+    const s = a.length < N.length;
+    if (x === "12") {
+      const m = a.replace(/[^0-9:apmAPM\s]/g, "").replace(/[apm]/gi, (ee) => ee.toUpperCase());
+      m.match(/^(\d{0,2}):?(\d{0,2})\s?(A|AM|P|PM)?$/i) || m === "" ? (e = m.slice(0, 8), !s && /^\d{2}$/.test(e) && (e = e + ":")) : e = N;
     } else
-      e = a.replace(/[^0-9:]/g, "").replace(/:+/g, ":").slice(0, 5), !r && /^\d{2}$/.test(e) && (e = e + ":");
-    b(e), i(void 0);
-    const p = S(e, l);
-    p && h(p);
-  }, [
-    l,
-    v,
-    h,
-    s
-  ]);
-  return A(() => {
-    const t = new AbortController(), a = (r) => {
-      r.key === "Escape" && o(!1);
-    }, e = (r) => {
-      w.current?.contains(r.target) || o(!1);
+      e = a.replace(/[^0-9:]/g, "").replace(/:+/g, ":").slice(0, 5), !s && /^\d{2}$/.test(e) && (e = e + ":");
+    b(e), l(void 0);
+    const u = V(e, x);
+    u && D(u);
+  }, L = ie(() => {
+    n(!1);
+  }, []);
+  return re(I, L), F(() => {
+    const t = new AbortController(), a = (e) => {
+      e.key === "Escape" && n(!1);
     };
-    return document.addEventListener("mousedown", e, { signal: t.signal }), document.addEventListener("keydown", a, { signal: t.signal }), () => {
+    return document.addEventListener("keydown", a, { signal: t.signal }), () => {
       t.abort();
     };
-  }, []), /* @__PURE__ */ m("div", {
-    ref: w,
-    onMouseDown: E === "input" ? z : void 0,
-    className: I("w-full", "text-slate-800", "text-sm", "flex", "flex-col", "gap-2"),
+  }, []), /* @__PURE__ */ f("div", {
+    ref: I,
+    onMouseDown: S === "input" ? Y : void 0,
+    className: M("w-full", "text-slate-800", "text-sm", "flex", "flex-col", "gap-2"),
     children: [
-      M ? /* @__PURE__ */ m(N, {
+      v ? /* @__PURE__ */ f(T, {
         component: "label",
         variant: "labelLarge",
-        htmlFor: x,
+        id: $,
+        htmlFor: i,
         className: "font-medium",
         children: [
-          M,
+          v,
           " ",
-          O && /* @__PURE__ */ d(N, {
+          y && /* @__PURE__ */ d(T, {
             component: "span",
+            "aria-hidden": "true",
             className: "text-red-600 dark:text-red-500 text-sm font-normal",
             children: "*"
           })
         ]
       }) : null,
-      /* @__PURE__ */ m("div", {
+      /* @__PURE__ */ f("div", {
         className: "relative",
-        children: [E === "select" ? /* @__PURE__ */ m("button", {
-          "aria-label": x,
-          "aria-haspopup": "listbox",
-          "aria-expanded": "true",
-          "aria-controls": "time-options",
-          className: I(Z({ className: V }), n && "opacity-50 cursor-not-allowed"),
-          "data-open": f,
-          onClick: U,
-          disabled: n,
-          children: [c, /* @__PURE__ */ d(X, {
-            className: "w-4 h-4 transition-all text-gray-400 data-[open=true]:rotate-180",
-            "data-open": f
-          })]
-        }) : /* @__PURE__ */ m("div", {
+        children: [/* @__PURE__ */ f("div", {
           className: "flex flex-col gap-1",
-          children: [/* @__PURE__ */ d("input", {
-            ref: P,
+          children: [S === "select" ? /* @__PURE__ */ f("button", {
+            type: "button",
+            id: i,
+            "aria-label": g,
+            "aria-labelledby": !g && v ? $ : void 0,
+            "aria-haspopup": "listbox",
+            "aria-expanded": o,
+            "aria-controls": o && k ? O : void 0,
+            "aria-invalid": !!r || void 0,
+            "aria-describedby": r ? C : void 0,
+            "aria-required": y || void 0,
+            className: M(oe({ className: H }), c && "opacity-50 cursor-not-allowed"),
+            "data-open": o,
+            onClick: Q,
+            disabled: c,
+            children: [p, /* @__PURE__ */ d(te, {
+              className: "w-4 h-4 transition-all text-gray-400 data-[open=true]:rotate-180",
+              "data-open": o
+            })]
+          }) : /* @__PURE__ */ d("input", {
+            ref: A,
             type: "text",
-            "aria-label": x,
-            value: v,
-            onChange: J,
-            onFocus: q,
-            onBlur: G,
-            disabled: n,
-            "data-error": !!k,
-            "data-open": f,
-            placeholder: L,
-            className: I("w-full", "h-10", "px-2.5", "text-sm", "rounded", "border", "border-gray-300", "bg-white", "text-slate-800", "transition-all", "placeholder:text-slate-400", "focus-visible:outline-none", "data-[open=true]:ring-1", "data-[open=true]:ring-aurora-500", "dark:bg-metal-800", "dark:border-metal-700", "dark:text-white", "dark:placeholder:text-metal-300", "dark:data-[open=true]:ring-aurora-500", "disabled:cursor-not-allowed", "disabled:bg-gray-50", "disabled:text-slate-500", "dark:disabled:bg-metal-900", "dark:disabled:text-metal-400", { "border-red-600 data-[open=true]:border-red-600 data-[open=true]:ring-transparent dark:border-red-500": k })
-          }), k && /* @__PURE__ */ d(N, {
+            id: i,
+            "aria-label": g,
+            "aria-labelledby": !g && v ? $ : void 0,
+            "aria-invalid": !!r || void 0,
+            "aria-describedby": r ? C : void 0,
+            "aria-required": y || void 0,
+            value: N,
+            onChange: _,
+            onFocus: X,
+            onBlur: Z,
+            disabled: c,
+            "data-error": !!r,
+            "data-open": o,
+            placeholder: z,
+            className: M("w-full", "h-10", "px-2.5", "text-sm", "rounded", "border", "border-gray-300", "bg-white", "text-slate-800", "transition-all", "placeholder:text-slate-400", "focus-visible:outline-none", "data-[open=true]:ring-1", "data-[open=true]:ring-aurora-500", "dark:bg-metal-800", "dark:border-metal-700", "dark:text-white", "dark:placeholder:text-metal-300", "dark:data-[open=true]:ring-aurora-500", "disabled:cursor-not-allowed", "disabled:bg-gray-50", "disabled:text-slate-500", "dark:disabled:bg-metal-900", "dark:disabled:text-metal-400", { "border-red-600 data-[open=true]:border-red-600 data-[open=true]:ring-transparent dark:border-red-500": r })
+          }), r && /* @__PURE__ */ d(T, {
             component: "span",
+            id: C,
             className: "text-red-600 dark:text-red-500 text-xs",
-            children: k
+            children: r
           })]
-        }), y && /* @__PURE__ */ d(_, {
-          isOpen: f,
-          scrollBehavior: R,
-          listClassName: F,
-          listItemClassName: W,
-          listItemButtonClassName: j,
-          onClose: () => o(!1)
+        }), k && /* @__PURE__ */ d(ne, {
+          id: O,
+          isOpen: o,
+          scrollBehavior: B,
+          listClassName: R,
+          listItemClassName: K,
+          listItemButtonClassName: U,
+          onClose: () => n(!1)
         })]
       }),
       /* @__PURE__ */ d("input", {
         type: "hidden",
-        name: x,
-        value: c,
+        name: j,
+        value: p,
         className: "hidden"
       })
     ]
   });
 };
 export {
-  ce as Wrapper
+  xe as Wrapper
 };

package/dist/components/TimePicker/components/WrapperList/WrapperList.js

@@ -1,41 +1,41 @@
-import { t as s } from "../../../../utils-COaoD3PI.js";
-import { getHours as a, getMinutes as x } from "../../utils/index.js";
-import { useTimePickerContext as g } from "../../contexts/time-picker.hook.js";
+import { t as a } from "../../../../utils-DnIJruo0.js";
+import { useTimePickerContext as s } from "../../contexts/time-picker.hook.js";
+import { getHours as x, getMinutes as g } from "../../utils/index.js";
 import { HoursList as b } from "../HoursList/HoursList.js";
-import { MeridianList as M } from "../MeridianList/MeridianList.js";
-import { MinutesList as h } from "../MinutesList/MinutesList.js";
-import { useMemo as d } from "react";
-import { jsx as t, jsxs as k } from "react/jsx-runtime";
-var W = ({ isOpen: p, scrollBehavior: m, listClassName: o, listItemClassName: e, listItemButtonClassName: i, onClose: n }) => {
-  const { time: r, format: u } = g(), f = d(() => a(r), [r]), c = d(() => x(r), [r]);
-  return p ? /* @__PURE__ */ k("div", {
+import { MeridianList as h } from "../MeridianList/MeridianList.js";
+import { MinutesList as k } from "../MinutesList/MinutesList.js";
+import { jsx as i, jsxs as L } from "react/jsx-runtime";
+var T = ({ id: d, isOpen: p, scrollBehavior: t, listClassName: r, listItemClassName: o, listItemButtonClassName: e, onClose: m }) => {
+  const { time: n, format: u } = s(), f = x(n), c = g(n);
+  return p ? /* @__PURE__ */ L("div", {
+    id: d,
     role: "group",
-    className: s("flex", "gap-1.5", "p-2", "rounded-md", "shadow", "w-max", "max-h-54", "absolute", "bg-white", "z-20", "animate-in", "fade-in-0", "zoom-in-95", "dark:bg-metal-800", "dark:border", "dark:border-metal-700", "mt-1"),
+    className: a("flex", "gap-1.5", "p-2", "rounded-md", "shadow", "w-max", "max-h-54", "absolute", "bg-white", "z-20", "animate-in", "fade-in-0", "zoom-in-95", "dark:bg-metal-800", "dark:border", "dark:border-metal-700", "mt-1"),
     children: [
-      /* @__PURE__ */ t(b, {
+      /* @__PURE__ */ i(b, {
         hours: f,
-        scrollBehavior: m,
-        listClassName: o,
-        listItemClassName: e,
-        listItemButtonClassName: i
+        scrollBehavior: t,
+        listClassName: r,
+        listItemClassName: o,
+        listItemButtonClassName: e
       }),
-      /* @__PURE__ */ t(h, {
+      /* @__PURE__ */ i(k, {
         minutes: c,
-        scrollBehavior: m,
-        listClassName: o,
-        listItemClassName: e,
-        listItemButtonClassName: i,
-        onClose: u === "24" ? n : void 0
+        scrollBehavior: t,
+        listClassName: r,
+        listItemClassName: o,
+        listItemButtonClassName: e,
+        onClose: u === "24" ? m : void 0
       }),
-      /* @__PURE__ */ t(M, {
-        listClassName: o,
-        listItemClassName: e,
-        listItemButtonClassName: i,
-        onClose: n
+      /* @__PURE__ */ i(h, {
+        listClassName: r,
+        listItemClassName: o,
+        listItemButtonClassName: e,
+        onClose: m
       })
     ]
   }) : null;
 };
 export {
-  W as WrapperList
+  T as WrapperList
 };

package/dist/components/TimePicker/contexts/time-picker.provider.js

@@ -1,11 +1,11 @@
 import { getFormattedTime as g } from "../utils/index.js";
 import { TimePickerContext as v } from "./time-picker.context.js";
-import { useCallback as r, useEffect as H, useMemo as y, useState as u } from "react";
-import { jsx as k } from "react/jsx-runtime";
-var j = ({ children: f, time: c, format: m, onChange: l }) => {
-  const [i, w] = u(m), [e, a] = u(() => c), [T, D] = u(!1), n = y(() => e ? e.getHours() < 12 : !0, [e]), o = r((t) => {
+import { useCallback as r, useEffect as H, useState as u } from "react";
+import { jsx as y } from "react/jsx-runtime";
+var h = ({ children: f, time: c, format: m, onChange: l }) => {
+  const [i, w] = u(m), [e, a] = u(() => c), [T, D] = u(!1), n = e ? e.getHours() < 12 : !0, o = r((t) => {
     a(t), l?.(t);
-  }, [l]), M = r((t) => {
+  }, [l]), S = r((t) => {
     const s = e ? new Date(e) : /* @__PURE__ */ new Date();
     i === "12" ? t === 12 ? s.setHours(n ? 0 : 12) : s.setHours(n ? t : t + 12) : s.setHours(t), e || s.setMinutes(0, 0, 0), o(s);
   }, [
@@ -13,7 +13,7 @@ var j = ({ children: f, time: c, format: m, onChange: l }) => {
     n,
     e,
     o
-  ]), S = r((t) => {
+  ]), M = r((t) => {
     const s = e ? new Date(e) : /* @__PURE__ */ new Date();
     e || s.setHours(0, 0, 0, 0), s.setMinutes(t), o(s);
   }, [e, o]), p = r(() => {
@@ -37,15 +37,15 @@ var j = ({ children: f, time: c, format: m, onChange: l }) => {
     a(c);
   }, [c]), H(() => {
     w(m);
-  }, [m]), /* @__PURE__ */ k(v.Provider, {
+  }, [m]), /* @__PURE__ */ y(v.Provider, {
     value: {
       time: e,
       format: i,
       formattedTime: e ? g(e, i) : "",
       isAM: n,
       isTyping: T,
-      onSelectHour: M,
-      onSelectMinute: S,
+      onSelectHour: S,
+      onSelectMinute: M,
       onSelectAM: p,
       onSelectPM: d,
       setTimeDirectly: P,
@@ -55,5 +55,5 @@ var j = ({ children: f, time: c, format: m, onChange: l }) => {
   });
 };
 export {
-  j as TimePickerProvider
+  h as TimePickerProvider
 };

package/dist/components/Toast/Toast.js

@@ -1,5 +1,72 @@
 "use client";
-import { t as o } from "../../Toast-CWyLcmNX.js";
+import { useIsHydrated as D } from "../../hooks/useIsHydrated/useIsHydrated.js";
+import { t as L } from "../../utils-DnIJruo0.js";
+import { ToastCard as b } from "./components/ToastCard/ToastCard.js";
+import { TOAST_TRANSITION as w } from "./constants/index.js";
+import { useStackExpansion as C } from "./hooks/useStackExpansion/useStackExpansion.js";
+import { useToastHeights as k } from "./hooks/useToastHeights/useToastHeights.js";
+import { useToastSource as B } from "./hooks/useToastSource/useToastSource.js";
+import { computeStackLayout as G } from "./utils/compute-stack-layout/compute-stack-layout.js";
+import { useEffect as P } from "react";
+import { createPortal as j } from "react-dom";
+import { jsx as r } from "react/jsx-runtime";
+import { AnimatePresence as z, motion as F, useReducedMotion as K } from "motion/react";
+var U = ({ autoWidth: l = !1, className: u, closeLabel: p = "Close toast", container: g, duration: n, hoverBehavior: h = "resume", isPortal: T = !0, label: S = "Notifications", limit: a, maxVisible: m = 3, theme: v, toasts: s, onDismiss: H }) => {
+  const c = K(), A = D(), { heights: E, setHeight: y, removeHeight: I } = k(), { expanded: _, regionRef: x, regionHandlers: M } = C(), t = B({
+    toasts: s,
+    onDismiss: H
+  });
+  P(() => {
+    s || t.configure({
+      duration: n,
+      limit: a
+    });
+  }, [
+    s,
+    t.configure,
+    n,
+    a
+  ]);
+  const e = t.toasts.slice().reverse(), d = _ && e.length > 0, { offsets: N, frontHeight: O, regionHeight: R } = G({
+    toasts: e,
+    heights: E,
+    expanded: d,
+    maxVisible: m
+  }), f = /* @__PURE__ */ r("section", {
+    ref: x,
+    "aria-label": S,
+    "data-theme": v,
+    className: L("fixed right-6 bottom-6 z-100 w-97.5 max-w-[calc(100vw-3rem)]", u),
+    style: { pointerEvents: e.length > 0 ? void 0 : "none" },
+    ...M,
+    children: /* @__PURE__ */ r(F.ol, {
+      className: "relative m-0 list-none p-0",
+      animate: { height: R },
+      transition: c ? { duration: 0 } : w,
+      children: /* @__PURE__ */ r(z, { children: e.map((i, o) => /* @__PURE__ */ r(b, {
+        autoWidth: l,
+        closeLabel: p,
+        expanded: d,
+        frontHeight: O,
+        index: o,
+        offset: N[o] ?? 0,
+        reducedMotion: !!c,
+        restartOnLeave: h === "restart",
+        resumeDelay: (e.length - 1 - o) * 300,
+        toast: i,
+        total: e.length,
+        visible: o < m,
+        onDismiss: () => {
+          t.dismiss(i.id);
+        },
+        onExited: I,
+        onHeightChange: y
+      }, i.id)) })
+    })
+  });
+  return T ? A ? j(f, g ?? document.body) : null : f;
+};
+U.displayName = "KonstructToast";
 export {
-  o as Toast
+  U as Toast
 };