@coreui/react/dist/cjs/components/form/CChipInput.d.ts

UI Components Library for React.js

import React, { HTMLAttributes, ReactNode } from 'react';
type ChipClassName = string | ((value: string) => string);
export interface CChipInputProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'onInput' | 'onSelect'> {
    /**
     * Adds custom classes to the React Chip Input component root element.
     */
    className?: string;
    /**
     * Adds custom classes to chips rendered by the React Chip Input component. Accepts a static className or a resolver function based on chip value.
     */
    chipClassName?: ChipClassName;
    /**
     * Creates a new chip when the React Chip Input component loses focus with a pending value.
     */
    createOnBlur?: boolean;
    /**
     * Sets the initial uncontrolled values rendered by the React Chip Input component.
     */
    defaultValue?: string[];
    /**
     * Disables the React Chip Input component and prevents adding, removing, or selecting chips.
     */
    disabled?: boolean;
    /**
     * Sets the `id` of the internal text input rendered by the React Chip Input component.
     */
    id?: string;
    /**
     * Renders an inline label inside the React Chip Input component container.
     */
    label?: ReactNode;
    /**
     * Sets the maximum number of chips that can be created in the React Chip Input component.
     */
    maxChips?: number | null;
    /**
     * Sets the name of the hidden input used by the React Chip Input component for form submission.
     */
    name?: string;
    /**
     * Callback fired when the React Chip Input component adds a new chip.
     */
    onAdd?: (value: string) => void;
    /**
     * Callback fired when the value list of the React Chip Input component changes.
     */
    onChange?: (values: string[]) => void;
    /**
     * Callback fired when the internal text input value changes in the React Chip Input component.
     */
    onInput?: (value: string) => void;
    /**
     * Callback fired when the React Chip Input component removes a chip.
     */
    onRemove?: (value: string) => void;
    /**
     * Callback fired when the selected chip values change in the React Chip Input component.
     */
    onSelect?: (selected: string[]) => void;
    /**
     * Sets placeholder text for the internal input of the React Chip Input component.
     */
    placeholder?: string;
    /**
     * Makes the React Chip Input component readonly while keeping values visible.
     */
    readOnly?: boolean;
    /**
     * Displays remove buttons on chips managed by the React Chip Input component.
     */
    removable?: boolean;
    /**
     * Enables chip selection behavior in the React Chip Input component.
     */
    selectable?: boolean;
    /**
     * Sets the separator character used to create chips while typing or pasting in the React Chip Input component.
     */
    separator?: string | null;
    /**
     * Sets the size of the React Chip Input component to small or large.
     */
    size?: 'sm' | 'lg';
    /**
     * Controls the values rendered by the React Chip Input component.
     *
     * @controllable onChange
     */
    value?: string[];
}
export declare const CChipInput: React.ForwardRefExoticComponent<CChipInputProps & React.RefAttributes<HTMLDivElement>>;
export {};