@companix/uikit 0.1.14 → 0.1.16

package/dist/bundle.es23.js

@@ -1,16 +1,263 @@
-import { jsx as o } from "react/jsx-runtime";
-import i from "classnames";
-import { PopupLayout as a } from "./bundle.es24.js";
-const t = ({ size: e = "s", className: r, children: l, ...s }) => /* @__PURE__ */ o(
-  a,
-  {
-    ...s,
-    overlay: { className: "dialog-overlay" },
-    content: { className: "dialog-container", "data-size": e },
-    children: /* @__PURE__ */ o("div", { className: i("popup dialog", r), children: l })
+import { jsx as s, jsxs as q } from "react/jsx-runtime";
+import t from "react";
+import G from "classnames";
+import * as C 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";
+const we = (m) => {
+  const { open: p, onOpenChange: l, onClosed: v, children: E, defaultOpen: y = !1, disableEsc: f } = m, [x, M] = t.useState(!1), [D, S] = t.useState(!1), [_, A] = t.useState(!1), P = 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), T = t.useRef(!1), N = t.useRef(!y), e = t.useRef(null), b = t.useRef(e.current?.getBoundingClientRect().height || 0), g = t.useRef(0), O = t.useRef(0), w = p ?? !1, V = t.useCallback(
+    (r) => {
+      l(r);
+    },
+    [l]
+  );
+  de({
+    isDisabled: !w || D || _ || !x
+  });
+  const ee = (r) => {
+    e.current && !e.current.contains(r.target) || (b.current = e.current?.getBoundingClientRect().height || 0, S(!0), I.current = /* @__PURE__ */ new Date(), le() && window.addEventListener("touchend", () => d.current = !1, { once: !0 }), r.target.setPointerCapture(r.pointerId), h.current = r.pageY);
+  }, z = (r, c) => {
+    let n = r;
+    const u = window.getSelection()?.toString(), i = e.current ? W(e.current) : null, a = /* @__PURE__ */ new Date();
+    if (n.tagName === "SELECT" || n.hasAttribute("data-no-drag") || n.closest("[data-no-drag]") || H.current && a.getTime() - H.current.getTime() < 500)
+      return !1;
+    if (i !== null && i > 0)
+      return !0;
+    if (u && u.length > 0)
+      return !1;
+    if (o.current && a.getTime() - o.current.getTime() < pe && i === 0 || c)
+      return o.current = a, !1;
+    for (; n; ) {
+      if (n.scrollHeight > n.clientHeight) {
+        if (n.scrollTop !== 0)
+          return o.current = /* @__PURE__ */ new Date(), !1;
+        if (n.getAttribute("role") === "dialog")
+          return !0;
+      }
+      n = n.parentNode;
+    }
+    return !0;
+  }, te = (r) => {
+    if (e.current && D) {
+      const c = h.current - r.pageY, n = c > 0, u = Math.abs(c), i = b.current, a = u / i;
+      if (!d.current && !z(r.target, n)) return;
+      if (e.current.classList.add(j), d.current = !0, R(e.current, {
+        transition: "none"
+      }), R(P.current, {
+        transition: "none"
+      }), n) {
+        const F = fe(c), U = Math.min(F * -1, 0) * 1;
+        R(e.current, {
+          transform: `translate3d(0, ${U}px, 0)`
+        });
+        return;
+      }
+      const k = 1 - a;
+      R(
+        P.current,
+        {
+          opacity: `${k}`,
+          transition: "none"
+        },
+        !0
+      );
+      const $ = u;
+      R(e.current, {
+        transform: `translate3d(0, ${$}px, 0)`
+      });
+    }
+  };
+  t.useEffect(() => {
+    window.requestAnimationFrame(() => {
+      N.current = !0;
+    });
+  }, []), t.useEffect(() => {
+    const r = () => {
+      if (!e.current) return;
+      const c = document.activeElement;
+      if (ce(c) || T.current) {
+        const n = window.visualViewport?.height || 0, u = window.innerHeight, i = u - n, a = e.current.getBoundingClientRect().height || 0, k = a > u * 0.8;
+        g.current || (g.current = a);
+        const $ = e.current.getBoundingClientRect().top;
+        if (Math.abs(O.current - i) > 60 && (T.current = !T.current), O.current = i, a > n || T.current) {
+          const F = e.current.getBoundingClientRect().height;
+          let U = F;
+          F > n && (U = n - (k ? $ : he)), e.current.style.height = `${Math.max(
+            U,
+            n - $
+          )}px`;
+        } else ue() || (e.current.style.height = `${g.current}px`);
+        e.current.style.bottom = `${Math.max(i, 0)}px`;
+      }
+    };
+    return window.visualViewport?.addEventListener("resize", r), () => window.visualViewport?.removeEventListener("resize", r);
+  }, []);
+  const B = (r) => {
+    re(), r || V(!1);
+  }, X = () => {
+    e.current && (R(e.current, {
+      transform: "translate3d(0, 0, 0)",
+      transition: `transform ${Y.DURATION}s cubic-bezier(${Y.EASE.join(",")})`
+    }), R(P.current, {
+      transition: `opacity ${Y.DURATION}s cubic-bezier(${Y.EASE.join(",")})`,
+      opacity: "1"
+    }));
+  }, re = () => {
+    !D || !e.current || (e.current.classList.remove(j), d.current = !1, S(!1), L.current = /* @__PURE__ */ new Date());
+  }, ne = (r) => {
+    if (!D || !e.current) return;
+    e.current.classList.remove(j), d.current = !1, S(!1), L.current = /* @__PURE__ */ new Date();
+    const c = W(e.current);
+    if (!r || !z(r.target, !1) || !c || Number.isNaN(c) || I.current === null) return;
+    const n = L.current.getTime() - I.current.getTime(), u = h.current - r.pageY, i = Math.abs(u) / n;
+    if (i > 0.05 && (A(!0), setTimeout(() => {
+      A(!1);
+    }, 200)), u > 0) {
+      X();
+      return;
+    }
+    if (i > ge) {
+      B();
+      return;
+    }
+    const a = Math.min(
+      e.current.getBoundingClientRect().height ?? 0,
+      window.innerHeight
+    );
+    if (Math.abs(c) >= a * me) {
+      B();
+      return;
+    }
+    X();
+  };
+  return t.useEffect(() => (w && (R(document.documentElement, {
+    scrollBehavior: "auto"
+  }), H.current = /* @__PURE__ */ new Date()), () => {
+    ae(document.documentElement, "scrollBehavior");
+  }), [w]), /* @__PURE__ */ s(
+    C.Root,
+    {
+      defaultOpen: y,
+      onOpenChange: (r) => {
+        r ? M(!0) : B(!0), V(r);
+      },
+      open: w,
+      modal: !0,
+      children: /* @__PURE__ */ s(
+        ie.Provider,
+        {
+          value: {
+            drawerRef: e,
+            overlayRef: P,
+            onPress: ee,
+            onRelease: ne,
+            onDrag: te,
+            isOpen: w,
+            isDragging: D,
+            keyboardIsOpen: T,
+            closeDrawer: () => B(),
+            shouldAnimate: N,
+            onClosed: v,
+            disableEsc: f
+          },
+          children: E
+        }
+      )
+    }
+  );
+}, Re = t.forwardRef(
+  ({ className: m, ...p }, l) => {
+    const { overlayRef: v, onRelease: E, shouldAnimate: y } = J(), f = Q(l, v), x = t.useCallback(
+      (M) => E(M),
+      [E]
+    );
+    return /* @__PURE__ */ s(
+      C.Overlay,
+      {
+        onMouseUp: x,
+        ref: f,
+        "data-animate": y?.current ? "true" : "false",
+        className: G("popup-overlay drawer-overlay", m),
+        ...p
+      }
+    );
   }
-);
-t.Close = a.Close;
+), De = t.forwardRef(
+  ({ onPointerDownOutside: m, style: p, onOpenAutoFocus: l, className: v, size: E, children: y, ...f }, x) => {
+    const {
+      drawerRef: M,
+      onPress: D,
+      onRelease: S,
+      onDrag: _,
+      keyboardIsOpen: A,
+      shouldAnimate: P,
+      onClosed: H,
+      disableEsc: I
+    } = J(), L = Q(x, M), o = t.useRef(null), d = t.useRef(null), h = t.useRef(!1), T = (e, b = 0) => {
+      if (h.current) return !0;
+      const g = Math.abs(e.y), w = Math.abs(e.x) > g;
+      return !(e.y * 1 < 0) && g >= 0 && g <= b ? !w : (h.current = !0, !0);
+    }, N = (e) => {
+      o.current = null, h.current = !1, S(e);
+    };
+    return /* @__PURE__ */ q(
+      C.Content,
+      {
+        "data-direction": "bottom",
+        "data-animate": P?.current ? "true" : "false",
+        className: G("popup drawer drawer-mobile", v),
+        style: { ...oe({ "--drawer-size": E ?? "50%" }), ...p },
+        ...f,
+        ref: L,
+        onPointerDown: (e) => {
+          f.onPointerDown?.(e), o.current = { x: e.pageX, y: e.pageY }, D(e);
+        },
+        onOpenAutoFocus: (e) => {
+          l?.(e), e.preventDefault();
+        },
+        onEscapeKeyDown: (e) => {
+          I && e.preventDefault();
+        },
+        onPointerDownOutside: (e) => {
+          m?.(e), !e.defaultPrevented && A.current && (A.current = !1);
+        },
+        onPointerMove: (e) => {
+          if (d.current = e, f.onPointerMove?.(e), !o.current) return;
+          const b = e.pageY - o.current.y, g = e.pageX - o.current.x, O = e.pointerType === "touch" ? 10 : 2;
+          T({ x: g, y: b }, O) ? _(e) : (Math.abs(g) > O || Math.abs(b) > O) && (o.current = null);
+        },
+        onPointerUp: (e) => {
+          f.onPointerUp?.(e), o.current = null, h.current = !1, S(e);
+        },
+        onPointerOut: (e) => {
+          f.onPointerOut?.(e), N(d.current);
+        },
+        onContextMenu: (e) => {
+          f.onContextMenu?.(e), d.current && N(d.current);
+        },
+        children: [
+          /* @__PURE__ */ s(se, { callback: H }),
+          /* @__PURE__ */ s(K, { children: /* @__PURE__ */ s(C.Title, {}) }),
+          /* @__PURE__ */ s(K, { children: /* @__PURE__ */ s(C.Description, {}) }),
+          y
+        ]
+      }
+    );
+  }
+), Te = t.forwardRef(
+  ({ children: m, ...p }, l) => /* @__PURE__ */ s("div", { className: "drawer-handle", "aria-hidden": "true", ref: l, ...p, children: /* @__PURE__ */ s("span", { className: "drawer-handle-hitarea", "aria-hidden": "true", children: m }) })
+), Z = ({ children: m, size: p, ...l }) => /* @__PURE__ */ s(we, { ...l, children: /* @__PURE__ */ q(C.Portal, { children: [
+  /* @__PURE__ */ s(Re, {}),
+  /* @__PURE__ */ s(De, { size: p, children: m })
+] }) });
+Z.Close = C.Close;
+Z.Handle = Te;
 export {
-  t as Dialog
+  Te as Handle,
+  Z as MobileDrawer
 };

package/dist/bundle.es24.js

@@ -1,23 +1,16 @@
-import { jsx as e, jsxs as r } from "react/jsx-runtime";
-import f 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.es57.js";
-const v = (i) => {
-  const { open: t, onOpenChange: s, children: a, onClosed: c, disableEsc: p, overlay: n = {}, content: m = {} } = i, d = (h) => {
-    p && h.preventDefault();
-  };
-  return /* @__PURE__ */ e(o.Root, { open: t, onOpenChange: s, children: /* @__PURE__ */ r(o.Portal, { children: [
-    /* @__PURE__ */ e(o.Overlay, { ...n, className: f("popup-overlay", n.className) }),
-    /* @__PURE__ */ r(o.Content, { ...m, onEscapeKeyDown: d, children: [
-      /* @__PURE__ */ e(u, { callback: c }),
-      /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(o.Title, {}) }),
-      /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(o.Description, {}) }),
-      a
-    ] })
-  ] }) });
-};
-v.Close = o.Close;
+import { jsx as o } from "react/jsx-runtime";
+import i from "classnames";
+import { PopupLayout as a } from "./bundle.es25.js";
+const t = ({ size: e = "s", className: r, children: l, ...s }) => /* @__PURE__ */ o(
+  a,
+  {
+    ...s,
+    overlay: { className: "dialog-overlay" },
+    content: { className: "dialog-container", "data-size": e },
+    children: /* @__PURE__ */ o("div", { className: i("popup dialog", r), children: l })
+  }
+);
+t.Close = a.Close;
 export {
-  v as PopupLayout
+  t as Dialog
 };

package/dist/bundle.es25.js

@@ -1,40 +1,23 @@
-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.es57.js";
-import { VisuallyHidden as u } from "@radix-ui/react-visually-hidden";
-const C = ({
-  open: d,
-  defaultOpen: m,
-  onOpenChange: p,
-  onClosed: h,
-  icon: i,
-  title: l,
-  description: o,
-  cancelDefaultText: s,
-  cancel: t,
-  disableCancel: v,
-  confirm: n
-}) => /* @__PURE__ */ e(r.Root, { open: d, defaultOpen: m, onOpenChange: p, children: /* @__PURE__ */ a(r.Portal, { children: [
-  /* @__PURE__ */ e(r.Overlay, { className: "popup-overlay dialog-overlay" }),
-  /* @__PURE__ */ a(r.Content, { className: "dialog-container", children: [
-    /* @__PURE__ */ e(N, { callback: h }),
-    /* @__PURE__ */ a("div", { className: "popup dialog alert", children: [
-      /* @__PURE__ */ a("div", { className: "alert-body", children: [
-        i && /* @__PURE__ */ e("span", { className: "alert-icon", children: i }),
-        /* @__PURE__ */ a("div", { className: "alert-content", children: [
-          l && /* @__PURE__ */ e(r.Title, { className: "alert-title", children: l }),
-          !l && /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(r.Title, {}) }),
-          o && /* @__PURE__ */ e(r.Description, { className: "alert-description", children: o })
-        ] })
-      ] }),
-      /* @__PURE__ */ a("div", { className: "alert-footer", children: [
-        !v && (t?.text || s) && /* @__PURE__ */ e(r.Cancel, { asChild: !0, children: /* @__PURE__ */ e(c, { appearance: "neutral", ...t, text: t?.text ?? s }) }),
-        n?.text && /* @__PURE__ */ e(r.Action, { asChild: !0, children: /* @__PURE__ */ e(c, { appearance: "negative", ...n }) })
-      ] })
+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";
+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();
+  };
+  return /* @__PURE__ */ e(o.Root, { open: i, onOpenChange: a, children: /* @__PURE__ */ n(o.Portal, { children: [
+    /* @__PURE__ */ e(o.Overlay, { ...r, ref: m, className: y("popup-overlay", r.className) }),
+    /* @__PURE__ */ n(o.Content, { ...d, ref: f, onEscapeKeyDown: h, children: [
+      /* @__PURE__ */ e(u, { callback: c }),
+      /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(o.Title, {}) }),
+      /* @__PURE__ */ e(l, { children: /* @__PURE__ */ e(o.Description, {}) }),
+      s
     ] })
-  ] })
-] }) });
+  ] }) });
+};
+C.Close = o.Close;
 export {
-  C as AlertDialog
+  C as PopupLayout
 };

package/dist/bundle.es26.js

@@ -1,23 +1,40 @@
-import { jsx as m } from "react/jsx-runtime";
-import { Button as p } from "./bundle.es5.js";
-import { useLoading as s } from "./bundle.es49.js";
-const l = ({
-  onClick: o,
-  appearance: r = "primary",
-  loading: i,
-  ...n
-}) => {
-  const { isLoading: t, isError: a, handleClick: e } = s({ onClick: o });
-  return /* @__PURE__ */ m(
-    p,
-    {
-      appearance: a ? "negative" : r,
-      ...n,
-      loading: t || i,
-      onClick: e
-    }
-  );
-};
+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 { VisuallyHidden as u } from "@radix-ui/react-visually-hidden";
+const C = ({
+  open: d,
+  defaultOpen: m,
+  onOpenChange: p,
+  onClosed: h,
+  icon: i,
+  title: l,
+  description: o,
+  cancelDefaultText: s,
+  cancel: t,
+  disableCancel: v,
+  confirm: n
+}) => /* @__PURE__ */ e(r.Root, { open: d, defaultOpen: m, onOpenChange: p, children: /* @__PURE__ */ a(r.Portal, { children: [
+  /* @__PURE__ */ e(r.Overlay, { className: "popup-overlay dialog-overlay" }),
+  /* @__PURE__ */ a(r.Content, { className: "dialog-container", children: [
+    /* @__PURE__ */ e(N, { callback: h }),
+    /* @__PURE__ */ a("div", { className: "popup dialog alert", children: [
+      /* @__PURE__ */ a("div", { className: "alert-body", children: [
+        i && /* @__PURE__ */ e("span", { className: "alert-icon", children: i }),
+        /* @__PURE__ */ a("div", { className: "alert-content", children: [
+          l && /* @__PURE__ */ e(r.Title, { className: "alert-title", children: l }),
+          !l && /* @__PURE__ */ e(u, { children: /* @__PURE__ */ e(r.Title, {}) }),
+          o && /* @__PURE__ */ e(r.Description, { className: "alert-description", children: o })
+        ] })
+      ] }),
+      /* @__PURE__ */ a("div", { className: "alert-footer", children: [
+        !v && (t?.text || s) && /* @__PURE__ */ e(r.Cancel, { asChild: !0, children: /* @__PURE__ */ e(c, { appearance: "neutral", ...t, text: t?.text ?? s }) }),
+        n?.text && /* @__PURE__ */ e(r.Action, { asChild: !0, children: /* @__PURE__ */ e(c, { appearance: "negative", ...n }) })
+      ] })
+    ] })
+  ] })
+] }) });
 export {
-  l as LoadingButton
+  C as AlertDialog
 };

package/dist/bundle.es27.js

@@ -1,21 +1,23 @@
-import { jsx as a, jsxs as d } from "react/jsx-runtime";
-import { useTabSlider as b, makeTabId as l } from "./bundle.es59.js";
-import * as n from "@radix-ui/react-tabs";
-import { useRef as m, useId as f, createContext as T, useContext as c } from "react";
-const o = T({ baseId: "", containerRef: {} }), u = ({ children: s, value: e, onChange: r }) => {
-  const t = m(null), i = f().replaceAll(":", "");
-  return /* @__PURE__ */ a(n.Root, { value: e, onValueChange: r, children: /* @__PURE__ */ a(o.Provider, { value: { baseId: i, containerRef: t }, children: /* @__PURE__ */ d(n.List, { className: "tabs", ref: t, children: [
-    /* @__PURE__ */ a(x, { value: e }),
-    s
-  ] }) }) });
-}, x = ({ value: s }) => {
-  const { baseId: e, containerRef: r } = c(o), t = b({ baseId: e, value: s, containerRef: r });
-  return /* @__PURE__ */ a("div", { className: "tab-indicator-container", style: t, children: /* @__PURE__ */ a("div", { className: "tab-indicator" }) });
-}, I = ({ children: s, value: e, ...r }) => {
-  const { baseId: t } = c(o);
-  return /* @__PURE__ */ a(n.Trigger, { ...r, id: l(t, e), className: "tab", value: e, children: s });
+import { jsx as m } from "react/jsx-runtime";
+import { Button as p } from "./bundle.es5.js";
+import { useLoading as s } from "./bundle.es50.js";
+const l = ({
+  onClick: o,
+  appearance: r = "primary",
+  loading: i,
+  ...n
+}) => {
+  const { isLoading: t, isError: a, handleClick: e } = s({ onClick: o });
+  return /* @__PURE__ */ m(
+    p,
+    {
+      appearance: a ? "negative" : r,
+      ...n,
+      loading: t || i,
+      onClick: e
+    }
+  );
 };
-u.Tab = I;
 export {
-  u as Tabs
+  l as LoadingButton
 };

package/dist/bundle.es28.js

@@ -1,23 +1,21 @@
-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([]);
-  s(() => {
-    const c = Date.now(), f = T(c, "1s") - c;
-    return e.current && clearInterval(e.current), S(f).then(() => {
-      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);
-  return s(() => {
-    r <= 0 && (a?.(), e.current && clearInterval(e.current));
-  }, [r <= 0]), /* @__PURE__ */ d(p, { children: [n(i), n(u), n(l)].join(m) });
+import { jsx as a, jsxs as d } from "react/jsx-runtime";
+import { useTabSlider as b, makeTabId as l } from "./bundle.es60.js";
+import * as n from "@radix-ui/react-tabs";
+import { useRef as m, useId as f, createContext as T, useContext as c } from "react";
+const o = T({ baseId: "", containerRef: {} }), u = ({ children: s, value: e, onChange: r }) => {
+  const t = m(null), i = f().replaceAll(":", "");
+  return /* @__PURE__ */ a(n.Root, { value: e, onValueChange: r, children: /* @__PURE__ */ a(o.Provider, { value: { baseId: i, containerRef: t }, children: /* @__PURE__ */ d(n.List, { className: "tabs", ref: t, children: [
+    /* @__PURE__ */ a(x, { value: e }),
+    s
+  ] }) }) });
+}, x = ({ value: s }) => {
+  const { baseId: e, containerRef: r } = c(o), t = b({ baseId: e, value: s, containerRef: r });
+  return /* @__PURE__ */ a("div", { className: "tab-indicator-container", style: t, children: /* @__PURE__ */ a("div", { className: "tab-indicator" }) });
+}, I = ({ children: s, value: e, ...r }) => {
+  const { baseId: t } = c(o);
+  return /* @__PURE__ */ a(n.Trigger, { ...r, id: l(t, e), className: "tab", value: e, children: s });
 };
+u.Tab = I;
 export {
-  j as Countdown
+  u as Tabs
 };

package/dist/bundle.es29.js

@@ -1,46 +1,23 @@
-import { jsx as m } from "react/jsx-runtime";
-import u from "classnames";
-import { useResizeTextarea as z } from "./bundle.es48.js";
-import { attr as e, callMultiple as R } from "@companix/utils-browser";
-import { useEffect as T } from "react";
-import { mergeRefs as g } from "react-merge-refs";
-const E = ({
-  onResize: f,
-  grow: t = !1,
-  value: a,
-  onChange: i,
-  disabled: o,
-  required: s,
-  rows: l = 2,
-  fill: p = !1,
-  textAreaRef: c,
-  className: n,
-  ...d
-}) => {
-  const [x, r] = z(f, t);
-  return T(r, [r, a]), /* @__PURE__ */ m(
-    "div",
-    {
-      className: "form form-textarea",
-      "data-required": e(s),
-      "data-disabled": e(o),
-      "data-fill": e(p),
-      children: /* @__PURE__ */ m(
-        "textarea",
-        {
-          className: u("form-input", n),
-          "data-grow": e(t),
-          value: a,
-          ref: g([c, x]),
-          rows: l,
-          disabled: o,
-          onChange: R(i, r),
-          ...d
-        }
-      )
-    }
-  );
+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([]);
+  s(() => {
+    const c = Date.now(), f = T(c, "1s") - c;
+    return e.current && clearInterval(e.current), S(f).then(() => {
+      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);
+  return s(() => {
+    r <= 0 && (a?.(), e.current && clearInterval(e.current));
+  }, [r <= 0]), /* @__PURE__ */ d(p, { children: [n(i), n(u), n(l)].join(m) });
 };
 export {
-  E as TextArea
+  j as Countdown
 };