@nyx-ds/treeview 0.1.2 → 0.1.4
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/treeview-lazy.d.ts +3 -0
- package/dist/treeview.d.ts +14 -6
- package/dist/treeview.js +341 -231
- package/dist/treeview.umd.cjs +44 -28
- package/package.json +4 -2
package/dist/treeview.js
CHANGED
|
@@ -1,45 +1,46 @@
|
|
|
1
|
-
import { LitElement as
|
|
2
|
-
import { property as
|
|
3
|
-
import { repeat as
|
|
1
|
+
import { LitElement as Y, nothing as w, html as h, unsafeCSS as J } from "lit";
|
|
2
|
+
import { property as Q, state as _ } from "lit/decorators.js";
|
|
3
|
+
import { repeat as X } from "lit/directives/repeat.js";
|
|
4
4
|
import { classMap as b } from "lit/directives/class-map.js";
|
|
5
|
-
import { chevronRightRegular as
|
|
5
|
+
import { chevronRightRegular as ee, magnifyingGlass as te } from "@nyx-ds/core";
|
|
6
6
|
import "@lit-labs/virtualizer";
|
|
7
7
|
import "@nyx-ds/input";
|
|
8
8
|
import "@nyx-ds/checkbox";
|
|
9
|
+
import "@nyx-ds/radio";
|
|
9
10
|
import "@nyx-ds/icon";
|
|
10
11
|
import "@nyx-ds/button";
|
|
11
|
-
function
|
|
12
|
+
function ie(n, e) {
|
|
12
13
|
return function(t, i) {
|
|
13
14
|
const { native: s = !1, ...r } = i || {}, o = s ? new Event(e, r) : new CustomEvent(e, { detail: t, ...r });
|
|
14
15
|
n.dispatchEvent(o);
|
|
15
16
|
};
|
|
16
17
|
}
|
|
17
|
-
function
|
|
18
|
+
function se(n) {
|
|
18
19
|
return (e, t) => {
|
|
19
20
|
Object.defineProperty(e, t, {
|
|
20
21
|
get() {
|
|
21
|
-
return
|
|
22
|
+
return ie(this, n);
|
|
22
23
|
},
|
|
23
24
|
enumerable: !0,
|
|
24
25
|
configurable: !0
|
|
25
26
|
});
|
|
26
27
|
};
|
|
27
28
|
}
|
|
28
|
-
const
|
|
29
|
-
function
|
|
29
|
+
const re = ":host{display:flex;flex-direction:column;width:100%;--treeview-radius: var(--nyx-radii-s);--treeview-search-padding: var(--nyx-sizing-1-25) var(--nyx-sizing-1-75) 0 var(--nyx-sizing-1-75);--treeview-header-padding: var(--nyx-sizing-2) var(--nyx-sizing-2) var(--nyx-sizing-1-75) var(--nyx-sizing-2);--treeview-row-padding: var(--nyx-sizing-1) var(--nyx-sizing-2);--treeview-row-gap: var(--nyx-sizing-2);--treeview-col-gap: var(--nyx-sizing-1);--treeview-node-gap: var(--nyx-sizing-1);--treeview-row-min-height: 48px;--treeview-indent-base: 16px;--treeview-indent-step: 24px;--treeview-expander-wrapper-size: var(--nyx-sizing-4);--treeview-expander-padding: var(--nyx-sizing-1-25);--treeview-col-width: var(--treeview-header-icon-size);--treeview-column-count: 0;--treeview-scrollbar-gutter: 15px;--treeview-background: var(--nyx-color-neutral-background-primary);--treeview-border-color: var(--nyx-color-neutral-border-tertiary);--treeview-content-color: var(--nyx-color-neutral-content-primary);--treeview-focus-border-color: var(--nyx-color-brand-border-default);--treeview-row-selected-background: var(--nyx-color-brand-background-softer);--treeview-row-selected-hover-background: var( --nyx-color-brand-background-softer-hover );--treeview-row-selected-color: var(--nyx-color-neutral-content-primary);--treeview-font-family: var(--nyx-font-family-font-family);--treeview-title-font-size: var(--nyx-label-medium-font-size);--treeview-title-line-height: var(--nyx-label-medium-line-height);--treeview-text-font-size: var(--nyx-label-medium-font-size);--treeview-text-line-height: var(--nyx-label-medium-line-height);--treeview-header-icon-size: var(--nyx-label-large-font-size);--treeview-node-icon-size: var(--nyx-label-medium-font-size);--treeview-expander-icon-size: var(--nyx-label-large-font-size);--treeview-row-hover-background: var(--nyx-color-neutral-background-secondary);--treeview-row-hover-color: var(--nyx-color-brand-content-hover)}.nyx-treeview{display:flex;flex-direction:column;width:100%;font-family:var(--treeview-font-family);align-items:flex-start;border-radius:var(--treeview-radius);border:1px solid var(--treeview-border-color);background:var(--treeview-background);box-sizing:border-box}.search-container{display:flex;padding:var(--treeview-search-padding);flex-direction:column;align-items:flex-start;align-self:stretch}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.tree-scroll{width:100%;display:flex;flex-direction:column;min-height:0}.tree-body--virtual{display:flex;flex-direction:column;flex:1 1 auto;min-height:280px;max-height:var(--treeview-max-height, 480px);overflow:hidden}.tree-virtualizer{flex:1 1 auto;width:100%;min-height:280px;scrollbar-gutter:stable}.node-wrapper--flat{width:100%}.tree-header{display:flex;justify-content:space-between;align-items:center;align-self:stretch;padding:var(--treeview-header-padding);border-bottom:.5px solid var(--treeview-border-color);box-sizing:border-box}.tree-title{color:var(--treeview-content-color);font-size:var(--treeview-title-font-size);line-height:var(--treeview-title-line-height);font-weight:600;flex:1 1 auto;min-width:0}.tree-header--no-columns .tree-title{flex:1 1 auto}.nyx-treeview--no-columns .header-columns,.nyx-treeview--no-columns .node-columns{display:none}.nyx-treeview--no-columns .tree-header{padding-inline-end:var(--nyx-sizing-2, 16px)}.header-columns,.node-columns{display:flex;align-items:center;justify-content:flex-end;gap:var(--treeview-col-gap);flex-shrink:0}.header-columns{padding-inline-end:0}.nyx-treeview--virtual .header-columns{padding-inline-end:var(--treeview-scrollbar-gutter)}.col-cell{min-width:var(--treeview-col-width);width:var(--treeview-col-width);flex:0 0 auto;display:flex;justify-content:center;align-items:center;box-sizing:border-box}.header-columns ::slotted(nyx-icon){display:flex;justify-content:center;align-items:center;--nyx-icon-size: var(--treeview-header-icon-size);color:var(--treeview-content-color)}.tree-body{width:100%;display:flex;flex-direction:column}.node-wrapper{display:flex;flex-direction:column;width:100%}.node-row{--treeview-row-level: 0;display:flex;align-items:center;justify-content:space-between;min-height:var(--treeview-row-min-height);border-bottom:.5px solid var(--treeview-border-color);gap:var(--treeview-row-gap);padding:var(--treeview-row-padding);padding-left:calc(var(--treeview-indent-base) + var(--treeview-row-level) * var(--treeview-indent-step));box-sizing:border-box;background:transparent;color:var(--treeview-content-color);outline:none;cursor:default}.node-row:hover{background:var(--treeview-row-hover-background);color:var(--treeview-row-hover-color)}.node-row:focus-within{background:var(--treeview-row-hover-background)!important;color:var(--treeview-row-hover-color)!important}.node-row:hover .expander nyx-icon,.node-row:hover .node-type-icon-wrapper ::slotted(nyx-icon){color:var(--treeview-row-hover-color)}.node-row:focus-within .expander nyx-icon,.node-row:focus-within .node-type-icon-wrapper ::slotted(nyx-icon){color:var(--treeview-row-hover-color)}.node-row.selectable.selected{background-color:var(--treeview-row-selected-background);color:var(--treeview-row-selected-color)}.node-row.selectable.selected .expander nyx-icon,.node-row.selectable.selected .node-type-icon-wrapper ::slotted(nyx-icon){color:var(--treeview-row-selected-color)}.node-row.selectable.selected:hover{background-color:var(--treeview-row-selected-hover-background);color:var(--treeview-row-selected-color)}.node-row.selectable.selected:focus-within{background-color:var(--treeview-row-selected-background)!important;color:var(--treeview-row-selected-color)!important}.node-row.selectable.selected:focus-within .expander nyx-icon,.node-row.selectable.selected:focus-within .node-type-icon-wrapper ::slotted(nyx-icon){color:var(--treeview-row-selected-color)}.node-row.selectable.selected:hover:focus-within{background-color:var(--treeview-row-selected-hover-background)!important}.node-row:focus-visible{position:relative;z-index:2;outline:2px solid var(--treeview-focus-border-color);outline-offset:-3px;background:var(--treeview-row-hover-background)!important;color:var(--treeview-row-hover-color)}.row-checkbox{display:flex;align-items:center;margin-right:4px}.node-info{display:flex;align-items:center;gap:var(--treeview-node-gap);flex:1 0 0;overflow:hidden;min-height:32px;padding-left:4px}.expander{--button-icon-color: inherit;flex-shrink:0;width:var(--treeview-expander-wrapper-size);min-width:var(--treeview-expander-wrapper-size)}.expander-placeholder{display:block;flex-shrink:0;width:var(--treeview-expander-wrapper-size);min-width:var(--treeview-expander-wrapper-size);height:var(--treeview-expander-wrapper-size)}.expander nyx-icon{--nyx-icon-size: var(--treeview-expander-icon-size);transition:transform .2s ease;transform-origin:center}.expander nyx-icon.expanded{transform:rotate(90deg)}.expander:hover,.expander:focus-within{--button-icon-color: var(--treeview-content-color) !important}.expander:hover nyx-icon,.expander:focus-within nyx-icon{color:var(--treeview-content-color)!important;--nyx-icon-color: var(--treeview-content-color) !important}.node-row:hover .expander:hover,.node-row:hover .expander:focus-within{--button-icon-color: var(--treeview-row-hover-color) !important}.node-row:hover .expander:hover nyx-icon,.node-row:hover .expander:focus-within nyx-icon{color:var(--treeview-row-hover-color)!important;--nyx-icon-color: var(--treeview-row-hover-color) !important}.node-type-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0}.node-type-icon-wrapper ::slotted(nyx-icon){--nyx-icon-size: var(--treeview-node-icon-size)}.node-text{font-size:var(--treeview-text-font-size);line-height:var(--treeview-text-line-height);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.node-children{width:100%}@media(max-width:768px){.tree-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}.tree-header,.tree-body{min-width:calc(250px + ((var(--treeview-col-width) + var(--treeview-col-gap)) * var(--treeview-column-count)))}.node-text{white-space:normal;display:-webkit-box;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}}", ne = 200;
|
|
30
|
+
function S(n, e) {
|
|
30
31
|
const t = e.trim().toLowerCase();
|
|
31
32
|
return t ? n.toLowerCase().includes(t) : !1;
|
|
32
33
|
}
|
|
33
|
-
function
|
|
34
|
+
function z(n, e) {
|
|
34
35
|
return n.includes(e);
|
|
35
36
|
}
|
|
36
|
-
function
|
|
37
|
+
function L(n) {
|
|
37
38
|
var s;
|
|
38
39
|
const e = /* @__PURE__ */ new Map(), t = [], i = [];
|
|
39
40
|
for (let r = n.length - 1; r >= 0; r--)
|
|
40
41
|
i.push({ node: n[r], parentId: null });
|
|
41
42
|
for (; i.length > 0; ) {
|
|
42
|
-
const { node: r, parentId: o } = i.pop(), a = ((s = r.children) == null ? void 0 : s.map((
|
|
43
|
+
const { node: r, parentId: o } = i.pop(), a = ((s = r.children) == null ? void 0 : s.map((l) => l.id)) ?? [];
|
|
43
44
|
if (e.set(r.id, {
|
|
44
45
|
id: r.id,
|
|
45
46
|
parentId: o,
|
|
@@ -47,12 +48,12 @@ function k(n) {
|
|
|
47
48
|
childIds: a,
|
|
48
49
|
hasChildren: a.length > 0
|
|
49
50
|
}), o === null && t.push(r.id), r.children)
|
|
50
|
-
for (let
|
|
51
|
-
i.push({ node: r.children[
|
|
51
|
+
for (let l = r.children.length - 1; l >= 0; l--)
|
|
52
|
+
i.push({ node: r.children[l], parentId: r.id });
|
|
52
53
|
}
|
|
53
54
|
return { roots: t, byId: e, size: e.size };
|
|
54
55
|
}
|
|
55
|
-
function
|
|
56
|
+
function oe(n) {
|
|
56
57
|
const e = [], t = [];
|
|
57
58
|
for (let i = n.roots.length - 1; i >= 0; i--)
|
|
58
59
|
t.push({ id: n.roots[i], visited: !1 });
|
|
@@ -70,71 +71,71 @@ function se(n) {
|
|
|
70
71
|
}
|
|
71
72
|
return e;
|
|
72
73
|
}
|
|
73
|
-
function
|
|
74
|
+
function ae(n, e, t) {
|
|
74
75
|
const i = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), r = /* @__PURE__ */ new Map();
|
|
75
|
-
for (const o of
|
|
76
|
+
for (const o of oe(n)) {
|
|
76
77
|
const a = n.byId.get(o);
|
|
77
78
|
if (!a) continue;
|
|
78
|
-
const
|
|
79
|
+
const l = z(
|
|
79
80
|
a.normalizedLabel,
|
|
80
81
|
e
|
|
81
82
|
);
|
|
82
|
-
let
|
|
83
|
+
let d = !1;
|
|
83
84
|
for (const p of a.childIds)
|
|
84
85
|
if (r.get(p)) {
|
|
85
|
-
|
|
86
|
+
d = !0;
|
|
86
87
|
break;
|
|
87
88
|
}
|
|
88
|
-
const c =
|
|
89
|
-
if (r.set(o, c), !c || (i.add(o), !a.hasChildren || !
|
|
89
|
+
const c = l || d;
|
|
90
|
+
if (r.set(o, c), !c || (i.add(o), !a.hasChildren || !d)) continue;
|
|
90
91
|
let m = !1;
|
|
91
92
|
for (const p of a.childIds) {
|
|
92
|
-
const
|
|
93
|
-
if (
|
|
93
|
+
const x = n.byId.get(p);
|
|
94
|
+
if (x && z(x.normalizedLabel, e)) {
|
|
94
95
|
m = !0;
|
|
95
96
|
break;
|
|
96
97
|
}
|
|
97
98
|
}
|
|
98
|
-
!t.has(o) && (!
|
|
99
|
+
!t.has(o) && (!l || m) && s.add(o);
|
|
99
100
|
}
|
|
100
101
|
return { visibleIds: i, expandIds: s };
|
|
101
102
|
}
|
|
102
|
-
function
|
|
103
|
+
function le(n, e) {
|
|
103
104
|
const t = e.trim().toLowerCase();
|
|
104
105
|
if (!t) return 0;
|
|
105
|
-
const i = Array.isArray(n) ?
|
|
106
|
+
const i = Array.isArray(n) ? L(n) : n;
|
|
106
107
|
let s = 0;
|
|
107
108
|
for (const r of i.byId.values())
|
|
108
|
-
|
|
109
|
+
z(r.normalizedLabel, t) && s++;
|
|
109
110
|
return s;
|
|
110
111
|
}
|
|
111
|
-
function
|
|
112
|
+
function de(n, e, t = /* @__PURE__ */ new Set()) {
|
|
112
113
|
const i = e.trim().toLowerCase();
|
|
113
114
|
if (!i)
|
|
114
115
|
return { visibleIds: /* @__PURE__ */ new Set(), expandIds: /* @__PURE__ */ new Set() };
|
|
115
|
-
const s = Array.isArray(n) ?
|
|
116
|
-
return
|
|
116
|
+
const s = Array.isArray(n) ? L(n) : n;
|
|
117
|
+
return ae(s, i, t);
|
|
117
118
|
}
|
|
118
|
-
function
|
|
119
|
+
function H(n, e, t = "") {
|
|
119
120
|
const i = n.children ?? [], s = t.trim().toLowerCase();
|
|
120
121
|
return s ? i.filter(
|
|
121
|
-
(r) => e.has(r.id) ||
|
|
122
|
+
(r) => e.has(r.id) || S(r.label, s)
|
|
122
123
|
) : i.filter((r) => e.has(r.id));
|
|
123
124
|
}
|
|
124
|
-
function
|
|
125
|
+
function ce(n, e, t) {
|
|
125
126
|
const i = e.trim().toLowerCase();
|
|
126
127
|
if (!i) return !1;
|
|
127
128
|
const s = [n];
|
|
128
129
|
for (; s.length > 0; ) {
|
|
129
130
|
const r = s.pop();
|
|
130
131
|
for (const o of t(r) ?? []) {
|
|
131
|
-
if (
|
|
132
|
+
if (S(o.label, i)) return !0;
|
|
132
133
|
s.push(o.id);
|
|
133
134
|
}
|
|
134
135
|
}
|
|
135
136
|
return !1;
|
|
136
137
|
}
|
|
137
|
-
function
|
|
138
|
+
function he(n, e, t) {
|
|
138
139
|
const i = [n];
|
|
139
140
|
for (; i.length > 0; ) {
|
|
140
141
|
const s = i.pop();
|
|
@@ -145,63 +146,56 @@ function le(n, e, t) {
|
|
|
145
146
|
}
|
|
146
147
|
return !1;
|
|
147
148
|
}
|
|
148
|
-
function
|
|
149
|
-
return
|
|
149
|
+
function E(n, e, t, i, s, r) {
|
|
150
|
+
return O(n, e, t) && !he(i, s, r) && !ce(i, e, r);
|
|
150
151
|
}
|
|
151
|
-
function
|
|
152
|
-
return
|
|
152
|
+
function O(n, e, t) {
|
|
153
|
+
return S(n, e) && !t;
|
|
153
154
|
}
|
|
154
|
-
function
|
|
155
|
-
return t ||
|
|
155
|
+
function j(n, e, t, i) {
|
|
156
|
+
return t || O(n, e, i);
|
|
156
157
|
}
|
|
157
|
-
function
|
|
158
|
+
function k(n, e) {
|
|
158
159
|
var t, i;
|
|
159
160
|
if (e) {
|
|
160
161
|
if (n.selected) return !0;
|
|
161
162
|
} else if ((((t = n.selectedColumns) == null ? void 0 : t.length) ?? 0) > 0)
|
|
162
163
|
return !0;
|
|
163
164
|
return ((i = n.children) == null ? void 0 : i.some(
|
|
164
|
-
(s) =>
|
|
165
|
+
(s) => k(s, e)
|
|
165
166
|
)) ?? !1;
|
|
166
167
|
}
|
|
167
|
-
function
|
|
168
|
+
function W(n, e) {
|
|
168
169
|
const t = n.map((i, s) => ({ node: i, index: s }));
|
|
169
170
|
return t.sort((i, s) => {
|
|
170
|
-
const r =
|
|
171
|
+
const r = k(i.node, e), o = k(s.node, e);
|
|
171
172
|
return r !== o ? r ? -1 : 1 : i.index - s.index;
|
|
172
173
|
}), t.map(({ node: i }) => {
|
|
173
174
|
var s;
|
|
174
175
|
return (s = i.children) != null && s.length ? {
|
|
175
176
|
...i,
|
|
176
|
-
children:
|
|
177
|
+
children: W(i.children, e)
|
|
177
178
|
} : i;
|
|
178
179
|
});
|
|
179
180
|
}
|
|
180
|
-
const
|
|
181
|
-
function
|
|
181
|
+
const g = 50;
|
|
182
|
+
function ue(n) {
|
|
182
183
|
const e = [], t = n.map((s) => ({ node: s, depth: 0, parentId: null }));
|
|
183
184
|
let i = 0;
|
|
184
185
|
for (; i < t.length; ) {
|
|
185
|
-
const s = t[i++], { node: r, depth: o, parentId: a } = s,
|
|
186
|
+
const s = t[i++], { node: r, depth: o, parentId: a } = s, l = !!(r.children && r.children.length > 0);
|
|
186
187
|
if (e.push({
|
|
187
188
|
id: r.id,
|
|
188
189
|
depth: o,
|
|
189
190
|
parentId: a,
|
|
190
|
-
hasChildrenInSource:
|
|
191
|
-
}),
|
|
192
|
-
for (const
|
|
193
|
-
t.push({ node:
|
|
191
|
+
hasChildrenInSource: l
|
|
192
|
+
}), l)
|
|
193
|
+
for (const d of r.children)
|
|
194
|
+
t.push({ node: d, depth: o + 1, parentId: r.id });
|
|
194
195
|
}
|
|
195
196
|
return e;
|
|
196
197
|
}
|
|
197
|
-
function
|
|
198
|
-
const i = /* @__PURE__ */ new Set();
|
|
199
|
-
for (const s of n)
|
|
200
|
-
if (!(s.depth > t) && (i.add(s.id), i.size >= e))
|
|
201
|
-
break;
|
|
202
|
-
return i;
|
|
203
|
-
}
|
|
204
|
-
function ue(n, e = x) {
|
|
198
|
+
function fe(n, e = g) {
|
|
205
199
|
const t = /* @__PURE__ */ new Set();
|
|
206
200
|
for (const i of n)
|
|
207
201
|
if (i.depth === 0 && (t.add(i.id), t.size >= e))
|
|
@@ -215,39 +209,83 @@ function _e(n, e, t) {
|
|
|
215
209
|
break;
|
|
216
210
|
return i;
|
|
217
211
|
}
|
|
218
|
-
function
|
|
212
|
+
function pe(n, e) {
|
|
219
213
|
return n.some((t) => t.depth === 0 && !e.has(t.id));
|
|
220
214
|
}
|
|
221
|
-
function
|
|
215
|
+
function we(n, e, t) {
|
|
222
216
|
return T(e, n).some((i) => !t.has(i));
|
|
223
217
|
}
|
|
224
|
-
function
|
|
218
|
+
function G(n, e, t) {
|
|
219
|
+
return e.some(
|
|
220
|
+
(i) => i.parentId === n && !t.has(i.id)
|
|
221
|
+
);
|
|
222
|
+
}
|
|
223
|
+
function P(n, e) {
|
|
225
224
|
if (!n) return;
|
|
226
225
|
let t = n.node.id, i = e.get(t);
|
|
227
226
|
for (; (i == null ? void 0 : i.parentId) != null; )
|
|
228
227
|
t = i.parentId, i = e.get(t);
|
|
229
228
|
return t;
|
|
230
229
|
}
|
|
231
|
-
function
|
|
230
|
+
function ve(n, e, t, i, s, r) {
|
|
232
231
|
const o = Math.min(
|
|
233
232
|
Math.max(0, e),
|
|
234
233
|
Math.max(0, n.length - 1)
|
|
235
234
|
);
|
|
236
235
|
for (let a = o; a >= 0; a--) {
|
|
237
|
-
const
|
|
238
|
-
if (t.has(
|
|
239
|
-
return
|
|
236
|
+
const l = n[a];
|
|
237
|
+
if (t.has(l.node.id) && G(l.node.id, i, s))
|
|
238
|
+
return P(l, r);
|
|
240
239
|
}
|
|
241
|
-
return
|
|
240
|
+
return P(n[o], r);
|
|
242
241
|
}
|
|
243
|
-
function
|
|
242
|
+
function me(n, e) {
|
|
244
243
|
const t = [];
|
|
245
244
|
let i = e.get(n);
|
|
246
245
|
for (; (i == null ? void 0 : i.parentId) != null; )
|
|
247
246
|
t.push(i.parentId), i = e.get(i.parentId);
|
|
248
247
|
return t;
|
|
249
248
|
}
|
|
250
|
-
function
|
|
249
|
+
function V(n, e, t) {
|
|
250
|
+
if (t < 0) return [];
|
|
251
|
+
const i = $(n), s = [];
|
|
252
|
+
for (const r of e) {
|
|
253
|
+
const o = [
|
|
254
|
+
{ id: r, level: 0 }
|
|
255
|
+
];
|
|
256
|
+
for (; o.length > 0; ) {
|
|
257
|
+
const a = o.pop();
|
|
258
|
+
if (a.level > t) continue;
|
|
259
|
+
s.push(a.id);
|
|
260
|
+
const l = i.get(a.id);
|
|
261
|
+
if (!(!(l != null && l.length) || a.level >= t))
|
|
262
|
+
for (let d = l.length - 1; d >= 0; d--)
|
|
263
|
+
o.push({ id: l[d], level: a.level + 1 });
|
|
264
|
+
}
|
|
265
|
+
}
|
|
266
|
+
return s;
|
|
267
|
+
}
|
|
268
|
+
function xe(n, e, t) {
|
|
269
|
+
if (t <= 0) return [];
|
|
270
|
+
const i = $(n), s = [];
|
|
271
|
+
for (const r of e) {
|
|
272
|
+
const o = [
|
|
273
|
+
{ id: r, level: 0 }
|
|
274
|
+
];
|
|
275
|
+
for (; o.length > 0; ) {
|
|
276
|
+
const a = o.pop();
|
|
277
|
+
if (a.level >= t) continue;
|
|
278
|
+
const l = i.get(a.id);
|
|
279
|
+
if (l != null && l.length) {
|
|
280
|
+
s.push(a.id);
|
|
281
|
+
for (let d = l.length - 1; d >= 0; d--)
|
|
282
|
+
o.push({ id: l[d], level: a.level + 1 });
|
|
283
|
+
}
|
|
284
|
+
}
|
|
285
|
+
}
|
|
286
|
+
return s;
|
|
287
|
+
}
|
|
288
|
+
function U(n, e, t, i) {
|
|
251
289
|
const s = [], r = (o) => {
|
|
252
290
|
s.length >= t || !e.has(o) && !s.includes(o) && s.push(o);
|
|
253
291
|
};
|
|
@@ -260,12 +298,7 @@ function P(n, e, t, i) {
|
|
|
260
298
|
return s;
|
|
261
299
|
}
|
|
262
300
|
function T(n, e) {
|
|
263
|
-
const t =
|
|
264
|
-
for (const r of n) {
|
|
265
|
-
const o = r.parentId;
|
|
266
|
-
t.has(o) || t.set(o, []), t.get(o).push(r.id);
|
|
267
|
-
}
|
|
268
|
-
const i = [], s = [e];
|
|
301
|
+
const t = $(n), i = [], s = [e];
|
|
269
302
|
for (; s.length > 0; ) {
|
|
270
303
|
const r = s.pop();
|
|
271
304
|
i.push(r);
|
|
@@ -276,11 +309,19 @@ function T(n, e) {
|
|
|
276
309
|
}
|
|
277
310
|
return i;
|
|
278
311
|
}
|
|
279
|
-
function
|
|
312
|
+
function $(n) {
|
|
313
|
+
const e = /* @__PURE__ */ new Map();
|
|
314
|
+
for (const t of n) {
|
|
315
|
+
const i = t.parentId;
|
|
316
|
+
e.has(i) || e.set(i, []), e.get(i).push(t.id);
|
|
317
|
+
}
|
|
318
|
+
return e;
|
|
319
|
+
}
|
|
320
|
+
function be(n, e, t) {
|
|
280
321
|
return T(n, e).filter((i) => !t.has(i));
|
|
281
322
|
}
|
|
282
|
-
function
|
|
283
|
-
return
|
|
323
|
+
function ge(n, e, t, i = g) {
|
|
324
|
+
return be(n, e, t).slice(0, i);
|
|
284
325
|
}
|
|
285
326
|
function A(n) {
|
|
286
327
|
var e;
|
|
@@ -292,78 +333,78 @@ function A(n) {
|
|
|
292
333
|
data: n.data
|
|
293
334
|
};
|
|
294
335
|
}
|
|
295
|
-
function
|
|
336
|
+
function ye(n) {
|
|
296
337
|
const e = /* @__PURE__ */ new Map(), t = (i) => {
|
|
297
338
|
var s;
|
|
298
339
|
e.set(i.id, i), (s = i.children) == null || s.forEach(t);
|
|
299
340
|
};
|
|
300
341
|
return n.forEach(t), e;
|
|
301
342
|
}
|
|
302
|
-
function
|
|
343
|
+
function Ie(n, e, t) {
|
|
303
344
|
const i = (s) => {
|
|
304
345
|
if (!e.has(s.id)) return null;
|
|
305
|
-
const r = t.get(s.id) ?? s, o = (r.children ?? []).map((
|
|
346
|
+
const r = t.get(s.id) ?? s, o = (r.children ?? []).map((l) => i(l)).filter((l) => l !== null), a = A(r);
|
|
306
347
|
return a.children = o.length > 0 ? o : void 0, a;
|
|
307
348
|
};
|
|
308
349
|
return n.map((s) => i(s)).filter((s) => s !== null);
|
|
309
350
|
}
|
|
310
351
|
function F(n) {
|
|
311
|
-
const e = [], t = n.searchTerm.trim().toLowerCase(), i = (s, r, o, a,
|
|
312
|
-
const
|
|
313
|
-
for (const c of
|
|
314
|
-
const m = n.hasSearch && !!t && c.label.toLowerCase().includes(t), p =
|
|
352
|
+
const e = [], t = n.searchTerm.trim().toLowerCase(), i = (s, r, o, a, l = !1) => {
|
|
353
|
+
const d = n.hasSearch && !l ? s.filter((c) => n.searchVisibleIds.has(c.id)) : s;
|
|
354
|
+
for (const c of d) {
|
|
355
|
+
const m = n.hasSearch && !!t && c.label.toLowerCase().includes(t), p = j(
|
|
315
356
|
c.label,
|
|
316
357
|
t,
|
|
317
358
|
o,
|
|
318
359
|
a
|
|
319
|
-
),
|
|
360
|
+
), x = a || !!m;
|
|
320
361
|
if (e.push({
|
|
321
362
|
node: c,
|
|
322
363
|
level: r,
|
|
323
364
|
revealSubtree: p,
|
|
324
|
-
parentLabelMatched:
|
|
365
|
+
parentLabelMatched: x,
|
|
325
366
|
hasChildrenInSource: n.sourceHasChildren(c.id)
|
|
326
367
|
}), !n.expandedIds.has(c.id)) continue;
|
|
327
|
-
const M = n.getSourceChildren ?? ((
|
|
368
|
+
const M = n.getSourceChildren ?? ((R) => {
|
|
328
369
|
var D;
|
|
329
|
-
return (D = n.items.find((
|
|
330
|
-
}),
|
|
370
|
+
return (D = n.items.find((Z) => Z.id === R)) == null ? void 0 : D.children;
|
|
371
|
+
}), y = !n.hasSearch || p && E(
|
|
331
372
|
c.label,
|
|
332
373
|
t,
|
|
333
374
|
a,
|
|
334
375
|
c.id,
|
|
335
376
|
n.searchVisibleIds,
|
|
336
377
|
M
|
|
337
|
-
) ? c.children ?? [] :
|
|
378
|
+
) ? c.children ?? [] : H(
|
|
338
379
|
c,
|
|
339
380
|
n.searchVisibleIds,
|
|
340
381
|
n.searchTerm
|
|
341
382
|
);
|
|
342
|
-
|
|
383
|
+
y.length > 0 && i(y, r + 1, p, x, !0);
|
|
343
384
|
}
|
|
344
385
|
};
|
|
345
386
|
return i(n.items, 0, !1, !1), e;
|
|
346
387
|
}
|
|
347
|
-
function
|
|
388
|
+
function I(n, e) {
|
|
348
389
|
for (const t of n)
|
|
349
390
|
if (!e.has(t)) return !0;
|
|
350
391
|
return !1;
|
|
351
392
|
}
|
|
352
|
-
function
|
|
393
|
+
function K(n, e, t, i = g) {
|
|
353
394
|
const s = [], r = (o) => {
|
|
354
395
|
s.length >= i || !e.has(o) && !s.includes(o) && s.push(o);
|
|
355
396
|
};
|
|
356
397
|
for (const o of n)
|
|
357
398
|
if (!e.has(o)) {
|
|
358
399
|
r(o);
|
|
359
|
-
for (const a of
|
|
400
|
+
for (const a of me(o, t))
|
|
360
401
|
r(a);
|
|
361
402
|
if (s.length >= i) break;
|
|
362
403
|
}
|
|
363
404
|
return s;
|
|
364
405
|
}
|
|
365
|
-
function
|
|
366
|
-
const s =
|
|
406
|
+
function q(n, e, t, i = g) {
|
|
407
|
+
const s = K(
|
|
367
408
|
n,
|
|
368
409
|
e,
|
|
369
410
|
t,
|
|
@@ -371,26 +412,26 @@ function B(n, e, t, i = x) {
|
|
|
371
412
|
);
|
|
372
413
|
return s.length === 0 ? !1 : (s.forEach((r) => e.add(r)), !0);
|
|
373
414
|
}
|
|
374
|
-
function
|
|
415
|
+
function Se(n, e) {
|
|
375
416
|
return e ? `Collapse ${n}` : `Expand ${n}`;
|
|
376
417
|
}
|
|
377
|
-
function
|
|
418
|
+
function B(n) {
|
|
378
419
|
return `Select ${n}`;
|
|
379
420
|
}
|
|
380
|
-
function
|
|
421
|
+
function Ce(n, e) {
|
|
381
422
|
return `${n}, ${e}`;
|
|
382
423
|
}
|
|
383
|
-
function
|
|
424
|
+
function Re(n) {
|
|
384
425
|
return n === 0 ? "No results found" : n === 1 ? "1 result found" : `${n} results found`;
|
|
385
426
|
}
|
|
386
|
-
var
|
|
387
|
-
for (var s = i > 1 ? void 0 : i ?
|
|
427
|
+
var ze = Object.defineProperty, Ee = Object.getOwnPropertyDescriptor, f = (n, e, t, i) => {
|
|
428
|
+
for (var s = i > 1 ? void 0 : i ? Ee(e, t) : e, r = n.length - 1, o; r >= 0; r--)
|
|
388
429
|
(o = n[r]) && (s = (i ? o(e, t, s) : o(s)) || s);
|
|
389
|
-
return i && s &&
|
|
390
|
-
};
|
|
391
|
-
const
|
|
430
|
+
return i && s && ze(e, t, s), s;
|
|
431
|
+
}, v;
|
|
432
|
+
const u = (v = class extends Y {
|
|
392
433
|
constructor() {
|
|
393
|
-
super(...arguments), this._items = [], this._expandedIds = /* @__PURE__ */ new Set(), this._searchTerm = "", this._searchStatusMessage = "", this._searchVisibleIds = /* @__PURE__ */ new Set(), this._searchUserCollapsedIds = /* @__PURE__ */ new Set(), this._searchManualExpandedIds = /* @__PURE__ */ new Set(), this._expandedIdsBeforeSearch = null, this._flatRows = [], this._loadedIds = /* @__PURE__ */ new Set(), this._activeRowId = null, this._sourceItems = [], this._lazyItemsSourceRef = null, this._treeIndex = [], this._indexById = /* @__PURE__ */ new Map(), this._sourceById = /* @__PURE__ */ new Map(), this._lazyScrollLoading = !1, this._searchIndex = null, this._searchIndexSourceRef = null, this._searchDebounceTimer = null;
|
|
434
|
+
super(...arguments), this._rowSelectionRadioName = `nyx-treeview-row-selection-${v._nextTreeviewId++}`, this._items = [], this._expandedIds = /* @__PURE__ */ new Set(), this._searchTerm = "", this._searchStatusMessage = "", this._searchVisibleIds = /* @__PURE__ */ new Set(), this._searchUserCollapsedIds = /* @__PURE__ */ new Set(), this._searchManualExpandedIds = /* @__PURE__ */ new Set(), this._expandedIdsBeforeSearch = null, this._flatRows = [], this._loadedIds = /* @__PURE__ */ new Set(), this._activeRowId = null, this._sourceItems = [], this._lazyItemsSourceRef = null, this._treeIndex = [], this._indexById = /* @__PURE__ */ new Map(), this._sourceById = /* @__PURE__ */ new Map(), this._lazyScrollLoading = !1, this._searchIndex = null, this._searchIndexSourceRef = null, this._searchDebounceTimer = null;
|
|
394
435
|
}
|
|
395
436
|
get options() {
|
|
396
437
|
return this._options;
|
|
@@ -406,7 +447,7 @@ const $ = class $ extends Z {
|
|
|
406
447
|
_getLazyPageSize() {
|
|
407
448
|
var t;
|
|
408
449
|
const e = (t = this.options) == null ? void 0 : t.lazyLoadPageSize;
|
|
409
|
-
return e == null || !Number.isFinite(e) ?
|
|
450
|
+
return e == null || !Number.isFinite(e) ? g : Math.max(1, Math.floor(e));
|
|
410
451
|
}
|
|
411
452
|
_hasColumnPermissions() {
|
|
412
453
|
var e, t, i;
|
|
@@ -416,17 +457,30 @@ const $ = class $ extends Z {
|
|
|
416
457
|
var e;
|
|
417
458
|
return !!((e = this.options) != null && e.showRowSelection);
|
|
418
459
|
}
|
|
460
|
+
_usesUniqueRowSelection() {
|
|
461
|
+
var e;
|
|
462
|
+
return this._showRowSelection() && !!((e = this.options) != null && e.uniqueSelection);
|
|
463
|
+
}
|
|
419
464
|
_showNodeIcons() {
|
|
420
465
|
var e;
|
|
421
466
|
return ((e = this.options) == null ? void 0 : e.showNodeIcons) !== !1;
|
|
422
467
|
}
|
|
423
468
|
_usesSimpleRowSelection() {
|
|
424
|
-
return this._showRowSelection() && !this._hasColumnPermissions();
|
|
469
|
+
return this._showRowSelection() && !this._usesUniqueRowSelection() && !this._hasColumnPermissions();
|
|
425
470
|
}
|
|
426
471
|
_applyItemsFromOptions(e) {
|
|
427
472
|
var i;
|
|
428
473
|
let t = e.map((s) => A(s));
|
|
429
|
-
return (i = this.options) != null && i.sortSelectedFirst && (t =
|
|
474
|
+
return this._usesUniqueRowSelection() && this._applyUniqueSelectionConstraint(t), (i = this.options) != null && i.sortSelectedFirst && (t = W(t, this._usesSimpleRowSelection())), t;
|
|
475
|
+
}
|
|
476
|
+
_applyUniqueSelectionConstraint(e) {
|
|
477
|
+
let t = !1;
|
|
478
|
+
const i = (s) => {
|
|
479
|
+
s.forEach((r) => {
|
|
480
|
+
r.selected && (t ? r.selected = !1 : t = !0), r.children && i(r.children);
|
|
481
|
+
});
|
|
482
|
+
};
|
|
483
|
+
i(e);
|
|
430
484
|
}
|
|
431
485
|
_applyOptionsChange() {
|
|
432
486
|
if (this.options) {
|
|
@@ -446,20 +500,23 @@ const $ = class $ extends Z {
|
|
|
446
500
|
}
|
|
447
501
|
}
|
|
448
502
|
_initLazyState() {
|
|
449
|
-
var
|
|
450
|
-
this._lazyItemsSourceRef = this.options.items, this._sourceItems = this._applyItemsFromOptions(this.options.items), this._invalidateSearchIndex(), this._treeIndex =
|
|
451
|
-
const e = (
|
|
452
|
-
this._loadedIds = e !== void 0 && e > 0
|
|
503
|
+
var s;
|
|
504
|
+
this._lazyItemsSourceRef = this.options.items, this._sourceItems = this._applyItemsFromOptions(this.options.items), this._invalidateSearchIndex(), this._treeIndex = ue(this._sourceItems), this._indexById = new Map(this._treeIndex.map((r) => [r.id, r])), this._sourceById = ye(this._sourceItems);
|
|
505
|
+
const e = (s = this.options) == null ? void 0 : s.defaultExpandedLevel, t = this._getLazyPageSize(), i = fe(this._treeIndex, t);
|
|
506
|
+
this._loadedIds = new Set(i), e !== void 0 && e > 0 && this._loadDefaultExpandedLevelForRoots(i, e), this._expandedIds = /* @__PURE__ */ new Set(), e !== void 0 && e > 0 && this._applyLazyDefaultExpansion(i, e), this._activeRowId = null, this._rebuildMaterializedItems(), this._commitLazyRows();
|
|
507
|
+
}
|
|
508
|
+
_loadDefaultExpandedLevelForRoots(e, t) {
|
|
509
|
+
V(this._treeIndex, e, t).forEach(
|
|
510
|
+
(i) => this._loadedIds.add(i)
|
|
511
|
+
);
|
|
453
512
|
}
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
_applyLazyInitialExpansion(e) {
|
|
459
|
-
this._expandToLevel(this._items, 0, e), this._expandedIds = new Set(this._expandedIds);
|
|
513
|
+
_applyLazyDefaultExpansion(e, t) {
|
|
514
|
+
xe(this._treeIndex, e, t).forEach(
|
|
515
|
+
(i) => this._expandedIds.add(i)
|
|
516
|
+
), this._expandedIds = new Set(this._expandedIds);
|
|
460
517
|
}
|
|
461
518
|
_rebuildMaterializedItems() {
|
|
462
|
-
this._items =
|
|
519
|
+
this._items = Ie(
|
|
463
520
|
this._sourceItems,
|
|
464
521
|
this._loadedIds,
|
|
465
522
|
this._sourceById
|
|
@@ -481,7 +538,7 @@ const $ = class $ extends Z {
|
|
|
481
538
|
}
|
|
482
539
|
_ensureSearchIndex() {
|
|
483
540
|
const e = this._selectionRoots();
|
|
484
|
-
return this._searchIndex && this._searchIndexSourceRef === e ? this._searchIndex : (this._searchIndexSourceRef = e, this._searchIndex =
|
|
541
|
+
return this._searchIndex && this._searchIndexSourceRef === e ? this._searchIndex : (this._searchIndexSourceRef = e, this._searchIndex = L(e), this._searchIndex);
|
|
485
542
|
}
|
|
486
543
|
disconnectedCallback() {
|
|
487
544
|
super.disconnectedCallback(), this._searchDebounceTimer !== null && (clearTimeout(this._searchDebounceTimer), this._searchDebounceTimer = null);
|
|
@@ -509,19 +566,20 @@ const $ = class $ extends Z {
|
|
|
509
566
|
return t == null ? void 0 : t.children;
|
|
510
567
|
}
|
|
511
568
|
_loadMoreNodes(e) {
|
|
569
|
+
var o, a;
|
|
512
570
|
if (!this._isLazyEnabled()) return;
|
|
513
571
|
const t = this._getLazyPageSize();
|
|
514
|
-
let i;
|
|
572
|
+
let i, s = [];
|
|
515
573
|
if (this._isSearchActive())
|
|
516
|
-
if (
|
|
517
|
-
i =
|
|
574
|
+
if (I(this._searchVisibleIds, this._loadedIds))
|
|
575
|
+
i = K(
|
|
518
576
|
this._searchVisibleIds,
|
|
519
577
|
this._loadedIds,
|
|
520
578
|
this._indexById,
|
|
521
579
|
t
|
|
522
580
|
);
|
|
523
581
|
else if (e != null && this._hasExclusiveSearchFolderWithUnloadedChildren())
|
|
524
|
-
i =
|
|
582
|
+
i = U(
|
|
525
583
|
this._treeIndex,
|
|
526
584
|
this._loadedIds,
|
|
527
585
|
t,
|
|
@@ -529,16 +587,35 @@ const $ = class $ extends Z {
|
|
|
529
587
|
);
|
|
530
588
|
else
|
|
531
589
|
return;
|
|
532
|
-
else e != null
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
590
|
+
else if (e != null)
|
|
591
|
+
i = U(
|
|
592
|
+
this._treeIndex,
|
|
593
|
+
this._loadedIds,
|
|
594
|
+
t,
|
|
595
|
+
e
|
|
596
|
+
);
|
|
597
|
+
else {
|
|
598
|
+
s = _e(
|
|
599
|
+
this._treeIndex,
|
|
600
|
+
this._loadedIds,
|
|
601
|
+
t
|
|
602
|
+
), i = [...s];
|
|
603
|
+
const l = (o = this.options) == null ? void 0 : o.defaultExpandedLevel;
|
|
604
|
+
l !== void 0 && l > 0 && i.push(
|
|
605
|
+
...V(
|
|
606
|
+
this._treeIndex,
|
|
607
|
+
s,
|
|
608
|
+
l
|
|
609
|
+
)
|
|
610
|
+
);
|
|
611
|
+
}
|
|
612
|
+
if (i.length === 0) return;
|
|
613
|
+
i.forEach((l) => this._loadedIds.add(l));
|
|
614
|
+
const r = (a = this.options) == null ? void 0 : a.defaultExpandedLevel;
|
|
615
|
+
s.length > 0 && r !== void 0 && r > 0 && this._applyLazyDefaultExpansion(s, r), this._loadedIds = new Set(this._loadedIds), this._rebuildMaterializedItems(), this._commitLazyRows();
|
|
539
616
|
}
|
|
540
617
|
_loadSubtreeForExpand(e) {
|
|
541
|
-
const t =
|
|
618
|
+
const t = ge(
|
|
542
619
|
this._treeIndex,
|
|
543
620
|
e,
|
|
544
621
|
this._loadedIds,
|
|
@@ -596,7 +673,7 @@ const $ = class $ extends Z {
|
|
|
596
673
|
_getSearchScrollTargetIndex() {
|
|
597
674
|
const e = this._searchTerm.trim().toLowerCase();
|
|
598
675
|
if (!e || this._flatRows.length === 0) return 0;
|
|
599
|
-
const t = this._flatRows.map((r, o) => ({ row: r, index: o })).filter(({ row: r }) =>
|
|
676
|
+
const t = this._flatRows.map((r, o) => ({ row: r, index: o })).filter(({ row: r }) => S(r.node.label, e));
|
|
600
677
|
if (t.length === 0) return 0;
|
|
601
678
|
const i = t.reduce(
|
|
602
679
|
(r, o) => o.row.level >= r.row.level ? o : r
|
|
@@ -611,9 +688,9 @@ const $ = class $ extends Z {
|
|
|
611
688
|
}
|
|
612
689
|
_loadUntilSearchTargetVisible() {
|
|
613
690
|
let e = 0;
|
|
614
|
-
for (; e++ < 100 && !(this._getSearchScrollTargetIndex() < this._flatRows.length || !
|
|
615
|
-
if (
|
|
616
|
-
if (!
|
|
691
|
+
for (; e++ < 100 && !(this._getSearchScrollTargetIndex() < this._flatRows.length || !I(this._searchVisibleIds, this._loadedIds) && !this._hasExpandedUnloadedSubtree()); ) {
|
|
692
|
+
if (I(this._searchVisibleIds, this._loadedIds)) {
|
|
693
|
+
if (!q(
|
|
617
694
|
this._searchVisibleIds,
|
|
618
695
|
this._loadedIds,
|
|
619
696
|
this._indexById,
|
|
@@ -634,7 +711,7 @@ const $ = class $ extends Z {
|
|
|
634
711
|
}
|
|
635
712
|
_hasExpandedUnloadedSubtree() {
|
|
636
713
|
for (const e of this._expandedIds)
|
|
637
|
-
if (
|
|
714
|
+
if (G(e, this._treeIndex, this._loadedIds))
|
|
638
715
|
return !0;
|
|
639
716
|
return !1;
|
|
640
717
|
}
|
|
@@ -645,7 +722,7 @@ const $ = class $ extends Z {
|
|
|
645
722
|
if (!e) return !1;
|
|
646
723
|
for (const t of this._expandedIds) {
|
|
647
724
|
const i = this._sourceById.get(t);
|
|
648
|
-
if (i &&
|
|
725
|
+
if (i && we(t, this._treeIndex, this._loadedIds) && E(
|
|
649
726
|
i.label,
|
|
650
727
|
e,
|
|
651
728
|
!1,
|
|
@@ -658,16 +735,16 @@ const $ = class $ extends Z {
|
|
|
658
735
|
return !1;
|
|
659
736
|
}
|
|
660
737
|
_shouldLoadMoreOnScroll() {
|
|
661
|
-
return this._isLazyEnabled() ? this._isSearchActive() ?
|
|
738
|
+
return this._isLazyEnabled() ? this._isSearchActive() ? I(
|
|
662
739
|
this._searchVisibleIds,
|
|
663
740
|
this._loadedIds
|
|
664
741
|
) || this._hasExclusiveSearchFolderWithUnloadedChildren() : this._hasExpandedUnloadedSubtree() ? this._treeIndex.some(
|
|
665
742
|
(e) => !this._loadedIds.has(e.id)
|
|
666
|
-
) :
|
|
743
|
+
) : pe(this._treeIndex, this._loadedIds) : !1;
|
|
667
744
|
}
|
|
668
745
|
_getLazyLoadPriorityRootId(e) {
|
|
669
746
|
if (!(!this._isSearchActive() && !this._hasExpandedUnloadedSubtree()))
|
|
670
|
-
return
|
|
747
|
+
return ve(
|
|
671
748
|
this._flatRows,
|
|
672
749
|
e,
|
|
673
750
|
this._expandedIds,
|
|
@@ -710,9 +787,9 @@ const $ = class $ extends Z {
|
|
|
710
787
|
})}
|
|
711
788
|
style="--treeview-row-level: ${t}"
|
|
712
789
|
tabindex=${this._getRowTabIndex(e.id)}
|
|
713
|
-
@mousedown=${(
|
|
790
|
+
@mousedown=${(l) => l.preventDefault()}
|
|
714
791
|
@focus=${() => this._setActiveRow(e.id)}
|
|
715
|
-
@keydown=${(
|
|
792
|
+
@keydown=${(l) => this._handleRowKeyDown(l, e)}
|
|
716
793
|
@focusout=${this._handleRowFocusOut}
|
|
717
794
|
>
|
|
718
795
|
<div class="node-info">
|
|
@@ -733,7 +810,7 @@ const $ = class $ extends Z {
|
|
|
733
810
|
button-icon
|
|
734
811
|
tabindex="-1"
|
|
735
812
|
hierarchy="ghost"
|
|
736
|
-
aria-label=${
|
|
813
|
+
aria-label=${Se(e.label, t)}
|
|
737
814
|
@click=${() => this._toggleExpand(e, !1)}
|
|
738
815
|
@keydown=${(s) => {
|
|
739
816
|
(s.key === "Enter" || s.key === " ") && (s.preventDefault(), s.stopPropagation(), this._toggleExpand(e, !0));
|
|
@@ -742,7 +819,7 @@ const $ = class $ extends Z {
|
|
|
742
819
|
<nyx-icon
|
|
743
820
|
slot="icon"
|
|
744
821
|
class=${b({ expanded: t })}
|
|
745
|
-
.svg=${
|
|
822
|
+
.svg=${ee}
|
|
746
823
|
></nyx-icon>
|
|
747
824
|
</nyx-button>
|
|
748
825
|
` : h`<span class="expander-placeholder" aria-hidden="true"></span>`;
|
|
@@ -808,11 +885,11 @@ const $ = class $ extends Z {
|
|
|
808
885
|
}
|
|
809
886
|
/** Transitive set of prerequisite column ids for `columnId` (excludes itself). */
|
|
810
887
|
_requiredClosure(e) {
|
|
811
|
-
var a,
|
|
812
|
-
const t = ((a = this.options) == null ? void 0 : a.columns) ?? [], i = new Map(t.map((c) => [c.id, c])), s = [], r = /* @__PURE__ */ new Set([e]), o = [...((
|
|
888
|
+
var a, l, d;
|
|
889
|
+
const t = ((a = this.options) == null ? void 0 : a.columns) ?? [], i = new Map(t.map((c) => [c.id, c])), s = [], r = /* @__PURE__ */ new Set([e]), o = [...((l = i.get(e)) == null ? void 0 : l.requires) ?? []];
|
|
813
890
|
for (; o.length; ) {
|
|
814
891
|
const c = o.pop();
|
|
815
|
-
r.has(c) || (r.add(c), s.push(c), o.push(...((
|
|
892
|
+
r.has(c) || (r.add(c), s.push(c), o.push(...((d = i.get(c)) == null ? void 0 : d.requires) ?? []));
|
|
816
893
|
}
|
|
817
894
|
return s;
|
|
818
895
|
}
|
|
@@ -822,8 +899,8 @@ const $ = class $ extends Z {
|
|
|
822
899
|
const t = ((o = this.options) == null ? void 0 : o.columns) ?? [], i = [], s = /* @__PURE__ */ new Set([e]), r = [e];
|
|
823
900
|
for (; r.length; ) {
|
|
824
901
|
const a = r.pop();
|
|
825
|
-
for (const
|
|
826
|
-
(
|
|
902
|
+
for (const l of t)
|
|
903
|
+
(l.requires ?? []).includes(a) && !s.has(l.id) && (s.add(l.id), i.push(l.id), r.push(l.id));
|
|
827
904
|
}
|
|
828
905
|
return i;
|
|
829
906
|
}
|
|
@@ -836,14 +913,14 @@ const $ = class $ extends Z {
|
|
|
836
913
|
const i = this._selectionNode(e);
|
|
837
914
|
if (this._isColumnDisabled(i, t)) return;
|
|
838
915
|
const r = !this._isNodeSelected(i, t), o = this._requiredClosure(t), a = r ? [t, ...o] : [t, ...this._dependentsClosure(t)];
|
|
839
|
-
this._forEachInSubtree(this._selectionRoots(), e.id, (
|
|
916
|
+
this._forEachInSubtree(this._selectionRoots(), e.id, (l) => {
|
|
840
917
|
r && o.some(
|
|
841
|
-
(c) => this._isColumnDisabled(
|
|
918
|
+
(c) => this._isColumnDisabled(l, c)
|
|
842
919
|
) || a.forEach(
|
|
843
|
-
(
|
|
920
|
+
(d) => this._toggleNodeState(l, d, r)
|
|
844
921
|
);
|
|
845
922
|
}), a.forEach(
|
|
846
|
-
(
|
|
923
|
+
(l) => this._updateParents(this._selectionRoots(), e.id, l)
|
|
847
924
|
), this._triggerChange();
|
|
848
925
|
}
|
|
849
926
|
_toggleNodeState(e, t, i) {
|
|
@@ -910,14 +987,30 @@ const $ = class $ extends Z {
|
|
|
910
987
|
}
|
|
911
988
|
_isRowCheckboxChecked(e) {
|
|
912
989
|
const t = this._selectionNode(e);
|
|
913
|
-
return this._usesSimpleRowSelection() ? this._isSimpleRowAllSelected(t) : this._isRowAllSelected(t);
|
|
990
|
+
return this._usesUniqueRowSelection() ? !!t.selected : this._usesSimpleRowSelection() ? this._isSimpleRowAllSelected(t) : this._isRowAllSelected(t);
|
|
914
991
|
}
|
|
915
992
|
_isRowCheckboxIndeterminate(e) {
|
|
993
|
+
if (this._usesUniqueRowSelection())
|
|
994
|
+
return !1;
|
|
916
995
|
const t = this._selectionNode(e);
|
|
917
996
|
return this._usesSimpleRowSelection() ? this._isSimpleRowIndeterminate(t) : this._isRowIndeterminate(t);
|
|
918
997
|
}
|
|
998
|
+
_setUniqueRowSelected(e) {
|
|
999
|
+
let t = !1;
|
|
1000
|
+
const i = (s) => {
|
|
1001
|
+
s.forEach((r) => {
|
|
1002
|
+
const o = r.id === e;
|
|
1003
|
+
!!r.selected !== o && (r.selected = o, t = !0), r.children && i(r.children);
|
|
1004
|
+
});
|
|
1005
|
+
};
|
|
1006
|
+
return i(this._selectionRoots()), t;
|
|
1007
|
+
}
|
|
919
1008
|
_handleRowCheck(e) {
|
|
920
1009
|
var s;
|
|
1010
|
+
if (this._usesUniqueRowSelection()) {
|
|
1011
|
+
this._setUniqueRowSelected(e.id) && this._triggerChange();
|
|
1012
|
+
return;
|
|
1013
|
+
}
|
|
921
1014
|
const i = !this._isRowCheckboxChecked(e);
|
|
922
1015
|
this._usesSimpleRowSelection() ? (this._setSimpleRowSelected(e.id, i), this._updateSimpleRowParents(this._selectionRoots(), e.id)) : (this._toggleRowRecursively(e.id, i), (s = this.options) != null && s.columns && this.options.columns.forEach((r) => {
|
|
923
1016
|
this._updateParents(this._selectionRoots(), e.id, r.id);
|
|
@@ -954,7 +1047,7 @@ const $ = class $ extends Z {
|
|
|
954
1047
|
}
|
|
955
1048
|
this._searchDebounceTimer = setTimeout(() => {
|
|
956
1049
|
this._searchDebounceTimer = null, this._applySearchTerm(t, i);
|
|
957
|
-
},
|
|
1050
|
+
}, ne);
|
|
958
1051
|
}
|
|
959
1052
|
_applySearchTerm(e, t) {
|
|
960
1053
|
const i = t.trim(), s = e.trim();
|
|
@@ -966,14 +1059,14 @@ const $ = class $ extends Z {
|
|
|
966
1059
|
this._searchVisibleIds = /* @__PURE__ */ new Set(), this._expandedIdsBeforeSearch && (this._expandedIds = new Set(this._expandedIdsBeforeSearch), this._expandedIdsBeforeSearch = null), this._isLazyEnabled() ? this._commitLazyRows() : this._syncActiveRowWithVisibleRows(), this._updateSearchStatusMessage();
|
|
967
1060
|
return;
|
|
968
1061
|
}
|
|
969
|
-
const t = this._ensureSearchIndex(), { visibleIds: i, expandIds: s } =
|
|
1062
|
+
const t = this._ensureSearchIndex(), { visibleIds: i, expandIds: s } = de(
|
|
970
1063
|
t,
|
|
971
1064
|
e,
|
|
972
1065
|
this._searchUserCollapsedIds
|
|
973
1066
|
), r = new Set(s);
|
|
974
1067
|
this._searchManualExpandedIds.forEach((o) => {
|
|
975
1068
|
this._searchUserCollapsedIds.has(o) || r.add(o);
|
|
976
|
-
}), this._searchVisibleIds = i, this._expandedIds = r, this._isLazyEnabled() ? (
|
|
1069
|
+
}), this._searchVisibleIds = i, this._expandedIds = r, this._isLazyEnabled() ? (q(
|
|
977
1070
|
i,
|
|
978
1071
|
this._loadedIds,
|
|
979
1072
|
this._indexById,
|
|
@@ -987,8 +1080,8 @@ const $ = class $ extends Z {
|
|
|
987
1080
|
return;
|
|
988
1081
|
}
|
|
989
1082
|
const t = this._ensureSearchIndex();
|
|
990
|
-
this._searchStatusMessage =
|
|
991
|
-
|
|
1083
|
+
this._searchStatusMessage = Re(
|
|
1084
|
+
le(t, e)
|
|
992
1085
|
);
|
|
993
1086
|
}
|
|
994
1087
|
async _toggleExpand(e, t = !1) {
|
|
@@ -1060,21 +1153,21 @@ const $ = class $ extends Z {
|
|
|
1060
1153
|
}
|
|
1061
1154
|
}
|
|
1062
1155
|
async _handleRowKeyDown(e, t) {
|
|
1063
|
-
var
|
|
1156
|
+
var l;
|
|
1064
1157
|
const i = e.currentTarget;
|
|
1065
1158
|
if (e.target !== i)
|
|
1066
1159
|
return;
|
|
1067
|
-
const s = this._getVisibleTreeRows(), r = s.findIndex((
|
|
1160
|
+
const s = this._getVisibleTreeRows(), r = s.findIndex((d) => d.node.id === t.id), o = this._nodeHasChildren(t), a = this._expandedIds.has(t.id);
|
|
1068
1161
|
if (e.key === "ArrowDown" || e.key === "ArrowUp") {
|
|
1069
|
-
const
|
|
1070
|
-
|
|
1162
|
+
const d = e.key === "ArrowDown" ? r + 1 : r - 1;
|
|
1163
|
+
d >= 0 && d < s.length && (e.preventDefault(), this._focusRowById(s[d].node.id));
|
|
1071
1164
|
return;
|
|
1072
1165
|
}
|
|
1073
1166
|
if (e.key === "Home" || e.key === "End") {
|
|
1074
1167
|
if (s.length === 0) return;
|
|
1075
1168
|
e.preventDefault();
|
|
1076
|
-
const
|
|
1077
|
-
this._focusRowById(
|
|
1169
|
+
const d = e.key === "Home" ? s[0] : s[s.length - 1];
|
|
1170
|
+
this._focusRowById(d.node.id);
|
|
1078
1171
|
return;
|
|
1079
1172
|
}
|
|
1080
1173
|
if (e.key === "ArrowRight") {
|
|
@@ -1091,20 +1184,20 @@ const $ = class $ extends Z {
|
|
|
1091
1184
|
await this._toggleExpand(t, !1), i.focus();
|
|
1092
1185
|
return;
|
|
1093
1186
|
}
|
|
1094
|
-
const
|
|
1095
|
-
|
|
1187
|
+
const d = this._getParentId(t.id);
|
|
1188
|
+
d !== void 0 && this._focusRowById(d);
|
|
1096
1189
|
return;
|
|
1097
1190
|
}
|
|
1098
1191
|
if (e.key === "Enter" || e.key === " ") {
|
|
1099
1192
|
e.preventDefault(), this._enableChildren(i);
|
|
1100
|
-
const
|
|
1101
|
-
"nyx-checkbox input, nyx-button:not([disabled])"
|
|
1193
|
+
const d = i.querySelector(
|
|
1194
|
+
"nyx-checkbox input, nyx-radio input, nyx-button:not([disabled])"
|
|
1102
1195
|
);
|
|
1103
|
-
if (
|
|
1104
|
-
if (
|
|
1105
|
-
|
|
1196
|
+
if (d)
|
|
1197
|
+
if (d instanceof HTMLInputElement)
|
|
1198
|
+
d.focus();
|
|
1106
1199
|
else {
|
|
1107
|
-
const c = (
|
|
1200
|
+
const c = (l = d.shadowRoot) == null ? void 0 : l.querySelector("button");
|
|
1108
1201
|
c == null || c.focus();
|
|
1109
1202
|
}
|
|
1110
1203
|
return;
|
|
@@ -1133,10 +1226,28 @@ const $ = class $ extends Z {
|
|
|
1133
1226
|
});
|
|
1134
1227
|
}
|
|
1135
1228
|
_renderRowSelectionCheckbox(e) {
|
|
1136
|
-
return this._showRowSelection() ? h`
|
|
1229
|
+
return this._showRowSelection() ? this._usesUniqueRowSelection() ? h`
|
|
1230
|
+
<div class="row-checkbox">
|
|
1231
|
+
<nyx-radio
|
|
1232
|
+
?checked=${this._isRowCheckboxChecked(e)}
|
|
1233
|
+
@click=${(t) => {
|
|
1234
|
+
t.stopPropagation(), this._handleRowCheck(e);
|
|
1235
|
+
}}
|
|
1236
|
+
>
|
|
1237
|
+
<input
|
|
1238
|
+
type="radio"
|
|
1239
|
+
slot="input"
|
|
1240
|
+
tabindex="-1"
|
|
1241
|
+
name=${this._rowSelectionRadioName}
|
|
1242
|
+
.checked=${this._isRowCheckboxChecked(e)}
|
|
1243
|
+
aria-label=${B(e.label)}
|
|
1244
|
+
/>
|
|
1245
|
+
</nyx-radio>
|
|
1246
|
+
</div>
|
|
1247
|
+
` : h`
|
|
1137
1248
|
<div class="row-checkbox">
|
|
1138
1249
|
<nyx-checkbox
|
|
1139
|
-
aria-label=${
|
|
1250
|
+
aria-label=${B(e.label)}
|
|
1140
1251
|
?checked=${this._isRowCheckboxChecked(e)}
|
|
1141
1252
|
?indeterminate=${this._isRowCheckboxIndeterminate(e)}
|
|
1142
1253
|
@click=${(t) => {
|
|
@@ -1162,7 +1273,7 @@ const $ = class $ extends Z {
|
|
|
1162
1273
|
(t) => h`
|
|
1163
1274
|
<div class="col-cell">
|
|
1164
1275
|
<nyx-checkbox
|
|
1165
|
-
aria-label=${
|
|
1276
|
+
aria-label=${Ce(
|
|
1166
1277
|
t.title || `Column ${t.id}`,
|
|
1167
1278
|
e.label
|
|
1168
1279
|
)}
|
|
@@ -1210,7 +1321,7 @@ const $ = class $ extends Z {
|
|
|
1210
1321
|
>
|
|
1211
1322
|
<div class="search-container">
|
|
1212
1323
|
<nyx-input>
|
|
1213
|
-
<nyx-icon .svg=${
|
|
1324
|
+
<nyx-icon .svg=${te} slot="iconLeft"></nyx-icon>
|
|
1214
1325
|
<input
|
|
1215
1326
|
class="search-input"
|
|
1216
1327
|
type="text"
|
|
@@ -1275,51 +1386,51 @@ const $ = class $ extends Z {
|
|
|
1275
1386
|
`;
|
|
1276
1387
|
}
|
|
1277
1388
|
_renderFlatRow(e) {
|
|
1278
|
-
const { node: t, level: i, revealSubtree: s, parentLabelMatched: r } = e, o = this._expandedIds.has(t.id), a = e.hasChildrenInSource,
|
|
1389
|
+
const { node: t, level: i, revealSubtree: s, parentLabelMatched: r } = e, o = this._expandedIds.has(t.id), a = e.hasChildrenInSource, l = this._showRowSelection(), d = this._isRowCheckboxChecked(t) || this._isRowCheckboxIndeterminate(t);
|
|
1279
1390
|
return h`
|
|
1280
1391
|
<div class="node-wrapper node-wrapper--flat">
|
|
1281
1392
|
${this._renderTreeRow(t, i, {
|
|
1282
1393
|
isExpanded: o,
|
|
1283
1394
|
hasChildren: a,
|
|
1284
|
-
isRowHighlighted:
|
|
1285
|
-
isSelectable:
|
|
1395
|
+
isRowHighlighted: d,
|
|
1396
|
+
isSelectable: l
|
|
1286
1397
|
})}
|
|
1287
1398
|
</div>
|
|
1288
1399
|
`;
|
|
1289
1400
|
}
|
|
1290
1401
|
_renderNodes(e, t, i = !1, s = !1, r = !1) {
|
|
1291
|
-
const o = !!this._searchTerm.trim(), a = this._searchTerm.trim().toLowerCase(),
|
|
1292
|
-
return
|
|
1293
|
-
|
|
1294
|
-
(
|
|
1295
|
-
(
|
|
1296
|
-
const c = this._expandedIds.has(
|
|
1297
|
-
|
|
1402
|
+
const o = !!this._searchTerm.trim(), a = this._searchTerm.trim().toLowerCase(), l = o && !r ? e.filter((d) => this._searchVisibleIds.has(d.id)) : e;
|
|
1403
|
+
return X(
|
|
1404
|
+
l,
|
|
1405
|
+
(d) => d.id,
|
|
1406
|
+
(d) => {
|
|
1407
|
+
const c = this._expandedIds.has(d.id), m = this._isLazyEnabled() ? this._sourceHasChildren(d.id) : !!(d.children && d.children.length > 0), p = this._isRowCheckboxChecked(d) || this._isRowCheckboxIndeterminate(d), x = this._showRowSelection(), C = j(
|
|
1408
|
+
d.label,
|
|
1298
1409
|
a,
|
|
1299
1410
|
i,
|
|
1300
1411
|
s
|
|
1301
|
-
), N = !o ||
|
|
1302
|
-
|
|
1412
|
+
), N = !o || C && E(
|
|
1413
|
+
d.label,
|
|
1303
1414
|
a,
|
|
1304
1415
|
s,
|
|
1305
|
-
|
|
1416
|
+
d.id,
|
|
1306
1417
|
this._searchVisibleIds,
|
|
1307
|
-
(
|
|
1308
|
-
) ?
|
|
1418
|
+
(R) => this._getSourceChildren(R)
|
|
1419
|
+
) ? d.children : H(d, this._searchVisibleIds, a), y = s || o && !!a && d.label.toLowerCase().includes(a);
|
|
1309
1420
|
return h`
|
|
1310
1421
|
<div class="node-wrapper">
|
|
1311
|
-
${this._renderTreeRow(
|
|
1422
|
+
${this._renderTreeRow(d, t, {
|
|
1312
1423
|
isExpanded: c,
|
|
1313
1424
|
hasChildren: m,
|
|
1314
1425
|
isRowHighlighted: p,
|
|
1315
|
-
isSelectable:
|
|
1426
|
+
isSelectable: x
|
|
1316
1427
|
})}
|
|
1317
1428
|
${c && m ? h`<div class="node-children" role="group">
|
|
1318
1429
|
${this._renderNodes(
|
|
1319
1430
|
N,
|
|
1320
1431
|
t + 1,
|
|
1321
|
-
|
|
1322
|
-
|
|
1432
|
+
C,
|
|
1433
|
+
y,
|
|
1323
1434
|
!0
|
|
1324
1435
|
)}
|
|
1325
1436
|
</div>` : ""}
|
|
@@ -1328,46 +1439,45 @@ const $ = class $ extends Z {
|
|
|
1328
1439
|
}
|
|
1329
1440
|
);
|
|
1330
1441
|
}
|
|
1331
|
-
};
|
|
1332
|
-
|
|
1333
|
-
|
|
1334
|
-
_([
|
|
1335
|
-
K({ type: Object, noAccessor: !0 })
|
|
1442
|
+
}, v._nextTreeviewId = 0, v.styles = J(re), v);
|
|
1443
|
+
f([
|
|
1444
|
+
Q({ type: Object, noAccessor: !0 })
|
|
1336
1445
|
], u.prototype, "options", 1);
|
|
1337
|
-
|
|
1338
|
-
|
|
1446
|
+
f([
|
|
1447
|
+
_()
|
|
1339
1448
|
], u.prototype, "_items", 2);
|
|
1340
|
-
|
|
1341
|
-
|
|
1449
|
+
f([
|
|
1450
|
+
_()
|
|
1342
1451
|
], u.prototype, "_expandedIds", 2);
|
|
1343
|
-
|
|
1344
|
-
|
|
1452
|
+
f([
|
|
1453
|
+
_()
|
|
1345
1454
|
], u.prototype, "_searchTerm", 2);
|
|
1346
|
-
|
|
1347
|
-
|
|
1455
|
+
f([
|
|
1456
|
+
_()
|
|
1348
1457
|
], u.prototype, "_searchStatusMessage", 2);
|
|
1349
|
-
|
|
1350
|
-
|
|
1458
|
+
f([
|
|
1459
|
+
_()
|
|
1351
1460
|
], u.prototype, "_searchVisibleIds", 2);
|
|
1352
|
-
|
|
1353
|
-
|
|
1461
|
+
f([
|
|
1462
|
+
_()
|
|
1354
1463
|
], u.prototype, "_searchUserCollapsedIds", 2);
|
|
1355
|
-
|
|
1356
|
-
|
|
1464
|
+
f([
|
|
1465
|
+
_()
|
|
1357
1466
|
], u.prototype, "_searchManualExpandedIds", 2);
|
|
1358
|
-
|
|
1359
|
-
|
|
1467
|
+
f([
|
|
1468
|
+
_()
|
|
1360
1469
|
], u.prototype, "_flatRows", 2);
|
|
1361
|
-
|
|
1362
|
-
|
|
1470
|
+
f([
|
|
1471
|
+
_()
|
|
1363
1472
|
], u.prototype, "_loadedIds", 2);
|
|
1364
|
-
|
|
1365
|
-
|
|
1473
|
+
f([
|
|
1474
|
+
_()
|
|
1366
1475
|
], u.prototype, "_activeRowId", 2);
|
|
1367
|
-
|
|
1368
|
-
|
|
1476
|
+
f([
|
|
1477
|
+
se("nyx-change")
|
|
1369
1478
|
], u.prototype, "onChange", 2);
|
|
1370
|
-
|
|
1479
|
+
let ke = u;
|
|
1480
|
+
customElements.get("nyx-treeview") || customElements.define("nyx-treeview", ke);
|
|
1371
1481
|
export {
|
|
1372
|
-
|
|
1482
|
+
ke as NyxTreeview
|
|
1373
1483
|
};
|