@progress/kendo-vue-dateinputs 2.7.3 → 2.8.0-dev.202201111325

package/dist/es/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/es/calendar/components/Calendar.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) => CalendarData);
 declare type DefaultMethods<V> = {
     [key: string]: (this: V, ...args: any[]) => any;
@@ -12,7 +11,7 @@ import { CalendarProps } from './interfaces/CalendarProps';
 /**
  * @hidden
  */
-export interface CalendarAll extends Vue, CalendarMethods, CalendarComputed, CalendarState, CalendarData {
+export interface CalendarAll extends Vue2type, CalendarMethods, CalendarComputed, CalendarState, CalendarData {
 }
 declare let Calendar: ComponentOptions<CalendarAll, DefaultData<CalendarData>, DefaultMethods<CalendarAll>, CalendarComputed, RecordPropsDefinition<CalendarProps>>;
 declare const CalendarVue3: DefineComponent<CalendarProps, any, CalendarData, CalendarComputed, CalendarMethods, {}, {}, {}, string, CalendarProps, CalendarProps, {}>;

package/dist/es/calendar/components/CalendarCell.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 DefaultMethods<V> = {
     [key: string]: (this: V, ...args: any[]) => any;
 };
@@ -24,7 +23,7 @@ export interface CalendarCellMethods {
 /**
  * @hidden
  */
-export interface CalendarCellAllMethods extends Vue, CalendarCellMethods {
+export interface CalendarCellAllMethods extends Vue2type, CalendarCellMethods {
 }
 /**
  * The `CalendarCell` component is internally used for rendering the items in the current view. Also be used as a custom `cell` of the [Calendar]({% slug api_dateinputs_native_calendarprops %}#toc-cell).

package/dist/es/calendar/components/CalendarCell.js

@@ -62,7 +62,7 @@ var CalendarCell = {
   // Manually checking if the component needs an update
   // due to date object being compared by instance
   // and new Date object is created
-  // every time and fails the shallow compare of the Vue.PureComponent.
+  // every time and fails the shallow compare of the Vue.
 
   /**
    * @hidden

package/dist/es/calendar/components/CalendarHeaderTitle.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 DefaultMethods<V> = {
     [key: string]: (this: V, ...args: any[]) => any;
 };
@@ -21,7 +20,7 @@ export interface CalendarHeaderTitleMethods {
 /**
  * @hidden
  */
-export interface CalendarHeaderTitleAllMethods extends Vue, CalendarHeaderTitleMethods {
+export interface CalendarHeaderTitleAllMethods extends Vue2type, CalendarHeaderTitleMethods {
 }
 /**
  * The `CalendarCell` component is internally used for rendering the items in the current view. Also be used as a custom `cell` of the [Calendar]({% slug api_dateinputs_native_calendarprops %}#toc-cell).

package/dist/es/calendar/components/CalendarHeaderTitle.js

@@ -3,6 +3,7 @@ import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
 import { getDefaultSlots } from '@progress/kendo-vue-common';
+import { Button as KButton } from '@progress/kendo-vue-buttons';
 /**
  * The `CalendarCell` component is internally used for rendering the items in the current view. Also be used as a custom `cell` of the [Calendar]({% slug api_dateinputs_native_calendarprops %}#toc-cell).
  *
@@ -41,20 +42,26 @@ var CalendarHeaderTitle = {
   render: function render(createElement) {
     var h = gh || createElement;
     var defaultSlot = getDefaultSlots(this);
-    return h("button", {
-      value: this.$props.value,
-      attrs: this.v3 ? undefined : {
+    return (// @ts-ignore  function children
+      h(KButton, {
         value: this.$props.value,
+        attrs: this.v3 ? undefined : {
+          value: this.$props.value,
+          id: this.$props.id,
+          fillMode: 'flat',
+          tabIndex: 0
+        },
         id: this.$props.id,
-        tabindex: 0
-      },
-      id: this.$props.id,
-      onClick: this.handleClick,
-      on: this.v3 ? undefined : {
-        "click": this.handleClick
-      },
-      tabindex: 0
-    }, [defaultSlot]);
+        fillMode: 'flat',
+        onClick: this.handleClick,
+        on: this.v3 ? undefined : {
+          "click": this.handleClick
+        },
+        tabIndex: 0
+      }, this.v3 ? function () {
+        return [defaultSlot];
+      } : [defaultSlot])
+    );
   }
 };
 var CalendarHeaderTitleVue3 = CalendarHeaderTitle;

package/dist/es/calendar/components/CalendarWeekCell.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 DefaultMethods<V> = {
     [key: string]: (this: V, ...args: any[]) => any;
 };
@@ -14,7 +13,7 @@ export interface CalendarWeekCellProps {
 /**
  * @hidden
  */
-export interface CalendarWeekCellAllMethods extends Vue {
+export interface CalendarWeekCellAllMethods extends Vue2type {
     handleClick?: (e: any) => void;
 }
 /**

package/dist/es/calendar/components/Header.d.ts

@@ -1,5 +1,4 @@
-import { DefineComponent } from '../../additionalTypes';
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../../additionalTypes';
 import { LocalizationService } from '@progress/kendo-vue-intl';
 import { BusViewService } from '../services';
 import { ViewService, Action } from '../models';
@@ -61,7 +60,7 @@ export interface HeaderState {
 /**
  * @hidden
  */
-export interface HeaderAllMethods extends Vue, HeaderMethods, HeaderComputed, HeaderState {
+export interface HeaderAllMethods extends Vue2type, HeaderMethods, HeaderComputed, HeaderState {
 }
 /**
  * @hidden

package/dist/es/calendar/components/Header.js

@@ -5,6 +5,7 @@ var gh = allVue.h;
 var inject = allVue.inject;
 import { provideLocalizationService } from '@progress/kendo-vue-intl';
 import { getDate } from '@progress/kendo-date-math';
+import { Button as KButton } from '@progress/kendo-vue-buttons';
 import { CalendarHeaderTitle } from './CalendarHeaderTitle';
 import { messages, today, prevView, nextView } from '../../messages';
 import { Action } from '../models';
@@ -176,11 +177,11 @@ var Header = {
 
     var isPrevDisabled = !this.canNavigate(Action.PrevView);
     var isNextDisabled = !this.canNavigate(Action.NextView);
-    var titleClassNames = classNames('k-calendar-title', 'k-button k-flat', 'k-title', {
-      'k-state-disabled': !this.navigate
+    var titleClassNames = classNames('k-calendar-title', 'k-title', {
+      'k-disabled': !this.navigate
     });
     var todayClassNames = classNames('k-nav-today', {
-      'k-state-disabled': !this.todayIsInRange
+      'k-disabled': !this.todayIsInRange
     });
     var headerTitle;
     var headerTitleDefaultRendering = // @ts-ignore  function children
@@ -210,29 +211,28 @@ var Header = {
       "class": 'k-spacer'
     }), h("span", {
       "class": 'k-calendar-nav k-hstack'
-    }, [h("button", {
-      "class": {
-        'k-prev-view': true,
-        'k-button k-flat k-icon-button': true,
-        'k-state-disabled': isPrevDisabled
-      },
-      tabIndex: this.$props.tabIndex,
+    }, [// @ts-ignore
+    h(KButton, {
+      icon: 'arrow-60-left',
       attrs: this.v3 ? undefined : {
-        tabIndex: this.$props.tabIndex,
-        title: prevViewTitle,
-        type: "button",
-        "aria-disabled": isPrevDisabled
+        icon: 'arrow-60-left',
+        size: this.$props.size,
+        fillMode: 'flat',
+        desabled: isPrevDisabled,
+        "aria-label": prevViewTitle,
+        title: prevViewTitle
       },
+      size: this.$props.size,
+      fillMode: 'flat',
+      "class": "k-prev-view",
+      desabled: isPrevDisabled,
+      "aria-label": prevViewTitle,
       title: prevViewTitle,
-      type: "button",
       onClick: this.handlePrevClick,
       on: this.v3 ? undefined : {
         "click": this.handlePrevClick
-      },
-      "aria-disabled": isPrevDisabled
-    }, [h("span", {
-      "class": "k-button-icon k-icon k-i-arrow-60-left"
-    })]), h("span", {
+      }
+    }), h("span", {
       "class": todayClassNames,
       tabIndex: this.$props.tabIndex,
       attrs: this.v3 ? undefined : {
@@ -244,29 +244,28 @@ var Header = {
         "click": this.handleTodayClick
       },
       onClick: this.handleTodayClick
-    }, [todayMessage]), h("button", {
-      "class": {
-        'k-next-view': true,
-        'k-button k-flat k-icon-button': true,
-        'k-state-disabled': isNextDisabled
-      },
-      tabIndex: this.$props.tabIndex,
+    }, [todayMessage]), // @ts-ignore
+    h(KButton, {
+      icon: 'arrow-60-right',
       attrs: this.v3 ? undefined : {
-        tabIndex: this.$props.tabIndex,
-        title: nextViewTittle,
-        type: "button",
-        "aria-disabled": isNextDisabled
+        icon: 'arrow-60-right',
+        size: this.$props.size,
+        fillMode: 'flat',
+        desabled: isNextDisabled,
+        "aria-label": nextViewTittle,
+        title: nextViewTittle
       },
+      size: this.$props.size,
+      fillMode: 'flat',
+      "class": "k-next-view",
+      desabled: isNextDisabled,
+      "aria-label": nextViewTittle,
       title: nextViewTittle,
-      type: "button",
       onClick: this.handleNextClick,
       on: this.v3 ? undefined : {
         "click": this.handleNextClick
-      },
-      "aria-disabled": isNextDisabled
-    }, [h("span", {
-      "class": "k-button-icon k-icon k-i-arrow-60-right"
-    })])])]);
+      }
+    })])]);
   }
 };
 var HeaderVue3 = Header;

package/dist/es/calendar/components/View.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 DefaultMethods<V> = {
     [key: string]: (this: V, ...args: any[]) => any;
 };
@@ -98,7 +97,7 @@ export interface ViewData {
 /**
  * @hidden
  */
-export interface ViewAllMethods extends Vue, ViewMethods, ViewComputed, ViewState {
+export interface ViewAllMethods extends Vue2type, ViewMethods, ViewComputed, ViewState {
 }
 declare let View: ComponentOptions<ViewAllMethods, DefaultData<ViewData>, DefaultMethods<ViewAllMethods>, ViewComputed, RecordPropsDefinition<ViewProps>>;
 declare const ViewVue3: DefineComponent<ViewProps, any, ViewData, ViewComputed, ViewMethods, {}, {}, {}, string, ViewProps, ViewProps, {}>;

package/dist/es/calendar/components/ViewList.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 DefaultMethods<V> = {
     [key: string]: (this: V, ...args: any[]) => any;
 };
@@ -106,7 +105,7 @@ export interface ViewListData {
 /**
  * @hidden
  */
-export interface ViewListAll extends Vue, ViewListMethods, ViewListComputed, ViewListState, ViewListData {
+export interface ViewListAll extends Vue2type, ViewListMethods, ViewListComputed, ViewListState, ViewListData {
 }
 declare let ViewList: ComponentOptions<ViewListAll, DefaultData<ViewListData>, DefaultMethods<ViewListAll>, ViewListComputed, RecordPropsDefinition<ViewListProps>>;
 declare const ViewListVue3: DefineComponent<ViewListProps, any, ViewListData, ViewListComputed, ViewListMethods, {}, {}, {}, string, ViewListProps, ViewListProps, {}>;

package/dist/es/common/PickerWrap.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;
@@ -14,6 +13,6 @@ export interface PickerWrapProps {
 /**
  * Represents the default `pickerWrap` component
  */
-declare let PickerWrap: ComponentOptions<Vue, DefaultData<{}>, DefaultMethods<Vue>, {}, RecordPropsDefinition<PickerWrapProps>>;
+declare let PickerWrap: ComponentOptions<Vue2type, DefaultData<{}>, DefaultMethods<Vue2type>, {}, RecordPropsDefinition<PickerWrapProps>>;
 declare const PickerWrapVue3: DefineComponent<PickerWrapProps, any, {}, {}, {}, {}, {}, {}, string, PickerWrapProps, PickerWrapProps, {}>;
 export { PickerWrap, PickerWrapVue3 };

package/dist/es/dateinput/DateInput.d.ts

@@ -1,5 +1,4 @@
-import { DefineComponent } from '../additionalTypes';
-import { RecordPropsDefinition, ComponentOptions } from 'vue/types/options';
+import { DefineComponent, RecordPropsDefinition, ComponentOptions, Vue2type } from '../additionalTypes';
 import { DateInputData } from './interfaces/DateInputData';
 import { DateInputMethods } from './interfaces/DateInputMethods';
 import { DateInputComputed } from './interfaces/DateInputComputed';
@@ -12,7 +11,7 @@ declare type DefaultMethods<V> = {
 /**
  * @hidden
  */
-export interface DateInputAll extends Vue, DateInputMethods, DateInputData, DateInputComputed, DateInputState {
+export interface DateInputAll extends Vue2type, DateInputMethods, DateInputData, DateInputComputed, DateInputState {
 }
 declare let DateInput: ComponentOptions<DateInputAll, DefaultData<DateInputData>, DefaultMethods<DateInputAll>, DateInputComputed, RecordPropsDefinition<DateInputProps>>;
 declare const DateInputVue3: DefineComponent<DateInputProps, any, DateInputData, DateInputComputed, DateInputMethods, {}, {}, {}, string, DateInputProps, DateInputProps, {}>;

package/dist/es/dateinput/DateInput.js

@@ -1,18 +1,4 @@
-var __spreadArrays = this && this.__spreadArrays || function () {
-  for (var s = 0, i = 0, il = arguments.length; i < il; i++) {
-    s += arguments[i].length;
-  }
-
-  for (var r = Array(s), k = 0, i = 0; i < il; i++) {
-    for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) {
-      r[k] = a[j];
-    }
-  }
-
-  return r;
-}; // @ts-ignore
-
-
+// @ts-ignore
 import * as Vue from 'vue';
 var allVue = Vue;
 var gh = allVue.h;
@@ -21,9 +7,10 @@ var inject = allVue.inject;
 import { isEqual, cloneDate } from '@progress/kendo-date-math';
 import { provideIntlService, provideLocalizationService } from '@progress/kendo-vue-intl';
 import { KendoDate } from './models';
-import { guid, noop, validatePackage, canUseDOM } from '@progress/kendo-vue-common';
+import { guid, noop, validatePackage, canUseDOM, kendoThemeMaps, getDefaultSlots } from '@progress/kendo-vue-common';
+import { Button as KButton } from '@progress/kendo-vue-buttons';
 import { packageMetadata } from '../package-metadata';
-import { approximateStringMatching, defaultFormat, defaultFormatPlaceholder, isInRange, wrapperClasses } from './utils';
+import { approximateStringMatching, defaultFormat, defaultFormatPlaceholder, isInRange } from './utils';
 import { MAX_DATE, MIN_DATE } from './../utils';
 import { messages, increaseValue, decreaseValue } from './../messages';
 import { isInTimeRange } from '../timepicker/utils';
@@ -67,6 +54,27 @@ var DateInput = {
         return defaultFormatPlaceholder;
       }
     },
+    rounded: {
+      type: String,
+      default: 'medium',
+      validator: function validator(value) {
+        return ['small', 'medium', 'large', 'full'].includes(value);
+      }
+    },
+    fillMode: {
+      type: String,
+      default: 'solid',
+      validator: function validator(value) {
+        return ['solid', 'flat', 'outline'].includes(value);
+      }
+    },
+    size: {
+      type: String,
+      default: 'medium',
+      validator: function validator(value) {
+        return ['small', 'medium', 'large'].includes(value);
+      }
+    },
     tabIndex: Number,
     title: String,
     steps: Object,
@@ -162,15 +170,18 @@ var DateInput = {
     },
     wrapperClassNames: {
       get: function get() {
+        var _a;
+
         var isValid = !this.$data.hasMounted || !this.$props.validityStyles || this.validity().valid;
         var disabled = this.$props.disabled;
-        return {
-          'k-dateinput-wrap': true,
-          'k-state-disabled': disabled,
-          'k-state-invalid': !isValid && isValid !== undefined,
-          'k-state-focused': this.isFocused,
-          'k-rtl': this.$props.dir === 'rtl'
-        };
+        var _b = this.$props,
+            size = _b.size,
+            fillMode = _b.fillMode,
+            rounded = _b.rounded;
+        return _a = {
+          'k-dateinput': true,
+          'k-input': true
+        }, _a["k-input-" + (kendoThemeMaps.sizeMap[size] || size)] = size, _a["k-input-" + fillMode] = fillMode, _a["k-rounded-" + (kendoThemeMaps.roundedMap[rounded] || rounded)] = rounded, _a['k-disabled'] = disabled, _a['k-invalid'] = !isValid && isValid !== undefined, _a['k-focus'] = this.isFocused, _a['k-rtl'] = this.$props.dir === 'rtl', _a;
       }
     }
   },
@@ -518,6 +529,7 @@ var DateInput = {
     var _this = this;
 
     var h = gh || createElement;
+    var defaultSlot = getDefaultSlots(this);
     var localizationService = provideLocalizationService(this);
     var _a = this.$props,
         formatPlaceholder = _a.formatPlaceholder,
@@ -548,21 +560,12 @@ var DateInput = {
     var textToDisplay = !showPlaceHolder ? currentText : null;
     var inputId = id || this._inputId;
     var isValid = !this.$props.validityStyles || this.validity().valid;
-
-    var wrapperClassesInstance = __spreadArrays(wrapperClasses);
-
-    if (this.$props.className) {
-      wrapperClassesInstance.push(this.$props.className);
-    }
-
     var dateinput = h("span", {
+      "class": this.wrapperClassNames,
       dir: this.$props.dir,
       attrs: this.v3 ? undefined : {
         dir: this.$props.dir
-      },
-      "class": wrapperClassesInstance.join(' ')
-    }, [h("span", {
-      "class": this.wrapperClassNames
+      }
     }, [h("input", {
       role: "spinbutton",
       attrs: this.v3 ? undefined : {
@@ -589,7 +592,7 @@ var DateInput = {
       spellcheck: false,
       autoComplete: "off",
       autoCorrect: "off",
-      "class": "k-input",
+      "class": "k-input-inner",
       id: inputId,
       placeholder: this.$props.placeholder,
       onWheel: this.wheel,
@@ -620,41 +623,51 @@ var DateInput = {
       ref: this.v3 ? function (el) {
         _this.inputRef = el;
       } : 'input'
-    }), this.$props.children, this.$props.spinners && h("span", {
-      "class": "k-select",
+    }), defaultSlot, this.$props.spinners && h("span", {
+      "class": "k-input-spinner k-spin-button",
       onMousedown: this.spinnersMouseDown,
       on: this.v3 ? undefined : {
         "mousedown": this.spinnersMouseDown
       }
-    }, [h("span", {
-      "class": "k-link k-link-increase",
-      "aria-label": localizationService.toLanguageString(increaseValue, messages[increaseValue]),
+    }, [// @ts-ignore
+    h(KButton, {
+      icon: 'arrow-n',
       attrs: this.v3 ? undefined : {
+        icon: 'arrow-n',
+        size: this.$props.size,
+        fillMode: this.$props.fillMode,
         "aria-label": localizationService.toLanguageString(increaseValue, messages[increaseValue]),
         title: localizationService.toLanguageString(increaseValue, messages[increaseValue])
       },
+      size: this.$props.size,
+      fillMode: this.$props.fillMode,
+      "class": "k-spinner-increase",
+      "aria-label": localizationService.toLanguageString(increaseValue, messages[increaseValue]),
       title: localizationService.toLanguageString(increaseValue, messages[increaseValue]),
       onClick: this.increasePart,
       on: this.v3 ? undefined : {
         "click": this.increasePart
       }
-    }, [h("span", {
-      "class": "k-icon k-i-arrow-n"
-    })]), h("span", {
-      "class": "k-link k-link-decrease",
-      "aria-label": localizationService.toLanguageString(decreaseValue, messages[decreaseValue]),
+    }), // @ts-ignore
+    h(KButton, {
+      "class": "k-spinner-decrease",
+      icon: 'arrow-s',
       attrs: this.v3 ? undefined : {
+        icon: 'arrow-s',
+        size: this.$props.size,
+        fillMode: this.$props.fillMode,
         "aria-label": localizationService.toLanguageString(decreaseValue, messages[decreaseValue]),
         title: localizationService.toLanguageString(decreaseValue, messages[decreaseValue])
       },
+      size: this.$props.size,
+      fillMode: this.$props.fillMode,
+      "aria-label": localizationService.toLanguageString(decreaseValue, messages[decreaseValue]),
       title: localizationService.toLanguageString(decreaseValue, messages[decreaseValue]),
       onClick: this.decreasePart,
       on: this.v3 ? undefined : {
         "click": this.decreasePart
       }
-    }, [h("span", {
-      "class": "k-icon k-i-arrow-s"
-    })])])])]);
+    })])]);
     return label ? // @ts-ignore function children
     h(FloatingLabel, {
       label: label,

package/dist/es/dateinput/models/DateInputSettings.d.ts

@@ -17,6 +17,45 @@ export interface DateInputSettings {
      * Specifies the width of the DateInput.
      */
     width?: number | string;
+    /**
+     * Configures the `size` of the DateInput.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - null—Does not set a size `class`.
+     *
+     * @default `medium`
+     */
+    size?: null | 'small' | 'medium' | 'large' | string;
+    /**
+     * Configures the `roundness` of the DateInput.
+     *
+     * The available options are:
+     * - small
+     * - medium
+     * - large
+     * - circle
+     * - full
+     * - null—Does not set a rounded `class`.
+     *
+     * @default `medium`
+     */
+    rounded?: null | 'small' | 'medium' | 'large' | 'full' | string;
+    /**
+     * Configures the `fillMode` of the DateInput.
+     *
+     * The available options are:
+     * - solid
+     * - outline
+     * - flat
+     * - link
+     * - null—Does not set a fillMode `class`.
+     *
+     * @default `solid`
+     */
+    fillMode?: null | 'solid' | 'outline' | 'flat' | string;
     /**
      * Sets the `tabIndex` property of the DateInput.
      */

package/dist/es/dateinput/utils.js

@@ -78,6 +78,6 @@ export var isInRange = function (candidate, min, max) { return (candidate === nu
 /**
  * @hidden
  */
-export var invalidClasses = ['k-state-invalid'];
+export var invalidClasses = ['k-invalid'];
 /** @hidden */
-export var wrapperClasses = ['k-widget', 'k-dateinput'];
+export var wrapperClasses = ['k-dateinput'];

package/dist/es/datepicker/DatePicker.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) => DatePickerData);
 declare type DefaultMethods<V> = {
     [key: string]: (this: V, ...args: any[]) => any;
@@ -12,7 +11,7 @@ import { DatePickerProps } from './interfaces/DatePickerProps';
 /**
  * @hidden
  */
-export interface DatePickerAll extends Vue, DatePickerMethods, DatePickerData, DatePickerComputed, DatePickerState {
+export interface DatePickerAll extends Vue2type, DatePickerMethods, DatePickerData, DatePickerComputed, DatePickerState {
 }
 declare let DatePicker: ComponentOptions<DatePickerAll, DefaultData<DatePickerData>, DefaultMethods<DatePickerAll>, DatePickerComputed, RecordPropsDefinition<DatePickerProps>>;
 declare const DatePickerVue3: DefineComponent<DatePickerProps, any, DatePickerData, DatePickerComputed, DatePickerMethods, {}, {}, {}, string, DatePickerProps, DatePickerProps, {}>;