@snack-uikit/chips v0.14.0

Chips

Installation

npm i @snack-uikit/chips

Changelog

TODO

• droplist и выбор значений в FilterChip

Example

import { ChipAssist, ChipChoice, ChipToggle } from '@snack-uikit/chips';
import { PlaceholderSVG } from '@snack-uikit/icons';

<ChipAssist
  label='Label'
  icon={<PlaceholderSVG />}
  size='s'
  disabled={false}
  loading={false}
  onClick={doSomething}
  className='className'
  tabIndex={1}
/>

<ChipToggle
  label='Label'
  icon={<PlaceholderSVG />}
  size='s'
  selected={false}
  disabled={false}
  loading={false}
  onChange={handleChange}
  className='className'
  tabIndex={1}
/>

<ChipChoice.Single
  label='Label'
  value='value'
  icon={<PlaceholderSVG />}
  size='s'
  disabled={false}
  loading={false}
  options={[]}
  onClick={doSomething}
/>

<ChipChoice.Multi
  label='Label'
  value={['value1', 'value2']}
  onChangeValue={onChange}
  size='m'
  options={[]}
  valueFormatter={formatter}
/>

<ChipChoice.Date
  label='Label'
  value={new Date()}
  onChangeValue={onChange}
  size='m'
  valueFormatter={formatter}
/>

<ChipChoice.DateRange
  label='Label'
  value={[new Date(), new Date()]}
  onChangeValue={onChange}
  size='m'
  valueFormatter={formatter}
/>

<ChipChoice.Custom
  label='Label'
  value='value'
  valueToRender='Selected'
  size='m'
/>

ChipAssist

Чип с лейблом

Props

ChipToggle

Чип с состоянием выбран/не выбран

Props

ChipChoice.Custom

Props

ChipChoice.Single

Props

ChipChoice.Multiple

Props

ChipChoice.Date

Props

ChipChoice.DateRange

Props

isAccordionOption

Props

isBaseOption

Props

isGroupOption

Props

isGroupSelectOption

Props

isNextListOption

Props

ChipChoiceRow

Props