GitHub

Reference headless

accordion

interface 4 type 5 function 1
interface Interfaces 4
interface

# AccordionContext

Type Parameters

V

Members

collapsible
collapsible: boolean

When mode='single', whether the only-open panel can be collapsed.

expandedIds
expandedIds: readonly string[]

Item ids currently in the expanded set.

focusedId
focusedId: string | null

Item id with keyboard focus, or null.

items
items: readonly AccordionItem<V>[]
mode
mode: AccordionMode
interface accordion/index.ts · L34

# AccordionController

Type Parameters

V

Members

context
readonly context: Readonly<AccordionContext<V>>
expandedIds
readonly expandedIds: readonly string[]
focusedId
readonly focusedId: string | null
id
readonly id: string
machine
readonly machine: AccordionMachine<V>
mode
readonly mode: AccordionMode
root
readonly root: Attachment
state
readonly state: "idle"
collapse()
collapse(id): void

###### Parameters

###### id

string

###### Returns

void

expand()
expand(id): void

###### Parameters

###### id

string

###### Returns

void

item()
item(item): Attachment

###### Parameters

###### item

AccordionItem<V>

###### Returns

Attachment

panel()
panel(item): Attachment

###### Parameters

###### item

AccordionItem<V>

###### Returns

Attachment

panelElementId()
panelElementId(itemId): string

###### Parameters

###### itemId

string

###### Returns

string

setCollapsible()
setCollapsible(value): void

###### Parameters

###### value

boolean

###### Returns

void

setItems()
setItems(items): void

###### Parameters

###### items

readonly AccordionItem<V>[]

###### Returns

void

setMode()
setMode(mode): void

###### Parameters

###### mode

AccordionMode

###### Returns

void

setValue()
setValue(value): void

###### Parameters

###### value

V | readonly V[] | null

###### Returns

void

subscribe()
subscribe(listener): () => void

###### Parameters

###### listener

(snapshot) => void

###### Returns

() => void

toggle()
toggle(id): void

###### Parameters

###### id

string

###### Returns

void

trigger()
trigger(item): Attachment

###### Parameters

###### item

AccordionItem<V>

###### Returns

Attachment

triggerElementId()
triggerElementId(itemId): string

DOM ids for ARIA wiring.

###### Parameters

###### itemId

string

###### Returns

string

interface

# AccordionItem

Type Parameters

V

Members

disabled?
readonly optional disabled?: boolean

###### Overrides

CollectionItem.disabled

id
readonly id: string

###### Overrides

CollectionItem.id

label?
readonly optional label?: string

###### Overrides

CollectionItem.label

value
readonly value: V
interface accordion/index.ts · L66

# CreateAccordionOptions

Type Parameters

V

Members

collapsible?
optional collapsible?: boolean

When mode='single' (default), allow closing the only-open. Default true.

###### Inherited from

CreateAccordionInput.collapsible

defaultValue?
optional defaultValue?: V | readonly V[] | null

Initial value(s). For single, V or null; for multiple, V[].

###### Inherited from

CreateAccordionInput.defaultValue

id?
optional id?: string
items
items: readonly AccordionItem<V>[]

###### Inherited from

CreateAccordionInput.items

mode?
optional mode?: AccordionMode

###### Inherited from

CreateAccordionInput.mode

navigation?
optional navigation?: "wrap" | "clamp"

Whether arrow navigation wraps (default per APG) or clamps.

###### Inherited from

CreateAccordionInput.navigation

onValueChange?
optional onValueChange?: (expandedIds) => void

###### Parameters

###### expandedIds

readonly string[]

###### Returns

void

type Type Aliases 5
type

# AccordionEvent

AccordionEvent<V> = { id: string; type: "TOGGLE"; } | { id: string; type: "EXPAND"; } | { id: string; type: "COLLAPSE"; } | { id: string; type: "FOCUS"; } | { type: "BLUR"; } | { direction: NavigateDirection; type: "NAVIGATE"; } | { items: ReadonlyArray<AccordionItem<V>>; type: "SET.ITEMS"; } | { type: "SET.VALUE"; value: ReadonlyArray<V> | V | null; } | { mode: AccordionMode; type: "SET.MODE"; } | { type: "SET.COLLAPSIBLE"; value: boolean; }

Type Parameters

V
type

# AccordionMode

AccordionMode = "single" | "multiple"
type

# AccordionState

AccordionState = "idle"
type accordion/index.ts · L32

# Attachment

Attachment = (node) => void | (() => void)

Parameters

node
HTMLElement

Returns

void | (() => void)
function Functions 1