A hook that manages controlled/uncontrolled component state.
Count: 0
valueT | undefinedundefineddefaultValueTonChange(value: T) => voidundefined| Prop | Type | Default |
|---|---|---|
value | T | undefined | undefined |
defaultValue | T | - |
onChange | (value: T) => void | undefined |
[0]T[1](next: T | ((prev: T) => T)) => void| Prop | Type | Default |
|---|---|---|
[0] | T | - |
[1] | (next: T | ((prev: T) => T)) => void | - |
import { useControllableState } from '@k8ordo/ui';const [count, setCount] = useControllableState({ defaultValue: 0 });
return (
<div>
<button onClick={() => setCount(prev => prev + 1)}>Increment</button>
<button onClick={() => setCount(0)}>Reset</button>
<p>Count: {count}</p>
</div>
);