wimui 0.51.2 → 0.52.0
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/_internal/FeedbackCloseButton.cjs +1 -1
- package/dist/components/_internal/FeedbackCloseButton.js +14 -13
- package/dist/components/_internal/FieldLabelContent.cjs +1 -1
- package/dist/components/_internal/FieldLabelContent.js +18 -17
- package/dist/components/ai/AIResponseFeedback/AIResponseFeedback.cjs +1 -1
- package/dist/components/ai/AIResponseFeedback/AIResponseFeedback.js +46 -45
- package/dist/components/ai/AgentStatus/AgentStatus.cjs +1 -1
- package/dist/components/ai/AgentStatus/AgentStatus.js +24 -23
- package/dist/components/ai/ArtifactsOverlay/ArtifactsOverlay.cjs +1 -1
- package/dist/components/ai/ArtifactsOverlay/ArtifactsOverlay.js +47 -45
- package/dist/components/ai/ChatUI/ChatUI.cjs +1 -1
- package/dist/components/ai/ChatUI/ChatUI.js +82 -81
- package/dist/components/ai/CodeBlock/CodeBlock.cjs +3 -3
- package/dist/components/ai/CodeBlock/CodeBlock.js +53 -52
- package/dist/components/ai/CodeDiffViewer/CodeDiffViewer.cjs +2 -2
- package/dist/components/ai/CodeDiffViewer/CodeDiffViewer.js +105 -104
- package/dist/components/ai/MarkdownRenderer/MarkdownRenderer.cjs +1 -1
- package/dist/components/ai/MarkdownRenderer/MarkdownRenderer.js +60 -59
- package/dist/components/ai/ModelSelector/ModelSelector.cjs +1 -1
- package/dist/components/ai/ModelSelector/ModelSelector.js +83 -82
- package/dist/components/ai/ModelSelector/model-selector.module.cjs +1 -1
- package/dist/components/ai/ModelSelector/model-selector.module.js +1 -1
- package/dist/components/ai/PromptInput/PromptInput.cjs +1 -1
- package/dist/components/ai/PromptInput/PromptInput.js +76 -75
- package/dist/components/ai/SourceCitation/SourceCitation.cjs +1 -1
- package/dist/components/ai/SourceCitation/SourceCitation.js +39 -38
- package/dist/components/ai/Terminal/Terminal.cjs +2 -2
- package/dist/components/ai/Terminal/Terminal.js +65 -64
- package/dist/components/ai/ThreadList/ThreadList.cjs +1 -1
- package/dist/components/ai/ThreadList/ThreadList.js +58 -57
- package/dist/components/data-display/Barcode/Barcode.cjs +1 -1
- package/dist/components/data-display/Barcode/Barcode.js +76 -75
- package/dist/components/data-display/Calendar/Calendar.cjs +1 -1
- package/dist/components/data-display/Calendar/Calendar.js +75 -74
- package/dist/components/data-display/CalendarHeatmap/CalendarHeatmap.cjs +1 -1
- package/dist/components/data-display/CalendarHeatmap/CalendarHeatmap.js +54 -52
- package/dist/components/data-display/Carousel/Carousel.cjs +1 -1
- package/dist/components/data-display/Carousel/Carousel.js +62 -61
- package/dist/components/data-display/Chip/Chip.cjs +1 -1
- package/dist/components/data-display/Chip/Chip.js +36 -35
- package/dist/components/data-display/Comment/Comment.cjs +1 -1
- package/dist/components/data-display/Comment/Comment.js +58 -57
- package/dist/components/data-display/Countdown/Countdown.cjs +1 -1
- package/dist/components/data-display/Countdown/Countdown.js +56 -55
- package/dist/components/data-display/DataGrid/DataGrid.cjs +1 -1
- package/dist/components/data-display/DataGrid/DataGrid.js +128 -127
- package/dist/components/data-display/JsonViewer/JsonViewer.cjs +1 -1
- package/dist/components/data-display/JsonViewer/JsonViewer.js +153 -152
- package/dist/components/data-display/Kanban/Kanban.cjs +1 -1
- package/dist/components/data-display/Kanban/Kanban.js +95 -94
- package/dist/components/data-display/NodeGraph/NodeGraph.cjs +1 -1
- package/dist/components/data-display/NodeGraph/NodeGraph.js +62 -61
- package/dist/components/data-display/PivotTable/PivotTable.cjs +1 -1
- package/dist/components/data-display/PivotTable/PivotTable.js +153 -152
- package/dist/components/data-display/Presence/Presence.cjs +1 -1
- package/dist/components/data-display/Presence/Presence.js +28 -27
- package/dist/components/data-display/PullToRefresh/PullToRefresh.cjs +1 -1
- package/dist/components/data-display/PullToRefresh/PullToRefresh.js +73 -72
- package/dist/components/data-display/Reaction/Reaction.cjs +1 -1
- package/dist/components/data-display/Reaction/Reaction.js +31 -30
- package/dist/components/data-display/ScheduleView/ScheduleView.cjs +1 -1
- package/dist/components/data-display/ScheduleView/ScheduleView.js +49 -48
- package/dist/components/data-display/SortableList/SortableList.cjs +1 -1
- package/dist/components/data-display/SortableList/SortableList.js +44 -43
- package/dist/components/data-display/Tag/Tag.cjs +1 -1
- package/dist/components/data-display/Tag/Tag.js +29 -28
- package/dist/components/data-display/TreeDiagram/TreeDiagram.cjs +1 -1
- package/dist/components/data-display/TreeDiagram/TreeDiagram.js +85 -84
- package/dist/components/data-display/TreeView/TreeView.cjs +1 -1
- package/dist/components/data-display/TreeView/TreeView.js +123 -122
- package/dist/components/feedback/Autosave/Autosave.cjs +1 -1
- package/dist/components/feedback/Autosave/Autosave.js +32 -31
- package/dist/components/feedback/ErrorBoundary/ErrorBoundary.cjs +1 -1
- package/dist/components/feedback/ErrorBoundary/ErrorBoundary.js +35 -34
- package/dist/components/feedback/ScrollProgress/ScrollProgress.cjs +1 -1
- package/dist/components/feedback/ScrollProgress/ScrollProgress.js +21 -20
- package/dist/components/feedback/Tour/Tour.cjs +1 -1
- package/dist/components/feedback/Tour/Tour.js +98 -97
- package/dist/components/form/Button/Button.cjs +1 -1
- package/dist/components/form/Button/Button.js +55 -54
- package/dist/components/form/ColorInput/ColorInput.cjs +1 -1
- package/dist/components/form/ColorInput/ColorInput.js +30 -29
- package/dist/components/form/ColorPicker/color-picker.module.cjs +1 -1
- package/dist/components/form/ColorPicker/color-picker.module.js +1 -1
- package/dist/components/form/CopyButton/CopyButton.cjs +1 -1
- package/dist/components/form/CopyButton/CopyButton.js +27 -26
- package/dist/components/form/DatePicker/DatePicker.cjs +1 -1
- package/dist/components/form/DatePicker/DatePicker.js +47 -46
- package/dist/components/form/DateRangePicker/DateRangePicker.cjs +1 -1
- package/dist/components/form/DateRangePicker/DateRangePicker.js +36 -35
- package/dist/components/form/Dropzone/Dropzone.cjs +1 -1
- package/dist/components/form/Dropzone/Dropzone.js +56 -55
- package/dist/components/form/FileUpload/FileUpload.cjs +1 -1
- package/dist/components/form/FileUpload/FileUpload.js +47 -46
- package/dist/components/form/FloatButton/FloatButton.cjs +1 -1
- package/dist/components/form/FloatButton/FloatButton.d.ts +4 -1
- package/dist/components/form/FloatButton/FloatButton.js +6 -6
- package/dist/components/form/ImageCropper/ImageCropper.cjs +1 -1
- package/dist/components/form/ImageCropper/ImageCropper.js +101 -99
- package/dist/components/form/InlineEdit/InlineEdit.cjs +1 -1
- package/dist/components/form/InlineEdit/InlineEdit.js +66 -65
- package/dist/components/form/Input/Input.cjs +1 -1
- package/dist/components/form/Input/Input.js +45 -44
- package/dist/components/form/InputBase/InputBase.cjs +1 -1
- package/dist/components/form/InputBase/InputBase.js +51 -50
- package/dist/components/form/InputBase/input-base.module.cjs +1 -1
- package/dist/components/form/InputBase/input-base.module.js +1 -1
- package/dist/components/form/MultiSelect/multiselect.module.cjs +1 -1
- package/dist/components/form/MultiSelect/multiselect.module.js +1 -1
- package/dist/components/form/PasswordStrength/PasswordStrength.cjs +1 -1
- package/dist/components/form/PasswordStrength/PasswordStrength.js +27 -26
- package/dist/components/form/PhoneInput/PhoneInput.cjs +1 -1
- package/dist/components/form/PhoneInput/PhoneInput.js +10 -10
- package/dist/components/form/QueryBuilder/QueryBuilder.cjs +1 -1
- package/dist/components/form/QueryBuilder/QueryBuilder.js +90 -89
- package/dist/components/form/RangeSlider/RangeSlider.cjs +1 -1
- package/dist/components/form/RangeSlider/RangeSlider.js +30 -29
- package/dist/components/form/RichTextEditor/RichTextEditor.cjs +1 -1
- package/dist/components/form/RichTextEditor/RichTextEditor.js +223 -222
- package/dist/components/form/SegmentedControl/SegmentedControl.cjs +1 -1
- package/dist/components/form/SegmentedControl/SegmentedControl.js +7 -7
- package/dist/components/form/Select/Select.cjs +1 -1
- package/dist/components/form/Select/Select.js +112 -111
- package/dist/components/form/SignaturePad/SignaturePad.cjs +1 -1
- package/dist/components/form/SignaturePad/SignaturePad.js +86 -79
- package/dist/components/form/SmartSearchInput/SmartSearchInput.cjs +1 -1
- package/dist/components/form/SmartSearchInput/SmartSearchInput.js +63 -62
- package/dist/components/form/TagInput/TagInput.cjs +1 -1
- package/dist/components/form/TagInput/TagInput.js +68 -67
- package/dist/components/form/ThemeToggle/ThemeToggle.cjs +1 -1
- package/dist/components/form/ThemeToggle/ThemeToggle.js +68 -67
- package/dist/components/form/ThemeToggle/theme-toggle.module.cjs +1 -1
- package/dist/components/form/ThemeToggle/theme-toggle.module.js +1 -1
- package/dist/components/form/ToggleGroup/ToggleGroup.cjs +1 -1
- package/dist/components/form/ToggleGroup/ToggleGroup.js +6 -6
- package/dist/components/form/Transfer/Transfer.cjs +1 -1
- package/dist/components/form/Transfer/Transfer.js +127 -126
- package/dist/components/form/TreeSelect/TreeSelect.cjs +1 -1
- package/dist/components/form/TreeSelect/TreeSelect.js +6 -6
- package/dist/components/layout/Dashboard/Dashboard.cjs +1 -1
- package/dist/components/layout/Dashboard/Dashboard.js +90 -89
- package/dist/components/layout/Navbar/Navbar.cjs +1 -1
- package/dist/components/layout/Navbar/Navbar.d.ts +1 -1
- package/dist/components/layout/Navbar/Navbar.js +1 -1
- package/dist/components/layout/Sidebar/Sidebar.d.ts +1 -1
- package/dist/components/layout/Splitter/Splitter.cjs +1 -1
- package/dist/components/layout/Splitter/Splitter.js +40 -39
- package/dist/components/layout/Toolbar/Toolbar.cjs +1 -1
- package/dist/components/layout/Toolbar/Toolbar.js +66 -39
- package/dist/components/media/Audio/Audio.cjs +1 -1
- package/dist/components/media/Audio/Audio.js +90 -89
- package/dist/components/media/Audio/components/AudioCustomControls.cjs +1 -1
- package/dist/components/media/Audio/components/AudioCustomControls.js +115 -114
- package/dist/components/media/Gallery/Gallery.cjs +1 -1
- package/dist/components/media/Gallery/Gallery.js +132 -131
- package/dist/components/media/ImageCompare/ImageCompare.cjs +1 -1
- package/dist/components/media/ImageCompare/ImageCompare.js +72 -71
- package/dist/components/media/Lightbox/Lightbox.cjs +1 -1
- package/dist/components/media/Lightbox/Lightbox.js +128 -127
- package/dist/components/media/Video/Video.cjs +1 -1
- package/dist/components/media/Video/Video.js +56 -55
- package/dist/components/media/Video/components/VideoAdvancedMenu.cjs +1 -1
- package/dist/components/media/Video/components/VideoAdvancedMenu.js +136 -135
- package/dist/components/media/Video/components/VideoControls.cjs +1 -1
- package/dist/components/media/Video/components/VideoControls.js +103 -102
- package/dist/components/navigation/BackTop/BackTop.cjs +1 -1
- package/dist/components/navigation/BackTop/BackTop.js +37 -36
- package/dist/components/navigation/Breadcrumb/Breadcrumb.cjs +1 -1
- package/dist/components/navigation/Breadcrumb/Breadcrumb.js +41 -40
- package/dist/components/navigation/CommandPalette/CommandPalette.cjs +1 -1
- package/dist/components/navigation/CommandPalette/CommandPalette.js +100 -99
- package/dist/components/navigation/HamburgerMenu/HamburgerMenu.cjs +1 -1
- package/dist/components/navigation/HamburgerMenu/HamburgerMenu.d.ts +6 -0
- package/dist/components/navigation/HamburgerMenu/HamburgerMenu.js +32 -22
- package/dist/components/navigation/Pagination/Pagination.cjs +1 -1
- package/dist/components/navigation/Pagination/Pagination.js +39 -38
- package/dist/components/navigation/SpeedDial/SpeedDial.cjs +1 -1
- package/dist/components/navigation/SpeedDial/SpeedDial.js +44 -43
- package/dist/components/overlay/ContextMenu/ContextMenu.cjs +1 -1
- package/dist/components/overlay/ContextMenu/ContextMenu.js +4 -4
- package/dist/components/overlay/Popover/Popover.cjs +1 -1
- package/dist/components/overlay/Popover/Popover.js +63 -62
- package/dist/components/typography/Spoiler/Spoiler.cjs +1 -1
- package/dist/components/typography/Spoiler/Spoiler.js +38 -37
- package/dist/i18n/generated/common.cjs +2 -0
- package/dist/i18n/generated/common.d.ts +3 -0
- package/dist/i18n/generated/common.js +570 -0
- package/dist/i18n/generated/components.cjs +2 -0
- package/dist/i18n/generated/components.d.ts +3 -0
- package/dist/i18n/generated/components.js +399 -0
- package/dist/i18n/generated/data-display.cjs +2 -0
- package/dist/i18n/generated/data-display.d.ts +3 -0
- package/dist/i18n/generated/data-display.js +12 -0
- package/dist/i18n/generated/form.cjs +2 -0
- package/dist/i18n/generated/form.d.ts +3 -0
- package/dist/i18n/generated/form.js +321 -0
- package/dist/i18n/generated/keys.d.ts +5 -1
- package/dist/i18n/generated/locales.cjs +2 -0
- package/dist/i18n/generated/locales.d.ts +1 -0
- package/dist/i18n/generated/locales.js +9 -0
- package/dist/i18n/instance.cjs +1 -1
- package/dist/i18n/instance.d.ts +18 -3
- package/dist/i18n/instance.js +24 -26
- package/dist/i18n/useWimTranslation.cjs +1 -1
- package/dist/i18n/useWimTranslation.d.ts +7 -8
- package/dist/i18n/useWimTranslation.js +6 -5
- package/dist/llms-full.txt +7 -3
- package/dist/llms.txt +1 -1
- package/dist/styles.css +1 -1
- package/dist/wimui.umd.css +1 -1
- package/dist/wimui.umd.js +5 -5
- package/package.json +10 -10
- package/dist/i18n/generated/resources.cjs +0 -2
- package/dist/i18n/generated/resources.d.ts +0 -4
- package/dist/i18n/generated/resources.js +0 -1283
|
@@ -1,39 +1,40 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { useWimTranslation as e } from "../../../i18n/useWimTranslation.js";
|
|
3
|
-
import t from "../../../
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import i from "
|
|
7
|
-
import a from "
|
|
8
|
-
import o from "
|
|
9
|
-
import
|
|
3
|
+
import { commonNs as t } from "../../../i18n/generated/common.js";
|
|
4
|
+
import n from "../../../icon/close.js";
|
|
5
|
+
import { Icon as r } from "../../media/Icon/Icon.js";
|
|
6
|
+
import { IndicatorBase as i } from "../../_internal/IndicatorBase.js";
|
|
7
|
+
import a from "./tag.module.js";
|
|
8
|
+
import o from "react";
|
|
9
|
+
import s from "classnames";
|
|
10
|
+
import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
|
|
10
11
|
//#region src/components/data-display/Tag/Tag.tsx
|
|
11
|
-
var
|
|
12
|
-
let { t:
|
|
13
|
-
if (
|
|
14
|
-
let
|
|
15
|
-
return /* @__PURE__ */
|
|
16
|
-
ref:
|
|
17
|
-
asChild:
|
|
18
|
-
styles:
|
|
19
|
-
icon:
|
|
20
|
-
className:
|
|
21
|
-
interactive:
|
|
22
|
-
...
|
|
23
|
-
children:
|
|
12
|
+
var d = o.forwardRef(({ asChild: o = !1, children: d, content: f, icon: p, onDelete: m, disabled: h, interactive: g = !1, className: _, ...v }, y) => {
|
|
13
|
+
let { t: b } = e(t);
|
|
14
|
+
if (o && m) throw Error("[wimui] Tag: `asChild` cannot be combined with `onDelete`. Use a removable Tag without asChild, or put the delete control on the slotted child yourself.");
|
|
15
|
+
let x = f ?? d;
|
|
16
|
+
return /* @__PURE__ */ l(i, {
|
|
17
|
+
ref: y,
|
|
18
|
+
asChild: o,
|
|
19
|
+
styles: a,
|
|
20
|
+
icon: p,
|
|
21
|
+
className: s("wim-tag", _, { [a.disabled]: h }),
|
|
22
|
+
interactive: g,
|
|
23
|
+
...v,
|
|
24
|
+
children: m ? /* @__PURE__ */ u(c, { children: [x, /* @__PURE__ */ l("button", {
|
|
24
25
|
type: "button",
|
|
25
|
-
className:
|
|
26
|
+
className: a.closeButton,
|
|
26
27
|
onClick: (e) => {
|
|
27
|
-
e.stopPropagation(),
|
|
28
|
+
e.stopPropagation(), m(e);
|
|
28
29
|
},
|
|
29
|
-
"aria-label":
|
|
30
|
-
children: /* @__PURE__ */
|
|
31
|
-
component:
|
|
30
|
+
"aria-label": b("a11y.close"),
|
|
31
|
+
children: /* @__PURE__ */ l(r, {
|
|
32
|
+
component: n,
|
|
32
33
|
size: "sm"
|
|
33
34
|
})
|
|
34
|
-
})] }) :
|
|
35
|
+
})] }) : x
|
|
35
36
|
});
|
|
36
37
|
});
|
|
37
|
-
|
|
38
|
+
d.displayName = "Tag";
|
|
38
39
|
//#endregion
|
|
39
|
-
export {
|
|
40
|
+
export { d as Tag };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../icon/minus.cjs"),
|
|
2
|
+
const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../i18n/generated/components.cjs"),r=require("../../../icon/minus.cjs"),i=require("../../media/Icon/Icon.cjs"),a=require("./layoutTree.cjs"),o=require("./tree-diagram.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=200,d=64,f=24,p=48,m=(e,t=[])=>{for(let n of e)n.children?.length&&(t.push(n.value),m(n.children,t));return t},h=(e,t=new Map)=>{for(let n of e)t.set(n.value,n),n.children&&h(n.children,t);return t},g=e=>typeof e.label==`string`?e.label:e.value,_=s.default.forwardRef(({nodes:e,orientation:_=`vertical`,expandedValues:v,defaultExpandedValues:y,onExpandedChange:b,selectedValue:x,onSelect:S,renderNode:C,nodeWidth:w=u,nodeHeight:T=d,labels:E,className:D,"aria-label":O,...k},A)=>{let{t:j}=t.useWimTranslation(n.componentsNs),M=s.default.useId(),N=E?.expand??(e=>j(`treediagram.expand`,{label:e})),P=E?.collapse??(e=>j(`treediagram.collapse`,{label:e})),[F,I]=(0,s.useState)(()=>y??m(e)),L=v??F,R=(0,s.useMemo)(()=>new Set(L),[L]),z=(0,s.useCallback)(e=>{v===void 0&&I(e),b?.(e)},[v,b]),B=(0,s.useCallback)(e=>z(R.has(e)?L.filter(t=>t!==e):[...L,e]),[L,R,z]),V=(0,s.useMemo)(()=>h(e),[e]),H=(0,s.useMemo)(()=>a.layoutTree(e,{nodeWidth:w,nodeHeight:T,siblingGap:f,levelGap:p,orientation:_,isExpanded:e=>R.has(e)}),[e,w,T,_,R]),U=(0,s.useMemo)(()=>new Map(H.nodes.map(e=>[e.value,e])),[H]),[W,G]=(0,s.useState)(null),K=W!==null&&U.has(W)?W:null,q=K??x??H.nodes[0]?.value??null,J=(0,s.useRef)(new Map),Y=(0,s.useRef)(!1);(0,s.useEffect)(()=>{if(W===null||U.has(W))return;let e=W,t=e=>{for(let[t,n]of V)if(n.children?.some(t=>t.value===e))return t;return null};for(;e&&!U.has(e);)e=t(e);G(e??null),Y.current=!0},[W,U,V]),(0,s.useEffect)(()=>{if(!Y.current||K===null)return;Y.current=!1;let e=J.current.get(K);e?.focus(),e?.scrollIntoView?.({block:`nearest`,inline:`nearest`})},[K]);let X=e=>{e!==void 0&&(Y.current=!0,G(e))},Z=(e,t,n)=>{let r=H.nodes,i=R.has(t.value);switch(e.key){case`ArrowDown`:X(r[n+1]?.value);break;case`ArrowUp`:X(r[n-1]?.value);break;case`Home`:X(r[0]?.value);break;case`End`:X(r[r.length-1]?.value);break;case`ArrowRight`:t.hasChildren&&!i?B(t.value):t.hasChildren&&X(r[n+1]?.value);break;case`ArrowLeft`:t.hasChildren&&i?B(t.value):t.parent!==null&&X(t.parent);break;case`Enter`:case` `:if(!S)return;S(t.value);break;default:return}e.preventDefault()},Q=_===`vertical`,$=(e,t)=>{if(Q){let n=e.x+w/2,r=e.y+T,i=t.x+w/2;return`M${n} ${r}V${r+p/2}H${i}V${t.y}`}let n=e.x+w,r=e.y+T/2,i=t.y+T/2;return`M${n} ${r}H${n+p/2}V${i}H${t.x}`};return(0,l.jsx)(`div`,{ref:A,role:`tree`,"aria-label":O??j(`treediagram.aria`),"aria-orientation":_,className:(0,c.default)(`wim-tree-diagram`,o.default.root,Q?o.default.vertical:o.default.horizontal,D),...k,children:(0,l.jsxs)(`div`,{className:o.default.canvas,style:{width:H.width,height:H.height},children:[(0,l.jsx)(`svg`,{className:o.default.edges,width:H.width,height:H.height,"aria-hidden":`true`,focusable:`false`,children:H.edges.map(e=>(0,l.jsx)(`path`,{d:$(U.get(e.from),U.get(e.to))},`${e.from}>${e.to}`))}),H.nodes.map((e,t)=>{let n=V.get(e.value),a=R.has(e.value),s=x===e.value,u={depth:e.depth,expanded:a,selected:s,hiddenCount:e.hiddenCount},d=g(n);return(0,l.jsxs)(`div`,{ref:t=>{t?J.current.set(e.value,t):J.current.delete(e.value)},role:`treeitem`,"aria-level":e.depth+1,"aria-setsize":e.setSize,"aria-posinset":e.posInSet,"aria-expanded":e.hasChildren?a:void 0,"aria-selected":S?s:void 0,tabIndex:e.value===q?0:-1,"data-value":e.value,"aria-labelledby":C||!n.description?`${M}-${t}`:`${M}-${t} ${M}-${t}-d`,className:(0,c.default)(o.default.node,s&&o.default.selected,S&&o.default.selectable),style:{left:e.x,top:e.y,width:w,height:T},title:d,onKeyDown:n=>Z(n,e,t),onFocus:()=>G(e.value),onClick:S?()=>S(e.value):void 0,children:[C?(0,l.jsx)(`span`,{id:`${M}-${t}`,className:o.default.custom,children:C(n,u)}):(0,l.jsxs)(`span`,{className:o.default.content,children:[n.avatar&&(0,l.jsx)(`span`,{className:o.default.avatar,children:n.avatar}),(0,l.jsxs)(`span`,{className:o.default.text,children:[(0,l.jsx)(`span`,{id:`${M}-${t}`,className:o.default.label,children:n.label}),n.description&&(0,l.jsx)(`span`,{id:`${M}-${t}-d`,className:o.default.description,children:n.description})]})]}),e.hasChildren&&(0,l.jsx)(`button`,{type:`button`,tabIndex:-1,className:o.default.toggle,"aria-label":a?P(d):N(d),onClick:t=>{t.stopPropagation(),B(e.value)},children:a?(0,l.jsx)(i.Icon,{component:r.default,size:`xs`}):`+${e.hiddenCount}`})]},e.value)})]})})});_.displayName=`TreeDiagram`,exports.TreeDiagram=_;
|
|
@@ -1,65 +1,66 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { useWimTranslation as e } from "../../../i18n/useWimTranslation.js";
|
|
3
|
-
import t from "../../../
|
|
4
|
-
import
|
|
5
|
-
import {
|
|
6
|
-
import i from "./
|
|
7
|
-
import a
|
|
8
|
-
import d from "
|
|
9
|
-
import
|
|
3
|
+
import { componentsNs as t } from "../../../i18n/generated/components.js";
|
|
4
|
+
import n from "../../../icon/minus.js";
|
|
5
|
+
import { Icon as r } from "../../media/Icon/Icon.js";
|
|
6
|
+
import { layoutTree as i } from "./layoutTree.js";
|
|
7
|
+
import a from "./tree-diagram.module.js";
|
|
8
|
+
import o, { useCallback as s, useEffect as c, useMemo as l, useRef as u, useState as d } from "react";
|
|
9
|
+
import f from "classnames";
|
|
10
|
+
import { jsx as p, jsxs as m } from "react/jsx-runtime";
|
|
10
11
|
//#region src/components/data-display/TreeDiagram/TreeDiagram.tsx
|
|
11
|
-
var
|
|
12
|
+
var h = 200, ee = 64, g = 24, _ = 48, v = (e, t = []) => {
|
|
12
13
|
for (let n of e) n.children?.length && (t.push(n.value), v(n.children, t));
|
|
13
14
|
return t;
|
|
14
15
|
}, y = (e, t = /* @__PURE__ */ new Map()) => {
|
|
15
16
|
for (let n of e) t.set(n.value, n), n.children && y(n.children, t);
|
|
16
17
|
return t;
|
|
17
|
-
}, b = (e) => typeof e.label == "string" ? e.label : e.value, x =
|
|
18
|
-
let { t:
|
|
19
|
-
C === void 0 &&
|
|
20
|
-
}, [C, T]),
|
|
21
|
-
z,
|
|
18
|
+
}, b = (e) => typeof e.label == "string" ? e.label : e.value, x = o.forwardRef(({ nodes: x, orientation: S = "vertical", expandedValues: C, defaultExpandedValues: w, onExpandedChange: T, selectedValue: E, onSelect: D, renderNode: O, nodeWidth: k = h, nodeHeight: A = ee, labels: j, className: te, "aria-label": ne, ...M }, N) => {
|
|
19
|
+
let { t: P } = e(t), F = o.useId(), I = j?.expand ?? ((e) => P("treediagram.expand", { label: e })), L = j?.collapse ?? ((e) => P("treediagram.collapse", { label: e })), [R, z] = d(() => w ?? v(x)), B = C ?? R, V = l(() => new Set(B), [B]), H = s((e) => {
|
|
20
|
+
C === void 0 && z(e), T?.(e);
|
|
21
|
+
}, [C, T]), U = s((e) => H(V.has(e) ? B.filter((t) => t !== e) : [...B, e]), [
|
|
22
22
|
B,
|
|
23
|
-
V
|
|
24
|
-
|
|
23
|
+
V,
|
|
24
|
+
H
|
|
25
|
+
]), W = l(() => y(x), [x]), G = l(() => i(x, {
|
|
25
26
|
nodeWidth: k,
|
|
26
27
|
nodeHeight: A,
|
|
27
28
|
siblingGap: g,
|
|
28
29
|
levelGap: _,
|
|
29
30
|
orientation: S,
|
|
30
|
-
isExpanded: (e) =>
|
|
31
|
+
isExpanded: (e) => V.has(e)
|
|
31
32
|
}), [
|
|
32
33
|
x,
|
|
33
34
|
k,
|
|
34
35
|
A,
|
|
35
36
|
S,
|
|
36
|
-
|
|
37
|
-
]),
|
|
38
|
-
|
|
39
|
-
if (
|
|
40
|
-
let e =
|
|
41
|
-
for (let [t, n] of
|
|
37
|
+
V
|
|
38
|
+
]), K = l(() => new Map(G.nodes.map((e) => [e.value, e])), [G]), [q, J] = d(null), Y = q !== null && K.has(q) ? q : null, re = Y ?? E ?? G.nodes[0]?.value ?? null, X = u(/* @__PURE__ */ new Map()), Z = u(!1);
|
|
39
|
+
c(() => {
|
|
40
|
+
if (q === null || K.has(q)) return;
|
|
41
|
+
let e = q, t = (e) => {
|
|
42
|
+
for (let [t, n] of W) if (n.children?.some((t) => t.value === e)) return t;
|
|
42
43
|
return null;
|
|
43
44
|
};
|
|
44
|
-
for (; e && !
|
|
45
|
-
|
|
45
|
+
for (; e && !K.has(e);) e = t(e);
|
|
46
|
+
J(e ?? null), Z.current = !0;
|
|
46
47
|
}, [
|
|
48
|
+
q,
|
|
47
49
|
K,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
if (!Z.current || J === null) return;
|
|
50
|
+
W
|
|
51
|
+
]), c(() => {
|
|
52
|
+
if (!Z.current || Y === null) return;
|
|
52
53
|
Z.current = !1;
|
|
53
|
-
let e = X.current.get(
|
|
54
|
+
let e = X.current.get(Y);
|
|
54
55
|
e?.focus(), e?.scrollIntoView?.({
|
|
55
56
|
block: "nearest",
|
|
56
57
|
inline: "nearest"
|
|
57
58
|
});
|
|
58
|
-
}, [
|
|
59
|
+
}, [Y]);
|
|
59
60
|
let Q = (e) => {
|
|
60
|
-
e !== void 0 && (Z.current = !0,
|
|
61
|
-
},
|
|
62
|
-
let r =
|
|
61
|
+
e !== void 0 && (Z.current = !0, J(e));
|
|
62
|
+
}, ie = (e, t, n) => {
|
|
63
|
+
let r = G.nodes, i = V.has(t.value);
|
|
63
64
|
switch (e.key) {
|
|
64
65
|
case "ArrowDown":
|
|
65
66
|
Q(r[n + 1]?.value);
|
|
@@ -74,10 +75,10 @@ var m = 200, h = 64, g = 24, _ = 48, v = (e, t = []) => {
|
|
|
74
75
|
Q(r[r.length - 1]?.value);
|
|
75
76
|
break;
|
|
76
77
|
case "ArrowRight":
|
|
77
|
-
t.hasChildren && !i ?
|
|
78
|
+
t.hasChildren && !i ? U(t.value) : t.hasChildren && Q(r[n + 1]?.value);
|
|
78
79
|
break;
|
|
79
80
|
case "ArrowLeft":
|
|
80
|
-
t.hasChildren && i ?
|
|
81
|
+
t.hasChildren && i ? U(t.value) : t.parent !== null && Q(t.parent);
|
|
81
82
|
break;
|
|
82
83
|
case "Enter":
|
|
83
84
|
case " ":
|
|
@@ -87,7 +88,7 @@ var m = 200, h = 64, g = 24, _ = 48, v = (e, t = []) => {
|
|
|
87
88
|
default: return;
|
|
88
89
|
}
|
|
89
90
|
e.preventDefault();
|
|
90
|
-
}, $ = S === "vertical",
|
|
91
|
+
}, $ = S === "vertical", ae = (e, t) => {
|
|
91
92
|
if ($) {
|
|
92
93
|
let n = e.x + k / 2, r = e.y + A, i = t.x + k / 2;
|
|
93
94
|
return `M${n} ${r}V${r + _ / 2}H${i}V${t.y}`;
|
|
@@ -95,34 +96,34 @@ var m = 200, h = 64, g = 24, _ = 48, v = (e, t = []) => {
|
|
|
95
96
|
let n = e.x + k, r = e.y + A / 2, i = t.y + A / 2;
|
|
96
97
|
return `M${n} ${r}H${n + _ / 2}V${i}H${t.x}`;
|
|
97
98
|
};
|
|
98
|
-
return /* @__PURE__ */
|
|
99
|
-
ref:
|
|
99
|
+
return /* @__PURE__ */ p("div", {
|
|
100
|
+
ref: N,
|
|
100
101
|
role: "tree",
|
|
101
|
-
"aria-label":
|
|
102
|
+
"aria-label": ne ?? P("treediagram.aria"),
|
|
102
103
|
"aria-orientation": S,
|
|
103
|
-
className:
|
|
104
|
-
...
|
|
105
|
-
children: /* @__PURE__ */
|
|
106
|
-
className:
|
|
104
|
+
className: f("wim-tree-diagram", a.root, $ ? a.vertical : a.horizontal, te),
|
|
105
|
+
...M,
|
|
106
|
+
children: /* @__PURE__ */ m("div", {
|
|
107
|
+
className: a.canvas,
|
|
107
108
|
style: {
|
|
108
|
-
width:
|
|
109
|
-
height:
|
|
109
|
+
width: G.width,
|
|
110
|
+
height: G.height
|
|
110
111
|
},
|
|
111
|
-
children: [/* @__PURE__ */
|
|
112
|
-
className:
|
|
113
|
-
width:
|
|
114
|
-
height:
|
|
112
|
+
children: [/* @__PURE__ */ p("svg", {
|
|
113
|
+
className: a.edges,
|
|
114
|
+
width: G.width,
|
|
115
|
+
height: G.height,
|
|
115
116
|
"aria-hidden": "true",
|
|
116
117
|
focusable: "false",
|
|
117
|
-
children:
|
|
118
|
-
}),
|
|
119
|
-
let
|
|
118
|
+
children: G.edges.map((e) => /* @__PURE__ */ p("path", { d: ae(K.get(e.from), K.get(e.to)) }, `${e.from}>${e.to}`))
|
|
119
|
+
}), G.nodes.map((e, t) => {
|
|
120
|
+
let i = W.get(e.value), o = V.has(e.value), s = E === e.value, c = {
|
|
120
121
|
depth: e.depth,
|
|
121
122
|
expanded: o,
|
|
122
123
|
selected: s,
|
|
123
124
|
hiddenCount: e.hiddenCount
|
|
124
|
-
}, l = b(
|
|
125
|
-
return /* @__PURE__ */
|
|
125
|
+
}, l = b(i);
|
|
126
|
+
return /* @__PURE__ */ m("div", {
|
|
126
127
|
ref: (t) => {
|
|
127
128
|
t ? X.current.set(e.value, t) : X.current.delete(e.value);
|
|
128
129
|
},
|
|
@@ -132,10 +133,10 @@ var m = 200, h = 64, g = 24, _ = 48, v = (e, t = []) => {
|
|
|
132
133
|
"aria-posinset": e.posInSet,
|
|
133
134
|
"aria-expanded": e.hasChildren ? o : void 0,
|
|
134
135
|
"aria-selected": D ? s : void 0,
|
|
135
|
-
tabIndex: e.value ===
|
|
136
|
+
tabIndex: e.value === re ? 0 : -1,
|
|
136
137
|
"data-value": e.value,
|
|
137
|
-
"aria-labelledby": O || !
|
|
138
|
-
className:
|
|
138
|
+
"aria-labelledby": O || !i.description ? `${F}-${t}` : `${F}-${t} ${F}-${t}-d`,
|
|
139
|
+
className: f(a.node, s && a.selected, D && a.selectable),
|
|
139
140
|
style: {
|
|
140
141
|
left: e.x,
|
|
141
142
|
top: e.y,
|
|
@@ -143,40 +144,40 @@ var m = 200, h = 64, g = 24, _ = 48, v = (e, t = []) => {
|
|
|
143
144
|
height: A
|
|
144
145
|
},
|
|
145
146
|
title: l,
|
|
146
|
-
onKeyDown: (
|
|
147
|
-
onFocus: () =>
|
|
147
|
+
onKeyDown: (n) => ie(n, e, t),
|
|
148
|
+
onFocus: () => J(e.value),
|
|
148
149
|
onClick: D ? () => D(e.value) : void 0,
|
|
149
|
-
children: [O ? /* @__PURE__ */
|
|
150
|
-
id: `${
|
|
151
|
-
className:
|
|
152
|
-
children: O(
|
|
153
|
-
}) : /* @__PURE__ */
|
|
154
|
-
className:
|
|
155
|
-
children: [
|
|
156
|
-
className:
|
|
157
|
-
children:
|
|
158
|
-
}), /* @__PURE__ */
|
|
159
|
-
className:
|
|
160
|
-
children: [/* @__PURE__ */
|
|
161
|
-
id: `${
|
|
162
|
-
className:
|
|
163
|
-
children:
|
|
164
|
-
}),
|
|
165
|
-
id: `${
|
|
166
|
-
className:
|
|
167
|
-
children:
|
|
150
|
+
children: [O ? /* @__PURE__ */ p("span", {
|
|
151
|
+
id: `${F}-${t}`,
|
|
152
|
+
className: a.custom,
|
|
153
|
+
children: O(i, c)
|
|
154
|
+
}) : /* @__PURE__ */ m("span", {
|
|
155
|
+
className: a.content,
|
|
156
|
+
children: [i.avatar && /* @__PURE__ */ p("span", {
|
|
157
|
+
className: a.avatar,
|
|
158
|
+
children: i.avatar
|
|
159
|
+
}), /* @__PURE__ */ m("span", {
|
|
160
|
+
className: a.text,
|
|
161
|
+
children: [/* @__PURE__ */ p("span", {
|
|
162
|
+
id: `${F}-${t}`,
|
|
163
|
+
className: a.label,
|
|
164
|
+
children: i.label
|
|
165
|
+
}), i.description && /* @__PURE__ */ p("span", {
|
|
166
|
+
id: `${F}-${t}-d`,
|
|
167
|
+
className: a.description,
|
|
168
|
+
children: i.description
|
|
168
169
|
})]
|
|
169
170
|
})]
|
|
170
|
-
}), e.hasChildren && /* @__PURE__ */
|
|
171
|
+
}), e.hasChildren && /* @__PURE__ */ p("button", {
|
|
171
172
|
type: "button",
|
|
172
173
|
tabIndex: -1,
|
|
173
|
-
className:
|
|
174
|
-
"aria-label": o ?
|
|
174
|
+
className: a.toggle,
|
|
175
|
+
"aria-label": o ? L(l) : I(l),
|
|
175
176
|
onClick: (t) => {
|
|
176
|
-
t.stopPropagation(),
|
|
177
|
+
t.stopPropagation(), U(e.value);
|
|
177
178
|
},
|
|
178
|
-
children: o ? /* @__PURE__ */
|
|
179
|
-
component:
|
|
179
|
+
children: o ? /* @__PURE__ */ p(r, {
|
|
180
|
+
component: n,
|
|
180
181
|
size: "xs"
|
|
181
182
|
}) : `+${e.hiddenCount}`
|
|
182
183
|
})]
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../icon/chevron-right.cjs"),r=require("../../media/Icon/Icon.cjs"),i=require("../../_internal/BaseListItem/BaseListItem.cjs"),a=require("../VirtualList/VirtualList.cjs"),o=require("./tree-view.module.cjs"),s=require("./useTreeViewItemExpansion.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=(0,c.createContext)(null),f=()=>{let e=(0,c.useContext)(d);if(!e)throw Error(`TreeView components must be used within a TreeView`);return e},p=40,m=100;function h(e){return typeof e==`string`?e:typeof e==`number`?String(e):``}function g(e,t,n,r=0){let i=[];for(let a of e){let e=h(a.label),o=!n||e.toLowerCase().includes(n.toLowerCase()),s=n&&a.children?_(a.children,n):!1;if(n&&!o&&!s)continue;i.push({...a,depth:r,hasChildren:!!(a.children&&a.children.length>0)});let c=t.includes(a.value)||!!n&&s;a.children&&a.children.length>0&&c&&i.push(...g(a.children,t,n,r+1))}return i}function _(e,t){return e.some(e=>h(e.label).toLowerCase().includes(t.toLowerCase())||(e.children?_(e.children,t):!1))}function v(e,t){for(let n of e){if(n.value===t){let e=[],t=n=>{for(let r of n)e.push(r.value),r.children&&t(r.children)};return n.children&&t(n.children),e}if(n.children){let e=v(n.children,t);if(e!==null)return e}}return null}function y(e,t,n=[]){for(let r of e){if(r.value===t)return n;if(r.children){let e=y(r.children,t,[...n,r.value]);if(e!==null)return e}}return null}function b(e,t){let n=[],r=new Set(t);function i(e){if(!e.children?.length)return r.has(e.value)?`checked`:`unchecked`;let t=e.children.map(i),a=t.every(e=>e===`checked`),o=t.some(e=>e!==`unchecked`);return a?(r.add(e.value),`checked`):o?(n.push(e.value),`indeterminate`):`unchecked`}for(let t of e)i(t);return{indeterminateValues:n,effectiveCheckedSet:r}}var x=({children:e,nodes:s,className:f,multiSelect:_=!1,checkable:x=!1,checkStrategy:S=`cascade`,searchable:C=!1,defaultExpandedValues:w=[],defaultSelectedValues:T=[],defaultCheckedValues:E=[],onCheckedChange:D,onSelectedChange:O,width:k,virtualThreshold:A=m,labels:j={},labelId:M,styles:N})=>{let{t:P}=t.useWimTranslation(`components`),{searchPlaceholder:F,searchAriaLabel:ee=P(`treeview.search_aria`),expandLabel:I=e=>P(`treeview.expand`,{label:e}),collapseLabel:L=e=>P(`treeview.collapse`,{label:e})}=j,[R,z]=(0,c.useState)(w),[B,V]=(0,c.useState)(T),[H,U]=(0,c.useState)(E),[W,te]=(0,c.useState)(``),[G,K]=(0,c.useState)(T[0]||null),q=c.default.useRef(null),{indeterminateValues:J,effectiveCheckedSet:ne}=(0,c.useMemo)(()=>!s||S!==`cascade`?{indeterminateValues:[],effectiveCheckedSet:new Set(H)}:b(s,new Set(H)),[s,S,H]),Y=(0,c.useCallback)(e=>{z(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},[]),X=(0,c.useCallback)(e=>{if(_)V(t=>{let n=t.includes(e)?t.filter(t=>t!==e):[...t,e];return O?.(n),n});else{let t=[e];V(t),O?.(t)}},[_,O]),Z=(0,c.useCallback)(e=>{U(t=>{let n;if(!s)return n=t.includes(e)?t.filter(t=>t!==e):[...t,e],D?.(n),n;if(S===`cascade`){let{indeterminateValues:r}=b(s,new Set(t)),i=t.includes(e)&&!r.includes(e),a=[e,...v(s,e)??[]];n=i?t.filter(e=>!a.includes(e)):[...t,...a.filter(e=>!t.includes(e))];let{indeterminateValues:o,effectiveCheckedSet:c}=b(s,new Set(n));D?.([...c].filter(e=>!o.includes(e)))}else{if(t.includes(e))n=t.filter(t=>t!==e);else{let r=y(s,e)??[],i=v(s,e)??[],a=new Set([...r,...i]);n=[...t.filter(e=>!a.has(e)),e]}D?.(n)}return n})},[S,s,D]),re=(0,c.useMemo)(()=>({expandedValues:R,selectedValues:B,checkedValues:H,indeterminateValues:J,focusedValue:G,toggleExpand:Y,select:X,toggleCheck:Z,setFocusedValue:K,containerRef:q,multiSelect:_,checkable:x,checkStrategy:S,searchQuery:W,labels:{expandLabel:I,collapseLabel:L}}),[R,B,H,J,G,Y,X,Z,_,x,S,W,I,L]),Q=(0,c.useMemo)(()=>s?g(s,R,W):[],[s,R,W]),ie=!!s&&Q.length>=A,$=(0,c.useCallback)(e=>{let t=q.current;if(!t||!e)return;let n=Array.from(t.querySelectorAll(`[role="treeitem"]`)).find(t=>t.getAttribute(`data-value`)===e);n&&n!==document.activeElement&&n.focus()},[]);(0,c.useEffect)(()=>{if(!s||!G)return;let e=q.current,t=document.activeElement;e&&t&&e.contains(t)&&(t instanceof HTMLInputElement||$(G))},[s,G,$]);let ae=(0,c.useCallback)((e,t,n)=>{switch(e.key){case`Enter`:case` `:e.preventDefault(),X(t.value),x&&Z(t.value);break;case`ArrowDown`:e.preventDefault(),n<Q.length-1&&K(Q[n+1].value);break;case`ArrowUp`:e.preventDefault(),n>0&&K(Q[n-1].value);break;case`Home`:e.preventDefault(),Q.length>0&&K(Q[0].value);break;case`End`:e.preventDefault(),Q.length>0&&K(Q[Q.length-1].value);break;case`ArrowRight`:e.preventDefault(),t.hasChildren&&!R.includes(t.value)?Y(t.value):t.hasChildren&&n<Q.length-1&&K(Q[n+1].value);break;case`ArrowLeft`:if(e.preventDefault(),t.hasChildren&&R.includes(t.value))Y(t.value);else for(let e=n-1;e>=0;e--)if(Q[e].depth<t.depth){K(Q[e].value);break}}},[Q,R,X,x,Z,Y]),oe=(0,c.useCallback)((e,t)=>{let a=B.includes(e.value),s=ne.has(e.value),c=J.includes(e.value),d=R.includes(e.value),f=G===e.value,p=h(e.label);return(0,u.jsx)(`div`,{className:(0,l.default)(o.default.item,a&&o.default.selected,e.disabled&&o.default.disabled,N?.item),role:`treeitem`,"aria-expanded":e.hasChildren?d:void 0,"aria-selected":a,"aria-disabled":e.disabled,"aria-setsize":Q.length,"aria-posinset":t+1,"aria-level":e.depth+1,"data-value":e.value,tabIndex:f?0:-1,onClick:t=>{t.stopPropagation(),K(e.value),e.disabled||(_&&x?Z(e.value):X(e.value))},onKeyDown:n=>{n.key!==`Tab`&&n.key!==`Escape`&&n.stopPropagation(),ae(n,e,t)},onFocus:t=>{t.stopPropagation(),K(e.value)},style:{paddingLeft:e.depth*20},children:(0,u.jsx)(i.BaseListItem,{className:(0,l.default)(o.default.labelContainer,N?.labelContainer),active:a,disabled:e.disabled,icon:(0,u.jsxs)(`div`,{className:(0,l.default)(o.default.iconWrapper,N?.iconWrapper),children:[e.hasChildren?(0,u.jsx)(`button`,{type:`button`,className:(0,l.default)(o.default.expandBtn,d&&o.default.expanded,N?.expandBtn),onClick:t=>{t.stopPropagation(),e.disabled||Y(e.value)},disabled:e.disabled,"aria-label":d?L(p):I(p),tabIndex:-1,children:(0,u.jsx)(r.Icon,{component:n.default,size:`sm`})}):(0,u.jsx)(`span`,{className:o.default.spacer}),x&&(0,u.jsx)(`input`,{type:`checkbox`,className:(0,l.default)(o.default.checkbox,N?.checkbox),checked:s&&!c,ref:e=>{e&&(e.indeterminate=c)},onChange:t=>{t.stopPropagation(),e.disabled||Z(e.value)},disabled:e.disabled,onClick:e=>e.stopPropagation(),"aria-label":p,tabIndex:-1}),e.icon&&(0,u.jsx)(`span`,{className:(0,l.default)(o.default.icon,N?.icon),children:e.icon})]}),children:e.label})},e.value)},[B,ne,J,R,G,Q.length,_,x,X,Z,Y,ae,I,L,N]);return(0,u.jsx)(d.Provider,{value:re,children:(0,u.jsxs)(`div`,{ref:q,"data-testid":`tree-view-root`,className:(0,l.default)(`wim-tree-view`,o.default.root,!!s&&o.default.dataDriven,f,N?.root),role:`tree`,"aria-label":j.treeAriaLabel,"aria-labelledby":j.treeAriaLabel?void 0:M,style:{width:k,maxWidth:`100%`},tabIndex:G?-1:0,onFocus:e=>{e.target===q.current&&(s?G?$(G):Q.length>0&&(K(Q[0].value),$(Q[0].value)):G?(q.current?.querySelector(`[role="treeitem"][data-value="${G}"]`))?.focus():(q.current?.querySelector(`[role="treeitem"]`))?.focus())},children:[C&&(0,u.jsx)(`div`,{className:(0,l.default)(o.default.search,N?.search),children:(0,u.jsx)(`input`,{type:`text`,"data-testid":`tree-view-search-input`,className:(0,l.default)(o.default.searchInput,N?.searchInput),placeholder:F,value:W,onChange:e=>te(e.target.value),"aria-label":ee})}),s?ie?(0,u.jsx)(a.VirtualList,{items:Q,itemHeight:p,height:400,renderItem:oe,itemRole:`none`,role:`presentation`}):Q.map((e,t)=>oe(e,t)):e]})})},S=({value:e,label:t,icon:a,children:d,className:p,disabled:m=!1})=>{let{expandedValues:g,selectedValues:_,checkedValues:v,indeterminateValues:y,focusedValue:b,toggleExpand:x,select:C,toggleCheck:w,setFocusedValue:T,containerRef:E,multiSelect:D,checkable:O,searchQuery:k}=f(),A=c.default.useId(),j=`wim-tree-view-item-checkbox-${A}`,M=`wim-tree-view-item-label-${A}`,N=h(t),P=!k||N.toLowerCase().includes(k.toLowerCase()),F=c.default.useMemo(()=>{if(!k||!d)return!1;let e=t=>c.default.Children.toArray(t).some(t=>{if(!c.default.isValidElement(t)||t.type!==S)return!1;let n=t.props,r=n.label;return h(r).toLowerCase().includes(k.toLowerCase())?!0:n.children?e(n.children):!1});return e(d)},[d,k]),ee=!!k&&F,I=g.includes(e)||ee,L=_.includes(e),R=v.includes(e),z=y.includes(e),B=!!c.default.Children.count(d),{shouldRender:V,isVisualExpanded:H,handleTransitionEnd:U}=s.useTreeViewItemExpansion(I);return k&&!P&&!F?null:(0,u.jsxs)(`div`,{className:(0,l.default)(o.default.item,L&&o.default.selected,m&&o.default.disabled,p),role:`treeitem`,"aria-expanded":B?I:void 0,"aria-selected":L,"aria-disabled":m,"data-value":e,onClick:t=>{t.stopPropagation(),T(e),m||(D&&O?w(e):C(e))},onKeyDown:t=>{if(m)return;t.key!==`Tab`&&t.key!==`Escape`&&t.stopPropagation();let n=Array.from(E.current?.querySelectorAll(`[role="treeitem"]:not([aria-disabled="true"])`)||[]),r=n.indexOf(t.currentTarget);switch(t.key){case`Enter`:case` `:t.preventDefault(),C(e),O&&w(e);break;case`ArrowDown`:t.preventDefault(),r<n.length-1&&n[r+1].focus();break;case`ArrowUp`:t.preventDefault(),r>0&&n[r-1].focus();break;case`Home`:t.preventDefault(),n.length>0&&n[0].focus();break;case`End`:t.preventDefault(),n.length>0&&n[n.length-1].focus();break;case`ArrowRight`:B&&(I?(t.preventDefault(),r<n.length-1&&n[r+1].focus()):(t.preventDefault(),x(e)));break;case`ArrowLeft`:if(B&&I)t.preventDefault(),x(e);else{t.preventDefault();let e=t.currentTarget.parentElement?.closest(`[role="treeitem"]`);e&&e.focus()}}},onFocus:t=>{t.stopPropagation(),T(e)},tabIndex:b===e?0:-1,children:[(0,u.jsx)(i.BaseListItem,{id:M,className:o.default.labelContainer,active:L,disabled:m,icon:(0,u.jsxs)(`div`,{className:o.default.iconWrapper,children:[B&&(0,u.jsx)(`button`,{type:`button`,className:(0,l.default)(o.default.expandBtn,I&&o.default.expanded),onClick:t=>{t.stopPropagation(),!m&&B&&x(e)},disabled:m,"aria-label":I?`Collapse ${typeof t==`string`?t:``}`:`Expand ${typeof t==`string`?t:``}`,tabIndex:-1,children:(0,u.jsx)(r.Icon,{component:n.default,size:`sm`})}),!B&&(0,u.jsx)(`span`,{className:o.default.spacer}),O&&(0,u.jsx)(`input`,{id:j,type:`checkbox`,className:o.default.checkbox,checked:R&&!z,ref:e=>{e&&(e.indeterminate=z)},onChange:t=>{t.stopPropagation(),m||w(e)},disabled:m,onClick:e=>e.stopPropagation(),"aria-labelledby":M,tabIndex:-1}),a&&(0,u.jsx)(`span`,{className:o.default.icon,children:a})]}),children:t}),B&&V&&(0,u.jsx)(`div`,{className:(0,l.default)(o.default.children,H&&o.default.expanded),onTransitionEnd:U,style:{gridTemplateRows:H?`1fr`:`0fr`},children:(0,u.jsx)(`div`,{className:o.default.childrenInner,role:`group`,children:d})})]})};x.displayName=`TreeView`,S.displayName=`TreeView.Item`;var C=x;C.Item=S,exports.TreeView=C,exports.default=C,exports.TreeViewItem=S;
|
|
2
|
+
const e=require("../../../_virtual/_rolldown/runtime.cjs"),t=require("../../../i18n/useWimTranslation.cjs"),n=require("../../../i18n/generated/components.cjs"),r=require("../../../icon/chevron-right.cjs"),i=require("../../media/Icon/Icon.cjs"),a=require("../../_internal/BaseListItem/BaseListItem.cjs"),o=require("../VirtualList/VirtualList.cjs"),s=require("./tree-view.module.cjs"),c=require("./useTreeViewItemExpansion.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=(0,l.createContext)(null),p=()=>{let e=(0,l.useContext)(f);if(!e)throw Error(`TreeView components must be used within a TreeView`);return e},m=40,ee=100;function h(e){return typeof e==`string`?e:typeof e==`number`?String(e):``}function g(e,t,n,r=0){let i=[];for(let a of e){let e=h(a.label),o=!n||e.toLowerCase().includes(n.toLowerCase()),s=n&&a.children?_(a.children,n):!1;if(n&&!o&&!s)continue;i.push({...a,depth:r,hasChildren:!!(a.children&&a.children.length>0)});let c=t.includes(a.value)||!!n&&s;a.children&&a.children.length>0&&c&&i.push(...g(a.children,t,n,r+1))}return i}function _(e,t){return e.some(e=>h(e.label).toLowerCase().includes(t.toLowerCase())||(e.children?_(e.children,t):!1))}function v(e,t){for(let n of e){if(n.value===t){let e=[],t=n=>{for(let r of n)e.push(r.value),r.children&&t(r.children)};return n.children&&t(n.children),e}if(n.children){let e=v(n.children,t);if(e!==null)return e}}return null}function y(e,t,n=[]){for(let r of e){if(r.value===t)return n;if(r.children){let e=y(r.children,t,[...n,r.value]);if(e!==null)return e}}return null}function b(e,t){let n=[],r=new Set(t);function i(e){if(!e.children?.length)return r.has(e.value)?`checked`:`unchecked`;let t=e.children.map(i),a=t.every(e=>e===`checked`),o=t.some(e=>e!==`unchecked`);return a?(r.add(e.value),`checked`):o?(n.push(e.value),`indeterminate`):`unchecked`}for(let t of e)i(t);return{indeterminateValues:n,effectiveCheckedSet:r}}var x=({children:e,nodes:c,className:p,multiSelect:_=!1,checkable:x=!1,checkStrategy:S=`cascade`,searchable:C=!1,defaultExpandedValues:w=[],defaultSelectedValues:T=[],defaultCheckedValues:E=[],onCheckedChange:D,onSelectedChange:O,width:k,virtualThreshold:te=ee,labels:A={},labelId:j,styles:M})=>{let{t:N}=t.useWimTranslation(n.componentsNs),{searchPlaceholder:P,searchAriaLabel:F=N(`treeview.search_aria`),expandLabel:I=e=>N(`treeview.expand`,{label:e}),collapseLabel:L=e=>N(`treeview.collapse`,{label:e})}=A,[R,z]=(0,l.useState)(w),[B,V]=(0,l.useState)(T),[H,ne]=(0,l.useState)(E),[U,re]=(0,l.useState)(``),[W,G]=(0,l.useState)(T[0]||null),K=l.default.useRef(null),{indeterminateValues:q,effectiveCheckedSet:J}=(0,l.useMemo)(()=>!c||S!==`cascade`?{indeterminateValues:[],effectiveCheckedSet:new Set(H)}:b(c,new Set(H)),[c,S,H]),Y=(0,l.useCallback)(e=>{z(t=>t.includes(e)?t.filter(t=>t!==e):[...t,e])},[]),X=(0,l.useCallback)(e=>{if(_)V(t=>{let n=t.includes(e)?t.filter(t=>t!==e):[...t,e];return O?.(n),n});else{let t=[e];V(t),O?.(t)}},[_,O]),Z=(0,l.useCallback)(e=>{ne(t=>{let n;if(!c)return n=t.includes(e)?t.filter(t=>t!==e):[...t,e],D?.(n),n;if(S===`cascade`){let{indeterminateValues:r}=b(c,new Set(t)),i=t.includes(e)&&!r.includes(e),a=[e,...v(c,e)??[]];n=i?t.filter(e=>!a.includes(e)):[...t,...a.filter(e=>!t.includes(e))];let{indeterminateValues:o,effectiveCheckedSet:s}=b(c,new Set(n));D?.([...s].filter(e=>!o.includes(e)))}else{if(t.includes(e))n=t.filter(t=>t!==e);else{let r=y(c,e)??[],i=v(c,e)??[],a=new Set([...r,...i]);n=[...t.filter(e=>!a.has(e)),e]}D?.(n)}return n})},[S,c,D]),ie=(0,l.useMemo)(()=>({expandedValues:R,selectedValues:B,checkedValues:H,indeterminateValues:q,focusedValue:W,toggleExpand:Y,select:X,toggleCheck:Z,setFocusedValue:G,containerRef:K,multiSelect:_,checkable:x,checkStrategy:S,searchQuery:U,labels:{expandLabel:I,collapseLabel:L}}),[R,B,H,q,W,Y,X,Z,_,x,S,U,I,L]),Q=(0,l.useMemo)(()=>c?g(c,R,U):[],[c,R,U]),ae=!!c&&Q.length>=te,$=(0,l.useCallback)(e=>{let t=K.current;if(!t||!e)return;let n=Array.from(t.querySelectorAll(`[role="treeitem"]`)).find(t=>t.getAttribute(`data-value`)===e);n&&n!==document.activeElement&&n.focus()},[]);(0,l.useEffect)(()=>{if(!c||!W)return;let e=K.current,t=document.activeElement;e&&t&&e.contains(t)&&(t instanceof HTMLInputElement||$(W))},[c,W,$]);let oe=(0,l.useCallback)((e,t,n)=>{switch(e.key){case`Enter`:case` `:e.preventDefault(),X(t.value),x&&Z(t.value);break;case`ArrowDown`:e.preventDefault(),n<Q.length-1&&G(Q[n+1].value);break;case`ArrowUp`:e.preventDefault(),n>0&&G(Q[n-1].value);break;case`Home`:e.preventDefault(),Q.length>0&&G(Q[0].value);break;case`End`:e.preventDefault(),Q.length>0&&G(Q[Q.length-1].value);break;case`ArrowRight`:e.preventDefault(),t.hasChildren&&!R.includes(t.value)?Y(t.value):t.hasChildren&&n<Q.length-1&&G(Q[n+1].value);break;case`ArrowLeft`:if(e.preventDefault(),t.hasChildren&&R.includes(t.value))Y(t.value);else for(let e=n-1;e>=0;e--)if(Q[e].depth<t.depth){G(Q[e].value);break}}},[Q,R,X,x,Z,Y]),se=(0,l.useCallback)((e,t)=>{let n=B.includes(e.value),o=J.has(e.value),c=q.includes(e.value),l=R.includes(e.value),f=W===e.value,p=h(e.label);return(0,d.jsx)(`div`,{className:(0,u.default)(s.default.item,n&&s.default.selected,e.disabled&&s.default.disabled,M?.item),role:`treeitem`,"aria-expanded":e.hasChildren?l:void 0,"aria-selected":n,"aria-disabled":e.disabled,"aria-setsize":Q.length,"aria-posinset":t+1,"aria-level":e.depth+1,"data-value":e.value,tabIndex:f?0:-1,onClick:t=>{t.stopPropagation(),G(e.value),e.disabled||(_&&x?Z(e.value):X(e.value))},onKeyDown:n=>{n.key!==`Tab`&&n.key!==`Escape`&&n.stopPropagation(),oe(n,e,t)},onFocus:t=>{t.stopPropagation(),G(e.value)},style:{paddingLeft:e.depth*20},children:(0,d.jsx)(a.BaseListItem,{className:(0,u.default)(s.default.labelContainer,M?.labelContainer),active:n,disabled:e.disabled,icon:(0,d.jsxs)(`div`,{className:(0,u.default)(s.default.iconWrapper,M?.iconWrapper),children:[e.hasChildren?(0,d.jsx)(`button`,{type:`button`,className:(0,u.default)(s.default.expandBtn,l&&s.default.expanded,M?.expandBtn),onClick:t=>{t.stopPropagation(),e.disabled||Y(e.value)},disabled:e.disabled,"aria-label":l?L(p):I(p),tabIndex:-1,children:(0,d.jsx)(i.Icon,{component:r.default,size:`sm`})}):(0,d.jsx)(`span`,{className:s.default.spacer}),x&&(0,d.jsx)(`input`,{type:`checkbox`,className:(0,u.default)(s.default.checkbox,M?.checkbox),checked:o&&!c,ref:e=>{e&&(e.indeterminate=c)},onChange:t=>{t.stopPropagation(),e.disabled||Z(e.value)},disabled:e.disabled,onClick:e=>e.stopPropagation(),"aria-label":p,tabIndex:-1}),e.icon&&(0,d.jsx)(`span`,{className:(0,u.default)(s.default.icon,M?.icon),children:e.icon})]}),children:e.label})},e.value)},[B,J,q,R,W,Q.length,_,x,X,Z,Y,oe,I,L,M]);return(0,d.jsx)(f.Provider,{value:ie,children:(0,d.jsxs)(`div`,{ref:K,"data-testid":`tree-view-root`,className:(0,u.default)(`wim-tree-view`,s.default.root,!!c&&s.default.dataDriven,p,M?.root),role:`tree`,"aria-label":A.treeAriaLabel,"aria-labelledby":A.treeAriaLabel?void 0:j,style:{width:k,maxWidth:`100%`},tabIndex:W?-1:0,onFocus:e=>{e.target===K.current&&(c?W?$(W):Q.length>0&&(G(Q[0].value),$(Q[0].value)):W?(K.current?.querySelector(`[role="treeitem"][data-value="${W}"]`))?.focus():(K.current?.querySelector(`[role="treeitem"]`))?.focus())},children:[C&&(0,d.jsx)(`div`,{className:(0,u.default)(s.default.search,M?.search),children:(0,d.jsx)(`input`,{type:`text`,"data-testid":`tree-view-search-input`,className:(0,u.default)(s.default.searchInput,M?.searchInput),placeholder:P,value:U,onChange:e=>re(e.target.value),"aria-label":F})}),c?ae?(0,d.jsx)(o.VirtualList,{items:Q,itemHeight:m,height:400,renderItem:se,itemRole:`none`,role:`presentation`}):Q.map((e,t)=>se(e,t)):e]})})},S=({value:e,label:t,icon:n,children:o,className:f,disabled:m=!1})=>{let{expandedValues:ee,selectedValues:g,checkedValues:_,indeterminateValues:v,focusedValue:y,toggleExpand:b,select:x,toggleCheck:C,setFocusedValue:w,containerRef:T,multiSelect:E,checkable:D,searchQuery:O}=p(),k=l.default.useId(),te=`wim-tree-view-item-checkbox-${k}`,A=`wim-tree-view-item-label-${k}`,j=h(t),M=!O||j.toLowerCase().includes(O.toLowerCase()),N=l.default.useMemo(()=>{if(!O||!o)return!1;let e=t=>l.default.Children.toArray(t).some(t=>{if(!l.default.isValidElement(t)||t.type!==S)return!1;let n=t.props,r=n.label;return h(r).toLowerCase().includes(O.toLowerCase())?!0:n.children?e(n.children):!1});return e(o)},[o,O]),P=!!O&&N,F=ee.includes(e)||P,I=g.includes(e),L=_.includes(e),R=v.includes(e),z=!!l.default.Children.count(o),{shouldRender:B,isVisualExpanded:V,handleTransitionEnd:H}=c.useTreeViewItemExpansion(F);return O&&!M&&!N?null:(0,d.jsxs)(`div`,{className:(0,u.default)(s.default.item,I&&s.default.selected,m&&s.default.disabled,f),role:`treeitem`,"aria-expanded":z?F:void 0,"aria-selected":I,"aria-disabled":m,"data-value":e,onClick:t=>{t.stopPropagation(),w(e),m||(E&&D?C(e):x(e))},onKeyDown:t=>{if(m)return;t.key!==`Tab`&&t.key!==`Escape`&&t.stopPropagation();let n=Array.from(T.current?.querySelectorAll(`[role="treeitem"]:not([aria-disabled="true"])`)||[]),r=n.indexOf(t.currentTarget);switch(t.key){case`Enter`:case` `:t.preventDefault(),x(e),D&&C(e);break;case`ArrowDown`:t.preventDefault(),r<n.length-1&&n[r+1].focus();break;case`ArrowUp`:t.preventDefault(),r>0&&n[r-1].focus();break;case`Home`:t.preventDefault(),n.length>0&&n[0].focus();break;case`End`:t.preventDefault(),n.length>0&&n[n.length-1].focus();break;case`ArrowRight`:z&&(F?(t.preventDefault(),r<n.length-1&&n[r+1].focus()):(t.preventDefault(),b(e)));break;case`ArrowLeft`:if(z&&F)t.preventDefault(),b(e);else{t.preventDefault();let e=t.currentTarget.parentElement?.closest(`[role="treeitem"]`);e&&e.focus()}}},onFocus:t=>{t.stopPropagation(),w(e)},tabIndex:y===e?0:-1,children:[(0,d.jsx)(a.BaseListItem,{id:A,className:s.default.labelContainer,active:I,disabled:m,icon:(0,d.jsxs)(`div`,{className:s.default.iconWrapper,children:[z&&(0,d.jsx)(`button`,{type:`button`,className:(0,u.default)(s.default.expandBtn,F&&s.default.expanded),onClick:t=>{t.stopPropagation(),!m&&z&&b(e)},disabled:m,"aria-label":F?`Collapse ${typeof t==`string`?t:``}`:`Expand ${typeof t==`string`?t:``}`,tabIndex:-1,children:(0,d.jsx)(i.Icon,{component:r.default,size:`sm`})}),!z&&(0,d.jsx)(`span`,{className:s.default.spacer}),D&&(0,d.jsx)(`input`,{id:te,type:`checkbox`,className:s.default.checkbox,checked:L&&!R,ref:e=>{e&&(e.indeterminate=R)},onChange:t=>{t.stopPropagation(),m||C(e)},disabled:m,onClick:e=>e.stopPropagation(),"aria-labelledby":A,tabIndex:-1}),n&&(0,d.jsx)(`span`,{className:s.default.icon,children:n})]}),children:t}),z&&B&&(0,d.jsx)(`div`,{className:(0,u.default)(s.default.children,V&&s.default.expanded),onTransitionEnd:H,style:{gridTemplateRows:V?`1fr`:`0fr`},children:(0,d.jsx)(`div`,{className:s.default.childrenInner,role:`group`,children:o})})]})};x.displayName=`TreeView`,S.displayName=`TreeView.Item`;var C=x;C.Item=S,exports.TreeView=C,exports.default=C,exports.TreeViewItem=S;
|