Component-Specific

useAccordion

Manage accordion state with expand/collapse controls and multi-expansion support.

import { useAccordion } from "saha-ui"

Uses

Manage accordion state for single- or multi-expand UIs. Supports controlled and uncontrolled usage and optional collapsible items.

Props

NameTypeDescriptionDefault
type"single" | "multiple"Mode of accordion."single"
valuestring | string[]Controlled value.-
defaultValuestring | string[]Default value for uncontrolled mode.-
onValueChangefunctionCallback when value changes.-
collapsiblebooleanAllow collapsing the currently open item.false

Returns

NameDescription
valueCurrent value (string or string[]).
handleValueChange(itemValue)Toggle/open item handler.
isItemOpen(itemValue)Boolean check whether an item is open.
typeCurrent accordion type.
collapsibleWhether items are collapsible.

Example

const { value, handleValueChange, isItemOpen } = useAccordion({ type: 'single', defaultValue: 'item-1', collapsible: true });

Notes

Works with both controlled and uncontrolled patterns; call `handleValueChange` from item headers to toggle items.
Saha UI - The Modern React Component Library