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