@kakadu/components 3.1.4 → 3.2.0

package/build/components/popover-menu.mjs

@@ -1,103 +1,104 @@
 import { j as n } from "../jsx-runtime-B4hRZ52C.mjs";
 import { cx as b } from "@kuma-ui/core";
-import { useMemo as f, useState as h, useCallback as v, useEffect as y } from "react";
-import { buttonResetStyles as E } from "../theme.mjs";
+import { useMemo as v, useState as h, useCallback as x, useEffect as y } from "react";
+import { buttonResetStyles as M } from "../theme.mjs";
 import g from "../icons/icon.mjs";
-import M, { PopoverContainer as S, usePopover as K, usePopoverContext as w } from "./popover.mjs";
+import E, { PopoverContainer as S, usePopover as K, usePopoverContext as w } from "./popover.mjs";
 import F from "./atom.mjs";
 import { Span as I } from "./text.mjs";
 import A, { normalBlendStyles as D } from "./hover-gradient.mjs";
 import H from "./click-ripples.mjs";
 import z from "./separator.mjs";
-import L from "./decorators.mjs";
-const k = /* @__PURE__ */ new Set();
+import C from "./decorators.mjs";
+const j = /* @__PURE__ */ new Set();
 function N() {
-  const [e, t] = h(!1), o = v((r) => {
-    t(r);
-    for (const i of k)
-      i(r);
+  const [e, t] = h(!1), s = x((o) => {
+    t(o);
+    for (const i of j)
+      i(o);
   }, []);
   return y(() => {
-    const r = (i) => {
+    const o = (i) => {
       t(i);
     };
-    return k.add(r), () => {
-      k.delete(r);
+    return j.add(o), () => {
+      j.delete(o);
     };
-  }, []), f(() => ({
+  }, []), v(() => ({
     isKeyboardNavigating: e,
-    setIsKeyboardNavigating: o
-  }), [e, o]);
+    setIsKeyboardNavigating: s
+  }), [e, s]);
 }
-function R({
+function L({
   label: e,
   iconLeft: t,
-  iconRight: o,
-  href: r,
+  iconRight: s,
+  href: o,
   shouldCloseOnClick: i = !0,
-  decorators: x = [],
-  submenu: m,
+  decorators: k = [],
+  submenu: d,
   className: a,
-  onClick: s,
-  ...u
+  onClick: r,
+  ...p
 }) {
   const {
-    isFocused: c,
-    close: d
+    isFocused: u,
+    close: c
   } = w(), {
-    isKeyboardNavigating: p
-  } = N(), l = v((P) => {
-    c && (s == null || s(P), m ? m.show() : i && (d == null || d()));
-  }, [c, s, i, d, m]), j = f(() => /* @__PURE__ */ n.jsxs(F, { as: r ? "a" : "button", ...u, type: r ? void 0 : "button", role: "menuitem", href: r, className: b(E, "kakadu-components-3114599304", p ? "kakadu-components-4096376656" : "kakadu-components-2554182777", a), onClick: l, children: [
+    isKeyboardNavigating: f
+  } = N(), m = x((P) => {
+    u && (r == null || r(P), d ? d.show() : i && (c == null || c()));
+  }, [u, r, i, c, d]), l = v(() => /* @__PURE__ */ n.jsxs(F, { as: o ? "a" : "button", ...p, type: o ? void 0 : "button", role: "menuitem", href: o, className: b(M, "kakadu-components-3114599304", f ? "kakadu-components-4096376656" : "kakadu-components-2554182777", a), onClick: m, children: [
     /* @__PURE__ */ n.jsxs(I, { className: "kakadu-components-1109353535", children: [
       t ? /* @__PURE__ */ n.jsx(g, { width: 12, height: 12, type: t }) : null,
       /* @__PURE__ */ n.jsx("span", { className: "kakadu-components-913703148", children: e }),
-      o ? /* @__PURE__ */ n.jsx(g, { width: 12, height: 12, type: o }) : null
+      s ? /* @__PURE__ */ n.jsx(g, { width: 12, height: 12, type: s }) : null
     ] }),
-    p ? null : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
+    f ? null : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
       /* @__PURE__ */ n.jsx(A, { size: 150, className: D }),
       /* @__PURE__ */ n.jsx(H, { size: 100 })
     ] })
-  ] }), [p, u, r, a, l, t, e, o]);
-  return /* @__PURE__ */ n.jsx(L, { decorators: x, children: m ? /* @__PURE__ */ n.jsx(T, { menu: m.popoverMenu, className: "kakadu-components-1861176543", children: j }) : j });
+  ] }), [f, p, o, a, m, t, e, s]);
+  return /* @__PURE__ */ n.jsx(C, { decorators: k, children: d ? /* @__PURE__ */ n.jsx(T, { menu: d.popoverMenu, className: "kakadu-components-1861176543", children: l }) : l });
 }
-function B(e) {
+function R(e) {
   if ("type" in e) {
     if (e.type === "separator")
       return /* @__PURE__ */ n.jsx(z, {});
     if (e.type === "group")
       return /* @__PURE__ */ n.jsx(I, { className: "kakadu-components-1499037363", children: e.label });
   }
-  return /* @__PURE__ */ n.jsx(R, { ...e });
+  return /* @__PURE__ */ n.jsx(L, { ...e });
 }
-function C({
+function B({
   items: e
 }) {
   const {
     isFocused: t
-  } = w(), [o, r] = h([]), {
+  } = w(), [s, o] = h([]), {
     setIsKeyboardNavigating: i
-  } = N(), x = v((a) => {
-    a && r((s) => [...s, a]);
-  }, []), m = v((a) => {
+  } = N(), k = x((a) => {
+    a && o((r) => r.includes(a) ? r : [...r, a]);
+  }, []), d = x((a) => {
     t && (a.currentTarget.focus(), i(!1));
   }, [t, i]);
   return y(() => {
     if (!t)
       return;
-    const a = (s) => {
-      const u = o.length;
+    const a = (r) => {
+      const p = s.filter((l) => l.isConnected), u = p.length;
       if (u === 0)
         return;
       let c;
-      const d = document.activeElement, p = d ? o.indexOf(d) : 0;
-      switch (s.key) {
+      const f = document.activeElement;
+      let m = f ? p.indexOf(f) : -1;
+      switch (m === -1 && (m = 0), r.key) {
         case "ArrowDown": {
-          c = (p + 1) % u;
+          c = (m + 1) % u;
           break;
         }
         case "ArrowUp": {
-          c = (p - 1 + u) % u;
+          c = (m - 1 + u) % u;
           break;
         }
         case "Home": {
@@ -110,8 +111,8 @@ function C({
         }
       }
       if (c !== void 0) {
-        s.preventDefault(), s.stopPropagation();
-        const l = o[c];
+        r.preventDefault(), r.stopPropagation();
+        const l = p[c];
         l && (l.focus(), i(!0));
       }
     };
@@ -122,41 +123,41 @@ function C({
         capture: !0
       });
     };
-  }, [t, o, i]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((a, s) => /* @__PURE__ */ n.jsx(
-    B,
+  }, [t, s, i]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((a, r) => /* @__PURE__ */ n.jsx(
+    R,
     {
       ...a,
-      reference: x,
-      onMouseEnter: m
+      reference: k,
+      onMouseEnter: d
     },
-    s
+    r
   )) });
 }
 function G({
   items: e,
   ...t
 }) {
-  return /* @__PURE__ */ n.jsx(M, { ...t, as: "nav", role: "menu", innerClassName: "kakadu-components-3600436535", children: /* @__PURE__ */ n.jsx(C, { items: e }) });
+  return /* @__PURE__ */ n.jsx(E, { ...t, as: "nav", role: "menu", innerClassName: "kakadu-components-3600436535", children: /* @__PURE__ */ n.jsx(B, { items: e }) });
 }
 function ee(e) {
-  const t = f(() => ({
+  const t = v(() => ({
     items: e
   }), [e]), {
-    show: o,
-    popover: r
+    show: s,
+    popover: o
   } = K(G, t);
-  return f(() => ({
-    show: o,
-    popoverMenu: r
-  }), [o, r]);
+  return v(() => ({
+    show: s,
+    popoverMenu: o
+  }), [s, o]);
 }
 function T({
   menu: e,
   className: t,
-  children: o
+  children: s
 }) {
   return /* @__PURE__ */ n.jsxs(S, { className: t, children: [
-    o,
+    s,
     e
   ] });
 }

package/build/components/popover.d.ts

@@ -22,7 +22,7 @@ type PopoverBaseProperties<PopoverResult> = Omit<PopoverProperties<PopoverResult
 export default function Popover<Data = any, Type extends AtomElementType = DefaultAtomElementType>({ as, isVisible, label, shouldCloseOnOutsideClick, shouldCloseOnEscapePress, children, className, innerClassName, onClose, ...properties }: PopoverProperties<Data, Type>): import("react/jsx-runtime").JSX.Element;
 export declare function usePopover<PopoverResult, PopoverProperties = PopoverBaseProperties<PopoverResult>>(PopoverComponent: ComponentType<PopoverProperties>, properties?: PopoverProperties): {
     isVisible: boolean;
-    show: (reference?: HTMLElement) => Promise<PopoverResult | undefined>;
+    show: () => Promise<PopoverResult | undefined>;
     popover: import("react/jsx-runtime").JSX.Element;
 };
 export {};

package/build/components/popover.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../jsx-runtime-BB_1_6y_.js"),d=require("@kuma-ui/core"),e=require("react"),H=require("../focus-trap-react-CcpTuiJi.js"),E=require("./atom.js"),z=e.createContext({isVisible:!1,isFocused:!1}),{Provider:U}=z;function G(){return e.useContext(z)}function J({as:u,className:s,...o}){return n.jsxRuntimeExports.jsx(E.default,{as:u??E.defaultAtomElementType,...o,className:d.cx("kakadu-components-2845019685",s)})}function K({as:u,isVisible:s,label:o,shouldCloseOnOutsideClick:m=!0,shouldCloseOnEscapePress:c=!0,children:i,className:k,innerClassName:R,onClose:r,...p}){const a=e.useRef(null),x=e.useRef(null),[C,h]=e.useState(!1),[I,B]=e.useState(!1),[l,g]=e.useState(!1),S=e.useCallback(t=>{a.current=t,g(!1)},[]),w=e.useRef(null),M=e.useCallback(t=>{t&&(w.current=t)},[]),W=e.useMemo(()=>({initialFocus:()=>w.current??void 0,onActivate(){var t;(t=w.current)==null||t.focus(),h(!0)},returnFocusOnDeactivate:!1,clickOutsideDeactivates:m,escapeDeactivates:c,onUnpause(){h(!0)},onPause(){h(!1)},onDeactivate(){g(!1),h(!1)}}),[m,c]),[q,N]=e.useState(s??!1),$=e.useMemo(()=>({isVisible:q,isFocused:C,setInitialFocus:M,close:S}),[q,C,M,S]),[f,O]=e.useState("center");return e.useEffect(()=>{const t=x.current;if(t){const P=()=>{const D=t.offsetParent,T=D instanceof HTMLElement?D.getBoundingClientRect():null,L=t.getBoundingClientRect();if(!T){O("center");return}const b=16,y=window.innerWidth-b,F=T.left+T.width/2-L.width/2,V=F+L.width,A=F<b,_=V>y;let v="center";if(A&&_){const j=b-F;v=V-y>j?"right":"left"}else _?v="right":A&&(v="left");O(j=>j===v?j:v)};return P(),window.addEventListener("resize",P),()=>{window.removeEventListener("resize",P)}}},[]),e.useEffect(()=>{s&&(B(!0),N(!0))},[s]),e.useEffect(()=>{if(s){const t=setTimeout(()=>{g(!0)},100);return()=>{clearTimeout(t)}}g(!1)},[s]),e.useEffect(()=>{if(I&&!l){const t=setTimeout(()=>{r==null||r(a.current??void 0),N(!1)},370);return()=>{clearTimeout(t)}}},[I,l,r]),n.jsxRuntimeExports.jsx(E.default,{reference:x,as:u??E.defaultAtomElementType,role:"dialog","aria-hidden":!l,"aria-label":o??"Popover",...p,className:d.cx("kakadu-components-3920007758",f==="left"&&"kakadu-components-611400930",f==="right"&&"kakadu-components-944244368",l&&"kakadu-components-1399012551",k),children:n.jsxRuntimeExports.jsxs("div",{className:d.cx("kakadu-components-1118152266",l&&"kakadu-components-231244945"),children:[n.jsxRuntimeExports.jsx("div",{className:d.cx("kakadu-components-1951789226",f==="left"&&"kakadu-components-1495725644",f==="right"&&"kakadu-components-4235689197")}),n.jsxRuntimeExports.jsx(H.focusTrapReactExports.FocusTrap,{active:l,focusTrapOptions:W,children:n.jsxRuntimeExports.jsxs("div",{className:d.cx("kakadu-components-2488426662",R),children:[n.jsxRuntimeExports.jsx(U,{value:$,children:i}),n.jsxRuntimeExports.jsx("div",{className:d.cx("kakadu-components-3252390100",f==="left"&&"kakadu-components-3754561431",f==="right"&&"kakadu-components-2265262600")})]})})]})})}function Q(u,s){const[o,m]=e.useState(!1),c=e.useRef(void 0),i=e.useRef(null),k=e.useCallback(async p=>(m(!0),i.current=p??document.activeElement,new Promise(a=>{c.current=a})),[]),R=e.useCallback(p=>{var a;if(m(!1),(a=c.current)==null||a.call(c,p),c.current=void 0,i.current){const x=i.current;x.isConnected&&x.focus(),i.current=null}},[]),r=e.useMemo(()=>n.jsxRuntimeExports.jsx(u,{...s,isVisible:o,onClose:R}),[u,s,o,R]);return e.useMemo(()=>({isVisible:o,show:k,popover:r}),[o,k,r])}exports.PopoverContainer=J;exports.default=K;exports.usePopover=Q;exports.usePopoverContext=G;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../jsx-runtime-BB_1_6y_.js"),l=require("@kuma-ui/core"),e=require("react"),H=require("../focus-trap-react-CcpTuiJi.js"),g=require("./atom.js"),z=e.createContext({isVisible:!1,isFocused:!1}),{Provider:U}=z;function G(){return e.useContext(z)}function J({as:r,className:s,...o}){return n.jsxRuntimeExports.jsx(g.default,{as:r??g.defaultAtomElementType,...o,className:l.cx("kakadu-components-2845019685",s)})}function K({as:r,isVisible:s,label:o,shouldCloseOnOutsideClick:f=!0,shouldCloseOnEscapePress:c=!0,children:m,className:p,innerClassName:x,onClose:a,...v}){const b=e.useRef(null),F=e.useRef(null),[I,k]=e.useState(!1),[S,B]=e.useState(!1),[u,R]=e.useState(!1),C=e.useCallback(t=>{b.current=t,R(!1)},[]),j=e.useRef(null),M=e.useCallback(t=>{t&&(j.current=t)},[]),W=e.useMemo(()=>({initialFocus:()=>j.current??void 0,onActivate(){var t;(t=j.current)==null||t.focus(),k(!0)},clickOutsideDeactivates:f,escapeDeactivates:c,onUnpause(){k(!0)},onPause(){k(!1)},onDeactivate(){R(!1),k(!1)}}),[f,c]),[q,N]=e.useState(s??!1),$=e.useMemo(()=>({isVisible:q,isFocused:I,setInitialFocus:M,close:C}),[q,I,M,C]),[i,L]=e.useState("center");return e.useEffect(()=>{const t=F.current;if(t){const w=()=>{const O=t.offsetParent,E=O instanceof HTMLElement?O.getBoundingClientRect():null,y=t.getBoundingClientRect();if(!E){L("center");return}const P=16,D=window.innerWidth-P,T=E.left+E.width/2-y.width/2,V=T+y.width,A=T<P,_=V>D;let d="center";if(A&&_){const h=P-T;d=V-D>h?"right":"left"}else _?d="right":A&&(d="left");L(h=>h===d?h:d)};return w(),window.addEventListener("resize",w),()=>{window.removeEventListener("resize",w)}}},[]),e.useEffect(()=>{s&&(B(!0),N(!0))},[s]),e.useEffect(()=>{if(s){const t=setTimeout(()=>{R(!0)},100);return()=>{clearTimeout(t)}}R(!1)},[s]),e.useEffect(()=>{if(S&&!u){const t=setTimeout(()=>{a==null||a(b.current??void 0),N(!1)},370);return()=>{clearTimeout(t)}}},[S,u,a]),n.jsxRuntimeExports.jsx(g.default,{reference:F,as:r??g.defaultAtomElementType,role:"dialog","aria-hidden":!u,"aria-label":o??"Popover",...v,className:l.cx("kakadu-components-3920007758",i==="left"&&"kakadu-components-611400930",i==="right"&&"kakadu-components-944244368",u&&"kakadu-components-1399012551",p),children:n.jsxRuntimeExports.jsxs("div",{className:l.cx("kakadu-components-1118152266",u&&"kakadu-components-231244945"),children:[n.jsxRuntimeExports.jsx("div",{className:l.cx("kakadu-components-1951789226",i==="left"&&"kakadu-components-1495725644",i==="right"&&"kakadu-components-4235689197")}),n.jsxRuntimeExports.jsx(H.focusTrapReactExports.FocusTrap,{active:u,focusTrapOptions:W,children:n.jsxRuntimeExports.jsxs("div",{className:l.cx("kakadu-components-2488426662",x),children:[n.jsxRuntimeExports.jsx(U,{value:$,children:m}),n.jsxRuntimeExports.jsx("div",{className:l.cx("kakadu-components-3252390100",i==="left"&&"kakadu-components-3754561431",i==="right"&&"kakadu-components-2265262600")})]})})]})})}function Q(r,s){const[o,f]=e.useState(!1),c=e.useRef(void 0),m=e.useCallback(async()=>(f(!0),new Promise(a=>{c.current=a})),[]),p=e.useCallback(a=>{var v;f(!1),(v=c.current)==null||v.call(c,a),c.current=void 0},[]),x=e.useMemo(()=>n.jsxRuntimeExports.jsx(r,{...s,isVisible:o,onClose:p}),[r,s,o,p]);return e.useMemo(()=>({isVisible:o,show:m,popover:x}),[o,m,x])}exports.PopoverContainer=J;exports.default=K;exports.usePopover=Q;exports.usePopoverContext=G;

package/build/components/popover.mjs

@@ -1,6 +1,6 @@
 import { j as n } from "../jsx-runtime-B4hRZ52C.mjs";
-import { cx as f } from "@kuma-ui/core";
-import { createContext as Y, useRef as h, useState as d, useCallback as P, useMemo as T, useEffect as F, useContext as Z } from "react";
+import { cx as u } from "@kuma-ui/core";
+import { createContext as Y, useRef as j, useState as l, useCallback as R, useMemo as P, useEffect as w, useContext as Z } from "react";
 import { f as _ } from "../focus-trap-react-DYXrtbDH.mjs";
 import q, { defaultAtomElementType as G } from "./atom.mjs";
 const J = Y({
@@ -9,125 +9,121 @@ const J = Y({
 }), {
   Provider: $
 } = J;
-function re() {
+function ce() {
   return Z(J);
 }
-function ae({
-  as: a,
+function re({
+  as: c,
   className: t,
   ...s
 }) {
-  return /* @__PURE__ */ n.jsx(q, { as: a ?? G, ...s, className: f("kakadu-components-2845019685", t) });
+  return /* @__PURE__ */ n.jsx(q, { as: c ?? G, ...s, className: u("kakadu-components-2845019685", t) });
 }
 function ie({
-  as: a,
+  as: c,
   isVisible: t,
   label: s,
-  shouldCloseOnOutsideClick: m = !0,
+  shouldCloseOnOutsideClick: d = !0,
   shouldCloseOnEscapePress: o = !0,
-  children: i,
-  className: x,
-  innerClassName: g,
-  onClose: c,
-  ...p
+  children: m,
+  className: p,
+  innerClassName: k,
+  onClose: a,
+  ...v
 }) {
-  const r = h(null), v = h(null), [L, w] = d(!1), [O, K] = d(!1), [u, j] = d(!1), V = P((e) => {
-    r.current = e, j(!1);
-  }, []), I = h(null), A = P((e) => {
-    e && (I.current = e);
-  }, []), Q = T(() => ({
-    initialFocus: () => I.current ?? void 0,
+  const N = j(null), L = j(null), [D, h] = l(!1), [O, K] = l(!1), [r, x] = l(!1), V = R((e) => {
+    N.current = e, x(!1);
+  }, []), T = j(null), A = R((e) => {
+    e && (T.current = e);
+  }, []), Q = P(() => ({
+    initialFocus: () => T.current ?? void 0,
     onActivate() {
       var e;
-      (e = I.current) == null || e.focus(), w(!0);
+      (e = T.current) == null || e.focus(), h(!0);
     },
-    returnFocusOnDeactivate: !1,
-    clickOutsideDeactivates: m,
+    clickOutsideDeactivates: d,
     escapeDeactivates: o,
     onUnpause() {
-      w(!0);
+      h(!0);
     },
     onPause() {
-      w(!1);
+      h(!1);
     },
     onDeactivate() {
-      j(!1), w(!1);
+      x(!1), h(!1);
     }
-  }), [m, o]), [C, y] = d(t ?? !1), X = T(() => ({
-    isVisible: C,
-    isFocused: L,
+  }), [d, o]), [y, z] = l(t ?? !1), X = P(() => ({
+    isVisible: y,
+    isFocused: D,
     setInitialFocus: A,
     close: V
-  }), [C, L, A, V]), [l, z] = d("center");
-  return F(() => {
-    const e = v.current;
+  }), [y, D, A, V]), [i, B] = l("center");
+  return w(() => {
+    const e = L.current;
     if (e) {
-      const E = () => {
-        const B = e.offsetParent, b = B instanceof HTMLElement ? B.getBoundingClientRect() : null, M = e.getBoundingClientRect();
-        if (!b) {
-          z("center");
+      const F = () => {
+        const C = e.offsetParent, I = C instanceof HTMLElement ? C.getBoundingClientRect() : null, M = e.getBoundingClientRect();
+        if (!I) {
+          B("center");
           return;
         }
-        const N = 16, W = window.innerWidth - N, D = b.left + b.width / 2 - M.width / 2, H = D + M.width, S = D < N, U = H > W;
-        let k = "center";
+        const b = 16, W = window.innerWidth - b, E = I.left + I.width / 2 - M.width / 2, H = E + M.width, S = E < b, U = H > W;
+        let f = "center";
         if (S && U) {
-          const R = N - D;
-          k = H - W > R ? "right" : "left";
-        } else U ? k = "right" : S && (k = "left");
-        z((R) => R === k ? R : k);
+          const g = b - E;
+          f = H - W > g ? "right" : "left";
+        } else U ? f = "right" : S && (f = "left");
+        B((g) => g === f ? g : f);
       };
-      return E(), window.addEventListener("resize", E), () => {
-        window.removeEventListener("resize", E);
+      return F(), window.addEventListener("resize", F), () => {
+        window.removeEventListener("resize", F);
       };
     }
-  }, []), F(() => {
-    t && (K(!0), y(!0));
-  }, [t]), F(() => {
+  }, []), w(() => {
+    t && (K(!0), z(!0));
+  }, [t]), w(() => {
     if (t) {
       const e = setTimeout(() => {
-        j(!0);
+        x(!0);
       }, 100);
       return () => {
         clearTimeout(e);
       };
     }
-    j(!1);
-  }, [t]), F(() => {
-    if (O && !u) {
+    x(!1);
+  }, [t]), w(() => {
+    if (O && !r) {
       const e = setTimeout(() => {
-        c == null || c(r.current ?? void 0), y(!1);
+        a == null || a(N.current ?? void 0), z(!1);
       }, 370);
       return () => {
         clearTimeout(e);
       };
     }
-  }, [O, u, c]), /* @__PURE__ */ n.jsx(q, { reference: v, as: a ?? G, role: "dialog", "aria-hidden": !u, "aria-label": s ?? "Popover", ...p, className: f("kakadu-components-3920007758", l === "left" && "kakadu-components-611400930", l === "right" && "kakadu-components-944244368", u && "kakadu-components-1399012551", x), children: /* @__PURE__ */ n.jsxs("div", { className: f("kakadu-components-1118152266", u && "kakadu-components-231244945"), children: [
-    /* @__PURE__ */ n.jsx("div", { className: f("kakadu-components-1951789226", l === "left" && "kakadu-components-1495725644", l === "right" && "kakadu-components-4235689197") }),
-    /* @__PURE__ */ n.jsx(_.FocusTrap, { active: u, focusTrapOptions: Q, children: /* @__PURE__ */ n.jsxs("div", { className: f("kakadu-components-2488426662", g), children: [
-      /* @__PURE__ */ n.jsx($, { value: X, children: i }),
-      /* @__PURE__ */ n.jsx("div", { className: f("kakadu-components-3252390100", l === "left" && "kakadu-components-3754561431", l === "right" && "kakadu-components-2265262600") })
+  }, [O, r, a]), /* @__PURE__ */ n.jsx(q, { reference: L, as: c ?? G, role: "dialog", "aria-hidden": !r, "aria-label": s ?? "Popover", ...v, className: u("kakadu-components-3920007758", i === "left" && "kakadu-components-611400930", i === "right" && "kakadu-components-944244368", r && "kakadu-components-1399012551", p), children: /* @__PURE__ */ n.jsxs("div", { className: u("kakadu-components-1118152266", r && "kakadu-components-231244945"), children: [
+    /* @__PURE__ */ n.jsx("div", { className: u("kakadu-components-1951789226", i === "left" && "kakadu-components-1495725644", i === "right" && "kakadu-components-4235689197") }),
+    /* @__PURE__ */ n.jsx(_.FocusTrap, { active: r, focusTrapOptions: Q, children: /* @__PURE__ */ n.jsxs("div", { className: u("kakadu-components-2488426662", k), children: [
+      /* @__PURE__ */ n.jsx($, { value: X, children: m }),
+      /* @__PURE__ */ n.jsx("div", { className: u("kakadu-components-3252390100", i === "left" && "kakadu-components-3754561431", i === "right" && "kakadu-components-2265262600") })
     ] }) })
   ] }) });
 }
-function ue(a, t) {
-  const [s, m] = d(!1), o = h(void 0), i = h(null), x = P(async (p) => (m(!0), i.current = p ?? document.activeElement, new Promise((r) => {
-    o.current = r;
-  })), []), g = P((p) => {
-    var r;
-    if (m(!1), (r = o.current) == null || r.call(o, p), o.current = void 0, i.current) {
-      const v = i.current;
-      v.isConnected && v.focus(), i.current = null;
-    }
-  }, []), c = T(() => /* @__PURE__ */ n.jsx(a, { ...t, isVisible: s, onClose: g }), [a, t, s, g]);
-  return T(() => ({
+function ue(c, t) {
+  const [s, d] = l(!1), o = j(void 0), m = R(async () => (d(!0), new Promise((a) => {
+    o.current = a;
+  })), []), p = R((a) => {
+    var v;
+    d(!1), (v = o.current) == null || v.call(o, a), o.current = void 0;
+  }, []), k = P(() => /* @__PURE__ */ n.jsx(c, { ...t, isVisible: s, onClose: p }), [c, t, s, p]);
+  return P(() => ({
     isVisible: s,
-    show: x,
-    popover: c
-  }), [s, x, c]);
+    show: m,
+    popover: k
+  }), [s, m, k]);
 }
 export {
-  ae as PopoverContainer,
+  re as PopoverContainer,
   ie as default,
   ue as usePopover,
-  re as usePopoverContext
+  ce as usePopoverContext
 };

package/build/components/skeleton.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../jsx-runtime-BB_1_6y_.js"),x=require("react"),l=require("@kuma-ui/core");function o({label:u,width:t,height:s,className:a,children:r,isAnimated:n=!0,...c}){return e.jsxRuntimeExports.jsx("span",{...c,"aria-label":u,className:l.cx("kakadu-components-4149648046",n&&"kakadu-components-2124144438",a),style:{width:t,height:s},children:r??e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:" "})})}const i="kakadu-components-3140855657";function m({label:u,lines:t=1,isAnimated:s=!0}){const a=x.useMemo(()=>{const r=[];if(t<=1)return r;for(let n=1;n<t;n+=1)r.push(e.jsxRuntimeExports.jsx(o,{"aria-hidden":!0,width:"100%",height:"1em",isAnimated:s,className:i},n));return r},[t,s]);return t<1?null:t===1?e.jsxRuntimeExports.jsx(o,{"aria-busy":!0,label:u,width:"100%",height:"1em",isAnimated:s,role:"status",className:i}):e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[a,e.jsxRuntimeExports.jsx(o,{"aria-busy":!0,label:u,width:"60%",height:"1em",isAnimated:s,role:"status",className:i})]})}exports.SkeletonInstance=o;exports.default=m;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../jsx-runtime-BB_1_6y_.js"),x=require("react"),l=require("@kuma-ui/core");function o({label:u,width:t,height:s,className:a,children:r,isAnimated:n=!0,...c}){return e.jsxRuntimeExports.jsx("span",{...c,"aria-label":u,className:l.cx("kakadu-components-4254676273",n&&"kakadu-components-574297718",a),style:{width:t,height:s},children:r??e.jsxRuntimeExports.jsx(e.jsxRuntimeExports.Fragment,{children:" "})})}const i="kakadu-components-3140855657";function m({label:u,lines:t=1,isAnimated:s=!0}){const a=x.useMemo(()=>{const r=[];if(t<=1)return r;for(let n=1;n<t;n+=1)r.push(e.jsxRuntimeExports.jsx(o,{"aria-hidden":!0,width:"100%",height:"1em",isAnimated:s,className:i},n));return r},[t,s]);return t<1?null:t===1?e.jsxRuntimeExports.jsx(o,{"aria-busy":!0,label:u,width:"100%",height:"1em",isAnimated:s,role:"status",className:i}):e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[a,e.jsxRuntimeExports.jsx(o,{"aria-busy":!0,label:u,width:"60%",height:"1em",isAnimated:s,role:"status",className:i})]})}exports.SkeletonInstance=o;exports.default=m;

package/build/components/skeleton.mjs

@@ -10,7 +10,7 @@ function u({
   isAnimated: a = !0,
   ...c
 }) {
-  return /* @__PURE__ */ e.jsx("span", { ...c, "aria-label": n, className: l("kakadu-components-4149648046", a && "kakadu-components-2124144438", o), style: {
+  return /* @__PURE__ */ e.jsx("span", { ...c, "aria-label": n, className: l("kakadu-components-4254676273", a && "kakadu-components-574297718", o), style: {
     width: t,
     height: r
   }, children: s ?? /* @__PURE__ */ e.jsx(e.Fragment, { children: " " }) });

package/build/components/text-button.d.ts

@@ -10,6 +10,7 @@ type BaseTextButtonProperties = Omit<HTMLProps<HTMLButtonElement>, 'children'> &
     readonly variant?: TextButtonVariant;
     readonly tooltip?: string;
     readonly tooltipPosition?: ButtonTooltipPosition;
+    readonly isSkeleton?: boolean;
 };
 export type TextButtonProperties = BaseTextButtonProperties & ({
     children: ReactNode;
@@ -18,5 +19,5 @@ export type TextButtonProperties = BaseTextButtonProperties & ({
     children?: never;
     label: string;
 });
-export default function TextButton({ iconLeft, iconRight, variant, tooltip, tooltipPosition, href, target, rel, disabled, className, children, label, ...properties }: TextButtonProperties): import("react/jsx-runtime").JSX.Element;
+export default function TextButton({ iconLeft, iconRight, variant, tooltip, tooltipPosition, href, target, rel, disabled, isSkeleton, className, children, label, ...properties }: TextButtonProperties): import("react/jsx-runtime").JSX.Element;
 export {};

package/build/components/text-button.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../jsx-runtime-BB_1_6y_.js"),a=require("@kuma-ui/core"),x=require("../icons/icon.js"),l=require("./flex.js"),R=require("./text.js"),q=require("./click-ripples.js"),m=require("./hover-gradient.js"),v=require("./button-tooltip.js"),_=require("./aria-text.js"),B=require("./atom.js");var p=(t=>(t.primary="primary",t.delete="delete",t))(p||{});const b="kakadu-components-4017654514";function f({iconLeft:t,iconRight:n,variant:i="primary",tooltip:u,tooltipPosition:c,href:o,target:d,rel:j,disabled:r,className:k,children:s,label:E,...y}){return e.jsxRuntimeExports.jsxs(B.default,{...y,as:o?"a":"button",type:o?void 0:"button",href:o,target:d,rel:j,disabled:o?void 0:r,className:a.cx(R.textShadowStyles,"kakadu-components-1202323410",s&&(t||n)?a.cx(!!t&&"kakadu-components-497190725",!!n&&"kakadu-components-3729381008"):"kakadu-components-3866032606",i==="delete"&&b,k),children:[e.jsxRuntimeExports.jsxs(l.default,{direction:"row",gap:.5,alignment:l.FlexAlignment.center,children:[t?e.jsxRuntimeExports.jsx("div",{className:a.cx("kakadu-components-2031441451",s?"kakadu-components-2885581246":"kakadu-components-611756781"),children:typeof t=="string"?e.jsxRuntimeExports.jsx(x.default,{width:14,height:14,type:t}):t}):null,s?e.jsxRuntimeExports.jsx("span",{className:"kakadu-components-2362298521",children:s}):e.jsxRuntimeExports.jsx(_.default,{children:E}),n?e.jsxRuntimeExports.jsx("div",{className:a.cx("kakadu-components-2031441451",s?"kakadu-components-2285425267":"kakadu-components-611756781"),children:typeof n=="string"?e.jsxRuntimeExports.jsx(x.default,{width:14,height:14,type:n}):n}):null]}),e.jsxRuntimeExports.jsxs("span",{className:"kakadu-components-1343580459",children:[r?null:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(q.default,{size:s?void 0:50}),e.jsxRuntimeExports.jsx(m.default,{size:s?void 0:50,className:m.normalBlendStyles})]}),u?e.jsxRuntimeExports.jsx(v.default,{label:u,position:c}):null]})]})}exports.TextButtonVariant=p;exports.default=f;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../jsx-runtime-BB_1_6y_.js"),a=require("@kuma-ui/core"),i=require("../icons/icon.js"),m=require("./flex.js"),_=require("./text.js"),h=require("./click-ripples.js"),c=require("./hover-gradient.js"),B=require("./button-tooltip.js"),f=require("./aria-text.js"),b=require("./atom.js"),N=require("./skeleton.js");var p=(s=>(s.primary="primary",s.delete="delete",s))(p||{});const g="kakadu-components-4017654514";function w({iconLeft:s,iconRight:n,variant:d="primary",tooltip:u,tooltipPosition:j,href:x,target:k,rel:E,disabled:v,isSkeleton:r,className:R,children:t,label:y,...q}){const l=!!v||!!r,o=x&&!r;return e.jsxRuntimeExports.jsxs("div",{className:a.cx("kakadu-components-1400843519",t&&(s||n)?a.cx(!!s&&"kakadu-components-497190725",!!n&&"kakadu-components-3729381008"):"kakadu-components-3866032606"),children:[e.jsxRuntimeExports.jsxs(b.default,{...q,as:o?"a":"button",type:o?void 0:"button",href:o?x:void 0,target:o?k:void 0,rel:o?E:void 0,disabled:o?void 0:l,className:a.cx(_.textShadowStyles,"kakadu-components-2081390622",d==="delete"&&g,r&&"kakadu-components-2662775151",R),children:[e.jsxRuntimeExports.jsxs(m.default,{direction:"row",gap:.5,alignment:m.FlexAlignment.center,children:[s?e.jsxRuntimeExports.jsx("div",{className:a.cx("kakadu-components-743909038",t?"kakadu-components-1285017646":"kakadu-components-1475172827"),children:typeof s=="string"?e.jsxRuntimeExports.jsx(i.default,{width:14,height:14,type:s}):s}):null,t?e.jsxRuntimeExports.jsx("span",{className:"kakadu-components-3068418250",children:t}):e.jsxRuntimeExports.jsx(f.default,{children:y}),n?e.jsxRuntimeExports.jsx("div",{className:a.cx("kakadu-components-743909038",t?"kakadu-components-2421728947":"kakadu-components-1475172827"),children:typeof n=="string"?e.jsxRuntimeExports.jsx(i.default,{width:14,height:14,type:n}):n}):null]}),e.jsxRuntimeExports.jsxs("span",{className:"kakadu-components-1970948853",children:[l?null:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(h.default,{size:t?void 0:50}),e.jsxRuntimeExports.jsx(c.default,{size:t?void 0:50,className:c.normalBlendStyles})]}),u?e.jsxRuntimeExports.jsx(B.default,{label:u,position:j}):null]})]}),r?e.jsxRuntimeExports.jsx("div",{className:"kakadu-components-1970948853",children:e.jsxRuntimeExports.jsx(N.SkeletonInstance,{width:"100%",height:"100%"})}):null]})}exports.TextButtonVariant=p;exports.default=w;

package/build/components/text-button.mjs

@@ -1,46 +1,52 @@
 import { j as o } from "../jsx-runtime-B4hRZ52C.mjs";
 import { cx as n } from "@kuma-ui/core";
 import p from "../icons/icon.mjs";
-import j, { FlexAlignment as y } from "./flex.mjs";
-import { textShadowStyles as v } from "./text.mjs";
-import B from "./click-ripples.mjs";
-import f, { normalBlendStyles as N } from "./hover-gradient.mjs";
+import f, { FlexAlignment as B } from "./flex.mjs";
+import { textShadowStyles as h } from "./text.mjs";
+import N from "./click-ripples.mjs";
+import b, { normalBlendStyles as g } from "./hover-gradient.mjs";
 import w from "./button-tooltip.mjs";
-import S from "./aria-text.mjs";
-import b from "./atom.mjs";
-var g = /* @__PURE__ */ ((e) => (e.primary = "primary", e.delete = "delete", e))(g || {});
-const A = "kakadu-components-4017654514";
-function q({
+import A from "./aria-text.mjs";
+import F from "./atom.mjs";
+import { SkeletonInstance as z } from "./skeleton.mjs";
+var C = /* @__PURE__ */ ((e) => (e.primary = "primary", e.delete = "delete", e))(C || {});
+const D = "kakadu-components-4017654514";
+function P({
   iconLeft: e,
   iconRight: s,
-  variant: l = "primary",
-  tooltip: m,
-  tooltipPosition: d,
-  href: t,
-  target: k,
-  rel: u,
-  disabled: r,
-  className: i,
+  variant: i = "primary",
+  tooltip: r,
+  tooltipPosition: k,
+  href: l,
+  target: u,
+  rel: c,
+  disabled: x,
+  isSkeleton: m,
+  className: j,
   children: a,
-  label: x,
-  ...c
+  label: v,
+  ...y
 }) {
-  return /* @__PURE__ */ o.jsxs(b, { ...c, as: t ? "a" : "button", type: t ? void 0 : "button", href: t, target: k, rel: u, disabled: t ? void 0 : r, className: n(v, "kakadu-components-1202323410", a && (e || s) ? n(!!e && "kakadu-components-497190725", !!s && "kakadu-components-3729381008") : "kakadu-components-3866032606", l === "delete" && A, i), children: [
-    /* @__PURE__ */ o.jsxs(j, { direction: "row", gap: 0.5, alignment: y.center, children: [
-      e ? /* @__PURE__ */ o.jsx("div", { className: n("kakadu-components-2031441451", a ? "kakadu-components-2885581246" : "kakadu-components-611756781"), children: typeof e == "string" ? /* @__PURE__ */ o.jsx(p, { width: 14, height: 14, type: e }) : e }) : null,
-      a ? /* @__PURE__ */ o.jsx("span", { className: "kakadu-components-2362298521", children: a }) : /* @__PURE__ */ o.jsx(S, { children: x }),
-      s ? /* @__PURE__ */ o.jsx("div", { className: n("kakadu-components-2031441451", a ? "kakadu-components-2285425267" : "kakadu-components-611756781"), children: typeof s == "string" ? /* @__PURE__ */ o.jsx(p, { width: 14, height: 14, type: s }) : s }) : null
-    ] }),
-    /* @__PURE__ */ o.jsxs("span", { className: "kakadu-components-1343580459", children: [
-      r ? null : /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-        /* @__PURE__ */ o.jsx(B, { size: a ? void 0 : 50 }),
-        /* @__PURE__ */ o.jsx(f, { size: a ? void 0 : 50, className: N })
+  const d = !!x || !!m, t = l && !m;
+  return /* @__PURE__ */ o.jsxs("div", { className: n("kakadu-components-1400843519", a && (e || s) ? n(!!e && "kakadu-components-497190725", !!s && "kakadu-components-3729381008") : "kakadu-components-3866032606"), children: [
+    /* @__PURE__ */ o.jsxs(F, { ...y, as: t ? "a" : "button", type: t ? void 0 : "button", href: t ? l : void 0, target: t ? u : void 0, rel: t ? c : void 0, disabled: t ? void 0 : d, className: n(h, "kakadu-components-2081390622", i === "delete" && D, m && "kakadu-components-2662775151", j), children: [
+      /* @__PURE__ */ o.jsxs(f, { direction: "row", gap: 0.5, alignment: B.center, children: [
+        e ? /* @__PURE__ */ o.jsx("div", { className: n("kakadu-components-743909038", a ? "kakadu-components-1285017646" : "kakadu-components-1475172827"), children: typeof e == "string" ? /* @__PURE__ */ o.jsx(p, { width: 14, height: 14, type: e }) : e }) : null,
+        a ? /* @__PURE__ */ o.jsx("span", { className: "kakadu-components-3068418250", children: a }) : /* @__PURE__ */ o.jsx(A, { children: v }),
+        s ? /* @__PURE__ */ o.jsx("div", { className: n("kakadu-components-743909038", a ? "kakadu-components-2421728947" : "kakadu-components-1475172827"), children: typeof s == "string" ? /* @__PURE__ */ o.jsx(p, { width: 14, height: 14, type: s }) : s }) : null
       ] }),
-      m ? /* @__PURE__ */ o.jsx(w, { label: m, position: d }) : null
-    ] })
+      /* @__PURE__ */ o.jsxs("span", { className: "kakadu-components-1970948853", children: [
+        d ? null : /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+          /* @__PURE__ */ o.jsx(N, { size: a ? void 0 : 50 }),
+          /* @__PURE__ */ o.jsx(b, { size: a ? void 0 : 50, className: g })
+        ] }),
+        r ? /* @__PURE__ */ o.jsx(w, { label: r, position: k }) : null
+      ] })
+    ] }),
+    m ? /* @__PURE__ */ o.jsx("div", { className: "kakadu-components-1970948853", children: /* @__PURE__ */ o.jsx(z, { width: "100%", height: "100%" }) }) : null
   ] });
 }
 export {
-  g as TextButtonVariant,
-  q as default
+  C as TextButtonVariant,
+  P as default
 };