@threadlabs/looma 0.1.19 → 0.1.21
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/{chunk-NMV2BBWK.js → chunk-FSGGPFID.js} +29 -29
- package/dist/cjs/ui-tree.cjs.entry.js +59 -20
- package/dist/collection/components/ui-tree/ui-tree.js +59 -20
- package/dist/components/ui-tree.js +1 -1
- package/dist/esm/ui-tree.entry.js +59 -20
- package/dist/index.cjs +59 -20
- package/dist/index.js +1 -1
- package/dist/looma/looma.esm.js +1 -1
- package/dist/looma/p-b0431118.entry.js +1 -0
- package/dist/types/components/ui-tree/ui-tree.d.ts +3 -0
- package/dist/{ui-affordance-scope.entry-2CJOZHBF.js → ui-affordance-scope.entry-Z3H4CM6J.js} +1 -1
- package/dist/{ui-avatar-group.entry-WMDVHRVT.js → ui-avatar-group.entry-ONGVFRD3.js} +1 -1
- package/dist/{ui-avatar.entry-SHX6AOME.js → ui-avatar.entry-TBA3IEED.js} +1 -1
- package/dist/{ui-badge.entry-S5VSVEBD.js → ui-badge.entry-DKBPJ7G7.js} +1 -1
- package/dist/{ui-button.entry-HVSZQOA3.js → ui-button.entry-U2MMIHLY.js} +1 -1
- package/dist/{ui-checkbox.entry-2DWUSIEP.js → ui-checkbox.entry-QJTO2U6Z.js} +1 -1
- package/dist/{ui-context-menu.entry-ZCGK2ZM3.js → ui-context-menu.entry-CC4VXCEB.js} +1 -1
- package/dist/{ui-dialog.entry-XVTGSOKV.js → ui-dialog.entry-GPJWOH5Z.js} +1 -1
- package/dist/{ui-disclosure.entry-Z4UNBYPO.js → ui-disclosure.entry-EGG3HXD4.js} +1 -1
- package/dist/{ui-floating-action-button.entry-7QXOFMZ2.js → ui-floating-action-button.entry-XUD44HRX.js} +1 -1
- package/dist/{ui-form-field.entry-ENMTDKN2.js → ui-form-field.entry-UHLNDUXR.js} +1 -1
- package/dist/{ui-icon-button.entry-4DMRMHP2.js → ui-icon-button.entry-6HDCV3E7.js} +1 -1
- package/dist/{ui-input.entry-JQROBMAB.js → ui-input.entry-73QXAVLL.js} +1 -1
- package/dist/{ui-menu-item.entry-4KZUH65O.js → ui-menu-item.entry-HCZRSY5Y.js} +1 -1
- package/dist/{ui-menu.entry-HEKD6EUJ.js → ui-menu.entry-ASIVAX6M.js} +1 -1
- package/dist/{ui-popover.entry-MP5QS5WD.js → ui-popover.entry-WSQ7AEJN.js} +1 -1
- package/dist/{ui-radio-group.entry-YWXQLMSD.js → ui-radio-group.entry-2N7BEBJW.js} +1 -1
- package/dist/{ui-radio.entry-TYQ36J2G.js → ui-radio.entry-TOM6HBXP.js} +1 -1
- package/dist/{ui-search-result-row.entry-EV73E2AD.js → ui-search-result-row.entry-KA3P76WE.js} +1 -1
- package/dist/{ui-search-shell.entry-RRS62AZU.js → ui-search-shell.entry-ERMS7TIH.js} +1 -1
- package/dist/{ui-select.entry-NJRM2C2R.js → ui-select.entry-KDIM3SWS.js} +1 -1
- package/dist/{ui-switch.entry-JNWSBOIW.js → ui-switch.entry-VRTB6X4D.js} +1 -1
- package/dist/{ui-tabs.entry-JNBWW2G3.js → ui-tabs.entry-GIAO5W3U.js} +1 -1
- package/dist/{ui-textarea.entry-CDCRB2S3.js → ui-textarea.entry-T6YH4HVG.js} +1 -1
- package/dist/{ui-toast-region.entry-QLPSSQ5I.js → ui-toast-region.entry-DBQCXOPJ.js} +1 -1
- package/dist/{ui-tooltip.entry-FAZT5VYK.js → ui-tooltip.entry-VS26OECS.js} +1 -1
- package/dist/{ui-top-bar.entry-LNUHSZSM.js → ui-top-bar.entry-HGWP6PFQ.js} +1 -1
- package/dist/{ui-tree-item.entry-TLYU63UE.js → ui-tree-item.entry-ZRXUIZDR.js} +1 -1
- package/dist/{ui-tree.entry-3OF7ZPOH.js → ui-tree.entry-TC2SCQJF.js} +60 -21
- package/editor/{chunk-3QMBK3XZ.js → chunk-64GLF274.js} +12 -2
- package/editor/{chunk-OXFYYLUC.js → chunk-QCOYOVQL.js} +83 -15
- package/editor/extensions/index.d.ts +7 -2
- package/editor/extensions/index.js +5 -1
- package/editor/index.d.ts +1 -1
- package/editor/index.js +6 -2
- package/editor/ui.js +1 -1
- package/editor.css +49 -0
- package/package.json +1 -1
- package/dist/looma/p-95368dee.entry.js +0 -1
|
@@ -6,35 +6,35 @@ var __glob = (map) => (path) => {
|
|
|
6
6
|
|
|
7
7
|
// import("./**/*.entry.js") in dist/esm/index-CEeiinfk.js
|
|
8
8
|
var globImport_entry_js = __glob({
|
|
9
|
-
"./ui-affordance-scope.entry.js": () => import("./ui-affordance-scope.entry-
|
|
10
|
-
"./ui-avatar-group.entry.js": () => import("./ui-avatar-group.entry-
|
|
11
|
-
"./ui-avatar.entry.js": () => import("./ui-avatar.entry-
|
|
12
|
-
"./ui-badge.entry.js": () => import("./ui-badge.entry-
|
|
13
|
-
"./ui-button.entry.js": () => import("./ui-button.entry-
|
|
14
|
-
"./ui-checkbox.entry.js": () => import("./ui-checkbox.entry-
|
|
15
|
-
"./ui-context-menu.entry.js": () => import("./ui-context-menu.entry-
|
|
16
|
-
"./ui-dialog.entry.js": () => import("./ui-dialog.entry-
|
|
17
|
-
"./ui-disclosure.entry.js": () => import("./ui-disclosure.entry-
|
|
18
|
-
"./ui-floating-action-button.entry.js": () => import("./ui-floating-action-button.entry-
|
|
19
|
-
"./ui-form-field.entry.js": () => import("./ui-form-field.entry-
|
|
20
|
-
"./ui-icon-button.entry.js": () => import("./ui-icon-button.entry-
|
|
21
|
-
"./ui-input.entry.js": () => import("./ui-input.entry-
|
|
22
|
-
"./ui-menu-item.entry.js": () => import("./ui-menu-item.entry-
|
|
23
|
-
"./ui-menu.entry.js": () => import("./ui-menu.entry-
|
|
24
|
-
"./ui-popover.entry.js": () => import("./ui-popover.entry-
|
|
25
|
-
"./ui-radio-group.entry.js": () => import("./ui-radio-group.entry-
|
|
26
|
-
"./ui-radio.entry.js": () => import("./ui-radio.entry-
|
|
27
|
-
"./ui-search-result-row.entry.js": () => import("./ui-search-result-row.entry-
|
|
28
|
-
"./ui-search-shell.entry.js": () => import("./ui-search-shell.entry-
|
|
29
|
-
"./ui-select.entry.js": () => import("./ui-select.entry-
|
|
30
|
-
"./ui-switch.entry.js": () => import("./ui-switch.entry-
|
|
31
|
-
"./ui-tabs.entry.js": () => import("./ui-tabs.entry-
|
|
32
|
-
"./ui-textarea.entry.js": () => import("./ui-textarea.entry-
|
|
33
|
-
"./ui-toast-region.entry.js": () => import("./ui-toast-region.entry-
|
|
34
|
-
"./ui-tooltip.entry.js": () => import("./ui-tooltip.entry-
|
|
35
|
-
"./ui-top-bar.entry.js": () => import("./ui-top-bar.entry-
|
|
36
|
-
"./ui-tree-item.entry.js": () => import("./ui-tree-item.entry-
|
|
37
|
-
"./ui-tree.entry.js": () => import("./ui-tree.entry-
|
|
9
|
+
"./ui-affordance-scope.entry.js": () => import("./ui-affordance-scope.entry-Z3H4CM6J.js"),
|
|
10
|
+
"./ui-avatar-group.entry.js": () => import("./ui-avatar-group.entry-ONGVFRD3.js"),
|
|
11
|
+
"./ui-avatar.entry.js": () => import("./ui-avatar.entry-TBA3IEED.js"),
|
|
12
|
+
"./ui-badge.entry.js": () => import("./ui-badge.entry-DKBPJ7G7.js"),
|
|
13
|
+
"./ui-button.entry.js": () => import("./ui-button.entry-U2MMIHLY.js"),
|
|
14
|
+
"./ui-checkbox.entry.js": () => import("./ui-checkbox.entry-QJTO2U6Z.js"),
|
|
15
|
+
"./ui-context-menu.entry.js": () => import("./ui-context-menu.entry-CC4VXCEB.js"),
|
|
16
|
+
"./ui-dialog.entry.js": () => import("./ui-dialog.entry-GPJWOH5Z.js"),
|
|
17
|
+
"./ui-disclosure.entry.js": () => import("./ui-disclosure.entry-EGG3HXD4.js"),
|
|
18
|
+
"./ui-floating-action-button.entry.js": () => import("./ui-floating-action-button.entry-XUD44HRX.js"),
|
|
19
|
+
"./ui-form-field.entry.js": () => import("./ui-form-field.entry-UHLNDUXR.js"),
|
|
20
|
+
"./ui-icon-button.entry.js": () => import("./ui-icon-button.entry-6HDCV3E7.js"),
|
|
21
|
+
"./ui-input.entry.js": () => import("./ui-input.entry-73QXAVLL.js"),
|
|
22
|
+
"./ui-menu-item.entry.js": () => import("./ui-menu-item.entry-HCZRSY5Y.js"),
|
|
23
|
+
"./ui-menu.entry.js": () => import("./ui-menu.entry-ASIVAX6M.js"),
|
|
24
|
+
"./ui-popover.entry.js": () => import("./ui-popover.entry-WSQ7AEJN.js"),
|
|
25
|
+
"./ui-radio-group.entry.js": () => import("./ui-radio-group.entry-2N7BEBJW.js"),
|
|
26
|
+
"./ui-radio.entry.js": () => import("./ui-radio.entry-TOM6HBXP.js"),
|
|
27
|
+
"./ui-search-result-row.entry.js": () => import("./ui-search-result-row.entry-KA3P76WE.js"),
|
|
28
|
+
"./ui-search-shell.entry.js": () => import("./ui-search-shell.entry-ERMS7TIH.js"),
|
|
29
|
+
"./ui-select.entry.js": () => import("./ui-select.entry-KDIM3SWS.js"),
|
|
30
|
+
"./ui-switch.entry.js": () => import("./ui-switch.entry-VRTB6X4D.js"),
|
|
31
|
+
"./ui-tabs.entry.js": () => import("./ui-tabs.entry-GIAO5W3U.js"),
|
|
32
|
+
"./ui-textarea.entry.js": () => import("./ui-textarea.entry-T6YH4HVG.js"),
|
|
33
|
+
"./ui-toast-region.entry.js": () => import("./ui-toast-region.entry-DBQCXOPJ.js"),
|
|
34
|
+
"./ui-tooltip.entry.js": () => import("./ui-tooltip.entry-VS26OECS.js"),
|
|
35
|
+
"./ui-top-bar.entry.js": () => import("./ui-top-bar.entry-HGWP6PFQ.js"),
|
|
36
|
+
"./ui-tree-item.entry.js": () => import("./ui-tree-item.entry-ZRXUIZDR.js"),
|
|
37
|
+
"./ui-tree.entry.js": () => import("./ui-tree.entry-TC2SCQJF.js")
|
|
38
38
|
});
|
|
39
39
|
|
|
40
40
|
// dist/esm/index-CEeiinfk.js
|
|
@@ -71,6 +71,7 @@ const UITree = class {
|
|
|
71
71
|
componentDidLoad() {
|
|
72
72
|
this.hoverIntent = createHoverIntent(this.hoverExpandDelay, this.expandTarget);
|
|
73
73
|
this.host.addEventListener('dragstart', this.onDragStart);
|
|
74
|
+
this.host.addEventListener('dragenter', this.onDragOver);
|
|
74
75
|
this.host.addEventListener('dragover', this.onDragOver);
|
|
75
76
|
this.host.addEventListener('dragleave', this.onDragLeave);
|
|
76
77
|
this.host.addEventListener('drop', this.onDrop);
|
|
@@ -80,6 +81,7 @@ const UITree = class {
|
|
|
80
81
|
disconnectedCallback() {
|
|
81
82
|
this.hoverIntent?.destroy();
|
|
82
83
|
this.host.removeEventListener('dragstart', this.onDragStart);
|
|
84
|
+
this.host.removeEventListener('dragenter', this.onDragOver);
|
|
83
85
|
this.host.removeEventListener('dragover', this.onDragOver);
|
|
84
86
|
this.host.removeEventListener('dragleave', this.onDragLeave);
|
|
85
87
|
this.host.removeEventListener('drop', this.onDrop);
|
|
@@ -95,6 +97,27 @@ const UITree = class {
|
|
|
95
97
|
rowFor(item) {
|
|
96
98
|
return item.shadowRoot?.querySelector('[part="row"]') ?? null;
|
|
97
99
|
}
|
|
100
|
+
itemAtPoint(clientX, clientY) {
|
|
101
|
+
let element = this.host.ownerDocument.elementFromPoint(clientX, clientY);
|
|
102
|
+
while (element) {
|
|
103
|
+
if (element.localName === 'ui-tree-item' && this.host.contains(element)) {
|
|
104
|
+
return element;
|
|
105
|
+
}
|
|
106
|
+
const root = element.getRootNode();
|
|
107
|
+
element = root instanceof ShadowRoot ? root.host : element.parentElement;
|
|
108
|
+
}
|
|
109
|
+
return null;
|
|
110
|
+
}
|
|
111
|
+
isWithinTree(node) {
|
|
112
|
+
let element = node instanceof HTMLElement ? node : null;
|
|
113
|
+
while (element) {
|
|
114
|
+
if (element === this.host || this.host.contains(element))
|
|
115
|
+
return true;
|
|
116
|
+
const root = element.getRootNode();
|
|
117
|
+
element = root instanceof ShadowRoot ? root.host : element.parentElement;
|
|
118
|
+
}
|
|
119
|
+
return false;
|
|
120
|
+
}
|
|
98
121
|
acceptsChildren(item) {
|
|
99
122
|
return Boolean(item.container ?? item.hasAttribute('container'))
|
|
100
123
|
&& !Boolean(item.disabled ?? item.hasAttribute('disabled'));
|
|
@@ -200,34 +223,50 @@ const UITree = class {
|
|
|
200
223
|
}
|
|
201
224
|
};
|
|
202
225
|
onDragLeave = (event) => {
|
|
203
|
-
|
|
204
|
-
|
|
226
|
+
if (this.isWithinTree(event.relatedTarget))
|
|
227
|
+
return;
|
|
228
|
+
if (this.itemAtPoint(event.clientX, event.clientY))
|
|
205
229
|
return;
|
|
206
230
|
this.clearTarget();
|
|
207
231
|
};
|
|
232
|
+
dispatchReorder(source, target, position) {
|
|
233
|
+
const sourceId = this.itemId(source);
|
|
234
|
+
const targetId = this.itemId(target);
|
|
235
|
+
if (!sourceId || !targetId)
|
|
236
|
+
return;
|
|
237
|
+
const sourceMeta = this.itemMetadata(source);
|
|
238
|
+
const targetMeta = this.itemMetadata(target);
|
|
239
|
+
events.dispatchDetail(this.host, 'reorder', {
|
|
240
|
+
sourceId,
|
|
241
|
+
targetId,
|
|
242
|
+
position,
|
|
243
|
+
sourceType: sourceMeta.type,
|
|
244
|
+
targetType: targetMeta.type,
|
|
245
|
+
sourceScope: sourceMeta.scope,
|
|
246
|
+
targetScope: targetMeta.scope,
|
|
247
|
+
trigger: 'pointer',
|
|
248
|
+
});
|
|
249
|
+
}
|
|
208
250
|
onDrop = (event) => {
|
|
209
251
|
if (!this.source || !this.target || !this.position)
|
|
210
252
|
return;
|
|
211
253
|
event.preventDefault();
|
|
212
|
-
|
|
213
|
-
const targetId = this.itemId(this.target);
|
|
214
|
-
if (sourceId && targetId) {
|
|
215
|
-
const sourceMeta = this.itemMetadata(this.source);
|
|
216
|
-
const targetMeta = this.itemMetadata(this.target);
|
|
217
|
-
events.dispatchDetail(this.host, 'reorder', {
|
|
218
|
-
sourceId,
|
|
219
|
-
targetId,
|
|
220
|
-
position: this.position,
|
|
221
|
-
sourceType: sourceMeta.type,
|
|
222
|
-
targetType: targetMeta.type,
|
|
223
|
-
sourceScope: sourceMeta.scope,
|
|
224
|
-
targetScope: targetMeta.scope,
|
|
225
|
-
trigger: 'pointer',
|
|
226
|
-
});
|
|
227
|
-
}
|
|
254
|
+
this.dispatchReorder(this.source, this.target, this.position);
|
|
228
255
|
this.finishDrag();
|
|
229
256
|
};
|
|
230
|
-
onDragEnd = () => {
|
|
257
|
+
onDragEnd = (event) => {
|
|
258
|
+
if (this.source) {
|
|
259
|
+
const target = this.itemAtPoint(event.clientX, event.clientY);
|
|
260
|
+
if (target && target !== this.source) {
|
|
261
|
+
const row = this.rowFor(target);
|
|
262
|
+
if (row) {
|
|
263
|
+
const position = classifyDropPosition(row.getBoundingClientRect(), event.clientY, this.acceptsChildren(target));
|
|
264
|
+
if (this.permitsDrop(this.source, target, position)) {
|
|
265
|
+
this.dispatchReorder(this.source, target, position);
|
|
266
|
+
}
|
|
267
|
+
}
|
|
268
|
+
}
|
|
269
|
+
}
|
|
231
270
|
this.finishDrag();
|
|
232
271
|
};
|
|
233
272
|
visibleItems() {
|
|
@@ -249,7 +288,7 @@ const UITree = class {
|
|
|
249
288
|
next.focus();
|
|
250
289
|
};
|
|
251
290
|
render() {
|
|
252
|
-
return (index.h(index.Host, { key: '
|
|
291
|
+
return (index.h(index.Host, { key: 'b659635f6acdf09a3618c514f5bdd9bf173f9d98', role: "tree", "aria-label": this.label || 'Tree' }, index.h("slot", { key: '0815f0eb0bfe766dd2f358385af1516fd4328e2e' })));
|
|
253
292
|
}
|
|
254
293
|
};
|
|
255
294
|
UITree.style = uiTreeCss();
|
|
@@ -12,6 +12,7 @@ export class UITree {
|
|
|
12
12
|
componentDidLoad() {
|
|
13
13
|
this.hoverIntent = createHoverIntent(this.hoverExpandDelay, this.expandTarget);
|
|
14
14
|
this.host.addEventListener('dragstart', this.onDragStart);
|
|
15
|
+
this.host.addEventListener('dragenter', this.onDragOver);
|
|
15
16
|
this.host.addEventListener('dragover', this.onDragOver);
|
|
16
17
|
this.host.addEventListener('dragleave', this.onDragLeave);
|
|
17
18
|
this.host.addEventListener('drop', this.onDrop);
|
|
@@ -21,6 +22,7 @@ export class UITree {
|
|
|
21
22
|
disconnectedCallback() {
|
|
22
23
|
this.hoverIntent?.destroy();
|
|
23
24
|
this.host.removeEventListener('dragstart', this.onDragStart);
|
|
25
|
+
this.host.removeEventListener('dragenter', this.onDragOver);
|
|
24
26
|
this.host.removeEventListener('dragover', this.onDragOver);
|
|
25
27
|
this.host.removeEventListener('dragleave', this.onDragLeave);
|
|
26
28
|
this.host.removeEventListener('drop', this.onDrop);
|
|
@@ -36,6 +38,27 @@ export class UITree {
|
|
|
36
38
|
rowFor(item) {
|
|
37
39
|
return item.shadowRoot?.querySelector('[part="row"]') ?? null;
|
|
38
40
|
}
|
|
41
|
+
itemAtPoint(clientX, clientY) {
|
|
42
|
+
let element = this.host.ownerDocument.elementFromPoint(clientX, clientY);
|
|
43
|
+
while (element) {
|
|
44
|
+
if (element.localName === 'ui-tree-item' && this.host.contains(element)) {
|
|
45
|
+
return element;
|
|
46
|
+
}
|
|
47
|
+
const root = element.getRootNode();
|
|
48
|
+
element = root instanceof ShadowRoot ? root.host : element.parentElement;
|
|
49
|
+
}
|
|
50
|
+
return null;
|
|
51
|
+
}
|
|
52
|
+
isWithinTree(node) {
|
|
53
|
+
let element = node instanceof HTMLElement ? node : null;
|
|
54
|
+
while (element) {
|
|
55
|
+
if (element === this.host || this.host.contains(element))
|
|
56
|
+
return true;
|
|
57
|
+
const root = element.getRootNode();
|
|
58
|
+
element = root instanceof ShadowRoot ? root.host : element.parentElement;
|
|
59
|
+
}
|
|
60
|
+
return false;
|
|
61
|
+
}
|
|
39
62
|
acceptsChildren(item) {
|
|
40
63
|
return Boolean(item.container ?? item.hasAttribute('container'))
|
|
41
64
|
&& !Boolean(item.disabled ?? item.hasAttribute('disabled'));
|
|
@@ -141,34 +164,50 @@ export class UITree {
|
|
|
141
164
|
}
|
|
142
165
|
};
|
|
143
166
|
onDragLeave = (event) => {
|
|
144
|
-
|
|
145
|
-
|
|
167
|
+
if (this.isWithinTree(event.relatedTarget))
|
|
168
|
+
return;
|
|
169
|
+
if (this.itemAtPoint(event.clientX, event.clientY))
|
|
146
170
|
return;
|
|
147
171
|
this.clearTarget();
|
|
148
172
|
};
|
|
173
|
+
dispatchReorder(source, target, position) {
|
|
174
|
+
const sourceId = this.itemId(source);
|
|
175
|
+
const targetId = this.itemId(target);
|
|
176
|
+
if (!sourceId || !targetId)
|
|
177
|
+
return;
|
|
178
|
+
const sourceMeta = this.itemMetadata(source);
|
|
179
|
+
const targetMeta = this.itemMetadata(target);
|
|
180
|
+
dispatchDetail(this.host, 'reorder', {
|
|
181
|
+
sourceId,
|
|
182
|
+
targetId,
|
|
183
|
+
position,
|
|
184
|
+
sourceType: sourceMeta.type,
|
|
185
|
+
targetType: targetMeta.type,
|
|
186
|
+
sourceScope: sourceMeta.scope,
|
|
187
|
+
targetScope: targetMeta.scope,
|
|
188
|
+
trigger: 'pointer',
|
|
189
|
+
});
|
|
190
|
+
}
|
|
149
191
|
onDrop = (event) => {
|
|
150
192
|
if (!this.source || !this.target || !this.position)
|
|
151
193
|
return;
|
|
152
194
|
event.preventDefault();
|
|
153
|
-
|
|
154
|
-
const targetId = this.itemId(this.target);
|
|
155
|
-
if (sourceId && targetId) {
|
|
156
|
-
const sourceMeta = this.itemMetadata(this.source);
|
|
157
|
-
const targetMeta = this.itemMetadata(this.target);
|
|
158
|
-
dispatchDetail(this.host, 'reorder', {
|
|
159
|
-
sourceId,
|
|
160
|
-
targetId,
|
|
161
|
-
position: this.position,
|
|
162
|
-
sourceType: sourceMeta.type,
|
|
163
|
-
targetType: targetMeta.type,
|
|
164
|
-
sourceScope: sourceMeta.scope,
|
|
165
|
-
targetScope: targetMeta.scope,
|
|
166
|
-
trigger: 'pointer',
|
|
167
|
-
});
|
|
168
|
-
}
|
|
195
|
+
this.dispatchReorder(this.source, this.target, this.position);
|
|
169
196
|
this.finishDrag();
|
|
170
197
|
};
|
|
171
|
-
onDragEnd = () => {
|
|
198
|
+
onDragEnd = (event) => {
|
|
199
|
+
if (this.source) {
|
|
200
|
+
const target = this.itemAtPoint(event.clientX, event.clientY);
|
|
201
|
+
if (target && target !== this.source) {
|
|
202
|
+
const row = this.rowFor(target);
|
|
203
|
+
if (row) {
|
|
204
|
+
const position = classifyDropPosition(row.getBoundingClientRect(), event.clientY, this.acceptsChildren(target));
|
|
205
|
+
if (this.permitsDrop(this.source, target, position)) {
|
|
206
|
+
this.dispatchReorder(this.source, target, position);
|
|
207
|
+
}
|
|
208
|
+
}
|
|
209
|
+
}
|
|
210
|
+
}
|
|
172
211
|
this.finishDrag();
|
|
173
212
|
};
|
|
174
213
|
visibleItems() {
|
|
@@ -190,7 +229,7 @@ export class UITree {
|
|
|
190
229
|
next.focus();
|
|
191
230
|
};
|
|
192
231
|
render() {
|
|
193
|
-
return (h(Host, { key: '
|
|
232
|
+
return (h(Host, { key: 'b659635f6acdf09a3618c514f5bdd9bf173f9d98', role: "tree", "aria-label": this.label || 'Tree' }, h("slot", { key: '0815f0eb0bfe766dd2f358385af1516fd4328e2e' })));
|
|
194
233
|
}
|
|
195
234
|
static get is() { return "ui-tree"; }
|
|
196
235
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as t,H as e,h as i,c as s,t as r}from"./p-CIA4RyEp.js";import{d as n}from"./p-JwSoedEO.js";const
|
|
1
|
+
import{p as t,H as e,h as i,c as s,t as r}from"./p-CIA4RyEp.js";import{d as n}from"./p-JwSoedEO.js";function o(t,e,i){const s=t.height>0?Math.min(1,Math.max(0,(e-t.top)/t.height)):.5;return i?s<.25?"before":s>.75?"after":"inside":s<.5?"before":"after"}const h=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow()}get host(){return this}label="Tree";hoverExpandDelay=700;source=null;target=null;position=null;hoverIntent=null;componentDidLoad(){this.hoverIntent=function(t,e){let i,s;function r(){i&&clearTimeout(i),i=void 0,s=void 0}return{schedule(n){s===n&&i||(r(),s=n,i=setTimeout((()=>{i=void 0;const t=s;s=void 0,t&&e(t)}),Math.max(0,t)))},cancel:r,destroy:r}}(this.hoverExpandDelay,this.expandTarget),this.host.addEventListener("dragstart",this.onDragStart),this.host.addEventListener("dragenter",this.onDragOver),this.host.addEventListener("dragover",this.onDragOver),this.host.addEventListener("dragleave",this.onDragLeave),this.host.addEventListener("drop",this.onDrop),this.host.addEventListener("dragend",this.onDragEnd),this.host.addEventListener("keydown",this.onKeyDown)}disconnectedCallback(){this.hoverIntent?.destroy(),this.host.removeEventListener("dragstart",this.onDragStart),this.host.removeEventListener("dragenter",this.onDragOver),this.host.removeEventListener("dragover",this.onDragOver),this.host.removeEventListener("dragleave",this.onDragLeave),this.host.removeEventListener("drop",this.onDrop),this.host.removeEventListener("dragend",this.onDragEnd),this.host.removeEventListener("keydown",this.onKeyDown)}itemFromEvent(t){return t.composedPath().find((t=>t instanceof e&&"ui-tree-item"===t.localName))??null}itemId(t){return t.itemId||t.getAttribute("item-id")||""}rowFor(t){return t.shadowRoot?.querySelector('[part="row"]')??null}itemAtPoint(t,e){let i=this.host.ownerDocument.elementFromPoint(t,e);for(;i;){if("ui-tree-item"===i.localName&&this.host.contains(i))return i;const t=i.getRootNode();i=t instanceof ShadowRoot?t.host:i.parentElement}return null}isWithinTree(t){let i=t instanceof e?t:null;for(;i;){if(i===this.host||this.host.contains(i))return!0;const t=i.getRootNode();i=t instanceof ShadowRoot?t.host:i.parentElement}return!1}acceptsChildren(t){return!!(t.container??t.hasAttribute("container"))&&!(t.disabled??t.hasAttribute("disabled"))}itemMetadata(t){return{type:t.getAttribute("data-drag-type")||t.getAttribute("drag-type")||"item",scope:t.getAttribute("data-drop-scope")||t.getAttribute("drop-scope")||"",accepts:(t.getAttribute("data-accepts")||t.getAttribute("accepts")||"").split(",").map((t=>t.trim())).filter(Boolean)}}permitsDrop(t,e,i){if(t.contains(e))return!1;const s=this.itemMetadata(t),r=this.itemMetadata(e);return"inside"===i?this.acceptsChildren(e)&&(0===r.accepts.length||r.accepts.includes(s.type)):s.type===r.type}clearTarget(){this.target?.removeAttribute("data-drop-position"),this.target=null,this.position=null,this.hoverIntent?.cancel()}finishDrag(){this.source?.removeAttribute("data-dragging"),this.source=null,this.clearTarget()}expandTarget=t=>{const e=Array.from(this.host.querySelectorAll("ui-tree-item")).find((e=>this.itemId(e)===t));e&&"false"===e.getAttribute("aria-expanded")&&e.dispatchEvent(new CustomEvent("ui-tree-auto-expand"))};onDragStart=t=>{const i=this.itemFromEvent(t);if(!i||!(i.sortable??i.hasAttribute("sortable"))||(i.disabled??i.hasAttribute("disabled")))return;if(!t.composedPath().some((t=>t instanceof e&&"drag-handle"===t.getAttribute("part"))))return void t.preventDefault();const s=this.itemId(i),r=this.rowFor(i);s&&r?(this.source=i,i.setAttribute("data-dragging","true"),t.dataTransfer&&(t.dataTransfer.effectAllowed="move",t.dataTransfer.setData("text/plain",s)),function(t,e){if(!t||"function"!=typeof t.setDragImage)return;const{height:i}=e.getBoundingClientRect();t.setDragImage(e,16,Math.max(0,i/2))}(t.dataTransfer,r)):t.preventDefault()};onDragOver=t=>{if(!this.source)return;const e=this.itemFromEvent(t);if(!e||e===this.source)return void this.clearTarget();const i=this.rowFor(e);if(!i)return;const s=o(i.getBoundingClientRect(),t.clientY,this.acceptsChildren(e));if(!this.permitsDrop(this.source,e,s))return t.dataTransfer&&(t.dataTransfer.dropEffect="none"),void this.clearTarget();t.preventDefault(),t.dataTransfer&&(t.dataTransfer.dropEffect="move"),this.target===e&&this.position===s||(this.clearTarget(),this.target=e,this.position=s,e.setAttribute("data-drop-position",s)),"inside"===s&&"false"===e.getAttribute("aria-expanded")?this.hoverIntent?.schedule(this.itemId(e)):this.hoverIntent?.cancel()};onDragLeave=t=>{this.isWithinTree(t.relatedTarget)||this.itemAtPoint(t.clientX,t.clientY)||this.clearTarget()};dispatchReorder(t,e,i){const s=this.itemId(t),r=this.itemId(e);if(!s||!r)return;const o=this.itemMetadata(t),h=this.itemMetadata(e);n(this.host,"reorder",{sourceId:s,targetId:r,position:i,sourceType:o.type,targetType:h.type,sourceScope:o.scope,targetScope:h.scope,trigger:"pointer"})}onDrop=t=>{this.source&&this.target&&this.position&&(t.preventDefault(),this.dispatchReorder(this.source,this.target,this.position),this.finishDrag())};onDragEnd=t=>{if(this.source){const e=this.itemAtPoint(t.clientX,t.clientY);if(e&&e!==this.source){const i=this.rowFor(e);if(i){const s=o(i.getBoundingClientRect(),t.clientY,this.acceptsChildren(e));this.permitsDrop(this.source,e,s)&&this.dispatchReorder(this.source,e,s)}}}this.finishDrag()};visibleItems(){return Array.from(this.host.querySelectorAll("ui-tree-item")).filter((t=>t.getClientRects().length>0&&!t.hasAttribute("disabled")))}onKeyDown=t=>{const e=this.itemFromEvent(t);if(!e)return;const i=this.visibleItems(),s=i.indexOf(e);if(s<0)return;const r="ArrowDown"===t.key?i[s+1]:"ArrowUp"===t.key?i[s-1]:null;r&&(t.preventDefault(),r.focus())};render(){return i(s,{key:"b659635f6acdf09a3618c514f5bdd9bf173f9d98",role:"tree","aria-label":this.label||"Tree"},i("slot",{key:"0815f0eb0bfe766dd2f358385af1516fd4328e2e"}))}static get style(){return":host{--ui-tree-indent:16px;display:block;min-inline-size:0;padding-inline-start:var(--ui-tree-gutter, 22px)}::slotted(ui-tree-item){--ui-tree-indent:inherit}"}},[769,"ui-tree",{label:[1],hoverExpandDelay:[2,"hover-expand-delay"]}]),a=h,d=function(){"undefined"!=typeof customElements&&["ui-tree"].forEach((t=>{"ui-tree"===t&&(customElements.get(r(t))||customElements.define(r(t),h))}))};export{a as UiTree,d as defineCustomElement}
|
|
@@ -69,6 +69,7 @@ const UITree = class {
|
|
|
69
69
|
componentDidLoad() {
|
|
70
70
|
this.hoverIntent = createHoverIntent(this.hoverExpandDelay, this.expandTarget);
|
|
71
71
|
this.host.addEventListener('dragstart', this.onDragStart);
|
|
72
|
+
this.host.addEventListener('dragenter', this.onDragOver);
|
|
72
73
|
this.host.addEventListener('dragover', this.onDragOver);
|
|
73
74
|
this.host.addEventListener('dragleave', this.onDragLeave);
|
|
74
75
|
this.host.addEventListener('drop', this.onDrop);
|
|
@@ -78,6 +79,7 @@ const UITree = class {
|
|
|
78
79
|
disconnectedCallback() {
|
|
79
80
|
this.hoverIntent?.destroy();
|
|
80
81
|
this.host.removeEventListener('dragstart', this.onDragStart);
|
|
82
|
+
this.host.removeEventListener('dragenter', this.onDragOver);
|
|
81
83
|
this.host.removeEventListener('dragover', this.onDragOver);
|
|
82
84
|
this.host.removeEventListener('dragleave', this.onDragLeave);
|
|
83
85
|
this.host.removeEventListener('drop', this.onDrop);
|
|
@@ -93,6 +95,27 @@ const UITree = class {
|
|
|
93
95
|
rowFor(item) {
|
|
94
96
|
return item.shadowRoot?.querySelector('[part="row"]') ?? null;
|
|
95
97
|
}
|
|
98
|
+
itemAtPoint(clientX, clientY) {
|
|
99
|
+
let element = this.host.ownerDocument.elementFromPoint(clientX, clientY);
|
|
100
|
+
while (element) {
|
|
101
|
+
if (element.localName === 'ui-tree-item' && this.host.contains(element)) {
|
|
102
|
+
return element;
|
|
103
|
+
}
|
|
104
|
+
const root = element.getRootNode();
|
|
105
|
+
element = root instanceof ShadowRoot ? root.host : element.parentElement;
|
|
106
|
+
}
|
|
107
|
+
return null;
|
|
108
|
+
}
|
|
109
|
+
isWithinTree(node) {
|
|
110
|
+
let element = node instanceof HTMLElement ? node : null;
|
|
111
|
+
while (element) {
|
|
112
|
+
if (element === this.host || this.host.contains(element))
|
|
113
|
+
return true;
|
|
114
|
+
const root = element.getRootNode();
|
|
115
|
+
element = root instanceof ShadowRoot ? root.host : element.parentElement;
|
|
116
|
+
}
|
|
117
|
+
return false;
|
|
118
|
+
}
|
|
96
119
|
acceptsChildren(item) {
|
|
97
120
|
return Boolean(item.container ?? item.hasAttribute('container'))
|
|
98
121
|
&& !Boolean(item.disabled ?? item.hasAttribute('disabled'));
|
|
@@ -198,34 +221,50 @@ const UITree = class {
|
|
|
198
221
|
}
|
|
199
222
|
};
|
|
200
223
|
onDragLeave = (event) => {
|
|
201
|
-
|
|
202
|
-
|
|
224
|
+
if (this.isWithinTree(event.relatedTarget))
|
|
225
|
+
return;
|
|
226
|
+
if (this.itemAtPoint(event.clientX, event.clientY))
|
|
203
227
|
return;
|
|
204
228
|
this.clearTarget();
|
|
205
229
|
};
|
|
230
|
+
dispatchReorder(source, target, position) {
|
|
231
|
+
const sourceId = this.itemId(source);
|
|
232
|
+
const targetId = this.itemId(target);
|
|
233
|
+
if (!sourceId || !targetId)
|
|
234
|
+
return;
|
|
235
|
+
const sourceMeta = this.itemMetadata(source);
|
|
236
|
+
const targetMeta = this.itemMetadata(target);
|
|
237
|
+
dispatchDetail(this.host, 'reorder', {
|
|
238
|
+
sourceId,
|
|
239
|
+
targetId,
|
|
240
|
+
position,
|
|
241
|
+
sourceType: sourceMeta.type,
|
|
242
|
+
targetType: targetMeta.type,
|
|
243
|
+
sourceScope: sourceMeta.scope,
|
|
244
|
+
targetScope: targetMeta.scope,
|
|
245
|
+
trigger: 'pointer',
|
|
246
|
+
});
|
|
247
|
+
}
|
|
206
248
|
onDrop = (event) => {
|
|
207
249
|
if (!this.source || !this.target || !this.position)
|
|
208
250
|
return;
|
|
209
251
|
event.preventDefault();
|
|
210
|
-
|
|
211
|
-
const targetId = this.itemId(this.target);
|
|
212
|
-
if (sourceId && targetId) {
|
|
213
|
-
const sourceMeta = this.itemMetadata(this.source);
|
|
214
|
-
const targetMeta = this.itemMetadata(this.target);
|
|
215
|
-
dispatchDetail(this.host, 'reorder', {
|
|
216
|
-
sourceId,
|
|
217
|
-
targetId,
|
|
218
|
-
position: this.position,
|
|
219
|
-
sourceType: sourceMeta.type,
|
|
220
|
-
targetType: targetMeta.type,
|
|
221
|
-
sourceScope: sourceMeta.scope,
|
|
222
|
-
targetScope: targetMeta.scope,
|
|
223
|
-
trigger: 'pointer',
|
|
224
|
-
});
|
|
225
|
-
}
|
|
252
|
+
this.dispatchReorder(this.source, this.target, this.position);
|
|
226
253
|
this.finishDrag();
|
|
227
254
|
};
|
|
228
|
-
onDragEnd = () => {
|
|
255
|
+
onDragEnd = (event) => {
|
|
256
|
+
if (this.source) {
|
|
257
|
+
const target = this.itemAtPoint(event.clientX, event.clientY);
|
|
258
|
+
if (target && target !== this.source) {
|
|
259
|
+
const row = this.rowFor(target);
|
|
260
|
+
if (row) {
|
|
261
|
+
const position = classifyDropPosition(row.getBoundingClientRect(), event.clientY, this.acceptsChildren(target));
|
|
262
|
+
if (this.permitsDrop(this.source, target, position)) {
|
|
263
|
+
this.dispatchReorder(this.source, target, position);
|
|
264
|
+
}
|
|
265
|
+
}
|
|
266
|
+
}
|
|
267
|
+
}
|
|
229
268
|
this.finishDrag();
|
|
230
269
|
};
|
|
231
270
|
visibleItems() {
|
|
@@ -247,7 +286,7 @@ const UITree = class {
|
|
|
247
286
|
next.focus();
|
|
248
287
|
};
|
|
249
288
|
render() {
|
|
250
|
-
return (h(Host, { key: '
|
|
289
|
+
return (h(Host, { key: 'b659635f6acdf09a3618c514f5bdd9bf173f9d98', role: "tree", "aria-label": this.label || 'Tree' }, h("slot", { key: '0815f0eb0bfe766dd2f358385af1516fd4328e2e' })));
|
|
251
290
|
}
|
|
252
291
|
};
|
|
253
292
|
UITree.style = uiTreeCss();
|
package/dist/index.cjs
CHANGED
|
@@ -3423,6 +3423,7 @@ var init_ui_tree_entry = __esm({
|
|
|
3423
3423
|
componentDidLoad() {
|
|
3424
3424
|
this.hoverIntent = createHoverIntent(this.hoverExpandDelay, this.expandTarget);
|
|
3425
3425
|
this.host.addEventListener("dragstart", this.onDragStart);
|
|
3426
|
+
this.host.addEventListener("dragenter", this.onDragOver);
|
|
3426
3427
|
this.host.addEventListener("dragover", this.onDragOver);
|
|
3427
3428
|
this.host.addEventListener("dragleave", this.onDragLeave);
|
|
3428
3429
|
this.host.addEventListener("drop", this.onDrop);
|
|
@@ -3432,6 +3433,7 @@ var init_ui_tree_entry = __esm({
|
|
|
3432
3433
|
disconnectedCallback() {
|
|
3433
3434
|
this.hoverIntent?.destroy();
|
|
3434
3435
|
this.host.removeEventListener("dragstart", this.onDragStart);
|
|
3436
|
+
this.host.removeEventListener("dragenter", this.onDragOver);
|
|
3435
3437
|
this.host.removeEventListener("dragover", this.onDragOver);
|
|
3436
3438
|
this.host.removeEventListener("dragleave", this.onDragLeave);
|
|
3437
3439
|
this.host.removeEventListener("drop", this.onDrop);
|
|
@@ -3447,6 +3449,27 @@ var init_ui_tree_entry = __esm({
|
|
|
3447
3449
|
rowFor(item) {
|
|
3448
3450
|
return item.shadowRoot?.querySelector('[part="row"]') ?? null;
|
|
3449
3451
|
}
|
|
3452
|
+
itemAtPoint(clientX, clientY) {
|
|
3453
|
+
let element = this.host.ownerDocument.elementFromPoint(clientX, clientY);
|
|
3454
|
+
while (element) {
|
|
3455
|
+
if (element.localName === "ui-tree-item" && this.host.contains(element)) {
|
|
3456
|
+
return element;
|
|
3457
|
+
}
|
|
3458
|
+
const root = element.getRootNode();
|
|
3459
|
+
element = root instanceof ShadowRoot ? root.host : element.parentElement;
|
|
3460
|
+
}
|
|
3461
|
+
return null;
|
|
3462
|
+
}
|
|
3463
|
+
isWithinTree(node) {
|
|
3464
|
+
let element = node instanceof HTMLElement ? node : null;
|
|
3465
|
+
while (element) {
|
|
3466
|
+
if (element === this.host || this.host.contains(element))
|
|
3467
|
+
return true;
|
|
3468
|
+
const root = element.getRootNode();
|
|
3469
|
+
element = root instanceof ShadowRoot ? root.host : element.parentElement;
|
|
3470
|
+
}
|
|
3471
|
+
return false;
|
|
3472
|
+
}
|
|
3450
3473
|
acceptsChildren(item) {
|
|
3451
3474
|
return Boolean(item.container ?? item.hasAttribute("container")) && !Boolean(item.disabled ?? item.hasAttribute("disabled"));
|
|
3452
3475
|
}
|
|
@@ -3541,34 +3564,50 @@ var init_ui_tree_entry = __esm({
|
|
|
3541
3564
|
}
|
|
3542
3565
|
};
|
|
3543
3566
|
onDragLeave = (event) => {
|
|
3544
|
-
|
|
3545
|
-
|
|
3567
|
+
if (this.isWithinTree(event.relatedTarget))
|
|
3568
|
+
return;
|
|
3569
|
+
if (this.itemAtPoint(event.clientX, event.clientY))
|
|
3546
3570
|
return;
|
|
3547
3571
|
this.clearTarget();
|
|
3548
3572
|
};
|
|
3573
|
+
dispatchReorder(source, target, position) {
|
|
3574
|
+
const sourceId = this.itemId(source);
|
|
3575
|
+
const targetId = this.itemId(target);
|
|
3576
|
+
if (!sourceId || !targetId)
|
|
3577
|
+
return;
|
|
3578
|
+
const sourceMeta = this.itemMetadata(source);
|
|
3579
|
+
const targetMeta = this.itemMetadata(target);
|
|
3580
|
+
dispatchDetail(this.host, "reorder", {
|
|
3581
|
+
sourceId,
|
|
3582
|
+
targetId,
|
|
3583
|
+
position,
|
|
3584
|
+
sourceType: sourceMeta.type,
|
|
3585
|
+
targetType: targetMeta.type,
|
|
3586
|
+
sourceScope: sourceMeta.scope,
|
|
3587
|
+
targetScope: targetMeta.scope,
|
|
3588
|
+
trigger: "pointer"
|
|
3589
|
+
});
|
|
3590
|
+
}
|
|
3549
3591
|
onDrop = (event) => {
|
|
3550
3592
|
if (!this.source || !this.target || !this.position)
|
|
3551
3593
|
return;
|
|
3552
3594
|
event.preventDefault();
|
|
3553
|
-
|
|
3554
|
-
const targetId = this.itemId(this.target);
|
|
3555
|
-
if (sourceId && targetId) {
|
|
3556
|
-
const sourceMeta = this.itemMetadata(this.source);
|
|
3557
|
-
const targetMeta = this.itemMetadata(this.target);
|
|
3558
|
-
dispatchDetail(this.host, "reorder", {
|
|
3559
|
-
sourceId,
|
|
3560
|
-
targetId,
|
|
3561
|
-
position: this.position,
|
|
3562
|
-
sourceType: sourceMeta.type,
|
|
3563
|
-
targetType: targetMeta.type,
|
|
3564
|
-
sourceScope: sourceMeta.scope,
|
|
3565
|
-
targetScope: targetMeta.scope,
|
|
3566
|
-
trigger: "pointer"
|
|
3567
|
-
});
|
|
3568
|
-
}
|
|
3595
|
+
this.dispatchReorder(this.source, this.target, this.position);
|
|
3569
3596
|
this.finishDrag();
|
|
3570
3597
|
};
|
|
3571
|
-
onDragEnd = () => {
|
|
3598
|
+
onDragEnd = (event) => {
|
|
3599
|
+
if (this.source) {
|
|
3600
|
+
const target = this.itemAtPoint(event.clientX, event.clientY);
|
|
3601
|
+
if (target && target !== this.source) {
|
|
3602
|
+
const row = this.rowFor(target);
|
|
3603
|
+
if (row) {
|
|
3604
|
+
const position = classifyDropPosition(row.getBoundingClientRect(), event.clientY, this.acceptsChildren(target));
|
|
3605
|
+
if (this.permitsDrop(this.source, target, position)) {
|
|
3606
|
+
this.dispatchReorder(this.source, target, position);
|
|
3607
|
+
}
|
|
3608
|
+
}
|
|
3609
|
+
}
|
|
3610
|
+
}
|
|
3572
3611
|
this.finishDrag();
|
|
3573
3612
|
};
|
|
3574
3613
|
visibleItems() {
|
|
@@ -3589,7 +3628,7 @@ var init_ui_tree_entry = __esm({
|
|
|
3589
3628
|
next.focus();
|
|
3590
3629
|
};
|
|
3591
3630
|
render() {
|
|
3592
|
-
return h(Host, { key: "
|
|
3631
|
+
return h(Host, { key: "b659635f6acdf09a3618c514f5bdd9bf173f9d98", role: "tree", "aria-label": this.label || "Tree" }, h("slot", { key: "0815f0eb0bfe766dd2f358385af1516fd4328e2e" }));
|
|
3593
3632
|
}
|
|
3594
3633
|
};
|
|
3595
3634
|
UITree.style = uiTreeCss();
|
package/dist/index.js
CHANGED
package/dist/looma/looma.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as e,b as a}from"./p-CEeiinfk.js";export{s as setNonce}from"./p-CEeiinfk.js";import{g as n}from"./p-DQuL1Twl.js";(()=>{const a=import.meta.url,n={};return""!==a&&(n.resourcesUrl=new URL(".",a).href),e(n)})().then((async e=>(await n(),a([["p-063f5a89",[[769,"ui-context-menu",{open:[4],defaultOpen:[4,"default-open"],for:[1],internalOpen:[32],focusTrigger:[32]},null,{open:[{syncFromProp:0}],for:[{syncTarget:0}],internalOpen:[{syncOverlay:0}]}]]],["p-2e6f791e",[[769,"ui-affordance-scope",{nearRadius:[514,"near-radius"]},null,{nearRadius:[{connectCoordinator:0}]}]]],["p-1681b218",[[513,"ui-avatar",{src:[1],alt:[1],name:[1],fallback:[1],hasImage:[32]},null,{src:[{watchSrc:0}]}]]],["p-5ba9d496",[[769,"ui-avatar-group",{max:[2],label:[1],overflowCount:[32]},null,{max:[{syncOverflow:0}]}]]],["p-0584a051",[[769,"ui-badge",{variant:[1],tone:[1]}]]],["p-34417499",[[769,"ui-button",{variant:[1],size:[1],disabled:[4]},null,{variant:[{syncToButton:0}],size:[{syncToButton:0}],disabled:[{syncToButton:0}]}]]],["p-0f45c5f0",[[769,"ui-checkbox",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],indeterminate:[4],required:[4],value:[1],internalChecked:[32]},null,{checked:[{syncFromProp:0}],internalChecked:[{syncToInput:0}],indeterminate:[{syncToInput:0}],disabled:[{syncToInput:0}],required:[{syncToInput:0}]}]]],["p-11083743",[[769,"ui-dialog",{open:[4],defaultOpen:[4,"default-open"],modal:[4],dismissible:[4],label:[1],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncOpen:0}]}]]],["p-a9f46811",[[769,"ui-disclosure",{open:[4],defaultOpen:[4,"default-open"],disabled:[4],internalOpen:[32],contentId:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncState:0}]}]]],["p-051f578c",[[769,"ui-floating-action-button",{disabled:[516],mobileOnly:[516,"mobile-only"],label:[1]}]]],["p-5d4713a6",[[769,"ui-form-field",{invalid:[4],disabled:[4],required:[4]}]]],["p-0198bb21",[[769,"ui-icon-button",{disabled:[516],label:[1],size:[513],variant:[513],anticipatory:[516]}]]],["p-624ba086",[[769,"ui-input",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],readOnly:[4,"readonly"],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToInput:0}],defaultValue:[{syncToInput:0}],disabled:[{syncToInput:0}],invalid:[{syncToInput:0}],readOnly:[{syncToInput:0}]}]]],["p-ed5abf6d",[[769,"ui-menu-item",{disabled:[516],value:[1]}]]],["p-caa8fc7b",[[769,"ui-popover",{open:[4],defaultOpen:[4,"default-open"],for:[1],placement:[1],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{onOpenChange:0}],for:[{resetSurface:0}],placement:[{resetSurface:0}]}]]],["p-8d5adb17",[[769,"ui-radio",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],name:[1],required:[4],value:[1]},null,{checked:[{syncToInput:0}],disabled:[{syncToInput:0}],name:[{syncToInput:0}],required:[{syncToInput:0}],value:[{syncToInput:0}]}]]],["p-7e94d90d",[[769,"ui-radio-group",{value:[1],name:[1],orientation:[1],disabled:[4],required:[4],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToRadios:0}],name:[{syncToRadios:0}],orientation:[{syncToRadios:0}],disabled:[{syncToRadios:0}]}]]],["p-2ed7e241",[[769,"ui-search-result-row",{disabled:[516],selected:[516],hasLeading:[32],hasMeta:[32],hasExcerpt:[32],hasTrailing:[32]}]]],["p-d273b857",[[769,"ui-search-shell",{hasStatus:[32],hasFooter:[32]}]]],["p-a5127c7d",[[769,"ui-select",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],required:[4],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToSelect:0}],defaultValue:[{syncToSelect:0}],disabled:[{syncToSelect:0}],invalid:[{syncToSelect:0}],required:[{syncToSelect:0}]}]]],["p-b7aa4488",[[769,"ui-switch",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],required:[4],value:[1],internalChecked:[32]},null,{checked:[{syncFromProp:0}]}]]],["p-078f9fb8",[[769,"ui-tabs",{value:[1],defaultValue:[1,"default-value"],orientation:[1],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncState:0}],orientation:[{syncState:0}]}]]],["p-4b422d40",[[769,"ui-textarea",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],readOnly:[4,"readonly"],rows:[2],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToTextarea:0}],defaultValue:[{syncToTextarea:0}],disabled:[{syncToTextarea:0}],invalid:[{syncToTextarea:0}],readOnly:[{syncToTextarea:0}],rows:[{syncToTextarea:0}]}]]],["p-54c41576",[[769,"ui-toast-region",{open:[4],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncSurface:0}]}]]],["p-9194a99d",[[769,"ui-tooltip",{for:[1],open:[4],defaultOpen:[4,"default-open"],placement:[1],showDelay:[2,"show-delay"],hideDelay:[2,"hide-delay"],internalOpen:[32]},null,{open:[{syncFromProp:0}],for:[{resetSurface:0}],placement:[{resetSurface:0}],internalOpen:[{syncOverlay:0}]}]]],["p-a33522a2",[[769,"ui-top-bar",{hasLeading:[32],hasSearch:[32],hasActions:[32]}]]],["p-
|
|
1
|
+
import{p as e,b as a}from"./p-CEeiinfk.js";export{s as setNonce}from"./p-CEeiinfk.js";import{g as n}from"./p-DQuL1Twl.js";(()=>{const a=import.meta.url,n={};return""!==a&&(n.resourcesUrl=new URL(".",a).href),e(n)})().then((async e=>(await n(),a([["p-063f5a89",[[769,"ui-context-menu",{open:[4],defaultOpen:[4,"default-open"],for:[1],internalOpen:[32],focusTrigger:[32]},null,{open:[{syncFromProp:0}],for:[{syncTarget:0}],internalOpen:[{syncOverlay:0}]}]]],["p-2e6f791e",[[769,"ui-affordance-scope",{nearRadius:[514,"near-radius"]},null,{nearRadius:[{connectCoordinator:0}]}]]],["p-1681b218",[[513,"ui-avatar",{src:[1],alt:[1],name:[1],fallback:[1],hasImage:[32]},null,{src:[{watchSrc:0}]}]]],["p-5ba9d496",[[769,"ui-avatar-group",{max:[2],label:[1],overflowCount:[32]},null,{max:[{syncOverflow:0}]}]]],["p-0584a051",[[769,"ui-badge",{variant:[1],tone:[1]}]]],["p-34417499",[[769,"ui-button",{variant:[1],size:[1],disabled:[4]},null,{variant:[{syncToButton:0}],size:[{syncToButton:0}],disabled:[{syncToButton:0}]}]]],["p-0f45c5f0",[[769,"ui-checkbox",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],indeterminate:[4],required:[4],value:[1],internalChecked:[32]},null,{checked:[{syncFromProp:0}],internalChecked:[{syncToInput:0}],indeterminate:[{syncToInput:0}],disabled:[{syncToInput:0}],required:[{syncToInput:0}]}]]],["p-11083743",[[769,"ui-dialog",{open:[4],defaultOpen:[4,"default-open"],modal:[4],dismissible:[4],label:[1],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncOpen:0}]}]]],["p-a9f46811",[[769,"ui-disclosure",{open:[4],defaultOpen:[4,"default-open"],disabled:[4],internalOpen:[32],contentId:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncState:0}]}]]],["p-051f578c",[[769,"ui-floating-action-button",{disabled:[516],mobileOnly:[516,"mobile-only"],label:[1]}]]],["p-5d4713a6",[[769,"ui-form-field",{invalid:[4],disabled:[4],required:[4]}]]],["p-0198bb21",[[769,"ui-icon-button",{disabled:[516],label:[1],size:[513],variant:[513],anticipatory:[516]}]]],["p-624ba086",[[769,"ui-input",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],readOnly:[4,"readonly"],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToInput:0}],defaultValue:[{syncToInput:0}],disabled:[{syncToInput:0}],invalid:[{syncToInput:0}],readOnly:[{syncToInput:0}]}]]],["p-ed5abf6d",[[769,"ui-menu-item",{disabled:[516],value:[1]}]]],["p-caa8fc7b",[[769,"ui-popover",{open:[4],defaultOpen:[4,"default-open"],for:[1],placement:[1],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{onOpenChange:0}],for:[{resetSurface:0}],placement:[{resetSurface:0}]}]]],["p-8d5adb17",[[769,"ui-radio",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],name:[1],required:[4],value:[1]},null,{checked:[{syncToInput:0}],disabled:[{syncToInput:0}],name:[{syncToInput:0}],required:[{syncToInput:0}],value:[{syncToInput:0}]}]]],["p-7e94d90d",[[769,"ui-radio-group",{value:[1],name:[1],orientation:[1],disabled:[4],required:[4],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToRadios:0}],name:[{syncToRadios:0}],orientation:[{syncToRadios:0}],disabled:[{syncToRadios:0}]}]]],["p-2ed7e241",[[769,"ui-search-result-row",{disabled:[516],selected:[516],hasLeading:[32],hasMeta:[32],hasExcerpt:[32],hasTrailing:[32]}]]],["p-d273b857",[[769,"ui-search-shell",{hasStatus:[32],hasFooter:[32]}]]],["p-a5127c7d",[[769,"ui-select",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],required:[4],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToSelect:0}],defaultValue:[{syncToSelect:0}],disabled:[{syncToSelect:0}],invalid:[{syncToSelect:0}],required:[{syncToSelect:0}]}]]],["p-b7aa4488",[[769,"ui-switch",{checked:[4],defaultChecked:[4,"default-checked"],disabled:[4],required:[4],value:[1],internalChecked:[32]},null,{checked:[{syncFromProp:0}]}]]],["p-078f9fb8",[[769,"ui-tabs",{value:[1],defaultValue:[1,"default-value"],orientation:[1],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncState:0}],orientation:[{syncState:0}]}]]],["p-4b422d40",[[769,"ui-textarea",{value:[1],defaultValue:[1,"default-value"],disabled:[4],invalid:[4],readOnly:[4,"readonly"],rows:[2],internalValue:[32]},null,{value:[{syncFromProp:0}],internalValue:[{syncToTextarea:0}],defaultValue:[{syncToTextarea:0}],disabled:[{syncToTextarea:0}],invalid:[{syncToTextarea:0}],readOnly:[{syncToTextarea:0}],rows:[{syncToTextarea:0}]}]]],["p-54c41576",[[769,"ui-toast-region",{open:[4],internalOpen:[32]},null,{open:[{syncFromProp:0}],internalOpen:[{syncSurface:0}]}]]],["p-9194a99d",[[769,"ui-tooltip",{for:[1],open:[4],defaultOpen:[4,"default-open"],placement:[1],showDelay:[2,"show-delay"],hideDelay:[2,"hide-delay"],internalOpen:[32]},null,{open:[{syncFromProp:0}],for:[{resetSurface:0}],placement:[{resetSurface:0}],internalOpen:[{syncOverlay:0}]}]]],["p-a33522a2",[[769,"ui-top-bar",{hasLeading:[32],hasSearch:[32],hasActions:[32]}]]],["p-b0431118",[[769,"ui-tree",{label:[1],hoverExpandDelay:[2,"hover-expand-delay"]}]]],["p-54722713",[[769,"ui-tree-item",{itemId:[1,"item-id"],label:[1],depth:[2],container:[4],sortable:[4],dragType:[1,"drag-type"],dropScope:[1,"drop-scope"],accepts:[1],expanded:[4],defaultExpanded:[4,"default-expanded"],selected:[4],disabled:[4],internalExpanded:[32]},null,{expanded:[{syncExpandedFromProp:0}]}]]],["p-1674cda4",[[769,"ui-menu",{open:[4],defaultOpen:[4,"default-open"],for:[1],placement:[1],internalOpen:[32]},null,{open:[{syncFromProp:0}],for:[{resetSurface:0}],placement:[{resetSurface:0}],internalOpen:[{syncSurface:0}]}]]]],e))));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{r as t,g as i,h as e,H as s}from"./p-CEeiinfk.js";import{d as r}from"./p-JwSoedEO.js";function n(t,i,e){const s=t.height>0?Math.min(1,Math.max(0,(i-t.top)/t.height)):.5;return e?s<.25?"before":s>.75?"after":"inside":s<.5?"before":"after"}const o=class{constructor(i){t(this,i)}get host(){return i(this)}label="Tree";hoverExpandDelay=700;source=null;target=null;position=null;hoverIntent=null;componentDidLoad(){this.hoverIntent=function(t,i){let e,s;function r(){e&&clearTimeout(e),e=void 0,s=void 0}return{schedule(n){s===n&&e||(r(),s=n,e=setTimeout((()=>{e=void 0;const t=s;s=void 0,t&&i(t)}),Math.max(0,t)))},cancel:r,destroy:r}}(this.hoverExpandDelay,this.expandTarget),this.host.addEventListener("dragstart",this.onDragStart),this.host.addEventListener("dragenter",this.onDragOver),this.host.addEventListener("dragover",this.onDragOver),this.host.addEventListener("dragleave",this.onDragLeave),this.host.addEventListener("drop",this.onDrop),this.host.addEventListener("dragend",this.onDragEnd),this.host.addEventListener("keydown",this.onKeyDown)}disconnectedCallback(){this.hoverIntent?.destroy(),this.host.removeEventListener("dragstart",this.onDragStart),this.host.removeEventListener("dragenter",this.onDragOver),this.host.removeEventListener("dragover",this.onDragOver),this.host.removeEventListener("dragleave",this.onDragLeave),this.host.removeEventListener("drop",this.onDrop),this.host.removeEventListener("dragend",this.onDragEnd),this.host.removeEventListener("keydown",this.onKeyDown)}itemFromEvent(t){return t.composedPath().find((t=>t instanceof HTMLElement&&"ui-tree-item"===t.localName))??null}itemId(t){return t.itemId||t.getAttribute("item-id")||""}rowFor(t){return t.shadowRoot?.querySelector('[part="row"]')??null}itemAtPoint(t,i){let e=this.host.ownerDocument.elementFromPoint(t,i);for(;e;){if("ui-tree-item"===e.localName&&this.host.contains(e))return e;const t=e.getRootNode();e=t instanceof ShadowRoot?t.host:e.parentElement}return null}isWithinTree(t){let i=t instanceof HTMLElement?t:null;for(;i;){if(i===this.host||this.host.contains(i))return!0;const t=i.getRootNode();i=t instanceof ShadowRoot?t.host:i.parentElement}return!1}acceptsChildren(t){return Boolean(t.container??t.hasAttribute("container"))&&!Boolean(t.disabled??t.hasAttribute("disabled"))}itemMetadata(t){return{type:t.getAttribute("data-drag-type")||t.getAttribute("drag-type")||"item",scope:t.getAttribute("data-drop-scope")||t.getAttribute("drop-scope")||"",accepts:(t.getAttribute("data-accepts")||t.getAttribute("accepts")||"").split(",").map((t=>t.trim())).filter(Boolean)}}permitsDrop(t,i,e){if(t.contains(i))return!1;const s=this.itemMetadata(t),r=this.itemMetadata(i);return"inside"===e?this.acceptsChildren(i)&&(0===r.accepts.length||r.accepts.includes(s.type)):s.type===r.type}clearTarget(){this.target?.removeAttribute("data-drop-position"),this.target=null,this.position=null,this.hoverIntent?.cancel()}finishDrag(){this.source?.removeAttribute("data-dragging"),this.source=null,this.clearTarget()}expandTarget=t=>{const i=Array.from(this.host.querySelectorAll("ui-tree-item")).find((i=>this.itemId(i)===t));i&&"false"===i.getAttribute("aria-expanded")&&i.dispatchEvent(new CustomEvent("ui-tree-auto-expand"))};onDragStart=t=>{const i=this.itemFromEvent(t);if(!i||!Boolean(i.sortable??i.hasAttribute("sortable"))||Boolean(i.disabled??i.hasAttribute("disabled")))return;if(!t.composedPath().some((t=>t instanceof HTMLElement&&"drag-handle"===t.getAttribute("part"))))return void t.preventDefault();const e=this.itemId(i),s=this.rowFor(i);e&&s?(this.source=i,i.setAttribute("data-dragging","true"),t.dataTransfer&&(t.dataTransfer.effectAllowed="move",t.dataTransfer.setData("text/plain",e)),function(t,i){if(!t||"function"!=typeof t.setDragImage)return;const{height:e}=i.getBoundingClientRect();t.setDragImage(i,16,Math.max(0,e/2))}(t.dataTransfer,s)):t.preventDefault()};onDragOver=t=>{if(!this.source)return;const i=this.itemFromEvent(t);if(!i||i===this.source)return void this.clearTarget();const e=this.rowFor(i);if(!e)return;const s=n(e.getBoundingClientRect(),t.clientY,this.acceptsChildren(i));if(!this.permitsDrop(this.source,i,s))return t.dataTransfer&&(t.dataTransfer.dropEffect="none"),void this.clearTarget();t.preventDefault(),t.dataTransfer&&(t.dataTransfer.dropEffect="move"),this.target===i&&this.position===s||(this.clearTarget(),this.target=i,this.position=s,i.setAttribute("data-drop-position",s)),"inside"===s&&"false"===i.getAttribute("aria-expanded")?this.hoverIntent?.schedule(this.itemId(i)):this.hoverIntent?.cancel()};onDragLeave=t=>{this.isWithinTree(t.relatedTarget)||this.itemAtPoint(t.clientX,t.clientY)||this.clearTarget()};dispatchReorder(t,i,e){const s=this.itemId(t),n=this.itemId(i);if(!s||!n)return;const o=this.itemMetadata(t),h=this.itemMetadata(i);r(this.host,"reorder",{sourceId:s,targetId:n,position:e,sourceType:o.type,targetType:h.type,sourceScope:o.scope,targetScope:h.scope,trigger:"pointer"})}onDrop=t=>{this.source&&this.target&&this.position&&(t.preventDefault(),this.dispatchReorder(this.source,this.target,this.position),this.finishDrag())};onDragEnd=t=>{if(this.source){const i=this.itemAtPoint(t.clientX,t.clientY);if(i&&i!==this.source){const e=this.rowFor(i);if(e){const s=n(e.getBoundingClientRect(),t.clientY,this.acceptsChildren(i));this.permitsDrop(this.source,i,s)&&this.dispatchReorder(this.source,i,s)}}}this.finishDrag()};visibleItems(){return Array.from(this.host.querySelectorAll("ui-tree-item")).filter((t=>t.getClientRects().length>0&&!t.hasAttribute("disabled")))}onKeyDown=t=>{const i=this.itemFromEvent(t);if(!i)return;const e=this.visibleItems(),s=e.indexOf(i);if(s<0)return;const r="ArrowDown"===t.key?e[s+1]:"ArrowUp"===t.key?e[s-1]:null;r&&(t.preventDefault(),r.focus())};render(){return e(s,{key:"b659635f6acdf09a3618c514f5bdd9bf173f9d98",role:"tree","aria-label":this.label||"Tree"},e("slot",{key:"0815f0eb0bfe766dd2f358385af1516fd4328e2e"}))}};o.style=":host{--ui-tree-indent:16px;display:block;min-inline-size:0;padding-inline-start:var(--ui-tree-gutter, 22px)}::slotted(ui-tree-item){--ui-tree-indent:inherit}";export{o as ui_tree}
|