@progress/kendo-vue-dropdowns 5.3.0-dev.202409130647 → 5.3.0-develop.1

package/dist/esm/common/DropDownBase.js

@@ -1,298 +0,0 @@
-var __assign = this && this.__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) {
-        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-      }
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
-import VirtualScroll from './VirtualScroll.js';
-import { Navigation } from './Navigation.js';
-import { scrollToItem, areSame } from './utils.js';
-import { guid, validatePackage, templateRendering, getListeners, getTemplate } from '@progress/kendo-vue-common';
-import { packageMetadata } from '../package-metadata.js';
-/**
- * @hidden
- */
-var DropDownBase = /** @class */function () {
-  function DropDownBase(component) {
-    var _this = this;
-    this.vs = new VirtualScroll();
-    this.navigation = new Navigation();
-    this.handleItemClick = function (index, event) {
-      var state = _this.initState();
-      state.event = event;
-      _this.component.handleItemSelect(index, state);
-      _this.togglePopup(state);
-      _this.applyState(state);
-    };
-    this.handleFocus = function (event) {
-      if (!_this.component.currentFocused) {
-        var state = _this.initState();
-        // @ts-ignore
-        state.data.currentFocused = true;
-        state.events.push({
-          type: 'focus'
-        });
-        state.event = event;
-        _this.applyState(state);
-      }
-    };
-    this.filterChanged = function (text, state) {
-      var component = _this.component;
-      var _a = component.$props,
-        textField = _a.textField,
-        filterable = _a.filterable;
-      if (filterable) {
-        state.events.push({
-          type: 'filterchange',
-          filter: {
-            field: textField,
-            operator: 'contains',
-            ignoreCase: true,
-            value: text
-          }
-        });
-        _this.repositionPopup();
-      }
-    };
-    this.togglePopup = function (state) {
-      // @ts-ignore
-      var props = _this.component.$props;
-      // @ts-ignore
-      var opened = props.opened !== undefined ? props.opened : _this.component.currentOpened;
-      // @ts-ignore
-      if (props.opened === undefined) {
-        // @ts-ignore
-        state.data.currentOpened = !opened;
-      }
-      if (opened) {
-        state.events.push({
-          type: 'close'
-        });
-      } else {
-        state.events.push({
-          type: 'open'
-        });
-        _this.calculatePopupWidth();
-      }
-    };
-    this.pageChange = function (page, event) {
-      var state = _this.initState();
-      state.event = event;
-      _this.triggerOnPageChange(state, page.skip, page.take);
-      _this.applyState(state);
-    };
-    this.scrollChange = function (event) {
-      _this.component.$emit('scroll', event);
-    };
-    this.scrollToVirtualItem = function (virtual, selectedItemIndex) {
-      var vs = _this.vs;
-      vs.enabled = false;
-      if (virtual.skip === 0) {
-        vs.reset();
-      } else if (virtual.skip + virtual.pageSize === virtual.total) {
-        vs.scrollToEnd();
-      } else {
-        var scrollTop = vs.translate;
-        if (scrollTop === 0) {
-          vs.calcScrollElementHeight();
-          scrollTop = vs.itemHeight * virtual.skip;
-          vs.translateTo(scrollTop - vs.itemHeight);
-        }
-        if (vs.container) {
-          vs.container.scrollTop = scrollTop;
-        }
-        _this.scrollToItem(selectedItemIndex, true);
-      }
-      setTimeout(function () {
-        return vs.enabled = true;
-      }, 10);
-    };
-    this.getGroupedDataModernMode = function (data, groupField) {
-      var newData = [];
-      data.forEach(function (el, index) {
-        var _a;
-        if (data[index - 1] && el[groupField] !== data[index - 1][groupField]) {
-          newData.push((_a = {}, _a[groupField] = el[groupField], _a));
-          newData.push(data[index]);
-        } else {
-          newData.push(data[index]);
-        }
-      });
-      return newData;
-    };
-    this.resetGroupStickyHeader = function (groupName, that) {
-      var state = _this.initState();
-      if (groupName !== that.group && that.state) {
-        that.state.data.group = groupName;
-        _this.applyState(state);
-      }
-    };
-    validatePackage(packageMetadata);
-    this.listBoxId = guid();
-    this.guid = guid();
-    this.component = component;
-    this.vs.PageChange = this.pageChange;
-    this.vs.ScrollChange = this.scrollChange;
-  }
-  DropDownBase.prototype.didMount = function () {
-    // @ts-ignore
-    var props = this.component.$props;
-    var popupSettings = props.popupSettings || {};
-    var style = props.style || {};
-    var popupWidth = popupSettings.width;
-    var shouldUpdate = props.opened === true;
-    if (popupWidth === undefined) {
-      this.calculatePopupWidth();
-    }
-    if (props.dir === undefined && style.direction === undefined) {
-      this.calculateDir();
-      shouldUpdate = true;
-    }
-    if (shouldUpdate) {
-      // @ts-ignore
-      this.component.$forceUpdate();
-    }
-  };
-  DropDownBase.prototype.calculateDir = function () {
-    if (this.component.element) {
-      this.dirCalculated = window.getComputedStyle(this.component.element).direction || undefined;
-    }
-  };
-  DropDownBase.prototype.calculatePopupWidth = function () {
-    // @ts-ignore
-    var props = this.component.$props;
-    var popupSettings = props.popupSettings || {};
-    var popupWidth = popupSettings.width;
-    if (this.wrapper && !popupWidth) {
-      this.component.popupWidth = props.popupSettings.width !== undefined ? props.popupSettings.width : this.wrapper.offsetWidth + 'px';
-    }
-  };
-  DropDownBase.prototype.scrollToItem = function (itemIndex, vsEnabled) {
-    var list = this.list || this.vs.list;
-    var item = list ? list.children[0] : undefined;
-    if (item && itemIndex >= 0) {
-      var vs = this.vs;
-      var scrollElement = vs.container || list.parentNode;
-      if (scrollElement) {
-        var virtualScroll = vsEnabled !== undefined ? vsEnabled : vs.enabled;
-        scrollToItem(scrollElement, item.offsetHeight, itemIndex, vs.translate, virtualScroll);
-      }
-    }
-  };
-  DropDownBase.prototype.repositionPopup = function () {
-    var component = this.component;
-    setTimeout(function () {
-      var lc = component.$refs.container;
-      if (lc) {
-        var popup = lc.$refs.popup;
-        if (popup && popup.show) {
-          popup.reposition();
-        }
-      }
-    }, 5);
-  };
-  DropDownBase.prototype.initState = function () {
-    var state = {
-      data: {},
-      events: [],
-      event: undefined
-    };
-    return state;
-  };
-  DropDownBase.prototype.applyState = function (state) {
-    var _this = this;
-    if (Object.keys(state.data).length > 0) {
-      Object.keys(state.data).forEach(function (key) {
-        _this.component[key] = state.data[key];
-      });
-    }
-    // @ts-ignore
-    var newValue = this.component.primitiveValue();
-    var eventArgs = {
-      event: state.event,
-      component: this.component,
-      target: {
-        // @ts-ignore
-        name: this.component.$props.name,
-        value: newValue
-      },
-      value: newValue
-    };
-    state.events.forEach(function (eventData) {
-      var type = eventData.type;
-      delete eventData.type;
-      if (type) {
-        if (type === 'change') {
-          // @ts-ignore
-          _this.component.$emit('changemodel', newValue);
-          // @ts-ignore
-          _this.component.$emit('update:modelValue', newValue);
-        }
-        // @ts-ignore
-        _this.component.$emit(type, __assign(__assign({}, eventArgs), eventData));
-      }
-    });
-  };
-  DropDownBase.prototype.triggerOnPageChange = function (state, skip, take) {
-    // @ts-ignore
-    var virtual = this.component.$props.virtual;
-    if (virtual) {
-      var newSkip = Math.min(Math.max(0, skip), Math.max(0, virtual.total - take));
-      if (newSkip !== virtual.skip) {
-        state.events.push({
-          type: 'pagechange',
-          page: {
-            skip: newSkip,
-            take: take
-          }
-        });
-      }
-    }
-  };
-  DropDownBase.prototype.triggerPageChangeCornerItems = function (item, state) {
-    // @ts-ignore
-    var props = this.component.$props;
-    var _a = props.dataItems,
-      dataItems = _a === void 0 ? [] : _a,
-      dataItemKey = props.dataItemKey,
-      virtual = props.virtual;
-    var opened = props.opened !== undefined ? props.opened : this.component.currentOpened;
-    if (item && virtual && this.vs.enabled) {
-      if (virtual.skip > 0 && areSame(item, dataItems[0], dataItemKey)) {
-        this.triggerOnPageChange(state, virtual.skip - 1, virtual.pageSize);
-      } else if (virtual.skip + virtual.pageSize < virtual.total && areSame(item, dataItems[dataItems.length - 1], dataItemKey)) {
-        this.triggerOnPageChange(state, virtual.skip + 1, virtual.pageSize);
-      } else if (!opened && virtual.skip + virtual.pageSize < virtual.total && areSame(item, dataItems[dataItems.length - 1], dataItemKey)) {
-        this.triggerOnPageChange(state, virtual.skip + 1, virtual.pageSize);
-      }
-    }
-  };
-  DropDownBase.prototype.getTemplateDef = function (template, h) {
-    var templateRender = templateRendering.call(this, template, getListeners.call(this));
-    return getTemplate.call(this, {
-      h: h,
-      template: templateRender
-    });
-  };
-  DropDownBase.prototype.getListItemHeight = function (listItem) {
-    var compStyles = listItem && window.getComputedStyle(listItem);
-    return compStyles ? compStyles.height.slice(0, compStyles.height.length - 2) : 0; // Get the height of the list item as Number
-  };
-
-  DropDownBase.defaultProps = {
-    popupSettings: {
-      animate: true,
-      height: '200px'
-    },
-    required: false,
-    validityStyles: true
-  };
-  return DropDownBase;
-}();
-export default DropDownBase;

package/dist/esm/common/GroupStickyHeader.d.ts

@@ -1,32 +0,0 @@
-import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
-declare type DefaultData<V> = object | ((this: V) => {});
-declare type DefaultMethods<V> = {
-    [key: string]: (this: V, ...args: any[]) => any;
-};
-/**
- * Represents the props of the GroupStickyHeader component.
- */
-export interface GroupStickyHeaderProps {
-    /**
-     * The group that will be rendered.
-     */
-    group?: string;
-    /**
-     * Fires when a sticky group header item is about to be rendered. Used to override the default appearance of the sticky group header of the component.
-     */
-    render?: any;
-}
-/**
- * @hidden
- */
-export interface GroupStickyHeaderAll extends Vue2type {
-}
-/**
- * @hidden
- */
-declare let GroupStickyHeaderVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<{}>, {}, RecordPropsDefinition<GroupStickyHeaderProps>>;
-/**
- * @hidden
- */
-declare const GroupStickyHeader: DefineComponent<GroupStickyHeaderProps, any, {}, {}, {}, {}, {}, {}, string, GroupStickyHeaderProps, GroupStickyHeaderProps, {}>;
-export { GroupStickyHeader, GroupStickyHeaderVue2 };

package/dist/esm/common/GroupStickyHeader.js

@@ -1,60 +0,0 @@
-var __assign = this && this.__assign || function () {
-  __assign = Object.assign || function (t) {
-    for (var s, i = 1, n = arguments.length; i < n; i++) {
-      s = arguments[i];
-      for (var p in s) {
-        if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-      }
-    }
-    return t;
-  };
-  return __assign.apply(this, arguments);
-};
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-var ref = allVue.ref;
-import { getTemplate } from '@progress/kendo-vue-common';
-/**
- * @hidden
- */
-var GroupStickyHeaderVue2 = {
-  name: 'KendoGroupStickyHeader',
-  inheritAttrs: false,
-  props: {
-    group: String,
-    render: Object
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    return {
-      v3: v3
-    };
-  },
-  // @ts-ignore
-  render: function render(createElement) {
-    var h = gh || createElement;
-    var _a = this.$props,
-      group = _a.group,
-      render = _a.render;
-    var defaulGroupStickyHeader = h("div", {
-      "class": "k-list-group-sticky-header"
-    }, [h("div", {
-      "class": "k-list-header-text"
-    }, [group])]);
-    return getTemplate.call(this, {
-      h: h,
-      template: render,
-      defaultRendering: defaulGroupStickyHeader,
-      additionalProps: __assign({}, this.$props)
-    });
-  }
-};
-/**
- * @hidden
- */
-var GroupStickyHeader = GroupStickyHeaderVue2;
-export { GroupStickyHeader, GroupStickyHeaderVue2 };

package/dist/esm/common/List.d.ts

@@ -1,60 +0,0 @@
-import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
-declare type DefaultData<V> = object | ((this: V) => {});
-declare type DefaultMethods<V> = {
-    [key: string]: (this: V, ...args: any[]) => any;
-};
-/**
- * @hidden
- */
-export interface ListProps {
-    id?: string;
-    show?: boolean;
-    dataItems: any[];
-    value?: any;
-    textField?: string;
-    valueField?: string;
-    optionsGuid?: string;
-    listRef?: (element: HTMLUListElement) => void;
-    wrapperCssClass?: string;
-    wrapperStyle?: any;
-    listStyle?: any;
-    skip?: number;
-    focusedIndex?: number;
-    highlightSelected?: boolean;
-    onClick?: (index: number, event: any) => void;
-    itemRender?: any;
-    groupHeaderItemRender?: any;
-    noDataRender?: any;
-    scroller?: boolean;
-    groupField: string;
-}
-/**
- * @hidden
- */
-export interface ListMethods extends Vue2type {
-    handleClick: (e: any) => void;
-    handleScroll: (e: any) => void;
-}
-/**
- * @hidden
- */
-export interface ListState {
-    list: any;
-    listRef: any;
-    v3: boolean;
-}
-/**
- * @hidden
- */
-export interface ListAll extends ListMethods, ListState {
-    listRef: any;
-}
-/**
- * @hidden
- */
-declare let ListVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<ListMethods>, {}, RecordPropsDefinition<ListProps>>;
-/**
- * @hidden
- */
-declare const List: DefineComponent<{}, any, {}, {}, ListMethods, {}, {}, {}, string, {}, {}, {}>;
-export { List, ListVue2 };

package/dist/esm/common/List.js

@@ -1,201 +0,0 @@
-// @ts-ignore
-import * as Vue from 'vue';
-var allVue = Vue;
-var gh = allVue.h;
-var isV3 = allVue.version && allVue.version[0] === '3';
-var ref = allVue.ref;
-var inject = allVue.inject;
-import { ListItem } from './ListItem.js';
-import { ListGroupItem } from './ListGroupItem.js';
-import { areSame, getItemValue } from './utils.js';
-import { getTemplate, getDefaultSlots, setRef, getRef } from '@progress/kendo-vue-common';
-import { provideLocalizationService } from '@progress/kendo-vue-intl';
-import { messages, nodata } from '../messages/main.js';
-/**
- * @hidden
- */
-var ListVue2 = {
-  name: 'list',
-  // @ts-ignore
-  emits: {
-    listclick: null,
-    scroll: null
-  },
-  inheritAttrs: false,
-  props: {
-    id: String,
-    show: Boolean,
-    dataItems: Array,
-    value: [Object, String, Number, Boolean, Array],
-    textField: String,
-    valueField: String,
-    optionsGuid: String,
-    wrapperCssClass: String,
-    wrapperStyle: Object,
-    listStyle: Object,
-    skip: Number,
-    focusedIndex: Number,
-    highlightSelected: {
-      type: Boolean,
-      default: true
-    },
-    itemRender: [String, Function, Object],
-    groupHeaderItemRender: [String, Function, Object],
-    noDataRender: [String, Function, Object],
-    scroller: Boolean,
-    groupField: String
-  },
-  inject: {
-    kendoLocalizationService: {
-      default: null
-    }
-  },
-  // @ts-ignore
-  setup: !isV3 ? undefined : function () {
-    var v3 = !!isV3;
-    var listRef = ref(null);
-    var kendoLocalizationService = inject('kendoLocalizationService', {});
-    return {
-      v3: v3,
-      listRef: listRef,
-      kendoLocalizationService: kendoLocalizationService
-    };
-  },
-  mounted: function mounted() {
-    this.list = getRef(this, 'list');
-  },
-  methods: {
-    handleClick: function handleClick(index, e) {
-      this.$emit('listclick', index, e);
-    },
-    handleScroll: function handleScroll(e) {
-      this.$emit('scroll', e);
-    }
-  },
-  // @ts-ignore
-  render: function render(createElement) {
-    var h = gh || createElement;
-    var defaultSlot = getDefaultSlots(this);
-    var localizationService = provideLocalizationService(this);
-    var _a = this.$props,
-      id = _a.id,
-      show = _a.show,
-      wrapperCssClass = _a.wrapperCssClass,
-      wrapperStyle = _a.wrapperStyle,
-      listStyle = _a.listStyle,
-      listRef = _a.listRef;
-    var renderNoValueElement = function renderNoValueElement() {
-      var noDataRender = this.$props.noDataRender;
-      var noDataElement = h("div", {
-        "class": 'k-nodata'
-      }, [h("div", [localizationService.toLanguageString(nodata, messages[nodata])])]);
-      return getTemplate.call(this, {
-        h: h,
-        template: noDataRender,
-        defaultRendering: noDataElement
-      });
-    };
-    var renderItems = function renderItems() {
-      var _a = this.$props,
-        textField = _a.textField,
-        valueField = _a.valueField,
-        optionsGuid = _a.optionsGuid,
-        _b = _a.skip,
-        skip = _b === void 0 ? 0 : _b,
-        focusedIndex = _a.focusedIndex,
-        highlightSelected = _a.highlightSelected,
-        value = _a.value,
-        groupField = _a.groupField,
-        itemRender = _a.itemRender,
-        groupHeaderItemRender = _a.groupHeaderItemRender,
-        dataItems = _a.dataItems;
-      var isArray = Array.isArray(value);
-      var groupCounter = 0;
-      return dataItems.map(function (item, index) {
-        var realIndex = skip + index;
-        var selected = highlightSelected && (!isArray && areSame(item, value, valueField) || isArray && value.findIndex(function (i) {
-          return areSame(i, item, valueField);
-        }) !== -1);
-        var group = undefined;
-        var current, previous;
-        if (index > 0 && groupField !== undefined) {
-          current = getItemValue(item, groupField);
-          previous = getItemValue(dataItems[index - 1], groupField);
-          if (current && previous && current !== previous !== undefined) {
-            group = current;
-          }
-        }
-        if (group !== undefined && Object.keys(item).length === 1) {
-          groupCounter += 1;
-        }
-        return group !== undefined && item[groupField] !== undefined && Object.keys(item).length === 1 ? h(ListGroupItem, {
-          id: "option-".concat(optionsGuid, "-").concat(realIndex),
-          attrs: this.v3 ? undefined : {
-            id: "option-".concat(optionsGuid, "-").concat(realIndex),
-            group: group,
-            render: groupHeaderItemRender
-          },
-          key: realIndex + '-group-item',
-          group: group,
-          render: groupHeaderItemRender
-        }) : h(ListItem, {
-          id: "option-".concat(optionsGuid, "-").concat(realIndex),
-          attrs: this.v3 ? undefined : {
-            id: "option-".concat(optionsGuid, "-").concat(realIndex),
-            dataItem: item,
-            selected: selected,
-            focused: focusedIndex === realIndex - groupCounter,
-            index: realIndex - groupCounter,
-            textField: textField,
-            group: group,
-            render: itemRender
-          },
-          dataItem: item,
-          selected: selected,
-          focused: focusedIndex === realIndex - groupCounter,
-          index: realIndex - groupCounter,
-          key: realIndex - groupCounter,
-          onItemclick: this.handleClick,
-          on: this.v3 ? undefined : {
-            "itemclick": this.handleClick
-          },
-          textField: textField,
-          group: group,
-          render: itemRender
-        });
-      }, this);
-    };
-    var items = renderItems.call(this);
-    return items.length ? h("div", {
-      "class": wrapperCssClass,
-      style: wrapperStyle,
-      unselectable: 'on',
-      attrs: this.v3 ? undefined : {
-        unselectable: 'on'
-      },
-      onScroll: this.handleScroll,
-      on: this.v3 ? undefined : {
-        "scroll": this.handleScroll
-      }
-    }, [h("ul", {
-      id: id,
-      attrs: this.v3 ? undefined : {
-        id: id,
-        role: "listbox",
-        "aria-live": "polite",
-        "aria-hidden": !show ? true : undefined
-      },
-      role: "listbox",
-      "aria-live": "polite",
-      "aria-hidden": !show ? true : undefined,
-      "class": 'k-list-ul',
-      ref: setRef(this, 'list'),
-      style: listStyle
-    }, [items]), defaultSlot]) : renderNoValueElement.call(this);
-  }
-};
-/**
- * @hidden
- */
-var List = ListVue2;
-export { List, ListVue2 };

package/dist/esm/common/ListContainer.d.ts

@@ -1,40 +0,0 @@
-import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
-declare type DefaultData<V> = object | ((this: V) => {});
-declare type DefaultMethods<V> = {
-    [key: string]: (this: V, ...args: any[]) => any;
-};
-/**
- * @hidden
- */
-export interface ListContainerProps {
-    width?: string | number;
-    onMouseDown?: any;
-    onBlur?: any;
-    dir?: string;
-    popupSettings?: object;
-    itemsCount?: number;
-}
-/**
- * @hidden
- */
-export interface ListContainerState {
-    kendoAnchorRef: any;
-}
-/**
- * @hidden
- */
-export interface ListContainerMethods extends Vue2type {
-    onMouseDown: (e: any) => void;
-    onBlur: (e: any) => void;
-    onOpen: (e: any) => void;
-    onClose: (e: any) => void;
-}
-/**
- * @hidden
- */
-declare let ListContainerVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<ListContainerMethods>, {}, RecordPropsDefinition<ListContainerProps>>;
-/**
- * @hidden
- */
-declare const ListContainer: DefineComponent<ListContainerProps, any, {}, {}, ListContainerMethods, {}, {}, {}, string, ListContainerProps, ListContainerProps, {}>;
-export { ListContainer, ListContainerVue2 };