@tedi-design-system/react 18.1.0-rc.22 → 18.1.0-rc.23
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/bundle-stats.html +1 -1
- package/index.css +1 -1
- package/package.json +12 -6
- package/src/tedi/components/form/select/components/select-input.cjs.js +1 -1
- package/src/tedi/components/form/select/components/select-input.es.js +24 -15
- package/src/tedi/components/form/select/components/select-multi-value-remove.cjs.js +1 -1
- package/src/tedi/components/form/select/components/select-multi-value-remove.es.js +11 -11
- package/src/tedi/components/form/select/components/select-multi-value.cjs.js +1 -1
- package/src/tedi/components/form/select/components/select-multi-value.es.js +34 -30
- package/src/tedi/components/form/select/select.cjs.js +1 -1
- package/src/tedi/components/form/select/select.d.ts +14 -0
- package/src/tedi/components/form/select/select.es.js +274 -267
|
@@ -1,306 +1,313 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import
|
|
3
|
-
import r, { forwardRef as
|
|
4
|
-
import
|
|
5
|
-
import
|
|
6
|
-
import { FeedbackText as
|
|
7
|
-
import { FormLabel as
|
|
8
|
-
import { useOptionalInputGroup as
|
|
9
|
-
import
|
|
10
|
-
import { SELECT_ALL_VALUE as
|
|
11
|
-
import { SelectClearIndicator as
|
|
12
|
-
import { SelectControl as
|
|
13
|
-
import { SelectDropDownIndicator as
|
|
14
|
-
import { SelectGroup as
|
|
15
|
-
import { SelectGroupHeading as
|
|
16
|
-
import { SelectIndicatorsContainer as
|
|
17
|
-
import { SelectInput as
|
|
18
|
-
import { SelectLoadingIndicator as
|
|
19
|
-
import { SelectMenu as
|
|
20
|
-
import { SelectMenuList as
|
|
21
|
-
import { SelectMenuPortal as
|
|
22
|
-
import { SelectMultiValue as
|
|
23
|
-
import { SelectMultiValueRemove as
|
|
24
|
-
import { SelectOption as
|
|
25
|
-
import { SelectSingleValue as
|
|
26
|
-
import { SelectValueContainer as
|
|
27
|
-
import
|
|
28
|
-
import { useLabels as
|
|
29
|
-
const
|
|
30
|
-
(
|
|
31
|
-
var
|
|
1
|
+
import { jsx as L, jsxs as J } from "react/jsx-runtime";
|
|
2
|
+
import Q from "../../../../../external/classnames/index.es.js";
|
|
3
|
+
import r, { forwardRef as nt } from "react";
|
|
4
|
+
import lt from "../../../../../external/react-select/dist/react-select.esm.es.js";
|
|
5
|
+
import st from "../../../../../external/react-select/async/dist/react-select-async.esm.es.js";
|
|
6
|
+
import { FeedbackText as rt } from "../feedback-text/feedback-text.es.js";
|
|
7
|
+
import { FormLabel as at } from "../form-label/form-label.es.js";
|
|
8
|
+
import { useOptionalInputGroup as it } from "../input-group/input-group.es.js";
|
|
9
|
+
import ct from "../input-group/input-group.module.scss.es.js";
|
|
10
|
+
import { SELECT_ALL_VALUE as M, GROUP_OPTION_PREFIX as ut, areAllSelected as Y, getEnabledOptions as Z, isGroupSentinel as ee } from "./components/select-bulk-helpers.es.js";
|
|
11
|
+
import { SelectClearIndicator as dt } from "./components/select-clear-indicator.es.js";
|
|
12
|
+
import { SelectControl as pt } from "./components/select-control.es.js";
|
|
13
|
+
import { SelectDropDownIndicator as mt } from "./components/select-dropdown-indicator.es.js";
|
|
14
|
+
import { SelectGroup as ft } from "./components/select-group.es.js";
|
|
15
|
+
import { SelectGroupHeading as gt } from "./components/select-group-heading.es.js";
|
|
16
|
+
import { SelectIndicatorsContainer as St } from "./components/select-indicators-container.es.js";
|
|
17
|
+
import { SelectInput as bt } from "./components/select-input.es.js";
|
|
18
|
+
import { SelectLoadingIndicator as yt } from "./components/select-loading-indicator.es.js";
|
|
19
|
+
import { SelectMenu as Mt } from "./components/select-menu.es.js";
|
|
20
|
+
import { SelectMenuList as vt } from "./components/select-menu-list.es.js";
|
|
21
|
+
import { SelectMenuPortal as ht } from "./components/select-menu-portal.es.js";
|
|
22
|
+
import { SelectMultiValue as It } from "./components/select-multi-value.es.js";
|
|
23
|
+
import { SelectMultiValueRemove as Ot } from "./components/select-multi-value-remove.es.js";
|
|
24
|
+
import { SelectOption as Ct } from "./components/select-option.es.js";
|
|
25
|
+
import { SelectSingleValue as wt } from "./components/select-single-value.es.js";
|
|
26
|
+
import { SelectValueContainer as Lt } from "./components/select-value-container.es.js";
|
|
27
|
+
import d from "./select.module.scss.es.js";
|
|
28
|
+
import { useLabels as Vt } from "../../../providers/label-provider/use-labels.es.js";
|
|
29
|
+
const At = nt(
|
|
30
|
+
(D, te) => {
|
|
31
|
+
var X;
|
|
32
32
|
const {
|
|
33
33
|
options: c,
|
|
34
|
-
defaultOptions:
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
tabSelectsValue: ce = !1,
|
|
34
|
+
defaultOptions: oe,
|
|
35
|
+
name: ne,
|
|
36
|
+
iconName: le = "arrow_drop_down",
|
|
37
|
+
label: se,
|
|
38
|
+
required: N,
|
|
39
|
+
value: P,
|
|
40
|
+
defaultValue: T,
|
|
41
|
+
tagsDirection: V = "stack",
|
|
42
|
+
onChange: A,
|
|
43
|
+
onInputChange: re,
|
|
44
|
+
inputValue: ae,
|
|
45
|
+
loadOptions: ie,
|
|
46
|
+
isLoading: ce,
|
|
47
|
+
openMenuOnFocus: ue = !1,
|
|
48
|
+
openMenuOnClick: de = !0,
|
|
49
|
+
tabSelectsValue: pe = !1,
|
|
51
50
|
disabled: F = !1,
|
|
52
|
-
className:
|
|
53
|
-
hideLabel:
|
|
51
|
+
className: me,
|
|
52
|
+
hideLabel: fe = !1,
|
|
54
53
|
helper: a,
|
|
55
|
-
placeholder:
|
|
56
|
-
invalid:
|
|
57
|
-
valid:
|
|
58
|
-
size:
|
|
59
|
-
async:
|
|
60
|
-
renderOption:
|
|
61
|
-
renderMessageListFooter:
|
|
62
|
-
noOptionsMessage:
|
|
63
|
-
loadingMessage:
|
|
64
|
-
multiple:
|
|
65
|
-
showSelectAll:
|
|
66
|
-
selectableGroups:
|
|
67
|
-
dropdownType:
|
|
68
|
-
renderValue:
|
|
69
|
-
closeMenuOnSelect:
|
|
70
|
-
blurInputOnSelect:
|
|
71
|
-
autoFocus:
|
|
72
|
-
isClearable:
|
|
73
|
-
isClearIndicatorVisible:
|
|
74
|
-
isSearchable:
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
54
|
+
placeholder: ge,
|
|
55
|
+
invalid: Se,
|
|
56
|
+
valid: be,
|
|
57
|
+
size: _,
|
|
58
|
+
async: ye = !1,
|
|
59
|
+
renderOption: Me,
|
|
60
|
+
renderMessageListFooter: $,
|
|
61
|
+
noOptionsMessage: ve,
|
|
62
|
+
loadingMessage: he,
|
|
63
|
+
multiple: v = !1,
|
|
64
|
+
showSelectAll: x = !1,
|
|
65
|
+
selectableGroups: E = !1,
|
|
66
|
+
dropdownType: Ie = "menu",
|
|
67
|
+
renderValue: Oe,
|
|
68
|
+
closeMenuOnSelect: Ce = !v,
|
|
69
|
+
blurInputOnSelect: G = !1,
|
|
70
|
+
autoFocus: we = !1,
|
|
71
|
+
isClearable: Le = !0,
|
|
72
|
+
isClearIndicatorVisible: Ve = !1,
|
|
73
|
+
isSearchable: O = !0,
|
|
74
|
+
openKeyboardOnTouch: H = !0,
|
|
75
|
+
menuIsOpen: Ae,
|
|
76
|
+
onMenuClose: _e,
|
|
77
|
+
onMenuOpen: ke,
|
|
78
|
+
onBlur: k,
|
|
79
|
+
inputIsHidden: Re,
|
|
80
|
+
isTagRemovable: De = !1,
|
|
81
|
+
tagsEllipsis: Ne = !1,
|
|
82
|
+
backspaceRemovesValue: Pe = !1,
|
|
83
|
+
optionGroupHeadingText: Te = { modifiers: "small", color: "tertiary" },
|
|
84
84
|
cacheOptions: Fe = !0,
|
|
85
|
-
showRadioButtons:
|
|
86
|
-
renderWithoutLabel:
|
|
87
|
-
tooltip:
|
|
88
|
-
classNames:
|
|
89
|
-
} =
|
|
85
|
+
showRadioButtons: $e = !1,
|
|
86
|
+
renderWithoutLabel: xe,
|
|
87
|
+
tooltip: Ee,
|
|
88
|
+
classNames: K
|
|
89
|
+
} = D, u = (X = it) == null ? void 0 : X(), Ge = r.useId(), R = u == null ? void 0 : u.hasExternalLabel, f = D.id ?? (u == null ? void 0 : u.inputId) ?? Ge, He = R ? (u == null ? void 0 : u.inputId) ?? f : `${f}-input`, Ke = R ? `${f}-container` : f, j = a ? (a == null ? void 0 : a.id) ?? `${f}-helper` : void 0, h = r.useRef(null), { getLabel: C } = Vt();
|
|
90
90
|
r.useImperativeHandle(
|
|
91
|
-
|
|
91
|
+
te,
|
|
92
92
|
() => h.current
|
|
93
93
|
);
|
|
94
|
-
const
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
94
|
+
const [je, U] = r.useState(!1), Ue = (t) => {
|
|
95
|
+
var e, o;
|
|
96
|
+
if (H || !O || t.pointerType !== "touch" && t.pointerType !== "pen") return;
|
|
97
|
+
const l = t.target;
|
|
98
|
+
if (!((e = l.closest) != null && e.call(l, `.${d["tedi-select__control"]}`))) return;
|
|
99
|
+
const n = (o = h.current) == null ? void 0 : o.inputRef, i = !!n && (t.target === n || n.contains(l));
|
|
100
|
+
U(!i);
|
|
101
|
+
}, Be = () => {
|
|
102
|
+
U(!1), k == null || k();
|
|
103
|
+
}, S = !!x && v, [ze, qe] = r.useState(T ?? null), B = P !== void 0, g = B ? P : ze, p = r.useMemo(() => Array.isArray(g) ? g : g ? [g] : [], [g]), w = r.useMemo(
|
|
104
|
+
() => ({ value: M, label: C("select.select-all") }),
|
|
105
|
+
[C]
|
|
106
|
+
), b = !!E && !!v, { groupFlattenedOptions: z, groupSentinelMap: I } = r.useMemo(() => {
|
|
98
107
|
const t = /* @__PURE__ */ new Map();
|
|
99
108
|
if (!b || !c || c.length === 0)
|
|
100
109
|
return { groupFlattenedOptions: null, groupSentinelMap: t };
|
|
101
110
|
if (!c.some((e) => e && Array.isArray(e.options))) return { groupFlattenedOptions: null, groupSentinelMap: t };
|
|
102
|
-
const
|
|
111
|
+
const n = [], i = /* @__PURE__ */ new Map();
|
|
103
112
|
for (const e of c)
|
|
104
113
|
if (e && Array.isArray(e.options)) {
|
|
105
|
-
const o = e,
|
|
106
|
-
i.set(
|
|
107
|
-
for (const
|
|
108
|
-
|
|
109
|
-
...
|
|
110
|
-
customData: { ...
|
|
114
|
+
const o = e, s = `${ut}${o.label ?? ""}`, m = o.options.filter((y) => !y.isDisabled);
|
|
115
|
+
i.set(s, { enabled: m }), n.push({ value: s, label: o.label ?? "" });
|
|
116
|
+
for (const y of o.options)
|
|
117
|
+
n.push({
|
|
118
|
+
...y,
|
|
119
|
+
customData: { ...y.customData ?? {}, __tediInGroup: !0 }
|
|
111
120
|
});
|
|
112
121
|
} else
|
|
113
|
-
|
|
114
|
-
return { groupFlattenedOptions:
|
|
115
|
-
}, [c, b]),
|
|
116
|
-
let t =
|
|
117
|
-
return
|
|
118
|
-
}, [c,
|
|
122
|
+
n.push(e);
|
|
123
|
+
return { groupFlattenedOptions: n, groupSentinelMap: i };
|
|
124
|
+
}, [c, b]), We = r.useMemo(() => {
|
|
125
|
+
let t = z ?? c;
|
|
126
|
+
return S && t && t.length > 0 && (t = [w, ...t]), t;
|
|
127
|
+
}, [c, z, S, w]), Xe = r.useMemo(() => {
|
|
119
128
|
const t = [];
|
|
120
|
-
if (b &&
|
|
121
|
-
for (const [
|
|
122
|
-
|
|
123
|
-
if (
|
|
124
|
-
const
|
|
125
|
-
|
|
129
|
+
if (b && I.size > 0)
|
|
130
|
+
for (const [l, n] of I)
|
|
131
|
+
n.enabled.length > 0 && Y(p, n.enabled) && t.push({ value: l, label: "" });
|
|
132
|
+
if (S) {
|
|
133
|
+
const l = Z(c ?? []);
|
|
134
|
+
l.length > 0 && Y(p, l) && t.push(w);
|
|
126
135
|
}
|
|
127
|
-
return t.length === 0 ?
|
|
136
|
+
return t.length === 0 ? g : [...p, ...t];
|
|
128
137
|
}, [
|
|
129
|
-
|
|
130
|
-
|
|
138
|
+
g,
|
|
139
|
+
p,
|
|
131
140
|
c,
|
|
132
141
|
b,
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
]),
|
|
137
|
-
let
|
|
138
|
-
const i =
|
|
139
|
-
if (b && i &&
|
|
140
|
-
const e =
|
|
141
|
-
if (
|
|
142
|
-
const o = [...
|
|
143
|
-
for (const
|
|
144
|
-
o.some((
|
|
145
|
-
|
|
146
|
-
} else
|
|
147
|
-
} else if (
|
|
148
|
-
const e =
|
|
149
|
-
o &&
|
|
150
|
-
(
|
|
151
|
-
), ...e] : o &&
|
|
152
|
-
(
|
|
142
|
+
I,
|
|
143
|
+
S,
|
|
144
|
+
w
|
|
145
|
+
]), Je = (t, l) => {
|
|
146
|
+
let n = t;
|
|
147
|
+
const i = l.option;
|
|
148
|
+
if (b && i && I.has(i.value)) {
|
|
149
|
+
const e = I.get(i.value).enabled;
|
|
150
|
+
if (l.action === "select-option") {
|
|
151
|
+
const o = [...p];
|
|
152
|
+
for (const s of e)
|
|
153
|
+
o.some((m) => m.value === s.value) || o.push(s);
|
|
154
|
+
n = o;
|
|
155
|
+
} else l.action === "deselect-option" && (n = p.filter((o) => !e.some((s) => s.value === o.value)));
|
|
156
|
+
} else if (S) {
|
|
157
|
+
const e = Z(c ?? []), o = (i == null ? void 0 : i.value) === M;
|
|
158
|
+
o && l.action === "select-option" ? n = [...p.filter(
|
|
159
|
+
(m) => m.value !== M && !e.some((y) => y.value === m.value)
|
|
160
|
+
), ...e] : o && l.action === "deselect-option" && (n = p.filter(
|
|
161
|
+
(s) => s.value !== M && !e.some((m) => m.value === s.value)
|
|
153
162
|
));
|
|
154
163
|
}
|
|
155
|
-
Array.isArray(
|
|
164
|
+
Array.isArray(n) && (n = n.filter((e) => e.value !== M && !ee(e))), B || qe(n), A == null || A(n), !G && h.current && setTimeout(() => {
|
|
156
165
|
var e, o;
|
|
157
166
|
return (o = (e = h.current) == null ? void 0 : e.inputRef) == null ? void 0 : o.focus();
|
|
158
167
|
}, 0);
|
|
159
|
-
},
|
|
160
|
-
(t,
|
|
168
|
+
}, Qe = r.useCallback(
|
|
169
|
+
(t, l) => t.data.value === M || ee(t.data) || !l ? !0 : String(t.label).toLowerCase().includes(l.toLowerCase()),
|
|
161
170
|
[]
|
|
162
|
-
), [
|
|
163
|
-
(t.key === "ArrowUp" || t.key === "ArrowDown" || t.key === "Home" || t.key === "End" || t.key === "PageUp" || t.key === "PageDown" || t.key === "Tab") && (
|
|
164
|
-
},
|
|
165
|
-
|
|
166
|
-
}, []),
|
|
167
|
-
(t) => /* @__PURE__ */
|
|
168
|
-
[
|
|
169
|
-
),
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
e.control = (n) => W(o == null ? void 0 : o(n), lt["tedi-input-group__input"]);
|
|
253
|
-
}
|
|
254
|
-
return Object.keys(e).length > 0 ? e : void 0;
|
|
255
|
-
})(),
|
|
256
|
-
theme: (e) => ({
|
|
257
|
-
...e,
|
|
258
|
-
colors: {
|
|
259
|
-
...e.colors,
|
|
260
|
-
primary: "var(--tedi-blue-600)",
|
|
261
|
-
danger: "var(--tedi-red-600)",
|
|
262
|
-
dangerLight: "var(--tedi-red-200)"
|
|
263
|
-
}
|
|
264
|
-
}),
|
|
265
|
-
styles: {
|
|
266
|
-
input: (e) => ({
|
|
267
|
-
...e,
|
|
268
|
-
gridTemplateColumns: "0fr"
|
|
269
|
-
})
|
|
171
|
+
), [q, W] = r.useState(!1), Ye = (t) => {
|
|
172
|
+
(t.key === "ArrowUp" || t.key === "ArrowDown" || t.key === "Home" || t.key === "End" || t.key === "PageUp" || t.key === "PageDown" || t.key === "Tab") && (q || W(!0));
|
|
173
|
+
}, Ze = r.useCallback(() => {
|
|
174
|
+
W((t) => t && !1);
|
|
175
|
+
}, []), et = r.useCallback(
|
|
176
|
+
(t) => /* @__PURE__ */ L(vt, { ...t, renderMessageListFooter: $ }),
|
|
177
|
+
[$]
|
|
178
|
+
), tt = () => /* @__PURE__ */ L(
|
|
179
|
+
ye ? st : lt,
|
|
180
|
+
{
|
|
181
|
+
tagsDirection: V,
|
|
182
|
+
showSelectAll: x,
|
|
183
|
+
selectableGroups: E,
|
|
184
|
+
dropdownType: Ie,
|
|
185
|
+
renderValue: Oe,
|
|
186
|
+
keyboardMode: q,
|
|
187
|
+
exitKeyboardMode: Ze,
|
|
188
|
+
onKeyDown: Ye,
|
|
189
|
+
id: Ke,
|
|
190
|
+
"aria-describedby": j,
|
|
191
|
+
autoFocus: we,
|
|
192
|
+
ref: h,
|
|
193
|
+
instanceId: f,
|
|
194
|
+
className: "tedi-select__wrapper",
|
|
195
|
+
name: ne,
|
|
196
|
+
options: We,
|
|
197
|
+
defaultOptions: oe,
|
|
198
|
+
value: Xe,
|
|
199
|
+
defaultValue: T,
|
|
200
|
+
cacheOptions: Fe,
|
|
201
|
+
onChange: Je,
|
|
202
|
+
filterOption: S || b ? Qe : void 0,
|
|
203
|
+
onInputChange: re,
|
|
204
|
+
onBlur: Be,
|
|
205
|
+
softKeyboardSuppressed: !H && O && je,
|
|
206
|
+
inputValue: ae,
|
|
207
|
+
inputId: He,
|
|
208
|
+
loadOptions: ie,
|
|
209
|
+
isLoading: ce,
|
|
210
|
+
noOptionsMessage: ve || (() => C("select.no-options")),
|
|
211
|
+
loadingMessage: he || (() => C("select.loading")),
|
|
212
|
+
classNamePrefix: "select",
|
|
213
|
+
components: {
|
|
214
|
+
ClearIndicator: (e) => dt({ isClearIndicatorVisible: Ve, ...e }),
|
|
215
|
+
DropdownIndicator: () => mt({ iconName: le }),
|
|
216
|
+
IndicatorSeparator: () => null,
|
|
217
|
+
MenuPortal: ht,
|
|
218
|
+
Menu: Mt,
|
|
219
|
+
MenuList: et,
|
|
220
|
+
Option: (e) => Ct({ renderOption: Me, multiple: v, showRadioButtons: $e, ...e }),
|
|
221
|
+
Control: pt,
|
|
222
|
+
Input: bt,
|
|
223
|
+
MultiValue: (e) => It({ isTagRemovable: De, tagsEllipsis: Ne, ...e }),
|
|
224
|
+
MultiValueRemove: Ot,
|
|
225
|
+
SingleValue: wt,
|
|
226
|
+
Group: ft,
|
|
227
|
+
GroupHeading: (e) => gt({ optionGroupHeadingText: Te, ...e }),
|
|
228
|
+
IndicatorsContainer: St,
|
|
229
|
+
ValueContainer: Lt,
|
|
230
|
+
LoadingIndicator: yt
|
|
231
|
+
},
|
|
232
|
+
isDisabled: F,
|
|
233
|
+
isSearchable: O,
|
|
234
|
+
menuIsOpen: Ae,
|
|
235
|
+
openMenuOnFocus: ue,
|
|
236
|
+
openMenuOnClick: de,
|
|
237
|
+
tabSelectsValue: pe,
|
|
238
|
+
onMenuClose: _e,
|
|
239
|
+
onMenuOpen: ke,
|
|
240
|
+
placeholder: ge || "",
|
|
241
|
+
isClearable: Le,
|
|
242
|
+
backspaceRemovesValue: Pe,
|
|
243
|
+
menuShouldScrollIntoView: !0,
|
|
244
|
+
isMulti: v,
|
|
245
|
+
hideSelectedOptions: !1,
|
|
246
|
+
closeMenuOnSelect: Ce,
|
|
247
|
+
blurInputOnSelect: G,
|
|
248
|
+
menuPlacement: "auto",
|
|
249
|
+
inputIsHidden: Re,
|
|
250
|
+
required: N,
|
|
251
|
+
menuPortalTarget: document.body,
|
|
252
|
+
menuPosition: "absolute",
|
|
253
|
+
classNames: (() => {
|
|
254
|
+
const e = {};
|
|
255
|
+
if (K)
|
|
256
|
+
for (const [o, s] of Object.entries(K))
|
|
257
|
+
e[o] = typeof s == "string" ? () => s : s;
|
|
258
|
+
if (u) {
|
|
259
|
+
const o = e.control;
|
|
260
|
+
e.control = (s) => Q(o == null ? void 0 : o(s), ct["tedi-input-group__input"]);
|
|
270
261
|
}
|
|
262
|
+
return Object.keys(e).length > 0 ? e : void 0;
|
|
263
|
+
})(),
|
|
264
|
+
theme: (e) => ({
|
|
265
|
+
...e,
|
|
266
|
+
colors: {
|
|
267
|
+
...e.colors,
|
|
268
|
+
primary: "var(--tedi-blue-600)",
|
|
269
|
+
danger: "var(--tedi-red-600)",
|
|
270
|
+
dangerLight: "var(--tedi-red-200)"
|
|
271
|
+
}
|
|
272
|
+
}),
|
|
273
|
+
styles: {
|
|
274
|
+
input: (e) => ({
|
|
275
|
+
...e,
|
|
276
|
+
gridTemplateColumns: "0fr"
|
|
277
|
+
})
|
|
271
278
|
}
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
{ [
|
|
277
|
-
{ [
|
|
278
|
-
{ [
|
|
279
|
-
{ [
|
|
280
|
-
{ [
|
|
281
|
-
{ [
|
|
279
|
+
}
|
|
280
|
+
), ot = Q(
|
|
281
|
+
d["tedi-select"],
|
|
282
|
+
me,
|
|
283
|
+
{ [d["tedi-select--invalid"]]: Se || (a == null ? void 0 : a.type) === "error" },
|
|
284
|
+
{ [d["tedi-select--valid"]]: be || (a == null ? void 0 : a.type) === "valid" },
|
|
285
|
+
{ [d[`tedi-select--${_}`]]: _ },
|
|
286
|
+
{ [d[`tedi-select--tags-${V}`]]: V },
|
|
287
|
+
{ [d["tedi-select--searchable"]]: O },
|
|
288
|
+
{ [d["tedi-select--disabled"]]: F }
|
|
282
289
|
);
|
|
283
|
-
return /* @__PURE__ */
|
|
284
|
-
/* @__PURE__ */
|
|
285
|
-
!
|
|
286
|
-
|
|
290
|
+
return /* @__PURE__ */ J("div", { "data-name": "select", className: ot, onPointerDownCapture: Ue, children: [
|
|
291
|
+
/* @__PURE__ */ J("div", { className: d["tedi-select__inner"], children: [
|
|
292
|
+
!R && /* @__PURE__ */ L(
|
|
293
|
+
at,
|
|
287
294
|
{
|
|
288
|
-
id: `${
|
|
289
|
-
label:
|
|
290
|
-
required:
|
|
291
|
-
hideLabel:
|
|
292
|
-
size:
|
|
293
|
-
renderWithoutLabel:
|
|
294
|
-
tooltip:
|
|
295
|
+
id: `${f}-input`,
|
|
296
|
+
label: se,
|
|
297
|
+
required: N,
|
|
298
|
+
hideLabel: fe,
|
|
299
|
+
size: _,
|
|
300
|
+
renderWithoutLabel: xe,
|
|
301
|
+
tooltip: Ee
|
|
295
302
|
}
|
|
296
303
|
),
|
|
297
|
-
|
|
304
|
+
tt()
|
|
298
305
|
] }),
|
|
299
|
-
a && /* @__PURE__ */
|
|
306
|
+
a && /* @__PURE__ */ L(rt, { ...a, id: j })
|
|
300
307
|
] });
|
|
301
308
|
}
|
|
302
309
|
);
|
|
303
|
-
|
|
310
|
+
At.displayName = "Select";
|
|
304
311
|
export {
|
|
305
|
-
|
|
312
|
+
At as Select
|
|
306
313
|
};
|