@progress/kendo-vue-layout/tabstrip/TabStrip.d.ts

TODO

/**
 * @license
 *-------------------------------------------------------------------------------------------
 * Copyright © 2026 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the package root for more information
 *-------------------------------------------------------------------------------------------
 */
import { TabStripTabProperties } from './TabStripTab';
import { PropType } from 'vue';
/**
 * The arguments that are passed to the `onSelect` callback function of the TabStrip.
 */
export interface TabStripSelectEventArguments {
    /**
     * The index of the selected TabStrip tab.
     */
    selected: number;
}
/**
 * Represents the emits of the [Kendo UI for Vue TabStrip component]({% slug overview_tabstrip %}).
 */
export interface TabStripEmits {
    /**
     * Fires each time the user makes a selection.
     */
    onSelect?: (e: TabStripSelectEventArguments) => void;
}
/**
 * The values of the `size` property of the TabStrip.
 */
export type TabStripSize = 'small' | 'medium' | 'large' | null;
/**
 * Represents the props of the [Kendo UI for Vue TabStrip component]({% slug overview_tabstrip %}).
 */
export 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;
    /**
     * Specifies the possible sizes of the TabStrip.
     *
     * @default `medium`
     */
    size?: TabStripSize;
    /**
     * The position in which the TabStripNavigation components will be rendered.
     *
     * The available options are:
     * - `"top"`—Renders the `TabStripNavigation` components to the top of the TabStrip.
     * - `"bottom"`—Renders the `TabStripNavigation` components to the bottom of the TabStrip.
     * - `"left"`—Renders the `TabStripNavigation` components to the left of the TabStrip.
     * - `"right"`—Renders the `TabStripNavigation` components to the right of the TabStrip.
     *
     * @default 'top'.
     */
    tabPosition?: string;
    /**
     * Sets the alignment of the tabs.
     *
     *
     * The available options are:
     * - `"start"`—Aligns the tabs at the start of the `TabStripNavigation`.
     * - `"center"`—Aligns the tabs in the center of the `TabStripNavigation`.
     * - `"end"`—Aligns the tabs at the end of the `TabStripNavigation`.
     * - `"justify"`—Justifies the tabs inside the `TabStripNavigation`.
     * - `"stretched"`—Stretches the tabs inside the `TabStripNavigation`.
     *
     * @default 'start'.
     */
    tabAlignment?: 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;
}
/**
 * @hidden
 */
declare const TabStrip: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
    animation: {
        type: PropType<boolean>;
        default: boolean;
    };
    size: {
        type: PropType<TabStripSize>;
    };
    selected: PropType<number>;
    tabPosition: {
        type: PropType<string>;
        default: string;
    };
    tabAlignment: {
        type: PropType<string>;
        default: string;
    };
    tabs: {
        type: PropType<TabStripTabProperties[]>;
        default: any;
    };
    tabIndex: PropType<number>;
    dir: PropType<string>;
}>, {}, {
    currentShowAll: boolean;
    currentTabs: any[];
    showLicenseWatermark: boolean;
    licenseMessage: any;
}, {
    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;
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
    select: (e: TabStripSelectEventArguments) => true;
}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
    animation: {
        type: PropType<boolean>;
        default: boolean;
    };
    size: {
        type: PropType<TabStripSize>;
    };
    selected: PropType<number>;
    tabPosition: {
        type: PropType<string>;
        default: string;
    };
    tabAlignment: {
        type: PropType<string>;
        default: string;
    };
    tabs: {
        type: PropType<TabStripTabProperties[]>;
        default: any;
    };
    tabIndex: PropType<number>;
    dir: PropType<string>;
}>> & Readonly<{
    onSelect?: (e: TabStripSelectEventArguments) => any;
}>, {
    animation: boolean;
    tabs: TabStripTabProperties[];
    tabPosition: string;
    tabAlignment: string;
}, {}, {}, {}, string, () => {
    addRenderTitle: any;
    addTab: any;
    removeTab: any;
}, true, {}, any>;
export { TabStrip };