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

package/dist/npm/ListButton/SplitButton.js

@@ -19,7 +19,7 @@ var __assign = undefined && undefined.__assign || function () {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.SplitButtonVue3 = exports.SplitButton = void 0; // @ts-ignore
+exports.SplitButtonVue2 = exports.SplitButton = void 0; // @ts-ignore
 
 var Vue = require("vue");
 
@@ -47,7 +47,7 @@ var util_1 = require("../util");
 
 var styles = util_1.default.styles; // tslint:enable:max-line-length
 
-var SplitButton = {
+var SplitButtonVue2 = {
   name: 'KendoSplitButton',
   // @ts-ignore
   emits: {
@@ -71,6 +71,29 @@ var SplitButton = {
     tabIndex: Number,
     disabled: Boolean,
     icon: String,
+    size: {
+      type: String,
+      default: 'medium'
+    },
+    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
@@ -118,13 +141,11 @@ var SplitButton = {
       return this.$props.opened === undefined ? this.currentOpened : this.$props.opened;
     },
     wrapperClass: function wrapperClass() {
-      var _a;
-
-      return _a = {
-        'k-widget': true,
+      return {
         'k-split-button': true,
-        'k-button-group': true
-      }, _a[styles["" + this.$props.look]] = true, _a['k-state-focused'] = this.focused, _a;
+        'k-button-group': true,
+        'k-focus': this.focused
+      };
     }
   },
   // @ts-ignore
@@ -160,6 +181,7 @@ var SplitButton = {
         }) : dataItem;
         return (// @ts-ignore
           h(ButtonItem_1.ButtonItem, {
+            "class": "k-menu-item",
             dataItem: currentDataItem,
             attrs: this.v3 ? undefined : {
               dataItem: currentDataItem,
@@ -191,8 +213,10 @@ var SplitButton = {
     var renderPopup = function renderPopup() {
       var _this2 = 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,
@@ -200,13 +224,13 @@ var SplitButton = {
             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 ? {
@@ -214,7 +238,7 @@ var SplitButton = {
           } : 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: _this2.v3 ? undefined : {
               role: "menu",
@@ -223,7 +247,7 @@ var SplitButton = {
             id: _this2.guid
           }, [renderChildItems.call(_this2)])];
         } : [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: _this2.v3 ? undefined : {
             role: "menu",
@@ -250,16 +274,12 @@ var SplitButton = {
       }
     }, [// @ts-ignore function children
     h(Button_1.Button, {
-      onClick: function onClick(event) {
-        return _this.onItemClick(event, -1);
-      },
-      on: this.v3 ? undefined : {
-        "click": function onClick(event) {
-          return _this.onItemClick(event, -1);
-        }
-      },
-      disabled: disabled || undefined,
+      size: this.$props.size,
       attrs: this.v3 ? undefined : {
+        size: this.$props.size,
+        rounded: this.$props.rounded,
+        fillMode: this.$props.fillMode,
+        themeColor: this.$props.themeColor,
         disabled: disabled || undefined,
         tabIndex: tabIndex,
         accessKey: this.$props.accessKey,
@@ -276,6 +296,18 @@ var SplitButton = {
         "aria-owns": this.guid,
         "aria-activedescendant": this.focusedIndex !== undefined && this.focusedIndex >= 0 ? this.guid + "-" + this.focusedIndex : undefined
       },
+      rounded: this.$props.rounded,
+      fillMode: this.$props.fillMode,
+      themeColor: this.$props.themeColor,
+      onClick: function onClick(event) {
+        return _this.onItemClick(event, -1);
+      },
+      on: this.v3 ? undefined : {
+        "click": function onClick(event) {
+          return _this.onItemClick(event, -1);
+        }
+      },
+      disabled: disabled || undefined,
       tabIndex: tabIndex,
       accessKey: this.$props.accessKey,
       "class": this.$props.buttonClass,
@@ -296,8 +328,12 @@ var SplitButton = {
       return [_this3.$props.text];
     } : [_this3.$props.text]), // @ts-ignore
     h(Button_1.Button, {
-      icon: "arrow-s",
+      size: this.$props.size,
       attrs: this.v3 ? undefined : {
+        size: this.$props.size,
+        rounded: this.$props.rounded,
+        fillMode: this.$props.fillMode,
+        themeColor: this.$props.themeColor,
         icon: "arrow-s",
         disabled: disabled || undefined,
         tabIndex: -1,
@@ -305,6 +341,10 @@ var SplitButton = {
         dir: dir,
         "aria-label": "menu toggling button"
       },
+      rounded: this.$props.rounded,
+      fillMode: this.$props.fillMode,
+      themeColor: this.$props.themeColor,
+      icon: "arrow-s",
       disabled: disabled || undefined,
       tabIndex: -1,
       look: this.$props.look,
@@ -480,6 +520,6 @@ var SplitButton = {
     }
   }
 };
-exports.SplitButton = SplitButton;
-var SplitButtonVue3 = SplitButton;
-exports.SplitButtonVue3 = SplitButtonVue3;
+exports.SplitButtonVue2 = SplitButtonVue2;
+var SplitButton = SplitButtonVue2;
+exports.SplitButton = SplitButton;

package/dist/npm/ListButton/models/ListButtonProps.d.ts

@@ -68,6 +68,75 @@ export interface DropDownButtonProps {
      * Sets the direction of the component.
      */
     dir?: string;
+    /**
+     * Configures the `size` of the Button.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null—Does not set a size `className`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large' | string;
+    /**
+     * Configures the `shape` of the Button.
+     *
+     * The available options are:
+     * - rectangle
+     * - square
+     * - null—Does not set a shape `className`.
+     *
+     * @default `rectangle`
+     */
+    shape?: null | 'rectangle' | 'square' | string;
+    /**
+     * Configures the `roundness` of the Button.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - circle
+     * - full
+     * - null—Does not set a rounded `className`.
+     *
+     * @default `medium`
+     */
+    rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
+    /**
+     * Configures the `fillMode` of the Button.
+     *
+     * The available options are:
+     * - solid
+     * - outline
+     * - flat
+     * - link
+     * - null—Does not set a fillMode `className`.
+     *
+     * @default `solid`
+     */
+    fillMode?: null | 'solid' | 'outline' | 'flat' | 'link' | string;
+    /**
+     * Configures the `themeColor` of the Button.
+     *
+     * The available options are:
+     * - base
+     * - primary
+     * - secondary
+     * - tertiary
+     * - info
+     * - success
+     * - warning
+     * - dark
+     * - light
+     * - inverse
+     * - null—Does not set a themeColor `className`.
+     *
+     * @default `base`
+     */
+    themeColor?: null | 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'dark' | 'light' | 'inverse' | string;
     /**
      * Adds visual weight to the button and makes it primary ([see example]({% slug overview_dropdownbutton %}#toc-basic-usage)).
      */
@@ -163,6 +232,75 @@ export interface SplitButtonProps {
      * Sets the direction of the component.
      */
     dir?: string;
+    /**
+     * Configures the `size` of the Button.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null—Does not set a size `className`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large' | string;
+    /**
+     * Configures the `shape` of the Button.
+     *
+     * The available options are:
+     * - rectangle
+     * - square
+     * - null—Does not set a shape `className`.
+     *
+     * @default `rectangle`
+     */
+    shape?: null | 'rectangle' | 'square' | string;
+    /**
+     * Configures the `roundness` of the Button.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - circle
+     * - full
+     * - null—Does not set a rounded `className`.
+     *
+     * @default `medium`
+     */
+    rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
+    /**
+     * Configures the `fillMode` of the Button.
+     *
+     * The available options are:
+     * - solid
+     * - outline
+     * - flat
+     * - link
+     * - null—Does not set a fillMode `className`.
+     *
+     * @default `solid`
+     */
+    fillMode?: null | 'solid' | 'outline' | 'flat' | 'link' | string;
+    /**
+     * Configures the `themeColor` of the Button.
+     *
+     * The available options are:
+     * - base
+     * - primary
+     * - secondary
+     * - tertiary
+     * - info
+     * - success
+     * - warning
+     * - dark
+     * - light
+     * - inverse
+     * - null—Does not set a themeColor `className`.
+     *
+     * @default `base`
+     */
+    themeColor?: null | 'base' | 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'dark' | 'light' | 'inverse' | string;
     /**
      * Fires when the main button is clicked ([see example]({% slug overview_splitbutton %}#toc-events)).
      */

package/dist/npm/additionalTypes.ts

@@ -1,3 +1,9 @@
 // @ts-ignore
 import { DefineComponent } from 'vue';
-export { DefineComponent };
+// @ts-ignore
+import * as Vue from 'vue';
+// @ts-ignore
+type Vue2type = Vue.default;
+// @ts-ignore
+import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+export { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type };

package/dist/npm/buttonLook.d.ts

@@ -8,7 +8,6 @@
  *
  * @example
  * ```ts-no-run
- * <k-button :look="'flat'"></k-button>
  * ```
  */
 export declare type ButtonLook = 'default' | 'flat' | 'outline';

package/dist/npm/main.d.ts

@@ -1,13 +1,13 @@
-import { Button, ButtonProps } from './Button';
-import { ButtonGroup, ButtonGroupVue3, ButtonGroupProps } from './ButtonGroup';
+import { Button, ButtonVue2, ButtonProps } from './Button';
+import { ButtonGroup, ButtonGroupVue2, ButtonGroupProps } from './ButtonGroup';
 import { ButtonLook } from './buttonLook';
-import { Chip, ChipVue3, ChipProps, ChipHandle } from './Chip/Chip';
-import { ChipList, ChipListVue3, ChipListProps, ChipListHandle } from './Chip/ChipList';
+import { Chip, ChipVue2, ChipProps, ChipHandle } from './Chip/Chip';
+import { ChipList, ChipListVue2, ChipListProps, ChipListHandle } from './Chip/ChipList';
 import { ChipRemoveEvent, ChipMouseEvent, ChipKeyboardEvent, ChipFocusEvent, ChipListChangeEvent, ChipListDataChangeEvent } from './models/index';
-import { FloatingActionButton, FloatingActionButtonVue3 } from './FloatingActionButton/FloatingActionButton';
+import { FloatingActionButton, FloatingActionButtonVue2 } from './FloatingActionButton/FloatingActionButton';
 import { FloatingActionButtonHandle } from './FloatingActionButton/interfaces/FloatingActionButtonHandle';
 import { FloatingActionButtonProps } from './FloatingActionButton/interfaces/FloatingActionButtonProps';
-import { FloatingActionButtonItem, FloatingActionButtonItemVue3, FloatingActionButtonItemHandle, FloatingActionButtonItemProps } from './FloatingActionButton/FloatingActionButtonItem';
+import { FloatingActionButtonItem, FloatingActionButtonItemVue2, FloatingActionButtonItemHandle, FloatingActionButtonItemProps } from './FloatingActionButton/FloatingActionButtonItem';
 import { FloatingActionButtonPopupSettings } from './FloatingActionButton/interfaces/FloatingActionButtonPopupSettings';
 export * from './FloatingActionButton/models/events';
 import { FloatingActionButtonAlign } from './FloatingActionButton/models/align';
@@ -16,15 +16,15 @@ import { FloatingActionButtonPositionMode } from './FloatingActionButton/models/
 import { FloatingActionButtonShape } from './FloatingActionButton/models/shape';
 import { FloatingActionButtonSize } from './FloatingActionButton/models/size';
 import { FloatingActionButtonThemeColor } from './FloatingActionButton/models/theme-color';
-import { SplitButton, SplitButtonVue3 } from './ListButton/SplitButton';
-import { DropDownButton, DropDownButtonVue3 } from './ListButton/DropDownButton';
+import { SplitButton, SplitButtonVue2 } from './ListButton/SplitButton';
+import { DropDownButton, DropDownButtonVue2 } from './ListButton/DropDownButton';
 import { DropDownButtonProps } from './ListButton/models/ListButtonProps';
 import { SplitButtonFocusEvent, SplitButtonBlurEvent, SplitButtonClickEvent, SplitButtonOpenEvent, SplitButtonCloseEvent, SplitButtonItemClickEvent, DropDownButtonFocusEvent, DropDownButtonBlurEvent, DropDownButtonOpenEvent, DropDownButtonCloseEvent, DropDownButtonItemClickEvent } from './ListButton/models/events';
 import { ButtonItem } from './ListButton/models/ButtonItem';
 import { ButtonItemProps } from './ListButton/ButtonItem';
 import { ButtonsPopupSettings } from './ListButton/models/PopupSettings';
-import { Toolbar, ToolbarVue3, ToolbarProps, ToolbarResizeEvent } from './toolbar/Toolbar';
-import { ToolbarItem, ToolbarItemVue3 } from './toolbar/tools/ToolbarItem';
-import { ToolbarSeparator, ToolbarSeparatorVue3 } from './toolbar/tools/ToolbarSeparator';
-import { ToolbarSpacer, ToolbarSpacerVue3 } from './toolbar/tools/ToolbarSpacer';
-export { Toolbar, ToolbarVue3, ToolbarProps, ToolbarItem, ToolbarItemVue3, ToolbarSeparator, ToolbarSeparatorVue3, ToolbarResizeEvent, ToolbarSpacer, ToolbarSpacerVue3, Button, ButtonProps, ButtonLook, ButtonGroup, ButtonGroupVue3, ButtonGroupProps, SplitButton, SplitButtonVue3, DropDownButton, DropDownButtonVue3, DropDownButtonProps, ButtonItem, ButtonItemProps, SplitButtonFocusEvent, SplitButtonBlurEvent, SplitButtonClickEvent, SplitButtonOpenEvent, SplitButtonCloseEvent, SplitButtonItemClickEvent, DropDownButtonFocusEvent, DropDownButtonBlurEvent, DropDownButtonOpenEvent, DropDownButtonCloseEvent, DropDownButtonItemClickEvent, ButtonsPopupSettings, Chip, ChipVue3, ChipProps, ChipHandle, ChipRemoveEvent, ChipMouseEvent, ChipKeyboardEvent, ChipFocusEvent, ChipList, ChipListVue3, ChipListProps, ChipListHandle, ChipListDataChangeEvent, ChipListChangeEvent, FloatingActionButton, FloatingActionButtonVue3, FloatingActionButtonProps, FloatingActionButtonHandle, FloatingActionButtonItem, FloatingActionButtonItemVue3, FloatingActionButtonItemHandle, FloatingActionButtonItemProps, FloatingActionButtonPopupSettings, FloatingActionButtonAlign, FloatingActionButtonAlignOffset, FloatingActionButtonPositionMode, FloatingActionButtonSize, FloatingActionButtonShape, FloatingActionButtonThemeColor };
+import { Toolbar, ToolbarVue2, ToolbarProps, ToolbarResizeEvent } from './toolbar/Toolbar';
+import { ToolbarItem, ToolbarItemVue2 } from './toolbar/tools/ToolbarItem';
+import { ToolbarSeparator, ToolbarSeparatorVue2 } from './toolbar/tools/ToolbarSeparator';
+import { ToolbarSpacer, ToolbarSpacerVue2 } from './toolbar/tools/ToolbarSpacer';
+export { Toolbar, ToolbarVue2, ToolbarProps, ToolbarItem, ToolbarItemVue2, ToolbarSeparator, ToolbarSeparatorVue2, ToolbarResizeEvent, ToolbarSpacer, ToolbarSpacerVue2, Button, ButtonVue2, ButtonProps, ButtonLook, ButtonGroup, ButtonGroupVue2, ButtonGroupProps, SplitButton, SplitButtonVue2, DropDownButton, DropDownButtonVue2, DropDownButtonProps, ButtonItem, ButtonItemProps, SplitButtonFocusEvent, SplitButtonBlurEvent, SplitButtonClickEvent, SplitButtonOpenEvent, SplitButtonCloseEvent, SplitButtonItemClickEvent, DropDownButtonFocusEvent, DropDownButtonBlurEvent, DropDownButtonOpenEvent, DropDownButtonCloseEvent, DropDownButtonItemClickEvent, ButtonsPopupSettings, Chip, ChipVue2, ChipProps, ChipHandle, ChipRemoveEvent, ChipMouseEvent, ChipKeyboardEvent, ChipFocusEvent, ChipList, ChipListVue2, ChipListProps, ChipListHandle, ChipListDataChangeEvent, ChipListChangeEvent, FloatingActionButton, FloatingActionButtonVue2, FloatingActionButtonProps, FloatingActionButtonHandle, FloatingActionButtonItem, FloatingActionButtonItemVue2, FloatingActionButtonItemHandle, FloatingActionButtonItemProps, FloatingActionButtonPopupSettings, FloatingActionButtonAlign, FloatingActionButtonAlignOffset, FloatingActionButtonPositionMode, FloatingActionButtonSize, FloatingActionButtonShape, FloatingActionButtonThemeColor };

package/dist/npm/main.js

@@ -10,40 +10,41 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !exports.hasOwnProperty(p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.FloatingActionButtonItemVue3 = exports.FloatingActionButtonItem = exports.FloatingActionButtonVue3 = exports.FloatingActionButton = exports.ChipListVue3 = exports.ChipList = exports.ChipVue3 = exports.Chip = exports.DropDownButtonVue3 = exports.DropDownButton = exports.SplitButtonVue3 = exports.SplitButton = exports.ButtonGroupVue3 = exports.ButtonGroup = exports.Button = exports.ToolbarSpacerVue3 = exports.ToolbarSpacer = exports.ToolbarSeparatorVue3 = exports.ToolbarSeparator = exports.ToolbarItemVue3 = exports.ToolbarItem = exports.ToolbarVue3 = exports.Toolbar = void 0;
+exports.FloatingActionButtonItemVue2 = exports.FloatingActionButtonItem = exports.FloatingActionButtonVue2 = exports.FloatingActionButton = exports.ChipListVue2 = exports.ChipList = exports.ChipVue2 = exports.Chip = exports.DropDownButtonVue2 = exports.DropDownButton = exports.SplitButtonVue2 = exports.SplitButton = exports.ButtonGroupVue2 = exports.ButtonGroup = exports.ButtonVue2 = exports.Button = exports.ToolbarSpacerVue2 = exports.ToolbarSpacer = exports.ToolbarSeparatorVue2 = exports.ToolbarSeparator = exports.ToolbarItemVue2 = exports.ToolbarItem = exports.ToolbarVue2 = exports.Toolbar = void 0;
 var Button_1 = require("./Button");
 Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return Button_1.Button; } });
+Object.defineProperty(exports, "ButtonVue2", { enumerable: true, get: function () { return Button_1.ButtonVue2; } });
 var ButtonGroup_1 = require("./ButtonGroup");
 Object.defineProperty(exports, "ButtonGroup", { enumerable: true, get: function () { return ButtonGroup_1.ButtonGroup; } });
-Object.defineProperty(exports, "ButtonGroupVue3", { enumerable: true, get: function () { return ButtonGroup_1.ButtonGroupVue3; } });
+Object.defineProperty(exports, "ButtonGroupVue2", { enumerable: true, get: function () { return ButtonGroup_1.ButtonGroupVue2; } });
 var Chip_1 = require("./Chip/Chip");
 Object.defineProperty(exports, "Chip", { enumerable: true, get: function () { return Chip_1.Chip; } });
-Object.defineProperty(exports, "ChipVue3", { enumerable: true, get: function () { return Chip_1.ChipVue3; } });
+Object.defineProperty(exports, "ChipVue2", { enumerable: true, get: function () { return Chip_1.ChipVue2; } });
 var ChipList_1 = require("./Chip/ChipList");
 Object.defineProperty(exports, "ChipList", { enumerable: true, get: function () { return ChipList_1.ChipList; } });
-Object.defineProperty(exports, "ChipListVue3", { enumerable: true, get: function () { return ChipList_1.ChipListVue3; } });
+Object.defineProperty(exports, "ChipListVue2", { enumerable: true, get: function () { return ChipList_1.ChipListVue2; } });
 var FloatingActionButton_1 = require("./FloatingActionButton/FloatingActionButton");
 Object.defineProperty(exports, "FloatingActionButton", { enumerable: true, get: function () { return FloatingActionButton_1.FloatingActionButton; } });
-Object.defineProperty(exports, "FloatingActionButtonVue3", { enumerable: true, get: function () { return FloatingActionButton_1.FloatingActionButtonVue3; } });
+Object.defineProperty(exports, "FloatingActionButtonVue2", { enumerable: true, get: function () { return FloatingActionButton_1.FloatingActionButtonVue2; } });
 var FloatingActionButtonItem_1 = require("./FloatingActionButton/FloatingActionButtonItem");
 Object.defineProperty(exports, "FloatingActionButtonItem", { enumerable: true, get: function () { return FloatingActionButtonItem_1.FloatingActionButtonItem; } });
-Object.defineProperty(exports, "FloatingActionButtonItemVue3", { enumerable: true, get: function () { return FloatingActionButtonItem_1.FloatingActionButtonItemVue3; } });
+Object.defineProperty(exports, "FloatingActionButtonItemVue2", { enumerable: true, get: function () { return FloatingActionButtonItem_1.FloatingActionButtonItemVue2; } });
 __exportStar(require("./FloatingActionButton/models/events"), exports);
 var SplitButton_1 = require("./ListButton/SplitButton");
 Object.defineProperty(exports, "SplitButton", { enumerable: true, get: function () { return SplitButton_1.SplitButton; } });
-Object.defineProperty(exports, "SplitButtonVue3", { enumerable: true, get: function () { return SplitButton_1.SplitButtonVue3; } });
+Object.defineProperty(exports, "SplitButtonVue2", { enumerable: true, get: function () { return SplitButton_1.SplitButtonVue2; } });
 var DropDownButton_1 = require("./ListButton/DropDownButton");
 Object.defineProperty(exports, "DropDownButton", { enumerable: true, get: function () { return DropDownButton_1.DropDownButton; } });
-Object.defineProperty(exports, "DropDownButtonVue3", { enumerable: true, get: function () { return DropDownButton_1.DropDownButtonVue3; } });
+Object.defineProperty(exports, "DropDownButtonVue2", { enumerable: true, get: function () { return DropDownButton_1.DropDownButtonVue2; } });
 var Toolbar_1 = require("./toolbar/Toolbar");
 Object.defineProperty(exports, "Toolbar", { enumerable: true, get: function () { return Toolbar_1.Toolbar; } });
-Object.defineProperty(exports, "ToolbarVue3", { enumerable: true, get: function () { return Toolbar_1.ToolbarVue3; } });
+Object.defineProperty(exports, "ToolbarVue2", { enumerable: true, get: function () { return Toolbar_1.ToolbarVue2; } });
 var ToolbarItem_1 = require("./toolbar/tools/ToolbarItem");
 Object.defineProperty(exports, "ToolbarItem", { enumerable: true, get: function () { return ToolbarItem_1.ToolbarItem; } });
-Object.defineProperty(exports, "ToolbarItemVue3", { enumerable: true, get: function () { return ToolbarItem_1.ToolbarItemVue3; } });
+Object.defineProperty(exports, "ToolbarItemVue2", { enumerable: true, get: function () { return ToolbarItem_1.ToolbarItemVue2; } });
 var ToolbarSeparator_1 = require("./toolbar/tools/ToolbarSeparator");
 Object.defineProperty(exports, "ToolbarSeparator", { enumerable: true, get: function () { return ToolbarSeparator_1.ToolbarSeparator; } });
-Object.defineProperty(exports, "ToolbarSeparatorVue3", { enumerable: true, get: function () { return ToolbarSeparator_1.ToolbarSeparatorVue3; } });
+Object.defineProperty(exports, "ToolbarSeparatorVue2", { enumerable: true, get: function () { return ToolbarSeparator_1.ToolbarSeparatorVue2; } });
 var ToolbarSpacer_1 = require("./toolbar/tools/ToolbarSpacer");
 Object.defineProperty(exports, "ToolbarSpacer", { enumerable: true, get: function () { return ToolbarSpacer_1.ToolbarSpacer; } });
-Object.defineProperty(exports, "ToolbarSpacerVue3", { enumerable: true, get: function () { return ToolbarSpacer_1.ToolbarSpacerVue3; } });
+Object.defineProperty(exports, "ToolbarSpacerVue2", { enumerable: true, get: function () { return ToolbarSpacer_1.ToolbarSpacerVue2; } });

package/dist/npm/package-metadata.js

@@ -8,7 +8,7 @@ exports.packageMetadata = {
     name: '@progress/kendo-vue-buttons',
     productName: 'Kendo UI for Vue',
     productCodes: ['KENDOUIVUE', 'KENDOUICOMPLETE'],
-    publishDate: 1641392794,
+    publishDate: 1641906667,
     version: '',
     licensingDocsUrl: 'https://www.telerik.com/kendo-vue-ui/my-license/?utm_medium=product&utm_source=kendovue&utm_campaign=kendo-ui-vue-purchase-license-keys-warning'
 };

package/dist/npm/toolbar/Toolbar.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;
@@ -100,8 +99,8 @@ export interface ToolbarData {
 /**
  * @hidden
  */
-export interface ToolbarAll extends Vue, ToolbarMethods, ToolbarData, ToolbarComputed, ToolbarState {
+export interface ToolbarAll extends Vue2type, ToolbarMethods, ToolbarData, ToolbarComputed, ToolbarState {
 }
-declare let Toolbar: ComponentOptions<ToolbarAll, DefaultData<ToolbarData>, DefaultMethods<ToolbarAll>, ToolbarComputed, RecordPropsDefinition<ToolbarProps>>;
-declare const ToolbarVue3: DefineComponent<ToolbarProps, any, ToolbarData, ToolbarComputed, ToolbarMethods, {}, {}, {}, string, ToolbarProps, ToolbarProps, {}>;
-export { Toolbar, ToolbarVue3 };
+declare let ToolbarVue2: ComponentOptions<ToolbarAll, DefaultData<ToolbarData>, DefaultMethods<ToolbarAll>, ToolbarComputed, RecordPropsDefinition<ToolbarProps>>;
+declare const Toolbar: DefineComponent<ToolbarProps, any, ToolbarData, ToolbarComputed, ToolbarMethods, {}, {}, {}, string, ToolbarProps, ToolbarProps, {}>;
+export { Toolbar, ToolbarVue2 };

package/dist/npm/toolbar/Toolbar.js

@@ -19,7 +19,7 @@ var __assign = undefined && undefined.__assign || function () {
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ToolbarVue3 = exports.Toolbar = void 0; // @ts-ignore
+exports.ToolbarVue2 = exports.Toolbar = void 0; // @ts-ignore
 
 var Vue = require("vue");
 
@@ -33,7 +33,7 @@ var util_1 = require("./../util");
 var package_metadata_1 = require("../package-metadata"); // tslint:enable:max-line-length
 
 
-var Toolbar = {
+var ToolbarVue2 = {
   name: 'KendoToolbar',
   props: {
     tabIndex: {
@@ -41,11 +41,18 @@ var Toolbar = {
       default: 0
     },
     dir: String,
-    keyboardNavigation: Boolean,
-    buttons: Array
+    keyboardNavigation: {
+      type: Boolean,
+      default: true
+    },
+    buttons: {
+      type: Array,
+      default: function _default() {
+        return undefined;
+      }
+    }
   },
   created: function created() {
-    this.element = null;
     this.offsetHeight = 0;
     this.offsetWidth = 0;
     this.currentButtons = [];
@@ -61,7 +68,7 @@ var Toolbar = {
   },
   mounted: function mounted() {
     window.addEventListener('resize', this.onWindowResize);
-    var element = this.element;
+    var element = this.$el;
 
     if (element) {
       this.offsetWidth = element.offsetWidth;
@@ -74,7 +81,7 @@ var Toolbar = {
     }
   },
   updated: function updated() {
-    var element = this.element;
+    var element = this.$el;
 
     if (!element || this.$props.keyboardNavigation === false) {
       return;
@@ -121,7 +128,7 @@ var Toolbar = {
       return this.$el ? Array.from(this.$el.querySelectorAll(this.selectors.join(','))) : [];
     },
     focusedIndex: function focusedIndex() {
-      var focused = this.element && this.element.querySelector(this.focusedSelector);
+      var focused = this.$el && this.$el.querySelector(this.focusedSelector);
       return Math.max(0, this.currentButtons.findIndex(function (e) {
         return e === focused;
       }));
@@ -194,6 +201,6 @@ var Toolbar = {
     }
   }
 };
-exports.Toolbar = Toolbar;
-var ToolbarVue3 = Toolbar;
-exports.ToolbarVue3 = ToolbarVue3;
+exports.ToolbarVue2 = ToolbarVue2;
+var Toolbar = ToolbarVue2;
+exports.Toolbar = Toolbar;

package/dist/npm/toolbar/tools/ToolbarItem.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;
@@ -30,8 +29,8 @@ export interface ToolbarItemData {
 /**
  * @hidden
  */
-export interface ToolbarItemAll extends Vue, ToolbarItemMethods, ToolbarItemData, ToolbarItemComputed, ToolbarItemState {
+export interface ToolbarItemAll extends Vue2type, ToolbarItemMethods, ToolbarItemData, ToolbarItemComputed, ToolbarItemState {
 }
-declare let ToolbarItem: ComponentOptions<ToolbarItemAll, DefaultData<ToolbarItemData>, DefaultMethods<ToolbarItemAll>, ToolbarItemComputed, RecordPropsDefinition<{}>>;
-declare const ToolbarItemVue3: DefineComponent<{}, any, ToolbarItemData, ToolbarItemComputed, ToolbarItemMethods, {}, {}, {}, string, {}, {}, {}>;
-export { ToolbarItem, ToolbarItemVue3 };
+declare let ToolbarItemVue2: ComponentOptions<ToolbarItemAll, DefaultData<ToolbarItemData>, DefaultMethods<ToolbarItemAll>, ToolbarItemComputed, RecordPropsDefinition<{}>>;
+declare const ToolbarItem: DefineComponent<{}, any, ToolbarItemData, ToolbarItemComputed, ToolbarItemMethods, {}, {}, {}, string, {}, {}, {}>;
+export { ToolbarItem, ToolbarItemVue2 };

package/dist/npm/toolbar/tools/ToolbarItem.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ToolbarItemVue3 = exports.ToolbarItem = void 0; // @ts-ignore
+exports.ToolbarItemVue2 = exports.ToolbarItem = 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 ToolbarItem = {
+var ToolbarItemVue2 = {
   name: 'KendoToolbarItem',
   methods: {
     element: function element() {
@@ -33,6 +33,6 @@ var ToolbarItem = {
     return h("span", [defaultSlot]);
   }
 };
-exports.ToolbarItem = ToolbarItem;
-var ToolbarItemVue3 = ToolbarItem;
-exports.ToolbarItemVue3 = ToolbarItemVue3;
+exports.ToolbarItemVue2 = ToolbarItemVue2;
+var ToolbarItem = ToolbarItemVue2;
+exports.ToolbarItem = ToolbarItem;

package/dist/npm/toolbar/tools/ToolbarSeparator.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;
@@ -7,6 +6,6 @@ declare type DefaultMethods<V> = {
 /**
  * Represents the Kendo UI for Vue Toolbar Separator component.
  */
-declare let ToolbarSeparator: ComponentOptions<Vue, DefaultData<{}>, DefaultMethods<{}>, {}, RecordPropsDefinition<{}>>;
-declare const ToolbarSeparatorVue3: DefineComponent<{}, any, {}, {}, {}, {}, {}, {}, string, {}, {}, {}>;
-export { ToolbarSeparator, ToolbarSeparatorVue3 };
+declare let ToolbarSeparatorVue2: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<{}>, {}, RecordPropsDefinition<{}>>;
+declare const ToolbarSeparator: DefineComponent<{}, any, {}, {}, {}, {}, {}, {}, string, {}, {}, {}>;
+export { ToolbarSeparator, ToolbarSeparatorVue2 };