@progress/kendo-vue-dropdowns 9.3.0-develop.3 → 9.3.0-develop.4

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.
@@ -5,8 +5,8 @@
5
5
  * Licensed under commercial license. See LICENSE.md in the package root for more information
6
6
  *-------------------------------------------------------------------------------------------
7
7
  */
8
- import { defineComponent as $e, createVNode as n, h as T, ref as N, isVNode as Ce } from "vue";
9
- import { kendoThemeMaps as xe, templateRendering as C, getListeners as x, getTemplate as Oe, Keys as m, canUseDOM as A, getRef as W, guid as G, classNames as B, noop as q, getTabIndex as we, setRef as U, Icon as Fe } from "@progress/kendo-vue-common";
8
+ import { defineComponent as $e, createVNode as a, h as T, ref as N, isVNode as Ce } from "vue";
9
+ import { kendoThemeMaps as xe, templateRendering as x, getListeners as O, getTemplate as Oe, Keys as m, canUseDOM as A, getRef as W, guid as G, classNames as B, noop as q, getTabIndex as we, setRef as U, Icon as Fe } from "@progress/kendo-vue-common";
10
10
  import { Button as Y } from "@progress/kendo-vue-buttons";
11
11
  import { ListContainer as De } from "../common/ListContainer.mjs";
12
12
  import { ListFilter as Ve } from "../common/ListFilter.mjs";
@@ -243,15 +243,15 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
243
243
  virtual: s,
244
244
  groupField: l,
245
245
  textField: o
246
- } = this.$props, i = this.isOpen, d = this.prevOpened !== void 0 ? this.prevOpened : this.prevCurrentOpened, a = !d && i, r = this.$refs.list, c = this.$refs.filterInput, f = this.$refs.scrollElement;
247
- if (this.$refs.scroller, r && (this.base.vs.list = r.list, this.base.list = r.list), f && (this.base.vs.scrollElement = f), c && (this.filterInput = c), r && e.length && this.base.vs.scrollerRef(r.$el), this.$props.popupSettings.animate || a && this.onPopupOpened(), s && this.virtualTotalHasChanged)
246
+ } = this.$props, i = this.isOpen, d = this.prevOpened !== void 0 ? this.prevOpened : this.prevCurrentOpened, n = !d && i, r = this.$refs.list, c = this.$refs.filterInput, f = this.$refs.scrollElement;
247
+ if (this.$refs.scroller, r && (this.base.vs.list = r.list, this.base.list = r.list), f && (this.base.vs.scrollElement = f), c && (this.filterInput = c), r && e.length && this.base.vs.scrollerRef(r.$el), this.$props.popupSettings.animate || n && this.onPopupOpened(), s && this.virtualTotalHasChanged)
248
248
  this.base.vs.calcScrollElementHeight(), this.base.vs.reset(), this.virtualTotalHasChanged = !1;
249
249
  else {
250
250
  const p = this.computedValue(), g = this.prevCurrentValue;
251
251
  let h = e.findIndex((b) => I(b, p, t));
252
252
  l && (h = (v = this.base.getGroupedDataModernMode(e, l)) == null ? void 0 : v.indexOf(p));
253
253
  const k = !I(g, p, t);
254
- a && s ? (this.base.scrollToVirtualItem(s, h), this.prevCurrentOpened = !0) : a && !s ? (e && e.length !== 0 && this.base.resetGroupStickyHeader(e[0][l], this), this.base.scrollToItem(h), this.prevCurrentOpened = !0) : i && d && p && k && !this._navigated ? this.base.scrollToItem(h) : i && d && this._navigated && (this._navigated && s && s.skip === 0 ? this.base.vs.reset() : this._navigated && s && s.skip === s.total - s.pageSize && this.base.vs.scrollToEnd());
254
+ n && s ? (this.base.scrollToVirtualItem(s, h), this.prevCurrentOpened = !0) : n && !s ? (e && e.length !== 0 && this.base.resetGroupStickyHeader(e[0][l], this), this.base.scrollToItem(h), this.prevCurrentOpened = !0) : i && d && p && k && !this._navigated ? this.base.scrollToItem(h) : i && d && this._navigated && (this._navigated && s && s.skip === 0 ? this.base.vs.reset() : this._navigated && s && s.skip === s.total - s.pageSize && this.base.vs.scrollToEnd());
255
255
  }
256
256
  this._navigated = !1, this.prevCurrentValue = this.computedValue(), this.setValidity();
257
257
  },
@@ -323,8 +323,8 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
323
323
  virtual: l,
324
324
  dataItemKey: o,
325
325
  defaultItem: i
326
- } = this.$props, d = l ? l.skip : 0, a = e === -1 && i !== void 0 ? i : s[e - d], r = !I(a, this.computedValue(), o);
327
- this.triggerOnChange(a, t), r && this.base.triggerPageChangeCornerItems(a, t);
326
+ } = this.$props, d = l ? l.skip : 0, n = e === -1 && i !== void 0 ? i : s[e - d], r = !I(n, this.computedValue(), o);
327
+ this.triggerOnChange(n, t), r && this.base.triggerPageChangeCornerItems(n, t);
328
328
  },
329
329
  onNavigate(e, t) {
330
330
  const {
@@ -336,7 +336,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
336
336
  total: 0,
337
337
  pageSize: 0
338
338
  }
339
- } = this.$props, d = this.base.vs, a = this.computedValue(), r = s.findIndex((f) => I(f, a, o)), c = this.base.navigation.navigate({
339
+ } = this.$props, d = this.base.vs, n = this.computedValue(), r = s.findIndex((f) => I(f, n, o)), c = this.base.navigation.navigate({
340
340
  current: i.skip + r,
341
341
  max: (d.enabled ? i.total : s.length) - 1,
342
342
  min: l !== void 0 ? -1 : 0,
@@ -357,24 +357,24 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
357
357
  itemIndex: D
358
358
  }));
359
359
  const o = this.searchState.word, i = this.searchState.last, d = Pe(o, i);
360
- let a = l.length, r = Math.max(0, t.findIndex((b) => I(b, this.computedValue(), s))), c;
360
+ let n = l.length, r = Math.max(0, t.findIndex((b) => I(b, this.computedValue(), s))), c;
361
361
  this.$props.defaultItem && (c = {
362
362
  item: this.$props.defaultItem,
363
363
  itemIndex: -1
364
- }, a += 1, r += 1), r += d ? 1 : 0, l = _e(l, r, c);
364
+ }, n += 1, r += 1), r += d ? 1 : 0, l = _e(l, r, c);
365
365
  let f, v, p, g = 0;
366
366
  const {
367
367
  textField: h,
368
368
  ignoreCase: k
369
369
  } = this.$props;
370
- for (; g < a; ) {
370
+ for (; g < n; ) {
371
371
  if (f = F(l[g].item, h), v = d && Z(f, i, k), p = Z(f, o, k), v || p) {
372
372
  g = l[g].itemIndex;
373
373
  break;
374
374
  }
375
375
  g++;
376
376
  }
377
- if (g !== a) {
377
+ if (g !== n) {
378
378
  const b = this.base.initState();
379
379
  b.event = e, this.handleItemSelect(g, b), this.applyState(b), this.valueDuringOnChange = void 0;
380
380
  }
@@ -391,14 +391,14 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
391
391
  total: 0,
392
392
  pageSize: 0
393
393
  }
394
- } = this.$props, d = this.isOpen, a = e.keyCode, r = a === m.home || a === m.end, c = a === m.up || a === m.down, f = !d && (e.altKey && a === m.down || a === m.enter || a === m.space), v = d && (e.altKey && a === m.up || a === m.esc), p = s && (a === m.left || a === m.right), g = c || !l && (p || r), h = this.base.initState();
394
+ } = this.$props, d = this.isOpen, n = e.keyCode, r = n === m.home || n === m.end, c = n === m.up || n === m.down, f = !d && (e.altKey && n === m.down || n === m.enter || n === m.space), v = d && (e.altKey && n === m.up || n === m.esc), p = s && (n === m.left || n === m.right), g = c || !l && (p || r), h = this.base.initState();
395
395
  if (h.event = e, !o) {
396
396
  if (r && this.base.vs.enabled)
397
- a === m.home ? i.skip !== 0 ? (this.base.triggerOnPageChange(h, 0, i.pageSize), this._navigated = !0) : this.triggerOnChange(t[0], h) : i.skip < i.total - i.pageSize ? (this.base.triggerOnPageChange(h, i.total - i.pageSize, i.pageSize), this._navigated = !0) : this.triggerOnChange(t[t.length - 1], h);
398
- else if (d && a === m.enter) {
397
+ n === m.home ? i.skip !== 0 ? (this.base.triggerOnPageChange(h, 0, i.pageSize), this._navigated = !0) : this.triggerOnChange(t[0], h) : i.skip < i.total - i.pageSize ? (this.base.triggerOnPageChange(h, i.total - i.pageSize, i.pageSize), this._navigated = !0) : this.triggerOnChange(t[t.length - 1], h);
398
+ else if (d && n === m.enter) {
399
399
  const k = this.focusedIndex();
400
400
  k !== void 0 && this.handleItemSelect(k, h), this.base.togglePopup(h), e.preventDefault();
401
- } else f || v ? (this.adaptiveState && this.handleWrapperClick(e), this.base.togglePopup(h), e.preventDefault()) : g && (this.onNavigate(h, a), e.preventDefault());
401
+ } else f || v ? (this.adaptiveState && this.handleWrapperClick(e), this.base.togglePopup(h), e.preventDefault()) : g && (this.onNavigate(h, n), e.preventDefault());
402
402
  this.applyState(h);
403
403
  }
404
404
  },
@@ -494,7 +494,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
494
494
  } = this.$props, d;
495
495
  if (!o || !i.length)
496
496
  return;
497
- const a = s && ((v = s.querySelector(".k-list-item")) == null ? void 0 : v.offsetHeight) || 0, r = this.itemHeight = this.itemHeight || (t.enabled ? t.itemHeight : a), f = e.target.scrollTop - t.skip * r;
497
+ const n = s && ((v = s.querySelector(".k-list-item")) == null ? void 0 : v.offsetHeight) || 0, r = this.itemHeight = this.itemHeight || (t.enabled ? t.itemHeight : n), f = e.target.scrollTop - t.skip * r;
498
498
  o && (i = this.base.getGroupedDataModernMode(i, o), d = i[0][o]);
499
499
  for (let p = 1; p < i.length && !(r * p > f); p++)
500
500
  i[p] && i[p][o] && (d = i[p][o]);
@@ -512,7 +512,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
512
512
  },
513
513
  size: i,
514
514
  rounded: d,
515
- fillMode: a,
515
+ fillMode: n,
516
516
  dataItemKey: r,
517
517
  dataItems: c = [],
518
518
  disabled: f,
@@ -525,22 +525,22 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
525
525
  header: D,
526
526
  footer: H,
527
527
  groupStickyHeaderItemRender: te
528
- } = this.$props, O = this.isOpen, ie = F(this.computedValue(), this.$props.textField), se = !this.$props.validityStyles || this.validity().valid, S = this.base, w = S.vs, L = this.$props.id || this.inputId;
528
+ } = this.$props, $ = this.isOpen, ie = F(this.computedValue(), this.$props.textField), se = !this.$props.validityStyles || this.validity().valid, S = this.base, w = S.vs, L = this.$props.id || this.inputId;
529
529
  w.enabled = this.$props.virtual !== void 0;
530
530
  const V = Object.assign({}, {
531
531
  animate: !0,
532
532
  height: "200px"
533
- }, this.$props.popupSettings), ae = Re(this).toLanguageString(Q, Le[Q]), M = this.adaptiveState;
533
+ }, this.$props.popupSettings), ne = Re(this).toLanguageString(Q, Le[Q]), M = this.adaptiveState;
534
534
  this.group === void 0 && this.$props.groupField !== void 0 && (this.group = F(this.$props.dataItems[0], this.$props.groupField));
535
- const ne = C.call(this, this.$props.valueRender, x.call(this)), le = this.currentFocused, K = this.primitiveValue(), oe = c.findIndex((u) => I(u, K, r)), re = n("span", {
535
+ const ae = x.call(this, this.$props.valueRender, O.call(this)), le = this.currentFocused, K = this.primitiveValue(), oe = c.findIndex((u) => I(u, K, r)), re = a("span", {
536
536
  class: "k-input-inner",
537
537
  id: this.dropDownListId
538
- }, [n("span", {
538
+ }, [a("span", {
539
539
  class: "k-input-value-text"
540
540
  }, [ie])]);
541
541
  let de = Oe.call(this, {
542
542
  h: T,
543
- template: ne,
543
+ template: ae,
544
544
  defaultRendering: re,
545
545
  additionalProps: {
546
546
  value: this.computedValue(),
@@ -548,7 +548,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
548
548
  }
549
549
  });
550
550
  const ue = function(u) {
551
- return n("select", {
551
+ return a("select", {
552
552
  name: this.$props.name,
553
553
  id: L,
554
554
  ref: U(this, "select"),
@@ -563,20 +563,20 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
563
563
  position: "absolute",
564
564
  left: "50%"
565
565
  }
566
- }, [n("option", {
566
+ }, [a("option", {
567
567
  value: this.$props.valueMap ? this.$props.valueMap.call(void 0, u) : u
568
568
  }, null)]);
569
- }, pe = () => [n("div", {
569
+ }, pe = () => [a("div", {
570
570
  class: "k-actionsheet-titlebar-group k-hbox"
571
- }, [n("div", {
571
+ }, [a("div", {
572
572
  class: "k-actionsheet-title"
573
- }, [n("div", {
573
+ }, [a("div", {
574
574
  class: "k-text-center"
575
- }, [b]), n("div", {
575
+ }, [b]), a("div", {
576
576
  class: "k-actionsheet-subtitle k-text-center"
577
- }, null)]), n("div", {
577
+ }, null)]), a("div", {
578
578
  class: "k-actionsheet-actions"
579
- }, [n(Y, {
579
+ }, [a(Y, {
580
580
  tabIndex: 5,
581
581
  "aria-label": "Cancel",
582
582
  "aria-disabled": "false",
@@ -585,29 +585,29 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
585
585
  onClick: this.handleWrapperClick,
586
586
  icon: "x",
587
587
  svgIcon: je
588
- }, null)])]), n("div", {
588
+ }, null)])]), a("div", {
589
589
  class: "k-actionsheet-titlebar-group k-actionsheet-filter"
590
- }, [j.call(this)])], he = C.call(this, pe, x.call(this)), ce = () => {
591
- const u = S.getTemplateDef.call(this, D, T), y = S.getTemplateDef.call(this, H, T), $ = C.call(this, te, x.call(this));
592
- return n("div", {
590
+ }, [j.call(this)])], he = x.call(this, pe, O.call(this)), ce = () => {
591
+ const u = S.getTemplateDef.call(this, D, T), y = S.getTemplateDef.call(this, H, T), C = x.call(this, te, O.call(this));
592
+ return a("div", {
593
593
  class: "k-list-container"
594
- }, [u && n("div", {
594
+ }, [u && a("div", {
595
595
  class: "k-list-header"
596
- }, [u]), n("div", {
596
+ }, [u]), a("div", {
597
597
  class: B("k-list", {
598
598
  [`k-list-${E[i] || i}`]: M ? !1 : i,
599
599
  "k-list-lg": !!M,
600
600
  "k-virtual-list": w.enabled
601
601
  })
602
- }, [P.call(this), this.group && c.length !== 0 && n(J, {
602
+ }, [P.call(this), this.group && c.length !== 0 && a(J, {
603
603
  group: this.group,
604
- render: $
605
- }, null), _.call(this), y && n("div", {
604
+ render: C
605
+ }, null), _.call(this), y && a("div", {
606
606
  class: "k-list-footer"
607
607
  }, [y])])]);
608
- }, fe = C.call(this, ce, x.call(this)), me = function() {
609
- return n(He, {
610
- expand: O,
608
+ }, fe = x.call(this, ce, O.call(this)), me = function() {
609
+ return a(He, {
610
+ expand: $,
611
611
  animation: !0,
612
612
  animationStyles: this.animationStyles,
613
613
  className: this.classNameAdaptive,
@@ -622,7 +622,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
622
622
  textField: u,
623
623
  defaultItem: y
624
624
  } = this.$props;
625
- return y !== void 0 && n(Me, {
625
+ return y !== void 0 && a(Me, {
626
626
  defaultItem: y,
627
627
  textField: u,
628
628
  selected: I(this.computedValue(), y, r),
@@ -633,13 +633,13 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
633
633
  let u;
634
634
  const {
635
635
  textField: y,
636
- groupField: $
636
+ groupField: C
637
637
  } = this.$props;
638
638
  let R = this.$props.dataItems || [];
639
- const be = C.call(this, this.$props.itemRender, x.call(this)), ye = C.call(this, this.$props.groupHeaderItemRender, x.call(this)), Ie = C.call(this, this.$props.listNoDataRender, x.call(this)), ke = o.skip, Se = `translateY(${w.translate}px)`;
640
- return $ && (R = this.base.getGroupedDataModernMode(R, $)), n(Te, {
639
+ const be = x.call(this, this.$props.itemRender, O.call(this)), ye = x.call(this, this.$props.groupHeaderItemRender, O.call(this)), Ie = x.call(this, this.$props.listNoDataRender, O.call(this)), ke = o.skip, Se = `translateY(${w.translate}px)`;
640
+ return C && (R = this.base.getGroupedDataModernMode(R, C)), a(Te, {
641
641
  id: this.base.listBoxId,
642
- show: O,
642
+ show: $,
643
643
  dataItems: R.slice(),
644
644
  focusedIndex: this.focusedIndex(),
645
645
  value: this.computedValue(),
@@ -660,14 +660,14 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
660
660
  itemRender: be,
661
661
  groupHeaderItemRender: ye,
662
662
  noDataRender: Ie,
663
- groupField: $,
663
+ groupField: C,
664
664
  onScroll: this.onScroll
665
665
  }, We(u = ge.call(this)) ? u : {
666
666
  default: () => [u]
667
667
  });
668
668
  }, j = function() {
669
669
  const u = this.$props.filter !== void 0 ? this.$props.filter : this.currentText;
670
- return this.$props.filterable && n(Ve, {
670
+ return this.$props.filterable && a(Ve, {
671
671
  value: u,
672
672
  ref: "filterInput",
673
673
  onChange: this.handleListFilterChange,
@@ -679,13 +679,13 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
679
679
  ariaActivedescendantId: `option-${this.base.guid}-${this.focusedIndex()}`
680
680
  }, null);
681
681
  }, ge = function() {
682
- return w.enabled && n("div", {
682
+ return w.enabled && a("div", {
683
683
  ref: "scrollElement",
684
684
  key: "scrollElementKey"
685
685
  }, null);
686
686
  }, ve = function() {
687
- const u = C.call(this, this.$props.groupStickyHeaderItemRender, x.call(this)), y = S.getTemplateDef.call(this, D), $ = S.getTemplateDef.call(this, H);
688
- return n(De, {
687
+ const u = x.call(this, this.$props.groupStickyHeaderItemRender, O.call(this)), y = S.getTemplateDef.call(this, D), C = S.getTemplateDef.call(this, H);
688
+ return a(De, {
689
689
  ref: "container",
690
690
  onMousedown: ee,
691
691
  dir: l !== void 0 ? l : S.dirCalculated,
@@ -698,31 +698,31 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
698
698
  }),
699
699
  className: B("k-list-container", V.className),
700
700
  anchor: this.anchor,
701
- show: O
701
+ show: $
702
702
  },
703
703
  onOpen: this.onPopupOpened,
704
704
  onClose: this.onPopupClosed,
705
705
  onBlur: this.handleBlur
706
706
  }, {
707
- default: () => [j.call(this), P.call(this), this.group && c.length !== 0 && n(J, {
707
+ default: () => [j.call(this), P.call(this), this.group && c.length !== 0 && a(J, {
708
708
  group: this.group,
709
709
  render: u
710
- }, null), y && n("div", {
710
+ }, null), y && a("div", {
711
711
  class: "k-list-header"
712
- }, [y]), _.call(this), $ && n("div", {
712
+ }, [y]), _.call(this), C && a("div", {
713
713
  class: "k-list-footer"
714
- }, [$])]
714
+ }, [C])]
715
715
  });
716
716
  };
717
717
  this.$props.virtual !== void 0 && (S.vs.skip = o.skip, S.vs.total = o.total, S.vs.pageSize = o.pageSize);
718
718
  const z = [T(function() {
719
719
  var u;
720
- return n("span", {
720
+ return a("span", {
721
721
  ref: U(this, "kendoAnchor"),
722
722
  class: B("k-dropdownlist k-picker", t, {
723
723
  [`k-picker-${E[i] || i}`]: i,
724
724
  [`k-rounded-${Ae[d] || d}`]: d,
725
- [`k-picker-${a}`]: a,
725
+ [`k-picker-${n}`]: n,
726
726
  "k-focus": le,
727
727
  "k-disabled": f,
728
728
  "k-invalid": !se,
@@ -734,7 +734,7 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
734
734
  width: void 0
735
735
  } : e,
736
736
  dir: l,
737
- onMousedown: O ? ee : q,
737
+ onMousedown: $ ? ee : q,
738
738
  onFocusin: this.handleFocus,
739
739
  onFocusout: this.handleBlur,
740
740
  tabindex: (u = we(v, f)) != null ? u : 0,
@@ -744,25 +744,25 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
744
744
  role: "combobox",
745
745
  onClick: f ? q : this.handleWrapperClick,
746
746
  "aria-disabled": f || void 0,
747
- "aria-haspopup": !0,
748
- "aria-expanded": O || !1,
749
- "aria-owns": this.base.listBoxId,
750
- "aria-activedescendant": O ? "option-" + this.base.guid + "-" + (oe + (o ? o.skip : 0)) : void 0,
747
+ "aria-haspopup": "listbox",
748
+ "aria-expanded": $ || !1,
749
+ "aria-controls": $ ? this.base.listBoxId : void 0,
750
+ "aria-activedescendant": $ ? "option-" + this.base.guid + "-" + (oe + (o ? o.skip : 0)) : void 0,
751
751
  "aria-label": this.$props.ariaLabel || this.$props.label,
752
752
  "aria-labelledby": this.$props.ariaLabelledBy,
753
- "aria-describedBy": this.dropDownListId,
753
+ "aria-describedby": $ ? this.dropDownListId : void 0,
754
754
  title: this.$props.title
755
- }, [de, p && n(Fe, {
755
+ }, [de, p && a(Fe, {
756
756
  name: "loading",
757
757
  class: "k-input-loading-icon",
758
758
  key: "loading"
759
- }, null), n(Y, {
759
+ }, null), a(Y, {
760
760
  type: "button",
761
761
  tabIndex: -1,
762
762
  size: i,
763
- fillMode: a,
763
+ fillMode: n,
764
764
  rounded: null,
765
- ariaLabel: ae,
765
+ ariaLabel: ne,
766
766
  class: "k-input-button",
767
767
  icon: g || "chevron-down",
768
768
  svgIcon: h || ze,
@@ -771,15 +771,15 @@ const Ge = "Please select a value from the list!", dt = /* @__PURE__ */ $e({
771
771
  }.call(this), {
772
772
  ...this.$attrs
773
773
  }), M && me.call(this)];
774
- return s ? n("span", {
774
+ return s ? a("span", {
775
775
  class: this.spanClassNames,
776
776
  onFocusin: this.handleFocus,
777
777
  onFocusout: this.handleBlur,
778
778
  dir: this.$props.dir
779
- }, [z, this.$props.label ? L ? n("label", {
779
+ }, [z, this.$props.label ? L ? a("label", {
780
780
  for: L,
781
781
  class: "k-floating-label"
782
- }, [this.$props.label]) : n("span", {
782
+ }, [this.$props.label]) : a("span", {
783
783
  class: "k-label"
784
784
  }, [this.$props.label]) : null]) : z;
785
785
  }
@@ -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 strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("vue"),t=require("@progress/kendo-vue-common"),ne=require("@progress/kendo-vue-popup"),ae=require("@progress/kendo-vue-intl"),O=require("@progress/kendo-vue-treeview"),b=require("../package-metadata.js"),k=require("../common/utils.js"),oe=require("./ListNoData.js"),c=require("../messages/main.js"),le=require("@progress/kendo-vue-labels"),T=require("../common/ListFilter.js"),B=require("@progress/kendo-vue-buttons"),w=require("@progress/kendo-svg-icons"),K=require("../common/constants.js"),re=require("@progress/kendo-vue-layout"),de=require("../common/DropDownBase.js");function L(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!s.isVNode(e)}const{sizeMap:ue,roundedMap:ce}=t.kendoThemeMaps,pe="Please select a value from the list!",E=e=>e.split("_").map(i=>parseInt(i,10)),S=(e,i)=>{const{validationMessage:n,valid:a,required:o}=e;return{customError:n!==void 0,valid:!!(a!==void 0?a:!o||i),valueMissing:!i}},he=s.defineComponent({name:"KendoDropDownTree",model:{event:"changemodel"},emits:{open:e=>!0,close:e=>!0,focus:e=>!0,blur:e=>!0,change:e=>!0,filterchange:e=>!0,expandchange:e=>!0,changemodel:e=>!0,"update:modelValue":e=>!0},props:{opened:{type:Boolean,default:void 0},disabled:Boolean,dir:String,tabIndex:Number,accessKey:String,dataItems:{type:Array,default:function(){return[]}},value:{type:[Object,String,Number,Boolean],default:function(){}},modelValue:{type:[Object,String,Number,Boolean],default:function(){}},valueMap:Function,placeholder:String,dataItemKey:{type:String,required:!0},textField:{type:String,required:!0},selectField:{type:String,default:"selected"},expandField:String,subItemsField:{type:String,default:"items"},className:String,label:String,validationMessage:String,validityStyles:{type:Boolean,default:!0},valid:{type:Boolean,default:void 0},required:Boolean,name:String,id:String,ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,filterable:Boolean,filter:String,loading:Boolean,popupSettings:{type:Object,default:function(){return{animate:!0,height:"200px",anchor:""}}},size:{type:String,validator:function(e){return["small","medium","large"].includes(e)}},rounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},fillMode:{type:String,validator:function(e){return["flat","outline","solid"].includes(e)}},item:[String,Function,Object],header:[String,Function,Object],footer:[String,Function,Object],valueRender:[String,Function,Object],listNoData:[String,Function,Object],adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0}},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:K.MOBILE_SMALL_DEVICE,medium:K.MOBILE_MEDIUM_DEVICE}}},created(){this.observer=null,t.validatePackage(b.packageMetadata),this.showLicenseWatermark=t.shouldShowValidationUI(b.packageMetadata),this.licenseMessage=t.getLicenseMessage(b.packageMetadata),this.base=new de(this),this.componentGuid=t.guid(),this.anchor=t.guid()},data(){return{showLicenseWatermark:!1,licenseMessage:void 0,currentOpened:!1,focused:!1,filterState:"",currentValue:void 0,popupWidth:"200px",windowWidth:0,initialAdaptiveRenderingValues:void 0}},computed:{wrapperClass(){const{validationMessage:e,valid:i,required:n,validityStyles:a}=this.$props,o=S({validationMessage:e,valid:i,required:n},this.hasValue),d=!a||o.valid,{size:r,rounded:l,fillMode:u}=this.$props;return{"k-dropdowntree":!0,"k-picker":!0,[this.$props.className]:this.$props.className,[`k-picker-${ue[r]||r}`]:r,[`k-rounded-${ce[l]||l}`]:l,[`k-picker-${u}`]:u,"k-focus":this.focused,"k-invalid":!d,"k-loading":this.$props.loading,"k-required":n,"k-disabled":this.$props.disabled}},animationStyles(){return this.windowWidth<=this.adaptiveModeBreakpoints.small?{top:0,width:"100%",height:"100%"}:void 0},classNameAdaptive(){return this.windowWidth<=this.adaptiveModeBreakpoints.small?"k-adaptive-actionsheet k-actionsheet-fullscreen":"k-adaptive-actionsheet k-actionsheet-bottom"},adaptiveState(){return this.windowWidth<=this.adaptiveModeBreakpoints.medium&&this.$props.adaptive},isOpen(){return this.opened!==void 0?this.opened:this.currentOpened},computedValue(){return this.value!==void 0?this.value:this.$props.modelValue!==void 0?this.$props.modelValue:this.currentValue},hasValue(){return k.isPresent(this.computedValue)},currentValueText(){return this.hasValue?k.getItemValue(this.computedValue,this.$props.textField):""}},watch:{isOpen:function(e){e&&this.value?this.initialAdaptiveRenderingValues=[this.value]:this.initialAdaptiveRenderingValues=void 0}},mounted(){this.observer=t.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),document!=null&&document.body&&this.observer&&this.observer.observe(document.body),this.elementRef=t.getRef(this,"kendoAnchor"),this.inputRef=t.getRef(this,"input"),this.selectRef=t.getRef(this,"select"),this.treeViewRef=t.getRef(this,"treeView"),this.skipFocusRef=!1,this.popupRef=t.getRef(this,"popup"),this.calculatePopupWidth()},updated(){this.inputRef=t.getRef(this,"input"),this.treeViewRef=t.getRef(this,"treeView"),this.popupRef&&this.isOpen&&this.hasValue&&this.popupRef.reposition(),this.setValidity(),this.calculatePopupWidth()},render(){let e;const i=this.$props.id||this.componentGuid,{dataItems:n,dataItemKey:a,popupSettings:o,disabled:d,placeholder:r,label:l,name:u,selectField:R,subItemsField:$,validationMessage:q,valid:W,required:F,validityStyles:P,adaptiveTitle:A}=this.$props,g=t.getTabIndex(this.$props.tabIndex,d),x=ae.provideLocalizationService(this),z=S({validationMessage:q,valid:W,required:F},this.hasValue),I=this.adaptiveState,p=this.$props.dir,N=t.templateRendering.call(this,this.item,t.getListeners.call(this)),j=t.templateRendering.call(this,this.valueRender,t.getListeners.call(this)),_=t.templateRendering.call(this,this.$props.header,t.getListeners.call(this)),G=t.templateRendering.call(this,this.$props.footer,t.getListeners.call(this)),v=t.getTemplate.call(this,{h:s.h,template:_}),y=t.getTemplate.call(this,{h:s.h,template:G}),H=t.templateRendering.call(this,this.$props.listNoData,t.getListeners.call(this)),U=s.createVNode(oe.ListNoData,null,L(e=x.toLanguageString(c.nodata,c.messages[c.nodata]))?e:{default:()=>[e]}),M=t.getTemplate.call(this,{h:s.h,defaultRendering:U,template:H}),J=s.createVNode("span",{class:"k-input-value-text"},[this.currentValueText||r]),Q=t.getTemplate.call(this,{h:s.h,defaultRendering:J,template:j,additionalProps:{value:this.computedValue}}),X=()=>[s.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[s.createVNode("div",{class:"k-actionsheet-title"},[s.createVNode("div",{class:"k-text-center"},[A]),s.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},[r])]),s.createVNode("div",{class:"k-actionsheet-actions"},[s.createVNode(B.Button,{tabIndex:1,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.onWrapperClick,icon:"x",svgIcon:w.xIcon},null)])]),s.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[this.$props.filterable&&s.createVNode(T.ListFilter,{tabIndex:0,value:this.$props.filter===void 0?this.filterState:this.$props.filter,ref:t.setRef(this,"input"),onChange:this.onFilterChange,onKeydown:this.onInputKeyDown,size:h,rounded:D,fillMode:V,onFocus:this.onFocus,onBlur:this.onBlur},null)])],Y=t.templateRendering.call(this,X,t.getListeners.call(this)),Z=()=>{const m=this.base.getTemplateDef.call(this,v,s.h),C=this.base.getTemplateDef.call(this,y,s.h);return[m&&s.createVNode("div",{class:"k-list-header"},[m]),n.length>0?s.createVNode(O.TreeView,{ref:t.setRef(this,"treeView"),tabIndex:g,dataItems:n,focusIdField:a,textField:this.$props.textField,selectField:R,expandField:this.$props.expandField,childrenField:$,expandIcons:!0,onItemclick:this.onChange,onExpandchange:this.onExpand,onFocus:this.onFocus,onBlur:this.onBlur,onKeydown:this.onWrapperKeyDown,size:"large",item:N},null):M,C&&s.createVNode("div",{class:"k-list-footer"},[C])]},ee=t.templateRendering.call(this,Z,t.getListeners.call(this)),te=function(){return s.createVNode(re.ActionSheet,{expand:this.isOpen,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,header:Y,content:ee,contentClassName:"!k-overflow-hidden",onClose:this.onWrapperClick,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},ie=!P||z.valid,{size:h,rounded:D,fillMode:V}=this.$props,se=function(){return s.createVNode("span",{class:this.wrapperClass,tabindex:g,accesskey:this.$props.accessKey,id:i,dir:p,ref:t.setRef(this,"kendoAnchor"),onKeydown:this.onWrapperKeyDown,onClick:this.onWrapperClick,onMousedown:this.onWrapperMouseDown,onFocusin:this.onFocus,onFocusout:this.onBlur,role:"combobox","aria-haspopup":"tree","aria-expanded":this.isOpen,"aria-disabled":d,"aria-label":l||this.$props.ariaLabel,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedby":this.$props.ariaDescribedBy,"aria-required":F},[s.createVNode("span",{class:"k-input-inner"},[Q]),this.$props.loading&&s.createVNode(t.Icon,{class:"k-input-loading-icon",name:"loading"},null),this.hasValue&&!d&&s.createVNode("span",{onClick:this.onClear,class:"k-clear-value",title:x.toLanguageString(c.clear,c.messages[c.clear]),role:"button",tabindex:-1,onMousedown:m=>m.preventDefault()},[s.createVNode(t.Icon,{name:"x",icon:w.xIcon},null)]),s.createVNode(B.Button,{tabIndex:-1,type:"button","aria-label":"select",class:"k-input-button",size:h,fillMode:V,themeColor:"base",rounded:null,icon:"chevron-down",svgIcon:w.chevronDownIcon},null),s.createVNode("select",{name:u,ref:t.setRef(this,"select"),tabindex:-1,"aria-hidden":!0,title:l,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},[s.createVNode("option",{value:this.$props.valueMap?this.$props.valueMap.call(void 0,this.computedValue):this.computedValue},null)]),this.showLicenseWatermark?s.createVNode(t.WatermarkOverlay,{message:this.licenseMessage},null):null,!I&&s.createVNode(ne.Popup,{style:{width:this.popupWidth,direction:p},ref:t.setRef(this,"popup"),class:t.classNames(o.className,{"k-rtl":p==="rtl"}),popupClass:t.classNames(o.popupClass,"k-dropdowntree-popup","popup-"+this.componentGuid),animate:o.animate,anchor:this.anchor,show:this.isOpen,onOpen:this.onPopupOpened,onClose:this.onPopupClosed,appendTo:o.appendTo},{default:()=>[this.$props.filterable&&s.createVNode(T.ListFilter,{value:this.$props.filter===void 0?this.filterState:this.$props.filter,ref:t.setRef(this,"input"),onChange:this.onFilterChange,onKeydown:this.onInputKeyDown,onBlur:this.onBlur,size:h,rounded:D,fillMode:V},null),v&&s.createVNode("div",{class:"k-list-header"},[v]),n.length>0?s.createVNode(O.TreeView,{ref:t.setRef(this,"treeView"),tabIndex:g,dataItems:n,focusIdField:a,textField:this.$props.textField,selectField:R,expandField:this.$props.expandField,childrenField:$,expandIcons:!0,onItemclick:this.onChange,onExpandchange:this.onExpand,onFocus:this.onFocus,onBlur:this.onBlur,onKeydown:this.onWrapperKeyDown,size:h,item:N},null):M,y&&s.createVNode("div",{class:"k-list-footer"},[y])]})])},f=[s.h(se.call(this),{...this.$attrs}),I&&te.call(this)];return l?s.createVNode(le.FloatingLabel,{label:l,editorValue:this.currentValueText,editorPlaceholder:r,editorValid:ie,editorDisabled:d,editorId:i,focused:this.focused,dir:p},L(f)?f:{default:()=>[f]}):f},methods:{calculateMedia(e){for(let i of e)this.windowWidth=i.target.clientWidth},calculatePopupWidth(){this.elementRef&&(this.popupWidth=this.popupSettings.width!==void 0?this.popupSettings.width:this.elementRef.offsetWidth+"px")},focus(){this.$el&&this.$el.focus()},setValidity(){if(this.selectRef&&this.selectRef.setCustomValidity){const{validationMessage:e,valid:i,required:n}=this.$props,a=S({validationMessage:e,valid:i,required:n},this.hasValue);this.selectRef.setCustomValidity(a.valid?"":this.validationMessage===void 0?pe:this.validationMessage)}},openPopup(e){if(!this.isOpen){const i={...e};this.$emit("open",i),this.currentOpened=!0}},closePopup(e){if(this.isOpen){const i={...e};this.$emit("close",i),this.currentOpened=!1}},onWrapperClick(e){if(this.onFilterChange({...e,target:{value:""}}),!e.defaultPrevented&&this.$el){this.focused=!0;const i={event:e,target:this};(this.isOpen?this.closePopup:this.openPopup)(i)}},switchFocus(e){this.skipFocusRef=!0,e(),window.setTimeout(()=>this.skipFocusRef=!1,0)},onWrapperKeyDown(e){const{keyCode:i,altKey:n}=e,a=this.treeViewRef&&this.treeViewRef.$el,o=this.inputRef&&this.inputRef.input;if(this.$props.disabled||e.defaultPrevented&&o===e.target)return;const d={event:e,target:this};if(this.isOpen)if(i===t.Keys.esc||n&&i===t.Keys.up)e.preventDefault(),this.closePopup(d);else if(a&&a.querySelector(".k-focus")&&(i===t.Keys.up||i===t.Keys.down||i===t.Keys.left||i===t.Keys.right||i===t.Keys.home||i===t.Keys.end)){if(i===t.Keys.up&&o){const r=Array.from(a.querySelectorAll(".k-treeview-item")),l=[...r].reverse().find(u=>!!(u&&u.querySelector(".k-focus")));if(l&&r.indexOf(l)===0)return this.switchFocus(()=>{this.focusElement(o)})}this.switchFocus(t.noop)}else i===t.Keys.down&&this.switchFocus(()=>{this.focusElement(o||a)});else n&&i===t.Keys.down&&(e.preventDefault(),this.openPopup(d))},onInputKeyDown(e){const{keyCode:i,altKey:n}=e;if(i===t.Keys.esc)this.onWrapperClick(e);else if(n||i!==t.Keys.up&&i!==t.Keys.down)return;e.preventDefault(),this.switchFocus(i===t.Keys.up?()=>{this.focusElement(this.elementRef)}:()=>{this.focusElement(this.treeViewRef&&this.treeViewRef.$el)})},focusElement(e){e&&this.switchFocus(()=>e.focus())},onPopupOpened(){if(!this.focused&&this.isOpen&&!this.currentOpened)this.closePopup({target:this});else if(this.$props.filterable){const e=this.inputRef&&this.inputRef.input;this.focusElement(e)}else this.focusElement(this.treeViewRef&&this.treeViewRef.$el)},onPopupClosed(){this.focused&&this.focusElement(this.elementRef)},onFocus(e){if(!this.focused&&!this.skipFocusRef){this.focused=!0;const i={event:e,target:this};this.$emit("focus",i)}},onBlur(e){var i;if(this.focused&&!this.skipFocusRef){this.focused=!1;const n={event:e,target:this},a={...n},o=e.relatedTarget||((i=e.event)==null?void 0:i.relatedTarget);!(o!=null&&o.closest(".popup-"+this.componentGuid))&&!this.adaptiveState&&(this.$emit("blur",a),this.closePopup(n))}},onWrapperMouseDown(){this.focused&&this.switchFocus(t.noop)},changeValue(e,i,n){const a={value:i,level:n?E(n):[],...e};this.$emit("changemodel",i),this.$emit("update:modelValue",i),this.$emit("change",a),this.currentValue=i},onChange(e){if(k.areSame(e.item,this.computedValue,this.dataItemKey)||!this.$el)return;const{item:i,itemHierarchicalIndex:n,event:a}=e,o={event:a,target:this};this.changeValue(o,i,n),this.closePopup(o)},onClear(e){const i={event:e,target:this};this.changeValue(i,null),this.closePopup(i),e.preventDefault()},onExpand(e){const{item:i,itemHierarchicalIndex:n,event:a}=e,o={level:E(n),item:i,event:a,target:this};this.$emit("expandchange",o)},onFilterChange(e){const n={filter:{field:this.$props.textField,operator:"contains",value:e.target.value},event:e,target:this};this.$emit("filterchange",n),this.$props.filter===void 0&&(this.filterState=e.target.value)}}});exports.DropDownTree=he;
8
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("vue"),t=require("@progress/kendo-vue-common"),ne=require("@progress/kendo-vue-popup"),ae=require("@progress/kendo-vue-intl"),O=require("@progress/kendo-vue-treeview"),b=require("../package-metadata.js"),k=require("../common/utils.js"),oe=require("./ListNoData.js"),c=require("../messages/main.js"),le=require("@progress/kendo-vue-labels"),T=require("../common/ListFilter.js"),B=require("@progress/kendo-vue-buttons"),w=require("@progress/kendo-svg-icons"),K=require("../common/constants.js"),re=require("@progress/kendo-vue-layout"),de=require("../common/DropDownBase.js");function L(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!s.isVNode(e)}const{sizeMap:ue,roundedMap:ce}=t.kendoThemeMaps,pe="Please select a value from the list!",E=e=>e.split("_").map(i=>parseInt(i,10)),S=(e,i)=>{const{validationMessage:n,valid:a,required:o}=e;return{customError:n!==void 0,valid:!!(a!==void 0?a:!o||i),valueMissing:!i}},he=s.defineComponent({name:"KendoDropDownTree",model:{event:"changemodel"},emits:{open:e=>!0,close:e=>!0,focus:e=>!0,blur:e=>!0,change:e=>!0,filterchange:e=>!0,expandchange:e=>!0,changemodel:e=>!0,"update:modelValue":e=>!0},props:{opened:{type:Boolean,default:void 0},disabled:Boolean,dir:String,tabIndex:Number,accessKey:String,dataItems:{type:Array,default:function(){return[]}},value:{type:[Object,String,Number,Boolean],default:function(){}},modelValue:{type:[Object,String,Number,Boolean],default:function(){}},valueMap:Function,placeholder:String,dataItemKey:{type:String,required:!0},textField:{type:String,required:!0},selectField:{type:String,default:"selected"},expandField:String,subItemsField:{type:String,default:"items"},className:String,label:String,validationMessage:String,validityStyles:{type:Boolean,default:!0},valid:{type:Boolean,default:void 0},required:Boolean,name:String,id:String,ariaLabel:{type:String,default:void 0},ariaLabelledBy:String,ariaDescribedBy:String,filterable:Boolean,filter:String,loading:Boolean,popupSettings:{type:Object,default:function(){return{animate:!0,height:"200px",anchor:""}}},size:{type:String,validator:function(e){return["small","medium","large"].includes(e)}},rounded:{type:String,validator:function(e){return["none","small","medium","large","full"].includes(e)}},fillMode:{type:String,validator:function(e){return["flat","outline","solid"].includes(e)}},item:[String,Function,Object],header:[String,Function,Object],footer:[String,Function,Object],valueRender:[String,Function,Object],listNoData:[String,Function,Object],adaptive:{type:Boolean,default:void 0},adaptiveTitle:{type:String,default:void 0}},inject:{kendoLocalizationService:{default:null},adaptiveModeBreakpoints:{default:{small:K.MOBILE_SMALL_DEVICE,medium:K.MOBILE_MEDIUM_DEVICE}}},created(){this.observer=null,t.validatePackage(b.packageMetadata),this.showLicenseWatermark=t.shouldShowValidationUI(b.packageMetadata),this.licenseMessage=t.getLicenseMessage(b.packageMetadata),this.base=new de(this),this.componentGuid=t.guid(),this.anchor=t.guid()},data(){return{showLicenseWatermark:!1,licenseMessage:void 0,currentOpened:!1,focused:!1,filterState:"",currentValue:void 0,popupWidth:"200px",windowWidth:0,initialAdaptiveRenderingValues:void 0}},computed:{wrapperClass(){const{validationMessage:e,valid:i,required:n,validityStyles:a}=this.$props,o=S({validationMessage:e,valid:i,required:n},this.hasValue),d=!a||o.valid,{size:r,rounded:l,fillMode:u}=this.$props;return{"k-dropdowntree":!0,"k-picker":!0,[this.$props.className]:this.$props.className,[`k-picker-${ue[r]||r}`]:r,[`k-rounded-${ce[l]||l}`]:l,[`k-picker-${u}`]:u,"k-focus":this.focused,"k-invalid":!d,"k-loading":this.$props.loading,"k-required":n,"k-disabled":this.$props.disabled}},animationStyles(){return this.windowWidth<=this.adaptiveModeBreakpoints.small?{top:0,width:"100%",height:"100%"}:void 0},classNameAdaptive(){return this.windowWidth<=this.adaptiveModeBreakpoints.small?"k-adaptive-actionsheet k-actionsheet-fullscreen":"k-adaptive-actionsheet k-actionsheet-bottom"},adaptiveState(){return this.windowWidth<=this.adaptiveModeBreakpoints.medium&&this.$props.adaptive},isOpen(){return this.opened!==void 0?this.opened:this.currentOpened},computedValue(){return this.value!==void 0?this.value:this.$props.modelValue!==void 0?this.$props.modelValue:this.currentValue},hasValue(){return k.isPresent(this.computedValue)},currentValueText(){return this.hasValue?k.getItemValue(this.computedValue,this.$props.textField):""}},watch:{isOpen:function(e){e&&this.value?this.initialAdaptiveRenderingValues=[this.value]:this.initialAdaptiveRenderingValues=void 0}},mounted(){this.observer=t.canUseDOM&&window.ResizeObserver&&new ResizeObserver(this.calculateMedia),document!=null&&document.body&&this.observer&&this.observer.observe(document.body),this.elementRef=t.getRef(this,"kendoAnchor"),this.inputRef=t.getRef(this,"input"),this.selectRef=t.getRef(this,"select"),this.treeViewRef=t.getRef(this,"treeView"),this.skipFocusRef=!1,this.popupRef=t.getRef(this,"popup"),this.calculatePopupWidth()},updated(){this.inputRef=t.getRef(this,"input"),this.treeViewRef=t.getRef(this,"treeView"),this.popupRef&&this.isOpen&&this.hasValue&&this.popupRef.reposition(),this.setValidity(),this.calculatePopupWidth()},render(){let e;const i=this.$props.id||this.componentGuid,{dataItems:n,dataItemKey:a,popupSettings:o,disabled:d,placeholder:r,label:l,name:u,selectField:R,subItemsField:$,validationMessage:q,valid:W,required:F,validityStyles:P,adaptiveTitle:A}=this.$props,g=t.getTabIndex(this.$props.tabIndex,d),x=ae.provideLocalizationService(this),z=S({validationMessage:q,valid:W,required:F},this.hasValue),I=this.adaptiveState,p=this.$props.dir,N=t.templateRendering.call(this,this.item,t.getListeners.call(this)),j=t.templateRendering.call(this,this.valueRender,t.getListeners.call(this)),_=t.templateRendering.call(this,this.$props.header,t.getListeners.call(this)),G=t.templateRendering.call(this,this.$props.footer,t.getListeners.call(this)),v=t.getTemplate.call(this,{h:s.h,template:_}),y=t.getTemplate.call(this,{h:s.h,template:G}),H=t.templateRendering.call(this,this.$props.listNoData,t.getListeners.call(this)),U=s.createVNode(oe.ListNoData,null,L(e=x.toLanguageString(c.nodata,c.messages[c.nodata]))?e:{default:()=>[e]}),M=t.getTemplate.call(this,{h:s.h,defaultRendering:U,template:H}),J=s.createVNode("span",{class:"k-input-value-text"},[this.currentValueText||r]),Q=t.getTemplate.call(this,{h:s.h,defaultRendering:J,template:j,additionalProps:{value:this.computedValue}}),X=()=>[s.createVNode("div",{class:"k-actionsheet-titlebar-group k-hbox"},[s.createVNode("div",{class:"k-actionsheet-title"},[s.createVNode("div",{class:"k-text-center"},[A]),s.createVNode("div",{class:"k-actionsheet-subtitle k-text-center"},[r])]),s.createVNode("div",{class:"k-actionsheet-actions"},[s.createVNode(B.Button,{tabIndex:1,"aria-label":"Cancel","aria-disabled":"false",type:"button",fillMode:"flat",onClick:this.onWrapperClick,icon:"x",svgIcon:w.xIcon},null)])]),s.createVNode("div",{class:"k-actionsheet-titlebar-group k-actionsheet-filter"},[this.$props.filterable&&s.createVNode(T.ListFilter,{tabIndex:0,value:this.$props.filter===void 0?this.filterState:this.$props.filter,ref:t.setRef(this,"input"),onChange:this.onFilterChange,onKeydown:this.onInputKeyDown,size:h,rounded:D,fillMode:V,onFocus:this.onFocus,onBlur:this.onBlur},null)])],Y=t.templateRendering.call(this,X,t.getListeners.call(this)),Z=()=>{const m=this.base.getTemplateDef.call(this,v,s.h),C=this.base.getTemplateDef.call(this,y,s.h);return[m&&s.createVNode("div",{class:"k-list-header"},[m]),n.length>0?s.createVNode(O.TreeView,{ref:t.setRef(this,"treeView"),tabIndex:g,dataItems:n,focusIdField:a,textField:this.$props.textField,selectField:R,expandField:this.$props.expandField,childrenField:$,expandIcons:!0,onItemclick:this.onChange,onExpandchange:this.onExpand,onFocus:this.onFocus,onBlur:this.onBlur,onKeydown:this.onWrapperKeyDown,size:"large",item:N},null):M,C&&s.createVNode("div",{class:"k-list-footer"},[C])]},ee=t.templateRendering.call(this,Z,t.getListeners.call(this)),te=function(){return s.createVNode(re.ActionSheet,{expand:this.isOpen,animation:!0,animationStyles:this.animationStyles,className:this.classNameAdaptive,header:Y,content:ee,contentClassName:"!k-overflow-hidden",onClose:this.onWrapperClick,navigatableElements:["input.k-input-inner",".k-actionsheet-actions > button"]},null)},ie=!P||z.valid,{size:h,rounded:D,fillMode:V}=this.$props,se=function(){return s.createVNode("span",{class:this.wrapperClass,tabindex:g,accesskey:this.$props.accessKey,id:i,dir:p,ref:t.setRef(this,"kendoAnchor"),onKeydown:this.onWrapperKeyDown,onClick:this.onWrapperClick,onMousedown:this.onWrapperMouseDown,onFocusin:this.onFocus,onFocusout:this.onBlur,role:"combobox","aria-haspopup":"tree","aria-expanded":this.isOpen,"aria-disabled":d||void 0,"aria-label":l||this.$props.ariaLabel,"aria-labelledby":this.$props.ariaLabelledBy,"aria-describedby":this.$props.ariaDescribedBy,"aria-required":F||void 0},[s.createVNode("span",{class:"k-input-inner"},[Q]),this.$props.loading&&s.createVNode(t.Icon,{class:"k-input-loading-icon",name:"loading"},null),this.hasValue&&!d&&s.createVNode("span",{onClick:this.onClear,class:"k-clear-value",title:x.toLanguageString(c.clear,c.messages[c.clear]),role:"button",tabindex:-1,onMousedown:m=>m.preventDefault()},[s.createVNode(t.Icon,{name:"x",icon:w.xIcon},null)]),s.createVNode(B.Button,{tabIndex:-1,type:"button","aria-label":"select",class:"k-input-button",size:h,fillMode:V,themeColor:"base",rounded:null,icon:"chevron-down",svgIcon:w.chevronDownIcon},null),s.createVNode("select",{name:u,ref:t.setRef(this,"select"),tabindex:-1,"aria-hidden":!0,title:l,style:{opacity:0,width:1,border:0,zIndex:-1,position:"absolute",left:"50%"}},[s.createVNode("option",{value:this.$props.valueMap?this.$props.valueMap.call(void 0,this.computedValue):this.computedValue},null)]),this.showLicenseWatermark?s.createVNode(t.WatermarkOverlay,{message:this.licenseMessage},null):null,!I&&s.createVNode(ne.Popup,{style:{width:this.popupWidth,direction:p},ref:t.setRef(this,"popup"),class:t.classNames(o.className,{"k-rtl":p==="rtl"}),popupClass:t.classNames(o.popupClass,"k-dropdowntree-popup","popup-"+this.componentGuid),animate:o.animate,anchor:this.anchor,show:this.isOpen,onOpen:this.onPopupOpened,onClose:this.onPopupClosed,appendTo:o.appendTo},{default:()=>[this.$props.filterable&&s.createVNode(T.ListFilter,{value:this.$props.filter===void 0?this.filterState:this.$props.filter,ref:t.setRef(this,"input"),onChange:this.onFilterChange,onKeydown:this.onInputKeyDown,onBlur:this.onBlur,size:h,rounded:D,fillMode:V},null),v&&s.createVNode("div",{class:"k-list-header"},[v]),n.length>0?s.createVNode(O.TreeView,{ref:t.setRef(this,"treeView"),tabIndex:g,dataItems:n,focusIdField:a,textField:this.$props.textField,selectField:R,expandField:this.$props.expandField,childrenField:$,expandIcons:!0,onItemclick:this.onChange,onExpandchange:this.onExpand,onFocus:this.onFocus,onBlur:this.onBlur,onKeydown:this.onWrapperKeyDown,size:h,item:N},null):M,y&&s.createVNode("div",{class:"k-list-footer"},[y])]})])},f=[s.h(se.call(this),{...this.$attrs}),I&&te.call(this)];return l?s.createVNode(le.FloatingLabel,{label:l,editorValue:this.currentValueText,editorPlaceholder:r,editorValid:ie,editorDisabled:d,editorId:i,focused:this.focused,dir:p},L(f)?f:{default:()=>[f]}):f},methods:{calculateMedia(e){for(let i of e)this.windowWidth=i.target.clientWidth},calculatePopupWidth(){this.elementRef&&(this.popupWidth=this.popupSettings.width!==void 0?this.popupSettings.width:this.elementRef.offsetWidth+"px")},focus(){this.$el&&this.$el.focus()},setValidity(){if(this.selectRef&&this.selectRef.setCustomValidity){const{validationMessage:e,valid:i,required:n}=this.$props,a=S({validationMessage:e,valid:i,required:n},this.hasValue);this.selectRef.setCustomValidity(a.valid?"":this.validationMessage===void 0?pe:this.validationMessage)}},openPopup(e){if(!this.isOpen){const i={...e};this.$emit("open",i),this.currentOpened=!0}},closePopup(e){if(this.isOpen){const i={...e};this.$emit("close",i),this.currentOpened=!1}},onWrapperClick(e){if(this.onFilterChange({...e,target:{value:""}}),!e.defaultPrevented&&this.$el){this.focused=!0;const i={event:e,target:this};(this.isOpen?this.closePopup:this.openPopup)(i)}},switchFocus(e){this.skipFocusRef=!0,e(),window.setTimeout(()=>this.skipFocusRef=!1,0)},onWrapperKeyDown(e){const{keyCode:i,altKey:n}=e,a=this.treeViewRef&&this.treeViewRef.$el,o=this.inputRef&&this.inputRef.input;if(this.$props.disabled||e.defaultPrevented&&o===e.target)return;const d={event:e,target:this};if(this.isOpen)if(i===t.Keys.esc||n&&i===t.Keys.up)e.preventDefault(),this.closePopup(d);else if(a&&a.querySelector(".k-focus")&&(i===t.Keys.up||i===t.Keys.down||i===t.Keys.left||i===t.Keys.right||i===t.Keys.home||i===t.Keys.end)){if(i===t.Keys.up&&o){const r=Array.from(a.querySelectorAll(".k-treeview-item")),l=[...r].reverse().find(u=>!!(u&&u.querySelector(".k-focus")));if(l&&r.indexOf(l)===0)return this.switchFocus(()=>{this.focusElement(o)})}this.switchFocus(t.noop)}else i===t.Keys.down&&this.switchFocus(()=>{this.focusElement(o||a)});else n&&i===t.Keys.down&&(e.preventDefault(),this.openPopup(d))},onInputKeyDown(e){const{keyCode:i,altKey:n}=e;if(i===t.Keys.esc)this.onWrapperClick(e);else if(n||i!==t.Keys.up&&i!==t.Keys.down)return;e.preventDefault(),this.switchFocus(i===t.Keys.up?()=>{this.focusElement(this.elementRef)}:()=>{this.focusElement(this.treeViewRef&&this.treeViewRef.$el)})},focusElement(e){e&&this.switchFocus(()=>e.focus())},onPopupOpened(){if(!this.focused&&this.isOpen&&!this.currentOpened)this.closePopup({target:this});else if(this.$props.filterable){const e=this.inputRef&&this.inputRef.input;this.focusElement(e)}else this.focusElement(this.treeViewRef&&this.treeViewRef.$el)},onPopupClosed(){this.focused&&this.focusElement(this.elementRef)},onFocus(e){if(!this.focused&&!this.skipFocusRef){this.focused=!0;const i={event:e,target:this};this.$emit("focus",i)}},onBlur(e){var i;if(this.focused&&!this.skipFocusRef){this.focused=!1;const n={event:e,target:this},a={...n},o=e.relatedTarget||((i=e.event)==null?void 0:i.relatedTarget);!(o!=null&&o.closest(".popup-"+this.componentGuid))&&!this.adaptiveState&&(this.$emit("blur",a),this.closePopup(n))}},onWrapperMouseDown(){this.focused&&this.switchFocus(t.noop)},changeValue(e,i,n){const a={value:i,level:n?E(n):[],...e};this.$emit("changemodel",i),this.$emit("update:modelValue",i),this.$emit("change",a),this.currentValue=i},onChange(e){if(k.areSame(e.item,this.computedValue,this.dataItemKey)||!this.$el)return;const{item:i,itemHierarchicalIndex:n,event:a}=e,o={event:a,target:this};this.changeValue(o,i,n),this.closePopup(o)},onClear(e){const i={event:e,target:this};this.changeValue(i,null),this.closePopup(i),e.preventDefault()},onExpand(e){const{item:i,itemHierarchicalIndex:n,event:a}=e,o={level:E(n),item:i,event:a,target:this};this.$emit("expandchange",o)},onFilterChange(e){const n={filter:{field:this.$props.textField,operator:"contains",value:e.target.value},event:e,target:this};this.$emit("filterchange",n),this.$props.filter===void 0&&(this.filterState=e.target.value)}}});exports.DropDownTree=he;
@@ -388,11 +388,11 @@ const {
388
388
  role: "combobox",
389
389
  "aria-haspopup": "tree",
390
390
  "aria-expanded": this.isOpen,
391
- "aria-disabled": d,
391
+ "aria-disabled": d || void 0,
392
392
  "aria-label": l || this.$props.ariaLabel,
393
393
  "aria-labelledby": this.$props.ariaLabelledBy,
394
394
  "aria-describedby": this.$props.ariaDescribedBy,
395
- "aria-required": D
395
+ "aria-required": D || void 0
396
396
  }, [
397
397
  i("span", {
398
398
  class: "k-input-inner"