@companix/uikit 0.1.24 → 0.1.26

package/dist/DrawerMobile/MobileDrawer.scss

@@ -43,6 +43,7 @@
   margin-left: auto;
   margin-right: auto;
   height: 5px;
+  min-height: 5px;
   width: 32px;
   border-radius: 1rem;
   touch-action: pan-y;

package/dist/__hooks/use-rerender.d.ts

@@ -0,0 +1 @@
+export declare const useRerender: () => () => void;

package/dist/__hooks/use-sync-submit.d.ts

@@ -0,0 +1 @@
+export declare const useSyncSubmit: () => [boolean, (isSubmitted: boolean) => void];

package/dist/bundle.es.js

@@ -1,13 +1,13 @@
 import { Avatar as o } from "./bundle.es2.js";
 import { avatarSizes as p } from "./bundle.es3.js";
-import { getBadgeIconSizeByImageBaseSize as m, getFallbackIconSizeByImageBaseSize as x, getInitialsFontSize as f } from "./bundle.es4.js";
+import { getBadgeIconSizeByImageBaseSize as a, getFallbackIconSizeByImageBaseSize as x, getInitialsFontSize as f } from "./bundle.es4.js";
 import { Button as s } from "./bundle.es5.js";
 import { ButtonGroup as n } from "./bundle.es6.js";
 import { Spinner as S } from "./bundle.es7.js";
 import { Scrollable as g } from "./bundle.es8.js";
 import { ImitateScroll as d } from "./bundle.es9.js";
 import { Segments as P } from "./bundle.es10.js";
-import { Popover as b } from "./bundle.es11.js";
+import { Popover as y } from "./bundle.es11.js";
 import { Tooltip as I } from "./bundle.es12.js";
 import { Select as k } from "./bundle.es13.js";
 import { SelectTags as w } from "./bundle.es14.js";
@@ -25,7 +25,7 @@ import { PopupLayout as Z } from "./bundle.es25.js";
 import { AlertDialog as $ } from "./bundle.es26.js";
 import { LoadingButton as re } from "./bundle.es27.js";
 import { Tabs as te } from "./bundle.es28.js";
-import { Countdown as ae } from "./bundle.es29.js";
+import { Countdown as me } from "./bundle.es29.js";
 import { TextArea as xe } from "./bundle.es30.js";
 import { DatePicker as ie } from "./bundle.es31.js";
 import { DateInput as le } from "./bundle.es32.js";
@@ -33,8 +33,8 @@ import { FileOverlay as ce } from "./bundle.es33.js";
 import { FormGroup as ue } from "./bundle.es34.js";
 import { TimePicker as De } from "./bundle.es35.js";
 import { Icon as he } from "./bundle.es36.js";
-import { ProgressBar as Be } from "./bundle.es37.js";
-import { Skeleton as ye } from "./bundle.es38.js";
+import { ProgressBar as be } from "./bundle.es37.js";
+import { Skeleton as Be } from "./bundle.es38.js";
 import { Blank as Te } from "./bundle.es39.js";
 import { ProgressRing as ve } from "./bundle.es40.js";
 import { WriteBar as Ae } from "./bundle.es41.js";
@@ -48,14 +48,15 @@ import { useBooleanState as Ue } from "./bundle.es48.js";
 import { useResizeTextarea as Xe } from "./bundle.es49.js";
 import { useLoading as _e } from "./bundle.es50.js";
 import { NowContextProvider as er, useNow as rr } from "./bundle.es51.js";
-import { createAlertAgent as tr } from "./bundle.es52.js";
-import { createToaster as ar } from "./bundle.es53.js";
-import { Toast as xr } from "./bundle.es54.js";
-import { DialogShell as ir, DrawerShell as sr, MobileDrawerShell as lr, createPopupRegistry as nr, usePopup as cr } from "./bundle.es55.js";
-import { createPopoversRegistry as ur } from "./bundle.es56.js";
-import { createScope as Dr, createStaticScope as dr } from "./bundle.es57.js";
-import { RemoveListener as Pr } from "./bundle.es58.js";
-import { MONDAY as br, addMonths as yr, createDayDisableChecker as Ir, endOfDay as Tr, endOfWeek as kr, isDayMinMaxRestricted as vr, isSameDate as wr, setMonth as Ar, setYear as Mr, startOfDay as Or, startOfWeek as Rr, subMonths as zr, useDayDisableCheker as Lr } from "./bundle.es59.js";
+import { useSyncSubmit as tr } from "./bundle.es52.js";
+import { createAlertAgent as mr } from "./bundle.es53.js";
+import { createToaster as xr } from "./bundle.es54.js";
+import { Toast as ir } from "./bundle.es55.js";
+import { DialogShell as lr, DrawerShell as nr, MobileDrawerShell as cr, createPopupRegistry as Sr, usePopup as ur } from "./bundle.es56.js";
+import { createPopoversRegistry as Dr } from "./bundle.es57.js";
+import { createScope as hr, createStaticScope as Pr } from "./bundle.es58.js";
+import { RemoveListener as yr } from "./bundle.es59.js";
+import { MONDAY as Ir, addMonths as Tr, createDayDisableChecker as kr, endOfDay as vr, endOfWeek as wr, isDayMinMaxRestricted as Ar, isSameDate as Mr, setMonth as Or, setYear as Rr, startOfDay as zr, startOfWeek as Lr, subMonths as Cr, useDayDisableCheker as Fr } from "./bundle.es60.js";
 export {
   $ as AlertDialog,
   o as Avatar,
@@ -64,13 +65,13 @@ export {
   n as ButtonGroup,
   G as Checkbox,
   je as ColorSchemeScript,
-  ae as Countdown,
+  me as Countdown,
   le as DateInput,
   ie as DatePicker,
   V as Dialog,
-  ir as DialogShell,
+  lr as DialogShell,
   J as Drawer,
-  sr as DrawerShell,
+  nr as DrawerShell,
   ze as DropArea,
   Le as DropAreaProvider,
   Oe as Editor,
@@ -81,25 +82,25 @@ export {
   M as Input,
   re as LoadingButton,
   Je as LocalStorageProvider,
-  br as MONDAY,
+  Ir as MONDAY,
   Q as MobileDrawer,
-  lr as MobileDrawerShell,
+  cr as MobileDrawerShell,
   er as NowContextProvider,
   L as NumberInput,
   R as OptionItem,
   F as OptionsList,
-  b as Popover,
+  y as Popover,
   Z as PopupLayout,
-  Be as ProgressBar,
+  be as ProgressBar,
   ve as ProgressRing,
   j as Radio,
   q as RadioGroup,
-  Pr as RemoveListener,
+  yr as RemoveListener,
   g as Scrollable,
   P as Segments,
   k as Select,
   w as SelectTags,
-  ye as Skeleton,
+  Be as Skeleton,
   S as Spinner,
   E as Switch,
   Ne as Table,
@@ -107,38 +108,39 @@ export {
   xe as TextArea,
   We as ThemeProvider,
   De as TimePicker,
-  xr as Toast,
+  ir as Toast,
   I as Tooltip,
   Ae as WriteBar,
-  yr as addMonths,
+  Tr as addMonths,
   p as avatarSizes,
   qe as colorSchemeScript,
-  tr as createAlertAgent,
-  Ir as createDayDisableChecker,
-  ur as createPopoversRegistry,
-  nr as createPopupRegistry,
-  Dr as createScope,
-  dr as createStaticScope,
-  ar as createToaster,
-  Tr as endOfDay,
-  kr as endOfWeek,
-  m as getBadgeIconSizeByImageBaseSize,
+  mr as createAlertAgent,
+  kr as createDayDisableChecker,
+  Dr as createPopoversRegistry,
+  Sr as createPopupRegistry,
+  hr as createScope,
+  Pr as createStaticScope,
+  xr as createToaster,
+  vr as endOfDay,
+  wr as endOfWeek,
+  a as getBadgeIconSizeByImageBaseSize,
   x as getFallbackIconSizeByImageBaseSize,
   f as getInitialsFontSize,
-  vr as isDayMinMaxRestricted,
-  wr as isSameDate,
-  Ar as setMonth,
-  Mr as setYear,
-  Or as startOfDay,
-  Rr as startOfWeek,
-  zr as subMonths,
+  Ar as isDayMinMaxRestricted,
+  Mr as isSameDate,
+  Or as setMonth,
+  Rr as setYear,
+  zr as startOfDay,
+  Lr as startOfWeek,
+  Cr as subMonths,
   Ue as useBooleanState,
-  Lr as useDayDisableCheker,
+  Fr as useDayDisableCheker,
   Ce as useDragEnter,
   _e as useLoading,
   Ke as useLocalStorage,
   rr as useNow,
-  cr as usePopup,
+  ur as usePopup,
   Xe as useResizeTextarea,
+  tr as useSyncSubmit,
   Ee as useTheme
 };

package/dist/bundle.es10.js

@@ -1,5 +1,5 @@
 import { jsx as r, jsxs as m } from "react/jsx-runtime";
-import { makeTabId as c, useTabSlider as i } from "./bundle.es60.js";
+import { makeTabId as c, useTabSlider as i } from "./bundle.es61.js";
 import { attr as o } from "@companix/utils-browser";
 import { useRef as u, useId as f } from "react";
 const h = ({ value: s, onChange: t, options: a }) => {

package/dist/bundle.es13.js

@@ -1,10 +1,10 @@
 import { jsx as l } from "react/jsx-runtime";
 import { useRef as L, useMemo as j, useImperativeHandle as k } from "react";
 import { Popover as q } from "./bundle.es11.js";
-import { useFroozeClosing as w } from "./bundle.es61.js";
-import { SelectInput as H } from "./bundle.es62.js";
-import { useScrollListController as M } from "./bundle.es63.js";
-import { OptionsPopover as N } from "./bundle.es64.js";
+import { useFroozeClosing as w } from "./bundle.es62.js";
+import { SelectInput as H } from "./bundle.es63.js";
+import { useScrollListController as M } from "./bundle.es64.js";
+import { OptionsPopover as N } from "./bundle.es65.js";
 import { mergeRefs as W } from "react-merge-refs";
 const Z = (t) => {
   const {

package/dist/bundle.es14.js

@@ -3,12 +3,12 @@ import { mergeRefs as T } from "react-merge-refs";
 import { useState as M, useRef as h, useMemo as j } from "react";
 import { matchPattern as q } from "@companix/utils-js";
 import { faXmark as V, faChevronDown as $ } from "@companix/icons-solid";
-import { useFroozeClosing as B } from "./bundle.es61.js";
+import { useFroozeClosing as B } from "./bundle.es62.js";
 import { Popover as L } from "./bundle.es11.js";
 import { Icon as g } from "./bundle.es36.js";
 import { attr as l, getActiveElementByAnotherElement as X, contains as G } from "@companix/utils-browser";
-import { OptionsPopover as H } from "./bundle.es64.js";
-import { arrays as v } from "./bundle.es65.js";
+import { OptionsPopover as H } from "./bundle.es65.js";
+import { arrays as v } from "./bundle.es66.js";
 const ne = (r) => {
   const {
     closeAfterSelect: C,

package/dist/bundle.es15.js

@@ -1,8 +1,8 @@
 import { jsx as t } from "react/jsx-runtime";
 import { forwardRef as b, useRef as R } from "react";
 import { mergeRefs as c } from "react-merge-refs";
-import { InputElement as x } from "./bundle.es66.js";
-import { InputContainer as I } from "./bundle.es67.js";
+import { InputElement as x } from "./bundle.es67.js";
+import { InputContainer as I } from "./bundle.es68.js";
 import g from "classnames";
 const N = b(
   ({

package/dist/bundle.es17.js

@@ -2,7 +2,7 @@ import { jsx as t } from "react/jsx-runtime";
 import C from "classnames";
 import { forwardRef as j, useRef as w } from "react";
 import { mergeRefs as y } from "react-merge-refs";
-import { InputContainer as F } from "./bundle.es67.js";
+import { InputContainer as F } from "./bundle.es68.js";
 import { NumericFormat as V } from "react-number-format";
 const D = j(
   ({

package/dist/bundle.es23.js

@@ -4,11 +4,11 @@ import G from "classnames";
 import * as E from "@radix-ui/react-dialog";
 import { VisuallyHidden as K } from "@radix-ui/react-visually-hidden";
 import { customCSS as oe } from "@companix/utils-browser";
-import { RemoveListener as se } from "./bundle.es58.js";
-import { DrawerContext as ie, useDrawerContext as J } from "./bundle.es68.js";
-import { set as R, reset as ae, composeRefs as Q, isInput as ce, isMobileFirefox as ue, getTranslate as W, isIOS as le, dampenValue as fe } from "./bundle.es69.js";
-import { usePreventScroll as de } from "./bundle.es70.js";
-import { DRAG_CLASS as j, VELOCITY_THRESHOLD as ge, CLOSE_THRESHOLD as me, SCROLL_LOCK_TIMEOUT as pe, TRANSITIONS as Y, WINDOW_TOP_OFFSET as he } from "./bundle.es71.js";
+import { RemoveListener as se } from "./bundle.es59.js";
+import { DrawerContext as ie, useDrawerContext as J } from "./bundle.es69.js";
+import { set as R, reset as ae, composeRefs as Q, isInput as ce, isMobileFirefox as ue, getTranslate as W, isIOS as le, dampenValue as fe } from "./bundle.es70.js";
+import { usePreventScroll as de } from "./bundle.es71.js";
+import { DRAG_CLASS as j, VELOCITY_THRESHOLD as ge, CLOSE_THRESHOLD as me, SCROLL_LOCK_TIMEOUT as pe, TRANSITIONS as Y, WINDOW_TOP_OFFSET as he } from "./bundle.es72.js";
 const we = (m) => {
   const { open: p, onOpenChange: l, onClosed: D, children: y, defaultOpen: S = !1, disableEsc: f } = m, [x, M] = t.useState(!1), [T, P] = t.useState(!1), [_, A] = t.useState(!1), v = t.useRef(null), H = t.useRef(null), I = t.useRef(null), L = t.useRef(null), o = t.useRef(null), d = t.useRef(!1), h = t.useRef(0), b = t.useRef(!1), N = t.useRef(!S), e = t.useRef(null), O = t.useRef(e.current?.getBoundingClientRect().height || 0), g = t.useRef(0), C = t.useRef(0), w = p ?? !1, V = t.useCallback(
     (r) => {

package/dist/bundle.es25.js

@@ -2,7 +2,7 @@ import { jsx as e, jsxs as n } from "react/jsx-runtime";
 import y from "classnames";
 import * as o from "@radix-ui/react-dialog";
 import { VisuallyHidden as l } from "@radix-ui/react-visually-hidden";
-import { RemoveListener as u } from "./bundle.es58.js";
+import { RemoveListener as u } from "./bundle.es59.js";
 const C = (t) => {
   const { open: i, onOpenChange: a, children: s, onClosed: c, disableEsc: p, overlay: r = {}, overlayRef: m, content: d = {}, contentRef: f } = t, h = (v) => {
     p && v.preventDefault();

package/dist/bundle.es26.js

@@ -1,7 +1,7 @@
 import { jsx as e, jsxs as a } from "react/jsx-runtime";
 import * as r from "@radix-ui/react-alert-dialog";
 import { Button as c } from "./bundle.es5.js";
-import { RemoveListener as N } from "./bundle.es58.js";
+import { RemoveListener as N } from "./bundle.es59.js";
 import { VisuallyHidden as u } from "@radix-ui/react-visually-hidden";
 const C = ({
   open: d,

package/dist/bundle.es28.js

@@ -1,5 +1,5 @@
 import { jsx as a, jsxs as b } from "react/jsx-runtime";
-import { useTabSlider as l, makeTabId as m } from "./bundle.es60.js";
+import { useTabSlider as l, makeTabId as m } from "./bundle.es61.js";
 import * as n from "@radix-ui/react-tabs";
 import { useRef as f, useId as T, createContext as u, useContext as c } from "react";
 const o = u({ baseId: "", containerRef: {} }), x = ({ children: s, value: e, onChange: r }) => {

package/dist/bundle.es29.js

@@ -1,23 +1,24 @@
 import { jsx as d, Fragment as p } from "react/jsx-runtime";
-import { getNextCandleTime as T, sleep as S, getTimes as x } from "@companix/utils-js";
-import { useRef as g, useState as v, useEffect as s } from "react";
-const n = (t) => String(t).padStart(2, "0"), j = ({ expiration: t, separator: m = ":", onExpired: a }) => {
-  const e = g(null), [, o] = v([]);
+import { useRerender as T } from "./bundle.es73.js";
+import { getNextCandleTime as x, sleep as S, getTimes as g } from "@companix/utils-js";
+import { useRef as v, useEffect as s } from "react";
+const n = (t) => String(t).padStart(2, "0"), C = ({ expiration: t, separator: m = ":", onExpired: i }) => {
+  const e = v(null), o = T();
   s(() => {
-    const c = Date.now(), f = T(c, "1s") - c;
+    const c = Date.now(), f = x(c, "1s") - c;
     return e.current && clearInterval(e.current), S(f).then(() => {
-      o([]), e.current = setInterval(() => {
-        o([]);
+      o(), e.current = setInterval(() => {
+        o();
       }, 1e3);
     }), () => {
       e.current && clearInterval(e.current);
     };
   }, [t]);
-  const r = t - Date.now(), { hours: i, minutes: u, seconds: l } = x(r);
+  const r = t - Date.now(), { hours: u, minutes: a, seconds: l } = g(r);
   return s(() => {
-    r <= 0 && (a?.(), e.current && clearInterval(e.current));
-  }, [r <= 0]), /* @__PURE__ */ d(p, { children: [n(i), n(u), n(l)].join(m) });
+    r <= 0 && (i?.(), e.current && clearInterval(e.current));
+  }, [r <= 0]), /* @__PURE__ */ d(p, { children: [n(u), n(a), n(l)].join(m) });
 };
 export {
-  j as Countdown
+  C as Countdown
 };

package/dist/bundle.es31.js

@@ -2,11 +2,11 @@ import { jsx as u } from "react/jsx-runtime";
 import { Popover as T } from "./bundle.es11.js";
 import { Input as w } from "./bundle.es15.js";
 import { useState as A, useRef as j } from "react";
-import { Calendar as E } from "./bundle.es72.js";
-import { useDayDisableCheker as N } from "./bundle.es59.js";
+import { Calendar as E } from "./bundle.es74.js";
+import { useDayDisableCheker as N } from "./bundle.es60.js";
 import { getNum as h, formatTime as v } from "@companix/utils-js";
-import { removeDigits as O } from "./bundle.es65.js";
-import { SelectRightElements as Y } from "./bundle.es73.js";
+import { removeDigits as O } from "./bundle.es66.js";
+import { SelectRightElements as Y } from "./bundle.es75.js";
 const i = {
   char: "-",
   toString: (e) => {

package/dist/bundle.es32.js

@@ -1,8 +1,8 @@
 import { jsxs as D, jsx as h } from "react/jsx-runtime";
 import { useMemo as M, useEffect as C } from "react";
 import { Select as c } from "./bundle.es13.js";
-import { createDateValidation as O, getMonthMaxDay as T } from "./bundle.es65.js";
-import { defaultMin as j, defaultMax as N, useCalendarOptions as V } from "./bundle.es74.js";
+import { createDateValidation as O, getMonthMaxDay as T } from "./bundle.es66.js";
+import { defaultMin as j, defaultMax as N, useCalendarOptions as V } from "./bundle.es76.js";
 const B = ({
   min: o = j,
   max: e = N,

package/dist/bundle.es35.js

@@ -1,8 +1,8 @@
 import { jsx as g } from "react/jsx-runtime";
 import { useRef as b, useMemo as I, useState as E, useCallback as A } from "react";
 import { getNum as S } from "@companix/utils-js";
-import { getTimesOptions as W, getTimeValue as q, removeDigits as w, convertTimeToOption as y } from "./bundle.es65.js";
-import { SelectRightElements as z } from "./bundle.es73.js";
+import { getTimesOptions as W, getTimeValue as q, removeDigits as w, convertTimeToOption as y } from "./bundle.es66.js";
+import { SelectRightElements as z } from "./bundle.es75.js";
 import { Select as F } from "./bundle.es13.js";
 import { Input as G } from "./bundle.es15.js";
 const o = {

package/dist/bundle.es41.js

@@ -3,7 +3,7 @@ import c from "classnames";
 import { Spinner as b } from "./bundle.es7.js";
 import { Icon as h } from "./bundle.es36.js";
 import { attr as N } from "@companix/utils-browser";
-import { WriteBarInput as u } from "./bundle.es75.js";
+import { WriteBarInput as u } from "./bundle.es77.js";
 const w = (a) => {
   const {
     before: e,

package/dist/bundle.es42.js

@@ -1,6 +1,6 @@
 import { escape as u, unescape as f, isElementNode as g } from "@companix/utils-browser";
-import { onElementKeyDownFactory as v } from "./bundle.es76.js";
-import { getEditorSelection as l, normalizeEditorText as a, getNodeTextContent as h, scrollSelectionIntoView as d, getTextSelectionOffsets as E } from "./bundle.es77.js";
+import { onElementKeyDownFactory as v } from "./bundle.es78.js";
+import { getEditorSelection as l, normalizeEditorText as a, getNodeTextContent as h, scrollSelectionIntoView as d, getTextSelectionOffsets as E } from "./bundle.es79.js";
 class k {
   element;
   prevText = "";

package/dist/bundle.es45.js

@@ -1,6 +1,6 @@
 import { jsx as u } from "react/jsx-runtime";
 import { useState as h, useEffect as c, createContext as f, useContext as w } from "react";
-import { getColorScheme as v, updateDOM as m } from "./bundle.es78.js";
+import { getColorScheme as v, updateDOM as m } from "./bundle.es80.js";
 const i = f({
   setColorScheme: () => {
   }

package/dist/bundle.es52.js

@@ -1,29 +1,14 @@
-import { jsx as i } from "react/jsx-runtime";
-import { hash as m } from "@companix/utils-js";
-import { useRef as n, useMemo as s } from "react";
-import { Viewport as p } from "./bundle.es79.js";
-const a = (t = {}) => {
-  const e = {
-    emit: (r) => {
-      console.error("uninitialized", r);
+import { useRef as n } from "react";
+import { useRerender as o } from "./bundle.es73.js";
+const c = () => {
+  const e = o(), r = n(!1);
+  return [
+    r.current,
+    (t) => {
+      r.current = t, e();
     }
-  };
-  return {
-    api: {
-      show: (r) => {
-        e.emit({ ...r, id: m() });
-      }
-    },
-    Viewport: () => {
-      const r = n(null);
-      return s(() => {
-        e.emit = (o) => {
-          r.current && r.current.showAlert(o);
-        };
-      }, []), /* @__PURE__ */ i(p, { ref: r, ...t });
-    }
-  };
+  ];
 };
 export {
-  a as createAlertAgent
+  c as useSyncSubmit
 };

package/dist/bundle.es53.js

@@ -1,41 +1,29 @@
-import { jsx as t } from "react/jsx-runtime";
-import { hash as r } from "@companix/utils-js";
-import { Viewport as a } from "./bundle.es80.js";
-import { useRef as c, useMemo as h } from "react";
-const m = (i = {}) => {
-  const o = {
-    showToast: (e) => {
-      console.error("uninitialized", e);
+import { jsx as i } from "react/jsx-runtime";
+import { hash as m } from "@companix/utils-js";
+import { useRef as n, useMemo as s } from "react";
+import { Viewport as p } from "./bundle.es81.js";
+const a = (t = {}) => {
+  const e = {
+    emit: (r) => {
+      console.error("uninitialized", r);
     }
   };
   return {
     api: {
-      show: (e) => {
-        const n = e.id ?? r();
-        return o.showToast({ ...e, id: n }), n;
+      show: (r) => {
+        e.emit({ ...r, id: m() });
       }
     },
-    Viewport: (e = {}) => {
-      const n = c(null);
-      return h(() => {
-        o.showToast = (s) => {
-          n.current && n.current.showToast(s);
+    Viewport: () => {
+      const r = n(null);
+      return s(() => {
+        e.emit = (o) => {
+          r.current && r.current.showAlert(o);
         };
-      }, []), /* @__PURE__ */ t(
-        a,
-        {
-          ref: n,
-          align: e.align ?? i.align,
-          closeIcon: e.closeIcon ?? i.closeIcon,
-          duration: e.duration ?? i.duration,
-          gap: e.gap ?? i.gap,
-          side: e.side ?? i.side,
-          swipeThreshold: e.swipeThreshold ?? i.swipeThreshold
-        }
-      );
+      }, []), /* @__PURE__ */ i(p, { ref: r, ...t });
     }
   };
 };
 export {
-  m as createToaster
+  a as createAlertAgent
 };

package/dist/bundle.es54.js

@@ -1,53 +1,41 @@
-import { jsxs as l, jsx as e } from "react/jsx-runtime";
-import * as t from "@radix-ui/react-toast";
-import { attr as T } from "@companix/utils-browser";
-import { useState as d, useRef as b, useEffect as j, useLayoutEffect as E } from "react";
-import { RemoveListener as I } from "./bundle.es58.js";
-const m = (o) => {
-  const [r, u] = d(!0), [p, f] = d(!1), s = b(null), {
-    appearance: C = "neutral",
-    icon: a,
-    title: n,
-    description: c,
-    duration: L,
-    closeIcon: h,
-    onClosing: v,
-    onClosed: N,
-    closable: x = !0,
-    onInitialized: g
-  } = o;
-  j(() => {
-    f(!0);
-  }, []), E(() => {
-    s.current && g(s.current);
-  }, []);
-  const R = (i) => {
-    i || v(), u(i);
+import { jsx as t } from "react/jsx-runtime";
+import { hash as r } from "@companix/utils-js";
+import { Viewport as a } from "./bundle.es82.js";
+import { useRef as c, useMemo as h } from "react";
+const m = (i = {}) => {
+  const o = {
+    showToast: (e) => {
+      console.error("uninitialized", e);
+    }
   };
-  return /* @__PURE__ */ l(
-    t.Root,
-    {
-      ref: s,
-      "data-expanded": !0,
-      "data-appearance": C,
-      "data-mounted": T(p),
-      className: "toaster",
-      open: r,
-      onOpenChange: R,
-      duration: L,
-      children: [
-        /* @__PURE__ */ e(I, { callback: N }),
-        a && /* @__PURE__ */ e("div", { className: "toaster-icon", children: a }),
-        /* @__PURE__ */ l("div", { className: "toaster-content", children: [
-          n && /* @__PURE__ */ e(t.Title, { className: "toaster-title", children: n }),
-          c && /* @__PURE__ */ e(t.Description, { className: "toaster-description", children: c })
-        ] }),
-        x && /* @__PURE__ */ e(m.Close, { className: "toaster-close toaster-close-placement", closeIcon: h })
-      ]
+  return {
+    api: {
+      show: (e) => {
+        const n = e.id ?? r();
+        return o.showToast({ ...e, id: n }), n;
+      }
+    },
+    Viewport: (e = {}) => {
+      const n = c(null);
+      return h(() => {
+        o.showToast = (s) => {
+          n.current && n.current.showToast(s);
+        };
+      }, []), /* @__PURE__ */ t(
+        a,
+        {
+          ref: n,
+          align: e.align ?? i.align,
+          closeIcon: e.closeIcon ?? i.closeIcon,
+          duration: e.duration ?? i.duration,
+          gap: e.gap ?? i.gap,
+          side: e.side ?? i.side,
+          swipeThreshold: e.swipeThreshold ?? i.swipeThreshold
+        }
+      );
     }
-  );
+  };
 };
-m.Close = ({ closeIcon: o, className: r } = {}) => /* @__PURE__ */ e(t.Close, { className: r, children: o ?? /* @__PURE__ */ e("svg", { viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ e("path", { d: "M2.96967 2.96967C3.26256 2.67678 3.73744 2.67678 4.03033 2.96967L8 6.939L11.9697 2.96967C12.2626 2.67678 12.7374 2.67678 13.0303 2.96967C13.3232 3.26256 13.3232 3.73744 13.0303 4.03033L9.061 8L13.0303 11.9697C13.2966 12.2359 13.3208 12.6526 13.1029 12.9462L13.0303 13.0303C12.7374 13.3232 12.2626 13.3232 11.9697 13.0303L8 9.061L4.03033 13.0303C3.73744 13.3232 3.26256 13.3232 2.96967 13.0303C2.67678 12.7374 2.67678 12.2626 2.96967 11.9697L6.939 8L2.96967 4.03033C2.7034 3.76406 2.6792 3.3474 2.89705 3.05379L2.96967 2.96967Z" }) }) });
 export {
-  m as Toast
+  m as createToaster
 };