@kakadu/components 3.6.0 → 3.7.0

package/build/components/popover-menu.d.ts

@@ -22,6 +22,7 @@ export type PopoverMenuItemProperties = {
 };
 export declare function usePopoverMenu(items: PopoverMenuItemProperties[]): {
     show: () => Promise<void | undefined>;
+    close: (result?: void | undefined) => void;
     popoverMenu: import("react/jsx-runtime").JSX.Element;
 };
 export type PopoverMenuProperties = {

package/build/components/popover-menu.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../jsx-runtime-BB_1_6y_.js"),q=require("@kuma-ui/core"),a=require("react"),I=require("../theme.js"),h=require("../icons/icon.js"),j=require("./popover.js"),N=require("./atom.js"),y=require("./text.js"),b=require("./hover-gradient.js"),S=require("./click-ripples.js"),_=require("./separator.js"),C=require("./decorators.js"),k=new Set;function w(){const[e,n]=a.useState(!1),u=a.useCallback(s=>{n(s);for(const c of k)c(s)},[]);return a.useEffect(()=>{const s=c=>{n(c)};return k.add(s),()=>{k.delete(s)}},[]),a.useMemo(()=>({isKeyboardNavigating:e,setIsKeyboardNavigating:u}),[e,u])}function K({label:e,iconLeft:n,iconRight:u,href:s,shouldCloseOnClick:c=!0,decorators:v=[],submenu:p,className:i,onClick:r,...f}){const{isVisible:d,isFocused:o,close:x}=j.usePopoverContext(),{isKeyboardNavigating:l}=w(),m=a.useRef(!0),E=a.useCallback(()=>{m.current=o},[o]),R=a.useCallback(P=>{!l&&!m.current||o&&(r==null||r(P),p?p.show():c&&(x==null||x()))},[l,o,r,p,c,x]),g=a.useMemo(()=>t.jsxRuntimeExports.jsxs(N.default,{as:s?"a":"button",...f,type:s?void 0:"button",role:"menuitem",href:s,disabled:s?void 0:!d,className:q.cx(I.buttonResetStyles,"kakadu-components-4075327442",o&&"kakadu-components-3160069815",l?"kakadu-components-2043829669":o&&"kakadu-components-2862719809",i),onClick:R,onPointerDownCapture:E,children:[t.jsxRuntimeExports.jsxs(y.Span,{className:"kakadu-components-1109353535",children:[n?t.jsxRuntimeExports.jsx(h.default,{width:12,height:12,type:n}):null,t.jsxRuntimeExports.jsx("span",{className:"kakadu-components-913703148",children:e}),u?t.jsxRuntimeExports.jsx(h.default,{width:12,height:12,type:u}):null]}),l?null:t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(S.default,{isActive:o,size:100}),t.jsxRuntimeExports.jsx(b.default,{isActive:o,size:150,className:b.normalBlendStyles})]})]}),[s,f,d,l,i,R,E,n,e,u,o]);return t.jsxRuntimeExports.jsx(C.default,{decorators:v,children:p?t.jsxRuntimeExports.jsx(M,{menu:p.popoverMenu,className:"kakadu-components-1861176543",children:g}):g})}function A(e){if("type"in e){if(e.type==="separator")return t.jsxRuntimeExports.jsx(_.default,{});if(e.type==="group")return t.jsxRuntimeExports.jsx(y.Span,{className:"kakadu-components-1499037363",children:e.label})}return t.jsxRuntimeExports.jsx(K,{...e})}function D({items:e}){const{isFocused:n}=j.usePopoverContext(),[u,s]=a.useState([]),{setIsKeyboardNavigating:c}=w(),v=a.useCallback(i=>{i&&s(r=>r.includes(i)?r:[...r,i])},[]),p=a.useCallback(i=>{n&&(i.currentTarget.focus(),c(!1))},[n,c]);return a.useEffect(()=>{if(!n)return;const i=r=>{const f=u.filter(m=>m.isConnected),d=f.length;if(d===0)return;let o;const x=document.activeElement;let l=x?f.indexOf(x):-1;switch(l===-1&&(l=0),r.key){case"ArrowDown":{o=(l+1)%d;break}case"ArrowUp":{o=(l-1+d)%d;break}case"Home":{o=0;break}case"End":{o=d-1;break}case"Tab":{c(!0);return}}if(o!==void 0){r.preventDefault(),r.stopPropagation();const m=f[o];m&&(m.focus(),c(!0))}};return window.addEventListener("keydown",i,{capture:!0}),()=>{window.removeEventListener("keydown",i,{capture:!0})}},[n,u,c]),t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:e.map((i,r)=>t.jsxRuntimeExports.jsx(A,{...i,reference:v,onMouseEnter:p},r))})}function F({items:e,...n}){return t.jsxRuntimeExports.jsx(j.default,{...n,as:"nav",role:"menu",innerClassName:"kakadu-components-3600436535",children:t.jsxRuntimeExports.jsx(D,{items:e})})}function T(e){const n=a.useMemo(()=>({items:e}),[e]),{show:u,popover:s}=j.usePopover(F,n);return a.useMemo(()=>({show:u,popoverMenu:s}),[u,s])}function M({menu:e,className:n,children:u}){return t.jsxRuntimeExports.jsxs(j.PopoverContainer,{className:n,children:[u,e]})}exports.default=M;exports.usePopoverMenu=T;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../jsx-runtime-BB_1_6y_.js"),q=require("@kuma-ui/core"),i=require("react"),I=require("../theme.js"),h=require("../icons/icon.js"),j=require("./popover.js"),N=require("./atom.js"),y=require("./text.js"),b=require("./hover-gradient.js"),S=require("./click-ripples.js"),_=require("./separator.js"),C=require("./decorators.js"),k=new Set;function w(){const[e,n]=i.useState(!1),a=i.useCallback(s=>{n(s);for(const r of k)r(s)},[]);return i.useEffect(()=>{const s=r=>{n(r)};return k.add(s),()=>{k.delete(s)}},[]),i.useMemo(()=>({isKeyboardNavigating:e,setIsKeyboardNavigating:a}),[e,a])}function K({label:e,iconLeft:n,iconRight:a,href:s,shouldCloseOnClick:r=!0,decorators:v=[],submenu:p,className:c,onClick:u,...f}){const{isVisible:d,isFocused:o,close:x}=j.usePopoverContext(),{isKeyboardNavigating:l}=w(),m=i.useRef(!0),E=i.useCallback(()=>{m.current=o},[o]),R=i.useCallback(P=>{!l&&!m.current||o&&(u==null||u(P),p?p.show():r&&(x==null||x()))},[l,o,u,p,r,x]),g=i.useMemo(()=>t.jsxRuntimeExports.jsxs(N.default,{as:s?"a":"button",...f,type:s?void 0:"button",role:"menuitem",href:s,disabled:s?void 0:!d,className:q.cx(I.buttonResetStyles,"kakadu-components-4075327442",o&&"kakadu-components-3160069815",l?"kakadu-components-2043829669":o&&"kakadu-components-2862719809",c),onClick:R,onPointerDownCapture:E,children:[t.jsxRuntimeExports.jsxs(y.Span,{className:"kakadu-components-1109353535",children:[n?t.jsxRuntimeExports.jsx(h.default,{width:12,height:12,type:n}):null,t.jsxRuntimeExports.jsx("span",{className:"kakadu-components-913703148",children:e}),a?t.jsxRuntimeExports.jsx(h.default,{width:12,height:12,type:a}):null]}),l?null:t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(S.default,{isActive:o,size:100}),t.jsxRuntimeExports.jsx(b.default,{isActive:o,size:150,className:b.normalBlendStyles})]})]}),[s,f,d,l,c,R,E,n,e,a,o]);return t.jsxRuntimeExports.jsx(C.default,{decorators:v,children:p?t.jsxRuntimeExports.jsx(M,{menu:p.popoverMenu,className:"kakadu-components-1861176543",children:g}):g})}function A(e){if("type"in e){if(e.type==="separator")return t.jsxRuntimeExports.jsx(_.default,{});if(e.type==="group")return t.jsxRuntimeExports.jsx(y.Span,{className:"kakadu-components-1499037363",children:e.label})}return t.jsxRuntimeExports.jsx(K,{...e})}function D({items:e}){const{isFocused:n}=j.usePopoverContext(),[a,s]=i.useState([]),{setIsKeyboardNavigating:r}=w(),v=i.useCallback(c=>{c&&s(u=>u.includes(c)?u:[...u,c])},[]),p=i.useCallback(c=>{n&&(c.currentTarget.focus(),r(!1))},[n,r]);return i.useEffect(()=>{if(!n)return;const c=u=>{const f=a.filter(m=>m.isConnected),d=f.length;if(d===0)return;let o;const x=document.activeElement;let l=x?f.indexOf(x):-1;switch(l===-1&&(l=0),u.key){case"ArrowDown":{o=(l+1)%d;break}case"ArrowUp":{o=(l-1+d)%d;break}case"Home":{o=0;break}case"End":{o=d-1;break}case"Tab":{r(!0);return}}if(o!==void 0){u.preventDefault(),u.stopPropagation();const m=f[o];m&&(m.focus(),r(!0))}};return window.addEventListener("keydown",c,{capture:!0}),()=>{window.removeEventListener("keydown",c,{capture:!0})}},[n,a,r]),t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:e.map((c,u)=>t.jsxRuntimeExports.jsx(A,{...c,reference:v,onMouseEnter:p},u))})}function F({items:e,...n}){return t.jsxRuntimeExports.jsx(j.default,{...n,as:"nav",role:"menu",innerClassName:"kakadu-components-3600436535",children:t.jsxRuntimeExports.jsx(D,{items:e})})}function T(e){const n=i.useMemo(()=>({items:e}),[e]),{show:a,close:s,popover:r}=j.usePopover(F,n);return i.useMemo(()=>({show:a,close:s,popoverMenu:r}),[a,s,r])}function M({menu:e,className:n,children:a}){return t.jsxRuntimeExports.jsxs(j.PopoverContainer,{className:n,children:[a,e]})}exports.default=M;exports.usePopoverMenu=T;

package/build/components/popover-menu.mjs

@@ -12,33 +12,33 @@ import T from "./separator.mjs";
 import V from "./decorators.mjs";
 const j = /* @__PURE__ */ new Set();
 function M() {
-  const [e, t] = b(!1), a = v((o) => {
+  const [e, t] = b(!1), i = v((o) => {
     t(o);
-    for (const c of j)
-      c(o);
+    for (const s of j)
+      s(o);
   }, []);
   return I(() => {
-    const o = (c) => {
-      t(c);
+    const o = (s) => {
+      t(s);
     };
     return j.add(o), () => {
       j.delete(o);
     };
   }, []), x(() => ({
     isKeyboardNavigating: e,
-    setIsKeyboardNavigating: a
-  }), [e, a]);
+    setIsKeyboardNavigating: i
+  }), [e, i]);
 }
 function B({
   label: e,
   iconLeft: t,
-  iconRight: a,
+  iconRight: i,
   href: o,
-  shouldCloseOnClick: c = !0,
+  shouldCloseOnClick: s = !0,
   decorators: k = [],
   submenu: l,
-  className: i,
-  onClick: s,
+  className: c,
+  onClick: a,
   ...f
 }) {
   const {
@@ -50,18 +50,18 @@ function B({
   } = M(), p = K(!0), g = v(() => {
     p.current = r;
   }, [r]), h = v((E) => {
-    !u && !p.current || r && (s == null || s(E), l ? l.show() : c && (m == null || m()));
-  }, [u, r, s, l, c, m]), w = x(() => /* @__PURE__ */ n.jsxs(H, { as: o ? "a" : "button", ...f, type: o ? void 0 : "button", role: "menuitem", href: o, disabled: o ? void 0 : !d, className: S(A, "kakadu-components-4075327442", r && "kakadu-components-3160069815", u ? "kakadu-components-2043829669" : r && "kakadu-components-2862719809", i), onClick: h, onPointerDownCapture: g, children: [
+    !u && !p.current || r && (a == null || a(E), l ? l.show() : s && (m == null || m()));
+  }, [u, r, a, l, s, m]), w = x(() => /* @__PURE__ */ n.jsxs(H, { as: o ? "a" : "button", ...f, type: o ? void 0 : "button", role: "menuitem", href: o, disabled: o ? void 0 : !d, className: S(A, "kakadu-components-4075327442", r && "kakadu-components-3160069815", u ? "kakadu-components-2043829669" : r && "kakadu-components-2862719809", c), onClick: h, onPointerDownCapture: g, children: [
     /* @__PURE__ */ n.jsxs(N, { className: "kakadu-components-1109353535", children: [
       t ? /* @__PURE__ */ n.jsx(y, { width: 12, height: 12, type: t }) : null,
       /* @__PURE__ */ n.jsx("span", { className: "kakadu-components-913703148", children: e }),
-      a ? /* @__PURE__ */ n.jsx(y, { width: 12, height: 12, type: a }) : null
+      i ? /* @__PURE__ */ n.jsx(y, { width: 12, height: 12, type: i }) : null
     ] }),
     u ? null : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
       /* @__PURE__ */ n.jsx(L, { isActive: r, size: 100 }),
       /* @__PURE__ */ n.jsx(R, { isActive: r, size: 150, className: z })
     ] })
-  ] }), [o, f, d, u, i, h, g, t, e, a, r]);
+  ] }), [o, f, d, u, c, h, g, t, e, i, r]);
   return /* @__PURE__ */ n.jsx(V, { decorators: k, children: l ? /* @__PURE__ */ n.jsx(J, { menu: l.popoverMenu, className: "kakadu-components-1861176543", children: w }) : w });
 }
 function G(e) {
@@ -78,24 +78,24 @@ function U({
 }) {
   const {
     isFocused: t
-  } = P(), [a, o] = b([]), {
-    setIsKeyboardNavigating: c
-  } = M(), k = v((i) => {
-    i && o((s) => s.includes(i) ? s : [...s, i]);
-  }, []), l = v((i) => {
-    t && (i.currentTarget.focus(), c(!1));
-  }, [t, c]);
+  } = P(), [i, o] = b([]), {
+    setIsKeyboardNavigating: s
+  } = M(), k = v((c) => {
+    c && o((a) => a.includes(c) ? a : [...a, c]);
+  }, []), l = v((c) => {
+    t && (c.currentTarget.focus(), s(!1));
+  }, [t, s]);
   return I(() => {
     if (!t)
       return;
-    const i = (s) => {
-      const f = a.filter((p) => p.isConnected), d = f.length;
+    const c = (a) => {
+      const f = i.filter((p) => p.isConnected), d = f.length;
       if (d === 0)
         return;
       let r;
       const m = document.activeElement;
       let u = m ? f.indexOf(m) : -1;
-      switch (u === -1 && (u = 0), s.key) {
+      switch (u === -1 && (u = 0), a.key) {
         case "ArrowDown": {
           r = (u + 1) % d;
           break;
@@ -113,31 +113,31 @@ function U({
           break;
         }
         case "Tab": {
-          c(!0);
+          s(!0);
           return;
         }
       }
       if (r !== void 0) {
-        s.preventDefault(), s.stopPropagation();
+        a.preventDefault(), a.stopPropagation();
         const p = f[r];
-        p && (p.focus(), c(!0));
+        p && (p.focus(), s(!0));
       }
     };
-    return window.addEventListener("keydown", i, {
+    return window.addEventListener("keydown", c, {
       capture: !0
     }), () => {
-      window.removeEventListener("keydown", i, {
+      window.removeEventListener("keydown", c, {
         capture: !0
       });
     };
-  }, [t, a, c]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((i, s) => /* @__PURE__ */ n.jsx(
+  }, [t, i, s]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((c, a) => /* @__PURE__ */ n.jsx(
     G,
     {
-      ...i,
+      ...c,
       reference: k,
       onMouseEnter: l
     },
-    s
+    a
   )) });
 }
 function q({
@@ -150,21 +150,23 @@ function re(e) {
   const t = x(() => ({
     items: e
   }), [e]), {
-    show: a,
-    popover: o
+    show: i,
+    close: o,
+    popover: s
   } = F(q, t);
   return x(() => ({
-    show: a,
-    popoverMenu: o
-  }), [a, o]);
+    show: i,
+    close: o,
+    popoverMenu: s
+  }), [i, o, s]);
 }
 function J({
   menu: e,
   className: t,
-  children: a
+  children: i
 }) {
   return /* @__PURE__ */ n.jsxs(D, { className: t, children: [
-    a,
+    i,
     e
   ] });
 }

package/build/components/popover.d.ts

@@ -23,6 +23,7 @@ export default function Popover<Data = any, Type extends AtomElementType = Defau
 export declare function usePopover<PopoverResult, PopoverProperties = PopoverBaseProperties<PopoverResult>>(PopoverComponent: ComponentType<PopoverProperties>, properties?: PopoverProperties): {
     isVisible: boolean;
     show: () => Promise<PopoverResult | undefined>;
+    close: (result?: PopoverResult) => void;
     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"),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,onPostActivate(){var t;k(!0),(t=j.current)==null||t.focus()},clickOutsideDeactivates:f,escapeDeactivates:c,onPostUnpause(){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;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../jsx-runtime-BB_1_6y_.js"),f=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:f.cx("kakadu-components-2845019685",s)})}function K({as:r,isVisible:s,label:o,shouldCloseOnOutsideClick:d=!0,shouldCloseOnEscapePress:c=!0,children:p,className:u,innerClassName:x,onClose:a,...v}){const b=e.useRef(null),F=e.useRef(null),[I,k]=e.useState(!1),[S,B]=e.useState(!1),[i,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,onPostActivate(){var t;k(!0),(t=j.current)==null||t.focus()},clickOutsideDeactivates:d,escapeDeactivates:c,onPostUnpause(){k(!0)},onPause(){k(!1)},onDeactivate(){R(!1),k(!1)}}),[d,c]),[q,N]=e.useState(s??!1),$=e.useMemo(()=>({isVisible:q,isFocused:I,setInitialFocus:M,close:C}),[q,I,M,C]),[l,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 m="center";if(A&&_){const h=P-T;m=V-D>h?"right":"left"}else _?m="right":A&&(m="left");L(h=>h===m?h:m)};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&&!i){const t=setTimeout(()=>{a==null||a(b.current??void 0),N(!1)},370);return()=>{clearTimeout(t)}}},[S,i,a]),n.jsxRuntimeExports.jsx(g.default,{reference:F,as:r??g.defaultAtomElementType,role:"dialog","aria-hidden":!i,"aria-label":o??"Popover",...v,className:f.cx("kakadu-components-3920007758",l==="left"&&"kakadu-components-611400930",l==="right"&&"kakadu-components-944244368",i&&"kakadu-components-1399012551",u),children:n.jsxRuntimeExports.jsxs("div",{className:f.cx("kakadu-components-1118152266",i&&"kakadu-components-231244945"),children:[n.jsxRuntimeExports.jsx("div",{className:f.cx("kakadu-components-1951789226",l==="left"&&"kakadu-components-1495725644",l==="right"&&"kakadu-components-4235689197")}),n.jsxRuntimeExports.jsx(H.focusTrapReactExports.FocusTrap,{active:i,focusTrapOptions:W,children:n.jsxRuntimeExports.jsxs("div",{className:f.cx("kakadu-components-2488426662",x),children:[n.jsxRuntimeExports.jsx(U,{value:$,children:p}),n.jsxRuntimeExports.jsx("div",{className:f.cx("kakadu-components-3252390100",l==="left"&&"kakadu-components-3754561431",l==="right"&&"kakadu-components-2265262600")})]})})]})})}function Q(r,s){const[o,d]=e.useState(!1),c=e.useRef(void 0),p=e.useCallback(async()=>(d(!0),new Promise(a=>{c.current=a})),[]),u=e.useCallback(a=>{var v;d(!1),(v=c.current)==null||v.call(c,a),c.current=void 0},[]),x=e.useMemo(()=>n.jsxRuntimeExports.jsx(r,{...s,isVisible:o,onClose:u}),[r,s,o,u]);return e.useMemo(()=>({isVisible:o,show:p,close:u,popover:x}),[o,p,u,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 u } from "@kuma-ui/core";
-import { createContext as Y, useRef as j, useState as l, useCallback as P, useMemo as R, useEffect as w, useContext as Z } from "react";
+import { cx as l } from "@kuma-ui/core";
+import { createContext as Y, useRef as j, useState as d, useCallback as P, useMemo as R, 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({
@@ -17,21 +17,21 @@ function re({
   className: t,
   ...s
 }) {
-  return /* @__PURE__ */ n.jsx(q, { as: c ?? G, ...s, className: u("kakadu-components-2845019685", t) });
+  return /* @__PURE__ */ n.jsx(q, { as: c ?? G, ...s, className: l("kakadu-components-2845019685", t) });
 }
 function ie({
   as: c,
   isVisible: t,
   label: s,
-  shouldCloseOnOutsideClick: d = !0,
+  shouldCloseOnOutsideClick: f = !0,
   shouldCloseOnEscapePress: o = !0,
-  children: m,
-  className: p,
+  children: p,
+  className: r,
   innerClassName: k,
   onClose: a,
   ...v
 }) {
-  const N = j(null), L = j(null), [D, h] = l(!1), [O, K] = l(!1), [r, x] = l(!1), V = P((e) => {
+  const N = j(null), L = j(null), [D, h] = d(!1), [O, K] = d(!1), [i, x] = d(!1), V = P((e) => {
     N.current = e, x(!1);
   }, []), T = j(null), A = P((e) => {
     e && (T.current = e);
@@ -41,7 +41,7 @@ function ie({
       var e;
       h(!0), (e = T.current) == null || e.focus();
     },
-    clickOutsideDeactivates: d,
+    clickOutsideDeactivates: f,
     escapeDeactivates: o,
     onPostUnpause() {
       h(!0);
@@ -52,12 +52,12 @@ function ie({
     onDeactivate() {
       x(!1), h(!1);
     }
-  }), [d, o]), [y, z] = l(t ?? !1), X = R(() => ({
+  }), [f, o]), [y, z] = d(t ?? !1), X = R(() => ({
     isVisible: y,
     isFocused: D,
     setInitialFocus: A,
     close: V
-  }), [y, D, A, V]), [i, B] = l("center");
+  }), [y, D, A, V]), [u, B] = d("center");
   return w(() => {
     const e = L.current;
     if (e) {
@@ -68,12 +68,12 @@ function ie({
           return;
         }
         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";
+        let m = "center";
         if (S && U) {
           const g = b - E;
-          f = H - W > g ? "right" : "left";
-        } else U ? f = "right" : S && (f = "left");
-        B((g) => g === f ? g : f);
+          m = H - W > g ? "right" : "left";
+        } else U ? m = "right" : S && (m = "left");
+        B((g) => g === m ? g : m);
       };
       return F(), window.addEventListener("resize", F), () => {
         window.removeEventListener("resize", F);
@@ -92,7 +92,7 @@ function ie({
     }
     x(!1);
   }, [t]), w(() => {
-    if (O && !r) {
+    if (O && !i) {
       const e = setTimeout(() => {
         a == null || a(N.current ?? void 0), z(!1);
       }, 370);
@@ -100,26 +100,27 @@ function ie({
         clearTimeout(e);
       };
     }
-  }, [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") })
+  }, [O, i, a]), /* @__PURE__ */ n.jsx(q, { reference: L, as: c ?? G, role: "dialog", "aria-hidden": !i, "aria-label": s ?? "Popover", ...v, className: l("kakadu-components-3920007758", u === "left" && "kakadu-components-611400930", u === "right" && "kakadu-components-944244368", i && "kakadu-components-1399012551", r), children: /* @__PURE__ */ n.jsxs("div", { className: l("kakadu-components-1118152266", i && "kakadu-components-231244945"), children: [
+    /* @__PURE__ */ n.jsx("div", { className: l("kakadu-components-1951789226", u === "left" && "kakadu-components-1495725644", u === "right" && "kakadu-components-4235689197") }),
+    /* @__PURE__ */ n.jsx(_.FocusTrap, { active: i, focusTrapOptions: Q, children: /* @__PURE__ */ n.jsxs("div", { className: l("kakadu-components-2488426662", k), children: [
+      /* @__PURE__ */ n.jsx($, { value: X, children: p }),
+      /* @__PURE__ */ n.jsx("div", { className: l("kakadu-components-3252390100", u === "left" && "kakadu-components-3754561431", u === "right" && "kakadu-components-2265262600") })
     ] }) })
   ] }) });
 }
 function ue(c, t) {
-  const [s, d] = l(!1), o = j(void 0), m = P(async () => (d(!0), new Promise((a) => {
+  const [s, f] = d(!1), o = j(void 0), p = P(async () => (f(!0), new Promise((a) => {
     o.current = a;
-  })), []), p = P((a) => {
+  })), []), r = P((a) => {
     var v;
-    d(!1), (v = o.current) == null || v.call(o, a), o.current = void 0;
-  }, []), k = R(() => /* @__PURE__ */ n.jsx(c, { ...t, isVisible: s, onClose: p }), [c, t, s, p]);
+    f(!1), (v = o.current) == null || v.call(o, a), o.current = void 0;
+  }, []), k = R(() => /* @__PURE__ */ n.jsx(c, { ...t, isVisible: s, onClose: r }), [c, t, s, r]);
   return R(() => ({
     isVisible: s,
-    show: m,
+    show: p,
+    close: r,
     popover: k
-  }), [s, m, k]);
+  }), [s, p, r, k]);
 }
 export {
   re as PopoverContainer,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kakadu/components",
-  "version": "3.6.0",
+  "version": "3.7.0",
   "description": "Kakadu components library",
   "license": "MIT",
   "main": "./build/index.js",