scratch-blocks 2.0.1 → 2.0.3

package/src/fields/scratch_field_variable.ts

@@ -1,5 +1,4 @@
 /**
- * @license
  * Visual Blocks Editor
  *
  * Copyright 2012 Google Inc.
@@ -17,46 +16,46 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
 /**
- * @fileoverview Variable input field.
+ * @file Variable input field.
  * @author fraser@google.com (Neil Fraser)
  */
-import * as Blockly from "blockly/core";
-import * as Constants from "../constants";
-import { ScratchMsgs } from "../../msg/scratch_msgs.js";
-import { createVariable, renameVariable } from "../variables";
-import type { ScratchVariableModel } from "../scratch_variable_model";
+import * as Blockly from 'blockly/core'
+import { ScratchMsgs } from '../../msg/scratch_msgs.js'
+import * as Constants from '../constants'
+import type { ScratchVariableModel } from '../scratch_variable_model'
+import { createVariable, renameVariable } from '../variables'
 
 export class ScratchFieldVariable extends Blockly.FieldVariable {
-  private originalStyle: string;
+  private originalStyle!: string
 
   constructor(
     varName: string | null | typeof Blockly.Field.SKIP_SETUP,
     validator?: Blockly.FieldVariableValidator,
     variableTypes?: string[],
     defaultType?: string,
-    config?: Blockly.FieldVariableConfig
+    config?: Blockly.FieldVariableConfig,
   ) {
-    super(varName, validator, variableTypes, defaultType, config);
-    this.menuGenerator_ = ScratchFieldVariable.dropdownCreate;
+    super(varName, validator, variableTypes, defaultType, config)
+    // dropdownCreate returns MenuOption[] rather than Blockly.MenuGenerator's
+    // MenuOption[][] variant; the cast is needed to satisfy FieldVariable's
+    // menuGenerator_ type while the actual runtime shape is compatible.
+    this.menuGenerator_ = ScratchFieldVariable.dropdownCreate as unknown as Blockly.MenuGenerator
   }
 
   initModel() {
     if (!this.getVariable()) {
-      const sourceBlock = this.getSourceBlock();
+      const sourceBlock = this.getSourceBlock()
       if (sourceBlock) {
-        const broadcastVariable = this.initFlyoutBroadcast(
-          sourceBlock.workspace as Blockly.WorkspaceSvg
-        );
+        const broadcastVariable = this.initFlyoutBroadcast(sourceBlock.workspace as Blockly.WorkspaceSvg)
         if (broadcastVariable) {
-          this.doValueUpdate_(broadcastVariable.getId());
-          return;
+          this.doValueUpdate_(broadcastVariable.getId())
+          return
         }
       }
     }
 
-    super.initModel();
+    super.initModel()
   }
 
   /**
@@ -66,118 +65,101 @@ export class ScratchFieldVariable extends Blockly.FieldVariable {
    * selected option when the workspace is refreshed.
    * Re-sort the broadcast messages by name, and set the field value to the id
    * of the variable that comes first in sorted order.
-   *
    * @param workspace The flyout workspace containing the broadcast block.
    * @returns The variable of type 'broadcast_msg' that comes first in sorted
    * order.
    */
-  initFlyoutBroadcast(
-    workspace: Blockly.WorkspaceSvg
-  ): Blockly.IVariableModel<Blockly.IVariableState> {
-    const broadcastVars = workspace.getVariablesOfType(
-      Constants.BROADCAST_MESSAGE_VARIABLE_TYPE
-    );
+  initFlyoutBroadcast(workspace: Blockly.WorkspaceSvg): Blockly.IVariableModel<Blockly.IVariableState> | undefined {
+    const broadcastVars = workspace.getVariablesOfType(Constants.BROADCAST_MESSAGE_VARIABLE_TYPE)
     if (
       workspace.isFlyout &&
       this.getDefaultType() == Constants.BROADCAST_MESSAGE_VARIABLE_TYPE &&
       broadcastVars.length != 0
     ) {
-      broadcastVars.sort(Blockly.Variables.compareByName);
-      return broadcastVars[0];
+      broadcastVars.sort(Blockly.Variables.compareByName)
+      return broadcastVars[0]
     }
   }
 
   /**
    * Return a sorted list of variable names for variable dropdown menus.
    * Include a special option at the end for creating a new variable name.
-   *
    * @returns Array of variable names.
    */
   static dropdownCreate(this: ScratchFieldVariable): Blockly.MenuOption[] {
-    let options = super.dropdownCreate();
-    const type = this.getDefaultType();
+    let options = super.dropdownCreate()
+    const type = this.getDefaultType()
     if (type === Constants.BROADCAST_MESSAGE_VARIABLE_TYPE) {
-      options.splice(-2, 2, [
-        ScratchMsgs.translate("NEW_BROADCAST_MESSAGE"),
-        Constants.NEW_BROADCAST_MESSAGE_ID,
-      ]);
+      options.splice(-2, 2, [ScratchMsgs.translate('NEW_BROADCAST_MESSAGE'), Constants.NEW_BROADCAST_MESSAGE_ID])
     } else if (type === Constants.LIST_VARIABLE_TYPE) {
-      options = options.map((option) => {
+      options = options.map(option => {
         if (option[1] === Blockly.RENAME_VARIABLE_ID) {
-          return [ScratchMsgs.translate("RENAME_LIST"), option[1]];
+          return [ScratchMsgs.translate('RENAME_LIST'), option[1]]
         } else if (option[1] === Blockly.DELETE_VARIABLE_ID) {
-          return [
-            ScratchMsgs.translate("DELETE_LIST").replace("%1", this.getText()),
-            option[1],
-          ];
+          return [ScratchMsgs.translate('DELETE_LIST').replace('%1', this.getText()), option[1]]
         }
-        return option;
-      });
+        return option
+      })
     }
 
-    return options;
+    return options
   }
 
-  /** Handle the selection of an item in the variable dropdown menu.
+  /**
+   * Handle the selection of an item in the variable dropdown menu.
    * Special case the 'Rename variable...', 'Delete variable...',
    * and 'New message...' options.
    * In the rename case, prompt the user for a new name.
-   *
    * @param menu The Menu component clicked.
    * @param menuItem The MenuItem selected within menu.
    */
   onItemSelected_(menu: Blockly.Menu, menuItem: Blockly.MenuItem) {
-    const sourceBlock = this.getSourceBlock();
+    const sourceBlock = this.getSourceBlock()
     if (sourceBlock && !sourceBlock.isDeadOrDying()) {
-      const selectedItem = menuItem.getValue();
+      const selectedItem = menuItem.getValue()
       if (selectedItem === Constants.NEW_BROADCAST_MESSAGE_ID) {
         createVariable(
           sourceBlock.workspace as Blockly.WorkspaceSvg,
-          (varId) => {
+          varId => {
             if (varId) {
-              this.setValue(varId);
+              this.setValue(varId)
             }
           },
-          Constants.BROADCAST_MESSAGE_VARIABLE_TYPE
-        );
-        return;
+          Constants.BROADCAST_MESSAGE_VARIABLE_TYPE,
+        )
+        return
       } else if (selectedItem === Blockly.RENAME_VARIABLE_ID) {
-        renameVariable(
-          sourceBlock.workspace as Blockly.WorkspaceSvg,
-          this.getVariable() as ScratchVariableModel
-        );
-        return;
+        renameVariable(sourceBlock.workspace as Blockly.WorkspaceSvg, this.getVariable() as ScratchVariableModel)
+        return
       }
     }
-    super.onItemSelected_(menu, menuItem);
+    super.onItemSelected_(menu, menuItem)
   }
 
   showEditor_(event: PointerEvent) {
-    super.showEditor_(event);
-    const sourceBlock = this.getSourceBlock();
-    const styleName = sourceBlock.getStyleName();
+    super.showEditor_(event)
+    const sourceBlock = this.getSourceBlock()!
+    const styleName = sourceBlock.getStyleName()
     const style = (sourceBlock.workspace as Blockly.WorkspaceSvg)
       .getRenderer()
       .getConstants()
-      .getBlockStyle(styleName);
+      .getBlockStyle(styleName)
     if (sourceBlock.isShadow()) {
-      this.originalStyle = styleName;
-      sourceBlock.setStyle(`${this.originalStyle}_selected`);
+      this.originalStyle = styleName
+      sourceBlock.setStyle(`${this.originalStyle}_selected`)
     } else if (this.borderRect_) {
       this.borderRect_.setAttribute(
-        "fill",
-        "colourQuaternary" in style
-          ? `${style.colourQuaternary}`
-          : style.colourTertiary
-      );
+        'fill',
+        'colourQuaternary' in style ? `${style.colourQuaternary}` : style.colourTertiary,
+      )
     }
   }
 
   dropdownDispose_() {
-    super.dropdownDispose_();
-    const sourceBlock = this.getSourceBlock();
+    super.dropdownDispose_()
+    const sourceBlock = this.getSourceBlock()!
     if (sourceBlock.isShadow()) {
-      sourceBlock.setStyle(this.originalStyle);
+      sourceBlock.setStyle(this.originalStyle)
     }
   }
 }
@@ -186,6 +168,6 @@ export class ScratchFieldVariable extends Blockly.FieldVariable {
  * Register the field and any dependencies.
  */
 export function registerScratchFieldVariable() {
-  Blockly.fieldRegistry.unregister("field_variable");
-  Blockly.fieldRegistry.register("field_variable", ScratchFieldVariable);
+  Blockly.fieldRegistry.unregister('field_variable')
+  Blockly.fieldRegistry.register('field_variable', ScratchFieldVariable)
 }

package/src/flyout_checkbox_icon.ts

@@ -1,57 +1,52 @@
 /**
- * @license
  * Copyright 2024 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-
-import * as Blockly from "blockly/core";
-import { CheckboxBubble } from "./checkbox_bubble";
+import * as Blockly from 'blockly/core'
+import { CheckboxBubble } from './checkbox_bubble'
 
 /**
  * Invisible icon that exists solely to host the corresponding checkbox bubble.
  */
-export class FlyoutCheckboxIcon
-  extends Blockly.icons.Icon
-  implements Blockly.IHasBubble
-{
-  private checkboxBubble: CheckboxBubble;
-  private type = new Blockly.icons.IconType("checkbox");
+export class FlyoutCheckboxIcon extends Blockly.icons.Icon implements Blockly.IHasBubble {
+  private checkboxBubble!: CheckboxBubble
+  private type = new Blockly.icons.IconType('checkbox')
 
   constructor(protected override sourceBlock: Blockly.BlockSvg) {
-    super(sourceBlock);
+    super(sourceBlock)
     if (this.sourceBlock.workspace.isFlyout) {
-      this.checkboxBubble = new CheckboxBubble(this.sourceBlock);
+      this.checkboxBubble = new CheckboxBubble(this.sourceBlock)
     }
   }
 
   getType(): Blockly.icons.IconType<FlyoutCheckboxIcon> {
-    return this.type;
+    return this.type
   }
 
   getSize(): Blockly.utils.Size {
     // Awful hack to cancel out the default padding added to icons.
-    return new Blockly.utils.Size(-8, 0);
+    return new Blockly.utils.Size(-8, 0)
   }
 
   isClickableInFlyout(): boolean {
-    return false;
+    return false
   }
 
   bubbleIsVisible(): boolean {
-    return this.sourceBlock.workspace.isFlyout;
+    return this.sourceBlock.workspace.isFlyout
   }
 
   onLocationChange(blockOrigin: Blockly.utils.Coordinate) {
-    this.checkboxBubble?.updateLocation();
+    this.checkboxBubble?.updateLocation()
   }
 
   setChecked(checked: boolean) {
-    this.checkboxBubble?.setChecked(checked);
+    this.checkboxBubble?.setChecked(checked)
   }
 
   dispose() {
-    this.checkboxBubble?.dispose();
-    super.dispose();
+    this.checkboxBubble?.dispose()
+    super.dispose()
   }
 
   // These methods are required by the interfaces, but intentionally have no
@@ -62,17 +57,12 @@ export class FlyoutCheckboxIcon
   initView(pointerDownListener: (e: PointerEvent) => void) {}
 
   canBeFocused() {
-    return false;
+    return false
   }
 
   getBubble() {
-    return this.checkboxBubble;
+    return this.checkboxBubble
   }
 }
 
-Blockly.registry.register(
-  Blockly.registry.Type.ICON,
-  "checkbox",
-  FlyoutCheckboxIcon,
-  true
-);
+Blockly.registry.register(Blockly.registry.Type.ICON, 'checkbox', FlyoutCheckboxIcon, true)

package/src/glows.ts

@@ -1,15 +1,12 @@
 /**
- * @license
  * Copyright 2024 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-
-import * as Blockly from "blockly/core";
-import { Colours } from "./colours";
+import * as Blockly from 'blockly/core'
+import { Colours } from './colours'
 
 /**
  * Glow/unglow a stack in the workspace.
- *
  * @param id ID of block which starts the stack.
  * @param isGlowingStack Whether to glow the stack.
  */
@@ -17,17 +14,17 @@ export function glowStack(id: string, isGlowingStack: boolean) {
   const block = (Blockly.getMainWorkspace().getBlockById(id) ||
     (Blockly.getMainWorkspace() as Blockly.WorkspaceSvg)
       .getFlyout()
-      .getWorkspace()
-      .getBlockById(id)) as Blockly.BlockSvg;
+      ?.getWorkspace()
+      ?.getBlockById(id)) as Blockly.BlockSvg
   if (!block) {
-    throw "Tried to glow block that does not exist.";
+    throw new Error('Tried to glow block that does not exist.')
   }
 
-  const svg = block.getSvgRoot();
-  if (isGlowingStack && !svg.hasAttribute("filter")) {
-    svg.setAttribute("filter", "url(#blocklyStackGlowFilter)");
-  } else if (!isGlowingStack && svg.hasAttribute("filter")) {
-    svg.removeAttribute("filter");
+  const svg = block.getSvgRoot()
+  if (isGlowingStack && !svg.hasAttribute('filter')) {
+    svg.setAttribute('filter', 'url(#blocklyStackGlowFilter)')
+  } else if (!isGlowingStack && svg.hasAttribute('filter')) {
+    svg.removeAttribute('filter')
   }
 }
 
@@ -36,74 +33,70 @@ export function glowStack(id: string, isGlowingStack: boolean) {
  * @param workspace The workspace whose DOM the filter will be inserted in.
  */
 export function buildGlowFilter(workspace: Blockly.WorkspaceSvg) {
-  const svg = workspace.getParentSvg();
-  const defs = Blockly.utils.dom.createSvgElement(
-    Blockly.utils.Svg.DEFS,
-    {},
-    svg
-  );
+  const svg = workspace.getParentSvg()
+  const defs = Blockly.utils.dom.createSvgElement(Blockly.utils.Svg.DEFS, {}, svg)
   // Using a dilate distorts the block shape.
   // Instead use a gaussian blur, and then set all alpha to 1 with a transfer.
   const stackGlowFilter = Blockly.utils.dom.createSvgElement(
-    "filter",
+    'filter',
     {
-      id: "blocklyStackGlowFilter",
-      height: "160%",
-      width: "180%",
-      y: "-30%",
-      x: "-40%",
+      id: 'blocklyStackGlowFilter',
+      height: '160%',
+      width: '180%',
+      y: '-30%',
+      x: '-40%',
     },
-    defs
-  );
+    defs,
+  )
   Blockly.utils.dom.createSvgElement(
-    "feGaussianBlur",
+    'feGaussianBlur',
     {
-      in: "SourceGraphic",
+      in: 'SourceGraphic',
       stdDeviation: Colours.stackGlowSize,
     },
-    stackGlowFilter
-  );
+    stackGlowFilter,
+  )
   // Set all gaussian blur pixels to 1 opacity before applying flood
   const componentTransfer = Blockly.utils.dom.createSvgElement(
-    "feComponentTransfer",
-    { result: "outBlur" },
-    stackGlowFilter
-  );
+    'feComponentTransfer',
+    { result: 'outBlur' },
+    stackGlowFilter,
+  )
   Blockly.utils.dom.createSvgElement(
-    "feFuncA",
+    'feFuncA',
     {
-      type: "table",
-      tableValues: "0" + " 1".repeat(16),
+      type: 'table',
+      tableValues: '0' + ' 1'.repeat(16),
     },
-    componentTransfer
-  );
+    componentTransfer,
+  )
   // Color the highlight
   Blockly.utils.dom.createSvgElement(
-    "feFlood",
+    'feFlood',
     {
-      "flood-color": Colours.stackGlow,
-      "flood-opacity": Colours.stackGlowOpacity,
-      result: "outColor",
+      'flood-color': Colours.stackGlow,
+      'flood-opacity': Colours.stackGlowOpacity,
+      result: 'outColor',
     },
-    stackGlowFilter
-  );
+    stackGlowFilter,
+  )
   Blockly.utils.dom.createSvgElement(
-    "feComposite",
+    'feComposite',
     {
-      in: "outColor",
-      in2: "outBlur",
-      operator: "in",
-      result: "outGlow",
+      in: 'outColor',
+      in2: 'outBlur',
+      operator: 'in',
+      result: 'outGlow',
     },
-    stackGlowFilter
-  );
+    stackGlowFilter,
+  )
   Blockly.utils.dom.createSvgElement(
-    "feComposite",
+    'feComposite',
     {
-      in: "SourceGraphic",
-      in2: "outGlow",
-      operator: "over",
+      in: 'SourceGraphic',
+      in2: 'outGlow',
+      operator: 'over',
     },
-    stackGlowFilter
-  );
+    stackGlowFilter,
+  )
 }