@box/combobox-with-api 1.30.0 → 1.30.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,74 +1,74 @@
|
|
|
1
1
|
import { LoadingIndicator as $ } from "@box/blueprint-web";
|
|
2
2
|
import { InlineError as P, Tree as ee } from "@box/tree";
|
|
3
|
-
import { forwardRef as te, useReducer as ae, useState as D, useMemo as z, useCallback as
|
|
4
|
-
import { RootTreeNode as
|
|
5
|
-
import { t as
|
|
6
|
-
import { jsx as f, jsxs as
|
|
7
|
-
import '../styles/dynamic-loading-tree.css';const
|
|
8
|
-
container:
|
|
9
|
-
disabled:
|
|
3
|
+
import { forwardRef as te, useReducer as ae, useState as D, useMemo as z, useCallback as m, useEffect as F } from "react";
|
|
4
|
+
import { RootTreeNode as p, hasValidLevel as le, getServiceNode as L } from "../esm/lib/components/combobox-with-api-tree-view/tree-utils.js";
|
|
5
|
+
import { t as se, i as oe, A as r } from "./treeReducer.js";
|
|
6
|
+
import { jsx as f, jsxs as ne } from "react/jsx-runtime";
|
|
7
|
+
import '../styles/dynamic-loading-tree.css';const re = "_container_rhp7y_2", de = "_disabled_rhp7y_13", ie = "_label_rhp7y_16", ce = "_hiddenLabel_rhp7y_28", pe = "_comboboxContainer_rhp7y_31", me = "_withComboboxButtons_rhp7y_47", ue = "_textInputWrapper_rhp7y_69", ye = "_textInput_rhp7y_69", he = "_comboboxButtons_rhp7y_94", be = "_withChips_rhp7y_101", _e = "_popover_rhp7y_115", ve = "_loadingIndicator_rhp7y_179", fe = "_noResultOption_rhp7y_182", V = {
|
|
8
|
+
container: re,
|
|
9
|
+
disabled: de,
|
|
10
10
|
label: ie,
|
|
11
11
|
hiddenLabel: ce,
|
|
12
|
-
comboboxContainer:
|
|
13
|
-
withComboboxButtons:
|
|
14
|
-
textInputWrapper:
|
|
15
|
-
textInput:
|
|
16
|
-
comboboxButtons:
|
|
17
|
-
withChips:
|
|
18
|
-
popover:
|
|
12
|
+
comboboxContainer: pe,
|
|
13
|
+
withComboboxButtons: me,
|
|
14
|
+
textInputWrapper: ue,
|
|
15
|
+
textInput: ye,
|
|
16
|
+
comboboxButtons: he,
|
|
17
|
+
withChips: be,
|
|
18
|
+
popover: _e,
|
|
19
19
|
loadingIndicator: ve,
|
|
20
20
|
noResultOption: fe
|
|
21
|
-
},
|
|
22
|
-
const i = [...
|
|
21
|
+
}, ge = (n) => {
|
|
22
|
+
const i = [...n.children], {
|
|
23
23
|
metadata: c
|
|
24
|
-
} =
|
|
24
|
+
} = n;
|
|
25
25
|
return {
|
|
26
|
-
...
|
|
26
|
+
...n,
|
|
27
27
|
children: i,
|
|
28
28
|
metadata: {
|
|
29
|
-
...
|
|
29
|
+
...n.metadata,
|
|
30
30
|
variant: c.variant,
|
|
31
|
-
isLoading:
|
|
31
|
+
isLoading: n.status === "loading" && !n.children.length,
|
|
32
32
|
labelName: c.labelName || "",
|
|
33
33
|
labelValue: c.labelValue || ""
|
|
34
34
|
}
|
|
35
35
|
};
|
|
36
|
-
},
|
|
36
|
+
}, Se = (n, i) => {
|
|
37
37
|
let c;
|
|
38
|
-
return
|
|
39
|
-
},
|
|
40
|
-
ariaLabel:
|
|
38
|
+
return n.children.length && n.status === "loading" && (c = L(i.id, i.metadata.displayValue, "loading")), n.status === "error" && (c = L(i.id, i.metadata.displayValue, "reload")), n.status === "success" && n.marker && (c = L(i.id, i.metadata.displayValue, "loadMore")), c;
|
|
39
|
+
}, xe = /* @__PURE__ */ te(({
|
|
40
|
+
ariaLabel: n,
|
|
41
41
|
onSelect: i,
|
|
42
42
|
selectedNodes: c,
|
|
43
|
-
defaultFetcher:
|
|
44
|
-
levels:
|
|
45
|
-
selectableLevels:
|
|
46
|
-
multiselect:
|
|
43
|
+
defaultFetcher: y,
|
|
44
|
+
levels: O,
|
|
45
|
+
selectableLevels: g,
|
|
46
|
+
multiselect: E,
|
|
47
47
|
open: k,
|
|
48
|
-
searchInput:
|
|
48
|
+
searchInput: u,
|
|
49
49
|
noResultMessage: q,
|
|
50
50
|
loadingAriaLabel: G
|
|
51
51
|
}, H) => {
|
|
52
|
-
const [
|
|
52
|
+
const [_, s] = ae(se, oe), [h, J] = D({
|
|
53
53
|
nodes: [],
|
|
54
54
|
selectedIds: []
|
|
55
|
-
}), [
|
|
55
|
+
}), [T, b] = D(!1), [S, I] = D(!1), N = z(() => Math.max(...g), [g]), w = m((e = _) => {
|
|
56
56
|
const a = [];
|
|
57
57
|
return [...Object.values(e).map((t) => {
|
|
58
|
-
const l =
|
|
59
|
-
return
|
|
58
|
+
const l = ge(t), d = Se(t, l);
|
|
59
|
+
return d && (a.push(d), l.children.push(d.id)), l;
|
|
60
60
|
}), ...a];
|
|
61
|
-
}, [
|
|
62
|
-
const a = e.ancestors?.find((l) => l.level === e.level - 1),
|
|
63
|
-
return e.level === 1 ||
|
|
64
|
-
labelName:
|
|
61
|
+
}, [_]), B = m((e) => {
|
|
62
|
+
const a = e.ancestors?.find((l) => l.level === e.level - 1), o = O.find((l) => l.level === e.level);
|
|
63
|
+
return e.level === 1 || u === "" ? e.displayValue : {
|
|
64
|
+
labelName: o.displayName,
|
|
65
65
|
labelValue: a.displayName
|
|
66
66
|
};
|
|
67
|
-
}, [
|
|
67
|
+
}, [O, u]), v = m((e) => ({
|
|
68
68
|
id: e.value,
|
|
69
69
|
name: e.displayValue,
|
|
70
|
-
parent:
|
|
71
|
-
isBranch: e.level !==
|
|
70
|
+
parent: p.id,
|
|
71
|
+
isBranch: e.level !== N,
|
|
72
72
|
children: [],
|
|
73
73
|
metadata: {
|
|
74
74
|
variant: "content",
|
|
@@ -78,68 +78,68 @@ import '../styles/dynamic-loading-tree.css';const de = "_container_15bxn_2", re
|
|
|
78
78
|
marker: e.marker,
|
|
79
79
|
ancestors: e.ancestors
|
|
80
80
|
}
|
|
81
|
-
}), [
|
|
82
|
-
|
|
83
|
-
type:
|
|
81
|
+
}), [N]), x = m((e, a) => {
|
|
82
|
+
s({
|
|
83
|
+
type: r.RESET,
|
|
84
84
|
payload: {
|
|
85
|
-
id:
|
|
85
|
+
id: p.id,
|
|
86
86
|
items: []
|
|
87
87
|
}
|
|
88
|
-
}),
|
|
89
|
-
type:
|
|
88
|
+
}), s({
|
|
89
|
+
type: r.LOAD_SUCCESS,
|
|
90
90
|
payload: {
|
|
91
|
-
id:
|
|
91
|
+
id: p.id,
|
|
92
92
|
items: e,
|
|
93
93
|
marker: a
|
|
94
94
|
}
|
|
95
|
-
}),
|
|
96
|
-
}, [
|
|
97
|
-
|
|
98
|
-
type:
|
|
95
|
+
}), b(!1);
|
|
96
|
+
}, [s, b]), C = m(() => {
|
|
97
|
+
s({
|
|
98
|
+
type: r.LOAD_ERROR,
|
|
99
99
|
payload: {
|
|
100
|
-
id:
|
|
100
|
+
id: p.id
|
|
101
101
|
}
|
|
102
|
-
}),
|
|
103
|
-
}, [
|
|
104
|
-
const
|
|
105
|
-
return a.filter((t) => t != null &&
|
|
102
|
+
}), b(!1), I(!0);
|
|
103
|
+
}, [s, b, I]), j = m((e, a) => {
|
|
104
|
+
const o = new Set(e.map((t) => t.id));
|
|
105
|
+
return a.filter((t) => t != null && o.has(t));
|
|
106
106
|
}, []);
|
|
107
107
|
F(() => {
|
|
108
|
-
const e = w(
|
|
108
|
+
const e = w(_);
|
|
109
109
|
J({
|
|
110
110
|
nodes: e,
|
|
111
111
|
selectedIds: j(e, c)
|
|
112
112
|
});
|
|
113
|
-
}, [j, w, c,
|
|
113
|
+
}, [j, w, c, _, S]), F(() => {
|
|
114
114
|
if (!k)
|
|
115
115
|
return;
|
|
116
116
|
const {
|
|
117
117
|
signal: e
|
|
118
118
|
} = new AbortController();
|
|
119
|
-
|
|
120
|
-
type:
|
|
119
|
+
b(!0), I(!1), u ? (s({
|
|
120
|
+
type: r.RESET,
|
|
121
121
|
payload: {
|
|
122
|
-
id:
|
|
122
|
+
id: p.id,
|
|
123
123
|
items: []
|
|
124
124
|
}
|
|
125
|
-
}),
|
|
125
|
+
}), y({
|
|
126
126
|
signal: e,
|
|
127
127
|
marker: null,
|
|
128
|
-
searchInput:
|
|
128
|
+
searchInput: u,
|
|
129
129
|
level: null,
|
|
130
130
|
onlySelectableOptions: !1,
|
|
131
131
|
ancestorId: null
|
|
132
132
|
}).then((a) => {
|
|
133
|
-
const
|
|
133
|
+
const o = a.options.filter((t) => t.selectable).map((t) => {
|
|
134
134
|
const {
|
|
135
135
|
labelName: l,
|
|
136
|
-
labelValue:
|
|
136
|
+
labelValue: d
|
|
137
137
|
} = B(t);
|
|
138
138
|
return {
|
|
139
139
|
id: t.value,
|
|
140
140
|
name: t.displayValue,
|
|
141
|
-
parent:
|
|
142
|
-
isBranch: t.level <
|
|
141
|
+
parent: p.id,
|
|
142
|
+
isBranch: t.level < N,
|
|
143
143
|
children: [],
|
|
144
144
|
metadata: {
|
|
145
145
|
variant: t.level === 1 ? "content" : "labeled",
|
|
@@ -148,25 +148,25 @@ import '../styles/dynamic-loading-tree.css';const de = "_container_15bxn_2", re
|
|
|
148
148
|
selectable: t.selectable,
|
|
149
149
|
ancestors: t.ancestors,
|
|
150
150
|
labelName: l,
|
|
151
|
-
labelValue:
|
|
151
|
+
labelValue: d
|
|
152
152
|
}
|
|
153
153
|
};
|
|
154
154
|
});
|
|
155
|
-
|
|
155
|
+
x(o, a.marker);
|
|
156
156
|
}).catch(() => {
|
|
157
157
|
C();
|
|
158
|
-
})) : (
|
|
159
|
-
type:
|
|
158
|
+
})) : (s({
|
|
159
|
+
type: r.RESET,
|
|
160
160
|
payload: {
|
|
161
|
-
id:
|
|
161
|
+
id: p.id,
|
|
162
162
|
items: []
|
|
163
163
|
}
|
|
164
|
-
}),
|
|
165
|
-
type:
|
|
164
|
+
}), s({
|
|
165
|
+
type: r.LOAD_DATA,
|
|
166
166
|
payload: {
|
|
167
|
-
id:
|
|
167
|
+
id: p.id
|
|
168
168
|
}
|
|
169
|
-
}),
|
|
169
|
+
}), y({
|
|
170
170
|
signal: e,
|
|
171
171
|
marker: null,
|
|
172
172
|
searchInput: "",
|
|
@@ -174,21 +174,21 @@ import '../styles/dynamic-loading-tree.css';const de = "_container_15bxn_2", re
|
|
|
174
174
|
onlySelectableOptions: !1,
|
|
175
175
|
ancestorId: null
|
|
176
176
|
}).then((a) => {
|
|
177
|
-
const
|
|
178
|
-
|
|
177
|
+
const o = a.options.map(v);
|
|
178
|
+
x(o, a.marker);
|
|
179
179
|
}).catch(() => {
|
|
180
180
|
C();
|
|
181
181
|
}));
|
|
182
|
-
}, [
|
|
183
|
-
const K =
|
|
182
|
+
}, [y, v, k, u, O, N, B, x, C]);
|
|
183
|
+
const K = m((e) => {
|
|
184
184
|
const {
|
|
185
185
|
isExpanded: a,
|
|
186
|
-
isDisabled:
|
|
186
|
+
isDisabled: o,
|
|
187
187
|
element: t
|
|
188
188
|
} = e;
|
|
189
|
-
if (!a ||
|
|
190
|
-
|
|
191
|
-
type:
|
|
189
|
+
if (!a || o) {
|
|
190
|
+
s({
|
|
191
|
+
type: r.RESET,
|
|
192
192
|
payload: {
|
|
193
193
|
id: t.id,
|
|
194
194
|
items: []
|
|
@@ -199,129 +199,129 @@ import '../styles/dynamic-loading-tree.css';const de = "_container_15bxn_2", re
|
|
|
199
199
|
const {
|
|
200
200
|
level: l
|
|
201
201
|
} = t.metadata, {
|
|
202
|
-
id:
|
|
203
|
-
marker:
|
|
202
|
+
id: d,
|
|
203
|
+
marker: R
|
|
204
204
|
} = t, {
|
|
205
205
|
signal: A
|
|
206
206
|
} = new AbortController();
|
|
207
|
-
|
|
208
|
-
type:
|
|
207
|
+
s({
|
|
208
|
+
type: r.LOAD_DATA,
|
|
209
209
|
payload: {
|
|
210
|
-
id:
|
|
210
|
+
id: d
|
|
211
211
|
}
|
|
212
|
-
}),
|
|
212
|
+
}), y({
|
|
213
213
|
signal: A,
|
|
214
|
-
marker:
|
|
214
|
+
marker: R,
|
|
215
215
|
searchInput: "",
|
|
216
216
|
level: l + 1,
|
|
217
|
-
ancestorId:
|
|
217
|
+
ancestorId: d,
|
|
218
218
|
onlySelectableOptions: !1
|
|
219
219
|
}).then((U) => {
|
|
220
220
|
const Z = U.options.map((W) => (t.children.push(W.value), v(W)));
|
|
221
|
-
|
|
222
|
-
type:
|
|
221
|
+
s({
|
|
222
|
+
type: r.LOAD_SUCCESS,
|
|
223
223
|
payload: {
|
|
224
|
-
id:
|
|
224
|
+
id: d,
|
|
225
225
|
items: Z,
|
|
226
226
|
marker: U.marker
|
|
227
227
|
}
|
|
228
228
|
});
|
|
229
229
|
}).catch(() => {
|
|
230
|
-
|
|
231
|
-
type:
|
|
230
|
+
s({
|
|
231
|
+
type: r.LOAD_ERROR,
|
|
232
232
|
payload: {
|
|
233
|
-
id:
|
|
233
|
+
id: d
|
|
234
234
|
}
|
|
235
235
|
});
|
|
236
236
|
});
|
|
237
|
-
}, [
|
|
238
|
-
|
|
239
|
-
const a =
|
|
240
|
-
level:
|
|
237
|
+
}, [y, v]), M = m((e) => {
|
|
238
|
+
S && (I(!1), b(!0));
|
|
239
|
+
const a = _[e], {
|
|
240
|
+
level: o
|
|
241
241
|
} = a.metadata, {
|
|
242
242
|
id: t,
|
|
243
243
|
marker: l
|
|
244
244
|
} = a, {
|
|
245
|
-
signal:
|
|
245
|
+
signal: d
|
|
246
246
|
} = new AbortController();
|
|
247
|
-
|
|
248
|
-
type:
|
|
247
|
+
s({
|
|
248
|
+
type: r.LOAD_DATA,
|
|
249
249
|
payload: {
|
|
250
250
|
id: t
|
|
251
251
|
}
|
|
252
|
-
}),
|
|
253
|
-
signal:
|
|
252
|
+
}), y({
|
|
253
|
+
signal: d,
|
|
254
254
|
marker: l,
|
|
255
|
-
searchInput:
|
|
256
|
-
level:
|
|
257
|
-
ancestorId: t !==
|
|
255
|
+
searchInput: u,
|
|
256
|
+
level: u === "" ? o + 1 : null,
|
|
257
|
+
ancestorId: t !== p.id ? t.toString() : null,
|
|
258
258
|
onlySelectableOptions: !1
|
|
259
|
-
}).then((
|
|
260
|
-
const A =
|
|
261
|
-
|
|
262
|
-
type:
|
|
259
|
+
}).then((R) => {
|
|
260
|
+
const A = R.options.map(v);
|
|
261
|
+
s({
|
|
262
|
+
type: r.LOAD_SUCCESS,
|
|
263
263
|
payload: {
|
|
264
264
|
id: t,
|
|
265
265
|
items: A,
|
|
266
|
-
marker:
|
|
266
|
+
marker: R.marker
|
|
267
267
|
}
|
|
268
|
-
}),
|
|
268
|
+
}), b(!1);
|
|
269
269
|
}).catch(() => {
|
|
270
|
-
|
|
271
|
-
type:
|
|
270
|
+
s({
|
|
271
|
+
type: r.LOAD_ERROR,
|
|
272
272
|
payload: {
|
|
273
273
|
id: t,
|
|
274
274
|
marker: l
|
|
275
275
|
}
|
|
276
276
|
});
|
|
277
277
|
});
|
|
278
|
-
}, [
|
|
278
|
+
}, [y, S, v, u, _]), {
|
|
279
279
|
isTreeEmpty: Q,
|
|
280
280
|
focusedId: X
|
|
281
281
|
} = z(() => {
|
|
282
|
-
const a =
|
|
282
|
+
const a = h.nodes.find(({
|
|
283
283
|
id: l
|
|
284
|
-
}) => l ===
|
|
284
|
+
}) => l === p.id)?.children ?? [], o = a[0], t = !E && h.selectedIds.length === 0 && o != null;
|
|
285
285
|
return {
|
|
286
|
-
isTreeEmpty:
|
|
287
|
-
focusedId: t ?
|
|
286
|
+
isTreeEmpty: h.nodes.length === 0 || a.length === 0,
|
|
287
|
+
focusedId: t ? o : void 0
|
|
288
288
|
};
|
|
289
|
-
}, [
|
|
289
|
+
}, [E, h.nodes, h.selectedIds.length]), Y = m((e) => {
|
|
290
290
|
const {
|
|
291
291
|
metadata: a
|
|
292
292
|
} = e.element;
|
|
293
|
-
le(a) &&
|
|
294
|
-
}, [
|
|
295
|
-
return
|
|
293
|
+
le(a) && g.includes(a.level) ? i(e) : (e.isSelected = !1, e.treeState.selectedIds.delete(e.element.id));
|
|
294
|
+
}, [g, i]);
|
|
295
|
+
return S ? /* @__PURE__ */ f(P, {
|
|
296
296
|
onReload: () => {
|
|
297
297
|
M("root");
|
|
298
298
|
}
|
|
299
|
-
}) : /* @__PURE__ */
|
|
300
|
-
children: [
|
|
299
|
+
}) : /* @__PURE__ */ ne("div", {
|
|
300
|
+
children: [T && /* @__PURE__ */ f("div", {
|
|
301
301
|
className: V.noResultOption,
|
|
302
302
|
children: /* @__PURE__ */ f($, {
|
|
303
303
|
"aria-label": G,
|
|
304
304
|
className: V.loadingIndicator
|
|
305
305
|
})
|
|
306
|
-
}), Q && !
|
|
306
|
+
}), Q && !T ? /* @__PURE__ */ f("div", {
|
|
307
307
|
className: V.noResultOption,
|
|
308
308
|
children: q
|
|
309
|
-
}) : !
|
|
309
|
+
}) : !T && /* @__PURE__ */ f(ee, {
|
|
310
310
|
ref: H,
|
|
311
|
-
"aria-label":
|
|
312
|
-
data:
|
|
311
|
+
"aria-label": n,
|
|
312
|
+
data: h.nodes,
|
|
313
313
|
focusedId: X,
|
|
314
|
-
multiSelect:
|
|
314
|
+
multiSelect: E,
|
|
315
315
|
onExpand: K,
|
|
316
316
|
onLoadData: M,
|
|
317
317
|
onNodeSelect: Y,
|
|
318
|
-
selectedIds:
|
|
318
|
+
selectedIds: h.selectedIds,
|
|
319
319
|
size: "large",
|
|
320
320
|
togglableSelect: !0
|
|
321
321
|
})]
|
|
322
322
|
});
|
|
323
323
|
});
|
|
324
324
|
export {
|
|
325
|
-
|
|
325
|
+
xe as D,
|
|
326
326
|
V as s
|
|
327
327
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._container_rhp7y_2{font-weight:var(--body-default-font-weight);font-size:var(--body-default-font-size);font-family:var(--body-default-font-family);line-height:var(--body-default-line-height);letter-spacing:var(--body-default-letter-spacing);text-transform:var(--body-default-text-case);text-decoration:var(--body-default-text-decoration);display:flex;flex-direction:column}._container_rhp7y_2._disabled_rhp7y_13{opacity:.6}._container_rhp7y_2 ._label_rhp7y_16{font-weight:var(--body-default-bold-font-weight);font-size:var(--body-default-bold-font-size);font-family:var(--body-default-bold-font-family);line-height:var(--body-default-bold-line-height);letter-spacing:var(--body-default-bold-letter-spacing);text-transform:var(--body-default-bold-text-case);text-decoration:var(--body-default-bold-text-decoration);flex:0 0 fit-content;color:var(--text-text-on-light);overflow-wrap:break-word}._container_rhp7y_2 ._label_rhp7y_16:not(._hiddenLabel_rhp7y_28){margin-block-end:var(--space-2)}._container_rhp7y_2 ._comboboxContainer_rhp7y_31{position:relative;display:flex;flex-wrap:wrap;gap:var(--space-2);overflow-y:auto;background-color:var(--surface-dropdown-surface);border-top:var(--blueprint-combobox-border-top-width, var(--border-1)) solid var(--blueprint-combobox-border-color, var(--border-input-border));border-right:var(--blueprint-combobox-border-right-width, var(--border-1)) solid var(--blueprint-combobox-border-color, var(--border-input-border));border-bottom:var(--blueprint-combobox-border-bottom-width, var(--border-1)) solid var(--blueprint-combobox-border-color, var(--border-input-border));border-left:var(--blueprint-combobox-border-left-width, var(--border-1)) solid var(--blueprint-combobox-border-color, var(--border-input-border));border-radius:var(--blueprint-combobox-input-radius, var(--radius-2));box-shadow:var(--innershadow-1);padding-block:calc((40px - var(--space-5)) / 2 - var(--border-1));padding-inline:var(--space-3)}._container_rhp7y_2 ._comboboxContainer_rhp7y_31._withComboboxButtons_rhp7y_47{padding-inline-end:var(--space-10)}._container_rhp7y_2 ._comboboxContainer_rhp7y_31:not(:disabled):has(input:focus){background-color:var(--surface-dropdown-surface-focus);border:var(--border-2) solid var(--outline-focus-on-light);padding-block:calc((40px - var(--space-5)) / 2 - var(--border-2))}._container_rhp7y_2 ._comboboxContainer_rhp7y_31:not(:disabled)._error_rhp7y_58,._container_rhp7y_2 ._comboboxContainer_rhp7y_31:not(:disabled):has([aria-invalid=true]){background-color:var(--surface-dropdown-surface-error);border-top:var(--blueprint-combobox-border-error-top-width, var(--border-2)) solid var(--border-input-border-error);border-right:var(--blueprint-combobox-border-error-right-width, var(--border-2)) solid var(--border-input-border-error);border-bottom:var(--blueprint-combobox-border-error-bottom-width, var(--border-2)) solid var(--border-input-border-error);border-left:var(--blueprint-combobox-border-error-left-width, var(--border-2)) solid var(--border-input-border-error);padding-block:calc((40px - var(--space-5)) / 2 - var(--border-2))}._container_rhp7y_2 ._comboboxContainer_rhp7y_31 ._textInputWrapper_rhp7y_69{display:flex;flex:content;gap:var(--space-2);align-items:center}._container_rhp7y_2 ._comboboxContainer_rhp7y_31 ._textInputWrapper_rhp7y_69 ._textInput_rhp7y_69{font-weight:var(--body-default-font-weight);font-size:var(--body-default-font-size);font-family:var(--body-default-font-family);line-height:var(--body-default-line-height);letter-spacing:var(--body-default-letter-spacing);text-transform:var(--body-default-text-case);text-decoration:var(--body-default-text-decoration);width:100%;height:var(--space-5);padding:0;color:var(--text-text-on-light);background-color:transparent;border:none;outline:none}._container_rhp7y_2 ._comboboxContainer_rhp7y_31 ._textInputWrapper_rhp7y_69 ._errorIcon_rhp7y_91 path{fill:var(--icon-icon-error-on-light)}._container_rhp7y_2 ._comboboxContainer_rhp7y_31 ._textInputWrapper_rhp7y_69 ._comboboxButtons_rhp7y_94{position:absolute;top:var(--space-2);right:var(--space-2);display:flex;align-items:center}._container_rhp7y_2 ._comboboxContainer_rhp7y_31._withChips_rhp7y_101{max-height:calc(2 * var(--space-2) + 3 * var(--space-6));padding-block:calc((40px - var(--space-7)) / 2 - var(--border-1))}._container_rhp7y_2 ._comboboxContainer_rhp7y_31._withChips_rhp7y_101:not(:disabled)._error_rhp7y_58{padding-block:calc((40px - var(--space-7)) / 2 - var(--border-2))}._container_rhp7y_2 ._comboboxContainer_rhp7y_31._withChips_rhp7y_101:not(:disabled):has(input:focus){padding-block:calc((40px - var(--space-7)) / 2 - var(--border-2))}._container_rhp7y_2 ._inlineError_rhp7y_111{margin-block-start:var(--space-2)}._popover_rhp7y_115{font-weight:var(--body-default-font-weight);font-size:var(--body-default-font-size);font-family:var(--body-default-font-family);line-height:var(--body-default-line-height);letter-spacing:var(--body-default-letter-spacing);text-transform:var(--body-default-text-case);text-decoration:var(--body-default-text-decoration);z-index:380;max-height:300px;overflow:auto;background-color:var(--surface-menu-surface);border:var(--border-1) solid var(--border-card-border);border-radius:var(--radius-3);padding-block:var(--space-3);padding-inline:var(--space-3);box-shadow:var(--dropshadow-3)}._popover_rhp7y_115 ul{padding-inline-start:0}._popover_rhp7y_115 ._option_rhp7y_141{position:relative;box-sizing:border-box;width:100%;overflow-wrap:break-word;border:var(--border-2) solid transparent;border-radius:var(--radius-3);outline:none;cursor:pointer;-webkit-user-select:none;user-select:none;padding-block:var(--space-2);padding-inline:var(--space-2)}._popover_rhp7y_115 ._option_rhp7y_141[aria-disabled]{opacity:.6}._popover_rhp7y_115 ._option_rhp7y_141[data-active-item]:not([aria-disabled]){background-color:var(--surface-menu-surface-focus);border:var(--border-2) solid var(--outline-focus-on-light)}._popover_rhp7y_115 ._option_rhp7y_141:hover{background-color:var(--surface-menu-surface-hover)}._popover_rhp7y_115 ._option_rhp7y_141 ._indicator_rhp7y_164{position:absolute;top:0;left:var(--space-2);display:flex;align-items:center;justify-content:center;height:var(--size-9)}._popover_rhp7y_115 ._option_rhp7y_141 ._indicator_rhp7y_164 ._indicatorIcon_rhp7y_173 path{fill:var(--icon-icon-on-light)}._popover_rhp7y_115 ._optionWithIndicator_rhp7y_176{padding-inline:var(--space-10) var(--space-2)}._popover_rhp7y_115 ._loadingIndicator_rhp7y_179{position:unset}._popover_rhp7y_115 ._noResultOption_rhp7y_182{color:var(--text-text-on-light);text-align:center;-webkit-user-select:none;user-select:none}
|
package/package.json
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@box/combobox-with-api",
|
|
3
|
-
"version": "1.30.
|
|
3
|
+
"version": "1.30.1",
|
|
4
4
|
"peerDependencies": {
|
|
5
5
|
"@ariakit/react": "0.4.15",
|
|
6
|
-
"@box/blueprint-web": "^12.
|
|
7
|
-
"@box/blueprint-web-assets": "^4.99.
|
|
6
|
+
"@box/blueprint-web": "^12.134.0",
|
|
7
|
+
"@box/blueprint-web-assets": "^4.99.9",
|
|
8
8
|
"lodash": "^4.17.15",
|
|
9
9
|
"react": "^17.0.0 || ^18.0.0",
|
|
10
10
|
"react-dom": "^17.0.0 || ^18.0.0",
|
|
11
11
|
"react-intl": "^6.4.2"
|
|
12
12
|
},
|
|
13
13
|
"dependencies": {
|
|
14
|
-
"@box/tree": "^1.27.
|
|
14
|
+
"@box/tree": "^1.27.2",
|
|
15
15
|
"react-accessible-treeview": "2.9.0"
|
|
16
16
|
},
|
|
17
17
|
"devDependencies": {
|
|
18
|
-
"@box/blueprint-web": "^12.
|
|
19
|
-
"@box/blueprint-web-assets": "^4.99.
|
|
20
|
-
"@box/storybook-utils": "^0.16.
|
|
18
|
+
"@box/blueprint-web": "^12.134.0",
|
|
19
|
+
"@box/blueprint-web-assets": "^4.99.9",
|
|
20
|
+
"@box/storybook-utils": "^0.16.35",
|
|
21
21
|
"react": "^18.3.0",
|
|
22
22
|
"react-dom": "^18.3.0"
|
|
23
23
|
},
|