Class ContextMenuSubmenu

A context menu item that displays a submenu when hovered or clicked.

Submenus extend regular menu items and can contain their own menu items, shown in a child menu. They display a chevron icon to indicate that child items are available. Submenus open on hover (with a delay) or on click, and can be navigated using keyboard controls.

Example

const directionsSubmenu = new ContextMenuSubmenu({
  label: "Get directions",
  icon: "fa-solid fa-route"
});

const toHere = new ContextMenuItem({
  label: "Directions to here",
  icon: "fa-solid fa-arrow-right-to-arc"
});
toHere.on("click", ({ lngLat }) => {
  // Handle click
});

directionsSubmenu.addItem(toHere);
menu.addItem(directionsSubmenu);

Hierarchy (View Summary)

ContextMenuItem
- ContextMenuSubmenu

Index

Constructors

constructor

new ContextMenuSubmenu(options: ContextMenuSubmenuOptions): ContextMenuSubmenu
Creates a new submenu item.
Parameters
- options: ContextMenuSubmenuOptions
  Configuration options for the submenu item.
  
  Configuration options for creating a context menu submenu. Extends ContextMenuItemOptions with submenu-specific timing options.
  - OptionalbuttonClassName?: string
    Custom CSS class name for the menu item's <button> element.
  - OptionalclassName?: string
    Custom CSS class name for the menu item's <li> element.
  - Optionaldisabled?: boolean
    Whether the menu item is disabled. Defaults to false.
  - Optionalend?: Content
    Content to display after the label.
  - OptionalhideDelay?: number
    Delay in milliseconds before hiding the submenu when mouse leaves. Defaults to 200.
  - label: string
    The text label to display.
  - OptionalshowDelay?: number
    Delay in milliseconds before showing the submenu on hover. Defaults to 300.
  - Optionalstart?: Content
    Content to display before the label (e.g., an icon element).
Returns ContextMenuSubmenu
Overrides ContextMenuItem.constructor
- Defined in components/ContextMenuSubmenu/ContextMenuSubmenu.ts:71

Accessors

disabled

get disabled(): boolean
Gets whether the menu item is disabled.

Returns boolean
true if the menu item is disabled, false otherwise.
Inherited from ContextMenuItem.disabled
- Defined in components/ContextMenuItem/ContextMenuItem.ts:153
set disabled(value: boolean): void
Sets whether the menu item is disabled.
Parameters
- value: boolean
  true to disable the menu item, false to enable it.
Returns void
Inherited from ContextMenuItem.disabled
- Defined in components/ContextMenuItem/ContextMenuItem.ts:161

end

get end(): Content | undefined
Gets the end slot content of the menu item.

Returns Content | undefined
The end content (string or HTMLElement), or undefined if not set.
Inherited from ContextMenuItem.end
- Defined in components/ContextMenuItem/ContextMenuItem.ts:136
set end(value: Content | undefined): void
Sets the end slot content of the menu item.
Parameters
- value: Content | undefined
  A string (rendered as text) or HTMLElement, or undefined to remove.
Returns void
Inherited from ContextMenuItem.end
- Defined in components/ContextMenuItem/ContextMenuItem.ts:144

label

get label(): string
Gets the label text of the menu item.

Returns string
The current label text.
Inherited from ContextMenuItem.label
- Defined in components/ContextMenuItem/ContextMenuItem.ts:99
set label(value: string): void
Sets the label text of the menu item.
Parameters
- value: string
  The new label text to display.
Returns void
Inherited from ContextMenuItem.label
- Defined in components/ContextMenuItem/ContextMenuItem.ts:107

start

get start(): Content | undefined
Gets the start slot content of the menu item.

Returns Content | undefined
The start content (string or HTMLElement), or undefined if not set.
Inherited from ContextMenuItem.start
- Defined in components/ContextMenuItem/ContextMenuItem.ts:119
set start(value: Content | undefined): void
Sets the start slot content of the menu item.
Parameters
- value: Content | undefined
  A string (rendered as text) or HTMLElement, or undefined to remove.
Returns void
Inherited from ContextMenuItem.start
- Defined in components/ContextMenuItem/ContextMenuItem.ts:127

Methods

addItem

addItem(item: MenuItem): this
Adds a menu item to the submenu.
Parameters
- item: MenuItem
  The menu item to add. Can be a ContextMenuItem or ContextMenuSeparator.
Returns this
The submenu instance for method chaining.
- Defined in components/ContextMenuSubmenu/ContextMenuSubmenu.ts:83

blur

blur(): void
Removes focus from the menu item, removing the focused styling.

Returns void
Inherited from ContextMenuItem.blur
- Defined in components/ContextMenuItem/ContextMenuItem.ts:201

click

click(): void
Programmatically triggers a click on the menu item. Only works if the item is not disabled. This will fire the "click" event with the current context data.

Returns void
Inherited from ContextMenuItem.click
- Defined in components/ContextMenuItem/ContextMenuItem.ts:211

fire

fire<K extends keyof ContextMenuItemEvents>(
type: K,
event: ContextMenuItemEvents[K],
): this
Fires an event, calling all registered handlers for the event type.
Type Parameters
- K extends keyof ContextMenuItemEvents
Parameters
- type: K
  The event type to fire.
- event: ContextMenuItemEvents[K]
  The event data to pass to the handlers.
Returns this
The instance for method chaining.
Inherited from ContextMenuItem.fire
- Defined in util/evented.ts:45

focus

focus(): void
Focuses the menu item, adding the focused styling. Only works if the item is not disabled.

Returns void
Inherited from ContextMenuItem.focus
- Defined in components/ContextMenuItem/ContextMenuItem.ts:191

insertItem

insertItem(index: number, item: MenuItem): this
Inserts a menu item into the submenu at the specified index.
Parameters
- index: number
  The index at which to insert the item. If the index is out of bounds, the item will be added at the end.
- item: MenuItem
  The menu item to insert. Can be a ContextMenuItem or ContextMenuSeparator.
Returns this
The submenu instance for method chaining.
- Defined in components/ContextMenuSubmenu/ContextMenuSubmenu.ts:94

listens

listens<K extends keyof ContextMenuItemEvents>(type: K): boolean
Checks whether there are any registered handlers for the specified event type.
Type Parameters
- K extends keyof ContextMenuItemEvents
Parameters
- type: K
  The event type to check.
Returns boolean
true if there are registered handlers for the event type, false otherwise.
Inherited from ContextMenuItem.listens
- Defined in util/evented.ts:60

off

off<K extends keyof ContextMenuItemEvents>(
type: K,
handler: EventHandler<ContextMenuItemEvents[K]>,
): this
Unregisters an event handler for the specified event type.
Type Parameters
- K extends keyof ContextMenuItemEvents
Parameters
- type: K
  The event type to stop listening for.
- handler: EventHandler<ContextMenuItemEvents[K]>
  The function to remove from the event handlers.
Returns this
The instance for method chaining.
Inherited from ContextMenuItem.off
- Defined in util/evented.ts:28

on

on<K extends keyof ContextMenuItemEvents>(
type: K,
handler: EventHandler<ContextMenuItemEvents[K]>,
): this
Registers an event handler for the specified event type.
Type Parameters
- K extends keyof ContextMenuItemEvents
Parameters
- type: K
  The event type to listen for.
- handler: EventHandler<ContextMenuItemEvents[K]>
  The function to call when the event is fired.
Returns this
The instance for method chaining.
Inherited from ContextMenuItem.on
- Defined in util/evented.ts:14

remove

remove(): this
Removes the menu item from the DOM and cleans up all event listeners and references.

Returns this
The menu item instance for method chaining.
Overrides ContextMenuItem.remove
- Defined in components/ContextMenuSubmenu/ContextMenuSubmenu.ts:143

removeItem

removeItem(item: MenuItem): this
Removes a menu item from the submenu, doing any clean up necessary.
Parameters
- item: MenuItem
  The menu item to remove.
Returns this
The submenu instance for method chaining.
- Defined in components/ContextMenuSubmenu/ContextMenuSubmenu.ts:104

Class ContextMenuSubmenu

Example

Hierarchy (View Summary)

Index

Constructors

Accessors

Methods

Constructors

constructor

Parameters

OptionalbuttonClassName?: string

OptionalclassName?: string

Optionaldisabled?: boolean

Optionalend?: Content

OptionalhideDelay?: number

label: string

OptionalshowDelay?: number

Optionalstart?: Content

Returns ContextMenuSubmenu

Accessors

disabled

Returns boolean

Parameters

Returns void

end

Returns Content | undefined

Parameters

Returns void

label

Returns string

Parameters

Returns void

start

Returns Content | undefined

Parameters

Returns void

Methods

addItem

Parameters

Returns this

blur

Returns void

click

Returns void

fire

Type Parameters

Parameters

Returns this

focus

Returns void

insertItem

Parameters

Returns this

listens

Type Parameters

Parameters

Returns boolean

off

Type Parameters

Parameters

Returns this

on

Type Parameters

Parameters

Returns this

remove

Returns this

removeItem

Parameters

Returns this

Settings

On This Page

`Optional`buttonClassName?: string

`Optional`className?: string

`Optional`disabled?: boolean

`Optional`end?: Content

`Optional`hideDelay?: number

`Optional`showDelay?: number

`Optional`start?: Content