Skip to content

Latest commit

 

History

History
1266 lines (931 loc) · 49.7 KB

v2.2.0.mdx

File metadata and controls

1266 lines (931 loc) · 49.7 KB
title description releaseUrl releaseDate version
Version 2.2.0
Explore the changelog for Chakra UI version 2.2.0. Learn about the latest features, bug fixes, and improvements.
June 7, 2022
2.2.0

@chakra-ui/checkbox@2.1.0

Minor Changes

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd, 7de782f04]:

    • @chakra-ui/form-control@2.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2
    • @chakra-ui/visually-hidden@2.0.2

@chakra-ui/media-query@3.1.0

Minor Changes

  • #6157 95bcaf1ff Thanks @segunadebayo! - Add support for client-side rendered (CSR) apps to get the correct value on first render.

    Affected hooks: useMediaQuery, useBreakpoint, useBreakpointValue.

    These hooks are built work in server-side rendering (SSR) applications by default. You might notice a quick flash of incorrect media query value when you use them.

    If you're creating a CSR-only app, you can now leverage the ssr argument to get the correct value on first render.

    const [isMobile] = useMediaQuery("(max-width: 768px)", {
      // you can now pass `ssr: false`
      ssr: false,
    })
    
    const buttonSize = useBreakpointValue(
      { base: "sm", lg: "md" },
      // you can now pass `ssr: false`
      { ssr: false },
    )
    
    // you can now pass `ssr: false`
    const breakpoint = useBreakpoint({ ssr: false })

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/react-env@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/react@2.2.0

Minor Changes

  • #6153 400a2091a Thanks @segunadebayo! - - Ensure components show focus outline only when interacting with the keyboard.

    • Migrate components to use _focusVisible instead of _focus selectors to indicate focus.

    🚨 NOTE: This might be a potential breaking change for consumers who use the extendTheme with the _focus styles. Kindly migrate to _focusVisible.

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [bcbfcbcce, b6083bb16, 95bcaf1ff, 06f29f8cd, 7de782f04, 424090429, bcbfcbcce]:

    • @chakra-ui/checkbox@2.1.0
    • @chakra-ui/theme@2.1.0
    • @chakra-ui/modal@2.0.3
    • @chakra-ui/media-query@3.1.0
    • @chakra-ui/accordion@2.0.3
    • @chakra-ui/alert@2.0.2
    • @chakra-ui/avatar@2.0.3
    • @chakra-ui/breadcrumb@2.0.2
    • @chakra-ui/button@2.0.2
    • @chakra-ui/close-button@2.0.2
    • @chakra-ui/control-box@2.0.2
    • @chakra-ui/counter@2.0.2
    • @chakra-ui/css-reset@2.0.1
    • @chakra-ui/editable@2.0.2
    • @chakra-ui/react-env@2.0.2
    • @chakra-ui/form-control@2.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/icon@3.0.2
    • @chakra-ui/image@2.0.3
    • @chakra-ui/input@2.0.2
    • @chakra-ui/layout@2.0.2
    • @chakra-ui/live-region@2.0.2
    • @chakra-ui/menu@2.0.3
    • @chakra-ui/number-input@2.0.2
    • @chakra-ui/pin-input@2.0.3
    • @chakra-ui/popover@2.0.2
    • @chakra-ui/popper@3.0.2
    • @chakra-ui/portal@2.0.2
    • @chakra-ui/progress@2.0.2
    • @chakra-ui/provider@2.0.5
    • @chakra-ui/radio@2.0.2
    • @chakra-ui/select@2.0.2
    • @chakra-ui/skeleton@2.0.5
    • @chakra-ui/slider@2.0.2
    • @chakra-ui/spinner@2.0.2
    • @chakra-ui/stat@2.0.2
    • @chakra-ui/switch@2.0.3
    • @chakra-ui/system@2.1.2
    • @chakra-ui/table@2.0.2
    • @chakra-ui/tabs@2.0.3
    • @chakra-ui/tag@2.0.2
    • @chakra-ui/textarea@2.0.3
    • @chakra-ui/toast@2.0.6
    • @chakra-ui/tooltip@2.0.2
    • @chakra-ui/transition@2.0.2
    • @chakra-ui/utils@2.0.2
    • @chakra-ui/visually-hidden@2.0.2

@chakra-ui/styled-system@2.2.0

Minor Changes

Patch Changes

@chakra-ui/theme@2.1.0

Minor Changes

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/anatomy@2.0.1
    • @chakra-ui/theme-tools@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/cli@2.1.0

Minor Changes

  • #6117 154fee7f1 Thanks @TimKolberger! - New watch flag for the tokens command. You can specify a directory path to watch for changes. It defaults to the parent dir of <source>, e.g. src/theme/theme.ts => src/theme.

    > chakra-cli tokens src/theme/theme.ts --watch
    
    > chakra-cli tokens --help
    Usage: chakra-cli tokens [options] <source>
    
    Options:
      --out <path>              output file e.g. node_modules/@chakra-ui/styled-system/dist/declarations/src/theming.types.d.ts
      --strict-component-types  Generate strict types for props variant and size
      --watch [path]            Watch directory for changes and rebuild
      -h, --help                display help for command
    

Patch Changes

storybook-addon@2.0.6

Patch Changes

@chakra-ui/accordion@2.0.3

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/descendant@3.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/icon@3.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/transition@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/alert@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/icon@3.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/spinner@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/anatomy@2.0.1

Patch Changes

@chakra-ui/avatar@2.0.3

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/image@2.0.3
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/breadcrumb@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/button@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/spinner@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/clickable@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/close-button@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/icon@3.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/color-mode@2.0.4

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/control-box@2.0.2

Patch Changes

@chakra-ui/counter@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/css-reset@2.0.1

Patch Changes

@chakra-ui/descendant@3.0.2

Patch Changes

@chakra-ui/editable@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/react-env@2.0.2

Patch Changes

@chakra-ui/focus-lock@2.0.3

Patch Changes

@chakra-ui/form-control@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/icon@3.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/hooks@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/icon@3.0.2

Patch Changes

@chakra-ui/icons@2.0.2

Patch Changes

@chakra-ui/image@2.0.3

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/input@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd, 7de782f04]:

    • @chakra-ui/form-control@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/layout@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/icon@3.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/live-region@2.0.2

Patch Changes

@chakra-ui/menu@2.0.3

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/clickable@2.0.2
    • @chakra-ui/descendant@3.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/popper@3.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/transition@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/modal@2.0.3

Patch Changes

  • #6155 b6083bb16 Thanks @itkrt2y! - Fix shifting screen when opening modal

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/close-button@2.0.2
    • @chakra-ui/focus-lock@2.0.3
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/portal@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/transition@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/number-input@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd, 7de782f04]:

    • @chakra-ui/counter@2.0.2
    • @chakra-ui/form-control@2.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/icon@3.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/pin-input@2.0.3

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/descendant@3.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/popover@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/close-button@2.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/popper@3.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/popper@3.0.2

Patch Changes

@chakra-ui/portal@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/progress@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/theme-tools@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/provider@2.0.5

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd, 7de782f04]:

    • @chakra-ui/css-reset@2.0.1
    • @chakra-ui/react-env@2.0.2
    • @chakra-ui/portal@2.0.2
    • @chakra-ui/system@2.1.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/radio@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6119 424090429 Thanks @itkrt2y! - Fix a bug in chromium browsers where the modal position would change when focusing on the radio button in the modal which has some long content.

  • Updated dependencies [06f29f8cd, 7de782f04]:

    • @chakra-ui/form-control@2.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2
    • @chakra-ui/visually-hidden@2.0.2

@chakra-ui/react-utils@2.0.1

Patch Changes

@chakra-ui/select@2.0.2

Patch Changes

@chakra-ui/skeleton@2.0.5

Patch Changes

@chakra-ui/skip-nav@2.0.2

Patch Changes

@chakra-ui/slider@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/spinner@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/utils@2.0.2
    • @chakra-ui/visually-hidden@2.0.2

@chakra-ui/stat@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/icon@3.0.2
    • @chakra-ui/utils@2.0.2
    • @chakra-ui/visually-hidden@2.0.2

@chakra-ui/switch@2.0.3

Patch Changes

@chakra-ui/system@2.1.2

Patch Changes

@chakra-ui/table@2.0.2

Patch Changes

@chakra-ui/tabs@2.0.3

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • #6137 7de782f04 Thanks @Patrick-Ullrich! - Improve error messaging around style provider factory by creating a custom createStylesContext function.

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/clickable@2.0.2
    • @chakra-ui/descendant@3.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2

@chakra-ui/tag@2.0.2

Patch Changes

@chakra-ui/textarea@2.0.3

Patch Changes

@chakra-ui/theme-tools@2.0.2

Patch Changes

@chakra-ui/toast@2.0.6

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [bcbfcbcce, 06f29f8cd, 7de782f04]:

    • @chakra-ui/theme@2.1.0
    • @chakra-ui/alert@2.0.2
    • @chakra-ui/close-button@2.0.2
    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/portal@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/system@2.1.2
    • @chakra-ui/transition@2.0.2
    • @chakra-ui/utils@2.0.2

@chakra-ui/tooltip@2.0.2

Patch Changes

  • 06f29f8cd Thanks @segunadebayo! - Bump all packages to resolve deps issues

  • Updated dependencies [06f29f8cd]:

    • @chakra-ui/hooks@2.0.2
    • @chakra-ui/popper@3.0.2
    • @chakra-ui/portal@2.0.2
    • @chakra-ui/react-utils@2.0.1
    • @chakra-ui/utils@2.0.2
    • @chakra-ui/visually-hidden@2.0.2

@chakra-ui/transition@2.0.2

Patch Changes

@chakra-ui/utils@2.0.2

Patch Changes

@chakra-ui/visually-hidden@2.0.2

Patch Changes

@chakra-ui/babel-plugin@1.0.3

Patch Changes

@chakra-ui/cra-template@2.0.2

Patch Changes

@chakra-ui/cra-template-typescript@2.0.2

Patch Changes

@chakra-ui/gatsby-plugin@3.0.1

Patch Changes

@chakra-ui/props-docs@2.0.6

Patch Changes

@chakra-ui/storybook-addon@4.0.0

Patch Changes

create-react-app-ts@2.0.6

Patch Changes

gatsby-starter-default@1.0.6

Patch Changes

chakra-nextjs@2.0.6

Patch Changes

chakra-nextjs-ts@2.0.6

Patch Changes

vite-ts@1.0.1

Patch Changes

@chakra-ui/test-utils@2.0.6

Patch Changes