wimui 0.51.1 → 0.51.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/ai/ChatUI/ChatUI.cjs +1 -1
- package/dist/components/ai/ChatUI/ChatUI.js +10 -10
- package/dist/components/ai/ModelSelector/ModelSelector.cjs +1 -1
- package/dist/components/ai/ModelSelector/ModelSelector.js +121 -120
- package/dist/components/ai/ThreadList/ThreadList.cjs +1 -1
- package/dist/components/ai/ThreadList/ThreadList.js +63 -62
- package/dist/components/data-display/Accordion/accordion.module.cjs +1 -1
- package/dist/components/data-display/Accordion/accordion.module.js +1 -1
- package/dist/components/data-display/Carousel/Carousel.cjs +1 -1
- package/dist/components/data-display/Carousel/Carousel.js +46 -46
- package/dist/components/data-display/NodeGraph/NodeGraph.cjs +1 -1
- package/dist/components/data-display/NodeGraph/NodeGraph.js +48 -48
- package/dist/components/data-display/ScheduleView/ScheduleView.cjs +1 -1
- package/dist/components/data-display/ScheduleView/ScheduleView.js +49 -48
- package/dist/components/feedback/Tour/Tour.cjs +1 -1
- package/dist/components/feedback/Tour/Tour.js +125 -100
- package/dist/components/form/OtpInput/otp-input.module.cjs +1 -1
- package/dist/components/form/OtpInput/otp-input.module.js +1 -1
- package/dist/components/form/RangeSlider/RangeSlider.cjs +1 -1
- package/dist/components/form/RangeSlider/RangeSlider.js +116 -115
- package/dist/components/form/RangeSlider/range-slider.module.cjs +1 -1
- package/dist/components/form/RangeSlider/range-slider.module.js +1 -1
- package/dist/components/form/ThemeToggle/ThemeToggle.cjs +1 -1
- package/dist/components/form/ThemeToggle/ThemeToggle.js +66 -65
- package/dist/components/form/Transfer/Transfer.cjs +1 -1
- package/dist/components/form/Transfer/Transfer.d.ts +1 -1
- package/dist/components/form/Transfer/Transfer.js +104 -104
- package/dist/components/form/Transfer/transfer.module.cjs +1 -1
- package/dist/components/form/Transfer/transfer.module.js +6 -6
- package/dist/components/media/Audio/Audio.cjs +1 -1
- package/dist/components/media/Audio/Audio.js +45 -45
- package/dist/components/media/Audio/components/AudioCustomControls.cjs +1 -1
- package/dist/components/media/Audio/components/AudioCustomControls.js +113 -112
- package/dist/components/media/ImageCompare/ImageCompare.cjs +1 -1
- package/dist/components/media/ImageCompare/ImageCompare.js +73 -72
- package/dist/components/media/Video/Video.cjs +1 -1
- package/dist/components/media/Video/Video.js +36 -35
- package/dist/components/media/Video/components/VideoAdvancedMenu.cjs +1 -1
- package/dist/components/media/Video/components/VideoAdvancedMenu.js +138 -137
- package/dist/components/navigation/Tabs/tabs.module.cjs +1 -1
- package/dist/components/navigation/Tabs/tabs.module.js +1 -1
- package/dist/i18n/generated/keys.d.ts +1 -1
- package/dist/i18n/generated/resources.cjs +1 -1
- package/dist/i18n/generated/resources.js +192 -12
- package/dist/llms-full.txt +4 -4
- package/dist/llms.txt +1 -1
- package/dist/locales/en/common.json +53 -4
- package/dist/locales/en/components.json +3 -1
- package/dist/locales/ja/common.json +53 -4
- package/dist/locales/ja/components.json +3 -1
- package/dist/locales/pt/common.json +53 -4
- package/dist/locales/pt/components.json +3 -1
- package/dist/styles.css +2 -2
- package/dist/wimui.umd.css +1 -1
- package/dist/wimui.umd.js +3 -3
- package/package.json +7 -7
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../node_modules/@radix-ui/react-slot/dist/index.cjs"),n=require("../../../icon/monitor.cjs"),
|
|
2
|
+
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;
|
|
@@ -1,82 +1,83 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { Root as e, Slottable as t } from "../../../node_modules/@radix-ui/react-slot/dist/index.js";
|
|
3
|
-
import n from "../../../
|
|
4
|
-
import r from "../../../icon/
|
|
5
|
-
import i from "../../../icon/
|
|
6
|
-
import
|
|
7
|
-
import {
|
|
8
|
-
import s from "
|
|
9
|
-
import c
|
|
10
|
-
import f from "
|
|
11
|
-
import
|
|
3
|
+
import { useWimTranslation as n } from "../../../i18n/useWimTranslation.js";
|
|
4
|
+
import r from "../../../icon/monitor.js";
|
|
5
|
+
import i from "../../../icon/moon.js";
|
|
6
|
+
import a from "../../../icon/sun.js";
|
|
7
|
+
import { Icon as o } from "../../media/Icon/Icon.js";
|
|
8
|
+
import { setWimTheme as s } from "../../../theme.js";
|
|
9
|
+
import c from "./theme-toggle.module.js";
|
|
10
|
+
import l, { useCallback as u, useEffect as d, useState as f } from "react";
|
|
11
|
+
import p from "classnames";
|
|
12
|
+
import { jsx as m, jsxs as h } from "react/jsx-runtime";
|
|
12
13
|
//#region src/components/form/ThemeToggle/ThemeToggle.tsx
|
|
13
|
-
var
|
|
14
|
-
light:
|
|
15
|
-
dark:
|
|
16
|
-
system:
|
|
17
|
-
},
|
|
18
|
-
let { light:
|
|
19
|
-
light:
|
|
20
|
-
dark:
|
|
21
|
-
system:
|
|
22
|
-
},
|
|
23
|
-
if (typeof window < "u" &&
|
|
24
|
-
let e = window.localStorage.getItem(
|
|
25
|
-
if (
|
|
14
|
+
var g = {
|
|
15
|
+
light: a,
|
|
16
|
+
dark: i,
|
|
17
|
+
system: r
|
|
18
|
+
}, _ = "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) => {
|
|
19
|
+
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 = {
|
|
20
|
+
light: A,
|
|
21
|
+
dark: j,
|
|
22
|
+
system: M
|
|
23
|
+
}, F = r !== void 0, [I, L] = f(() => {
|
|
24
|
+
if (typeof window < "u" && x) {
|
|
25
|
+
let e = window.localStorage.getItem(x);
|
|
26
|
+
if (v(e) && l.includes(e)) return e;
|
|
26
27
|
}
|
|
27
|
-
return
|
|
28
|
-
}),
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
}, [
|
|
32
|
-
let
|
|
33
|
-
|
|
28
|
+
return l.includes(i) ? i : l[0];
|
|
29
|
+
}), R = F ? r : I;
|
|
30
|
+
d(() => {
|
|
31
|
+
S && s(R);
|
|
32
|
+
}, [R, S]);
|
|
33
|
+
let z = u((e) => {
|
|
34
|
+
F || L(e), typeof window < "u" && x && window.localStorage.setItem(x, e), a?.(e);
|
|
34
35
|
}, [
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
]),
|
|
39
|
-
let e =
|
|
40
|
-
|
|
41
|
-
},
|
|
42
|
-
return
|
|
43
|
-
ref:
|
|
36
|
+
F,
|
|
37
|
+
x,
|
|
38
|
+
a
|
|
39
|
+
]), B = () => {
|
|
40
|
+
let e = l[(l.indexOf(R) + 1) % l.length];
|
|
41
|
+
z(e);
|
|
42
|
+
}, V = T ? e : "div";
|
|
43
|
+
return y === "segmented" ? /* @__PURE__ */ h(V, {
|
|
44
|
+
ref: O,
|
|
44
45
|
role: "group",
|
|
45
|
-
"aria-label":
|
|
46
|
-
className:
|
|
47
|
-
...
|
|
48
|
-
children: [
|
|
49
|
-
let t = e ===
|
|
50
|
-
return /* @__PURE__ */
|
|
46
|
+
"aria-label": N,
|
|
47
|
+
className: p(c.segmented, c[b], w),
|
|
48
|
+
...D,
|
|
49
|
+
children: [l.map((e) => {
|
|
50
|
+
let t = e === R;
|
|
51
|
+
return /* @__PURE__ */ m("button", {
|
|
51
52
|
type: "button",
|
|
52
|
-
className:
|
|
53
|
+
className: p(c.segment, t && c.active),
|
|
53
54
|
"aria-pressed": t,
|
|
54
|
-
"aria-label":
|
|
55
|
-
title:
|
|
56
|
-
onClick: () =>
|
|
57
|
-
children: /* @__PURE__ */
|
|
58
|
-
component:
|
|
55
|
+
"aria-label": P[e],
|
|
56
|
+
title: P[e],
|
|
57
|
+
onClick: () => z(e),
|
|
58
|
+
children: /* @__PURE__ */ m(o, {
|
|
59
|
+
component: g[e],
|
|
59
60
|
size: "sm"
|
|
60
61
|
})
|
|
61
62
|
}, e);
|
|
62
|
-
}), /* @__PURE__ */
|
|
63
|
-
}) : /* @__PURE__ */
|
|
64
|
-
ref:
|
|
65
|
-
className:
|
|
66
|
-
...
|
|
67
|
-
children: [/* @__PURE__ */
|
|
63
|
+
}), /* @__PURE__ */ m(t, { children: E })]
|
|
64
|
+
}) : /* @__PURE__ */ h(V, {
|
|
65
|
+
ref: O,
|
|
66
|
+
className: p("wim-theme-toggle", c.root, w),
|
|
67
|
+
...D,
|
|
68
|
+
children: [/* @__PURE__ */ m("button", {
|
|
68
69
|
type: "button",
|
|
69
|
-
className:
|
|
70
|
-
"aria-label": `${
|
|
71
|
-
title:
|
|
72
|
-
onClick:
|
|
73
|
-
children: /* @__PURE__ */
|
|
74
|
-
component:
|
|
70
|
+
className: p(c.iconButton, c[b]),
|
|
71
|
+
"aria-label": `${N} (${P[R]})`,
|
|
72
|
+
title: P[R],
|
|
73
|
+
onClick: B,
|
|
74
|
+
children: /* @__PURE__ */ m(o, {
|
|
75
|
+
component: g[R],
|
|
75
76
|
size: "sm"
|
|
76
77
|
})
|
|
77
|
-
}), /* @__PURE__ */
|
|
78
|
+
}), /* @__PURE__ */ m(t, { children: E })]
|
|
78
79
|
});
|
|
79
80
|
});
|
|
80
|
-
|
|
81
|
+
y.displayName = "ThemeToggle";
|
|
81
82
|
//#endregion
|
|
82
|
-
export {
|
|
83
|
+
export { y as ThemeToggle };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
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:
|
|
2
|
+
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;
|
|
@@ -41,4 +41,4 @@ export type TransferProps = {
|
|
|
41
41
|
/**
|
|
42
42
|
* 2つのカラム間でアイテムを移動させて選択を行うためのコンポーネント。
|
|
43
43
|
*/
|
|
44
|
-
export declare const Transfer: ({ dataSource, targetKeys, onChange, titles, className, style, disabled, label, error, required, layout, labels, }: TransferProps) => React.JSX.Element;
|
|
44
|
+
export declare const Transfer: ({ dataSource, targetKeys, onChange, titles: titlesProp, className, style, disabled, label, error, required, layout, labels, }: TransferProps) => React.JSX.Element;
|
|
@@ -11,130 +11,130 @@ import { useEffect as c, useId as l, useMemo as u, useRef as d, useState as f }
|
|
|
11
11
|
import p from "classnames";
|
|
12
12
|
import { jsx as m, jsxs as h } from "react/jsx-runtime";
|
|
13
13
|
//#region src/components/form/Transfer/Transfer.tsx
|
|
14
|
-
var g = 36, _ = 50, v = ({ data:
|
|
15
|
-
let {
|
|
14
|
+
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 }) => {
|
|
15
|
+
let { t: E } = e("form"), { noData: D = E("transfer.no_data") } = w, O = d(null), k = d(null), [A, j] = f(0);
|
|
16
16
|
c(() => {
|
|
17
|
-
let e =
|
|
17
|
+
let e = O.current;
|
|
18
18
|
if (!e) return;
|
|
19
19
|
let t = new ResizeObserver(([e]) => {
|
|
20
|
-
|
|
20
|
+
j(Math.floor(e.contentRect.height));
|
|
21
21
|
});
|
|
22
22
|
return t.observe(e), () => t.disconnect();
|
|
23
23
|
}, []), c(() => {
|
|
24
|
-
if (!
|
|
25
|
-
let
|
|
26
|
-
if (
|
|
27
|
-
let n =
|
|
28
|
-
r < n.scrollTop ? n.scrollTop = r : i > n.scrollTop +
|
|
24
|
+
if (!y || !k.current || A === 0) return;
|
|
25
|
+
let e = t.findIndex((e) => e.key === y);
|
|
26
|
+
if (e === -1) return;
|
|
27
|
+
let n = k.current, r = e * g, i = r + g;
|
|
28
|
+
r < n.scrollTop ? n.scrollTop = r : i > n.scrollTop + A && (n.scrollTop = i - A);
|
|
29
29
|
}, [
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
30
|
+
y,
|
|
31
|
+
t,
|
|
32
|
+
A
|
|
33
33
|
]);
|
|
34
|
-
let
|
|
35
|
-
id: `${
|
|
36
|
-
className: p(s.item,
|
|
37
|
-
disabled:
|
|
38
|
-
active:
|
|
34
|
+
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, {
|
|
35
|
+
id: `${l}-${i}-option-${e.key}`,
|
|
36
|
+
className: p(s.item, y === e.key && s.active),
|
|
37
|
+
disabled: u || e.disabled,
|
|
38
|
+
active: y === e.key,
|
|
39
39
|
onClick: () => {
|
|
40
|
-
|
|
40
|
+
e.disabled || (b(e.key), x(e.key));
|
|
41
41
|
},
|
|
42
42
|
role: "option",
|
|
43
|
-
"aria-selected":
|
|
44
|
-
"aria-disabled":
|
|
45
|
-
"aria-setsize":
|
|
46
|
-
"aria-posinset":
|
|
43
|
+
"aria-selected": v.includes(e.key),
|
|
44
|
+
"aria-disabled": u || e.disabled,
|
|
45
|
+
"aria-setsize": L ? t.length : void 0,
|
|
46
|
+
"aria-posinset": L ? n + 1 : void 0,
|
|
47
47
|
icon: /* @__PURE__ */ m("div", {
|
|
48
|
-
className: p(s.checkboxVisual,
|
|
48
|
+
className: p(s.checkboxVisual, v.includes(e.key) && s.checked, (u || e.disabled) && s.disabled),
|
|
49
49
|
"aria-hidden": "true"
|
|
50
50
|
}),
|
|
51
|
-
children:
|
|
52
|
-
},
|
|
51
|
+
children: e.title
|
|
52
|
+
}, e.key), z = typeof n == "string" ? n : "";
|
|
53
53
|
return /* @__PURE__ */ h("div", {
|
|
54
|
-
className: p(s.list,
|
|
54
|
+
className: p(s.list, T),
|
|
55
55
|
children: [/* @__PURE__ */ h("div", {
|
|
56
56
|
className: s.header,
|
|
57
57
|
children: [/* @__PURE__ */ m(a, {
|
|
58
|
-
checked:
|
|
59
|
-
indeterminate:
|
|
60
|
-
onChange: () =>
|
|
61
|
-
disabled:
|
|
58
|
+
checked: P,
|
|
59
|
+
indeterminate: F,
|
|
60
|
+
onChange: () => S(M, i),
|
|
61
|
+
disabled: u || M.length === 0,
|
|
62
62
|
children: /* @__PURE__ */ m("span", {
|
|
63
63
|
className: s.headerTitle,
|
|
64
|
-
title:
|
|
65
|
-
children:
|
|
64
|
+
title: z,
|
|
65
|
+
children: n
|
|
66
66
|
})
|
|
67
67
|
}), /* @__PURE__ */ h("span", {
|
|
68
68
|
className: s.headerCount,
|
|
69
69
|
children: [
|
|
70
|
-
|
|
70
|
+
N.length,
|
|
71
71
|
"/",
|
|
72
|
-
|
|
72
|
+
t.length
|
|
73
73
|
]
|
|
74
74
|
})]
|
|
75
75
|
}), /* @__PURE__ */ m("div", {
|
|
76
|
-
ref:
|
|
76
|
+
ref: O,
|
|
77
77
|
className: s.body,
|
|
78
|
-
role:
|
|
79
|
-
"aria-multiselectable":
|
|
80
|
-
"aria-label":
|
|
81
|
-
"aria-activedescendant":
|
|
82
|
-
"aria-disabled":
|
|
83
|
-
tabIndex:
|
|
84
|
-
onKeyDown: (
|
|
78
|
+
role: t.length > 0 ? "listbox" : "group",
|
|
79
|
+
"aria-multiselectable": t.length > 0 ? "true" : void 0,
|
|
80
|
+
"aria-label": z,
|
|
81
|
+
"aria-activedescendant": t.length > 0 ? I : void 0,
|
|
82
|
+
"aria-disabled": u || void 0,
|
|
83
|
+
tabIndex: t.length === 0 ? -1 : 0,
|
|
84
|
+
onKeyDown: (e) => C(e, i, t),
|
|
85
85
|
onFocus: () => {
|
|
86
|
-
if (!
|
|
87
|
-
let
|
|
88
|
-
|
|
86
|
+
if (!y) {
|
|
87
|
+
let e = t.find((e) => !e.disabled);
|
|
88
|
+
e && b(e.key);
|
|
89
89
|
}
|
|
90
90
|
},
|
|
91
|
-
style:
|
|
91
|
+
style: L ? {
|
|
92
92
|
overflow: "hidden",
|
|
93
93
|
padding: 0
|
|
94
94
|
} : void 0,
|
|
95
|
-
children:
|
|
95
|
+
children: t.length === 0 ? /* @__PURE__ */ m("div", {
|
|
96
96
|
className: s.empty,
|
|
97
97
|
"aria-live": "polite",
|
|
98
|
-
children:
|
|
99
|
-
}) :
|
|
100
|
-
items:
|
|
98
|
+
children: D
|
|
99
|
+
}) : L ? /* @__PURE__ */ m(o, {
|
|
100
|
+
items: t,
|
|
101
101
|
itemHeight: g,
|
|
102
|
-
height:
|
|
103
|
-
renderItem:
|
|
102
|
+
height: A,
|
|
103
|
+
renderItem: R,
|
|
104
104
|
itemRole: "none",
|
|
105
|
-
ref:
|
|
105
|
+
ref: k,
|
|
106
106
|
role: "presentation"
|
|
107
|
-
}) :
|
|
107
|
+
}) : t.map((e, t) => R(e, t))
|
|
108
108
|
})]
|
|
109
109
|
});
|
|
110
|
-
}, y = ({ dataSource: r = [], targetKeys: a, onChange: o, titles: c
|
|
111
|
-
let { t: T } = e("form"), { moveToTarget:
|
|
112
|
-
|
|
113
|
-
let
|
|
114
|
-
y ||
|
|
115
|
-
},
|
|
110
|
+
}, 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 = {} }) => {
|
|
111
|
+
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);
|
|
112
|
+
H && !B.some((e) => e.key === H) && U(null), W && !V.some((e) => e.key === W) && G(null);
|
|
113
|
+
let Y = (e) => {
|
|
114
|
+
y || M((t) => t.includes(e) ? t.filter((t) => t !== e) : [...t, e]);
|
|
115
|
+
}, X = (e, t) => {
|
|
116
116
|
if (y) return;
|
|
117
117
|
let n = e;
|
|
118
|
-
n.every((e) =>
|
|
119
|
-
},
|
|
118
|
+
n.every((e) => j.includes(e)) ? M((e) => e.filter((e) => !n.includes(e))) : M((e) => [.../* @__PURE__ */ new Set([...e, ...n])]);
|
|
119
|
+
}, Z = (e) => {
|
|
120
120
|
if (y) return;
|
|
121
|
-
let t = e === "toRight" ?
|
|
121
|
+
let t = e === "toRight" ? B.map((e) => e.key) : V.map((e) => e.key), n = j.filter((e) => t.includes(e));
|
|
122
122
|
if (n.length === 0) return;
|
|
123
|
-
let r = e === "toRight" ? [...
|
|
124
|
-
|
|
125
|
-
let i = e === "toRight" ?
|
|
126
|
-
|
|
127
|
-
},
|
|
123
|
+
let r = e === "toRight" ? [...z, ...n] : z.filter((e) => !n.includes(e));
|
|
124
|
+
R || P(r), o && o(r, e, n), M((e) => e.filter((e) => !n.includes(e)));
|
|
125
|
+
let i = e === "toRight" ? k(n.length) : A(n.length);
|
|
126
|
+
J.current && clearTimeout(J.current), q(""), J.current = setTimeout(() => q(i), 50);
|
|
127
|
+
}, Q = (e, t, n) => {
|
|
128
128
|
let r = e.filter((e) => !e.disabled);
|
|
129
129
|
if (r.length === 0) return null;
|
|
130
130
|
if (t === null) return n === 1 ? r[0].key : r[r.length - 1].key;
|
|
131
131
|
let i = r.findIndex((e) => e.key === t);
|
|
132
132
|
return i === -1 ? r[0].key : r[(i + n + r.length) % r.length].key;
|
|
133
|
-
},
|
|
133
|
+
}, $ = (e, t, n) => {
|
|
134
134
|
if (y) return;
|
|
135
|
-
let r = t === "source" ?
|
|
136
|
-
if (e.key === "ArrowDown") e.preventDefault(), i(
|
|
137
|
-
else if (e.key === "ArrowUp") e.preventDefault(), i(
|
|
135
|
+
let r = t === "source" ? H : W, i = t === "source" ? U : G;
|
|
136
|
+
if (e.key === "ArrowDown") e.preventDefault(), i(Q(n, r, 1));
|
|
137
|
+
else if (e.key === "ArrowUp") e.preventDefault(), i(Q(n, r, -1));
|
|
138
138
|
else if (e.key === "Home") {
|
|
139
139
|
e.preventDefault();
|
|
140
140
|
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
|
|
|
146
146
|
} else if (e.key === " ") {
|
|
147
147
|
e.preventDefault();
|
|
148
148
|
let t = n.find((e) => e.key === r);
|
|
149
|
-
t && !t.disabled &&
|
|
150
|
-
} else e.key === "Enter" && (e.preventDefault(),
|
|
151
|
-
},
|
|
149
|
+
t && !t.disabled && Y(t.key);
|
|
150
|
+
} else e.key === "Enter" && (e.preventDefault(), Z(t === "source" ? "toRight" : "toLeft"));
|
|
151
|
+
}, ee = j.filter((e) => B.some((t) => t.key === e)).length === 0, te = j.filter((e) => V.some((t) => t.key === e)).length === 0;
|
|
152
152
|
return /* @__PURE__ */ m(i, {
|
|
153
153
|
label: b,
|
|
154
154
|
error: x,
|
|
155
155
|
required: S,
|
|
156
156
|
layout: C,
|
|
157
|
-
labelId:
|
|
158
|
-
errorId:
|
|
157
|
+
labelId: I,
|
|
158
|
+
errorId: L,
|
|
159
159
|
className: g,
|
|
160
160
|
children: /* @__PURE__ */ h("div", {
|
|
161
161
|
className: p(s.container, "wim-transfer"),
|
|
162
162
|
children: [/* @__PURE__ */ m(t, {
|
|
163
163
|
"aria-live": "polite",
|
|
164
164
|
"aria-atomic": "true",
|
|
165
|
-
children:
|
|
165
|
+
children: K
|
|
166
166
|
}), /* @__PURE__ */ h("div", {
|
|
167
167
|
className: p(s.root, y && s.disabled),
|
|
168
168
|
style: _,
|
|
169
169
|
role: "group",
|
|
170
|
-
"aria-labelledby": b ?
|
|
171
|
-
"aria-describedby":
|
|
170
|
+
"aria-labelledby": b ? I : void 0,
|
|
171
|
+
"aria-describedby": L,
|
|
172
172
|
children: [
|
|
173
173
|
/* @__PURE__ */ m(v, {
|
|
174
174
|
className: "wim-transfer__list",
|
|
175
|
-
data:
|
|
176
|
-
title:
|
|
175
|
+
data: B,
|
|
176
|
+
title: E[0],
|
|
177
177
|
listType: "source",
|
|
178
|
-
id:
|
|
178
|
+
id: F,
|
|
179
179
|
disabled: y,
|
|
180
|
-
selectedKeys:
|
|
181
|
-
focusedKey:
|
|
182
|
-
setFocusedKey:
|
|
183
|
-
onSelect:
|
|
184
|
-
onSelectAll:
|
|
185
|
-
onKeyDown:
|
|
180
|
+
selectedKeys: j,
|
|
181
|
+
focusedKey: H,
|
|
182
|
+
setFocusedKey: U,
|
|
183
|
+
onSelect: Y,
|
|
184
|
+
onSelectAll: X,
|
|
185
|
+
onKeyDown: $,
|
|
186
186
|
labels: w
|
|
187
187
|
}),
|
|
188
188
|
/* @__PURE__ */ h("div", {
|
|
@@ -191,33 +191,33 @@ var g = 36, _ = 50, v = ({ data: e, title: t, listType: n, id: i, disabled: l, s
|
|
|
191
191
|
variant: "outline",
|
|
192
192
|
size: "sm",
|
|
193
193
|
className: s.button,
|
|
194
|
-
onClick: () =>
|
|
195
|
-
disabled: y ||
|
|
194
|
+
onClick: () => Z("toRight"),
|
|
195
|
+
disabled: y || ee,
|
|
196
196
|
icon: "ChevronRightIcon",
|
|
197
|
-
"aria-label":
|
|
197
|
+
"aria-label": D
|
|
198
198
|
}), /* @__PURE__ */ m(n, {
|
|
199
199
|
variant: "outline",
|
|
200
200
|
size: "sm",
|
|
201
201
|
className: s.button,
|
|
202
|
-
onClick: () =>
|
|
203
|
-
disabled: y ||
|
|
202
|
+
onClick: () => Z("toLeft"),
|
|
203
|
+
disabled: y || te,
|
|
204
204
|
icon: "ChevronLeftIcon",
|
|
205
|
-
"aria-label":
|
|
205
|
+
"aria-label": O
|
|
206
206
|
})]
|
|
207
207
|
}),
|
|
208
208
|
/* @__PURE__ */ m(v, {
|
|
209
209
|
className: "wim-transfer__list",
|
|
210
|
-
data:
|
|
211
|
-
title:
|
|
210
|
+
data: V,
|
|
211
|
+
title: E[1],
|
|
212
212
|
listType: "target",
|
|
213
|
-
id:
|
|
213
|
+
id: F,
|
|
214
214
|
disabled: y,
|
|
215
|
-
selectedKeys:
|
|
216
|
-
focusedKey:
|
|
217
|
-
setFocusedKey:
|
|
218
|
-
onSelect:
|
|
219
|
-
onSelectAll:
|
|
220
|
-
onKeyDown:
|
|
215
|
+
selectedKeys: j,
|
|
216
|
+
focusedKey: W,
|
|
217
|
+
setFocusedKey: G,
|
|
218
|
+
onSelect: Y,
|
|
219
|
+
onSelectAll: X,
|
|
220
|
+
onKeyDown: $,
|
|
221
221
|
labels: w
|
|
222
222
|
})
|
|
223
223
|
]
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
var e=`
|
|
2
|
+
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;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
//#region src/components/form/Transfer/transfer.module.scss
|
|
3
|
-
var e = "
|
|
4
|
-
"wim-docs-container": "_wim-docs-
|
|
5
|
-
"wim-t": "_wim-
|
|
6
|
-
"react-flow": "_react-
|
|
7
|
-
"react-flow__edges": "_react-
|
|
8
|
-
"react-flow__connectionline": "_react-
|
|
3
|
+
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 = {
|
|
4
|
+
"wim-docs-container": "_wim-docs-container_1cnlw_87",
|
|
5
|
+
"wim-t": "_wim-t_1cnlw_290",
|
|
6
|
+
"react-flow": "_react-flow_1cnlw_313",
|
|
7
|
+
"react-flow__edges": "_react-flow__edges_1cnlw_314",
|
|
8
|
+
"react-flow__connectionline": "_react-flow__connectionline_1cnlw_315",
|
|
9
9
|
container: e,
|
|
10
10
|
root: t,
|
|
11
11
|
list: n,
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../hooks/useMediaLoader.cjs"),r=require("./hooks/useAudioPlayer.cjs"),i=require("./hooks/useAudioMetadata.cjs"),a=require("./components/AudioCustomControls.cjs"),o=require("./audio.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=({src:e,autoPlay:u=!1,loop:d=!1,muted:f=!1,controls:p=!0,radius:m=`none`,shadow:
|
|
2
|
+
const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../hooks/useMediaLoader.cjs"),r=require("./hooks/useAudioPlayer.cjs"),i=require("./hooks/useAudioMetadata.cjs"),a=require("./components/AudioCustomControls.cjs"),o=require("./audio.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=({src:e,autoPlay:u=!1,loop:d=!1,muted:f=!1,controls:p=!0,radius:m=`none`,shadow:h=!1,border:ee=!1,preload:g,caption:_,className:v,style:y,customControls:b=!1,visualizer:x=!1,showMetadata:S=!1,fadeIn:C=!1,fadeOut:te=!1,crossfade:ne=!1,playbackRate:w=!1,hotkeys:T=!1,presets:E=!1,sleepTimer:D=!1,loading:O=`lazy`,demoDelay:k,labels:A={},tracks:j,...M})=>{let{t:N}=t.useWimTranslation(`common`),{unknownTitle:P=N(`audio.unknown_title`),unknownArtist:F=N(`audio.unknown_artist`)}=A,I=(0,s.useMemo)(()=>e?(Array.isArray(e)?e:[e]).map(e=>typeof e==`string`?{src:e}:e):[],[e]),{containerRef:L,isLoaded:R,isIntersecting:re,notifyLoaded:z,shouldShowSkeleton:B}=n.useMediaLoader({loading:O,demoDelay:k,src:I[0]?.src}),V=r.useAudioPlayer({playlist:I,loop:d,muted:f,fadeIn:C,fadeOut:te,crossfade:ne,visualizer:x,hotkeys:T,autoPlay:u}),{isPlaying:H,currentTrack:U,currentTrackIndex:W,activeAudioRef:G,nextAudioRef:K,canvasRef:q,handleTimeUpdate:J,handleEnded:Y,setDuration:X,playActivePlayer:ie}=V,{metaTitle:Z,metaArtist:Q,metaCover:$}=i.useAudioMetadata({currentTrack:U,showMetadata:S});(0,s.useEffect)(()=>{U&&G.current&&(G.current.src=U.src,(u||H)&&ie())},[W,U]);let ae=m===`none`?null:o.default[`radius${m.charAt(0).toUpperCase()+m.slice(1)}`];return(0,l.jsxs)(`figure`,{className:(0,c.default)(`wim-audio`,o.default.root,v),style:y,"data-testid":`audio-root`,children:[(0,l.jsxs)(`div`,{ref:L,className:(0,c.default)(o.default.inner,ae,b&&h&&o.default.shadow,b&&ee&&o.default.border,b&&o.default.custom,C&&o.default.fadeIn,C&&R&&o.default.isLoaded,B&&o.default.loading),"data-testid":`audio-inner`,children:[x&&b&&(0,l.jsx)(`canvas`,{ref:q,className:o.default.visualizerCanvas,"data-testid":`audio-canvas`}),b&&S&&(Z||Q||$)&&(0,l.jsxs)(`div`,{className:o.default.metadata,style:{position:`relative`,zIndex:2},"data-testid":`audio-metadata`,children:[$&&(0,l.jsx)(`img`,{src:$,alt:N(`a11y.cover_art`),className:o.default.cover,"data-testid":`audio-cover`}),(0,l.jsxs)(`div`,{className:o.default.info,children:[(0,l.jsx)(`div`,{className:o.default.title,"data-testid":`audio-title`,children:Z||P}),(0,l.jsx)(`div`,{className:o.default.artist,"data-testid":`audio-artist`,children:Q||F})]})]}),(0,l.jsxs)(`div`,{style:{display:b?`none`:`block`,width:`100%`},children:[re&&(0,l.jsx)(`audio`,{ref:G,src:U?.src,className:o.default.audio,"data-testid":`audio-active`,loop:V.repeatMode===1&&I.length===1,muted:V.isMuted,controls:!b&&p,preload:g,crossOrigin:`anonymous`,onTimeUpdate:J,onEnded:Y,...M,onLoadedMetadata:e=>{X(e.currentTarget.duration),z(),M.onLoadedMetadata?.(e)},onLoadedData:e=>{z(),M.onLoadedData?.(e)},onCanPlay:e=>{z(),M.onCanPlay?.(e)},children:j?.map((e,t)=>(0,l.jsx)(`track`,{...e},t))}),(0,l.jsx)(`audio`,{ref:K,muted:V.isMuted,preload:`auto`,crossOrigin:`anonymous`,"data-testid":`audio-next`})]}),b&&(0,l.jsx)(a.AudioCustomControls,{styles:o.default,isPlaying:H,currentTime:V.currentTime,duration:V.duration,volume:V.volume,isMuted:V.isMuted,repeatMode:V.repeatMode,shuffleMode:V.shuffleMode,currentPlaybackRate:V.currentPlaybackRate,isBassBoost:V.isBassBoost,remainingSleepTime:V.remainingSleepTime,playbackRate:w,presets:E,sleepTimer:D,setRepeatMode:V.setRepeatMode,setShuffleMode:V.setShuffleMode,setCurrentPlaybackRate:V.setCurrentPlaybackRate,setIsBassBoost:V.setIsBassBoost,setIsMuted:V.setIsMuted,togglePlay:V.togglePlay,handleSeek:V.handleSeek,handleVolumeChange:V.handleVolumeChange,playNext:V.playNext,toggleSleepTimer:V.toggleSleepTimer,formatTime:V.formatTime,labels:A})]}),_&&(0,l.jsx)(`figcaption`,{className:o.default.caption,children:_})]})};exports.Audio=u;
|