@nextcloud/vue
Version:
Nextcloud vue components
171 lines (170 loc) • 5.2 kB
TypeScript
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
/**
* Id of the tab to activate
*/
active: {
type: StringConstructor;
default: string;
};
/**
* Force the tab navigation to display even if there is only one tab
*/
forceTabs: {
type: BooleanConstructor;
default: boolean;
};
}>, {}, {
/**
* Tab descriptions from the passed NcSidebarTab components' props to build the tab navbar from.
*/
tabs: never[];
/**
* Local active (open) tab's ID. It allows to use component without v-model:active
*/
activeTab: string;
isLegacy34: boolean;
/** Whether the sliding highlight runs (JS mounted, non-legacy design) */
highlightEnabled: boolean;
/** Whether the highlight is currently shown */
highlightVisible: boolean;
/** Whether position changes should transition (slide) or snap */
highlightAnimated: boolean;
/** Whether the highlight sits on the active tab (turns transparent) */
highlightOverActive: boolean;
/** Highlight geometry inside the tablist, in pixels */
highlightLeft: number;
highlightTop: number;
highlightWidth: number;
highlightHeight: number;
}, {
/**
* Has multiple tabs. If only one tab - its content is shown without navigation
*
* @return {boolean}
*/
hasMultipleTabs(): boolean;
showForSingleTab(): boolean;
currentTabIndex(): number;
highlightStyle(): {
transform: string;
width: string;
height: string;
};
}, {
/**
* Set the current active tab
*
* @param {string} id the id of the tab
*/
setActive(id: string): void;
/**
* Focus the previous tab
* and emit to the parent component
*/
focusPreviousTab(): void;
/**
* Focus the next tab
* and emit to the parent component
*/
focusNextTab(): void;
/**
* Focus the first tab
* and emit to the parent component
*/
focusFirstTab(): void;
/**
* Focus the last tab
* and emit to the parent component
*/
focusLastTab(): void;
/**
* Focus the current active tab
*/
focusActiveTab(): void;
/**
* Focus the content on tab
* see aria accessibility guidelines
*/
focusActiveTabContent(): void;
/**
* Update the current active tab
*/
updateActive(): void;
/**
* Register child tab in the tabs
*
* @param {object} tab child tab passed to slot
*/
registerTab(tab: object): void;
/**
* Unregister child tab from the tabs
*
* @param {string} id tab's id
*/
unregisterTab(id: string): void;
/**
* Move the sliding highlight onto a tab button. It slides there if
* already visible, otherwise it snaps into place so it does not slide in
* from a previously hovered tab. Over the active tab it turns transparent
* so the active tab keeps its own static background.
*
* @param {HTMLElement} button the tab button element to cover
*/
showHighlightOn(button: HTMLElement): void;
/** Hide the sliding highlight */
hideHighlight(): void;
/**
* Move the highlight to the tab button under the pointer or focus
*
* @param {Event} event the pointer or focus event
*/
handleHighlight(event: Event): void;
/**
* Hide the highlight once focus leaves the tablist entirely
*
* @param {FocusEvent} event the focusout event
*/
onHighlightFocusOut(event: FocusEvent): void;
}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, "update:active"[], "update:active", import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
/**
* Id of the tab to activate
*/
active: {
type: StringConstructor;
default: string;
};
/**
* Force the tab navigation to display even if there is only one tab
*/
forceTabs: {
type: BooleanConstructor;
default: boolean;
};
}>> & Readonly<{
"onUpdate:active"?: ((...args: any[]) => any) | undefined;
}>, {
active: string;
forceTabs: boolean;
}, {}, {
NcAppSidebarTabsButton: import('vue').DefineComponent<{
selected: boolean;
} & {
tab: InstanceType<typeof import('../index.ts').NcAppSidebarTab>;
animatedHighlight?: boolean;
}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
"update:selected": (value: boolean) => any;
}, string, import('vue').PublicProps, Readonly<{
selected: boolean;
} & {
tab: InstanceType<typeof import('../index.ts').NcAppSidebarTab>;
animatedHighlight?: boolean;
}> & Readonly<{
"onUpdate:selected"?: ((value: boolean) => any) | undefined;
}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLButtonElement>;
}, {}, string, () => {
registerTab: (tab: object) => void;
unregisterTab: (id: string) => void;
getActiveTab: () => string;
isTablistShown: () => boolean;
}, true, {}, any>;
export default _default;