From 212f13af083004368abb5c5f4e46da6a41995b70 Mon Sep 17 00:00:00 2001
From: RoboErikG <RoboErikG@users.noreply.github.com>
Date: Fri, 28 Mar 2025 14:02:28 -0700
Subject: [PATCH] feat: Add a method for creating flyout options (#8829)

---
 core/toolbox/toolbox.ts | 16 +---------------
 core/trashcan.ts        | 15 +--------------
 core/workspace_svg.ts   | 35 +++++++++++++++++++++++------------
 3 files changed, 25 insertions(+), 41 deletions(-)

diff --git a/core/toolbox/toolbox.ts b/core/toolbox/toolbox.ts
index 556bc89e6..8d4f4c9c8 100644
--- a/core/toolbox/toolbox.ts
+++ b/core/toolbox/toolbox.ts
@@ -13,7 +13,6 @@
 
 // Unused import preserved for side-effects. Remove if unneeded.
 import {BlockSvg} from '../block_svg.js';
-import type {BlocklyOptions} from '../blockly_options.js';
 import * as browserEvents from '../browser_events.js';
 import * as common from '../common.js';
 import {ComponentManager} from '../component_manager.js';
@@ -33,7 +32,6 @@ import {isSelectableToolboxItem} from '../interfaces/i_selectable_toolbox_item.j
 import type {IStyleable} from '../interfaces/i_styleable.js';
 import type {IToolbox} from '../interfaces/i_toolbox.js';
 import type {IToolboxItem} from '../interfaces/i_toolbox_item.js';
-import {Options} from '../options.js';
 import * as registry from '../registry.js';
 import type {KeyboardShortcut} from '../shortcut_registry.js';
 import * as Touch from '../touch.js';
@@ -325,19 +323,7 @@ export class Toolbox
    */
   protected createFlyout_(): IFlyout {
     const workspace = this.workspace_;
-    // TODO (#4247): Look into adding a makeFlyout method to Blockly Options.
-    const workspaceOptions = new Options({
-      'parentWorkspace': workspace,
-      'rtl': workspace.RTL,
-      'oneBasedIndex': workspace.options.oneBasedIndex,
-      'horizontalLayout': workspace.horizontalLayout,
-      'renderer': workspace.options.renderer,
-      'rendererOverrides': workspace.options.rendererOverrides,
-      'modalInputs': workspace.options.modalInputs,
-      'move': {
-        'scrollbars': true,
-      },
-    } as BlocklyOptions);
+    const workspaceOptions = workspace.copyOptionsForFlyout();
     // Options takes in either 'end' or 'start'. This has already been parsed to
     // be either 0 or 1, so set it after.
     workspaceOptions.toolboxPosition = workspace.options.toolboxPosition;
diff --git a/core/trashcan.ts b/core/trashcan.ts
index fdff7c50b..0e80913f3 100644
--- a/core/trashcan.ts
+++ b/core/trashcan.ts
@@ -12,7 +12,6 @@
 // Former goog.module ID: Blockly.Trashcan
 
 // Unused import preserved for side-effects. Remove if unneeded.
-import type {BlocklyOptions} from './blockly_options.js';
 import * as browserEvents from './browser_events.js';
 import {ComponentManager} from './component_manager.js';
 import {DeleteArea} from './delete_area.js';
@@ -26,7 +25,6 @@ import type {IDraggable} from './interfaces/i_draggable.js';
 import type {IFlyout} from './interfaces/i_flyout.js';
 import type {IPositionable} from './interfaces/i_positionable.js';
 import type {UiMetrics} from './metrics_manager.js';
-import {Options} from './options.js';
 import * as uiPosition from './positionable_helpers.js';
 import * as registry from './registry.js';
 import type * as blocks from './serialization/blocks.js';
@@ -103,18 +101,7 @@ export class Trashcan
     }
 
     // Create flyout options.
-    const flyoutWorkspaceOptions = new Options({
-      'scrollbars': true,
-      'parentWorkspace': this.workspace,
-      'rtl': this.workspace.RTL,
-      'oneBasedIndex': this.workspace.options.oneBasedIndex,
-      'renderer': this.workspace.options.renderer,
-      'rendererOverrides': this.workspace.options.rendererOverrides,
-      'modalInputs': this.workspace.options.modalInputs,
-      'move': {
-        'scrollbars': true,
-      },
-    } as BlocklyOptions);
+    const flyoutWorkspaceOptions = this.workspace.copyOptionsForFlyout();
     // Create vertical or horizontal flyout.
     if (this.workspace.horizontalLayout) {
       flyoutWorkspaceOptions.toolboxPosition =
diff --git a/core/workspace_svg.ts b/core/workspace_svg.ts
index 94254a1ba..58ef92806 100644
--- a/core/workspace_svg.ts
+++ b/core/workspace_svg.ts
@@ -938,6 +938,28 @@ export class WorkspaceSvg extends Workspace implements IASTNodeLocationSvg {
     this.svgGroup_.appendChild(svgZoomControls);
   }
 
+  /**
+   * Creates a new set of options from this workspace's options with just the
+   * values that are relevant to a flyout.
+   *
+   * @returns A subset of this workspace's options.
+   */
+  copyOptionsForFlyout(): Options {
+    return new Options({
+      'parentWorkspace': this,
+      'rtl': this.RTL,
+      'oneBasedIndex': this.options.oneBasedIndex,
+      'horizontalLayout': this.horizontalLayout,
+      'renderer': this.options.renderer,
+      'rendererOverrides': this.options.rendererOverrides,
+      'plugins': this.options.plugins,
+      'modalInputs': this.options.modalInputs,
+      'move': {
+        'scrollbars': true,
+      },
+    } as BlocklyOptions);
+  }
+
   /**
    * Add a flyout element in an element with the given tag name.
    *
@@ -946,18 +968,7 @@ export class WorkspaceSvg extends Workspace implements IASTNodeLocationSvg {
    * @internal
    */
   addFlyout(tagName: string | Svg<SVGSVGElement> | Svg<SVGGElement>): Element {
-    const workspaceOptions = new Options({
-      'parentWorkspace': this,
-      'rtl': this.RTL,
-      'oneBasedIndex': this.options.oneBasedIndex,
-      'horizontalLayout': this.horizontalLayout,
-      'renderer': this.options.renderer,
-      'rendererOverrides': this.options.rendererOverrides,
-      'modalInputs': this.options.modalInputs,
-      'move': {
-        'scrollbars': true,
-      },
-    } as BlocklyOptions);
+    const workspaceOptions = this.copyOptionsForFlyout();
     workspaceOptions.toolboxPosition = this.options.toolboxPosition;
     if (this.horizontalLayout) {
       const HorizontalFlyout = registry.getClassFromOptions(