@kakadu/components 3.1.2 → 3.1.3
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.
|
@@ -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
|
|
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,6 +1,6 @@
|
|
|
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
|
|
3
|
+
import { useMemo as v, useState as h, useCallback as l, useEffect as y } from "react";
|
|
4
4
|
import { buttonResetStyles as M } from "../theme.mjs";
|
|
5
5
|
import j from "../icons/icon.mjs";
|
|
6
6
|
import E, { PopoverContainer as S, usePopover as F, usePopoverContext as w } from "./popover.mjs";
|
|
@@ -12,7 +12,7 @@ import z from "./separator.mjs";
|
|
|
12
12
|
import C from "./decorators.mjs";
|
|
13
13
|
const g = /* @__PURE__ */ new Set();
|
|
14
14
|
function N() {
|
|
15
|
-
const [e, t] = h(!1), o =
|
|
15
|
+
const [e, t] = h(!1), o = l((r) => {
|
|
16
16
|
t(r);
|
|
17
17
|
for (const i of g)
|
|
18
18
|
i(r);
|
|
@@ -46,9 +46,9 @@ function L({
|
|
|
46
46
|
close: s
|
|
47
47
|
} = w(), {
|
|
48
48
|
isKeyboardNavigating: u
|
|
49
|
-
} = N(), m =
|
|
49
|
+
} = N(), m = l((P) => {
|
|
50
50
|
a && (d == null || d(P), c ? c.show() : i && (s == null || s()));
|
|
51
|
-
}, [a, d, i, s, c]),
|
|
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: [
|
|
52
52
|
/* @__PURE__ */ n.jsxs(I, { className: "kakadu-components-1109353535", children: [
|
|
53
53
|
t ? /* @__PURE__ */ n.jsx(j, { width: 12, height: 12, type: t }) : null,
|
|
54
54
|
/* @__PURE__ */ n.jsx("span", { className: "kakadu-components-913703148", children: e }),
|
|
@@ -59,7 +59,7 @@ function L({
|
|
|
59
59
|
/* @__PURE__ */ n.jsx(H, { size: 100 })
|
|
60
60
|
] })
|
|
61
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:
|
|
62
|
+
return /* @__PURE__ */ n.jsx(C, { decorators: k, children: c ? /* @__PURE__ */ n.jsx(T, { menu: c.popoverMenu, className: "kakadu-components-1861176543", children: p }) : p });
|
|
63
63
|
}
|
|
64
64
|
function R(e) {
|
|
65
65
|
if ("type" in e) {
|
|
@@ -77,11 +77,11 @@ function B({
|
|
|
77
77
|
isFocused: t
|
|
78
78
|
} = w(), [o, r] = h(0), [i, k] = h([]), {
|
|
79
79
|
setIsKeyboardNavigating: c
|
|
80
|
-
} = N(), f =
|
|
80
|
+
} = N(), f = l((a) => {
|
|
81
81
|
a && k((s) => [...s, a]);
|
|
82
|
-
}, []), d =
|
|
82
|
+
}, []), d = l((a) => {
|
|
83
83
|
t && (a.currentTarget.focus(), c(!1));
|
|
84
|
-
}, [t, c]), x =
|
|
84
|
+
}, [t, c]), x = l((a) => {
|
|
85
85
|
if (t) {
|
|
86
86
|
const s = a.target;
|
|
87
87
|
r(i.indexOf(s));
|
|
@@ -115,12 +115,16 @@ function B({
|
|
|
115
115
|
}
|
|
116
116
|
if (m !== void 0) {
|
|
117
117
|
s.preventDefault(), s.stopPropagation();
|
|
118
|
-
const
|
|
119
|
-
|
|
118
|
+
const p = i[m];
|
|
119
|
+
p && (p.focus(), c(!0));
|
|
120
120
|
}
|
|
121
121
|
};
|
|
122
|
-
return window.addEventListener("keydown", a
|
|
123
|
-
|
|
122
|
+
return window.addEventListener("keydown", a, {
|
|
123
|
+
capture: !0
|
|
124
|
+
}), () => {
|
|
125
|
+
window.removeEventListener("keydown", a, {
|
|
126
|
+
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
130
|
R,
|