- Updated dependencies [69e7772]
- @bigcommerce/big-design-icons@1.2.1
- @bigcommerce/big-design@1.6.2
- @bigcommerce/big-design-patterns@2.0.4
- Updated dependencies [cb84b19]
- Updated dependencies [0f8cf34]
- @bigcommerce/big-design-patterns@2.0.3
- @bigcommerce/big-design-icons@1.2.0
- @bigcommerce/big-design@1.6.1
- 1d0d843: Pagination component marked as deprecated and re-exported as a new OffsetPagination component. Consumers of the original Pagination component should replace it with an import of OffsetPagination. All props, aesthetics, and functionality remain the same.
- 1d0d843: New StatelessPagination component added. This component can be used for cursor-based pagination or for when consumers require more control over page changes. Its aesthetics and functionality are very similar to OffsetPagination (previous named Pagination), however its props are different. Please refer to the documentation for more information.
- 14f3183: Consumers of the Table component can now choose to use the 'Stateless' form of Pagination. This enables the use of Table with cursor-based forms of pagination.
- Updated dependencies [1d0d843]
- Updated dependencies [1d0d843]
- Updated dependencies [14f3183]
- @bigcommerce/big-design@1.6.0
- @bigcommerce/big-design-patterns@2.0.2
- Updated dependencies [e860150]
- @bigcommerce/big-design@1.5.0
- @bigcommerce/big-design-patterns@2.0.1
- d9afaaf: Fix codesandbox link and update deps for examples.
- Updated dependencies [01a5b20]
- @bigcommerce/big-design-icons@1.1.0
- @bigcommerce/big-design@1.4.2
- @bigcommerce/big-design-patterns@2.0.0
- Updated dependencies [eef4d38]
- Updated dependencies [66bc0c8]
- @bigcommerce/big-design-patterns@1.1.1
- dbd50a6: Added Header component documentation
- 8d80893: Added Action Bar pattern component documentation
- 7b4f5a5: Added Page pattern component documentation
- Updated dependencies [fd0ab6e]
- Updated dependencies [8e09cdf]
- Updated dependencies [a3e0fda]
- Updated dependencies [14ddc22]
- @bigcommerce/big-design-patterns@1.1.0
- @bigcommerce/big-design@1.4.1
- Updated dependencies [cc19989]
- @bigcommerce/big-design-patterns@1.0.0
- f8665f3: Added wide breakpoint to theme definition to best adapt responsive features to wide screens
- 63aeebc: Replaces the
next-transpile-modules
package with the native built-in Next.js functionality. - fbe979e: Uses the package.json version from the
@bigcommerce/examples
package instead of relying on a dependency from the docspackage.json
. - Updated dependencies [f8665f3]
- Updated dependencies [d2f010d]
- @bigcommerce/big-design-theme@1.1.0
- @bigcommerce/big-design@1.4.0
- @bigcommerce/big-design-icons@1.0.3
All notable changes to this project will be documented in this file. See Conventional Commits for commit guidelines.
1.1.1 (2024-08-06)
Note: Version bump only for package @bigcommerce/docs
1.1.0 (2024-07-11)
1.0.1 (2024-06-11)
Note: Version bump only for package @bigcommerce/docs
1.0.0 (2024-04-17)
0.39.1 (2024-04-09)
- typescript build output with wrong imports (a812497)
0.39.0 (2024-04-02)
- component: add icon props for FileUploader dropzone (#1343) (96b8a86)
- component: implement file uploader (#1326) (f1e09a6)
0.38.2 (2024-01-23)
Note: Version bump only for package @bigcommerce/docs
0.38.1 (2024-01-02)
0.38.0 (2023-10-09)
0.37.0 (2023-07-26)
- component: add enabled column prop to the worksheet (#1241) (aaad5cb)
- component: added Badge props to Panel component (#1270) (3a712b0)
- component: localize components (#1200) (151484b)
- component: pagination label
props
were removed in favor oflocalization
object
0.36.2 (2023-06-14)
Note: Version bump only for package @bigcommerce/docs
0.36.1 (2023-06-09)
0.36.0 (2023-04-05)
- component: add description to Panel (#1119) (2038194)
- component: add header tooltip for worksheet component (#1095) (9c26b3a)
0.35.0 (2023-01-09)
- component: add Badge props to Checkbox component (#1080) (e53f820)
- convert to react@18 only (#1044) (06c4697)
- Requires
react@18
or higher.
0.34.3 (2022-11-03)
Note: Version bump only for package @bigcommerce/docs
0.34.2 (2022-10-27)
0.34.1 (2022-10-06)
0.34.0 (2022-09-27)
- deps: react@18 support (51c688b)
0.33.1 (2022-09-27)
- component: allow custom column widths and overflow worksheet (#975) (272dc39)
- component: inv-1713 Implement default expanded worksheet rows (#974) (6d7c32b)
- deps: unfork from flag-icons dependency (ac723e3)
- component: Text in columns will wrap (instead of ellipsis) and Worksheet will have a scrollable overflow if larger than viewport.
0.33.0 (2022-08-17)
0.32.2-alpha.0 (2022-08-10)
Note: Version bump only for package @bigcommerce/docs
0.32.1 (2022-07-12)
Note: Version bump only for package @bigcommerce/docs
0.32.0 (2022-07-06)
- configs: fix process env variable (#890) (d2b7f0e)
- docs: fix the name of the worksheet props (#888) (8303cdd)
- component: add rows disabling for worksheet (#887) (fdd9303)
- component: remove tooltip wrapper (b924899)
- component: - Removes the
inline
prop on the tooltip
- Strings are not allowed in the
trigger
prop
0.31.1 (2022-06-10)
0.31.0 (2022-05-11)
- docs: fix typo in DropdownPropTable (#819) (b6f9aa6)
- docs: minor page fixes (bf264b6)
- docs: remove code (#812) (ed4de14)
- component: auto-highlight first matching option in Select and MultiSelect (#818) (76eeeb7)
- docs: add new layout to Spacing page (#821) (ea92094)
- docs: update colors page to use new layout (#805) (fd94357)
0.30.3-alpha.2 (2022-03-22)
- component: add missing aria roles to tabs (#762) (7bcc3a0)
- component: change flex-reversed to flex-reverse (#721) (b65692b)
- component: a11y + i18n for Search (6eb85e0)
- docs: add do and dont section (#720) (20524a8)
- docs: add do and dont section in tabs page (#724) (d732b9f)
- docs: fix code editor bug part 1 (#746) (6d9b1f9)
- docs: fix code editor bug part 2 (#747) (b1b6470)
- docs: fix code editor bug part 3 (#748) (38ac255)
- docs: fix code editor bug part 4 (#749) (13b583c)
- docs: update button page to use new layout (#711) (59676c2)
- docs: update display page to use new layout (#687) (21f929f)
- docs: update dropdown page to use new layout (#739) (cab8ede)
- docs: update flex page to use new layout (#666) (4e6a6f6)
- docs: update form page to use new layout (61db0a9)
- docs: update grid page to use new layout (#683) (fcca1ed)
- docs: update icon page to use new layout (#756) (5af0ada)
- docs: update input page to use new layout (#740) (2bec9c4)
- docs: Update Link documentation page to use new layout (#712) (4ae6247)
- docs: update margin and padding pages to use new layout (#755) (d32c2df)
- docs: Update modal page to use new layout (#713) (f489736)
- docs: Update multi select page to use new layout (#719) (74f34d0)
- docs: update overview and do and don't sections in button group page (#726) (1aae508)
- docs: update Pill tabs to use new layout (#722) (b01a5cf)
- docs: update pogress circle page to use new layout (#728) (d9a0235)
- docs: update popover page to use new layout (#688) (0e4425d)
- docs: update progress bar page to use new layout (#727) (d4909c4)
- docs: update radio page to use new layout (#735) (60117f6)
- docs: update search page to use new layout (#736) (e1a3698)
- docs: update select page to use new layout (#738) (1d61bc2)
0.30.3-alpha.1 (2022-01-14)
- docs: update breakpoints page to use new layout (e67905c)
0.30.3-alpha.0 (2021-10-28)
- docs: dependency is an expression (#589) (6f62c41)
- docs: scope not being reinitialized on rerender (c6dd0b4)
- docs: add ContentRoutingTabs component (364028e)
- docs: add guidelines to components with new docs (#645) (90b8578)
- docs: add guidelines to Pagination (#641) (731655a)
- docs: update alert page to use new layout (#642) (895a246)
- docs: update badge page to use new layout (554abed)
- docs: update box page to use new layout (#607) (b178d4d)
- docs: update buttongroup page to use new layout (#608) (6e35b19)
- docs: update checkbox page to use new layout (#611) (d85a2ea)
- docs: update collapse page to use new layout (#612) (123ba7a)
- docs: update counter page to use new layout (#613) (1d3be24)
- docs: update datepicker page to use new layout (#614) (702a664)
- docs: update inlinemessage page to use new layout (#615) (886d98b)
- docs: update message page to use new layout (#617) (08ab38e)
- docs: update modal page to use new layout (#618) (f44b343)
- docs: update pagination page to use new layout (#619) (a5d1b52)
- docs: update panel page to use new layout (#620) (6666753)
- docs: update stateful table page to use new layout (72709dc)
- docs: update stateful tree page to use new layout (#609) (ba5198a)
- docs: update stepper page to use new layout (#621) (31f194a)
- docs: update switch page to use new layout (#622) (d436884)
- docs: update table page to use new layout (#624) (94e033d)
- docs: update tabs page to use new layout (#631) (4feaf9d)
- docs: update textarea page to use new layout (#630) (3061ef5)
- docs: update timepicker page to use new layout (#629) (87c2a0e)
- docs: update tooltip page to use new layout (#628) (6990132)
- docs: update typography page to use new layout (#627) (3988dfb)
- docs: update worksheet page to use new layout (#626) (9d8a737)
0.30.2 (2021-09-03)
0.30.1 (2021-08-23)
Note: Version bump only for package @bigcommerce/docs
0.30.0 (2021-08-04)
Note: Version bump only for package @bigcommerce/docs
0.30.0-alpha.4 (2021-08-02)
- component: add margin props to Form component (#569) (422e345)
- component: add the option to disable columns in Worksheet (#563) (181557f)
- add worksheet docs (#562) (936a26a)
- docs: add dark mode icon (#560) (898796e)
- deps: You will need to update to styled-components v5. In addition, you will need to import the base fonts in your element. See the "Getting Started" page or README.md for an example.
0.30.0-alpha.3 (2021-07-13)
Note: Version bump only for package @bigcommerce/docs
0.30.0-alpha.2 (2021-07-08)
- component: add ButtonGroup component (#556) (2350481)
- component: move Search into its own exposed component (#557) (6a5cdf5)
0.30.0-alpha.1 (2021-07-06)
Note: Version bump only for package @bigcommerce/docs
0.30.0-alpha.0 (2021-06-10)
- fix tooltip documentation and interfaces (#546) (1014593)
- docs: update inline-message side nav link (#529) (ba0c093)
- component: add autoComplete prop for selects (#542) (5ac23fd)
- component: add onOpen and onClose to Selects (#549) (233d8b7)
- component: add Pill Tabs component (#515) (b89518f)
- component: add Search to the Table and StatefulTable (#521) (d5591ae)
0.29.2 (2021-04-14)
0.29.1 (2021-03-29)
0.29.0 (2021-03-08)
0.28.0 (2021-02-11)
- component: Add drag and drop support to stateful table component (#495) (c904f74)
- component: add headerId prop to Panel (#499) (39fff4f)
- icons: add flag icons (#493) (0519c8a)
0.27.0 (2021-01-13)
0.26.2 (2020-12-28)
Note: Version bump only for package @bigcommerce/docs
0.26.1 (2020-12-21)
Note: Version bump only for package @bigcommerce/docs
0.26.0 (2020-12-17)
- component:
Tree
component and nowStatefulTree
with new API changes. See dev docs for new API.
0.26.0-alpha.1 (2020-12-15)
Note: Version bump only for package @bigcommerce/docs
0.26.0-alpha.0 (2020-12-09)
- component: adds documentation for the TableFigure component (#473) (e9bba2f)
- component: use ReactNode for table actions (#478) (8622402)
- component: Table and StatefulTable
actions
prop changed from expecint a React.ComponentType to React.ReactNode.
Old:
<Table actions={() => <Button>Some Action</Button>} />
New:
<Table actions={<Button>Some Action</Button>} />
0.25.0 (2020-11-12)
- webpack 5 compatibility (#466) (7e66238)
- docs: alert docs - alert management import clarification (#470) (8a5e330)
- component: Rename
InlineAlert
toInlineMessage
.
0.24.0 (2020-10-16)
Note: Version bump only for package @bigcommerce/docs
0.23.8 (2020-10-14)
Note: Version bump only for package @bigcommerce/docs
0.23.7 (2020-10-07)
Note: Version bump only for package @bigcommerce/docs
0.23.6 (2020-10-02)
0.23.5 (2020-09-25)
Note: Version bump only for package @bigcommerce/docs
0.23.4 (2020-09-16)
Note: Version bump only for package @bigcommerce/docs
0.23.3 (2020-09-09)
Note: Version bump only for package @bigcommerce/docs
0.23.2 (2020-09-03)
0.23.1 (2020-08-31)
- component: allow Dropdown groups to have optional
label
(1b12288)
0.23.0 (2020-08-25)
- component: add emptyComponent prop to Table (#436) (d1e877d)
- component: add HR component (#438) (eb657fc)
- component: add mobileWidth prop to Button (#435) (f04e120)
- component: add zIndex prop to Box (#439) (c025900)
- component: rename alertManager's fadeAway to autoDismiss (#437) (11b1dff)
- docs: adds docs for Popover (b37d109)
- component: If you are using alertManager's
fadeAway
option you will need to change it toautoDismiss
.
0.22.0 (2020-08-13)
- component: add Switch component (#429) (340bcec)
- component: add Timepicker component (#425) (23ee544)
- docs: add BigDesign version on the documentation site (#428) (8a39278)
0.21.2 (2020-07-31)
- component: add description to select options and action (#423) (2efaab5)
- component: allow FormControlLabels in Selects (#422) (f49dd81)
0.21.1 (2020-07-14)
0.21.0 (2020-07-14)
- two typos in description text (#411) (bd1e220)
- docs: grammar update (40d12b7)
- docs: update broken links (#416) (0ef7ab7)
- component: add clear method to alerts manager (#415) (8c472cc)
- component: add Datepicker component (#408) (f23176a)
0.20.0 (2020-06-16)
- component: add additional size to ProgressCircle component (#409) (70fafaf)
- component: add Tree component (#406) (c67643c)
- component:
xSmall
ProgressCircle
size changed toxxSmall
.
0.19.2 (2020-05-07)
Note: Version bump only for package @bigcommerce/docs
0.19.1 (2020-04-30)
Note: Version bump only for package @bigcommerce/docs
0.19.0 (2020-04-29)
- component: adds description to Select & MultiSelect (#378) (b66c733)
- component: remove bottom margin on the TableFigure component (#385) (25d4760)
- component: table column prop incorrect value for middle alignment (#383) (cb1eadb)
- component: add clearfix prop for Box component (#381) (29b073b)
- component: add Collapse component (#368) (233e6d1)
- component: Visual breaking change; removes the bottom margin on
TableFigure
components. Use the built inmargin
props if margin is needed.
0.18.0 (2020-04-20)
0.17.2 (2020-04-13)
- 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.0 (2020-03-25)
- component: add description attribute for Checkbox (#349) (9a9eeb4)
- component: add description attribute for Radio (#345) (42365e9)
- component: stateful table sortFn (#353) (3a715a3)
0.16.0 (2020-02-21)
- component: add Alerts, InlineAlerts, and Message components (#340) (d541276)
- component: convert Dropdown/Select to FC and add MultiSelect (#303) (0ab0e50)
- component: restrict badges to use label props and style fixes (#339) (a8af2f2)
- component:
Selects
andMultiselects
have been split into its own component. Props changed forDropdowns
&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.15.0 (2020-02-06)
- component: makes label and options props required for dropdowns and groups (#299) (6f3405c)
- docs: table actions prop name (30e06b4)
- docs: table with sort example (30dc955)
- add react-hooks eslint and fix missing deps/issues (#330) (da3fbd6)
- component: add ellipsis prop to Link (#310) (c2f9b78)
- component: add hidden headers props to Table and StatefulTable (#297) (d80641a)
- component: add label id's to form fields (#304) (0620612)
- component: add text-transform props to Text and Small (#307) (5d12784)
- component: convert Checkbox to FC and remove static members (#322) (b916d05)
- component: convert Flex to FC and export FlexItem (#313) (b2d0f21)
- component: convert Form to FC and remove static members (#324) (fbc5eb9)
- component: convert Grid to FC and export GridItem (#314) (6e60254)
- component: convert Input to FC and remove static members (#320) (f8fcd86)
- component: convert Modal to FC (#317) (a525e59)
- component: convert Radio to FC and remove static members (#323) (b14a6c1)
- component: convert Textarea to FC and remove static members (#321) (bd9cc8d)
- component: covert Fieldset to FC and remove static members (#319) (f75bd49)
- icons: forwardRef to svg (#312) (0088444)
- component: Use
FormControlError
,FormControlLabel
,FormGroup
, andFieldset
instead ofForm.Error
,Form.Label
,Form.Group
, andForm.Fieldset
respectively. - component: Use
RadioLabel
instead ofRadio.Label
. - component: Use
CheckboxLabel
instead ofCheckbox.Label
. - component: Use
FormControlDescription
,FormControlError
, andFormControlLabel
instead ofTextarea.Description
,Textarea.Error
, andTextarea.Label
respectively. - component: Use
FormControlDescription
,FormControlError
, andFormControlLabel
instead ofInput.Description
,Input.Error
, andInput.Label
respectively. - component:
Form.Fieldset
renamed toFieldset
and will now have toimport { Fieldset } from '@bigcommerce/big-design';
- component:
Grid.Item
renamed toGridItem
and will now have to import { GridItem } from '@bigcommerce/big-design'; - component:
Flex.Item
renamed toFlexItem
and will now have to import { FlexItem } from '@bigcommerce/big-design';
0.14.0 (2019-12-09)
- docs: fix modal examples (b41ecab)
- docs: prevent hashes on links from being overwritten (#277) (c0d0a60)
- component: adds list groups w/headers to Dropdown component (#288) (ff031e9)
- example: setup CodeSandbox example (#281) (7e36d99)
0.13.2 (2019-11-14)
- component: add customActions prop to Table and StatefulTable (#263) (ad102d4)
- add hiddenLabel prop to Checkbox component (#264) (54f63b9)
0.13.1 (2019-11-12)
- component: allow 0 as values in selects (#257) (92c6238)
- docs: add Form component around form controls (a8ed9ff)
- docs: add js/ts toggle in code previewer (3ac60e3)
0.13.0 (2019-11-11)
- docs: checkbox page typo (#250) (f073be5)
- docs: opening links in new tab (e6fce3e)
- docs: remove duplicate headings (#249) (a1d41df)
- 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)
- component:
onChange
is renamed toonItemChange
- all: bumped peer dependency of styled-components to
^4.3.0
- component:
<Table />
no longer accepts Margin props.
0.12.0 (2019-10-29)
- docs: logo overflowing into side nav (9237d31)
- docs: remove 'test' label from prop tables (#211) (312a5b1)
- 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)
- component: Select now accepts an array of
Options
and anAction
object. Will callonChange
when option is selected with the chosenvalue
andoption
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
asoptions
.
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
andactions
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.0 (2019-09-23)
0.10.0 (2019-09-23)
- docs: fix pagination docs example (#198) (d362242)
- docs: temporarily remove design guideline navigation link (#199) (836abec)
- component: add indeterminate state to checkboxes (#197) (5146fdb)
- docs: end sentences with dots on pagination props (b9effd4)
0.9.0 (2019-09-17)
0.8.0 (2019-09-06)
- docs: add positionFixed prop to Select docs (c133d59)
0.7.1 (2019-08-30)
Note: Version bump only for package @bigcommerce/docs
0.7.0 (2019-08-29)
0.6.4 (2019-08-20)
Note: Version bump only for package @bigcommerce/docs
0.6.3 (2019-08-19)
- component: add missing z-index to components (#176) (800d2fc)
- docs: update Dev Blog post link (#175) (4c93e05)
- component:
theme.zIndex
no longer hastheme.zIndex.dropdown
0.6.2 (2019-08-15)
0.6.1 (2019-08-13)
- docs: avatar example in Box (#149) (a4e6cdc)
- docs: handle 1-liner noInline returns on CodePreview (#154) (e125c77)
- docs: restyle and rearrange sidenav (#151) (1be86d1)
- docs: updated Getting Started copy (8dd3054)
- theme: issue with font sizes in createTheme (#135) (313ff46)
- component: rename GlobalStyle to GlobalStyles (#126) (e7a231e)
- component: update error state handling on form component (#129) (e665479)
- component: update grid component with responsive props (#131) (1206e60)
- docs: add modal page (16780fe)
- docs: add typography documentation (#139) (ce72cb7)
- docs: align helpful resources (#143) (d0214f0)
- docs: breakpoints docs (#156) (64755bd)
- docs: docs container (#148) (5f391ba)
- docs: getting started page (#125) (1c4fbdc)
- docs: panel documentation (#137) (f748544)
- docs: sidenav stylings (#123) (a428dd0)
- docs: spacing documentation (#145) (c6756ec)
- docs: support template strings on CodePreview (#152) (7c68580)
- docs: tabs documentation (#136) (ee75768)
- docs: tooltips documentation (#138) (5e9d129)
- docs: update Getting Started copy (#144) (71502c7)
- docs: update to use shadow props instead of elevation (04a3dac)
- docs: update tooltip docs to new api (2afb931)
- docs: use next instead of storybook (#122) (986ebd6)
-
component: Form.Row components are renamed to Form.Group
-
feat: wip input error states
-
feat: improved error handling
-
feat: add inline documentation to Group
-
feat: rebase and fix small issues
-
test: update tests for feature
-
fix: update PR comments
-
component: Changed Grid and Grid.Item props to be more verbose (e.g. areas -> gridAreas)
-
component:
GlobalStyle
is nowGlobalStyles