@v-c/tree 1.0.0 → 1.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/NodeList.cjs DELETED
@@ -1,352 +0,0 @@
1
- Object.defineProperties(exports, {
2
- __esModule: { value: true },
3
- [Symbol.toStringTag]: { value: "Module" }
4
- });
5
- const require_rolldown_runtime = require("./_virtual/rolldown_runtime.cjs");
6
- const require_treeUtil = require("./utils/treeUtil.cjs");
7
- const require_MotionTreeNode = require("./MotionTreeNode.cjs");
8
- const require_diffUtil = require("./utils/diffUtil.cjs");
9
- let vue = require("vue");
10
- let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
11
- let _v_c_util_dist_hooks_useId = require("@v-c/util/dist/hooks/useId");
12
- _v_c_util_dist_hooks_useId = require_rolldown_runtime.__toESM(_v_c_util_dist_hooks_useId);
13
- let _v_c_virtual_list = require("@v-c/virtual-list");
14
- _v_c_virtual_list = require_rolldown_runtime.__toESM(_v_c_virtual_list);
15
- function itemKey(item) {
16
- const { key, pos } = item;
17
- return String(require_treeUtil.getKey(key, pos));
18
- }
19
- const MOTION_KEY = `VC_TREE_MOTION_${Math.random()}`;
20
- var MotionNode = { key: MOTION_KEY };
21
- const MotionEntity = {
22
- key: MOTION_KEY,
23
- level: 0,
24
- index: 0,
25
- pos: "0",
26
- node: MotionNode,
27
- nodes: [MotionNode]
28
- };
29
- var MotionFlattenData = {
30
- parent: null,
31
- children: [],
32
- pos: MotionEntity.pos,
33
- data: MotionNode,
34
- title: null,
35
- key: MOTION_KEY,
36
- isStart: [],
37
- isEnd: []
38
- };
39
- function getMinimumRangeTransitionRange(list, virtual, height, itemHeight) {
40
- if (virtual === false || !height || !itemHeight) return list;
41
- return list.slice(0, Math.ceil(height / itemHeight) + 1);
42
- }
43
- var NodeList = /* @__PURE__ */ (0, vue.defineComponent)((props, { attrs, expose }) => {
44
- const treeId = (0, _v_c_util_dist_hooks_useId.default)();
45
- const listRef = (0, vue.ref)();
46
- const indentMeasurerRef = (0, vue.ref)();
47
- const { expandedKeys, data } = (0, _v_c_util_dist_props_util.toPropsRefs)(props, "expandedKeys", "data");
48
- const treeNodeRequiredProps = (0, vue.computed)(() => ({
49
- expandedKeys: expandedKeys.value || [],
50
- selectedKeys: props.selectedKeys || [],
51
- loadedKeys: props.loadedKeys || [],
52
- loadingKeys: props.loadingKeys || [],
53
- checkedKeys: props.checkedKeys || [],
54
- halfCheckedKeys: props.halfCheckedKeys || [],
55
- dragOverNodeKey: props.dragOverNodeKey,
56
- dropPosition: props.dropPosition,
57
- keyEntities: props.keyEntities
58
- }));
59
- expose({
60
- scrollTo: (scroll) => {
61
- listRef.value?.scrollTo(scroll);
62
- },
63
- getIndentWidth: () => indentMeasurerRef.value?.offsetWidth || 0
64
- });
65
- const VirtualListAny = _v_c_virtual_list.default;
66
- const prevExpandedKeys = (0, vue.shallowRef)(props.expandedKeys);
67
- const prevData = (0, vue.shallowRef)(props.data || []);
68
- const transitionData = (0, vue.shallowRef)(props.data || []);
69
- const transitionRange = (0, vue.shallowRef)([]);
70
- const motionType = (0, vue.ref)(null);
71
- const dataRef = (0, vue.shallowRef)(props.data || []);
72
- (0, vue.watch)(data, (newData) => {
73
- dataRef.value = newData || [];
74
- }, { immediate: true });
75
- function onMotionEnd() {
76
- const latestData = dataRef.value;
77
- prevData.value = latestData;
78
- transitionData.value = latestData;
79
- transitionRange.value = [];
80
- motionType.value = null;
81
- props.onListChangeEnd?.();
82
- }
83
- (0, vue.watch)(() => props.dragging, (dragging) => {
84
- if (!dragging) onMotionEnd();
85
- }, { immediate: true });
86
- (0, vue.watch)([expandedKeys, data], () => {
87
- const diffExpanded = require_diffUtil.findExpandedKeys(prevExpandedKeys.value, expandedKeys.value);
88
- if (diffExpanded.key !== null) if (diffExpanded.add) {
89
- const keyIndex = prevData.value?.findIndex?.(({ key }) => key === diffExpanded.key);
90
- const rangeNodes = getMinimumRangeTransitionRange(require_diffUtil.getExpandRange(prevData.value, data.value, diffExpanded.key), props.virtual, props.height, props.itemHeight);
91
- const newTransitionData = prevData.value?.slice?.() ?? [];
92
- newTransitionData.splice(keyIndex + 1, 0, MotionFlattenData);
93
- transitionData.value = newTransitionData;
94
- transitionRange.value = rangeNodes;
95
- motionType.value = "show";
96
- } else {
97
- const keyIndex = data.value?.findIndex?.(({ key }) => key === diffExpanded.key);
98
- const rangeNodes = getMinimumRangeTransitionRange(require_diffUtil.getExpandRange(data.value, prevData.value, diffExpanded.key), props.virtual, props.height, props.itemHeight);
99
- const newTransitionData = data.value?.slice?.() ?? [];
100
- newTransitionData.splice(keyIndex + 1, 0, MotionFlattenData);
101
- transitionData.value = newTransitionData;
102
- transitionRange.value = rangeNodes;
103
- motionType.value = "hide";
104
- }
105
- else if (prevData.value !== data.value) {
106
- prevData.value = data.value || [];
107
- transitionData.value = data.value || [];
108
- }
109
- prevExpandedKeys.value = expandedKeys.value || [];
110
- }, {
111
- immediate: true,
112
- flush: "post"
113
- });
114
- const mergedData = (0, vue.computed)(() => props.motion ? transitionData.value : props.data || []);
115
- return () => {
116
- const { motion, activeItem, focusable, disabled, tabIndex, prefixCls, virtual, itemHeight, height, scrollWidth, onScroll, onContextmenu, onKeyDown, onFocus, onBlur, onListChangeStart, onActiveChange } = props;
117
- return (0, vue.createVNode)(vue.Fragment, null, [(0, vue.createVNode)("div", {
118
- "class": `${prefixCls}-treenode`,
119
- "aria-hidden": true,
120
- "style": {
121
- position: "absolute",
122
- pointerEvents: "none",
123
- visibility: "hidden",
124
- height: 0,
125
- overflow: "hidden",
126
- border: 0,
127
- padding: 0
128
- }
129
- }, [(0, vue.createVNode)("div", { "class": `${prefixCls}-indent` }, [(0, vue.createVNode)("div", {
130
- "ref": indentMeasurerRef,
131
- "class": `${prefixCls}-indent-unit`
132
- }, null)])]), (0, vue.createVNode)(VirtualListAny, (0, vue.mergeProps)(attrs, {
133
- "data": mergedData.value,
134
- "itemKey": itemKey,
135
- "height": height,
136
- "fullHeight": false,
137
- "virtual": virtual,
138
- "itemHeight": itemHeight,
139
- "scrollWidth": scrollWidth,
140
- "prefixCls": `${prefixCls}-list`,
141
- "ref": listRef,
142
- "role": "tree",
143
- "tabindex": focusable !== false && !disabled ? tabIndex : void 0,
144
- "aria-activedescendant": activeItem ? require_treeUtil.getTreeNodeId(treeId, activeItem.key) : void 0,
145
- "style": props.style,
146
- "onContextmenu": onContextmenu,
147
- "onScroll": onScroll,
148
- "onKeydown": onKeyDown,
149
- "onFocus": onFocus,
150
- "onBlur": onBlur,
151
- "onVisibleChange": (originList) => {
152
- if (motionType.value && originList.every((item) => itemKey(item) !== MOTION_KEY)) onMotionEnd();
153
- }
154
- }), { default: ({ item: treeNode }) => {
155
- const { pos, data: nodeData, title, key, isStart, isEnd } = treeNode;
156
- const mergedKey = require_treeUtil.getKey(key, pos);
157
- const treeNodeProps = require_treeUtil.getTreeNodeProps(mergedKey, treeNodeRequiredProps.value);
158
- const active = !!props.activeItem && mergedKey === props.activeItem.key;
159
- const restProps = { ...nodeData || {} };
160
- delete restProps.key;
161
- delete restProps.children;
162
- return (0, vue.createVNode)(require_MotionTreeNode.default, (0, vue.mergeProps)(restProps, treeNodeProps, {
163
- "title": title,
164
- "active": active,
165
- "pos": pos,
166
- "data": nodeData,
167
- "isStart": isStart,
168
- "isEnd": isEnd,
169
- "motion": motion,
170
- "motionNodes": key === MOTION_KEY ? transitionRange.value : null,
171
- "motionType": motionType.value,
172
- "onMotionStart": onListChangeStart,
173
- "onMotionEnd": onMotionEnd,
174
- "treeNodeRequiredProps": treeNodeRequiredProps.value,
175
- "treeId": treeId,
176
- "onMouseMove": () => onActiveChange?.(null)
177
- }), null);
178
- } })]);
179
- };
180
- }, {
181
- props: {
182
- prefixCls: {
183
- type: String,
184
- required: true,
185
- default: void 0
186
- },
187
- style: {
188
- required: false,
189
- default: void 0
190
- },
191
- data: {
192
- type: Array,
193
- required: false,
194
- default: void 0
195
- },
196
- focusable: {
197
- type: Boolean,
198
- required: false,
199
- default: void 0
200
- },
201
- tabIndex: {
202
- type: Number,
203
- required: false,
204
- default: void 0
205
- },
206
- selectable: {
207
- type: Boolean,
208
- required: false,
209
- default: void 0
210
- },
211
- checkable: {
212
- type: Boolean,
213
- required: false,
214
- default: void 0
215
- },
216
- disabled: {
217
- type: Boolean,
218
- required: false,
219
- default: void 0
220
- },
221
- expandedKeys: {
222
- type: Array,
223
- required: true,
224
- default: void 0
225
- },
226
- selectedKeys: {
227
- type: Array,
228
- required: true,
229
- default: void 0
230
- },
231
- checkedKeys: {
232
- type: Array,
233
- required: true,
234
- default: void 0
235
- },
236
- loadedKeys: {
237
- type: Array,
238
- required: true,
239
- default: void 0
240
- },
241
- loadingKeys: {
242
- type: Array,
243
- required: true,
244
- default: void 0
245
- },
246
- halfCheckedKeys: {
247
- type: Array,
248
- required: true,
249
- default: void 0
250
- },
251
- keyEntities: {
252
- type: Object,
253
- required: true,
254
- default: void 0
255
- },
256
- dragging: {
257
- type: Boolean,
258
- required: false,
259
- default: void 0
260
- },
261
- dragOverNodeKey: {
262
- type: [
263
- String,
264
- Number,
265
- null
266
- ],
267
- required: true,
268
- default: void 0
269
- },
270
- dropPosition: {
271
- type: [Number, null],
272
- required: true,
273
- default: void 0
274
- },
275
- motion: {
276
- type: Object,
277
- required: false,
278
- default: void 0
279
- },
280
- height: {
281
- type: Number,
282
- required: false,
283
- default: void 0
284
- },
285
- itemHeight: {
286
- type: Number,
287
- required: false,
288
- default: void 0
289
- },
290
- virtual: {
291
- type: Boolean,
292
- required: false,
293
- default: void 0
294
- },
295
- scrollWidth: {
296
- type: Number,
297
- required: false,
298
- default: void 0
299
- },
300
- activeItem: {
301
- type: [Object, null],
302
- required: false,
303
- default: void 0
304
- },
305
- onKeyDown: {
306
- type: Function,
307
- required: false,
308
- default: void 0
309
- },
310
- onFocus: {
311
- type: Function,
312
- required: false,
313
- default: void 0
314
- },
315
- onBlur: {
316
- type: Function,
317
- required: false,
318
- default: void 0
319
- },
320
- onActiveChange: {
321
- type: Function,
322
- required: false,
323
- default: void 0
324
- },
325
- onListChangeStart: {
326
- type: Function,
327
- required: false,
328
- default: void 0
329
- },
330
- onListChangeEnd: {
331
- type: Function,
332
- required: false,
333
- default: void 0
334
- },
335
- onContextmenu: {
336
- type: Function,
337
- required: false,
338
- default: void 0
339
- },
340
- onScroll: {
341
- type: Function,
342
- required: false,
343
- default: void 0
344
- }
345
- },
346
- name: "NodeList",
347
- inheritAttrs: false
348
- });
349
- var NodeList_default = NodeList;
350
- exports.MOTION_KEY = MOTION_KEY;
351
- exports.MotionEntity = MotionEntity;
352
- exports.default = NodeList_default;