@base-ui-components/react/esm/tabs/panel/useTabsPanel.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 { GenericHTMLProps } from '../../utils/types.js';
import type { TabsRootContext } from '../root/TabsRootContext.js';
import type { TabValue } from '../root/TabsRoot.js';
export interface TabPanelMetadata {
    id?: string;
    value: useTabsPanel.Parameters['value'];
}
declare function useTabsPanel(parameters: useTabsPanel.Parameters): useTabsPanel.ReturnValue;
declare namespace useTabsPanel {
    interface Parameters extends Pick<TabsRootContext, 'getTabIdByPanelValueOrIndex'> {
        /**
         * The id of the TabPanel.
         */
        id?: string;
        /**
         * The ref of the TabPanel.
         */
        rootRef?: React.Ref<HTMLElement>;
        /**
         * The (context) value of the currently active/selected Tab.
         */
        selectedValue: TabValue;
        /**
         * The value of the TabPanel. It will be shown when the Tab with the corresponding value is selected.
         */
        value?: TabValue;
    }
    interface ReturnValue {
        /**
         * Whether the tab panel will be hidden.
         */
        hidden: boolean;
        /**
         * Resolver for the TabPanel component's props.
         * @param externalProps additional props for Tabs.TabPanel
         * @returns props that should be spread on Tabs.TabPanel
         */
        getRootProps: (externalProps?: GenericHTMLProps) => GenericHTMLProps;
        rootRef: React.RefCallback<HTMLElement> | null;
    }
}
export { useTabsPanel };