@progress/kendo-vue-buttons 2.7.2 → 2.8.0-dev.202201121019

package/dist/npm/Chip/ChipList.d.ts

@@ -1,5 +1,4 @@
-import { DefineComponent } from '../additionalTypes';
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+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;
@@ -50,6 +49,43 @@ export interface ChipListProps extends FormComponentProps {
      * Triggered after value change.
      */
     onChange?: (event: ChipListChangeEvent) => void;
+    /**
+     * Configures the `size` of the Chip.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null&mdash;Does not set a size `class`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large' | string;
+    /**
+     * Configures the `roundness` of the Chip.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - full
+     * - null&mdash;Does not set a rounded `class`.
+     *
+     * @default `medium`
+     */
+    rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
+    /**
+     * Configures the `fillMode` of the Chip.
+     *
+     * The available options are:
+     * - solid
+     * - outline
+     * - flat
+     * - null&mdash;Does not set a fillMode `class`.
+     *
+     * @default `solid`
+     */
+    fillMode?: null | 'solid' | 'outline' | 'flat' | string;
     /**
      * Represents the selection state of Chip component.
      */
@@ -125,7 +161,7 @@ export interface ChipListComputed {
 /**
  * @hidden
  */
-export interface ChipListAll extends ChipListMethods, ChipListState, ChipListData, ChipListComputed, Vue {
+export interface ChipListAll extends ChipListMethods, ChipListState, ChipListData, ChipListComputed, Vue2type {
 }
 /**
  * @hidden
@@ -133,6 +169,6 @@ export interface ChipListAll extends ChipListMethods, ChipListState, ChipListDat
 /**
  * Represents the default `ChipList` component.
  */
-declare let ChipList: ComponentOptions<Vue, DefaultData<ChipListData>, DefaultMethods<ChipListAll>, ChipListComputed, RecordPropsDefinition<ChipListProps>>;
-declare const ChipListVue3: DefineComponent<ChipListProps, any, ChipListData, ChipListComputed, ChipListMethods, {}, {}, {}, string, ChipListProps, ChipListProps, {}>;
-export { ChipList, ChipListVue3 };
+declare let ChipListVue2: ComponentOptions<Vue2type, DefaultData<ChipListData>, DefaultMethods<ChipListAll>, ChipListComputed, RecordPropsDefinition<ChipListProps>>;
+declare const ChipList: DefineComponent<ChipListProps, any, ChipListData, ChipListComputed, ChipListMethods, {}, {}, {}, string, ChipListProps, ChipListProps, {}>;
+export { ChipList, ChipListVue2 };

package/dist/npm/Chip/ChipList.js

@@ -19,7 +19,7 @@ var __assign = undefined && undefined.__assign || function () {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ChipListVue3 = exports.ChipList = void 0; // @ts-ignore
+exports.ChipListVue2 = exports.ChipList = void 0; // @ts-ignore
 
 var Vue = require("vue");
 
@@ -47,7 +47,7 @@ var package_metadata_1 = require("../package-metadata");
  */
 
 
-var ChipList = {
+var ChipListVue2 = {
   name: 'KendoVueChipList',
   props: {
     id: String,
@@ -66,6 +66,21 @@ var ChipList = {
         return null;
       }
     },
+    size: {
+      type: String,
+      default: 'medium'
+    },
+    rounded: {
+      type: String,
+      default: 'medium'
+    },
+    fillMode: {
+      type: String,
+      default: 'solid',
+      validator: function validator(value) {
+        return [null, 'flat', 'outline', 'solid'].includes(value);
+      }
+    },
     selection: {
       type: String,
       default: function _default() {
@@ -198,9 +213,12 @@ var ChipList = {
     };
   },
   render: function render(createElement) {
+    var _a;
+
     var _this = this;
 
     var h = gh || createElement;
+    var size = this.$props.size;
     return h("div", {
       ref: this.v3 ? function (el) {
         _this.chipListRef = el;
@@ -218,12 +236,7 @@ var ChipList = {
       dir: this.currentDir,
       style: this.$props.style,
       tabIndex: kendo_vue_common_1.getTabIndex(this.$props.tabIndex, this.$props.disabled, undefined),
-      "class": kendo_vue_common_1.classNames('k-chip-list', {
-        'k-rtl': this.currentDir === 'rtl',
-        'k-selection-single': this.$props.selection === 'single',
-        'k-selection-multiple': this.$props.selection === 'multiple',
-        'k-state-disabled': this.$props.disabled
-      }, this.$props.className),
+      "class": kendo_vue_common_1.classNames('k-chip-list', (_a = {}, _a["k-chip-list-" + (kendo_vue_common_1.kendoThemeMaps.sizeMap[size] || size)] = size, _a['k-rtl'] = this.currentDir === 'rtl', _a['k-selection-single'] = this.$props.selection === 'single', _a['k-selection-multiple'] = this.$props.selection === 'multiple', _a['k-disabled'] = this.$props.disabled, _a)),
       "aria-labelledby": this.$props.ariaLabelledBy,
       "aria-describedby": this.$props.ariaDescribedBy
     }, [this.computedDataItems.map(function (item) {
@@ -235,21 +248,34 @@ var ChipList = {
           role: 'option',
           dataItem: item,
           text: item[this.$props.textField],
-          value: item[this.$props.valueField]
+          value: item[this.$props.valueField],
+          size: this.$props.size,
+          rounded: this.$props.rounded,
+          fillMode: this.$props.fillMode
         },
         dataItem: item,
         key: item[this.$props.valueField],
         text: item[this.$props.textField],
-        value: item[this.$props.valueField]
+        value: item[this.$props.valueField],
+        size: this.$props.size,
+        rounded: this.$props.rounded,
+        fillMode: this.$props.fillMode
       });
       return kendo_vue_common_1.getTemplate.call(this, {
         h: h,
         template: chipTemplate,
-        defaultRendering: chipDefaultRendering
+        defaultRendering: chipDefaultRendering,
+        additionalProps: {
+          dataItem: item,
+          key: item[this.$props.valueField],
+          text: item[this.$props.textField],
+          value: item[this.$props.valueField],
+          size: this.$props.size
+        }
       });
     }, this)]);
   }
 };
-exports.ChipList = ChipList;
-var ChipListVue3 = ChipList;
-exports.ChipListVue3 = ChipListVue3;
+exports.ChipListVue2 = ChipListVue2;
+var ChipList = ChipListVue2;
+exports.ChipList = ChipList;

package/dist/npm/FloatingActionButton/FloatingActionButton.d.ts

@@ -1,5 +1,4 @@
-import { DefineComponent } from '../additionalTypes';
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+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;
@@ -37,7 +36,7 @@ export interface FloatingActionButtonComputed {
 /**
  * @hidden
  */
-export interface FloatingActionButtonAll extends FloatingActionButtonMethods, FloatingActionButtonState, FloatingActionButtonData, FloatingActionButtonComputed, Vue {
+export interface FloatingActionButtonAll extends FloatingActionButtonMethods, FloatingActionButtonState, FloatingActionButtonData, FloatingActionButtonComputed, Vue2type {
 }
 /**
  * @hidden
@@ -45,6 +44,6 @@ export interface FloatingActionButtonAll extends FloatingActionButtonMethods, Fl
 /**
  * Represents the default `FloatingActionButton` component.
  */
-declare let FloatingActionButton: ComponentOptions<Vue, DefaultData<FloatingActionButtonData>, DefaultMethods<FloatingActionButtonAll>, FloatingActionButtonComputed, RecordPropsDefinition<FloatingActionButtonProps>>;
-declare const FloatingActionButtonVue3: DefineComponent<FloatingActionButtonProps, any, FloatingActionButtonData, FloatingActionButtonComputed, FloatingActionButtonMethods, {}, {}, {}, string, FloatingActionButtonProps, FloatingActionButtonProps, {}>;
-export { FloatingActionButton, FloatingActionButtonVue3 };
+declare let FloatingActionButtonVue2: ComponentOptions<Vue2type, DefaultData<FloatingActionButtonData>, DefaultMethods<FloatingActionButtonAll>, FloatingActionButtonComputed, RecordPropsDefinition<FloatingActionButtonProps>>;
+declare const FloatingActionButton: DefineComponent<FloatingActionButtonProps, any, FloatingActionButtonData, FloatingActionButtonComputed, FloatingActionButtonMethods, {}, {}, {}, string, FloatingActionButtonProps, FloatingActionButtonProps, {}>;
+export { FloatingActionButton, FloatingActionButtonVue2 };

package/dist/npm/FloatingActionButton/FloatingActionButton.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.FloatingActionButtonVue3 = exports.FloatingActionButton = void 0; // @ts-ignore
+exports.FloatingActionButtonVue2 = exports.FloatingActionButton = void 0; // @ts-ignore
 
 var Vue = require("vue");
 
@@ -29,7 +29,7 @@ var kendo_vue_popup_1 = require("@progress/kendo-vue-popup");
  */
 
 
-var FloatingActionButton = {
+var FloatingActionButtonVue2 = {
   name: 'KendoVueFloatingActionButton',
   props: {
     id: String,
@@ -492,6 +492,6 @@ var FloatingActionButton = {
     }, [fabItems.call(_this2)])])]);
   }
 };
-exports.FloatingActionButton = FloatingActionButton;
-var FloatingActionButtonVue3 = FloatingActionButton;
-exports.FloatingActionButtonVue3 = FloatingActionButtonVue3;
+exports.FloatingActionButtonVue2 = FloatingActionButtonVue2;
+var FloatingActionButton = FloatingActionButtonVue2;
+exports.FloatingActionButton = FloatingActionButton;

package/dist/npm/FloatingActionButton/FloatingActionButtonItem.d.ts

@@ -1,5 +1,4 @@
-import { DefineComponent } from '../additionalTypes';
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+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;
@@ -106,12 +105,12 @@ export interface FloatingActionButtonItemComputed {
 /**
  * @hidden
  */
-export interface FloatingActionButtonItemAll extends FloatingActionButtonItemMethods, FloatingActionButtonItemState, FloatingActionButtonItemData, FloatingActionButtonItemComputed, Vue {
+export interface FloatingActionButtonItemAll extends FloatingActionButtonItemMethods, FloatingActionButtonItemState, FloatingActionButtonItemData, FloatingActionButtonItemComputed, Vue2type {
 }
 /**
  * Represents the [Kendo UI for Vue FloatingActionButtonItem component]({% slug overview_floatingactionbutton %}).
  *
  */
-declare let FloatingActionButtonItem: ComponentOptions<Vue, DefaultData<FloatingActionButtonItemData>, DefaultMethods<FloatingActionButtonItemAll>, FloatingActionButtonItemComputed, RecordPropsDefinition<FloatingActionButtonItemProps>>;
-declare const FloatingActionButtonItemVue3: DefineComponent<FloatingActionButtonItemProps, any, FloatingActionButtonItemData, FloatingActionButtonItemComputed, FloatingActionButtonItemMethods, {}, {}, {}, string, FloatingActionButtonItemProps, FloatingActionButtonItemProps, {}>;
-export { FloatingActionButtonItem, FloatingActionButtonItemVue3 };
+declare let FloatingActionButtonItemVue2: ComponentOptions<Vue2type, DefaultData<FloatingActionButtonItemData>, DefaultMethods<FloatingActionButtonItemAll>, FloatingActionButtonItemComputed, RecordPropsDefinition<FloatingActionButtonItemProps>>;
+declare const FloatingActionButtonItem: DefineComponent<FloatingActionButtonItemProps, any, FloatingActionButtonItemData, FloatingActionButtonItemComputed, FloatingActionButtonItemMethods, {}, {}, {}, string, FloatingActionButtonItemProps, FloatingActionButtonItemProps, {}>;
+export { FloatingActionButtonItem, FloatingActionButtonItemVue2 };

package/dist/npm/FloatingActionButton/FloatingActionButtonItem.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.FloatingActionButtonItemVue3 = exports.FloatingActionButtonItem = void 0; // @ts-ignore
+exports.FloatingActionButtonItemVue2 = exports.FloatingActionButtonItem = void 0; // @ts-ignore
 
 var Vue = require("vue");
 
@@ -18,7 +18,7 @@ var kendo_vue_common_1 = require("@progress/kendo-vue-common");
  */
 
 
-var FloatingActionButtonItem = {
+var FloatingActionButtonItemVue2 = {
   name: 'KendoVueFloatingActionButtonItem',
   props: {
     disabled: Boolean,
@@ -128,6 +128,6 @@ var FloatingActionButtonItem = {
     return item;
   }
 };
-exports.FloatingActionButtonItem = FloatingActionButtonItem;
-var FloatingActionButtonItemVue3 = FloatingActionButtonItem;
-exports.FloatingActionButtonItemVue3 = FloatingActionButtonItemVue3;
+exports.FloatingActionButtonItemVue2 = FloatingActionButtonItemVue2;
+var FloatingActionButtonItem = FloatingActionButtonItemVue2;
+exports.FloatingActionButtonItem = FloatingActionButtonItem;

package/dist/npm/FloatingActionButton/models/shape.d.ts

@@ -2,7 +2,7 @@
  * Specifies the shape of the Floating Action Button.
  *
  * The possible values are:
- * * `pill`(Default)—Applies border radius equal to half of the height of the FloatingActionButton.
+ * * `full`(Default)—Applies border radius equal to half of the height of the FloatingActionButton.
  * If the Floating Action Button contains only icon, the shape will be circle.
  * * `circle`—Applies circle shape on the FloatingActionButton.
  * * `rectangle`—Applies no border radius on the FloatingActionButton.

package/dist/npm/ListButton/ButtonItem.d.ts

@@ -1,5 +1,4 @@
-import { DefineComponent } from '../additionalTypes';
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+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;
@@ -46,8 +45,8 @@ export interface ButtonItemData {
 /**
  * @hidden
  */
-export interface ButtonItemAll extends Vue, ButtonItemMethods, ButtonItemData, ButtonItemComputed, ButtonItemState {
+export interface ButtonItemAll extends Vue2type, ButtonItemMethods, ButtonItemData, ButtonItemComputed, ButtonItemState {
 }
-declare let ButtonItem: ComponentOptions<ButtonItemAll, DefaultData<ButtonItemData>, DefaultMethods<ButtonItemAll>, ButtonItemComputed, RecordPropsDefinition<ButtonItemProps>>;
-declare const ButtonItemVue3: DefineComponent<ButtonItemProps, any, ButtonItemData, ButtonItemComputed, ButtonItemMethods, {}, {}, {}, string, ButtonItemProps, ButtonItemProps, {}>;
-export { ButtonItem, ButtonItemVue3 };
+declare let ButtonItemVue2: ComponentOptions<ButtonItemAll, DefaultData<ButtonItemData>, DefaultMethods<ButtonItemAll>, ButtonItemComputed, RecordPropsDefinition<ButtonItemProps>>;
+declare const ButtonItem: DefineComponent<ButtonItemProps, any, ButtonItemData, ButtonItemComputed, ButtonItemMethods, {}, {}, {}, string, ButtonItemProps, ButtonItemProps, {}>;
+export { ButtonItem, ButtonItemVue2 };

package/dist/npm/ListButton/ButtonItem.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ButtonItemVue3 = exports.ButtonItem = void 0; // @ts-ignore
+exports.ButtonItemVue2 = exports.ButtonItem = void 0; // @ts-ignore
 
 var Vue = require("vue");
 
@@ -13,7 +13,7 @@ var gh = allVue.h;
 var kendo_vue_common_1 = require("@progress/kendo-vue-common"); // tslint:enable:max-line-length
 
 
-var ButtonItem = {
+var ButtonItemVue2 = {
   name: 'KendoButtonItem',
   // @ts-ignore
   emits: {
@@ -31,14 +31,19 @@ var ButtonItem = {
   },
   computed: {
     wrapperClass: function wrapperClass() {
+      return {
+        'k-item': true
+      };
+    },
+    innerClass: function innerClass() {
       var _a = this.$props,
           dataItem = _a.dataItem,
           focused = _a.focused;
       return {
-        'k-item': true,
-        'k-state-focused': focused,
-        'k-state-selected': dataItem.selected,
-        'k-state-disabled': dataItem.disabled
+        'k-link k-menu-link': true,
+        'k-focus': focused,
+        'k-selected': dataItem.selected,
+        'k-disabled': dataItem.disabled
       };
     }
   },
@@ -70,15 +75,21 @@ var ButtonItem = {
           index = _a.index;
       var text = dataItem.text !== undefined ? dataItem.text : textField ? dataItem[textField] : dataItem;
       var iconClass = dataItem.icon ? "k-icon k-i-" + dataItem.icon : dataItem.iconClass;
-      var itemContent = [iconClass && h("span", {
+      var itemContent = h("span", {
+        tabIndex: -1,
+        attrs: this.v3 ? undefined : {
+          tabIndex: -1
+        },
+        "class": this.innerClass,
+        key: "icon"
+      }, [iconClass && h("span", {
         "class": iconClass,
         role: "presentation",
         attrs: this.v3 ? undefined : {
           role: "presentation"
-        },
-        key: "icon"
+        }
       }), dataItem.imageUrl && h("img", {
-        "class": "k-image",
+        "class": "k-icon",
         alt: "",
         attrs: this.v3 ? undefined : {
           alt: "",
@@ -88,7 +99,9 @@ var ButtonItem = {
         src: dataItem.imageUrl,
         role: "presentation",
         key: "image"
-      }), text];
+      }), text && h("span", {
+        "class": "k-menu-link-text"
+      }, [text])]);
       return kendo_vue_common_1.getTemplate.call(this, {
         h: h,
         template: this.$props.dataItem.render || render,
@@ -122,6 +135,6 @@ var ButtonItem = {
     return item;
   }
 };
-exports.ButtonItem = ButtonItem;
-var ButtonItemVue3 = ButtonItem;
-exports.ButtonItemVue3 = ButtonItemVue3;
+exports.ButtonItemVue2 = ButtonItemVue2;
+var ButtonItem = ButtonItemVue2;
+exports.ButtonItem = ButtonItem;

package/dist/npm/ListButton/DropDownButton.d.ts

@@ -1,5 +1,4 @@
-import { DefineComponent } from '../additionalTypes';
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+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;
@@ -54,8 +53,8 @@ export interface DropDownButtonState {
 /**
  * @hidden
  */
-export interface DropDownButtonAll extends Vue, DropDownButtonMethods, DropDownButtonData, DropDownButtonComputed, DropDownButtonState {
+export interface DropDownButtonAll extends Vue2type, DropDownButtonMethods, DropDownButtonData, DropDownButtonComputed, DropDownButtonState {
 }
-declare let DropDownButton: ComponentOptions<DropDownButtonAll, DefaultData<DropDownButtonData>, DefaultMethods<DropDownButtonAll>, DropDownButtonComputed, RecordPropsDefinition<DropDownButtonProps>>;
-declare const DropDownButtonVue3: DefineComponent<DropDownButtonProps, any, DropDownButtonData, DropDownButtonComputed, DropDownButtonMethods, {}, {}, {}, string, DropDownButtonProps, DropDownButtonProps, {}>;
-export { DropDownButton, DropDownButtonVue3 };
+declare let DropDownButtonVue2: ComponentOptions<DropDownButtonAll, DefaultData<DropDownButtonData>, DefaultMethods<DropDownButtonAll>, DropDownButtonComputed, RecordPropsDefinition<DropDownButtonProps>>;
+declare const DropDownButton: DefineComponent<DropDownButtonProps, any, DropDownButtonData, DropDownButtonComputed, DropDownButtonMethods, {}, {}, {}, string, DropDownButtonProps, DropDownButtonProps, {}>;
+export { DropDownButton, DropDownButtonVue2 };

package/dist/npm/ListButton/DropDownButton.js

@@ -19,7 +19,7 @@ var __assign = undefined && undefined.__assign || function () {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.DropDownButtonVue3 = exports.DropDownButton = void 0; // @ts-ignore
+exports.DropDownButtonVue2 = exports.DropDownButton = void 0; // @ts-ignore
 
 var Vue = require("vue");
 
@@ -44,7 +44,7 @@ var kendo_vue_common_2 = require("@progress/kendo-vue-common");
 var package_metadata_1 = require("../package-metadata"); // tslint:enable:max-line-length
 
 
-var DropDownButton = {
+var DropDownButtonVue2 = {
   name: 'KendoDropDownButton',
   // @ts-ignore
   emits: {
@@ -73,6 +73,36 @@ var DropDownButton = {
     popupSettings: Object,
     itemRender: [String, Object, Function],
     item: Function,
+    size: {
+      type: String,
+      default: 'medium'
+    },
+    shape: {
+      type: String,
+      default: 'rectangle',
+      validator: function validator(value) {
+        return [null, 'rectangle', 'square'].includes(value);
+      }
+    },
+    rounded: {
+      type: String,
+      default: 'medium'
+    },
+    fillMode: {
+      type: String,
+      default: 'solid',
+      validator: function validator(value) {
+        return [null, 'flat', 'link', 'outline', 'solid'].includes(value);
+      }
+    },
+    // eslint-disable-next-line max-len
+    themeColor: {
+      type: String,
+      default: 'base',
+      validator: function validator(value) {
+        return [null, 'base', 'dark', 'error', 'info', 'inverse', 'inverse', 'light', 'primary', 'secondary', 'success', 'tertiary', 'warning'].includes(value);
+      }
+    },
     opened: {
       type: Boolean,
       default: undefined
@@ -121,9 +151,8 @@ var DropDownButton = {
     },
     wrapperClass: function wrapperClass() {
       return {
-        'k-widget': true,
         'k-dropdown-button': true,
-        'k-state-focused': this.focused
+        'k-focus': this.focused
       };
     }
   },
@@ -158,6 +187,7 @@ var DropDownButton = {
         }) : dataItem;
         return (// @ts-ignore
           h(ButtonItem_1.ButtonItem, {
+            "class": "k-menu-item",
             dataItem: currentDataItem,
             attrs: this.v3 ? undefined : {
               dataItem: currentDataItem,
@@ -189,8 +219,10 @@ var DropDownButton = {
     var renderPopup = function renderPopup() {
       var _this = this;
 
-      var _a = this.$props.popupSettings,
-          popupSettings = _a === void 0 ? {} : _a;
+      var _a = this.$props,
+          _b = _a.popupSettings,
+          popupSettings = _b === void 0 ? {} : _b,
+          size = _a.size;
       return (// @ts-ignore function children
         h(kendo_vue_popup_1.Popup, {
           anchor: this._anchor,
@@ -198,13 +230,13 @@ var DropDownButton = {
             anchor: this._anchor,
             show: this.computedOpened,
             animate: popupSettings.animate,
-            popupClass: kendo_vue_common_1.classNames('k-list-container k-reset k-group', popupSettings.popupClass),
+            popupClass: kendo_vue_common_1.classNames('k-menu-popup', popupSettings.popupClass),
             anchorAlign: popupSettings.anchorAlign || popup_1.getAnchorAlign(rtl),
             popupAlign: popupSettings.popupAlign || popup_1.getPopupAlign(rtl)
           },
           show: this.computedOpened,
           animate: popupSettings.animate,
-          popupClass: kendo_vue_common_1.classNames('k-list-container k-reset k-group', popupSettings.popupClass),
+          popupClass: kendo_vue_common_1.classNames('k-menu-popup', popupSettings.popupClass),
           anchorAlign: popupSettings.anchorAlign || popup_1.getAnchorAlign(rtl),
           popupAlign: popupSettings.popupAlign || popup_1.getPopupAlign(rtl),
           style: rtl ? {
@@ -212,7 +244,7 @@ var DropDownButton = {
           } : undefined
         }, this.v3 ? function () {
           return [h("ul", {
-            "class": "k-list k-reset",
+            "class": "k-group k-menu-group k-reset k-menu-group-" + (kendo_vue_common_1.kendoThemeMaps.sizeMap[size] || size),
             role: "menu",
             attrs: _this.v3 ? undefined : {
               role: "menu",
@@ -221,7 +253,7 @@ var DropDownButton = {
             id: _this.guid
           }, [renderChildItems.call(_this)])];
         } : [h("ul", {
-          "class": "k-list k-reset",
+          "class": "k-group k-menu-group k-reset k-menu-group-" + (kendo_vue_common_1.kendoThemeMaps.sizeMap[size] || size),
           role: "menu",
           attrs: _this.v3 ? undefined : {
             role: "menu",
@@ -248,14 +280,13 @@ var DropDownButton = {
       }
     }, [// @ts-ignore function children
     h(Button_1.Button, {
-      onClick: this.onClickMainButton,
-      on: this.v3 ? undefined : {
-        "click": this.onClickMainButton,
-        "mousedown": this.mouseDown
-      },
-      onMousedown: this.mouseDown,
-      disabled: disabled || undefined,
+      size: this.$props.size,
       attrs: this.v3 ? undefined : {
+        size: this.$props.size,
+        shape: this.$props.shape,
+        rounded: this.$props.rounded,
+        fillMode: this.$props.fillMode,
+        themeColor: this.$props.themeColor,
         disabled: disabled || undefined,
         tabIndex: tabIndex,
         accessKey: this.$props.accessKey,
@@ -273,6 +304,17 @@ var DropDownButton = {
         "aria-owns": this.guid,
         "aria-activedescendant": this.focusedIndex !== undefined && this.focusedIndex >= 0 ? this.guid + "-" + this.focusedIndex : undefined
       },
+      shape: this.$props.shape,
+      rounded: this.$props.rounded,
+      fillMode: this.$props.fillMode,
+      themeColor: this.$props.themeColor,
+      onClick: this.onClickMainButton,
+      on: this.v3 ? undefined : {
+        "click": this.onClickMainButton,
+        "mousedown": this.mouseDown
+      },
+      onMousedown: this.mouseDown,
+      disabled: disabled || undefined,
       tabIndex: tabIndex,
       accessKey: this.$props.accessKey,
       icon: this.$props.icon,
@@ -414,6 +456,6 @@ var DropDownButton = {
     }
   }
 };
-exports.DropDownButton = DropDownButton;
-var DropDownButtonVue3 = DropDownButton;
-exports.DropDownButtonVue3 = DropDownButtonVue3;
+exports.DropDownButtonVue2 = DropDownButtonVue2;
+var DropDownButton = DropDownButtonVue2;
+exports.DropDownButton = DropDownButton;

package/dist/npm/ListButton/SplitButton.d.ts

@@ -1,5 +1,4 @@
-import { DefineComponent } from '../additionalTypes';
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+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;
@@ -55,8 +54,8 @@ export interface SplitButtonState {
 /**
  * @hidden
  */
-export interface SplitButtonAll extends Vue, SplitButtonMethods, SplitButtonData, SplitButtonComputed, SplitButtonState {
+export interface SplitButtonAll extends Vue2type, SplitButtonMethods, SplitButtonData, SplitButtonComputed, SplitButtonState {
 }
-declare let SplitButton: ComponentOptions<SplitButtonAll, DefaultData<SplitButtonData>, DefaultMethods<SplitButtonAll>, SplitButtonComputed, RecordPropsDefinition<SplitButtonProps>>;
-declare const SplitButtonVue3: DefineComponent<SplitButtonProps, any, SplitButtonData, SplitButtonComputed, SplitButtonMethods, {}, {}, {}, string, SplitButtonProps, SplitButtonProps, {}>;
-export { SplitButton, SplitButtonVue3 };
+declare let SplitButtonVue2: ComponentOptions<SplitButtonAll, DefaultData<SplitButtonData>, DefaultMethods<SplitButtonAll>, SplitButtonComputed, RecordPropsDefinition<SplitButtonProps>>;
+declare const SplitButton: DefineComponent<SplitButtonProps, any, SplitButtonData, SplitButtonComputed, SplitButtonMethods, {}, {}, {}, string, SplitButtonProps, SplitButtonProps, {}>;
+export { SplitButton, SplitButtonVue2 };