title | description | releaseUrl | releaseDate | version |
---|---|---|---|---|
Version 2.3.0 |
Explore the changelog for Chakra UI version 2.3.0. Learn about the latest features, bug fixes, and improvements. |
August 29, 2022 |
2.3.0 |
-
Added support for changing avatar badge placement. The badge placement can be set to
top-start
,top-end
,bottom-start
orbottom-end
.<Avatar name="Uchiha Itachi" src="https://uinames.com/api/photos/female/18.jpg" > <AvatarBadge placement="top-start" /> </Avatar>
-
Added
defineStyle
anddefineStyleConfig
to improve the TypeScript authoring experience of style objects and single part component themes.import { defineStyleConfig, defineStyle } from "@chakra-ui/styled-system" // authoring style objects const style = defineStyle({ marginTop: "20px", }) // authoring style configs for single part component const button = defineStyleConfig({ baseStyle: {}, variants: {}, defaultProps: {}, })
-
Added
createMultiStyleConfigHelpers
factory that provides functions that help improve the TypeScript authoring experience of multipart component themes.import { createMultiStyleConfigHelpers } from "@chakra-ui/styled-sytem" // create scoped helpers for that defined parts const helpers = createMultiStyleConfigHelpers(["button", "label"]) const { definePartsStyle, defineMultiStyleConfig } = helpers // authoring styles for each part const outlineVariant = definePartsStyle({ button: {}, label: {}, }) // authoring styles for multipart component const accordion = defineMultiStyleConfig({ baseStyle: { button: {}, label: {}, }, variants: { outline: outlineVariant, }, })
- Refactored the theme to use design tokens and css variables.
- Improved support for
100vh
values by using a polyfill css variable--chakra-vh
.
- Added support for styling slider mark from the theme
- Updated package to use styled-system as dependency
- Fixed issue where generic type contraints throws in TypeScript 4.8+
- Fixed issue where select theme throws when
field
part is not defined
- Refactored to use the new helpers from
styled-system
package
- Fixed key warning for tabs component
- Refactored alert theme to use css variables
- Refactored the theme to use design tokens and css variables as much as possible.
- Improved support for
100vh
values by using a polyfill css variable--chakra-vh
. - Refactored to use the new helpers from
styled-system
package
- Refactored code to use from
styled-system
package
- Fixdd issue where toast double update doesn't work
- Fixed regression in
addPointerEvent
utility
- Removed default value of portalZIndex