@progress/kendo-react-dropdowns 7.5.0-develop.2 → 7.5.0-develop.3

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.
@@ -8,7 +8,7 @@
8
8
  "use client";
9
9
  import * as t from "react";
10
10
  import n from "prop-types";
11
- import { createPropsContext as Xe, validatePackage as Ye, usePropsContext as Ze, useId as et, getTabIndex as tt, useRtl as nt, canUseDOM as ot, Keys as c, noop as U, mapTree as at, extendDataItem as rt, classNames as ne, IconWrap as xe, kendoThemeMaps as it } from "@progress/kendo-react-common";
11
+ import { createPropsContext as Xe, validatePackage as Ye, usePropsContext as Ze, useId as et, getTabIndex as tt, useRtl as nt, canUseDOM as at, Keys as c, noop as U, mapTree as ot, extendDataItem as rt, classNames as oe, IconWrap as xe, kendoThemeMaps as it } from "@progress/kendo-react-common";
12
12
  import { Popup as lt } from "@progress/kendo-react-popup";
13
13
  import { useLocalization as st } from "@progress/kendo-react-intl";
14
14
  import { TreeView as we } from "@progress/kendo-react-treeview";
@@ -16,7 +16,7 @@ import { packageMetadata as ct } from "../package-metadata.mjs";
16
16
  import { getItemValue as ut, areSame as Fe, isPresent as dt } from "../common/utils.mjs";
17
17
  import { useDropdownWidth as pt } from "./useDropdownWidth.mjs";
18
18
  import { ListNoData as ft } from "./ListNoData.mjs";
19
- import { clear as De, messages as oe, nodata as j } from "../messages/index.mjs";
19
+ import { clear as De, messages as re, nodata as j } from "../messages/index.mjs";
20
20
  import { FloatingLabel as mt } from "@progress/kendo-react-labels";
21
21
  import Ie from "../common/ListFilter.mjs";
22
22
  import { Button as vt } from "@progress/kendo-react-buttons";
@@ -24,12 +24,12 @@ import { xIcon as gt, caretAltDownIcon as bt } from "@progress/kendo-svg-icons";
24
24
  import { AdaptiveMode as ht } from "../common/AdaptiveMode.mjs";
25
25
  import { ActionSheetContent as yt } from "@progress/kendo-react-layout";
26
26
  import { MOBILE_MEDIUM_DEVISE as Et } from "../common/constants.mjs";
27
- const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the list!", wt = (y) => /* @__PURE__ */ t.createElement("span", { className: "k-input-value-text" }, y.children), Se = (y) => y.split("_").map((F) => parseInt(F, 10)), Ft = (y, F) => {
28
- const { validationMessage: r, valid: a, required: G } = y;
27
+ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the list!", wt = (E) => /* @__PURE__ */ t.createElement("span", { className: "k-input-value-text" }, E.children), Se = (E) => E.split("_").map((D) => parseInt(D, 10)), Ft = (E, D) => {
28
+ const { validationMessage: r, valid: o, required: G } = E;
29
29
  return {
30
30
  customError: r !== void 0,
31
- valid: !!(a !== void 0 ? a : !G || F),
32
- valueMissing: !F
31
+ valid: !!(o !== void 0 ? o : !G || D),
32
+ valueMissing: !D
33
33
  };
34
34
  }, Me = {
35
35
  selectField: "selected",
@@ -46,51 +46,51 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
46
46
  size: "medium",
47
47
  rounded: "medium",
48
48
  fillMode: "solid"
49
- }, Dt = Xe(), Re = t.forwardRef((y, F) => {
49
+ }, Dt = Xe(), Re = t.forwardRef((E, D) => {
50
50
  Ye(ct);
51
- const r = Ze(Dt, y), a = {
51
+ const r = Ze(Dt, E), o = {
52
52
  ...Me,
53
53
  ...r
54
- }, G = et(), ae = a.id || G, {
54
+ }, G = et(), ie = o.id || G, {
55
55
  data: T,
56
56
  dataItemKey: N,
57
- popupSettings: D = {},
57
+ popupSettings: b = {},
58
58
  style: P,
59
59
  opened: u,
60
60
  disabled: I,
61
61
  onOpen: V = U,
62
62
  onClose: f = U,
63
- placeholder: re,
63
+ placeholder: J,
64
64
  label: O,
65
65
  name: Te,
66
66
  selectField: z,
67
67
  subItemsField: K,
68
68
  validationMessage: H,
69
69
  valid: Ne,
70
- required: J,
70
+ required: Q,
71
71
  validityStyles: Pe
72
- } = a, Q = tt(a.tabIndex, I), i = t.useRef(null), m = t.useRef(null), S = t.useRef(null), X = t.useRef(null), _ = t.useRef(null), b = t.useRef(null), $ = t.useRef(!1), [ie, Ve] = t.useState(void 0), E = a.value !== void 0, v = E ? a.value : ie !== void 0 ? ie : a.defaultValue, B = dt(v), le = B ? ut(v, a.textField) : "", Y = Ft({ validationMessage: H, valid: Ne, required: J }, B), Oe = t.useCallback(() => m.current && m.current.focus(), []);
72
+ } = o, X = tt(o.tabIndex, I), i = t.useRef(null), m = t.useRef(null), S = t.useRef(null), Y = t.useRef(null), _ = t.useRef(null), h = t.useRef(null), $ = t.useRef(!1), [le, Ve] = t.useState(void 0), C = o.value !== void 0, v = C ? o.value : le !== void 0 ? le : o.defaultValue, L = dt(v), Z = L ? ut(v, o.textField) : "", ee = Ft({ validationMessage: H, valid: Ne, required: Q }, L), Oe = t.useCallback(() => m.current && m.current.focus(), []);
73
73
  t.useImperativeHandle(
74
74
  i,
75
75
  () => ({
76
- props: a,
76
+ props: o,
77
77
  element: m.current,
78
78
  focus: Oe
79
79
  })
80
- ), t.useImperativeHandle(F, () => i.current);
81
- const C = nt(m, a.dir), Ke = {
82
- width: pt(m, Me, D, P),
83
- ...C !== void 0 ? { direction: C } : {}
84
- }, [Be, se] = t.useState(!1), l = u !== void 0 ? u : Be, [d, Z] = t.useState(!1), [ee, Le] = t.useState(), k = !!(ee && ee <= Et && a.adaptive), [ce, qe] = t.useState(""), We = t.useCallback(
80
+ ), t.useImperativeHandle(D, () => i.current);
81
+ const k = nt(m, o.dir), Ke = {
82
+ width: pt(m, Me, b, P),
83
+ ...k !== void 0 ? { direction: k } : {}
84
+ }, [Le, se] = t.useState(!1), l = u !== void 0 ? u : Le, [d, te] = t.useState(!1), [ne, Be] = t.useState(), x = !!(ne && ne <= Et && o.adaptive), [ce, We] = t.useState(""), qe = t.useCallback(
85
85
  () => {
86
86
  _.current && _.current.setCustomValidity && _.current.setCustomValidity(
87
- Y.valid ? "" : H === void 0 ? xt : H
87
+ ee.valid ? "" : H === void 0 ? xt : H
88
88
  );
89
89
  },
90
- [H, Y]
90
+ [H, ee]
91
91
  );
92
- t.useEffect(We), t.useEffect(() => {
93
- const e = ot && window.ResizeObserver && new window.ResizeObserver(Je.bind(void 0));
92
+ t.useEffect(qe), t.useEffect(() => {
93
+ const e = at && window.ResizeObserver && new window.ResizeObserver(Je.bind(void 0));
94
94
  return document != null && document.body && e && e.observe(document.body), () => {
95
95
  document != null && document.body && e && e.disconnect();
96
96
  };
@@ -99,37 +99,37 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
99
99
  (e) => {
100
100
  if (!l) {
101
101
  if (V) {
102
- const o = { ...e };
103
- V.call(void 0, o);
102
+ const a = { ...e };
103
+ V.call(void 0, a);
104
104
  }
105
105
  u === void 0 && se(!0);
106
106
  }
107
107
  },
108
108
  [l, u, V]
109
- ), x = t.useCallback(
109
+ ), w = t.useCallback(
110
110
  (e) => {
111
111
  if (l) {
112
112
  if (f) {
113
- const o = { ...e };
114
- f.call(void 0, o);
113
+ const a = { ...e };
114
+ f.call(void 0, a);
115
115
  }
116
- u === void 0 && (se(!1), k && setTimeout(() => {
117
- var o;
118
- g((o = X.current) == null ? void 0 : o.element);
116
+ u === void 0 && (se(!1), x && setTimeout(() => {
117
+ var a;
118
+ g((a = Y.current) == null ? void 0 : a.element);
119
119
  }, 300));
120
120
  }
121
121
  },
122
- [l, u, f, k]
122
+ [l, u, f, x]
123
123
  ), Ae = t.useCallback(
124
124
  (e) => {
125
125
  if (!e.isDefaultPrevented() && i.current) {
126
- Z(!0);
127
- const o = {
126
+ te(!0);
127
+ const a = {
128
128
  syntheticEvent: e,
129
129
  nativeEvent: e.nativeEvent,
130
130
  target: i.current
131
131
  };
132
- (l ? x : ue)(o);
132
+ (l ? w : ue)(a);
133
133
  }
134
134
  },
135
135
  [l, u, V, f]
@@ -140,9 +140,9 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
140
140
  []
141
141
  ), ze = t.useCallback(
142
142
  (e) => {
143
- var w, Ce;
144
- const { keyCode: o, altKey: s } = e, p = b.current && b.current.element;
145
- if (!i.current || e.isDefaultPrevented() && ((w = S.current) == null ? void 0 : w.element) === e.target)
143
+ var F, Ce;
144
+ const { keyCode: a, altKey: s } = e, p = h.current && h.current.element;
145
+ if (!i.current || e.isDefaultPrevented() && ((F = S.current) == null ? void 0 : F.element) === e.target)
146
146
  return;
147
147
  const R = {
148
148
  syntheticEvent: e,
@@ -150,12 +150,12 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
150
150
  target: i.current
151
151
  };
152
152
  if (l)
153
- if (o === c.esc || s && o === c.up)
154
- e.preventDefault(), x(R);
155
- else if (p && p.querySelector(".k-focus") && (o === c.up || o === c.down || o === c.left || o === c.right || o === c.home || o === c.end)) {
156
- if (o === c.up && ((Ce = S.current) != null && Ce.element)) {
157
- const W = Array.from(p.querySelectorAll(".k-treeview-item")), ke = [...W].reverse().find((A) => !!(A && A.querySelector(".k-focus")));
158
- if (ke && W.indexOf(ke) === 0)
153
+ if (a === c.esc || s && a === c.up)
154
+ e.preventDefault(), w(R);
155
+ else if (p && p.querySelector(".k-focus") && (a === c.up || a === c.down || a === c.left || a === c.right || a === c.home || a === c.end)) {
156
+ if (a === c.up && ((Ce = S.current) != null && Ce.element)) {
157
+ const q = Array.from(p.querySelectorAll(".k-treeview-item")), ke = [...q].reverse().find((A) => !!(A && A.querySelector(".k-focus")));
158
+ if (ke && q.indexOf(ke) === 0)
159
159
  return M(() => {
160
160
  var A;
161
161
  g((A = S.current) == null ? void 0 : A.element);
@@ -163,22 +163,22 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
163
163
  }
164
164
  M(U);
165
165
  } else
166
- o === c.down && M(() => {
167
- var W;
168
- g(((W = S.current) == null ? void 0 : W.element) || p);
166
+ a === c.down && M(() => {
167
+ var q;
168
+ g(((q = S.current) == null ? void 0 : q.element) || p);
169
169
  });
170
170
  else
171
- s && o === c.down ? (e.preventDefault(), ue(R)) : l || o === c.esc && me(e);
171
+ s && a === c.down ? (e.preventDefault(), ue(R)) : l || a === c.esc && me(e);
172
172
  },
173
173
  [l, u, V, f]
174
174
  ), de = t.useCallback(
175
175
  (e) => {
176
- const { keyCode: o, altKey: s } = e;
177
- s || o !== c.up && o !== c.down || (e.preventDefault(), M(
178
- o === c.up ? () => {
176
+ const { keyCode: a, altKey: s } = e;
177
+ s || a !== c.up && a !== c.down || (e.preventDefault(), M(
178
+ a === c.up ? () => {
179
179
  g(m.current);
180
180
  } : () => {
181
- g(b.current && b.current.element);
181
+ g(h.current && h.current.element);
182
182
  }
183
183
  ));
184
184
  },
@@ -191,7 +191,7 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
191
191
  ), He = t.useCallback(
192
192
  () => {
193
193
  var e;
194
- !d && l && !u ? x({ target: i.current }) : r.filterable ? g((e = S.current) == null ? void 0 : e.element) : g(b.current && b.current.element);
194
+ !d && l && !u ? w({ target: i.current }) : r.filterable ? g((e = S.current) == null ? void 0 : e.element) : g(h.current && h.current.element);
195
195
  },
196
196
  [f, r.filterable, d, u, l]
197
197
  ), _e = t.useCallback(
@@ -201,89 +201,89 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
201
201
  [d]
202
202
  ), $e = t.useCallback(
203
203
  (e) => {
204
- if (!d && !$.current && (Z(!0), r.onFocus && i.current)) {
205
- const o = {
204
+ if (!d && !$.current && (te(!0), r.onFocus && i.current)) {
205
+ const a = {
206
206
  syntheticEvent: e,
207
207
  nativeEvent: e.nativeEvent,
208
208
  target: i.current
209
209
  };
210
- r.onFocus.call(void 0, o);
210
+ r.onFocus.call(void 0, a);
211
211
  }
212
212
  },
213
213
  [d, r.onFocus]
214
214
  ), Ue = t.useCallback(
215
215
  (e) => {
216
216
  if (d && !$.current && i.current) {
217
- Z(!1);
218
- const o = {
217
+ te(!1);
218
+ const a = {
219
219
  syntheticEvent: e,
220
220
  nativeEvent: e.nativeEvent,
221
221
  target: i.current
222
222
  };
223
223
  if (r.onBlur) {
224
- const s = { ...o };
224
+ const s = { ...a };
225
225
  r.onBlur.call(void 0, s);
226
226
  }
227
- k || x(o);
227
+ x || w(a);
228
228
  }
229
229
  },
230
230
  [d, r.onBlur, l, u, f]
231
231
  ), je = t.useCallback(
232
232
  () => {
233
- d && M(U), k && setTimeout(() => {
233
+ d && M(U), x && setTimeout(() => {
234
234
  var e;
235
- g((e = X.current) == null ? void 0 : e.element);
235
+ g((e = Y.current) == null ? void 0 : e.element);
236
236
  }, 300);
237
237
  },
238
- [d, k]
238
+ [d, x]
239
239
  ), pe = t.useCallback(
240
- (e, o, s) => {
240
+ (e, a, s) => {
241
241
  if (r.onChange) {
242
242
  const p = {
243
- value: o,
243
+ value: a,
244
244
  level: s ? Se(s) : [],
245
245
  ...e
246
246
  };
247
247
  r.onChange.call(void 0, p);
248
248
  }
249
- E || Ve(o);
249
+ C || Ve(a);
250
250
  },
251
- [r.onChange, E]
251
+ [r.onChange, C]
252
252
  ), fe = t.useCallback(
253
253
  (e) => {
254
254
  if (Fe(e.item, v, N) || !i.current)
255
255
  return;
256
- const { item: o, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: R } = e, w = {
256
+ const { item: a, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: R } = e, F = {
257
257
  syntheticEvent: R,
258
258
  nativeEvent: p,
259
259
  target: i.current
260
260
  };
261
- pe(w, o, s), x(w);
261
+ pe(F, a, s), w(F);
262
262
  },
263
- [E, v, r.onChange, N, l, u, f]
263
+ [C, v, r.onChange, N, l, u, f]
264
264
  ), me = t.useCallback(
265
265
  (e) => {
266
266
  if (!i.current)
267
267
  return;
268
- const o = {
268
+ const a = {
269
269
  syntheticEvent: e,
270
270
  nativeEvent: e.nativeEvent,
271
271
  target: i.current
272
272
  };
273
- pe(o, null), x(o), e.preventDefault();
273
+ pe(a, null), w(a), e.preventDefault();
274
274
  },
275
- [E, r.onChange, l, u, f]
275
+ [C, r.onChange, l, u, f]
276
276
  ), ve = t.useCallback(
277
277
  (e) => {
278
278
  if (e.syntheticEvent.stopPropagation(), r.onExpandChange && i.current) {
279
- const { item: o, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: R } = e, w = {
279
+ const { item: a, itemHierarchicalIndex: s, nativeEvent: p, syntheticEvent: R } = e, F = {
280
280
  level: Se(s),
281
- item: o,
281
+ item: a,
282
282
  nativeEvent: p,
283
283
  syntheticEvent: R,
284
284
  target: i.current
285
285
  };
286
- r.onExpandChange.call(void 0, w);
286
+ r.onExpandChange.call(void 0, F);
287
287
  }
288
288
  },
289
289
  [r.onExpandChange]
@@ -296,56 +296,57 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
296
296
  nativeEvent: e.nativeEvent,
297
297
  target: i.current
298
298
  };
299
- r.onFilterChange.call(void 0, s), r.filter === void 0 && qe(e.target.value);
299
+ r.onFilterChange.call(void 0, s), r.filter === void 0 && We(e.target.value);
300
300
  }
301
301
  },
302
302
  [r.onFilterChange, r.filter, r.textField]
303
303
  ), Ge = () => {
304
- const e = a.filterable ? /* @__PURE__ */ t.createElement(
304
+ const e = o.filterable ? /* @__PURE__ */ t.createElement(
305
305
  Ie,
306
306
  {
307
- value: a.filter === void 0 ? ce : a.filter,
308
- ref: X,
307
+ value: o.filter === void 0 ? ce : o.filter,
308
+ ref: Y,
309
309
  onChange: ge,
310
310
  onKeyDown: de,
311
- size: h,
312
- rounded: L,
313
- fillMode: q
311
+ size: y,
312
+ rounded: B,
313
+ fillMode: W
314
314
  }
315
- ) : null, o = {
316
- adaptiveTitle: a.adaptiveTitle,
315
+ ) : null, a = {
316
+ adaptiveTitle: o.adaptiveTitle,
317
317
  expand: l,
318
- onClose: (s) => x(s),
319
- windowWidth: ee,
318
+ onClose: (s) => w(s),
319
+ windowWidth: ne,
320
320
  mobileFilter: e
321
321
  };
322
- return /* @__PURE__ */ t.createElement(ht, { ...o }, /* @__PURE__ */ t.createElement(yt, { className: "!k-overflow-hidden" }, /* @__PURE__ */ t.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ t.createElement("div", { className: "k-list k-list-lg" }, T.length > 0 ? /* @__PURE__ */ t.createElement(
322
+ return /* @__PURE__ */ t.createElement(ht, { ...a }, /* @__PURE__ */ t.createElement(yt, { className: "!k-overflow-hidden" }, /* @__PURE__ */ t.createElement("div", { className: "k-list-container" }, /* @__PURE__ */ t.createElement("div", { className: "k-list k-list-lg" }, T.length > 0 ? /* @__PURE__ */ t.createElement(
323
323
  we,
324
324
  {
325
- ref: b,
326
- tabIndex: Q,
325
+ ref: h,
326
+ tabIndex: X,
327
327
  data: be,
328
328
  focusIdField: N,
329
- textField: a.textField,
329
+ textField: o.textField,
330
330
  selectField: z,
331
- expandField: a.expandField,
331
+ expandField: o.expandField,
332
332
  childrenField: K,
333
333
  expandIcons: !0,
334
334
  onItemClick: fe,
335
335
  onExpandChange: ve,
336
- size: h,
337
- item: a.item,
338
- dir: C
336
+ size: y,
337
+ item: o.item,
338
+ dir: k,
339
+ animate: b.animate
339
340
  }
340
- ) : /* @__PURE__ */ t.createElement(he, null, te.toLanguageString(j, oe[j]))))));
341
+ ) : /* @__PURE__ */ t.createElement(he, null, ae.toLanguageString(j, re[j]))))));
341
342
  }, Je = t.useCallback(
342
343
  (e) => {
343
- for (let o of e)
344
- Le(o.target.clientWidth);
344
+ for (let a of e)
345
+ Be(a.target.clientWidth);
345
346
  },
346
347
  []
347
348
  ), be = t.useMemo(
348
- () => E || !B ? T : at(
349
+ () => C || !L ? T : ot(
349
350
  T,
350
351
  K,
351
352
  (e) => rt(
@@ -354,25 +355,25 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
354
355
  { [z]: Fe(e, v, N) }
355
356
  )
356
357
  ),
357
- [T, v, E, B, z, K]
358
- ), he = a.listNoData || ft, Qe = a.valueHolder || wt, te = st(), ye = !Pe || Y.valid, { size: h, rounded: L, fillMode: q } = a, Ee = /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
358
+ [T, v, C, L, z, K]
359
+ ), he = o.listNoData || ft, Qe = o.valueHolder || wt, ae = st(), ye = !Pe || ee.valid, { size: y, rounded: B, fillMode: W } = o, Ee = /* @__PURE__ */ t.createElement(t.Fragment, null, /* @__PURE__ */ t.createElement(
359
360
  "span",
360
361
  {
361
- className: ne("k-dropdowntree k-picker", a.className, {
362
- [`k-picker-${Ct[h] || h}`]: h,
363
- [`k-rounded-${kt[L] || L}`]: L,
364
- [`k-picker-${q}`]: q,
362
+ className: oe("k-dropdowntree k-picker", o.className, {
363
+ [`k-picker-${Ct[y] || y}`]: y,
364
+ [`k-rounded-${kt[B] || B}`]: B,
365
+ [`k-picker-${W}`]: W,
365
366
  "k-focus": d,
366
367
  "k-invalid": !ye,
367
- "k-loading": a.loading,
368
- "k-required": J,
369
- "k-disabled": a.disabled
368
+ "k-loading": o.loading,
369
+ "k-required": Q,
370
+ "k-disabled": o.disabled
370
371
  }),
371
- tabIndex: Q,
372
- accessKey: a.accessKey,
373
- id: ae,
372
+ tabIndex: X,
373
+ accessKey: o.accessKey,
374
+ id: ie,
374
375
  style: O ? { ...P, width: void 0 } : P,
375
- dir: C,
376
+ dir: k,
376
377
  ref: m,
377
378
  onKeyDown: I ? void 0 : ze,
378
379
  onMouseDown: je,
@@ -384,18 +385,18 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
384
385
  "aria-expanded": l,
385
386
  "aria-disabled": I,
386
387
  "aria-label": O,
387
- "aria-labelledby": a.ariaLabelledBy,
388
- "aria-describedby": a.ariaDescribedBy,
389
- "aria-required": J
388
+ "aria-labelledby": o.ariaLabelledBy,
389
+ "aria-describedby": o.ariaDescribedBy,
390
+ "aria-required": Q
390
391
  },
391
- /* @__PURE__ */ t.createElement("span", { className: "k-input-inner" }, /* @__PURE__ */ t.createElement(Qe, { item: v }, le || re)),
392
- a.loading && /* @__PURE__ */ t.createElement(xe, { className: "k-input-loading-icon", name: "loading" }),
393
- B && !I && /* @__PURE__ */ t.createElement(
392
+ /* @__PURE__ */ t.createElement("span", { className: "k-input-inner" }, (Z || J) && /* @__PURE__ */ t.createElement(Qe, { item: v }, Z || J)),
393
+ o.loading && /* @__PURE__ */ t.createElement(xe, { className: "k-input-loading-icon", name: "loading" }),
394
+ L && !I && /* @__PURE__ */ t.createElement(
394
395
  "span",
395
396
  {
396
397
  onClick: me,
397
398
  className: "k-clear-value",
398
- title: te.toLanguageString(De, oe[De]),
399
+ title: ae.toLanguageString(De, re[De]),
399
400
  role: "button",
400
401
  tabIndex: -1,
401
402
  onMouseDown: (e) => e.preventDefault()
@@ -409,8 +410,8 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
409
410
  type: "button",
410
411
  "aria-label": "select",
411
412
  className: "k-input-button",
412
- size: h,
413
- fillMode: q,
413
+ size: y,
414
+ fillMode: W,
414
415
  themeColor: "base",
415
416
  rounded: null,
416
417
  icon: "caret-alt-down",
@@ -427,66 +428,69 @@ const { sizeMap: Ct, roundedMap: kt } = it, xt = "Please select a value from the
427
428
  title: O,
428
429
  style: { opacity: 0, width: 1, border: 0, zIndex: -1, position: "absolute", left: "50%" }
429
430
  },
430
- /* @__PURE__ */ t.createElement("option", { value: a.valueMap ? a.valueMap.call(void 0, v) : v })
431
+ /* @__PURE__ */ t.createElement("option", { value: o.valueMap ? o.valueMap.call(void 0, v) : v })
431
432
  ),
432
- !k && /* @__PURE__ */ t.createElement(
433
+ !x && /* @__PURE__ */ t.createElement(
433
434
  lt,
434
435
  {
435
- ...D,
436
- className: ne(D.className, { "k-rtl": C === "rtl" }),
437
- popupClass: ne(D.popupClass, "k-dropdowntree-popup"),
436
+ ...b,
437
+ className: oe(b.className, { "k-rtl": k === "rtl" }),
438
+ popupClass: oe(b.popupClass, "k-dropdowntree-popup k-list-container"),
438
439
  style: Ke,
439
- anchor: D.anchor || m.current,
440
+ anchor: b.anchor || m.current,
440
441
  show: l,
441
442
  onOpen: He,
442
443
  onClose: _e
443
444
  },
444
- a.filterable && /* @__PURE__ */ t.createElement(
445
+ o.filterable && /* @__PURE__ */ t.createElement(
445
446
  Ie,
446
447
  {
447
- value: a.filter === void 0 ? ce : a.filter,
448
+ value: o.filter === void 0 ? ce : o.filter,
448
449
  ref: S,
449
450
  onChange: ge,
450
451
  onKeyDown: de,
451
- size: h,
452
- rounded: L,
453
- fillMode: q
452
+ size: y,
453
+ rounded: B,
454
+ fillMode: W,
455
+ renderListFilterWrapper: !0,
456
+ renderPrefixSeparator: !0
454
457
  }
455
458
  ),
456
459
  T.length > 0 ? /* @__PURE__ */ t.createElement(
457
460
  we,
458
461
  {
459
- style: { height: D.height },
460
- ref: b,
461
- tabIndex: Q,
462
+ style: { height: b.height },
463
+ ref: h,
464
+ tabIndex: X,
462
465
  data: be,
463
466
  focusIdField: N,
464
- textField: a.textField,
467
+ textField: o.textField,
465
468
  selectField: z,
466
- expandField: a.expandField,
469
+ expandField: o.expandField,
467
470
  childrenField: K,
468
471
  expandIcons: !0,
469
472
  onItemClick: fe,
470
473
  onExpandChange: ve,
471
- size: h,
472
- item: a.item,
473
- dir: C
474
+ size: y,
475
+ item: o.item,
476
+ dir: k,
477
+ animate: b.animate
474
478
  }
475
- ) : /* @__PURE__ */ t.createElement(he, null, te.toLanguageString(j, oe[j]))
479
+ ) : /* @__PURE__ */ t.createElement(he, null, ae.toLanguageString(j, re[j]))
476
480
  )
477
- ), k && Ge());
481
+ ), x && Ge());
478
482
  return O ? /* @__PURE__ */ t.createElement(
479
483
  mt,
480
484
  {
481
485
  label: O,
482
- editorValue: le,
483
- editorPlaceholder: re,
486
+ editorValue: Z,
487
+ editorPlaceholder: J,
484
488
  editorValid: ye,
485
489
  editorDisabled: I,
486
- editorId: ae,
490
+ editorId: ie,
487
491
  style: { width: P ? P.width : void 0 },
488
492
  children: Ee,
489
- dir: C
493
+ dir: k
490
494
  }
491
495
  ) : Ee;
492
496
  }), It = {
@@ -5,4 +5,4 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Ze=require("react"),a=require("prop-types"),i=require("@progress/kendo-react-common"),et=require("@progress/kendo-react-popup"),tt=require("@progress/kendo-react-intl"),we=require("@progress/kendo-react-treeview"),nt=require("../package-metadata.js"),ee=require("../common/utils.js"),at=require("../DropDownTree/useDropdownWidth.js"),st=require("../DropDownTree/ListNoData.js"),m=require("../messages/index.js"),it=require("@progress/kendo-react-labels"),ot=require("../MultiSelect/TagList.js"),rt=require("../common/ClearButton.js"),Ie=require("../common/ListFilter.js"),lt=require("../common/AdaptiveMode.js"),ct=require("@progress/kendo-react-layout"),ut=require("../common/constants.js");function dt(h){const b=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const t in h)if(t!=="default"){const w=Object.getOwnPropertyDescriptor(h,t);Object.defineProperty(b,t,w.get?w:{enumerable:!0,get:()=>h[t]})}}return b.default=h,Object.freeze(b)}const n=dt(Ze),pt="Please select a value from the list!",{sizeMap:Te,roundedMap:ft}=i.kendoThemeMaps,gt=h=>h.split("_").map(b=>parseInt(b,10)),vt=(h,b)=>{const{validationMessage:t,valid:w,required:I}=h;return{customError:t!==void 0,valid:!!(w!==void 0?w:!I||b),valueMissing:!b}},q={checkField:"checkField",checkIndeterminateField:"checkIndeterminateField",subItemsField:"items",popupSettings:{animate:!0,width:"200px",height:"200px"},size:"medium",rounded:"medium",fillMode:"solid",required:!1,validityStyles:!0},Ke=i.createPropsContext(),te=n.forwardRef((h,b)=>{const t=i.usePropsContext(Ke,h);i.validatePackage(nt.packageMetadata);const w=i.useId(),I=t.id||w,{data:B=[],dataItemKey:T,popupSettings:N={},style:L={},opened:K,disabled:F,onOpen:ne=i.noop,onClose:W=i.noop,placeholder:ue,label:V,name:Me,checkField:de=q.checkField,checkIndeterminateField:pe=q.checkIndeterminateField,subItemsField:fe=q.subItemsField,validationMessage:z,valid:Re,tags:ge,value:g,required:ve=q.required,validityStyles:De=q.validityStyles}=t,_=i.getTabIndex(t.tabIndex,F),r=n.useRef(null),E=n.useRef(null),M=n.useRef(null),ae=n.useRef(null),j=n.useRef(null),x=n.useRef(null),$=n.useRef(!1),H=n.useRef([]),G=n.useRef(null),[O,qe]=n.useState(),[Ne,me]=n.useState(!1),[d,se]=n.useState(!1),[ie,Oe]=n.useState(),[Pe,Le]=n.useState([]),[he,Ve]=n.useState(""),P=!!(ie&&ie<=ut.MOBILE_MEDIUM_DEVISE&&t.adaptive),l=K!==void 0?K:Ne,oe=!!(Array.isArray(g)&&g.length),re=vt({validationMessage:z,valid:Re,required:ve},oe),R=i.useRtl(E,t.dir),Ae={width:at.useDropdownWidth(E,q,N,L),...R!==void 0?{direction:R}:{}},Be=n.useCallback(()=>E.current&&E.current.focus(),[]);H.current=ge===void 0?(g||[]).map(e=>({text:ee.getItemValue(e,t.textField),data:[e]})):[...ge],n.useImperativeHandle(r,()=>({props:t,element:E.current,focus:Be})),n.useImperativeHandle(b,()=>r.current);const We=n.useCallback(()=>{j.current&&j.current.setCustomValidity&&j.current.setCustomValidity(re.valid?"":z===void 0?pt:z)},[z,re]);n.useEffect(We),n.useEffect(()=>{const e=i.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(Xe.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{e&&e.disconnect()}},[]),n.useEffect(()=>{G.current&&l&&G.current.setPosition(G.current._popup)},[g,l]);const S=n.useCallback((e,s,o)=>{if(t.onChange){const C={items:s,operation:o,...e};t.onChange.call(void 0,C)}},[t.onChange]),U=n.useCallback(e=>{if(ee.areSame(e.item,g,T)||!r.current)return;const{item:s,nativeEvent:o,syntheticEvent:C}=e,D={syntheticEvent:C,nativeEvent:o,target:r.current};S(D,[s],"toggle")},[g,T,S]),J=n.useCallback(e=>{if(!l){if(ne){const s={...e};ne.call(void 0,s)}K===void 0&&(me(!0),Le(g||[]),P&&setTimeout(()=>{var s;u((s=ae.current)==null?void 0:s.element)},300))}},[l,K,ne,P,ae]),v=n.useCallback(e=>{if(l){if(W){const s={...e};W.call(void 0,s)}K===void 0&&me(!1)}},[l,K,W]),k=n.useCallback(e=>{$.current=!0,e(),window.setTimeout(()=>$.current=!1,0)},[]),u=n.useCallback(e=>{e&&k(()=>e.focus())},[k]),ze=n.useCallback(()=>{var e;!d&&l?v({target:r.current}):t.filterable?u((e=M.current)==null?void 0:e.element):u(x.current&&x.current.element)},[d,l,u,v,t.filterable]),_e=n.useCallback(()=>{d&&u(E.current)},[d,u]),je=n.useCallback(e=>{if(!d&&!$.current&&(se(!0),t.onFocus&&r.current)){const s={syntheticEvent:e,nativeEvent:e.nativeEvent,target:r.current};t.onFocus.call(void 0,s)}},[d,t.onFocus]),$e=n.useCallback(e=>{if(d&&!$.current&&r.current){se(!1);const s={syntheticEvent:e,nativeEvent:e.nativeEvent,target:r.current};if(t.onBlur){const o={...s};t.onBlur.call(void 0,o)}P||v(s)}},[d,t.onBlur,l,K,W]),He=n.useCallback(()=>{d&&k(i.noop)},[d,k]),Ge=n.useCallback(e=>{if(!e.isDefaultPrevented()&&r.current){se(!0);const s={syntheticEvent:e,nativeEvent:e.nativeEvent,target:r.current};l||J(s)}},[l,J]),Ue=n.useCallback(e=>{var Z,Se;const{keyCode:s,altKey:o}=e,C=x.current&&x.current.element;if(!r.current||e.isDefaultPrevented()&&((Z=M.current)==null?void 0:Z.element)===e.target)return;const D={syntheticEvent:e,nativeEvent:e.nativeEvent,target:r.current};if(g&&g.length>0&&(s===i.Keys.left||s===i.Keys.right||s===i.Keys.home||s===i.Keys.end||s===i.Keys.delete)){const c=H.current;let p=O?c.findIndex(Ye=>ee.matchTags(Ye,O,T)):-1,f;const ce=p!==-1;s===i.Keys.left?(ce?p=Math.max(0,p-1):p=c.length-1,f=c[p]):s===i.Keys.right?p===c.length-1?f=void 0:ce&&(p=Math.min(c.length-1,p+1),f=c[p]):s===i.Keys.home?f=c[0]:s===i.Keys.end?f=c[c.length-1]:s===i.Keys.delete&&ce&&S(D,c[p].data,"delete"),f!==O&&qe(f)}if(l)if(s===i.Keys.esc||o&&s===i.Keys.up)e.preventDefault(),v(D);else if(C&&C.querySelector(".k-focus")&&(s===i.Keys.up||s===i.Keys.down||s===i.Keys.left||s===i.Keys.right||s===i.Keys.home||s===i.Keys.end)){if(s===i.Keys.up&&((Se=M.current)!=null&&Se.element)){const c=Array.from(C.querySelectorAll(".k-treeview-item")),p=[...c].reverse().find(f=>!!(f&&f.querySelector(".k-focus")));if(p&&c.indexOf(p)===0)return k(()=>{var f;u((f=M.current)==null?void 0:f.element)})}k(i.noop)}else s===i.Keys.down&&k(()=>{var c;u(((c=M.current)==null?void 0:c.element)||C)});else o&&s===i.Keys.down&&(e.preventDefault(),J(D))},[l,v,u,k,J,O,T,g,S]),ye=n.useCallback(e=>{const{keyCode:s,altKey:o}=e;o||s!==i.Keys.up&&s!==i.Keys.down||(e.preventDefault(),k(s===i.Keys.up?()=>{u(E.current)}:()=>{u(x.current&&x.current.element)}))},[u,k]),le=n.useCallback(e=>{if(!r.current)return;const s={syntheticEvent:e,nativeEvent:e.nativeEvent,target:r.current};S(s,[],"clear"),v(s),e.preventDefault()},[S,v]),Je=n.useCallback((e,s)=>{var o;v({target:r.current}),d||u((o=M.current)==null?void 0:o.element),S({syntheticEvent:s,nativeEvent:s.nativeEvent,target:r.current},e,"delete")},[S,v,u,d]),be=n.useCallback(e=>{if(t.onExpandChange&&r.current){const{item:s,itemHierarchicalIndex:o,nativeEvent:C,syntheticEvent:D}=e,Z={level:gt(o),item:s,nativeEvent:C,syntheticEvent:D,target:r.current};t.onExpandChange.call(void 0,Z)}},[t.onExpandChange]),ke=n.useCallback(e=>{if(t.onFilterChange&&r.current){const o={filter:{field:t.textField,operator:"contains",value:e.target.value},syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,target:r.current};t.onFilterChange.call(void 0,o),t.filter===void 0&&Ve(e.target.value)}},[t.onFilterChange,t.filter,t.textField]),Ce=n.useCallback(e=>{if(!r.current)return;const s={syntheticEvent:e,nativeEvent:e.nativeEvent,target:r.current};t.onCancel&&t.onCancel.call(void 0,s),v(s),e.preventDefault()},[t.onCancel,v]),Qe=()=>{const e=t.filterable?n.createElement(Ie,{value:t.filter===void 0?he:t.filter,ref:ae,onChange:ke,onKeyDown:ye,size:y,rounded:A,fillMode:X}):null,s={adaptiveTitle:t.adaptiveTitle,expand:l,onClose:o=>t.onCancel?Ce(o):le(o),windowWidth:ie,mobileFilter:e,footer:{cancelText:Q.toLanguageString(m.adaptiveModeFooterCancel,m.messages[m.adaptiveModeFooterCancel]),onCancel:o=>t.onCancel?Ce(o):le(o),applyText:Q.toLanguageString(m.adaptiveModeFooterApply,m.messages[m.adaptiveModeFooterApply]),onApply:o=>v(o)}};return n.createElement(lt.AdaptiveMode,{...s},n.createElement(ct.ActionSheetContent,{className:"!k-overflow-hidden"},n.createElement("div",{className:"k-list-container"},n.createElement("div",{className:"k-list k-list-lg"},B.length>0?n.createElement(we.TreeView,{ref:x,tabIndex:_,data:B,focusIdField:T,textField:t.textField,checkField:de,checkIndeterminateField:pe,expandField:t.expandField,childrenField:fe,expandIcons:!0,onItemClick:U,onCheckChange:U,onExpandChange:be,checkboxes:!0,size:y,item:t.item,dir:R}):n.createElement(Ee,null,Q.toLanguageString(m.nodata,m.messages[m.nodata]))))))},Xe=n.useCallback(e=>{for(let s of e)Oe(s.target.clientWidth)},[]),Ee=t.listNoData||st.ListNoData,Q=tt.useLocalization(),Fe=!De||re.valid,{size:y,rounded:A,fillMode:X}=t,Y=P&&l?Pe:H.current,xe=n.createElement(n.Fragment,null,n.createElement("span",{className:i.classNames("k-multiselecttree k-input",t.className,{[`k-input-${Te[y]||y}`]:y,[`k-rounded-${ft[A]||A}`]:A,[`k-input-${X}`]:X,"k-focus":d&&!F,"k-invalid":!Fe,"k-disabled":F,"k-loading":t.loading,"k-required":ve}),tabIndex:_,accessKey:t.accessKey,id:I,style:V?{...L,width:void 0}:L,dir:R,ref:E,onKeyDown:F?void 0:Ue,onMouseDown:He,onFocus:je,onBlur:$e,role:"combobox","aria-haspopup":"tree","aria-expanded":l,"aria-disabled":F,"aria-label":V,"aria-labelledby":t.ariaLabelledBy,"aria-describedby":t.ariaDescribedBy?t.ariaDescribedBy:"tagslist-"+I,"aria-required":t.required,onClick:F?void 0:Ge},n.createElement("div",{id:"tagslist-"+I,className:i.classNames("k-input-values k-chip-list k-selection-multiple",{[`k-chip-list-${Te[y]||y}`]:y})},Y.length>0&&n.createElement(ot,{tag:t.tag,onTagDelete:Je,data:Y,guid:I,focused:O?H.current.find(e=>ee.matchTags(e,O,T)):void 0,size:y})),n.createElement("span",{className:"k-input-inner"},Y.length===0&&n.createElement("span",{className:"k-input-value-text"},ue)),t.loading&&n.createElement(i.IconWrap,{className:"k-input-loading-icon",name:"loading"}),oe&&!F&&Y.length>0&&n.createElement(rt,{onClick:le}),n.createElement("select",{name:Me,ref:j,tabIndex:-1,"aria-hidden":!0,title:V,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},n.createElement("option",{value:t.valueMap?t.valueMap.call(void 0,g):g})),!P&&n.createElement(et.Popup,{...N,popupClass:i.classNames(N.popupClass,"k-multiselecttree-popup"),className:i.classNames(N.className,{"k-rtl":R==="rtl"}),style:Ae,anchor:N.anchor||E.current,show:l,onOpen:ze,onClose:_e,ref:G},t.filterable&&n.createElement(Ie,{value:t.filter===void 0?he:t.filter,ref:M,onChange:ke,onKeyDown:ye,tabIndex:_,size:y,rounded:A,fillMode:X}),B.length>0?n.createElement(we.TreeView,{style:{height:N.height},ref:x,tabIndex:_,data:B,focusIdField:T,textField:t.textField,checkField:de,checkIndeterminateField:pe,expandField:t.expandField,childrenField:fe,expandIcons:!0,onItemClick:U,onCheckChange:U,onExpandChange:be,checkboxes:!0,size:y,item:t.item,dir:R}):n.createElement(Ee,null,Q.toLanguageString(m.nodata,m.messages[m.nodata])))),P&&Qe());return V?n.createElement(it.FloatingLabel,{label:V,editorValue:oe,editorPlaceholder:ue,editorValid:Fe,editorDisabled:F,editorId:I,style:{width:L?L.width:void 0},children:xe,dir:R}):xe}),mt={opened:a.bool,disabled:a.bool,dir:a.string,tabIndex:a.number,accessKey:a.string,data:a.array,value:a.any,valueMap:a.func,placeholder:a.string,dataItemKey:a.string.isRequired,textField:a.string.isRequired,checkField:a.string,checkIndeterminateField:a.string,expandField:a.string,subItemsField:a.string,className:a.string,style:a.object,label:a.string,validationMessage:a.string,validityStyles:a.bool,valid:a.bool,required:a.bool,name:a.string,id:a.string,ariaLabelledBy:a.string,ariaDescribedBy:a.string,filterable:a.bool,filter:a.string,loading:a.bool,tags:a.arrayOf(a.shape({text:a.string,data:a.arrayOf(a.any)})),popupSettings:a.shape({animate:a.oneOfType([a.bool,a.shape({openDuration:a.number,closeDuration:a.number})]),popupClass:a.string,className:a.string,appendTo:a.any,width:a.oneOfType([a.string,a.number]),height:a.oneOfType([a.string,a.number])}),onOpen:a.func,onClose:a.func,onFocus:a.func,onBlur:a.func,onChange:a.func,onFilterChange:a.func,onExpandChange:a.func,onCancel:a.func,item:a.func,listNoData:a.func,adaptiveTitle:a.string,adaptive:a.bool};te.displayName="KendoReactMultiSelectTree";te.defaultProps=q;te.propTypes=mt;exports.MultiSelectTree=te;exports.MultiSelectTreePropsContext=Ke;
8
+ "use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const Ze=require("react"),a=require("prop-types"),s=require("@progress/kendo-react-common"),et=require("@progress/kendo-react-popup"),tt=require("@progress/kendo-react-intl"),we=require("@progress/kendo-react-treeview"),nt=require("../package-metadata.js"),ee=require("../common/utils.js"),at=require("../DropDownTree/useDropdownWidth.js"),rt=require("../DropDownTree/ListNoData.js"),m=require("../messages/index.js"),st=require("@progress/kendo-react-labels"),it=require("../MultiSelect/TagList.js"),ot=require("../common/ClearButton.js"),Ie=require("../common/ListFilter.js"),lt=require("../common/AdaptiveMode.js"),ct=require("@progress/kendo-react-layout"),ut=require("../common/constants.js");function dt(h){const b=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(h){for(const t in h)if(t!=="default"){const w=Object.getOwnPropertyDescriptor(h,t);Object.defineProperty(b,t,w.get?w:{enumerable:!0,get:()=>h[t]})}}return b.default=h,Object.freeze(b)}const n=dt(Ze),pt="Please select a value from the list!",{sizeMap:Te,roundedMap:ft}=s.kendoThemeMaps,gt=h=>h.split("_").map(b=>parseInt(b,10)),vt=(h,b)=>{const{validationMessage:t,valid:w,required:I}=h;return{customError:t!==void 0,valid:!!(w!==void 0?w:!I||b),valueMissing:!b}},q={checkField:"checkField",checkIndeterminateField:"checkIndeterminateField",subItemsField:"items",popupSettings:{animate:!0,width:"200px",height:"200px"},size:"medium",rounded:"medium",fillMode:"solid",required:!1,validityStyles:!0},Ke=s.createPropsContext(),te=n.forwardRef((h,b)=>{const t=s.usePropsContext(Ke,h);s.validatePackage(nt.packageMetadata);const w=s.useId(),I=t.id||w,{data:B=[],dataItemKey:T,popupSettings:N={},style:L={},opened:K,disabled:F,onOpen:ne=s.noop,onClose:W=s.noop,placeholder:ue,label:V,name:Me,checkField:de=q.checkField,checkIndeterminateField:pe=q.checkIndeterminateField,subItemsField:fe=q.subItemsField,validationMessage:z,valid:Re,tags:ge,value:g,required:ve=q.required,validityStyles:De=q.validityStyles}=t,_=s.getTabIndex(t.tabIndex,F),o=n.useRef(null),E=n.useRef(null),M=n.useRef(null),ae=n.useRef(null),j=n.useRef(null),x=n.useRef(null),$=n.useRef(!1),H=n.useRef([]),G=n.useRef(null),[P,qe]=n.useState(),[Ne,me]=n.useState(!1),[d,re]=n.useState(!1),[se,Pe]=n.useState(),[Oe,Le]=n.useState([]),[he,Ve]=n.useState(""),O=!!(se&&se<=ut.MOBILE_MEDIUM_DEVISE&&t.adaptive),l=K!==void 0?K:Ne,ie=!!(Array.isArray(g)&&g.length),oe=vt({validationMessage:z,valid:Re,required:ve},ie),R=s.useRtl(E,t.dir),Ae={width:at.useDropdownWidth(E,q,N,L),...R!==void 0?{direction:R}:{}},Be=n.useCallback(()=>E.current&&E.current.focus(),[]);H.current=ge===void 0?(g||[]).map(e=>({text:ee.getItemValue(e,t.textField),data:[e]})):[...ge],n.useImperativeHandle(o,()=>({props:t,element:E.current,focus:Be})),n.useImperativeHandle(b,()=>o.current);const We=n.useCallback(()=>{j.current&&j.current.setCustomValidity&&j.current.setCustomValidity(oe.valid?"":z===void 0?pt:z)},[z,oe]);n.useEffect(We),n.useEffect(()=>{const e=s.canUseDOM&&window.ResizeObserver&&new window.ResizeObserver(Xe.bind(void 0));return document!=null&&document.body&&e&&e.observe(document.body),()=>{e&&e.disconnect()}},[]),n.useEffect(()=>{G.current&&l&&G.current.setPosition(G.current._popup)},[g,l]);const S=n.useCallback((e,r,i)=>{if(t.onChange){const k={items:r,operation:i,...e};t.onChange.call(void 0,k)}},[t.onChange]),U=n.useCallback(e=>{if(ee.areSame(e.item,g,T)||!o.current)return;const{item:r,nativeEvent:i,syntheticEvent:k}=e,D={syntheticEvent:k,nativeEvent:i,target:o.current};S(D,[r],"toggle")},[g,T,S]),J=n.useCallback(e=>{if(!l){if(ne){const r={...e};ne.call(void 0,r)}K===void 0&&(me(!0),Le(g||[]),O&&setTimeout(()=>{var r;u((r=ae.current)==null?void 0:r.element)},300))}},[l,K,ne,O,ae]),v=n.useCallback(e=>{if(l){if(W){const r={...e};W.call(void 0,r)}K===void 0&&me(!1)}},[l,K,W]),C=n.useCallback(e=>{$.current=!0,e(),window.setTimeout(()=>$.current=!1,0)},[]),u=n.useCallback(e=>{e&&C(()=>e.focus())},[C]),ze=n.useCallback(()=>{var e;!d&&l?v({target:o.current}):t.filterable?u((e=M.current)==null?void 0:e.element):u(x.current&&x.current.element)},[d,l,u,v,t.filterable]),_e=n.useCallback(()=>{d&&u(E.current)},[d,u]),je=n.useCallback(e=>{if(!d&&!$.current&&(re(!0),t.onFocus&&o.current)){const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};t.onFocus.call(void 0,r)}},[d,t.onFocus]),$e=n.useCallback(e=>{if(d&&!$.current&&o.current){re(!1);const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};if(t.onBlur){const i={...r};t.onBlur.call(void 0,i)}O||v(r)}},[d,t.onBlur,l,K,W]),He=n.useCallback(()=>{d&&C(s.noop)},[d,C]),Ge=n.useCallback(e=>{if(!e.isDefaultPrevented()&&o.current){re(!0);const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};l||J(r)}},[l,J]),Ue=n.useCallback(e=>{var Z,Se;const{keyCode:r,altKey:i}=e,k=x.current&&x.current.element;if(!o.current||e.isDefaultPrevented()&&((Z=M.current)==null?void 0:Z.element)===e.target)return;const D={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};if(g&&g.length>0&&(r===s.Keys.left||r===s.Keys.right||r===s.Keys.home||r===s.Keys.end||r===s.Keys.delete)){const c=H.current;let p=P?c.findIndex(Ye=>ee.matchTags(Ye,P,T)):-1,f;const ce=p!==-1;r===s.Keys.left?(ce?p=Math.max(0,p-1):p=c.length-1,f=c[p]):r===s.Keys.right?p===c.length-1?f=void 0:ce&&(p=Math.min(c.length-1,p+1),f=c[p]):r===s.Keys.home?f=c[0]:r===s.Keys.end?f=c[c.length-1]:r===s.Keys.delete&&ce&&S(D,c[p].data,"delete"),f!==P&&qe(f)}if(l)if(r===s.Keys.esc||i&&r===s.Keys.up)e.preventDefault(),v(D);else if(k&&k.querySelector(".k-focus")&&(r===s.Keys.up||r===s.Keys.down||r===s.Keys.left||r===s.Keys.right||r===s.Keys.home||r===s.Keys.end)){if(r===s.Keys.up&&((Se=M.current)!=null&&Se.element)){const c=Array.from(k.querySelectorAll(".k-treeview-item")),p=[...c].reverse().find(f=>!!(f&&f.querySelector(".k-focus")));if(p&&c.indexOf(p)===0)return C(()=>{var f;u((f=M.current)==null?void 0:f.element)})}C(s.noop)}else r===s.Keys.down&&C(()=>{var c;u(((c=M.current)==null?void 0:c.element)||k)});else i&&r===s.Keys.down&&(e.preventDefault(),J(D))},[l,v,u,C,J,P,T,g,S]),ye=n.useCallback(e=>{const{keyCode:r,altKey:i}=e;i||r!==s.Keys.up&&r!==s.Keys.down||(e.preventDefault(),C(r===s.Keys.up?()=>{u(E.current)}:()=>{u(x.current&&x.current.element)}))},[u,C]),le=n.useCallback(e=>{if(!o.current)return;const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};S(r,[],"clear"),v(r),e.preventDefault()},[S,v]),Je=n.useCallback((e,r)=>{var i;v({target:o.current}),d||u((i=M.current)==null?void 0:i.element),S({syntheticEvent:r,nativeEvent:r.nativeEvent,target:o.current},e,"delete")},[S,v,u,d]),be=n.useCallback(e=>{if(t.onExpandChange&&o.current){const{item:r,itemHierarchicalIndex:i,nativeEvent:k,syntheticEvent:D}=e,Z={level:gt(i),item:r,nativeEvent:k,syntheticEvent:D,target:o.current};t.onExpandChange.call(void 0,Z)}},[t.onExpandChange]),Ce=n.useCallback(e=>{if(t.onFilterChange&&o.current){const i={filter:{field:t.textField,operator:"contains",value:e.target.value},syntheticEvent:e.syntheticEvent,nativeEvent:e.nativeEvent,target:o.current};t.onFilterChange.call(void 0,i),t.filter===void 0&&Ve(e.target.value)}},[t.onFilterChange,t.filter,t.textField]),ke=n.useCallback(e=>{if(!o.current)return;const r={syntheticEvent:e,nativeEvent:e.nativeEvent,target:o.current};t.onCancel&&t.onCancel.call(void 0,r),v(r),e.preventDefault()},[t.onCancel,v]),Qe=()=>{const e=t.filterable?n.createElement(Ie,{value:t.filter===void 0?he:t.filter,ref:ae,onChange:Ce,onKeyDown:ye,size:y,rounded:A,fillMode:X}):null,r={adaptiveTitle:t.adaptiveTitle,expand:l,onClose:i=>t.onCancel?ke(i):le(i),windowWidth:se,mobileFilter:e,footer:{cancelText:Q.toLanguageString(m.adaptiveModeFooterCancel,m.messages[m.adaptiveModeFooterCancel]),onCancel:i=>t.onCancel?ke(i):le(i),applyText:Q.toLanguageString(m.adaptiveModeFooterApply,m.messages[m.adaptiveModeFooterApply]),onApply:i=>v(i)}};return n.createElement(lt.AdaptiveMode,{...r},n.createElement(ct.ActionSheetContent,{className:"!k-overflow-hidden"},n.createElement("div",{className:"k-list-container"},n.createElement("div",{className:"k-list k-list-lg"},B.length>0?n.createElement(we.TreeView,{ref:x,tabIndex:_,data:B,focusIdField:T,textField:t.textField,checkField:de,checkIndeterminateField:pe,expandField:t.expandField,childrenField:fe,expandIcons:!0,onItemClick:U,onCheckChange:U,onExpandChange:be,checkboxes:!0,size:y,item:t.item,dir:R}):n.createElement(Ee,null,Q.toLanguageString(m.nodata,m.messages[m.nodata]))))))},Xe=n.useCallback(e=>{for(let r of e)Pe(r.target.clientWidth)},[]),Ee=t.listNoData||rt.ListNoData,Q=tt.useLocalization(),Fe=!De||oe.valid,{size:y,rounded:A,fillMode:X}=t,Y=O&&l?Oe:H.current,xe=n.createElement(n.Fragment,null,n.createElement("span",{className:s.classNames("k-multiselecttree k-input",t.className,{[`k-input-${Te[y]||y}`]:y,[`k-rounded-${ft[A]||A}`]:A,[`k-input-${X}`]:X,"k-focus":d&&!F,"k-invalid":!Fe,"k-disabled":F,"k-loading":t.loading,"k-required":ve}),tabIndex:_,accessKey:t.accessKey,id:I,style:V?{...L,width:void 0}:L,dir:R,ref:E,onKeyDown:F?void 0:Ue,onMouseDown:He,onFocus:je,onBlur:$e,role:"combobox","aria-haspopup":"tree","aria-expanded":l,"aria-disabled":F,"aria-label":V,"aria-labelledby":t.ariaLabelledBy,"aria-describedby":t.ariaDescribedBy?t.ariaDescribedBy:"tagslist-"+I,"aria-required":t.required,onClick:F?void 0:Ge},n.createElement("div",{id:"tagslist-"+I,className:s.classNames("k-input-values k-chip-list",{[`k-chip-list-${Te[y]||y}`]:y})},Y.length>0&&n.createElement(it,{tag:t.tag,onTagDelete:Je,data:Y,guid:I,focused:P?H.current.find(e=>ee.matchTags(e,P,T)):void 0,size:y})),n.createElement("span",{className:"k-input-inner"},Y.length===0&&n.createElement("span",{className:"k-input-value-text"},ue)),t.loading&&n.createElement(s.IconWrap,{className:"k-input-loading-icon",name:"loading"}),ie&&!F&&Y.length>0&&n.createElement(ot,{onClick:le}),n.createElement("select",{name:Me,ref:j,tabIndex:-1,"aria-hidden":!0,title:V,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},n.createElement("option",{value:t.valueMap?t.valueMap.call(void 0,g):g})),!O&&n.createElement(et.Popup,{...N,popupClass:s.classNames(N.popupClass,"k-multiselecttree-popup"),className:s.classNames(N.className,{"k-rtl":R==="rtl"}),style:Ae,anchor:N.anchor||E.current,show:l,onOpen:ze,onClose:_e,ref:G},t.filterable&&n.createElement(Ie,{value:t.filter===void 0?he:t.filter,ref:M,onChange:Ce,onKeyDown:ye,tabIndex:_,size:y,rounded:A,fillMode:X,renderListFilterWrapper:!0,renderPrefixSeparator:!0}),B.length>0?n.createElement(we.TreeView,{style:{height:N.height},ref:x,tabIndex:_,data:B,focusIdField:T,textField:t.textField,checkField:de,checkIndeterminateField:pe,expandField:t.expandField,childrenField:fe,expandIcons:!0,onItemClick:U,onCheckChange:U,onExpandChange:be,checkboxes:!0,size:y,item:t.item,dir:R}):n.createElement(Ee,null,Q.toLanguageString(m.nodata,m.messages[m.nodata])))),O&&Qe());return V?n.createElement(st.FloatingLabel,{label:V,editorValue:ie,editorPlaceholder:ue,editorValid:Fe,editorDisabled:F,editorId:I,style:{width:L?L.width:void 0},children:xe,dir:R}):xe}),mt={opened:a.bool,disabled:a.bool,dir:a.string,tabIndex:a.number,accessKey:a.string,data:a.array,value:a.any,valueMap:a.func,placeholder:a.string,dataItemKey:a.string.isRequired,textField:a.string.isRequired,checkField:a.string,checkIndeterminateField:a.string,expandField:a.string,subItemsField:a.string,className:a.string,style:a.object,label:a.string,validationMessage:a.string,validityStyles:a.bool,valid:a.bool,required:a.bool,name:a.string,id:a.string,ariaLabelledBy:a.string,ariaDescribedBy:a.string,filterable:a.bool,filter:a.string,loading:a.bool,tags:a.arrayOf(a.shape({text:a.string,data:a.arrayOf(a.any)})),popupSettings:a.shape({animate:a.oneOfType([a.bool,a.shape({openDuration:a.number,closeDuration:a.number})]),popupClass:a.string,className:a.string,appendTo:a.any,width:a.oneOfType([a.string,a.number]),height:a.oneOfType([a.string,a.number])}),onOpen:a.func,onClose:a.func,onFocus:a.func,onBlur:a.func,onChange:a.func,onFilterChange:a.func,onExpandChange:a.func,onCancel:a.func,item:a.func,listNoData:a.func,adaptiveTitle:a.string,adaptive:a.bool};te.displayName="KendoReactMultiSelectTree";te.defaultProps=q;te.propTypes=mt;exports.MultiSelectTree=te;exports.MultiSelectTreePropsContext=Ke;