@carbon/react
Version:
React components for the Carbon Design System
87 lines (86 loc) • 3.34 kB
TypeScript
/**
* Copyright IBM Corp. 2016, 2025
*
* This source code is licensed under the Apache-2.0 license found in the
* LICENSE file in the root directory of this source tree.
*/
import PropTypes from 'prop-types';
import { type HTMLAttributes, type ReactElement } from 'react';
import type { SwitchEventHandlersParams } from '../Switch/Switch';
export interface ContentSwitcherProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange'> {
/**
* Pass in Switch components to be rendered in the ContentSwitcher
*/
children?: ReactElement<any>[];
/**
* Specify an optional className to be added to the container node
*/
className?: string;
/**
* `true` to use the light version.
*
* @deprecated The `light` prop for `ContentSwitcher` has
* been deprecated in favor of the new `Layer` component. It will be removed in the next major release.
*/
light?: boolean;
/**
* `true` to use the low contrast version.
*/
lowContrast?: boolean;
/**
* Specify an `onChange` handler that is called whenever the ContentSwitcher
* changes which item is selected
*/
onChange: (params: SwitchEventHandlersParams) => void;
/**
* Specify a selected index for the initially selected content
*/
selectedIndex: number;
/**
* Choose whether or not to automatically change selection on focus when left/right arrow pressed. Defaults to 'automatic'
*/
selectionMode?: 'automatic' | 'manual';
/**
* Specify the size of the Content Switcher. Currently supports either `sm`, `md` (default) or `lg` as an option.
*/
size: 'sm' | 'md' | 'lg';
}
export declare const ContentSwitcher: {
({ children, className, light, lowContrast, selectedIndex: selectedIndexProp, selectionMode, size, onChange, ...other }: ContentSwitcherProps): import("react/jsx-runtime").JSX.Element;
displayName: string;
propTypes: {
/**
* Pass in Switch components to be rendered in the ContentSwitcher
*/
children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
/**
* Specify an optional className to be added to the container node
*/
className: PropTypes.Requireable<string>;
/**
* `true` to use the light variant.
*/
light: (props: Record<string, any>, propName: string, componentName: string, ...rest: any[]) => any;
/**
* `true` to use the low contrast version.
*/
lowContrast: PropTypes.Requireable<boolean>;
/**
* Specify an `onChange` handler that is called whenever the ContentSwitcher
* changes which item is selected
*/
onChange: PropTypes.Validator<(...args: any[]) => any>;
/**
* Specify a selected index for the initially selected content
*/
selectedIndex: PropTypes.Requireable<number>;
/**
* Choose whether or not to automatically change selection on focus when left/right arrow pressed. Defaults to 'automatic'
*/
selectionMode: PropTypes.Requireable<string>;
/**
* Specify the size of the Content Switcher. Currently supports either `sm`, `md` (default) or `lg` as an option.
*/
size: PropTypes.Requireable<string>;
};
};