DocsAPI referenceUI machinescontext-menu

context-menu machine

The public state machine contract for @grassroot/ui-machines/context-menu. The machine owns behaviour; the matching headless layer owns composition.

@grassroot/ui-machines/context-menu

Package

18 exports
View source packages/ui-machines/src/context-menu/index.ts

Service example

context-menu.tsts
import { createService } from "@grassroot/statechart";
import { contextMenuMachine } from "@grassroot/ui-machines/context-menu";
const service = createService(contextMenuMachine, { input: {} });
service.start();
service.send({ type: "…" });
service.stop();

Exports

DeclarationView source
ContextMenuActionablets
interface ContextMenuActionable {
readonly id: string;
readonly disabled?: boolean;
readonly textValue?: string;
}
Name
Kind
Type
Requirement
disabled
property
boolean
optional
id
property
string
required
textValue
property
string
optional
Name
disabled
Kind
property
Type
boolean
Requirement
optional
Name
id
Kind
property
Type
string
Requirement
required
Name
textValue
Kind
property
Type
string
Requirement
optional
DeclarationView source
ContextMenuChangeReasonts
type ContextMenuChangeReason = ContextMenuOpenReason | ContextMenuCloseReason;
DeclarationView source
ContextMenuCloseReasonts
type ContextMenuCloseReason = "escape" | "outside-click" | "select" | "programmatic";
DeclarationView source
ContextMenuCommandts
type ContextMenuCommand = (CommandObject & {
readonly type: "OPEN_CHANGE_REQUEST";
readonly open: boolean;
readonly reason: ContextMenuChangeReason;
}) | (CommandObject & {
readonly type: "SELECT_ITEM";
readonly id: string;
}) | ScheduleCommand<ContextMenuEvent> | CancelCommand;
DeclarationView source
ContextMenuContextts
type ContextMenuContext = {
readonly mode: "controlled" | "uncontrolled";
readonly position: ContextMenuPosition | null;
/** Original item index. Divider gaps are retained. */
readonly highlightedIndex: number;
readonly typeaheadBuffer: string;
};
Name
Kind
Type
Requirement
Description
highlightedIndex
property
number
required
Original item index. Divider gaps are retained.
mode
property
"controlled" | "uncontrolled"
required
position
property
ContextMenuPosition | null
required
typeaheadBuffer
property
string
required
Name
highlightedIndex
Kind
property
Type
number
Requirement
required
Description
Original item index. Divider gaps are retained.
Name
mode
Kind
property
Type
"controlled" | "uncontrolled"
Requirement
required
Description
Name
position
Kind
property
Type
ContextMenuPosition | null
Requirement
required
Description
Name
typeaheadBuffer
Kind
property
Type
string
Requirement
required
Description
DeclarationView source
ContextMenuDiagnosticCodests
export declare const ContextMenuDiagnosticCodes: readonly DiagnosticCatalogueEntry[];

ContextMenuDivider

interface
DeclarationView source
ContextMenuDividerts
interface ContextMenuDivider {
readonly divider: true;
}
Name
Kind
Type
Requirement
divider
property
true
required
Name
divider
Kind
property
Type
true
Requirement
required
DeclarationView source
ContextMenuEventts
type ContextMenuEvent = {
readonly type: "OPEN_AT";
readonly position: ContextMenuPosition;
readonly reason: ContextMenuOpenReason;
} | {
readonly type: "OPEN";
readonly reason: "programmatic";
} | {
readonly type: "CLOSE";
readonly reason: ContextMenuCloseReason;
} | {
readonly type: "MOVE";
readonly direction: -1 | 1;
} | {
readonly type: "HIGHLIGHT";
readonly index: number;
} | {
readonly type: "SELECT";
} | {
readonly type: "TYPEAHEAD";
readonly char: string;
};
DeclarationView source
ContextMenuInputts
type ContextMenuInput = {
/** Controlled open state. Defining it fixes controlled mode at first start. */
readonly open?: boolean;
/** Uncontrolled initial open state. */
readonly defaultOpen?: boolean;
/** Position used by defaultOpen or programmatic OPEN when no pointer exists. */
readonly defaultPosition?: ContextMenuPosition;
/** The original entry list, including divider rows. */
readonly items: readonly ContextMenuItem[];
readonly typeaheadTimeoutMs?: number;
};
Name
Kind
Type
Requirement
Description
defaultOpen
property
boolean
optional
Uncontrolled initial open state.
defaultPosition
property
ContextMenuPosition
optional
Position used by defaultOpen or programmatic OPEN when no pointer exists.
items
property
readonly ContextMenuItem[]
required
The original entry list, including divider rows.
open
property
boolean
optional
Controlled open state. Defining it fixes controlled mode at first start.
typeaheadTimeoutMs
property
number
optional
Name
defaultOpen
Kind
property
Type
boolean
Requirement
optional
Description
Uncontrolled initial open state.
Name
defaultPosition
Kind
property
Type
ContextMenuPosition
Requirement
optional
Description
Position used by defaultOpen or programmatic OPEN when no pointer exists.
Name
items
Kind
property
Type
readonly ContextMenuItem[]
Requirement
required
Description
The original entry list, including divider rows.
Name
open
Kind
property
Type
boolean
Requirement
optional
Description
Controlled open state. Defining it fixes controlled mode at first start.
Name
typeaheadTimeoutMs
Kind
property
Type
number
Requirement
optional
Description
DeclarationView source
ContextMenuItemts
type ContextMenuItem = ContextMenuActionable | ContextMenuDivider;
DeclarationView source
contextMenuMachinets
export declare const contextMenuMachine: ContextMenuMachine;
DeclarationView source
ContextMenuMachinets
type ContextMenuMachine = Machine<ContextMenuInput, ContextMenuStateValue, ContextMenuContext, ContextMenuEvent, ContextMenuCommand>;
DeclarationView source
ContextMenuOpenReasonts
type ContextMenuOpenReason = "pointer" | "programmatic";
DeclarationView source
ContextMenuPositionts
type ContextMenuPosition = {
readonly x: number;
readonly y: number;
};
Name
Kind
Type
Requirement
x
property
number
required
y
property
number
required
Name
x
Kind
property
Type
number
Requirement
required
Name
y
Kind
property
Type
number
Requirement
required
DeclarationView source
contextMenuReplaySequencets
export declare const contextMenuReplaySequence: readonly ContextMenuEvent[];
DeclarationView source
contextMenuSelectorsts
export declare const contextMenuSelectors: {
open: (snapshot: ContextMenuSnapshot) => boolean;
position: (snapshot: ContextMenuSnapshot) => ContextMenuPosition | null;
highlightedIndex: (snapshot: ContextMenuSnapshot) => number;
typeaheadBuffer: (snapshot: ContextMenuSnapshot) => string;
};
Name
Kind
Type
Requirement
highlightedIndex
property
(snapshot: ContextMenuSnapshot) => number
required
open
property
(snapshot: ContextMenuSnapshot) => boolean
required
position
property
(snapshot: ContextMenuSnapshot) => ContextMenuPosition | null
required
typeaheadBuffer
property
(snapshot: ContextMenuSnapshot) => string
required
Name
highlightedIndex
Kind
property
Type
(snapshot: ContextMenuSnapshot) => number
Requirement
required
Name
open
Kind
property
Type
(snapshot: ContextMenuSnapshot) => boolean
Requirement
required
Name
position
Kind
property
Type
(snapshot: ContextMenuSnapshot) => ContextMenuPosition | null
Requirement
required
Name
typeaheadBuffer
Kind
property
Type
(snapshot: ContextMenuSnapshot) => string
Requirement
required
DeclarationView source
ContextMenuSnapshotts
type ContextMenuSnapshot = Snapshot<ContextMenuStateValue, ContextMenuContext>;
DeclarationView source
ContextMenuStateValuets
type ContextMenuStateValue = "open" | "closed";