@coreui/vue/dist/cjs/components/chip/CChip.d.ts

UI Components Library for Vue.js

import { type VNode } from 'vue';
declare const CChip: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
    /**
     * Toggle the active state for the component.
     */
    active: BooleanConstructor;
    /**
     * Provides an accessible label for the remove button.
     */
    ariaRemoveLabel: {
        type: StringConstructor;
        default: string;
    };
    /**
     * Component used for the root node. Either a string to use a HTML element or a component.
     */
    as: {
        type: StringConstructor;
        default: string;
    };
    /**
     * Enables interactive hover styling and pointer cursor.
     */
    clickable: BooleanConstructor;
    /**
     * Sets the color context of the component to one of CoreUI's themed colors.
     *
     * @values 'primary', 'secondary', 'success', 'danger', 'warning', 'info', 'dark', 'light'
     */
    color: {
        type: StringConstructor;
        validator: (value: string) => boolean;
    };
    /**
     * Toggle the disabled state for the component.
     *
     * Defaults to `undefined` so a chip can override the value inherited from a `CChipSet` (including turning it off).
     */
    disabled: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Turns the component into a filter chip. A filter chip is selectable and shows a leading check icon while selected.
     *
     * Defaults to `undefined` so a chip can override the value inherited from a `CChipSet`.
     */
    filter: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Displays a remove button inside the component.
     *
     * Defaults to `undefined` so a chip can override the value inherited from a `CChipSet` (including turning it off).
     */
    removable: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Replaces the default remove icon with a custom icon node.
     */
    removeIcon: {
        type: (StringConstructor | ObjectConstructor)[];
        default: undefined;
    };
    /**
     * Enables selectable behavior and keyboard toggle support.
     *
     * Defaults to `undefined` so a chip can override the value inherited from a `CChipSet`.
     */
    selectable: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Controls the selected state of a selectable component.
     */
    selected: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Replaces the default selected icon shown by a filter chip with a custom icon node.
     */
    selectedIcon: {
        type: (StringConstructor | ObjectConstructor)[];
        default: undefined;
    };
    /**
     * Size the component small or large.
     *
     * @values 'sm', 'lg'
     */
    size: {
        type: StringConstructor;
        validator: (value: string) => boolean;
    };
    /**
     * Sets the value associated with the component, used by `CChipSet` to track selection.
     */
    value: {
        type: StringConstructor;
        default: undefined;
    };
    /**
     * Set the button variant to an outlined style.
     *
     * @values 'outline'
     */
    variant: {
        type: StringConstructor;
        validator: (value: string) => value is "outline";
    };
}>, () => VNode<import("vue").RendererNode, import("vue").RendererElement, {
    [key: string]: any;
}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("select" | "click" | "keydown" | "deselect" | "remove" | "selected-change")[], "select" | "click" | "keydown" | "deselect" | "remove" | "selected-change", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
    /**
     * Toggle the active state for the component.
     */
    active: BooleanConstructor;
    /**
     * Provides an accessible label for the remove button.
     */
    ariaRemoveLabel: {
        type: StringConstructor;
        default: string;
    };
    /**
     * Component used for the root node. Either a string to use a HTML element or a component.
     */
    as: {
        type: StringConstructor;
        default: string;
    };
    /**
     * Enables interactive hover styling and pointer cursor.
     */
    clickable: BooleanConstructor;
    /**
     * Sets the color context of the component to one of CoreUI's themed colors.
     *
     * @values 'primary', 'secondary', 'success', 'danger', 'warning', 'info', 'dark', 'light'
     */
    color: {
        type: StringConstructor;
        validator: (value: string) => boolean;
    };
    /**
     * Toggle the disabled state for the component.
     *
     * Defaults to `undefined` so a chip can override the value inherited from a `CChipSet` (including turning it off).
     */
    disabled: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Turns the component into a filter chip. A filter chip is selectable and shows a leading check icon while selected.
     *
     * Defaults to `undefined` so a chip can override the value inherited from a `CChipSet`.
     */
    filter: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Displays a remove button inside the component.
     *
     * Defaults to `undefined` so a chip can override the value inherited from a `CChipSet` (including turning it off).
     */
    removable: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Replaces the default remove icon with a custom icon node.
     */
    removeIcon: {
        type: (StringConstructor | ObjectConstructor)[];
        default: undefined;
    };
    /**
     * Enables selectable behavior and keyboard toggle support.
     *
     * Defaults to `undefined` so a chip can override the value inherited from a `CChipSet`.
     */
    selectable: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Controls the selected state of a selectable component.
     */
    selected: {
        type: BooleanConstructor;
        default: undefined;
    };
    /**
     * Replaces the default selected icon shown by a filter chip with a custom icon node.
     */
    selectedIcon: {
        type: (StringConstructor | ObjectConstructor)[];
        default: undefined;
    };
    /**
     * Size the component small or large.
     *
     * @values 'sm', 'lg'
     */
    size: {
        type: StringConstructor;
        validator: (value: string) => boolean;
    };
    /**
     * Sets the value associated with the component, used by `CChipSet` to track selection.
     */
    value: {
        type: StringConstructor;
        default: undefined;
    };
    /**
     * Set the button variant to an outlined style.
     *
     * @values 'outline'
     */
    variant: {
        type: StringConstructor;
        validator: (value: string) => value is "outline";
    };
}>> & Readonly<{
    onSelect?: ((...args: any[]) => any) | undefined;
    onClick?: ((...args: any[]) => any) | undefined;
    onKeydown?: ((...args: any[]) => any) | undefined;
    onRemove?: ((...args: any[]) => any) | undefined;
    onDeselect?: ((...args: any[]) => any) | undefined;
    "onSelected-change"?: ((...args: any[]) => any) | undefined;
}>, {
    filter: boolean;
    value: string;
    disabled: boolean;
    as: string;
    active: boolean;
    selected: boolean;
    clickable: boolean;
    ariaRemoveLabel: string;
    removable: boolean;
    removeIcon: string | Record<string, any>;
    selectable: boolean;
    selectedIcon: string | Record<string, any>;
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
export { CChip };