@versini/ui-panel 2.0.4 → 2.0.6

package/dist/index.js

@@ -1,782 +1,19 @@
-import { jsx as c, jsxs as S, Fragment as X } from "react/jsx-runtime";
-import * as b from "react";
-import V, { useRef as _, useLayoutEffect as F, useMemo as q, useState as Z, useEffect as R, useCallback as le, useId as H } from "react";
-import i from "clsx";
-import { useFloating as ce, useClick as se, useDismiss as de, useRole as ue, useInteractions as me, useMergeRefs as ge, FloatingPortal as he, FloatingOverlay as be, FloatingFocusManager as fe } from "@floating-ui/react";
+import { MESSAGEBOX_CLASSNAME as o, PANEL_CLASSNAME as E, Panel as n } from "./components/Panel/Panel.js";
 /*!
-  @versini/ui-panel v2.0.4
+  @versini/ui-panel v2.0.6
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_PANEL__ || (window.__VERSINI_UI_PANEL__ = {
-    version: "2.0.4",
-    buildTime: "04/02/2025 04:19 PM EDT",
+    version: "2.0.6",
+    buildTime: "05/26/2025 03:48 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });
 } catch {
 }
-const U = "av-messagebox", j = "av-panel", Y = "av-button", B = "icon", J = "button", P = "link", ve = ({
-  type: e,
-  size: t,
-  labelRight: r,
-  labelLeft: a,
-  align: n,
-  animated: o
-}) => {
-  const l = "max-h-8 py-0 px-2", d = "max-h-9 h-8 px-3", s = "max-h-12 py-2 px-4";
-  switch (e) {
-    case J:
-    case P:
-      return i({
-        [l]: t === "small",
-        [d]: t === "medium",
-        [s]: t === "large"
-      });
-    case B:
-      return i("flex items-center", {
-        "justify-center": n === "center",
-        "justify-start": n === "left",
-        "justify-end": n === "right",
-        "h-6 w-6 p-0": t === "small" && !o && !(r || a),
-        "h-6 px-2": t === "small" && !o && (r || a),
-        "h-8 w-8 p-1": t === "medium" && !o && !(r || a),
-        "h-8 px-3": t === "medium" && !o && (r || a),
-        "h-12 w-12 p-2": t === "large" && !o && !(r || a),
-        "h-12 px-4": t === "large" && !o && (r || a),
-        "h-6 py-0": t === "small" && o && !(r || a),
-        "h-6": t === "small" && o && (r || a),
-        "h-8 py-1": t === "medium" && o && !(r || a),
-        "h-8": t === "medium" && o && (r || a),
-        "h-12 py-2": t === "large" && o && !(r || a),
-        "h-12": t === "large" && o && (r || a)
-      });
-  }
-}, ye = ({
-  type: e,
-  size: t,
-  labelRight: r,
-  labelLeft: a
-}) => {
-  const n = "text-sm font-medium", o = "text-base font-medium", l = "text-lg font-medium";
-  switch (e) {
-    case J:
-    case P:
-      return i({
-        "text-center": e === P,
-        [n]: t === "small",
-        [o]: t === "medium",
-        [l]: t === "large"
-      });
-    case B:
-      return i({
-        [n]: t === "small" && (r || a),
-        [o]: t === "medium" && (r || a),
-        [l]: t === "large" && (r || a)
-      });
-  }
-}, pe = ({
-  mode: e,
-  noBackground: t,
-  truncate: r,
-  variant: a
-}) => {
-  if (t)
-    return "not-prose";
-  if (a === "primary")
-    return i("not-prose", {
-      truncate: r,
-      "text-copy-light": e === "dark" || e === "system",
-      "text-copy-lighter": e === "light" || e === "alt-system",
-      "dark:text-copy-lighter": e === "system",
-      "dark:text-copy-light": e === "alt-system"
-    });
-  if (a === "secondary")
-    return i("not-prose", {
-      truncate: r,
-      "text-copy-light": e === "light" || e === "system",
-      "text-copy-lighter": e === "dark" || e === "alt-system",
-      "dark:text-copy-lighter": e === "alt-system",
-      "dark:text-copy-light": e === "system"
-    });
-  if (a === "danger")
-    return i("not-prose", {
-      truncate: r,
-      "text-copy-light": e === "dark" || e === "system",
-      "text-copy-lighter": e === "light" || e === "alt-system",
-      "dark:text-copy-lighter": e === "system",
-      "dark:text-copy-light": e === "alt-system"
-    });
-  if (a === "selected")
-    return i("not-prose text-copy-lighter", {
-      truncate: r
-    });
-}, ke = ({
-  mode: e,
-  noBackground: t,
-  variant: r
-}) => {
-  if (!t) {
-    if (r === "primary")
-      return i({
-        "bg-action-dark": e === "dark",
-        "bg-action-light": e === "light",
-        "bg-action-dark dark:bg-action-light": e === "system",
-        "bg-action-light dark:bg-action-dark": e === "alt-system"
-      });
-    if (r === "secondary")
-      return i({
-        "bg-action-dark": e === "light",
-        "bg-action-light": e === "dark",
-        "bg-action-dark dark:bg-action-light": e === "alt-system",
-        "bg-action-light dark:bg-action-dark": e === "system"
-      });
-    if (r === "danger")
-      return i({
-        "bg-action-danger-dark": e === "dark",
-        "bg-action-danger-light": e === "light",
-        "bg-action-danger-dark dark:bg-action-danger-light": e === "system",
-        "bg-action-danger-light dark:bg-action-danger-dark": e === "alt-system"
-      });
-    if (r === "selected")
-      return "bg-action-selected-dark";
-  }
-}, xe = ({
-  radius: e
-}) => i({
-  "rounded-full": e === "large",
-  "rounded-md": e === "medium",
-  "rounded-xs": e === "small"
-}), we = ({
-  mode: e,
-  disabled: t,
-  variant: r
-}) => {
-  if (t)
-    return "";
-  if (r === "primary")
-    return i("hover:text-copy-light-hover", {
-      "hover:bg-action-dark-hover": e === "dark",
-      "hover:bg-action-light-hover": e === "light",
-      "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "system",
-      "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "alt-system"
-    });
-  if (r === "secondary")
-    return i("hover:text-copy-light-hover", {
-      "hover:bg-action-dark-hover": e === "light",
-      "hover:bg-action-light-hover": e === "dark",
-      "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "alt-system",
-      "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "system"
-    });
-  if (r === "danger")
-    return i("hover:text-copy-light-hover", {
-      "hover:bg-action-danger-dark-hover": e === "dark",
-      "hover:bg-action-danger-light-hover": e === "light",
-      "hover:bg-action-danger-dark-hover dark:hover:bg-action-danger-light-hover": e === "system",
-      "hover:bg-action-danger-light-hover dark:hover:bg-action-danger-dark-hover": e === "alt-system"
-    });
-  if (r === "selected")
-    return "hover:text-copy-light-hover hover:bg-action-selected-dark-hover";
-}, _e = ({
-  mode: e,
-  disabled: t,
-  variant: r
-}) => {
-  if (t)
-    return "";
-  if (r === "primary")
-    return i("active:text-copy-light-active", {
-      "active:bg-action-dark-active": e === "dark",
-      "active:bg-action-light-active": e === "light",
-      "active:bg-action-dark-active dark:active:bg-action-light-active": e === "system",
-      "active:bg-action-light-active dark:active:bg-action-dark-active": e === "alt-system"
-    });
-  if (r === "secondary")
-    return i("active:text-copy-light-active", {
-      "active:bg-action-dark-active": e === "light",
-      "active:bg-action-light-active": e === "dark",
-      "active:bg-action-dark-active dark:active:bg-action-light-active": e === "alt-system",
-      "active:bg-action-light-active dark:active:bg-action-dark-active": e === "system"
-    });
-  if (r === "danger")
-    return i("active:text-copy-lighter-active", {
-      "active:bg-action-danger-dark-active": e === "dark",
-      "active:bg-action-danger-light-active": e === "light",
-      "active:bg-action-danger-dark-active dark:active:bg-action-danger-light-active": e === "system",
-      "active:bg-action-danger-light-active dark:active:bg-action-danger-dark-active": e === "alt-system"
-    });
-  if (r === "selected")
-    return "active:text-copy-lighter-active active:bg-action-selected-dark-active";
-}, Ie = ({
-  mode: e,
-  noBorder: t,
-  variant: r
-}) => {
-  if (t)
-    return "border border-transparent";
-  if (r === "primary")
-    return i("border", {
-      "border-border-dark": e === "dark",
-      "border-border-accent": e === "light",
-      "border-border-dark dark:border-border-accent": e === "system",
-      "border-border-accent dark:border-border-dark": e === "alt-system"
-    });
-  if (r === "secondary")
-    return i("border", {
-      "border-border-dark": e === "light",
-      "border-border-accent": e === "dark",
-      "border-border-dark dark:border-border-accent": e === "alt-system",
-      "border-border-accent dark:border-border-dark": e === "system"
-    });
-  if (r === "danger")
-    return i("border", {
-      "border-border-danger-dark": e === "dark",
-      "border-border-danger-medium": e === "light",
-      "border-border-danger-dark dark:border-border-danger-medium": e === "system",
-      "border-border-danger-medium dark:border-border-danger-dark": e === "alt-system"
-    });
-  if (r === "selected")
-    return "border border-border-selected-dark";
-}, Ne = ({
-  focusMode: e
-}) => i("focus:outline", "focus:outline-2", "focus:outline-offset-2", {
-  "focus:outline-focus-dark": e === "dark",
-  "focus:outline-focus-light": e === "light",
-  "focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
-  "focus:outline-focus-dark dark:focus:outline-focus-light": e === "system"
-}), Ee = ({
-  mode: e,
-  raw: t,
-  iconClassName: r
-}) => t ? "" : i(
-  {
-    "text-copy-accent-dark": e === "light" || e === "alt-system",
-    "text-copy-light": e === "dark" || e === "system",
-    "dark:text-copy-light": e === "alt-system",
-    "dark:text-copy-accent-dark": e === "system"
-  },
-  r
-), Ce = ({
-  animated: e
-}) => i({
-  "transition-opacity duration-300 ease-in": e
-}), Se = ({
-  type: e,
-  className: t,
-  raw: r,
-  mode: a,
-  focusMode: n,
-  disabled: o,
-  fullWidth: l,
-  size: d,
-  noBorder: s,
-  labelRight: m,
-  labelLeft: f,
-  noBackground: g,
-  variant: u,
-  truncate: h,
-  align: v,
-  radius: I,
-  animated: y
-}) => (u || (u = "primary"), r ? i(Y, t) : i(
-  Y,
-  pe({
-    mode: a,
-    variant: u,
-    noBackground: g,
-    truncate: h
-  }),
-  ke({ mode: a, noBackground: g, variant: u }),
-  xe({ radius: I }),
-  ve({
-    type: e,
-    size: d,
-    labelRight: m,
-    labelLeft: f,
-    align: v,
-    animated: y
-  }),
-  ye({ type: e, size: d, labelRight: m, labelLeft: f }),
-  Ie({ mode: a, variant: u, noBorder: s }),
-  Ne({ focusMode: n }),
-  we({ mode: a, variant: u, disabled: o }),
-  _e({ mode: a, variant: u, disabled: o }),
-  {
-    "w-full": l,
-    "disabled:cursor-not-allowed disabled:opacity-50": o
-  },
-  i({
-    "transition-[width] duration-300 ease-in-out": e === B && y
-  }),
-  t
-)), Re = (e, t, r) => {
-  var a;
-  !t && (!document.activeElement || document.activeElement !== e.currentTarget) && typeof ((a = e == null ? void 0 : e.currentTarget) == null ? void 0 : a.focus) == "function" && e.currentTarget.focus(), typeof r == "function" && r(e);
-}, K = V.forwardRef((e, t) => {
-  const { onClick: r, noInternalClick: a = !1, ...n } = e;
-  return /* @__PURE__ */ c(
-    "button",
-    {
-      ref: t,
-      onClick: (o) => {
-        Re(o, a, r);
-      },
-      ...n
-    }
-  );
-});
-K.displayName = "BaseButton";
-function Be() {
-  const e = _(!1);
-  return R(() => (e.current = !0, () => {
-    e.current = !1;
-  }), []), le(() => e.current, []);
-}
-function Me(e) {
-  return q(() => e.every((t) => t == null) ? () => {
-  } : (t) => {
-    e.forEach((r) => {
-      typeof r == "function" ? r(t) : r != null && (r.current = t);
-    });
-  }, e);
-}
-const Te = {
-  x: 0,
-  y: 0,
-  width: 0,
-  height: 0,
-  top: 0,
-  left: 0,
-  bottom: 0,
-  right: 0
-};
-function O(e) {
-  const t = Be(), r = _(0), a = _(null), [n, o] = Z(Te), l = q(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((d) => {
-    const s = d[0];
-    s && (cancelAnimationFrame(r.current), r.current = requestAnimationFrame(() => {
-      a.current && t() && o(s.contentRect);
-    }));
-  }), [t]);
-  return R(() => (a.current && (l == null || l.observe(a.current, e)), () => {
-    l == null || l.disconnect(), r.current && cancelAnimationFrame(r.current);
-  }), [l, e]), [a, n];
-}
-const Le = {
-  small: 24,
-  // w-6
-  medium: 32,
-  // w-8
-  large: 48
-  // w-12
-}, Ae = {
-  small: 8 * 2,
-  // px-2 x 2
-  medium: 12 * 2,
-  // px-3 x 2
-  large: 16 * 2
-  // px-4 x 2
-}, Oe = 2, z = V.forwardRef(
-  ({
-    children: e,
-    disabled: t = !1,
-    mode: r = "system",
-    focusMode: a = "system",
-    fullWidth: n = !1,
-    className: o,
-    type: l = "button",
-    raw: d = !1,
-    noBorder: s = !1,
-    "aria-label": m,
-    label: f,
-    size: g = "medium",
-    labelRight: u,
-    labelLeft: h,
-    noBackground: v = !1,
-    align: I = "center",
-    radius: y = "large",
-    variant: ee = "primary",
-    iconClassName: re,
-    animated: k = !1,
-    ...te
-  }, ae) => {
-    const oe = Se({
-      type: B,
-      mode: r,
-      focusMode: a,
-      fullWidth: n,
-      disabled: t,
-      raw: d,
-      className: o,
-      noBorder: s,
-      size: g,
-      labelRight: u,
-      labelLeft: h,
-      noBackground: v,
-      align: I,
-      radius: y,
-      variant: ee,
-      animated: k
-    }), ne = Ee({ mode: r, raw: d, iconClassName: re }), D = Ce({ animated: k }), [p, T] = O(), [x, L] = O(), [E, $] = O(), A = _(0), w = _(null), ie = Me([ae, w]);
-    return F(() => {
-      E && E.current && k && (A.current = $.width + Ae[g] + (s ? 0 : Oe));
-    }, [$, E, g, s, k]), F(() => {
-      w && w.current && k && (u && p && T.width > 0 ? (p.current && (p.current.style.opacity = "100"), w.current.style.width = `${T.width + A.current}px`) : h && L.width > 0 ? (x.current && (x.current.style.opacity = "100"), w.current.style.width = `${L.width + A.current}px`) : (p.current && (p.current.style.opacity = "0"), x.current && (x.current.style.opacity = "0"), w.current.style.width = `${Le[g]}px`));
-    }, [
-      T,
-      u,
-      p,
-      L,
-      h,
-      x,
-      g,
-      k
-    ]), /* @__PURE__ */ S(
-      K,
-      {
-        ref: ie,
-        className: oe,
-        disabled: t,
-        type: l,
-        "aria-label": m || f,
-        ...te,
-        children: [
-          /* @__PURE__ */ c(
-            G,
-            {
-              label: h,
-              labelRef: x,
-              labelClass: D,
-              labelInnerClass: "pr-2"
-            }
-          ),
-          /* @__PURE__ */ c("span", { ref: E, className: ne, children: e }),
-          /* @__PURE__ */ c(
-            G,
-            {
-              label: u,
-              labelRef: p,
-              labelClass: D,
-              labelInnerClass: "pl-2"
-            }
-          )
-        ]
-      }
-    );
-  }
-), G = ({
-  labelRef: e,
-  labelClass: t,
-  label: r,
-  labelInnerClass: a
-}) => /* @__PURE__ */ c("span", { ref: e, className: t, children: r && /* @__PURE__ */ c("span", { className: a, children: r }) });
-z.displayName = "ButtonIcon";
-/*!
-  @versini/ui-button v6.0.4
-  © 2025 gizmette.com
-*/
-try {
-  window.__VERSINI_UI_BUTTON__ || (window.__VERSINI_UI_BUTTON__ = {
-    version: "6.0.4",
-    buildTime: "04/02/2025 04:18 PM EDT",
-    homepage: "https://github.com/aversini/ui-components",
-    license: "MIT"
-  });
-} catch {
-}
-const Pe = V.forwardRef(
-  ({
-    children: e,
-    mode: t = "system",
-    className: r,
-    active: a = !1,
-    ...n
-  }, o) => {
-    const l = a ? i(
-      "relative",
-      "focus-within:static",
-      "focus-within:after:border-transparent",
-      "after:absolute",
-      "after:content-['']",
-      "after:border-b-2",
-      "after:bottom-[-4px]",
-      "after:left-0",
-      "after:right-0",
-      {
-        "after:border-table-dark": t === "dark",
-        "after:border-table-light": t === "light",
-        "after:border-table-dark dark:after:border-table-light": t === "system",
-        "after:border-table-light dark:after:border-table-dark": t === "alt-system"
-      }
-    ) : "";
-    return /* @__PURE__ */ c("div", { className: l, children: /* @__PURE__ */ c(
-      z,
-      {
-        className: i("justify-center", r),
-        ref: o,
-        mode: t,
-        radius: "small",
-        ...n,
-        children: e
-      }
-    ) });
-  }
-);
-Pe.displayName = "ButtonSort";
-const Ve = ({
-  children: e,
-  fill: t,
-  viewBox: r,
-  className: a,
-  defaultViewBox: n,
-  size: o,
-  title: l,
-  semantic: d = !1,
-  ...s
-}) => {
-  const m = i(o, a);
-  return /* @__PURE__ */ c(X, { children: /* @__PURE__ */ S(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      className: m,
-      viewBox: r || n,
-      fill: t || "currentColor",
-      role: "img",
-      "aria-hidden": !d,
-      focusable: !1,
-      ...s,
-      children: [
-        l && d && /* @__PURE__ */ c("title", { children: l }),
-        e
-      ]
-    }
-  ) });
-};
-/*!
-  @versini/ui-svgicon v4.2.0
-  © 2025 gizmette.com
-*/
-try {
-  window.__VERSINI_UI_SVGICON__ || (window.__VERSINI_UI_SVGICON__ = {
-    version: "4.2.0",
-    buildTime: "03/19/2025 05:27 PM EDT",
-    homepage: "https://github.com/aversini/ui-components",
-    license: "MIT"
-  });
-} catch {
-}
-const ze = ({
-  className: e,
-  viewBox: t,
-  title: r,
-  monotone: a,
-  ...n
-}) => /* @__PURE__ */ c(
-  Ve,
-  {
-    defaultViewBox: "0 0 384 512",
-    size: "size-5",
-    viewBox: t,
-    className: e,
-    title: r || "Close",
-    ...n,
-    children: /* @__PURE__ */ c(
-      "path",
-      {
-        d: "M297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256l105.3-105.4c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3z",
-        opacity: a ? "1" : "0.4"
-      }
-    )
-  }
-);
-/*!
-  @versini/ui-icons v4.8.2
-  © 2025 gizmette.com
-*/
-try {
-  window.__VERSINI_UI_ICONS__ || (window.__VERSINI_UI_ICONS__ = {
-    version: "4.8.2",
-    buildTime: "03/19/2025 05:27 PM EDT",
-    homepage: "https://github.com/aversini/ui-components",
-    license: "MIT"
-  });
-} catch {
-}
-const Q = b.createContext(null);
-function De({
-  initialOpen: e = !1,
-  open: t,
-  onOpenChange: r
-} = {}) {
-  const [a, n] = b.useState(e), [o, l] = b.useState(), [d, s] = b.useState(), m = t ?? a, f = r ?? n, g = ce({
-    open: m,
-    onOpenChange: f
-  }), u = g.context, h = se(u, {
-    enabled: t == null
-  }), v = de(u, {
-    outsidePress: !1,
-    outsidePressEvent: "mousedown"
-  }), I = ue(u), y = me([h, v, I]);
-  return b.useMemo(
-    () => ({
-      open: m,
-      setOpen: f,
-      ...y,
-      ...g,
-      labelId: o,
-      descriptionId: d,
-      setLabelId: l,
-      setDescriptionId: s
-    }),
-    [m, f, y, g, o, d]
-  );
-}
-const M = () => {
-  const e = b.useContext(Q);
-  if (e == null)
-    throw new Error("Modal components must be wrapped in <Modal />");
-  return e;
-};
-function $e({
-  children: e,
-  ...t
-}) {
-  const r = De(t);
-  return /* @__PURE__ */ c(Q.Provider, { value: r, children: e });
-}
-const Fe = b.forwardRef(function(e, t) {
-  const { context: r, ...a } = M(), n = ge([a.refs.setFloating, t]);
-  if (!r.open)
-    return null;
-  const { overlayBackground: o, ...l } = e, d = i("grid place-items-center", {
-    [`${o}`]: o,
-    "bg-black sm:bg-black/[.8]": !o
-  });
-  return /* @__PURE__ */ c(he, { children: /* @__PURE__ */ c(be, { className: d, lockScroll: !0, children: /* @__PURE__ */ c(fe, { context: r, children: /* @__PURE__ */ c(
-    "div",
-    {
-      ref: n,
-      "aria-labelledby": a.labelId,
-      "aria-describedby": a.descriptionId,
-      ...a.getFloatingProps(l),
-      children: l.children
-    }
-  ) }) }) });
-}), Ue = b.forwardRef(function({ children: e, ...t }, r) {
-  const { setLabelId: a } = M(), n = H();
-  return b.useLayoutEffect(() => (a(n), () => a(void 0)), [n, a]), /* @__PURE__ */ c("h1", { ...t, ref: r, id: n, children: e });
-}), je = b.forwardRef(function({ children: e, ...t }, r) {
-  const { setDescriptionId: a } = M(), n = H();
-  return b.useLayoutEffect(() => (a(n), () => a(void 0)), [n, a]), /* @__PURE__ */ c("div", { ...t, ref: r, id: n, children: e });
-}), Ye = b.forwardRef(function(e, t) {
-  const { setOpen: r } = M(), { trigger: a, className: n, ...o } = e, l = b.useCallback(() => r(!1), [r]);
-  return /* @__PURE__ */ c("div", { className: n, children: b.cloneElement(a, {
-    ref: t,
-    onClick: l,
-    ...o
-  }) });
-});
-/*!
-  @versini/ui-modal v2.0.1
-  © 2025 gizmette.com
-*/
-try {
-  window.__VERSINI_UI_MODAL__ || (window.__VERSINI_UI_MODAL__ = {
-    version: "2.0.1",
-    buildTime: "04/02/2025 04:18 PM EDT",
-    homepage: "https://github.com/aversini/ui-components",
-    license: "MIT"
-  });
-} catch {
-}
-const N = "panel", C = "messagebox", Ge = ({
-  className: e,
-  kind: t,
-  borderMode: r,
-  animation: a
-}) => ({
-  main: i("prose prose-lighter flex flex-col bg-surface-medium", {
-    "duration-200 ease-out": a,
-    [`${j} max-h-full sm:max-h-[95%] min-h-full sm:min-h-[10rem] sm:rounded-lg sm:border-2`]: t === N,
-    [`${j} w-full sm:w-[95%] md:max-w-2xl`]: t === N && !e,
-    [`${U} rounded-lg border-2`]: t === C,
-    [`${U} w-[95%] sm:w-[50%] md:max-w-2xl`]: t === C && !e,
-    [`${e}`]: !!e,
-    "sm:border-border-dark": r === "dark" && t === N,
-    "sm:border-border-accent": r === "light" && t === N,
-    "border-border-dark": r === "dark" && t === C,
-    "border-border-accent": r === "light" && t === C
-  }),
-  content: "flex flex-col py-2 sm:py-4 sm:px-4 px-2 overflow-y-auto",
-  footer: "flex grow flex-col sm:p-4 p-2",
-  header: "sm:p-4 mb-0 p-2",
-  close: "sm:p-4 p-2"
-}), We = "slide", W = "fade", Je = ({
-  open: e,
-  onOpenChange: t,
-  title: r,
-  children: a,
-  footer: n,
-  borderMode: o = "light",
-  kind: l = N,
-  className: d,
-  animation: s = !1,
-  animationType: m = We
-}) => {
-  const f = _(""), [g, u] = Z(
-    s ? m === W ? { opacity: 0 } : {
-      transform: "translateY(-100vh)"
-    } : {}
-  ), h = Ge({
-    className: d,
-    kind: l,
-    borderMode: o,
-    animation: s
-  });
-  return R(() => (e && (f.current = document.title, document.title = `${r} | ${f.current}`), () => {
-    e && (document.title = f.current);
-  }), [r, e]), R(() => {
-    if (s && e) {
-      u(
-        s ? m === W ? { opacity: 0 } : {
-          transform: "translateY(-666vh)"
-        } : {}
-      );
-      const v = setTimeout(() => {
-        u(
-          s ? m === "fade" ? { opacity: 1 } : {
-            transform: "translateY(0)"
-          } : {}
-        );
-      }, 100);
-      return () => clearTimeout(v);
-    }
-  }, [e, s, m]), /* @__PURE__ */ c(X, { children: e && /* @__PURE__ */ c($e, { open: e, onOpenChange: t, children: /* @__PURE__ */ S(Fe, { className: h.main, style: g, children: [
-    /* @__PURE__ */ S("div", { className: "flex flex-row-reverse items-center justify-between", children: [
-      /* @__PURE__ */ c(
-        Ye,
-        {
-          className: h.close,
-          trigger: /* @__PURE__ */ c(
-            z,
-            {
-              mode: "dark",
-              focusMode: "light",
-              noBorder: !0,
-              label: "Close",
-              children: /* @__PURE__ */ c(ze, {})
-            }
-          )
-        }
-      ),
-      /* @__PURE__ */ c(Ue, { className: h.header, children: r })
-    ] }),
-    /* @__PURE__ */ c(je, { className: h.content, children: a }),
-    n && /* @__PURE__ */ c("div", { className: h.footer, children: n })
-  ] }) }) });
-};
 export {
-  U as MESSAGEBOX_CLASSNAME,
-  j as PANEL_CLASSNAME,
-  Je as Panel
+  o as MESSAGEBOX_CLASSNAME,
+  E as PANEL_CLASSNAME,
+  n as Panel
 };