blockly 12.0.0-beta.4 → 12.0.0-beta.5

package/core/block_svg.d.ts

@@ -23,7 +23,10 @@ import { IContextMenu } from './interfaces/i_contextmenu.js';
 import type { ICopyable } from './interfaces/i_copyable.js';
 import { IDeletable } from './interfaces/i_deletable.js';
 import type { IDragStrategy, IDraggable } from './interfaces/i_draggable.js';
+import type { IFocusableNode } from './interfaces/i_focusable_node.js';
+import type { IFocusableTree } from './interfaces/i_focusable_tree.js';
 import { IIcon } from './interfaces/i_icon.js';
+import type { INavigable } from './interfaces/i_navigable.js';
 import { RenderedConnection } from './rendered_connection.js';
 import type { IPathObject } from './renderers/common/i_path_object.js';
 import type { BlockStyle } from './theme.js';
@@ -36,7 +39,7 @@ import type { WorkspaceSvg } from './workspace_svg.js';
  * Class for a block's SVG representation.
  * Not normally called directly, workspace.newBlock() is preferred.
  */
-export declare class BlockSvg extends Block implements IASTNodeLocationSvg, IBoundedElement, IContextMenu, ICopyable<BlockCopyData>, IDraggable, IDeletable {
+export declare class BlockSvg extends Block implements IASTNodeLocationSvg, IBoundedElement, IContextMenu, ICopyable<BlockCopyData>, IDraggable, IDeletable, IFocusableNode, INavigable<BlockSvg> {
     /**
      * Constant for identifying rows that are to be rendered inline.
      * Don't collide with Blockly.inputTypes.
@@ -227,6 +230,12 @@ export declare class BlockSvg extends Block implements IASTNodeLocationSvg, IBou
      * @param collapsed True if collapsed.
      */
     setCollapsed(collapsed: boolean): void;
+    /**
+     * Traverses child blocks to see if any of them have a warning.
+     *
+     * @returns true if any child has a warning, false otherwise.
+     */
+    private childHasWarning;
     /**
      * Makes sure that when the block is collapsed, it is rendered correctly
      * for that state.
@@ -392,13 +401,15 @@ export declare class BlockSvg extends Block implements IASTNodeLocationSvg, IBou
     private createIconPointerDownListener;
     removeIcon(type: IconType<IIcon>): boolean;
     /**
-     * @deprecated v11 - Set whether the block is manually enabled or disabled.
+     * Set whether the block is manually enabled or disabled.
+     *
      * The user can toggle whether a block is disabled from a context menu
      * option. A block may still be disabled for other reasons even if the user
      * attempts to manually enable it, such as when the block is in an invalid
      * location. This method is deprecated and setDisabledReason should be used
      * instead.
      *
+     * @deprecated v11: use setDisabledReason.
      * @param enabled True if enabled.
      */
     setEnabled(enabled: boolean): void;
@@ -665,24 +676,6 @@ export declare class BlockSvg extends Block implements IASTNodeLocationSvg, IBou
      * @internal
      */
     tightenChildrenEfficiently(): void;
-    /** Redraw any attached marker or cursor svgs if needed. */
-    protected updateMarkers_(): void;
-    /**
-     * Add the cursor SVG to this block's SVG group.
-     *
-     * @param cursorSvg The SVG root of the cursor to be added to the block SVG
-     *     group.
-     * @internal
-     */
-    setCursorSvg(cursorSvg: SVGElement): void;
-    /**
-     * Add the marker SVG to this block's SVG group.
-     *
-     * @param markerSvg The SVG root of the marker to be added to the block SVG
-     *     group.
-     * @internal
-     */
-    setMarkerSvg(markerSvg: SVGElement): void;
     /**
      * Returns a bounding box describing the dimensions of this block
      * and any blocks stacked below it.
@@ -736,5 +729,28 @@ export declare class BlockSvg extends Block implements IASTNodeLocationSvg, IBou
      */
     toFlyoutInfo(): FlyoutItemInfo[];
     jsonInit(json: any): void;
+    /** See IFocusableNode.getFocusableElement. */
+    getFocusableElement(): HTMLElement | SVGElement;
+    /** See IFocusableNode.getFocusableTree. */
+    getFocusableTree(): IFocusableTree;
+    /** See IFocusableNode.onNodeFocus. */
+    onNodeFocus(): void;
+    /** See IFocusableNode.onNodeBlur. */
+    onNodeBlur(): void;
+    /**
+     * Returns whether or not this block can be navigated to via the keyboard.
+     *
+     * @returns True if this block is keyboard navigable, otherwise false.
+     */
+    isNavigable(): boolean;
+    /**
+     * Returns this block's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * block.
+     *
+     * @returns This block's class.
+     */
+    getClass(): typeof BlockSvg;
 }
 //# sourceMappingURL=block_svg.d.ts.map

package/core/blockly.d.ts

@@ -65,6 +65,7 @@ import * as inputs from './inputs.js';
 import { IFlyoutInflater } from './interfaces/i_flyout_inflater.js';
 import { LabelFlyoutInflater } from './label_flyout_inflater.js';
 import { SeparatorFlyoutInflater } from './separator_flyout_inflater.js';
+import { FocusableTreeTraverser } from './utils/focusable_tree_traverser.js';
 import { Input } from './inputs/input.js';
 import { InsertionMarkerPreviewer } from './insertion_marker_previewer.js';
 import { IASTNodeLocation } from './interfaces/i_ast_node_location.js';
@@ -271,7 +272,18 @@ export declare const VARIABLE_DYNAMIC_CATEGORY_NAME: string;
  * procedure blocks.
  */
 export declare const PROCEDURE_CATEGORY_NAME: string;
+export * from './interfaces/i_navigable.js';
+export * from './interfaces/i_navigation_policy.js';
+export * from './keyboard_nav/block_navigation_policy.js';
+export * from './keyboard_nav/connection_navigation_policy.js';
+export * from './keyboard_nav/field_navigation_policy.js';
+export * from './keyboard_nav/flyout_button_navigation_policy.js';
+export * from './keyboard_nav/flyout_navigation_policy.js';
+export * from './keyboard_nav/flyout_separator_navigation_policy.js';
+export * from './keyboard_nav/workspace_navigation_policy.js';
+export * from './navigator.js';
+export * from './toast.js';
 export { ASTNode, Block, BlockSvg, BlocklyOptions, Blocks, CollapsibleToolboxCategory, ComponentManager, Connection, ConnectionChecker, ConnectionDB, ConnectionType, ContextMenu, ContextMenuItems, ContextMenuRegistry, Css, CursorOptions, DeleteArea, DragTarget, Events, Extensions, LineCursor, 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, FocusManager, 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, ReturnEphemeralFocus, Scrollbar, ScrollbarPair, SeparatorFlyoutInflater, ShortcutRegistry, Theme, ThemeManager, Toolbox, ToolboxCategory, ToolboxItem, ToolboxSeparator, Trashcan, UnattachedFieldError, VariableMap, VariableModel, VerticalFlyout, Workspace, WorkspaceAudio, WorkspaceDragger, WorkspaceSvg, ZoomControls, config, getFocusManager, 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, FocusManager, FocusableTreeTraverser, 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, ReturnEphemeralFocus, Scrollbar, ScrollbarPair, SeparatorFlyoutInflater, ShortcutRegistry, Theme, ThemeManager, Toolbox, ToolboxCategory, ToolboxItem, ToolboxSeparator, Trashcan, UnattachedFieldError, VariableMap, VariableModel, VerticalFlyout, Workspace, WorkspaceAudio, WorkspaceDragger, WorkspaceSvg, ZoomControls, config, getFocusManager, 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/connection.d.ts

@@ -41,6 +41,8 @@ export declare class Connection implements IASTNodeLocationWithBlock {
     private check;
     /** DOM representation of a shadow block, or null if none. */
     private shadowDom;
+    /** The unique ID of this connection. */
+    id: string;
     /**
      * Horizontal location of this connection.
      *

package/core/contextmenu_registry.d.ts

@@ -10,6 +10,7 @@
  */
 import type { BlockSvg } from './block_svg.js';
 import { RenderedWorkspaceComment } from './comments/rendered_workspace_comment.js';
+import type { IFocusableNode } from './interfaces/i_focusable_node.js';
 import { Coordinate } from './utils/coordinate.js';
 import type { WorkspaceSvg } from './workspace_svg.js';
 /**
@@ -45,17 +46,16 @@ export declare class ContextMenuRegistry {
      */
     getItem(id: string): RegistryItem | null;
     /**
-     * Gets the valid context menu options for the given scope type (e.g. block or
-     * workspace) and scope. Blocks are only shown if the preconditionFn shows
+     * Gets the valid context menu options for the given scope.
+     * Options are only included if the preconditionFn shows
      * they should not be hidden.
      *
-     * @param scopeType Type of scope where menu should be shown (e.g. on a block
-     *     or on a workspace)
      * @param scope Current scope of context menu (i.e., the exact workspace or
-     *     block being clicked on)
+     *     block being clicked on).
+     * @param menuOpenEvent Event that caused the menu to open.
      * @returns the list of ContextMenuOptions
      */
-    getContextMenuOptions(scopeType: ScopeType, scope: Scope, menuOpenEvent: Event): ContextMenuOption[];
+    getContextMenuOptions(scope: Scope, menuOpenEvent: Event): ContextMenuOption[];
 }
 export declare namespace ContextMenuRegistry {
     /**
@@ -69,19 +69,21 @@ export declare namespace ContextMenuRegistry {
         COMMENT = "comment"
     }
     /**
-     * The actual workspace/block where the menu is being rendered. This is passed
-     * to callback and displayText functions that depend on this information.
+     * The actual workspace/block/focused object where the menu is being
+     * rendered. This is passed to callback and displayText functions
+     * that depend on this information.
      */
     export interface Scope {
         block?: BlockSvg;
         workspace?: WorkspaceSvg;
         comment?: RenderedWorkspaceComment;
+        focusedNode?: IFocusableNode | any;
     }
     /**
      * Fields common to all context menu registry items.
      */
     interface CoreRegistryItem {
-        scopeType: ScopeType;
+        scopeType?: ScopeType;
         weight: number;
         id: string;
     }

package/core/dialog.d.ts

@@ -3,6 +3,8 @@
  * Copyright 2021 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
+import type { ToastOptions } from './toast.js';
+import type { WorkspaceSvg } from './workspace_svg.js';
 /**
  * Wrapper to window.alert() that app developers may override via setAlert to
  * provide alternatives to the modal browser window.
@@ -14,10 +16,11 @@ export declare function alert(message: string, opt_callback?: () => void): void;
 /**
  * Sets the function to be run when Blockly.dialog.alert() is called.
  *
- * @param alertFunction The function to be run.
+ * @param alertFunction The function to be run, or undefined to restore the
+ *     default implementation.
  * @see Blockly.dialog.alert
  */
-export declare function setAlert(alertFunction: (p1: string, p2?: () => void) => void): void;
+export declare function setAlert(alertFunction?: (message: string, callback?: () => void) => void): void;
 /**
  * Wrapper to window.confirm() that app developers may override via setConfirm
  * to provide alternatives to the modal browser window.
@@ -25,18 +28,15 @@ export declare function setAlert(alertFunction: (p1: string, p2?: () => void) =>
  * @param message The message to display to the user.
  * @param callback The callback for handling user response.
  */
-export declare function confirm(message: string, callback: (p1: boolean) => void): void;
-/**
- * Private version of confirm for stubbing in tests.
- */
-declare function confirmInternal(message: string, callback: (p1: boolean) => void): void;
+export declare function confirm(message: string, callback: (result: boolean) => void): void;
 /**
  * Sets the function to be run when Blockly.dialog.confirm() is called.
  *
- * @param confirmFunction The function to be run.
+ * @param confirmFunction The function to be run, or undefined to restore the
+ *     default implementation.
  * @see Blockly.dialog.confirm
  */
-export declare function setConfirm(confirmFunction: (p1: string, p2: (p1: boolean) => void) => void): void;
+export declare function setConfirm(confirmFunction?: (message: string, callback: (result: boolean) => void) => void): void;
 /**
  * Wrapper to window.prompt() that app developers may override via setPrompt to
  * provide alternatives to the modal browser window. Built-in browser prompts
@@ -47,16 +47,36 @@ export declare function setConfirm(confirmFunction: (p1: string, p2: (p1: boolea
  * @param defaultValue The value to initialize the prompt with.
  * @param callback The callback for handling user response.
  */
-export declare function prompt(message: string, defaultValue: string, callback: (p1: string | null) => void): void;
+export declare function prompt(message: string, defaultValue: string, callback: (result: string | null) => void): void;
 /**
  * Sets the function to be run when Blockly.dialog.prompt() is called.
  *
- * @param promptFunction The function to be run.
+ * **Important**: When overridding this, be aware that non-native prompt
+ * experiences may require managing ephemeral focus in FocusManager. This isn't
+ * needed for the native window prompt because it prevents focus from being
+ * changed while open.
+ *
+ * @param promptFunction The function to be run, or undefined to restore the
+ *     default implementation.
  * @see Blockly.dialog.prompt
  */
-export declare function setPrompt(promptFunction: (p1: string, p2: string, p3: (p1: string | null) => void) => void): void;
-export declare const TEST_ONLY: {
-    confirmInternal: typeof confirmInternal;
-};
-export {};
+export declare function setPrompt(promptFunction?: (message: string, defaultValue: string, callback: (result: string | null) => void) => void): void;
+/**
+ * Displays a temporary notification atop the workspace. Blockly provides a
+ * default toast implementation, but developers may provide their own via
+ * setToast. For simple appearance customization, CSS should be sufficient.
+ *
+ * @param workspace The workspace to display the toast notification atop.
+ * @param options Configuration options for the notification, including its
+ *     message and duration.
+ */
+export declare function toast(workspace: WorkspaceSvg, options: ToastOptions): void;
+/**
+ * Sets the function to be run when Blockly.dialog.toast() is called.
+ *
+ * @param toastFunction The function to be run, or undefined to restore the
+ *     default implementation.
+ * @see Blockly.dialog.toast
+ */
+export declare function setToast(toastFunction?: (workspace: WorkspaceSvg, options: ToastOptions) => void): void;
 //# sourceMappingURL=dialog.d.ts.map

package/core/field.d.ts

@@ -15,7 +15,10 @@ import type { Block } from './block.js';
 import type { Input } from './inputs/input.js';
 import type { IASTNodeLocationSvg } from './interfaces/i_ast_node_location_svg.js';
 import type { IASTNodeLocationWithBlock } from './interfaces/i_ast_node_location_with_block.js';
+import type { IFocusableNode } from './interfaces/i_focusable_node.js';
+import type { IFocusableTree } from './interfaces/i_focusable_tree.js';
 import type { IKeyboardAccessible } from './interfaces/i_keyboard_accessible.js';
+import type { INavigable } from './interfaces/i_navigable.js';
 import type { IRegistrable } from './interfaces/i_registrable.js';
 import { ISerializable } from './interfaces/i_serializable.js';
 import type { ConstantProvider } from './renderers/common/constants.js';
@@ -45,7 +48,7 @@ export type FieldValidator<T = any> = (newValue: T) => T | null | undefined;
  *
  * @typeParam T - The value stored on the field.
  */
-export declare abstract class Field<T = any> implements IASTNodeLocationSvg, IASTNodeLocationWithBlock, IKeyboardAccessible, IRegistrable, ISerializable {
+export declare abstract class Field<T = any> implements IASTNodeLocationSvg, IASTNodeLocationWithBlock, IKeyboardAccessible, IRegistrable, ISerializable, IFocusableNode, INavigable<Field<T>> {
     /**
      * To overwrite the default value which is set in **Field**, directly update
      * the prototype.
@@ -74,16 +77,6 @@ export declare abstract class Field<T = any> implements IASTNodeLocationSvg, IAS
      */
     private tooltip;
     protected size_: Size;
-    /**
-     * Holds the cursors svg element when the cursor is attached to the field.
-     * This is null if there is no cursor on the field.
-     */
-    private cursorSvg;
-    /**
-     * Holds the markers svg element when the marker is attached to the field.
-     * This is null if there is no marker on the field.
-     */
-    private markerSvg;
     /** The rendered field's SVG group element. */
     protected fieldGroup_: SVGGElement | null;
     /** The rendered field's SVG border element. */
@@ -139,6 +132,8 @@ export declare abstract class Field<T = any> implements IASTNodeLocationSvg, IAS
      * case by default so that SERIALIZABLE is backwards compatible.
      */
     SERIALIZABLE: boolean;
+    /** The unique ID of this field. */
+    private id_;
     /**
      * @param value The initial value of the field.
      *     Also accepts Field.SKIP_SETUP if you wish to skip setup (only used by
@@ -669,26 +664,14 @@ export declare abstract class Field<T = any> implements IASTNodeLocationSvg, IAS
      * @returns True if the shortcut has been handled, false otherwise.
      */
     onShortcut(_shortcut: KeyboardShortcut): boolean;
-    /**
-     * Add the cursor SVG to this fields SVG group.
-     *
-     * @param cursorSvg The SVG root of the cursor to be added to the field group.
-     * @internal
-     */
-    setCursorSvg(cursorSvg: SVGElement): void;
-    /**
-     * Add the marker SVG to this fields SVG group.
-     *
-     * @param markerSvg The SVG root of the marker to be added to the field group.
-     * @internal
-     */
-    setMarkerSvg(markerSvg: SVGElement): void;
-    /**
-     * Redraw any attached marker or cursor svgs if needed.
-     *
-     * @internal
-     */
-    updateMarkers_(): void;
+    /** See IFocusableNode.getFocusableElement. */
+    getFocusableElement(): HTMLElement | SVGElement;
+    /** See IFocusableNode.getFocusableTree. */
+    getFocusableTree(): IFocusableTree;
+    /** See IFocusableNode.onNodeFocus. */
+    onNodeFocus(): void;
+    /** See IFocusableNode.onNodeBlur. */
+    onNodeBlur(): void;
     /**
      * Subclasses should reimplement this method to construct their Field
      * subclass from a JSON arg object.
@@ -700,6 +683,21 @@ export declare abstract class Field<T = any> implements IASTNodeLocationSvg, IAS
      *    to configure a specific field.
      */
     static fromJson(_options: FieldConfig): Field;
+    /**
+     * Returns whether or not this field is accessible by keyboard navigation.
+     *
+     * @returns True if this field is keyboard accessible, otherwise false.
+     */
+    isNavigable(): boolean;
+    /**
+     * Returns this field's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * field. Must be implemented by subclasses.
+     *
+     * @returns This field's class.
+     */
+    abstract getClass(): new (...args: any) => Field<T>;
 }
 /**
  * Extra configuration options for the base field.

package/core/field_checkbox.d.ts

@@ -123,6 +123,15 @@ export declare class FieldCheckbox extends Field<CheckboxBool> {
      * @internal
      */
     static fromJson(options: FieldCheckboxFromJsonConfig): FieldCheckbox;
+    /**
+     * Returns this field's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * field.
+     *
+     * @returns This field's class.
+     */
+    getClass(): typeof FieldCheckbox;
 }
 /**
  * Config options for the checkbox field.

package/core/field_dropdown.d.ts

@@ -144,6 +144,13 @@ export declare class FieldDropdown extends Field<string> {
      * @throws {TypeError} If generated options are incorrectly structured.
      */
     getOptions(useCache?: boolean): MenuOption[];
+    /**
+     * Update the options on this dropdown. This will reset the selected item to
+     * the first item in the list.
+     *
+     * @param menuGenerator The array of options or a generator function.
+     */
+    setOptions(menuGenerator: MenuGenerator): void;
     /**
      * Ensure that the input value is a valid language-neutral option.
      *
@@ -225,6 +232,15 @@ export declare class FieldDropdown extends Field<string> {
      * @throws {TypeError} If proposed options are incorrectly structured.
      */
     protected validateOptions(options: MenuOption[]): void;
+    /**
+     * Returns this field's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * field.
+     *
+     * @returns This field's class.
+     */
+    getClass(): typeof FieldDropdown;
 }
 /**
  * Definition of a human-readable image dropdown option.
@@ -239,9 +255,10 @@ export interface ImageProperties {
  * 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.
+ * (text, ImageProperties object, or HTML element), and the second element is
+ * the language-neutral value.
  */
-export type MenuOption = [string | ImageProperties, string] | 'separator';
+export type MenuOption = [string | ImageProperties | HTMLElement, string] | 'separator';
 /**
  * A function that generates an array of menu options for FieldDropdown
  * or its descendants.

package/core/field_image.d.ts

@@ -125,6 +125,15 @@ export declare class FieldImage extends Field<string> {
      * @internal
      */
     static fromJson(options: FieldImageFromJsonConfig): FieldImage;
+    /**
+     * Returns this field's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * field.
+     *
+     * @returns This field's class.
+     */
+    getClass(): typeof FieldImage;
 }
 /**
  * Config options for the image field.

package/core/field_label.d.ts

@@ -64,6 +64,15 @@ export declare class FieldLabel extends Field<string> {
      * @internal
      */
     static fromJson(options: FieldLabelFromJsonConfig): FieldLabel;
+    /**
+     * Returns this field's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * field.
+     *
+     * @returns This field's class.
+     */
+    getClass(): typeof FieldLabel;
 }
 /**
  * Config options for the label field.

package/core/field_number.d.ts

@@ -160,6 +160,15 @@ export declare class FieldNumber extends FieldInput<number> {
      * @internal
      */
     static fromJson(options: FieldNumberFromJsonConfig): FieldNumber;
+    /**
+     * Returns this field's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * field.
+     *
+     * @returns This field's class.
+     */
+    getClass(): typeof FieldNumber;
 }
 /**
  * Config options for the number field.

package/core/field_textinput.d.ts

@@ -48,6 +48,15 @@ export declare class FieldTextInput extends FieldInput<string> {
      * @internal
      */
     static fromJson(options: FieldTextInputFromJsonConfig): FieldTextInput;
+    /**
+     * Returns this field's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * field.
+     *
+     * @returns This field's class.
+     */
+    getClass(): typeof FieldTextInput;
 }
 /**
  *  Config options for the text input field.

package/core/flyout_base.d.ts

@@ -14,6 +14,8 @@ import { FlyoutItem } from './flyout_item.js';
 import { IAutoHideable } from './interfaces/i_autohideable.js';
 import type { IFlyout } from './interfaces/i_flyout.js';
 import type { IFlyoutInflater } from './interfaces/i_flyout_inflater.js';
+import { IFocusableNode } from './interfaces/i_focusable_node.js';
+import { IFocusableTree } from './interfaces/i_focusable_tree.js';
 import type { Options } from './options.js';
 import * as blocks from './serialization/blocks.js';
 import { Coordinate } from './utils/coordinate.js';
@@ -23,7 +25,7 @@ import { WorkspaceSvg } from './workspace_svg.js';
 /**
  * Class for a flyout.
  */
-export declare abstract class Flyout extends DeleteArea implements IAutoHideable, IFlyout {
+export declare abstract class Flyout extends DeleteArea implements IAutoHideable, IFlyout, IFocusableNode {
     /**
      * Position the flyout.
      */
@@ -399,5 +401,25 @@ export declare abstract class Flyout extends DeleteArea implements IAutoHideable
      *     is registered for that type.
      */
     protected getInflaterForType(type: string): IFlyoutInflater | null;
+    /** See IFocusableNode.getFocusableElement. */
+    getFocusableElement(): HTMLElement | SVGElement;
+    /** See IFocusableNode.getFocusableTree. */
+    getFocusableTree(): IFocusableTree;
+    /** See IFocusableNode.onNodeFocus. */
+    onNodeFocus(): void;
+    /** See IFocusableNode.onNodeBlur. */
+    onNodeBlur(): void;
+    /** See IFocusableTree.getRootFocusableNode. */
+    getRootFocusableNode(): IFocusableNode;
+    /** See IFocusableTree.getRestoredFocusableNode. */
+    getRestoredFocusableNode(_previousNode: IFocusableNode | null): IFocusableNode | null;
+    /** See IFocusableTree.getNestedTrees. */
+    getNestedTrees(): Array<IFocusableTree>;
+    /** See IFocusableTree.lookUpFocusableNode. */
+    lookUpFocusableNode(_id: string): IFocusableNode | null;
+    /** See IFocusableTree.onTreeFocus. */
+    onTreeFocus(_node: IFocusableNode, _previousTree: IFocusableTree | null): void;
+    /** See IFocusableTree.onTreeBlur. */
+    onTreeBlur(nextTree: IFocusableTree | null): void;
 }
 //# sourceMappingURL=flyout_base.d.ts.map

package/core/flyout_button.d.ts

@@ -10,6 +10,9 @@
  */
 import type { IASTNodeLocationSvg } from './blockly.js';
 import type { IBoundedElement } from './interfaces/i_bounded_element.js';
+import type { IFocusableNode } from './interfaces/i_focusable_node.js';
+import type { IFocusableTree } from './interfaces/i_focusable_tree.js';
+import type { INavigable } from './interfaces/i_navigable.js';
 import type { IRenderedElement } from './interfaces/i_rendered_element.js';
 import { Coordinate } from './utils/coordinate.js';
 import { Rect } from './utils/rect.js';
@@ -18,7 +21,7 @@ import type { WorkspaceSvg } from './workspace_svg.js';
 /**
  * Class for a button or label in the flyout.
  */
-export declare class FlyoutButton implements IASTNodeLocationSvg, IBoundedElement, IRenderedElement {
+export declare class FlyoutButton implements IASTNodeLocationSvg, IBoundedElement, IRenderedElement, IFocusableNode, INavigable<FlyoutButton> {
     private readonly workspace;
     private readonly targetWorkspace;
     private readonly isFlyoutLabel;
@@ -49,6 +52,8 @@ export declare class FlyoutButton implements IASTNodeLocationSvg, IBoundedElemen
      * This is null if there is no cursor on the button.
      */
     cursorSvg: SVGElement | null;
+    /** The unique ID for this FlyoutButton. */
+    private id;
     /**
      * @param workspace The workspace in which to place this button.
      * @param targetWorkspace The flyout's target workspace.
@@ -116,12 +121,6 @@ export declare class FlyoutButton implements IASTNodeLocationSvg, IBoundedElemen
      *     group.
      */
     setCursorSvg(cursorSvg: SVGElement): void;
-    /**
-     * Required by IASTNodeLocationSvg, but not used. A marker cannot be set on a
-     * button. If the 'mark' shortcut is used on a button, its associated callback
-     * function is triggered.
-     */
-    setMarkerSvg(): void;
     /**
      * Do something when the button is clicked.
      *
@@ -133,5 +132,29 @@ export declare class FlyoutButton implements IASTNodeLocationSvg, IBoundedElemen
      * @returns The root SVG element of this rendered element.
      */
     getSvgRoot(): SVGGElement;
+    /** See IFocusableNode.getFocusableElement. */
+    getFocusableElement(): HTMLElement | SVGElement;
+    /** See IFocusableNode.getFocusableTree. */
+    getFocusableTree(): IFocusableTree;
+    /** See IFocusableNode.onNodeFocus. */
+    onNodeFocus(): void;
+    /** See IFocusableNode.onNodeBlur. */
+    onNodeBlur(): void;
+    /**
+     * Returns whether or not this button is accessible through keyboard
+     * navigation.
+     *
+     * @returns True if this button is keyboard accessible, otherwise false.
+     */
+    isNavigable(): boolean;
+    /**
+     * Returns this button's class.
+     *
+     * Used by keyboard navigation to look up the rules for navigating from this
+     * button.
+     *
+     * @returns This button's class.
+     */
+    getClass(): typeof FlyoutButton;
 }
 //# sourceMappingURL=flyout_button.d.ts.map