ChipListProps
Represents the properties of ChipList component.
Definition
Package:@progress/kendo-vue-buttons
Properties
ariaDescribedBy?
string
Identifies the element(s) which will describe the component, similar to HTML aria-describedby attribute. For example these elements could contain error or hint message.
ariaLabelledBy?
string
Identifies the element(s) which will label the component.
avatar?
string | Object | Function
If set to object of type ChipAvatarProps with image and imageAlt it renders a default Avatar. If set to string or a render function it
defines the avatar template that will be shown.
avatarField?
object
Represents the 'avatar' field in the Chip, defaults to 'avatar'.
chip?
any
Represents Chip component.
className?
string
Sets additional classes to the ChipList.
dataItem?
any
Represents the item data, coming from the ChipList component.
dataItems?
any
Represents the data about the child Chips.
defaultDataItems?
any[]
Represents the default data about the child Chips.
Represents the default value of the selection state of Chip component.
dir?
string
The ChipList direction 'ltr' as default or 'rtl'.
disabled?
boolean
Determines of ChipList is disabled.
fillMode?
"solid" | "outline" | "flat"
Configures the fillMode of the Chip.
The available options are:
- solid
- outline
- flat
undefined
icon?
string
Determines if the Chip has an icon.
id?
string
Sets the id property of the top div element of the ChipList.
name?
string
Specifies the name property of the input DOM element.
onBlur?
(event: ChipFocusEvent) => void
Triggered on onBlur event.
onChange?
(event: ChipListChangeEvent) => void
Triggered after value change.
onClick?
(event: ChipMouseEvent) => void
Triggered on onClick event.
onDatachange?
(event: ChipListDataChangeEvent) => void
Triggered after Chip data change.
onFocus?
(event: ChipFocusEvent) => void
Triggered on onFocus event.
onKeydown?
(event: ChipKeyboardEvent) => void
Triggered on onKeyDown event.
onRemove?
(event: ChipRemoveEvent) => void
Triggered on Chip removing.
removable?
boolean
Determines if the Chip could be removed.
removeIcon?
string
Determines if the Chip has custom removeIcon.
removeSvgIcon?
SVGIcon
Defines an remove SVGIcon to be rendered within the chip.
required?
boolean
Specifies if null is a valid value for the component.
rounded?
"small" | "medium" | "large" | "none" | "full"
Configures the roundness of the Chip.
The available options are:
- none
- small
- medium
- large
- full
undefined
selected?
boolean
Determines if the Chip is selected.
selectedIcon?
string
Determines if the Chip has custom selection icon.
selectedSvgIcon?
SVGIcon
Defines an selection SVGIcon to be rendered within the chip.
selection?
string
Represents the selection state of Chip component.
size?
"small" | "medium" | "large"
Configures the size of the Chip.
The available options are:
- small
- medium
- large
undefined
svgIcon?
SVGIcon
Defines an SVGIcon to be rendered within the chip.
tabIndex?
number
Sets the tabIndex attribute.
text?
string
Sets the label text of the Chip.
textField?
string
Represents the text field of Chip, defaults to 'text'.
themeColor?
"base" | "info" | "success" | "warning" | "error"
Configures the themeColor of the Chip.
The available options are:
- base
- info
- success
- warning
- error
undefined
valid?
boolean
Overrides the validity state of the component.
If valid is set, the required property will be ignored.
validationMessage?
string
Controls the form error message of the component. If set to an empty string, no error will be thrown.
validityStyles?
boolean
If set to false, no visual representation of the invalid state of the component will be applied.
value?
any
Represents the selection state of Chip component.
valueField?
string
Represents the value field of the Chip, defaults to 'value'.