/** * @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; default: boolean; }; size: { type: PropType; }; selected: PropType; tabPosition: { type: PropType; default: string; }; tabAlignment: { type: PropType; default: string; }; tabs: { type: PropType; default: any; }; tabIndex: PropType; dir: PropType; }>, {}, { 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; default: boolean; }; size: { type: PropType; }; selected: PropType; tabPosition: { type: PropType; default: string; }; tabAlignment: { type: PropType; default: string; }; tabs: { type: PropType; default: any; }; tabIndex: PropType; dir: PropType; }>> & Readonly<{ onSelect?: (e: TabStripSelectEventArguments) => any; }>, { animation: boolean; tabs: TabStripTabProperties[]; tabPosition: string; tabAlignment: string; }, {}, {}, {}, string, () => { addRenderTitle: any; addTab: any; removeTab: any; }, true, {}, any>; export { TabStrip };