@kakadu/components 3.2.6 → 3.4.0

package/build/components/button-tooltip.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../jsx-runtime-BB_1_6y_.js"),u=require("@kuma-ui/core");var a=(t=>(t.top="top",t.bottom="bottom",t))(a||{});function s({id:t,label:r,position:o="top",className:e}){return n.jsxRuntimeExports.jsx("div",{id:t,role:"tooltip",className:u.cx("kakadu-components-982005200",o==="top"&&"kakadu-components-430823771",o==="bottom"&&"kakadu-components-2189175034",e),children:n.jsxRuntimeExports.jsx("span",{className:u.cx("kakadu-components-2032235075",o==="top"&&"kakadu-components-2481216458",o==="bottom"&&"kakadu-components-637471806",e),children:r})})}exports.ButtonTooltipPosition=a;exports.default=s;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../jsx-runtime-BB_1_6y_.js"),u=require("@kuma-ui/core");var a=(t=>(t.top="top",t.bottom="bottom",t))(a||{});function s({id:t,label:r,position:o="top",className:e}){return n.jsxRuntimeExports.jsx("div",{id:t,role:"tooltip",className:u.cx("kakadu-components-982005200",o==="top"&&"kakadu-components-430823771",o==="bottom"&&"kakadu-components-2189175034",e),children:n.jsxRuntimeExports.jsx("span",{className:u.cx("kakadu-components-3316581213",o==="top"&&"kakadu-components-2481216458",o==="bottom"&&"kakadu-components-637471806",e),children:r})})}exports.ButtonTooltipPosition=a;exports.default=s;

package/build/components/button-tooltip.mjs

@@ -7,7 +7,7 @@ function c({
   position: t = "top",
   className: a
 }) {
-  return /* @__PURE__ */ m.jsx("div", { id: o, role: "tooltip", className: n("kakadu-components-982005200", t === "top" && "kakadu-components-430823771", t === "bottom" && "kakadu-components-2189175034", a), children: /* @__PURE__ */ m.jsx("span", { className: n("kakadu-components-2032235075", t === "top" && "kakadu-components-2481216458", t === "bottom" && "kakadu-components-637471806", a), children: e }) });
+  return /* @__PURE__ */ m.jsx("div", { id: o, role: "tooltip", className: n("kakadu-components-982005200", t === "top" && "kakadu-components-430823771", t === "bottom" && "kakadu-components-2189175034", a), children: /* @__PURE__ */ m.jsx("span", { className: n("kakadu-components-3316581213", t === "top" && "kakadu-components-2481216458", t === "bottom" && "kakadu-components-637471806", a), children: e }) });
 }
 export {
   p as ButtonTooltipPosition,

package/build/components/click-ripples.d.ts

@@ -1,2 +1,4 @@
 import { type HTMLProps } from 'react';
-export default function ClickRipples({ size, className, ...properties }: HTMLProps<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+export default function ClickRipples({ isActive, size, className, ...properties }: HTMLProps<HTMLDivElement> & {
+    readonly isActive?: boolean;
+}): import("react/jsx-runtime").JSX.Element;

package/build/components/click-ripples.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../jsx-runtime-BB_1_6y_.js"),n=require("react"),k=require("@kuma-ui/core");function v({id:s,x:r,y:i,onEnd:t}){return n.useEffect(()=>{const o=setTimeout(()=>{t(s)},370);return()=>{clearTimeout(o)}},[t,s]),a.jsxRuntimeExports.jsx("div",{style:{top:i,left:r},className:"kakadu-components-3828473824"})}function w({size:s=150,className:r,...i}){const t=n.useRef(null),[o,f]=n.useState([]);n.useEffect(()=>{const e=u=>{if(t.current){const c=t.current.getBoundingClientRect(),{clientX:l,clientY:d}=u,{left:m,right:j,top:x,bottom:E}=c;l>m&&l<j&&d>x&&d<E&&f(R=>[...R,{id:Date.now()+Math.random()*1e3,x:l-m,y:d-x}])}};return window.addEventListener("pointerdown",e),()=>{window.removeEventListener("pointerdown",e)}},[]);const p=n.useCallback(e=>{f(u=>u.filter(c=>c.id!==e))},[]);return a.jsxRuntimeExports.jsx("div",{...i,ref:t,style:{"--size":`${s}px`},className:k.cx("kakadu-components-4189236582",r),children:o.map(e=>a.jsxRuntimeExports.jsx(v,{id:e.id,x:e.x,y:e.y,onEnd:p},e.id))})}exports.default=w;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../jsx-runtime-BB_1_6y_.js"),r=require("react"),w=require("@kuma-ui/core");function v({id:t,x:o,y:i,onEnd:s}){return r.useEffect(()=>{const n=setTimeout(()=>{s(t)},370);return()=>{clearTimeout(n)}},[s,t]),a.jsxRuntimeExports.jsx("div",{style:{top:i,left:o},className:"kakadu-components-3828473824"})}function y({isActive:t=!0,size:o=150,className:i,...s}){const n=r.useRef(null),[p,f]=r.useState([]);r.useEffect(()=>{if(!t)return;const e=u=>{if(n.current){const c=n.current.getBoundingClientRect(),{clientX:l,clientY:d}=u,{left:m,right:E,top:x,bottom:R}=c;l>m&&l<E&&d>x&&d<R&&f(k=>[...k,{id:Date.now()+Math.random()*1e3,x:l-m,y:d-x}])}};return window.addEventListener("pointerdown",e),()=>{window.removeEventListener("pointerdown",e)}},[t]);const j=r.useCallback(e=>{f(u=>u.filter(c=>c.id!==e))},[]);return a.jsxRuntimeExports.jsx("div",{...s,ref:n,style:{"--size":`${o}px`},className:w.cx("kakadu-components-4189236582",i),children:p.map(e=>a.jsxRuntimeExports.jsx(v,{id:e.id,x:e.x,y:e.y,onEnd:j},e.id))})}exports.default=y;

package/build/components/click-ripples.mjs

@@ -1,60 +1,63 @@
 import { j as a } from "../jsx-runtime-B4hRZ52C.mjs";
-import { useRef as v, useState as y, useEffect as p, useCallback as E } from "react";
-import { cx as R } from "@kuma-ui/core";
-function h({
-  id: n,
-  x: o,
+import { useRef as E, useState as R, useEffect as p, useCallback as h } from "react";
+import { cx as v } from "@kuma-ui/core";
+function C({
+  id: t,
+  x: r,
   y: s,
-  onEnd: t
+  onEnd: o
 }) {
   return p(() => {
-    const i = setTimeout(() => {
-      t(n);
+    const n = setTimeout(() => {
+      o(t);
     }, 370);
     return () => {
-      clearTimeout(i);
+      clearTimeout(n);
     };
-  }, [t, n]), /* @__PURE__ */ a.jsx("div", { style: {
+  }, [o, t]), /* @__PURE__ */ a.jsx("div", { style: {
     top: s,
-    left: o
+    left: r
   }, className: "kakadu-components-3828473824" });
 }
-function L({
-  size: n = 150,
-  className: o,
-  ...s
+function N({
+  isActive: t = !0,
+  size: r = 150,
+  className: s,
+  ...o
 }) {
-  const t = v(null), [i, d] = y([]);
+  const n = E(null), [x, d] = R([]);
   p(() => {
-    const e = (r) => {
-      if (t.current) {
-        const c = t.current.getBoundingClientRect(), {
-          clientX: l,
-          clientY: u
-        } = r, {
+    if (!t)
+      return;
+    const e = (i) => {
+      if (n.current) {
+        const c = n.current.getBoundingClientRect(), {
+          clientX: u,
+          clientY: l
+        } = i, {
           left: m,
-          right: k,
+          right: w,
           top: f,
-          bottom: w
+          bottom: j
         } = c;
-        l > m && l < k && u > f && u < w && d((j) => [...j, {
+        u > m && u < w && l > f && l < j && d((y) => [...y, {
           id: Date.now() + Math.random() * 1e3,
-          x: l - m,
-          y: u - f
+          x: u - m,
+          y: l - f
         }]);
       }
     };
     return window.addEventListener("pointerdown", e), () => {
       window.removeEventListener("pointerdown", e);
     };
+  }, [t]);
+  const k = h((e) => {
+    d((i) => i.filter((c) => c.id !== e));
   }, []);
-  const x = E((e) => {
-    d((r) => r.filter((c) => c.id !== e));
-  }, []);
-  return /* @__PURE__ */ a.jsx("div", { ...s, ref: t, style: {
-    "--size": `${n}px`
-  }, className: R("kakadu-components-4189236582", o), children: i.map((e) => /* @__PURE__ */ a.jsx(h, { id: e.id, x: e.x, y: e.y, onEnd: x }, e.id)) });
+  return /* @__PURE__ */ a.jsx("div", { ...o, ref: n, style: {
+    "--size": `${r}px`
+  }, className: v("kakadu-components-4189236582", s), children: x.map((e) => /* @__PURE__ */ a.jsx(C, { id: e.id, x: e.x, y: e.y, onEnd: k }, e.id)) });
 }
 export {
-  L as default
+  N as default
 };

package/build/components/hover-gradient.d.ts

@@ -1,5 +1,6 @@
 import { type HTMLProps } from 'react';
 export declare const normalBlendStyles: string;
-export default function HoverGradient({ size, className, ...properties }: HTMLProps<HTMLDivElement> & {
+export default function HoverGradient({ isActive, size, className, ...properties }: HTMLProps<HTMLDivElement> & {
+    readonly isActive?: boolean;
     readonly size?: number;
 }): import("react/jsx-runtime").JSX.Element;

package/build/components/hover-gradient.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("../jsx-runtime-BB_1_6y_.js"),t=require("react"),p=require("@kuma-ui/core"),R="kakadu-components-2608453841";function $({size:x=200,className:k,...E}){const i=t.useRef(null),n=t.useRef(null),[g,u]=t.useState(!1),[s,b]=t.useState();return t.useEffect(()=>{const c=i.current;if(!c)return;n.current||(n.current=c.parentElement);const e=n.current;if(!e)return;const l=m=>{const j=m.target;if(!e.contains(j))return;const S=e.getBoundingClientRect(),{clientX:o,clientY:r}=m,{left:d,right:y,top:f,bottom:L}=S;o>d&&o<y&&r>f&&r<L&&(u(!0),b([o-d,r-f]))},a=()=>{u(!1)};return e.addEventListener("mousemove",l),e.addEventListener("mouseleave",a),()=>{e.removeEventListener("mousemove",l),e.removeEventListener("mouseleave",a)}},[]),v.jsxRuntimeExports.jsx("div",{...E,ref:i,className:p.cx("kakadu-components-1237006455",k),children:s?v.jsxRuntimeExports.jsx("div",{style:{"--size":`${x}px`,"--offset-x":`${s[0]}px`,"--offset-y":`${s[1]}px`},className:p.cx("kakadu-components-611160091",g&&"kakadu-components-3627966847")}):null})}exports.default=$;exports.normalBlendStyles=R;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const v=require("../jsx-runtime-BB_1_6y_.js"),t=require("react"),p=require("@kuma-ui/core"),$="kakadu-components-2608453841";function q({isActive:x=!0,size:k=200,className:E,...g}){const i=t.useRef(null),n=t.useRef(null),[b,s]=t.useState(!1),[o,j]=t.useState();return t.useEffect(()=>{if(!x){s(!1);return}const c=i.current;if(!c)return;n.current||(n.current=c.parentElement);const e=n.current;if(!e)return;const l=m=>{const S=m.target;if(!e.contains(S))return;const y=e.getBoundingClientRect(),{clientX:r,clientY:u}=m,{left:f,right:L,top:d,bottom:R}=y;r>f&&r<L&&u>d&&u<R&&(s(!0),j([r-f,u-d]))},a=()=>{s(!1)};return e.addEventListener("mousemove",l),e.addEventListener("mouseleave",a),()=>{e.removeEventListener("mousemove",l),e.removeEventListener("mouseleave",a)}},[]),v.jsxRuntimeExports.jsx("div",{...g,ref:i,className:p.cx("kakadu-components-1237006455",E),children:o?v.jsxRuntimeExports.jsx("div",{style:{"--size":`${k}px`,"--offset-x":`${o[0]}px`,"--offset-y":`${o[1]}px`},className:p.cx("kakadu-components-611160091",b&&"kakadu-components-3627966847")}):null})}exports.default=q;exports.normalBlendStyles=$;

package/build/components/hover-gradient.mjs

@@ -1,48 +1,53 @@
 import { j as d } from "../jsx-runtime-B4hRZ52C.mjs";
-import { useRef as p, useState as v, useEffect as B } from "react";
+import { useRef as p, useState as v, useEffect as N } from "react";
 import { cx as x } from "@kuma-ui/core";
-const V = "kakadu-components-2608453841";
-function z({
-  size: k = 200,
-  className: E,
-  ...g
+const z = "kakadu-components-2608453841";
+function C({
+  isActive: k = !0,
+  size: E = 200,
+  className: g,
+  ...L
 }) {
-  const r = p(null), t = p(null), [L, i] = v(!1), [n, b] = v();
-  return B(() => {
-    const c = r.current;
-    if (!c)
+  const i = p(null), t = p(null), [b, n] = v(!1), [s, j] = v();
+  return N(() => {
+    if (!k) {
+      n(!1);
       return;
-    t.current || (t.current = c.parentElement);
+    }
+    const a = i.current;
+    if (!a)
+      return;
+    t.current || (t.current = a.parentElement);
     const e = t.current;
     if (!e)
       return;
-    const a = (u) => {
-      const j = u.target;
-      if (!e.contains(j))
+    const c = (l) => {
+      const y = l.target;
+      if (!e.contains(y))
         return;
-      const y = e.getBoundingClientRect(), {
-        clientX: s,
-        clientY: o
-      } = u, {
+      const $ = e.getBoundingClientRect(), {
+        clientX: o,
+        clientY: r
+      } = l, {
         left: m,
-        right: $,
+        right: h,
         top: f,
-        bottom: h
-      } = y;
-      s > m && s < $ && o > f && o < h && (i(!0), b([s - m, o - f]));
-    }, l = () => {
-      i(!1);
+        bottom: B
+      } = $;
+      o > m && o < h && r > f && r < B && (n(!0), j([o - m, r - f]));
+    }, u = () => {
+      n(!1);
     };
-    return e.addEventListener("mousemove", a), e.addEventListener("mouseleave", l), () => {
-      e.removeEventListener("mousemove", a), e.removeEventListener("mouseleave", l);
+    return e.addEventListener("mousemove", c), e.addEventListener("mouseleave", u), () => {
+      e.removeEventListener("mousemove", c), e.removeEventListener("mouseleave", u);
     };
-  }, []), /* @__PURE__ */ d.jsx("div", { ...g, ref: r, className: x("kakadu-components-1237006455", E), children: n ? /* @__PURE__ */ d.jsx("div", { style: {
-    "--size": `${k}px`,
-    "--offset-x": `${n[0]}px`,
-    "--offset-y": `${n[1]}px`
-  }, className: x("kakadu-components-611160091", L && "kakadu-components-3627966847") }) : null });
+  }, []), /* @__PURE__ */ d.jsx("div", { ...L, ref: i, className: x("kakadu-components-1237006455", g), children: s ? /* @__PURE__ */ d.jsx("div", { style: {
+    "--size": `${E}px`,
+    "--offset-x": `${s[0]}px`,
+    "--offset-y": `${s[1]}px`
+  }, className: x("kakadu-components-611160091", b && "kakadu-components-3627966847") }) : null });
 }
 export {
-  z as default,
-  V as normalBlendStyles
+  C as default,
+  z as normalBlendStyles
 };

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

package/build/components/popover-menu.mjs

@@ -3,8 +3,8 @@ import { cx as M } from "@kuma-ui/core";
 import { useMemo as v, useState as y, useCallback as x, useEffect as w } from "react";
 import { buttonResetStyles as E } from "../theme.mjs";
 import h from "../icons/icon.mjs";
-import S, { PopoverContainer as K, usePopover as F, usePopoverContext as b } from "./popover.mjs";
-import A from "./atom.mjs";
+import S, { PopoverContainer as K, usePopover as A, usePopoverContext as b } from "./popover.mjs";
+import F from "./atom.mjs";
 import { Span as I } from "./text.mjs";
 import D, { normalBlendStyles as H } from "./hover-gradient.mjs";
 import z from "./click-ripples.mjs";
@@ -14,12 +14,12 @@ const j = /* @__PURE__ */ new Set();
 function N() {
   const [e, t] = y(!1), s = x((o) => {
     t(o);
-    for (const i of j)
-      i(o);
+    for (const c of j)
+      c(o);
   }, []);
   return w(() => {
-    const o = (i) => {
-      t(i);
+    const o = (c) => {
+      t(c);
     };
     return j.add(o), () => {
       j.delete(o);
@@ -34,7 +34,7 @@ function R({
   iconLeft: t,
   iconRight: s,
   href: o,
-  shouldCloseOnClick: i = !0,
+  shouldCloseOnClick: c = !0,
   decorators: k = [],
   submenu: m,
   className: a,
@@ -43,21 +43,21 @@ function R({
 }) {
   const {
     isVisible: u,
-    isFocused: c,
+    isFocused: i,
     close: l
   } = b(), {
     isKeyboardNavigating: d
   } = N(), p = x((P) => {
-    c && (r == null || r(P), m ? m.show() : i && (l == null || l()));
-  }, [c, r, m, i, l]), g = v(() => /* @__PURE__ */ n.jsxs(A, { as: o ? "a" : "button", ...f, type: o ? void 0 : "button", role: "menuitem", href: o, disabled: o ? void 0 : !u, className: M(E, "kakadu-components-3114599304", d ? "kakadu-components-4096376656" : "kakadu-components-2554182777", a), onClick: p, children: [
+    i && (r == null || r(P), m ? m.show() : c && (l == null || l()));
+  }, [i, r, m, c, l]), g = v(() => /* @__PURE__ */ n.jsxs(F, { as: o ? "a" : "button", ...f, type: o ? void 0 : "button", role: "menuitem", href: o, disabled: o ? void 0 : !u, className: M(E, "kakadu-components-4075327442", i && "kakadu-components-3160069815", d ? "kakadu-components-2043829669" : i && "kakadu-components-2862719809", a), onClick: p, children: [
     /* @__PURE__ */ n.jsxs(I, { className: "kakadu-components-1109353535", children: [
       t ? /* @__PURE__ */ n.jsx(h, { width: 12, height: 12, type: t }) : null,
       /* @__PURE__ */ n.jsx("span", { className: "kakadu-components-913703148", children: e }),
       s ? /* @__PURE__ */ n.jsx(h, { width: 12, height: 12, type: s }) : null
     ] }),
     d ? null : /* @__PURE__ */ n.jsxs(n.Fragment, { children: [
-      /* @__PURE__ */ n.jsx(D, { size: 150, className: H }),
-      /* @__PURE__ */ n.jsx(z, { size: 100 })
+      /* @__PURE__ */ n.jsx(z, { isActive: i, size: 100 }),
+      /* @__PURE__ */ n.jsx(D, { isActive: i, size: 150, className: H })
     ] })
   ] }), [o, f, u, d, a, p, t, e, s]);
   return /* @__PURE__ */ n.jsx(L, { decorators: k, children: m ? /* @__PURE__ */ n.jsx(U, { menu: m.popoverMenu, className: "kakadu-components-1861176543", children: g }) : g });
@@ -77,12 +77,12 @@ function B({
   const {
     isFocused: t
   } = b(), [s, o] = y([]), {
-    setIsKeyboardNavigating: i
+    setIsKeyboardNavigating: c
   } = N(), k = x((a) => {
     a && o((r) => r.includes(a) ? r : [...r, a]);
   }, []), m = x((a) => {
-    t && (a.currentTarget.focus(), i(!1));
-  }, [t, i]);
+    t && (a.currentTarget.focus(), c(!1));
+  }, [t, c]);
   return w(() => {
     if (!t)
       return;
@@ -90,35 +90,35 @@ function B({
       const f = s.filter((p) => p.isConnected), u = f.length;
       if (u === 0)
         return;
-      let c;
+      let i;
       const l = document.activeElement;
       let d = l ? f.indexOf(l) : -1;
       switch (d === -1 && (d = 0), r.key) {
         case "ArrowDown": {
-          c = (d + 1) % u;
+          i = (d + 1) % u;
           break;
         }
         case "ArrowUp": {
-          c = (d - 1 + u) % u;
+          i = (d - 1 + u) % u;
           break;
         }
         case "Home": {
-          c = 0;
+          i = 0;
           break;
         }
         case "End": {
-          c = u - 1;
+          i = u - 1;
           break;
         }
         case "Tab": {
-          i(!0);
+          c(!0);
           return;
         }
       }
-      if (c !== void 0) {
+      if (i !== void 0) {
         r.preventDefault(), r.stopPropagation();
-        const p = f[c];
-        p && (p.focus(), i(!0));
+        const p = f[i];
+        p && (p.focus(), c(!0));
       }
     };
     return window.addEventListener("keydown", a, {
@@ -128,7 +128,7 @@ function B({
         capture: !0
       });
     };
-  }, [t, s, i]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((a, r) => /* @__PURE__ */ n.jsx(
+  }, [t, s, c]), /* @__PURE__ */ n.jsx(n.Fragment, { children: e.map((a, r) => /* @__PURE__ */ n.jsx(
     T,
     {
       ...a,
@@ -150,7 +150,7 @@ function ne(e) {
   }), [e]), {
     show: s,
     popover: o
-  } = F(G, t);
+  } = A(G, t);
   return v(() => ({
     show: s,
     popoverMenu: o

package/build/components/text.d.ts

@@ -1,5 +1,6 @@
 import { type ComponentRef, type Ref, type ElementType } from 'react';
 import { type AtomProperties } from './atom';
+import { WrapperWidth } from './wrapper';
 export declare const textShadowStyles: string;
 export declare function Heading<Type extends ElementType = 'h1'>({ reference, as, className, ...properties }: AtomProperties<Type> & {
     readonly reference?: Ref<ComponentRef<Type>>;
@@ -11,5 +12,8 @@ export declare const spanStyles: string;
 export declare function Span<Type extends ElementType = 'span'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
 export declare function Paragraph<Type extends ElementType = 'p'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
 export declare function Label<Type extends ElementType = 'span'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
-export default function Text<Type extends ElementType = 'div'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
-export declare function Hero<Type extends ElementType = 'div'>({ as, className, ...properties }: AtomProperties<Type>): import("react/jsx-runtime").JSX.Element;
+export type TextProperties<Type extends ElementType = 'div'> = Omit<AtomProperties<Type>, 'width'> & {
+    readonly width?: WrapperWidth;
+};
+export default function Text<Type extends ElementType = 'div'>({ as, width, className, ...properties }: TextProperties<Type>): import("react/jsx-runtime").JSX.Element;
+export declare function Hero<Type extends ElementType = 'div'>(properties: TextProperties<Type>): import("react/jsx-runtime").JSX.Element;

package/build/components/text.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("../jsx-runtime-BB_1_6y_.js"),a=require("@kuma-ui/core"),d=require("../theme.js"),o=require("./atom.js"),c="kakadu-components-1538322784",x="kakadu-components-739732526";function i({reference:s,as:e,className:t,...r}){return n.jsxRuntimeExports.jsx(o.default,{reference:s,as:e??"h1",...r,className:a.cx(d.overflowProtectionStyles,c,"kakadu-components-1669332734",x,t)})}function k({as:s,id:e,children:t,className:r,...p}){return n.jsxRuntimeExports.jsx(i,{as:s??"h1",id:e,...p,className:a.cx(r),children:n.jsxRuntimeExports.jsx("a",{href:`#${e}`,className:"kakadu-components-1038708690",children:t})})}const u=a.cx("kakadu-components-1923397960",c,x);function m({as:s,className:e,...t}){return n.jsxRuntimeExports.jsx(o.default,{as:s??"span",...t,className:a.cx(u,e)})}function j({as:s,className:e,...t}){return n.jsxRuntimeExports.jsx(o.default,{as:s??"p",...t,className:a.cx(u,"kakadu-components-621160204",e)})}function f({as:s,className:e,...t}){return n.jsxRuntimeExports.jsx(m,{as:s??"span",...t,className:a.cx("kakadu-components-1329768068",e)})}function l({as:s,className:e,...t}){return n.jsxRuntimeExports.jsx(o.default,{as:s??"div",...t,className:a.cx("kakadu-components-1082504586",e)})}function h({as:s,className:e,...t}){return n.jsxRuntimeExports.jsx(l,{as:s??"div",...t,className:a.cx("kakadu-components-323682454",e)})}exports.AnchorHeading=k;exports.Heading=i;exports.Hero=h;exports.Label=f;exports.Paragraph=j;exports.Span=m;exports.default=l;exports.spanStyles=u;exports.textShadowStyles=c;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("../jsx-runtime-BB_1_6y_.js"),a=require("@kuma-ui/core"),k=require("../theme.js"),c=require("./atom.js"),r=require("./wrapper.js"),u="kakadu-components-1538322784",x="kakadu-components-739732526";function m({reference:t,as:e,className:n,...o}){return s.jsxRuntimeExports.jsx(c.default,{reference:t,as:e??"h1",...o,className:a.cx(k.overflowProtectionStyles,u,"kakadu-components-1669332734",x,n)})}function j({as:t,id:e,children:n,className:o,...l}){return s.jsxRuntimeExports.jsx(m,{as:t??"h1",id:e,...l,className:a.cx(o),children:s.jsxRuntimeExports.jsx("a",{href:`#${e}`,className:"kakadu-components-1038708690",children:n})})}const p=a.cx("kakadu-components-1923397960",u,x);function i({as:t,className:e,...n}){return s.jsxRuntimeExports.jsx(c.default,{as:t??"span",...n,className:a.cx(p,e)})}function f({as:t,className:e,...n}){return s.jsxRuntimeExports.jsx(c.default,{as:t??"p",...n,className:a.cx(p,"kakadu-components-621160204",e)})}function h({as:t,className:e,...n}){return s.jsxRuntimeExports.jsx(i,{as:t??"span",...n,className:a.cx("kakadu-components-1329768068",e)})}function d({as:t,width:e=r.WrapperWidth.text,className:n,...o}){return s.jsxRuntimeExports.jsx(c.default,{as:t??"div",...o,className:a.cx("kakadu-components-1437359321",e===r.WrapperWidth.page&&"kakadu-components-2433581593",e===r.WrapperWidth.text&&"kakadu-components-958855245",e===r.WrapperWidth.content&&"kakadu-components-797764377",n)})}function S(t){const{className:e}=t;return s.jsxRuntimeExports.jsx(d,{...t,className:a.cx("kakadu-components-323682454",e)})}exports.AnchorHeading=j;exports.Heading=m;exports.Hero=S;exports.Label=h;exports.Paragraph=f;exports.Span=i;exports.default=d;exports.spanStyles=p;exports.textShadowStyles=u;

package/build/components/text.mjs

@@ -1,69 +1,70 @@
 import { j as t } from "../jsx-runtime-B4hRZ52C.mjs";
 import { cx as o } from "@kuma-ui/core";
 import { overflowProtectionStyles as i } from "../theme.mjs";
-import e from "./atom.mjs";
-const c = "kakadu-components-1538322784", m = "kakadu-components-739732526";
-function k({
-  reference: s,
+import r from "./atom.mjs";
+import { WrapperWidth as c } from "./wrapper.mjs";
+const m = "kakadu-components-1538322784", u = "kakadu-components-739732526";
+function l({
+  reference: n,
   as: a,
-  className: n,
-  ...r
+  className: s,
+  ...e
 }) {
-  return /* @__PURE__ */ t.jsx(e, { reference: s, as: a ?? "h1", ...r, className: o(i, c, "kakadu-components-1669332734", m, n) });
+  return /* @__PURE__ */ t.jsx(r, { reference: n, as: a ?? "h1", ...e, className: o(i, m, "kakadu-components-1669332734", u, s) });
 }
-function N({
-  as: s,
+function g({
+  as: n,
   id: a,
-  children: n,
-  className: r,
-  ...p
+  children: s,
+  className: e,
+  ...k
 }) {
-  return /* @__PURE__ */ t.jsx(k, { as: s ?? "h1", id: a, ...p, className: o(r), children: /* @__PURE__ */ t.jsx("a", { href: `#${a}`, className: "kakadu-components-1038708690", children: n }) });
+  return /* @__PURE__ */ t.jsx(l, { as: n ?? "h1", id: a, ...k, className: o(e), children: /* @__PURE__ */ t.jsx("a", { href: `#${a}`, className: "kakadu-components-1038708690", children: s }) });
 }
-const u = o("kakadu-components-1923397960", c, m);
-function l({
-  as: s,
+const p = o("kakadu-components-1923397960", m, u);
+function x({
+  as: n,
   className: a,
-  ...n
+  ...s
 }) {
-  return /* @__PURE__ */ t.jsx(e, { as: s ?? "span", ...n, className: o(u, a) });
+  return /* @__PURE__ */ t.jsx(r, { as: n ?? "span", ...s, className: o(p, a) });
 }
-function S({
-  as: s,
+function y({
+  as: n,
   className: a,
-  ...n
+  ...s
 }) {
-  return /* @__PURE__ */ t.jsx(e, { as: s ?? "p", ...n, className: o(u, "kakadu-components-621160204", a) });
+  return /* @__PURE__ */ t.jsx(r, { as: n ?? "p", ...s, className: o(p, "kakadu-components-621160204", a) });
 }
-function y({
-  as: s,
+function H({
+  as: n,
   className: a,
-  ...n
+  ...s
 }) {
-  return /* @__PURE__ */ t.jsx(l, { as: s ?? "span", ...n, className: o("kakadu-components-1329768068", a) });
+  return /* @__PURE__ */ t.jsx(x, { as: n ?? "span", ...s, className: o("kakadu-components-1329768068", a) });
 }
 function d({
-  as: s,
-  className: a,
-  ...n
+  as: n,
+  width: a = c.text,
+  className: s,
+  ...e
 }) {
-  return /* @__PURE__ */ t.jsx(e, { as: s ?? "div", ...n, className: o("kakadu-components-1082504586", a) });
+  return /* @__PURE__ */ t.jsx(r, { as: n ?? "div", ...e, className: o("kakadu-components-1437359321", a === c.page && "kakadu-components-2433581593", a === c.text && "kakadu-components-958855245", a === c.content && "kakadu-components-797764377", s) });
 }
-function g({
-  as: s,
-  className: a,
-  ...n
-}) {
-  return /* @__PURE__ */ t.jsx(d, { as: s ?? "div", ...n, className: o("kakadu-components-323682454", a) });
+function W(n) {
+  const {
+    className: a
+  } = n;
+  return /* @__PURE__ */ t.jsx(d, { ...n, className: o("kakadu-components-323682454", a) });
 }
 export {
-  N as AnchorHeading,
-  k as Heading,
-  g as Hero,
-  y as Label,
-  S as Paragraph,
-  l as Span,
+  g as AnchorHeading,
+  l as Heading,
+  W as Hero,
+  H as Label,
+  y as Paragraph,
+  x as Span,
   d as default,
-  u as spanStyles,
-  c as textShadowStyles
+  p as spanStyles,
+  m as textShadowStyles
 };