mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-18 03:26:36 +00:00
60 lines
1.2 KiB
TypeScript
60 lines
1.2 KiB
TypeScript
/// <reference types="svelte" />
|
|
|
|
export type TabsV2ItemId = number | string;
|
|
|
|
export interface TabsV2Item {
|
|
id: TabsV2ItemId;
|
|
label?: string;
|
|
disabled?: boolean;
|
|
}
|
|
|
|
export interface TabsV2Props extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap["div"]> {
|
|
/**
|
|
* Provide the tab items
|
|
* @default []
|
|
*/
|
|
items?: TabsV2Item[];
|
|
|
|
/**
|
|
* Specify the selected tab index
|
|
* @default 0
|
|
*/
|
|
selectedIndex?: number;
|
|
|
|
/**
|
|
* Specify the selected tab id
|
|
*/
|
|
selectedId?: TabsV2ItemId;
|
|
|
|
/**
|
|
* Specify the type of tabs
|
|
* @default "default"
|
|
*/
|
|
type?: "default" | "container";
|
|
|
|
/**
|
|
* Specify the ARIA label for the chevron icon
|
|
* @default "Show menu options"
|
|
*/
|
|
iconDescription?: string;
|
|
|
|
/**
|
|
* Specify the tab trigger href attribute
|
|
* @default "#"
|
|
*/
|
|
triggerHref?: string;
|
|
}
|
|
|
|
export default class TabsV2 {
|
|
$$prop_def: TabsV2Props;
|
|
$$slot_def: {
|
|
default: { id: TabsV2ItemId; index: number; item: TabsV2Item };
|
|
tab: {};
|
|
};
|
|
|
|
$on(
|
|
eventname: "change",
|
|
cb: (event: CustomEvent<{ selectedIndex: number; selectedId: TabsV2ItemId; currentItem: TabsV2Item }>) => void
|
|
): () => void;
|
|
$on(eventname: string, cb: (event: Event) => void): () => void;
|
|
}
|