@spark-web/tabs/dist/declarations/src/tabs.d.ts

--- title: Tabs storybookPath: page-layout-tabs--default isExperimentalPackage: true ---

import type { DataAttributeMap } from '@spark-web/utils/internal';
import type { ReactElement, ReactNode } from 'react';
/**
 * Tabs
 *
 * The parent component of the tab interface.
 */
export declare const Tabs: import("react").ForwardRefExoticComponent<TabsProps & import("react").RefAttributes<HTMLDivElement>>;
export declare type TabsProps = {
    /**
     * When automatic, tabs are activated when receiving focus. When manual,
     * tabs are activated when clicked.
     *
     * @default 'automatic'
     */
    activationMode?: 'automatic' | 'manual';
    /**
     * Children elements to be rendered within the component.
     * Expected to be `TabList` and `TabPanels`.
     */
    children: ReactNode;
    /** Sets data attributes for the element. */
    data?: DataAttributeMap;
    /** The index of the tab that should be active when initially rendered. */
    defaultIndex?: number;
};
/**
 * TabList
 *
 * The parent component of the tabs.
 */
export declare function TabList({ children, data }: TabListProps): import("@emotion/react/jsx-runtime").JSX.Element;
export declare type TabListProps = {
    /**
     * Children elements to be rendered within the component.
     * Expected to be more than one `Tab` component.
     */
    children: Array<ReactElement<TabProps>>;
    /** Sets data attributes for the element. */
    data?: DataAttributeMap;
};
export declare const Tab: import("react").ForwardRefExoticComponent<TabProps & import("react").RefAttributes<HTMLButtonElement>>;
export declare type TabProps = {
    /** Children elements to be rendered within the component. */
    children: ReactNode;
    /** Sets data attributes for the element. */
    data?: DataAttributeMap;
    /** When true, prevents the user from interacting with the tab. */
    disabled?: boolean;
};
/**
 * TabPanels
 *
 * The parent component of the panels.
 */
export declare function TabPanels({ children, data }: TabPanelsProps): import("@emotion/react/jsx-runtime").JSX.Element;
export declare type TabPanelsProps = {
    /**
     * Children elements to be rendered within the component.
     * Expected to be more than one `TabPanel` component.
     */
    children: Array<ReactElement<TabPanelProps>>;
    /** Sets data attributes for the element. */
    data?: DataAttributeMap;
};
/**
 * TabPanel
 *
 * The panel that displays when it's corresponding tab is active.
 */
export declare const TabPanel: import("react").ForwardRefExoticComponent<TabPanelProps & import("react").RefAttributes<HTMLDivElement>>;
export declare type TabPanelProps = {
    /** Children elements to be rendered within the component. */
    children: ReactNode;
    /** Sets data attributes for the element. */
    data?: DataAttributeMap;
};