@kakadu/components 3.1.3 → 3.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -26,7 +26,7 @@ type ModalBaseProperties<ModalResult> = Omit<ModalProperties<ModalResult>, 'isVi
26
26
  export default function Modal<Data = any>({ root, outerDecorators, innerDecorators, label, maxWidth, className, isVisible, isFullWidth, shouldCloseOnOutsideClick, shouldCloseOnEscapePress, showCloseButton, onClose, children, }: ModalProperties<Data>): import("react/jsx-runtime").JSX.Element;
27
27
  export declare function useModal<ModalResult, ModalProperties = ModalBaseProperties<ModalResult>>(ModalComponent: ComponentType<ModalProperties>, properties?: ModalProperties): {
28
28
  isVisible: boolean;
29
- show: (reference?: HTMLElement) => Promise<ModalResult | undefined>;
29
+ show: () => Promise<ModalResult | undefined>;
30
30
  modal: import("react/jsx-runtime").JSX.Element;
31
31
  };
32
32
  export {};
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../jsx-runtime-BB_1_6y_.js"),e=require("react"),E=require("@kuma-ui/core"),P=require("react-dom"),$=require("../focus-trap-react-CcpTuiJi.js"),B=require("../icons/icon.js"),A=require("./text-button.js"),I=require("./decorators.js"),y=e.createContext({isVisible:!1}),{Provider:D}=y;function N(){return e.useContext(y)}function z(){const{close:o}=N(),u=e.useCallback(()=>{o==null||o()},[o]);return s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx("div",{className:"kakadu-components-2543813221"}),s.jsxRuntimeExports.jsx("div",{className:"kakadu-components-840864829",children:s.jsxRuntimeExports.jsx(A.default,{iconLeft:B.IconType.times,label:"Close",className:"kakadu-components-3855719072",onClick:u})})]})}function G({root:o,outerDecorators:u=[],innerDecorators:a=[],label:k,maxWidth:r,className:i,isVisible:n,isFullWidth:x=!1,shouldCloseOnOutsideClick:f=!0,shouldCloseOnEscapePress:l=!0,showCloseButton:d=!0,onClose:c,children:g}){const v=e.useRef(null),M=e.useRef(null),[h,L]=e.useState(!1),[m,p]=e.useState(!1),b=e.useCallback(t=>{v.current=t,p(!1)},[]),R=e.useRef(null),w=e.useCallback(t=>{t&&(R.current=t)},[]),[T,q]=e.useState(n??!1),S=e.useMemo(()=>({isVisible:T,setInitialFocus:w,close:b}),[T,w,b]);e.useEffect(()=>{n&&(L(!0),q(!0))},[n]),e.useEffect(()=>{if(n){const t=setTimeout(()=>{p(!0)},100);return()=>{clearTimeout(t)}}p(!1)},[n]),e.useEffect(()=>{if(h&&!m){const t=setTimeout(()=>{c==null||c(v.current??void 0),q(!1)},370);return()=>{clearTimeout(t)}}},[h,m,c]),e.useEffect(()=>{const t=M.current;if(n&&f&&t){const j=_=>{t===_.target&&p(!1)};return t.addEventListener("click",j),()=>{t.removeEventListener("click",j)}}},[n,f]),e.useEffect(()=>{if(!n||!l)return;const t=j=>{j.key==="Escape"&&p(!1)};return window.addEventListener("keydown",t),()=>{window.removeEventListener("keydown",t)}},[n,l]);const F=e.useMemo(()=>({initialFocus:()=>R.current??void 0,onActivate:()=>{var t;return(t=R.current)==null?void 0:t.focus()}}),[]),C=s.jsxRuntimeExports.jsx(I.default,{decorators:u,children:s.jsxRuntimeExports.jsx("div",{"aria-hidden":!m,style:{"--max-width":r?`${r}px`:void 0},className:E.cx("kakadu-components-4119461136",m&&"kakadu-components-2522346797",i),children:s.jsxRuntimeExports.jsx(I.default,{decorators:a,children:s.jsxRuntimeExports.jsx($.focusTrapReactExports.FocusTrap,{active:m,focusTrapOptions:F,children:s.jsxRuntimeExports.jsx("div",{ref:M,className:"kakadu-components-4011815997",children:s.jsxRuntimeExports.jsx("div",{role:"dialog","aria-modal":"true","aria-label":k??"Modal",className:E.cx("kakadu-components-3324483532",x&&"kakadu-components-3799971070",m&&"kakadu-components-968755580"),children:s.jsxRuntimeExports.jsxs(D,{value:S,children:[d?s.jsxRuntimeExports.jsx(z,{}):null,s.jsxRuntimeExports.jsx("div",{className:E.cx("kakadu-components-633990035",x&&"kakadu-components-171969824"),children:g})]})})})})})})});return o?P.createPortal(C,o):C}function H(o,u){const[a,k]=e.useState(!1),r=e.useRef(void 0),i=e.useRef(null),n=e.useCallback(async l=>(k(!0),i.current=l??document.activeElement,new Promise(d=>{r.current=d})),[]),x=e.useCallback(l=>{var d;if(k(!1),(d=r.current)==null||d.call(r,l),r.current=void 0,i.current){const c=i.current;c.isConnected&&c.focus(),i.current=null}},[]),f=e.useMemo(()=>s.jsxRuntimeExports.jsx(o,{...u,isVisible:a,onClose:x}),[o,u,a,x]);return e.useMemo(()=>({isVisible:a,show:n,modal:f}),[a,n,f])}exports.default=G;exports.useModal=H;exports.useModalContext=N;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../jsx-runtime-BB_1_6y_.js"),e=require("react"),E=require("@kuma-ui/core"),P=require("react-dom"),$=require("../focus-trap-react-CcpTuiJi.js"),B=require("../icons/icon.js"),A=require("./text-button.js"),C=require("./decorators.js"),I=e.createContext({isVisible:!1}),{Provider:D}=I;function y(){return e.useContext(I)}function z(){const{close:o}=y(),a=e.useCallback(()=>{o==null||o()},[o]);return s.jsxRuntimeExports.jsxs(s.jsxRuntimeExports.Fragment,{children:[s.jsxRuntimeExports.jsx("div",{className:"kakadu-components-2543813221"}),s.jsxRuntimeExports.jsx("div",{className:"kakadu-components-840864829",children:s.jsxRuntimeExports.jsx(A.default,{iconLeft:B.IconType.times,label:"Close",className:"kakadu-components-3855719072",onClick:a})})]})}function G({root:o,outerDecorators:a=[],innerDecorators:c=[],label:m,maxWidth:r,className:f,isVisible:n,isFullWidth:l=!1,shouldCloseOnOutsideClick:u=!0,shouldCloseOnEscapePress:d=!0,showCloseButton:N=!0,onClose:p,children:g}){const R=e.useRef(null),v=e.useRef(null),[M,L]=e.useState(!1),[i,x]=e.useState(!1),h=e.useCallback(t=>{R.current=t,x(!1)},[]),j=e.useRef(null),b=e.useCallback(t=>{t&&(j.current=t)},[]),[w,T]=e.useState(n??!1),S=e.useMemo(()=>({isVisible:w,setInitialFocus:b,close:h}),[w,b,h]);e.useEffect(()=>{n&&(L(!0),T(!0))},[n]),e.useEffect(()=>{if(n){const t=setTimeout(()=>{x(!0)},100);return()=>{clearTimeout(t)}}x(!1)},[n]),e.useEffect(()=>{if(M&&!i){const t=setTimeout(()=>{p==null||p(R.current??void 0),T(!1)},370);return()=>{clearTimeout(t)}}},[M,i,p]),e.useEffect(()=>{const t=v.current;if(n&&u&&t){const k=_=>{t===_.target&&x(!1)};return t.addEventListener("click",k),()=>{t.removeEventListener("click",k)}}},[n,u]),e.useEffect(()=>{if(!n||!d)return;const t=k=>{k.key==="Escape"&&x(!1)};return window.addEventListener("keydown",t),()=>{window.removeEventListener("keydown",t)}},[n,d]);const F=e.useMemo(()=>({initialFocus:()=>j.current??void 0,onActivate:()=>{var t;return(t=j.current)==null?void 0:t.focus()}}),[]),q=s.jsxRuntimeExports.jsx(C.default,{decorators:a,children:s.jsxRuntimeExports.jsx("div",{"aria-hidden":!i,style:{"--max-width":r?`${r}px`:void 0},className:E.cx("kakadu-components-4119461136",i&&"kakadu-components-2522346797",f),children:s.jsxRuntimeExports.jsx(C.default,{decorators:c,children:s.jsxRuntimeExports.jsx($.focusTrapReactExports.FocusTrap,{active:i,focusTrapOptions:F,children:s.jsxRuntimeExports.jsx("div",{ref:v,className:"kakadu-components-4011815997",children:s.jsxRuntimeExports.jsx("div",{role:"dialog","aria-modal":"true","aria-label":m??"Modal",className:E.cx("kakadu-components-3324483532",l&&"kakadu-components-3799971070",i&&"kakadu-components-968755580"),children:s.jsxRuntimeExports.jsxs(D,{value:S,children:[N?s.jsxRuntimeExports.jsx(z,{}):null,s.jsxRuntimeExports.jsx("div",{className:E.cx("kakadu-components-633990035",l&&"kakadu-components-171969824"),children:g})]})})})})})})});return o?P.createPortal(q,o):q}function H(o,a){const[c,m]=e.useState(!1),r=e.useRef(void 0),f=e.useCallback(async()=>(m(!0),new Promise(u=>{r.current=u})),[]),n=e.useCallback(u=>{var d;m(!1),(d=r.current)==null||d.call(r,u),r.current=void 0},[]),l=e.useMemo(()=>s.jsxRuntimeExports.jsx(o,{...a,isVisible:c,onClose:n}),[o,a,c,n]);return e.useMemo(()=>({isVisible:c,show:f,modal:l}),[c,f,l])}exports.default=G;exports.useModal=H;exports.useModalContext=y;
@@ -1,127 +1,124 @@
1
1
  import { j as t } from "../jsx-runtime-B4hRZ52C.mjs";
2
- import { createContext as q, useRef as p, useState as w, useCallback as v, useMemo as T, useEffect as x, useContext as z } from "react";
2
+ import { createContext as q, useRef as j, useState as h, useCallback as f, useMemo as w, useEffect as m, useContext as z } from "react";
3
3
  import { cx as I } from "@kuma-ui/core";
4
4
  import { createPortal as G } from "react-dom";
5
5
  import { f as H } from "../focus-trap-react-DYXrtbDH.mjs";
6
6
  import { IconType as J } from "../icons/icon.mjs";
7
7
  import K from "./text-button.mjs";
8
- import C from "./decorators.mjs";
9
- const B = q({
8
+ import g from "./decorators.mjs";
9
+ const C = q({
10
10
  isVisible: !1
11
11
  }), {
12
12
  Provider: Q
13
- } = B;
13
+ } = C;
14
14
  function U() {
15
- return z(B);
15
+ return z(C);
16
16
  }
17
17
  function V() {
18
18
  const {
19
- close: o
20
- } = U(), a = v(() => {
21
- o == null || o();
22
- }, [o]);
19
+ close: s
20
+ } = U(), a = f(() => {
21
+ s == null || s();
22
+ }, [s]);
23
23
  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
24
24
  /* @__PURE__ */ t.jsx("div", { className: "kakadu-components-2543813221" }),
25
25
  /* @__PURE__ */ t.jsx("div", { className: "kakadu-components-840864829", children: /* @__PURE__ */ t.jsx(K, { iconLeft: J.times, label: "Close", className: "kakadu-components-3855719072", onClick: a }) })
26
26
  ] });
27
27
  }
28
28
  function ne({
29
- root: o,
29
+ root: s,
30
30
  outerDecorators: a = [],
31
- innerDecorators: c = [],
32
- label: j,
33
- maxWidth: s,
34
- className: i,
31
+ innerDecorators: r = [],
32
+ label: k,
33
+ maxWidth: o,
34
+ className: x,
35
35
  isVisible: n,
36
- isFullWidth: m = !1,
37
- shouldCloseOnOutsideClick: f = !0,
38
- shouldCloseOnEscapePress: u = !0,
39
- showCloseButton: l = !0,
40
- onClose: r,
36
+ isFullWidth: u = !1,
37
+ shouldCloseOnOutsideClick: c = !0,
38
+ shouldCloseOnEscapePress: l = !0,
39
+ showCloseButton: B = !0,
40
+ onClose: p,
41
41
  children: P
42
42
  }) {
43
- const N = p(null), R = p(null), [y, A] = w(!1), [d, k] = w(!1), L = v((e) => {
44
- N.current = e, k(!1);
45
- }, []), E = p(null), M = v((e) => {
46
- e && (E.current = e);
47
- }, []), [F, b] = w(n ?? !1), D = T(() => ({
48
- isVisible: F,
43
+ const E = j(null), N = j(null), [y, A] = h(!1), [i, d] = h(!1), L = f((e) => {
44
+ E.current = e, d(!1);
45
+ }, []), T = j(null), M = f((e) => {
46
+ e && (T.current = e);
47
+ }, []), [R, F] = h(n ?? !1), D = w(() => ({
48
+ isVisible: R,
49
49
  setInitialFocus: M,
50
50
  close: L
51
- }), [F, M, L]);
52
- x(() => {
53
- n && (A(!0), b(!0));
54
- }, [n]), x(() => {
51
+ }), [R, M, L]);
52
+ m(() => {
53
+ n && (A(!0), F(!0));
54
+ }, [n]), m(() => {
55
55
  if (n) {
56
56
  const e = setTimeout(() => {
57
- k(!0);
57
+ d(!0);
58
58
  }, 100);
59
59
  return () => {
60
60
  clearTimeout(e);
61
61
  };
62
62
  }
63
- k(!1);
64
- }, [n]), x(() => {
65
- if (y && !d) {
63
+ d(!1);
64
+ }, [n]), m(() => {
65
+ if (y && !i) {
66
66
  const e = setTimeout(() => {
67
- r == null || r(N.current ?? void 0), b(!1);
67
+ p == null || p(E.current ?? void 0), F(!1);
68
68
  }, 370);
69
69
  return () => {
70
70
  clearTimeout(e);
71
71
  };
72
72
  }
73
- }, [y, d, r]), x(() => {
74
- const e = R.current;
75
- if (n && f && e) {
76
- const h = ($) => {
77
- e === $.target && k(!1);
73
+ }, [y, i, p]), m(() => {
74
+ const e = N.current;
75
+ if (n && c && e) {
76
+ const v = ($) => {
77
+ e === $.target && d(!1);
78
78
  };
79
- return e.addEventListener("click", h), () => {
80
- e.removeEventListener("click", h);
79
+ return e.addEventListener("click", v), () => {
80
+ e.removeEventListener("click", v);
81
81
  };
82
82
  }
83
- }, [n, f]), x(() => {
84
- if (!n || !u)
83
+ }, [n, c]), m(() => {
84
+ if (!n || !l)
85
85
  return;
86
- const e = (h) => {
87
- h.key === "Escape" && k(!1);
86
+ const e = (v) => {
87
+ v.key === "Escape" && d(!1);
88
88
  };
89
89
  return window.addEventListener("keydown", e), () => {
90
90
  window.removeEventListener("keydown", e);
91
91
  };
92
- }, [n, u]);
93
- const S = T(() => ({
94
- initialFocus: () => E.current ?? void 0,
92
+ }, [n, l]);
93
+ const S = w(() => ({
94
+ initialFocus: () => T.current ?? void 0,
95
95
  onActivate: () => {
96
96
  var e;
97
- return (e = E.current) == null ? void 0 : e.focus();
97
+ return (e = T.current) == null ? void 0 : e.focus();
98
98
  }
99
- }), []), g = /* @__PURE__ */ t.jsx(C, { decorators: a, children: /* @__PURE__ */ t.jsx("div", { "aria-hidden": !d, style: {
100
- "--max-width": s ? `${s}px` : void 0
101
- }, className: I("kakadu-components-4119461136", d && "kakadu-components-2522346797", i), children: /* @__PURE__ */ t.jsx(C, { decorators: c, children: /* @__PURE__ */ t.jsx(H.FocusTrap, { active: d, focusTrapOptions: S, children: /* @__PURE__ */ t.jsx("div", { ref: R, className: "kakadu-components-4011815997", children: /* @__PURE__ */ t.jsx("div", { role: "dialog", "aria-modal": "true", "aria-label": j ?? "Modal", className: I("kakadu-components-3324483532", m && "kakadu-components-3799971070", d && "kakadu-components-968755580"), children: /* @__PURE__ */ t.jsxs(Q, { value: D, children: [
102
- l ? /* @__PURE__ */ t.jsx(V, {}) : null,
103
- /* @__PURE__ */ t.jsx("div", { className: I("kakadu-components-633990035", m && "kakadu-components-171969824"), children: P })
99
+ }), []), b = /* @__PURE__ */ t.jsx(g, { decorators: a, children: /* @__PURE__ */ t.jsx("div", { "aria-hidden": !i, style: {
100
+ "--max-width": o ? `${o}px` : void 0
101
+ }, className: I("kakadu-components-4119461136", i && "kakadu-components-2522346797", x), children: /* @__PURE__ */ t.jsx(g, { decorators: r, children: /* @__PURE__ */ t.jsx(H.FocusTrap, { active: i, focusTrapOptions: S, children: /* @__PURE__ */ t.jsx("div", { ref: N, className: "kakadu-components-4011815997", children: /* @__PURE__ */ t.jsx("div", { role: "dialog", "aria-modal": "true", "aria-label": k ?? "Modal", className: I("kakadu-components-3324483532", u && "kakadu-components-3799971070", i && "kakadu-components-968755580"), children: /* @__PURE__ */ t.jsxs(Q, { value: D, children: [
102
+ B ? /* @__PURE__ */ t.jsx(V, {}) : null,
103
+ /* @__PURE__ */ t.jsx("div", { className: I("kakadu-components-633990035", u && "kakadu-components-171969824"), children: P })
104
104
  ] }) }) }) }) }) }) });
105
- return o ? G(g, o) : g;
105
+ return s ? G(b, s) : b;
106
106
  }
107
- function oe(o, a) {
108
- const [c, j] = w(!1), s = p(void 0), i = p(null), n = v(async (u) => (j(!0), i.current = u ?? document.activeElement, new Promise((l) => {
109
- s.current = l;
110
- })), []), m = v((u) => {
107
+ function se(s, a) {
108
+ const [r, k] = h(!1), o = j(void 0), x = f(async () => (k(!0), new Promise((c) => {
109
+ o.current = c;
110
+ })), []), n = f((c) => {
111
111
  var l;
112
- if (j(!1), (l = s.current) == null || l.call(s, u), s.current = void 0, i.current) {
113
- const r = i.current;
114
- r.isConnected && r.focus(), i.current = null;
115
- }
116
- }, []), f = T(() => /* @__PURE__ */ t.jsx(o, { ...a, isVisible: c, onClose: m }), [o, a, c, m]);
117
- return T(() => ({
118
- isVisible: c,
119
- show: n,
120
- modal: f
121
- }), [c, n, f]);
112
+ k(!1), (l = o.current) == null || l.call(o, c), o.current = void 0;
113
+ }, []), u = w(() => /* @__PURE__ */ t.jsx(s, { ...a, isVisible: r, onClose: n }), [s, a, r, n]);
114
+ return w(() => ({
115
+ isVisible: r,
116
+ show: x,
117
+ modal: u
118
+ }), [r, x, u]);
122
119
  }
123
120
  export {
124
121
  ne as default,
125
- oe as useModal,
122
+ se as useModal,
126
123
  U as useModalContext
127
124
  };
@@ -1,4 +1,4 @@
1
- import { type FocusEvent, type MouseEvent, type ReactNode, type Ref } from 'react';
1
+ import { type MouseEvent, type ReactNode, type Ref } from 'react';
2
2
  import { type IconType } from '../icons/icon';
3
3
  import { type DecoratorType } from './decorators';
4
4
  type PopoverMenuItemElementType = HTMLButtonElement | HTMLAnchorElement;
@@ -18,11 +18,10 @@ export type PopoverMenuItemProperties = {
18
18
  readonly decorators?: DecoratorType[];
19
19
  readonly className?: string;
20
20
  readonly onClick?: (event: MouseEvent<PopoverMenuItemElementType>) => void;
21
- readonly onFocus?: (event: FocusEvent<PopoverMenuItemElementType>) => void;
22
21
  readonly onMouseEnter?: (event: MouseEvent<PopoverMenuItemElementType>) => void;
23
22
  };
24
23
  export declare function usePopoverMenu(items: PopoverMenuItemProperties[]): {
25
- show: (reference?: HTMLElement) => Promise<void | undefined>;
24
+ show: () => Promise<void | undefined>;
26
25
  popoverMenu: import("react/jsx-runtime").JSX.Element;
27
26
  };
28
27
  export type PopoverMenuProperties = {
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../jsx-runtime-BB_1_6y_.js"),w=require("@kuma-ui/core"),a=require("react"),M=require("../theme.js"),k=require("../icons/icon.js"),m=require("./popover.js"),q=require("./atom.js"),h=require("./text.js"),g=require("./hover-gradient.js"),I=require("./click-ripples.js"),P=require("./separator.js"),N=require("./decorators.js"),E=new Set;function R(){const[e,n]=a.useState(!1),s=a.useCallback(o=>{n(o);for(const c of E)c(o)},[]);return a.useEffect(()=>{const o=c=>{n(c)};return E.add(o),()=>{E.delete(o)}},[]),a.useMemo(()=>({isKeyboardNavigating:e,setIsKeyboardNavigating:s}),[e,s])}function S({label:e,iconLeft:n,iconRight:s,href:o,shouldCloseOnClick:c=!0,decorators:v=[],submenu:i,className:j,onClick:p,...f}){const{isFocused:u,close:r}=m.usePopoverContext(),{isKeyboardNavigating:l}=R(),x=a.useCallback(b=>{u&&(p==null||p(b),i?i.show():c&&(r==null||r()))},[u,p,c,r,i]),d=a.useMemo(()=>t.jsxRuntimeExports.jsxs(q.default,{as:o?"a":"button",...f,type:o?void 0:"button",role:"menuitem",href:o,className:w.cx(M.buttonResetStyles,"kakadu-components-3114599304",l?"kakadu-components-4096376656":"kakadu-components-2554182777",j),onClick:x,children:[t.jsxRuntimeExports.jsxs(h.Span,{className:"kakadu-components-1109353535",children:[n?t.jsxRuntimeExports.jsx(k.default,{width:12,height:12,type:n}):null,t.jsxRuntimeExports.jsx("span",{className:"kakadu-components-913703148",children:e}),s?t.jsxRuntimeExports.jsx(k.default,{width:12,height:12,type:s}):null]}),l?null:t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(g.default,{size:150,className:g.normalBlendStyles}),t.jsxRuntimeExports.jsx(I.default,{size:100})]})]}),[l,f,o,j,x,n,e,s]);return t.jsxRuntimeExports.jsx(N.default,{decorators:v,children:i?t.jsxRuntimeExports.jsx(y,{menu:i.popoverMenu,className:"kakadu-components-1861176543",children:d}):d})}function _(e){if("type"in e){if(e.type==="separator")return t.jsxRuntimeExports.jsx(P.default,{});if(e.type==="group")return t.jsxRuntimeExports.jsx(h.Span,{className:"kakadu-components-1499037363",children:e.label})}return t.jsxRuntimeExports.jsx(S,{...e})}function C({items:e}){const{isFocused:n}=m.usePopoverContext(),[s,o]=a.useState(0),[c,v]=a.useState([]),{setIsKeyboardNavigating:i}=R(),j=a.useCallback(u=>{u&&v(r=>[...r,u])},[]),p=a.useCallback(u=>{n&&(u.currentTarget.focus(),i(!1))},[n,i]),f=a.useCallback(u=>{if(n){const r=u.target;o(c.indexOf(r))}},[n,c]);return a.useEffect(()=>{if(!n)return;const u=r=>{const l=c.length;if(l===0)return;let x;switch(r.key){case"ArrowDown":{x=(s+1)%l;break}case"ArrowUp":{x=(s-1+l)%l;break}case"Home":{x=0;break}case"End":{x=l-1;break}}if(x!==void 0){r.preventDefault(),r.stopPropagation();const d=c[x];d&&(d.focus(),i(!0))}};return window.addEventListener("keydown",u,{capture:!0}),()=>{window.removeEventListener("keydown",u,{capture:!0})}},[n,c,s,i]),t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:e.map((u,r)=>t.jsxRuntimeExports.jsx(_,{...u,reference:j,onFocus:f,onMouseEnter:p},r))})}function F({items:e,...n}){return t.jsxRuntimeExports.jsx(m.default,{...n,as:"nav",role:"menu",innerClassName:"kakadu-components-3600436535",children:t.jsxRuntimeExports.jsx(C,{items:e})})}function K(e){const n=a.useMemo(()=>({items:e}),[e]),{show:s,popover:o}=m.usePopover(F,n);return a.useMemo(()=>({show:s,popoverMenu:o}),[s,o])}function y({menu:e,className:n,children:s}){return t.jsxRuntimeExports.jsxs(m.PopoverContainer,{className:n,children:[s,e]})}exports.default=y;exports.usePopoverMenu=K;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("../jsx-runtime-BB_1_6y_.js"),M=require("@kuma-ui/core"),a=require("react"),b=require("../theme.js"),k=require("../icons/icon.js"),j=require("./popover.js"),q=require("./atom.js"),g=require("./text.js"),R=require("./hover-gradient.js"),P=require("./click-ripples.js"),I=require("./separator.js"),N=require("./decorators.js"),E=new Set;function h(){const[e,n]=a.useState(!1),r=a.useCallback(s=>{n(s);for(const i of E)i(s)},[]);return a.useEffect(()=>{const s=i=>{n(i)};return E.add(s),()=>{E.delete(s)}},[]),a.useMemo(()=>({isKeyboardNavigating:e,setIsKeyboardNavigating:r}),[e,r])}function S({label:e,iconLeft:n,iconRight:r,href:s,shouldCloseOnClick:i=!0,decorators:v=[],submenu:x,className:u,onClick:o,...m}){const{isFocused:l,close:c}=j.usePopoverContext(),{isKeyboardNavigating:f}=h(),d=a.useCallback(w=>{l&&(o==null||o(w),x?x.show():i&&(c==null||c()))},[l,o,i,c,x]),p=a.useMemo(()=>t.jsxRuntimeExports.jsxs(q.default,{as:s?"a":"button",...m,type:s?void 0:"button",role:"menuitem",href:s,className:M.cx(b.buttonResetStyles,"kakadu-components-3114599304",f?"kakadu-components-4096376656":"kakadu-components-2554182777",u),onClick:d,children:[t.jsxRuntimeExports.jsxs(g.Span,{className:"kakadu-components-1109353535",children:[n?t.jsxRuntimeExports.jsx(k.default,{width:12,height:12,type:n}):null,t.jsxRuntimeExports.jsx("span",{className:"kakadu-components-913703148",children:e}),r?t.jsxRuntimeExports.jsx(k.default,{width:12,height:12,type:r}):null]}),f?null:t.jsxRuntimeExports.jsxs(t.jsxRuntimeExports.Fragment,{children:[t.jsxRuntimeExports.jsx(R.default,{size:150,className:R.normalBlendStyles}),t.jsxRuntimeExports.jsx(P.default,{size:100})]})]}),[f,m,s,u,d,n,e,r]);return t.jsxRuntimeExports.jsx(N.default,{decorators:v,children:x?t.jsxRuntimeExports.jsx(y,{menu:x.popoverMenu,className:"kakadu-components-1861176543",children:p}):p})}function _(e){if("type"in e){if(e.type==="separator")return t.jsxRuntimeExports.jsx(I.default,{});if(e.type==="group")return t.jsxRuntimeExports.jsx(g.Span,{className:"kakadu-components-1499037363",children:e.label})}return t.jsxRuntimeExports.jsx(S,{...e})}function K({items:e}){const{isFocused:n}=j.usePopoverContext(),[r,s]=a.useState([]),{setIsKeyboardNavigating:i}=h(),v=a.useCallback(u=>{u&&s(o=>o.includes(u)?o:[...o,u])},[]),x=a.useCallback(u=>{n&&(u.currentTarget.focus(),i(!1))},[n,i]);return a.useEffect(()=>{if(!n)return;const u=o=>{const m=r.filter(p=>p.isConnected),l=m.length;if(l===0)return;let c;const f=document.activeElement;let d=f?m.indexOf(f):-1;switch(d===-1&&(d=0),o.key){case"ArrowDown":{c=(d+1)%l;break}case"ArrowUp":{c=(d-1+l)%l;break}case"Home":{c=0;break}case"End":{c=l-1;break}}if(c!==void 0){o.preventDefault(),o.stopPropagation();const p=m[c];p&&(p.focus(),i(!0))}};return window.addEventListener("keydown",u,{capture:!0}),()=>{window.removeEventListener("keydown",u,{capture:!0})}},[n,r,i]),t.jsxRuntimeExports.jsx(t.jsxRuntimeExports.Fragment,{children:e.map((u,o)=>t.jsxRuntimeExports.jsx(_,{...u,reference:v,onMouseEnter:x},o))})}function C({items:e,...n}){return t.jsxRuntimeExports.jsx(j.default,{...n,as:"nav",role:"menu",innerClassName:"kakadu-components-3600436535",children:t.jsxRuntimeExports.jsx(K,{items:e})})}function F(e){const n=a.useMemo(()=>({items:e}),[e]),{show:r,popover:s}=j.usePopover(C,n);return a.useMemo(()=>({show:r,popoverMenu:s}),[r,s])}function y({menu:e,className:n,children:r}){return t.jsxRuntimeExports.jsxs(j.PopoverContainer,{className:n,children:[r,e]})}exports.default=y;exports.usePopoverMenu=F;
@@ -1,65 +1,65 @@
1
1
  import { j as n } from "../jsx-runtime-B4hRZ52C.mjs";
2
2
  import { cx as b } from "@kuma-ui/core";
3
- import { useMemo as v, useState as h, useCallback as l, useEffect as y } from "react";
3
+ import { useMemo as v, useState as h, useCallback as x, useEffect as y } from "react";
4
4
  import { buttonResetStyles as M } from "../theme.mjs";
5
- import j from "../icons/icon.mjs";
6
- import E, { PopoverContainer as S, usePopover as F, usePopoverContext as w } from "./popover.mjs";
7
- import K from "./atom.mjs";
5
+ import g from "../icons/icon.mjs";
6
+ import E, { PopoverContainer as S, usePopover as K, usePopoverContext as w } from "./popover.mjs";
7
+ import F from "./atom.mjs";
8
8
  import { Span as I } from "./text.mjs";
9
9
  import A, { normalBlendStyles as D } from "./hover-gradient.mjs";
10
10
  import H from "./click-ripples.mjs";
11
11
  import z from "./separator.mjs";
12
12
  import C from "./decorators.mjs";
13
- const g = /* @__PURE__ */ new Set();
13
+ const j = /* @__PURE__ */ new Set();
14
14
  function N() {
15
- const [e, t] = h(!1), o = l((r) => {
16
- t(r);
17
- for (const i of g)
18
- i(r);
15
+ const [e, t] = h(!1), s = x((o) => {
16
+ t(o);
17
+ for (const i of j)
18
+ i(o);
19
19
  }, []);
20
20
  return y(() => {
21
- const r = (i) => {
21
+ const o = (i) => {
22
22
  t(i);
23
23
  };
24
- return g.add(r), () => {
25
- g.delete(r);
24
+ return j.add(o), () => {
25
+ j.delete(o);
26
26
  };
27
27
  }, []), v(() => ({
28
28
  isKeyboardNavigating: e,
29
- setIsKeyboardNavigating: o
30
- }), [e, o]);
29
+ setIsKeyboardNavigating: s
30
+ }), [e, s]);
31
31
  }
32
32
  function L({
33
33
  label: e,
34
34
  iconLeft: t,
35
- iconRight: o,
36
- href: r,
35
+ iconRight: s,
36
+ href: o,
37
37
  shouldCloseOnClick: i = !0,
38
38
  decorators: k = [],
39
- submenu: c,
40
- className: f,
41
- onClick: d,
42
- ...x
39
+ submenu: d,
40
+ className: a,
41
+ onClick: r,
42
+ ...p
43
43
  }) {
44
44
  const {
45
- isFocused: a,
46
- close: s
45
+ isFocused: u,
46
+ close: c
47
47
  } = w(), {
48
- isKeyboardNavigating: u
49
- } = N(), m = l((P) => {
50
- a && (d == null || d(P), c ? c.show() : i && (s == null || s()));
51
- }, [a, d, i, s, c]), p = v(() => /* @__PURE__ */ n.jsxs(K, { as: r ? "a" : "button", ...x, type: r ? void 0 : "button", role: "menuitem", href: r, className: b(M, "kakadu-components-3114599304", u ? "kakadu-components-4096376656" : "kakadu-components-2554182777", f), onClick: m, children: [
48
+ isKeyboardNavigating: f
49
+ } = N(), m = x((P) => {
50
+ u && (r == null || r(P), d ? d.show() : i && (c == null || c()));
51
+ }, [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: [
52
52
  /* @__PURE__ */ n.jsxs(I, { className: "kakadu-components-1109353535", children: [
53
- t ? /* @__PURE__ */ n.jsx(j, { width: 12, height: 12, type: t }) : null,
53
+ t ? /* @__PURE__ */ n.jsx(g, { width: 12, height: 12, type: t }) : null,
54
54
  /* @__PURE__ */ n.jsx("span", { className: "kakadu-components-913703148", children: e }),
55
- o ? /* @__PURE__ */ n.jsx(j, { width: 12, height: 12, type: o }) : null
55
+ s ? /* @__PURE__ */ n.jsx(g, { width: 12, height: 12, type: s }) : null
56
56
  ] }),
57
- u ? null : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
57
+ f ? null : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
58
58
  /* @__PURE__ */ n.jsx(A, { size: 150, className: D }),
59
59
  /* @__PURE__ */ n.jsx(H, { size: 100 })
60
60
  ] })
61
- ] }), [u, x, r, f, m, t, e, o]);
62
- return /* @__PURE__ */ n.jsx(C, { decorators: k, children: c ? /* @__PURE__ */ n.jsx(T, { menu: c.popoverMenu, className: "kakadu-components-1861176543", children: p }) : p });
61
+ ] }), [f, p, o, a, m, t, e, s]);
62
+ return /* @__PURE__ */ n.jsx(C, { decorators: k, children: d ? /* @__PURE__ */ n.jsx(T, { menu: d.popoverMenu, className: "kakadu-components-1861176543", children: l }) : l });
63
63
  }
64
64
  function R(e) {
65
65
  if ("type" in e) {
@@ -75,48 +75,45 @@ function B({
75
75
  }) {
76
76
  const {
77
77
  isFocused: t
78
- } = w(), [o, r] = h(0), [i, k] = h([]), {
79
- setIsKeyboardNavigating: c
80
- } = N(), f = l((a) => {
81
- a && k((s) => [...s, a]);
82
- }, []), d = l((a) => {
83
- t && (a.currentTarget.focus(), c(!1));
84
- }, [t, c]), x = l((a) => {
85
- if (t) {
86
- const s = a.target;
87
- r(i.indexOf(s));
88
- }
78
+ } = w(), [s, o] = h([]), {
79
+ setIsKeyboardNavigating: i
80
+ } = N(), k = x((a) => {
81
+ a && o((r) => r.includes(a) ? r : [...r, a]);
82
+ }, []), d = x((a) => {
83
+ t && (a.currentTarget.focus(), i(!1));
89
84
  }, [t, i]);
90
85
  return y(() => {
91
86
  if (!t)
92
87
  return;
93
- const a = (s) => {
94
- const u = i.length;
88
+ const a = (r) => {
89
+ const p = s.filter((l) => l.isConnected), u = p.length;
95
90
  if (u === 0)
96
91
  return;
97
- let m;
98
- switch (s.key) {
92
+ let c;
93
+ const f = document.activeElement;
94
+ let m = f ? p.indexOf(f) : -1;
95
+ switch (m === -1 && (m = 0), r.key) {
99
96
  case "ArrowDown": {
100
- m = (o + 1) % u;
97
+ c = (m + 1) % u;
101
98
  break;
102
99
  }
103
100
  case "ArrowUp": {
104
- m = (o - 1 + u) % u;
101
+ c = (m - 1 + u) % u;
105
102
  break;
106
103
  }
107
104
  case "Home": {
108
- m = 0;
105
+ c = 0;
109
106
  break;
110
107
  }
111
108
  case "End": {
112
- m = u - 1;
109
+ c = u - 1;
113
110
  break;
114
111
  }
115
112
  }
116
- if (m !== void 0) {
117
- s.preventDefault(), s.stopPropagation();
118
- const p = i[m];
119
- p && (p.focus(), c(!0));
113
+ if (c !== void 0) {
114
+ r.preventDefault(), r.stopPropagation();
115
+ const l = p[c];
116
+ l && (l.focus(), i(!0));
120
117
  }
121
118
  };
122
119
  return window.addEventListener("keydown", a, {
@@ -126,15 +123,14 @@ function B({
126
123
  capture: !0
127
124
  });
128
125
  };
129
- }, [t, i, o, c]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((a, s) => /* @__PURE__ */ n.jsx(
126
+ }, [t, s, i]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((a, r) => /* @__PURE__ */ n.jsx(
130
127
  R,
131
128
  {
132
129
  ...a,
133
- reference: f,
134
- onFocus: x,
130
+ reference: k,
135
131
  onMouseEnter: d
136
132
  },
137
- s
133
+ r
138
134
  )) });
139
135
  }
140
136
  function G({
@@ -147,21 +143,21 @@ function ee(e) {
147
143
  const t = v(() => ({
148
144
  items: e
149
145
  }), [e]), {
150
- show: o,
151
- popover: r
152
- } = F(G, t);
146
+ show: s,
147
+ popover: o
148
+ } = K(G, t);
153
149
  return v(() => ({
154
- show: o,
155
- popoverMenu: r
156
- }), [o, r]);
150
+ show: s,
151
+ popoverMenu: o
152
+ }), [s, o]);
157
153
  }
158
154
  function T({
159
155
  menu: e,
160
156
  className: t,
161
- children: o
157
+ children: s
162
158
  }) {
163
159
  return /* @__PURE__ */ n.jsxs(S, { className: t, children: [
164
- o,
160
+ s,
165
161
  e
166
162
  ] });
167
163
  }
@@ -22,7 +22,7 @@ type PopoverBaseProperties<PopoverResult> = Omit<PopoverProperties<PopoverResult
22
22
  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;
23
23
  export declare function usePopover<PopoverResult, PopoverProperties = PopoverBaseProperties<PopoverResult>>(PopoverComponent: ComponentType<PopoverProperties>, properties?: PopoverProperties): {
24
24
  isVisible: boolean;
25
- show: (reference?: HTMLElement) => Promise<PopoverResult | undefined>;
25
+ show: () => Promise<PopoverResult | undefined>;
26
26
  popover: import("react/jsx-runtime").JSX.Element;
27
27
  };
28
28
  export {};
@@ -1 +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;
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,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;
@@ -1,6 +1,6 @@
1
1
  import { j as n } from "../jsx-runtime-B4hRZ52C.mjs";
2
- import { cx as f } from "@kuma-ui/core";
3
- import { createContext as Y, useRef as h, useState as d, useCallback as P, useMemo as T, useEffect as F, useContext as Z } from "react";
2
+ import { cx as u } from "@kuma-ui/core";
3
+ import { createContext as Y, useRef as j, useState as l, useCallback as R, useMemo as P, useEffect as w, useContext as Z } from "react";
4
4
  import { f as _ } from "../focus-trap-react-DYXrtbDH.mjs";
5
5
  import q, { defaultAtomElementType as G } from "./atom.mjs";
6
6
  const J = Y({
@@ -9,125 +9,121 @@ const J = Y({
9
9
  }), {
10
10
  Provider: $
11
11
  } = J;
12
- function re() {
12
+ function ce() {
13
13
  return Z(J);
14
14
  }
15
- function ae({
16
- as: a,
15
+ function re({
16
+ as: c,
17
17
  className: t,
18
18
  ...s
19
19
  }) {
20
- return /* @__PURE__ */ n.jsx(q, { as: a ?? G, ...s, className: f("kakadu-components-2845019685", t) });
20
+ return /* @__PURE__ */ n.jsx(q, { as: c ?? G, ...s, className: u("kakadu-components-2845019685", t) });
21
21
  }
22
22
  function ie({
23
- as: a,
23
+ as: c,
24
24
  isVisible: t,
25
25
  label: s,
26
- shouldCloseOnOutsideClick: m = !0,
26
+ shouldCloseOnOutsideClick: d = !0,
27
27
  shouldCloseOnEscapePress: o = !0,
28
- children: i,
29
- className: x,
30
- innerClassName: g,
31
- onClose: c,
32
- ...p
28
+ children: m,
29
+ className: p,
30
+ innerClassName: k,
31
+ onClose: a,
32
+ ...v
33
33
  }) {
34
- const r = h(null), v = h(null), [L, w] = d(!1), [O, K] = d(!1), [u, j] = d(!1), V = P((e) => {
35
- r.current = e, j(!1);
36
- }, []), I = h(null), A = P((e) => {
37
- e && (I.current = e);
38
- }, []), Q = T(() => ({
39
- initialFocus: () => I.current ?? void 0,
34
+ const N = j(null), L = j(null), [D, h] = l(!1), [O, K] = l(!1), [r, x] = l(!1), V = R((e) => {
35
+ N.current = e, x(!1);
36
+ }, []), T = j(null), A = R((e) => {
37
+ e && (T.current = e);
38
+ }, []), Q = P(() => ({
39
+ initialFocus: () => T.current ?? void 0,
40
40
  onActivate() {
41
41
  var e;
42
- (e = I.current) == null || e.focus(), w(!0);
42
+ (e = T.current) == null || e.focus(), h(!0);
43
43
  },
44
- returnFocusOnDeactivate: !1,
45
- clickOutsideDeactivates: m,
44
+ clickOutsideDeactivates: d,
46
45
  escapeDeactivates: o,
47
46
  onUnpause() {
48
- w(!0);
47
+ h(!0);
49
48
  },
50
49
  onPause() {
51
- w(!1);
50
+ h(!1);
52
51
  },
53
52
  onDeactivate() {
54
- j(!1), w(!1);
53
+ x(!1), h(!1);
55
54
  }
56
- }), [m, o]), [C, y] = d(t ?? !1), X = T(() => ({
57
- isVisible: C,
58
- isFocused: L,
55
+ }), [d, o]), [y, z] = l(t ?? !1), X = P(() => ({
56
+ isVisible: y,
57
+ isFocused: D,
59
58
  setInitialFocus: A,
60
59
  close: V
61
- }), [C, L, A, V]), [l, z] = d("center");
62
- return F(() => {
63
- const e = v.current;
60
+ }), [y, D, A, V]), [i, B] = l("center");
61
+ return w(() => {
62
+ const e = L.current;
64
63
  if (e) {
65
- const E = () => {
66
- const B = e.offsetParent, b = B instanceof HTMLElement ? B.getBoundingClientRect() : null, M = e.getBoundingClientRect();
67
- if (!b) {
68
- z("center");
64
+ const F = () => {
65
+ const C = e.offsetParent, I = C instanceof HTMLElement ? C.getBoundingClientRect() : null, M = e.getBoundingClientRect();
66
+ if (!I) {
67
+ B("center");
69
68
  return;
70
69
  }
71
- 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;
72
- let k = "center";
70
+ 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;
71
+ let f = "center";
73
72
  if (S && U) {
74
- const R = N - D;
75
- k = H - W > R ? "right" : "left";
76
- } else U ? k = "right" : S && (k = "left");
77
- z((R) => R === k ? R : k);
73
+ const g = b - E;
74
+ f = H - W > g ? "right" : "left";
75
+ } else U ? f = "right" : S && (f = "left");
76
+ B((g) => g === f ? g : f);
78
77
  };
79
- return E(), window.addEventListener("resize", E), () => {
80
- window.removeEventListener("resize", E);
78
+ return F(), window.addEventListener("resize", F), () => {
79
+ window.removeEventListener("resize", F);
81
80
  };
82
81
  }
83
- }, []), F(() => {
84
- t && (K(!0), y(!0));
85
- }, [t]), F(() => {
82
+ }, []), w(() => {
83
+ t && (K(!0), z(!0));
84
+ }, [t]), w(() => {
86
85
  if (t) {
87
86
  const e = setTimeout(() => {
88
- j(!0);
87
+ x(!0);
89
88
  }, 100);
90
89
  return () => {
91
90
  clearTimeout(e);
92
91
  };
93
92
  }
94
- j(!1);
95
- }, [t]), F(() => {
96
- if (O && !u) {
93
+ x(!1);
94
+ }, [t]), w(() => {
95
+ if (O && !r) {
97
96
  const e = setTimeout(() => {
98
- c == null || c(r.current ?? void 0), y(!1);
97
+ a == null || a(N.current ?? void 0), z(!1);
99
98
  }, 370);
100
99
  return () => {
101
100
  clearTimeout(e);
102
101
  };
103
102
  }
104
- }, [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: [
105
- /* @__PURE__ */ n.jsx("div", { className: f("kakadu-components-1951789226", l === "left" && "kakadu-components-1495725644", l === "right" && "kakadu-components-4235689197") }),
106
- /* @__PURE__ */ n.jsx(_.FocusTrap, { active: u, focusTrapOptions: Q, children: /* @__PURE__ */ n.jsxs("div", { className: f("kakadu-components-2488426662", g), children: [
107
- /* @__PURE__ */ n.jsx($, { value: X, children: i }),
108
- /* @__PURE__ */ n.jsx("div", { className: f("kakadu-components-3252390100", l === "left" && "kakadu-components-3754561431", l === "right" && "kakadu-components-2265262600") })
103
+ }, [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: [
104
+ /* @__PURE__ */ n.jsx("div", { className: u("kakadu-components-1951789226", i === "left" && "kakadu-components-1495725644", i === "right" && "kakadu-components-4235689197") }),
105
+ /* @__PURE__ */ n.jsx(_.FocusTrap, { active: r, focusTrapOptions: Q, children: /* @__PURE__ */ n.jsxs("div", { className: u("kakadu-components-2488426662", k), children: [
106
+ /* @__PURE__ */ n.jsx($, { value: X, children: m }),
107
+ /* @__PURE__ */ n.jsx("div", { className: u("kakadu-components-3252390100", i === "left" && "kakadu-components-3754561431", i === "right" && "kakadu-components-2265262600") })
109
108
  ] }) })
110
109
  ] }) });
111
110
  }
112
- function ue(a, t) {
113
- 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) => {
114
- o.current = r;
115
- })), []), g = P((p) => {
116
- var r;
117
- if (m(!1), (r = o.current) == null || r.call(o, p), o.current = void 0, i.current) {
118
- const v = i.current;
119
- v.isConnected && v.focus(), i.current = null;
120
- }
121
- }, []), c = T(() => /* @__PURE__ */ n.jsx(a, { ...t, isVisible: s, onClose: g }), [a, t, s, g]);
122
- return T(() => ({
111
+ function ue(c, t) {
112
+ const [s, d] = l(!1), o = j(void 0), m = R(async () => (d(!0), new Promise((a) => {
113
+ o.current = a;
114
+ })), []), p = R((a) => {
115
+ var v;
116
+ d(!1), (v = o.current) == null || v.call(o, a), o.current = void 0;
117
+ }, []), k = P(() => /* @__PURE__ */ n.jsx(c, { ...t, isVisible: s, onClose: p }), [c, t, s, p]);
118
+ return P(() => ({
123
119
  isVisible: s,
124
- show: x,
125
- popover: c
126
- }), [s, x, c]);
120
+ show: m,
121
+ popover: k
122
+ }), [s, m, k]);
127
123
  }
128
124
  export {
129
- ae as PopoverContainer,
125
+ re as PopoverContainer,
130
126
  ie as default,
131
127
  ue as usePopover,
132
- re as usePopoverContext
128
+ ce as usePopoverContext
133
129
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kakadu/components",
3
- "version": "3.1.3",
3
+ "version": "3.1.5",
4
4
  "description": "Kakadu components library",
5
5
  "license": "MIT",
6
6
  "main": "./build/index.js",