wimui 0.50.3 → 0.51.0

package/dist/components/form/DatePicker/DatePicker.js

@@ -40,7 +40,7 @@ var g = c(({ intent: c = "default", variant: g = "outline", fullWidth: _ = !1, c
 	return l(() => {
 		if (I) {
 			let e = setTimeout(() => {
-				let e = B.current?.querySelector("[data-calendar-day][data-selected]:not(:disabled), [data-calendar-day]:focus");
+				let e = B.current?.querySelector("[data-calendar-day][tabindex=\"0\"]:not(:disabled), [data-calendar-day][data-selected]:not(:disabled), [data-calendar-day]:focus");
 				e ? e.focus() : B.current?.querySelector("[data-calendar-day]:not([data-other-month]):not(:disabled)")?.focus();
 			}, 50);
 			return () => clearTimeout(e);
@@ -69,7 +69,8 @@ var g = c(({ intent: c = "default", variant: g = "outline", fullWidth: _ = !1, c
 				rightIcons: [{
 					name: "ChevronDownIcon",
 					rotated: I,
-					onClick: $
+					onClick: $,
+					decorative: !0
 				}],
 				children: /* @__PURE__ */ m("input", {
 					id: G,

package/dist/components/form/Input/Input.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../i18n/useWimTranslation.cjs"),ee=require("../../../hooks/useMergedRef.cjs"),te=require("../InputBase/InputBase.cjs"),ne=require("../FieldTemplate/FieldTemplate.cjs"),r=require("./input.module.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("classnames");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=(0,i.forwardRef)(({intent:e=`default`,variant:s=`outline`,fullWidth:c=!1,className:re,disabled:ie,leftIcon:ae,rightIcon:l,leftIconColor:oe,rightIconColor:se,onLeftIconClick:u,onRightIconClick:d,allowClear:f=!1,showPasswordToggle:p=!0,rightIconClassName:m,rightIconRotated:ce,width:h,value:g,defaultValue:le,onChange:_,type:v,label:y,error:b,required:x,layout:S,id:C,inputClassName:w,showPasswordAriaLabel:T,hidePasswordAriaLabel:E,rightIconAriaLabel:D,suffix:O,styles:k,asChild:A=!1,children:j,...M},N)=>{let{t:P}=n.useWimTranslation(`common`),F=T??P(`a11y.show_password`),I=E??P(`a11y.hide_password`),L=D??P(`a11y.right_icon_action`),[R,z]=(0,i.useState)(le??``),[B,V]=(0,i.useState)(!1),H=(0,i.useRef)(null),U=ee.useMergedRef(N,H),W=g!==void 0,G=W?g:R,K=ie,ue=e=>{W||z(e.target.value),_?.(e)},de=()=>{let e=H.current;if(!e)return;let t=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,`value`)?.set;t?(t.call(e,``),e.dispatchEvent(new Event(`input`,{bubbles:!0}))):(W||z(``),_&&(e.value=``,_({target:e,currentTarget:e}))),W||z(``)},q=()=>{V(e=>!e)},fe=v===`password`&&p,J=[];fe&&J.push({name:B?`EyeOffIcon`:`EyeIcon`,onClick:e=>q(),ariaLabel:B?I:F}),l&&(J.some(e=>e.name===l)||J.push({name:l,onClick:d,color:se,ariaLabel:L,className:m,rotated:ce}));let pe=v===`password`&&B?`text`:v,Y=b?`danger`:e,me=(0,i.useId)(),X=C||`wim-input-${me}`,Z=b?`${X}-error`:void 0,Q=O!=null&&O!==``?`${X}-suffix`:void 0,he=[Z,Q].filter(Boolean).join(` `)||void 0,$=y?`${X}-label`:void 0;return(0,o.jsx)(ne.FieldTemplate,{label:y,error:b,required:x,layout:S,labelId:$,htmlFor:X,errorId:Z,className:re,children:(0,o.jsx)(te.InputBase,{intent:Y,variant:s,fullWidth:c,width:h,disabled:K,leftIcon:ae,leftIconColor:oe,onLeftIconClick:u,rightIcons:J,suffix:O,suffixId:Q,allowClear:f,hasValue:!!G,onClear:de,styles:k,children:(0,o.jsx)(A?t.Root:`input`,{id:X,ref:U,className:(0,a.default)(`wim-input`,r.default.root,r.default[Y],K&&r.default.disabled,r.default[s],w),disabled:K,value:G,onChange:ue,type:pe,"aria-invalid":Y===`danger`,"aria-describedby":he,"aria-labelledby":y?$:void 0,"aria-required":x,...M,children:A?(0,o.jsx)(t.Slottable,{children:j}):null})})})});s.displayName=`Input`,exports.Input=s,exports.default=s;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),ee=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../hooks/useMergedRef.cjs"),te=require("../InputBase/InputBase.cjs"),ne=require("../FieldTemplate/FieldTemplate.cjs"),r=require("./input.module.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("classnames");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=(0,i.forwardRef)(({intent:e=`default`,variant:s=`outline`,fullWidth:re=!1,className:c,disabled:l,leftIcon:u,rightIcon:d,leftIconColor:f,rightIconColor:ie,onLeftIconClick:p,onRightIconClick:m,allowClear:ae=!1,showPasswordToggle:oe=!0,rightIconClassName:se,rightIconRotated:ce,width:le,value:h,defaultValue:ue,onChange:g,type:_,label:v,error:y,required:b,layout:x,id:S,inputClassName:C,showPasswordAriaLabel:w,hidePasswordAriaLabel:T,rightIconAriaLabel:E,rightIconDecorative:D=!1,suffix:O,styles:k,asChild:A=!1,children:j,...M},N)=>{let{t:P}=ee.useWimTranslation(`common`),F=w??P(`a11y.show_password`),I=T??P(`a11y.hide_password`),L=E??P(`a11y.right_icon_action`),[R,z]=(0,i.useState)(ue??``),[B,V]=(0,i.useState)(!1),H=(0,i.useRef)(null),U=n.useMergedRef(N,H),W=h!==void 0,G=W?h:R,K=l,de=e=>{W||z(e.target.value),g?.(e)},fe=()=>{let e=H.current;if(!e)return;let t=Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype,`value`)?.set;t?(t.call(e,``),e.dispatchEvent(new Event(`input`,{bubbles:!0}))):(W||z(``),g&&(e.value=``,g({target:e,currentTarget:e}))),W||z(``)},pe=()=>{V(e=>!e)},me=_===`password`&&oe,q=[];me&&q.push({name:B?`EyeOffIcon`:`EyeIcon`,onClick:e=>pe(),ariaLabel:B?I:F}),d&&(q.some(e=>e.name===d)||q.push({name:d,onClick:m,color:ie,ariaLabel:L,decorative:D,className:se,rotated:ce}));let J=_===`password`&&B?`text`:_,Y=y?`danger`:e,he=(0,i.useId)(),X=S||`wim-input-${he}`,Z=y?`${X}-error`:void 0,Q=O!=null&&O!==``?`${X}-suffix`:void 0,ge=[Z,Q].filter(Boolean).join(` `)||void 0,$=v?`${X}-label`:void 0;return(0,o.jsx)(ne.FieldTemplate,{label:v,error:y,required:b,layout:x,labelId:$,htmlFor:X,errorId:Z,className:c,children:(0,o.jsx)(te.InputBase,{intent:Y,variant:s,fullWidth:re,width:le,disabled:K,leftIcon:u,leftIconColor:f,onLeftIconClick:p,rightIcons:q,suffix:O,suffixId:Q,allowClear:ae,hasValue:!!G,onClear:fe,styles:k,children:(0,o.jsx)(A?t.Root:`input`,{id:X,ref:U,className:(0,a.default)(`wim-input`,r.default.root,r.default[Y],K&&r.default.disabled,r.default[s],C),disabled:K,value:G,onChange:de,type:J,"aria-invalid":Y===`danger`,"aria-describedby":ge,"aria-labelledby":v?$:void 0,"aria-required":b,...M,children:A?(0,o.jsx)(t.Slottable,{children:j}):null})})})});s.displayName=`Input`,exports.Input=s,exports.default=s;

package/dist/components/form/Input/Input.d.ts

@@ -47,6 +47,13 @@ export interface InputProps extends Omit<React.ComponentPropsWithoutRef<"input">
     hidePasswordAriaLabel?: string;
     /** Aria label for the right icon button */
     rightIconAriaLabel?: string;
+    /**
+     * Treats the clickable right icon as a pointer-only affordance: it stays
+     * clickable but leaves the tab order and is hidden from assistive technology.
+     * Use it when the field already does the same thing from the keyboard.
+     * @default false
+     */
+    rightIconDecorative?: boolean;
     /**
      * Static text shown after the field, inside the same shell — a unit such as
      * `kg`, `%` or `円`. It is announced with the field via `aria-describedby`,

package/dist/components/form/Input/Input.js

@@ -1,42 +1,43 @@
 "use client";
 import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
-import { useWimTranslation as n } from "../../../i18n/useWimTranslation.js";
-import { useMergedRef as r } from "../../../hooks/useMergedRef.js";
-import { InputBase as i } from "../InputBase/InputBase.js";
-import { FieldTemplate as a } from "../FieldTemplate/FieldTemplate.js";
-import o from "./input.module.js";
-import { forwardRef as s, useId as ee, useRef as c, useState as l } from "react";
-import u from "classnames";
-import { jsx as d } from "react/jsx-runtime";
+import { useWimTranslation as ee } from "../../../i18n/useWimTranslation.js";
+import { useMergedRef as te } from "../../../hooks/useMergedRef.js";
+import { InputBase as n } from "../InputBase/InputBase.js";
+import { FieldTemplate as r } from "../FieldTemplate/FieldTemplate.js";
+import i from "./input.module.js";
+import { forwardRef as a, useId as o, useRef as s, useState as c } from "react";
+import l from "classnames";
+import { jsx as u } from "react/jsx-runtime";
 //#region src/components/form/Input/Input.tsx
-var f = s(({ intent: s = "default", variant: f = "outline", fullWidth: p = !1, className: m, disabled: h, leftIcon: g, rightIcon: _, leftIconColor: te, rightIconColor: ne, onLeftIconClick: re, onRightIconClick: ie, allowClear: ae = !1, showPasswordToggle: oe = !0, rightIconClassName: se, rightIconRotated: ce, width: le, value: v, defaultValue: ue, onChange: y, type: b, label: x, error: S, required: C, layout: w, id: T, inputClassName: E, showPasswordAriaLabel: D, hidePasswordAriaLabel: O, rightIconAriaLabel: k, suffix: A, styles: j, asChild: M = !1, children: N, ...P }, F) => {
-	let { t: I } = n("common"), L = D ?? I("a11y.show_password"), R = O ?? I("a11y.hide_password"), de = k ?? I("a11y.right_icon_action"), [z, B] = l(ue ?? ""), [V, H] = l(!1), U = c(null), fe = r(F, U), W = v !== void 0, G = W ? v : z, K = h, pe = (e) => {
-		W || B(e.target.value), y?.(e);
-	}, me = () => {
+var d = a(({ intent: a = "default", variant: d = "outline", fullWidth: f = !1, className: ne, disabled: re, leftIcon: ie, rightIcon: p, leftIconColor: ae, rightIconColor: oe, onLeftIconClick: m, onRightIconClick: se, allowClear: h = !1, showPasswordToggle: g = !0, rightIconClassName: _, rightIconRotated: ce, width: le, value: v, defaultValue: ue, onChange: y, type: b, label: x, error: S, required: C, layout: w, id: T, inputClassName: E, showPasswordAriaLabel: D, hidePasswordAriaLabel: O, rightIconAriaLabel: k, rightIconDecorative: A = !1, suffix: j, styles: M, asChild: N = !1, children: P, ...F }, I) => {
+	let { t: L } = ee("common"), R = D ?? L("a11y.show_password"), de = O ?? L("a11y.hide_password"), z = k ?? L("a11y.right_icon_action"), [B, V] = c(ue ?? ""), [H, fe] = c(!1), U = s(null), pe = te(I, U), W = v !== void 0, G = W ? v : B, K = re, me = (e) => {
+		W || V(e.target.value), y?.(e);
+	}, q = () => {
 		let e = U.current;
 		if (!e) return;
 		let t = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value")?.set;
-		t ? (t.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 }))) : (W || B(""), y && (e.value = "", y({
+		t ? (t.call(e, ""), e.dispatchEvent(new Event("input", { bubbles: !0 }))) : (W || V(""), y && (e.value = "", y({
 			target: e,
 			currentTarget: e
-		}))), W || B("");
+		}))), W || V("");
 	}, he = () => {
-		H((e) => !e);
-	}, ge = b === "password" && oe, q = [];
-	ge && q.push({
-		name: V ? "EyeOffIcon" : "EyeIcon",
+		fe((e) => !e);
+	}, ge = b === "password" && g, J = [];
+	ge && J.push({
+		name: H ? "EyeOffIcon" : "EyeIcon",
 		onClick: (e) => he(),
-		ariaLabel: V ? R : L
-	}), _ && (q.some((e) => e.name === _) || q.push({
-		name: _,
-		onClick: ie,
-		color: ne,
-		ariaLabel: de,
-		className: se,
+		ariaLabel: H ? de : R
+	}), p && (J.some((e) => e.name === p) || J.push({
+		name: p,
+		onClick: se,
+		color: oe,
+		ariaLabel: z,
+		decorative: A,
+		className: _,
 		rotated: ce
 	}));
-	let _e = b === "password" && V ? "text" : b, J = S ? "danger" : s, Y = ee(), X = T || `wim-input-${Y}`, Z = S ? `${X}-error` : void 0, Q = A != null && A !== "" ? `${X}-suffix` : void 0, ve = [Z, Q].filter(Boolean).join(" ") || void 0, $ = x ? `${X}-label` : void 0;
-	return /* @__PURE__ */ d(a, {
+	let _e = b === "password" && H ? "text" : b, Y = S ? "danger" : a, ve = o(), X = T || `wim-input-${ve}`, Z = S ? `${X}-error` : void 0, Q = j != null && j !== "" ? `${X}-suffix` : void 0, ye = [Z, Q].filter(Boolean).join(" ") || void 0, $ = x ? `${X}-label` : void 0;
+	return /* @__PURE__ */ u(r, {
 		label: x,
 		error: S,
 		required: C,
@@ -44,41 +45,41 @@ var f = s(({ intent: s = "default", variant: f = "outline", fullWidth: p = !1, c
 		labelId: $,
 		htmlFor: X,
 		errorId: Z,
-		className: m,
-		children: /* @__PURE__ */ d(i, {
-			intent: J,
-			variant: f,
-			fullWidth: p,
+		className: ne,
+		children: /* @__PURE__ */ u(n, {
+			intent: Y,
+			variant: d,
+			fullWidth: f,
 			width: le,
 			disabled: K,
-			leftIcon: g,
-			leftIconColor: te,
-			onLeftIconClick: re,
-			rightIcons: q,
-			suffix: A,
+			leftIcon: ie,
+			leftIconColor: ae,
+			onLeftIconClick: m,
+			rightIcons: J,
+			suffix: j,
 			suffixId: Q,
-			allowClear: ae,
+			allowClear: h,
 			hasValue: !!G,
-			onClear: me,
-			styles: j,
-			children: /* @__PURE__ */ d(M ? e : "input", {
+			onClear: q,
+			styles: M,
+			children: /* @__PURE__ */ u(N ? e : "input", {
 				id: X,
-				ref: fe,
-				className: u("wim-input", o.root, o[J], K && o.disabled, o[f], E),
+				ref: pe,
+				className: l("wim-input", i.root, i[Y], K && i.disabled, i[d], E),
 				disabled: K,
 				value: G,
-				onChange: pe,
+				onChange: me,
 				type: _e,
-				"aria-invalid": J === "danger",
-				"aria-describedby": ve,
+				"aria-invalid": Y === "danger",
+				"aria-describedby": ye,
 				"aria-labelledby": x ? $ : void 0,
 				"aria-required": C,
-				...P,
-				children: M ? /* @__PURE__ */ d(t, { children: N }) : null
+				...F,
+				children: N ? /* @__PURE__ */ u(t, { children: P }) : null
 			})
 		})
 	});
 });
-f.displayName = "Input";
+d.displayName = "Input";
 //#endregion
-export { f as Input, f as default };
+export { d as Input, d as default };

package/dist/components/form/InputBase/InputBase.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../media/Icon/Icon.cjs"),r=require("./input-base.module.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("classnames");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=({children:e,intent:s=`default`,variant:c=`outline`,fullWidth:l=!1,width:u,className:d,disabled:f,leftIcon:p,leftIconColor:m,onLeftIconClick:h,leftIconAriaLabel:g,rightIcons:_=[],suffix:v,suffixId:y,allowClear:b,hasValue:x,onClear:S,clearAriaLabel:C,styles:w})=>{let{t:T}=t.useWimTranslation(`common`),E=g??T(`a11y.left_icon_action`),D=C??T(`a11y.clear_input`),O=typeof u==`string`&&[`xs`,`sm`,`md`,`lg`,`xl`].includes(u),k=i.default.Children.map(e,e=>i.default.isValidElement(e)?i.default.cloneElement(e,{disabled:f?!0:e.props.disabled,className:(0,a.default)(e.props.className,r.default.inner,w?.inner)}):e),A=u!==void 0&&!O&&!l,j=O&&!l?u:void 0,M=e=>f?`disabled`:e||(s===`danger`?`danger`:s===`warning`?`warning`:s===`success`?`success`:`secondary`),N=[..._];b&&x&&!f&&N.push({name:`CloseIcon`,onClick:e=>{e.stopPropagation(),S?.()},ariaLabel:D});let P=j?r.default[`width${j.charAt(0).toUpperCase()}${j.slice(1)}`]:void 0;return(0,o.jsxs)(`div`,{className:(0,a.default)(`wim-input-base`,r.default.root,s&&r.default[s],f&&r.default.disabled,r.default[c],l&&r.default.fullWidth,A&&r.default.hasCustomWidth,P,p&&r.default.hasLeftIcon,(N.length>0||b)&&r.default.hasRightIcon,(N.length>=2||_.length>=1&&b)&&r.default.hasMultipleRightIcons,d,w?.root),style:A?{"--wim-input-width":typeof u==`number`?`${u}px`:u}:void 0,children:[p&&(0,o.jsx)(`div`,{className:(0,a.default)(r.default.icon,r.default.left,h&&r.default.clickable,w?.icon),children:h?(0,o.jsx)(`button`,{type:`button`,onClick:h,className:(0,a.default)(r.default.iconButton,w?.iconButton),"aria-label":E,children:(0,o.jsx)(n.Icon,{name:p,size:`md`,color:M(m)})}):(0,o.jsx)(n.Icon,{name:p,size:`md`,color:M(m)})}),k,v!=null&&v!==``&&(0,o.jsx)(`span`,{id:y,className:(0,a.default)(r.default.suffix,N.length>0&&r.default.suffixClearsIcons),"data-testid":`input-suffix`,children:v}),N.length>0&&(0,o.jsx)(`div`,{className:(0,a.default)(r.default.icons,r.default.right,w?.icons),children:N.map((e,t)=>(0,o.jsx)(`div`,{className:(0,a.default)(r.default.iconItem,e.onClick&&r.default.clickable,e.rotated&&r.default.rotated,e.className,w?.iconItem),children:e.onClick?(0,o.jsx)(`button`,{type:`button`,onClick:e.onClick,className:(0,a.default)(r.default.iconButton,w?.iconButton),"aria-label":e.ariaLabel??T(`a11y.right_icon_action`),children:(0,o.jsx)(n.Icon,{name:e.name,size:`md`,color:M(e.color)})}):(0,o.jsx)(n.Icon,{name:e.name,size:`md`,color:M(e.color)})},`${e.name}-${t}`))})]})};exports.InputBase=s;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../media/Icon/Icon.cjs"),r=require("./input-base.module.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("classnames");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=({children:e,intent:s=`default`,variant:c=`outline`,fullWidth:l=!1,width:u,className:d,disabled:f,leftIcon:p,leftIconColor:m,onLeftIconClick:h,leftIconAriaLabel:g,rightIcons:_=[],suffix:v,suffixId:y,allowClear:b,hasValue:x,onClear:S,clearAriaLabel:C,styles:w})=>{let{t:T}=t.useWimTranslation(`common`),E=g??T(`a11y.left_icon_action`),D=C??T(`a11y.clear_input`),O=typeof u==`string`&&[`xs`,`sm`,`md`,`lg`,`xl`].includes(u),k=i.default.Children.map(e,e=>i.default.isValidElement(e)?i.default.cloneElement(e,{disabled:f?!0:e.props.disabled,className:(0,a.default)(e.props.className,r.default.inner,w?.inner)}):e),A=u!==void 0&&!O&&!l,j=O&&!l?u:void 0,M=e=>f?`disabled`:e||(s===`danger`?`danger`:s===`warning`?`warning`:s===`success`?`success`:`secondary`),N=[..._];b&&x&&!f&&N.push({name:`CloseIcon`,onClick:e=>{e.stopPropagation(),S?.()},ariaLabel:D});let P=j?r.default[`width${j.charAt(0).toUpperCase()}${j.slice(1)}`]:void 0;return(0,o.jsxs)(`div`,{className:(0,a.default)(`wim-input-base`,r.default.root,s&&r.default[s],f&&r.default.disabled,r.default[c],l&&r.default.fullWidth,A&&r.default.hasCustomWidth,P,p&&r.default.hasLeftIcon,(N.length>0||b)&&r.default.hasRightIcon,(N.length>=2||_.length>=1&&b)&&r.default.hasMultipleRightIcons,d,w?.root),style:A?{"--wim-input-width":typeof u==`number`?`${u}px`:u}:void 0,children:[p&&(0,o.jsx)(`div`,{className:(0,a.default)(r.default.icon,r.default.left,h&&r.default.clickable,w?.icon),children:h?(0,o.jsx)(`button`,{type:`button`,onClick:h,className:(0,a.default)(r.default.iconButton,w?.iconButton),"aria-label":E,disabled:f,children:(0,o.jsx)(n.Icon,{name:p,size:`md`,color:M(m)})}):(0,o.jsx)(n.Icon,{name:p,size:`md`,color:M(m)})}),k,v!=null&&v!==``&&(0,o.jsx)(`span`,{id:y,className:(0,a.default)(r.default.suffix,N.length>0&&r.default.suffixClearsIcons),"data-testid":`input-suffix`,children:v}),N.length>0&&(0,o.jsx)(`div`,{className:(0,a.default)(r.default.icons,r.default.right,w?.icons),children:N.map((e,t)=>(0,o.jsx)(`div`,{className:(0,a.default)(r.default.iconItem,e.onClick&&r.default.clickable,e.rotated&&r.default.rotated,e.className,w?.iconItem),children:e.onClick?(0,o.jsx)(`button`,{type:`button`,onClick:e.onClick,className:(0,a.default)(r.default.iconButton,w?.iconButton),disabled:f,tabIndex:e.decorative?-1:void 0,"aria-hidden":e.decorative||void 0,"aria-label":e.decorative?void 0:e.ariaLabel??T(`a11y.right_icon_action`),children:(0,o.jsx)(n.Icon,{name:e.name,size:`md`,color:M(e.color)})}):(0,o.jsx)(n.Icon,{name:e.name,size:`md`,color:M(e.color)})},`${e.name}-${t}`))})]})};exports.InputBase=s;

package/dist/components/form/InputBase/InputBase.d.ts

@@ -9,6 +9,13 @@ export type InputBaseIcon = {
     className?: string;
     /** Whether the icon should be rotated 180deg */
     rotated?: boolean;
+    /**
+     * Marks a clickable icon as a pointer-only affordance that repeats what the
+     * control already does from the keyboard (the chevron of a combobox, the
+     * clock of a time field). It stays clickable but is taken out of the tab
+     * order and hidden from assistive technology, so it needs no name.
+     */
+    decorative?: boolean;
 };
 export type InputBaseProps = {
     /** Inner form control element(s) wrapped by the shell */

package/dist/components/form/InputBase/InputBase.js

@@ -36,6 +36,7 @@ var s = ({ children: s, intent: c = "default", variant: l = "outline", fullWidth
 					onClick: g,
 					className: i(n.iconButton, T?.iconButton),
 					"aria-label": D,
+					disabled: p,
 					children: /* @__PURE__ */ a(t, {
 						name: m,
 						size: "md",
@@ -62,7 +63,10 @@ var s = ({ children: s, intent: c = "default", variant: l = "outline", fullWidth
 						type: "button",
 						onClick: e.onClick,
 						className: i(n.iconButton, T?.iconButton),
-						"aria-label": e.ariaLabel ?? E("a11y.right_icon_action"),
+						disabled: p,
+						tabIndex: e.decorative ? -1 : void 0,
+						"aria-hidden": e.decorative || void 0,
+						"aria-label": e.decorative ? void 0 : e.ariaLabel ?? E("a11y.right_icon_action"),
 						children: /* @__PURE__ */ a(t, {
 							name: e.name,
 							size: "md",

package/dist/components/form/InputBase/input-base.module.cjs

@@ -1,2 +1,2 @@
 "use client";
-var e=`_root_10lt5_36`,t=`_ghost_10lt5_81`,n=`_disabled_10lt5_85`,r=`_icon_10lt5_94`,i=`_iconItem_10lt5_94`,a=`_danger_10lt5_7`,o=`_warning_10lt5_110`,s=`_success_10lt5_113`,c=`_hasLeftIcon_10lt5_146`,l=`_hasRightIcon_10lt5_149`,u=`_hasMultipleRightIcons_10lt5_152`,d=`_widthXs_10lt5_155`,f=`_widthSm_10lt5_158`,p=`_widthMd_10lt5_161`,m=`_widthLg_10lt5_164`,h=`_widthXl_10lt5_167`,g=`_hasCustomWidth_10lt5_170`,_=`_fullWidth_10lt5_175`,v=`_clickable_10lt5_197`,y=`_left_10lt5_200`,b=`_suffix_10lt5_203`,x=`_suffixClearsIcons_10lt5_211`,S=`_icons_10lt5_214`,C=`_right_10lt5_229`,w=`_rotated_10lt5_241`,T=`_iconButton_10lt5_244`,E=`_inner_10lt5_266`,D={root:e,ghost:t,disabled:n,icon:r,iconItem:i,danger:a,warning:o,success:s,hasLeftIcon:c,hasRightIcon:l,hasMultipleRightIcons:u,widthXs:d,widthSm:f,widthMd:p,widthLg:m,widthXl:h,hasCustomWidth:g,fullWidth:_,clickable:v,left:y,suffix:b,suffixClearsIcons:x,icons:S,right:C,rotated:w,iconButton:T,inner:E};exports.clickable=v,exports.danger=a,exports.default=D,exports.disabled=n,exports.fullWidth=_,exports.ghost=t,exports.hasCustomWidth=g,exports.hasLeftIcon=c,exports.hasMultipleRightIcons=u,exports.hasRightIcon=l,exports.icon=r,exports.iconButton=T,exports.iconItem=i,exports.icons=S,exports.inner=E,exports.left=y,exports.right=C,exports.root=e,exports.rotated=w,exports.success=s,exports.suffix=b,exports.suffixClearsIcons=x,exports.warning=o,exports.widthLg=m,exports.widthMd=p,exports.widthSm=f,exports.widthXl=h,exports.widthXs=d;
+var e=`_root_43cv5_36`,t=`_ghost_43cv5_81`,n=`_disabled_43cv5_85`,r=`_icon_43cv5_94`,i=`_iconItem_43cv5_94`,a=`_danger_43cv5_7`,o=`_warning_43cv5_110`,s=`_success_43cv5_113`,c=`_hasLeftIcon_43cv5_146`,l=`_hasRightIcon_43cv5_149`,u=`_hasMultipleRightIcons_43cv5_152`,d=`_widthXs_43cv5_155`,f=`_widthSm_43cv5_158`,p=`_widthMd_43cv5_161`,m=`_widthLg_43cv5_164`,h=`_widthXl_43cv5_167`,g=`_hasCustomWidth_43cv5_170`,_=`_fullWidth_43cv5_175`,v=`_clickable_43cv5_197`,y=`_left_43cv5_200`,b=`_suffix_43cv5_203`,x=`_suffixClearsIcons_43cv5_211`,S=`_icons_43cv5_214`,C=`_right_43cv5_229`,w=`_rotated_43cv5_241`,T=`_iconButton_43cv5_244`,E=`_inner_43cv5_270`,D={root:e,ghost:t,disabled:n,icon:r,iconItem:i,danger:a,warning:o,success:s,hasLeftIcon:c,hasRightIcon:l,hasMultipleRightIcons:u,widthXs:d,widthSm:f,widthMd:p,widthLg:m,widthXl:h,hasCustomWidth:g,fullWidth:_,clickable:v,left:y,suffix:b,suffixClearsIcons:x,icons:S,right:C,rotated:w,iconButton:T,inner:E};exports.clickable=v,exports.danger=a,exports.default=D,exports.disabled=n,exports.fullWidth=_,exports.ghost=t,exports.hasCustomWidth=g,exports.hasLeftIcon=c,exports.hasMultipleRightIcons=u,exports.hasRightIcon=l,exports.icon=r,exports.iconButton=T,exports.iconItem=i,exports.icons=S,exports.inner=E,exports.left=y,exports.right=C,exports.root=e,exports.rotated=w,exports.success=s,exports.suffix=b,exports.suffixClearsIcons=x,exports.warning=o,exports.widthLg=m,exports.widthMd=p,exports.widthSm=f,exports.widthXl=h,exports.widthXs=d;

package/dist/components/form/InputBase/input-base.module.js

@@ -1,6 +1,6 @@
 "use client";
 //#region src/components/form/InputBase/input-base.module.scss
-var e = "_root_10lt5_36", t = "_ghost_10lt5_81", n = "_disabled_10lt5_85", r = "_icon_10lt5_94", i = "_iconItem_10lt5_94", a = "_danger_10lt5_7", o = "_warning_10lt5_110", s = "_success_10lt5_113", c = "_hasLeftIcon_10lt5_146", l = "_hasRightIcon_10lt5_149", u = "_hasMultipleRightIcons_10lt5_152", d = "_widthXs_10lt5_155", f = "_widthSm_10lt5_158", p = "_widthMd_10lt5_161", m = "_widthLg_10lt5_164", h = "_widthXl_10lt5_167", g = "_hasCustomWidth_10lt5_170", _ = "_fullWidth_10lt5_175", v = "_clickable_10lt5_197", y = "_left_10lt5_200", b = "_suffix_10lt5_203", x = "_suffixClearsIcons_10lt5_211", S = "_icons_10lt5_214", C = "_right_10lt5_229", w = "_rotated_10lt5_241", T = "_iconButton_10lt5_244", E = "_inner_10lt5_266", D = {
+var e = "_root_43cv5_36", t = "_ghost_43cv5_81", n = "_disabled_43cv5_85", r = "_icon_43cv5_94", i = "_iconItem_43cv5_94", a = "_danger_43cv5_7", o = "_warning_43cv5_110", s = "_success_43cv5_113", c = "_hasLeftIcon_43cv5_146", l = "_hasRightIcon_43cv5_149", u = "_hasMultipleRightIcons_43cv5_152", d = "_widthXs_43cv5_155", f = "_widthSm_43cv5_158", p = "_widthMd_43cv5_161", m = "_widthLg_43cv5_164", h = "_widthXl_43cv5_167", g = "_hasCustomWidth_43cv5_170", _ = "_fullWidth_43cv5_175", v = "_clickable_43cv5_197", y = "_left_43cv5_200", b = "_suffix_43cv5_203", x = "_suffixClearsIcons_43cv5_211", S = "_icons_43cv5_214", C = "_right_43cv5_229", w = "_rotated_43cv5_241", T = "_iconButton_43cv5_244", E = "_inner_43cv5_270", D = {
 	root: e,
 	ghost: t,
 	disabled: n,

package/dist/components/form/TimePicker/TimePicker.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../hooks/useMergedRef.cjs"),n=require("../Input/input.module.cjs"),r=require("../Input/Input.cjs"),i=require("./time-picker.module.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("classnames");o=e.__toESM(o,1);let s=require("react/jsx-runtime");var c=(0,a.forwardRef)(({intent:e=`default`,variant:c=`outline`,fullWidth:l=!1,className:u,disabled:d,allowClear:f=!0,value:p,defaultValue:m,onChange:h,...g},_)=>{let v=p!==void 0,[y,b]=(0,a.useState)(m??``),x=v?p:y,S=(0,a.useRef)(null),C=t.useMergedRef(_,S),w=f&&!!x&&!d,T=w?void 0:`ClockIcon`;return(0,s.jsx)(r.Input,{ref:C,type:`time`,allowClear:w,intent:e,variant:c,fullWidth:l,className:(0,o.default)(`wim-time-picker`,u),inputClassName:(0,o.default)(n.default.root,i.default.input),disabled:d,value:p,defaultValue:m,onChange:e=>{v||b(e.target.value),h?.(e)},rightIcon:T,rightIconColor:d||w?void 0:`primary`,onRightIconClick:w?void 0:()=>{S.current?.showPicker?.()},...g})});c.displayName=`TimePicker`,exports.TimePicker=c;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../hooks/useMergedRef.cjs"),n=require("../Input/input.module.cjs"),r=require("../Input/Input.cjs"),i=require("./time-picker.module.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("classnames");o=e.__toESM(o,1);let s=require("react/jsx-runtime");var c=(0,a.forwardRef)(({intent:e=`default`,variant:c=`outline`,fullWidth:l=!1,className:u,disabled:d,allowClear:f=!0,value:p,defaultValue:m,onChange:h,...g},_)=>{let v=p!==void 0,[y,b]=(0,a.useState)(m??``),x=v?p:y,S=(0,a.useRef)(null),C=t.useMergedRef(_,S),w=f&&!!x&&!d,T=w?void 0:`ClockIcon`;return(0,s.jsx)(r.Input,{ref:C,type:`time`,allowClear:w,intent:e,variant:c,fullWidth:l,className:(0,o.default)(`wim-time-picker`,u),inputClassName:(0,o.default)(n.default.root,i.default.input),disabled:d,value:p,defaultValue:m,onChange:e=>{v||b(e.target.value),h?.(e)},rightIcon:T,rightIconColor:d||w?void 0:`primary`,onRightIconClick:w?void 0:()=>{S.current?.showPicker?.()},rightIconDecorative:!0,...g})});c.displayName=`TimePicker`,exports.TimePicker=c;

package/dist/components/form/TimePicker/TimePicker.js

@@ -29,6 +29,7 @@ var l = i(({ intent: i = "default", variant: l = "outline", fullWidth: u = !1, c
 		onRightIconClick: T ? void 0 : () => {
 			C.current?.showPicker?.();
 		},
+		rightIconDecorative: !0,
 		..._
 	});
 });

package/dist/components/form/TreeSelect/TreeSelect.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../layout/Transition/Transition.cjs"),ee=require("../../overlay/FocusTrap/FocusTrap.cjs"),r=require("../../../hooks/useMergedRef.cjs"),i=require("../InputBase/InputBase.cjs"),a=require("../FieldTemplate/FieldTemplate.cjs"),te=require("../../data-display/TreeView/TreeView.cjs"),o=require("./tree-select.module.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("classnames");c=e.__toESM(c,1);let l=require("react/jsx-runtime");function u(e){return e.map(e=>({value:e.value,label:e.label,disabled:e.disabled,icon:e.icon,children:e.children?u(e.children):void 0}))}var d=(0,s.forwardRef)(({treeData:e=[],value:d,onChange:f,placeholder:p,label:m,error:h,required:g,layout:_,className:v,disabled:y=!1,multiple:b=!1,searchable:x=!1,defaultExpandedKeys:S=[],allowClear:C=!1,checkStrategy:w=`cascade`,id:T,width:E,fullWidth:D=!1,asChild:O=!1,children:ne,...re},ie)=>{let ae=(0,s.useId)(),k=T||`wim-tree-select-${ae}`,A=m?`${k}-label`:void 0,j=h?`${k}-error`:void 0,M=`${k}-trigger`,N=`${k}-dropdown`,[P,F]=(0,s.useState)(!1),[I,L]=(0,s.useState)(b?[]:``),R=(0,s.useRef)(null),z=(0,s.useRef)(null),B=d!==void 0,V=B?d:I;(0,s.useEffect)(()=>{let e=e=>{R.current&&!R.current.contains(e.target)&&F(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]),(0,s.useEffect)(()=>{if(P){let e=setTimeout(()=>{let e=R.current?.querySelector(`[data-testid="tree-view-search-input"]`);e?e.focus():(R.current?.querySelector(`[data-testid="tree-view-root"]`))?.focus()},100);return()=>clearTimeout(e)}},[P]);let H=()=>{if(!y){let e=!P;F(e),e||z.current?.focus()}},U=e=>{if(!y){if(!P){(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&(e.preventDefault(),F(!0));return}e.key===`Escape`&&(e.preventDefault(),F(!1),z.current?.focus())}},W=(0,s.useMemo)(()=>{let t={},n=e=>{e.forEach(e=>{t[e.value]=e,e.children&&n(e.children)})};return n(e),t},[e]),G=()=>{if(b){let e=Array.isArray(V)?V:[];return e.length===0?null:e.map(e=>W[e]?W[e].label:e).reduce((e,t)=>[e,`, `,t])}{let e=V;return e?W[e]?W[e].label:e:null}},K=e=>{let t;b?t=e:(t=e[0]||``,F(!1),z.current?.focus()),B||L(t),f&&f(t)},q=()=>{if(y)return;let e=b?[]:``;B||L(e),f&&f(e)},oe=(0,s.useMemo)(()=>u(e),[e]),J=(0,s.useMemo)(()=>b?Array.isArray(V)?V:[]:V?[V]:[],[V,b]),Y=G(),{"aria-label":X,"aria-labelledby":Z,"aria-describedby":se,...ce}=re,Q=typeof p==`string`?p:`Select`,le=O?t.Root:`div`,$=r.useMergedRef(R,ie);return(0,l.jsx)(a.FieldTemplate,{label:m,error:h,required:g,layout:_,labelId:A,errorId:j,className:(0,c.default)(o.default.container,v),children:(0,l.jsxs)(le,{className:(0,c.default)(`wim-tree-select`,o.default.root,D&&o.default.fullWidth),ref:$,...ce,children:[(0,l.jsx)(t.Slottable,{children:ne}),(0,l.jsx)(i.InputBase,{disabled:y,allowClear:C,hasValue:!!Y,onClear:q,intent:h?`danger`:`default`,width:E,fullWidth:D,rightIcons:[{name:`ChevronDownIcon`,rotated:P,onClick:H}],className:(0,c.default)(P&&o.default.open),children:(0,l.jsx)(`div`,{id:M,className:(0,c.default)(o.default.trigger,y&&o.default.disabled),onClick:H,onKeyDown:U,tabIndex:y?-1:0,role:`combobox`,"aria-expanded":P,"aria-haspopup":`tree`,"aria-controls":P?N:void 0,"aria-disabled":y,"aria-labelledby":A||Z,"aria-label":m?void 0:X||Q,"aria-describedby":j||se,"aria-required":g,"aria-invalid":!!h,ref:z,children:(0,l.jsx)(`div`,{className:(0,c.default)(o.default.value,!Y&&o.default.placeholder),children:Y||p})})}),(0,l.jsx)(n.Transition,{show:P&&!y,preset:`fade`,className:o.default.dropdown,children:(0,l.jsx)(`div`,{id:N,children:(0,l.jsx)(ee.FocusTrap,{active:P,initialFocus:!1,children:(0,l.jsx)(`div`,{role:`dialog`,"aria-modal":`true`,"aria-labelledby":A||Z,"aria-label":m?void 0:X||Q,children:(0,l.jsx)(te.TreeView,{multiSelect:b,defaultSelectedValues:J,defaultCheckedValues:b?J:[],nodes:oe,onCheckedChange:K,onSelectedChange:K,checkable:b,checkStrategy:w,searchable:x,defaultExpandedValues:S,styles:{root:o.default.treeView,item:o.default.treeViewItem,search:o.default.treeViewSearch}})})})})})]})})});d.displayName=`TreeSelect`,exports.TreeSelect=d;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../layout/Transition/Transition.cjs"),ee=require("../../overlay/FocusTrap/FocusTrap.cjs"),r=require("../../../hooks/useMergedRef.cjs"),i=require("../InputBase/InputBase.cjs"),a=require("../FieldTemplate/FieldTemplate.cjs"),te=require("../../data-display/TreeView/TreeView.cjs"),o=require("./tree-select.module.cjs");let s=require("react");s=e.__toESM(s,1);let c=require("classnames");c=e.__toESM(c,1);let l=require("react/jsx-runtime");function u(e){return e.map(e=>({value:e.value,label:e.label,disabled:e.disabled,icon:e.icon,children:e.children?u(e.children):void 0}))}var d=(0,s.forwardRef)(({treeData:e=[],value:d,onChange:f,placeholder:p,label:m,error:h,required:g,layout:_,className:v,disabled:y=!1,multiple:b=!1,searchable:x=!1,defaultExpandedKeys:S=[],allowClear:C=!1,checkStrategy:w=`cascade`,id:T,width:E,fullWidth:D=!1,asChild:O=!1,children:ne,...re},ie)=>{let ae=(0,s.useId)(),k=T||`wim-tree-select-${ae}`,A=m?`${k}-label`:void 0,j=h?`${k}-error`:void 0,M=`${k}-trigger`,N=`${k}-dropdown`,[P,F]=(0,s.useState)(!1),[I,L]=(0,s.useState)(b?[]:``),R=(0,s.useRef)(null),z=(0,s.useRef)(null),B=d!==void 0,V=B?d:I;(0,s.useEffect)(()=>{let e=e=>{R.current&&!R.current.contains(e.target)&&F(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[]),(0,s.useEffect)(()=>{if(P){let e=setTimeout(()=>{let e=R.current?.querySelector(`[data-testid="tree-view-search-input"]`);e?e.focus():(R.current?.querySelector(`[data-testid="tree-view-root"]`))?.focus()},100);return()=>clearTimeout(e)}},[P]);let H=()=>{if(!y){let e=!P;F(e),e||z.current?.focus()}},U=e=>{if(!y){if(!P){(e.key===`Enter`||e.key===` `||e.key===`ArrowDown`)&&(e.preventDefault(),F(!0));return}e.key===`Escape`&&(e.preventDefault(),F(!1),z.current?.focus())}},W=(0,s.useMemo)(()=>{let t={},n=e=>{e.forEach(e=>{t[e.value]=e,e.children&&n(e.children)})};return n(e),t},[e]),G=()=>{if(b){let e=Array.isArray(V)?V:[];return e.length===0?null:e.map(e=>W[e]?W[e].label:e).reduce((e,t)=>[e,`, `,t])}{let e=V;return e?W[e]?W[e].label:e:null}},K=e=>{let t;b?t=e:(t=e[0]||``,F(!1),z.current?.focus()),B||L(t),f&&f(t)},q=()=>{if(y)return;let e=b?[]:``;B||L(e),f&&f(e)},oe=(0,s.useMemo)(()=>u(e),[e]),J=(0,s.useMemo)(()=>b?Array.isArray(V)?V:[]:V?[V]:[],[V,b]),Y=G(),{"aria-label":X,"aria-labelledby":Z,"aria-describedby":se,...ce}=re,Q=typeof p==`string`?p:`Select`,le=O?t.Root:`div`,$=r.useMergedRef(R,ie);return(0,l.jsx)(a.FieldTemplate,{label:m,error:h,required:g,layout:_,labelId:A,errorId:j,className:(0,c.default)(o.default.container,v),children:(0,l.jsxs)(le,{className:(0,c.default)(`wim-tree-select`,o.default.root,D&&o.default.fullWidth),ref:$,...ce,children:[(0,l.jsx)(t.Slottable,{children:ne}),(0,l.jsx)(i.InputBase,{disabled:y,allowClear:C,hasValue:!!Y,onClear:q,intent:h?`danger`:`default`,width:E,fullWidth:D,rightIcons:[{name:`ChevronDownIcon`,rotated:P,onClick:H,decorative:!0}],className:(0,c.default)(P&&o.default.open),children:(0,l.jsx)(`div`,{id:M,className:(0,c.default)(o.default.trigger,y&&o.default.disabled),onClick:H,onKeyDown:U,tabIndex:y?-1:0,role:`combobox`,"aria-expanded":P,"aria-haspopup":`tree`,"aria-controls":P?N:void 0,"aria-disabled":y,"aria-labelledby":A||Z,"aria-label":m?void 0:X||Q,"aria-describedby":j||se,"aria-required":g,"aria-invalid":!!h,ref:z,children:(0,l.jsx)(`div`,{className:(0,c.default)(o.default.value,!Y&&o.default.placeholder),children:Y||p})})}),(0,l.jsx)(n.Transition,{show:P&&!y,preset:`fade`,className:o.default.dropdown,children:(0,l.jsx)(`div`,{id:N,children:(0,l.jsx)(ee.FocusTrap,{active:P,initialFocus:!1,children:(0,l.jsx)(`div`,{role:`dialog`,"aria-modal":`true`,"aria-labelledby":A||Z,"aria-label":m?void 0:X||Q,onKeyDown:e=>{e.key===`Escape`&&(e.preventDefault(),e.stopPropagation(),F(!1),z.current?.focus())},children:(0,l.jsx)(te.TreeView,{multiSelect:b,defaultSelectedValues:J,defaultCheckedValues:b?J:[],nodes:oe,onCheckedChange:K,onSelectedChange:K,checkable:b,checkStrategy:w,searchable:x,defaultExpandedValues:S,styles:{root:o.default.treeView,item:o.default.treeViewItem,search:o.default.treeViewSearch}})})})})})]})})});d.displayName=`TreeSelect`,exports.TreeSelect=d;

package/dist/components/form/TreeSelect/TreeSelect.js

@@ -102,7 +102,8 @@ var _ = s(({ treeData: s = [], value: _, onChange: v, placeholder: y, label: b,
 					rightIcons: [{
 						name: "ChevronDownIcon",
 						rotated: R,
-						onClick: K
+						onClick: K,
+						decorative: !0
 					}],
 					className: p(R && o.open),
 					children: /* @__PURE__ */ m("div", {
@@ -142,6 +143,9 @@ var _ = s(({ treeData: s = [], value: _, onChange: v, placeholder: y, label: b,
 								"aria-modal": "true",
 								"aria-labelledby": P || Q,
 								"aria-label": b ? void 0 : Z || $,
+								onKeyDown: (e) => {
+									e.key === "Escape" && (e.preventDefault(), e.stopPropagation(), z(!1), U.current?.focus());
+								},
 								children: /* @__PURE__ */ m(te, {
 									multiSelect: E,
 									defaultSelectedValues: Y,

package/dist/components/navigation/Menubar/Menubar.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../layout/Transition/Transition.cjs"),r=require("../../_internal/BaseListItem/BaseListItem.cjs"),i=require("./menubar.module.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("classnames");o=e.__toESM(o,1);let s=require("react/jsx-runtime");var c=(0,a.createContext)(null),l=(0,a.createContext)(null),u=()=>{let e=(0,a.useContext)(c);if(!e)throw Error(`Menubar compound parts must be used within <Menubar>`);return e},d=()=>{let e=(0,a.useContext)(l);if(!e)throw Error(`Menubar.Trigger/Content/Item must be used within <Menubar.Menu>`);return e},f=a.default.forwardRef(({asChild:e=!1,className:n,children:r,onKeyDown:l,...u},d)=>{let[f,p]=(0,a.useState)(null),m=(0,a.useRef)(new Map),h=(0,a.useRef)(null),g=(0,a.useCallback)(e=>{h.current=e,typeof d==`function`?d(e):d&&(d.current=e)},[d]),_=(0,a.useCallback)((e,t)=>{t?m.current.set(e,t):m.current.delete(e)},[]),v=(0,a.useCallback)(()=>Array.from(m.current.keys()),[]),y=(0,a.useCallback)(e=>{m.current.get(e)?.focus()},[]);(0,a.useEffect)(()=>{if(!f)return;let e=e=>{h.current&&!h.current.contains(e.target)&&p(null)},t=e=>{e.key===`Escape`&&(p(null),f&&y(f))};return document.addEventListener(`mousedown`,e),document.addEventListener(`keydown`,t),()=>{document.removeEventListener(`mousedown`,e),document.removeEventListener(`keydown`,t)}},[f,y]);let b=e=>{if(l?.(e),e.defaultPrevented)return;let t=v();if(t.length===0)return;let n=f??t.find(e=>m.current.get(e)===document.activeElement)??null;if(!n)return;let r=t.indexOf(n);if(!(r<0)){if(e.key===`ArrowRight`){e.preventDefault();let n=t[(r+1)%t.length];f&&p(n),y(n)}else if(e.key===`ArrowLeft`){e.preventDefault();let n=t[(r-1+t.length)%t.length];f&&p(n),y(n)}else if(e.key===`Home`){e.preventDefault();let n=t[0];f&&p(n),y(n)}else if(e.key===`End`){e.preventDefault();let n=t[t.length-1];f&&p(n),y(n)}}},x=(0,a.useMemo)(()=>({openMenuId:f,setOpenMenuId:p,registerTrigger:_,getTriggerIds:v,focusTrigger:y}),[f,_,v,y]),S=e?t.Root:`div`;return(0,s.jsx)(c.Provider,{value:x,children:(0,s.jsx)(S,{ref:g,role:`menubar`,className:(0,o.default)(`wim-menubar`,i.default.root,n),onKeyDown:b,...u,children:(0,s.jsx)(t.Slottable,{children:r})})})});f.displayName=`Menubar`;var p=a.default.forwardRef(({value:e,disabled:t=!1,className:n,children:r,...c},d)=>{let{openMenuId:f,setOpenMenuId:p}=u(),m=(0,a.useId)(),h=`wim-menubar-trigger-${e}-${m}`,g=`wim-menubar-content-${e}-${m}`,_=f===e,v=()=>{t||p(e)},y=()=>p(null),b=()=>{t||p(_?null:e)},x=(0,a.useMemo)(()=>({menuId:e,triggerId:h,contentId:g,isOpen:_,open:v,close:y,toggle:b}),[e,h,g,_,t]);return(0,s.jsx)(l.Provider,{value:x,children:(0,s.jsx)(`div`,{ref:d,role:`none`,"data-disabled":t||void 0,className:(0,o.default)(i.default.menu,n),...c,children:r})})});p.displayName=`Menubar.Menu`;var m=a.default.forwardRef(({asChild:e=!1,className:n,children:r,onKeyDown:c,onMouseEnter:l,...f},p)=>{let{openMenuId:m,registerTrigger:h}=u(),{triggerId:g,contentId:_,isOpen:v,open:y,toggle:b,menuId:x}=d(),S=!!f.disabled,C=(0,a.useCallback)(e=>{h(x,e),typeof p==`function`?p(e):p&&(p.current=e)},[h,x,p]),w=e=>{c?.(e),!(e.defaultPrevented||S)&&(e.key===`ArrowDown`||e.key===`Enter`||e.key===` `)&&(e.preventDefault(),y())},T=e=>{l?.(e),m&&!S&&y()};return(0,s.jsx)(e?t.Root:`button`,{...f,ref:C,type:e?void 0:`button`,id:g,role:`menuitem`,"aria-haspopup":`menu`,"aria-expanded":v,"aria-controls":v?_:void 0,disabled:S,className:(0,o.default)(i.default.trigger,v&&i.default.triggerOpen,n),onClick:b,onKeyDown:w,onMouseEnter:T,children:(0,s.jsx)(t.Slottable,{children:r})})});m.displayName=`Menubar.Trigger`;var h=a.default.forwardRef(({align:e=`start`,className:t,children:r,...c},l)=>{let{contentId:u,triggerId:f,isOpen:p}=d(),[m,h]=(0,a.useState)(-1),[g,_]=(0,a.useState)(p),v=(0,a.useRef)(null);p!==g&&(_(p),h(p?0:-1));let y=(0,a.useCallback)(e=>{v.current=e,typeof l==`function`?l(e):l&&(l.current=e)},[l]);(0,a.useEffect)(()=>{!p||m<0||Array.from(v.current?.querySelectorAll(`[role="menuitem"]:not([aria-disabled="true"])`)??[])[m]?.focus()},[m,p]);let b=e=>{let t=Array.from(v.current?.querySelectorAll(`[role="menuitem"]:not([aria-disabled="true"])`)??[]);if(t.length!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),h(e=>e<t.length-1?e+1:0);break;case`ArrowUp`:e.preventDefault(),h(e=>e>0?e-1:t.length-1);break;case`Home`:e.preventDefault(),h(0);break;case`End`:e.preventDefault(),h(t.length-1)}};return(0,s.jsx)(n.Transition,{...c,ref:y,show:p,preset:`fade`,id:u,role:`menu`,"aria-labelledby":f,className:(0,o.default)(i.default.content,e===`end`?i.default.alignEnd:i.default.alignStart,t),onKeyDown:b,children:r})});h.displayName=`Menubar.Content`;var g=a.default.forwardRef(({children:e,onSelect:t,onClick:n,disabled:a=!1,className:c,...l},u)=>{let{close:f}=d(),p=e=>{a||(e.stopPropagation(),t?.(),n?.(e),f())};return(0,s.jsx)(r.BaseListItem,{...l,ref:u,className:(0,o.default)(i.default.item,c),disabled:a,role:`menuitem`,tabIndex:-1,onClick:p,onKeyDown:e=>{!a&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),p(e))},children:e})});g.displayName=`Menubar.Item`;var _=a.default.forwardRef(({className:e,...t},n)=>(0,s.jsx)(`div`,{ref:n,role:`separator`,className:(0,o.default)(i.default.separator,e),...t}));_.displayName=`Menubar.Separator`;var v=f;v.Menu=p,v.Trigger=m,v.Content=h,v.Item=g,v.Separator=_,exports.Menubar=v,exports.default=v;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../layout/Transition/Transition.cjs"),r=require("../../_internal/BaseListItem/BaseListItem.cjs"),i=require("./menubar.module.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("classnames");o=e.__toESM(o,1);let s=require("react/jsx-runtime");var c=(0,a.createContext)(null),l=(0,a.createContext)(null),u=()=>{let e=(0,a.useContext)(c);if(!e)throw Error(`Menubar compound parts must be used within <Menubar>`);return e},d=()=>{let e=(0,a.useContext)(l);if(!e)throw Error(`Menubar.Trigger/Content/Item must be used within <Menubar.Menu>`);return e},f=a.default.forwardRef(({asChild:e=!1,className:n,children:r,onKeyDown:l,...u},d)=>{let[f,p]=(0,a.useState)(null),m=(0,a.useRef)(new Map),h=(0,a.useRef)(null),g=(0,a.useCallback)(e=>{h.current=e,typeof d==`function`?d(e):d&&(d.current=e)},[d]),_=(0,a.useCallback)((e,t)=>{t?m.current.set(e,t):m.current.delete(e)},[]),v=(0,a.useCallback)(()=>Array.from(m.current.keys()),[]),y=(0,a.useCallback)(e=>{m.current.get(e)?.focus()},[]);(0,a.useEffect)(()=>{if(!f)return;let e=e=>{h.current&&!h.current.contains(e.target)&&p(null)},t=e=>{e.key===`Escape`&&(p(null),f&&y(f))};return document.addEventListener(`mousedown`,e),document.addEventListener(`keydown`,t),()=>{document.removeEventListener(`mousedown`,e),document.removeEventListener(`keydown`,t)}},[f,y]);let b=e=>{if(l?.(e),e.defaultPrevented)return;let t=v();if(t.length===0)return;let n=f??t.find(e=>m.current.get(e)===document.activeElement)??null;if(!n)return;let r=t.indexOf(n);if(!(r<0)){if(e.key===`ArrowRight`){e.preventDefault();let n=t[(r+1)%t.length];f&&p(n),y(n)}else if(e.key===`ArrowLeft`){e.preventDefault();let n=t[(r-1+t.length)%t.length];f&&p(n),y(n)}else if(e.key===`Home`){e.preventDefault();let n=t[0];f&&p(n),y(n)}else if(e.key===`End`){e.preventDefault();let n=t[t.length-1];f&&p(n),y(n)}}},x=(0,a.useMemo)(()=>({openMenuId:f,setOpenMenuId:p,registerTrigger:_,getTriggerIds:v,focusTrigger:y}),[f,_,v,y]),S=e?t.Root:`div`;return(0,s.jsx)(c.Provider,{value:x,children:(0,s.jsx)(S,{ref:g,role:`menubar`,className:(0,o.default)(`wim-menubar`,i.default.root,n),onKeyDown:b,...u,children:(0,s.jsx)(t.Slottable,{children:r})})})});f.displayName=`Menubar`;var p=a.default.forwardRef(({value:e,disabled:t=!1,className:n,children:r,...c},d)=>{let{openMenuId:f,setOpenMenuId:p,focusTrigger:m}=u(),h=(0,a.useId)(),g=`wim-menubar-trigger-${e}-${h}`,_=`wim-menubar-content-${e}-${h}`,v=f===e,y=()=>{t||p(e)},b=()=>{m(e),p(null)},x=()=>{t||p(v?null:e)},S=(0,a.useMemo)(()=>({menuId:e,triggerId:g,contentId:_,isOpen:v,open:y,close:b,toggle:x}),[e,g,_,v,t]);return(0,s.jsx)(l.Provider,{value:S,children:(0,s.jsx)(`div`,{ref:d,role:`none`,"data-disabled":t||void 0,className:(0,o.default)(i.default.menu,n),...c,children:r})})});p.displayName=`Menubar.Menu`;var m=a.default.forwardRef(({asChild:e=!1,className:n,children:r,onKeyDown:c,onMouseEnter:l,...f},p)=>{let{openMenuId:m,registerTrigger:h}=u(),{triggerId:g,contentId:_,isOpen:v,open:y,toggle:b,menuId:x}=d(),S=!!f.disabled,C=(0,a.useCallback)(e=>{h(x,e),typeof p==`function`?p(e):p&&(p.current=e)},[h,x,p]),w=e=>{c?.(e),!(e.defaultPrevented||S)&&(e.key===`ArrowDown`||e.key===`Enter`||e.key===` `)&&(e.preventDefault(),y())},T=e=>{l?.(e),m&&!S&&y()};return(0,s.jsx)(e?t.Root:`button`,{...f,ref:C,type:e?void 0:`button`,id:g,role:`menuitem`,"aria-haspopup":`menu`,"aria-expanded":v,"aria-controls":v?_:void 0,disabled:S,className:(0,o.default)(i.default.trigger,v&&i.default.triggerOpen,n),onClick:b,onKeyDown:w,onMouseEnter:T,children:(0,s.jsx)(t.Slottable,{children:r})})});m.displayName=`Menubar.Trigger`;var h=a.default.forwardRef(({align:e=`start`,className:t,children:r,...c},l)=>{let{contentId:u,triggerId:f,isOpen:p,close:m}=d(),[h,g]=(0,a.useState)(-1),[_,v]=(0,a.useState)(p),y=(0,a.useRef)(null);p!==_&&(v(p),g(p?0:-1));let b=(0,a.useCallback)(e=>{y.current=e,typeof l==`function`?l(e):l&&(l.current=e)},[l]);(0,a.useEffect)(()=>{!p||h<0||Array.from(y.current?.querySelectorAll(`[role="menuitem"]:not([aria-disabled="true"])`)??[])[h]?.focus()},[h,p]);let x=e=>{let t=Array.from(y.current?.querySelectorAll(`[role="menuitem"]:not([aria-disabled="true"])`)??[]);if(t.length!==0)switch(e.key){case`ArrowDown`:e.preventDefault(),g(e=>e<t.length-1?e+1:0);break;case`ArrowUp`:e.preventDefault(),g(e=>e>0?e-1:t.length-1);break;case`Home`:e.preventDefault(),g(0);break;case`End`:e.preventDefault(),g(t.length-1);break;case`Tab`:m()}};return(0,s.jsx)(n.Transition,{...c,ref:b,show:p,preset:`fade`,id:u,role:`menu`,"aria-labelledby":f,className:(0,o.default)(i.default.content,e===`end`?i.default.alignEnd:i.default.alignStart,t),onKeyDown:x,children:r})});h.displayName=`Menubar.Content`;var g=a.default.forwardRef(({children:e,onSelect:t,onClick:n,disabled:a=!1,className:c,...l},u)=>{let{close:f}=d(),p=e=>{a||(e.stopPropagation(),t?.(),n?.(e),f())};return(0,s.jsx)(r.BaseListItem,{...l,ref:u,className:(0,o.default)(i.default.item,c),disabled:a,role:`menuitem`,tabIndex:-1,onClick:p,onKeyDown:e=>{!a&&(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),p(e))},children:e})});g.displayName=`Menubar.Item`;var _=a.default.forwardRef(({className:e,...t},n)=>(0,s.jsx)(`div`,{ref:n,role:`separator`,className:(0,o.default)(i.default.separator,e),...t}));_.displayName=`Menubar.Separator`;var v=f;v.Menu=p,v.Trigger=m,v.Content=h,v.Item=g,v.Separator=_,exports.Menubar=v,exports.default=v;

package/dist/components/navigation/Menubar/Menubar.js

@@ -86,27 +86,29 @@ var g = o(null), _ = o(null), v = () => {
 });
 b.displayName = "Menubar";
 var x = a.forwardRef(({ value: e, disabled: t = !1, className: n, children: r, ...a }, o) => {
-	let { openMenuId: s, setOpenMenuId: c } = v(), l = u(), f = `wim-menubar-trigger-${e}-${l}`, p = `wim-menubar-content-${e}-${l}`, g = s === e, y = () => {
+	let { openMenuId: s, setOpenMenuId: c, focusTrigger: l } = v(), f = u(), p = `wim-menubar-trigger-${e}-${f}`, g = `wim-menubar-content-${e}-${f}`, y = s === e, b = () => {
 		t || c(e);
-	}, b = () => c(null), x = () => {
-		t || c(g ? null : e);
-	}, S = d(() => ({
+	}, x = () => {
+		l(e), c(null);
+	}, S = () => {
+		t || c(y ? null : e);
+	}, C = d(() => ({
 		menuId: e,
-		triggerId: f,
-		contentId: p,
-		isOpen: g,
-		open: y,
-		close: b,
-		toggle: x
+		triggerId: p,
+		contentId: g,
+		isOpen: y,
+		open: b,
+		close: x,
+		toggle: S
 	}), [
 		e,
-		f,
 		p,
 		g,
+		y,
 		t
 	]);
 	return /* @__PURE__ */ h(_.Provider, {
-		value: S,
+		value: C,
 		children: /* @__PURE__ */ h("div", {
 			ref: o,
 			role: "none",
@@ -149,39 +151,42 @@ var S = a.forwardRef(({ asChild: n = !1, className: r, children: a, onKeyDown: o
 });
 S.displayName = "Menubar.Trigger";
 var C = a.forwardRef(({ align: e = "start", className: t, children: r, ...a }, o) => {
-	let { contentId: c, triggerId: u, isOpen: d } = y(), [g, _] = p(-1), [v, b] = p(d), x = f(null);
-	d !== v && (b(d), _(d ? 0 : -1));
-	let S = s((e) => {
-		x.current = e, typeof o == "function" ? o(e) : o && (o.current = e);
+	let { contentId: c, triggerId: u, isOpen: d, close: g } = y(), [_, v] = p(-1), [b, x] = p(d), S = f(null);
+	d !== b && (x(d), v(d ? 0 : -1));
+	let C = s((e) => {
+		S.current = e, typeof o == "function" ? o(e) : o && (o.current = e);
 	}, [o]);
 	l(() => {
-		!d || g < 0 || Array.from(x.current?.querySelectorAll("[role=\"menuitem\"]:not([aria-disabled=\"true\"])") ?? [])[g]?.focus();
-	}, [g, d]);
-	let C = (e) => {
-		let t = Array.from(x.current?.querySelectorAll("[role=\"menuitem\"]:not([aria-disabled=\"true\"])") ?? []);
+		!d || _ < 0 || Array.from(S.current?.querySelectorAll("[role=\"menuitem\"]:not([aria-disabled=\"true\"])") ?? [])[_]?.focus();
+	}, [_, d]);
+	let w = (e) => {
+		let t = Array.from(S.current?.querySelectorAll("[role=\"menuitem\"]:not([aria-disabled=\"true\"])") ?? []);
 		if (t.length !== 0) switch (e.key) {
 			case "ArrowDown":
-				e.preventDefault(), _((e) => e < t.length - 1 ? e + 1 : 0);
+				e.preventDefault(), v((e) => e < t.length - 1 ? e + 1 : 0);
 				break;
 			case "ArrowUp":
-				e.preventDefault(), _((e) => e > 0 ? e - 1 : t.length - 1);
+				e.preventDefault(), v((e) => e > 0 ? e - 1 : t.length - 1);
 				break;
 			case "Home":
-				e.preventDefault(), _(0);
+				e.preventDefault(), v(0);
+				break;
+			case "End":
+				e.preventDefault(), v(t.length - 1);
 				break;
-			case "End": e.preventDefault(), _(t.length - 1);
+			case "Tab": g();
 		}
 	};
 	return /* @__PURE__ */ h(n, {
 		...a,
-		ref: S,
+		ref: C,
 		show: d,
 		preset: "fade",
 		id: c,
 		role: "menu",
 		"aria-labelledby": u,
 		className: m(i.content, e === "end" ? i.alignEnd : i.alignStart, t),
-		onKeyDown: C,
+		onKeyDown: w,
 		children: r
 	});
 });

package/dist/components/navigation/SpeedDial/SpeedDial.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../form/FloatButton/FloatButton.cjs"),n=require("./speed-dial.module.cjs");let r=require("react");r=e.__toESM(r,1);let i=require("classnames");i=e.__toESM(i,1);let a=require("react/jsx-runtime");var o=r.default.forwardRef(({actions:e,icon:o=`PlusIcon`,activeIcon:s=`CloseIcon`,direction:c=`up`,trigger:l=`hover`,open:u,onOpenChange:d,className:f,"aria-label":p,...m},h)=>{let[g,_]=(0,r.useState)(!1),v=u??g,y=e=>{_(e),d?.(e)},b=()=>{l===`hover`&&y(!0)},x=()=>{l===`hover`&&y(!1)},S=()=>{l===`click`&&y(!v)};return(0,a.jsxs)(`div`,{ref:h,className:(0,i.default)(`wim-speed-dial`,n.default.root,n.default[c],v&&n.default.open,f),onMouseEnter:b,onMouseLeave:x,...m,children:[(0,a.jsx)(`div`,{className:n.default.actions,children:e.map((e,r)=>(0,a.jsx)(`div`,{className:n.default.actionWrapper,style:{transitionDelay:v?`${r*50}ms`:`0ms`},children:(0,a.jsx)(t.FloatButton,{iconName:e.icon,label:e.label,size:`sm`,intent:e.intent,className:e.className,onClick:()=>{e.onClick?.(),l===`click`&&y(!1)},position:`inline`})},r))}),(0,a.jsx)(t.FloatButton,{iconName:v?s:o,onClick:S,className:n.default.trigger,position:`inline`,"aria-expanded":v,"aria-haspopup":`true`,"aria-label":p})]})});o.displayName=`SpeedDial`,exports.SpeedDial=o;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../form/FloatButton/FloatButton.cjs"),r=require("./speed-dial.module.cjs");let i=require("react");i=e.__toESM(i,1);let a=require("classnames");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=i.default.forwardRef(({actions:e,icon:s=`PlusIcon`,activeIcon:c=`CloseIcon`,direction:l=`up`,trigger:u=`hover`,open:d,onOpenChange:f,className:p,"aria-label":m,...h},g)=>{let{t:_}=t.useWimTranslation(`common`),[v,y]=(0,i.useState)(!1),b=d??v,x=(0,i.useRef)(null),S=(0,i.useRef)(!1),C=e=>{y(e),f?.(e)},w=()=>{u===`hover`&&C(!0)},T=()=>{u===`hover`&&C(!1)},E=()=>{u===`click`&&C(!b)},D=e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),S.current=!b,C(!b))};return(0,i.useEffect)(()=>{b&&S.current&&x.current?.querySelector(`button`)?.focus()},[b]),(0,o.jsxs)(`div`,{ref:g,className:(0,a.default)(`wim-speed-dial`,r.default.root,r.default[l],b&&r.default.open,p),onMouseEnter:w,onMouseLeave:T,onKeyDown:e=>{e.key===`Escape`&&b&&(e.preventDefault(),S.current=!1,C(!1),e.currentTarget.querySelector(`[aria-haspopup]`)?.focus())},onBlur:e=>{S.current&&(e.currentTarget.contains(e.relatedTarget)||(S.current=!1,C(!1)))},...h,children:[(0,o.jsx)(`div`,{ref:x,className:r.default.actions,inert:!b,children:e.map((e,t)=>(0,o.jsx)(`div`,{className:r.default.actionWrapper,style:{transitionDelay:b?`${t*50}ms`:`0ms`},children:(0,o.jsx)(n.FloatButton,{iconName:e.icon,label:e.label,size:`sm`,intent:e.intent,className:e.className,onClick:()=>{e.onClick?.(),u===`click`&&C(!1)},position:`inline`})},t))}),(0,o.jsx)(n.FloatButton,{iconName:b?c:s,onClick:E,className:r.default.trigger,position:`inline`,"aria-expanded":b,"aria-haspopup":`true`,"aria-label":m??_(b?`a11y.close_menu`:`a11y.open_menu`),onKeyDown:D})]})});s.displayName=`SpeedDial`,exports.SpeedDial=s;

package/dist/components/navigation/SpeedDial/SpeedDial.d.ts

@@ -36,7 +36,7 @@ export type SpeedDialProps = React.ComponentPropsWithoutRef<"div"> & {
     /**
      * Accessible name for the trigger button.
      * Lands on the inner `FloatButton`, not on the wrapper `div`.
-     * Omit to keep the icon-name fallback (`PlusIcon` / `CloseIcon`).
+     * Defaults to a translated "Open menu" / "Close menu" (en / ja / pt), following the open state.
      */
     "aria-label"?: string;
 };
@@ -76,7 +76,7 @@ export declare const SpeedDial: React.ForwardRefExoticComponent<Omit<React.Detai
     /**
      * Accessible name for the trigger button.
      * Lands on the inner `FloatButton`, not on the wrapper `div`.
-     * Omit to keep the icon-name fallback (`PlusIcon` / `CloseIcon`).
+     * Defaults to a translated "Open menu" / "Close menu" (en / ja / pt), following the open state.
      */
     "aria-label"?: string;
 } & React.RefAttributes<HTMLDivElement>>;

package/dist/components/navigation/SpeedDial/SpeedDial.js

@@ -1,54 +1,68 @@
 "use client";
-import { FloatButton as e } from "../../form/FloatButton/FloatButton.js";
-import t from "./speed-dial.module.js";
-import n, { useState as r } from "react";
-import i from "classnames";
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { useWimTranslation as e } from "../../../i18n/useWimTranslation.js";
+import { FloatButton as t } from "../../form/FloatButton/FloatButton.js";
+import n from "./speed-dial.module.js";
+import r, { useEffect as i, useRef as a, useState as o } from "react";
+import s from "classnames";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region src/components/navigation/SpeedDial/SpeedDial.tsx
-var s = n.forwardRef(({ actions: n, icon: s = "PlusIcon", activeIcon: c = "CloseIcon", direction: l = "up", trigger: u = "hover", open: d, onOpenChange: f, className: p, "aria-label": m, ...h }, g) => {
-	let [_, v] = r(!1), y = d ?? _, b = (e) => {
-		v(e), f?.(e);
-	}, x = () => {
-		u === "hover" && b(!0);
-	}, S = () => {
-		u === "hover" && b(!1);
-	}, C = () => {
-		u === "click" && b(!y);
+var u = r.forwardRef(({ actions: r, icon: u = "PlusIcon", activeIcon: d = "CloseIcon", direction: f = "up", trigger: p = "hover", open: m, onOpenChange: h, className: g, "aria-label": _, ...v }, y) => {
+	let { t: b } = e("common"), [x, S] = o(!1), C = m ?? x, w = a(null), T = a(!1), E = (e) => {
+		S(e), h?.(e);
+	}, D = () => {
+		p === "hover" && E(!0);
+	}, O = () => {
+		p === "hover" && E(!1);
+	}, k = () => {
+		p === "click" && E(!C);
+	}, A = (e) => {
+		(e.key === "Enter" || e.key === " ") && (e.preventDefault(), T.current = !C, E(!C));
 	};
-	return /* @__PURE__ */ o("div", {
-		ref: g,
-		className: i("wim-speed-dial", t.root, t[l], y && t.open, p),
-		onMouseEnter: x,
-		onMouseLeave: S,
-		...h,
-		children: [/* @__PURE__ */ a("div", {
-			className: t.actions,
-			children: n.map((n, r) => /* @__PURE__ */ a("div", {
-				className: t.actionWrapper,
-				style: { transitionDelay: y ? `${r * 50}ms` : "0ms" },
-				children: /* @__PURE__ */ a(e, {
-					iconName: n.icon,
-					label: n.label,
+	return i(() => {
+		C && T.current && w.current?.querySelector("button")?.focus();
+	}, [C]), /* @__PURE__ */ l("div", {
+		ref: y,
+		className: s("wim-speed-dial", n.root, n[f], C && n.open, g),
+		onMouseEnter: D,
+		onMouseLeave: O,
+		onKeyDown: (e) => {
+			e.key === "Escape" && C && (e.preventDefault(), T.current = !1, E(!1), e.currentTarget.querySelector("[aria-haspopup]")?.focus());
+		},
+		onBlur: (e) => {
+			T.current && (e.currentTarget.contains(e.relatedTarget) || (T.current = !1, E(!1)));
+		},
+		...v,
+		children: [/* @__PURE__ */ c("div", {
+			ref: w,
+			className: n.actions,
+			inert: !C,
+			children: r.map((e, r) => /* @__PURE__ */ c("div", {
+				className: n.actionWrapper,
+				style: { transitionDelay: C ? `${r * 50}ms` : "0ms" },
+				children: /* @__PURE__ */ c(t, {
+					iconName: e.icon,
+					label: e.label,
 					size: "sm",
-					intent: n.intent,
-					className: n.className,
+					intent: e.intent,
+					className: e.className,
 					onClick: () => {
-						n.onClick?.(), u === "click" && b(!1);
+						e.onClick?.(), p === "click" && E(!1);
 					},
 					position: "inline"
 				})
 			}, r))
-		}), /* @__PURE__ */ a(e, {
-			iconName: y ? c : s,
-			onClick: C,
-			className: t.trigger,
+		}), /* @__PURE__ */ c(t, {
+			iconName: C ? d : u,
+			onClick: k,
+			className: n.trigger,
 			position: "inline",
-			"aria-expanded": y,
+			"aria-expanded": C,
 			"aria-haspopup": "true",
-			"aria-label": m
+			"aria-label": _ ?? b(C ? "a11y.close_menu" : "a11y.open_menu"),
+			onKeyDown: A
 		})]
 	});
 });
-s.displayName = "SpeedDial";
+u.displayName = "SpeedDial";
 //#endregion
-export { s as SpeedDial };
+export { u as SpeedDial };