@progress/kendo-vue-dropdowns 8.4.0-develop.2 → 8.4.0-develop.4

package/DropDownTree/DropDownTree.mjs

@@ -6,7 +6,7 @@
  *-------------------------------------------------------------------------------------------
  */
 import { defineComponent as ce, h as u, createVNode as i, isVNode as fe } from "vue";
-import { noop as W, Keys as a, getTabIndex as me, templateRendering as h, getListeners as c, getTemplate as w, getRef as f, canUseDOM as ge, kendoThemeMaps as ve, validatePackage as be, shouldShowValidationUI as ye, getLicenseMessage as we, guid as P, setRef as m, Icon as L, WatermarkOverlay as ke, classNames as A } from "@progress/kendo-vue-common";
+import { noop as W, Keys as a, getTabIndex as me, templateRendering as h, getListeners as c, getTemplate as w, getRef as f, canUseDOM as ve, kendoThemeMaps as ge, validatePackage as be, shouldShowValidationUI as ye, getLicenseMessage as we, guid as P, setRef as m, Icon as L, WatermarkOverlay as ke, classNames as A } from "@progress/kendo-vue-common";
 import { Popup as Se } from "@progress/kendo-vue-popup";
 import { provideLocalizationService as $e } from "@progress/kendo-vue-intl";
 import { TreeView as K } from "@progress/kendo-vue-treeview";
@@ -17,7 +17,7 @@ import { nodata as N, messages as z, clear as j } from "../messages/main.mjs";
 import { FloatingLabel as Ie } from "@progress/kendo-vue-labels";
 import { ListFilter as q } from "../common/ListFilter.mjs";
 import { Button as _ } from "@progress/kendo-vue-buttons";
-import { xIcon as G, caretAltDownIcon as De } from "@progress/kendo-svg-icons";
+import { xIcon as G, chevronDownIcon as De } from "@progress/kendo-svg-icons";
 import { MOBILE_MEDIUM_DEVICE as Me, MOBILE_SMALL_DEVICE as Ce } from "../common/constants.mjs";
 import { ActionSheet as Oe } from "@progress/kendo-vue-layout";
 import Be from "../common/DropDownBase.mjs";
@@ -27,7 +27,7 @@ function H(e) {
 const {
   sizeMap: Ee,
   roundedMap: Te
-} = ve, We = "Please select a value from the list!", U = (e) => e.split("_").map((t) => parseInt(t, 10)), x = (e, t) => {
+} = ge, We = "Please select a value from the list!", U = (e) => e.split("_").map((t) => parseInt(t, 10)), x = (e, t) => {
   const {
     validationMessage: s,
     valid: n,
@@ -253,7 +253,7 @@ const {
     }
   },
   mounted() {
-    this.observer = ge && window.ResizeObserver && new ResizeObserver(this.calculateMedia), document != null && document.body && this.observer && this.observer.observe(document.body), this.elementRef = f(this, "kendoAnchor"), this.inputRef = f(this, "input"), this.selectRef = f(this, "select"), this.treeViewRef = f(this, "treeView"), this.skipFocusRef = !1, this.popupRef = f(this, "popup"), this.calculatePopupWidth();
+    this.observer = ve && window.ResizeObserver && new ResizeObserver(this.calculateMedia), document != null && document.body && this.observer && this.observer.observe(document.body), this.elementRef = f(this, "kendoAnchor"), this.inputRef = f(this, "input"), this.selectRef = f(this, "select"), this.treeViewRef = f(this, "treeView"), this.skipFocusRef = !1, this.popupRef = f(this, "popup"), this.calculatePopupWidth();
   },
   updated() {
     this.inputRef = f(this, "input"), this.treeViewRef = f(this, "treeView"), this.popupRef && this.isOpen && this.hasValue && this.popupRef.reposition(), this.setValidity(), this.calculatePopupWidth();
@@ -279,7 +279,7 @@ const {
       validationMessage: J,
       valid: Q,
       required: D
-    }, this.hasValue), C = this.adaptiveState, g = this.$props.dir, O = h.call(this, this.item, c.call(this)), ee = h.call(this, this.valueRender, c.call(this)), te = h.call(this, this.$props.header, c.call(this)), ie = h.call(this, this.$props.footer, c.call(this)), S = w.call(this, {
+    }, this.hasValue), C = this.adaptiveState, v = this.$props.dir, O = h.call(this, this.item, c.call(this)), ee = h.call(this, this.valueRender, c.call(this)), te = h.call(this, this.$props.header, c.call(this)), ie = h.call(this, this.$props.footer, c.call(this)), S = w.call(this, {
       h: u,
       template: te
     }), $ = w.call(this, {
@@ -327,7 +327,7 @@ const {
       ref: m(this, "input"),
       onChange: this.onFilterChange,
       onKeydown: this.onInputKeyDown,
-      size: v,
+      size: g,
       rounded: E,
       fillMode: F,
       onFocus: this.onFocus,
@@ -369,7 +369,7 @@ const {
         navigatableElements: ["input.k-input-inner", ".k-actionsheet-actions > button"]
       }, null);
     }, he = !X || Z.valid, {
-      size: v,
+      size: g,
       rounded: E,
       fillMode: F
     } = this.$props, b = [u(function() {
@@ -378,7 +378,7 @@ const {
         tabindex: k,
         accesskey: this.$props.accessKey,
         id: t,
-        dir: g,
+        dir: v,
         ref: m(this, "kendoAnchor"),
         onKeydown: this.onWrapperKeyDown,
         onClick: this.onWrapperClick,
@@ -417,11 +417,11 @@ const {
           type: "button",
           "aria-label": "select",
           class: "k-input-button",
-          size: v,
+          size: g,
           fillMode: F,
           themeColor: "base",
           rounded: null,
-          icon: "caret-alt-down",
+          icon: "chevron-down",
           svgIcon: De
         }, null),
         /* Dummy component to support forms */
@@ -448,11 +448,11 @@ const {
         !C && i(Se, {
           style: {
             width: this.popupWidth,
-            direction: g
+            direction: v
           },
           ref: m(this, "popup"),
           class: A(o.className, {
-            "k-rtl": g === "rtl"
+            "k-rtl": v === "rtl"
           }),
           popupClass: A(o.popupClass, "k-dropdowntree-popup", "popup-" + this.componentGuid),
           animate: o.animate,
@@ -468,7 +468,7 @@ const {
             onChange: this.onFilterChange,
             onKeydown: this.onInputKeyDown,
             onBlur: this.onBlur,
-            size: v,
+            size: g,
             rounded: E,
             fillMode: F
           }, null), S && i("div", {
@@ -488,7 +488,7 @@ const {
             onFocus: this.onFocus,
             onBlur: this.onBlur,
             onKeydown: this.onWrapperKeyDown,
-            size: v,
+            size: g,
             item: O
           }, null) : B, $ && i("div", {
             class: "k-list-footer"
@@ -506,7 +506,7 @@ const {
       editorDisabled: d,
       editorId: t,
       focused: this.focused,
-      dir: g
+      dir: v
     }, H(b) ? b : {
       default: () => [b]
     }) : b;

package/common/SearchBar.js

@@ -5,4 +5,4 @@
  * Licensed under commercial license. See LICENSE.md in the package root for more information
  *-------------------------------------------------------------------------------------------
  */
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("vue"),n=require("@progress/kendo-vue-common"),d=s.defineComponent({name:"search-bar",emits:{change:e=>!0,keydown:e=>!0,focus:e=>!0,blur:e=>!0},props:{value:String,id:String,placeholder:String,tabIndex:Number,size:{type:Number,default:void 0},suggestedText:String,focused:Boolean,disabled:Boolean,readOnly:Boolean,expanded:Boolean,owns:String,name:String,activedescendant:String,ariaDescribedBy:String,clearButton:Boolean,accessKey:String,ariaLabelledBy:String,ariaLabel:{type:String,default:void 0},onClearbuttonclick:Function,inputAttributes:Object},data(){return{prevValue:void 0,prevSuggestedText:void 0}},watch:{suggestedText:function(e,t){this.prevSuggestedText=t},value:function(e,t){this.prevValue=t}},updated(){const{value:e,suggestedText:t,focused:r}=this.$props;this.input||(this.input=this.$refs.input);const i=this.input,a=this.$data.prevValue!==e||t!==this.prevSuggestedText,o=a&&this.$data.prevValue&&this.$data.prevValue.startsWith(e)&&!(this.$data.prevSuggestedText&&t&&this.$data.prevSuggestedText.endsWith(t));r&&i&&n.canUseDOM&&document.activeElement!==i&&i.focus(),t&&a&&!o&&i&&i.setSelectionRange(e.length-t.length,e.length)},setup(){return{inputRef:s.ref(null)}},mounted(){this.input=n.getRef(this,"input")},methods:{onChange(e){this.$emit("change",e)},onBlur(e){this.$emit("blur",e)},onFocus(e){this.$emit("focus",e)},onKeyDown(e){this.$emit("keydown",e)},clearButtonClick(e){this.$emit("clearbuttonclick",e)}},render(){return s.createVNode("input",s.mergeProps({autocomplete:"off",id:this.$props.id,type:"text",key:"searchbar",placeholder:this.$props.placeholder,class:"k-input-inner",tabindex:this.$props.tabIndex,accesskey:this.$props.accessKey,role:"combobox",name:this.$props.name,value:this.$props.value,size:this.$props.size?this.$props.size:20,onInput:this.onChange,ref:n.setRef(this,"input"),onKeydown:this.onKeyDown,onFocusin:this.onFocus,onBlur:this.onBlur,"aria-disabled":this.$props.disabled||void 0,disabled:this.$props.disabled||void 0,readonly:this.$props.readOnly||void 0,"aria-autocomplete":this.$props.suggestedText?"both":"list","aria-haspopup":"listbox","aria-expanded":this.$props.expanded||!1,"aria-controls":this.$props.owns,"aria-activedescendant":this.$props.expanded?this.$props.activedescendant:void 0,"aria-describedby":this.$props.ariaDescribedBy,"aria-labelledby":this.$props.ariaLabelledBy,"aria-label":this.$props.ariaLabel},this.$props.inputAttributes),null)}});exports.SearchBar=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("vue"),n=require("@progress/kendo-vue-common"),d=s.defineComponent({name:"search-bar",emits:{change:e=>!0,keydown:e=>!0,focus:e=>!0,blur:e=>!0},props:{value:String,id:String,placeholder:String,tabIndex:Number,size:{type:Number,default:void 0},suggestedText:String,focused:Boolean,disabled:Boolean,readOnly:Boolean,expanded:Boolean,owns:String,name:String,activedescendant:String,ariaDescribedBy:String,clearButton:Boolean,accessKey:String,ariaLabelledBy:String,ariaLabel:{type:String,default:void 0},onClearbuttonclick:Function,inputAttributes:Object},data(){return{prevValue:void 0,prevSuggestedText:void 0}},watch:{suggestedText:function(e,t){this.prevSuggestedText=t},value:function(e,t){this.prevValue=t}},updated(){const{value:e,suggestedText:t,focused:r}=this.$props;this.input||(this.input=this.$refs.input);const i=this.input,a=this.$data.prevValue!==e||t!==this.prevSuggestedText,o=a&&this.$data.prevValue&&this.$data.prevValue.startsWith(e)&&!(this.$data.prevSuggestedText&&t&&this.$data.prevSuggestedText.endsWith(t));r&&i&&n.canUseDOM&&document.activeElement!==i&&i.focus(),t&&a&&!o&&i&&i.setSelectionRange(e.length-t.length,e.length)},setup(){return{inputRef:s.ref(null)}},mounted(){this.input=n.getRef(this,"input")},methods:{onChange(e){this.$emit("change",e)},onBlur(e){this.$emit("blur",e)},onFocus(e){this.$emit("focus",e)},onKeyDown(e){this.$emit("keydown",e)},clearButtonClick(e){this.$emit("clearbuttonclick",e)}},render(){var e;return s.createVNode("input",s.mergeProps({autocomplete:"off",id:this.$props.id,type:"text",key:"searchbar",placeholder:this.$props.placeholder,class:"k-input-inner",tabindex:(e=this.$props.tabIndex)!=null?e:0,accesskey:this.$props.accessKey,role:"combobox",name:this.$props.name,value:this.$props.value,size:this.$props.size?this.$props.size:20,onInput:this.onChange,ref:n.setRef(this,"input"),onKeydown:this.onKeyDown,onFocusin:this.onFocus,onBlur:this.onBlur,"aria-disabled":this.$props.disabled||void 0,disabled:this.$props.disabled||void 0,readonly:this.$props.readOnly||void 0,"aria-autocomplete":this.$props.suggestedText?"both":"list","aria-haspopup":"listbox","aria-expanded":this.$props.expanded||!1,"aria-controls":this.$props.owns,"aria-activedescendant":this.$props.expanded?this.$props.activedescendant:void 0,"aria-describedby":this.$props.ariaDescribedBy,"aria-labelledby":this.$props.ariaLabelledBy,"aria-label":this.$props.ariaLabel},this.$props.inputAttributes),null)}});exports.SearchBar=d;

package/common/SearchBar.mjs

@@ -93,6 +93,7 @@ const b = /* @__PURE__ */ r({
     }
   },
   render() {
+    var e;
     return o("input", d({
       autocomplete: "off",
       id: this.$props.id,
@@ -100,7 +101,7 @@ const b = /* @__PURE__ */ r({
       key: "searchbar",
       placeholder: this.$props.placeholder,
       class: "k-input-inner",
-      tabindex: this.$props.tabIndex,
+      tabindex: (e = this.$props.tabIndex) != null ? e : 0,
       accesskey: this.$props.accessKey,
       role: "combobox",
       name: this.$props.name,