@kakadu/components 3.13.2 → 3.15.0

package/build/components/input.d.ts

@@ -17,15 +17,16 @@ type LabelProperties = HTMLProps<HTMLLabelElement> & LabelMessageProperties<'err
     readonly attachments?: ReactNode;
 };
 type ControllerProperties = Omit<LabelProperties, 'errorId' | 'warningId' | 'attachments'>;
-export type SelectOption = {
-    readonly value: string;
+export type SelectOption<Type extends string = string> = {
+    readonly value: Type;
     readonly label: ReactNode | string;
+    readonly disabled?: boolean;
 };
-export type SelectProperties = Omit<ControllerProperties & HTMLProps<HTMLSelectElement>, 'onChange'> & {
-    readonly options: SelectOption[];
-    readonly onChange?: (value: string, event: ChangeEvent<HTMLSelectElement>) => void;
+export type SelectProperties<Type extends string = string> = Omit<ControllerProperties & HTMLProps<HTMLSelectElement>, 'onChange'> & {
+    readonly options: Array<SelectOption<Type>>;
+    readonly onChange?: (value: Type, event: ChangeEvent<HTMLSelectElement>) => void;
 };
-export declare function Select({ label, options, error, warning, information, footnote, className, onChange, ...properties }: SelectProperties): import("react/jsx-runtime").JSX.Element;
+export declare function Select<Type extends string = string>({ label, options, error, warning, information, footnote, className, onChange, ...properties }: SelectProperties<Type>): import("react/jsx-runtime").JSX.Element;
 type InputType = HTMLInputElement | HTMLTextAreaElement;
 export type InputAction = {
     icon: IconType;

package/build/components/input.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../jsx-runtime-BB_1_6y_.js"),t=require("react"),l=require("@kuma-ui/core"),xe=require("../icons/chevron-up.js"),J=require("../icons/icon.js"),K=require("../utilities/copy-to-clipboard.js"),H=require("../theme.js"),pe=require("../icons/sparkle.js"),de=require("./button-tooltip.js"),L=require("./text-button.js"),g=require("./text.js"),me=require("./collapsible.js"),Q=require("./click-ripples.js"),X=require("./hover-gradient.js"),je=require("./notification.js"),ke=require("./notice.js"),fe="kakadu-components-922159086",he="kakadu-components-25448712",w="kakadu-components-1923392328",A="kakadu-components-4056037255",Y=l.cx(A,"kakadu-components-3245407458"),Ee=l.cx(A,"kakadu-components-1117160492"),Re=l.cx(A,"kakadu-components-2261792866");function be({as:f,className:i,...p}){return e.jsxRuntimeExports.jsx(g.Span,{as:f??"span",...p,className:l.cx("kakadu-components-520991867",i)})}function Z({label:f,error:i,errorId:p,warning:u,warningId:R,information:h,informationId:s,footnote:o,attachments:E,className:d,children:v,...m}){const j=!!i,c=!!u,k=!!h,b=!!o;return e.jsxRuntimeExports.jsx("label",{...m,className:l.cx(fe,d),children:e.jsxRuntimeExports.jsxs("div",{className:"kakadu-components-3146929190",children:[e.jsxRuntimeExports.jsx(g.Span,{className:l.cx(H.overflowProtectionStyles,he),children:e.jsxRuntimeExports.jsx("span",{children:f})}),e.jsxRuntimeExports.jsxs("span",{className:"kakadu-components-3298764637",children:[v,b?e.jsxRuntimeExports.jsx(be,{className:"kakadu-components-613632806",children:o}):null,E]}),j||c||k?e.jsxRuntimeExports.jsx("div",{className:"kakadu-components-2927674627",children:j?e.jsxRuntimeExports.jsx(g.Paragraph,{id:p,className:Y,children:i instanceof Error?i.message:i}):c?e.jsxRuntimeExports.jsx(g.Paragraph,{id:R,className:Ee,children:u instanceof Error?u.message:u}):k?e.jsxRuntimeExports.jsx(g.Paragraph,{id:s,className:Re,children:h instanceof Error?h.message:h}):null}):null]})})}function ye({label:f,options:i,error:p,warning:u,information:R,footnote:h,className:s,onChange:o,...E}){const d=t.useId(),v=`${d}-error`,m=`${d}-warning`,j=`${d}-information`,c=!!p,k=!c&&!!u,b=!c&&!k&&!!R,N=c?v:k?m:b?j:void 0,{value:y}=E,[S,I]=t.useState(""),q=y??S;t.useEffect(()=>{I(typeof y=="string"?y:"")},[y]);const C=t.useCallback(r=>{const{value:B}=r.target;I(B),o==null||o(B,r)},[o]);return e.jsxRuntimeExports.jsxs(Z,{label:f,error:p,errorId:v,warning:u,warningId:m,information:R,informationId:j,footnote:h,children:[e.jsxRuntimeExports.jsx("select",{...E,value:q,"aria-invalid":c,"data-warning":k,"data-information":b,"aria-describedby":N,className:l.cx(w,"kakadu-components-4228384787",s),onChange:C,children:i.map(r=>e.jsxRuntimeExports.jsx("option",{value:r.value,children:r.label},r.value))}),e.jsxRuntimeExports.jsx(xe.default,{width:14,height:14,className:"kakadu-components-158931186"})]})}const ve=40,V="kakadu-components-4233741488";function ge({type:f,label:i,error:p,warning:u,information:R,footnote:h,suggestion:s,actions:o=[],hasCopyButton:E,hasClearButton:d,isMultiline:v,onChange:m,className:j,...c}){const k=t.useRef(null),b=t.useRef(null),N=t.useRef(null),y=je.useCreateNotification(),S=t.useId(),I=`${S}-error`,q=`${S}-warning`,C=`${S}-information`,{value:r,disabled:B}=c,[ee,F]=t.useState(""),x=r??ee,[te,se]=t.useState(),ne=f==="textarea"||!!v;t.useLayoutEffect(()=>{typeof x=="string"&&N.current&&se(N.current.scrollHeight)},[x]);const T=t.useMemo(()=>typeof x=="string"?`${x} `.split(`
-`):[],[x]),ae=t.useMemo(()=>T.length,[T]),_=!!p,$=!_&&!!u,M=!!R,O=_?I:$?q:M?C:void 0;t.useEffect(()=>{F(typeof r=="string"?r:"")},[r]);const W=t.useCallback(n=>{const{value:a}=n.target;F(a),m==null||m(a,n)},[m]),oe=t.useCallback(()=>{typeof x=="string"&&(K.default(x),y({type:ke.NoticeType.success,children:"Copied to clipboard."}))},[x,y]),P=t.useCallback(n=>{var D;const a=b.current??k.current??void 0;if(a){const G=(D=Object.getOwnPropertyDescriptor(a instanceof HTMLTextAreaElement?HTMLTextAreaElement.prototype:HTMLInputElement.prototype,"value"))==null?void 0:D.set;if(G){G.call(a,n);const ue=new Event("input",{bubbles:!0});a.dispatchEvent(ue),a.focus();return}}throw new Error("Unable to set value.")},[]),ce=t.useCallback(()=>{P("")},[P]),[re,le]=t.useState(""),U=!!s&&re!==s,ie=t.useCallback(()=>{if(s){try{P(s)}catch{K.default(s)}le(s)}},[s,P]),z=t.useMemo(()=>o.length,[o]);return e.jsxRuntimeExports.jsxs(Z,{label:i,error:p,errorId:I,warning:u,warningId:q,information:R,informationId:C,footnote:h,attachments:e.jsxRuntimeExports.jsx(me.default,{isCollapsed:!U,children:U?e.jsxRuntimeExports.jsxs("button",{type:"button",className:l.cx(H.buttonResetStyles,H.overflowProtectionStyles,"kakadu-components-2355856341"),onClick:ie,children:[e.jsxRuntimeExports.jsx(de.default,{label:"Apply suggestion"}),e.jsxRuntimeExports.jsx(pe.default,{width:13,height:13,className:"kakadu-components-1021263934"}),e.jsxRuntimeExports.jsx(g.Span,{className:"kakadu-components-1585874956",children:s}),e.jsxRuntimeExports.jsx(Q.default,{className:"kakadu-components-3448565402"}),e.jsxRuntimeExports.jsx(X.default,{})]}):null}),style:{"--button-padding":`calc(${ve*((E?1:0)+(d?1:0)+z)}px + 6px)`},children:[e.jsxRuntimeExports.jsxs("div",{className:"kakadu-components-3146929190",children:[ne?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("span",{ref:N,"aria-hidden":!0,className:l.cx(w,j,"kakadu-components-2033521835"),children:[T.map((n,a)=>e.jsxRuntimeExports.jsxs("span",{children:[n,ae>1?e.jsxRuntimeExports.jsx("br",{}):null]},a))," "]}),e.jsxRuntimeExports.jsx("textarea",{...c,ref:b,rows:1,"aria-invalid":_,"data-warning":$,"data-information":M,"aria-describedby":O,value:x,className:l.cx(w,j,"kakadu-components-2119524139"),style:{minHeight:te},onChange:W})]}):e.jsxRuntimeExports.jsx("input",{...c,ref:k,type:f??"text",value:x,"aria-invalid":_,"data-warning":$,"data-information":M,"aria-describedby":O,className:l.cx(w,j),onChange:W}),B?null:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(Q.default,{className:"kakadu-components-616311160"}),e.jsxRuntimeExports.jsx(X.default,{className:"kakadu-components-1962999040"})]})]}),E||d||z>0?e.jsxRuntimeExports.jsxs("div",{className:"kakadu-components-131986363",children:[o.map((n,a)=>e.jsxRuntimeExports.jsx(L.default,{iconLeft:n.icon,label:n.label,tooltip:n.label,className:V,onClick:n.onClick},n.label+a)),E?e.jsxRuntimeExports.jsx(L.default,{iconLeft:J.IconType.copy,label:"Copy",tooltip:"Copy",className:V,onClick:oe}):null,d?e.jsxRuntimeExports.jsx(L.default,{iconLeft:J.IconType.times,label:"Clear",tooltip:"Clear",className:V,onClick:ce}):null]}):null]})}exports.Select=ye;exports.default=ge;exports.errorParagraph=Y;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../jsx-runtime-BB_1_6y_.js"),t=require("react"),l=require("@kuma-ui/core"),xe=require("../icons/chevron-up.js"),J=require("../icons/icon.js"),K=require("../utilities/copy-to-clipboard.js"),H=require("../theme.js"),de=require("../icons/sparkle.js"),pe=require("./button-tooltip.js"),L=require("./text-button.js"),g=require("./text.js"),me=require("./collapsible.js"),Q=require("./click-ripples.js"),X=require("./hover-gradient.js"),je=require("./notification.js"),ke=require("./notice.js"),fe="kakadu-components-922159086",he="kakadu-components-25448712",w="kakadu-components-1923392328",A="kakadu-components-4056037255",Y=l.cx(A,"kakadu-components-3245407458"),Ee=l.cx(A,"kakadu-components-1117160492"),Re=l.cx(A,"kakadu-components-2261792866");function be({as:f,className:i,...d}){return e.jsxRuntimeExports.jsx(g.Span,{as:f??"span",...d,className:l.cx("kakadu-components-520991867",i)})}function Z({label:f,error:i,errorId:d,warning:u,warningId:R,information:h,informationId:s,footnote:c,attachments:E,className:p,children:v,...m}){const j=!!i,r=!!u,k=!!h,b=!!c;return e.jsxRuntimeExports.jsx("label",{...m,className:l.cx(fe,p),children:e.jsxRuntimeExports.jsxs("div",{className:"kakadu-components-3146929190",children:[e.jsxRuntimeExports.jsx(g.Span,{className:l.cx(H.overflowProtectionStyles,he),children:e.jsxRuntimeExports.jsx("span",{children:f})}),e.jsxRuntimeExports.jsxs("span",{className:"kakadu-components-3298764637",children:[v,b?e.jsxRuntimeExports.jsx(be,{className:"kakadu-components-613632806",children:c}):null,E]}),j||r||k?e.jsxRuntimeExports.jsx("div",{className:"kakadu-components-2927674627",children:j?e.jsxRuntimeExports.jsx(g.Paragraph,{id:d,className:Y,children:i instanceof Error?i.message:i}):r?e.jsxRuntimeExports.jsx(g.Paragraph,{id:R,className:Ee,children:u instanceof Error?u.message:u}):k?e.jsxRuntimeExports.jsx(g.Paragraph,{id:s,className:Re,children:h instanceof Error?h.message:h}):null}):null]})})}function ye({label:f,options:i,error:d,warning:u,information:R,footnote:h,className:s,onChange:c,...E}){const p=t.useId(),v=`${p}-error`,m=`${p}-warning`,j=`${p}-information`,r=!!d,k=!r&&!!u,b=!r&&!k&&!!R,N=r?v:k?m:b?j:void 0,{value:y}=E,[S,I]=t.useState(""),q=y??S;t.useEffect(()=>{I(typeof y=="string"?y:"")},[y]);const C=t.useCallback(n=>{const{value:B}=n.target;I(B),c==null||c(B,n)},[c]);return e.jsxRuntimeExports.jsxs(Z,{label:f,error:d,errorId:v,warning:u,warningId:m,information:R,informationId:j,footnote:h,children:[e.jsxRuntimeExports.jsx("select",{...E,value:q,"aria-invalid":r,"data-warning":k,"data-information":b,"aria-describedby":N,className:l.cx(w,"kakadu-components-4228384787",s),onChange:C,children:i.map(n=>e.jsxRuntimeExports.jsx("option",{value:n.value,disabled:n.disabled,children:n.label},n.value))}),e.jsxRuntimeExports.jsx(xe.default,{width:14,height:14,className:"kakadu-components-158931186"})]})}const ve=40,V="kakadu-components-4233741488";function ge({type:f,label:i,error:d,warning:u,information:R,footnote:h,suggestion:s,actions:c=[],hasCopyButton:E,hasClearButton:p,isMultiline:v,onChange:m,className:j,...r}){const k=t.useRef(null),b=t.useRef(null),N=t.useRef(null),y=je.useCreateNotification(),S=t.useId(),I=`${S}-error`,q=`${S}-warning`,C=`${S}-information`,{value:n,disabled:B}=r,[ee,F]=t.useState(""),x=n??ee,[te,se]=t.useState(),ne=f==="textarea"||!!v;t.useLayoutEffect(()=>{typeof x=="string"&&N.current&&se(N.current.scrollHeight)},[x]);const T=t.useMemo(()=>typeof x=="string"?`${x} `.split(`
+`):[],[x]),ae=t.useMemo(()=>T.length,[T]),_=!!d,$=!_&&!!u,M=!!R,O=_?I:$?q:M?C:void 0;t.useEffect(()=>{F(typeof n=="string"?n:"")},[n]);const W=t.useCallback(a=>{const{value:o}=a.target;F(o),m==null||m(o,a)},[m]),oe=t.useCallback(()=>{typeof x=="string"&&(K.default(x),y({type:ke.NoticeType.success,children:"Copied to clipboard."}))},[x,y]),P=t.useCallback(a=>{var D;const o=b.current??k.current??void 0;if(o){const G=(D=Object.getOwnPropertyDescriptor(o instanceof HTMLTextAreaElement?HTMLTextAreaElement.prototype:HTMLInputElement.prototype,"value"))==null?void 0:D.set;if(G){G.call(o,a);const ue=new Event("input",{bubbles:!0});o.dispatchEvent(ue),o.focus();return}}throw new Error("Unable to set value.")},[]),ce=t.useCallback(()=>{P("")},[P]),[re,le]=t.useState(""),U=!!s&&re!==s,ie=t.useCallback(()=>{if(s){try{P(s)}catch{K.default(s)}le(s)}},[s,P]),z=t.useMemo(()=>c.length,[c]);return e.jsxRuntimeExports.jsxs(Z,{label:i,error:d,errorId:I,warning:u,warningId:q,information:R,informationId:C,footnote:h,attachments:e.jsxRuntimeExports.jsx(me.default,{isCollapsed:!U,children:U?e.jsxRuntimeExports.jsxs("button",{type:"button",className:l.cx(H.buttonResetStyles,H.overflowProtectionStyles,"kakadu-components-2355856341"),onClick:ie,children:[e.jsxRuntimeExports.jsx(pe.default,{label:"Apply suggestion"}),e.jsxRuntimeExports.jsx(de.default,{width:13,height:13,className:"kakadu-components-1021263934"}),e.jsxRuntimeExports.jsx(g.Span,{className:"kakadu-components-1585874956",children:s}),e.jsxRuntimeExports.jsx(Q.default,{className:"kakadu-components-3448565402"}),e.jsxRuntimeExports.jsx(X.default,{})]}):null}),style:{"--button-padding":`calc(${ve*((E?1:0)+(p?1:0)+z)}px + 6px)`},children:[e.jsxRuntimeExports.jsxs("div",{className:"kakadu-components-3146929190",children:[ne?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsxs("span",{ref:N,"aria-hidden":!0,className:l.cx(w,j,"kakadu-components-2033521835"),children:[T.map((a,o)=>e.jsxRuntimeExports.jsxs("span",{children:[a,ae>1?e.jsxRuntimeExports.jsx("br",{}):null]},o))," "]}),e.jsxRuntimeExports.jsx("textarea",{...r,ref:b,rows:1,"aria-invalid":_,"data-warning":$,"data-information":M,"aria-describedby":O,value:x,className:l.cx(w,j,"kakadu-components-2119524139"),style:{minHeight:te},onChange:W})]}):e.jsxRuntimeExports.jsx("input",{...r,ref:k,type:f??"text",value:x,"aria-invalid":_,"data-warning":$,"data-information":M,"aria-describedby":O,className:l.cx(w,j),onChange:W}),B?null:e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx(Q.default,{className:"kakadu-components-616311160"}),e.jsxRuntimeExports.jsx(X.default,{className:"kakadu-components-1962999040"})]})]}),E||p||z>0?e.jsxRuntimeExports.jsxs("div",{className:"kakadu-components-131986363",children:[c.map((a,o)=>e.jsxRuntimeExports.jsx(L.default,{iconLeft:a.icon,label:a.label,tooltip:a.label,className:V,onClick:a.onClick},a.label+o)),E?e.jsxRuntimeExports.jsx(L.default,{iconLeft:J.IconType.copy,label:"Copy",tooltip:"Copy",className:V,onClick:oe}):null,p?e.jsxRuntimeExports.jsx(L.default,{iconLeft:J.IconType.times,label:"Clear",tooltip:"Clear",className:V,onClick:ce}):null]}):null]})}exports.Select=ye;exports.default=ge;exports.errorParagraph=Y;

package/build/components/input.mjs

@@ -30,21 +30,21 @@ function se({
   warningId: b,
   information: x,
   informationId: n,
-  footnote: s,
+  footnote: o,
   attachments: j,
   className: u,
   children: g,
   ...p
 }) {
-  const k = !!r, o = !!i, f = !!x, v = !!s;
+  const k = !!r, l = !!i, f = !!x, v = !!o;
   return /* @__PURE__ */ e.jsx("label", { ...p, className: c(Ie, u), children: /* @__PURE__ */ e.jsxs("div", { className: "kakadu-components-3146929190", children: [
     /* @__PURE__ */ e.jsx(U, { className: c(te, Se), children: /* @__PURE__ */ e.jsx("span", { children: h }) }),
     /* @__PURE__ */ e.jsxs("span", { className: "kakadu-components-3298764637", children: [
       g,
-      v ? /* @__PURE__ */ e.jsx(we, { className: "kakadu-components-613632806", children: s }) : null,
+      v ? /* @__PURE__ */ e.jsx(we, { className: "kakadu-components-613632806", children: o }) : null,
       j
     ] }),
-    k || o || f ? /* @__PURE__ */ e.jsx("div", { className: "kakadu-components-2927674627", children: k ? /* @__PURE__ */ e.jsx(W, { id: m, className: Be, children: r instanceof Error ? r.message : r }) : o ? /* @__PURE__ */ e.jsx(W, { id: b, className: Ee, children: i instanceof Error ? i.message : i }) : f ? /* @__PURE__ */ e.jsx(W, { id: n, className: Ce, children: x instanceof Error ? x.message : x }) : null }) : null
+    k || l || f ? /* @__PURE__ */ e.jsx("div", { className: "kakadu-components-2927674627", children: k ? /* @__PURE__ */ e.jsx(W, { id: m, className: Be, children: r instanceof Error ? r.message : r }) : l ? /* @__PURE__ */ e.jsx(W, { id: b, className: Ee, children: i instanceof Error ? i.message : i }) : f ? /* @__PURE__ */ e.jsx(W, { id: n, className: Ce, children: x instanceof Error ? x.message : x }) : null }) : null
   ] }) });
 }
 function Je({
@@ -55,23 +55,23 @@ function Je({
   information: b,
   footnote: x,
   className: n,
-  onChange: s,
+  onChange: o,
   ...j
 }) {
-  const u = ne(), g = `${u}-error`, p = `${u}-warning`, k = `${u}-information`, o = !!m, f = !o && !!i, v = !o && !f && !!b, I = o ? g : f ? p : v ? k : void 0, {
+  const u = ne(), g = `${u}-error`, p = `${u}-warning`, k = `${u}-information`, l = !!m, f = !l && !!i, v = !l && !f && !!b, I = l ? g : f ? p : v ? k : void 0, {
     value: y
   } = j, [S, B] = P(""), E = y ?? S;
   ae(() => {
     B(typeof y == "string" ? y : "");
   }, [y]);
-  const C = N((l) => {
+  const C = N((a) => {
     const {
       value: w
-    } = l.target;
-    B(w), s == null || s(w, l);
-  }, [s]);
+    } = a.target;
+    B(w), o == null || o(w, a);
+  }, [o]);
   return /* @__PURE__ */ e.jsxs(se, { label: h, error: m, errorId: g, warning: i, warningId: p, information: b, informationId: k, footnote: x, children: [
-    /* @__PURE__ */ e.jsx("select", { ...j, value: E, "aria-invalid": o, "data-warning": f, "data-information": v, "aria-describedby": I, className: c($, "kakadu-components-4228384787", n), onChange: C, children: r.map((l) => /* @__PURE__ */ e.jsx("option", { value: l.value, children: l.label }, l.value)) }),
+    /* @__PURE__ */ e.jsx("select", { ...j, value: E, "aria-invalid": l, "data-warning": f, "data-information": v, "aria-describedby": I, className: c($, "kakadu-components-4228384787", n), onChange: C, children: r.map((a) => /* @__PURE__ */ e.jsx("option", { value: a.value, disabled: a.disabled, children: a.label }, a.value)) }),
     /* @__PURE__ */ e.jsx(xe, { width: 14, height: 14, className: "kakadu-components-158931186" })
   ] });
 }
@@ -84,47 +84,47 @@ function Ke({
   information: b,
   footnote: x,
   suggestion: n,
-  actions: s = [],
+  actions: o = [],
   hasCopyButton: j,
   hasClearButton: u,
   isMultiline: g,
   onChange: p,
   className: k,
-  ...o
+  ...l
 }) {
   const f = M(null), v = M(null), I = M(null), y = ge(), S = ne(), B = `${S}-error`, E = `${S}-warning`, C = `${S}-information`, {
-    value: l,
+    value: a,
     disabled: w
-  } = o, [oe, D] = P(""), d = l ?? oe, [le, ce] = P(), re = h === "textarea" || !!g;
+  } = l, [oe, D] = P(""), d = a ?? oe, [le, ce] = P(), re = h === "textarea" || !!g;
   he(() => {
     typeof d == "string" && I.current && ce(I.current.scrollHeight);
   }, [d]);
   const H = A(() => typeof d == "string" ? `${d} `.split(`
 `) : [], [d]), ie = A(() => H.length, [H]), T = !!m, R = !T && !!i, V = !!b, G = T ? B : R ? E : V ? C : void 0;
   ae(() => {
-    D(typeof l == "string" ? l : "");
-  }, [l]);
-  const q = N((a) => {
+    D(typeof a == "string" ? a : "");
+  }, [a]);
+  const q = N((t) => {
     const {
-      value: t
-    } = a.target;
-    D(t), p == null || p(t, a);
+      value: s
+    } = t.target;
+    D(s), p == null || p(s, t);
   }, [p]), de = N(() => {
     typeof d == "string" && (Z(d), y({
       type: Ne.success,
       children: "Copied to clipboard."
     }));
-  }, [d, y]), L = N((a) => {
+  }, [d, y]), L = N((t) => {
     var Q;
-    const t = v.current ?? f.current ?? void 0;
-    if (t) {
-      const X = (Q = Object.getOwnPropertyDescriptor(t instanceof HTMLTextAreaElement ? HTMLTextAreaElement.prototype : HTMLInputElement.prototype, "value")) == null ? void 0 : Q.set;
+    const s = v.current ?? f.current ?? void 0;
+    if (s) {
+      const X = (Q = Object.getOwnPropertyDescriptor(s instanceof HTMLTextAreaElement ? HTMLTextAreaElement.prototype : HTMLInputElement.prototype, "value")) == null ? void 0 : Q.set;
       if (X) {
-        X.call(t, a);
+        X.call(s, t);
         const fe = new Event("input", {
           bubbles: !0
         });
-        t.dispatchEvent(fe), t.focus();
+        s.dispatchEvent(fe), s.focus();
         return;
       }
     }
@@ -140,7 +140,7 @@ function Ke({
       }
       pe(n);
     }
-  }, [n, L]), K = A(() => s.length, [s]);
+  }, [n, L]), K = A(() => o.length, [o]);
   return /* @__PURE__ */ e.jsxs(se, { label: r, error: m, errorId: B, warning: i, warningId: E, information: b, informationId: C, footnote: x, attachments: /* @__PURE__ */ e.jsx(ye, { isCollapsed: !J, children: J ? /* @__PURE__ */ e.jsxs("button", { type: "button", className: c(je, te, "kakadu-components-2355856341"), onClick: ke, children: [
     /* @__PURE__ */ e.jsx(ve, { label: "Apply suggestion" }),
     /* @__PURE__ */ e.jsx(be, { width: 13, height: 13, className: "kakadu-components-1021263934" }),
@@ -153,35 +153,35 @@ function Ke({
     /* @__PURE__ */ e.jsxs("div", { className: "kakadu-components-3146929190", children: [
       re ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
         /* @__PURE__ */ e.jsxs("span", { ref: I, "aria-hidden": !0, className: c($, k, "kakadu-components-2033521835"), children: [
-          H.map((a, t) => (
+          H.map((t, s) => (
             // eslint-disable-next-line react/no-array-index-key
             /* @__PURE__ */ e.jsxs("span", { children: [
-              a,
+              t,
               ie > 1 ? /* @__PURE__ */ e.jsx("br", {}) : null
-            ] }, t)
+            ] }, s)
           )),
           " "
         ] }),
-        /* @__PURE__ */ e.jsx("textarea", { ...o, ref: v, rows: 1, "aria-invalid": T, "data-warning": R, "data-information": V, "aria-describedby": G, value: d, className: c($, k, "kakadu-components-2119524139"), style: {
+        /* @__PURE__ */ e.jsx("textarea", { ...l, ref: v, rows: 1, "aria-invalid": T, "data-warning": R, "data-information": V, "aria-describedby": G, value: d, className: c($, k, "kakadu-components-2119524139"), style: {
           minHeight: le
         }, onChange: q })
-      ] }) : /* @__PURE__ */ e.jsx("input", { ...o, ref: f, type: h ?? "text", value: d, "aria-invalid": T, "data-warning": R, "data-information": V, "aria-describedby": G, className: c($, k), onChange: q }),
+      ] }) : /* @__PURE__ */ e.jsx("input", { ...l, ref: f, type: h ?? "text", value: d, "aria-invalid": T, "data-warning": R, "data-information": V, "aria-describedby": G, className: c($, k), onChange: q }),
       w ? null : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
         /* @__PURE__ */ e.jsx(_, { className: "kakadu-components-616311160" }),
         /* @__PURE__ */ e.jsx(ee, { className: "kakadu-components-1962999040" })
       ] })
     ] }),
     j || u || K > 0 ? /* @__PURE__ */ e.jsxs("div", { className: "kakadu-components-131986363", children: [
-      s.map((a, t) => /* @__PURE__ */ e.jsx(
+      o.map((t, s) => /* @__PURE__ */ e.jsx(
         F,
         {
-          iconLeft: a.icon,
-          label: a.label,
-          tooltip: a.label,
+          iconLeft: t.icon,
+          label: t.label,
+          tooltip: t.label,
           className: O,
-          onClick: a.onClick
+          onClick: t.onClick
         },
-        a.label + t
+        t.label + s
       )),
       j ? /* @__PURE__ */ e.jsx(F, { iconLeft: Y.copy, label: "Copy", tooltip: "Copy", className: O, onClick: de }) : null,
       u ? /* @__PURE__ */ e.jsx(F, { iconLeft: Y.times, label: "Clear", tooltip: "Clear", className: O, onClick: me }) : null

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

@@ -9,6 +9,7 @@ export type PopoverMenuItemProperties = {
     type: 'group';
     readonly label: ReactNode;
 } | {
+    readonly isLoading?: boolean;
     readonly reference?: Ref<PopoverMenuItemElementType>;
     readonly label: ReactNode;
     readonly href?: string;

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

package/build/components/popover-menu.mjs

@@ -1,109 +1,118 @@
-import { j as n } from "../jsx-runtime-B4hRZ52C.mjs";
+import { j as e } from "../jsx-runtime-B4hRZ52C.mjs";
 import { cx as K } from "@kuma-ui/core";
-import { useMemo as x, useState as I, useCallback as v, useEffect as b, useRef as A } from "react";
-import { buttonResetStyles as C } from "../theme.mjs";
+import { useMemo as k, useState as N, useCallback as x, useEffect as M, useRef as C } from "react";
+import { buttonResetStyles as D } from "../theme.mjs";
 import P from "../icons/icon.mjs";
-import D, { PopoverContainer as F, usePopover as H, usePopoverContext as N } from "./popover.mjs";
+import z, { PopoverContainer as H, usePopover as T, usePopoverContext as S } from "./popover.mjs";
 import R from "./atom.mjs";
-import { Span as M } from "./text.mjs";
-import z, { normalBlendStyles as L } from "./hover-gradient.mjs";
-import T from "./click-ripples.mjs";
-import V from "./separator.mjs";
-import B from "./decorators.mjs";
-const g = /* @__PURE__ */ new Set();
-function E() {
-  const [e, t] = I(!1), a = v((o) => {
-    t(o);
-    for (const r of g)
-      r(o);
+import { Span as E } from "./text.mjs";
+import V, { normalBlendStyles as B } from "./hover-gradient.mjs";
+import G from "./click-ripples.mjs";
+import U from "./separator.mjs";
+import q from "./decorators.mjs";
+import b from "./spinner.mjs";
+import { SkeletonInstance as J } from "./skeleton.mjs";
+import O from "./aria-text.mjs";
+const h = /* @__PURE__ */ new Set();
+function F() {
+  const [n, r] = N(!1), s = x((a) => {
+    r(a);
+    for (const t of h)
+      t(a);
   }, []);
-  return b(() => {
-    const o = (r) => {
-      t(r);
+  return M(() => {
+    const a = (t) => {
+      r(t);
     };
-    return g.add(o), () => {
-      g.delete(o);
+    return h.add(a), () => {
+      h.delete(a);
     };
-  }, []), x(() => ({
-    isKeyboardNavigating: e,
-    setIsKeyboardNavigating: a
-  }), [e, a]);
+  }, []), k(() => ({
+    isKeyboardNavigating: n,
+    setIsKeyboardNavigating: s
+  }), [n, s]);
 }
-const se = "kakadu-components-949294122";
-function G({
-  label: e,
-  iconLeft: t,
+const pe = "kakadu-components-949294122";
+function Q({
+  isLoading: n,
+  label: r,
+  iconLeft: s,
   iconRight: a,
-  href: o,
-  shouldCloseOnClick: r = !0,
-  decorators: k = [],
-  submenu: l,
-  className: i,
-  onClick: s,
-  ...f
+  href: t,
+  shouldCloseOnClick: v = !0,
+  decorators: j = [],
+  submenu: o,
+  className: c,
+  onClick: l,
+  ...p
 }) {
   const {
-    isVisible: m,
-    isPreparingFocus: u,
-    isFocused: c,
-    close: p
-  } = N(), {
-    isKeyboardNavigating: d
-  } = E(), j = A(!0), h = v(() => {
-    j.current = c;
-  }, [c]), y = v((S) => {
-    !d && !j.current || c && (s == null || s(S), l ? l.show() : r && (p == null || p()));
-  }, [d, c, s, l, r, p]), w = x(() => /* @__PURE__ */ n.jsxs(R, { as: o ? "a" : "button", ...f, type: o ? void 0 : "button", role: "menuitem", href: o, inert: !m && !u, disabled: o ? void 0 : !m && !u, className: K(C, "kakadu-components-1772835671", c && "kakadu-components-3160069815", d ? "kakadu-components-2254977234" : c && "kakadu-components-278139688", i), onClick: y, onPointerDownCapture: h, children: [
-    /* @__PURE__ */ n.jsxs(M, { className: "kakadu-components-1109353535", children: [
-      t ? /* @__PURE__ */ n.jsx(P, { width: 12, height: 12, type: t }) : null,
-      /* @__PURE__ */ n.jsx("span", { className: "kakadu-components-913703148", children: e }),
-      a ? /* @__PURE__ */ n.jsx(P, { width: 12, height: 12, type: a }) : null
-    ] }),
-    d ? null : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
-      /* @__PURE__ */ n.jsx(T, { isActive: c, size: 100 }),
-      /* @__PURE__ */ n.jsx(z, { isActive: c, size: 150, className: L })
+    isVisible: u,
+    isPreparingFocus: d,
+    isFocused: i,
+    close: m
+  } = S(), {
+    isKeyboardNavigating: f
+  } = F(), w = C(!0), y = x(() => {
+    w.current = i;
+  }, [i]), g = x((A) => {
+    !f && !w.current || i && (l == null || l(A), o ? o.show() : v && (m == null || m()));
+  }, [f, i, l, o, v, m]), I = k(() => /* @__PURE__ */ e.jsxs(R, { as: t && !n ? "a" : "button", ...p, type: t && !n ? void 0 : "button", role: "menuitem", href: t, inert: !u && !d || n, disabled: t ? void 0 : !u && !d || n, className: K(D, "kakadu-components-1772835671", i && "kakadu-components-3160069815", f ? "kakadu-components-2254977234" : i && "kakadu-components-278139688", c), onClick: g, onPointerDownCapture: y, children: [
+    /* @__PURE__ */ e.jsx(E, { className: "kakadu-components-1109353535", children: n ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      /* @__PURE__ */ e.jsx(O, { children: r }),
+      s ? /* @__PURE__ */ e.jsx(b, { size: 12 }) : null,
+      /* @__PURE__ */ e.jsx(J, { height: "1em", width: "100%" }),
+      a ? /* @__PURE__ */ e.jsx(b, { size: 12 }) : null
+    ] }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      s ? /* @__PURE__ */ e.jsx(P, { width: 12, height: 12, type: s }) : null,
+      /* @__PURE__ */ e.jsx("span", { className: "kakadu-components-4055589237", children: r }),
+      a ? /* @__PURE__ */ e.jsx(P, { width: 12, height: 12, type: a }) : null
+    ] }) }),
+    f || n ? null : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+      /* @__PURE__ */ e.jsx(G, { isActive: i, size: 100 }),
+      /* @__PURE__ */ e.jsx(V, { isActive: i, size: 150, className: B })
     ] })
-  ] }), [o, f, m, u, d, i, y, h, t, e, a, c]);
-  return /* @__PURE__ */ n.jsx(B, { decorators: k, children: l ? /* @__PURE__ */ n.jsx(O, { menu: l.popoverMenu, className: "kakadu-components-1861176543", children: w }) : w });
+  ] }), [t, n, p, u, d, f, c, g, y, s, r, a, i]);
+  return /* @__PURE__ */ e.jsx(q, { decorators: j, children: o ? /* @__PURE__ */ e.jsx(Z, { menu: o.popoverMenu, className: "kakadu-components-1861176543", children: I }) : I });
 }
-function U(e) {
-  if ("type" in e) {
-    if (e.type === "separator")
-      return /* @__PURE__ */ n.jsx(V, {});
-    if (e.type === "group")
-      return /* @__PURE__ */ n.jsx(M, { className: "kakadu-components-1499037363", children: e.label });
+function W(n) {
+  if ("type" in n) {
+    if (n.type === "separator")
+      return /* @__PURE__ */ e.jsx(U, {});
+    if (n.type === "group")
+      return /* @__PURE__ */ e.jsx(E, { className: "kakadu-components-1499037363", children: n.label });
   }
-  return /* @__PURE__ */ n.jsx(G, { ...e });
+  return /* @__PURE__ */ e.jsx(Q, { ...n });
 }
-function q({
-  items: e
+function X({
+  items: n
 }) {
   const {
-    isFocused: t
-  } = N(), [a, o] = I([]), {
-    setIsKeyboardNavigating: r
-  } = E(), k = v((i) => {
-    i && o((s) => s.includes(i) ? s : [...s, i]);
-  }, []), l = v((i) => {
-    t && (i.currentTarget.focus(), r(!1));
-  }, [t, r]);
-  return b(() => {
-    if (!t)
+    isFocused: r
+  } = S(), [s, a] = N([]), {
+    setIsKeyboardNavigating: t
+  } = F(), v = x((o) => {
+    o && a((c) => c.includes(o) ? c : [...c, o]);
+  }, []), j = x((o) => {
+    r && (o.currentTarget.focus(), t(!1));
+  }, [r, t]);
+  return M(() => {
+    if (!r)
       return;
-    const i = (s) => {
-      const f = a.filter((d) => d.isConnected), m = f.length;
-      if (m === 0)
+    const o = (c) => {
+      const l = s.filter((m) => m.isConnected), p = l.length;
+      if (p === 0)
         return;
       let u;
-      const c = document.activeElement;
-      let p = c ? f.indexOf(c) : -1;
-      switch (p === -1 && (p = 0), s.key) {
+      const d = document.activeElement;
+      let i = d ? l.indexOf(d) : -1;
+      switch (i === -1 && (i = 0), c.key) {
         case "ArrowDown": {
-          u = (p + 1) % m;
+          u = (i + 1) % p;
           break;
         }
         case "ArrowUp": {
-          u = (p - 1 + m) % m;
+          u = (i - 1 + p) % p;
           break;
         }
         case "Home": {
@@ -111,69 +120,69 @@ function q({
           break;
         }
         case "End": {
-          u = m - 1;
+          u = p - 1;
           break;
         }
         case "Tab": {
-          r(!0);
+          t(!0);
           return;
         }
       }
       if (u !== void 0) {
-        s.preventDefault(), s.stopPropagation();
-        const d = f[u];
-        d && (d.focus(), r(!0));
+        c.preventDefault(), c.stopPropagation();
+        const m = l[u];
+        m && (m.focus(), t(!0));
       }
     };
-    return window.addEventListener("keydown", i, {
+    return window.addEventListener("keydown", o, {
       capture: !0
     }), () => {
-      window.removeEventListener("keydown", i, {
+      window.removeEventListener("keydown", o, {
         capture: !0
       });
     };
-  }, [t, a, r]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((i, s) => /* @__PURE__ */ n.jsx(
-    U,
+  }, [r, s, t]), /* @__PURE__ */ e.jsx(e.Fragment, { children: n.map((o, c) => /* @__PURE__ */ e.jsx(
+    W,
     {
-      ...i,
-      reference: k,
-      onMouseEnter: l
+      ...o,
+      reference: v,
+      onMouseEnter: j
     },
-    s
+    c
   )) });
 }
-function J({
-  items: e,
-  ...t
+function Y({
+  items: n,
+  ...r
 }) {
-  return /* @__PURE__ */ n.jsx(D, { ...t, as: "nav", role: "menu", innerClassName: "kakadu-components-3600436535", children: /* @__PURE__ */ n.jsx(q, { items: e }) });
+  return /* @__PURE__ */ e.jsx(z, { ...r, as: "nav", role: "menu", innerClassName: "kakadu-components-3600436535", children: /* @__PURE__ */ e.jsx(X, { items: n }) });
 }
-function ae(e) {
-  const t = x(() => ({
-    items: e
-  }), [e]), {
-    show: a,
-    close: o,
-    popover: r
-  } = H(J, t);
-  return x(() => ({
-    show: a,
-    close: o,
-    popoverMenu: r
-  }), [a, o, r]);
+function de(n) {
+  const r = k(() => ({
+    items: n
+  }), [n]), {
+    show: s,
+    close: a,
+    popover: t
+  } = T(Y, r);
+  return k(() => ({
+    show: s,
+    close: a,
+    popoverMenu: t
+  }), [s, a, t]);
 }
-function O({
-  menu: e,
-  className: t,
-  children: a
+function Z({
+  menu: n,
+  className: r,
+  children: s
 }) {
-  return /* @__PURE__ */ n.jsxs(F, { className: t, children: [
-    a,
-    e
+  return /* @__PURE__ */ e.jsxs(H, { className: r, children: [
+    s,
+    n
   ] });
 }
 export {
-  se as dangerPopoverMenuItemStyles,
-  O as default,
-  ae as usePopoverMenu
+  pe as dangerPopoverMenuItemStyles,
+  Z as default,
+  de as usePopoverMenu
 };

package/build/components/text.d.ts

@@ -10,6 +10,7 @@ export declare function AnchorHeading<Type extends AtomElementType = 'h1'>({ as,
 export declare const spanStyles: string;
 export declare function Span<Type extends AtomElementType = 'span'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
 export declare function Paragraph<Type extends AtomElementType = 'p'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
+export declare function Footnote<Type extends AtomElementType = 'small'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
 export declare function Label<Type extends AtomElementType = 'span'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
 export type TextProperties<Type extends AtomElementType = 'div'> = Omit<AtomProperties<Type>, 'width'> & {
     readonly width?: WrapperWidth;