blockly 12.0.0-beta.1 → 12.0.0-beta.2

package/core/block_flyout_inflater.d.ts

@@ -16,7 +16,6 @@ import type { WorkspaceSvg } from './workspace_svg.js';
 export declare class BlockFlyoutInflater implements IFlyoutInflater {
     protected permanentlyDisabledBlocks: Set<BlockSvg>;
     protected listeners: Map<string, browserEvents.Data[]>;
-    protected flyoutWorkspace?: WorkspaceSvg;
     protected flyout?: IFlyout;
     private capacityWrapper;
     /**
@@ -27,10 +26,10 @@ export declare class BlockFlyoutInflater implements IFlyoutInflater {
      * Inflates a flyout block from the given state and adds it to the flyout.
      *
      * @param state A JSON representation of a flyout block.
-     * @param flyoutWorkspace The workspace to create the block on.
+     * @param flyout The flyout to create the block on.
      * @returns A newly created block.
      */
-    load(state: object, flyoutWorkspace: WorkspaceSvg): FlyoutItem;
+    load(state: object, flyout: IFlyout): FlyoutItem;
     /**
      * Creates a block on the given workspace.
      *
@@ -60,11 +59,11 @@ export declare class BlockFlyoutInflater implements IFlyoutInflater {
      */
     protected removeListeners(blockId: string): void;
     /**
-     * Updates this inflater's flyout workspace.
+     * Updates this inflater's flyout.
      *
-     * @param workspace The workspace of the flyout that owns this inflater.
+     * @param flyout The flyout that owns this inflater.
      */
-    protected setFlyoutWorkspace(workspace: WorkspaceSvg): void;
+    protected setFlyout(flyout: IFlyout): void;
     /**
      * Updates the enabled state of the given block based on the capacity of the
      * workspace.

package/core/blockly.d.ts

@@ -84,6 +84,8 @@ import { IDragTarget } from './interfaces/i_drag_target.js';
 import { IDragStrategy, IDraggable, isDraggable } from './interfaces/i_draggable.js';
 import { IDragger } from './interfaces/i_dragger.js';
 import { IFlyout } from './interfaces/i_flyout.js';
+import { IFocusableNode } from './interfaces/i_focusable_node.js';
+import { IFocusableTree } from './interfaces/i_focusable_tree.js';
 import { IHasBubble, hasBubble } from './interfaces/i_has_bubble.js';
 import { IIcon, isIcon } from './interfaces/i_icon.js';
 import { IKeyboardAccessible } from './interfaces/i_keyboard_accessible.js';
@@ -272,5 +274,5 @@ export declare const VARIABLE_DYNAMIC_CATEGORY_NAME: string;
 export declare const PROCEDURE_CATEGORY_NAME: string;
 export { ASTNode, BasicCursor, Block, BlockSvg, BlocklyOptions, Blocks, CollapsibleToolboxCategory, ComponentManager, Connection, ConnectionChecker, ConnectionDB, ConnectionType, ContextMenu, ContextMenuItems, ContextMenuRegistry, Css, Cursor, DeleteArea, DragTarget, Events, Extensions, Procedures, ShortcutItems, Themes, Tooltip, Touch, Variables, VariablesDynamic, WidgetDiv, Xml, blockAnimations, blockRendering, browserEvents, bubbles, bumpObjects, clipboard, comments, common, constants, dialog, dragging, fieldRegistry, geras, Procedures as procedures, registry, thrasos, uiPosition, utils, zelos, };
 export declare const DropDownDiv: typeof dropDownDiv;
-export { BlockFlyoutInflater, ButtonFlyoutInflater, CodeGenerator, Field, FieldCheckbox, FieldCheckboxConfig, FieldCheckboxFromJsonConfig, FieldCheckboxValidator, FieldConfig, FieldDropdown, FieldDropdownConfig, FieldDropdownFromJsonConfig, FieldDropdownValidator, FieldImage, FieldImageConfig, FieldImageFromJsonConfig, FieldLabel, FieldLabelConfig, FieldLabelFromJsonConfig, FieldLabelSerializable, FieldNumber, FieldNumberConfig, FieldNumberFromJsonConfig, FieldNumberValidator, FieldTextInput, FieldTextInputConfig, FieldTextInputFromJsonConfig, FieldTextInputValidator, FieldValidator, FieldVariable, FieldVariableConfig, FieldVariableFromJsonConfig, FieldVariableValidator, Flyout, FlyoutButton, FlyoutItem, FlyoutMetricsManager, FlyoutSeparator, CodeGenerator as Generator, Gesture, Grid, HorizontalFlyout, IASTNodeLocation, IASTNodeLocationSvg, IASTNodeLocationWithBlock, IAutoHideable, IBoundedElement, IBubble, ICollapsibleToolboxItem, IComponent, IConnectionChecker, IConnectionPreviewer, IContextMenu, ICopyData, ICopyable, IDeletable, IDeleteArea, IDragStrategy, IDragTarget, IDraggable, IDragger, IFlyout, IFlyoutInflater, IHasBubble, IIcon, IKeyboardAccessible, IMetricsManager, IMovable, IObservable, IPaster, IPositionable, IRegistrable, IRenderedElement, ISelectable, ISelectableToolboxItem, ISerializable, IStyleable, IToolbox, IToolboxItem, IVariableBackedParameterModel, IVariableMap, IVariableModel, IVariableState, ImageProperties, Input, InsertionMarkerPreviewer, LabelFlyoutInflater, LayerManager, Marker, MarkerManager, Menu, MenuGenerator, MenuGeneratorFunction, MenuItem, MenuOption, MetricsManager, Msg, Names, Options, RenderedConnection, Scrollbar, ScrollbarPair, SeparatorFlyoutInflater, ShortcutRegistry, TabNavigateCursor, Theme, ThemeManager, Toolbox, ToolboxCategory, ToolboxItem, ToolboxSeparator, Trashcan, UnattachedFieldError, VariableMap, VariableModel, VerticalFlyout, Workspace, WorkspaceAudio, WorkspaceDragger, WorkspaceSvg, ZoomControls, config, hasBubble, icons, inject, inputs, isCopyable, isDeletable, isDraggable, isIcon, isObservable, isPaster, isRenderedElement, isSelectable, isSerializable, isVariableBackedParameterModel, layers, renderManagement, serialization, setLocale, };
+export { BlockFlyoutInflater, ButtonFlyoutInflater, CodeGenerator, Field, FieldCheckbox, FieldCheckboxConfig, FieldCheckboxFromJsonConfig, FieldCheckboxValidator, FieldConfig, FieldDropdown, FieldDropdownConfig, FieldDropdownFromJsonConfig, FieldDropdownValidator, FieldImage, FieldImageConfig, FieldImageFromJsonConfig, FieldLabel, FieldLabelConfig, FieldLabelFromJsonConfig, FieldLabelSerializable, FieldNumber, FieldNumberConfig, FieldNumberFromJsonConfig, FieldNumberValidator, FieldTextInput, FieldTextInputConfig, FieldTextInputFromJsonConfig, FieldTextInputValidator, FieldValidator, FieldVariable, FieldVariableConfig, FieldVariableFromJsonConfig, FieldVariableValidator, Flyout, FlyoutButton, FlyoutItem, FlyoutMetricsManager, FlyoutSeparator, CodeGenerator as Generator, Gesture, Grid, HorizontalFlyout, IASTNodeLocation, IASTNodeLocationSvg, IASTNodeLocationWithBlock, IAutoHideable, IBoundedElement, IBubble, ICollapsibleToolboxItem, IComponent, IConnectionChecker, IConnectionPreviewer, IContextMenu, ICopyData, ICopyable, IDeletable, IDeleteArea, IDragStrategy, IDragTarget, IDraggable, IDragger, IFlyout, IFlyoutInflater, IFocusableNode, IFocusableTree, IHasBubble, IIcon, IKeyboardAccessible, IMetricsManager, IMovable, IObservable, IPaster, IPositionable, IRegistrable, IRenderedElement, ISelectable, ISelectableToolboxItem, ISerializable, IStyleable, IToolbox, IToolboxItem, IVariableBackedParameterModel, IVariableMap, IVariableModel, IVariableState, ImageProperties, Input, InsertionMarkerPreviewer, LabelFlyoutInflater, LayerManager, Marker, MarkerManager, Menu, MenuGenerator, MenuGeneratorFunction, MenuItem, MenuOption, MetricsManager, Msg, Names, Options, RenderedConnection, Scrollbar, ScrollbarPair, SeparatorFlyoutInflater, ShortcutRegistry, TabNavigateCursor, Theme, ThemeManager, Toolbox, ToolboxCategory, ToolboxItem, ToolboxSeparator, Trashcan, UnattachedFieldError, VariableMap, VariableModel, VerticalFlyout, Workspace, WorkspaceAudio, WorkspaceDragger, WorkspaceSvg, ZoomControls, config, hasBubble, icons, inject, inputs, isCopyable, isDeletable, isDraggable, isIcon, isObservable, isPaster, isRenderedElement, isSelectable, isSerializable, isVariableBackedParameterModel, layers, renderManagement, serialization, setLocale, };
 //# sourceMappingURL=blockly.d.ts.map

package/core/bubbles/text_bubble.d.ts

@@ -26,12 +26,12 @@ export declare class TextBubble extends Bubble {
      * broken up by newlines.
      */
     private stringToSvg;
-    /** Creates the paragraph container for this bubble's view's spans. */
+    /** Creates the paragraph container for this bubble's view's text fragments. */
     private createParagraph;
-    /** Creates the spans visualizing the text of this bubble. */
-    private createSpans;
-    /** Right aligns the given spans. */
-    private rightAlignSpans;
+    /** Creates the text fragments visualizing the text of this bubble. */
+    private createTextFragments;
+    /** Right aligns the given text fragments. */
+    private rightAlignTextFragments;
     /** Updates the size of this bubble to account for the size of the text. */
     private updateBubbleSize;
 }

package/core/button_flyout_inflater.d.ts

@@ -4,8 +4,8 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import { FlyoutItem } from './flyout_item.js';
+import type { IFlyout } from './interfaces/i_flyout.js';
 import type { IFlyoutInflater } from './interfaces/i_flyout_inflater.js';
-import type { WorkspaceSvg } from './workspace_svg.js';
 /**
  * Class responsible for creating buttons for flyouts.
  */
@@ -14,10 +14,10 @@ export declare class ButtonFlyoutInflater implements IFlyoutInflater {
      * Inflates a flyout button from the given state and adds it to the flyout.
      *
      * @param state A JSON representation of a flyout button.
-     * @param flyoutWorkspace The workspace to create the button on.
+     * @param flyout The flyout to create the button on.
      * @returns A newly created FlyoutButton.
      */
-    load(state: object, flyoutWorkspace: WorkspaceSvg): FlyoutItem;
+    load(state: object, flyout: IFlyout): FlyoutItem;
     /**
      * Returns the amount of space that should follow this button.
      *

package/core/comments/comment_view.d.ts

@@ -8,7 +8,7 @@ import { Coordinate } from '../utils/coordinate.js';
 import { Size } from '../utils/size.js';
 import { WorkspaceSvg } from '../workspace_svg.js';
 export declare class CommentView implements IRenderedElement {
-    private readonly workspace;
+    readonly workspace: WorkspaceSvg;
     /** The root group element of the comment view. */
     private svgRoot;
     /**
@@ -62,9 +62,9 @@ export declare class CommentView implements IRenderedElement {
      */
     private resizePointerMoveListener;
     /** Whether this comment view is currently being disposed or not. */
-    private disposing;
+    protected disposing: boolean;
     /** Whether this comment view has been disposed or not. */
-    private disposed;
+    protected disposed: boolean;
     /** Size of this comment when the resize drag was initiated. */
     private preResizeSize?;
     /** The default size of newly created comments. */

package/core/contextmenu_registry.d.ts

@@ -62,7 +62,7 @@ export declare namespace ContextMenuRegistry {
      * rendered in multiple scopes, e.g. on both a block and a workspace, it
      * should be registered for each scope.
      */
-    enum ScopeType {
+    export enum ScopeType {
         BLOCK = "block",
         WORKSPACE = "workspace",
         COMMENT = "comment"
@@ -71,15 +71,23 @@ export declare namespace ContextMenuRegistry {
      * The actual workspace/block where the menu is being rendered. This is passed
      * to callback and displayText functions that depend on this information.
      */
-    interface Scope {
+    export interface Scope {
         block?: BlockSvg;
         workspace?: WorkspaceSvg;
         comment?: RenderedWorkspaceComment;
     }
     /**
-     * A menu item as entered in the registry.
+     * Fields common to all context menu registry items.
+     */
+    interface CoreRegistryItem {
+        scopeType: ScopeType;
+        weight: number;
+        id: string;
+    }
+    /**
+     * A representation of a normal, clickable menu item in the registry.
      */
-    interface RegistryItem {
+    interface ActionRegistryItem extends CoreRegistryItem {
         /**
          * @param scope Object that provides a reference to the thing that had its
          *     context menu opened.
@@ -87,16 +95,34 @@ export declare namespace ContextMenuRegistry {
          *     the event that triggered the click on the option.
          */
         callback: (scope: Scope, e: PointerEvent) => void;
-        scopeType: ScopeType;
         displayText: ((p1: Scope) => string | HTMLElement) | string | HTMLElement;
         preconditionFn: (p1: Scope) => string;
+        separator?: never;
+    }
+    /**
+     * A representation of a menu separator item in the registry.
+     */
+    interface SeparatorRegistryItem extends CoreRegistryItem {
+        separator: true;
+        callback?: never;
+        displayText?: never;
+        preconditionFn?: never;
+    }
+    /**
+     * A menu item as entered in the registry.
+     */
+    export type RegistryItem = ActionRegistryItem | SeparatorRegistryItem;
+    /**
+     * Fields common to all context menu items as used by contextmenu.ts.
+     */
+    export interface CoreContextMenuOption {
+        scope: Scope;
         weight: number;
-        id: string;
     }
     /**
-     * A menu item as presented to contextmenu.js.
+     * A representation of a normal, clickable menu item in contextmenu.ts.
      */
-    interface ContextMenuOption {
+    export interface ActionContextMenuOption extends CoreContextMenuOption {
         text: string | HTMLElement;
         enabled: boolean;
         /**
@@ -106,18 +132,32 @@ export declare namespace ContextMenuRegistry {
          *     the event that triggered the click on the option.
          */
         callback: (scope: Scope, e: PointerEvent) => void;
-        scope: Scope;
-        weight: number;
+        separator?: never;
+    }
+    /**
+     * A representation of a menu separator item in contextmenu.ts.
+     */
+    export interface SeparatorContextMenuOption extends CoreContextMenuOption {
+        separator: true;
+        text?: never;
+        enabled?: never;
+        callback?: never;
     }
+    /**
+     * A menu item as presented to contextmenu.ts.
+     */
+    export type ContextMenuOption = ActionContextMenuOption | SeparatorContextMenuOption;
     /**
      * A subset of ContextMenuOption corresponding to what was publicly
      * documented.  ContextMenuOption should be preferred for new code.
      */
-    interface LegacyContextMenuOption {
+    export interface LegacyContextMenuOption {
         text: string;
         enabled: boolean;
         callback: (p1: Scope) => void;
+        separator?: never;
     }
+    export {};
 }
 export type ScopeType = ContextMenuRegistry.ScopeType;
 export declare const ScopeType: typeof ContextMenuRegistry.ScopeType;

package/core/dragging/block_drag_strategy.d.ts

@@ -25,8 +25,8 @@ export declare class BlockDragStrategy implements IDragStrategy {
      * block, to add to the drag location. In workspace units.
      */
     private dragOffset;
-    /** Was there already an event group in progress when the drag started? */
-    private inGroup;
+    /** Used to persist an event group when snapping is done async. */
+    private originalEventGroup;
     constructor(block: BlockSvg);
     /** Returns true if the block is currently movable. False otherwise. */
     isMovable(): boolean;

package/core/dragging/bubble_drag_strategy.d.ts

@@ -10,8 +10,6 @@ export declare class BubbleDragStrategy implements IDragStrategy {
     private bubble;
     private workspace;
     private startLoc;
-    /** Was there already an event group in progress when the drag started? */
-    private inGroup;
     constructor(bubble: IBubble, workspace: WorkspaceSvg);
     isMovable(): boolean;
     startDrag(): void;

package/core/dragging/comment_drag_strategy.d.ts

@@ -10,8 +10,6 @@ export declare class CommentDragStrategy implements IDragStrategy {
     private comment;
     private startLoc;
     private workspace;
-    /** Was there already an event group in progress when the drag started? */
-    private inGroup;
     constructor(comment: RenderedWorkspaceComment);
     isMovable(): boolean;
     startDrag(): void;

package/core/field.d.ts

@@ -54,8 +54,6 @@ export declare abstract class Field<T = any> implements IASTNodeLocationSvg, IAS
      * `FieldImage.prototype.DEFAULT_VALUE = null;`
      */
     DEFAULT_VALUE: T | null;
-    /** Non-breaking space. */
-    static readonly NBSP = "\u00A0";
     /**
      * A value used to signal when a field's constructor should *not* set the
      * field's value or run configure_, and should allow a subclass to do that

package/core/field_dropdown.d.ts

@@ -10,13 +10,10 @@ import { MenuItem } from './menuitem.js';
  * Class for an editable dropdown field.
  */
 export declare class FieldDropdown extends Field<string> {
-    /** Horizontal distance that a checkmark overhangs the dropdown. */
-    static CHECKMARK_OVERHANG: number;
     /**
-     * Maximum height of the dropdown menu, as a percentage of the viewport
-     * height.
+     * Magic constant used to represent a separator in a list of dropdown items.
      */
-    static MAX_MENU_HEIGHT_VH: number;
+    static readonly SEPARATOR = "separator";
     static ARROW_CHAR: string;
     /** A reference to the currently selected menu item. */
     private selectedMenuItem;
@@ -239,11 +236,12 @@ export interface ImageProperties {
     height: number;
 }
 /**
- * An individual option in the dropdown menu. The first element is the human-
- * readable value (text or image), and the second element is the language-
- * neutral value.
+ * An individual option in the dropdown menu. Can be either the string literal
+ * `separator` for a menu separator item, or an array for normal action menu
+ * items. In the latter case, the first element is the human-readable value
+ * (text or image), and the second element is the language-neutral value.
  */
-export type MenuOption = [string | ImageProperties, string];
+export type MenuOption = [string | ImageProperties, string] | 'separator';
 /**
  * A function that generates an array of menu options for FieldDropdown
  * or its descendants.

package/core/interfaces/i_flyout_inflater.d.ts

@@ -1,5 +1,5 @@
 import type { FlyoutItem } from '../flyout_item.js';
-import type { WorkspaceSvg } from '../workspace_svg.js';
+import type { IFlyout } from './i_flyout.js';
 export interface IFlyoutInflater {
     /**
      * Loads the object represented by the given state onto the workspace.
@@ -8,14 +8,14 @@ export interface IFlyoutInflater {
      * allow for code reuse.
      *
      * @param state A JSON representation of an element to inflate on the flyout.
-     * @param flyoutWorkspace The flyout's workspace, where the inflated element
+     * @param flyout The flyout on whose workspace the inflated element
      *    should be created. If the inflated element is an `IRenderedElement` it
      *    itself or the inflater should append it to the workspace; the flyout
      *    will not do so itself. The flyout is responsible for positioning the
      *    element, however.
      * @returns The newly inflated flyout element.
      */
-    load(state: object, flyoutWorkspace: WorkspaceSvg): FlyoutItem;
+    load(state: object, flyout: IFlyout): FlyoutItem;
     /**
      * Returns the amount of spacing that should follow the element corresponding
      * to the given JSON representation.

package/core/interfaces/i_focusable_node.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import type { IFocusableTree } from './i_focusable_tree.js';
+/** Represents anything that can have input focus. */
+export interface IFocusableNode {
+    /**
+     * Returns the DOM element that can be explicitly requested to receive focus.
+     *
+     * IMPORTANT: Please note that this element is expected to have a visual
+     * presence on the page as it will both be explicitly focused and have its
+     * style changed depending on its current focus state (i.e. blurred, actively
+     * focused, and passively focused). The element will have one of two styles
+     * attached (where no style indicates blurred/not focused):
+     * - blocklyActiveFocus
+     * - blocklyPassiveFocus
+     *
+     * The returned element must also have a valid ID specified, and unique to the
+     * element relative to its nearest IFocusableTree parent.
+     *
+     * It's expected the return element will not change for the lifetime of the
+     * node.
+     */
+    getFocusableElement(): HTMLElement | SVGElement;
+    /**
+     * Returns the closest parent tree of this node (in cases where a tree has
+     * distinct trees underneath it), which represents the tree to which this node
+     * belongs.
+     */
+    getFocusableTree(): IFocusableTree;
+}
+//# sourceMappingURL=i_focusable_node.d.ts.map

package/core/interfaces/i_focusable_tree.d.ts

@@ -0,0 +1,48 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import type { IFocusableNode } from './i_focusable_node.js';
+/**
+ * Represents a tree of focusable elements with its own active/passive focus
+ * context.
+ *
+ * Note that focus is handled by FocusManager, and tree implementations can have
+ * at most one IFocusableNode focused at one time. If the tree itself has focus,
+ * then the tree's focused node is considered 'active' ('passive' if another
+ * tree has focus).
+ *
+ * Focus is shared between one or more trees, where each tree can have exactly
+ * one active or passive node (and only one active node can exist on the whole
+ * page at any given time). The idea of passive focus is to provide context to
+ * users on where their focus will be restored upon navigating back to a
+ * previously focused tree.
+ */
+export interface IFocusableTree {
+    /**
+     * Returns the current node with focus in this tree, or null if none (or if
+     * the root has focus).
+     *
+     * Note that this will never return a node from a nested sub-tree as that tree
+     * should specifically be called in order to retrieve its focused node.
+     */
+    getFocusedNode(): IFocusableNode | null;
+    /**
+     * Returns the top-level focusable node of the tree.
+     *
+     * It's expected that the returned node will be focused in cases where
+     * FocusManager wants to focus a tree in a situation where it does not
+     * currently have a focused node.
+     */
+    getRootFocusableNode(): IFocusableNode;
+    /**
+     * Returns the IFocusableNode corresponding to the select element, or null if
+     * the element does not have such a node.
+     *
+     * The provided element must have a non-null ID that conforms to the contract
+     * mentioned in IFocusableNode.
+     */
+    findFocusableNodeFor(element: HTMLElement | SVGElement): IFocusableNode | null;
+}
+//# sourceMappingURL=i_focusable_tree.d.ts.map

package/core/keyboard_nav/marker.d.ts

@@ -27,8 +27,6 @@ export declare class Marker {
     private drawer;
     /** The type of the marker. */
     type: string;
-    /** Constructs a new Marker instance. */
-    constructor();
     /**
      * Sets the object in charge of drawing the marker.
      *
@@ -40,21 +38,19 @@ export declare class Marker {
      *
      * @returns The object in charge of drawing the marker.
      */
-    getDrawer(): MarkerSvg;
+    getDrawer(): MarkerSvg | null;
     /**
      * Gets the current location of the marker.
      *
      * @returns The current field, connection, or block the marker is on.
      */
-    getCurNode(): ASTNode;
+    getCurNode(): ASTNode | null;
     /**
      * Set the location of the marker and call the update method.
-     * Setting isStack to true will only work if the newLocation is the top most
-     * output or previous connection on a stack.
      *
-     * @param newNode The new location of the marker.
+     * @param newNode The new location of the marker, or null to remove it.
      */
-    setCurNode(newNode: ASTNode): void;
+    setCurNode(newNode: ASTNode | null): void;
     /**
      * Redraw the current marker.
      *

package/core/label_flyout_inflater.d.ts

@@ -4,8 +4,8 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 import { FlyoutItem } from './flyout_item.js';
+import type { IFlyout } from './interfaces/i_flyout.js';
 import type { IFlyoutInflater } from './interfaces/i_flyout_inflater.js';
-import type { WorkspaceSvg } from './workspace_svg.js';
 /**
  * Class responsible for creating labels for flyouts.
  */
@@ -14,10 +14,10 @@ export declare class LabelFlyoutInflater implements IFlyoutInflater {
      * Inflates a flyout label from the given state and adds it to the flyout.
      *
      * @param state A JSON representation of a flyout label.
-     * @param flyoutWorkspace The workspace to create the label on.
+     * @param flyout The flyout to create the label on.
      * @returns A FlyoutButton configured as a label.
      */
-    load(state: object, flyoutWorkspace: WorkspaceSvg): FlyoutItem;
+    load(state: object, flyout: IFlyout): FlyoutItem;
     /**
      * Returns the amount of space that should follow this label.
      *

package/core/menu.d.ts

@@ -3,7 +3,8 @@
  * Copyright 2019 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-import type { MenuItem } from './menuitem.js';
+import type { MenuSeparator } from './menu_separator.js';
+import { MenuItem } from './menuitem.js';
 import * as aria from './utils/aria.js';
 import { Coordinate } from './utils/coordinate.js';
 import type { Size } from './utils/size.js';
@@ -12,14 +13,12 @@ import type { Size } from './utils/size.js';
  */
 export declare class Menu {
     /**
-     * Array of menu items.
-     * (Nulls are never in the array, but typing the array as nullable prevents
-     * the compiler from objecting to .indexOf(null))
+     * Array of menu items and separators.
      */
     private readonly menuItems;
     /**
-     * Coordinates of the mousedown event that caused this menu to open. Used to
-     * prevent the consequent mouseup event due to a simple click from
+     * Coordinates of the pointerdown event that caused this menu to open. Used to
+     * prevent the consequent pointerup event due to a simple click from
      * activating a menu item immediately.
      */
     openingCoords: Coordinate | null;
@@ -28,14 +27,14 @@ export declare class Menu {
      * A value of null means no menu item is highlighted.
      */
     private highlightedItem;
-    /** Mouse over event data. */
-    private mouseOverHandler;
+    /** Pointer over event data. */
+    private pointerMoveHandler;
     /** Click event data. */
     private clickHandler;
-    /** Mouse enter event data. */
-    private mouseEnterHandler;
-    /** Mouse leave event data. */
-    private mouseLeaveHandler;
+    /** Pointer enter event data. */
+    private pointerEnterHandler;
+    /** Pointer leave event data. */
+    private pointerLeaveHandler;
     /** Key down event data. */
     private onKeyDownHandler;
     /** The menu's root DOM element. */
@@ -47,10 +46,10 @@ export declare class Menu {
     /**
      * Add a new menu item to the bottom of this menu.
      *
-     * @param menuItem Menu item to append.
+     * @param menuItem Menu item or separator to append.
      * @internal
      */
-    addChild(menuItem: MenuItem): void;
+    addChild(menuItem: MenuItem | MenuSeparator): void;
     /**
      * Creates the menu DOM.
      *
@@ -124,11 +123,12 @@ export declare class Menu {
      */
     private highlightHelper;
     /**
-     * Handles mouseover events. Highlight menuitems as the user hovers over them.
+     * Handles pointermove events. Highlight menu items as the user hovers over
+     * them.
      *
-     * @param e Mouse event to handle.
+     * @param e Pointer event to handle.
      */
-    private handleMouseOver;
+    private handlePointerMove;
     /**
      * Handles click events. Pass the event onto the child menuitem to handle.
      *
@@ -136,17 +136,17 @@ export declare class Menu {
      */
     private handleClick;
     /**
-     * Handles mouse enter events. Focus the element.
+     * Handles pointer enter events. Focus the element.
      *
-     * @param _e Mouse event to handle.
+     * @param _e Pointer event to handle.
      */
-    private handleMouseEnter;
+    private handlePointerEnter;
     /**
-     * Handles mouse leave events. Blur and clear highlight.
+     * Handles pointer leave events by clearing the active highlight.
      *
-     * @param _e Mouse event to handle.
+     * @param _e Pointer event to handle.
      */
-    private handleMouseLeave;
+    private handlePointerLeave;
     /**
      * Attempts to handle a keyboard event.
      *
@@ -160,5 +160,11 @@ export declare class Menu {
      * @internal
      */
     getSize(): Size;
+    /**
+     * Returns the action menu items (omitting separators) in this menu.
+     *
+     * @returns The MenuItem objects displayed in this menu.
+     */
+    private getMenuItems;
 }
 //# sourceMappingURL=menu.d.ts.map

package/core/menu_separator.d.ts

@@ -0,0 +1,25 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+/**
+ * Representation of a section separator in a menu.
+ */
+export declare class MenuSeparator {
+    /**
+     * DOM element representing this separator in a menu.
+     */
+    private element;
+    /**
+     * Creates the DOM representation of this separator.
+     *
+     * @returns An <hr> element.
+     */
+    createDom(): HTMLHRElement;
+    /**
+     * Disposes of this separator.
+     */
+    dispose(): void;
+}
+//# sourceMappingURL=menu_separator.d.ts.map

package/core/menuitem.d.ts

@@ -95,6 +95,13 @@ export declare class MenuItem {
      * @internal
      */
     setChecked(checked: boolean): void;
+    /**
+     * Highlights or unhighlights the component.
+     *
+     * @param highlight Whether to highlight or unhighlight the component.
+     * @internal
+     */
+    setHighlighted(highlight: boolean): void;
     /**
      * Returns true if the menu item is enabled, false otherwise.
      *

package/core/renderers/common/marker_svg.d.ts

@@ -78,7 +78,7 @@ export declare class MarkerSvg {
      * @param oldNode The previous node the marker was on or null.
      * @param curNode The node that we want to draw the marker for.
      */
-    draw(oldNode: ASTNode, curNode: ASTNode): void;
+    draw(oldNode: ASTNode | null, curNode: ASTNode | null): void;
     /**
      * Update the marker's visible state based on the type of curNode..
      *
@@ -229,7 +229,7 @@ export declare class MarkerSvg {
      * @param oldNode The old node the marker used to be on.
      * @param curNode The new node the marker is currently on.
      */
-    protected fireMarkerEvent(oldNode: ASTNode, curNode: ASTNode): void;
+    protected fireMarkerEvent(oldNode: ASTNode | null, curNode: ASTNode): void;
     /**
      * Get the properties to make a marker blink.
      *