State Management

useControllableState

Create components that support both controlled and uncontrolled state patterns.

import { useControllableState } from "saha-ui"

Uses

Simplify components that can be either controlled or uncontrolled by providing a single API to read and update value while calling `onChange` when appropriate.

Props

Name	Type	Description	Default
defaultValue	any	Default for uncontrolled mode.	-
value	any	Controlled value (optional).	-
onChange	function	Callback when value changes.	-

Returns

Name	Description
[currentValue, setValue]	Current value and setter that respects controlled/uncontrolled behavior and calls `onChange`.

Example

const [value, setValue] = useControllableState('a', props.value, props.onChange);

Notes

Internal state syncs to controlled value when provided; setter updates internal state only when uncontrolled.