@neo4j-ndl/react 4.12.5 → 4.13.1
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/lib/cjs/icons/generated/custom/AddNode.js +1 -0
- package/lib/cjs/icons/generated/custom/AddNode.js.map +1 -1
- package/lib/cjs/icons/generated/custom/Appearance.js +30 -0
- package/lib/cjs/icons/generated/custom/Appearance.js.map +1 -0
- package/lib/cjs/icons/generated/custom/index.js +5 -3
- package/lib/cjs/icons/generated/custom/index.js.map +1 -1
- package/lib/cjs/next/index.js +16 -0
- package/lib/cjs/next/index.js.map +1 -1
- package/lib/cjs/next/tree-view/TreeView.js +460 -0
- package/lib/cjs/next/tree-view/TreeView.js.map +1 -0
- package/lib/cjs/next/tree-view/index.js +26 -0
- package/lib/cjs/next/tree-view/index.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/index.js +60 -0
- package/lib/cjs/next/tree-view/stories/index.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-actions.story.js +36 -0
- package/lib/cjs/next/tree-view/stories/tree-view-actions.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-lazy.story.js +149 -0
- package/lib/cjs/next/tree-view/stories/tree-view-lazy.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-multi.story.js +73 -0
- package/lib/cjs/next/tree-view/stories/tree-view-multi.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-non-selectable-folders.story.js +35 -0
- package/lib/cjs/next/tree-view/stories/tree-view-non-selectable-folders.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-single.story.js +35 -0
- package/lib/cjs/next/tree-view/stories/tree-view-single.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-tooltip.story.js +34 -0
- package/lib/cjs/next/tree-view/stories/tree-view-tooltip.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-trailing.story.js +34 -0
- package/lib/cjs/next/tree-view/stories/tree-view-trailing.story.js.map +1 -0
- package/lib/cjs/next/tree-view/stories/tree-view-uncontrolled.story.js +33 -0
- package/lib/cjs/next/tree-view/stories/tree-view-uncontrolled.story.js.map +1 -0
- package/lib/esm/icons/generated/custom/AddNode.js +1 -0
- package/lib/esm/icons/generated/custom/AddNode.js.map +1 -1
- package/lib/esm/icons/generated/custom/Appearance.js +28 -0
- package/lib/esm/icons/generated/custom/Appearance.js.map +1 -0
- package/lib/esm/icons/generated/custom/index.js +1 -0
- package/lib/esm/icons/generated/custom/index.js.map +1 -1
- package/lib/esm/next/index.js +1 -1
- package/lib/esm/next/index.js.map +1 -1
- package/lib/esm/next/tree-view/TreeView.js +454 -0
- package/lib/esm/next/tree-view/TreeView.js.map +1 -0
- package/lib/esm/next/tree-view/index.js +22 -0
- package/lib/esm/next/tree-view/index.js.map +1 -0
- package/lib/esm/next/tree-view/stories/index.js +46 -0
- package/lib/esm/next/tree-view/stories/index.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-actions.story.js +34 -0
- package/lib/esm/next/tree-view/stories/tree-view-actions.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-lazy.story.js +147 -0
- package/lib/esm/next/tree-view/stories/tree-view-lazy.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-multi.story.js +71 -0
- package/lib/esm/next/tree-view/stories/tree-view-multi.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-non-selectable-folders.story.js +33 -0
- package/lib/esm/next/tree-view/stories/tree-view-non-selectable-folders.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-single.story.js +33 -0
- package/lib/esm/next/tree-view/stories/tree-view-single.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-tooltip.story.js +32 -0
- package/lib/esm/next/tree-view/stories/tree-view-tooltip.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-trailing.story.js +32 -0
- package/lib/esm/next/tree-view/stories/tree-view-trailing.story.js.map +1 -0
- package/lib/esm/next/tree-view/stories/tree-view-uncontrolled.story.js +31 -0
- package/lib/esm/next/tree-view/stories/tree-view-uncontrolled.story.js.map +1 -0
- package/lib/types/icons/generated/custom/AddNode.d.ts +1 -0
- package/lib/types/icons/generated/custom/AddNode.d.ts.map +1 -1
- package/lib/types/icons/generated/custom/Appearance.d.ts +29 -0
- package/lib/types/icons/generated/custom/Appearance.d.ts.map +1 -0
- package/lib/types/icons/generated/custom/index.d.ts +1 -0
- package/lib/types/icons/generated/custom/index.d.ts.map +1 -1
- package/lib/types/next/index.d.ts +1 -0
- package/lib/types/next/index.d.ts.map +1 -1
- package/lib/types/next/tree-view/TreeView.d.ts +79 -0
- package/lib/types/next/tree-view/TreeView.d.ts.map +1 -0
- package/lib/types/next/tree-view/index.d.ts +22 -0
- package/lib/types/next/tree-view/index.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/index.d.ts +37 -0
- package/lib/types/next/tree-view/stories/index.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-actions.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-actions.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-lazy.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-lazy.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-multi.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-multi.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-non-selectable-folders.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-non-selectable-folders.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-single.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-single.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-tooltip.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-tooltip.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-trailing.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-trailing.story.d.ts.map +1 -0
- package/lib/types/next/tree-view/stories/tree-view-uncontrolled.story.d.ts +24 -0
- package/lib/types/next/tree-view/stories/tree-view-uncontrolled.story.d.ts.map +1 -0
- package/package.json +2 -2
|
@@ -0,0 +1,460 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __rest = (this && this.__rest) || function (s, e) {
|
|
3
|
+
var t = {};
|
|
4
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
|
|
5
|
+
t[p] = s[p];
|
|
6
|
+
if (s != null && typeof Object.getOwnPropertySymbols === "function")
|
|
7
|
+
for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
8
|
+
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
|
|
9
|
+
t[p[i]] = s[p[i]];
|
|
10
|
+
}
|
|
11
|
+
return t;
|
|
12
|
+
};
|
|
13
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
14
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
15
|
+
};
|
|
16
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
|
+
exports.TreeView = void 0;
|
|
18
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
19
|
+
/**
|
|
20
|
+
*
|
|
21
|
+
* Copyright (c) "Neo4j"
|
|
22
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
23
|
+
*
|
|
24
|
+
* This file is part of Neo4j.
|
|
25
|
+
*
|
|
26
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
27
|
+
* it under the terms of the GNU General Public License as published by
|
|
28
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
29
|
+
* (at your option) any later version.
|
|
30
|
+
*
|
|
31
|
+
* This program is distributed in the hope that it will be useful,
|
|
32
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
33
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
34
|
+
* GNU General Public License for more details.
|
|
35
|
+
*
|
|
36
|
+
* You should have received a copy of the GNU General Public License
|
|
37
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
38
|
+
*/
|
|
39
|
+
const react_1 = require("@floating-ui/react");
|
|
40
|
+
const classnames_1 = __importDefault(require("classnames"));
|
|
41
|
+
const react_2 = require("react");
|
|
42
|
+
const use_semi_controlled_state_1 = require("../../_common/use-semi-controlled-state");
|
|
43
|
+
const checkbox_1 = require("../../checkbox");
|
|
44
|
+
const clean_icon_button_1 = require("../../clean-icon-button");
|
|
45
|
+
const conditional_wrap_1 = require("../../conditional-wrap");
|
|
46
|
+
const icons_1 = require("../../icons");
|
|
47
|
+
const menu_1 = require("../../menu");
|
|
48
|
+
const skeleton_1 = require("../../skeleton");
|
|
49
|
+
const tooltip_1 = require("../../tooltip");
|
|
50
|
+
const noop = () => undefined;
|
|
51
|
+
const TREE_EVENTS = {
|
|
52
|
+
action: 'treeitem-action',
|
|
53
|
+
collapse: 'treeitem-collapse',
|
|
54
|
+
expand: 'treeitem-expand',
|
|
55
|
+
select: 'treeitem-select',
|
|
56
|
+
};
|
|
57
|
+
const TreeViewContext = (0, react_2.createContext)({
|
|
58
|
+
focusedId: null,
|
|
59
|
+
level: 1,
|
|
60
|
+
selectionMode: 'single',
|
|
61
|
+
setFocusedId: noop,
|
|
62
|
+
});
|
|
63
|
+
function getVisibleTreeItems(root) {
|
|
64
|
+
return Array.from(root.querySelectorAll('[role="treeitem"]:not([role="group"][hidden] [role="treeitem"])')).filter((el) => {
|
|
65
|
+
let parent = el.parentElement;
|
|
66
|
+
while (parent && parent !== root) {
|
|
67
|
+
if (parent.getAttribute('role') === 'group' && parent.hidden) {
|
|
68
|
+
return false;
|
|
69
|
+
}
|
|
70
|
+
parent = parent.parentElement;
|
|
71
|
+
}
|
|
72
|
+
return true;
|
|
73
|
+
});
|
|
74
|
+
}
|
|
75
|
+
function annotateTreeItems(children) {
|
|
76
|
+
const items = react_2.Children.toArray(children);
|
|
77
|
+
const treeItemCount = items.filter((child) => (0, react_2.isValidElement)(child) && child.type === Item).length;
|
|
78
|
+
let posInSet = 0;
|
|
79
|
+
return react_2.Children.map(children, (child) => {
|
|
80
|
+
if ((0, react_2.isValidElement)(child) && child.type === Item) {
|
|
81
|
+
posInSet++;
|
|
82
|
+
return (0, react_2.cloneElement)(child, {
|
|
83
|
+
'aria-posinset': posInSet,
|
|
84
|
+
'aria-setsize': treeItemCount,
|
|
85
|
+
});
|
|
86
|
+
}
|
|
87
|
+
return child;
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
/**
|
|
91
|
+
* Root container for a tree view. Renders a `role="tree"` element with full
|
|
92
|
+
* keyboard navigation (arrow keys, Home/End, Enter/Space) following the
|
|
93
|
+
* WAI-ARIA TreeView pattern.
|
|
94
|
+
*
|
|
95
|
+
* Direct children should be `TreeView.Item` or `TreeView.SkeletonItem`.
|
|
96
|
+
*
|
|
97
|
+
* @example
|
|
98
|
+
* ```tsx
|
|
99
|
+
* <TreeView ariaLabel="Files">
|
|
100
|
+
* <TreeView.Item title="README.md" onSelectedChange={setSelected} isSelected={selected} />
|
|
101
|
+
* </TreeView>
|
|
102
|
+
* ```
|
|
103
|
+
*
|
|
104
|
+
* @alpha - this component is still in development and may change in the future. It might not have feature parity with the old tree view yet.
|
|
105
|
+
*/
|
|
106
|
+
const Root = (_a) => {
|
|
107
|
+
var { children, selectionMode = 'single', ariaLabel, ariaLabelledby, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["children", "selectionMode", "ariaLabel", "ariaLabelledby", "className", "style", "htmlAttributes", "ref"]);
|
|
108
|
+
const treeRef = (0, react_2.useRef)(null);
|
|
109
|
+
const mergedRef = (0, react_1.useMergeRefs)([treeRef, ref]);
|
|
110
|
+
const [focusedId, setFocusedId] = (0, react_2.useState)(null);
|
|
111
|
+
const handleKeyDown = (0, react_2.useCallback)((e) => {
|
|
112
|
+
const root = treeRef.current;
|
|
113
|
+
if (!root) {
|
|
114
|
+
return;
|
|
115
|
+
}
|
|
116
|
+
const items = getVisibleTreeItems(root);
|
|
117
|
+
if (items.length === 0) {
|
|
118
|
+
return;
|
|
119
|
+
}
|
|
120
|
+
const currentIndex = items.findIndex((el) => el.id === focusedId);
|
|
121
|
+
let isHandled = true;
|
|
122
|
+
switch (e.key) {
|
|
123
|
+
case 'ArrowDown': {
|
|
124
|
+
const nextIndex = currentIndex < items.length - 1 ? currentIndex + 1 : currentIndex;
|
|
125
|
+
const nextItem = items[nextIndex];
|
|
126
|
+
if (nextItem) {
|
|
127
|
+
setFocusedId(nextItem.id);
|
|
128
|
+
nextItem.focus();
|
|
129
|
+
}
|
|
130
|
+
break;
|
|
131
|
+
}
|
|
132
|
+
case 'ArrowUp': {
|
|
133
|
+
const prevIndex = currentIndex > 0 ? currentIndex - 1 : 0;
|
|
134
|
+
const prevItem = items[prevIndex];
|
|
135
|
+
if (prevItem) {
|
|
136
|
+
setFocusedId(prevItem.id);
|
|
137
|
+
prevItem.focus();
|
|
138
|
+
}
|
|
139
|
+
break;
|
|
140
|
+
}
|
|
141
|
+
case 'ArrowRight': {
|
|
142
|
+
const current = currentIndex >= 0 ? items[currentIndex] : null;
|
|
143
|
+
if (!current) {
|
|
144
|
+
break;
|
|
145
|
+
}
|
|
146
|
+
const isExpanded = current.getAttribute('aria-expanded');
|
|
147
|
+
if (isExpanded === 'false') {
|
|
148
|
+
current.dispatchEvent(new CustomEvent(TREE_EVENTS.expand));
|
|
149
|
+
}
|
|
150
|
+
else if (isExpanded === 'true') {
|
|
151
|
+
const nextIndex = currentIndex + 1;
|
|
152
|
+
if (nextIndex < items.length) {
|
|
153
|
+
const nextItem = items[nextIndex];
|
|
154
|
+
setFocusedId(nextItem.id);
|
|
155
|
+
nextItem.focus();
|
|
156
|
+
}
|
|
157
|
+
}
|
|
158
|
+
break;
|
|
159
|
+
}
|
|
160
|
+
case 'ArrowLeft': {
|
|
161
|
+
const current = currentIndex >= 0 ? items[currentIndex] : null;
|
|
162
|
+
if (!current) {
|
|
163
|
+
break;
|
|
164
|
+
}
|
|
165
|
+
const isExpanded = current.getAttribute('aria-expanded');
|
|
166
|
+
if (isExpanded === 'true') {
|
|
167
|
+
current.dispatchEvent(new CustomEvent(TREE_EVENTS.collapse));
|
|
168
|
+
}
|
|
169
|
+
else {
|
|
170
|
+
const parentGroup = current.closest('[role="group"]');
|
|
171
|
+
if (parentGroup === null || parentGroup === void 0 ? void 0 : parentGroup.id) {
|
|
172
|
+
const parentItem = root.querySelector(`[aria-owns="${parentGroup.id}"]`);
|
|
173
|
+
if (parentItem) {
|
|
174
|
+
setFocusedId(parentItem.id);
|
|
175
|
+
parentItem.focus();
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
break;
|
|
180
|
+
}
|
|
181
|
+
case 'Home': {
|
|
182
|
+
const first = items[0];
|
|
183
|
+
if (first) {
|
|
184
|
+
setFocusedId(first.id);
|
|
185
|
+
first.focus();
|
|
186
|
+
}
|
|
187
|
+
break;
|
|
188
|
+
}
|
|
189
|
+
case 'End': {
|
|
190
|
+
const last = items[items.length - 1];
|
|
191
|
+
if (last) {
|
|
192
|
+
setFocusedId(last.id);
|
|
193
|
+
last.focus();
|
|
194
|
+
}
|
|
195
|
+
break;
|
|
196
|
+
}
|
|
197
|
+
case 'Enter':
|
|
198
|
+
case ' ': {
|
|
199
|
+
const current = currentIndex >= 0 ? items[currentIndex] : null;
|
|
200
|
+
if (current) {
|
|
201
|
+
current.dispatchEvent(new CustomEvent(TREE_EVENTS.select));
|
|
202
|
+
}
|
|
203
|
+
break;
|
|
204
|
+
}
|
|
205
|
+
case 'F10': {
|
|
206
|
+
if (e.shiftKey) {
|
|
207
|
+
const current = currentIndex >= 0 ? items[currentIndex] : null;
|
|
208
|
+
if (current) {
|
|
209
|
+
current.dispatchEvent(new CustomEvent(TREE_EVENTS.action));
|
|
210
|
+
}
|
|
211
|
+
}
|
|
212
|
+
else {
|
|
213
|
+
isHandled = false;
|
|
214
|
+
}
|
|
215
|
+
break;
|
|
216
|
+
}
|
|
217
|
+
default:
|
|
218
|
+
isHandled = false;
|
|
219
|
+
}
|
|
220
|
+
if (isHandled) {
|
|
221
|
+
e.preventDefault();
|
|
222
|
+
e.stopPropagation();
|
|
223
|
+
}
|
|
224
|
+
}, [focusedId]);
|
|
225
|
+
const handleFocus = (0, react_2.useCallback)((e) => {
|
|
226
|
+
const root = treeRef.current;
|
|
227
|
+
if (!root) {
|
|
228
|
+
return;
|
|
229
|
+
}
|
|
230
|
+
if (e.target === root) {
|
|
231
|
+
const items = getVisibleTreeItems(root);
|
|
232
|
+
const alreadyFocused = focusedId
|
|
233
|
+
? items.find((el) => el.id === focusedId)
|
|
234
|
+
: null;
|
|
235
|
+
const target = alreadyFocused !== null && alreadyFocused !== void 0 ? alreadyFocused : items[0];
|
|
236
|
+
if (target) {
|
|
237
|
+
setFocusedId(target.id);
|
|
238
|
+
target.focus();
|
|
239
|
+
}
|
|
240
|
+
}
|
|
241
|
+
}, [focusedId]);
|
|
242
|
+
const classes = (0, classnames_1.default)(className, 'ndl-tree-view-new');
|
|
243
|
+
return ((0, jsx_runtime_1.jsx)(TreeViewContext.Provider, { value: { focusedId, level: 1, selectionMode, setFocusedId }, children: (0, jsx_runtime_1.jsx)("div", Object.assign({ ref: mergedRef, role: "tree", "aria-multiselectable": selectionMode === 'multiple' || undefined, tabIndex: 0, className: classes, onKeyDown: handleKeyDown, onFocus: handleFocus, "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : undefined, "aria-labelledby": ariaLabelledby, style: style }, htmlAttributes, restProps, { children: annotateTreeItems(children) })) }));
|
|
244
|
+
};
|
|
245
|
+
/**
|
|
246
|
+
* A single item within a `TreeView`. Renders a `role="treeitem"` element that
|
|
247
|
+
* supports selection, expansion, leading/trailing visuals, and an action menu.
|
|
248
|
+
*
|
|
249
|
+
* The `title` prop provides the item's label content. Nesting `TreeView.Item`
|
|
250
|
+
* elements as `children` creates a hierarchical tree structure.
|
|
251
|
+
*
|
|
252
|
+
* Supports both controlled (`isExpanded`) and uncontrolled (`defaultExpanded`)
|
|
253
|
+
* expansion, as well as lazy loading via `hasChildren` + `isLoading`.
|
|
254
|
+
*
|
|
255
|
+
* @example
|
|
256
|
+
* ```tsx
|
|
257
|
+
* <TreeView.Item
|
|
258
|
+
* title="src"
|
|
259
|
+
* leadingVisual={<FolderIcon />}
|
|
260
|
+
* isSelected={selected}
|
|
261
|
+
* onSelectedChange={setSelected}
|
|
262
|
+
* >
|
|
263
|
+
* <TreeView.Item title="index.ts" />
|
|
264
|
+
* </TreeView.Item>
|
|
265
|
+
* ```
|
|
266
|
+
*/
|
|
267
|
+
const Item = (_a) => {
|
|
268
|
+
var { actionMenuItems, children, defaultExpanded = false, hasChildren: hasChildrenProp, isDisabled, isExpanded: isExpandedProp, isIndeterminate, isLoading, isSelected, leadingVisual, title, tooltipContent, tooltipProps, trailingContent, onExpandedChange, onSelectedChange, actionMenuProps, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["actionMenuItems", "children", "defaultExpanded", "hasChildren", "isDisabled", "isExpanded", "isIndeterminate", "isLoading", "isSelected", "leadingVisual", "title", "tooltipContent", "tooltipProps", "trailingContent", "onExpandedChange", "onSelectedChange", "actionMenuProps", "className", "style", "htmlAttributes", "ref"]);
|
|
269
|
+
const generatedId = (0, react_2.useId)();
|
|
270
|
+
const itemId = `ndl-treeitem-${generatedId}`;
|
|
271
|
+
const titleId = `ndl-treeitem-title-${generatedId}`;
|
|
272
|
+
const groupId = `ndl-treegroup-${generatedId}`;
|
|
273
|
+
const itemRef = (0, react_2.useRef)(null);
|
|
274
|
+
const actionButtonRef = (0, react_2.useRef)(null);
|
|
275
|
+
const didOpenViaKeyboard = (0, react_2.useRef)(false);
|
|
276
|
+
const [isMenuOpen, setIsMenuOpen] = (0, react_2.useState)(false);
|
|
277
|
+
const { focusedId, level, selectionMode, setFocusedId } = (0, react_2.useContext)(TreeViewContext);
|
|
278
|
+
const isControlledExpansion = isExpandedProp !== undefined;
|
|
279
|
+
const [isExpanded, setIsExpanded] = (0, use_semi_controlled_state_1.useSemicontrolledState)({
|
|
280
|
+
isControlled: isControlledExpansion,
|
|
281
|
+
onChange: onExpandedChange,
|
|
282
|
+
state: isExpandedProp !== null && isExpandedProp !== void 0 ? isExpandedProp : defaultExpanded,
|
|
283
|
+
});
|
|
284
|
+
const hasChildren = hasChildrenProp !== null && hasChildrenProp !== void 0 ? hasChildrenProp : react_2.Children.count(children) > 0;
|
|
285
|
+
const isSelectable = onSelectedChange !== undefined;
|
|
286
|
+
const isMultiple = selectionMode === 'multiple';
|
|
287
|
+
const toggleExpanded = (0, react_2.useCallback)(() => {
|
|
288
|
+
if (isDisabled) {
|
|
289
|
+
return;
|
|
290
|
+
}
|
|
291
|
+
if (hasChildren) {
|
|
292
|
+
setIsExpanded(!isExpanded);
|
|
293
|
+
}
|
|
294
|
+
}, [isDisabled, hasChildren, setIsExpanded, isExpanded]);
|
|
295
|
+
const handleSelect = (0, react_2.useCallback)(() => {
|
|
296
|
+
if (isDisabled) {
|
|
297
|
+
return;
|
|
298
|
+
}
|
|
299
|
+
onSelectedChange === null || onSelectedChange === void 0 ? void 0 : onSelectedChange(!isSelected);
|
|
300
|
+
}, [isDisabled, isSelected, onSelectedChange]);
|
|
301
|
+
const handleClick = (0, react_2.useCallback)(() => {
|
|
302
|
+
if (isDisabled) {
|
|
303
|
+
return;
|
|
304
|
+
}
|
|
305
|
+
setFocusedId(itemId);
|
|
306
|
+
if (isSelectable) {
|
|
307
|
+
handleSelect();
|
|
308
|
+
}
|
|
309
|
+
else {
|
|
310
|
+
toggleExpanded();
|
|
311
|
+
}
|
|
312
|
+
}, [
|
|
313
|
+
isDisabled,
|
|
314
|
+
setFocusedId,
|
|
315
|
+
itemId,
|
|
316
|
+
isSelectable,
|
|
317
|
+
handleSelect,
|
|
318
|
+
toggleExpanded,
|
|
319
|
+
]);
|
|
320
|
+
const handleChevronClick = (0, react_2.useCallback)((e) => {
|
|
321
|
+
e.stopPropagation();
|
|
322
|
+
if (isDisabled) {
|
|
323
|
+
return;
|
|
324
|
+
}
|
|
325
|
+
setFocusedId(itemId);
|
|
326
|
+
toggleExpanded();
|
|
327
|
+
}, [isDisabled, setFocusedId, itemId, toggleExpanded]);
|
|
328
|
+
const handleMenuClose = (0, react_2.useCallback)(() => {
|
|
329
|
+
var _a;
|
|
330
|
+
setIsMenuOpen(false);
|
|
331
|
+
if (didOpenViaKeyboard.current) {
|
|
332
|
+
(_a = itemRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
333
|
+
didOpenViaKeyboard.current = false;
|
|
334
|
+
}
|
|
335
|
+
}, []);
|
|
336
|
+
const handleCustomEvents = (0, react_2.useCallback)((e) => {
|
|
337
|
+
if (e.type === TREE_EVENTS.expand) {
|
|
338
|
+
e.stopPropagation();
|
|
339
|
+
if (hasChildren && !isExpanded && !isDisabled) {
|
|
340
|
+
setIsExpanded(true);
|
|
341
|
+
}
|
|
342
|
+
}
|
|
343
|
+
else if (e.type === TREE_EVENTS.collapse) {
|
|
344
|
+
e.stopPropagation();
|
|
345
|
+
if (hasChildren && isExpanded && !isDisabled) {
|
|
346
|
+
setIsExpanded(false);
|
|
347
|
+
}
|
|
348
|
+
}
|
|
349
|
+
else if (e.type === TREE_EVENTS.select) {
|
|
350
|
+
e.stopPropagation();
|
|
351
|
+
if (isSelectable) {
|
|
352
|
+
handleSelect();
|
|
353
|
+
}
|
|
354
|
+
else {
|
|
355
|
+
toggleExpanded();
|
|
356
|
+
}
|
|
357
|
+
}
|
|
358
|
+
else if (e.type === TREE_EVENTS.action) {
|
|
359
|
+
e.stopPropagation();
|
|
360
|
+
if (actionMenuItems && !isDisabled) {
|
|
361
|
+
didOpenViaKeyboard.current = true;
|
|
362
|
+
setIsMenuOpen(true);
|
|
363
|
+
}
|
|
364
|
+
}
|
|
365
|
+
}, [
|
|
366
|
+
actionMenuItems,
|
|
367
|
+
hasChildren,
|
|
368
|
+
isExpanded,
|
|
369
|
+
isDisabled,
|
|
370
|
+
isSelectable,
|
|
371
|
+
setIsExpanded,
|
|
372
|
+
handleSelect,
|
|
373
|
+
toggleExpanded,
|
|
374
|
+
]);
|
|
375
|
+
const callbackRef = (0, react_2.useCallback)((node) => {
|
|
376
|
+
const prev = itemRef.current;
|
|
377
|
+
if (prev) {
|
|
378
|
+
prev.removeEventListener(TREE_EVENTS.expand, handleCustomEvents);
|
|
379
|
+
prev.removeEventListener(TREE_EVENTS.collapse, handleCustomEvents);
|
|
380
|
+
prev.removeEventListener(TREE_EVENTS.select, handleCustomEvents);
|
|
381
|
+
prev.removeEventListener(TREE_EVENTS.action, handleCustomEvents);
|
|
382
|
+
}
|
|
383
|
+
itemRef.current = node;
|
|
384
|
+
if (node) {
|
|
385
|
+
node.addEventListener(TREE_EVENTS.expand, handleCustomEvents);
|
|
386
|
+
node.addEventListener(TREE_EVENTS.collapse, handleCustomEvents);
|
|
387
|
+
node.addEventListener(TREE_EVENTS.select, handleCustomEvents);
|
|
388
|
+
node.addEventListener(TREE_EVENTS.action, handleCustomEvents);
|
|
389
|
+
}
|
|
390
|
+
}, [handleCustomEvents]);
|
|
391
|
+
const mergedRef = (0, react_1.useMergeRefs)([callbackRef, ref]);
|
|
392
|
+
const isFocused = focusedId === itemId;
|
|
393
|
+
const selectionAriaProps = (() => {
|
|
394
|
+
if (!isSelectable) {
|
|
395
|
+
return {};
|
|
396
|
+
}
|
|
397
|
+
if (isMultiple) {
|
|
398
|
+
return {
|
|
399
|
+
'aria-checked': isIndeterminate
|
|
400
|
+
? 'mixed'
|
|
401
|
+
: (isSelected !== null && isSelected !== void 0 ? isSelected : false),
|
|
402
|
+
};
|
|
403
|
+
}
|
|
404
|
+
return { 'aria-selected': isSelected !== null && isSelected !== void 0 ? isSelected : false };
|
|
405
|
+
})();
|
|
406
|
+
const itemElement = (
|
|
407
|
+
// eslint-disable-next-line jsx-a11y/click-events-have-key-events -- keyboard handled on tree root; aria-selected/aria-checked applied via spread
|
|
408
|
+
(0, jsx_runtime_1.jsx)("div", Object.assign({ ref: mergedRef, id: itemId,
|
|
409
|
+
// eslint-disable-next-line jsx-a11y/role-has-required-aria-props -- aria-selected/aria-checked applied conditionally via spread
|
|
410
|
+
role: "treeitem" }, selectionAriaProps, { "aria-expanded": hasChildren ? isExpanded : undefined, "aria-owns": hasChildren ? groupId : undefined, "aria-disabled": isDisabled || undefined, "aria-busy": isLoading || undefined, "aria-keyshortcuts": actionMenuItems ? 'Shift+F10' : undefined, "aria-labelledby": titleId, "aria-level": level, tabIndex: isFocused ? 0 : -1, className: (0, classnames_1.default)('ndl-tree-view-new-item', className, {
|
|
411
|
+
'ndl-tree-view-new-item--disabled': isDisabled,
|
|
412
|
+
'ndl-tree-view-new-item--parent': hasChildren,
|
|
413
|
+
'ndl-tree-view-new-item--selected': isSelected && isSelectable,
|
|
414
|
+
}), style: Object.assign({ '--tree-level': level - 1 }, style), onClick: (e) => {
|
|
415
|
+
e.stopPropagation();
|
|
416
|
+
handleClick();
|
|
417
|
+
} }, htmlAttributes, restProps, { children: (0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ndl-tree-view-new-item-content', {
|
|
418
|
+
'ndl-tree-view-new-item-content--parent': hasChildren,
|
|
419
|
+
}), children: [hasChildren && (
|
|
420
|
+
// eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions -- keyboard handled on tree root
|
|
421
|
+
(0, jsx_runtime_1.jsx)("span", { className: "ndl-tree-view-new-chevron", "aria-disabled": isDisabled, onClick: handleChevronClick, children: (0, jsx_runtime_1.jsx)(icons_1.ChevronRightIconOutline, { className: (0, classnames_1.default)('ndl-tree-view-new-chevron-icon', {
|
|
422
|
+
'ndl-tree-view-new-chevron-icon--open': isExpanded,
|
|
423
|
+
}) }) })), leadingVisual && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-tree-view-new-item-content-leading-visual", children: leadingVisual })), isMultiple && isSelectable && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-tree-view-new-checkbox", inert: true, children: (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { style: { borderWidth: '1.5px' }, ariaLabel: "Select", isChecked: isSelected, isIndeterminate: isIndeterminate, isDisabled: isDisabled, onChange: noop }) })), (0, jsx_runtime_1.jsx)("div", { id: titleId, className: "ndl-tree-view-new-item-content-title", children: title }), trailingContent && ((0, jsx_runtime_1.jsx)("div", { className: "ndl-tree-view-new-item-content-trailing-content", children: trailingContent })), actionMenuItems && ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)('ndl-tree-view-new-action', {
|
|
424
|
+
'ndl-tree-view-new-action--visible': isMenuOpen,
|
|
425
|
+
}), children: [(0, jsx_runtime_1.jsx)(clean_icon_button_1.CleanIconButton, { ref: actionButtonRef, size: "small", description: null, isDisabled: isDisabled, style: { height: '24px', width: '24px' }, htmlAttributes: {
|
|
426
|
+
'aria-expanded': isMenuOpen || undefined,
|
|
427
|
+
'aria-haspopup': 'menu',
|
|
428
|
+
'aria-label': 'Actions',
|
|
429
|
+
onClick: (e) => {
|
|
430
|
+
e.stopPropagation();
|
|
431
|
+
didOpenViaKeyboard.current = false;
|
|
432
|
+
setIsMenuOpen((prev) => !prev);
|
|
433
|
+
},
|
|
434
|
+
tabIndex: -1,
|
|
435
|
+
}, children: (0, jsx_runtime_1.jsx)(icons_1.EllipsisHorizontalIconOutline, {}) }), (0, jsx_runtime_1.jsx)(menu_1.Menu, Object.assign({ isOpen: isMenuOpen, anchorRef: actionButtonRef, onClose: handleMenuClose }, actionMenuProps, { children: actionMenuItems }))] }))] }) })));
|
|
436
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(conditional_wrap_1.ConditionalWrap, { shouldWrap: tooltipContent !== undefined && tooltipContent !== null, wrap: (children) => ((0, jsx_runtime_1.jsxs)(tooltip_1.Tooltip, Object.assign({ type: "simple", hoverDelay: { close: 0, open: 500 }, isDisabled: isMenuOpen, followCursor: true }, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.root, { children: [(0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Trigger, Object.assign({ hasButtonWrapper: true }, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.trigger, { children: children })), (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip.Content, Object.assign({}, tooltipProps === null || tooltipProps === void 0 ? void 0 : tooltipProps.content, { children: tooltipContent }))] }))), children: itemElement }), hasChildren && ((0, jsx_runtime_1.jsx)(TreeViewContext.Provider, { value: { focusedId, level: level + 1, selectionMode, setFocusedId }, children: (0, jsx_runtime_1.jsx)("div", { role: "group", id: groupId, hidden: !isExpanded, style: { '--tree-level': level - 1 }, children: annotateTreeItems(children) }) }))] }));
|
|
437
|
+
};
|
|
438
|
+
/**
|
|
439
|
+
* A skeleton placeholder for tree items that are being loaded. Renders one or
|
|
440
|
+
* more `Skeleton` rows at the current nesting depth. The element is
|
|
441
|
+
* `aria-hidden` since it is purely a visual indicator and not interactive.
|
|
442
|
+
*
|
|
443
|
+
* Typically used inside a `TreeView.Item` that has `isLoading` set, to give
|
|
444
|
+
* the user a visual hint that child items are being fetched.
|
|
445
|
+
*
|
|
446
|
+
* @example
|
|
447
|
+
* ```tsx
|
|
448
|
+
* <TreeView.Item title="Lazy folder" hasChildren isLoading={isLoading} isExpanded>
|
|
449
|
+
* {isLoading && <TreeView.SkeletonItem rows={3} />}
|
|
450
|
+
* </TreeView.Item>
|
|
451
|
+
* ```
|
|
452
|
+
*/
|
|
453
|
+
const SkeletonItem = (_a) => {
|
|
454
|
+
var { rows = 1, className, style, htmlAttributes, ref } = _a, restProps = __rest(_a, ["rows", "className", "style", "htmlAttributes", "ref"]);
|
|
455
|
+
const { level } = (0, react_2.useContext)(TreeViewContext);
|
|
456
|
+
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, "aria-hidden": "true", className: (0, classnames_1.default)('ndl-tree-view-new-skeleton', className), style: Object.assign({ '--tree-level': level - 1 }, style) }, htmlAttributes, restProps, { children: Array.from({ length: rows }, (_, i) => ((0, jsx_runtime_1.jsx)(skeleton_1.Skeleton, { height: "18px", width: "100%" }, i))) })));
|
|
457
|
+
};
|
|
458
|
+
const TreeView = Object.assign(Root, { Item, SkeletonItem });
|
|
459
|
+
exports.TreeView = TreeView;
|
|
460
|
+
//# sourceMappingURL=TreeView.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TreeView.js","sourceRoot":"","sources":["../../../../src/next/tree-view/TreeView.tsx"],"names":[],"mappings":"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","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nimport { useMergeRefs } from '@floating-ui/react';\nimport classNames from 'classnames';\nimport {\n Children,\n cloneElement,\n createContext,\n isValidElement,\n useCallback,\n useContext,\n useId,\n useRef,\n useState,\n} from 'react';\n\nimport { type CommonProps, type TooltipObjectProps } from '../../_common/types';\nimport { useSemicontrolledState } from '../../_common/use-semi-controlled-state';\nimport { Checkbox } from '../../checkbox';\nimport { CleanIconButton } from '../../clean-icon-button';\nimport { ConditionalWrap } from '../../conditional-wrap';\nimport {\n ChevronRightIconOutline,\n EllipsisHorizontalIconOutline,\n} from '../../icons';\nimport { Menu } from '../../menu';\nimport { Skeleton } from '../../skeleton';\nimport { Tooltip } from '../../tooltip';\n\ntype SelectionMode = 'single' | 'multiple';\n\ntype TreeViewContextValue = {\n focusedId: string | null;\n level: number;\n selectionMode: SelectionMode;\n setFocusedId: (id: string | null) => void;\n};\n\nconst noop = () => undefined;\n\nconst TREE_EVENTS = {\n action: 'treeitem-action',\n collapse: 'treeitem-collapse',\n expand: 'treeitem-expand',\n select: 'treeitem-select',\n} as const;\n\nconst TreeViewContext = createContext<TreeViewContextValue>({\n focusedId: null,\n level: 1,\n selectionMode: 'single',\n setFocusedId: noop,\n});\n\nfunction getVisibleTreeItems(root: HTMLElement): HTMLElement[] {\n return Array.from(\n root.querySelectorAll<HTMLElement>(\n '[role=\"treeitem\"]:not([role=\"group\"][hidden] [role=\"treeitem\"])',\n ),\n ).filter((el) => {\n let parent = el.parentElement;\n while (parent && parent !== root) {\n if (parent.getAttribute('role') === 'group' && parent.hidden) {\n return false;\n }\n parent = parent.parentElement;\n }\n return true;\n });\n}\n\nfunction annotateTreeItems(children: React.ReactNode): React.ReactNode {\n const items = Children.toArray(children);\n const treeItemCount = items.filter(\n (child): child is React.ReactElement =>\n isValidElement(child) && child.type === Item,\n ).length;\n\n let posInSet = 0;\n return Children.map(children, (child) => {\n if (isValidElement(child) && child.type === Item) {\n posInSet++;\n return cloneElement(\n child as React.ReactElement<React.HTMLAttributes<HTMLElement>>,\n {\n 'aria-posinset': posInSet,\n 'aria-setsize': treeItemCount,\n },\n );\n }\n return child;\n });\n}\n\ntype RootProps = {\n /** The aria-label for the tree. Required for accessibility, unless using ariaLabelledby. Pass null to omit. */\n ariaLabel: string | null;\n /** The aria-labelledby for the tree. Pass a string of space-separated IDs of elements that label the tree. */\n ariaLabelledby?: string;\n /** The children of the tree. Should be TreeView.Item components or TreeView.SkeletonItem components only. */\n children?: React.ReactNode;\n /** Selection mode for the tree. Defaults to \"single\". */\n selectionMode?: SelectionMode;\n};\n\n/**\n * Root container for a tree view. Renders a `role=\"tree\"` element with full\n * keyboard navigation (arrow keys, Home/End, Enter/Space) following the\n * WAI-ARIA TreeView pattern.\n *\n * Direct children should be `TreeView.Item` or `TreeView.SkeletonItem`.\n *\n * @example\n * ```tsx\n * <TreeView ariaLabel=\"Files\">\n * <TreeView.Item title=\"README.md\" onSelectedChange={setSelected} isSelected={selected} />\n * </TreeView>\n * ```\n *\n * @alpha - this component is still in development and may change in the future. It might not have feature parity with the old tree view yet.\n */\nconst Root = ({\n children,\n selectionMode = 'single',\n ariaLabel,\n ariaLabelledby,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', RootProps>) => {\n const treeRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRefs([treeRef, ref]);\n const [focusedId, setFocusedId] = useState<string | null>(null);\n\n const handleKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLDivElement>) => {\n const root = treeRef.current;\n if (!root) {\n return;\n }\n\n const items = getVisibleTreeItems(root);\n if (items.length === 0) {\n return;\n }\n\n const currentIndex = items.findIndex((el) => el.id === focusedId);\n let isHandled = true;\n\n switch (e.key) {\n case 'ArrowDown': {\n const nextIndex =\n currentIndex < items.length - 1 ? currentIndex + 1 : currentIndex;\n const nextItem = items[nextIndex];\n if (nextItem) {\n setFocusedId(nextItem.id);\n nextItem.focus();\n }\n break;\n }\n case 'ArrowUp': {\n const prevIndex = currentIndex > 0 ? currentIndex - 1 : 0;\n const prevItem = items[prevIndex];\n if (prevItem) {\n setFocusedId(prevItem.id);\n prevItem.focus();\n }\n break;\n }\n case 'ArrowRight': {\n const current = currentIndex >= 0 ? items[currentIndex] : null;\n if (!current) {\n break;\n }\n const isExpanded = current.getAttribute('aria-expanded');\n if (isExpanded === 'false') {\n current.dispatchEvent(new CustomEvent(TREE_EVENTS.expand));\n } else if (isExpanded === 'true') {\n const nextIndex = currentIndex + 1;\n if (nextIndex < items.length) {\n const nextItem = items[nextIndex];\n setFocusedId(nextItem.id);\n nextItem.focus();\n }\n }\n break;\n }\n case 'ArrowLeft': {\n const current = currentIndex >= 0 ? items[currentIndex] : null;\n if (!current) {\n break;\n }\n const isExpanded = current.getAttribute('aria-expanded');\n if (isExpanded === 'true') {\n current.dispatchEvent(new CustomEvent(TREE_EVENTS.collapse));\n } else {\n const parentGroup = current.closest('[role=\"group\"]');\n if (parentGroup?.id) {\n const parentItem = root.querySelector<HTMLElement>(\n `[aria-owns=\"${parentGroup.id}\"]`,\n );\n if (parentItem) {\n setFocusedId(parentItem.id);\n parentItem.focus();\n }\n }\n }\n break;\n }\n case 'Home': {\n const first = items[0];\n if (first) {\n setFocusedId(first.id);\n first.focus();\n }\n break;\n }\n case 'End': {\n const last = items[items.length - 1];\n if (last) {\n setFocusedId(last.id);\n last.focus();\n }\n break;\n }\n case 'Enter':\n case ' ': {\n const current = currentIndex >= 0 ? items[currentIndex] : null;\n if (current) {\n current.dispatchEvent(new CustomEvent(TREE_EVENTS.select));\n }\n break;\n }\n case 'F10': {\n if (e.shiftKey) {\n const current = currentIndex >= 0 ? items[currentIndex] : null;\n if (current) {\n current.dispatchEvent(new CustomEvent(TREE_EVENTS.action));\n }\n } else {\n isHandled = false;\n }\n break;\n }\n default:\n isHandled = false;\n }\n\n if (isHandled) {\n e.preventDefault();\n e.stopPropagation();\n }\n },\n [focusedId],\n );\n\n const handleFocus = useCallback(\n (e: React.FocusEvent<HTMLDivElement>) => {\n const root = treeRef.current;\n if (!root) {\n return;\n }\n\n if (e.target === root) {\n const items = getVisibleTreeItems(root);\n const alreadyFocused = focusedId\n ? items.find((el) => el.id === focusedId)\n : null;\n const target = alreadyFocused ?? items[0];\n if (target) {\n setFocusedId(target.id);\n target.focus();\n }\n }\n },\n [focusedId],\n );\n\n const classes = classNames(className, 'ndl-tree-view-new');\n\n return (\n <TreeViewContext.Provider\n value={{ focusedId, level: 1, selectionMode, setFocusedId }}\n >\n <div\n ref={mergedRef}\n role=\"tree\"\n aria-multiselectable={selectionMode === 'multiple' || undefined}\n tabIndex={0}\n className={classes}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n aria-label={ariaLabel ?? undefined}\n aria-labelledby={ariaLabelledby}\n style={style}\n {...htmlAttributes}\n {...restProps}\n >\n {annotateTreeItems(children)}\n </div>\n </TreeViewContext.Provider>\n );\n};\n\ntype ItemProps = {\n /** Nested TreeView.Item or TreeView.SkeletonItem elements rendered as sub-items in a collapsible group. */\n children?: React.ReactNode;\n /** The label content displayed in the item row. */\n title?: React.ReactNode;\n /** Default expansion for uncontrolled items */\n defaultExpanded?: boolean;\n /** Whether the item has children. Decides if the item should render a chevron for expansion. Needed for lazy loading. */\n hasChildren?: boolean;\n /** Whether the item is disabled */\n isDisabled?: boolean;\n /** Whether the item is expanded. Makes the item controlled. */\n isExpanded?: boolean;\n /** Whether the item is in an indeterminate state. Only meaningful in multi-select mode for parent nodes. */\n isIndeterminate?: boolean;\n /** Whether the item is loading. Applies aria-busy=\"true\" to the item. */\n isLoading?: boolean;\n /** Whether the item is selected */\n isSelected?: boolean;\n /** Leading visual for the item. */\n leadingVisual?: React.ReactNode;\n /** Trailing content for the item. Shown after the children but before the action menu. */\n trailingContent?: React.ReactNode;\n /** ReactNode containing Menu.Item elements to render in an action menu. When provided, an action button is rendered. */\n actionMenuItems?: React.ReactNode;\n /** Props forwarded to the Menu sub-components (anchorRef, onClose). */\n actionMenuProps?: React.ComponentProps<typeof Menu>;\n /** Content rendered inside the tooltip. When provided, the item is wrapped in a Tooltip. */\n tooltipContent?: React.ReactNode;\n /** Props forwarded to the Tooltip sub-components (root, trigger, content). */\n tooltipProps?: TooltipObjectProps;\n /** Callback called when the item is expanded/collapsed. */\n onExpandedChange?: (isExpanded: boolean) => void;\n /** Callback called when the item is selected/deselected. */\n onSelectedChange?: (isSelected: boolean) => void;\n};\n\n/**\n * A single item within a `TreeView`. Renders a `role=\"treeitem\"` element that\n * supports selection, expansion, leading/trailing visuals, and an action menu.\n *\n * The `title` prop provides the item's label content. Nesting `TreeView.Item`\n * elements as `children` creates a hierarchical tree structure.\n *\n * Supports both controlled (`isExpanded`) and uncontrolled (`defaultExpanded`)\n * expansion, as well as lazy loading via `hasChildren` + `isLoading`.\n *\n * @example\n * ```tsx\n * <TreeView.Item\n * title=\"src\"\n * leadingVisual={<FolderIcon />}\n * isSelected={selected}\n * onSelectedChange={setSelected}\n * >\n * <TreeView.Item title=\"index.ts\" />\n * </TreeView.Item>\n * ```\n */\nconst Item = ({\n actionMenuItems,\n children,\n defaultExpanded = false,\n hasChildren: hasChildrenProp,\n isDisabled,\n isExpanded: isExpandedProp,\n isIndeterminate,\n isLoading,\n isSelected,\n leadingVisual,\n title,\n tooltipContent,\n tooltipProps,\n trailingContent,\n onExpandedChange,\n onSelectedChange,\n actionMenuProps,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', ItemProps>) => {\n const generatedId = useId();\n const itemId = `ndl-treeitem-${generatedId}`;\n const titleId = `ndl-treeitem-title-${generatedId}`;\n const groupId = `ndl-treegroup-${generatedId}`;\n const itemRef = useRef<HTMLDivElement>(null);\n const actionButtonRef = useRef<HTMLButtonElement>(null);\n const didOpenViaKeyboard = useRef(false);\n const [isMenuOpen, setIsMenuOpen] = useState(false);\n const { focusedId, level, selectionMode, setFocusedId } =\n useContext(TreeViewContext);\n\n const isControlledExpansion = isExpandedProp !== undefined;\n const [isExpanded, setIsExpanded] = useSemicontrolledState({\n isControlled: isControlledExpansion,\n onChange: onExpandedChange,\n state: isExpandedProp ?? defaultExpanded,\n });\n\n const hasChildren = hasChildrenProp ?? Children.count(children) > 0;\n const isSelectable = onSelectedChange !== undefined;\n const isMultiple = selectionMode === 'multiple';\n\n const toggleExpanded = useCallback(() => {\n if (isDisabled) {\n return;\n }\n if (hasChildren) {\n setIsExpanded(!isExpanded);\n }\n }, [isDisabled, hasChildren, setIsExpanded, isExpanded]);\n\n const handleSelect = useCallback(() => {\n if (isDisabled) {\n return;\n }\n onSelectedChange?.(!isSelected);\n }, [isDisabled, isSelected, onSelectedChange]);\n\n const handleClick = useCallback(() => {\n if (isDisabled) {\n return;\n }\n setFocusedId(itemId);\n if (isSelectable) {\n handleSelect();\n } else {\n toggleExpanded();\n }\n }, [\n isDisabled,\n setFocusedId,\n itemId,\n isSelectable,\n handleSelect,\n toggleExpanded,\n ]);\n\n const handleChevronClick = useCallback(\n (e: React.MouseEvent) => {\n e.stopPropagation();\n if (isDisabled) {\n return;\n }\n setFocusedId(itemId);\n toggleExpanded();\n },\n [isDisabled, setFocusedId, itemId, toggleExpanded],\n );\n\n const handleMenuClose = useCallback(() => {\n setIsMenuOpen(false);\n if (didOpenViaKeyboard.current) {\n itemRef.current?.focus();\n didOpenViaKeyboard.current = false;\n }\n }, []);\n\n const handleCustomEvents = useCallback(\n (e: Event) => {\n if (e.type === TREE_EVENTS.expand) {\n e.stopPropagation();\n if (hasChildren && !isExpanded && !isDisabled) {\n setIsExpanded(true);\n }\n } else if (e.type === TREE_EVENTS.collapse) {\n e.stopPropagation();\n if (hasChildren && isExpanded && !isDisabled) {\n setIsExpanded(false);\n }\n } else if (e.type === TREE_EVENTS.select) {\n e.stopPropagation();\n if (isSelectable) {\n handleSelect();\n } else {\n toggleExpanded();\n }\n } else if (e.type === TREE_EVENTS.action) {\n e.stopPropagation();\n if (actionMenuItems && !isDisabled) {\n didOpenViaKeyboard.current = true;\n setIsMenuOpen(true);\n }\n }\n },\n [\n actionMenuItems,\n hasChildren,\n isExpanded,\n isDisabled,\n isSelectable,\n setIsExpanded,\n handleSelect,\n toggleExpanded,\n ],\n );\n\n const callbackRef = useCallback(\n (node: HTMLDivElement | null) => {\n const prev = itemRef.current;\n if (prev) {\n prev.removeEventListener(TREE_EVENTS.expand, handleCustomEvents);\n prev.removeEventListener(TREE_EVENTS.collapse, handleCustomEvents);\n prev.removeEventListener(TREE_EVENTS.select, handleCustomEvents);\n prev.removeEventListener(TREE_EVENTS.action, handleCustomEvents);\n }\n (itemRef as React.MutableRefObject<HTMLDivElement | null>).current = node;\n if (node) {\n node.addEventListener(TREE_EVENTS.expand, handleCustomEvents);\n node.addEventListener(TREE_EVENTS.collapse, handleCustomEvents);\n node.addEventListener(TREE_EVENTS.select, handleCustomEvents);\n node.addEventListener(TREE_EVENTS.action, handleCustomEvents);\n }\n },\n [handleCustomEvents],\n );\n\n const mergedRef = useMergeRefs([callbackRef, ref]);\n\n const isFocused = focusedId === itemId;\n\n const selectionAriaProps = (() => {\n if (!isSelectable) {\n return {};\n }\n if (isMultiple) {\n return {\n 'aria-checked': isIndeterminate\n ? ('mixed' as const)\n : (isSelected ?? false),\n };\n }\n return { 'aria-selected': isSelected ?? false };\n })();\n\n const itemElement = (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events -- keyboard handled on tree root; aria-selected/aria-checked applied via spread\n <div\n ref={mergedRef}\n id={itemId}\n // eslint-disable-next-line jsx-a11y/role-has-required-aria-props -- aria-selected/aria-checked applied conditionally via spread\n role=\"treeitem\"\n {...selectionAriaProps}\n aria-expanded={hasChildren ? isExpanded : undefined}\n aria-owns={hasChildren ? groupId : undefined}\n aria-disabled={isDisabled || undefined}\n aria-busy={isLoading || undefined}\n aria-keyshortcuts={actionMenuItems ? 'Shift+F10' : undefined}\n aria-labelledby={titleId}\n aria-level={level}\n tabIndex={isFocused ? 0 : -1}\n className={classNames('ndl-tree-view-new-item', className, {\n 'ndl-tree-view-new-item--disabled': isDisabled,\n 'ndl-tree-view-new-item--parent': hasChildren,\n 'ndl-tree-view-new-item--selected': isSelected && isSelectable,\n })}\n style={{ '--tree-level': level - 1, ...style } as React.CSSProperties}\n onClick={(e) => {\n e.stopPropagation();\n handleClick();\n }}\n {...htmlAttributes}\n {...restProps}\n >\n <div\n className={classNames('ndl-tree-view-new-item-content', {\n 'ndl-tree-view-new-item-content--parent': hasChildren,\n })}\n >\n {hasChildren && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions -- keyboard handled on tree root\n <span\n className=\"ndl-tree-view-new-chevron\"\n aria-disabled={isDisabled}\n onClick={handleChevronClick}\n >\n <ChevronRightIconOutline\n className={classNames('ndl-tree-view-new-chevron-icon', {\n 'ndl-tree-view-new-chevron-icon--open': isExpanded,\n })}\n />\n </span>\n )}\n {leadingVisual && (\n <div className=\"ndl-tree-view-new-item-content-leading-visual\">\n {leadingVisual}\n </div>\n )}\n {isMultiple && isSelectable && (\n <div className=\"ndl-tree-view-new-checkbox\" inert>\n <Checkbox\n style={{ borderWidth: '1.5px' }}\n ariaLabel=\"Select\"\n isChecked={isSelected}\n isIndeterminate={isIndeterminate}\n isDisabled={isDisabled}\n onChange={noop}\n />\n </div>\n )}\n <div id={titleId} className=\"ndl-tree-view-new-item-content-title\">\n {title}\n </div>\n {trailingContent && (\n <div className=\"ndl-tree-view-new-item-content-trailing-content\">\n {trailingContent}\n </div>\n )}\n {actionMenuItems && (\n <div\n className={classNames('ndl-tree-view-new-action', {\n 'ndl-tree-view-new-action--visible': isMenuOpen,\n })}\n >\n <CleanIconButton\n ref={actionButtonRef}\n size=\"small\"\n description={null}\n isDisabled={isDisabled}\n style={{ height: '24px', width: '24px' }}\n htmlAttributes={{\n 'aria-expanded': isMenuOpen || undefined,\n 'aria-haspopup': 'menu',\n 'aria-label': 'Actions',\n onClick: (e: React.MouseEvent) => {\n e.stopPropagation();\n didOpenViaKeyboard.current = false;\n setIsMenuOpen((prev) => !prev);\n },\n tabIndex: -1,\n }}\n >\n <EllipsisHorizontalIconOutline />\n </CleanIconButton>\n <Menu\n isOpen={isMenuOpen}\n anchorRef={actionButtonRef}\n onClose={handleMenuClose}\n {...actionMenuProps}\n >\n {actionMenuItems}\n </Menu>\n </div>\n )}\n </div>\n </div>\n );\n\n return (\n <>\n <ConditionalWrap\n shouldWrap={tooltipContent !== undefined && tooltipContent !== null}\n wrap={(children) => (\n <Tooltip\n type=\"simple\"\n hoverDelay={{ close: 0, open: 500 }}\n isDisabled={isMenuOpen}\n followCursor={true}\n {...tooltipProps?.root}\n >\n <Tooltip.Trigger hasButtonWrapper {...tooltipProps?.trigger}>\n {children}\n </Tooltip.Trigger>\n <Tooltip.Content {...tooltipProps?.content}>\n {tooltipContent}\n </Tooltip.Content>\n </Tooltip>\n )}\n >\n {itemElement}\n </ConditionalWrap>\n {hasChildren && (\n <TreeViewContext.Provider\n value={{ focusedId, level: level + 1, selectionMode, setFocusedId }}\n >\n <div\n role=\"group\"\n id={groupId}\n hidden={!isExpanded}\n style={{ '--tree-level': level - 1 } as React.CSSProperties}\n >\n {annotateTreeItems(children)}\n </div>\n </TreeViewContext.Provider>\n )}\n </>\n );\n};\n\ntype SkeletonItemProps = {\n /** The number of rows to render. */\n rows?: number;\n};\n\n/**\n * A skeleton placeholder for tree items that are being loaded. Renders one or\n * more `Skeleton` rows at the current nesting depth. The element is\n * `aria-hidden` since it is purely a visual indicator and not interactive.\n *\n * Typically used inside a `TreeView.Item` that has `isLoading` set, to give\n * the user a visual hint that child items are being fetched.\n *\n * @example\n * ```tsx\n * <TreeView.Item title=\"Lazy folder\" hasChildren isLoading={isLoading} isExpanded>\n * {isLoading && <TreeView.SkeletonItem rows={3} />}\n * </TreeView.Item>\n * ```\n */\nconst SkeletonItem = ({\n rows = 1,\n className,\n style,\n htmlAttributes,\n ref,\n ...restProps\n}: CommonProps<'div', SkeletonItemProps>) => {\n const { level } = useContext(TreeViewContext);\n return (\n <div\n ref={ref}\n aria-hidden=\"true\"\n className={classNames('ndl-tree-view-new-skeleton', className)}\n style={{ '--tree-level': level - 1, ...style } as React.CSSProperties}\n {...htmlAttributes}\n {...restProps}\n >\n {Array.from({ length: rows }, (_, i) => (\n <Skeleton key={i} height=\"18px\" width=\"100%\" />\n ))}\n </div>\n );\n};\n\nconst TreeView = Object.assign(Root, { Item, SkeletonItem });\nexport { TreeView };\n"]}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
* Copyright (c) "Neo4j"
|
|
5
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
6
|
+
*
|
|
7
|
+
* This file is part of Neo4j.
|
|
8
|
+
*
|
|
9
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
10
|
+
* it under the terms of the GNU General Public License as published by
|
|
11
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
12
|
+
* (at your option) any later version.
|
|
13
|
+
*
|
|
14
|
+
* This program is distributed in the hope that it will be useful,
|
|
15
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
16
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
17
|
+
* GNU General Public License for more details.
|
|
18
|
+
*
|
|
19
|
+
* You should have received a copy of the GNU General Public License
|
|
20
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
21
|
+
*/
|
|
22
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
23
|
+
exports.TreeView = void 0;
|
|
24
|
+
var TreeView_1 = require("./TreeView");
|
|
25
|
+
Object.defineProperty(exports, "TreeView", { enumerable: true, get: function () { return TreeView_1.TreeView; } });
|
|
26
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/next/tree-view/index.ts"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;GAmBG;;;AAEH,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA","sourcesContent":["/**\n *\n * Copyright (c) \"Neo4j\"\n * Neo4j Sweden AB [http://neo4j.com]\n *\n * This file is part of Neo4j.\n *\n * Neo4j is free software: you can redistribute it and/or modify\n * it under the terms of the GNU General Public License as published by\n * the Free Software Foundation, either version 3 of the License, or\n * (at your option) any later version.\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program. If not, see <http://www.gnu.org/licenses/>.\n */\n\nexport { TreeView } from './TreeView';\n"]}
|
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
/**
|
|
3
|
+
*
|
|
4
|
+
* Copyright (c) "Neo4j"
|
|
5
|
+
* Neo4j Sweden AB [http://neo4j.com]
|
|
6
|
+
*
|
|
7
|
+
* This file is part of Neo4j.
|
|
8
|
+
*
|
|
9
|
+
* Neo4j is free software: you can redistribute it and/or modify
|
|
10
|
+
* it under the terms of the GNU General Public License as published by
|
|
11
|
+
* the Free Software Foundation, either version 3 of the License, or
|
|
12
|
+
* (at your option) any later version.
|
|
13
|
+
*
|
|
14
|
+
* This program is distributed in the hope that it will be useful,
|
|
15
|
+
* but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
16
|
+
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
17
|
+
* GNU General Public License for more details.
|
|
18
|
+
*
|
|
19
|
+
* You should have received a copy of the GNU General Public License
|
|
20
|
+
* along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|
21
|
+
*/
|
|
22
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
23
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
24
|
+
};
|
|
25
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
26
|
+
exports.TreeViewUncontrolledExpansionSrc = exports.TreeViewTooltipSrc = exports.TreeViewTrailingContentSrc = exports.TreeViewSingleSelectSrc = exports.TreeViewNonSelectableFoldersSrc = exports.TreeViewMultiSelectSrc = exports.TreeViewLazyLoadingSrc = exports.TreeViewActionsSrc = exports.TreeViewWithTooltip = exports.TreeViewWithTrailingContent = exports.TreeViewUncontrolledExpansion = exports.TreeViewWithActions = exports.TreeViewSingleSelect = exports.TreeViewNonSelectableFolders = exports.TreeViewMultiSelect = exports.TreeViewLazyLoading = void 0;
|
|
27
|
+
var tree_view_lazy_story_1 = require("./tree-view-lazy.story");
|
|
28
|
+
Object.defineProperty(exports, "TreeViewLazyLoading", { enumerable: true, get: function () { return __importDefault(tree_view_lazy_story_1).default; } });
|
|
29
|
+
var tree_view_multi_story_1 = require("./tree-view-multi.story");
|
|
30
|
+
Object.defineProperty(exports, "TreeViewMultiSelect", { enumerable: true, get: function () { return __importDefault(tree_view_multi_story_1).default; } });
|
|
31
|
+
var tree_view_non_selectable_folders_story_1 = require("./tree-view-non-selectable-folders.story");
|
|
32
|
+
Object.defineProperty(exports, "TreeViewNonSelectableFolders", { enumerable: true, get: function () { return __importDefault(tree_view_non_selectable_folders_story_1).default; } });
|
|
33
|
+
var tree_view_single_story_1 = require("./tree-view-single.story");
|
|
34
|
+
Object.defineProperty(exports, "TreeViewSingleSelect", { enumerable: true, get: function () { return __importDefault(tree_view_single_story_1).default; } });
|
|
35
|
+
var tree_view_actions_story_1 = require("./tree-view-actions.story");
|
|
36
|
+
Object.defineProperty(exports, "TreeViewWithActions", { enumerable: true, get: function () { return __importDefault(tree_view_actions_story_1).default; } });
|
|
37
|
+
var tree_view_uncontrolled_story_1 = require("./tree-view-uncontrolled.story");
|
|
38
|
+
Object.defineProperty(exports, "TreeViewUncontrolledExpansion", { enumerable: true, get: function () { return __importDefault(tree_view_uncontrolled_story_1).default; } });
|
|
39
|
+
var tree_view_trailing_story_1 = require("./tree-view-trailing.story");
|
|
40
|
+
Object.defineProperty(exports, "TreeViewWithTrailingContent", { enumerable: true, get: function () { return __importDefault(tree_view_trailing_story_1).default; } });
|
|
41
|
+
var tree_view_tooltip_story_1 = require("./tree-view-tooltip.story");
|
|
42
|
+
Object.defineProperty(exports, "TreeViewWithTooltip", { enumerable: true, get: function () { return __importDefault(tree_view_tooltip_story_1).default; } });
|
|
43
|
+
const export_stories_utils_1 = require("../../../_common/export-stories-utils");
|
|
44
|
+
const tree_view_actions_story_raw_1 = __importDefault(require("./tree-view-actions.story?raw"));
|
|
45
|
+
const tree_view_lazy_story_raw_1 = __importDefault(require("./tree-view-lazy.story?raw"));
|
|
46
|
+
const tree_view_multi_story_raw_1 = __importDefault(require("./tree-view-multi.story?raw"));
|
|
47
|
+
const tree_view_non_selectable_folders_story_raw_1 = __importDefault(require("./tree-view-non-selectable-folders.story?raw"));
|
|
48
|
+
const tree_view_single_story_raw_1 = __importDefault(require("./tree-view-single.story?raw"));
|
|
49
|
+
const tree_view_tooltip_story_raw_1 = __importDefault(require("./tree-view-tooltip.story?raw"));
|
|
50
|
+
const tree_view_trailing_story_raw_1 = __importDefault(require("./tree-view-trailing.story?raw"));
|
|
51
|
+
const tree_view_uncontrolled_story_raw_1 = __importDefault(require("./tree-view-uncontrolled.story?raw"));
|
|
52
|
+
exports.TreeViewActionsSrc = (0, export_stories_utils_1.removeLicenseHeader)(tree_view_actions_story_raw_1.default);
|
|
53
|
+
exports.TreeViewLazyLoadingSrc = (0, export_stories_utils_1.removeLicenseHeader)(tree_view_lazy_story_raw_1.default);
|
|
54
|
+
exports.TreeViewMultiSelectSrc = (0, export_stories_utils_1.removeLicenseHeader)(tree_view_multi_story_raw_1.default);
|
|
55
|
+
exports.TreeViewNonSelectableFoldersSrc = (0, export_stories_utils_1.removeLicenseHeader)(tree_view_non_selectable_folders_story_raw_1.default);
|
|
56
|
+
exports.TreeViewSingleSelectSrc = (0, export_stories_utils_1.removeLicenseHeader)(tree_view_single_story_raw_1.default);
|
|
57
|
+
exports.TreeViewTrailingContentSrc = (0, export_stories_utils_1.removeLicenseHeader)(tree_view_trailing_story_raw_1.default);
|
|
58
|
+
exports.TreeViewTooltipSrc = (0, export_stories_utils_1.removeLicenseHeader)(tree_view_tooltip_story_raw_1.default);
|
|
59
|
+
exports.TreeViewUncontrolledExpansionSrc = (0, export_stories_utils_1.removeLicenseHeader)(tree_view_uncontrolled_story_raw_1.default);
|
|
60
|
+
//# sourceMappingURL=index.js.map
|