@progress/kendo-vue-layout 5.3.0-dev.202410141143 → 5.3.0-develop.2

package/index.d.mts

@@ -0,0 +1,4366 @@
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
+import { ComponentOptionsMixin } from 'vue';
+import { ComponentProvideOptions } from 'vue';
+import { DefineComponent } from 'vue';
+import { ExtractPropTypes } from 'vue';
+import { Navigation } from '@progress/kendo-vue-common';
+import { PropType } from 'vue';
+import { PublicProps } from 'vue';
+import { SVGIcon } from '@progress/kendo-vue-common';
+import { SVGIcon as SVGIcon_2 } from '@progress/kendo-svg-icons';
+
+/**
+ * @hidden
+ */
+export declare const ActionSheet: DefineComponent<ExtractPropTypes<    {
+expand: PropType<boolean>;
+animation: {
+type: PropType<boolean>;
+default: boolean;
+};
+animationDuration: {
+type: PropType<number>;
+default: number;
+};
+animationStyles: PropType<any>;
+tabIndex: PropType<number>;
+items: PropType<ActionSheetItemProps[]>;
+subTitle: PropType<string>;
+title: PropType<string>;
+className: PropType<string>;
+headerClassName: {
+type: PropType<string>;
+default: any;
+};
+contentClassName: {
+type: PropType<string>;
+default: any;
+};
+headerStyle: {
+type: PropType<string>;
+default: any;
+};
+footerClassName: {
+type: PropType<string>;
+default: any;
+};
+header: PropType<string | Function>;
+content: PropType<string | Function>;
+footer: PropType<string | Function>;
+item: PropType<string | Function>;
+navigatable: {
+type: PropType<boolean>;
+default: boolean;
+};
+navigatableElements: {
+type: PropType<string[]>;
+default: () => any[];
+};
+onClose: PropType<(event: any) => void>;
+}>, {}, {
+show: boolean;
+slide: boolean;
+}, {
+topGroupItems(): Array<ActionSheetItemProps> | undefined;
+bottomGroupItems(): Array<ActionSheetItemProps> | undefined;
+shouldRenderSeparator(): boolean;
+}, {
+handleKeyDown(e: any): void;
+onTab(target: HTMLElement, nav: Navigation, ev: any): void;
+handleOverlayClick(ev: any): void;
+handleItemClick(ev: {
+syntheticEvent: any;
+title?: string;
+item?: any;
+}): void;
+onEnter(target: HTMLElement, nav: Navigation, ev: any): void;
+onEscape(_target: HTMLElement, _nav: Navigation, ev: any): void;
+hideActionSheet(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+expand: PropType<boolean>;
+animation: {
+type: PropType<boolean>;
+default: boolean;
+};
+animationDuration: {
+type: PropType<number>;
+default: number;
+};
+animationStyles: PropType<any>;
+tabIndex: PropType<number>;
+items: PropType<ActionSheetItemProps[]>;
+subTitle: PropType<string>;
+title: PropType<string>;
+className: PropType<string>;
+headerClassName: {
+type: PropType<string>;
+default: any;
+};
+contentClassName: {
+type: PropType<string>;
+default: any;
+};
+headerStyle: {
+type: PropType<string>;
+default: any;
+};
+footerClassName: {
+type: PropType<string>;
+default: any;
+};
+header: PropType<string | Function>;
+content: PropType<string | Function>;
+footer: PropType<string | Function>;
+item: PropType<string | Function>;
+navigatable: {
+type: PropType<boolean>;
+default: boolean;
+};
+navigatableElements: {
+type: PropType<string[]>;
+default: () => any[];
+};
+onClose: PropType<(event: any) => void>;
+}>> & Readonly<{}>, {
+animation: boolean;
+contentClassName: string;
+animationDuration: number;
+headerClassName: string;
+headerStyle: string;
+footerClassName: string;
+navigatable: boolean;
+navigatableElements: string[];
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const ActionSheetContent: DefineComponent<ExtractPropTypes<    {
+contentClassName: {
+type: PropType<string>;
+default: any;
+};
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+contentClassName: {
+type: PropType<string>;
+default: any;
+};
+}>> & Readonly<{}>, {
+contentClassName: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const ActionSheetFooter: DefineComponent<ExtractPropTypes<    {
+footerClassName: {
+type: PropType<string>;
+default: any;
+};
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+footerClassName: {
+type: PropType<string>;
+default: any;
+};
+}>> & Readonly<{}>, {
+footerClassName: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const ActionSheetHeader: DefineComponent<ExtractPropTypes<    {
+headerClassName: {
+type: PropType<string>;
+default: any;
+};
+headerStyle: {
+type: PropType<string>;
+default: any;
+};
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+headerClassName: {
+type: PropType<string>;
+default: any;
+};
+headerStyle: {
+type: PropType<string>;
+default: any;
+};
+}>> & Readonly<{}>, {
+headerClassName: string;
+headerStyle: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const ActionSheetItem: DefineComponent<ExtractPropTypes<    {
+id: PropType<number>;
+description: PropType<string>;
+disabled: PropType<boolean>;
+group: {
+type: PropType<string>;
+validator: (value?: string) => any;
+};
+item: PropType<object>;
+icon: PropType<string>;
+svgIcon: PropType<SVGIcon>;
+iconColor: PropType<string>;
+iconSize: PropType<string>;
+content: PropType<string | Function>;
+title: PropType<string>;
+tabIndex: {
+type: PropType<number>;
+default: number;
+};
+}>, {}, {}, {
+wrapperClass(): {
+'k-actionsheet-item': boolean;
+'k-cursor-pointer': boolean;
+'k-disabled': any;
+};
+}, {
+onClick(event: any): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+click: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+id: PropType<number>;
+description: PropType<string>;
+disabled: PropType<boolean>;
+group: {
+type: PropType<string>;
+validator: (value?: string) => any;
+};
+item: PropType<object>;
+icon: PropType<string>;
+svgIcon: PropType<SVGIcon>;
+iconColor: PropType<string>;
+iconSize: PropType<string>;
+content: PropType<string | Function>;
+title: PropType<string>;
+tabIndex: {
+type: PropType<number>;
+default: number;
+};
+}>> & Readonly<{
+onClick?: (...args: any[] | unknown[]) => any;
+}>, {
+tabIndex: number;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Represents the props of the Kendo UI for Vue ActionSheetItem.
+ */
+export declare interface ActionSheetItemProps {
+    /**
+     * Sets additional CSS classes to the ActionSheetItem.
+     */
+    class?: string;
+    /**
+     * Sets additional CSS styles to the ActionSheetItem.
+     */
+    style?: object;
+    /**
+     * Specifies additional text rendered under the item's title.
+     */
+    description?: string;
+    /**
+     * Specifies if the ActionSheet item is initially disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Defines the group of the item. Items can be segregated in two groups - `top` and `bottom`.
+     * Each specifying whether the ActionSheet item will be rendered over the separator or under it.
+     */
+    group?: 'top' | 'bottom' | string;
+    /**
+     * Defines the icon rendered inside the ActionSheet item.
+     */
+    icon?: string;
+    /**
+     * Defines an SVGIcon to be rendered inside the ActionSheet item.
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * Defines an size of the icon or SVGIcon that is rendered inside the ActionSheet item.
+     */
+    iconSize?: string;
+    /**
+     * Defines the color of the icon or SVGIcon that is rendered inside the ActionSheet item.
+     */
+    iconColor?: string;
+    /**
+     * Specifies the text content of the ActionSheet item.
+     */
+    title?: string;
+    /**
+     * @hidden
+     */
+    item?: object;
+    /**
+     * Sets the content of the ActionSheetItem either as string that is pointing to a slot template of as render function.
+     */
+    content?: string | Function;
+    /**
+     * @hidden
+     */
+    onClick?: (event: {
+        event: any;
+        title?: string;
+    }) => void;
+    /**
+     * @hidden
+     */
+    onKeydown?: (event: any, title: string | undefined, id: number | undefined) => void;
+    /**
+     * @hidden
+     */
+    id?: number;
+    /**
+     * The tabIndex of the ActionSheetItem.
+     */
+    tabIndex?: number;
+}
+
+/**
+ * The props of the ActionSheet component.
+ */
+export declare interface ActionSheetProps {
+    /**
+     * The collection of items that will be rendered in the ActionSheet.
+     */
+    items?: ActionSheetItemProps[];
+    /**
+     * Specifies the text that is rendered under the title.
+     */
+    subTitle?: string;
+    /**
+     * Specifies the text that is rendered as title.
+     */
+    title?: string;
+    /**
+     * Fires when the modal overlay is clicked.
+     */
+    onClose?: (event: any) => void;
+    /**
+     * Fires when an ActionSheet item is clicked.
+     */
+    onItemselect?: (event: {
+        syntheticEvent: any;
+        title?: string;
+        item?: any;
+    }) => void;
+    /**
+     * Specifies the `tabIndex` of the ActionSheet.
+     */
+    tabIndex?: number;
+    /**
+     * Specifies if the ActionSheet can be navigatable with keyboard.
+     * Defaults to `true`.
+     */
+    navigatable?: boolean;
+    /**
+     * Specifies the selectors of the navigatable elements inside the templates of the ActionSheet.
+     */
+    navigatableElements?: string[];
+    /**
+     * Controls the popup animation. By default, the animation is enabled.
+     */
+    animation?: boolean;
+    /**
+     * @hidden
+     */
+    animationStyles?: any;
+    /**
+     * Specifies the duration of the transition for the entering and closing Animation. Defaults to `300ms`.
+     */
+    animationDuration?: number;
+    /**
+     * The CSS classes that will be rendered on the inner ActionSheet element.
+     */
+    className?: string;
+    /**
+     * The CSS classes that will be rendered on the DOM element that wraps the header section of the ActionSheet element.
+     */
+    headerClassName?: string;
+    /**
+     * The CSS classes that will be rendered on the DOM element that wraps the footer section of the ActionSheet element.
+     */
+    footerClassName?: string;
+    /**
+     * The CSS classes that will be rendered on the DOM element that wraps the content section of the ActionSheet element.
+     */
+    contentClassName?: string;
+    /**
+     * The custom Styles that will be applied on the DOM element that wraps the header section of the ActionSheet element.
+     */
+    headerStyle?: string;
+    /**
+     * Sets the header content of the ActionSheet either as string that is pointing to a slot template of as render function.
+     */
+    header?: string | Function;
+    /**
+     * Sets the content content of the ActionSheet either as string that is pointing to a slot template of as render function.
+     */
+    content?: string | Function;
+    /**
+     * Sets the footer content of the ActionSheet either as string that is pointing to a slot template of as render function.
+     */
+    footer?: string | Function;
+    /**
+     * Sets the item content of the ActionSheet either as string that is pointing to a slot template of as render function.
+     */
+    item?: string | Function;
+    /**
+     * Specifies the state of the ActionSheet.
+     */
+    expand?: boolean;
+}
+
+/**
+ * @hidden
+ */
+export declare const AppBar: DefineComponent<ExtractPropTypes<    {
+id: PropType<string>;
+themeColor: {
+type: PropType<string>;
+default: string;
+};
+position: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+positionMode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+}>, {}, {}, {
+wrapperClass(): AppBarComputed['wrapperClass'];
+}, {
+focus(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+id: PropType<string>;
+themeColor: {
+type: PropType<string>;
+default: string;
+};
+position: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+positionMode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+}>> & Readonly<{}>, {
+themeColor: string;
+position: string;
+positionMode: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface AppBarComputed {
+    [key: string]: any;
+    wrapperClass: object;
+}
+
+/**
+ * Specifies the position of the AppBar ([see example]({% slug positioning_appbar %}#toc-position)).
+ *
+ * * The possible values are:
+ * * 'top' (Default)
+ * * 'bottom'
+ *
+ */
+export declare type AppBarPosition = 'top' | 'bottom';
+
+/**
+ * Specifies the positionMode of the AppBar ([see example]({% slug positioning_appbar %}#toc-positionmode)).
+ *
+ * * The possible values are:
+ * * 'static' (Default)
+ * * 'sticky'
+ * * 'fixed'
+ */
+export declare type AppBarPositionMode = 'static' | 'sticky' | 'fixed';
+
+/**
+ * Represents the props of the [Kendo UI for Vue AppBar component]({% slug overview_appbar %}).
+ * Used to display information, actions, branding titles and additional navigation on the current screen.
+ */
+export declare interface AppBarProps {
+    /**
+     * Sets the `id` property of the root AppBar element.
+     */
+    id?: string;
+    /**
+     * Specifies the position of the AppBar ([see example]({% slug positioning_appbar %}#toc-position)).
+     *
+     * * The possible values are:
+     * * 'top' (Default)
+     * * 'bottom'
+     *
+     */
+    position?: AppBarPosition | string;
+    /**
+     * Specifies the positionMode of the AppBar ([see example]({% slug positioning_appbar %}#toc-positionmode)).
+     *
+     * * The possible values are:
+     * * 'static' (Default)
+     * * 'sticky'
+     * * 'fixed'
+     */
+    positionMode?: AppBarPositionMode | string;
+    /**
+     * Specifies the theme color of the AppBar ([see example]({% slug appearance_appbar %})).
+     *
+     * * The possible values are:
+     * * `light` (Default)
+     * * 'primary'
+     * * 'dark'
+     * * 'inherit'
+     *
+     */
+    themeColor?: AppBarThemeColor | string;
+}
+
+/**
+ * @hidden
+ */
+export declare const AppBarSection: DefineComponent<    {}, {}, {}, {}, {
+focus(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface AppBarSectionComputed {
+    [key: string]: any;
+    wrapperClass: object;
+}
+
+/**
+ * @hidden
+ */
+export declare const AppBarSpacer: DefineComponent<ExtractPropTypes<    {
+width: PropType<string | number>;
+}>, {}, {}, {
+spacerClasses(): AppBarSpacerComputed['spacerClasses'];
+spacerStyles(): AppBarSpacerComputed['spacerStyles'];
+}, {
+focus(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+width: PropType<string | number>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface AppBarSpacerComputed {
+    [key: string]: any;
+    spacerClasses: object;
+    spacerStyles: object;
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue AppBarSpacer component]({% slug contentarrangement_appbar %}#toc-defining-spacings).
+ * Used to give additional white space between the AppBar sections and provides a way for customizing its width.
+ */
+export declare interface AppBarSpacerProps {
+    width?: string | number;
+}
+
+/**
+ * Specifies the theme color of the AppBar ([see example]({% slug appearance_appbar %})).
+ *
+ * * The possible values are:
+ * * `inherit`
+ * * `light` (Default)
+ * * `dark`
+ *
+ */
+export declare type AppBarThemeColor = 'light' | 'dark' | 'inherit';
+
+/**
+ * @hidden
+ */
+export declare const Avatar: DefineComponent<ExtractPropTypes<    {
+type: {
+type: PropType<string>;
+default: avatarType;
+validator: (value: string) => any;
+};
+border: PropType<boolean>;
+rounded: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+fillMode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+size: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+themeColor: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+}>, {}, {}, {
+wrapperClass(): AvatarComputed['wrapperClass'];
+innerClass(): AvatarComputed['innerClass'];
+}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+type: {
+type: PropType<string>;
+default: avatarType;
+validator: (value: string) => any;
+};
+border: PropType<boolean>;
+rounded: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+fillMode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+size: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+themeColor: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+}>> & Readonly<{}>, {
+type: string;
+themeColor: string;
+size: string;
+rounded: string;
+fillMode: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface AvatarComputed {
+    [key: string]: any;
+    wrapperClass: object;
+    innerClass: object;
+}
+
+declare enum avatarType {
+    TEXT = "text",
+    IMAGE = "image",
+    ICON = "icon"
+}
+
+/**
+ * An interface which holds the shared properties of the MenuItemModel and the MenuItem components.
+ */
+declare interface BaseMenuItem {
+    /**
+     * Specifies the item text ([see example]({% slug itemproperties_menu %}#toc-text)).
+     */
+    text?: string;
+    /**
+     * Specifies a URL which is rendered as a `href` attribute on the item link ([see example]({% slug itemproperties_menu %}#toc-url)).
+     */
+    url?: string;
+    /**
+     * Specifies the name of the [FontIcon]({% slug overview_icon %}) that will be rendered for the item).
+     */
+    icon?: string;
+    /**
+     * Specifies the name of the [SVGIcon]({% slug overview_svgicon %}) that will be rendered for the item).
+     */
+    svgIcon?: SVGIcon_2;
+    /**
+     * Specifies if the item is disabled ([see example]({% slug itemproperties_menu %}#toc-disabled-state)).
+     */
+    disabled?: boolean;
+    /**
+     * The additional CSS classes that will be rendered on the item ([see example]({% slug itemproperties_menu %}#toc-styles-and-classes)).
+     */
+    cssClass?: string;
+    /**
+     * The additional CSS classes that will be rendered on the item's popup.
+     */
+    popupClass?: string;
+    /**
+     * The CSS styles that will be rendered on the item ([see example]({% slug itemproperties_menu %}#toc-styles-and-classes)).
+     */
+    cssStyle?: any;
+    /**
+     * A Vue functional or class component which is used for rendering the innermost part of the Menu item ([see example]({% slug rendering_menu %}#toc-items)). By default, the innermost item part includes only the text for the item.
+     */
+    render?: any;
+    /**
+     * A Vue functional or class component which is used for rendering the link of the item ([see example]({% slug rendering_menu %}#toc-links)). The item link is a part of the visual representation of the item which, by default, includes an arrow, icon, and text.
+     */
+    linkRender?: any;
+    /**
+     * A Vue functional or class component which is used for rendering content instead of the item children ([see example]({% slug rendering_menu %}#toc-content)).
+     */
+    contentRender?: any;
+    /**
+     * Represents any additional data that is associated with the Menu item.
+     */
+    data?: any;
+}
+
+/**
+ * @hidden
+ */
+export declare const BottomNavigation: DefineComponent<ExtractPropTypes<    {
+dir: PropType<string>;
+themeColor: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+fill: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+fillMode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+item: PropType<any>;
+items: PropType<BottomNavigationItemProps[]>;
+itemFlow: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+positionMode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+border: {
+type: PropType<boolean>;
+default: boolean;
+};
+disabled: PropType<boolean>;
+selected: PropType<number>;
+}>, {}, {}, {
+navClasses(): {
+[x: number]: boolean;
+'k-bottom-nav': boolean;
+'k-bottom-nav-border': any;
+'k-disabled': any;
+};
+}, {
+focus(): void;
+dispatchSelectEvent(dispatchedEvent: any, index: number): void;
+handleSelect(event: any, clickedItemIndex: number): void;
+handleKeyDown(event: any, clickedItemIndex: number): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+keydown: any;
+select: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+dir: PropType<string>;
+themeColor: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+fill: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+fillMode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+item: PropType<any>;
+items: PropType<BottomNavigationItemProps[]>;
+itemFlow: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+positionMode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+border: {
+type: PropType<boolean>;
+default: boolean;
+};
+disabled: PropType<boolean>;
+selected: PropType<number>;
+}>> & Readonly<{
+onSelect?: (...args: any[] | unknown[]) => any;
+onKeydown?: (...args: any[] | unknown[]) => any;
+}>, {
+fill: string;
+themeColor: string;
+border: boolean;
+fillMode: string;
+positionMode: string;
+itemFlow: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface BottomNavigationComputed {
+    [key: string]: any;
+    navClasses: object;
+}
+
+/**
+ * Represents the return type of the BottomNavigation events.
+ */
+export declare interface BottomNavigationEvent {
+}
+
+/**
+ * The fill style of the BottomNavigation
+ * ([see example]({% slug appearance_bottomnavigation %}#toc-fill)).
+ *
+ * The possible values are:
+ * * `flat`(Default) &mdash; Sets the theme color as the text color. The background will be white.
+ * * `solid` &mdash; Sets the theme color as a background color.
+ *
+ */
+export declare type BottomNavigationFill = 'solid' | 'flat';
+
+/**
+ * @hidden
+ */
+export declare const BottomNavigationItem: DefineComponent<ExtractPropTypes<    {
+id: PropType<string>;
+disabled: PropType<boolean>;
+selected: PropType<boolean>;
+icon: PropType<any>;
+item: PropType<any>;
+text: PropType<any>;
+dataItem: PropType<any>;
+index: PropType<number>;
+tabIndex: {
+type: PropType<number>;
+default: number;
+};
+}>, {}, {}, {
+itemClasses(): BottomNavigationItemComputed['itemClasses'];
+}, {
+handleClick(event: any): void;
+handleKeyDown(event: any): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+keydown: any;
+select: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+id: PropType<string>;
+disabled: PropType<boolean>;
+selected: PropType<boolean>;
+icon: PropType<any>;
+item: PropType<any>;
+text: PropType<any>;
+dataItem: PropType<any>;
+index: PropType<number>;
+tabIndex: {
+type: PropType<number>;
+default: number;
+};
+}>> & Readonly<{
+onSelect?: (...args: any[] | unknown[]) => any;
+onKeydown?: (...args: any[] | unknown[]) => any;
+}>, {
+tabIndex: number;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface BottomNavigationItemComputed {
+    [key: string]: any;
+    itemClasses: object;
+}
+
+/**
+ * Specifies how the icon and text label are positioned in each item of the BottomNavigation
+ * ([see example]({% slug content_types_bottomnavigation %}#toc-item-flow)).
+ *
+ * The possible values are:
+ * * `vertical`(Default) &mdash; Renders the text below the icon.
+ * * `horizontal` &mdash; Renders the text and the icon on the same line.
+ */
+export declare type BottomNavigationItemFlow = 'vertical' | 'horizontal';
+
+/**
+ * The interface for describing items that can be passed to the `items` property of the BottomNavigation component.
+ */
+export declare interface BottomNavigationItemProps {
+    /**
+     * Style the BottomNavigation item.
+     */
+    style?: object;
+    /**
+     * Class the BottomNavigation item.
+     */
+    class?: string;
+    /**
+     * Disables the BottomNavigation item.
+     */
+    disabled?: boolean;
+    /**
+     * Specifies if the BottomNavigation item is selected.
+     */
+    selected?: boolean;
+    /**
+     * Defines the name for an existing icon in a Kendo UI for Vue theme.
+     * The icon is rendered inside the BottomNavigation item by a `span.k-icon` element.
+     */
+    icon?: any;
+    /**
+     * Specifies the text content of the BottomNavigation item.
+     */
+    text?: any;
+    /**
+     * Sets the `tabIndex` property of the BottomNavigation item. Defaults to `0`.
+     */
+    tabIndex?: number;
+    /**
+     * Sets a custom property. Contained in the BottomNavItem props that are returned from the `onSelect` BottomNavigation event.
+     */
+    [customProp: string]: any;
+    /**
+     * @hidden
+     */
+    index?: number;
+    /**
+     * @hidden
+     */
+    item?: any;
+    /**
+     * @hidden
+     */
+    dataItem?: any;
+    /**
+     * @hidden
+     */
+    id?: string;
+}
+
+/**
+ * Specifies the position and behavior of the BottomNavigation when the page is scrolled
+ * ([see example]({% slug positioning_bottomnavigation %}#toc-position-mode)).
+ *
+ * The possible values are:
+ * * `fixed`(Default) &mdash; The BottomNavigation always stays at the bottom of the viewport, regardless of the page scroll position.
+ * * `sticky` &mdash; Positions the BottomNavigation based on the user's scroll position. A sticky element toggles between
+ * static and fixed CSS [`position`](https://developer.mozilla.org/en-US/docs/Web/CSS/position) property, depending on the scroll position.
+ * It is positioned static until a given offset position is met in the viewport - then it "sticks" in place like `fixed` positionMode.
+ */
+export declare type BottomNavigationPositionMode = 'sticky' | 'fixed';
+
+/**
+ * Represents the props of the [Kendo UI for Vue BottomNavigation component]({% slug overview_bottomnavigation %}).
+ */
+export declare interface BottomNavigationProps {
+    /**
+     * Sets the `id` property of the root BottomNavigation element.
+     */
+    id?: string;
+    /**
+     * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
+     */
+    dir?: string;
+    /**
+     * Specifies the theme color of the BottomNavigation
+     * ([see example]({% slug appearance_bottomnavigation %}#toc-theme-color)).
+     *
+     * The possible values are:
+     * * `primary` (Default) &mdash; Applies coloring based on the primary theme color.
+     * * `secondary` &mdash; Applies coloring based on the secondary theme color.
+     * * `tertiary` &mdash; Applies coloring based on the tertiary theme color.
+     * * `info` &mdash; Applies coloring based on the info theme color.
+     * * `success` &mdash; Applies coloring based on the success theme color.
+     * * `warning` &mdash; Applies coloring based on the warning theme color.
+     * * `error` &mdash; Applies coloring based on the error theme color.
+     * * `dark` &mdash; Applies coloring based on the dark theme color.
+     * * `light` &mdash; Applies coloring based on the light theme color.
+     * * `inverse` &mdash; Applies coloring based on the inverted theme color.
+     */
+    themeColor?: BottomNavigationThemeColor | string;
+    /**
+     * The fill style of the BottomNavigation
+     * ([see example]({% slug appearance_bottomnavigation %}#toc-fill)).
+     *
+     * The possible values are:
+     * * `flat`(Default) &mdash; Sets the theme color as the text color. The background will be white.
+     * * `solid` &mdash; Sets the theme color as a background color.
+     */
+    fillMode?: BottomNavigationFill | string;
+    /**
+     * @hidden
+     */
+    fill?: BottomNavigationFill | string;
+    /**
+     * Specifies the position and behavior of the BottomNavigation when the page is scrolled
+     * ([see example]({% slug positioning_bottomnavigation %}#toc-position-mode)).
+     *
+     * The possible values are:
+     * * `fixed`(Default) &mdash; The BottomNavigation always stays at the bottom of the viewport, regardless of the page scroll position.
+     * * `sticky` &mdash; Positions the BottomNavigation based on the user's scroll position. A sticky element toggles between static
+     * and fixed CSS [`position`](https://developer.mozilla.org/en-US/docs/Web/CSS/position) property, depending on the scroll position.
+     * It is positioned static until a given offset position is met in the viewport - then it "sticks" in place like `fixed` positionMode.
+     */
+    positionMode?: BottomNavigationPositionMode | string;
+    /**
+     * Specifies how the icon and text label are positioned in each item of the BottomNavigation
+     * ([see example]({% slug content_types_bottomnavigation %}#toc-item-flow)).
+     *
+     * The possible values are:
+     * * `vertical`(Default) &mdash; Renders the text below the icon.
+     * * `horizontal` &mdash; Renders the text and the icon on the same line.
+     */
+    itemFlow?: BottomNavigationItemFlow | string;
+    /**
+     * Sets a border to the BottomNavigation.
+     */
+    border?: boolean;
+    /**
+     * Disables the whole BottomNavigation.
+     */
+    disabled?: boolean;
+    /**
+     * The index of the selected BottomNavigationItem.
+     */
+    selected?: number;
+    /**
+     * The collection of items that will be rendered in the BottomNavigation ([see example]({% slug overview_bottomnavigation %})).
+     */
+    items?: Array<BottomNavigationItemProps>;
+    /**
+     * Overrides the default component's content responsible for visualizing a single item
+     * ([see example]({% slug custom_rendering_bottomnavigation %}#toc-custom-rendering)).
+     */
+    item?: any;
+    /**
+     * Fires when a BottomNavigation item is about to be rendered
+     * ([see example]({% slug custom_rendering_bottomnavigation %}#toc-item-render-property)).
+     * Used to override the default appearance of the items.
+     */
+    itemRender?: any;
+    /**
+     * Fires when a BottomNavigation item is selected.
+     */
+    onSelect?: (event: BottomNavigationSelectEvent) => void;
+    /**
+     * Triggered on `onKeyDown` event.
+     */
+    onKeyDown?: (event: BottomNavigationEvent) => void;
+}
+
+/**
+ * The arguments for the `onSelect` BottomNavigation event.
+ */
+export declare interface BottomNavigationSelectEvent {
+    /**
+     * A BottomNavigation item event target.
+     */
+    itemTarget: any;
+    /**
+     * The index of the selected BottomNavigation item.
+     */
+    itemIndex: number;
+}
+
+/**
+ * Specifies the theme color of the BottomNavigationThemeColor.
+ * ([see example]({% slug appearance_bottomnavigation %}#toc-theme-color)).
+ *
+ * The possible values are:
+ * * `primary` (Default) &mdash; Applies coloring based on the primary theme color.
+ * * `secondary` &mdash; Applies coloring based on the secondary theme color.
+ * * `tertiary` &mdash; Applies coloring based on the tertiary theme color.
+ * * `info` &mdash; Applies coloring based on the info theme color.
+ * * `success` &mdash; Applies coloring based on the success theme color.
+ * * `warning` &mdash; Applies coloring based on the warning theme color.
+ * * `error` &mdash; Applies coloring based on the error theme color.
+ * * `dark` &mdash; Applies coloring based on the dark theme color.
+ * * `light` &mdash; Applies coloring based on the light theme color.
+ * * `inverse` &mdash; Applies coloring based on the inverted theme color.
+ */
+export declare type BottomNavigationThemeColor = 'primary' | 'secondary' | 'tertiary' | 'info' | 'success' | 'warning' | 'error' | 'dark' | 'light' | 'inverse';
+
+/**
+ * @hidden
+ */
+export declare const Card: DefineComponent<ExtractPropTypes<    {
+dir: PropType<string>;
+type: {
+type: PropType<string>;
+default: cardType;
+validator: (value: string) => any;
+};
+orientation: {
+type: PropType<string>;
+default: cardOrientation;
+validator: (value: string) => any;
+};
+}>, {}, {}, {
+wrapperClass(): CardComputed['wrapperClass'];
+}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+dir: PropType<string>;
+type: {
+type: PropType<string>;
+default: cardType;
+validator: (value: string) => any;
+};
+orientation: {
+type: PropType<string>;
+default: cardOrientation;
+validator: (value: string) => any;
+};
+}>> & Readonly<{}>, {
+type: string;
+orientation: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const CardActions: DefineComponent<ExtractPropTypes<    {
+layout: {
+type: PropType<string>;
+default: cardActionsLayout;
+validator: (value: string) => any;
+};
+orientation: {
+type: PropType<string>;
+default: cardOrientation;
+validator: (value: string) => any;
+};
+}>, {}, {}, {
+wrapperClass(): {
+[x: string]: boolean;
+'k-card-actions': boolean;
+'k-actions': boolean;
+};
+}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+layout: {
+type: PropType<string>;
+default: cardActionsLayout;
+validator: (value: string) => any;
+};
+orientation: {
+type: PropType<string>;
+default: cardOrientation;
+validator: (value: string) => any;
+};
+}>> & Readonly<{}>, {
+orientation: string;
+layout: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface CardActionsComputed {
+    [key: string]: any;
+    wrapperClass: object;
+}
+
+declare enum cardActionsLayout {
+    START = "start",
+    CENTER = "center",
+    END = "end",
+    STRETCHED = "stretched"
+}
+
+/**
+ * @hidden
+ */
+export declare const CardBody: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface CardComputed {
+    [key: string]: any;
+    wrapperClass: object;
+}
+
+/**
+ * @hidden
+ */
+export declare const CardFooter: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const CardHeader: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const CardImage: DefineComponent<ExtractPropTypes<    {
+src: PropType<string>;
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+src: PropType<string>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+declare enum cardOrientation {
+    HORIZONTAL = "horizontal",
+    VERTICAL = "vertical"
+}
+
+/**
+ * @hidden
+ */
+export declare const CardSubtitle: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const CardTitle: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+declare enum cardType {
+    DEFAULT = "default",
+    primary = "primary",
+    INFO = "info",
+    SUCCESS = "success",
+    WARNING = "warning",
+    ERROR = "error"
+}
+
+/**
+ * @hidden
+ */
+export declare const downArrowIcon: SVGIcon_2;
+
+/**
+ * @hidden
+ */
+export declare const Drawer: DefineComponent<ExtractPropTypes<    {
+animation: {
+type: PropType<boolean | DrawerAnimation>;
+default: boolean;
+};
+expanded: {
+type: PropType<boolean>;
+default: boolean;
+};
+dir: {
+type: StringConstructor;
+default: string;
+};
+item: PropType<any>;
+navigationHeader: PropType<Object | Function | String>;
+navigationFooter: PropType<Object | Function | String>;
+navigationContent: PropType<Object | Function | String>;
+mode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+position: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+items: {
+type: PropType<DrawerItemProps[]>;
+default: any[];
+};
+mini: {
+type: PropType<boolean>;
+default: boolean;
+};
+tabIndex: PropType<number>;
+width: {
+type: PropType<number>;
+default: number;
+};
+miniWidth: {
+type: PropType<number>;
+default: number;
+};
+}>, {}, {
+currentDir: string;
+drawer: {
+expanded: boolean;
+mode: string;
+dir: Function;
+position: string;
+animation: boolean | DrawerAnimation;
+mini: boolean;
+width: number;
+miniWidth: number;
+items: DrawerItemProps[];
+item: any;
+};
+showLicenseWatermark: boolean;
+}, {
+drawerClassNames(): DrawerComputed['drawerClassNames'];
+}, {
+focus(): void;
+handleSelect(itemTarget: any, itemIndex: number): void;
+onOverlayClick(e: any): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+select: any;
+overlayclick: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+animation: {
+type: PropType<boolean | DrawerAnimation>;
+default: boolean;
+};
+expanded: {
+type: PropType<boolean>;
+default: boolean;
+};
+dir: {
+type: StringConstructor;
+default: string;
+};
+item: PropType<any>;
+navigationHeader: PropType<Object | Function | String>;
+navigationFooter: PropType<Object | Function | String>;
+navigationContent: PropType<Object | Function | String>;
+mode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+position: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+items: {
+type: PropType<DrawerItemProps[]>;
+default: any[];
+};
+mini: {
+type: PropType<boolean>;
+default: boolean;
+};
+tabIndex: PropType<number>;
+width: {
+type: PropType<number>;
+default: number;
+};
+miniWidth: {
+type: PropType<number>;
+default: number;
+};
+}>> & Readonly<{
+onSelect?: (...args: any[] | unknown[]) => any;
+onOverlayclick?: (...args: any[] | unknown[]) => any;
+}>, {
+mode: string;
+animation: boolean | DrawerAnimation;
+dir: string;
+expanded: boolean;
+mini: boolean;
+position: string;
+width: number;
+miniWidth: number;
+items: DrawerItemProps[];
+}, {}, {}, {}, string, () => {
+kendoDrawer: any;
+}, true, {}, any>;
+
+/**
+ * Specifies the animation settings of the Drawer.
+ *
+ */
+export declare interface DrawerAnimation {
+    /**
+     * Specifies the type of the Drawer animation.
+     */
+    type?: 'slide';
+    /**
+     * Specifies the duration of the Drawer animation ([see example]({% slug display_modes_drawer %}#toc-expand-modes)) .
+     */
+    duration: number;
+}
+
+/**
+ * @hidden
+ */
+export declare interface DrawerComputed {
+    drawerClassNames: object;
+}
+
+/**
+ * @hidden
+ */
+export declare const DrawerContent: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * The properties of the [Kendo UI for Vue DrawerContent component]({% slug overview_drawer %}).
+ */
+export declare interface DrawerContentProps {
+}
+
+/**
+ * @hidden
+ */
+export declare const DrawerItem: DefineComponent<ExtractPropTypes<    {
+index: PropType<number>;
+text: PropType<string>;
+icon: PropType<string>;
+svgIcon: PropType<SVGIcon>;
+separator: PropType<boolean>;
+selected: PropType<boolean>;
+disabled: PropType<boolean>;
+targetItem: PropType<any>;
+}>, {}, {}, {
+itemClassNames(): DrawerItemComputed['itemClassNames'];
+}, {
+focus(e: any): void;
+handleClick(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+click: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+index: PropType<number>;
+text: PropType<string>;
+icon: PropType<string>;
+svgIcon: PropType<SVGIcon>;
+separator: PropType<boolean>;
+selected: PropType<boolean>;
+disabled: PropType<boolean>;
+targetItem: PropType<any>;
+}>> & Readonly<{
+onClick?: (...args: any[] | unknown[]) => any;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface DrawerItemComputed {
+    itemClassNames: object;
+}
+
+/**
+ * The DrawerItem ref.
+ */
+export declare interface DrawerItemHandle {
+    /**
+     * The DrawerItem element.
+     */
+    element: any;
+    /**
+     * Focus the DrawerItem.
+     */
+    focus: (e: any) => void;
+    /**
+     * The props of the DrawerItem.
+     */
+    props?: any;
+}
+
+/**
+ * An interface for the Drawer items.
+ */
+export declare interface DrawerItemProps {
+    /**
+     * Specifies if the Drawer item is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Defines the name for an existing icon in a Kendo UI for Vue theme.
+     * The icon is rendered inside the Drawer item by a `span.k-icon` element.
+     */
+    icon?: string;
+    /**
+     * Defines an SVGIcon to be rendered within the Drawer item.
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * Specifies if the Drawer item is initially selected.
+     */
+    selected?: boolean;
+    /**
+     * Specifies if this is a separator item.
+     */
+    separator?: boolean;
+    /**
+     * Specifies the text content of the Drawer item.
+     */
+    text?: string;
+    /**
+     * Sets the index of the DrawerItem that is used to identify it.
+     */
+    index?: number;
+    /**
+     * Sets the `tabIndex` property of the DrawerItem.
+     * Defaults to `0`.
+     */
+    tabIndex?: number;
+    /**
+     * Sets a custom property. Contained in the DrawerItem props that are returned from the `onSelect` Drawer event.
+     */
+    [customProp: string]: any;
+    /**
+     * @hidden
+     */
+    onSelect?(target?: any, idx?: number): void;
+}
+
+/**
+ * @hidden
+ */
+export declare const DrawerNavigation: DefineComponent<ExtractPropTypes<    {
+item: PropType<any>;
+header: PropType<any>;
+footer: PropType<any>;
+content: PropType<any>;
+tabIndex: PropType<number>;
+showLicenseWatermark: PropType<boolean>;
+onSelect: PropType<(event: DrawerSelectEvent) => void>;
+}>, {}, {}, {
+navigationClassNames(): DrawerNavigationComputed['navigationClassNames'];
+}, {
+focus(e: any): void;
+onDrawerItemSelect(e: any, index: number): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+item: PropType<any>;
+header: PropType<any>;
+footer: PropType<any>;
+content: PropType<any>;
+tabIndex: PropType<number>;
+showLicenseWatermark: PropType<boolean>;
+onSelect: PropType<(event: DrawerSelectEvent) => void>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface DrawerNavigationComputed {
+    navigationClassNames: object;
+}
+
+/**
+ * @hidden
+ */
+export declare interface DrawerNavigationProps {
+    item?: any;
+    header?: any;
+    footer?: any;
+    content?: any;
+    showLicenseWatermark?: boolean;
+    tabIndex?: number;
+    onSelect?: (event: DrawerSelectEvent) => void;
+}
+
+/**
+ * @hidden
+ */
+export declare interface DrawerNavigationState {
+}
+
+/**
+ * The properties of the [Kendo UI for Vue Drawer component]({% slug overview_drawer %}).
+ */
+export declare interface DrawerProps {
+    /**
+     * Specifies the animation settings of the Drawer.
+     * If boolean enables or disables the default animation.
+     * Use DrawerAnimation to set slide animation with customizable duration option. Accepts a number in milliseconds.
+     */
+    animation?: boolean | DrawerAnimation;
+    /**
+     * Specifies the state of the Drawer. Defaults to `false` ([see example]({% slug expanded_state_drawer %})).
+     */
+    expanded?: boolean;
+    /**
+     * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
+     */
+    dir?: string;
+    /**
+     * Specifies the mode in which the Drawer will be displayed.
+     * The possible values are `overlay` and `push`.
+     * Defaults to `overlay` ([see example]({% slug display_modes_drawer %}#toc-expand-modes)).
+     */
+    mode?: 'overlay' | 'push' | string;
+    /**
+     * Specifies the position of the Drawer.
+     * The possible values are `start` and `end` ([see example]({% slug positioning_drawer %})).
+     */
+    position?: 'start' | 'end' | string;
+    /**
+     * Sets the `tabIndex` property of the Drawer.
+     */
+    tabIndex?: number;
+    /**
+     * Enables the mini (compact) view of the Drawer which is displayed when the component is collapsed
+     * ([see example]({% slug display_modes_drawer %}#toc-mini-view))).
+     */
+    mini?: boolean;
+    /**
+     * Defines the width of the Drawer when the mini view is enabled and the component is collapsed. Defaults to `50`.
+     */
+    miniWidth?: number;
+    /**
+     * Defines the width of the Drawer when it is expanded. Defaults to `240`.
+     */
+    width?: number;
+    /**
+     * The collection of items that will be rendered in the Drawer ([see example]({% slug overview_drawer %})).
+     */
+    items?: Array<DrawerItemProps>;
+    /**
+     * Overrides the default component responsible for visualizing a single item ([see example]({% slug custom_rendering %})).
+     *
+     * The default Component is: [DrawerItem]({% slug api_layout_draweritem %}).
+     */
+    item?: any;
+    /**
+     * The event handler that will be fired when the overlay is clicked.
+     * Used in overlay mode only.
+     */
+    onOverlayclick?: (event: any) => void;
+    /**
+     * Fires when a Drawer item is selected.
+     */
+    onSelect?: (event: DrawerSelectEvent) => void;
+    /**
+     * Provides the option to define a `header` in the Drawer component ([see example]({% slug custom_rendering %})).
+     * The header is rendered above the Drawer Items. By default, the property is not defined.
+     */
+    navigationHeader?: String | Object | Function;
+    /**
+     * Provides the option to define a `footer` in the Drawer component ([see example]({% slug custom_rendering %})).
+     * The footer is rendered below the Drawer Items. By default, the property is not defined.
+     */
+    navigationFooter?: String | Object | Function;
+    /**
+     * Provides the option to define a custom template inside the navigational section of the Drawer component ([see example]({% slug custom_rendering %})).
+     * When defined, the custom template will override the default [DrawerItem]({% slug api_layout_draweritem %}) rendering.
+     * By default, the property is not defined.
+     */
+    navigationContent?: String | Object | Function;
+}
+
+/**
+ * The arguments for the `onSelect` Drawer event.
+ */
+export declare interface DrawerSelectEvent {
+    /**
+     * A Drawer item event target.
+     */
+    itemTarget: any;
+    /**
+     * The index of the selected Drawer item.
+     */
+    itemIndex: number;
+}
+
+/**
+ * @hidden
+ */
+export declare const ExpansionPanel: DefineComponent<ExtractPropTypes<    {
+dir: StringConstructor;
+id: StringConstructor;
+tabIndex: NumberConstructor;
+title: StringConstructor;
+subtitle: StringConstructor;
+titleRender: (ObjectConstructor | StringConstructor | FunctionConstructor)[];
+subtitleRender: (ObjectConstructor | StringConstructor | FunctionConstructor)[];
+expandIcon: StringConstructor;
+expandSvgIcon: ObjectConstructor;
+collapseIcon: StringConstructor;
+collapseSvgIcon: ObjectConstructor;
+expanded: BooleanConstructor;
+disabled: BooleanConstructor;
+}>, {}, {
+focused: boolean;
+}, {
+wrapperClass(): {
+'k-expander': boolean;
+'k-expanded': any;
+'k-focus': boolean;
+'k-disabled': any;
+};
+expandIconName(): string;
+expandSVGIcon(): any;
+}, {
+onClick(event: any): void;
+onKeyDown(event: any): void;
+handleFocus(): void;
+handleBlur(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+dir: StringConstructor;
+id: StringConstructor;
+tabIndex: NumberConstructor;
+title: StringConstructor;
+subtitle: StringConstructor;
+titleRender: (ObjectConstructor | StringConstructor | FunctionConstructor)[];
+subtitleRender: (ObjectConstructor | StringConstructor | FunctionConstructor)[];
+expandIcon: StringConstructor;
+expandSvgIcon: ObjectConstructor;
+collapseIcon: StringConstructor;
+collapseSvgIcon: ObjectConstructor;
+expanded: BooleanConstructor;
+disabled: BooleanConstructor;
+}>> & Readonly<{}>, {
+disabled: boolean;
+expanded: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * The arguments for the `onAction` ExpansionPanel event.
+ */
+export declare interface ExpansionPanelActionEvent {
+    /**
+     * Represents the `expanded` state of the ExpansionPanel.
+     */
+    expanded: boolean;
+}
+
+/**
+ * @hidden
+ */
+export declare const ExpansionPanelContent: DefineComponent<    {}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * The ExpansionPanel ref.
+ */
+export declare interface ExpansionPanelHandle {
+    /**
+     * The ExpansionPanel element.
+     */
+    element: HTMLDivElement | null;
+}
+
+/**
+ * The props of the ExpansionPanel component.
+ */
+export declare interface ExpansionPanelProps {
+    /**
+     * Sets additional CSS classes to the ExpansionPanel.
+     */
+    class?: string;
+    /**
+     * Sets the `id` property of the root ExpansionPanel element.
+     */
+    id?: string;
+    /**
+     * Specifies the primary text in the header of the ExpansionPanel.
+     */
+    title?: string;
+    /**
+     * Specifies the secondary text in the header of the ExpansionPanel, which is rendered next to the collapse/expand icon.
+     */
+    subtitle?: string;
+    /**
+     * Specifies the primary text template in the header of the ExpansionPanel.
+     */
+    titleRender?: any;
+    /**
+     * Specifies the secondary text in the header of the ExpansionPanel, which is rendered next to the collapse/expand icon.
+     */
+    subtitleRender?: any;
+    /**
+     * Sets a custom icon via css class(es), for the expanded state of the ExpansionPanel.
+     */
+    expandIcon?: string;
+    /**
+     * Defines an SVGIcon to be rendered within the expand arrow.
+     */
+    expandSvgIcon?: SVGIcon;
+    /**
+     * Sets a custom icon via css class(es), for the collapsed state of the ExpansionPanel.
+     */
+    collapseIcon?: string;
+    /**
+     * Defines an SVGIcon to be rendered within the collapse arrow.
+     */
+    collapseSvgIcon?: SVGIcon;
+    /**
+     * Sets the `dir` property of the ExpansionPanel.
+     */
+    dir?: string;
+    /**
+     * Sets the `tabIndex` property of the ExpansionPanel.
+     */
+    tabIndex?: number;
+    /**
+     * Sets the `expanded` state of the ExpansionPanel.
+     */
+    expanded?: boolean;
+    /**
+     * Sets the `disabled` state of the ExpansionPanel.
+     */
+    disabled?: boolean;
+    /**
+     * Sets `aria-controls`. The value should represent the `id` of the controlled content element.
+     */
+    ariaControls?: string;
+    /**
+     * The event handler that will be fired when the expanded state of the ExpansionPanel is about to change.
+     */
+    onAction?: (event: ExpansionPanelActionEvent) => void;
+}
+
+/**
+ * @hidden
+ */
+export declare function flatChildren(children: any, flattenChildren?: any[]): any[];
+
+/**
+ * @hidden
+ */
+export declare function flatVisibleChildren(children: any, flattenVisibleChildren?: any[]): any[];
+
+/**
+ * @hidden
+ */
+export declare function flatVisibleItems(data: any, flattedItems?: any[]): any[];
+
+/**
+ * @hidden
+ */
+export declare const getFirstId: (props: any) => any;
+
+/**
+ * @hidden
+ */
+export declare const getInitialState: (props: any, expandMode: PanelBarExpandMode, result?: PanelBarData, parentExpanded?: boolean, parentPrivateKey?: string[]) => PanelBarData;
+
+/**
+ * @hidden
+ */
+export declare const GridLayout: DefineComponent<ExtractPropTypes<    {
+id: PropType<string>;
+gap: {
+type: PropType<GridLayoutGap>;
+};
+align: {
+type: PropType<any>;
+validator: (value: GridLayoutAlign) => any;
+};
+rows: PropType<GridLayoutRowProps[]>;
+cols: PropType<GridLayoutColumnProps[]>;
+items: PropType<GridLayoutItemProps[]>;
+}>, {}, {}, {
+hAlign(): any;
+vAlign(): any;
+gridLayoutClasses(): {
+'k-grid-layout': boolean;
+'k-justify-items-start': boolean;
+'k-justify-items-center': boolean;
+'k-justify-items-end': boolean;
+'k-justify-items-stretch': boolean;
+'k-align-items-start': boolean;
+'k-align-items-center': boolean;
+'k-align-items-end': boolean;
+'k-align-items-stretch': boolean;
+};
+gapStyle(): string;
+gridTemplateRowsStyle(): any;
+gridTemplateColumnsStyle(): any;
+gridLayoutStyles(): {
+gap: any;
+gridTemplateColumns: any;
+gridTemplateRows: any;
+};
+}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+id: PropType<string>;
+gap: {
+type: PropType<GridLayoutGap>;
+};
+align: {
+type: PropType<any>;
+validator: (value: GridLayoutAlign) => any;
+};
+rows: PropType<GridLayoutRowProps[]>;
+cols: PropType<GridLayoutColumnProps[]>;
+items: PropType<GridLayoutItemProps[]>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Specifies the horizontal and vertical alignment of the inner GridLayout elements.
+ */
+export declare interface GridLayoutAlign {
+    /**
+     * Defines the possible horizontal alignment of the inner GridLayout elements.
+     *
+     * The available values are:
+     * - `start`&mdash;Uses the start point of the container.
+     * - `center`&mdash;Uses the center point of the container.
+     * - `end`&mdash;Uses the end point of the container.
+     * - (Default)`stretch`&mdash;Stretches the items to fill the width of the container.
+     */
+    horizontal?: 'start' | 'center' | 'end' | 'stretch';
+    /**
+     * Defines the possible vertical alignment of the inner GridLayout elements.
+     *
+     * The available values are:
+     * - `top`&mdash;Uses the top point of the container.
+     * - `middle`&mdash;Uses the middle point of the container.
+     * - `bottom`&mdash;Uses the bottom point of the container.
+     * - (Default)`stretch`&mdash;Stretches the items to fill the height of the container.
+     */
+    vertical?: 'top' | 'middle' | 'bottom' | 'stretch';
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue GridLayout column]({% slug overview_gridlayout %}).
+ */
+export declare interface GridLayoutColumnProps {
+    /**
+     * Specifies the width of the GridLayout
+     * column ([see example]({% slug overview_gridlayout %}#toc-vue-gridlayout-demo-preview)).
+     */
+    width?: number | string;
+}
+
+/**
+ * Specifies the gaps between the elements.
+ */
+export declare interface GridLayoutGap {
+    /**
+     * Represents the row gap between the elements
+     */
+    rows?: number | string;
+    /**
+     * Represents the column gap between the elements
+     */
+    cols?: number | string;
+}
+
+/**
+ * @hidden
+ */
+export declare const GridLayoutItem: DefineComponent<ExtractPropTypes<    {
+content: PropType<any>;
+id: PropType<string>;
+col: PropType<number>;
+colSpan: PropType<number>;
+row: PropType<number>;
+rowSpan: PropType<number>;
+}>, {}, {}, {
+gridLayoutItemStyles(): {
+gridArea: string;
+};
+}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+content: PropType<any>;
+id: PropType<string>;
+col: PropType<number>;
+colSpan: PropType<number>;
+row: PropType<number>;
+rowSpan: PropType<number>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Represents the props of the [Kendo UI for Vue GridLayoutItem component]({% slug overview_gridlayout %}).
+ */
+export declare interface GridLayoutItemProps {
+    /**
+     * Sets additional CSS classes to the GridLayoutItem.
+     */
+    class?: string;
+    /**
+     * Sets additional CSS styles to the GridLayoutItem.
+     */
+    style?: any;
+    /**
+     * Sets the `id` property of the root GridLayoutItem element.
+     */
+    id?: string;
+    /**
+     * Defines the column line from which the element will start ([see example]({% slug items_gridlayout %}#toc-items)).
+     */
+    col?: number;
+    /**
+     * Specifies the number of columns over which the element will span ([see example]({% slug items_gridlayout %}#toc-items)).
+     * Defaults to `1`.
+     */
+    colSpan?: number;
+    /**
+     * Defines the row line from which the element will start ([see example]({% slug items_gridlayout %}#toc-items)).
+     */
+    row?: number;
+    /**
+     * Specifies the number of rows over which the element will span ([see example]({% slug items_gridlayout %}#toc-items)).
+     * Defaults to `1`.
+     */
+    rowSpan?: number;
+    /**
+     * Sets the content of the GridLayoutItem.
+     */
+    content?: any;
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue GridLayout component]({% slug overview_gridlayout %}).
+ */
+export declare interface GridLayoutProps {
+    /**
+     * Sets additional CSS classes to the GridLayout.
+     */
+    className?: string;
+    /**
+     * Sets additional CSS styles to the GridLayout.
+     */
+    style?: any;
+    /**
+     * Sets the `id` property of the root GridLayout element.
+     */
+    id?: string;
+    /**
+     * Specifies the gaps between the elements ([see example]({% slug layout_gridlayout %}#toc-gaps)).
+     *
+     * * The possible keys are:
+     * * `rows`
+     * * `columns`
+     */
+    gap?: GridLayoutGap;
+    /**
+     * Specifies the horizontal and vertical alignment of the inner GridLayout elements (see demos
+     * [here]({% slug layout_gridlayout %}#toc-horizontal-align) and [here]({% slug layout_gridlayout %}#toc-vertical-align)).
+     *
+     * The possible keys are:
+     * * `horizontal`&mdash;Defines the possible horizontal alignment of the inner GridLayout elements.
+     *   * `start`&mdash;Uses the start point of the container.
+     *   * `center`&mdash;Uses the central point of the container.
+     *   * `end`&mdash;Uses the end point of the container.
+     *   * (Default)`stretch`&mdash;Stretches the items to fill the width of the container.
+     * * `vertical`&mdash; Defines the possible vertical alignment of the inner GridLayout elements.
+     *   * `top`&mdash;Uses the top point of the container.
+     *   * `middle`&mdash;Uses the middle point of the container.
+     *   * `bottom`&mdash;Uses the bottom point of the container.
+     *   * (Default)`stretch`&mdash;Stretches the items to fill the height of the container.
+     */
+    align?: GridLayoutAlign | any;
+    /**
+     * Specifies the default number of columns and their widths ([see example]({% slug layout_gridlayout %}#toc-rows-and-columns)).
+     */
+    cols?: GridLayoutColumnProps[];
+    /**
+     * Specifies the default number of rows and their height ([see example]({% slug layout_gridlayout %}#toc-rows-and-columns)).
+     */
+    rows?: GridLayoutRowProps[];
+    /**
+     * The collection of GridLayoutItemProps.
+     */
+    items?: GridLayoutItemProps[];
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue GridLayout row]({% slug overview_gridlayout %}).
+ */
+export declare interface GridLayoutRowProps {
+    /**
+     * Specifies the height of the GridLayout
+     * row ([see example]({% slug overview_gridlayout %}#toc-vue-gridlayout-demo-preview)).
+     */
+    height?: number | string;
+}
+
+/**
+ * @hidden
+ */
+export declare const isArrayEqual: (firstArray: any[], secondArray: any[]) => boolean;
+
+/**
+ * @hidden
+ */
+export declare const isPresent: Function;
+
+/**
+ * @hidden
+ */
+export declare const leftArrowIcon: SVGIcon_2;
+
+/**
+ *
+ * Represents the [Kendo UI for Vue Menu component]({% slug overview_menu %}).
+ *
+ *
+ * ### props <span class='code'>Readonly&lt;[MenuProps]({% slug api_layout_menuprops %})&gt;</span>
+ * The props of the Menu component.
+ *
+ */
+export declare const Menu: DefineComponent<ExtractPropTypes<    {
+vertical: {
+type: PropType<boolean>;
+default: boolean;
+};
+items: PropType<MenuItemModel[]>;
+dir: PropType<string>;
+hoverOpenDelay: {
+type: PropType<number>;
+default: any;
+};
+hoverCloseDelay: {
+type: PropType<number>;
+default: any;
+};
+openOnClick: PropType<boolean>;
+itemRender: PropType<any>;
+linkRender: PropType<any>;
+customCloseItemIds: ArrayConstructor;
+}>, {}, {
+focusedItemId: string;
+hoveredItemId: string;
+tabbableItemId: string;
+isFirstRender: boolean;
+}, {
+menuClassName(): MenuComputed['menuClassName'];
+}, {
+reset(): void;
+onKeyDown(event: any): void;
+onItemMouseOver(itemId: string): void;
+onItemMouseLeave(itemId: string): void;
+onItemMouseDown(): void;
+onItemFocus(itemId: string): void;
+onItemClick(event: any, itemId: string): void;
+onItemBlur(itemId: string): void;
+getInputItem(itemId: string): void;
+setFocusedItemId(focusedItemId: string): void;
+setHoveredItemId(hoveredItemId: string): void;
+getMenuWrapperClassName(): object;
+clearItemHoverAndLeaveRequestsIfApplicable(): void;
+isItemWithDefaultClose(itemId: string): boolean;
+checkIsDirectionRightToLeft(): any;
+prepareItems(): void;
+dispatchSelectEventIfWired(event: any, itemId: string): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+vertical: {
+type: PropType<boolean>;
+default: boolean;
+};
+items: PropType<MenuItemModel[]>;
+dir: PropType<string>;
+hoverOpenDelay: {
+type: PropType<number>;
+default: any;
+};
+hoverCloseDelay: {
+type: PropType<number>;
+default: any;
+};
+openOnClick: PropType<boolean>;
+itemRender: PropType<any>;
+linkRender: PropType<any>;
+customCloseItemIds: ArrayConstructor;
+}>> & Readonly<{}>, {
+vertical: boolean;
+hoverOpenDelay: number;
+hoverCloseDelay: number;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface MenuComputed {
+    menuClassName: object;
+}
+
+/**
+ * @hidden
+ */
+export declare const MenuItemArrow: DefineComponent<ExtractPropTypes<    {
+itemId: PropType<string>;
+dir: PropType<string>;
+verticalMenu: PropType<boolean>;
+}>, {}, {}, {}, {
+getArrowName(): "" | SVGIcon_2;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+itemId: PropType<string>;
+dir: PropType<string>;
+verticalMenu: PropType<boolean>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * The properties of the Kendo UI for Vue MenuItemArrow component.
+ */
+export declare interface MenuItemArrowProps {
+    /**
+     * Sets the item id of the MenuItemArrow component.
+     */
+    itemId: string;
+    /**
+     * Sets the direction of the MenuItemArrow component.
+     */
+    dir: 'ltr' | 'rtl' | string;
+    /**
+     * Specifies whether the Menu which holds the MenuItemArrow component is vertical.
+     */
+    verticalMenu?: boolean;
+}
+
+/**
+ * @hidden
+ */
+export declare interface MenuItemInternalModel extends BaseMenuItem {
+    id: string;
+    items: MenuItemInternalModel[];
+    contentParentItemId?: string;
+    isLastFromSiblings: boolean;
+}
+
+/**
+ * @hidden
+ */
+export declare const MenuItemLink: DefineComponent<ExtractPropTypes<    {
+opened: BooleanConstructor;
+focused: BooleanConstructor;
+url: StringConstructor;
+}>, {}, {}, {
+menuItemClassName(): {
+'k-link': boolean;
+'k-menu-link': boolean;
+'k-active': any;
+'k-focus': any;
+};
+}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+opened: BooleanConstructor;
+focused: BooleanConstructor;
+url: StringConstructor;
+}>> & Readonly<{}>, {
+focused: boolean;
+opened: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface MenuItemLinkComputed {
+    menuItemClassName: object;
+}
+
+/**
+ * The properties of the Kendo UI for Vue MenuItemLink component.
+ */
+export declare interface MenuItemLinkProps {
+    /**
+     * Specifies whether the MenuItemLink component is opened.
+     */
+    opened: boolean;
+    /**
+     * Specifies whether the MenuItemLink component is focused.
+     */
+    focused: boolean;
+    /**
+     * Sets the URL of the MenuItemLink component.
+     */
+    url?: string;
+}
+
+/**
+ * The interface for describing items that can be passed to the `items` property of the Menu as an alternative to passing them as children.
+ */
+export declare interface MenuItemModel extends BaseMenuItem {
+    /**
+     * Specifies the children of the item.
+     */
+    items?: MenuItemModel[];
+}
+
+/**
+ * @hidden
+ */
+export declare interface MenuMethods {
+    [key: string]: any;
+    reset: () => void;
+    onKeyDown: (event: any) => void;
+    onItemMouseOver: (itemId: string) => void;
+    onItemMouseLeave: (itemId: string) => void;
+    onItemMouseDown: () => void;
+    onItemFocus: (itemId: string) => void;
+    onItemClick: (event: any, itemId: string) => void;
+    onItemBlur: (itemId: string) => void;
+    getInputItem: (itemId: string) => void;
+    setFocusedItemId: (focusedItemId: string) => void;
+    setHoveredItemId: (hoveredItemId: string) => void;
+    getMenuWrapperClassName: () => object;
+    clearItemHoverAndLeaveRequestsIfApplicable: () => void;
+    isItemWithDefaultClose: (itemId: string) => boolean;
+    checkIsDirectionRightToLeft: () => any;
+    prepareItems: () => void;
+    dispatchSelectEventIfWired: (event: any, itemId: string) => void;
+}
+
+/**
+ * The arguments for the `select` event of the Menu. If the item has a URL and the event is prevented, navigation to the URL does not occur.
+ */
+export declare interface MenuSelectEvent {
+    /**
+     * The id of selected item. The ids are hierarchical and zero-based. The first root item has a `0` id. If the first root item has children, the first child acquires a `0_0` id and the second acquires a `0_1` id.
+     */
+    itemId: string;
+    /**
+     * The selected item.
+     */
+    item: MenuItemModel;
+}
+
+/**
+ * @hidden
+ */
+declare enum NavigationAction {
+    Toggle = 0,
+    Next = 1,
+    Previous = 2
+}
+
+/**
+ *
+ * ### props <span class='code'>[PanelBarProps]({% slug api_layout_panelbarprops %})</span>
+ * The props of the PanelBar component.
+ */
+export declare const PanelBar: DefineComponent<ExtractPropTypes<    {
+animation: {
+type: PropType<boolean>;
+default: boolean;
+};
+items: PropType<any[]>;
+dir: PropType<string>;
+selected: PropType<string>;
+expanded: {
+type: PropType<string[]>;
+default: any;
+};
+focused: PropType<string>;
+expandMode: {
+type: PropType<PanelBarExpandMode>;
+default: string;
+validator: (value: string) => boolean;
+};
+className: PropType<string>;
+keepItemsMounted: PropType<boolean>;
+}>, {}, PanelBarData, {
+selectedItem(): any;
+expandedItems(): any;
+computedItems(): any;
+}, {
+handleSelect(event: PanelBarItemClickEventArguments): void;
+onSelect(event: any): void;
+onFocus(event: any, step?: number): void;
+onNavigate(event: any, action: NavigationAction): void;
+handleWrapperFocus(): void;
+handleWrapperBlur(): void;
+handleKeyDown(event: any): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+select: any;
+keydown: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+animation: {
+type: PropType<boolean>;
+default: boolean;
+};
+items: PropType<any[]>;
+dir: PropType<string>;
+selected: PropType<string>;
+expanded: {
+type: PropType<string[]>;
+default: any;
+};
+focused: PropType<string>;
+expandMode: {
+type: PropType<PanelBarExpandMode>;
+default: string;
+validator: (value: string) => boolean;
+};
+className: PropType<string>;
+keepItemsMounted: PropType<boolean>;
+}>> & Readonly<{
+onSelect?: (...args: any[] | unknown[]) => any;
+onKeydown?: (...args: any[] | unknown[]) => any;
+}>, {
+animation: boolean;
+expanded: string[];
+expandMode: PanelBarExpandMode;
+}, {}, {}, {}, string, () => {
+dispatchItemSelect: any;
+}, true, {}, any>;
+
+export declare interface PanelBarData {
+    currentFocused?: string;
+    wrapperFocused?: boolean;
+    currentSelected?: string;
+    currentExpanded: string[];
+}
+
+/**
+ * Represents the expand modes of the Kendo UI for Vue PanelBar. Defaults to `multiple`.
+ */
+export declare type PanelBarExpandMode = 'single' | 'multiple';
+
+/**
+ * @hidden
+ */
+export declare interface PanelBarGroupData {
+    show: boolean;
+}
+
+/**
+ * @hidden
+ */
+export declare interface PanelBarGroupProps {
+    item?: object;
+    items?: any[];
+    animation?: boolean;
+    expanded?: boolean;
+    disabled?: boolean;
+    content?: any;
+    keepItemsMounted?: boolean;
+    uniquePrivateKey?: string | number;
+}
+
+/**
+ * @hidden
+ */
+export declare const PanelBarItem: DefineComponent<ExtractPropTypes<    {
+item: PropType<any>;
+items: PropType<any[]>;
+animation: PropType<boolean>;
+expanded: PropType<boolean>;
+disabled: PropType<boolean>;
+selected: PropType<boolean>;
+level: PropType<number>;
+title: {
+type: PropType<any>;
+default: () => string;
+};
+id: PropType<string | number>;
+focused: PropType<boolean>;
+keepItemsMounted: PropType<boolean>;
+uniquePrivateKey: PropType<string | number>;
+parentUniquePrivateKey: PropType<string[]>;
+parentExpanded: PropType<boolean>;
+headerClassName: PropType<string>;
+iconClass: PropType<string>;
+imageUrl: PropType<string>;
+icon: PropType<string>;
+svgIcon: PropType<SVGIcon>;
+content: PropType<any>;
+header: PropType<any>;
+}>, {}, {}, {}, {
+handleItemClick(): void;
+childFactory(child: any): any;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+item: PropType<any>;
+items: PropType<any[]>;
+animation: PropType<boolean>;
+expanded: PropType<boolean>;
+disabled: PropType<boolean>;
+selected: PropType<boolean>;
+level: PropType<number>;
+title: {
+type: PropType<any>;
+default: () => string;
+};
+id: PropType<string | number>;
+focused: PropType<boolean>;
+keepItemsMounted: PropType<boolean>;
+uniquePrivateKey: PropType<string | number>;
+parentUniquePrivateKey: PropType<string[]>;
+parentExpanded: PropType<boolean>;
+headerClassName: PropType<string>;
+iconClass: PropType<string>;
+imageUrl: PropType<string>;
+icon: PropType<string>;
+svgIcon: PropType<SVGIcon>;
+content: PropType<any>;
+header: PropType<any>;
+}>> & Readonly<{}>, {
+title: any;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+declare interface PanelBarItemClickEventArguments {
+    uniquePrivateKey: number;
+    target: any;
+}
+
+/**
+ * Represents the props of the PanelBarItem component.
+ */
+export declare interface PanelBarItemProps {
+    /**
+     * Sets the subitems of the item.
+     */
+    items?: any[];
+    /**
+     * Allows individual animation control over the child ([see example]({% slug animations_panelbar %})). By default, it is controlled by the PanelBar component.
+     */
+    animation?: boolean;
+    /**
+     * The class name that is set to the PanelBarItem header.
+     */
+    headerClassName?: string;
+    /**
+     * Sets the initial expanded state of the PanelBarItem ([see example]({% slug statesitems_panelbar %}#toc-expanded-items)). Controlled by the PanelBar component.
+     */
+    expanded?: boolean;
+    /**
+     * Sets the disabled state of the PanelBarItem ([see example]({% slug statesitems_panelbar %}#toc-disabled-items)).
+     */
+    disabled?: boolean;
+    /**
+     * @hidden
+     */
+    level?: number;
+    /**
+     * Defines an icon that will be rendered next to the title ([see example]({% slug titlesitems_panelbar %}#toc-adding-icons)).
+     */
+    icon?: string;
+    /**
+     * Defines an SVGIcon to be rendered next to the title.
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * Defines an icon with a custom CSS class that will be rendered next to the title ([see example]({% slug titlesitems_panelbar %}#toc-adding-icons)).
+     */
+    iconClass?: string;
+    /**
+     * Defines the location of the image that will be displayed next to the title ([see example]({% slug titlesitems_panelbar %}#toc-adding-images)).
+     */
+    imageUrl?: string;
+    /**
+     * Sets the initial selected state of the PanelBarItem. Controlled by the PanelBarItem component ([see example]({% slug statesitems_panelbar %}#toc-selected-items)).
+     */
+    selected?: boolean;
+    /**
+     * Sets the title of the PanelBar item ([see example]({% slug titlesitems_panelbar %}#toc-getting-started)).
+     */
+    title?: any;
+    /**
+     * Allows the component to set the `id` property to each item. If not set, a default `id` is applied.
+     */
+    id?: string | number;
+    /**
+     * Sets the initial focused state of the PanelBarItem. Controlled by the PanelBar component.
+     */
+    focused?: boolean;
+    /**
+     * @hidden
+     */
+    parentExpanded?: boolean;
+    /**
+     *  Defines the custom rendering of the content of the PanelBarItem. Accepts a Vue component, a `render` function, or a slot name.
+     */
+    content?: any;
+    /**
+     *  Defines the custom rendering of the header of the PanelBarItem. Accepts a Vue component, a `render` function, or a slot name.
+     */
+    header?: any;
+    /**
+     * Used to identify the PanelBarItems inside the PanelBar ([see example]({% slug controlling_state_panelbar %})). Does not depend on the state of the PanelBarItem.
+     */
+    uniquePrivateKey?: string | number;
+    /**
+     * @hidden
+     */
+    parentUniquePrivateKey?: string[];
+    /**
+     * @hidden
+     */
+    keepItemsMounted?: boolean;
+    /**
+     * @hidden
+     */
+    item?: any;
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue PanelBar component]({% slug overview_panelbar %}).
+ */
+export declare interface PanelBarProps {
+    /**
+     * The class name that is set to the PanelBar.
+     */
+    className?: string;
+    /**
+     * Sets the animation state of the PanelBar.
+     */
+    animation?: boolean;
+    /**
+     * Sets the items of the PanelBar.
+     */
+    items?: any[];
+    /**
+     * Sets the expand mode of the PanelBar ([see example]({% slug expandmodes_panelbar %})).
+     *
+     * The available modes are:
+     * - `"single"`&mdash;Allows you to expand only one item at a time. The expanding of an item collapses the item that was previously expanded.
+     * - `"multiple"` (default)&mdash;Allows you to expand two or more items at a time. Items can also be toggled.
+     */
+    expandMode?: PanelBarExpandMode;
+    /**
+     * Sets the direction of the PanelBar component.
+     */
+    dir?: string;
+    /**
+     * If set, overrides the currently selected property in the PanelBar state.
+     */
+    selected?: string;
+    /**
+     * Sets the initial expanded state of the PanelBar.
+     */
+    expanded?: string[];
+    /**
+     * Sets the initial focused state of the PanelBar.
+     */
+    focused?: string;
+    /**
+     * Determines if the PanelBar items will be mounted after expand collapse. Defaults to `false`.
+     */
+    keepItemsMounted?: boolean;
+    /**
+     * Determines if the PanelBar is going to be used in controlled state.
+     */
+    isControlled?: boolean;
+    /**
+     * Fires each time the user makes a selection ([see example]({% slug controlling_state_panelbar %})).
+     */
+    onSelect?: (event: PanelBarSelectEventArguments) => void;
+}
+
+/**
+ * The arguments that are passed to the `onSelect` callback function.
+ */
+export declare interface PanelBarSelectEventArguments {
+    /**
+     * The selected PanelBar item.
+     */
+    target: any;
+    /**
+     * The new expanded PanelBar items state.
+     */
+    expandedItems: string[];
+}
+
+/**
+ * @hidden
+ */
+export declare const renderChildren: (this: any, items: any[], { animation, keepItemsMounted, state, expanded, handleSelect, parentExpanded, level, parentPrivateKey }: RenderPanelBarItem) => any;
+
+/**
+ * @hidden
+ */
+export declare interface RenderPanelBarItem {
+    animation?: boolean;
+    keepItemsMounted?: boolean;
+    state: PanelBarData;
+    expanded: string[];
+    handleSelect: any;
+    parentExpanded?: boolean;
+    level?: number;
+    parentPrivateKey?: string[];
+}
+
+/**
+ * @hidden
+ */
+export declare const rightArrowIcon: SVGIcon_2;
+
+/**
+ * Represents the [Kendo UI for Vue Native Splitter component]({% slug overview_splitter %}).
+ *
+ * ```js-no-run
+ * <template>
+ *   <Splitter
+ *     :style="{ height: '340px' }"
+ *     :panes="panes"
+ *     :orientation="'vertical'"
+ *     @change="onChange"
+ *   >
+ *     <template v-slot:first>
+ *       <div class="pane-content">
+ *         <h3>Top Pane</h3>
+ *       </div>
+ *     </template>
+ *     <template v-slot:second>
+ *       <div class="pane-content">
+ *         <h3>Bottom Pane</h3>
+ *       </div>
+ *     </template>
+ *   </Splitter>
+ * </template>
+ *
+ * <script>
+ * import { Splitter } from '@progress/kendo-vue-layout';
+ * import './styles.css';
+ *
+ * export default {
+ *   components: {
+ *     Splitter,
+ *   },
+ *   data() {
+ *     return {
+ *       panes: [
+ *         { size: '40%', containsSplitter: true, content: 'first' },
+ *         { content: 'second' },
+ *       ],
+ *     };
+ *   },
+ *   methods: {
+ *     onChange(event) {
+ *       this.panes = event.newState;
+ *     },
+ *   },
+ * };
+ * </script>
+ * ```
+ *
+ *
+ *
+ * ### props <span class='code'>Readonly&lt;[SplitterProps]({% slug api_layout_splitterprops %})</span>
+ * The props of the Splitter component.
+ */
+export declare const Splitter: DefineComponent<ExtractPropTypes<    {
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+panes: PropType<SplitterPaneProps[]>;
+defaultPanes: PropType<SplitterPaneProps[]>;
+}>, {}, {
+currentRtl: boolean;
+isDragging: boolean;
+dragIndex: any;
+startTime: number;
+originalX: number;
+originalY: number;
+originalPrevSize: number;
+originalNextSize: number;
+currentPanes: SplitterPaneProps[];
+}, {
+isControlledState(): boolean;
+computedPanes(): SplitterPaneProps[] | undefined;
+}, {
+validatePanes(panesOptions: SplitterPaneProps[]): void;
+mapPaneOptions(panes: SplitterPaneProps[]): SplitterPaneExtendedProps[];
+onBarToggle(index: number, event: any): void;
+onBarDragResize(event: any, barElement: HTMLDivElement, index: number, isFirst: boolean, isLast: boolean): void;
+onBarKeyboardResize(barElement: HTMLDivElement, index: number, delta: number, event: any): void;
+surroudingPanes(barElement: HTMLDivElement): {
+prevElement: Element;
+nextElement: Element;
+};
+containerSize(): number;
+isPercent(size: string): boolean;
+toPixels(size: string, splitterSize: number): number;
+panesOptions(): SplitterPaneProps[];
+resetDragState(): void;
+elementSize(el: HTMLElement, isContainer?: boolean): number;
+clamp(min: number, max: number, v: number): number;
+fixedSize(size: string | undefined): any;
+resize(prevIndex: number, nextIndex: number, originalPrevSize: number, originalNextSize: number, delta: any, isLast: boolean, event: any): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+change: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+panes: PropType<SplitterPaneProps[]>;
+defaultPanes: PropType<SplitterPaneProps[]>;
+}>> & Readonly<{
+onChange?: (...args: any[] | unknown[]) => any;
+}>, {
+orientation: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface SplitterData {
+    isDragging: boolean;
+    dragIndex?: number;
+    startTime: number;
+    originalX: number;
+    originalY: number;
+    originalPrevSize: number;
+    originalNextSize: number;
+    currentPanes: SplitterPaneProps[];
+}
+
+/**
+ * Represents the onChange event of the Splitter.
+ */
+export declare interface SplitterOnChangeEvent {
+    /**
+     * The new panes state.
+     */
+    newState: SplitterPaneProps[];
+    /**
+     * Indicates if is the last event during drag. Can be used to optimize performance.
+     */
+    isLast: boolean;
+    /**
+     * The native DOM event.
+     */
+    nativeEvent: any;
+}
+
+/**
+ * @hidden
+ */
+export declare const SplitterPane: DefineComponent<ExtractPropTypes<    {
+orientation: {
+type: PropType<string>;
+default: () => any;
+validator: (value: string) => any;
+};
+overlay: PropType<boolean>;
+containsSplitter: PropType<boolean>;
+size: PropType<string>;
+min: PropType<string>;
+max: PropType<string>;
+resizable: PropType<boolean>;
+collapsible: PropType<boolean>;
+collapsed: PropType<boolean>;
+scrollable: PropType<boolean>;
+keepMounted: PropType<boolean>;
+content: PropType<any>;
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+orientation: {
+type: PropType<string>;
+default: () => any;
+validator: (value: string) => any;
+};
+overlay: PropType<boolean>;
+containsSplitter: PropType<boolean>;
+size: PropType<string>;
+min: PropType<string>;
+max: PropType<string>;
+resizable: PropType<boolean>;
+collapsible: PropType<boolean>;
+collapsed: PropType<boolean>;
+scrollable: PropType<boolean>;
+keepMounted: PropType<boolean>;
+content: PropType<any>;
+}>> & Readonly<{}>, {
+orientation: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface SplitterPaneExtendedProps extends SplitterPaneProps {
+    orientation: 'vertical' | 'horizontal' | string;
+    overlay: boolean;
+}
+
+/**
+ * Represents the pane options of the Splitter.
+ */
+export declare interface SplitterPaneProps {
+    /**
+     * Sets the size of the pane ([see example]({% slug panes_splitter %}#toc-dimensions)). Has to be between the `min` and `max` properties.
+     */
+    size?: string;
+    /**
+     * Sets the minimum possible size of the pane ([see example]({% slug panes_splitter %}#toc-dimensions)).
+     */
+    min?: string;
+    /**
+     * Sets the maximum possible size of the pane ([see example]({% slug panes_splitter %}#toc-dimensions)).
+     */
+    max?: string;
+    /**
+     * Specifies if the user is allowed to resize the pane and provide space for other panes ([see example]({% slug panes_splitter %}#toc-resizing)). If `resizable` is not specified, the resizing of the pane will be enabled.
+     */
+    resizable?: boolean;
+    /**
+     * Specifies if the user is allowed to hide the pane and provide space for other panes ([see example]({% slug panes_splitter %}#toc-collapsing)).
+     */
+    collapsible?: boolean;
+    /**
+     * Specifies the pane collapsed state ([see example]({% slug panes_splitter %}#toc-collapsing)).
+     */
+    collapsed?: boolean;
+    /**
+     * Specifies if overflowing content is scrollable or hidden ([see example]({% slug panes_splitter %}#toc-scrolling)). If `scrollable` is not specified, the content will be scrollable.
+     */
+    scrollable?: boolean;
+    /**
+     * Specifies if the content of the pane contains Splitter.
+     */
+    containsSplitter: boolean;
+    /**
+     * Specifies if the children of the pane should be mounted when it's in collapsed state.
+     */
+    keepMounted?: boolean;
+    /**
+     * The slot template for the content of the splitter
+     */
+    content?: any;
+}
+
+/**
+ * Represents the options of the Splitter.
+ */
+export declare interface SplitterProps {
+    /**
+     * Sets the options of the Splitter panes ([more information and examples]({% slug panes_splitter %})). Can be used for controlled state.
+     */
+    panes?: SplitterPaneProps[];
+    /**
+     * Sets the initial options of the Splitter panes ([more information and examples]({% slug panes_splitter %})). Can be used for uncontrolled state.
+     */
+    defaultPanes?: SplitterPaneProps[];
+    /**
+     * Specifies the orientation of the panes within the Splitter ([more information and examples]({% slug orientation_splitter %})). Panes in a horizontal Splitter are placed horizontally. Panes in a vertical Splitter are placed vertically.
+     */
+    orientation?: 'vertical' | 'horizontal' | string;
+    /**
+     * Fires after a Splitter pane is resized or collapsed. Useful for updating the pane options and triggering layout calculations on components which are positioned inside the panes.
+     */
+    onChange?: (event: SplitterOnChangeEvent) => void;
+}
+
+/**
+ * Represents the [Kendo UI for Vue StackLayout component]({% slug overview_stacklayout %}).
+ * Arranges its inner elements horizontally, or vertically in a stack. Nesting stack layouts is supported to build more complex layouts.
+ */
+export declare const StackLayout: DefineComponent<ExtractPropTypes<    {
+id: PropType<string>;
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+gap: {
+type: PropType<string | number>;
+};
+align: {
+type: PropType<StackLayoutAlign>;
+validator: (value: StackLayoutAlign) => any;
+};
+}>, {}, {}, {
+hAlign(): any;
+vAlign(): any;
+stackLayoutClasses(): {
+'k-stack-layout': boolean;
+'k-hstack': boolean;
+'k-vstack': boolean;
+'k-justify-content-start': boolean;
+'k-justify-content-center': boolean;
+'k-justify-content-end': boolean;
+'k-justify-content-stretch': boolean;
+'k-align-items-start': boolean;
+'k-align-items-center': boolean;
+'k-align-items-end': boolean;
+'k-align-items-stretch': boolean;
+};
+stackLayoutStyles(): {
+gap: string;
+};
+}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+id: PropType<string>;
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+gap: {
+type: PropType<string | number>;
+};
+align: {
+type: PropType<StackLayoutAlign>;
+validator: (value: StackLayoutAlign) => any;
+};
+}>> & Readonly<{}>, {
+orientation: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Specifies the horizontal and vertical alignment of the inner StackLayout elements.
+ */
+export declare interface StackLayoutAlign {
+    /**
+     * Defines the possible horizontal alignment of the inner StackLayout elements
+     * ([see example]({% slug layout_stacklayout %}#toc-horizontal-align)).
+     *
+     * The available values are:
+     * - `start`&mdash;Uses the start point of the container.
+     * - `center`&mdash;Uses the center point of the container.
+     * - `end`&mdash;Uses the end point of the container.
+     * - (Default)`stretch`&mdash;Stretches the items to fill the width of the container.
+     */
+    horizontal?: 'start' | 'center' | 'end' | 'stretch';
+    /**
+     * Defines the possible vertical alignment of the inner StackLayout elements
+     * ([see example]({% slug layout_stacklayout %}#toc-vertical-align)).
+     *
+     * The available values are:
+     * - `top`&mdash;Uses the top point of the container.
+     * - `middle`&mdash;Uses the middle point of the container.
+     * - `bottom`&mdash;Uses the bottom point of the container.
+     * - (Default)`stretch`&mdash;Stretches the items to fill the height of the container.
+     */
+    vertical?: 'top' | 'middle' | 'bottom' | 'stretch';
+}
+
+/**
+ * Specifies the orientation of the StackLayout ([see example]({% slug layout_stacklayout %}#toc-orientation)).
+ *
+ * The possible values are:
+ * * (Default)`horizontal`
+ * * `vertical`
+ *
+ */
+export declare type StackLayoutOrientation = 'horizontal' | 'vertical';
+
+/**
+ * Represents the props of the [Kendo UI for Vue StackLayout component]({% slug overview_stacklayout %}).
+ */
+export declare interface StackLayoutProps {
+    /**
+     * Sets the `id` property of the root StackLayout element.
+     */
+    id?: string;
+    /**
+     * Specifies the gap between the inner elements ([see example]({% slug layout_stacklayout %}#toc-gaps)).
+     */
+    gap?: number | string;
+    /**
+     * Specifies the orientation of the StackLayout.
+     * ([see example]({% slug layout_stacklayout %}#toc-orientation)).
+     *
+     * The possible values are:
+     * * (Default)`horizontal`
+     * * `vertical`
+     */
+    orientation?: StackLayoutOrientation | string;
+    /**
+     * Specifies the horizontal and vertical alignment of the inner StackLayout elements.
+     * Demo ([here]({% slug layout_stacklayout %}#toc-horizontal-align)) and ([here]({% slug layout_stacklayout %}#toc-vertical-align)).
+     *
+     * The possible keys are:
+     * * `horizontal`&mdash;Defines the possible horizontal alignment of the inner StackLayout elements.
+     *   * `start`&mdash;Uses the start point of the container.
+     *   * `center`&mdash;Uses the central point of the container.
+     *   * `end`&mdash;Uses the end point of the container.
+     *   * (Default)`stretch`&mdash;Stretches the items to fill the width of the container.
+     * * `vertical`&mdash;Defines the possible vertical alignment of the inner StackLayout elements.
+     *   * `top`&mdash;Uses the top point of the container.
+     *   * `middle`&mdash;Uses the middle point of the container.
+     *   * `bottom`&mdash;Uses the bottom point of the container.
+     *   * (Default)`stretch`&mdash;Stretches the items to fill the height of the container.
+     */
+    align?: StackLayoutAlign;
+}
+
+/**
+ * Represents the [Kendo UI for Vue Step component]({% slug overview_stepper %}).
+ *
+ * ```jsx
+ * <Step v-bind="props" @change="(e) => props.onChange(e)">
+ * <span class="k-step-indicator" aria-hidden="true">
+ *    <span class="emoji">{{ props.emoji }}</span>
+ * </span>
+ * <span class="k-step-label">
+ *    <span class="k-step-text">{{ props.label }}</span>
+ * </span>
+ * </Step>
+ * ```
+ */
+export declare const Step: DefineComponent<ExtractPropTypes<    {
+current: PropType<boolean>;
+disabled: PropType<boolean>;
+icon: PropType<string>;
+svgIcon: PropType<SVGIcon>;
+index: PropType<number>;
+isValid: {
+type: PropType<boolean>;
+default: any;
+};
+focused: PropType<any>;
+label: PropType<string>;
+optional: PropType<boolean>;
+tabIndex: {
+type: PropType<number>;
+default: number;
+};
+text: PropType<string>;
+animationDuration: PropType<any>;
+isVertical: PropType<any>;
+item: PropType<any>;
+linear: PropType<any>;
+mode: PropType<any>;
+numOfSteps: PropType<any>;
+value: PropType<any>;
+successIcon: PropType<String>;
+successSvgIcon: PropType<Object>;
+errorIcon: PropType<String>;
+errorSvgIcon: PropType<Object>;
+onChange: PropType<any>;
+onFocus: PropType<any>;
+}>, {
+kendoLocalizationService: {};
+}, {}, {
+itemClassNames(): StepComputed['itemClassNames'];
+itemStyles(): StepComputed['itemStyles'];
+}, {
+focus(): void;
+handleClick(event: any): void;
+handleFocus(event: any): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+current: PropType<boolean>;
+disabled: PropType<boolean>;
+icon: PropType<string>;
+svgIcon: PropType<SVGIcon>;
+index: PropType<number>;
+isValid: {
+type: PropType<boolean>;
+default: any;
+};
+focused: PropType<any>;
+label: PropType<string>;
+optional: PropType<boolean>;
+tabIndex: {
+type: PropType<number>;
+default: number;
+};
+text: PropType<string>;
+animationDuration: PropType<any>;
+isVertical: PropType<any>;
+item: PropType<any>;
+linear: PropType<any>;
+mode: PropType<any>;
+numOfSteps: PropType<any>;
+value: PropType<any>;
+successIcon: PropType<String>;
+successSvgIcon: PropType<Object>;
+errorIcon: PropType<String>;
+errorSvgIcon: PropType<Object>;
+onChange: PropType<any>;
+onFocus: PropType<any>;
+}>> & Readonly<{}>, {
+tabIndex: number;
+isValid: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * The arguments for the `onChange` Step event.
+ */
+export declare interface StepChangeEvent {
+    /**
+     * The index of the selected Step.
+     */
+    value: number;
+}
+
+/**
+ * @hidden
+ */
+export declare interface StepComputed {
+    itemClassNames: object;
+    itemStyles: object;
+}
+
+/**
+ * The arguments for the `onFocus` Step event.
+ */
+export declare interface StepFocusEvent {
+}
+
+/**
+ * The Step ref.
+ */
+export declare interface StepHandle {
+    /**
+     * The Step element.
+     */
+    element: HTMLLIElement | null;
+    /**
+     * Focus the Step.
+     */
+    focus: () => void;
+}
+
+/**
+ * Represents the [Kendo UI for Vue Stepper component]({% slug overview_stepper %}).
+ *
+ * ```jsx
+ * <template>
+ *    <Stepper :value="value" @change="handleChange" :items="items" />
+ * </template>
+ *
+ * <script>
+ * import {
+ *  Stepper
+ *     } from '@progress/kendo-vue-layout';
+ * export default {
+ *     components: {
+ *        Stepper
+ *     },
+ *     data () {
+ *       return {
+ *         value: 0,
+ *         items: [
+ *           {
+ *             label: "Cart",
+ *             icon: "cart",
+ *           },
+ *           {
+ *             label: "Delivery Address",
+ *             icon: "marker-pin-target",
+ *           },
+ *           {
+ *             label: "Payment Method",
+ *             icon: "dollar",
+ *           },
+ *           {
+ *             label: "Preview",
+ *             icon: "preview",
+ *             optional: true,
+ *           },
+ *           {
+ *             label: "Finish Order",
+ *             icon: "track-changes-accept",
+ *           },
+ *         ]
+ *       }
+ *     },
+ *     methods: {
+ *       handleChange (e) {
+ *         this.value = e.value;
+ *       }
+ *     }
+ * };
+ * </script>
+ * ```
+ *
+ */
+export declare const Stepper: DefineComponent<ExtractPropTypes<    {
+animationDuration: {
+type: PropType<number | boolean>;
+default: number;
+};
+dir: PropType<string>;
+disabled: PropType<boolean>;
+item: {
+type: PropType<any>;
+default: any;
+};
+items: PropType<StepProps[]>;
+linear: PropType<boolean>;
+mode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+value: {
+type: PropType<number>;
+default: number;
+};
+progressTotal: {
+type: PropType<number>;
+};
+progress: {
+type: PropType<number>;
+};
+modelValue: PropType<number>;
+successIcon: PropType<string>;
+errorIcon: PropType<string>;
+}>, {}, {
+currentDir: string;
+focusedIdx: number;
+stepper: {};
+currentFocused: boolean;
+}, {
+computedValue(): any;
+isVertical(): boolean;
+numOfSteps(): any;
+stepperClasses(): {
+'k-stepper': boolean;
+'k-stepper-linear': any;
+};
+stepperStyles(): {
+display: string;
+gridTemplateColumns: string;
+gridTemplateRows: string;
+};
+listClasses(): {
+'k-step-list': boolean;
+'k-step-list-horizontal': boolean;
+'k-step-list-vertical': any;
+};
+listStyles(): {
+gridColumnStart: string | number;
+gridColumnEnd: string | number;
+gridRowStart: string | number;
+gridRowEnd: string | number;
+};
+progressbarStyles(): {
+gridColumnStart: string | number;
+gridColumnEnd: string | number;
+gridRowStart: string | number;
+gridRowEnd: string | number;
+};
+}, {
+focus(): void;
+dispatchChangeEvent(event: any, val: number): void;
+handleChange(event: StepChangeEvent): void;
+handleFocus(event: StepFocusEvent): void;
+handleEnter(event: any): void;
+handleFocusin(): void;
+handleFocusout(): void;
+handleKeyDown(event: any): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+animationDuration: {
+type: PropType<number | boolean>;
+default: number;
+};
+dir: PropType<string>;
+disabled: PropType<boolean>;
+item: {
+type: PropType<any>;
+default: any;
+};
+items: PropType<StepProps[]>;
+linear: PropType<boolean>;
+mode: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+orientation: {
+type: PropType<string>;
+default: string;
+validator: (value: string) => any;
+};
+value: {
+type: PropType<number>;
+default: number;
+};
+progressTotal: {
+type: PropType<number>;
+};
+progress: {
+type: PropType<number>;
+};
+modelValue: PropType<number>;
+successIcon: PropType<string>;
+errorIcon: PropType<string>;
+}>> & Readonly<{}>, {
+value: number;
+mode: string;
+orientation: string;
+item: any;
+animationDuration: number | boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * The arguments for the `onChange` Stepper event.
+ */
+export declare interface StepperChangeEvent {
+    /**
+     * The index of the selected Step.
+     */
+    value: number;
+}
+
+/**
+ * @hidden
+ */
+export declare interface StepperComputed {
+    [key: string]: any;
+    computedValue: number;
+}
+
+/**
+ * The arguments for the `onFocus` Stepper event.
+ */
+export declare interface StepperFocusEvent {
+}
+
+/**
+ * The Stepper ref.
+ */
+export declare interface StepperHandle {
+    /**
+     * The Stepper element.
+     */
+    element: HTMLMenuElement | null;
+    /**
+     * Focus the Stepper's first focusable child.
+     */
+    focus: () => void;
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue Stepper component]({% slug overview_stepper %}).
+ */
+export declare interface StepperProps {
+    /**
+     * Sets the duration of the Stepper animation. Defaults to `400ms`.
+     */
+    animationDuration?: boolean | number;
+    /**
+     * Specifies a list of CSS classes that will be added to the Stepper.
+     */
+    className?: string;
+    /**
+     * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
+     */
+    dir?: string;
+    /**
+     * Disables the whole Stepper.
+     */
+    disabled?: boolean;
+    /**
+     * Specifies a custom icon that will be rendered inside the step for invalid steps.
+     */
+    errorIcon?: string;
+    /**
+     * Overrides the default component responsible for visualizing a single item ([see example]({% slug custom_rendering_stepper %})).
+     *
+     * The default Component is: [Step]({% slug api_layout_step %}).
+     */
+    item?: any;
+    /**
+     * The collection of steps that will be rendered in the Stepper ([see example]({% slug overview_stepper %})).
+     */
+    items: Array<StepProps>;
+    /**
+     * Specifies the linear flow of the Stepper.
+     * ([see example]({% slug linear_mode_stepper %})).
+     */
+    linear?: boolean;
+    /**
+     * Specifies the display mode of the Stepper
+     * ([see example]({% slug display_modes_stepper %})).
+     * * The possible values are:
+     * * (Default) `steps`. Render step indicator and optional label.
+     * * `labels`. Render labels only.
+     */
+    mode?: 'steps' | 'labels' | string;
+    /**
+     * Specifies the orientation of the Stepper
+     * ([see example]({% slug orientation_stepper %})).
+     *
+     * The possible values are:
+     * * (Default) `horizontal`
+     * * `vertical`
+     */
+    orientation?: 'horizontal' | 'vertical' | string;
+    /**
+     * Specifies a custom icon that will be rendered inside the step for valid steps.
+     */
+    successIcon?: string;
+    /**
+     * Specifies the index of the selected Step.
+     */
+    value: number;
+    /**
+     * The maximum value of the ProgressBar inside the Stepper. If not defined it is equal to the number of steps defined.
+     */
+    progressTotal?: number;
+    /**
+     * Specifies the current progress of the ProgressBar inside the Stepper. If not defined it is equal to the current value.
+     */
+    progress?: number;
+    /**
+     * @hidden
+     */
+    modelValue?: number;
+    /**
+     * The event handler that will be fired when the value is changed.
+     */
+    onChange?: (event: StepperChangeEvent) => void;
+    /**
+     * The event handler that will be fired when a Step is focused.
+     */
+    onFocus?: (event: StepperFocusEvent) => void;
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue Step component]({% slug overview_stepper %}).
+ */
+export declare interface StepProps {
+    /**
+     * Specifies a list of CSS classes that will be added to the Step element.
+     */
+    className?: string;
+    /**
+     * Represents the content that will be rendered inside each Step.
+     *
+     * @hidden
+     */
+    content?: any;
+    /**
+     * Specifies the current Step.
+     */
+    current?: boolean;
+    /**
+     * Sets a custom property.
+     */
+    [customProp: string]: any;
+    /**
+     * Specifies if the Step is disabled
+     * ([see example]({% slug display_modes_stepper %})).
+     */
+    disabled?: boolean;
+    /**
+     * Defines the name for an existing icon in a Kendo UI for Vue theme.
+     * The icon is rendered inside the Step indicator by a `span.k-icon` element
+     * ([see example]({% slug display_modes_stepper %})).
+     */
+    icon?: string;
+    /**
+     * Defines an SVGIcon to be rendered within the Step.
+     */
+    svgIcon?: SVGIcon;
+    /**
+     * Defines the name for an success icon in a Kendo UI for Vue theme.
+     */
+    successIcon?: String;
+    /**
+     * Defines an success SVGIcon to be rendered within the Step.
+     */
+    successSvgIcon?: Object;
+    /**
+     * Defines the name for an error icon in a Kendo UI for Vue theme.
+     */
+    errorIcon?: String;
+    /**
+     * Defines an error SVGIcon to be rendered within the Step.
+     */
+    errorSvgIcon?: Object;
+    /**
+     * Sets the index of the Step that is used to identify it.
+     */
+    index?: number;
+    /**
+     * Specifies the validity of the step
+     * ([see example]({% slug display_modes_stepper %})).
+     */
+    isValid?: boolean;
+    /**
+     * Specifies the label of the Step
+     * ([see example]({% slug display_modes_stepper %})).
+     */
+    label?: string;
+    /**
+     * Specifies if the step is optional. The validation is not applied to these steps
+     * ([see example]({% slug display_modes_stepper %})).
+     */
+    optional?: boolean;
+    /**
+     * Sets the `tabIndex` property of the Step.
+     * Defaults to `0`.
+     */
+    tabIndex?: number;
+    /**
+     * Specifies the text content of the Step indicator
+     * ([see example]({% slug display_modes_stepper %})).
+     */
+    text?: string;
+}
+
+/**
+ * @hidden
+ */
+export declare const TabStrip: DefineComponent<ExtractPropTypes<    {
+animation: {
+type: PropType<boolean>;
+default: boolean;
+};
+selected: PropType<number>;
+tabPosition: {
+type: PropType<string>;
+default: string;
+};
+tabs: {
+type: PropType<TabStripTabProperties[]>;
+default: any;
+};
+tabIndex: PropType<number>;
+dir: PropType<string>;
+}>, {}, {
+currentShowAll: boolean;
+currentTabs: any[];
+showLicenseWatermark: boolean;
+}, {
+compTabs(): any;
+}, {
+addRenderTitle(currentId: string, titleTemplate: any): void;
+addTab(newTab: TabStripTabProperties): void;
+removeTab(currentId: string): void;
+onSelect(index: number): void;
+onKeyDown(event: any): void;
+invertKeys(original: any, inverted: any): any;
+firstNavigatableTab(): number;
+lastNavigatableTab(): number;
+prevNavigatableTab(): number;
+nextNavigatableTab(): number;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+select: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+animation: {
+type: PropType<boolean>;
+default: boolean;
+};
+selected: PropType<number>;
+tabPosition: {
+type: PropType<string>;
+default: string;
+};
+tabs: {
+type: PropType<TabStripTabProperties[]>;
+default: any;
+};
+tabIndex: PropType<number>;
+dir: PropType<string>;
+}>> & Readonly<{
+onSelect?: (...args: any[] | unknown[]) => any;
+}>, {
+tabs: TabStripTabProperties[];
+tabPosition: string;
+animation: boolean;
+}, {}, {}, {}, string, () => {
+addRenderTitle: any;
+addTab: any;
+removeTab: any;
+}, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare const TabStripContent: DefineComponent<ExtractPropTypes<    {
+showAll: PropType<boolean>;
+animation: PropType<boolean>;
+tabs: PropType<any[]>;
+selected: PropType<number>;
+hasTabs: PropType<boolean>;
+}>, {}, {
+midAnimation: boolean;
+}, {
+animationClass(): any;
+}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+showAll: PropType<boolean>;
+animation: PropType<boolean>;
+tabs: PropType<any[]>;
+selected: PropType<number>;
+hasTabs: PropType<boolean>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface TabStripContentMethods {
+    [key: string]: any;
+    addTab: () => void;
+    removeTab: (id: string) => void;
+    getTabs: (tabs: any[], children: any) => any;
+}
+
+/**
+ * The props that are passed to the TabStripContent by the TabStrip.
+ */
+export declare interface TabStripContentProps {
+    /**
+     * Defines whether the content appearance will be animated.
+     */
+    animation?: boolean;
+    /**
+     * Defines whether to render all the tabs.
+     */
+    showAll?: boolean;
+    /**
+     * The index of the selected tab. Used to indicate which child to render.
+     */
+    selected?: number;
+    /**
+     * The tabs collection.
+     */
+    tabs?: Array<any>;
+    /**
+     * @hidden
+     */
+    index?: number;
+    /**
+     * @hidden
+     */
+    keepTabsMounted?: boolean;
+    /**
+     * @hidden
+     */
+    hasTabs?: boolean;
+}
+
+/**
+ * Represents the emits of the [Kendo UI for Vue TabStrip component]({% slug overview_tabstrip %}).
+ */
+export declare interface TabStripEmits {
+    /**
+     * Fires each time the user makes a selection.
+     */
+    onSelect?: (e: TabStripSelectEventArguments) => void;
+}
+
+/**
+ * @hidden
+ */
+export declare const TabStripNavigation: DefineComponent<ExtractPropTypes<    {
+tabs: PropType<any[]>;
+selected: PropType<number>;
+tabIndex: PropType<number>;
+tabPosition: PropType<string>;
+onSelect: PropType<(e: number) => void>;
+onKeydown: PropType<(e: number) => void>;
+}>, {}, {}, {
+wrapperNavClasses(): {
+'k-tabstrip-items-wrapper': boolean;
+'k-hstack': boolean;
+'k-vstack': boolean;
+};
+navClasses(): {
+'k-tabstrip-items': boolean;
+'k-reset': boolean;
+};
+}, {
+onKeyDown(e: any): void;
+onNavigationItemSelect(idx: number): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+select: any;
+keydown: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+tabs: PropType<any[]>;
+selected: PropType<number>;
+tabIndex: PropType<number>;
+tabPosition: PropType<string>;
+onSelect: PropType<(e: number) => void>;
+onKeydown: PropType<(e: number) => void>;
+}>> & Readonly<{
+onSelect?: (...args: any[] | unknown[]) => any;
+onKeydown?: (...args: any[] | unknown[]) => any;
+}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface TabStripNavigationComputed {
+    [key: string]: any;
+    wrapperNavClasses: object;
+    navClasses: object;
+}
+
+/**
+ * The props that are passed to the TabStripNavigation by the TabStrip.
+ */
+export declare interface TabStripNavigationEmits {
+    /**
+     * @hidden
+     */
+    keydown?: any;
+    /**
+     * @hidden
+     */
+    select?(idx: number): void;
+}
+
+/**
+ * @hidden
+ */
+export declare const TabStripNavigationItem: DefineComponent<ExtractPropTypes<    {
+active: PropType<boolean>;
+disabled: PropType<boolean>;
+index: PropType<number>;
+title: {
+type: PropType<any>;
+default: string;
+};
+id: {
+type: PropType<any>;
+};
+titleRender: PropType<any>;
+first: {
+type: PropType<boolean>;
+default: any;
+};
+last: {
+type: PropType<boolean>;
+default: any;
+};
+}>, {}, {}, {
+itemClasses(): TabStripNavigationItemComputed['itemClasses'];
+}, {
+onClick(): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {
+select: any;
+}, string, PublicProps, Readonly<ExtractPropTypes<    {
+active: PropType<boolean>;
+disabled: PropType<boolean>;
+index: PropType<number>;
+title: {
+type: PropType<any>;
+default: string;
+};
+id: {
+type: PropType<any>;
+};
+titleRender: PropType<any>;
+first: {
+type: PropType<boolean>;
+default: any;
+};
+last: {
+type: PropType<boolean>;
+default: any;
+};
+}>> & Readonly<{
+onSelect?: (...args: any[] | unknown[]) => any;
+}>, {
+title: any;
+first: boolean;
+last: boolean;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * @hidden
+ */
+export declare interface TabStripNavigationItemComputed {
+    [key: string]: any;
+    itemClasses: object;
+}
+
+/**
+ * The emits that are triggered by the TabStripNavigation to the TabStripNavigationItem.
+ */
+export declare interface TabStripNavigationItemEmits {
+    /**
+     * @hidden
+     */
+    select?(idx: number): void;
+}
+
+/**
+ * The props that are passed by the TabStripNavigation to the TabStripNavigationItem.
+ */
+export declare interface TabStripNavigationItemProps {
+    /**
+     * Defines whether the current TabStripNavigationItem is selected.
+     */
+    active?: boolean;
+    /**
+     * Defines whether the TabStripNavigationItem is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Sets the index of the TabStripNavigationItem that is used to identify it.
+     */
+    index: number;
+    /**
+     * Sets the id of the TabStripNavigationItem.
+     */
+    id?: any;
+    /**
+     * Sets the title of the TabStripNavigationItem.
+     */
+    title?: any;
+    /**
+     * Defines the custom rendering of the title. Accepts a Vue component, a `render` function, or a slot name.
+     */
+    titleRender?: any;
+    /**
+     * @hidden
+     */
+    first?: boolean;
+    /**
+     * @hidden
+     */
+    last?: boolean;
+}
+
+/**
+ * The props that are passed to the TabStripNavigation by the TabStrip.
+ */
+export declare interface TabStripNavigationProps {
+    /**
+     * The tabs collection.
+     */
+    tabs?: Array<any>;
+    /**
+     * Sets the index of the selected tab. Controlled by the TabStrip component.
+     */
+    selected?: number;
+    /**
+     * @hidden
+     * The event that is triggered when a tab is selected.
+     */
+    onSelect?: (e: number) => void;
+    /**
+     * @hidden
+     * The event that is triggered when a key is pressed.
+     */
+    onKeydown?: (e: number) => void;
+    /**
+     * @hidden
+     */
+    tabIndex?: number;
+    /**
+     * @hidden
+     */
+    tabPosition?: string;
+}
+
+/**
+ * Represents the props of the [Kendo UI for Vue TabStrip component]({% slug overview_tabstrip %}).
+ */
+export declare interface TabStripProps extends TabStripEmits {
+    /**
+     * Enables the tab animation.
+     */
+    animation?: boolean;
+    /**
+     * Sets the index of the selected TabStripTab component
+     * ([see example]({% slug tabs_tabstrip %}#toc-tabs-on-initial-loading)).
+     */
+    selected?: number;
+    /**
+     * The position in which the TabStripNavigation components will be rendered.
+     *
+     * The available options are:
+     * - `"top"`&mdash;Renders the `TabStripNavigation` components to the top of the TabStrip.
+     * - `"bottom"`&mdash;Renders the `TabStripNavigation` components to the bottom of the TabStrip.
+     * - `"left"`&mdash;Renders the `TabStripNavigation` components to the left of the TabStrip.
+     * - `"right"`&mdash;Renders the `TabStripNavigation` components to the right of the TabStrip.
+     */
+    tabPosition?: string;
+    /**
+     * Sets the array of tabs.
+     */
+    tabs?: TabStripTabProperties[];
+    /**
+     * Sets the `tabIndex` of the TabStripNavigation.
+     */
+    tabIndex?: number;
+    /**
+     * Sets the direction of the TabStrip component.
+     */
+    dir?: string;
+}
+
+/**
+ * The arguments that are passed to the `onSelect` callback function of the TabStrip.
+ */
+export declare interface TabStripSelectEventArguments {
+    /**
+     * The index of the selected TabStrip tab.
+     */
+    selected: number;
+}
+
+/**
+ * @hidden
+ */
+export declare const TabStripTab: DefineComponent<ExtractPropTypes<    {
+disabled: PropType<boolean>;
+contentClassName: PropType<string>;
+title: PropType<any>;
+id: PropType<string>;
+titleRender: PropType<any>;
+}>, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+disabled: PropType<boolean>;
+contentClassName: PropType<string>;
+title: PropType<any>;
+id: PropType<string>;
+titleRender: PropType<any>;
+}>> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+export declare interface TabStripTabProperties {
+    disabled?: boolean;
+    id?: string;
+    tabId?: string;
+    title?: string;
+    titleRender?: any;
+    content?: any;
+    contentClassName?: string;
+}
+
+/**
+ * Represents the props of the TabStrip tabs.
+ */
+export declare interface TabStripTabProps {
+    /**
+     * Defines whether a tab is disabled ([see example]({% slug tabs_tabstrip %}#toc-disabled-state)).
+     */
+    disabled?: boolean;
+    /**
+     * Sets the title of the tab ([see example]({% slug tabs_tabstrip %}#toc-titles)).
+     */
+    title?: any;
+    /**
+     * Sets the id of the tab (li element).
+     */
+    id?: string;
+    /**
+     * Defines the custom rendering of the title. Accepts a Vue component, a `render` function, or a slot name.
+     */
+    titleRender?: ((h: any, defaultRendering: any | null, props: any, listeners: any) => any) | any;
+    /**
+     * Specifies the CSS class names of the TabStripTab content.
+     */
+    contentClassName?: string;
+}
+
+/**
+ * @hidden
+ */
+export declare const TileLayout: DefineComponent<ExtractPropTypes<    {
+id: StringConstructor;
+dir: StringConstructor;
+gap: ObjectConstructor;
+columns: NumberConstructor;
+columnWidth: (StringConstructor | NumberConstructor)[];
+rowHeight: (StringConstructor | NumberConstructor)[];
+dataItemKey: StringConstructor;
+items: ArrayConstructor;
+positions: ArrayConstructor;
+autoFlow: {
+type: StringConstructor;
+default: string;
+validator: (value: string) => any;
+};
+ignoreDrag: FunctionConstructor;
+}>, {}, {
+currentPositions: any[];
+showLicenseWatermark: boolean;
+}, {
+compPositions(): any;
+wrapperClass(): {
+[x: number]: boolean;
+'k-tilelayout': boolean;
+'k-pos-relative': boolean;
+};
+}, {
+focus(): void;
+updateHandle(index: number, dOrder: number, dCol: number, dRowSpan: number, dColSpan: number, isResized: boolean): void;
+}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<    {
+id: StringConstructor;
+dir: StringConstructor;
+gap: ObjectConstructor;
+columns: NumberConstructor;
+columnWidth: (StringConstructor | NumberConstructor)[];
+rowHeight: (StringConstructor | NumberConstructor)[];
+dataItemKey: StringConstructor;
+items: ArrayConstructor;
+positions: ArrayConstructor;
+autoFlow: {
+type: StringConstructor;
+default: string;
+validator: (value: string) => any;
+};
+ignoreDrag: FunctionConstructor;
+}>> & Readonly<{}>, {
+autoFlow: string;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+
+/**
+ * Controls how the auto-placement algorithm works, specifying exactly how auto-placed items get flowed into the TileLayout.
+ * For further reference, check [grid-auto-flow CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-flow) article.
+ * Defaults to `column`.
+ */
+export declare type TileLayoutAutoFlow = 'column' | 'row' | 'column dense' | 'row dense' | 'unset';
+
+/**
+ * Specifies the gaps between the tiles.
+ */
+export declare interface TileLayoutGap {
+    /**
+     * The rows gap between tiles.
+     * Defaults to `16px`.
+     */
+    rows?: number | string;
+    /**
+     * The columns gap between tiles.
+     * Defaults to `16px`.
+     */
+    columns?: number | string;
+}
+
+/**
+ * The interface for describing items that can be passed to the `items` property of the TileLayout component.
+ */
+export declare interface TileLayoutItem {
+    /**
+     * The position which is used when the TileLayout is in uncontrolled mode
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %}#toc-position-and-dimensions)).
+     */
+    defaultPosition?: TilePosition;
+    /**
+     * Sets additional styles to the TileLayoutItem.
+     */
+    style?: object;
+    /**
+     * Sets additional classes to the TileLayoutItem.
+     */
+    class?: string;
+    /**
+     * The tile object.
+     */
+    tile?: object;
+    /**
+     * Sets additional CSS styles to the TileLayoutItem hint element.
+     */
+    hintStyle?: object;
+    /**
+     * Sets additional classes to the TileLayoutItem hint element.
+     */
+    hintClass?: string;
+    /**
+     * Sets the title in the TileLayoutItem's header content
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %})).
+     */
+    header?: any;
+    /**
+     * Sets the title in the TileLayoutItem's header text
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %})).
+     */
+    headerText?: string;
+    /**
+     * Sets the content in TileLayoutItem's body content
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %})).
+     */
+    body?: any;
+    /**
+     * Sets the content in TileLayoutItem's body text
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %})).
+     */
+    bodyText?: string;
+    /**
+     * Overrides the default rendering of the TileLayoutItem
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %}#toc-custom-rendering)).
+     */
+    item?: any;
+    /**
+     * Specifies the id of each Tile if needed to be user-defined. By default the id is automatically generated.
+     */
+    id?: any;
+    /**
+     * Specifies if the user is allowed to resize the TileLayoutItem and in which direction
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %}#toc-resizing)).
+     * If `resizable` is not specified, the resizing of the TileLayoutItem will be enabled for both directions.
+     */
+    resizable?: TileResizeMode | string | boolean;
+    /**
+     * Specifies if the user is allowed to reorder the TileLayoutItem by dragging and dropping it
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %}#toc-reordering)).
+     * If `reorderable` is not specified, the dragging functionality of the TileLayoutItem will be enabled.
+     */
+    reorderable?: boolean;
+    /**
+     * Specifies if the tabIndex of each TileLayout tile if the scenario requires it. Defaults to `0`.
+     */
+    tabIndex?: number;
+}
+
+/**
+ * Represents the properties of [TileLayout](% slug overview_tilelayout %) component.
+ */
+export declare interface TileLayoutProps {
+    /**
+     * Sets the `id` property of the root element.
+     */
+    id?: string;
+    /**
+     * Represents the `dir` HTML attribute. This is used to switch from LTR to RTL.
+     */
+    dir?: string;
+    /**
+     * Specifies the gaps between the tiles ([see example]({% slug overview_tilelayout %}#toc-tilelayout-configuration-options)).
+     *
+     * * The possible keys are:
+     * * `rows`
+     * * `columns`
+     */
+    gap?: TileLayoutGap;
+    /**
+     * Specifies the default number of columns ([see example]({% slug overview_tilelayout %}#toc-tilelayout-configuration-options)).
+     */
+    columns?: number;
+    /**
+     * Specifies the default width of the columns ([see example]({% slug overview_tilelayout %}#toc-tilelayout-configuration-options)).
+     */
+    columnWidth?: number | string;
+    /**
+     * Specifies the default height of the rows ([see example]({% slug overview_tilelayout %}#toc-tilelayout-configuration-options)).
+     */
+    rowHeight?: number | string;
+    /**
+     * Represents the `key` field of the TileLayout item. Used for setting unique keys to the TileLayout items.
+     */
+    dataItemKey?: string;
+    /**
+     * The collection of items that will be rendered in the TileLayout
+     * ([see example]({% slug overview_tilelayout %}#toc-tilelayout-configuration-options)).
+     */
+    items?: TileLayoutItem[];
+    /**
+     * The list of tiles' positions which are used when the TileLayout is in controlled mode
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %}#toc-controlling-the-position)).
+     */
+    positions?: TilePosition[];
+    /**
+     * Fires when the user repositions the tile by either dragging or resizing
+     * ([see example]({% slug tiles_position_dimensions_tilelayout %}#toc-controlling-the-position)).
+     */
+    onReposition?: (event: TileLayoutRepositionEvent) => void;
+    /**
+     * Controls how the auto-placement algorithm works, specifying exactly how auto-placed items get flowed into the TileLayout.
+     * For further reference, check [grid-auto-flow CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-flow) article.
+     * Defaults to `column`
+     * ([see example]({% slug autoflows_tilelayout %})).
+     */
+    autoFlow?: TileLayoutAutoFlow | String;
+    /**
+     * Use this callback to prevent or allow dragging of the tiles based on specific dom event.
+     * Setting `:ignoreDrag="$event => !$event.target.closest('.k-card-title')"` will make only the headers draggable.
+     * Setting `:ignoreDrag="$event => $event.target.nodeName == 'INPUT'"` will ignore dragging input elements.
+     */
+    ignoreDrag?: (event: any) => boolean;
+}
+
+/**
+ * The arguments for the `onReposition` TileLayout event.
+ */
+export declare interface TileLayoutRepositionEvent {
+    /**
+     * The new positions of the TileLayout tiles.
+     */
+    value: Array<TileStrictPosition>;
+    /**
+     * The index of the currently moved tile.
+     */
+    index: number;
+    /**
+     * Returns 0 if the row is not changed, 1 if the item is dragged to the next row
+     * and -1 if the item is drag to the previous row.
+     */
+    row: number;
+    /**
+     * Returns 0 if the column is not changed, 1 if the item is dragged to the next column
+     * and -1 if the item is drag to the previous column.
+     */
+    col: number;
+}
+
+/**
+ * The arguments for the `onTileresize` TileLayout event.
+ */
+export declare interface TileLayoutTileResizeEvent {
+    /**
+     * The new resized positions of the TileLayout tiles.
+     */
+    value: Array<TileStrictPosition>;
+    /**
+     * The index of the currently resized tile.
+     */
+    index: number;
+    /**
+     * Returns 0 if the rowSpan is not changed, 1 if the rowSpan is increased
+     * and -1 if the rowSpan is decreased.
+     */
+    rowSpan: number;
+    /**
+     * Returns 0 if the columnSpan is not changed, 1 if the columnSpan is increased
+     * and -1 if the columnSpan is decreased.
+     */
+    colSpan: number;
+}
+
+/**
+ * Specifies the position of each tile.
+ */
+export declare interface TilePosition {
+    /**
+     * Defines the order index of the TileLayoutItem.
+     * If not set, items will receive a sequential order.
+     */
+    order?: number;
+    /**
+     * (Required) Defines on which column-line the TileLayoutItem will start.
+     * It is required in order reordering and resizing functionalities to work as expected as they rely on it.
+     */
+    col: number;
+    /**
+     * Specifies how many columns will the TileLayoutItem spans.
+     * Defaults to `1`.
+     */
+    colSpan?: number;
+    /**
+     * Defines on which row-line the TileLayoutItem will start.
+     */
+    row?: number;
+    /**
+     * Specifies how many rows will the TileLayoutItem spans.
+     * Defaults to `1`.
+     */
+    rowSpan?: number;
+}
+
+/**
+ * Specifies if the user is allowed to resize the TileLayoutItem and in which direction
+ * ([see example]({% slug tiles_position_dimensions_tilelayout %}#toc-resizing)).
+ * If `resizable` is not specified, the resizing of the TileLayoutItem will be enabled for both directions.
+ */
+export declare type TileResizeMode = 'horizontal' | 'vertical' | boolean;
+
+/**
+ * Specifies the strict position of each tile.
+ * Used in the [TileLayoutRepositionEvent]({% slug api_layout_tilelayoutrepositionevent %}).
+ */
+export declare interface TileStrictPosition extends TilePosition {
+    /**
+     * Defines the order index of the TileLayoutItem.
+     * If not set, items will receive a sequential order.
+     */
+    order: number;
+    /**
+     * Specifies how many rows will the TileLayoutItem spans.
+     * Defaults to `1`.
+     */
+    rowSpan: number;
+    /**
+     * Specifies how many columns will the TileLayoutItem spans.
+     * Defaults to `1`.
+     */
+    colSpan: number;
+}
+
+export { }