0.13.0 (2020-04-20)

Bug Fixes

• configs: use transform-runtime in cjs (#372) (bbbdb15)

0.18.0 (2020-04-20)

Features

• component: adds Counter component to bigdesign (#371) (cff133e)

0.10.0 (2020-04-20)

Bug Fixes

• icons: contained aria-labelledby when title prop was undefined (#374) (f0d4df7)

0.8.0 (2020-04-20)

Note: Version bump only for package @bigcommerce/big-design-theme

0.4.2 (2020-04-13)

Note: Version bump only for package @bigcommerce/examples

0.17.2 (2020-04-13)

Bug Fixes

• add extra options for maxHeight examples and set up tests (#367) (05f6aca)
• autocomplete=no only set for Selects (#362) (ace0bf4)
• render new options for Selects when option prop changes (#366) (72f066c)
• component: expose FormProps (#369) (358f25f)
• component: modal focus first focusable element (#365) (2c240a5)

Features

• component: CHP-6188 adds grouping options to Select component (#350) (16a8dd7)
• component: CHP-6225 adds ability to hide individual table headers (#359) (b61b486)

0.17.2 (2020-04-13)

Bug Fixes

• add extra options for maxHeight examples and set up tests (#367) (05f6aca)

Features

• component: CHP-6188 adds grouping options to Select component (#350) (16a8dd7)
• component: CHP-6225 adds ability to hide individual table headers (#359) (b61b486)
• docs: add og:image for link preview (#360) (31bc780)

0.17.1 (2020-03-25)

Note: Version bump only for package @bigcommerce/docs

0.17.1 (2020-03-25)

Bug Fixes

• component: pagination avoid page 0 (#354) (ace346b)

0.4.1 (2020-03-25)

Note: Version bump only for package @bigcommerce/examples

0.17.0 (2020-03-25)

Features

• component: add description attribute for Checkbox (#349) (9a9eeb4)
• component: add description attribute for Radio (#345) (42365e9)
• component: stateful table sortFn (#353) (3a715a3)

0.7.0 (2020-03-25)

Note: Version bump only for package @bigcommerce/big-design-theme

0.12.0 (2020-03-25)

Features

• component: stateful table sortFn (#353) (3a715a3)

0.17.0 (2020-03-25)

Bug Fixes

• component: compute selectedItems on StatefulTable when items change (#351) (b5b736b)

Features

• component: add description attribute for Checkbox (#349) (9a9eeb4)
• component: add description attribute for Radio (#345) (42365e9)
• component: allow null errors on Select and MultiSelect (7112dd3)
• component: button and input icon props accept null (e624879)
• component: stateful table sortFn (#353) (3a715a3)

0.4.0 (2020-03-25)

Note: Version bump only for package @bigcommerce/examples

0.9.0 (2020-03-25)

Note: Version bump only for package @bigcommerce/big-design-icons

0.11.0 (2020-02-21)

Note: Version bump only for package @bigcommerce/configs

0.8.0 (2020-02-21)

Features

• component: add Alerts, InlineAlerts, and Message components (#340) (d541276)

0.16.0 (2020-02-21)

Bug Fixes

• component: proper panel action button width (#342) (e53400d)

Features

• component: add Alerts, InlineAlerts, and Message components (#340) (d541276)
• component: bump scroll-into-view-if-needed and use auto behavior (#334) (5bb0fdf)
• component: convert Dropdown/Select to FC and add MultiSelect (#303) (0ab0e50)
• component: ensure Badge label prop is of type string (#341) (a9b6847)
• component: restrict badges to use label props and style fixes (#339) (a8af2f2)

BREAKING CHANGES

• component: Selects and Multiselects have been split into its own component. Props changed for Dropdowns & Selects.

** Dropdown **

Old:

<Dropdown
    maxHeight={250}
    options={[
        { content: 'Edit', onClick: item => item, icon: <EditIcon />, value: 'edit' },
        {
        content: 'Duplicate',
        onClick: item => item,
        value: 'duplicate',
        icon: <FileCopyIcon />,
        },
        {
        content: 'Copy',
        onClick: item => item,
        value: 'copy',
        icon: <AssignmentIcon />,
        disabled: true,
        tooltip: 'You cannot copy this item...',
        },
        {
        content: 'Delete',
        onClick: item => item,
        value: 'delete',
        icon: <DeleteIcon />,
        actionType: 'destructive',
        },
        {
        content: 'Link',
        icon: <OpenInNewIcon />,
        type: 'link',
        url: '#',
        },
    ]}
    placement="bottom-start"
    trigger={<Button>Open Menu</Button>}
/>

New:

<Dropdown
    maxHeight={250}
    items={[
        { content: 'Edit', onItemClick: item => item, hash: 'edit', icon: <EditIcon /> },
        {
        content: 'Duplicate',
        onItemClick: item => item,
        hash: 'duplicate',
        icon: <FileCopyIcon />,
        },
        {
        content: 'Copy',
        onItemClick: item => item,
        hash: 'copy',
        icon: <AssignmentIcon />,
        disabled: true,
        tooltip: 'You cannot copy this item...',
        },
        {
        content: 'Delete',
        onItemClick: item => item,
        hash: 'delete',
        icon: <DeleteIcon />,
        actionType: 'destructive',
        },
        {
        content: 'Link',
        icon: <OpenInNewIcon />,
        type: 'link',
        url: '#',
        },
    ]}
    placement="bottom-start"
    toggle={<Button>Open Menu</Button>}
/>

** Select **

Old:

<Select
    action={{
        actionType: 'destructive',
        content: 'Remove Country',
        icon: <DeleteIcon />,
        onClick: () => null,
    }}
    label="Countries"
    maxHeight={300}
    onChange={handleChange}
    options={[
        { value: 'us', content: 'United States' },
        { value: 'mx', content: 'Mexico' },
        { value: 'ca', content: 'Canada' },
        { value: 'ru', content: 'Russia', disabled: true },
    ]}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
/>

New:

<Select
    action={{
        actionType: 'destructive',
        content: 'Remove Country',
        icon: <DeleteIcon />,
        onActionClick: () => null,
    }}
    label="Countries"
    maxHeight={300}
    onOptionChange={handleChange}
    options={[
        { value: 'us', content: 'United States' },
        { value: 'mx', content: 'Mexico' },
        { value: 'ca', content: 'Canada' },
        { value: 'ru', content: 'Russia', disabled: true },
    ]}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
/>

** MultiSelect **

Old:

<Select
    action={{
        actionType: 'destructive',
        content: 'Remove Country',
        icon: <DeleteIcon />,
        onClick: () => null,
    }}
    label="Countries"
    maxHeight={300}
    multi={true}
    onChange={handleChange}
    options={[
        { value: 'us', content: 'United States' },
        { value: 'mx', content: 'Mexico' },
        { value: 'ca', content: 'Canada' },
        { value: 'ru', content: 'Russia', disabled: true },
    ]}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
/>

New:

<MultiSelect
    action={{
        actionType: 'destructive' as 'destructive',
        content: 'Remove Country',
        icon: <DeleteIcon />,
        onActionClick: () => null,
    }}
    filterable={true}
    label="Countries"
    maxHeight={300}
    onOptionsChange={handleChange}
    options={[
        { value: 'us', content: 'United States' },
        { value: 'mx', content: 'Mexico' },
        { value: 'ca', content: 'Canada' },
        { value: 'ru', content: 'England' },
    ]}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
/>

• component: Convert <Badge>label</Badge> to <Badge label="label" />.

0.3.0 (2020-02-21)

Bug Fixes

• examples: fix usage and add ci step (#337) (9ade663)
• examples: remove danling comma (#338) (e136b7f)

Features

• component: convert Dropdown/Select to FC and add MultiSelect (#303) (0ab0e50)

BREAKING CHANGES

• component: Selects and Multiselects have been split into its own component. Props changed for Dropdowns & Selects.

** Dropdown **

Old:

<Dropdown
    maxHeight={250}
    options={[
        { content: 'Edit', onClick: item => item, icon: <EditIcon />, value: 'edit' },
        {
        content: 'Duplicate',
        onClick: item => item,
        value: 'duplicate',
        icon: <FileCopyIcon />,
        },
        {
        content: 'Copy',
        onClick: item => item,
        value: 'copy',
        icon: <AssignmentIcon />,
        disabled: true,
        tooltip: 'You cannot copy this item...',
        },
        {
        content: 'Delete',
        onClick: item => item,
        value: 'delete',
        icon: <DeleteIcon />,
        actionType: 'destructive',
        },
        {
        content: 'Link',
        icon: <OpenInNewIcon />,
        type: 'link',
        url: '#',
        },
    ]}
    placement="bottom-start"
    trigger={<Button>Open Menu</Button>}
/>

New:

<Dropdown
    maxHeight={250}
    items={[
        { content: 'Edit', onItemClick: item => item, hash: 'edit', icon: <EditIcon /> },
        {
        content: 'Duplicate',
        onItemClick: item => item,
        hash: 'duplicate',
        icon: <FileCopyIcon />,
        },
        {
        content: 'Copy',
        onItemClick: item => item,
        hash: 'copy',
        icon: <AssignmentIcon />,
        disabled: true,
        tooltip: 'You cannot copy this item...',
        },
        {
        content: 'Delete',
        onItemClick: item => item,
        hash: 'delete',
        icon: <DeleteIcon />,
        actionType: 'destructive',
        },
        {
        content: 'Link',
        icon: <OpenInNewIcon />,
        type: 'link',
        url: '#',
        },
    ]}
    placement="bottom-start"
    toggle={<Button>Open Menu</Button>}
/>

** Select **

Old:

<Select
    action={{
        actionType: 'destructive',
        content: 'Remove Country',
        icon: <DeleteIcon />,
        onClick: () => null,
    }}
    label="Countries"
    maxHeight={300}
    onChange={handleChange}
    options={[
        { value: 'us', content: 'United States' },
        { value: 'mx', content: 'Mexico' },
        { value: 'ca', content: 'Canada' },
        { value: 'ru', content: 'Russia', disabled: true },
    ]}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
/>

New:

<Select
    action={{
        actionType: 'destructive',
        content: 'Remove Country',
        icon: <DeleteIcon />,
        onActionClick: () => null,
    }}
    label="Countries"
    maxHeight={300}
    onOptionChange={handleChange}
    options={[
        { value: 'us', content: 'United States' },
        { value: 'mx', content: 'Mexico' },
        { value: 'ca', content: 'Canada' },
        { value: 'ru', content: 'Russia', disabled: true },
    ]}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
/>

** MultiSelect **

Old:

<Select
    action={{
        actionType: 'destructive',
        content: 'Remove Country',
        icon: <DeleteIcon />,
        onClick: () => null,
    }}
    label="Countries"
    maxHeight={300}
    multi={true}
    onChange={handleChange}
    options={[
        { value: 'us', content: 'United States' },
        { value: 'mx', content: 'Mexico' },
        { value: 'ca', content: 'Canada' },
        { value: 'ru', content: 'Russia', disabled: true },
    ]}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
/>

New:

<MultiSelect
    action={{
        actionType: 'destructive' as 'destructive',
        content: 'Remove Country',
        icon: <DeleteIcon />,
        onActionClick: () => null,
    }}
    filterable={true}
    label="Countries"
    maxHeight={300}
    onOptionsChange={handleChange}
    options={[
        { value: 'us', content: 'United States' },
        { value: 'mx', content: 'Mexico' },
        { value: 'ca', content: 'Canada' },
        { value: 'ru', content: 'England' },
    ]}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
/>