mimir-ui-kit 1.37.11 → 1.37.12
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.
@@ -18,4 +18,5 @@ export declare const SelectSearch: import('react').ForwardRefExoticComponent<Pic
|
|
18
18
|
searchProps?: Pick<import('../Input').TInputProps, "numbersOnly" | "maxLength" | "required">;
|
19
19
|
disableInput?: boolean;
|
20
20
|
autocomplete?: "on" | "off";
|
21
|
+
immediate?: boolean;
|
21
22
|
} & import('react').RefAttributes<HTMLElement>>;
|
@@ -1,39 +1,39 @@
|
|
1
|
-
import { jsx as s, jsxs as
|
1
|
+
import { jsx as s, jsxs as u, Fragment as z } from "react/jsx-runtime";
|
2
2
|
import { c as i } from "../../index-DIxK0V-G.js";
|
3
|
-
import { forwardRef as
|
3
|
+
import { forwardRef as U, useState as D, useMemo as R, useCallback as $, useEffect as J } from "react";
|
4
4
|
import { ESelectSearchSize as v } from "./constants.js";
|
5
|
-
import { mapSizeToInputSize as j, getDropdownArrowIcon as
|
5
|
+
import { mapSizeToInputSize as j, getDropdownArrowIcon as Q } from "./utils.js";
|
6
6
|
import { Icon as q } from "../../icons/Icon.js";
|
7
|
-
import { Button as
|
7
|
+
import { Button as W } from "../Button/Button.js";
|
8
8
|
import { I as A } from "../../Input-BYrIS5GU.js";
|
9
|
-
import { EInputVariant as
|
10
|
-
import { H as
|
11
|
-
import '../../assets/SelectSearch.css';const
|
9
|
+
import { EInputVariant as X } from "../Input/constants.js";
|
10
|
+
import { H as Y, U as O, G as B, K as Z, j as ee } from "../../combobox-BpYucpxz.js";
|
11
|
+
import '../../assets/SelectSearch.css';const te = "_disabled_rphak_5", oe = "_container_rphak_9", ae = "_full_rphak_22", ne = "_button_rphak_34", se = "_options_rphak_48", re = "_top_rphak_59", ie = "_bottom_rphak_64", le = "_m_rphak_91", ce = "_l_rphak_106", pe = "_option_rphak_48", de = "_clear_rphak_160", e = {
|
12
12
|
"select-search": "_select-search_rphak_2",
|
13
|
-
disabled:
|
14
|
-
container:
|
13
|
+
disabled: te,
|
14
|
+
container: oe,
|
15
15
|
"container-open": "_container-open_rphak_18",
|
16
|
-
full:
|
16
|
+
full: ae,
|
17
17
|
"selected-icon": "_selected-icon_rphak_26",
|
18
18
|
"selector-icon-open": "_selector-icon-open_rphak_30",
|
19
|
-
button:
|
19
|
+
button: ne,
|
20
20
|
"selector-icon": "_selector-icon_rphak_30",
|
21
|
-
options:
|
22
|
-
top:
|
23
|
-
bottom:
|
21
|
+
options: se,
|
22
|
+
top: re,
|
23
|
+
bottom: ie,
|
24
24
|
"no-options": "_no-options_rphak_85",
|
25
|
-
m:
|
26
|
-
l:
|
25
|
+
m: le,
|
26
|
+
l: ce,
|
27
27
|
"select-input": "_select-input_rphak_121",
|
28
28
|
"select-input-disabled": "_select-input-disabled_rphak_124",
|
29
|
-
option:
|
29
|
+
option: pe,
|
30
30
|
"option-active": "_option-active_rphak_140",
|
31
31
|
"option-inner": "_option-inner_rphak_143",
|
32
32
|
"right-slot": "_right-slot_rphak_150",
|
33
33
|
"required-mark": "_required-mark_rphak_155",
|
34
|
-
clear:
|
34
|
+
clear: de,
|
35
35
|
"icon-button": "_icon-button_rphak_169"
|
36
|
-
},
|
36
|
+
}, we = U(
|
37
37
|
(M, E) => {
|
38
38
|
const {
|
39
39
|
placeholder: g,
|
@@ -46,33 +46,34 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
46
46
|
classNameOption: F,
|
47
47
|
displayValue: G = "name",
|
48
48
|
filterOnSearch: w = !0,
|
49
|
-
onSearch:
|
50
|
-
variant: C =
|
51
|
-
menuPlacement:
|
49
|
+
onSearch: _,
|
50
|
+
variant: C = X.DefaultGray,
|
51
|
+
menuPlacement: f = "bottom",
|
52
52
|
disabled: l = !1,
|
53
53
|
searchProps: I,
|
54
|
-
withClearButton:
|
54
|
+
withClearButton: b = !1,
|
55
55
|
disableInput: c = !1,
|
56
|
-
autocomplete: S = "on"
|
57
|
-
|
56
|
+
autocomplete: S = "on",
|
57
|
+
immediate: P = !1
|
58
|
+
} = M, k = String((a == null ? void 0 : a[G]) || ""), [p, m] = D(k), [N, h] = D(a), y = R(() => !w || a && (a.id || a.name) ? d : p.trim().toLowerCase() ? d.filter(
|
58
59
|
(o) => o.name.toLowerCase().includes(p.toLowerCase())
|
59
|
-
) : d, [p, d, a, w]),
|
60
|
-
o ? (
|
61
|
-
}, x =
|
60
|
+
) : d, [p, d, a, w]), T = (o) => {
|
61
|
+
o ? (m(o.name), h(o), n == null || n(o)) : (m(""), h(null), n == null || n({ id: "", name: "" }));
|
62
|
+
}, x = $(
|
62
63
|
(o) => {
|
63
64
|
if (c) return;
|
64
65
|
const t = o.target.value;
|
65
|
-
|
66
|
+
m(t), _ == null || _(t), !t && a && (n == null || n({ id: "", name: "" }));
|
66
67
|
},
|
67
|
-
[c, n,
|
68
|
-
),
|
69
|
-
|
68
|
+
[c, n, _, a]
|
69
|
+
), H = () => {
|
70
|
+
m(""), h(null), n == null || n({ id: "", name: "" });
|
70
71
|
};
|
71
|
-
return
|
72
|
+
return J(() => {
|
72
73
|
const o = !a || typeof a == "object" && !Object.keys(a).length;
|
73
|
-
|
74
|
+
m(o ? "" : k), h(o ? null : a);
|
74
75
|
}, [a, k]), /* @__PURE__ */ s(
|
75
|
-
|
76
|
+
Y,
|
76
77
|
{
|
77
78
|
as: "div",
|
78
79
|
value: N,
|
@@ -80,19 +81,20 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
80
81
|
[e.full]: L,
|
81
82
|
[e.disabled]: l
|
82
83
|
}),
|
83
|
-
onChange:
|
84
|
+
onChange: T,
|
84
85
|
ref: E,
|
85
86
|
disabled: l,
|
86
87
|
virtual: { options: y },
|
87
|
-
|
88
|
-
|
88
|
+
immediate: P,
|
89
|
+
children: ({ open: o }) => /* @__PURE__ */ u(z, { children: [
|
90
|
+
/* @__PURE__ */ u(
|
89
91
|
"div",
|
90
92
|
{
|
91
93
|
className: i(e.container, e[r], {
|
92
94
|
[e["container-open"]]: o
|
93
95
|
}),
|
94
96
|
children: [
|
95
|
-
c && /* @__PURE__ */
|
97
|
+
c && /* @__PURE__ */ u("div", { style: { position: "relative", width: "100%" }, children: [
|
96
98
|
/* @__PURE__ */ s(O, { disabled: l, style: { width: "100%" }, children: /* @__PURE__ */ s(
|
97
99
|
B,
|
98
100
|
{
|
@@ -100,7 +102,7 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
100
102
|
label: g,
|
101
103
|
size: j(r),
|
102
104
|
className: i(e["select-input"], {
|
103
|
-
[e["select-input-disabled"]]: c &&
|
105
|
+
[e["select-input-disabled"]]: c && b
|
104
106
|
}),
|
105
107
|
onChange: x,
|
106
108
|
value: p,
|
@@ -114,14 +116,14 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
114
116
|
},
|
115
117
|
rightAddon: {
|
116
118
|
addonType: "icon",
|
117
|
-
addonContent:
|
119
|
+
addonContent: Q(o, r)
|
118
120
|
},
|
119
121
|
autocomplete: S,
|
120
122
|
...I
|
121
123
|
}
|
122
124
|
) }),
|
123
|
-
|
124
|
-
|
125
|
+
b && p && /* @__PURE__ */ s(
|
126
|
+
W,
|
125
127
|
{
|
126
128
|
tabIndex: -1,
|
127
129
|
className: i(e.clear, {
|
@@ -135,7 +137,7 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
135
137
|
disabled: l,
|
136
138
|
variant: "secondary-gray",
|
137
139
|
onClick: (t) => {
|
138
|
-
t.stopPropagation(),
|
140
|
+
t.stopPropagation(), H();
|
139
141
|
},
|
140
142
|
"data-testid": "clear-button"
|
141
143
|
}
|
@@ -152,7 +154,7 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
152
154
|
value: p,
|
153
155
|
disabled: l,
|
154
156
|
variant: C,
|
155
|
-
withClearButton:
|
157
|
+
withClearButton: b,
|
156
158
|
rightSlotClassName: e["right-slot"],
|
157
159
|
requiredMarkClassName: e["required-mark"],
|
158
160
|
"data-testid": "select-search-input",
|
@@ -188,29 +190,29 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
188
190
|
}
|
189
191
|
),
|
190
192
|
o && /* @__PURE__ */ s(z, { children: d.length ? y.length ? /* @__PURE__ */ s(
|
191
|
-
|
193
|
+
Z,
|
192
194
|
{
|
193
195
|
"data-testid": "select-search-options",
|
194
196
|
className: i(
|
195
197
|
e.options,
|
196
198
|
e[r],
|
197
|
-
e[
|
199
|
+
e[f]
|
198
200
|
),
|
199
|
-
children: ({ option: t }) => /* @__PURE__ */
|
200
|
-
|
201
|
+
children: ({ option: t }) => /* @__PURE__ */ u(
|
202
|
+
ee,
|
201
203
|
{
|
202
204
|
value: t,
|
203
|
-
className: ({ focus:
|
205
|
+
className: ({ focus: K }) => i(
|
204
206
|
e.option,
|
205
207
|
F,
|
206
208
|
r && e[r],
|
207
209
|
{
|
208
|
-
[e["option-active"]]:
|
210
|
+
[e["option-active"]]: K
|
209
211
|
}
|
210
212
|
),
|
211
213
|
"data-testid": `select-search-option-${t.id}`,
|
212
214
|
children: [
|
213
|
-
/* @__PURE__ */
|
215
|
+
/* @__PURE__ */ u("div", { className: e["option-inner"], children: [
|
214
216
|
t.name,
|
215
217
|
t.bottom && /* @__PURE__ */ s("div", { children: t.bottom })
|
216
218
|
] }),
|
@@ -233,7 +235,7 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
233
235
|
e.options,
|
234
236
|
e[r],
|
235
237
|
e["no-options"],
|
236
|
-
e[
|
238
|
+
e[f]
|
237
239
|
),
|
238
240
|
children: "Ничего не найдено"
|
239
241
|
}
|
@@ -244,7 +246,7 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
244
246
|
e.options,
|
245
247
|
e[r],
|
246
248
|
e["no-options"],
|
247
|
-
e[
|
249
|
+
e[f]
|
248
250
|
),
|
249
251
|
children: "Нет данных"
|
250
252
|
}
|
@@ -255,5 +257,5 @@ import '../../assets/SelectSearch.css';const ee = "_disabled_rphak_5", te = "_co
|
|
255
257
|
}
|
256
258
|
);
|
257
259
|
export {
|
258
|
-
|
260
|
+
we as SelectSearch
|
259
261
|
};
|
@@ -54,4 +54,6 @@ export type TSelectSearchProps = Pick<TInputProps, 'withClearButton' | 'variant'
|
|
54
54
|
disableInput?: boolean;
|
55
55
|
/** Управляет поведением автозаполнения браузера */
|
56
56
|
autocomplete?: 'on' | 'off';
|
57
|
+
/** Показывать список при фокусе или нет */
|
58
|
+
immediate?: boolean;
|
57
59
|
};
|