@progress/kendo-react-dropdowns 10.1.0-develop.9 → 10.1.1-develop.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.
- package/DropDownList/DropDownList.js +1 -1
- package/DropDownList/DropDownList.mjs +112 -113
- package/README.md +12 -12
- package/dist/cdn/js/kendo-react-dropdowns.js +1 -1
- package/package-metadata.js +1 -1
- package/package-metadata.mjs +2 -2
- package/package.json +10 -10
|
@@ -7,22 +7,22 @@
|
|
|
7
7
|
*/
|
|
8
8
|
import * as i from "react";
|
|
9
9
|
import k from "prop-types";
|
|
10
|
-
import { validatePackage as Yt, useUnstyled as $t, useId as jt, usePropsContext as Jt, canUseDOM as
|
|
10
|
+
import { validatePackage as Yt, useUnstyled as $t, useId as jt, usePropsContext as Jt, canUseDOM as rt, useAdaptiveModeContext as Qt, classNames as E, uDropDownList as b, getTabIndex as Xt, IconWrap as Zt, svgIconPropType as Rt, createPropsContext as en, Keys as w, uDropDownsActionSheet as J, WatermarkOverlay as tn } from "@progress/kendo-react-common";
|
|
11
11
|
import { FloatingLabel as nn } from "@progress/kendo-react-labels";
|
|
12
12
|
import { caretAltDownIcon as rn, xIcon as on } from "@progress/kendo-svg-icons";
|
|
13
13
|
import an from "../common/ListContainer.mjs";
|
|
14
14
|
import ln from "../common/ListFilter.mjs";
|
|
15
|
-
import
|
|
15
|
+
import ot from "../common/GroupStickyHeader.mjs";
|
|
16
16
|
import sn from "../common/ListDefaultItem.mjs";
|
|
17
17
|
import dn from "../common/List.mjs";
|
|
18
|
-
import
|
|
19
|
-
import { getFilteredData as P, areSame as N, getItemValue as fe, isPresent as
|
|
18
|
+
import dt from "../common/DropDownBase.mjs";
|
|
19
|
+
import { getFilteredData as P, areSame as N, getItemValue as fe, isPresent as it, itemIndexStartsWith as cn, sameCharsOnly as un, shuffleData as pn, matchText as at } from "../common/utils.mjs";
|
|
20
20
|
import { packageMetadata as mn } from "../package-metadata.mjs";
|
|
21
|
-
import { Button as
|
|
21
|
+
import { Button as lt } from "@progress/kendo-react-buttons";
|
|
22
22
|
import { useLocalization as fn } from "@progress/kendo-react-intl";
|
|
23
|
-
import { dropDownListArrowBtnAriaLabel as
|
|
23
|
+
import { dropDownListArrowBtnAriaLabel as st, messages as vn } from "../messages/index.mjs";
|
|
24
24
|
import { ActionSheet as gn, ActionSheetHeader as hn, ActionSheetContent as In } from "@progress/kendo-react-layout";
|
|
25
|
-
const
|
|
25
|
+
const yn = "Please select a value from the list!", Te = i.forwardRef((D, ct) => {
|
|
26
26
|
let ze = !1;
|
|
27
27
|
if (D.filterable || D.virtual) {
|
|
28
28
|
const e = [];
|
|
@@ -31,9 +31,9 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
31
31
|
features: e
|
|
32
32
|
});
|
|
33
33
|
}
|
|
34
|
-
const F = $t(), ve = jt(D.id), r = Jt(
|
|
35
|
-
delay:
|
|
36
|
-
tabIndex:
|
|
34
|
+
const F = $t(), ve = jt(D.id), r = Jt(wn, D), {
|
|
35
|
+
delay: ut = z.delay,
|
|
36
|
+
tabIndex: pt = z.tabIndex,
|
|
37
37
|
ignoreCase: ge = z.ignoreCase,
|
|
38
38
|
size: Q = z.size,
|
|
39
39
|
rounded: Oe = z.rounded,
|
|
@@ -41,37 +41,37 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
41
41
|
groupMode: xn = z.groupMode
|
|
42
42
|
} = r, Ie = () => {
|
|
43
43
|
var e;
|
|
44
|
-
if (
|
|
44
|
+
if (rt)
|
|
45
45
|
return ((e = Z.current) == null ? void 0 : e.ownerDocument) || window.document;
|
|
46
|
-
},
|
|
46
|
+
}, mt = () => {
|
|
47
47
|
var e, n;
|
|
48
48
|
(e = t == null ? void 0 : t.current) != null && e.wrapper && ((n = t == null ? void 0 : t.current) == null || n.wrapper.focus({ preventScroll: !0 }));
|
|
49
49
|
}, L = () => {
|
|
50
50
|
let e;
|
|
51
|
-
return H.current !== void 0 && H.current !== null ? e = H.current : r.value !== void 0 ? e = r.value : p.value !== void 0 && p.value !== null ? e = p.value : r.defaultValue !== void 0 && r.defaultValue !== null && (e = r.defaultValue), !
|
|
52
|
-
},
|
|
51
|
+
return H.current !== void 0 && H.current !== null ? e = H.current : r.value !== void 0 ? e = r.value : p.value !== void 0 && p.value !== null ? e = p.value : r.defaultValue !== void 0 && r.defaultValue !== null && (e = r.defaultValue), !it(e) && r.defaultItem !== void 0 && r.defaultItem !== null && (e = r.defaultItem), e;
|
|
52
|
+
}, ft = () => {
|
|
53
53
|
const { dataItemKey: e } = r, n = P(D), a = L();
|
|
54
54
|
return n.findIndex((c) => N(c, a, e));
|
|
55
|
-
},
|
|
56
|
-
const e = r.validationMessage !== void 0, n = L(), a = !
|
|
55
|
+
}, ye = () => r.required !== void 0 ? r.required : z.required, we = () => {
|
|
56
|
+
const e = r.validationMessage !== void 0, n = L(), a = !ye() || n !== null && n !== "" && n !== void 0, c = r.valid !== void 0 ? r.valid : a;
|
|
57
57
|
return {
|
|
58
58
|
customError: e,
|
|
59
59
|
valid: c,
|
|
60
60
|
valueMissing: n === null
|
|
61
61
|
};
|
|
62
|
-
},
|
|
62
|
+
}, vt = () => r.validityStyles !== void 0 ? r.validityStyles : z.validityStyles, oe = (e) => {
|
|
63
63
|
ie.current = !0, e.focus(), window.setTimeout(() => ie.current = !1, 30);
|
|
64
64
|
}, xe = () => {
|
|
65
65
|
R.current && oe(R.current), r.adaptive && setTimeout(() => {
|
|
66
66
|
R.current && oe(R.current);
|
|
67
67
|
}, 300);
|
|
68
|
-
},
|
|
68
|
+
}, gt = i.useCallback((e) => {
|
|
69
69
|
for (const n of e)
|
|
70
|
-
|
|
70
|
+
Tt(n.target.clientWidth);
|
|
71
71
|
}, []), Ae = () => {
|
|
72
72
|
var e;
|
|
73
73
|
(e = Ee.current) != null && e.setCustomValidity && Ee.current.setCustomValidity(
|
|
74
|
-
|
|
74
|
+
we().valid ? "" : r.validationMessage || yn
|
|
75
75
|
);
|
|
76
76
|
}, q = (e, n) => {
|
|
77
77
|
const a = L();
|
|
@@ -85,7 +85,7 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
85
85
|
q(o, n), d && ((s = t == null ? void 0 : t.current) == null || s.triggerPageChangeCornerItems(o, n));
|
|
86
86
|
}, A = (e, n, a) => {
|
|
87
87
|
var I, h;
|
|
88
|
-
const { defaultItem: c, dataItemKey: u, virtual: m = { skip: 0, total: 0, pageSize: 0 } } = r, v = L(), f = P(D), o = (I = t == null ? void 0 : t.current) == null ? void 0 : I.vs, d = f.findIndex((
|
|
88
|
+
const { defaultItem: c, dataItemKey: u, virtual: m = { skip: 0, total: 0, pageSize: 0 } } = r, v = L(), f = P(D), o = (I = t == null ? void 0 : t.current) == null ? void 0 : I.vs, d = f.findIndex((y) => N(y, v, u)), s = (h = t == null ? void 0 : t.current) == null ? void 0 : h.navigation.navigate({
|
|
89
89
|
current: m.skip + d,
|
|
90
90
|
max: (o != null && o.enabled ? m.total : f.length) - 1,
|
|
91
91
|
min: c !== void 0 ? -1 : 0,
|
|
@@ -93,9 +93,9 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
93
93
|
skipItems: a || void 0
|
|
94
94
|
});
|
|
95
95
|
s !== void 0 && X(s, e), K(e);
|
|
96
|
-
},
|
|
96
|
+
}, ht = (e) => {
|
|
97
97
|
Z.current = e, t.current.wrapper = e;
|
|
98
|
-
},
|
|
98
|
+
}, It = (e) => /* @__PURE__ */ i.createElement(
|
|
99
99
|
"select",
|
|
100
100
|
{
|
|
101
101
|
name: r.name,
|
|
@@ -117,7 +117,7 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
117
117
|
filterable: u,
|
|
118
118
|
skipDisabledItems: m = !0
|
|
119
119
|
} = r, v = L(), f = P(D), o = r.filter ? r.filter : p.text;
|
|
120
|
-
return m && e && !o && !v ? f.findIndex((d) => !d.disabled && d[e]) :
|
|
120
|
+
return m && e && !o && !v ? f.findIndex((d) => !d.disabled && d[e]) : it(v) && o === void 0 || u && o === "" ? f.findIndex((d) => N(d, v, n)) : o ? ke.current ? c(f, o, e) : f.findIndex((d) => N(d, v, n)) : a.skip === 0 ? 0 : -1;
|
|
121
121
|
}, He = (e, n) => n !== void 0 && n !== -1 && e && e.length > 0 && e[n].disabled, Se = () => {
|
|
122
122
|
const e = P(D), n = t.current.initState(), a = De();
|
|
123
123
|
He(e, a) && (q(null, n), K(n));
|
|
@@ -127,7 +127,7 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
127
127
|
const n = t.current.initState();
|
|
128
128
|
n.syntheticEvent = e, p.focused || (n.data.focused = !0), Se(), t.current.togglePopup(n), K(n);
|
|
129
129
|
}, Ve = (e) => {
|
|
130
|
-
var O, pe, _, me, j,
|
|
130
|
+
var O, pe, _, me, j, tt, nt;
|
|
131
131
|
e && e.target instanceof Element && e.target.nodeName === "INPUT" && e.stopPropagation && e.stopPropagation();
|
|
132
132
|
const {
|
|
133
133
|
filterable: n,
|
|
@@ -139,33 +139,33 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
139
139
|
groupField: f = "",
|
|
140
140
|
textField: o,
|
|
141
141
|
skipDisabledItems: d = !0
|
|
142
|
-
} = r, s = P(D), I = L(), h = s.findIndex((C) => N(C, I, v)),
|
|
142
|
+
} = r, s = P(D), I = L(), h = s.findIndex((C) => N(C, I, v)), y = r.opened !== void 0 ? r.opened : p.opened, l = e.keyCode, T = l === w.home || l === w.end, M = l === w.up || l === w.down, $ = !y && (e.altKey && l === w.down || l === w.enter || l === w.space), re = y && (e.altKey && l === w.up || l === w.esc), ce = u && (l === w.left || l === w.right), ue = M || ce && !n || T, S = t.current.initState();
|
|
143
143
|
if (S.syntheticEvent = e, !a) {
|
|
144
144
|
if (T && ((O = t == null ? void 0 : t.current) != null && O.vs.enabled))
|
|
145
|
-
l ===
|
|
145
|
+
l === w.home ? m.skip !== 0 ? ((pe = t == null ? void 0 : t.current) == null || pe.triggerOnPageChange(S, 0, m.pageSize), V.current = !0) : q(s[0], S) : m.skip < m.total - m.pageSize ? ((_ = t == null ? void 0 : t.current) == null || _.triggerOnPageChange(
|
|
146
146
|
S,
|
|
147
147
|
m.total - m.pageSize,
|
|
148
148
|
m.pageSize
|
|
149
149
|
), V.current = !0) : q(s[s.length - 1], S);
|
|
150
|
-
else if (
|
|
150
|
+
else if (y && l === w.pageUp)
|
|
151
151
|
e.preventDefault(), (me = t == null ? void 0 : t.current) == null || me.scrollPopupByPageSize(-1);
|
|
152
|
-
else if (
|
|
152
|
+
else if (y && l === w.pageDown)
|
|
153
153
|
e.preventDefault(), (j = t == null ? void 0 : t.current) == null || j.scrollPopupByPageSize(1);
|
|
154
|
-
else if (
|
|
154
|
+
else if (y && l === w.enter) {
|
|
155
155
|
const C = De();
|
|
156
|
-
He(s, C) ? (q(null, S), K(S)) : X(C, S), (
|
|
156
|
+
He(s, C) ? (q(null, S), K(S)) : X(C, S), (tt = t == null ? void 0 : t.current) == null || tt.togglePopup(S), e.preventDefault();
|
|
157
157
|
} else if ($ || re)
|
|
158
|
-
re && Se(), (
|
|
158
|
+
re && Se(), (nt = t == null ? void 0 : t.current) == null || nt.togglePopup(S), e.preventDefault();
|
|
159
159
|
else if (ue) {
|
|
160
160
|
if (ke.current = !1, f !== "" && o)
|
|
161
|
-
if (!d &&
|
|
161
|
+
if (!d && y)
|
|
162
162
|
A(S, l);
|
|
163
163
|
else {
|
|
164
164
|
let C;
|
|
165
|
-
if (l ===
|
|
165
|
+
if (l === w.down || l === w.right) {
|
|
166
166
|
const x = s.slice(h + 1).find((g) => !g.disabled && g[o]);
|
|
167
167
|
C = x && s.findIndex((g) => g[o] === x[o]);
|
|
168
|
-
} else if (l ===
|
|
168
|
+
} else if (l === w.up || l === w.left) {
|
|
169
169
|
let x;
|
|
170
170
|
if (h === 0 && c)
|
|
171
171
|
C = -1;
|
|
@@ -184,14 +184,14 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
184
184
|
A(S, l, x);
|
|
185
185
|
} else C === void 0 && s.findIndex((x) => x[o] === I[o]) === s.length - 1 && A(S, l);
|
|
186
186
|
}
|
|
187
|
-
else if (!d &&
|
|
187
|
+
else if (!d && y || T)
|
|
188
188
|
A(S, l);
|
|
189
189
|
else if (o) {
|
|
190
190
|
let C;
|
|
191
|
-
if (l ===
|
|
191
|
+
if (l === w.down || l === w.right) {
|
|
192
192
|
const x = s.slice(h + 1).find((g) => !g.disabled && g[o]);
|
|
193
193
|
C = x && s.findIndex((g) => g[o] === x[o]);
|
|
194
|
-
} else if (l ===
|
|
194
|
+
} else if (l === w.up || l === w.left) {
|
|
195
195
|
let x;
|
|
196
196
|
if (h === 0 && c)
|
|
197
197
|
C = -1;
|
|
@@ -233,7 +233,7 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
233
233
|
renderListFilterWrapper: !0
|
|
234
234
|
}
|
|
235
235
|
);
|
|
236
|
-
},
|
|
236
|
+
}, wt = (e) => {
|
|
237
237
|
var a;
|
|
238
238
|
const n = t.current.initState();
|
|
239
239
|
n.syntheticEvent = e, (a = t == null ? void 0 : t.current) == null || a.togglePopup(n), q(r.defaultItem, n), K(n);
|
|
@@ -246,13 +246,13 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
246
246
|
textField: e,
|
|
247
247
|
selected: N(c, n, a),
|
|
248
248
|
key: "defaultitemkey",
|
|
249
|
-
onClick:
|
|
249
|
+
onClick: wt
|
|
250
250
|
}
|
|
251
251
|
);
|
|
252
|
-
},
|
|
252
|
+
}, xt = (e, n) => {
|
|
253
253
|
var a;
|
|
254
254
|
(a = t == null ? void 0 : t.current) == null || a.handleItemClick(e, n), H.current = void 0;
|
|
255
|
-
},
|
|
255
|
+
}, Dt = (e) => {
|
|
256
256
|
const { vs: n, list: a } = t.current;
|
|
257
257
|
n.scrollHandler(e);
|
|
258
258
|
const { groupField: c } = r;
|
|
@@ -274,7 +274,7 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
274
274
|
groupHeaderItemRender: c,
|
|
275
275
|
listNoDataRender: u,
|
|
276
276
|
itemRender: m
|
|
277
|
-
} = r, v = P(D), f = F && F.uDropDownList, o = t.current.vs, d = a.skip, s = r.opened !== void 0 ? r.opened : p.opened, I = t.current.getPopupSettings(), h = `translateY(${o.translate}px)`,
|
|
277
|
+
} = r, v = P(D), f = F && F.uDropDownList, o = t.current.vs, d = a.skip, s = r.opened !== void 0 ? r.opened : p.opened, I = t.current.getPopupSettings(), h = `translateY(${o.translate}px)`, y = L();
|
|
278
278
|
return /* @__PURE__ */ i.createElement(
|
|
279
279
|
dn,
|
|
280
280
|
{
|
|
@@ -282,7 +282,7 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
282
282
|
show: s,
|
|
283
283
|
data: v.slice(),
|
|
284
284
|
focusedIndex: De(),
|
|
285
|
-
value:
|
|
285
|
+
value: y,
|
|
286
286
|
textField: e,
|
|
287
287
|
valueField: n,
|
|
288
288
|
optionsGuid: je,
|
|
@@ -294,24 +294,24 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
294
294
|
listStyle: o.enabled ? { transform: h } : void 0,
|
|
295
295
|
key: "listkey",
|
|
296
296
|
skip: d,
|
|
297
|
-
onClick:
|
|
297
|
+
onClick: xt,
|
|
298
298
|
itemRender: m,
|
|
299
299
|
groupHeaderItemRender: c,
|
|
300
300
|
noDataRender: u,
|
|
301
|
-
onScroll:
|
|
301
|
+
onScroll: Dt,
|
|
302
302
|
wrapperRef: o.scrollerRef,
|
|
303
303
|
scroller: (l = t == null ? void 0 : t.current) == null ? void 0 : l.renderScrollElement(),
|
|
304
304
|
ariaSetSize: a.total
|
|
305
305
|
}
|
|
306
306
|
);
|
|
307
|
-
},
|
|
307
|
+
}, St = () => {
|
|
308
308
|
var h;
|
|
309
309
|
const { header: e, footer: n, adaptiveTitle: a, groupField: c, groupStickyHeaderItemRender: u, list: m } = r, v = P(D), f = r.opened !== void 0 ? r.opened : p.opened, o = F && F.uDropDownList, d = F && F.uDropDownsActionSheet, s = {
|
|
310
310
|
navigatable: !1,
|
|
311
311
|
navigatableElements: [],
|
|
312
312
|
expand: f,
|
|
313
313
|
animation: !0,
|
|
314
|
-
onClose: (
|
|
314
|
+
onClose: (y) => Ce(y),
|
|
315
315
|
className: E(
|
|
316
316
|
J.wrapper({
|
|
317
317
|
c: d
|
|
@@ -323,7 +323,7 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
323
323
|
};
|
|
324
324
|
let { group: I } = p;
|
|
325
325
|
return I === void 0 && c !== void 0 && (I = fe(v[0], c)), /* @__PURE__ */ i.createElement(gn, { ...s }, /* @__PURE__ */ i.createElement(hn, { className: E(J.header({ c: d })) }, /* @__PURE__ */ i.createElement("div", { className: E(J.titleBar({ c: d })) }, /* @__PURE__ */ i.createElement("div", { className: E(J.title({ c: d })) }, /* @__PURE__ */ i.createElement("div", null, a)), /* @__PURE__ */ i.createElement("div", { className: E(J.actions({ c: d })) }, /* @__PURE__ */ i.createElement(
|
|
326
|
-
|
|
326
|
+
lt,
|
|
327
327
|
{
|
|
328
328
|
tabIndex: 0,
|
|
329
329
|
"aria-label": "Cancel",
|
|
@@ -347,7 +347,7 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
347
347
|
},
|
|
348
348
|
We(),
|
|
349
349
|
!m && I && v.length !== 0 && /* @__PURE__ */ i.createElement(
|
|
350
|
-
|
|
350
|
+
ot,
|
|
351
351
|
{
|
|
352
352
|
group: I,
|
|
353
353
|
groupMode: "modern",
|
|
@@ -356,14 +356,14 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
356
356
|
),
|
|
357
357
|
_e()
|
|
358
358
|
), n && /* @__PURE__ */ i.createElement("div", { className: E(b.listFooter({ c: o })) }, n)));
|
|
359
|
-
},
|
|
359
|
+
}, Ct = () => {
|
|
360
360
|
p.focused && window.setTimeout(() => {
|
|
361
361
|
p.focused && t.current.wrapper && oe(t.current.wrapper);
|
|
362
362
|
});
|
|
363
|
-
},
|
|
363
|
+
}, Et = (e) => {
|
|
364
364
|
var n;
|
|
365
365
|
(n = r.popupSettings) != null && n.onMouseDownOutside && r.popupSettings.onMouseDownOutside.call(void 0, e);
|
|
366
|
-
},
|
|
366
|
+
}, kt = () => {
|
|
367
367
|
const { header: e, footer: n, dir: a, groupField: c, groupStickyHeaderItemRender: u, list: m } = r, v = P(D), f = t.current, o = f.getPopupSettings(), d = r.opened !== void 0 ? r.opened : p.opened, s = o.width !== void 0 ? o.width : f.popupWidth, I = F && F.uDropDownList, h = {
|
|
368
368
|
dir: a !== void 0 ? a : f.dirCalculated,
|
|
369
369
|
width: s,
|
|
@@ -378,13 +378,13 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
378
378
|
anchor: o.anchor || Z.current,
|
|
379
379
|
show: d,
|
|
380
380
|
onOpen: xe,
|
|
381
|
-
onClose:
|
|
382
|
-
onMouseDownOutside:
|
|
381
|
+
onClose: Ct,
|
|
382
|
+
onMouseDownOutside: Et
|
|
383
383
|
},
|
|
384
384
|
itemsCount: [v.length]
|
|
385
385
|
};
|
|
386
|
-
let { group:
|
|
387
|
-
return
|
|
386
|
+
let { group: y } = p;
|
|
387
|
+
return y === void 0 && c !== void 0 && (y = fe(v[0], c)), /* @__PURE__ */ i.createElement(an, { ...h }, Be(), e && /* @__PURE__ */ i.createElement("div", { className: E(b.listHeader({ c: I })) }, e), /* @__PURE__ */ i.createElement(
|
|
388
388
|
"div",
|
|
389
389
|
{
|
|
390
390
|
className: E(
|
|
@@ -396,10 +396,10 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
396
396
|
)
|
|
397
397
|
},
|
|
398
398
|
We(),
|
|
399
|
-
!m &&
|
|
399
|
+
!m && y && v.length !== 0 && /* @__PURE__ */ i.createElement(ot, { group: y, groupMode: "modern", render: u }),
|
|
400
400
|
_e()
|
|
401
401
|
), n && /* @__PURE__ */ i.createElement("div", { className: E(b.listFooter({ c: I })) }, n), ze && /* @__PURE__ */ i.createElement(tn, null));
|
|
402
|
-
},
|
|
402
|
+
}, Lt = (e) => {
|
|
403
403
|
const { dataItemKey: n } = r, a = P(D), c = L();
|
|
404
404
|
let u = a.map((M, $) => ({ item: M, itemIndex: $ }));
|
|
405
405
|
const m = U.current.word, v = U.current.last, f = un(m, v);
|
|
@@ -408,10 +408,10 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
408
408
|
a.findIndex((M) => N(M, c, n))
|
|
409
409
|
), s;
|
|
410
410
|
r.defaultItem && (s = { item: r.defaultItem, itemIndex: -1 }, o += 1, d += 1), d += f ? 1 : 0, u = pn(u, d, s);
|
|
411
|
-
let I, h,
|
|
411
|
+
let I, h, y, l = 0;
|
|
412
412
|
const { textField: T } = r;
|
|
413
413
|
for (; l < o; ) {
|
|
414
|
-
if (I = fe(u[l].item, T), h = f &&
|
|
414
|
+
if (I = fe(u[l].item, T), h = f && at(I, v, ge), y = at(I, m, ge), h || y) {
|
|
415
415
|
l = u[l].itemIndex;
|
|
416
416
|
break;
|
|
417
417
|
}
|
|
@@ -421,24 +421,24 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
421
421
|
const M = t.current.initState();
|
|
422
422
|
M.syntheticEvent = e, X(l, M), K(M), H.current = void 0;
|
|
423
423
|
}
|
|
424
|
+
}, bt = (e) => {
|
|
425
|
+
clearTimeout(Ue.current), r.filterable || (Ue.current = window.setTimeout(() => U.current.word = "", ut), Lt(e));
|
|
424
426
|
}, Pt = (e) => {
|
|
425
|
-
clearTimeout(Ue.current), r.filterable || (Ue.current = window.setTimeout(() => U.current.word = "", pt), bt(e));
|
|
426
|
-
}, Mt = (e) => {
|
|
427
427
|
ie.current || t.current.handleFocus(e);
|
|
428
|
-
},
|
|
428
|
+
}, Mt = (e) => {
|
|
429
429
|
if (ie.current || !p.focused)
|
|
430
430
|
return;
|
|
431
431
|
const n = r.opened !== void 0 ? r.opened : p.opened, a = t.current.initState();
|
|
432
432
|
a.syntheticEvent = e, a.data.focused = !1, a.events.push({ type: "onBlur" }), n && Se(), n && !Fe && t.current.togglePopup(a), K(a);
|
|
433
|
-
},
|
|
434
|
-
if (r.filterable || e.which === 0 || e.keyCode ===
|
|
433
|
+
}, Nt = (e) => {
|
|
434
|
+
if (r.filterable || e.which === 0 || e.keyCode === w.enter)
|
|
435
435
|
return;
|
|
436
436
|
let n = String.fromCharCode(e.charCode || e.keyCode);
|
|
437
437
|
ge && (n = n.toLowerCase()), n === " " && e.preventDefault(), U.current = {
|
|
438
438
|
word: U.current.word + n,
|
|
439
439
|
last: U.current.last + n
|
|
440
|
-
},
|
|
441
|
-
},
|
|
440
|
+
}, bt(e);
|
|
441
|
+
}, Ft = () => {
|
|
442
442
|
const e = t.current.initState();
|
|
443
443
|
e.data.opened = p.opened, t.current.togglePopup(e), K(e);
|
|
444
444
|
}, qe = i.useRef(null), Z = i.useRef(null), Ee = i.useRef(), R = i.useRef(null);
|
|
@@ -449,13 +449,13 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
449
449
|
return Z.current;
|
|
450
450
|
},
|
|
451
451
|
get index() {
|
|
452
|
-
return
|
|
452
|
+
return ft();
|
|
453
453
|
},
|
|
454
454
|
get name() {
|
|
455
455
|
return r.name;
|
|
456
456
|
},
|
|
457
457
|
get validity() {
|
|
458
|
-
return
|
|
458
|
+
return we();
|
|
459
459
|
},
|
|
460
460
|
get value() {
|
|
461
461
|
return L();
|
|
@@ -466,16 +466,16 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
466
466
|
get opened() {
|
|
467
467
|
return p.opened;
|
|
468
468
|
},
|
|
469
|
-
focus:
|
|
469
|
+
focus: mt,
|
|
470
470
|
props: r,
|
|
471
|
-
togglePopup:
|
|
471
|
+
togglePopup: Ft
|
|
472
472
|
})
|
|
473
473
|
), i.useImperativeHandle(
|
|
474
|
-
|
|
474
|
+
ct,
|
|
475
475
|
() => qe.current
|
|
476
476
|
);
|
|
477
477
|
const Ue = i.useRef(null), U = i.useRef({ word: "", last: "" }), ie = i.useRef(!1), H = i.useRef(null), V = i.useRef(!1), ke = i.useRef(!1), B = i.useRef({}), Le = i.useRef({}), t = i.useRef(
|
|
478
|
-
new
|
|
478
|
+
new dt({
|
|
479
479
|
props: D,
|
|
480
480
|
setState: () => {
|
|
481
481
|
},
|
|
@@ -487,8 +487,8 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
487
487
|
handleItemSelect: () => {
|
|
488
488
|
}
|
|
489
489
|
})
|
|
490
|
-
), Ge = i.useRef(0), ee = i.useRef(null), [p,
|
|
491
|
-
|
|
490
|
+
), Ge = i.useRef(0), ee = i.useRef(null), [p, Kt] = i.useState({}), [G, Tt] = i.useState(), [, Ye] = i.useReducer((e) => e, !0), zt = fn(), te = (e) => {
|
|
491
|
+
Kt({ ...p, ...e });
|
|
492
492
|
};
|
|
493
493
|
i.useEffect(() => {
|
|
494
494
|
t.current.updateComponentArgs({
|
|
@@ -501,14 +501,14 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
501
501
|
value: L()
|
|
502
502
|
});
|
|
503
503
|
}, [te, p, Ye, X, L]), i.useEffect(() => {
|
|
504
|
-
var d, s, I, h,
|
|
504
|
+
var d, s, I, h, y, l, T, M, $, re, ce, ue, S;
|
|
505
505
|
const { dataItemKey: e, virtual: n, groupField: a = "", textField: c } = r, u = P(D), m = B.current.virtual ? B.current.virtual.total : 0, v = r.opened !== void 0 ? r.opened : p.opened, f = B.current.opened !== void 0 ? B.current.opened : Le.current.opened, o = !f && v;
|
|
506
506
|
if ((d = t == null ? void 0 : t.current) == null || d.didUpdate(), (s = t == null ? void 0 : t.current) != null && s.getPopupSettings().animate || o && xe(), n && n.total !== m)
|
|
507
507
|
(I = t == null ? void 0 : t.current) == null || I.vs.calcScrollElementHeight(), (h = t == null ? void 0 : t.current) == null || h.vs.reset();
|
|
508
508
|
else {
|
|
509
509
|
const O = L(), pe = B.current.value !== void 0 ? B.current.value : Le.current.value;
|
|
510
510
|
let _ = u.findIndex((j) => N(j, O, e));
|
|
511
|
-
a !== "" && O && c && (_ = (l = (
|
|
511
|
+
a !== "" && O && c && (_ = (l = (y = t == null ? void 0 : t.current) == null ? void 0 : y.getGroupedDataModernMode(u, a)) == null ? void 0 : l.map((j) => j[c]).indexOf(O[c]));
|
|
512
512
|
const me = !N(pe, O, e);
|
|
513
513
|
o && n ? (T = t == null ? void 0 : t.current) == null || T.scrollToVirtualItem(n, _) : o && !n ? (xe(), u && u.length !== 0 && ((M = t == null ? void 0 : t.current) == null || M.resetGroupStickyHeader(u[0][a], {
|
|
514
514
|
setState: te,
|
|
@@ -519,35 +519,35 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
519
519
|
V.current = !1, Le.current = p, B.current = r, Ae();
|
|
520
520
|
}), i.useEffect(() => {
|
|
521
521
|
var e, n;
|
|
522
|
-
return ee.current =
|
|
522
|
+
return ee.current = rt && window.ResizeObserver && new window.ResizeObserver(gt.bind(void 0)), (e = t == null ? void 0 : t.current) == null || e.didMount(), Ae(), (n = Ie()) != null && n.body && ee.current && ee.current.observe(Ie().body), () => {
|
|
523
523
|
var a;
|
|
524
524
|
(a = Ie()) != null && a.body && ee.current && ee.current.disconnect();
|
|
525
525
|
};
|
|
526
526
|
}, []);
|
|
527
|
-
const $e = ve + "-accessibility-id", be = ve + "-listbox-id", je = ve + "-guid",
|
|
528
|
-
|
|
529
|
-
vn[
|
|
527
|
+
const $e = ve + "-accessibility-id", be = ve + "-listbox-id", je = ve + "-guid", Ot = zt.toLanguageString(
|
|
528
|
+
st,
|
|
529
|
+
vn[st]
|
|
530
530
|
), {
|
|
531
531
|
style: ae,
|
|
532
|
-
className:
|
|
532
|
+
className: At,
|
|
533
533
|
label: Pe,
|
|
534
|
-
dir:
|
|
534
|
+
dir: Ht,
|
|
535
535
|
virtual: W,
|
|
536
536
|
adaptive: Dn,
|
|
537
|
-
dataItemKey:
|
|
537
|
+
dataItemKey: Vt,
|
|
538
538
|
disabled: le,
|
|
539
539
|
loading: Je,
|
|
540
540
|
iconClassName: Qe,
|
|
541
|
-
svgIcon:
|
|
542
|
-
valueRender:
|
|
543
|
-
} = r, Me = r.opened !== void 0 ? r.opened : p.opened, se = L(), Ne = fe(se, r.textField),
|
|
541
|
+
svgIcon: Bt,
|
|
542
|
+
valueRender: Xe
|
|
543
|
+
} = r, Me = r.opened !== void 0 ? r.opened : p.opened, se = L(), Ne = fe(se, r.textField), Ze = !vt() || we().valid, de = t.current, Wt = de.vs, ne = F && F.uDropDownList;
|
|
544
544
|
Wt.enabled = W !== void 0;
|
|
545
545
|
const Y = Qt(), Fe = !!(G && Y && G <= Y.medium && D.adaptive);
|
|
546
546
|
W !== void 0 && (de.vs.skip = W.skip, de.vs.total = W.total, de.vs.pageSize = W.pageSize);
|
|
547
|
-
const _t = P(D), { focused: qt } = p, Ut = _t.findIndex((e) => N(e, se,
|
|
547
|
+
const _t = P(D), { focused: qt } = p, Ut = _t.findIndex((e) => N(e, se, Vt)), Re = /* @__PURE__ */ i.createElement("span", { id: $e, className: E(b.inputInner({ c: ne })) }, Ne && /* @__PURE__ */ i.createElement("span", { className: E(b.inputText({ c: ne })) }, Ne)), Gt = Xe !== void 0 ? Xe.call(void 0, Re, se) : Re, et = /* @__PURE__ */ i.createElement(i.Fragment, null, /* @__PURE__ */ i.createElement(
|
|
548
548
|
"span",
|
|
549
549
|
{
|
|
550
|
-
ref:
|
|
550
|
+
ref: ht,
|
|
551
551
|
className: E(
|
|
552
552
|
b.wrapper({
|
|
553
553
|
c: ne,
|
|
@@ -556,26 +556,26 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
556
556
|
fillMode: he,
|
|
557
557
|
focused: qt,
|
|
558
558
|
disabled: le,
|
|
559
|
-
invalid: !
|
|
559
|
+
invalid: !Ze,
|
|
560
560
|
loading: Je,
|
|
561
|
-
required:
|
|
561
|
+
required: ye()
|
|
562
562
|
}),
|
|
563
|
-
|
|
563
|
+
At
|
|
564
564
|
),
|
|
565
565
|
style: Pe ? { ...ae, width: void 0 } : ae,
|
|
566
|
-
dir:
|
|
566
|
+
dir: Ht,
|
|
567
567
|
onMouseDown: Me ? (e) => {
|
|
568
568
|
e.target.nodeName !== "INPUT" && (oe(t.current.wrapper), e.preventDefault());
|
|
569
569
|
} : void 0,
|
|
570
|
-
onFocus:
|
|
571
|
-
onBlur:
|
|
572
|
-
tabIndex: Xt(
|
|
570
|
+
onFocus: Pt,
|
|
571
|
+
onBlur: Mt,
|
|
572
|
+
tabIndex: Xt(pt, le),
|
|
573
573
|
accessKey: r.accessKey,
|
|
574
574
|
onKeyDown: Ve,
|
|
575
|
-
onKeyPress:
|
|
575
|
+
onKeyPress: Nt,
|
|
576
576
|
onClick: le ? void 0 : Ce,
|
|
577
577
|
role: "combobox",
|
|
578
|
-
"aria-required":
|
|
578
|
+
"aria-required": ye(),
|
|
579
579
|
"aria-disabled": le || void 0,
|
|
580
580
|
"aria-haspopup": "listbox",
|
|
581
581
|
"aria-expanded": Me || !1,
|
|
@@ -591,36 +591,35 @@ const wn = "Please select a value from the list!", Te = i.forwardRef((D, ut) =>
|
|
|
591
591
|
Gt,
|
|
592
592
|
Je && /* @__PURE__ */ i.createElement(Zt, { className: E(b.loadingIcon({ c: ne })), name: "loading" }),
|
|
593
593
|
/* @__PURE__ */ i.createElement(
|
|
594
|
-
|
|
594
|
+
lt,
|
|
595
595
|
{
|
|
596
596
|
tabIndex: -1,
|
|
597
597
|
type: "button",
|
|
598
|
-
"aria-label":
|
|
598
|
+
"aria-label": Ot,
|
|
599
599
|
size: Q,
|
|
600
600
|
fillMode: he,
|
|
601
|
-
iconClass: Qe,
|
|
602
601
|
className: E(b.inputButton({ c: ne })),
|
|
603
602
|
rounded: null,
|
|
604
603
|
themeColor: "base",
|
|
605
|
-
|
|
606
|
-
svgIcon:
|
|
604
|
+
iconClass: Qe,
|
|
605
|
+
svgIcon: Qe ? void 0 : Bt || rn,
|
|
607
606
|
onMouseDown: (e) => p.focused && e.preventDefault()
|
|
608
607
|
}
|
|
609
608
|
),
|
|
610
|
-
|
|
611
|
-
!Fe &&
|
|
612
|
-
), Fe &&
|
|
609
|
+
It(se),
|
|
610
|
+
!Fe && kt()
|
|
611
|
+
), Fe && St());
|
|
613
612
|
return Pe ? /* @__PURE__ */ i.createElement(
|
|
614
613
|
nn,
|
|
615
614
|
{
|
|
616
615
|
label: Pe,
|
|
617
616
|
editorValue: Ne,
|
|
618
|
-
editorValid:
|
|
617
|
+
editorValid: Ze,
|
|
619
618
|
editorDisabled: r.disabled,
|
|
620
619
|
style: { width: ae ? ae.width : void 0 },
|
|
621
|
-
children:
|
|
620
|
+
children: et
|
|
622
621
|
}
|
|
623
|
-
) :
|
|
622
|
+
) : et;
|
|
624
623
|
});
|
|
625
624
|
Te.propTypes = {
|
|
626
625
|
delay: k.number,
|
|
@@ -646,7 +645,7 @@ const z = {
|
|
|
646
645
|
delay: 500,
|
|
647
646
|
tabIndex: 0,
|
|
648
647
|
ignoreCase: !0,
|
|
649
|
-
...
|
|
648
|
+
...dt.defaultProps,
|
|
650
649
|
required: !1,
|
|
651
650
|
size: "medium",
|
|
652
651
|
rounded: "medium",
|
|
@@ -654,10 +653,10 @@ const z = {
|
|
|
654
653
|
groupMode: "modern"
|
|
655
654
|
};
|
|
656
655
|
Te.displayName = "KendoReactDropDownList";
|
|
657
|
-
const
|
|
656
|
+
const wn = en();
|
|
658
657
|
Te.displayName = "KendoReactDropDownList";
|
|
659
658
|
export {
|
|
660
659
|
Te as DropDownList,
|
|
661
|
-
|
|
660
|
+
wn as DropDownListPropsContext,
|
|
662
661
|
z as dropDownListDefaultProps
|
|
663
662
|
};
|