wimui 0.51.0 → 0.51.2

package/dist/components/form/SegmentedControl/SegmentedControl.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("../../media/Icon/Icon.cjs"),r=require("../../../hooks/useMergedRef.cjs"),i=require("../FieldTemplate/FieldTemplate.cjs"),a=require("../../_internal/useIndicator.cjs"),o=require("./segmented-control.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");var u=(0,s.forwardRef)(({options:e,value:u,onChange:d,size:f=`md`,fullWidth:p=!1,className:m,label:h,error:g,required:_,layout:v=`vertical`,disabled:y=!1,asChild:b=!1,children:x,id:S,styles:C},w)=>{let T=(0,s.useRef)([]),E=(0,s.useId)(),D=S||`wim-segmented-${E}`,O=`${D}-label`,k=`${D}-error`,{containerRef:A,sliderStyle:j,isReady:M}=a.useIndicator({activeSelector:`.${o.default.active}`,dependence:e.length}),N=e.findIndex(e=>e.value===u),P=(t,n)=>{let r;switch(t.key){case`ArrowLeft`:case`ArrowUp`:r=n-1,r<0&&(r=e.length-1);break;case`ArrowRight`:case`ArrowDown`:r=n+1,r>=e.length&&(r=0);break;default:return}t.preventDefault(),d(e[r].value),T.current[r]?.focus()},F=`${D}-item-0`;return(0,l.jsx)(i.FieldTemplate,{label:h,error:g,required:_,layout:v,labelId:O,htmlFor:F,errorId:k,className:m,children:(0,l.jsxs)(b?t.Root:`div`,{ref:r.useMergedRef(A,w),id:D,className:(0,c.default)(`wim-segmented-control`,o.default.root,o.default[f],p&&o.default.fullWidth,M&&o.default.ready,g&&o.default.danger,C?.root),role:`radiogroup`,"aria-labelledby":h?O:void 0,"aria-required":_,"aria-invalid":g?!0:void 0,"aria-describedby":g?k:void 0,children:[(0,l.jsx)(`div`,{className:(0,c.default)(o.default.slider,C?.slider),style:j,"aria-hidden":`true`}),e.map((e,t)=>{let r=e.value===u,i=r||N===-1&&t===0,a=`${D}-item-${t}`;return(0,l.jsxs)(`button`,{id:a,ref:e=>{T.current[t]=e},type:`button`,className:(0,c.default)(o.default.item,r&&o.default.active,!e.label&&e.iconName&&o.default.iconOnly,C?.item),onClick:()=>d(e.value),onKeyDown:e=>P(e,t),onFocus:()=>{},onBlur:()=>{},role:`radio`,"aria-checked":r,tabIndex:i?0:-1,"aria-label":e.label||e.value,disabled:y,children:[e.iconName&&(0,l.jsx)(n.Icon,{name:e.iconName,size:f,className:o.default.icon}),e.label&&(0,l.jsx)(`span`,{className:(0,c.default)(o.default.label,C?.label),children:e.label})]},e.value)}),(0,l.jsx)(t.Slottable,{children:x})]})})});u.displayName=`SegmentedControl`,exports.SegmentedControl=u;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../media/Icon/Icon.cjs"),r=require("../../../hooks/useMergedRef.cjs"),i=require("../FieldTemplate/FieldTemplate.cjs"),a=require("../../_internal/useIndicator.cjs"),o=require("./segmented-control.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");var u=(0,s.forwardRef)(({options:e,value:u,onChange:d,size:f=`md`,fullWidth:p=!1,className:m,label:h,error:g,required:_,layout:v=`vertical`,disabled:y=!1,asChild:b=!1,children:x,id:S,styles:C},w)=>{let T=(0,s.useRef)([]),E=(0,s.useId)(),D=S||`wim-segmented-${E}`,O=`${D}-label`,k=`${D}-error`,{containerRef:A,sliderStyle:j,isReady:M}=a.useIndicator({activeSelector:`.${o.default.active}`,dependence:e.length}),N=e.findIndex(e=>e.value===u),P=(t,n)=>{let r;switch(t.key){case`ArrowLeft`:case`ArrowUp`:r=n-1,r<0&&(r=e.length-1);break;case`ArrowRight`:case`ArrowDown`:r=n+1,r>=e.length&&(r=0);break;case`Home`:r=0;break;case`End`:r=e.length-1;break;default:return}t.preventDefault(),d(e[r].value),T.current[r]?.focus()},F=`${D}-item-0`;return(0,l.jsx)(i.FieldTemplate,{label:h,error:g,required:_,layout:v,labelId:O,htmlFor:F,errorId:k,className:m,children:(0,l.jsxs)(b?t.Root:`div`,{ref:r.useMergedRef(A,w),id:D,className:(0,c.default)(`wim-segmented-control`,o.default.root,o.default[f],p&&o.default.fullWidth,M&&o.default.ready,g&&o.default.danger,C?.root),role:`radiogroup`,"aria-labelledby":h?O:void 0,"aria-required":_,"aria-invalid":g?!0:void 0,"aria-describedby":g?k:void 0,children:[(0,l.jsx)(`div`,{className:(0,c.default)(o.default.slider,C?.slider),style:j,"aria-hidden":`true`}),e.map((e,t)=>{let r=e.value===u,i=r||N===-1&&t===0,a=`${D}-item-${t}`;return(0,l.jsxs)(`button`,{id:a,ref:e=>{T.current[t]=e},type:`button`,className:(0,c.default)(o.default.item,r&&o.default.active,!e.label&&e.iconName&&o.default.iconOnly,C?.item),onClick:()=>d(e.value),onKeyDown:e=>P(e,t),onFocus:()=>{},onBlur:()=>{},role:`radio`,"aria-checked":r,tabIndex:i?0:-1,"aria-label":e.label||e.value,disabled:y,children:[e.iconName&&(0,l.jsx)(n.Icon,{name:e.iconName,size:f,className:o.default.icon}),e.label&&(0,l.jsx)(`span`,{className:(0,c.default)(o.default.label,C?.label),children:e.label})]},e.value)}),(0,l.jsx)(t.Slottable,{children:x})]})})});u.displayName=`SegmentedControl`,exports.SegmentedControl=u;

package/dist/components/form/SegmentedControl/SegmentedControl.js

@@ -24,6 +24,12 @@ var p = s(({ options: s, value: p, onChange: m, size: h = "md", fullWidth: g = !
 			case "ArrowDown":
 				n = t + 1, n >= s.length && (n = 0);
 				break;
+			case "Home":
+				n = 0;
+				break;
+			case "End":
+				n = s.length - 1;
+				break;
 			default: return;
 		}
 		e.preventDefault(), m(s[n].value), O.current[n]?.focus();

package/dist/components/form/ThemeToggle/ThemeToggle.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("../../../icon/monitor.cjs"),r=require("../../../icon/moon.cjs"),i=require("../../../icon/sun.cjs"),a=require("../../media/Icon/Icon.cjs"),o=require("../../../theme.cjs"),s=require("./theme-toggle.module.cjs");let c=require("react");c=e.__toESM(c,1);let l=require("classnames");l=e.__toESM(l,1);let u=require("react/jsx-runtime");var d={light:i.default,dark:r.default,system:n.default},f=`wim-theme`,p=e=>e===`light`||e===`dark`||e===`system`,m=c.default.forwardRef(({value:e,defaultValue:n=`system`,onChange:r,modes:i=[`light`,`dark`],variant:m=`icon`,size:h=`md`,storageKey:g=f,applyToDocument:_=!0,labels:v,className:y,asChild:b=!1,children:x,...S},C)=>{let{light:w=`Light`,dark:T=`Dark`,system:E=`System`,toggle:D=`Toggle theme`}=v??{},O={light:w,dark:T,system:E},k=e!==void 0,[A,j]=(0,c.useState)(()=>{if(typeof window<`u`&&g){let e=window.localStorage.getItem(g);if(p(e)&&i.includes(e))return e}return i.includes(n)?n:i[0]}),M=k?e:A;(0,c.useEffect)(()=>{_&&o.setWimTheme(M)},[M,_]);let N=(0,c.useCallback)(e=>{k||j(e),typeof window<`u`&&g&&window.localStorage.setItem(g,e),r?.(e)},[k,g,r]),P=()=>{let e=i[(i.indexOf(M)+1)%i.length];N(e)},F=b?t.Root:`div`;return m===`segmented`?(0,u.jsxs)(F,{ref:C,role:`group`,"aria-label":D,className:(0,l.default)(s.default.segmented,s.default[h],y),...S,children:[i.map(e=>{let t=e===M;return(0,u.jsx)(`button`,{type:`button`,className:(0,l.default)(s.default.segment,t&&s.default.active),"aria-pressed":t,"aria-label":O[e],title:O[e],onClick:()=>N(e),children:(0,u.jsx)(a.Icon,{component:d[e],size:`sm`})},e)}),(0,u.jsx)(t.Slottable,{children:x})]}):(0,u.jsxs)(F,{ref:C,className:(0,l.default)(`wim-theme-toggle`,s.default.root,y),...S,children:[(0,u.jsx)(`button`,{type:`button`,className:(0,l.default)(s.default.iconButton,s.default[h]),"aria-label":`${D} (${O[M]})`,title:O[M],onClick:P,children:(0,u.jsx)(a.Icon,{component:d[M],size:`sm`})}),(0,u.jsx)(t.Slottable,{children:x})]})});m.displayName=`ThemeToggle`,exports.ThemeToggle=m;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../i18n/useWimTranslation.cjs"),r=require("../../../icon/monitor.cjs"),i=require("../../../icon/moon.cjs"),a=require("../../../icon/sun.cjs"),o=require("../../media/Icon/Icon.cjs"),s=require("../../../theme.cjs"),c=require("./theme-toggle.module.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("classnames");u=e.__toESM(u,1);let d=require("react/jsx-runtime");var f={light:a.default,dark:i.default,system:r.default},p=`wim-theme`,m=e=>e===`light`||e===`dark`||e===`system`,h=l.default.forwardRef(({value:e,defaultValue:r=`system`,onChange:i,modes:a=[`light`,`dark`],variant:h=`icon`,size:g=`md`,storageKey:_=p,applyToDocument:v=!0,labels:y,className:b,asChild:x=!1,children:S,...C},w)=>{let{t:T}=n.useWimTranslation(`common`),{light:E=T(`common.light`),dark:D=T(`common.dark`),system:O=T(`theme.system`),toggle:k=T(`theme.toggle`)}=y??{},A={light:E,dark:D,system:O},j=e!==void 0,[M,N]=(0,l.useState)(()=>{if(typeof window<`u`&&_){let e=window.localStorage.getItem(_);if(m(e)&&a.includes(e))return e}return a.includes(r)?r:a[0]}),P=j?e:M;(0,l.useEffect)(()=>{v&&s.setWimTheme(P)},[P,v]);let F=(0,l.useCallback)(e=>{j||N(e),typeof window<`u`&&_&&window.localStorage.setItem(_,e),i?.(e)},[j,_,i]),I=()=>{let e=a[(a.indexOf(P)+1)%a.length];F(e)},L=x?t.Root:`div`;return h===`segmented`?(0,d.jsxs)(L,{ref:w,role:`group`,"aria-label":k,className:(0,u.default)(c.default.segmented,c.default[g],b),...C,children:[a.map(e=>{let t=e===P;return(0,d.jsx)(`button`,{type:`button`,className:(0,u.default)(c.default.segment,t&&c.default.active),"aria-pressed":t,"aria-label":A[e],title:A[e],onClick:()=>F(e),children:(0,d.jsx)(o.Icon,{component:f[e],size:`sm`})},e)}),(0,d.jsx)(t.Slottable,{children:S})]}):(0,d.jsxs)(L,{ref:w,className:(0,u.default)(`wim-theme-toggle`,c.default.root,b),...C,children:[(0,d.jsx)(`button`,{type:`button`,className:(0,u.default)(c.default.iconButton,c.default[g]),"aria-label":`${k} (${A[P]})`,title:A[P],onClick:I,children:(0,d.jsx)(o.Icon,{component:f[P],size:`sm`})}),(0,d.jsx)(t.Slottable,{children:S})]})});h.displayName=`ThemeToggle`,exports.ThemeToggle=h;

package/dist/components/form/ThemeToggle/ThemeToggle.js

@@ -1,82 +1,83 @@
 "use client";
 import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
-import n from "../../../icon/monitor.js";
-import r from "../../../icon/moon.js";
-import i from "../../../icon/sun.js";
-import { Icon as a } from "../../media/Icon/Icon.js";
-import { setWimTheme as o } from "../../../theme.js";
-import s from "./theme-toggle.module.js";
-import c, { useCallback as l, useEffect as u, useState as d } from "react";
-import f from "classnames";
-import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { useWimTranslation as n } from "../../../i18n/useWimTranslation.js";
+import r from "../../../icon/monitor.js";
+import i from "../../../icon/moon.js";
+import a from "../../../icon/sun.js";
+import { Icon as o } from "../../media/Icon/Icon.js";
+import { setWimTheme as s } from "../../../theme.js";
+import c from "./theme-toggle.module.js";
+import l, { useCallback as u, useEffect as d, useState as f } from "react";
+import p from "classnames";
+import { jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region src/components/form/ThemeToggle/ThemeToggle.tsx
-var h = {
-	light: i,
-	dark: r,
-	system: n
-}, g = "wim-theme", _ = (e) => e === "light" || e === "dark" || e === "system", v = c.forwardRef(({ value: n, defaultValue: r = "system", onChange: i, modes: c = ["light", "dark"], variant: v = "icon", size: y = "md", storageKey: b = g, applyToDocument: x = !0, labels: S, className: C, asChild: w = !1, children: T, ...E }, D) => {
-	let { light: O = "Light", dark: k = "Dark", system: A = "System", toggle: j = "Toggle theme" } = S ?? {}, M = {
-		light: O,
-		dark: k,
-		system: A
-	}, N = n !== void 0, [P, F] = d(() => {
-		if (typeof window < "u" && b) {
-			let e = window.localStorage.getItem(b);
-			if (_(e) && c.includes(e)) return e;
+var g = {
+	light: a,
+	dark: i,
+	system: r
+}, _ = "wim-theme", v = (e) => e === "light" || e === "dark" || e === "system", y = l.forwardRef(({ value: r, defaultValue: i = "system", onChange: a, modes: l = ["light", "dark"], variant: y = "icon", size: b = "md", storageKey: x = _, applyToDocument: S = !0, labels: C, className: w, asChild: T = !1, children: E, ...D }, O) => {
+	let { t: k } = n("common"), { light: A = k("common.light"), dark: j = k("common.dark"), system: M = k("theme.system"), toggle: N = k("theme.toggle") } = C ?? {}, P = {
+		light: A,
+		dark: j,
+		system: M
+	}, F = r !== void 0, [I, L] = f(() => {
+		if (typeof window < "u" && x) {
+			let e = window.localStorage.getItem(x);
+			if (v(e) && l.includes(e)) return e;
 		}
-		return c.includes(r) ? r : c[0];
-	}), I = N ? n : P;
-	u(() => {
-		x && o(I);
-	}, [I, x]);
-	let L = l((e) => {
-		N || F(e), typeof window < "u" && b && window.localStorage.setItem(b, e), i?.(e);
+		return l.includes(i) ? i : l[0];
+	}), R = F ? r : I;
+	d(() => {
+		S && s(R);
+	}, [R, S]);
+	let z = u((e) => {
+		F || L(e), typeof window < "u" && x && window.localStorage.setItem(x, e), a?.(e);
 	}, [
-		N,
-		b,
-		i
-	]), R = () => {
-		let e = c[(c.indexOf(I) + 1) % c.length];
-		L(e);
-	}, z = w ? e : "div";
-	return v === "segmented" ? /* @__PURE__ */ m(z, {
-		ref: D,
+		F,
+		x,
+		a
+	]), B = () => {
+		let e = l[(l.indexOf(R) + 1) % l.length];
+		z(e);
+	}, V = T ? e : "div";
+	return y === "segmented" ? /* @__PURE__ */ h(V, {
+		ref: O,
 		role: "group",
-		"aria-label": j,
-		className: f(s.segmented, s[y], C),
-		...E,
-		children: [c.map((e) => {
-			let t = e === I;
-			return /* @__PURE__ */ p("button", {
+		"aria-label": N,
+		className: p(c.segmented, c[b], w),
+		...D,
+		children: [l.map((e) => {
+			let t = e === R;
+			return /* @__PURE__ */ m("button", {
 				type: "button",
-				className: f(s.segment, t && s.active),
+				className: p(c.segment, t && c.active),
 				"aria-pressed": t,
-				"aria-label": M[e],
-				title: M[e],
-				onClick: () => L(e),
-				children: /* @__PURE__ */ p(a, {
-					component: h[e],
+				"aria-label": P[e],
+				title: P[e],
+				onClick: () => z(e),
+				children: /* @__PURE__ */ m(o, {
+					component: g[e],
 					size: "sm"
 				})
 			}, e);
-		}), /* @__PURE__ */ p(t, { children: T })]
-	}) : /* @__PURE__ */ m(z, {
-		ref: D,
-		className: f("wim-theme-toggle", s.root, C),
-		...E,
-		children: [/* @__PURE__ */ p("button", {
+		}), /* @__PURE__ */ m(t, { children: E })]
+	}) : /* @__PURE__ */ h(V, {
+		ref: O,
+		className: p("wim-theme-toggle", c.root, w),
+		...D,
+		children: [/* @__PURE__ */ m("button", {
 			type: "button",
-			className: f(s.iconButton, s[y]),
-			"aria-label": `${j} (${M[I]})`,
-			title: M[I],
-			onClick: R,
-			children: /* @__PURE__ */ p(a, {
-				component: h[I],
+			className: p(c.iconButton, c[b]),
+			"aria-label": `${N} (${P[R]})`,
+			title: P[R],
+			onClick: B,
+			children: /* @__PURE__ */ m(o, {
+				component: g[R],
 				size: "sm"
 			})
-		}), /* @__PURE__ */ p(t, { children: T })]
+		}), /* @__PURE__ */ m(t, { children: E })]
 	});
 });
-v.displayName = "ThemeToggle";
+y.displayName = "ThemeToggle";
 //#endregion
-export { v as ThemeToggle };
+export { y as ThemeToggle };

package/dist/components/form/Transfer/Transfer.cjs

@@ -1,2 +1,2 @@
 "use client";
-const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../layout/VisuallyHidden/VisuallyHidden.cjs"),r=require("../Button/Button.cjs"),i=require("../../_internal/BaseListItem/BaseListItem.cjs"),a=require("../FieldTemplate/FieldTemplate.cjs"),o=require("../Checkbox/Checkbox.cjs"),s=require("../../data-display/VirtualList/VirtualList.cjs"),c=require("./transfer.module.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("classnames");u=e.__toESM(u,1);let d=require("react/jsx-runtime");var f=36,p=50,m=({data:e,title:t,listType:n,id:r,disabled:a,selectedKeys:m,focusedKey:h,setFocusedKey:g,onSelect:_,onSelectAll:v,onKeyDown:y,labels:b={},className:x})=>{let{noData:S=`No Data`}=b,C=(0,l.useRef)(null),w=(0,l.useRef)(null),[T,E]=(0,l.useState)(0);(0,l.useEffect)(()=>{let e=C.current;if(!e)return;let t=new ResizeObserver(([e])=>{E(Math.floor(e.contentRect.height))});return t.observe(e),()=>t.disconnect()},[]),(0,l.useEffect)(()=>{if(!h||!w.current||T===0)return;let t=e.findIndex(e=>e.key===h);if(t===-1)return;let n=w.current,r=t*f,i=r+f;r<n.scrollTop?n.scrollTop=r:i>n.scrollTop+T&&(n.scrollTop=i-T)},[h,e,T]);let D=e.filter(e=>!e.disabled).map(e=>e.key),O=m.filter(e=>D.includes(e)),k=D.length>0&&O.length===D.length,A=O.length>0&&O.length<D.length,j=h&&e.some(e=>e.key===h)?`${r}-${n}-option-${h}`:void 0,M=e.length>=p&&T>0,N=(t,o)=>(0,d.jsx)(i.BaseListItem,{id:`${r}-${n}-option-${t.key}`,className:(0,u.default)(c.default.item,h===t.key&&c.default.active),disabled:a||t.disabled,active:h===t.key,onClick:()=>{t.disabled||(g(t.key),_(t.key))},role:`option`,"aria-selected":m.includes(t.key),"aria-disabled":a||t.disabled,"aria-setsize":M?e.length:void 0,"aria-posinset":M?o+1:void 0,icon:(0,d.jsx)(`div`,{className:(0,u.default)(c.default.checkboxVisual,m.includes(t.key)&&c.default.checked,(a||t.disabled)&&c.default.disabled),"aria-hidden":`true`}),children:t.title},t.key),P=typeof t==`string`?t:``;return(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.list,x),children:[(0,d.jsxs)(`div`,{className:c.default.header,children:[(0,d.jsx)(o.Checkbox,{checked:k,indeterminate:A,onChange:()=>v(D,n),disabled:a||D.length===0,children:(0,d.jsx)(`span`,{className:c.default.headerTitle,title:P,children:t})}),(0,d.jsxs)(`span`,{className:c.default.headerCount,children:[O.length,`/`,e.length]})]}),(0,d.jsx)(`div`,{ref:C,className:c.default.body,role:e.length>0?`listbox`:`group`,"aria-multiselectable":e.length>0?`true`:void 0,"aria-label":P,"aria-activedescendant":e.length>0?j:void 0,"aria-disabled":a||void 0,tabIndex:e.length===0?-1:0,onKeyDown:t=>y(t,n,e),onFocus:()=>{if(!h){let t=e.find(e=>!e.disabled);t&&g(t.key)}},style:M?{overflow:`hidden`,padding:0}:void 0,children:e.length===0?(0,d.jsx)(`div`,{className:c.default.empty,"aria-live":`polite`,children:S}):M?(0,d.jsx)(s.VirtualList,{items:e,itemHeight:f,height:T,renderItem:N,itemRole:`none`,ref:w,role:`presentation`}):e.map((e,t)=>N(e,t))})]})},h=({dataSource:e=[],targetKeys:i,onChange:o,titles:s=[`Source`,`Target`],className:f,style:p,disabled:h=!1,label:g,error:_,required:v,layout:y=`vertical`,labels:b={}})=>{let{t:x}=t.useWimTranslation(`form`),{moveToTarget:S=x(`transfer.move_to_target`),moveToSource:C=x(`transfer.move_to_source`),statusMovedToTarget:w=e=>x(`transfer.status_moved_to_target`,{count:e}),statusMovedToSource:T=e=>x(`transfer.status_moved_to_source`,{count:e})}=b,[E,D]=(0,l.useState)([]),[O,k]=(0,l.useState)(i||[]),A=`wim-transfer-${(0,l.useId)()}`,j=g?`${A}-label`:void 0,M=_?`${A}-error`:void 0,N=i!==void 0&&!!o,P=N?i:O,F=(0,l.useMemo)(()=>e.filter(e=>!P.includes(e.key)),[e,P]),I=(0,l.useMemo)(()=>e.filter(e=>P.includes(e.key)),[e,P]),[L,R]=(0,l.useState)(null),[z,B]=(0,l.useState)(null),[V,H]=(0,l.useState)(``),U=(0,l.useRef)(null);L&&!F.some(e=>e.key===L)&&R(null),z&&!I.some(e=>e.key===z)&&B(null);let W=e=>{h||D(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},G=(e,t)=>{if(h)return;let n=e;n.every(e=>E.includes(e))?D(e=>e.filter(e=>!n.includes(e))):D(e=>[...new Set([...e,...n])])},K=e=>{if(h)return;let t=e===`toRight`?F.map(e=>e.key):I.map(e=>e.key),n=E.filter(e=>t.includes(e));if(n.length===0)return;let r=e===`toRight`?[...P,...n]:P.filter(e=>!n.includes(e));N||k(r),o&&o(r,e,n),D(e=>e.filter(e=>!n.includes(e)));let i=e===`toRight`?w(n.length):T(n.length);U.current&&clearTimeout(U.current),H(``),U.current=setTimeout(()=>H(i),50)},q=(e,t,n)=>{let r=e.filter(e=>!e.disabled);if(r.length===0)return null;if(t===null)return n===1?r[0].key:r[r.length-1].key;let i=r.findIndex(e=>e.key===t);return i===-1?r[0].key:r[(i+n+r.length)%r.length].key},J=(e,t,n)=>{if(h)return;let r=t===`source`?L:z,i=t===`source`?R:B;if(e.key===`ArrowDown`)e.preventDefault(),i(q(n,r,1));else if(e.key===`ArrowUp`)e.preventDefault(),i(q(n,r,-1));else if(e.key===`Home`){e.preventDefault();let t=n.find(e=>!e.disabled);t&&i(t.key)}else if(e.key===`End`){e.preventDefault();let t=[...n].reverse().find(e=>!e.disabled);t&&i(t.key)}else if(e.key===` `){e.preventDefault();let t=n.find(e=>e.key===r);t&&!t.disabled&&W(t.key)}else e.key===`Enter`&&(e.preventDefault(),K(t===`source`?`toRight`:`toLeft`))},Y=E.filter(e=>F.some(t=>t.key===e)).length===0,X=E.filter(e=>I.some(t=>t.key===e)).length===0;return(0,d.jsx)(a.FieldTemplate,{label:g,error:_,required:v,layout:y,labelId:j,errorId:M,className:f,children:(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.container,`wim-transfer`),children:[(0,d.jsx)(n.VisuallyHidden,{"aria-live":`polite`,"aria-atomic":`true`,children:V}),(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.root,h&&c.default.disabled),style:p,role:`group`,"aria-labelledby":g?j:void 0,"aria-describedby":M,children:[(0,d.jsx)(m,{className:`wim-transfer__list`,data:F,title:s[0],listType:`source`,id:A,disabled:h,selectedKeys:E,focusedKey:L,setFocusedKey:R,onSelect:W,onSelectAll:G,onKeyDown:J,labels:b}),(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.operation,`wim-transfer__operation`),children:[(0,d.jsx)(r.Button,{variant:`outline`,size:`sm`,className:c.default.button,onClick:()=>K(`toRight`),disabled:h||Y,icon:`ChevronRightIcon`,"aria-label":S}),(0,d.jsx)(r.Button,{variant:`outline`,size:`sm`,className:c.default.button,onClick:()=>K(`toLeft`),disabled:h||X,icon:`ChevronLeftIcon`,"aria-label":C})]}),(0,d.jsx)(m,{className:`wim-transfer__list`,data:I,title:s[1],listType:`target`,id:A,disabled:h,selectedKeys:E,focusedKey:z,setFocusedKey:B,onSelect:W,onSelectAll:G,onKeyDown:J,labels:b})]})]})})};exports.Transfer=h;
+const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../layout/VisuallyHidden/VisuallyHidden.cjs"),r=require("../Button/Button.cjs"),i=require("../../_internal/BaseListItem/BaseListItem.cjs"),a=require("../FieldTemplate/FieldTemplate.cjs"),o=require("../Checkbox/Checkbox.cjs"),s=require("../../data-display/VirtualList/VirtualList.cjs"),c=require("./transfer.module.cjs");let l=require("react");l=e.__toESM(l,1);let u=require("classnames");u=e.__toESM(u,1);let d=require("react/jsx-runtime");var f=36,p=50,m=({data:e,title:n,listType:r,id:a,disabled:m,selectedKeys:h,focusedKey:g,setFocusedKey:_,onSelect:v,onSelectAll:y,onKeyDown:b,labels:x={},className:S})=>{let{t:C}=t.useWimTranslation(`form`),{noData:w=C(`transfer.no_data`)}=x,T=(0,l.useRef)(null),E=(0,l.useRef)(null),[D,O]=(0,l.useState)(0);(0,l.useEffect)(()=>{let e=T.current;if(!e)return;let t=new ResizeObserver(([e])=>{O(Math.floor(e.contentRect.height))});return t.observe(e),()=>t.disconnect()},[]),(0,l.useEffect)(()=>{if(!g||!E.current||D===0)return;let t=e.findIndex(e=>e.key===g);if(t===-1)return;let n=E.current,r=t*f,i=r+f;r<n.scrollTop?n.scrollTop=r:i>n.scrollTop+D&&(n.scrollTop=i-D)},[g,e,D]);let k=e.filter(e=>!e.disabled).map(e=>e.key),A=h.filter(e=>k.includes(e)),j=k.length>0&&A.length===k.length,M=A.length>0&&A.length<k.length,N=g&&e.some(e=>e.key===g)?`${a}-${r}-option-${g}`:void 0,P=e.length>=p&&D>0,F=(t,n)=>(0,d.jsx)(i.BaseListItem,{id:`${a}-${r}-option-${t.key}`,className:(0,u.default)(c.default.item,g===t.key&&c.default.active),disabled:m||t.disabled,active:g===t.key,onClick:()=>{t.disabled||(_(t.key),v(t.key))},role:`option`,"aria-selected":h.includes(t.key),"aria-disabled":m||t.disabled,"aria-setsize":P?e.length:void 0,"aria-posinset":P?n+1:void 0,icon:(0,d.jsx)(`div`,{className:(0,u.default)(c.default.checkboxVisual,h.includes(t.key)&&c.default.checked,(m||t.disabled)&&c.default.disabled),"aria-hidden":`true`}),children:t.title},t.key),I=typeof n==`string`?n:``;return(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.list,S),children:[(0,d.jsxs)(`div`,{className:c.default.header,children:[(0,d.jsx)(o.Checkbox,{checked:j,indeterminate:M,onChange:()=>y(k,r),disabled:m||k.length===0,children:(0,d.jsx)(`span`,{className:c.default.headerTitle,title:I,children:n})}),(0,d.jsxs)(`span`,{className:c.default.headerCount,children:[A.length,`/`,e.length]})]}),(0,d.jsx)(`div`,{ref:T,className:c.default.body,role:e.length>0?`listbox`:`group`,"aria-multiselectable":e.length>0?`true`:void 0,"aria-label":I,"aria-activedescendant":e.length>0?N:void 0,"aria-disabled":m||void 0,tabIndex:e.length===0?-1:0,onKeyDown:t=>b(t,r,e),onFocus:()=>{if(!g){let t=e.find(e=>!e.disabled);t&&_(t.key)}},style:P?{overflow:`hidden`,padding:0}:void 0,children:e.length===0?(0,d.jsx)(`div`,{className:c.default.empty,"aria-live":`polite`,children:w}):P?(0,d.jsx)(s.VirtualList,{items:e,itemHeight:f,height:D,renderItem:F,itemRole:`none`,ref:E,role:`presentation`}):e.map((e,t)=>F(e,t))})]})},h=({dataSource:e=[],targetKeys:i,onChange:o,titles:s,className:f,style:p,disabled:h=!1,label:g,error:_,required:v,layout:y=`vertical`,labels:b={}})=>{let{t:x}=t.useWimTranslation(`form`),S=s??[x(`transfer.source`),x(`transfer.target`)],{moveToTarget:C=x(`transfer.move_to_target`),moveToSource:w=x(`transfer.move_to_source`),statusMovedToTarget:T=e=>x(`transfer.status_moved_to_target`,{count:e}),statusMovedToSource:E=e=>x(`transfer.status_moved_to_source`,{count:e})}=b,[D,O]=(0,l.useState)([]),[k,A]=(0,l.useState)(i||[]),j=`wim-transfer-${(0,l.useId)()}`,M=g?`${j}-label`:void 0,N=_?`${j}-error`:void 0,P=i!==void 0&&!!o,F=P?i:k,I=(0,l.useMemo)(()=>e.filter(e=>!F.includes(e.key)),[e,F]),L=(0,l.useMemo)(()=>e.filter(e=>F.includes(e.key)),[e,F]),[R,z]=(0,l.useState)(null),[B,V]=(0,l.useState)(null),[H,U]=(0,l.useState)(``),W=(0,l.useRef)(null);R&&!I.some(e=>e.key===R)&&z(null),B&&!L.some(e=>e.key===B)&&V(null);let G=e=>{h||O(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},K=(e,t)=>{if(h)return;let n=e;n.every(e=>D.includes(e))?O(e=>e.filter(e=>!n.includes(e))):O(e=>[...new Set([...e,...n])])},q=e=>{if(h)return;let t=e===`toRight`?I.map(e=>e.key):L.map(e=>e.key),n=D.filter(e=>t.includes(e));if(n.length===0)return;let r=e===`toRight`?[...F,...n]:F.filter(e=>!n.includes(e));P||A(r),o&&o(r,e,n),O(e=>e.filter(e=>!n.includes(e)));let i=e===`toRight`?T(n.length):E(n.length);W.current&&clearTimeout(W.current),U(``),W.current=setTimeout(()=>U(i),50)},J=(e,t,n)=>{let r=e.filter(e=>!e.disabled);if(r.length===0)return null;if(t===null)return n===1?r[0].key:r[r.length-1].key;let i=r.findIndex(e=>e.key===t);return i===-1?r[0].key:r[(i+n+r.length)%r.length].key},Y=(e,t,n)=>{if(h)return;let r=t===`source`?R:B,i=t===`source`?z:V;if(e.key===`ArrowDown`)e.preventDefault(),i(J(n,r,1));else if(e.key===`ArrowUp`)e.preventDefault(),i(J(n,r,-1));else if(e.key===`Home`){e.preventDefault();let t=n.find(e=>!e.disabled);t&&i(t.key)}else if(e.key===`End`){e.preventDefault();let t=[...n].reverse().find(e=>!e.disabled);t&&i(t.key)}else if(e.key===` `){e.preventDefault();let t=n.find(e=>e.key===r);t&&!t.disabled&&G(t.key)}else e.key===`Enter`&&(e.preventDefault(),q(t===`source`?`toRight`:`toLeft`))},X=D.filter(e=>I.some(t=>t.key===e)).length===0,Z=D.filter(e=>L.some(t=>t.key===e)).length===0;return(0,d.jsx)(a.FieldTemplate,{label:g,error:_,required:v,layout:y,labelId:M,errorId:N,className:f,children:(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.container,`wim-transfer`),children:[(0,d.jsx)(n.VisuallyHidden,{"aria-live":`polite`,"aria-atomic":`true`,children:H}),(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.root,h&&c.default.disabled),style:p,role:`group`,"aria-labelledby":g?M:void 0,"aria-describedby":N,children:[(0,d.jsx)(m,{className:`wim-transfer__list`,data:I,title:S[0],listType:`source`,id:j,disabled:h,selectedKeys:D,focusedKey:R,setFocusedKey:z,onSelect:G,onSelectAll:K,onKeyDown:Y,labels:b}),(0,d.jsxs)(`div`,{className:(0,u.default)(c.default.operation,`wim-transfer__operation`),children:[(0,d.jsx)(r.Button,{variant:`outline`,size:`sm`,className:c.default.button,onClick:()=>q(`toRight`),disabled:h||X,icon:`ChevronRightIcon`,"aria-label":C}),(0,d.jsx)(r.Button,{variant:`outline`,size:`sm`,className:c.default.button,onClick:()=>q(`toLeft`),disabled:h||Z,icon:`ChevronLeftIcon`,"aria-label":w})]}),(0,d.jsx)(m,{className:`wim-transfer__list`,data:L,title:S[1],listType:`target`,id:j,disabled:h,selectedKeys:D,focusedKey:B,setFocusedKey:V,onSelect:G,onSelectAll:K,onKeyDown:Y,labels:b})]})]})})};exports.Transfer=h;

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

@@ -41,4 +41,4 @@ export type TransferProps = {
 /**
  * 2つのカラム間でアイテムを移動させて選択を行うためのコンポーネント。
  */
-export declare const Transfer: ({ dataSource, targetKeys, onChange, titles, className, style, disabled, label, error, required, layout, labels, }: TransferProps) => React.JSX.Element;
+export declare const Transfer: ({ dataSource, targetKeys, onChange, titles: titlesProp, className, style, disabled, label, error, required, layout, labels, }: TransferProps) => React.JSX.Element;

package/dist/components/form/Transfer/Transfer.js

@@ -11,130 +11,130 @@ import { useEffect as c, useId as l, useMemo as u, useRef as d, useState as f }
 import p from "classnames";
 import { jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region src/components/form/Transfer/Transfer.tsx
-var g = 36, _ = 50, v = ({ data: e, title: t, listType: n, id: i, disabled: l, selectedKeys: u, focusedKey: v, setFocusedKey: y, onSelect: b, onSelectAll: x, onKeyDown: S, labels: C = {}, className: w }) => {
-	let { noData: T = "No Data" } = C, E = d(null), D = d(null), [O, k] = f(0);
+var g = 36, _ = 50, v = ({ data: t, title: n, listType: i, id: l, disabled: u, selectedKeys: v, focusedKey: y, setFocusedKey: b, onSelect: x, onSelectAll: S, onKeyDown: C, labels: w = {}, className: T }) => {
+	let { t: E } = e("form"), { noData: D = E("transfer.no_data") } = w, O = d(null), k = d(null), [A, j] = f(0);
 	c(() => {
-		let e = E.current;
+		let e = O.current;
 		if (!e) return;
 		let t = new ResizeObserver(([e]) => {
-			k(Math.floor(e.contentRect.height));
+			j(Math.floor(e.contentRect.height));
 		});
 		return t.observe(e), () => t.disconnect();
 	}, []), c(() => {
-		if (!v || !D.current || O === 0) return;
-		let t = e.findIndex((e) => e.key === v);
-		if (t === -1) return;
-		let n = D.current, r = t * g, i = r + g;
-		r < n.scrollTop ? n.scrollTop = r : i > n.scrollTop + O && (n.scrollTop = i - O);
+		if (!y || !k.current || A === 0) return;
+		let e = t.findIndex((e) => e.key === y);
+		if (e === -1) return;
+		let n = k.current, r = e * g, i = r + g;
+		r < n.scrollTop ? n.scrollTop = r : i > n.scrollTop + A && (n.scrollTop = i - A);
 	}, [
-		v,
-		e,
-		O
+		y,
+		t,
+		A
 	]);
-	let A = e.filter((e) => !e.disabled).map((e) => e.key), j = u.filter((e) => A.includes(e)), M = A.length > 0 && j.length === A.length, N = j.length > 0 && j.length < A.length, P = v && e.some((e) => e.key === v) ? `${i}-${n}-option-${v}` : void 0, F = e.length >= _ && O > 0, I = (t, a) => /* @__PURE__ */ m(r, {
-		id: `${i}-${n}-option-${t.key}`,
-		className: p(s.item, v === t.key && s.active),
-		disabled: l || t.disabled,
-		active: v === t.key,
+	let M = t.filter((e) => !e.disabled).map((e) => e.key), N = v.filter((e) => M.includes(e)), P = M.length > 0 && N.length === M.length, F = N.length > 0 && N.length < M.length, I = y && t.some((e) => e.key === y) ? `${l}-${i}-option-${y}` : void 0, L = t.length >= _ && A > 0, R = (e, n) => /* @__PURE__ */ m(r, {
+		id: `${l}-${i}-option-${e.key}`,
+		className: p(s.item, y === e.key && s.active),
+		disabled: u || e.disabled,
+		active: y === e.key,
 		onClick: () => {
-			t.disabled || (y(t.key), b(t.key));
+			e.disabled || (b(e.key), x(e.key));
 		},
 		role: "option",
-		"aria-selected": u.includes(t.key),
-		"aria-disabled": l || t.disabled,
-		"aria-setsize": F ? e.length : void 0,
-		"aria-posinset": F ? a + 1 : void 0,
+		"aria-selected": v.includes(e.key),
+		"aria-disabled": u || e.disabled,
+		"aria-setsize": L ? t.length : void 0,
+		"aria-posinset": L ? n + 1 : void 0,
 		icon: /* @__PURE__ */ m("div", {
-			className: p(s.checkboxVisual, u.includes(t.key) && s.checked, (l || t.disabled) && s.disabled),
+			className: p(s.checkboxVisual, v.includes(e.key) && s.checked, (u || e.disabled) && s.disabled),
 			"aria-hidden": "true"
 		}),
-		children: t.title
-	}, t.key), L = typeof t == "string" ? t : "";
+		children: e.title
+	}, e.key), z = typeof n == "string" ? n : "";
 	return /* @__PURE__ */ h("div", {
-		className: p(s.list, w),
+		className: p(s.list, T),
 		children: [/* @__PURE__ */ h("div", {
 			className: s.header,
 			children: [/* @__PURE__ */ m(a, {
-				checked: M,
-				indeterminate: N,
-				onChange: () => x(A, n),
-				disabled: l || A.length === 0,
+				checked: P,
+				indeterminate: F,
+				onChange: () => S(M, i),
+				disabled: u || M.length === 0,
 				children: /* @__PURE__ */ m("span", {
 					className: s.headerTitle,
-					title: L,
-					children: t
+					title: z,
+					children: n
 				})
 			}), /* @__PURE__ */ h("span", {
 				className: s.headerCount,
 				children: [
-					j.length,
+					N.length,
 					"/",
-					e.length
+					t.length
 				]
 			})]
 		}), /* @__PURE__ */ m("div", {
-			ref: E,
+			ref: O,
 			className: s.body,
-			role: e.length > 0 ? "listbox" : "group",
-			"aria-multiselectable": e.length > 0 ? "true" : void 0,
-			"aria-label": L,
-			"aria-activedescendant": e.length > 0 ? P : void 0,
-			"aria-disabled": l || void 0,
-			tabIndex: e.length === 0 ? -1 : 0,
-			onKeyDown: (t) => S(t, n, e),
+			role: t.length > 0 ? "listbox" : "group",
+			"aria-multiselectable": t.length > 0 ? "true" : void 0,
+			"aria-label": z,
+			"aria-activedescendant": t.length > 0 ? I : void 0,
+			"aria-disabled": u || void 0,
+			tabIndex: t.length === 0 ? -1 : 0,
+			onKeyDown: (e) => C(e, i, t),
 			onFocus: () => {
-				if (!v) {
-					let t = e.find((e) => !e.disabled);
-					t && y(t.key);
+				if (!y) {
+					let e = t.find((e) => !e.disabled);
+					e && b(e.key);
 				}
 			},
-			style: F ? {
+			style: L ? {
 				overflow: "hidden",
 				padding: 0
 			} : void 0,
-			children: e.length === 0 ? /* @__PURE__ */ m("div", {
+			children: t.length === 0 ? /* @__PURE__ */ m("div", {
 				className: s.empty,
 				"aria-live": "polite",
-				children: T
-			}) : F ? /* @__PURE__ */ m(o, {
-				items: e,
+				children: D
+			}) : L ? /* @__PURE__ */ m(o, {
+				items: t,
 				itemHeight: g,
-				height: O,
-				renderItem: I,
+				height: A,
+				renderItem: R,
 				itemRole: "none",
-				ref: D,
+				ref: k,
 				role: "presentation"
-			}) : e.map((e, t) => I(e, t))
+			}) : t.map((e, t) => R(e, t))
 		})]
 	});
-}, y = ({ dataSource: r = [], targetKeys: a, onChange: o, titles: c = ["Source", "Target"], className: g, style: _, disabled: y = !1, label: b, error: x, required: S, layout: C = "vertical", labels: w = {} }) => {
-	let { t: T } = e("form"), { moveToTarget: E = T("transfer.move_to_target"), moveToSource: D = T("transfer.move_to_source"), statusMovedToTarget: O = (e) => T("transfer.status_moved_to_target", { count: e }), statusMovedToSource: k = (e) => T("transfer.status_moved_to_source", { count: e }) } = w, [A, j] = f([]), [M, N] = f(a || []), P = `wim-transfer-${l()}`, F = b ? `${P}-label` : void 0, I = x ? `${P}-error` : void 0, L = a !== void 0 && !!o, R = L ? a : M, z = u(() => r.filter((e) => !R.includes(e.key)), [r, R]), B = u(() => r.filter((e) => R.includes(e.key)), [r, R]), [V, H] = f(null), [U, W] = f(null), [G, K] = f(""), q = d(null);
-	V && !z.some((e) => e.key === V) && H(null), U && !B.some((e) => e.key === U) && W(null);
-	let J = (e) => {
-		y || j((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
-	}, Y = (e, t) => {
+}, y = ({ dataSource: r = [], targetKeys: a, onChange: o, titles: c, className: g, style: _, disabled: y = !1, label: b, error: x, required: S, layout: C = "vertical", labels: w = {} }) => {
+	let { t: T } = e("form"), E = c ?? [T("transfer.source"), T("transfer.target")], { moveToTarget: D = T("transfer.move_to_target"), moveToSource: O = T("transfer.move_to_source"), statusMovedToTarget: k = (e) => T("transfer.status_moved_to_target", { count: e }), statusMovedToSource: A = (e) => T("transfer.status_moved_to_source", { count: e }) } = w, [j, M] = f([]), [N, P] = f(a || []), F = `wim-transfer-${l()}`, I = b ? `${F}-label` : void 0, L = x ? `${F}-error` : void 0, R = a !== void 0 && !!o, z = R ? a : N, B = u(() => r.filter((e) => !z.includes(e.key)), [r, z]), V = u(() => r.filter((e) => z.includes(e.key)), [r, z]), [H, U] = f(null), [W, G] = f(null), [K, q] = f(""), J = d(null);
+	H && !B.some((e) => e.key === H) && U(null), W && !V.some((e) => e.key === W) && G(null);
+	let Y = (e) => {
+		y || M((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
+	}, X = (e, t) => {
 		if (y) return;
 		let n = e;
-		n.every((e) => A.includes(e)) ? j((e) => e.filter((e) => !n.includes(e))) : j((e) => [.../* @__PURE__ */ new Set([...e, ...n])]);
-	}, X = (e) => {
+		n.every((e) => j.includes(e)) ? M((e) => e.filter((e) => !n.includes(e))) : M((e) => [.../* @__PURE__ */ new Set([...e, ...n])]);
+	}, Z = (e) => {
 		if (y) return;
-		let t = e === "toRight" ? z.map((e) => e.key) : B.map((e) => e.key), n = A.filter((e) => t.includes(e));
+		let t = e === "toRight" ? B.map((e) => e.key) : V.map((e) => e.key), n = j.filter((e) => t.includes(e));
 		if (n.length === 0) return;
-		let r = e === "toRight" ? [...R, ...n] : R.filter((e) => !n.includes(e));
-		L || N(r), o && o(r, e, n), j((e) => e.filter((e) => !n.includes(e)));
-		let i = e === "toRight" ? O(n.length) : k(n.length);
-		q.current && clearTimeout(q.current), K(""), q.current = setTimeout(() => K(i), 50);
-	}, Z = (e, t, n) => {
+		let r = e === "toRight" ? [...z, ...n] : z.filter((e) => !n.includes(e));
+		R || P(r), o && o(r, e, n), M((e) => e.filter((e) => !n.includes(e)));
+		let i = e === "toRight" ? k(n.length) : A(n.length);
+		J.current && clearTimeout(J.current), q(""), J.current = setTimeout(() => q(i), 50);
+	}, Q = (e, t, n) => {
 		let r = e.filter((e) => !e.disabled);
 		if (r.length === 0) return null;
 		if (t === null) return n === 1 ? r[0].key : r[r.length - 1].key;
 		let i = r.findIndex((e) => e.key === t);
 		return i === -1 ? r[0].key : r[(i + n + r.length) % r.length].key;
-	}, Q = (e, t, n) => {
+	}, $ = (e, t, n) => {
 		if (y) return;
-		let r = t === "source" ? V : U, i = t === "source" ? H : W;
-		if (e.key === "ArrowDown") e.preventDefault(), i(Z(n, r, 1));
-		else if (e.key === "ArrowUp") e.preventDefault(), i(Z(n, r, -1));
+		let r = t === "source" ? H : W, i = t === "source" ? U : G;
+		if (e.key === "ArrowDown") e.preventDefault(), i(Q(n, r, 1));
+		else if (e.key === "ArrowUp") e.preventDefault(), i(Q(n, r, -1));
 		else if (e.key === "Home") {
 			e.preventDefault();
 			let t = n.find((e) => !e.disabled);
@@ -146,43 +146,43 @@ var g = 36, _ = 50, v = ({ data: e, title: t, listType: n, id: i, disabled: l, s
 		} else if (e.key === " ") {
 			e.preventDefault();
 			let t = n.find((e) => e.key === r);
-			t && !t.disabled && J(t.key);
-		} else e.key === "Enter" && (e.preventDefault(), X(t === "source" ? "toRight" : "toLeft"));
-	}, $ = A.filter((e) => z.some((t) => t.key === e)).length === 0, ee = A.filter((e) => B.some((t) => t.key === e)).length === 0;
+			t && !t.disabled && Y(t.key);
+		} else e.key === "Enter" && (e.preventDefault(), Z(t === "source" ? "toRight" : "toLeft"));
+	}, ee = j.filter((e) => B.some((t) => t.key === e)).length === 0, te = j.filter((e) => V.some((t) => t.key === e)).length === 0;
 	return /* @__PURE__ */ m(i, {
 		label: b,
 		error: x,
 		required: S,
 		layout: C,
-		labelId: F,
-		errorId: I,
+		labelId: I,
+		errorId: L,
 		className: g,
 		children: /* @__PURE__ */ h("div", {
 			className: p(s.container, "wim-transfer"),
 			children: [/* @__PURE__ */ m(t, {
 				"aria-live": "polite",
 				"aria-atomic": "true",
-				children: G
+				children: K
 			}), /* @__PURE__ */ h("div", {
 				className: p(s.root, y && s.disabled),
 				style: _,
 				role: "group",
-				"aria-labelledby": b ? F : void 0,
-				"aria-describedby": I,
+				"aria-labelledby": b ? I : void 0,
+				"aria-describedby": L,
 				children: [
 					/* @__PURE__ */ m(v, {
 						className: "wim-transfer__list",
-						data: z,
-						title: c[0],
+						data: B,
+						title: E[0],
 						listType: "source",
-						id: P,
+						id: F,
 						disabled: y,
-						selectedKeys: A,
-						focusedKey: V,
-						setFocusedKey: H,
-						onSelect: J,
-						onSelectAll: Y,
-						onKeyDown: Q,
+						selectedKeys: j,
+						focusedKey: H,
+						setFocusedKey: U,
+						onSelect: Y,
+						onSelectAll: X,
+						onKeyDown: $,
 						labels: w
 					}),
 					/* @__PURE__ */ h("div", {
@@ -191,33 +191,33 @@ var g = 36, _ = 50, v = ({ data: e, title: t, listType: n, id: i, disabled: l, s
 							variant: "outline",
 							size: "sm",
 							className: s.button,
-							onClick: () => X("toRight"),
-							disabled: y || $,
+							onClick: () => Z("toRight"),
+							disabled: y || ee,
 							icon: "ChevronRightIcon",
-							"aria-label": E
+							"aria-label": D
 						}), /* @__PURE__ */ m(n, {
 							variant: "outline",
 							size: "sm",
 							className: s.button,
-							onClick: () => X("toLeft"),
-							disabled: y || ee,
+							onClick: () => Z("toLeft"),
+							disabled: y || te,
 							icon: "ChevronLeftIcon",
-							"aria-label": D
+							"aria-label": O
 						})]
 					}),
 					/* @__PURE__ */ m(v, {
 						className: "wim-transfer__list",
-						data: B,
-						title: c[1],
+						data: V,
+						title: E[1],
 						listType: "target",
-						id: P,
+						id: F,
 						disabled: y,
-						selectedKeys: A,
-						focusedKey: U,
-						setFocusedKey: W,
-						onSelect: J,
-						onSelectAll: Y,
-						onKeyDown: Q,
+						selectedKeys: j,
+						focusedKey: W,
+						setFocusedKey: G,
+						onSelect: Y,
+						onSelectAll: X,
+						onKeyDown: $,
 						labels: w
 					})
 				]

package/dist/components/form/Transfer/transfer.module.cjs

@@ -1,2 +1,2 @@
 "use client";
-var e=`_container_1ag4c_342`,t=`_root_1ag4c_351`,n=`_list_1ag4c_370`,r=`_header_1ag4c_398`,i=`_headerTitle_1ag4c_413`,a=`_disabled_1ag4c_419`,o=`_headerCount_1ag4c_428`,s=`_body_1ag4c_438`,c=`_itemList_1ag4c_478`,l=`_item_1ag4c_478`,u=`_checkboxVisual_1ag4c_490`,d=`_checked_1ag4c_516`,f=`_active_1ag4c_532`,p=`_operation_1ag4c_544`,m=`_button_1ag4c_556`,h=`_empty_1ag4c_563`,g={"wim-docs-container":`_wim-docs-container_1ag4c_87`,"wim-t":`_wim-t_1ag4c_290`,"react-flow":`_react-flow_1ag4c_313`,"react-flow__edges":`_react-flow__edges_1ag4c_314`,"react-flow__connectionline":`_react-flow__connectionline_1ag4c_315`,container:e,root:t,list:n,header:r,headerTitle:i,disabled:a,headerCount:o,body:s,itemList:c,item:l,checkboxVisual:u,checked:d,active:f,operation:p,button:m,empty:h};exports.active=f,exports.body=s,exports.button=m,exports.checkboxVisual=u,exports.checked=d,exports.container=e,exports.default=g,exports.disabled=a,exports.empty=h,exports.header=r,exports.headerCount=o,exports.headerTitle=i,exports.item=l,exports.itemList=c,exports.list=n,exports.operation=p,exports.root=t;
+var e=`_container_1cnlw_342`,t=`_root_1cnlw_351`,n=`_list_1cnlw_370`,r=`_header_1cnlw_398`,i=`_headerTitle_1cnlw_413`,a=`_disabled_1cnlw_419`,o=`_headerCount_1cnlw_428`,s=`_body_1cnlw_438`,c=`_itemList_1cnlw_478`,l=`_item_1cnlw_478`,u=`_checkboxVisual_1cnlw_490`,d=`_checked_1cnlw_516`,f=`_active_1cnlw_532`,p=`_operation_1cnlw_544`,m=`_button_1cnlw_556`,h=`_empty_1cnlw_563`,g={"wim-docs-container":`_wim-docs-container_1cnlw_87`,"wim-t":`_wim-t_1cnlw_290`,"react-flow":`_react-flow_1cnlw_313`,"react-flow__edges":`_react-flow__edges_1cnlw_314`,"react-flow__connectionline":`_react-flow__connectionline_1cnlw_315`,container:e,root:t,list:n,header:r,headerTitle:i,disabled:a,headerCount:o,body:s,itemList:c,item:l,checkboxVisual:u,checked:d,active:f,operation:p,button:m,empty:h};exports.active=f,exports.body=s,exports.button=m,exports.checkboxVisual=u,exports.checked=d,exports.container=e,exports.default=g,exports.disabled=a,exports.empty=h,exports.header=r,exports.headerCount=o,exports.headerTitle=i,exports.item=l,exports.itemList=c,exports.list=n,exports.operation=p,exports.root=t;

package/dist/components/form/Transfer/transfer.module.js

@@ -1,11 +1,11 @@
 "use client";
 //#region src/components/form/Transfer/transfer.module.scss
-var e = "_container_1ag4c_342", t = "_root_1ag4c_351", n = "_list_1ag4c_370", r = "_header_1ag4c_398", i = "_headerTitle_1ag4c_413", a = "_disabled_1ag4c_419", o = "_headerCount_1ag4c_428", s = "_body_1ag4c_438", c = "_itemList_1ag4c_478", l = "_item_1ag4c_478", u = "_checkboxVisual_1ag4c_490", d = "_checked_1ag4c_516", f = "_active_1ag4c_532", p = "_operation_1ag4c_544", m = "_button_1ag4c_556", h = "_empty_1ag4c_563", g = {
-	"wim-docs-container": "_wim-docs-container_1ag4c_87",
-	"wim-t": "_wim-t_1ag4c_290",
-	"react-flow": "_react-flow_1ag4c_313",
-	"react-flow__edges": "_react-flow__edges_1ag4c_314",
-	"react-flow__connectionline": "_react-flow__connectionline_1ag4c_315",
+var e = "_container_1cnlw_342", t = "_root_1cnlw_351", n = "_list_1cnlw_370", r = "_header_1cnlw_398", i = "_headerTitle_1cnlw_413", a = "_disabled_1cnlw_419", o = "_headerCount_1cnlw_428", s = "_body_1cnlw_438", c = "_itemList_1cnlw_478", l = "_item_1cnlw_478", u = "_checkboxVisual_1cnlw_490", d = "_checked_1cnlw_516", f = "_active_1cnlw_532", p = "_operation_1cnlw_544", m = "_button_1cnlw_556", h = "_empty_1cnlw_563", g = {
+	"wim-docs-container": "_wim-docs-container_1cnlw_87",
+	"wim-t": "_wim-t_1cnlw_290",
+	"react-flow": "_react-flow_1cnlw_313",
+	"react-flow__edges": "_react-flow__edges_1cnlw_314",
+	"react-flow__connectionline": "_react-flow__connectionline_1cnlw_315",
 	container: e,
 	root: t,
 	list: n,