@codegouvfr/react-dsfr/Tabs.d.ts

French State Design System React integration library

import React from "react";
import type { ReactNode } from "react";
import type { FrIconClassName, RiIconClassName } from "./fr/generatedFromCss/classNames";
export type TabsProps = TabsProps.Uncontrolled | TabsProps.Controlled;
export declare namespace TabsProps {
    type Common = {
        className?: string;
        label?: string;
        classes?: Partial<Record<"root" | "tab" | "panel", string>>;
    };
    type Uncontrolled = Common & {
        tabs: {
            label: ReactNode;
            iconId?: FrIconClassName | RiIconClassName;
            content: ReactNode;
        }[];
        selectedTabId?: undefined;
        onTabChange?: (params: {
            tabIndex: number;
            tab: Uncontrolled["tabs"][number];
        }) => void;
        children?: undefined;
    };
    type Controlled = Common & {
        tabs: {
            tabId: string;
            label: ReactNode;
            iconId?: FrIconClassName | RiIconClassName;
        }[];
        selectedTabId: string;
        onTabChange: (tabId: string) => void;
        children?: NonNullable<ReactNode>;
    };
}
/** @see <https://react-dsfr-components.etalab.studio/?path=/docs/components-tabs> */
export declare const Tabs: React.MemoExoticComponent<React.ForwardRefExoticComponent<TabsProps & React.RefAttributes<HTMLDivElement>>>;
export default Tabs;