scratch-blocks 2.0.0-spork.4 → 2.0.0-spork.6

package/src/{scratch_comment_bubble.js → scratch_comment_bubble.ts}

@@ -11,17 +11,28 @@ import * as Blockly from "blockly/core";
  * @implements {IBubble}
  * @implements {ISelectable}
  */
-export class ScratchCommentBubble extends Blockly.comments.CommentView {
-  constructor(sourceBlock) {
-    super(sourceBlock.workspace);
+export class ScratchCommentBubble
+  extends Blockly.comments.CommentView
+  implements Blockly.IBubble, Blockly.ISelectable
+{
+  id: string;
+  private sourceBlock: Blockly.BlockSvg;
+  private anchor?: Blockly.utils.Coordinate;
+  private anchorChain?: SVGLineElement;
+  private dragStartLocation?: Blockly.utils.Coordinate;
+
+  constructor(sourceBlock: Blockly.BlockSvg) {
+    const commentId = `${sourceBlock.id}_comment`;
+    super(sourceBlock.workspace, commentId);
     this.sourceBlock = sourceBlock;
     this.disposing = false;
-    this.id = Blockly.utils.idGenerator.genUid();
+    this.id = commentId;
     this.setPlaceholderText(Blockly.Msg.WORKSPACE_COMMENT_DEFAULT_TEXT);
     this.getSvgRoot().setAttribute(
       "style",
       `--colour-commentBorder: ${sourceBlock.getColourTertiary()};`
     );
+    this.getSvgRoot().setAttribute("id", this.id);
 
     Blockly.browserEvents.conditionalBind(
       this.getSvgRoot(),
@@ -34,15 +45,15 @@ export class ScratchCommentBubble extends Blockly.comments.CommentView {
       this.getSvgRoot(),
       "wheel",
       this,
-      (e) => {
+      (e: WheelEvent) => {
         e.stopPropagation();
       }
     );
   }
 
-  setDeleteStyle(enable) {}
+  setDeleteStyle(enable: boolean) {}
   showContextMenu() {}
-  setDragging(start) {}
+  setDragging(start: boolean) {}
   select() {}
   unselect() {}
 
@@ -50,11 +61,13 @@ export class ScratchCommentBubble extends Blockly.comments.CommentView {
     return true;
   }
 
-  moveDuringDrag(newLocation) {
+  moveDuringDrag(newLocation: Blockly.utils.Coordinate) {
     this.moveTo(newLocation);
   }
 
-  moveTo(xOrCoordinate, y) {
+  moveTo(xOrCoordinate: number, y: number): void;
+  moveTo(xOrCoordinate: Blockly.utils.Coordinate): void;
+  moveTo(xOrCoordinate: Blockly.utils.Coordinate | number, y?: number) {
     const destination =
       xOrCoordinate instanceof Blockly.utils.Coordinate
         ? xOrCoordinate
@@ -63,22 +76,22 @@ export class ScratchCommentBubble extends Blockly.comments.CommentView {
     this.redrawAnchorChain();
   }
 
-  startGesture(e) {
+  startGesture(e: PointerEvent) {
     const gesture = this.workspace.getGesture(e);
     if (gesture) {
-      gesture.handleCommentStart(e, this);
+      gesture.handleBubbleStart(e, this);
       Blockly.common.setSelected(this);
     }
   }
 
-  startDrag(event) {
+  startDrag(event: PointerEvent) {
     this.dragStartLocation = this.getRelativeToSurfaceXY();
     this.workspace.setResizesEnabled(false);
     this.workspace.getLayerManager()?.moveToDragLayer(this);
     Blockly.utils.dom.addClass(this.getSvgRoot(), "blocklyDragging");
   }
 
-  drag(newLocation, event) {
+  drag(newLocation: Blockly.utils.Coordinate, event: Event) {
     this.moveTo(newLocation);
   }
 
@@ -101,7 +114,7 @@ export class ScratchCommentBubble extends Blockly.comments.CommentView {
     this.moveTo(this.dragStartLocation);
   }
 
-  setAnchorLocation(newAnchor) {
+  setAnchorLocation(newAnchor: Blockly.utils.Coordinate) {
     const oldAnchor = this.anchor;
     const alreadyAnchored = !!this.anchor;
     this.anchor = newAnchor;
@@ -116,15 +129,19 @@ export class ScratchCommentBubble extends Blockly.comments.CommentView {
   }
 
   dropAnchor() {
-    this.moveTo(this.anchor.x + 40, this.anchor.y - 16);
+    const verticalOffset = 16;
+    this.moveTo(
+      this.anchor.x + 40 * (this.workspace.RTL ? -1 : 1),
+      this.anchor.y - verticalOffset
+    );
     const location = this.getRelativeToSurfaceXY();
     this.anchorChain = Blockly.utils.dom.createSvgElement(
       Blockly.utils.Svg.LINE,
       {
         x1: this.anchor.x - location.x,
         y1: this.anchor.y - location.y,
-        x2: this.getSize().width / 2,
-        y2: 16,
+        x2: (this.getSize().width / 2) * (this.workspace.RTL ? -1 : 1),
+        y2: verticalOffset,
         style: `stroke: ${this.sourceBlock.getColourTertiary()}; stroke-width: 1`,
       },
       this.getSvgRoot()
@@ -139,8 +156,8 @@ export class ScratchCommentBubble extends Blockly.comments.CommentView {
     if (!this.anchorChain) return;
 
     const location = this.getRelativeToSurfaceXY();
-    this.anchorChain.setAttribute("x1", this.anchor.x - location.x);
-    this.anchorChain.setAttribute("y1", this.anchor.y - location.y);
+    this.anchorChain.setAttribute("x1", `${this.anchor.x - location.x}`);
+    this.anchorChain.setAttribute("y1", `${this.anchor.y - location.y}`);
   }
 
   getId() {
@@ -166,4 +183,20 @@ export class ScratchCommentBubble extends Blockly.comments.CommentView {
     }
     super.dispose();
   }
+
+  getFocusableElement() {
+    return this.getSvgRoot();
+  }
+
+  getFocusableTree() {
+    return this.workspace;
+  }
+
+  onNodeFocus() {}
+
+  onNodeBlur() {}
+
+  canBeFocused() {
+    return true;
+  }
 }

package/src/scratch_comment_icon.ts

@@ -5,7 +5,7 @@
  */
 
 import * as Blockly from "blockly/core";
-import { ScratchCommentBubble } from "./scratch_comment_bubble.js";
+import { ScratchCommentBubble } from "./scratch_comment_bubble";
 
 interface CommentState {
   text: string;
@@ -19,7 +19,7 @@ interface CommentState {
 /**
  * Custom comment icon that draws no icon indicator, used for block comments.
  */
-class ScratchCommentIcon
+export class ScratchCommentIcon
   extends Blockly.icons.Icon
   implements Blockly.ISerializable, Blockly.IHasBubble
 {
@@ -34,9 +34,7 @@ class ScratchCommentIcon
   constructor(protected sourceBlock: Blockly.BlockSvg) {
     super(sourceBlock);
     this.commentBubble = new ScratchCommentBubble(this.sourceBlock);
-    Blockly.Events.fire(
-      new (Blockly.Events.get("block_comment_create"))(this.commentBubble)
-    );
+    this.fireCreateEvent();
     this.onTextChangedListener = this.onTextChanged.bind(this);
     this.onSizeChangedListener = this.onSizeChanged.bind(this);
     this.onCollapseListener = this.onCollapsed.bind(this);
@@ -198,10 +196,27 @@ class ScratchCommentIcon
     this.commentBubble.setCollapsed(!visible);
   }
 
+  getBubble() {
+    return this.commentBubble;
+  }
+
   dispose() {
     this.commentBubble.dispose();
     super.dispose();
   }
+
+  canBeFocused() {
+    return false;
+  }
+
+  /**
+   * Fires a block comment create event corresponding to this icon's comment.
+   */
+  fireCreateEvent() {
+    Blockly.Events.fire(
+      new (Blockly.Events.get("block_comment_create"))(this.commentBubble)
+    );
+  }
 }
 
 Blockly.registry.register(

package/src/scratch_continuous_toolbox.ts

@@ -67,4 +67,20 @@ export class ScratchContinuousToolbox extends ContinuousToolbox {
   runAfterRerender(callback: () => void) {
     this.postRenderCallbacks.push(callback);
   }
+
+  /**
+   * Returns whether or not the given item should be deselected.
+   * Prevents items from being deselected without a replacement.
+   *
+   * @param oldItem The item that was previously selected.
+   * @param newItem The item that is proposed to be selected instead.
+   * @returns True if the old item should be allowed to be deselected.
+   */
+  shouldDeselectItem_(
+    oldItem: Blockly.ISelectableToolboxItem | null,
+    newItem: Blockly.ISelectableToolboxItem | null
+  ) {
+    if (!newItem) return false;
+    return super.shouldDeselectItem_(oldItem, newItem);
+  }
 }

package/src/scratch_insertion_marker_previewer.ts

@@ -0,0 +1,45 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import * as Blockly from "blockly/core";
+
+/**
+ * Displays an indicator of where a block being dragged will be connected.
+ */
+class ScratchInsertionMarkerPreviewer extends Blockly.InsertionMarkerPreviewer {
+  /**
+   * Transforms the given block into a JSON representation used to construct an
+   * insertion marker.
+   *
+   * @param block The block to serialize and use as an insertion marker.
+   * @returns A JSON-formatted string corresponding to a serialized
+   *     representation of the given block suitable for use as an insertion
+   *     marker.
+   */
+  protected override serializeBlockToInsertionMarker(block: Blockly.BlockSvg) {
+    const blockJson = Blockly.serialization.blocks.save(block, {
+      addCoordinates: false,
+      addInputBlocks: true,
+      addNextBlocks: false,
+      doFullSerialization: false,
+    });
+
+    if (!blockJson) {
+      throw new Error(
+        `Failed to serialize source block. ${block.toDevString()}`
+      );
+    }
+
+    return blockJson;
+  }
+}
+
+Blockly.registry.register(
+  Blockly.registry.Type.CONNECTION_PREVIEWER,
+  Blockly.registry.DEFAULT,
+  ScratchInsertionMarkerPreviewer,
+  true
+);

package/src/status_indicator_label_flyout_inflater.ts

@@ -22,15 +22,15 @@ class StatusIndicatorLabelFlyoutInflater extends Blockly.LabelFlyoutInflater {
    */
   load(
     state: Blockly.utils.toolbox.LabelInfo,
-    flyoutWorkspace: Blockly.WorkspaceSvg
+    flyout: Blockly.IFlyout
   ): Blockly.FlyoutItem {
     const label = new StatusIndicatorLabel(
-      flyoutWorkspace,
-      flyoutWorkspace.targetWorkspace,
+      flyout.getWorkspace(),
+      flyout.targetWorkspace,
       state
     );
     label.show();
-    return new Blockly.FlyoutItem(label, STATUS_INDICATOR_LABEL_TYPE, true);
+    return new Blockly.FlyoutItem(label, STATUS_INDICATOR_LABEL_TYPE);
   }
 }
 

package/src/xml.ts

@@ -0,0 +1,57 @@
+/**
+ * @license
+ * Copyright 2025 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import * as Blockly from "blockly/core";
+import { ScratchVariableModel } from "./scratch_variable_model";
+
+/**
+ * Clears the workspace and loads the given serialized state.
+ *
+ * @param xml XML representation of a Blockly workspace.
+ * @param workspace The workspace to load the serialized data onto.
+ */
+export function clearWorkspaceAndLoadFromXml(
+  xml: Element,
+  workspace: Blockly.WorkspaceSvg
+): string[] {
+  workspace.setResizesEnabled(false);
+  Blockly.Events.setGroup(true);
+  workspace.clear();
+
+  // Manually load variables to include the cloud and local properties that core
+  // Blockly is unaware of.
+  for (const variable of xml.querySelectorAll("variables variable")) {
+    const id = variable.getAttribute("id");
+    if (!id) continue;
+    const type = variable.getAttribute("type");
+    const name = variable.textContent;
+    const isLocal = variable.getAttribute("islocal") === "true";
+    const isCloud = variable.getAttribute("iscloud") === "true";
+
+    const variableModel = new ScratchVariableModel(
+      workspace,
+      name,
+      type,
+      id,
+      isLocal,
+      isCloud
+    );
+    Blockly.Events.fire(
+      new (Blockly.Events.get(Blockly.Events.VAR_CREATE))(variableModel)
+    );
+    workspace.getVariableMap().addVariable(variableModel);
+  }
+
+  // Remove the `variables` element from the XML to prevent Blockly from
+  // throwing or stomping on the variables we created.
+  xml.querySelector("variables").remove();
+
+  // Defer to core for the rest of the deserialization.
+  const blockIds = Blockly.Xml.domToWorkspace(xml, workspace);
+
+  workspace.setResizesEnabled(true);
+  return blockIds;
+}