@versini/ui-bubble 6.0.0 → 6.0.1

package/dist/components/Bubble/Bubble.js

@@ -1,587 +1,32 @@
-import { jsx as c, jsxs as B } from "react/jsx-runtime";
-import U, { useRef as N, useLayoutEffect as P, useEffect as M, useState as G, useMemo as W, useCallback as ae } from "react";
-import o from "clsx";
-const R = "av-bubble", q = "av-button", j = "icon", Y = "button", L = "link", ie = ({
-  type: e,
-  size: r,
-  labelRight: t,
-  labelLeft: a,
-  align: i,
-  animated: l
-}) => {
-  const s = "max-h-8 py-0 px-2", d = "max-h-9 h-8 px-3", u = "max-h-12 py-2 px-4";
-  switch (e) {
-    case Y:
-    case L:
-      return o({
-        [s]: r === "small",
-        [d]: r === "medium",
-        [u]: r === "large"
-      });
-    case j:
-      return o("flex items-center", {
-        "justify-center": i === "center",
-        "justify-start": i === "left",
-        "justify-end": i === "right",
-        "h-6 w-6 p-0": r === "small" && !l && !(t || a),
-        "h-6 px-1 sm:px-2": r === "small" && !l && (t || a),
-        "h-8 w-8 p-1": r === "medium" && !l && !(t || a),
-        "h-8 px-3": r === "medium" && !l && (t || a),
-        "h-12 w-12 p-2": r === "large" && !l && !(t || a),
-        "h-12 px-4": r === "large" && !l && (t || a),
-        "h-6 py-0": r === "small" && l && !(t || a),
-        "h-6": r === "small" && l && (t || a),
-        "h-8 py-1": r === "medium" && l && !(t || a),
-        "h-8": r === "medium" && l && (t || a),
-        "h-12 py-2": r === "large" && l && !(t || a),
-        "h-12": r === "large" && l && (t || a)
-      });
-  }
-}, oe = ({
-  type: e,
-  size: r,
-  labelRight: t,
-  labelLeft: a
-}) => {
-  const i = "text-sm font-medium", l = "text-base font-medium", s = "text-lg font-medium";
-  switch (e) {
-    case Y:
-    case L:
-      return o({
-        "text-center": e === L,
-        [i]: r === "small",
-        [l]: r === "medium",
-        [s]: r === "large"
-      });
-    case j:
-      return o({
-        [i]: r === "small" && (t || a),
-        [l]: r === "medium" && (t || a),
-        [s]: r === "large" && (t || a)
-      });
-  }
-}, le = ({
-  mode: e,
-  noBackground: r,
-  truncate: t,
-  variant: a
-}) => {
-  if (r)
-    return "not-prose";
-  if (a === "primary")
-    return o("not-prose", {
-      truncate: t,
-      "text-copy-dark": e === "dark" || e === "system",
-      "text-copy-light": e === "light" || e === "alt-system",
-      "dark:text-copy-light": e === "system",
-      "dark:text-copy-dark": e === "alt-system"
-    });
-  if (a === "secondary")
-    return o("not-prose", {
-      truncate: t,
-      "text-copy-light": e === "dark" || e === "system",
-      "text-copy-dark": e === "light" || e === "alt-system",
-      "dark:text-copy-dark": e === "system",
-      "dark:text-copy-light": e === "alt-system"
-    });
-  if (a === "danger")
-    return o("not-prose", {
-      truncate: t,
-      "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 o("not-prose text-copy-lighter", {
-      truncate: t
-    });
-}, se = ({
-  mode: e,
-  noBackground: r,
-  variant: t
-}) => {
-  if (!r) {
-    if (t === "primary")
-      return o({
-        "bg-action-light": e === "dark",
-        "bg-action-dark": e === "light",
-        "bg-action-light dark:bg-action-dark": e === "system",
-        "bg-action-dark dark:bg-action-light": e === "alt-system"
-      });
-    if (t === "secondary")
-      return o({
-        "bg-action-light": e === "light",
-        "bg-action-dark": e === "dark",
-        "bg-action-light dark:bg-action-dark": e === "alt-system",
-        "bg-action-dark dark:bg-action-light": e === "system"
-      });
-    if (t === "danger")
-      return o({
-        "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 (t === "selected")
-      return "bg-action-selected-dark";
-  }
-}, ce = ({
-  radius: e
-}) => o({
-  "rounded-full": e === "large",
-  "rounded-md": e === "medium",
-  "rounded-xs": e === "small"
-}), ne = ({
-  mode: e,
-  disabled: r,
-  variant: t
-}) => {
-  if (r)
-    return "";
-  if (t === "primary")
-    return o({
-      "hover:text-copy-dark-hover": e === "dark" || e === "system",
-      "hover:text-copy-light-hover": e === "light" || e === "alt-system",
-      "dark:hover:text-copy-light-hover": e === "system",
-      "dark:hover:text-copy-dark-hover": e === "alt-system",
-      "hover:bg-action-light-hover": e === "dark",
-      "hover:bg-action-dark-hover": e === "light",
-      "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "system",
-      "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "alt-system"
-    });
-  if (t === "secondary")
-    return o({
-      "hover:text-copy-light-hover": e === "dark" || e === "system",
-      "hover:text-copy-dark-hover": e === "light" || e === "alt-system",
-      "dark:hover:text-copy-dark-hover": e === "system",
-      "dark:hover:text-copy-light-hover": e === "alt-system",
-      "hover:bg-action-light-hover": e === "light",
-      "hover:bg-action-dark-hover": e === "dark",
-      "hover:bg-action-light-hover dark:hover:bg-action-dark-hover": e === "alt-system",
-      "hover:bg-action-dark-hover dark:hover:bg-action-light-hover": e === "system"
-    });
-  if (t === "danger")
-    return o("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 (t === "selected")
-    return "hover:text-copy-light-hover hover:bg-action-selected-dark-hover";
-}, de = ({
-  mode: e,
-  disabled: r,
-  variant: t
-}) => {
-  if (r)
-    return "";
-  if (t === "primary")
-    return o({
-      "active:text-copy-dark-active": e === "dark" || e === "system",
-      "active:text-copy-light-active": e === "light" || e === "alt-system",
-      "dark:active:text-copy-light-active": e === "system",
-      "dark:active:text-copy-dark-active": e === "alt-system",
-      "active:bg-action-light-active": e === "dark",
-      "active:bg-action-dark-active": e === "light",
-      "active:bg-action-light-active dark:active:bg-action-dark-active": e === "system",
-      "active:bg-action-dark-active dark:active:bg-action-light-active": e === "alt-system"
-    });
-  if (t === "secondary")
-    return o({
-      "active:text-copy-light-active": e === "dark" || e === "system",
-      "active:text-copy-dark-active": e === "light" || e === "alt-system",
-      "dark:active:text-copy-dark-active": e === "system",
-      "dark:active:text-copy-light-active": e === "alt-system",
-      "active:bg-action-light-active": e === "light",
-      "active:bg-action-dark-active": e === "dark",
-      "active:bg-action-light-active dark:active:bg-action-dark-active": e === "alt-system",
-      "active:bg-action-dark-active dark:active:bg-action-light-active": e === "system"
-    });
-  if (t === "danger")
-    return o("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 (t === "selected")
-    return "active:text-copy-lighter-active active:bg-action-selected-dark-active";
-}, ue = ({
-  mode: e,
-  noBorder: r,
-  variant: t
-}) => {
-  if (r)
-    return "border border-transparent";
-  if (t === "primary")
-    return o("border", {
-      "border-border-medium": e === "dark",
-      "border-border-accent": e === "light",
-      "border-border-medium dark:border-border-accent": e === "system",
-      "border-border-accent dark:border-border-medium": e === "alt-system"
-    });
-  if (t === "secondary")
-    return o("border", {
-      "border-border-medium": e === "light",
-      "border-border-accent": e === "dark",
-      "border-border-medium dark:border-border-accent": e === "alt-system",
-      "border-border-accent dark:border-border-medium": e === "system"
-    });
-  if (t === "danger")
-    return o("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 (t === "selected")
-    return "border border-border-selected-dark";
-}, me = ({
-  focusMode: e
-}) => o("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"
-}), ge = ({
-  mode: e,
-  raw: r,
-  iconClassName: t,
-  variant: a = "primary"
-}) => {
-  if (r)
-    return "";
-  let i = {};
-  return a === "primary" ? i = {
-    "text-copy-dark": e === "dark" || e === "system",
-    "text-copy-light": e === "light" || e === "alt-system",
-    "dark:text-copy-light": e === "system",
-    "dark:text-copy-dark": e === "alt-system"
-  } : a === "secondary" ? i = {
-    "text-copy-light": e === "dark" || e === "system",
-    "text-copy-dark": e === "light" || e === "alt-system",
-    "dark:text-copy-dark": e === "system",
-    "dark:text-copy-light": e === "alt-system"
-  } : a === "danger" ? i = {
-    "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"
-  } : a === "selected" && (i = {
-    "text-copy-lighter": !0
-  }), o(i, t);
-}, be = ({
-  animated: e
-}) => o({
-  "transition-opacity duration-300 ease-in-out": e
-}), he = ({
-  type: e,
-  className: r,
-  raw: t,
-  mode: a,
-  focusMode: i,
-  disabled: l,
-  fullWidth: s,
-  size: d,
-  noBorder: u,
-  labelRight: y,
-  labelLeft: k,
-  noBackground: n,
-  variant: m,
-  truncate: g,
-  align: _,
-  radius: I,
-  animated: b
-}) => (m || (m = "primary"), t ? o(q, r) : o(
-  q,
-  le({
-    mode: a,
-    variant: m,
-    noBackground: n,
-    truncate: g
-  }),
-  se({ mode: a, noBackground: n, variant: m }),
-  ce({ radius: I }),
-  ie({
-    type: e,
-    size: d,
-    labelRight: y,
-    labelLeft: k,
-    align: _,
-    animated: b
-  }),
-  oe({ type: e, size: d, labelRight: y, labelLeft: k }),
-  ue({ mode: a, variant: m, noBorder: u }),
-  me({ focusMode: i }),
-  ne({ mode: a, variant: m, disabled: l }),
-  de({ mode: a, variant: m, disabled: l }),
-  {
-    "w-full": s,
-    "disabled:cursor-not-allowed disabled:opacity-50": l
-  },
-  o({
-    "transition-[width] duration-300 ease-in": b
-  }),
-  r
-)), fe = (e, r, t) => {
-  !r && (!document.activeElement || document.activeElement !== e.currentTarget) && typeof e?.currentTarget?.focus == "function" && e.currentTarget.focus(), typeof t == "function" && t(e);
-}, J = U.forwardRef((e, r) => {
-  const { onClick: t, noInternalClick: a = !1, ...i } = e;
-  return /* @__PURE__ */ c(
-    "button",
-    {
-      ref: r,
-      onClick: (l) => {
-        fe(l, a, t);
-      },
-      ...i
-    }
-  );
-});
-J.displayName = "BaseButton";
-function ye() {
-  const e = N(!1);
-  return M(() => (e.current = !0, () => {
-    e.current = !1;
-  }), []), ae(() => e.current, []);
-}
-function ve(e) {
-  return W(() => e.every((r) => r == null) ? () => {
-  } : (r) => {
-    e.forEach((t) => {
-      typeof t == "function" ? t(r) : t != null && (t.current = r);
-    });
-  }, [...e]);
-}
-const pe = {
-  x: 0,
-  y: 0,
-  width: 0,
-  height: 0,
-  top: 0,
-  left: 0,
-  bottom: 0,
-  right: 0
-};
-function O(e) {
-  const r = ye(), t = N(0), a = N(null), [i, l] = G(pe), s = W(() => typeof ResizeObserver > "u" ? null : new ResizeObserver((d) => {
-    const u = d[0];
-    u && (cancelAnimationFrame(t.current), t.current = requestAnimationFrame(() => {
-      a.current && r() && l(u.contentRect);
-    }));
-  }), [r]);
-  return M(() => (a.current && s?.observe(a.current, e), () => {
-    s?.disconnect(), t.current && cancelAnimationFrame(t.current);
-  }), [s, e]), [a, i];
-}
-const z = {
-  small: 24,
-  // w-6
-  medium: 32,
-  // w-8
-  large: 48
-  // w-12
-}, ke = {
-  small: 16,
-  // px-2 x 2
-  medium: 24,
-  // px-3 x 2
-  large: 32
-  // px-4 x 2
-}, xe = 2, we = 300, A = U.forwardRef(
-  ({
-    children: e,
-    disabled: r = !1,
-    mode: t = "system",
-    focusMode: a = "system",
-    fullWidth: i = !1,
-    className: l,
-    type: s = "button",
-    raw: d = !1,
-    noBorder: u = !1,
-    "aria-label": y,
-    label: k,
-    size: n = "medium",
-    labelRight: m,
-    labelLeft: g,
-    noBackground: _ = !1,
-    align: I = "center",
-    radius: b = "large",
-    variant: C = "secondary",
-    iconClassName: T,
-    animated: v = !1,
-    ...Q
-  }, X) => {
-    const Z = he({
-      type: j,
-      mode: t,
-      focusMode: a,
-      fullWidth: i,
-      disabled: r,
-      raw: d,
-      className: l,
-      noBorder: u,
-      size: n,
-      labelRight: m,
-      labelLeft: g,
-      noBackground: _,
-      align: I,
-      radius: b,
-      variant: C,
-      animated: v
-    }), ee = ge({ mode: t, raw: d, iconClassName: T, variant: C }), H = be({ animated: v }), te = "flex items-center justify-center relative w-full h-full overflow-hidden", [h, $] = O(), [f, S] = O(), [E, F] = O(), V = N(0), p = N(null), x = N(null), re = ve([X, p]);
-    return P(() => {
-      E && E.current && v && (V.current = F.width + ke[n] + (u ? 0 : xe), p.current && !p.current.style.width && (p.current.style.width = `${z[n]}px`));
-    }, [F, E, n, u, v]), P(() => {
-      if (p && p.current && v) {
-        let w = z[n];
-        m && h && $.width > 0 ? w = $.width + V.current : g && f && S.width > 0 && (w = S.width + V.current), x.current && clearTimeout(x.current), w !== parseInt(p.current.style.width || "0", 10) && (h.current && (h.current.style.opacity = "0"), f.current && (f.current.style.opacity = "0"), p.current.style.width = `${w}px`, w > z[n] && (x.current = setTimeout(() => {
-          h.current && m && (h.current.style.opacity = "1"), f.current && g && (f.current.style.opacity = "1"), x.current = null;
-        }, we * 0.8))), w === z[n] && (h.current && (h.current.style.opacity = "0"), f.current && (f.current.style.opacity = "0"));
-      }
-    }, [
-      $,
-      m,
-      h,
-      S,
-      g,
-      f,
-      n,
-      v
-    ]), M(() => () => {
-      x.current && clearTimeout(x.current);
-    }, []), /* @__PURE__ */ c(
-      J,
-      {
-        ref: re,
-        className: Z,
-        disabled: r,
-        type: s,
-        "aria-label": y || k,
-        ...Q,
-        children: /* @__PURE__ */ B("div", { className: te, children: [
-          /* @__PURE__ */ c(
-            D,
-            {
-              label: g,
-              labelRef: f,
-              labelClass: H,
-              labelInnerClass: "pr-2",
-              initiallyHidden: v
-            }
-          ),
-          /* @__PURE__ */ c("span", { ref: E, className: ee, children: e }),
-          /* @__PURE__ */ c(
-            D,
-            {
-              label: m,
-              labelRef: h,
-              labelClass: H,
-              labelInnerClass: "pl-2",
-              initiallyHidden: v
-            }
-          )
-        ] })
-      }
-    );
-  }
-), D = ({
-  labelRef: e,
-  labelClass: r,
-  label: t,
-  labelInnerClass: a,
-  initiallyHidden: i = !1
-}) => /* @__PURE__ */ c(
-  "span",
-  {
-    ref: e,
-    className: r,
-    style: i ? { opacity: 0 } : void 0,
-    children: t && /* @__PURE__ */ c("span", { className: a, children: t })
-  }
-);
-A.displayName = "ButtonIcon";
-/*!
-  @versini/ui-button v8.0.0
-  © 2025 gizmette.com
-*/
-try {
-  window.__VERSINI_UI_BUTTON__ || (window.__VERSINI_UI_BUTTON__ = {
-    version: "8.0.0",
-    buildTime: "09/01/2025 03:17 PM EDT",
-    homepage: "https://github.com/aversini/ui-components",
-    license: "MIT"
-  });
-} catch {
-}
-const Be = U.forwardRef(
-  ({
-    children: e,
-    mode: r = "system",
-    className: t,
-    active: a = !1,
-    ...i
-  }, l) => {
-    const s = a ? o(
-      "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": r === "dark",
-        "after:border-table-light": r === "light",
-        "after:border-table-dark dark:after:border-table-light": r === "system",
-        "after:border-table-light dark:after:border-table-dark": r === "alt-system"
-      }
-    ) : "";
-    return /* @__PURE__ */ c("div", { className: s, children: /* @__PURE__ */ c(
-      A,
-      {
-        className: t,
-        ref: l,
-        mode: r,
-        radius: "small",
-        size: "small",
-        align: "center",
-        ...i,
-        children: e
-      }
-    ) });
-  }
-);
-Be.displayName = "ButtonSort";
-const K = ({
+import { jsxs as d, jsx as s } from "react/jsx-runtime";
+import { ButtonIcon as I } from "@versini/ui-button";
+import { useState as y, useEffect as C } from "react";
+import c from "clsx";
+const p = "av-bubble", v = ({
   children: e,
-  fill: r,
-  viewBox: t,
-  className: a,
-  defaultViewBox: i,
-  size: l,
-  title: s,
-  semantic: d = !1,
-  ...u
+  fill: t,
+  viewBox: o,
+  className: i,
+  defaultViewBox: r,
+  size: n,
+  title: l,
+  semantic: b = !1,
+  ...f
 }) => {
-  const y = o(l, a);
-  return /* @__PURE__ */ B(
+  const h = c(n, i);
+  return /* @__PURE__ */ d(
     "svg",
     {
       xmlns: "http://www.w3.org/2000/svg",
-      className: y,
-      viewBox: t || i,
-      fill: r || "currentColor",
+      className: h,
+      viewBox: o || r,
+      fill: t || "currentColor",
       role: "img",
-      "aria-hidden": !d,
+      "aria-hidden": !b,
       focusable: !1,
-      ...u,
+      ...f,
       children: [
-        s && d && /* @__PURE__ */ c("title", { children: s }),
+        l && b && /* @__PURE__ */ s("title", { children: l }),
         e
       ]
     }
@@ -600,48 +45,48 @@ try {
   });
 } catch {
 }
-const Ne = ({
+const E = ({
   className: e,
-  viewBox: r,
-  title: t,
-  monotone: a,
-  ...i
-}) => /* @__PURE__ */ B(
-  K,
+  viewBox: t,
+  title: o,
+  monotone: i,
+  ...r
+}) => /* @__PURE__ */ d(
+  v,
   {
     defaultViewBox: "0 0 448 512",
     size: "size-5",
-    viewBox: r,
+    viewBox: t,
     className: e,
-    title: t || "Copied",
-    ...i,
+    title: o || "Copied",
+    ...r,
     children: [
-      /* @__PURE__ */ c(
+      /* @__PURE__ */ s(
         "path",
         {
           d: "M0 96v320c0 35.3 28.7 64 64 64h320c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64C28.7 32 0 60.7 0 96m104 160c0-6.1 2.3-12.3 7-17 9.4-9.4 24.6-9.4 33.9 0l47 47 111-111c4.7-4.7 10.8-7 17-7s12.3 2.3 17 7c2.3 2.3 4.1 5 5.3 7.9.6 1.5 1 2.9 1.3 4.4.2 1.1.3 2.2.3 2.2.1 1.2.1 1.2.1 2.5-.1 1.5-.1 1.9-.1 2.3-.1.7-.2 1.5-.3 2.2-.3 1.5-.7 3-1.3 4.4-1.2 2.9-2.9 5.6-5.3 7.9l-128 128c-4.7 4.7-10.8 7-17 7s-12.3-2.3-17-7l-64-64c-4.7-4.7-7-10.8-7-17z",
           opacity: ".4"
         }
       ),
-      /* @__PURE__ */ c("path", { d: "M337 175c9.4 9.4 9.4 24.6 0 33.9L209 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L303 175c9.4-9.4 24.6-9.4 33.9 0z" })
+      /* @__PURE__ */ s("path", { d: "M337 175c9.4 9.4 9.4 24.6 0 33.9L209 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L303 175c9.4-9.4 24.6-9.4 33.9 0z" })
     ]
   }
-), _e = ({
+), V = ({
   className: e,
-  viewBox: r,
-  title: t,
-  monotone: a,
-  ...i
-}) => /* @__PURE__ */ c(
-  K,
+  viewBox: t,
+  title: o,
+  monotone: i,
+  ...r
+}) => /* @__PURE__ */ s(
+  v,
   {
     defaultViewBox: "0 0 512 512",
     size: "size-5",
-    viewBox: r,
+    viewBox: t,
     className: e,
-    title: t || "Copy",
-    ...i,
-    children: /* @__PURE__ */ c("path", { d: "M64 464h224c8.8 0 16-7.2 16-16v-64h48v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V224c0-35.3 28.7-64 64-64h64v48H64c-8.8 0-16 7.2-16 16v224c0 8.8 7.2 16 16 16m160-160h224c8.8 0 16-7.2 16-16V64c0-8.8-7.2-16-16-16H224c-8.8 0-16 7.2-16 16v224c0 8.8 7.2 16 16 16m-64-16V64c0-35.3 28.7-64 64-64h224c35.3 0 64 28.7 64 64v224c0 35.3-28.7 64-64 64H224c-35.3 0-64-28.7-64-64" })
+    title: o || "Copy",
+    ...r,
+    children: /* @__PURE__ */ s("path", { d: "M64 464h224c8.8 0 16-7.2 16-16v-64h48v64c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V224c0-35.3 28.7-64 64-64h64v48H64c-8.8 0-16 7.2-16 16v224c0 8.8 7.2 16 16 16m160-160h224c8.8 0 16-7.2 16-16V64c0-8.8-7.2-16-16-16H224c-8.8 0-16 7.2-16 16v224c0 8.8 7.2 16 16 16m-64-16V64c0-35.3 28.7-64 64-64h224c35.3 0 64 28.7 64 64v224c0 35.3-28.7 64-64 64H224c-35.3 0-64-28.7-64-64" })
   }
 );
 /*!
@@ -657,23 +102,23 @@ try {
   });
 } catch {
 }
-const Ie = ({ kind: e, noMaxWidth: r }) => o("px-4 py-2", {
-  "max-w-xs sm:max-w-md md:max-w-2xl": !r,
-  "lg:max-w-3xl": e === "left" && !r
-}), Ce = ({ kind: e }) => o({
+const z = ({ kind: e, noMaxWidth: t }) => c("px-4 py-2", {
+  "max-w-xs sm:max-w-md md:max-w-2xl": !t,
+  "lg:max-w-3xl": e === "left" && !t
+}), S = ({ kind: e }) => c({
   "bg-surface-lighter dark:bg-surface-dark": e === "left",
   "bg-surface-accent": e === "right"
-}), Te = ({ kind: e }) => o(
+}), T = ({ kind: e }) => c(
   "prose prose-dark dark:prose-lighter",
   "prose-blockquote:my-1",
   "prose-ol:my-1 prose-ul:my-1",
   {
     "text-copy-lighter": e === "right"
   }
-), Ee = ({ kind: e, tail: r }) => {
-  if (r)
-    return o(
-      `${R}-${e}-tail`,
+), M = ({ kind: e, tail: t }) => {
+  if (t)
+    return c(
+      `${p}-${e}-tail`,
       "rounded-3xl",
       "relative",
       "before:content-['']",
@@ -686,106 +131,106 @@ const Ie = ({ kind: e, noMaxWidth: r }) => o("px-4 py-2", {
         "last-bubble-left:before:left-[2px] last-bubble-left:before:border-r-[8px] last-bubble-left:before:border-r-surface-lighter last-bubble-left:dark:before:border-r-surface-dark last-bubble-left:before:rounded-br-[100%]": e === "left"
       }
     );
-  if (!r)
-    return o("rounded-b-xl", {
+  if (!t)
+    return c("rounded-b-xl", {
       "rounded-tr-xl": e === "left",
       "rounded-tl-xl": e === "right"
     });
-}, ze = ({
+}, O = ({
   kind: e,
-  className: r,
-  contentClassName: t,
-  noMaxWidth: a,
-  tail: i
+  className: t,
+  contentClassName: o,
+  noMaxWidth: i,
+  tail: r
 }) => {
-  const l = o(
-    R,
-    `${R}-${e}`,
+  const n = c(
+    p,
+    `${p}-${e}`,
     "flex items-start",
     {
       "flex-row-reverse": e === "right"
     },
-    r
-  ), s = o(
-    `${R}-content`,
-    "flex flex-col empty:hidden",
-    Ie({ kind: e, noMaxWidth: a }),
-    Te({ kind: e }),
-    Ce({ kind: e }),
-    Ee({ kind: e, tail: i }),
     t
-  ), d = "pr-2 pt-1 text-end text-xs text-copy-light", u = o("flex flex-col-reverse sm:flex-row", {
-    "ml-2": e === "left" && !i,
-    "mr-2": e === "right" && !i,
-    "ml-1": e === "left" && i,
-    "mr-1": e === "right" && i
+  ), l = c(
+    `${p}-content`,
+    "flex flex-col empty:hidden",
+    z({ kind: e, noMaxWidth: i }),
+    T({ kind: e }),
+    S({ kind: e }),
+    M({ kind: e, tail: r }),
+    o
+  ), b = "pr-2 pt-1 text-end text-xs text-copy-light", f = c("flex flex-col-reverse sm:flex-row", {
+    "ml-2": e === "left" && !r,
+    "mr-2": e === "right" && !r,
+    "ml-1": e === "left" && r,
+    "mr-1": e === "right" && r
   });
   return {
-    wrapper: l,
-    main: s,
-    footer: d,
-    copyButton: u
+    wrapper: n,
+    main: l,
+    footer: b,
+    copyButton: f
   };
-}, Re = "FOOTER_EMPTY", Ve = ({
+}, $ = "FOOTER_EMPTY", A = ({
   children: e,
-  kind: r = "left",
-  className: t,
-  contentClassName: a,
-  footer: i,
-  rawFooter: l,
-  copyToClipboard: s,
-  copyToClipboardFocusMode: d = "system",
-  copyToClipboardMode: u = "system",
-  noMaxWidth: y = !1,
-  tail: k = !1
+  kind: t = "left",
+  className: o,
+  contentClassName: i,
+  footer: r,
+  rawFooter: n,
+  copyToClipboard: l,
+  copyToClipboardFocusMode: b = "system",
+  copyToClipboardMode: f = "system",
+  noMaxWidth: h = !1,
+  tail: B = !1
 }) => {
-  const [n, m] = G(!1), g = ze({
-    kind: r,
-    className: t,
-    contentClassName: a,
-    noMaxWidth: y,
-    tail: k
-  }), _ = !!s && (typeof s == "function" || typeof s == "string" || typeof e == "string"), I = () => {
-    m(!0), typeof s == "function" ? s(e) : typeof s == "string" ? navigator.clipboard.writeText(s) : typeof e == "string" && navigator.clipboard.writeText(e);
+  const [u, x] = y(!1), m = O({
+    kind: t,
+    className: o,
+    contentClassName: i,
+    noMaxWidth: h,
+    tail: B
+  }), _ = !!l && (typeof l == "function" || typeof l == "string" || typeof e == "string"), N = () => {
+    x(!0), typeof l == "function" ? l(e) : typeof l == "string" ? navigator.clipboard.writeText(l) : typeof e == "string" && navigator.clipboard.writeText(e);
   };
-  return M(() => {
-    let b;
-    return n && (b = window.setTimeout(() => {
-      m(!1);
+  return C(() => {
+    let a;
+    return u && (a = window.setTimeout(() => {
+      x(!1);
     }, 3e3)), () => {
-      clearTimeout(b);
+      clearTimeout(a);
     };
-  }, [n]), /* @__PURE__ */ B("div", { className: g.wrapper, children: [
-    /* @__PURE__ */ B("div", { children: [
-      /* @__PURE__ */ c("div", { className: g.main, children: e }),
-      i && Object.keys(i).map((b, C) => {
-        const T = i[b];
-        return T === Re ? /* @__PURE__ */ c("div", { className: "prose-p:m-0", children: /* @__PURE__ */ c("p", { className: g.footer, "aria-hidden": "true", children: /* @__PURE__ */ c("span", { className: "invisible", children: " " }) }) }, `${b}-${C}`) : T ? /* @__PURE__ */ c("div", { className: "prose-p:m-0", children: /* @__PURE__ */ B("p", { className: g.footer, children: [
-          b,
+  }, [u]), /* @__PURE__ */ d("div", { className: m.wrapper, children: [
+    /* @__PURE__ */ d("div", { children: [
+      /* @__PURE__ */ s("div", { className: m.main, children: e }),
+      r && Object.keys(r).map((a, w) => {
+        const g = r[a];
+        return g === $ ? /* @__PURE__ */ s("div", { className: "prose-p:m-0", children: /* @__PURE__ */ s("p", { className: m.footer, "aria-hidden": "true", children: /* @__PURE__ */ s("span", { className: "invisible", children: " " }) }) }, `${a}-${w}`) : g ? /* @__PURE__ */ s("div", { className: "prose-p:m-0", children: /* @__PURE__ */ d("p", { className: m.footer, children: [
+          a,
           ": ",
-          T
-        ] }) }, `${b}-${C}`) : null;
+          g
+        ] }) }, `${a}-${w}`) : null;
       }),
-      l && l
+      n && n
     ] }),
-    _ && /* @__PURE__ */ c("div", { className: g.copyButton, children: /* @__PURE__ */ c(
-      A,
+    _ && /* @__PURE__ */ s("div", { className: m.copyButton, children: /* @__PURE__ */ s(
+      I,
       {
         noBorder: !0,
         noBackground: !0,
         size: "small",
-        mode: u,
-        focusMode: d,
-        label: n ? "Copied to clipboard" : "Copy to clipboard",
-        onClick: I,
-        disabled: n,
-        children: n ? /* @__PURE__ */ c(Ne, { size: "size-3" }) : /* @__PURE__ */ c(_e, { size: "size-3" })
+        mode: f,
+        focusMode: b,
+        label: u ? "Copied to clipboard" : "Copy to clipboard",
+        onClick: N,
+        disabled: u,
+        children: u ? /* @__PURE__ */ s(E, { size: "size-3" }) : /* @__PURE__ */ s(V, { size: "size-3" })
       }
     ) })
   ] });
 };
 export {
-  R as BUBBLE_CLASSNAME,
-  Re as BUBBLE_FOOTER_EMPTY,
-  Ve as Bubble
+  p as BUBBLE_CLASSNAME,
+  $ as BUBBLE_FOOTER_EMPTY,
+  A as Bubble
 };

package/dist/index.js

@@ -1,12 +1,12 @@
 import { BUBBLE_CLASSNAME as i, BUBBLE_FOOTER_EMPTY as o, Bubble as E } from "./components/Bubble/Bubble.js";
 /*!
-  @versini/ui-bubble v6.0.0
+  @versini/ui-bubble v6.0.1
   © 2025 gizmette.com
 */
 try {
   window.__VERSINI_UI_BUBBLE__ || (window.__VERSINI_UI_BUBBLE__ = {
-    version: "6.0.0",
-    buildTime: "09/01/2025 03:19 PM EDT",
+    version: "6.0.1",
+    buildTime: "09/01/2025 04:02 PM EDT",
     homepage: "https://github.com/aversini/ui-components",
     license: "MIT"
   });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@versini/ui-bubble",
-	"version": "6.0.0",
+	"version": "6.0.1",
 	"license": "MIT",
 	"author": "Arno Versini",
 	"publishConfig": {
@@ -37,16 +37,16 @@
 		"test": "vitest run"
 	},
 	"peerDependencies": {
-		"react": "^19.0.0",
-		"react-dom": "^19.0.0"
+		"react": "^19.1.0",
+		"react-dom": "^19.1.0"
 	},
 	"devDependencies": {
 		"@testing-library/jest-dom": "6.8.0",
-		"@versini/ui-types": "6.0.0"
+		"@versini/ui-types": "6.0.1"
 	},
 	"dependencies": {
 		"@tailwindcss/typography": "0.5.16",
-		"@versini/ui-button": "8.0.0",
+		"@versini/ui-button": "8.0.1",
 		"@versini/ui-icons": "4.11.0",
 		"clsx": "2.1.1",
 		"tailwindcss": "4.1.12"
@@ -54,5 +54,5 @@
 	"sideEffects": [
 		"**/*.css"
 	],
-	"gitHead": "70a47e9e30172dbb7b36306773fe9511e437fba6"
+	"gitHead": "dcc216644c8c3e7d43a49ea655a22aed21fa4b83"
 }