beta-parity-react/ui/Chip/index.d.ts

Beta Parity React Components

import React from 'react';
import './index.css';
import './variables.css';
import { BaseProps } from '../Base';
declare const colorMap: Record<'neutral' | 'accent', string>;
declare const sizeMap: Record<'sm' | 'md' | 'lg', string>;
declare const kindMap: Record<'glass' | 'outlined', string>;
/**
 * Props for the Chip component.
 *
 * @extends {BaseProps}
 */
export interface ChipProps extends BaseProps {
    /**
     * The label of the chip, displaying text.
     *
     * @memberof ChipProps
     */
    label: string;
    /**
     * Optional icon to display in the chip, image is supported
     *
     * @memberof ChipProps
     */
    icon?: React.ReactNode;
    /**
     * The type of the chip, can be one of the keys from the typeMap.
     *
     * @default 'toggle'
     * @memberof ChipProps
     */
    type?: 'toggle' | 'dropdown';
    /**
     * The size of the chip, can be one of the keys from the sizeMap.
     *
     * @default 'md'
     * @memberof ChipProps
     */
    size?: keyof typeof sizeMap;
    /**
     * The kind of the chip, can be one of the keys from the kindMap.
     *
     * @default 'outline'
     * @memberof ChipProps
     */
    kind?: keyof typeof kindMap;
    /**
     * The color of the chip, can be one of the keys from the colorMap.
     *
     * @default 'neutral'
     * @memberof ChipProps
     */
    color?: keyof typeof colorMap;
    /**
     * The value of the chip, can be a string or number
     *
     * @memberof ChipProps
     */
    value?: string | number;
    /**
     * The checked state of the chip, it is usable in toggle type
     *
     * @memberof ChipProps
     */
    checked?: boolean;
    /**
     * The defaultChecked state of the chip (uncontrolled chip), it is usable in toggle type
     *
     * @memberof ChipProps
     */
    defaultChecked?: boolean;
    /**
     * The active state of the chip, it is usable in dropdown type
     *
     * @memberof ChipProps
     */
    isActive?: boolean;
    /**
     * Whether the chip is disabled.
     *
     * @memberof ChipProps
     */
    disabled?: boolean;
    /**
     * Callback when the state of the chip changes for chip with valued chip - toggle, dropdown
     *
     * @memberof ChipProps
     * @param {Object} args
     * @param {string | number} args.value - The value of the valued chip.
     * @param {boolean} [args.checked] - The checked state of the toggle chip.
     * @param {boolean} [args.active] - The active state of the dropdown chip.
     */
    onChange?: (args: {
        value: string | number;
        checked?: boolean;
        active?: boolean;
    }) => void;
    /**
     * Callback when the remove button is clicked. it is available for button chip
     *
     * @memberof ChipProps
     * @param {string | number} value - The value of the chip to be removed.
     */
    onRemove?: (value: string | number) => void;
}
/**
 * **Parity Chip** - A chip is a small block of content, such as a label or avatar, that is used to display related information or actions.
 *
 *  @see {@link https://beta-parity-react.vercel.app/chip Parity Chip}
 */
export declare const Chip: React.ForwardRefExoticComponent<ChipProps & Omit<React.AllHTMLAttributes<HTMLElement>, keyof ChipProps> & React.RefAttributes<HTMLElement>>;
export {};
//# sourceMappingURL=index.d.ts.map