0.13.1 (2019-11-12)

Bug Fixes

• component: allow 0 as values in selects (#257) (92c6238)
• component: table header right alignment (#256) (1d91e4f)
• component: textarea was missing optional text when not required (721891c)

Features

• all: better tree shaking (c0998a7)

0.8.1 (2019-11-12)

Features

• all: better tree shaking (c0998a7)

0.8.0 (2019-11-11)

Note: Version bump only for package @bigcommerce/configs

0.13.0 (2019-11-11)

Bug Fixes

• adds name prop to select (#229) (91a7abe)
• component: grid and flex forward as prop (fce3c26)
• component: reduce radio/checkbox label margin (#247) (08caa05)
• component: table header not aligning properly (#231) (542cb64)

Features

• all: bump styled-components peerDependency version (fd89fa3)
• component: add display prop to utility components (c5192b9)
• component: add external prop to link component (2acee91)
• component: add fullWidth prop to Form (#246) (b87fc4b)
• component: add stickiness to table header and actions (17e3c57)
• component: add text modifiers to typography (#240) (f64c4b4)
• component: allow Box to render with a different tag (#242) (a933b45)
• component: rename onChange to onItemChange (#251) (7e609d8)
• component: stateful table (#230) (1318bfd)
• component: tooltip for dropdown item (#228) (4e5fc50)
• CHI-696 select component accepts an inputRef prop (#233) (847e8ef)

BREAKING CHANGES

• component: onChange is renamed to onItemChange
• all: bumped peer dependency of styled-components to ^4.3.0
• component: <Table /> no longer accepts Margin props.

0.13.0 (2019-11-11)

Bug Fixes

• docs: checkbox page typo (#250) (f073be5)
• docs: opening links in new tab (e6fce3e)
• docs: remove duplicate headings (#249) (a1d41df)

Features

• all: bump styled-components peerDependency version (fd89fa3)
• component: add display prop to utility components (c5192b9)
• component: add external prop to link component (2acee91)
• component: add fullWidth prop to Form (#246) (b87fc4b)
• component: add stickiness to table header and actions (17e3c57)
• component: add text modifiers to typography (#240) (f64c4b4)
• component: allow Box to render with a different tag (#242) (a933b45)
• component: rename onChange to onItemChange (#251) (7e609d8)
• component: stateful table (#230) (1318bfd)
• component: tooltip for dropdown item (#228) (4e5fc50)
• CHI-696 select component accepts an inputRef prop (#233) (847e8ef)
• docs: make more fields required on Form page (#248) (3a3b037)
• docs: split table docs (#232) (823022a)

BREAKING CHANGES

• component: onChange is renamed to onItemChange
• all: bumped peer dependency of styled-components to ^4.3.0
• component: <Table /> no longer accepts Margin props.

0.5.0 (2019-11-11)

Features

• all: bump styled-components peerDependency version (fd89fa3)

BREAKING CHANGES

• all: bumped peer dependency of styled-components to ^4.3.0

0.3.0 (2019-11-11)

Features

• all: bump styled-components peerDependency version (fd89fa3)
• component: tooltip for dropdown item (#228) (4e5fc50)

BREAKING CHANGES

• all: bumped peer dependency of styled-components to ^4.3.0

0.2.0 (2019-10-29)

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

0.12.0 (2019-10-29)

• Restrict Dropdown (#212) (8608609), closes #212

Bug Fixes

• component: pagination mobile styles (59cbfe3)

Features

• component: add filterable prop to Select (#227) (f05d343)
• component: add header and action props to Panel (8a90002)
• component: add multiselect (#200) (02acf73)
• component: add optional text to non required inputs (#208) (463e99f)
• component: add sort functionality to Table component (2d30461)
• component: allow state override of table select all checkbox (#224) (b64eda1)
• component: convert Button component to FC (#221) (90759d6)
• component: restrict actions and header from modals (#209) (bc85d25)
• component: restrict Select (#218) (66378ed)
• component: rework Table component (11389b9)
• component: table multi-page select (#225) (00140ab)
• component: update Tabs component to be more restrictive (683d768)

BREAKING CHANGES

• component: Select now accepts an array of Options and an Action object. Will call onChange when option is selected with the chosen value and option as arguments. For more details see the usage examples in our docs.

Old:

<Select
    label="Countries"
    maxHeight={300}
    onActionClick={() => null}
    onItemChange={handleChange}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
>
    <Select.Option value="us">United States</Select.Option>
    <Select.Option value="mx">Mexico</Select.Option>
    <Select.Option value="ca">Canada</Select.Option>
    <Select.Option value="ru" disabled>Russia</Select.Option>
    <Select.Action>Action</Select.Action>
</Select>

New:

<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}
/>

• component: Tabs now accepts an items prop to render tab items and omits children from being rendered.

Old:

<Tabs>
  <Tabs.Tab id="tab1">Tab 1</Tabs.Tab>
  {/* ... */}
</Tabs>

New:

<Tabs activeTab="tab1" items={[{ id: 'tab1', title: 'Tab 1' }]} onTabClick={() => {}} />

• component: Table component no longer exposes Actions, Head, Row, Body, Cell
  statics. Check out the updated Table
  docs for a more
  detailed usage.
• Dropdown now accepts an array of DropdownItems & DropdownItemLinks as options.

Old:

<Dropdown onItemClick={onClick} trigger={<Button>Button</Button>}>
  <Dropdown.Item value={0}>Option</Dropdown.Item>
  <Dropdown.Item value={1}>Option</Dropdown.Item>
  <Dropdown.Item value={2}>Option</Dropdown.Item>
</Dropdown>

New:

<Dropdown
  options={[
    { content: 'Option', value: 0, onClick },
    { content: 'Option', value: 1, onClick },
    { content: 'Option', value: 2, onClick, actionType: 'destructive' },
    { content: 'Option', value: 3, onClick, icon: <CheckCircleIcon /> },
  ]}
  trigger={<Button>Button</Button>}/>

• component: Modal is now restricted and uses a header and actions props instead.

Old:

<Modal isOpen={isOpen}>
  <Modal.Header>Modal Title</Modal.Header>
  <Modal.Body>
    <Text>Body content.</Text>
  </Modal.Body>
  <Modal.Actions>
    <Button variant="subtle" onClick={() => setIsOpen(false)}>
       Cancel
     </Button>
  </Modal.Actions>
</Modal>

New:

<Modal 
  actions={[{text: 'Cancel', variant: 'subtle', onClick: () => setIsOpen(false)}]}
  isOpen={isOpen} 
  header="Modal Title">
  <Text>Body content.</Text>
</Modal>

0.4.0 (2019-10-29)

Features

• icons: add ArrowDownward and ArrowUpward icons (c34203f)

0.7.0 (2019-10-29)

Bug Fixes

• configs: build cjs and es on dev mode (498606f)

0.12.0 (2019-10-29)

• Restrict Dropdown (#212) (8608609), closes #212

Bug Fixes

• docs: logo overflowing into side nav (9237d31)
• docs: remove 'test' label from prop tables (#211) (312a5b1)

Features

• component: add filterable prop to Select (#227) (f05d343)
• component: add multiselect (#200) (02acf73)
• component: add sort functionality to Table component (2d30461)
• component: allow state override of table select all checkbox (#224) (b64eda1)
• component: restrict actions and header from modals (#209) (bc85d25)
• component: restrict Select (#218) (66378ed)
• component: update Tabs component to be more restrictive (683d768)
• docs: add figma UI kit and sample app to resources section (#206) (bb07411)
• docs: add helpful links section (217b040)
• docs: add Table docs + refactor PropsTable (dce179a)
• docs: add title and collapsible props to PropTable (81fe57a)
• docs: update logo with text (#215) (9062d49)
• docs: update Panel docs (b744b0b)

BREAKING CHANGES

• component: Select now accepts an array of Options and an Action object. Will call onChange when option is selected with the chosen value and option as arguments. For more details see the usage examples in our docs.

Old:

<Select
    label="Countries"
    maxHeight={300}
    onActionClick={() => null}
    onItemChange={handleChange}
    placeholder={'Choose country'}
    placement={'bottom-start'}
    required
    value={value}
>
    <Select.Option value="us">United States</Select.Option>
    <Select.Option value="mx">Mexico</Select.Option>
    <Select.Option value="ca">Canada</Select.Option>
    <Select.Option value="ru" disabled>Russia</Select.Option>
    <Select.Action>Action</Select.Action>
</Select>

New:

<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}
/>

• component: Tabs now accepts an items prop to render tab items and omits children from being rendered.

Old:

<Tabs>
  <Tabs.Tab id="tab1">Tab 1</Tabs.Tab>
  {/* ... */}
</Tabs>

New:

<Tabs activeTab="tab1" items={[{ id: 'tab1', title: 'Tab 1' }]} onTabClick={() => {}} />

• Dropdown now accepts an array of DropdownItems & DropdownItemLinks as options.

Old:

<Dropdown onItemClick={onClick} trigger={<Button>Button</Button>}>
  <Dropdown.Item value={0}>Option</Dropdown.Item>
  <Dropdown.Item value={1}>Option</Dropdown.Item>
  <Dropdown.Item value={2}>Option</Dropdown.Item>
</Dropdown>

New:

<Dropdown
  options={[
    { content: 'Option', value: 0, onClick },
    { content: 'Option', value: 1, onClick },
    { content: 'Option', value: 2, onClick, actionType: 'destructive' },
    { content: 'Option', value: 3, onClick, icon: <CheckCircleIcon /> },
  ]}
  trigger={<Button>Button</Button>}/>

• component: Modal is now restricted and uses a header and actions props instead.

Old:

<Modal isOpen={isOpen}>
  <Modal.Header>Modal Title</Modal.Header>
  <Modal.Body>
    <Text>Body content.</Text>
  </Modal.Body>
  <Modal.Actions>
    <Button variant="subtle" onClick={() => setIsOpen(false)}>
       Cancel
     </Button>
  </Modal.Actions>
</Modal>

New:

<Modal 
  actions={[{text: 'Cancel', variant: 'subtle', onClick: () => setIsOpen(false)}]}
  isOpen={isOpen} 
  header="Modal Title">
  <Text>Body content.</Text>
</Modal>

0.11.1 (2019-09-24)

Note: Version bump only for package @bigcommerce/docs

0.11.1 (2019-09-24)

Bug Fixes

• component: fix children not rendering via filter (#204) (26dbb78)

0.11.0 (2019-09-23)

Features

• component: add Table component (#201) (64b7dcd)

0.11.0 (2019-09-23)

Features

• component: add Table component (#201) (64b7dcd)

0.10.0 (2019-09-23)

Bug Fixes

• docs: fix pagination docs example (#198) (d362242)
• docs: temporarily remove design guideline navigation link (#199) (836abec)

Features

• component: add indeterminate state to checkboxes (#197) (5146fdb)
• docs: end sentences with dots on pagination props (b9effd4)

0.10.0 (2019-09-23)

Bug Fixes

• component: mock popper.js globally (8a31391)

Features

• component: add indeterminate state to checkboxes (#197) (5146fdb)

0.3.0 (2019-09-23)

Features

• component: add indeterminate state to checkboxes (#197) (5146fdb)

0.9.0 (2019-09-17)

Bug Fixes

• updates the input label if a matching children appears (#193) (08b951c)

Features

• component: create basic pagination component (#188) (d79ede5)