Founding price: $35, then $99 after 23:59 UTC on 4 November, then $99
Get ProAn accordion that remembers which sections were open in localStorage, restores them after hydration, drops values that no longer exist and works when storage is blocked.
Derived from this item’s props table, because it declares no controls of its own. This item has no standalone playground, so changes update the code, the share link and the AI prompt.
Use this for sidebars, filter panels and settings navigation that people configure once and expect to stay that way.
Do not use it for state that must be shared between devices or people; keep that on the server.
This item is part of tealmac UI Pro
The source for this item installs with a Pro licence key. Log in with your key to see the install command, or read the Pro setup page.
| Prop | Type | Default | Description |
|---|---|---|---|
storageKey | string | - | Unique key; stored as accordion:<key>. |
sections | { value, title, content }[] | - | Sections. |
defaultOpen | string[] | [] | Open sections when nothing is stored. |
defaultOpen, and the stored state is applied in an effect, so server and client markup agree.| Key | Action |
|---|---|
| Enter or Space | toggles a section (and saves it) |
The pattern ships a Testing Library test (accordion-persisted.test.tsx) that covers defaults, saving and restoring, invalid stored values and blocked storage.