@base-ui-components/react/cjs/tabs/root/TabsRoot.d.ts

Base UI is a library of headless ('unstyled') React components and low-level hooks. You gain complete control over your app's CSS and accessibility features.

import * as React from 'react';
import type { BaseUIComponentProps } from '../../utils/types.js';
/**
 * Groups the tabs and the corresponding panels.
 * Renders a `<div>` element.
 *
 * Documentation: [Base UI Tabs](https://base-ui.com/react/components/tabs)
 */
declare const TabsRoot: React.ForwardRefExoticComponent<TabsRoot.Props & React.RefAttributes<HTMLDivElement>>;
export type TabsOrientation = 'horizontal' | 'vertical';
export type TabActivationDirection = 'left' | 'right' | 'up' | 'down' | 'none';
export type TabValue = any | null;
declare namespace TabsRoot {
    type State = {
        orientation: TabsOrientation;
        tabActivationDirection: TabActivationDirection;
    };
    interface Props extends Omit<BaseUIComponentProps<'div', State>, 'defaultValue'> {
        /**
         * The value of the currently selected `Tab`. Use when the component is controlled.
         * When the value is `null`, no Tab will be selected.
         */
        value?: TabValue;
        /**
         * The default value. Use when the component is not controlled.
         * When the value is `null`, no Tab will be selected.
         * @default 0
         */
        defaultValue?: TabValue;
        /**
         * The component orientation (layout flow direction).
         * @default 'horizontal'
         */
        orientation?: TabsOrientation;
        /**
         * Callback invoked when new value is being set.
         */
        onValueChange?: (value: TabValue, event?: Event) => void;
    }
}
export { TabsRoot };