UIChip

An chip component for presents selection and choices

Since: 6.5.0 (6.0.0)

Properties

Name	Type	Default	Description
value	string		Required - Value presented in chip
size	string	"normal"	Variations normal|large|small
type	string	"default"	Style for the chip. See Available types for variations
disabled	string	false	Set disabled state for the chip
avatarComponent	VirtualHTMLElement		UIAvatar component or other VirtualElement
thumbnail	VirtualHTMLElement		Deprecated. Use props avatarComponent instead
avatarUrl	string		Url to avatar
icon	string		FontAwesome 4 icon. Example fa-user
onRemoveBtnClick	function		Required - Callback function when clicking remove button
onSelectChange	function		Callback if we want to have select state

Example

import {UIChip} from 'writer'

render($$) {
    const el = $$('div')

    return el.append(
        $$(UIChip, {
            value: 'Author name',
            avatarUrl: 'https://image.png',
            onRemoveBtnClick: () => {}
        })
    )
}

Available types

The UIChip.props.type has following variations:

Name

default

primary

draft

alert

pending

warning

done

schedule

brand