@bigcommerce/[email protected]

Patch Changes

• Updated dependencies [8e09cdf]
  • @bigcommerce/[email protected]

@bigcommerce/[email protected]

Patch Changes

• 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/[email protected]
  • @bigcommerce/[email protected]

@bigcommerce/[email protected]

Patch Changes

• 8e09cdf: Adds default props to styled-components

@bigcommerce/[email protected]

Minor Changes

• fd0ab6e: Added ActionBar component to complement the overall Page pattern

Patch Changes

• a3e0fda: Updates the Page and ActionBar components to work outside of iframes. In the context of our Control Panel, we may have pages that are directly rendered. This allows a "fixed" position item to float only within the page context.
• 14ddc22: Removes unused PropsWithChildren type.
• Updated dependencies [8e09cdf]
  • @bigcommerce/[email protected]

@bigcommerce/[email protected]

Patch Changes

• Updated dependencies [cc19989]
  • @bigcommerce/[email protected]

@bigcommerce/[email protected]

Major Changes

• cc19989: Releases @bigcommerce/big-design-pattern, a collections of useful patterns for BigDesign.

  New components:

  Header

  A header component that can be used to display a title, description, and actions.

  import { Text, Link } from '@bigcommerce/big-design';
  import { AddIcon. ArrowDropDownIcon } from '@bigcommerce/big-design-icons';
  import { Header } from '@bigcommerce/big-design-patterns';
  
  export const Component = () => {
    return (
      <Header
        actions={[
          {
            text: 'Main action',
            variant: 'primary',
            iconLeft: <AddIcon />,
          },
          {
            items: [],
            toggle: {
              text: 'Secondary',
              variant: 'secondary',
              iconRight: <ArrowDropDownIcon />,
            },
          },
        ]}
        backLink={{
          text: 'Back link',
          href: '#',
          onClick: () => {
            window.alert('Back button clicked');
          },
        }}
        badge={{
          variant: 'primary',
          label: 'Beta',
        }}
        description={
          <Text>
            Main description of the page. It provides a comprehensive overview, accurately capturing
            the essence of the topic in a concise manner.{' '}
            <Link external={true} href="#" target="_blank">
              Learn more
            </Link>
          </Text>
        }
        icon={<img alt="" height={40} src="logo.svg" width={40} />}
        title="Page Title"
      />
    );
  };

  Page

  A page component that can be used to display a header and main content.

  import { Panel } from '@bigcommerce/big-design';
  import { Page, Header } from '@bigcommerce/big-design-patterns';
  
  export const Component = () => {
    return (
      <Page
        background={{
          src: 'background.jpg',
        }}
        header={<Header {...} />}
        message={{
          header: 'Optional headline',
          type: 'info',
          messages: [
            { text: 'Required description copy.', link: { text: 'Optional link', href: '#' } },
          ],
        }}
      >
        <Panel header="Main content">
          ...
        </Panel>
      </Page>
    );
  };

@bigcommerce/[email protected]

Patch Changes

• Updated dependencies [f8665f3]
• Updated dependencies [d2f010d]
  • @bigcommerce/[email protected]
  • @bigcommerce/[email protected]
  • @bigcommerce/[email protected]

All notable changes to this project will be documented in this file.
See Conventional Commits for commit guidelines.

@bigcommerce/[email protected]

Minor Changes

• f8665f3: Added wide breakpoint to theme definition to best adapt responsive features to wide screens

Patch Changes

• 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 docs package.json.
• Updated dependencies [f8665f3]
• Updated dependencies [d2f010d]
  • @bigcommerce/[email protected]
  • @bigcommerce/[email protected]
  • @bigcommerce/[email protected]

All notable changes to this project will be documented in this file.
See Conventional Commits for commit guidelines.

@bigcommerce/[email protected]

Minor Changes

• d2f010d: Added MultiSelect column type to Worksheet component

Patch Changes

• Updated dependencies [f8665f3]
  • @bigcommerce/[email protected]
  • @bigcommerce/[email protected]

All notable changes to this project will be documented in this file.
See Conventional Commits for commit guidelines.

@bigcommerce/[email protected]

Minor Changes

• f8665f3: Added wide breakpoint to theme definition to best adapt responsive features to wide screens

All notable changes to this project will be documented in this file.
See Conventional Commits for commit guidelines.