Chip

Chips prompt most actions in a UI

Known Limitations (Beta)

  • Edit mode starts after a 1s focus delay (no prop to customize).
Tableau des propriétés et de l'API du composant
Propriété Type Obligatoire Valeur par défaut Description Condition
label string Non The label is the text that is displayed on the chip.
variant ChipVariant Non outlined The chip variant determines the style.
disabled boolean Non false Disables the chip if set to true.
icon Icon Non An optional icon to display in the chip.
draggable boolean Non Enable native HTML drag and drop on the chip.
onDragStart (e: DragEvent<Element>) => void Non Called when drag starts (composed with internal handler that sets isDragging).
onDragEnd (e: DragEvent<Element>) => void Non Called when drag ends (composed with internal handler that clears isDragging).
editable boolean Non Enable label inline edition for this chip (used by Chips variant="input").
editing boolean Non Affirms that the chip is currently being edited.
onEditStart () => void Non Request to start editing (e.g., double-click, Enter/F2).
onEditCommit (nextLabel: string) => void Oui Commit edition with the new label.
onEditCancel () => void Non Cancel edition and restore previous label.
onChange (nextLabel: string) => void Non Fired on each edit keystroke when content changes (only while editing). Useful for live formatting, suggestions, validation, etc.