v1.5.0.mdx

title	description	releaseUrl	releaseDate	version
Version 1.5.0	Explore the changelog for Chakra UI version 1.5.0. Learn about the latest features, bug fixes, and improvements.	chakra-ui#3712	April 7, 2021	1.5.0

@chakra-ui/[email protected]

Minor Changes

• 75817ec42 #3733 Thanks @segunadebayo! - - Return prop getters for popover header and body and use ref callback to determine element's presense instead of useEffect.

  • Mark usePopover as internal for now.

  • Add support for rootProps to PopoverContent to allow passing props to popover's positioner.

  • Make it possible to add custom motion variants so users can orchestrate custom transitions.

  • Remove unused dependencies

  • Move popover arrow shadow color computation to popover's theme.

Patch Changes

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [87a03b320, 1a04a41bd, 75817ec42, e481ba491]

@chakra-ui/[email protected]

Minor Changes

• 75817ec42 #3733 Thanks @segunadebayo! - Add prop getters for popper and arrow for better ssr support

  Replace utils dependency with react-utils

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Minor Changes

• ac21d798a Thanks @segunadebayo! - Bump package as minor

Patch Changes

• 2287d82e3 #3715 Thanks @with-heart! - Resolved a peer dependency resolution issue reported by yarn2, npm7, and other more modern package managers
• Updated dependencies [1cff6f54e, 06612e3ba, 38706f731, 1a04a41bd, 799f3c803, c69d2b983, 2287d82e3, 75817ec42, 75817ec42, e481ba491, d86a0f6b4, 75817ec42, 07ddf0f27, ac21d798a]

@chakra-ui/[email protected]

Minor Changes

• 06612e3ba Thanks @segunadebayo! - Add TableContainer component to help tables scroll horizontally when overflowing.

  <TableContainer>
    <Table>
      {...}
    </Table>
  </TableContainer>

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [87a03b320, 1a04a41bd, c69d2b983, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 38706f731 Thanks @segunadebayo! - Replace withFlushSync with microtask callback to prevent ReactDOM warning.

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies

@chakra-ui/[email protected]

Patch Changes

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• d86a0f6b4 Thanks @segunadebayo! - - Refactor form label to use prop getter instead of hook for better consistency
  • Replace withFlushSync with scheduleMicrotask callback to prevent ReactDOM warning when an element us focused by calling .focus(). This works as well in concurrent mode.
• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491, d86a0f6b4]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [87a03b320, 1a04a41bd, c69d2b983, 75817ec42, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 2287d82e3 #3715 Thanks @with-heart! - Resolved a peer dependency resolution issue reported by yarn2, npm7, and other more modern package managers

• 07ddf0f27 Thanks @segunadebayo! - Omit scroll-behavior from drawer props

• Updated dependencies [87a03b320, 1a04a41bd, c69d2b983, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 38706f731 Thanks @segunadebayo! - Replace withFlushSync with microtask callback to prevent ReactDOM warning.

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491, d86a0f6b4]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 1cff6f54e Thanks @segunadebayo! - Fix issue in safari where circular progress indicator shows a tiny bit when value is 0
• Updated dependencies [1a04a41bd, c69d2b983, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 38706f731 Thanks @segunadebayo! - Replace withFlushSync with microtask callback to prevent ReactDOM warning.

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491, d86a0f6b4]

@chakra-ui/[email protected]

Patch Changes

• 87a03b320 #3733 Thanks @segunadebayo! - Update prop getter v2 type to take second parameter

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• e481ba491 Thanks @segunadebayo! - - Extract functions from react-utils back to utils package

  • Remove withFlushSync function in favor of using a microtask callback
  • Import types for warn function

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• ac21d798a Thanks @segunadebayo! - Fix RTL styles for select field to use paddingEnd instead of pr

• Updated dependencies [1a04a41bd, e481ba491, d86a0f6b4]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [38706f731, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• Updated dependencies [87a03b320, 1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491, d86a0f6b4]

@chakra-ui/[email protected]

Patch Changes

• 75817ec42 #3733 Thanks @segunadebayo! - Popover

  • Moved maxW from popover's popper to content to allow for better control of the popover's width.
  • Use width instead of maxW to allow users more control of popover's width
  • Use --popover-bg css property to control popover and arrow background.

  <PopoverContent style={{ "--popover-bg": "purple" }}>
    <PopoverArrow />
  </PopoverContent>

  • Add popover arrow shadow color

  Select

  • Update select icon to use insetEnd instead of right for RTL.

  Skip Link

  • Update styles to use insetStart instead of left for RTL.

  Table

  • Update text align attribute to use end instead of right for RTL.

• Updated dependencies [1a04a41bd, c69d2b983, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• c69d2b983 Thanks @segunadebayo! - Fix issue where warn doesn't get called

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 799f3c803 #3752 Thanks @baptisteArno! - Take into account safe area insets for Toasts

• Updated dependencies [1a04a41bd, c69d2b983, 75817ec42, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 2287d82e3 #3715 Thanks @with-heart! - Resolved a peer dependency resolution issue reported by yarn2, npm7, and other more modern package managers
• Updated dependencies [1a04a41bd, 75817ec42, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• c69d2b983 Thanks @segunadebayo! - Fix issue where warn doesn't get called

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• 1a04a41bd Thanks @segunadebayo! - Update import of shared utils from react-utils to utils

• e481ba491 Thanks @segunadebayo! - - Extract functions from react-utils back to utils package

  • Remove withFlushSync function in favor of using a microtask callback
  • Import types for warn function

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [1a04a41bd, e481ba491]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [ac21d798a, 2287d82e3]

@chakra-ui/[email protected]

Patch Changes

• Updated dependencies [ac21d798a, 2287d82e3]

@chakra-ui/[email protected]

Patch Changes

• d79f5bce9 #3729 Thanks @navarroaxel! - Add docs for useMergeRefs hook

• 5f19da9db #3730 Thanks @navarroaxel! - Add docs for useBoolean hook

• 372b8f485 #3661 Thanks @navarroaxel! - Add docs for useOutsideClick hook

• Updated dependencies [ac21d798a, 1a04a41bd, c69d2b983, 2287d82e3, e481ba491]