ChipProps
Represents the properties of Chip component.
Definition
Package:@progress/kendo-react-buttons
Properties
ariaDescribedBy?
string
Identifies the element(s) which describe the component, similar to an HTML aria-describedby attribute. For example, these elements could contain an error or a hint message.
ariaLabel?
string
Represents the label of the Chip component.
ariaSelected?
boolean
Sets the aria-selected attribute on the Chip.
When provided, overrides the internally computed selected state for the ARIA attribute.
Only applies when role is "option".
Determines if the Chip has an avatar.
children?
ReactNode
The React elements that will be rendered as custom content inside the Chip.
className?
string
Sets additional classes to the Chip.
dataItem?
any
Represents the item data, coming from the ChipList component.
dir?
string
The Chip direction 'ltr' as default or 'rtl'.
disabled?
boolean
Determines if the Chip is disabled.
fillMode?
"solid" | "outline"
Configures the fillMode of the Chip.
The available options are:
solidoutline
undefined (theme-controlled)
icon?
string
Determines if the Chip has a font icon.
id?
string
Sets the id property of the top div element of the Chip.
onBlur?
(event: ChipFocusEvent) => void
Fires on onBlur event.
onClick?
(event: ChipMouseEvent) => void
Fires on onClick event.
onDoubleClick?
(event: ChipMouseEvent) => void
Fires on onDoubleClick event.
onFocus?
(event: ChipFocusEvent) => void
Fires on onFocus event.
onKeyDown?
(event: ChipKeyboardEvent) => void
Fires on onKeyDown event.
onMouseDown?
(event: ChipMouseEvent) => void
Fires on onMouseDown event.
onMouseEnter?
(event: ChipMouseEvent) => void
Fires on onMouseEnter event.
onMouseLeave?
(event: ChipMouseEvent) => void
Fires on onMouseLeave event.
onMouseMove?
(event: ChipMouseEvent) => void
Fires on onMouseMove event.
onMouseOut?
(event: ChipMouseEvent) => void
Fires on onMouseOut event.
onMouseOver?
(event: ChipMouseEvent) => void
Fires on onMouseOver event.
onMouseUp?
(event: ChipMouseEvent) => void
Fires on onMouseUp event.
onRemove?
(event: ChipRemoveEvent) => void
Fires on Chip removing.
removable?
boolean
Determines if the Chip could be removed.
removeIcon?
string
Determines if the Chip has custom font removeIcon.
removeSvgIcon?
SVGIcon
Determines if the Chip has custom SVG removeIcon.
rounded?
"small" | "medium" | "large" | "full" | "none"
Configures the roundness of the Chip.
The available options are:
smallmediumlargefullnone
undefined (theme-controlled)
selected?
boolean
Determines if the Chip is selected.
selectedIcon?
string
Determines if the Chip has custom selection font icon.
selectedSvgIcon?
SVGIcon
Determines if the Chip has custom selection SVG icon.
size?
"small" | "medium" | "large"
Configures the size of the Chip.
The available options are:
smallmediumlarge
undefined (theme-controlled)
style?
CSSProperties
Sets additional CSS styles to the Chip.
svgIcon?
SVGIcon
Determines if the Chip has an SVG icon.
tabIndex?
number
Sets the tabIndex attribute.
text?
string
Sets the label text of the Chip.
themeColor?
"base" | "info" | "success" | "warning" | "error"
Configures the themeColor of the Chip.
The available options are:
baseinfosuccesswarningerror
undefined (theme-controlled)
value?
any
Sets the id value of the Chip.