yuyeon 0.3.6-beta.0 → 0.3.6-beta.10
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/style.css +1 -1
- package/dist/yuyeon.js +3945 -4297
- package/dist/yuyeon.umd.cjs +3 -3
- package/lib/components/date-picker/index.js +2 -1
- package/lib/components/date-picker/index.js.map +1 -1
- package/lib/components/dialog/YDialog.js +11 -2
- package/lib/components/dialog/YDialog.js.map +1 -1
- package/lib/components/layer/YLayer.js +7 -2
- package/lib/components/layer/YLayer.js.map +1 -1
- package/lib/components/pagination/YPagination.js +10 -10
- package/lib/components/pagination/YPagination.js.map +1 -1
- package/lib/components/snackbar/YSnackbar.js +25 -17
- package/lib/components/snackbar/YSnackbar.js.map +1 -1
- package/lib/components/table/YDataTableHead.js +4 -4
- package/lib/components/table/YDataTableHead.js.map +1 -1
- package/lib/components/table/YDataTableRow.js +0 -1
- package/lib/components/table/YDataTableRow.js.map +1 -1
- package/lib/components/table/composables/items.js.map +1 -1
- package/lib/components/table/composables/selection.js.map +1 -1
- package/lib/components/time-select/TimeSelect.vue +344 -0
- package/lib/components/tree-view/YTreeView.js +8 -8
- package/lib/components/tree-view/YTreeView.js.map +1 -1
- package/lib/components/tree-view/YTreeView.scss +5 -0
- package/lib/components/tree-view/YTreeViewNode.js +34 -4
- package/lib/components/tree-view/YTreeViewNode.js.map +1 -1
- package/lib/components/tree-view/tree-view.js +2 -2
- package/lib/components/tree-view/tree-view.js.map +1 -1
- package/lib/util/animation/index.js +19 -0
- package/lib/util/animation/index.js.map +1 -0
- package/lib/util/date/adapters/yuyeon-date-adapter.js +5 -2
- package/lib/util/date/adapters/yuyeon-date-adapter.js.map +1 -1
- package/lib/util/date/built-in.js +58 -4
- package/lib/util/date/built-in.js.map +1 -1
- package/lib/util/date/index.js +3 -0
- package/lib/util/date/index.js.map +1 -1
- package/lib/util/date/types.js.map +1 -1
- package/package.json +2 -5
- package/types/components/badge/YBadge.d.ts +2 -2
- package/types/components/checkbox/YCheckbox.d.ts +1 -1
- package/types/components/checkbox/YInputCheckbox.d.ts +1 -1
- package/types/components/date-picker/YDateCalendar.d.ts +4 -4
- package/types/components/date-picker/YDatePicker.d.ts +12 -12
- package/types/components/date-picker/YDatePickerControl.d.ts +2 -2
- package/types/components/date-picker/YMonthPicker.d.ts +2 -2
- package/types/components/date-picker/YYearPicker.d.ts +2 -2
- package/types/components/date-picker/index.d.ts +2 -1
- package/types/components/dialog/YDialog.d.ts +63 -61
- package/types/components/dropdown/YDropdown.d.ts +41 -41
- package/types/components/field-input/YFieldInput.d.ts +3 -3
- package/types/components/icon/YIcon.d.ts +3 -3
- package/types/components/input/YInput.d.ts +3 -3
- package/types/components/ip-field/YIpv4Field.d.ts +1 -1
- package/types/components/layer/YLayer.d.ts +4 -3
- package/types/components/menu/YMenu.d.ts +6 -4
- package/types/components/pagination/YPagination.d.ts +19 -13
- package/types/components/select/YSelect.d.ts +87 -87
- package/types/components/snackbar/YSnackbar.d.ts +3 -3
- package/types/components/switch/YSwitch.d.ts +1 -1
- package/types/components/table/YDataTable.d.ts +4 -4
- package/types/components/table/YDataTableBody.d.ts +2 -2
- package/types/components/table/YDataTableServer.d.ts +4 -4
- package/types/components/table/composables/selection.d.ts +2 -2
- package/types/components/textarea/YTextarea.d.ts +24 -24
- package/types/components/tooltip/YTooltip.d.ts +3 -3
- package/types/components/tree-view/YTreeView.d.ts +16 -4
- package/types/components/tree-view/YTreeViewNode.d.ts +18 -0
- package/types/composables/coordinate/index.d.ts +2 -2
- package/types/shims.d.ts +2 -1
- package/types/util/animation/index.d.ts +1 -0
- package/types/util/date/adapters/yuyeon-date-adapter.d.ts +5 -1
- package/types/util/date/built-in.d.ts +19 -1
- package/types/util/date/index.d.ts +1 -0
- package/types/util/date/types.d.ts +5 -1
|
@@ -0,0 +1,344 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
import {
|
|
3
|
+
computed,
|
|
4
|
+
type PropType,
|
|
5
|
+
ref,
|
|
6
|
+
shallowRef,
|
|
7
|
+
useTemplateRef,
|
|
8
|
+
watch,
|
|
9
|
+
} from 'vue';
|
|
10
|
+
import { getHtmlElement } from 'yuyeon/util';
|
|
11
|
+
|
|
12
|
+
import { useDate } from '@/composables';
|
|
13
|
+
import { validateDate } from '@/util/date/index';
|
|
14
|
+
|
|
15
|
+
const props = defineProps({
|
|
16
|
+
variation: {
|
|
17
|
+
type: String as PropType<string>,
|
|
18
|
+
default: 'outlined',
|
|
19
|
+
},
|
|
20
|
+
offset: {
|
|
21
|
+
type: [Number, String],
|
|
22
|
+
default: 8,
|
|
23
|
+
},
|
|
24
|
+
position: {
|
|
25
|
+
type: String as PropType<
|
|
26
|
+
| 'start'
|
|
27
|
+
| 'end'
|
|
28
|
+
| 'top'
|
|
29
|
+
| 'bottom'
|
|
30
|
+
| 'default'
|
|
31
|
+
| 'right'
|
|
32
|
+
| 'left'
|
|
33
|
+
| undefined
|
|
34
|
+
>,
|
|
35
|
+
default: 'bottom',
|
|
36
|
+
},
|
|
37
|
+
align: {
|
|
38
|
+
type: String as PropType<
|
|
39
|
+
'start' | 'end' | 'center' | 'top' | 'bottom' | undefined
|
|
40
|
+
>,
|
|
41
|
+
default: 'start',
|
|
42
|
+
},
|
|
43
|
+
//
|
|
44
|
+
placeholder: {
|
|
45
|
+
type: String as PropType<string>,
|
|
46
|
+
default: 'hh:mm',
|
|
47
|
+
},
|
|
48
|
+
displayText: [Function, String] as PropType<
|
|
49
|
+
string | ((dateTime: number) => string)
|
|
50
|
+
>,
|
|
51
|
+
maxHeight: {
|
|
52
|
+
type: [Number, String],
|
|
53
|
+
},
|
|
54
|
+
name: String,
|
|
55
|
+
//
|
|
56
|
+
tabindex: {
|
|
57
|
+
type: String as PropType<string>,
|
|
58
|
+
default: '0',
|
|
59
|
+
},
|
|
60
|
+
label: String as PropType<string>,
|
|
61
|
+
floating: { type: Boolean as PropType<boolean>, default: false },
|
|
62
|
+
floated: { type: Boolean as PropType<boolean>, default: () => false },
|
|
63
|
+
readonly: Boolean as PropType<boolean>,
|
|
64
|
+
disabled: Boolean as PropType<boolean>,
|
|
65
|
+
status: {
|
|
66
|
+
type: String as PropType<'success' | 'warning' | 'error' | undefined>,
|
|
67
|
+
validator(value: string) {
|
|
68
|
+
return ['success', 'warning', 'error'].includes(value);
|
|
69
|
+
},
|
|
70
|
+
},
|
|
71
|
+
helperText: String,
|
|
72
|
+
validators: Array as PropType<((v: any) => boolean | string)[] | string[]>,
|
|
73
|
+
validateOn: {
|
|
74
|
+
type: String as PropType<string>,
|
|
75
|
+
},
|
|
76
|
+
validationValue: null,
|
|
77
|
+
maxErrors: {
|
|
78
|
+
type: [Number, String] as PropType<number | string>,
|
|
79
|
+
default: 1,
|
|
80
|
+
},
|
|
81
|
+
allowed: [Array, Function],
|
|
82
|
+
minutesStep: {
|
|
83
|
+
type: Number,
|
|
84
|
+
default: 15,
|
|
85
|
+
},
|
|
86
|
+
});
|
|
87
|
+
|
|
88
|
+
const emit = defineEmits(['change']);
|
|
89
|
+
|
|
90
|
+
const dateUtil = useDate();
|
|
91
|
+
const formatter = Intl.DateTimeFormat(dateUtil.locale, {
|
|
92
|
+
minute: 'numeric',
|
|
93
|
+
hour: 'numeric',
|
|
94
|
+
hour12: true,
|
|
95
|
+
timeZone: 'UTC',
|
|
96
|
+
});
|
|
97
|
+
|
|
98
|
+
const time = defineModel({ type: Number });
|
|
99
|
+
const itemRefs = useTemplateRef('item');
|
|
100
|
+
const cardRefs = useTemplateRef('card');
|
|
101
|
+
const opened = shallowRef(false);
|
|
102
|
+
const input = shallowRef('');
|
|
103
|
+
const vFocusIndex = shallowRef(-1);
|
|
104
|
+
const inputResult = ref<any>();
|
|
105
|
+
|
|
106
|
+
const view = computed(() => {
|
|
107
|
+
if (time.value != null) {
|
|
108
|
+
const date = new Date(time.value);
|
|
109
|
+
if (!validateDate(date)) return '';
|
|
110
|
+
|
|
111
|
+
return `${formatter.format(date)}`;
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
return '';
|
|
115
|
+
});
|
|
116
|
+
|
|
117
|
+
const allowedFilter = computed(() => {
|
|
118
|
+
const { allowed } = props;
|
|
119
|
+
if (Array.isArray(allowed) && allowed.length > 0) {
|
|
120
|
+
return (v: number) => (allowed as number[]).includes(v);
|
|
121
|
+
}
|
|
122
|
+
if (typeof allowed === 'function') {
|
|
123
|
+
return (v: number) => allowed(v);
|
|
124
|
+
}
|
|
125
|
+
return null;
|
|
126
|
+
});
|
|
127
|
+
|
|
128
|
+
const items = computed(() => {
|
|
129
|
+
const step = Math.min(props.minutesStep || 1, 24 * 60);
|
|
130
|
+
const list = Array.from(
|
|
131
|
+
{ length: Math.floor((24 * 60) / step) },
|
|
132
|
+
(_, i) => i * step,
|
|
133
|
+
).map((v) => {
|
|
134
|
+
const value = v * 60 * 1000;
|
|
135
|
+
const date = new Date(value);
|
|
136
|
+
return {
|
|
137
|
+
text: formatter.format(date),
|
|
138
|
+
value: value,
|
|
139
|
+
};
|
|
140
|
+
});
|
|
141
|
+
const aFilter = allowedFilter.value;
|
|
142
|
+
if (aFilter) {
|
|
143
|
+
return list.filter((item) => aFilter(item.value));
|
|
144
|
+
}
|
|
145
|
+
return list;
|
|
146
|
+
});
|
|
147
|
+
|
|
148
|
+
watch(
|
|
149
|
+
view,
|
|
150
|
+
(neo) => {
|
|
151
|
+
input.value = neo;
|
|
152
|
+
},
|
|
153
|
+
{ immediate: true },
|
|
154
|
+
);
|
|
155
|
+
|
|
156
|
+
watch(opened, (neo) => {
|
|
157
|
+
if (!neo) {
|
|
158
|
+
input.value = view.value;
|
|
159
|
+
vFocusIndex.value = -1;
|
|
160
|
+
} else {
|
|
161
|
+
vFocusIndex.value = 0;
|
|
162
|
+
}
|
|
163
|
+
});
|
|
164
|
+
|
|
165
|
+
function onInputField(event: InputEvent) {
|
|
166
|
+
const el = event.target as HTMLInputElement;
|
|
167
|
+
if (el) {
|
|
168
|
+
const parsed = dateUtil.parseTime(el.value);
|
|
169
|
+
let millis: number;
|
|
170
|
+
if (parsed) {
|
|
171
|
+
millis = parsed.hours * 3600000 + parsed.minutes * 60000;
|
|
172
|
+
inputResult.value = {
|
|
173
|
+
...parsed,
|
|
174
|
+
time: millis,
|
|
175
|
+
};
|
|
176
|
+
vFocusIndex.value = -1;
|
|
177
|
+
} else {
|
|
178
|
+
inputResult.value = undefined;
|
|
179
|
+
}
|
|
180
|
+
}
|
|
181
|
+
}
|
|
182
|
+
|
|
183
|
+
function onFocusField() {
|
|
184
|
+
setTimeout(() => {
|
|
185
|
+
opened.value = true;
|
|
186
|
+
}, 100);
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
function onBlurField() {
|
|
190
|
+
emitTime();
|
|
191
|
+
setTimeout(() => {
|
|
192
|
+
opened.value = false;
|
|
193
|
+
}, 400);
|
|
194
|
+
}
|
|
195
|
+
|
|
196
|
+
function onKeydownField(event: Event) {
|
|
197
|
+
const e = event as KeyboardEvent;
|
|
198
|
+
const length = items.value.length;
|
|
199
|
+
const index = vFocusIndex.value;
|
|
200
|
+
if (e.key === 'ArrowDown') {
|
|
201
|
+
event.preventDefault();
|
|
202
|
+
opened.value = true;
|
|
203
|
+
const nextIndex = getNextIndex(index, length, 1);
|
|
204
|
+
vFocusIndex.value = nextIndex;
|
|
205
|
+
focusItem(nextIndex);
|
|
206
|
+
} else if (e.key === 'ArrowUp') {
|
|
207
|
+
event.preventDefault();
|
|
208
|
+
opened.value = true;
|
|
209
|
+
const nextIndex = getNextIndex(index, length, -1);
|
|
210
|
+
vFocusIndex.value = nextIndex;
|
|
211
|
+
focusItem(nextIndex);
|
|
212
|
+
} else if (e.key === 'Enter') {
|
|
213
|
+
if (vFocusIndex.value != null) {
|
|
214
|
+
const item = items.value[vFocusIndex.value];
|
|
215
|
+
if (item) {
|
|
216
|
+
onClickItem(event, item);
|
|
217
|
+
opened.value = false;
|
|
218
|
+
}
|
|
219
|
+
} else {
|
|
220
|
+
emitTime();
|
|
221
|
+
}
|
|
222
|
+
} else if (e.key === 'Escape') {
|
|
223
|
+
opened.value = false;
|
|
224
|
+
} else {
|
|
225
|
+
opened.value = true;
|
|
226
|
+
}
|
|
227
|
+
}
|
|
228
|
+
|
|
229
|
+
function emitTime() {
|
|
230
|
+
const inputTime = inputResult.value?.time;
|
|
231
|
+
if (inputTime != null) {
|
|
232
|
+
if (
|
|
233
|
+
!allowedFilter.value ||
|
|
234
|
+
(allowedFilter.value && allowedFilter.value(inputTime))
|
|
235
|
+
) {
|
|
236
|
+
time.value = inputTime;
|
|
237
|
+
}
|
|
238
|
+
}
|
|
239
|
+
}
|
|
240
|
+
|
|
241
|
+
function onClickItem(event: Event, item: any) {
|
|
242
|
+
event.preventDefault();
|
|
243
|
+
emit('change', item.value, time.value, event);
|
|
244
|
+
time.value = item.value;
|
|
245
|
+
}
|
|
246
|
+
|
|
247
|
+
function focusItem(index: number) {
|
|
248
|
+
if (cardRefs.value && itemRefs.value) {
|
|
249
|
+
const itemRefIndex = itemRefs.value.findIndex?.((i) => {
|
|
250
|
+
const el = getHtmlElement(i!) as HTMLElement;
|
|
251
|
+
return el.dataset.index === String(index);
|
|
252
|
+
});
|
|
253
|
+
if (itemRefIndex != null && itemRefIndex !== -1) {
|
|
254
|
+
const itemEl = getHtmlElement(itemRefs.value[itemRefIndex]!) as
|
|
255
|
+
| HTMLElement
|
|
256
|
+
| undefined;
|
|
257
|
+
const cardEl = getHtmlElement(cardRefs.value);
|
|
258
|
+
if (itemEl && cardEl) {
|
|
259
|
+
cardEl.scrollTo({
|
|
260
|
+
top: itemEl.offsetTop - cardEl.offsetHeight / 2,
|
|
261
|
+
});
|
|
262
|
+
}
|
|
263
|
+
}
|
|
264
|
+
}
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
function onMouseenterItem(index: number) {
|
|
268
|
+
vFocusIndex.value = index;
|
|
269
|
+
}
|
|
270
|
+
|
|
271
|
+
function getNextIndex(
|
|
272
|
+
index: number | undefined,
|
|
273
|
+
length: number,
|
|
274
|
+
direction: 1 | -1,
|
|
275
|
+
) {
|
|
276
|
+
if (index == null) return 0;
|
|
277
|
+
const next = index + direction;
|
|
278
|
+
if (length <= next) {
|
|
279
|
+
return 0;
|
|
280
|
+
}
|
|
281
|
+
if (next < 0) {
|
|
282
|
+
return length - 1;
|
|
283
|
+
}
|
|
284
|
+
return next;
|
|
285
|
+
}
|
|
286
|
+
</script>
|
|
287
|
+
|
|
288
|
+
<template>
|
|
289
|
+
<div class="time-select">
|
|
290
|
+
<y-menu
|
|
291
|
+
v-model="opened"
|
|
292
|
+
:position="position"
|
|
293
|
+
:align="align"
|
|
294
|
+
:offset="offset"
|
|
295
|
+
:max-height="maxHeight"
|
|
296
|
+
:open-on-click-base="false"
|
|
297
|
+
prevent-close-bubble
|
|
298
|
+
content-classes="time-select-menu"
|
|
299
|
+
>
|
|
300
|
+
<template #base>
|
|
301
|
+
<y-field-input
|
|
302
|
+
v-model="input"
|
|
303
|
+
:variation="variation"
|
|
304
|
+
:placeholder="placeholder"
|
|
305
|
+
:disabled="disabled"
|
|
306
|
+
autocomplete="off"
|
|
307
|
+
@input="onInputField"
|
|
308
|
+
@focus="onFocusField"
|
|
309
|
+
@blur="onBlurField"
|
|
310
|
+
@keydown="onKeydownField"
|
|
311
|
+
>
|
|
312
|
+
</y-field-input>
|
|
313
|
+
</template>
|
|
314
|
+
<template #default>
|
|
315
|
+
<y-card ref="card">
|
|
316
|
+
<y-list>
|
|
317
|
+
<template v-for="(item, index) in items" :key="index">
|
|
318
|
+
<y-list-item
|
|
319
|
+
ref="item"
|
|
320
|
+
class="time-select-menu__item"
|
|
321
|
+
:class="{ 'y-list-item--active': vFocusIndex === index }"
|
|
322
|
+
:data-index="index"
|
|
323
|
+
@mouseenter="onMouseenterItem(index)"
|
|
324
|
+
@click="onClickItem($event, item)"
|
|
325
|
+
>
|
|
326
|
+
<slot name="item-text" :item="item" :index="index">
|
|
327
|
+
{{ item.text }}
|
|
328
|
+
</slot>
|
|
329
|
+
</y-list-item>
|
|
330
|
+
</template>
|
|
331
|
+
</y-list>
|
|
332
|
+
</y-card>
|
|
333
|
+
</template>
|
|
334
|
+
</y-menu>
|
|
335
|
+
</div>
|
|
336
|
+
</template>
|
|
337
|
+
|
|
338
|
+
<style lang="scss">
|
|
339
|
+
.time-select-menu {
|
|
340
|
+
&__item .y-list-item--focused:before {
|
|
341
|
+
opacity: 0.4;
|
|
342
|
+
}
|
|
343
|
+
}
|
|
344
|
+
</style>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { computed, defineComponent, onMounted, ref, shallowRef, watch, Fragment as _Fragment, createVNode as _createVNode, mergeProps as _mergeProps, createTextVNode as _createTextVNode } from
|
|
1
|
+
import { computed, defineComponent, onMounted, ref, shallowRef, watch, Fragment as _Fragment, createVNode as _createVNode, mergeProps as _mergeProps, createTextVNode as _createTextVNode } from 'vue';
|
|
2
2
|
import { provideTreeView } from "./tree-view.js";
|
|
3
3
|
import { useRender } from "../../composables/component.js";
|
|
4
4
|
import { differenceBetween } from "../../util/array.js";
|
|
@@ -12,7 +12,7 @@ import { pressYTreeViewNodeProps, YTreeViewNode } from "./YTreeViewNode.js";
|
|
|
12
12
|
import "./YTreeView.scss";
|
|
13
13
|
const treeViewNodeProps = pressYTreeViewNodeProps();
|
|
14
14
|
export const YTreeView = defineComponent({
|
|
15
|
-
name:
|
|
15
|
+
name: 'YTreeView',
|
|
16
16
|
props: {
|
|
17
17
|
expanded: {
|
|
18
18
|
type: [Array],
|
|
@@ -37,7 +37,7 @@ export const YTreeView = defineComponent({
|
|
|
37
37
|
},
|
|
38
38
|
...treeViewNodeProps
|
|
39
39
|
},
|
|
40
|
-
emits: [
|
|
40
|
+
emits: ['update:expanded', 'update:active', 'update:selected', 'mouseenterContainer', 'mouseleaveContainer', 'mousemoveContainer', 'dblclickContainer'],
|
|
41
41
|
setup(props, _ref) {
|
|
42
42
|
let {
|
|
43
43
|
slots,
|
|
@@ -65,7 +65,7 @@ export const YTreeView = defineComponent({
|
|
|
65
65
|
isExcluded
|
|
66
66
|
} = provideTreeView(props);
|
|
67
67
|
function excludeItem(items) {
|
|
68
|
-
let search = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] :
|
|
68
|
+
let search = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
|
|
69
69
|
let filter = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : filterTreeItem;
|
|
70
70
|
const excluded = new Set();
|
|
71
71
|
if (!search) {
|
|
@@ -81,7 +81,7 @@ export const YTreeView = defineComponent({
|
|
|
81
81
|
return;
|
|
82
82
|
}
|
|
83
83
|
for (const item of items) {
|
|
84
|
-
filterTreeItems(filter, item, search ??
|
|
84
|
+
filterTreeItems(filter, item, search ?? '', props.itemKey, props.itemText, props.itemChildren, excluded);
|
|
85
85
|
}
|
|
86
86
|
excludedSet.value = excluded;
|
|
87
87
|
searchLoading.value = false;
|
|
@@ -205,7 +205,7 @@ export const YTreeView = defineComponent({
|
|
|
205
205
|
filterItemsFn.value(neo, props.search, props.filter);
|
|
206
206
|
}, {
|
|
207
207
|
deep: true,
|
|
208
|
-
flush:
|
|
208
|
+
flush: 'sync'
|
|
209
209
|
});
|
|
210
210
|
|
|
211
211
|
// Provide & Issue
|
|
@@ -218,7 +218,7 @@ export const YTreeView = defineComponent({
|
|
|
218
218
|
});
|
|
219
219
|
const classes = computed(() => {
|
|
220
220
|
return {
|
|
221
|
-
|
|
221
|
+
'y-tree-view': true
|
|
222
222
|
};
|
|
223
223
|
});
|
|
224
224
|
const styles = computed(() => {
|
|
@@ -270,7 +270,7 @@ export const YTreeView = defineComponent({
|
|
|
270
270
|
}), slots);
|
|
271
271
|
}) : _createVNode("div", {
|
|
272
272
|
"class": "y-tree-view__no-data"
|
|
273
|
-
}, [slots[
|
|
273
|
+
}, [slots['no-data'] ? slots['no-data']() : _createVNode("span", null, [_createTextVNode("No Data")])])])]);
|
|
274
274
|
});
|
|
275
275
|
return {
|
|
276
276
|
nodes,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"YTreeView.js","names":["computed","defineComponent","onMounted","ref","shallowRef","watch","Fragment","_Fragment","createVNode","_createVNode","mergeProps","_mergeProps","createTextVNode","_createTextVNode","provideTreeView","useRender","differenceBetween","isColorValue","deepEqual","getObjectValueByPath","chooseProps","debounce","YProgressBar","filterTreeItem","filterTreeItems","getKeys","pressYTreeViewNodeProps","YTreeViewNode","treeViewNodeProps","YTreeView","name","props","expanded","type","Array","default","active","multipleActive","Boolean","onlyEventActiveStrategy","selected","returnItem","defaultExpand","String","Number","filter","Function","searchDebounceWait","emits","setup","_ref","slots","expose","filterItemsFn","excludeItem","expandedCache","nodes","expandedSet","selectedSet","activeSet","searchLoading","excludedSet","issueVnodeState","updateExpanded","updateActive","updateSelected","emitExpanded","emitActive","emitSelected","isExcluded","items","search","arguments","length","undefined","excluded","Set","value","diff","forEach","key","item","itemKey","itemText","itemChildren","expand","getNodeKey","itemOrKey","updateNodes","parentKey","level","children","exist","Object","hasOwn","existNode","vnode","includes","indeterminate","node","childKeys","map","child","add","neo","deep","until","entries","_ref2","stateWatcher","stateSet","updater","emitter","valuesOfKey","v","old","oldKeys","keys","nodeKey","neoKeys","k","oldSelected","oldActive","clear","flush","renderLeaves","slice","leaf","classes","styles","color","activeColor","activeValue","selectedValue"],"sources":["../../../src/components/tree-view/YTreeView.tsx"],"sourcesContent":["import {\n computed,\n defineComponent,\n onMounted,\n type PropType,\n type Ref,\n ref,\n shallowRef,\n watch,\n} from \"vue\";\n\nimport { provideTreeView } from \"@/components/tree-view/tree-view\";\nimport { useRender } from \"@/composables/component\";\nimport type { CandidateKey } from \"@/types\";\nimport { differenceBetween } from \"@/util/array\";\nimport { isColorValue } from \"@/util/color\";\nimport { deepEqual, getObjectValueByPath } from \"@/util/common\";\nimport { chooseProps } from \"@/util/component\";\nimport { debounce } from \"@/util/debounce\";\n\nimport { YProgressBar } from \"../progress-bar\";\nimport type { NodeState, TreeviewFilterFn } from \"./types\";\nimport { filterTreeItem, filterTreeItems, getKeys } from \"./util\";\nimport { pressYTreeViewNodeProps, YTreeViewNode } from \"./YTreeViewNode\";\n\nimport \"./YTreeView.scss\";\n\nconst treeViewNodeProps = pressYTreeViewNodeProps();\n\nexport const YTreeView = defineComponent({\n name: \"YTreeView\",\n props: {\n expanded: {\n type: [Array] as PropType<CandidateKey[]>,\n default: () => [],\n },\n active: {\n type: [Array] as PropType<CandidateKey[]>,\n default: () => [],\n },\n multipleActive: Boolean,\n onlyEventActiveStrategy: Boolean,\n selected: {\n type: [Array] as PropType<CandidateKey[]>,\n default: () => [],\n },\n returnItem: Boolean,\n defaultExpand: [Boolean, String, Number],\n filter: Function as PropType<TreeviewFilterFn>,\n searchDebounceWait: {\n type: Number as PropType<number>,\n default: 700,\n },\n ...treeViewNodeProps,\n },\n emits: [\"update:expanded\", \"update:active\", \"update:selected\"],\n setup(props, { slots, expose }) {\n const filterItemsFn = shallowRef(\n debounce(excludeItem, props.searchDebounceWait),\n );\n const expandedCache = ref<CandidateKey[]>([]);\n\n const {\n nodes,\n expanded,\n active,\n selected,\n expandedSet,\n selectedSet,\n activeSet,\n searchLoading,\n excludedSet,\n issueVnodeState,\n updateExpanded,\n updateActive,\n updateSelected,\n emitExpanded,\n emitActive,\n emitSelected,\n isExcluded,\n } = provideTreeView(props);\n\n function excludeItem(items: any[], search = \"\", filter = filterTreeItem) {\n const excluded = new Set<CandidateKey>();\n if (!search) {\n searchLoading.value = false;\n excludedSet.value = excluded;\n const diff = differenceBetween(expandedCache.value, [\n ...expandedSet.value,\n ]);\n diff.forEach((key) => {\n updateExpanded(key, false);\n });\n expandedCache.value.forEach((key) => {\n updateExpanded(key, true);\n });\n return;\n }\n for (const item of items) {\n filterTreeItems(\n filter,\n item,\n search ?? \"\",\n props.itemKey,\n props.itemText,\n props.itemChildren as string,\n excluded,\n );\n }\n excludedSet.value = excluded;\n searchLoading.value = false;\n expand();\n }\n\n watch(\n () => props.search,\n () => {\n searchLoading.value = true;\n filterItemsFn.value(props.items, props.search, props.filter);\n },\n );\n\n // Util Methods\n function getNodeKey(itemOrKey: any) {\n return props.returnItem\n ? getObjectValueByPath(itemOrKey, props.itemKey)\n : itemOrKey;\n }\n\n // State Methods\n function updateNodes(\n items: any[],\n parentKey: CandidateKey | null = null,\n level = 0,\n ) {\n for (const item of items) {\n const key = getObjectValueByPath(item, props.itemKey);\n const children =\n getObjectValueByPath(item, props.itemChildren as string) ?? [];\n const exist = Object.hasOwn(nodes.value, key);\n const existNode = exist\n ? nodes.value[key]\n : {\n vnode: null,\n selected: selected.value?.includes(key) ?? false,\n indeterminate: false,\n active: active.value?.includes(key) ?? false,\n expanded: expanded.value?.includes(key) ?? false,\n };\n const node: NodeState = {\n vnode: existNode.vnode,\n item,\n level,\n parentKey,\n childKeys: children.map((child: any) =>\n getObjectValueByPath(child, props.itemKey),\n ),\n expanded: children.length > 0 && existNode.expanded,\n active: existNode.active,\n indeterminate: existNode.indeterminate,\n selected: existNode.selected,\n };\n\n updateNodes(children, key, level + 1);\n\n nodes.value[key] = node;\n if (nodes.value[key].expanded) {\n expandedSet.value.add(key);\n }\n if (nodes.value[key].selected) {\n selectedSet.value.add(key);\n }\n if (nodes.value[key].active) {\n activeSet.value.add(key);\n }\n issueVnodeState(key);\n }\n }\n\n watch(\n expandedSet,\n (neo) => {\n if (!props.search) {\n expandedCache.value = [...neo];\n }\n },\n { deep: true },\n );\n\n function expand(until: boolean | string | number = true) {\n Object.entries(nodes.value).forEach(([key, node]) => {\n if (until === true || Number(until) >= node.level) {\n updateExpanded(key, true);\n }\n });\n emitExpanded();\n return expandedSet.value;\n }\n\n function stateWatcher(\n value: any[],\n stateSet: Ref<Set<CandidateKey>>,\n updater: (key: CandidateKey, to: boolean) => void,\n emitter: () => void,\n ) {\n const valuesOfKey = props.returnItem\n ? value.map((v) => getObjectValueByPath(v, props.itemKey))\n : value;\n const old = [...stateSet.value];\n if (deepEqual(old, valuesOfKey)) {\n return;\n }\n old.forEach((key) => {\n updater(key, false)\n });\n valuesOfKey.forEach((key) => {\n updater(key, true)\n });\n emitter();\n }\n\n watch(expanded, (neo) => {\n stateWatcher(neo, expandedSet, updateExpanded, emitExpanded);\n });\n\n watch(active, (neo) => {\n stateWatcher(neo, activeSet, updateActive, emitActive);\n });\n\n watch(selected, (neo) => {\n stateWatcher(neo, selectedSet, updateSelected, emitSelected);\n });\n\n watch(\n () => props.items,\n (neo: any[]) => {\n const oldKeys = Object.keys(nodes.value).map((nodeKey) =>\n getObjectValueByPath(nodes.value[nodeKey].item, props.itemKey),\n );\n const neoKeys = getKeys(\n neo,\n props.itemKey,\n props.itemChildren as string,\n );\n const diff = differenceBetween(oldKeys, neoKeys);\n if (diff.length < 1 && neoKeys.length < oldKeys.length) {\n return;\n }\n diff.forEach((k) => {\n delete nodes.value[k]\n });\n\n // init\n const oldSelected = [...selectedSet.value];\n const oldActive = [...activeSet.value];\n selectedSet.value.clear();\n expandedSet.value.clear();\n activeSet.value.clear();\n updateNodes(neo);\n if (!deepEqual(oldSelected, [...selectedSet.value])) {\n emitSelected();\n }\n if (!deepEqual(oldActive, [...activeSet.value])) {\n emitActive();\n }\n filterItemsFn.value(neo, props.search, props.filter);\n },\n { deep: true, flush: \"sync\" },\n );\n\n // Provide & Issue\n\n updateNodes(props.items);\n\n const renderLeaves = computed(() => {\n return props.items.slice().filter((leaf) => {\n return !isExcluded(getObjectValueByPath(leaf, props.itemKey));\n });\n });\n\n const classes = computed(() => {\n return {\n \"y-tree-view\": true,\n };\n });\n\n const styles = computed(() => {\n let color = props.activeColor;\n if (props.activeColor && !isColorValue(props.activeColor)) {\n color = `var(--y-theme-${props.activeColor})`;\n }\n return {\n [`--y-tree-view__active-color`]: color,\n };\n });\n\n onMounted(() => {\n if (props.search) {\n searchLoading.value = true;\n excludeItem(props.items, props.search, props.filter);\n }\n\n if (props.defaultExpand != null && props.defaultExpand !== false) {\n expandedCache.value = [...expand(props.defaultExpand)];\n } else {\n expanded.value.forEach((v: any) => {\n updateExpanded(getNodeKey(v), true)\n });\n emitExpanded();\n }\n\n for (const activeValue of props.active.map(getNodeKey)) {\n updateActive(activeValue, true);\n }\n\n for (const selectedValue of props.selected.map(getNodeKey)) {\n updateSelected(selectedValue, true);\n }\n });\n\n expose({\n expand,\n });\n\n useRender(() => {\n return (\n <>\n <div class={classes.value} style={styles.value} role=\"tree\">\n {searchLoading.value && <YProgressBar indeterminate />}\n {renderLeaves.value.length > 0 ? (\n renderLeaves.value.slice().map((leaf) => {\n return (\n <YTreeViewNode\n v-slots={slots}\n key={getObjectValueByPath(leaf, props.itemKey)}\n {...{\n ...chooseProps(props, treeViewNodeProps),\n item: leaf,\n level: 0,\n }}\n ></YTreeViewNode>\n );\n })\n ) : (\n <div class=\"y-tree-view__no-data\">\n {slots[\"no-data\"] ? slots[\"no-data\"]() : <span>No Data</span>}\n </div>\n )}\n </div>\n </>\n );\n });\n\n return {\n nodes,\n expandedSet,\n selectedSet,\n activeSet,\n excludedSet,\n searchLoading,\n expandedCache,\n renderLeaves,\n };\n },\n});\n\nexport type YTreeView = InstanceType<typeof YTreeView>;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"YTreeView.js","names":["computed","defineComponent","onMounted","ref","shallowRef","watch","Fragment","_Fragment","createVNode","_createVNode","mergeProps","_mergeProps","createTextVNode","_createTextVNode","provideTreeView","useRender","differenceBetween","isColorValue","deepEqual","getObjectValueByPath","chooseProps","debounce","YProgressBar","filterTreeItem","filterTreeItems","getKeys","pressYTreeViewNodeProps","YTreeViewNode","treeViewNodeProps","YTreeView","name","props","expanded","type","Array","default","active","multipleActive","Boolean","onlyEventActiveStrategy","selected","returnItem","defaultExpand","String","Number","filter","Function","searchDebounceWait","emits","setup","_ref","slots","expose","filterItemsFn","excludeItem","expandedCache","nodes","expandedSet","selectedSet","activeSet","searchLoading","excludedSet","issueVnodeState","updateExpanded","updateActive","updateSelected","emitExpanded","emitActive","emitSelected","isExcluded","items","search","arguments","length","undefined","excluded","Set","value","diff","forEach","key","item","itemKey","itemText","itemChildren","expand","getNodeKey","itemOrKey","updateNodes","parentKey","level","children","exist","Object","hasOwn","existNode","vnode","includes","indeterminate","node","childKeys","map","child","add","neo","deep","until","entries","_ref2","stateWatcher","stateSet","updater","emitter","valuesOfKey","v","old","oldKeys","keys","nodeKey","neoKeys","k","oldSelected","oldActive","clear","flush","renderLeaves","slice","leaf","classes","styles","color","activeColor","activeValue","selectedValue"],"sources":["../../../src/components/tree-view/YTreeView.tsx"],"sourcesContent":["import { computed, defineComponent, onMounted, type PropType, type Ref, ref, shallowRef, watch } from 'vue';\n\nimport { provideTreeView } from '@/components/tree-view/tree-view';\nimport { useRender } from '@/composables/component';\nimport type { CandidateKey } from '@/types';\nimport { differenceBetween } from '@/util/array';\nimport { isColorValue } from '@/util/color';\nimport { deepEqual, getObjectValueByPath } from '@/util/common';\nimport { chooseProps } from '@/util/component';\nimport { debounce } from '@/util/debounce';\n\nimport { YProgressBar } from '../progress-bar';\nimport type { NodeState, TreeviewFilterFn } from './types';\nimport { filterTreeItem, filterTreeItems, getKeys } from './util';\nimport { pressYTreeViewNodeProps, YTreeViewNode } from './YTreeViewNode';\n\nimport './YTreeView.scss';\n\nconst treeViewNodeProps = pressYTreeViewNodeProps();\n\nexport const YTreeView = defineComponent({\n name: 'YTreeView',\n props: {\n expanded: {\n type: [Array] as PropType<CandidateKey[]>,\n default: () => [],\n },\n active: {\n type: [Array] as PropType<CandidateKey[]>,\n default: () => [],\n },\n multipleActive: Boolean,\n onlyEventActiveStrategy: Boolean,\n selected: {\n type: [Array] as PropType<CandidateKey[]>,\n default: () => [],\n },\n returnItem: Boolean,\n defaultExpand: [Boolean, String, Number],\n filter: Function as PropType<TreeviewFilterFn>,\n searchDebounceWait: {\n type: Number as PropType<number>,\n default: 700,\n },\n ...treeViewNodeProps,\n },\n emits: [\n 'update:expanded',\n 'update:active',\n 'update:selected',\n 'mouseenterContainer',\n 'mouseleaveContainer',\n 'mousemoveContainer',\n 'dblclickContainer',\n ],\n setup(props, { slots, expose }) {\n const filterItemsFn = shallowRef(\n debounce(excludeItem, props.searchDebounceWait),\n );\n const expandedCache = ref<CandidateKey[]>([]);\n\n const {\n nodes,\n expanded,\n active,\n selected,\n expandedSet,\n selectedSet,\n activeSet,\n searchLoading,\n excludedSet,\n issueVnodeState,\n updateExpanded,\n updateActive,\n updateSelected,\n emitExpanded,\n emitActive,\n emitSelected,\n isExcluded,\n } = provideTreeView(props);\n\n function excludeItem(items: any[], search = '', filter = filterTreeItem) {\n const excluded = new Set<CandidateKey>();\n if (!search) {\n searchLoading.value = false;\n excludedSet.value = excluded;\n const diff = differenceBetween(expandedCache.value, [\n ...expandedSet.value,\n ]);\n diff.forEach((key) => {\n updateExpanded(key, false);\n });\n expandedCache.value.forEach((key) => {\n updateExpanded(key, true);\n });\n return;\n }\n for (const item of items) {\n filterTreeItems(\n filter,\n item,\n search ?? '',\n props.itemKey,\n props.itemText,\n props.itemChildren as string,\n excluded,\n );\n }\n excludedSet.value = excluded;\n searchLoading.value = false;\n expand();\n }\n\n watch(\n () => props.search,\n () => {\n searchLoading.value = true;\n filterItemsFn.value(props.items, props.search, props.filter);\n },\n );\n\n // Util Methods\n function getNodeKey(itemOrKey: any) {\n return props.returnItem\n ? getObjectValueByPath(itemOrKey, props.itemKey)\n : itemOrKey;\n }\n\n // State Methods\n function updateNodes(\n items: any[],\n parentKey: CandidateKey | null = null,\n level = 0,\n ) {\n for (const item of items) {\n const key = getObjectValueByPath(item, props.itemKey);\n const children =\n getObjectValueByPath(item, props.itemChildren as string) ?? [];\n const exist = Object.hasOwn(nodes.value, key);\n const existNode = exist\n ? nodes.value[key]\n : {\n vnode: null,\n selected: selected.value?.includes(key) ?? false,\n indeterminate: false,\n active: active.value?.includes(key) ?? false,\n expanded: expanded.value?.includes(key) ?? false,\n };\n const node: NodeState = {\n vnode: existNode.vnode,\n item,\n level,\n parentKey,\n childKeys: children.map((child: any) =>\n getObjectValueByPath(child, props.itemKey),\n ),\n expanded: children.length > 0 && existNode.expanded,\n active: existNode.active,\n indeterminate: existNode.indeterminate,\n selected: existNode.selected,\n };\n\n updateNodes(children, key, level + 1);\n\n nodes.value[key] = node;\n if (nodes.value[key].expanded) {\n expandedSet.value.add(key);\n }\n if (nodes.value[key].selected) {\n selectedSet.value.add(key);\n }\n if (nodes.value[key].active) {\n activeSet.value.add(key);\n }\n issueVnodeState(key);\n }\n }\n\n watch(\n expandedSet,\n (neo) => {\n if (!props.search) {\n expandedCache.value = [...neo];\n }\n },\n { deep: true },\n );\n\n function expand(until: boolean | string | number = true) {\n Object.entries(nodes.value).forEach(([key, node]) => {\n if (until === true || Number(until) >= node.level) {\n updateExpanded(key, true);\n }\n });\n emitExpanded();\n return expandedSet.value;\n }\n\n function stateWatcher(\n value: any[],\n stateSet: Ref<Set<CandidateKey>>,\n updater: (key: CandidateKey, to: boolean) => void,\n emitter: () => void,\n ) {\n const valuesOfKey = props.returnItem\n ? value.map((v) => getObjectValueByPath(v, props.itemKey))\n : value;\n const old = [...stateSet.value];\n if (deepEqual(old, valuesOfKey)) {\n return;\n }\n old.forEach((key) => {\n updater(key, false);\n });\n valuesOfKey.forEach((key) => {\n updater(key, true);\n });\n emitter();\n }\n\n watch(expanded, (neo) => {\n stateWatcher(neo, expandedSet, updateExpanded, emitExpanded);\n });\n\n watch(active, (neo) => {\n stateWatcher(neo, activeSet, updateActive, emitActive);\n });\n\n watch(selected, (neo) => {\n stateWatcher(neo, selectedSet, updateSelected, emitSelected);\n });\n\n watch(\n () => props.items,\n (neo: any[]) => {\n const oldKeys = Object.keys(nodes.value).map((nodeKey) =>\n getObjectValueByPath(nodes.value[nodeKey].item, props.itemKey),\n );\n const neoKeys = getKeys(\n neo,\n props.itemKey,\n props.itemChildren as string,\n );\n const diff = differenceBetween(oldKeys, neoKeys);\n if (diff.length < 1 && neoKeys.length < oldKeys.length) {\n return;\n }\n diff.forEach((k) => {\n delete nodes.value[k];\n });\n\n // init\n const oldSelected = [...selectedSet.value];\n const oldActive = [...activeSet.value];\n selectedSet.value.clear();\n expandedSet.value.clear();\n activeSet.value.clear();\n updateNodes(neo);\n if (!deepEqual(oldSelected, [...selectedSet.value])) {\n emitSelected();\n }\n if (!deepEqual(oldActive, [...activeSet.value])) {\n emitActive();\n }\n filterItemsFn.value(neo, props.search, props.filter);\n },\n { deep: true, flush: 'sync' },\n );\n\n // Provide & Issue\n\n updateNodes(props.items);\n\n const renderLeaves = computed(() => {\n return props.items.slice().filter((leaf) => {\n return !isExcluded(getObjectValueByPath(leaf, props.itemKey));\n });\n });\n\n const classes = computed(() => {\n return {\n 'y-tree-view': true,\n };\n });\n\n const styles = computed(() => {\n let color = props.activeColor;\n if (props.activeColor && !isColorValue(props.activeColor)) {\n color = `var(--y-theme-${props.activeColor})`;\n }\n return {\n [`--y-tree-view__active-color`]: color,\n };\n });\n\n onMounted(() => {\n if (props.search) {\n searchLoading.value = true;\n excludeItem(props.items, props.search, props.filter);\n }\n\n if (props.defaultExpand != null && props.defaultExpand !== false) {\n expandedCache.value = [...expand(props.defaultExpand)];\n } else {\n expanded.value.forEach((v: any) => {\n updateExpanded(getNodeKey(v), true);\n });\n emitExpanded();\n }\n\n for (const activeValue of props.active.map(getNodeKey)) {\n updateActive(activeValue, true);\n }\n\n for (const selectedValue of props.selected.map(getNodeKey)) {\n updateSelected(selectedValue, true);\n }\n });\n\n expose({\n expand,\n });\n\n useRender(() => {\n return (\n <>\n <div class={classes.value} style={styles.value} role=\"tree\">\n {searchLoading.value && <YProgressBar indeterminate />}\n {renderLeaves.value.length > 0 ? (\n renderLeaves.value.slice().map((leaf) => {\n return (\n <YTreeViewNode\n v-slots={slots}\n key={getObjectValueByPath(leaf, props.itemKey)}\n {...{\n ...chooseProps(props, treeViewNodeProps),\n item: leaf,\n level: 0,\n }}\n ></YTreeViewNode>\n );\n })\n ) : (\n <div class=\"y-tree-view__no-data\">\n {slots['no-data'] ? slots['no-data']() : <span>No Data</span>}\n </div>\n )}\n </div>\n </>\n );\n });\n\n return {\n nodes,\n expandedSet,\n selectedSet,\n activeSet,\n excludedSet,\n searchLoading,\n expandedCache,\n renderLeaves,\n };\n },\n});\n\nexport type YTreeView = InstanceType<typeof YTreeView>;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -5,7 +5,7 @@ import { computed, mergeProps, onBeforeMount, ref, resolveComponent, watch, crea
|
|
|
5
5
|
import { pressItemsPropsOptions } from "../../abstract/items.js";
|
|
6
6
|
import { useTreeView } from "./tree-view.js";
|
|
7
7
|
import { useRender } from "../../composables/component.js";
|
|
8
|
-
import { getObjectValueByPath } from "../../util/common.js";
|
|
8
|
+
import { getObjectValueByPath, getPropertyFromItem } from "../../util/common.js";
|
|
9
9
|
import { defineComponent, propsFactory } from "../../util/component/index.js";
|
|
10
10
|
import { YButton } from "../button/index.js";
|
|
11
11
|
import { YIconCheckbox, YIconExpand } from "../icons/index.js";
|
|
@@ -44,6 +44,10 @@ export const pressYTreeViewNodeProps = propsFactory({
|
|
|
44
44
|
onMouseenterContainer: Function,
|
|
45
45
|
onMouseleaveContainer: Function,
|
|
46
46
|
onMousemoveContainer: Function,
|
|
47
|
+
onDblclickContainer: Function,
|
|
48
|
+
itemSelectable: {
|
|
49
|
+
type: [String, Array, Function]
|
|
50
|
+
},
|
|
47
51
|
...pressItemsPropsOptions({
|
|
48
52
|
itemKey: 'id'
|
|
49
53
|
})
|
|
@@ -122,6 +126,20 @@ export const YTreeViewNode = defineComponent({
|
|
|
122
126
|
const contentText = computed(() => {
|
|
123
127
|
return getObjectValueByPath(props.item, props.itemText) ?? '';
|
|
124
128
|
});
|
|
129
|
+
const disabledSelect = computed(() => {
|
|
130
|
+
if (props.itemSelectable != null) {
|
|
131
|
+
let selectable = true;
|
|
132
|
+
if (typeof props.itemSelectable === 'function') {
|
|
133
|
+
selectable = !!props.itemSelectable(props.item);
|
|
134
|
+
} else if (Array.isArray(props.itemSelectable)) {
|
|
135
|
+
selectable = props.itemSelectable.includes(myKey.value);
|
|
136
|
+
} else {
|
|
137
|
+
selectable = getPropertyFromItem(props.item, props.itemSelectable, true);
|
|
138
|
+
}
|
|
139
|
+
return !selectable;
|
|
140
|
+
}
|
|
141
|
+
return false;
|
|
142
|
+
});
|
|
125
143
|
const slotProps = computed(() => {
|
|
126
144
|
return {
|
|
127
145
|
level: props.level,
|
|
@@ -150,6 +168,7 @@ export const YTreeViewNode = defineComponent({
|
|
|
150
168
|
}
|
|
151
169
|
function onClickSelect(e) {
|
|
152
170
|
e.stopPropagation();
|
|
171
|
+
if (disabledSelect.value) return;
|
|
153
172
|
const to = !isChecked.value;
|
|
154
173
|
selected.value = to;
|
|
155
174
|
treeView.updateSelected(myKey.value, to);
|
|
@@ -173,6 +192,13 @@ export const YTreeViewNode = defineComponent({
|
|
|
173
192
|
item: props.item
|
|
174
193
|
});
|
|
175
194
|
}
|
|
195
|
+
function onDblclickContainer(e) {
|
|
196
|
+
props.onDblclickContainer?.(e, {
|
|
197
|
+
...slotProps.value,
|
|
198
|
+
item: props.item,
|
|
199
|
+
toggleExpand: () => onClickExpand(e)
|
|
200
|
+
});
|
|
201
|
+
}
|
|
176
202
|
useRender(() => {
|
|
177
203
|
const indentSpacer = [];
|
|
178
204
|
for (let i = 0; i < props.level; i += 1) {
|
|
@@ -191,7 +217,8 @@ export const YTreeViewNode = defineComponent({
|
|
|
191
217
|
"onClick": e => props.enableActive ? onClick(e) : void 0,
|
|
192
218
|
"onMouseenter": props.onMouseenterContainer && onMouseenterContainer,
|
|
193
219
|
"onMouseleave": props.onMouseleaveContainer && onMouseleaveContainer,
|
|
194
|
-
"onMousemove": props.onMousemoveContainer && onMousemoveContainer
|
|
220
|
+
"onMousemove": props.onMousemoveContainer && onMousemoveContainer,
|
|
221
|
+
"onDblclick": onDblclickContainer
|
|
195
222
|
}, [_createVNode(YPlate, null, null), _createVNode("div", {
|
|
196
223
|
"class": 'y-tree-view-node__indents'
|
|
197
224
|
}, [indentSpacer]), !imLeaf.value && leaves.value.length > 0 ? _createVNode(YButton, {
|
|
@@ -204,13 +231,16 @@ export const YTreeViewNode = defineComponent({
|
|
|
204
231
|
"class": 'y-tree-view-node__no-expand-icon'
|
|
205
232
|
}, null), props.enableSelect && // biome-ignore lint/a11y/useSemanticElements: passive
|
|
206
233
|
_createVNode("div", {
|
|
207
|
-
"class": 'y-tree-view-node__select',
|
|
234
|
+
"class": ['y-tree-view-node__select', {
|
|
235
|
+
'y-tree-view-node__select--disabled': disabledSelect.value
|
|
236
|
+
}],
|
|
208
237
|
"role": "checkbox",
|
|
209
238
|
"aria-checked": isChecked.value,
|
|
210
239
|
"onClick": onClickSelect
|
|
211
240
|
}, [_createVNode(YIconCheckbox, {
|
|
212
241
|
"checked": isChecked.value,
|
|
213
|
-
"indeterminate": !selected.value && childrenSomeChecked.value
|
|
242
|
+
"indeterminate": !selected.value && childrenSomeChecked.value,
|
|
243
|
+
"disabled": disabledSelect.value
|
|
214
244
|
}, null)]), _createVNode("div", {
|
|
215
245
|
"class": 'y-tree-view-node__content'
|
|
216
246
|
}, [slots.leading && _createVNode("div", {
|