Skip to content

Latest commit

 

History

History
358 lines (256 loc) · 13.2 KB

v2.1.0.mdx

File metadata and controls

358 lines (256 loc) · 13.2 KB
title description releaseUrl releaseDate version
Version 2.1.0
Explore the changelog for Chakra UI version 2.1.0. Learn about the latest features, bug fixes, and improvements.
May 22, 2022
2.1.0

@chakra-ui/react@2.1.0

Minor Changes

  • #6050 ddea8d143 Thanks @segunadebayo! - Add support for responsive variants and sizes.

    <Button variant={["sm", "lg"]}>Click me</Button>

    Add support for !important in token values as an escape hatch for overriding properties in responsive variants/sizes.

    <Button variant={["sm", "lg"]} fontSize="lg !important">
      Click me
    </Button>

    Notes

    • Based on how this is designed, there's no support for responsive colorScheme since it is technically not a variant
    • When using responsive sizes and variants, overriding properties via props might not work as expected. We use native CSS media queries to enable this feature so there's no "magic" under the hood. If you really want to override properties, you can consider using the important syntax

Patch Changes

  • #6046 3319eca8b Thanks @Averethel! - Ensure types used by other chakra packages are properly exported and imported so that src directory is not referenced in the emitted type declarations.
  • Updated dependencies [3319eca8b, ddea8d143, 3992e50d3, b56f16f4e, a799a4467, c93f5c90b, 1cea9022b]:
    • @chakra-ui/theme@2.0.2
    • @chakra-ui/system@2.1.0
    • @chakra-ui/textarea@2.0.1
    • @chakra-ui/avatar@2.0.1
    • @chakra-ui/image@2.0.1
    • @chakra-ui/media-query@3.0.1
    • @chakra-ui/toast@2.0.3
    • @chakra-ui/accordion@2.0.1
    • @chakra-ui/menu@2.0.1
    • @chakra-ui/pin-input@2.0.1
    • @chakra-ui/tabs@2.0.1
    • @chakra-ui/modal@2.0.1
    • @chakra-ui/provider@2.0.3
    • @chakra-ui/skeleton@2.0.3

@chakra-ui/styled-system@2.1.0

Minor Changes

  • #6050 ddea8d143 Thanks @segunadebayo! - Add support for responsive variants and sizes.

    <Button variant={["sm", "lg"]}>Click me</Button>

    Add support for !important in token values as an escape hatch for overriding properties in responsive variants/sizes.

    <Button variant={["sm", "lg"]} fontSize="lg !important">
      Click me
    </Button>

    Notes

    • Based on how this is designed, there's no support for responsive colorScheme since it is technically not a variant
    • When using responsive sizes and variants, overriding properties via props might not work as expected. We use native CSS media queries to enable this feature so there's no "magic" under the hood. If you really want to override properties, you can consider using the important syntax

@chakra-ui/system@2.1.0

Minor Changes

  • #6050 ddea8d143 Thanks @segunadebayo! - Add support for responsive variants and sizes.

    <Button variant={["sm", "lg"]}>Click me</Button>

    Add support for !important in token values as an escape hatch for overriding properties in responsive variants/sizes.

    <Button variant={["sm", "lg"]} fontSize="lg !important">
      Click me
    </Button>

    Notes

    • Based on how this is designed, there's no support for responsive colorScheme since it is technically not a variant
    • When using responsive sizes and variants, overriding properties via props might not work as expected. We use native CSS media queries to enable this feature so there's no "magic" under the hood. If you really want to override properties, you can consider using the important syntax

Patch Changes

  • Updated dependencies [ddea8d143]:
    • @chakra-ui/styled-system@2.1.0

storybook-addon@2.0.3

Patch Changes

  • Updated dependencies []:
    • @chakra-ui/storybook-addon@3.0.0

@chakra-ui/accordion@2.0.1

Patch Changes

  • Updated dependencies [3319eca8b]:
    • @chakra-ui/descendant@3.0.1

@chakra-ui/avatar@2.0.1

Patch Changes

@chakra-ui/descendant@3.0.1

Patch Changes

  • #6046 3319eca8b Thanks @Averethel! - Ensure types used by other chakra packages are properly exported and imported so that src directory is not referenced in the emitted type declarations.

@chakra-ui/focus-lock@2.0.1

Patch Changes

@chakra-ui/image@2.0.1

Patch Changes

@chakra-ui/media-query@3.0.1

Patch Changes

  • #6069 a799a4467 Thanks @segunadebayo! - Fix regression in use-media-query hook in SSR envrionments where it throws hydration mismatch

@chakra-ui/menu@2.0.1

Patch Changes

  • Updated dependencies [3319eca8b]:
    • @chakra-ui/descendant@3.0.1

@chakra-ui/modal@2.0.1

Patch Changes

  • Updated dependencies [754649da8]:
    • @chakra-ui/focus-lock@2.0.1

@chakra-ui/pin-input@2.0.1

Patch Changes

  • Updated dependencies [3319eca8b]:
    • @chakra-ui/descendant@3.0.1

@chakra-ui/provider@2.0.3

Patch Changes

  • Updated dependencies [ddea8d143]:
    • @chakra-ui/system@2.1.0

@chakra-ui/skeleton@2.0.3

Patch Changes

  • Updated dependencies [ddea8d143, a799a4467]:
    • @chakra-ui/system@2.1.0
    • @chakra-ui/media-query@3.0.1

@chakra-ui/tabs@2.0.1

Patch Changes

  • Updated dependencies [3319eca8b]:
    • @chakra-ui/descendant@3.0.1

@chakra-ui/textarea@2.0.1

Patch Changes

@chakra-ui/theme@2.0.2

Patch Changes

  • #6046 3319eca8b Thanks @Averethel! - Ensure types used by other chakra packages are properly exported and imported so that src directory is not referenced in the emitted type declarations.

  • #6056 c93f5c90b Thanks @johannespein! - Tag component variants borderRadius was overwriting baseStyle eventhough borderRadius was same for all variants. borderRadius is now part of the baseStyle

@chakra-ui/toast@2.0.3

Patch Changes

@chakra-ui/props-docs@2.0.3

Patch Changes

  • Updated dependencies [3319eca8b, ddea8d143]:
    • @chakra-ui/react@2.1.0
    • @chakra-ui/styled-system@2.1.0

@chakra-ui/storybook-addon@3.0.0

Patch Changes

create-react-app-ts@2.0.3

Patch Changes

gatsby-starter-default@1.0.3

Patch Changes

chakra-nextjs@2.0.3

Patch Changes

chakra-nextjs-ts@2.0.3

Patch Changes

@chakra-ui/test-utils@2.0.3

Patch Changes