Skip to main content

    Chip

    Use the Chip component to present a piece of information in a compact form.

    ChipProps

    Signature:

    export declare type ChipProps<E extends > = <E, >;

    ChipOwnProps

    extends, , , , ,
    NameTypeDefaultDescription
    color?
    | | | |
    'neutral'

    The color of the component. This should be chosen based on the context it's used in.

    variant?
    |
    'emphasized'

    Variant defining the visual representation of the component.

    disabled?
    false

    Whether the component is disabled. If true, it cannot be interacted with.

    size?
    |
    'default'

    The size of the component.

    Chip.Prefix, Chip.Suffix

    ChipContentProps

    extends,
    NameTypeDefaultDescription
    children

    Elements to be displayed in the prefix or suffix slot.

    Chip.Key

    ChipKeyProps

    Signature:

    export declare type ChipKeyProps = & & ;

    Chip.DeleteButton

    ChipDeleteButtonProps

    extends, , ,
    NameTypeDefaultDescription
    disabled?
    false

    If a button is disabled e.g. it cannot be interacted with. By default, it inherits the disabled prop of the Chip, but can be overwritten.

    onClick?

    Called when the button is interacted with.

    Still have questions?
    Find answers in the Dynatrace Community