fix(deps): update dependency @chakra-ui/react to v3 #110
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
![renovate[bot]](https://avatars.githubusercontent.com/in/2740?s=60&v=4){kind=small}
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR contains the following updates:
^2.8.2->^3.0.0Release Notes
chakra-ui/chakra-ui (@chakra-ui/react)
v3.0.0Major Changes
#8153
7b6e66aThanks @segunadebayo! - Prepares the ground
for the next version Chakra that leverages Ark UI.
User Facing
Infrastructure
jesttovitesttsupto customrollupsetup for better bundling strategy#8815
806be96Thanks @isBatak! - Remove the
@chakra-ui/hookspackage in favour of using dedicated, robust libraries like
react-useandusehooks-tsMinor Changes
#8121
170198fThanks @kkieninger! - ### Fixed
Avatar component
Added
accentColorproperty to style propsasChildin chakra factorytoastStorefromtoastcomponentframer-motionto allow for skipAnimationspreserveScrollBarGapChanged
Redesign the component themes and anatomy
192c6b1Thanks @segunadebayo! - Add new fieldset
component
07b04b1Thanks @segunadebayo! - - [NEW]: Add
RatingGroup,SegmentControlEmptyStatecomponent for empty statesRadioCardandCheckboxCardcomponents for card-basedselection
#8568
5fd993bThanks @isBatak! - Add Collapsible recipe with
default open/close animation
3fc49caThanks @segunadebayo! - Add support for
FormatNumberandFormatBytecomponents3ccbbdfThanks @segunadebayo! - ### Motion Styles
Add support for
motionStyleprops.The idea is to pair them with text styles and layer styles to create this
three-part mixin that can make your styles a lot cleaner.
Motion styles focus solely on animations, allowing you to orchestrate
animation properties.
Built-in Keyframe Animations
Chakra new provides built-in keyframe animations that you can use to create
your own motion styles.
Slide:
slide-from-top,slide-from-bottom,slide-from-left,slide-from-right,slide-to-top,slide-to-bottom,slide-to-left,slide-to-rightSlide Full:
slide-from-top-full,slide-from-bottom-full,slide-from-left-full,slide-from-right-full,slide-to-top-full,slide-to-bottom-full,slide-to-left-full,slide-to-right-fullFade:
fade-in,fade-outScale:
scale-in,scale-outYou can compose these animations using the
animationNameproperty in yourmotion styles to create really cool animations. No JS required.
3ccbbdfThanks @segunadebayo! - Add support for
built-in layer styles to help prototype faster with automatic dark mode.
Paired with
colorPalette, you can create beautiful designs with little codethat adapts to dark mode automatically.
Fill Layer Styles:
fill.muted,fill.solid,fill.surfaceBorder Layer Styles:
outline.muted,outline.solidIndicator Styles:
indicator.top,indicator.end,indicator.bottom,indicator.startDisabled Styles:
disabledYou can combine these layer styles to create very complex designs with little
code.
de9c0a0Thanks @segunadebayo! - Add
DataListcomponent
e77a9b8Thanks @segunadebayo! - - Add new Timeline
component to presenting chronological information or activities.
classNamein the DOM.neutralstatus toAlertcomponent763329eThanks @segunadebayo! - Add preset and
preset-base entrypoints.
presetentrypoint exposes the default theme and recipes for Chakra.preset-baseentrypoint exposes the base utilities and conditions usedinternally.
925cfd9Thanks @segunadebayo! - Add ActionBar,
Status, Rating, Pagination components
e9a1537Thanks @segunadebayo! - BREAKING: Change
signature of
useRecipe,useSlotRecipe,createSlotRecipeContextcreateSlotRecipeContext
Before:
After:
useSlotRecipe
Before:
After:
3908155Thanks @segunadebayo! - Rename
createStyleContexttocreateSlotRecipeContextc654ee3Thanks @segunadebayo! - Improve performance
of styled components to avoid unneeded re-renders.
edec8f7Thanks @segunadebayo! - Add clipboard
composition
5093e18Thanks @segunadebayo! - Add cursor pointer
to button
4c6838cThanks @segunadebayo! - - Rename
onLabeland
offLabeltotrackLabelthumbLabelprop for rendering an icon within thumb#8393
623e558Thanks @segunadebayo! - - Integrate Ark UI
components to reduce maintenance surface.
FileUploadcomponenttrigger=hoverin favor ofHoverCardTooltip,PopoverandHoverCardwith those from Ark UI945a777Thanks @segunadebayo! - BREAKING: Integrate
Ark v4. This mostly affects the custom select component that requires the use
of
createListCollectionnow.c26acf0Thanks @segunadebayo! - Add support for
cursor token type
55c0839Thanks @segunadebayo! - Move the
Prosecomponent to snippets so it can be customized by the user.
952647aThanks @segunadebayo! - Add
CardTitleandCardDescriptioncomponentsf4762bfThanks @segunadebayo! - Add support for
merging multiple system configs into one within
createSystemBefore:
After:
#8218
a89c598Thanks @segunadebayo! - Add support for
custom theme conditions or pseudo props via
theme.conditionsThis allows you to use the pseudo prop in your components
For TypeScript users, you need to use the Chakra CLI to generate the types
for your custom conditions.
c2f45caThanks @segunadebayo! - Rename
Fieldset.ControltoFieldset.Content1738b90Thanks @segunadebayo! - - Icon: Set
asChildtotrueby default to reduce repetitionAll components
at 20px, larger elements start at 40px
Input, Textarea: Rename
filledvariant tosubtleTags: Add new
Tag.StartElementandTag.EndElementcomponents to allowfor easier styling of the start and end elements
3ccbbdfThanks @segunadebayo! - Redesign
Steppercomponent. It's now called
Stepsand manages the state internally, no needto use
useStepsanymore.We've also improved the accessibility of the component by leveraging the tabs
pattern and adding the required ARIA attributes.
Using the CLI, you can also scaffold an already composed stepper component
548470dThanks @segunadebayo! - Add custom select
from Ark UI and design recipe
8b110daThanks @segunadebayo! - Support inlining
recipe in
createRecipeContextandcreateSlotRecipeContextfor better DXwhen shipping libraries based on Chakra.
This reduces the need for using the Chakra CLI to generate types for custom
components.
05793a2Thanks @segunadebayo! - - Make
graythedefault color palette.
36pxfor consistency.bgfor outline component variants.43f2c7dThanks @segunadebayo! - - CheckboxCard
[New]
Add support for a new
CheckboxCardcomponent that can be used to render acard with a checkbox.
Checkmark [New]
Add new checkmark component for rendering a static checkmark icon with the
checked,disabled, andindeterminatestate baked in.EmptyState [New]
Add new
EmptyStatecomponent for rendering an empty state message with atitle, description, and optional action button.
e119ae9Thanks @segunadebayo! - Rename
motionStyletoanimationStylefor better intuitiveness#8575
d4522d9Thanks @isBatak! - Align theme recipe name with
panda
3ccbbdfThanks @segunadebayo! - Add support for
focusRingandfocusRingColorstyle props that allow to quickly style focusvisible state of form controls.
The focus ring values can be either
extendorcontain4ff153fThanks @segunadebayo! - Speed up
intellisence for style props, and add support for
strictTokensin the CLI.47a8a9eThanks @segunadebayo! - - Add
inherittoSpinner recipe size
b6d1d0dThanks @segunadebayo! - Simplify spinner
component to use less custom props.
emptyColor, prefer to use--spinner-track-colorspeed, prefer to useanimationDurationthickness, prefer to useborderWidth#8218
a89c598Thanks @segunadebayo! - Add support for
_openand_closedpseudo props for styling their respective selectors._open:&[data-state=open], &[open]_closed:&[data-state=closed]_groupOpen:[data-group][data-state=open] &_groupClosed:[data-group][data-state=closed] &Extend the existing pseudo props to support new selectors`
_placeholdernow supports&[data-placeholder]_placeholderShownow supports&[data-placeholder-shown]_fullscreennow supports&[data-fullscreen]_emptynow supports&[data-empty]_expandednow supports&[data-state=expanded]_checkednow supports&[data-state-checked]#8569
eb26857Thanks @isBatak! - Fix the
boxSizetype toallow number values.
47b3b5aThanks @segunadebayo! - Support array in
conditions object. This matches the API in Panda CSS and allow users to define
complex selectors like media hover queries.
e4f2df0Thanks @segunadebayo! - Add
Prosecomponent to help style markdown content.
c243698Thanks @segunadebayo! - - Add
referrerPolicy to Avatar component.
mutedandsubtlecolor tokensPatch Changes
be98566Thanks @segunadebayo! - Fix checkbox and
toast on mobile
c941971Thanks @segunadebayo! - - Convert
Tabscomponent to use Ark UI
NumberInputto use Ark UI#8795
4408573Thanks @TylerAPfledderer! - Adds style
prop names to
LayerStylePropertyunion type83366c4Thanks @segunadebayo! - - Fix regression in
mergeConfigsDecompose
Fieldcomponents into smaller components, which can beoptionally used with
FieldLabelwhich is a generic label componentErrorMessagewhich is a generic error message componentHelpTextwhich is a generic help text componentRefactor components to use Ark UI: Avatar, Progress, CircularProgress,
PinInput
0ae054dThanks @segunadebayo! - Fix issue where
hideFromandhideBelowdoesn't show any autocompletions0a03bccThanks @segunadebayo! - - Fix circular
progress element types
#8617
7e9fbf0Thanks @isBatak! - Refactor text-styles to use
tokens instead of raw values.
6d4cbbeThanks @segunadebayo! - Fix ES module
interop for @emotion/is-prop-value that makes Jest throw error.
#8857
fdc2b9bThanks @stevensecreti! - update mapObject
util to not call fn provided on nullish values
788f493Thanks @segunadebayo! - Fix issue where
media query css order is inconsistent with v2
87cf70cThanks @segunadebayo! - Revert text recipe
to prevent color regressions
#8740
d5a225fThanks @Pagebakers! - Use correct extension
for ESM exports
#8905
807a581Thanks @stevensecreti! - Added transform
function to backgroundClip to appropriately handle 'text' value
#8739
651561bThanks @Pagebakers! - Added /anatomy to
exports
#8792
4dd77ecThanks @TylerAPfledderer! - Updates the
exposed list of slot anatomy to ensure all anatomy is included for use in
type-checking extend recipe configs.
bffb68fThanks @segunadebayo! - - Pagination:
Fix issue page props were not forwarded correctly.
#8601
1867d66Thanks @isBatak! - Fix
blurproperty tokenconversion to CSS variable.
32a454dThanks @segunadebayo! - Add missing
use clientdirectives to several components#8854
388716dThanks @codebutler! - Fix issue where target
was not passed to link overlay
#8475
9224f4eThanks @ryo-manba! - Add
aria-currentattribute to stepper
Configuration
📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).
🚦 Automerge: Disabled by config. Please merge this manually once you are satisfied.
♻ Rebasing: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.
🔕 Ignore: Close this PR and you won't be reminded about this update again.
This PR was generated by Mend Renovate. View the repository job log.