@coreui/react-pro
Version:
UI Components Library for React.js
74 lines (73 loc) • 2.81 kB
TypeScript
import { ElementType, HTMLAttributes, ReactNode } from 'react';
import { type CChipSetItem } from './useChipSet';
import { PolymorphicRefForwardingComponent } from '../../helpers';
export type { CChipSetItem };
export interface CChipSetProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onSelect'> {
/**
* Provides an accessible label for the remove button of every chip rendered by the React Chip Set component.
*/
ariaRemoveLabel?: string;
/**
* Specifies the root element or custom component used by the React Chip Set component.
*/
as?: ElementType;
/**
* Renders chips from data instead of children. Each item is a string or an object with a `value`, an optional `label`, and any `CChip` props. Children are used when this is omitted.
*/
chips?: (string | CChipSetItem)[];
/**
* Adds custom classes to the React Chip Set root element.
*/
className?: string;
/**
* Sets the initial uncontrolled chips. In this mode the React Chip Set component owns the list and removes chips itself; use `chips` (with `onRemove`) for a controlled list.
*/
defaultChips?: (string | CChipSetItem)[];
/**
* Sets the initial uncontrolled selection of the React Chip Set component.
*/
defaultSelected?: string[];
/**
* Disables every chip rendered by the React Chip Set component.
*/
disabled?: boolean;
/**
* Turns the chips into filter chips, each showing a leading check icon while selected.
*/
filter?: boolean;
/**
* Callback fired when a chip requests removal. The chips are controlled by their rendered children, so remove the chip from your data in response.
*/
onRemove?: (value: string) => void;
/**
* Callback fired when the selected chip values of the React Chip Set component change.
*/
onSelect?: (selected: string[]) => void;
/**
* Displays a remove button on every chip rendered by the React Chip Set component.
*/
removable?: boolean;
/**
* Replaces the default remove icon on every chip with a custom icon node.
*/
removeIcon?: ReactNode;
/**
* Enables selection behavior for the chips rendered by the React Chip Set component.
*/
selectable?: boolean;
/**
* Controls the selected chip values of the React Chip Set component.
*
* @controllable onSelect
*/
selected?: string[];
/**
* Replaces the default selected icon shown by filter chips with a custom icon node.
*/
selectedIcon?: ReactNode;
/**
* Sets how many chips can be selected at once in the React Chip Set component.
*/
selectionMode?: 'single' | 'multiple';
}
export declare const CChipSet: PolymorphicRefForwardingComponent<'div', CChipSetProps>;