Reference headless

defaultOpen?: optional defaultOpen?: boolean
###### Inherited from

CreateMenuInput.defaultOpen
id?: optional id?: string
items: items: readonly MenuItem[]
###### Inherited from

CreateMenuInput.items
navigation?: optional navigation?: "wrap" | "clamp"
Default 'wrap' — APG menus wrap by default.

###### Inherited from

CreateMenuInput.navigation
onOpenChange?: optional onOpenChange?: (open) => void
###### Parameters

###### open

boolean

###### Returns

void
onSelect?: optional onSelect?: (item) => void
Fired with the item object whenever ACTIVATE succeeds for that item.

###### Parameters

###### item

MenuItem

###### Returns

void

interface

# MenuContext

Members

activatedId: activatedId: string | null
Last activated item id. Bumped on ACTIVATE; the controller observes this and fires the consumer's onSelect callback. Cleared on CLOSE.
highlightedId: highlightedId: string | null
items: items: readonly MenuItem[]
typeahead: typeahead: string
Type-ahead buffer. Layer 3 resets via TYPEAHEAD.RESET after a quiet ms.

interface menu/index.ts · L46

# MenuController

Members

context: readonly context: Readonly<MenuContext>
highlightedId: readonly highlightedId: string | null
id: readonly id: string
machine: readonly machine: MenuMachine
menu: readonly menu: Attachment
menuId: readonly menuId: string
open: readonly open: boolean
state: readonly state: MenuState
trigger: readonly trigger: Attachment
triggerId: readonly triggerId: string
activate(): activate(itemId): void
###### Parameters

###### itemId

string

###### Returns

void
hide(): hide(): void
###### Returns

void
item(): item(item): Attachment
###### Parameters

###### item

MenuItem

###### Returns

Attachment
itemElementId(): itemElementId(itemId): string
###### Parameters

###### itemId

string

###### Returns

string
setItems(): setItems(items): void
###### Parameters

###### items

readonly MenuItem[]

###### Returns

void
show(): show(): void
###### Returns

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

###### listener

(snapshot) => void

###### Returns

() => void
toggle(): toggle(): void
###### Returns

void

interface

# MenuItem

Members

disabled?: readonly optional disabled?: boolean
###### Overrides

CollectionItem.disabled
id: readonly id: string
###### Overrides

CollectionItem.id
kind?: readonly optional kind?: MenuItemKind
label?: readonly optional label?: string
###### Overrides

CollectionItem.label

type Type Aliases 4

type menu/index.ts · L42

# Attachment

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

Parameters

node: HTMLElement

Returns

void | (() => void)

type

# MenuEvent

MenuEvent = { type: "OPEN"; } | { type: "CLOSE"; } | { type: "TOGGLE"; } | { type: "ESCAPE"; } | { id: string; type: "ACTIVATE"; } | { id: string | null; type: "HIGHLIGHT"; } | { direction: NavigateDirection; type: "NAVIGATE"; } | { char: string; type: "TYPEAHEAD"; } | { type: "TYPEAHEAD.RESET"; } | { items: ReadonlyArray<MenuItem>; type: "SET.ITEMS"; }

type

# MenuMachine

MenuMachine = Machine<MenuContext, MenuEvent, MenuState>

type

# MenuState

MenuState = "closed" | "open"

function Functions 1

function menu/index.ts · L79

# createMenu ( )

createMenu(options): MenuController

Parameters

options: CreateMenuOptions

Returns

MenuController