Most Chakra components utilize
useControllableState for seamlessly managing
regardless of whether it's controlled or uncontrolled.
useControllableState hook returns the state and function that updates the
state, just like
Using this hook lets you use the initial state by default with an option
to control the state via control props (using
Here's an example of an uncontrolled state.
Here's an example of an controlled state.
This hook provides helpful error or warning messages when you switch between
controlled or uncontrolled modes or when you attempt to update the
|The value to used in controlled mode|
|The initial value to be used, in uncontrolled mode|
|The callback fired when the value changes|
|The condition to update the state|
|The component name this hook is used in|
|A mapping for the props to give more contextual warning messages.|