scratch-blocks 2.0.1 → 2.0.3

package/src/scratch_block_paster.ts

@@ -1,11 +1,9 @@
 /**
- * @license
  * Copyright 2024 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-
-import * as Blockly from "blockly/core";
-import type { ScratchCommentIcon } from "./scratch_comment_icon";
+import * as Blockly from 'blockly/core'
+import type { ScratchCommentIcon } from './scratch_comment_icon'
 
 /**
  * Class responsible for handling the pasting of copied blocks.
@@ -13,35 +11,32 @@ import type { ScratchCommentIcon } from "./scratch_comment_icon";
 class ScratchBlockPaster extends Blockly.clipboard.BlockPaster {
   /**
    * Deserializes the given block data onto the workspace.
-   *
    * @param copyData The serialized block state to create a copy of on the
    *     workspace.
    * @param workspace The workspace to paste the block onto.
    * @param coordinate The location to paste the block.
+   * @returns The newly pasted block, or undefined if pasting failed.
    */
   paste(
     copyData: Blockly.clipboard.BlockCopyData,
     workspace: Blockly.WorkspaceSvg,
-    coordinate: Blockly.utils.Coordinate
+    coordinate: Blockly.utils.Coordinate,
   ) {
-    const block = super.paste(copyData, workspace, coordinate);
-    if (
-      block?.type === "argument_reporter_boolean" ||
-      block?.type === "argument_reporter_string_number"
-    ) {
-      block.setDragStrategy(new Blockly.dragging.BlockDragStrategy(block));
+    const block = super.paste(copyData, workspace, coordinate)
+    if (block?.type === 'argument_reporter_boolean' || block?.type === 'argument_reporter_string_number') {
+      block.setDragStrategy(new Blockly.dragging.BlockDragStrategy(block))
     }
 
     // Deserialization of blocks suppresses events, so even though this gets
     // fired for blocks with comments, the VM will never receive it, causing its
     // state to get out of sync. Manually fire it here (after suppression has
     // been turned off) if needed.
-    const commentIcon = block.getIcon(Blockly.icons.IconType.COMMENT);
+    const commentIcon = block?.getIcon(Blockly.icons.IconType.COMMENT)
     if (commentIcon) {
-      (commentIcon as ScratchCommentIcon).fireCreateEvent();
+      ;(commentIcon as ScratchCommentIcon).fireCreateEvent()
     }
 
-    return block;
+    return block
   }
 }
 
@@ -50,9 +45,6 @@ class ScratchBlockPaster extends Blockly.clipboard.BlockPaster {
  * place.
  */
 export function registerScratchBlockPaster() {
-  Blockly.clipboard.registry.unregister(ScratchBlockPaster.TYPE);
-  Blockly.clipboard.registry.register(
-    ScratchBlockPaster.TYPE,
-    new ScratchBlockPaster()
-  );
+  Blockly.clipboard.registry.unregister(ScratchBlockPaster.TYPE)
+  Blockly.clipboard.registry.register(ScratchBlockPaster.TYPE, new ScratchBlockPaster())
 }

package/src/scratch_blocks_utils.ts

@@ -1,5 +1,4 @@
 /**
- * @license
  * Visual Blocks Editor
  *
  * Copyright 2018 Google Inc.
@@ -17,23 +16,21 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-
 /**
- * @fileoverview Utility methods for Scratch Blocks but not Blockly.
+ * @file Utility methods for Scratch Blocks but not Blockly.
  * @author fenichel@google.com (Rachel Fenichel)
  */
-import * as Blockly from "blockly/core";
+import * as Blockly from 'blockly/core'
 
 /**
  * Compare strings with natural number sorting.
- *
  * @param str1 First input.
  * @param str2 Second input.
  * @returns -1, 0, or 1 to signify greater than, equality, or less than.
  */
 export function compareStrings(str1: string, str2: string): number {
   return str1.localeCompare(str2, [], {
-    sensitivity: "base",
+    sensitivity: 'base',
     numeric: true,
-  });
+  })
 }

package/src/scratch_comment_bubble.ts

@@ -1,54 +1,37 @@
 /**
- * @license
  * Copyright 2024 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-
-import * as Blockly from "blockly/core";
+import * as Blockly from 'blockly/core'
 
 /**
  * A Scratch-style comment bubble for block comments.
- * @implements {IBubble}
- * @implements {ISelectable}
  */
 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;
+  id: string
+  private sourceBlock: Blockly.BlockSvg | null
+  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 = 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(),
-      "pointerdown",
-      this,
-      this.startGesture
-    );
+    const commentId = `${sourceBlock.id}_comment`
+    super(sourceBlock.workspace, commentId)
+    this.sourceBlock = sourceBlock
+    this.disposing = false
+    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(), 'pointerdown', this, this.startGesture)
     // Don't zoom with mousewheel; let it scroll instead.
-    Blockly.browserEvents.conditionalBind(
-      this.getSvgRoot(),
-      "wheel",
-      this,
-      (e: WheelEvent) => {
-        e.stopPropagation();
-      }
-    );
+    Blockly.browserEvents.conditionalBind(this.getSvgRoot(), 'wheel', this, (e: WheelEvent) => {
+      e.stopPropagation()
+    })
   }
 
   setDeleteStyle(enable: boolean) {}
@@ -58,138 +41,126 @@ export class ScratchCommentBubble
   unselect() {}
 
   isMovable() {
-    return true;
+    return true
   }
 
   moveDuringDrag(newLocation: Blockly.utils.Coordinate) {
-    this.moveTo(newLocation);
+    this.moveTo(newLocation)
   }
 
-  moveTo(xOrCoordinate: number, y: number): void;
-  moveTo(xOrCoordinate: Blockly.utils.Coordinate): void;
+  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
-        : new Blockly.utils.Coordinate(xOrCoordinate, y);
-    super.moveTo(destination);
-    this.redrawAnchorChain();
+        : new Blockly.utils.Coordinate(xOrCoordinate, y!)
+    super.moveTo(destination)
+    this.redrawAnchorChain()
   }
 
   startGesture(e: PointerEvent) {
-    const gesture = this.workspace.getGesture(e);
+    const gesture = this.workspace.getGesture(e)
     if (gesture) {
-      gesture.handleBubbleStart(e, this);
-      Blockly.common.setSelected(this);
+      // ScratchCommentBubble implements IBubble structurally but TypeScript
+      // cannot verify it because IBubble.drag has a different signature here.
+      gesture.handleBubbleStart(e, this as unknown as Blockly.IBubble)
+      Blockly.common.setSelected(this)
     }
   }
 
   startDrag(event: PointerEvent) {
-    this.dragStartLocation = this.getRelativeToSurfaceXY();
-    this.workspace.setResizesEnabled(false);
-    this.workspace.getLayerManager()?.moveToDragLayer(this);
-    Blockly.utils.dom.addClass(this.getSvgRoot(), "blocklyDragging");
+    this.dragStartLocation = this.getRelativeToSurfaceXY()
+    this.workspace.setResizesEnabled(false)
+    this.workspace.getLayerManager()?.moveToDragLayer(this)
+    Blockly.utils.dom.addClass(this.getSvgRoot(), 'blocklyDragging')
   }
 
-  drag(newLocation: Blockly.utils.Coordinate, event: Event) {
-    this.moveTo(newLocation);
+  drag(newLocation: Blockly.utils.Coordinate, event?: PointerEvent) {
+    this.moveTo(newLocation)
   }
 
   endDrag() {
-    this.workspace
-      .getLayerManager()
-      ?.moveOffDragLayer(this, Blockly.layers.BUBBLE);
-    this.workspace.setResizesEnabled(false);
-    Blockly.utils.dom.removeClass(this.getSvgRoot(), "blocklyDragging");
+    this.workspace.getLayerManager()?.moveOffDragLayer(this, Blockly.layers.BUBBLE)
+    this.workspace.setResizesEnabled(false)
+    Blockly.utils.dom.removeClass(this.getSvgRoot(), 'blocklyDragging')
     Blockly.Events.fire(
-      new (Blockly.Events.get("block_comment_move"))(
-        this,
-        this.dragStartLocation,
-        this.getRelativeToSurfaceXY()
-      )
-    );
+      new (Blockly.Events.get('block_comment_move'))(this, this.dragStartLocation, this.getRelativeToSurfaceXY()),
+    )
   }
 
   revertDrag() {
-    this.moveTo(this.dragStartLocation);
+    this.moveTo(this.dragStartLocation!)
   }
 
   setAnchorLocation(newAnchor: Blockly.utils.Coordinate) {
-    const oldAnchor = this.anchor;
-    const alreadyAnchored = !!this.anchor;
-    this.anchor = newAnchor;
+    const oldAnchor = this.anchor
+    const alreadyAnchored = !!this.anchor
+    this.anchor = newAnchor
     if (!alreadyAnchored) {
-      this.dropAnchor();
+      this.dropAnchor()
     } else {
-      const oldLocation = this.getRelativeToSurfaceXY();
-      const delta = Blockly.utils.Coordinate.difference(this.anchor, oldAnchor);
-      const newLocation = Blockly.utils.Coordinate.sum(oldLocation, delta);
-      this.moveTo(newLocation);
+      const oldLocation = this.getRelativeToSurfaceXY()
+      const delta = Blockly.utils.Coordinate.difference(this.anchor, oldAnchor!)
+      const newLocation = Blockly.utils.Coordinate.sum(oldLocation, delta)
+      this.moveTo(newLocation)
     }
   }
 
   dropAnchor() {
-    const verticalOffset = 16;
-    this.moveTo(
-      this.anchor.x + 40 * (this.workspace.RTL ? -1 : 1),
-      this.anchor.y - verticalOffset
-    );
-    const location = this.getRelativeToSurfaceXY();
+    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,
+        x1: this.anchor!.x - location.x,
+        y1: this.anchor!.y - location.y,
         x2: (this.getSize().width / 2) * (this.workspace.RTL ? -1 : 1),
         y2: verticalOffset,
-        style: `stroke: ${this.sourceBlock.getColourTertiary()}; stroke-width: 1`,
+        style: `stroke: ${this.sourceBlock!.getColourTertiary()}; stroke-width: 1`,
       },
-      this.getSvgRoot()
-    );
-    this.getSvgRoot().insertBefore(
-      this.anchorChain,
-      this.getSvgRoot().firstChild
-    );
+      this.getSvgRoot(),
+    )
+    this.getSvgRoot().insertBefore(this.anchorChain, this.getSvgRoot().firstChild)
   }
 
   redrawAnchorChain() {
-    if (!this.anchorChain) return;
+    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}`);
+    const location = this.getRelativeToSurfaceXY()
+    this.anchorChain.setAttribute('x1', `${this.anchor!.x - location.x}`)
+    this.anchorChain.setAttribute('y1', `${this.anchor!.y - location.y}`)
   }
 
   getId() {
-    return this.id;
+    return this.id
   }
 
   getSourceBlock() {
-    return this.sourceBlock;
+    return this.sourceBlock
   }
 
   dispose() {
-    this.disposing = true;
-    Blockly.utils.dom.removeNode(this.anchorChain);
+    this.disposing = true
+    Blockly.utils.dom.removeNode(this.anchorChain ?? null)
     if (this.sourceBlock) {
-      Blockly.Events.fire(
-        new (Blockly.Events.get("block_comment_delete"))(this, this.sourceBlock)
-      );
-      const block = this.sourceBlock;
-      this.sourceBlock = null;
+      Blockly.Events.fire(new (Blockly.Events.get('block_comment_delete'))(this, this.sourceBlock))
+      const block = this.sourceBlock
+      this.sourceBlock = null
       if (!block.isDeadOrDying()) {
-        block.setCommentText(null);
+        block.setCommentText(null)
       }
     }
-    super.dispose();
+    super.dispose()
   }
 
   getFocusableElement() {
-    return this.getSvgRoot();
+    return this.getSvgRoot()
   }
 
   getFocusableTree() {
-    return this.workspace;
+    return this.workspace
   }
 
   onNodeFocus() {}
@@ -197,6 +168,6 @@ export class ScratchCommentBubble
   onNodeBlur() {}
 
   canBeFocused() {
-    return true;
+    return true
   }
 }

package/src/scratch_comment_icon.ts

@@ -1,169 +1,125 @@
 /**
- * @license
  * Copyright 2024 Google LLC
  * SPDX-License-Identifier: Apache-2.0
  */
-
-import * as Blockly from "blockly/core";
-import { ScratchCommentBubble } from "./scratch_comment_bubble";
+import * as Blockly from 'blockly/core'
+import { ScratchCommentBubble } from './scratch_comment_bubble'
 
 interface CommentState {
-  text: string;
-  height: number;
-  width: number;
-  x: number;
-  y: number;
-  collapsed: boolean;
+  text: string
+  height: number
+  width: number
+  x: number
+  y: number
+  collapsed: boolean
 }
 
 /**
  * Custom comment icon that draws no icon indicator, used for block comments.
  */
-export class ScratchCommentIcon
-  extends Blockly.icons.Icon
-  implements Blockly.ISerializable, Blockly.IHasBubble
-{
-  private commentBubble: ScratchCommentBubble;
-  private onTextChangedListener: (oldText: string, newText: string) => void;
-  private onSizeChangedListener: (
-    oldSize: Blockly.utils.Size,
-    newSize: Blockly.utils.Size
-  ) => void;
-  private onCollapseListener: (collapsed: boolean) => void;
+export class ScratchCommentIcon extends Blockly.icons.Icon implements Blockly.ISerializable, Blockly.IHasBubble {
+  private commentBubble: ScratchCommentBubble
+  private onTextChangedListener: (oldText: string, newText: string) => void
+  private onSizeChangedListener: (oldSize: Blockly.utils.Size, newSize: Blockly.utils.Size) => void
+  private onCollapseListener: (collapsed: boolean) => void
 
   constructor(protected sourceBlock: Blockly.BlockSvg) {
-    super(sourceBlock);
-    this.commentBubble = new ScratchCommentBubble(this.sourceBlock);
-    this.fireCreateEvent();
-    this.onTextChangedListener = this.onTextChanged.bind(this);
-    this.onSizeChangedListener = this.onSizeChanged.bind(this);
-    this.onCollapseListener = this.onCollapsed.bind(this);
-    this.commentBubble.addTextChangeListener(this.onTextChangedListener);
-    this.commentBubble.addSizeChangeListener(this.onSizeChangedListener);
-    this.commentBubble.addOnCollapseListener(this.onCollapseListener);
+    super(sourceBlock)
+    this.commentBubble = new ScratchCommentBubble(this.sourceBlock)
+    this.fireCreateEvent()
+    this.onTextChangedListener = this.onTextChanged.bind(this)
+    this.onSizeChangedListener = this.onSizeChanged.bind(this)
+    this.onCollapseListener = this.onCollapsed.bind(this)
+    this.commentBubble.addTextChangeListener(this.onTextChangedListener)
+    this.commentBubble.addSizeChangeListener(this.onSizeChangedListener)
+    this.commentBubble.addOnCollapseListener(this.onCollapseListener)
   }
 
   getType(): Blockly.icons.IconType<ScratchCommentIcon> {
-    return Blockly.icons.IconType.COMMENT;
+    return Blockly.icons.IconType.COMMENT
   }
 
   initView(pointerDownListener: (e: PointerEvent) => void) {
     // Scratch comments have no indicator icon on the block.
-    return;
+    return
   }
 
   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)
   }
 
   getAnchorPoint(): Blockly.utils.Coordinate {
-    const blockRect = this.sourceBlock.getBoundingRectangleWithoutChildren();
-    const y = blockRect.top + this.offsetInBlock.y;
-    const x = this.sourceBlock.workspace.RTL ? blockRect.left : blockRect.right;
-    return new Blockly.utils.Coordinate(x, y);
+    const blockRect = this.sourceBlock.getBoundingRectangleWithoutChildren()
+    const y = blockRect.top + this.offsetInBlock.y
+    const x = this.sourceBlock.workspace.RTL ? blockRect.left : blockRect.right
+    return new Blockly.utils.Coordinate(x, y)
   }
 
   onLocationChange(blockOrigin: Blockly.utils.Coordinate) {
-    if (!this.sourceBlock || !this.commentBubble) return;
+    if (!this.sourceBlock || !this.commentBubble) return
 
     if (this.sourceBlock.isInsertionMarker()) {
-      this.commentBubble.dispose();
-      return;
+      this.commentBubble.dispose()
+      return
     }
 
-    super.onLocationChange(blockOrigin);
-    const oldBubbleLocation = this.commentBubble.getRelativeToSurfaceXY();
-    this.commentBubble.setAnchorLocation(this.getAnchorPoint());
-    const newBubbleLocation = this.commentBubble.getRelativeToSurfaceXY();
+    super.onLocationChange(blockOrigin)
+    const oldBubbleLocation = this.commentBubble.getRelativeToSurfaceXY()
+    this.commentBubble.setAnchorLocation(this.getAnchorPoint())
+    const newBubbleLocation = this.commentBubble.getRelativeToSurfaceXY()
     Blockly.Events.fire(
-      new (Blockly.Events.get("block_comment_move"))(
-        this.commentBubble,
-        oldBubbleLocation,
-        newBubbleLocation
-      )
-    );
+      new (Blockly.Events.get('block_comment_move'))(this.commentBubble, oldBubbleLocation, newBubbleLocation),
+    )
   }
 
   setText(text: string) {
-    this.commentBubble?.setText(text);
+    this.commentBubble?.setText(text)
   }
 
   getText(): string {
-    return this.commentBubble?.getText() ?? "";
+    return this.commentBubble?.getText() ?? ''
   }
 
   onTextChanged(oldText: string, newText: string) {
     Blockly.Events.fire(
-      new (Blockly.Events.get(Blockly.Events.BLOCK_CHANGE))(
-        this.sourceBlock,
-        "comment",
-        null,
-        oldText,
-        newText
-      )
-    );
-    Blockly.Events.fire(
-      new (Blockly.Events.get("block_comment_change"))(
-        this.commentBubble,
-        oldText,
-        newText
-      )
-    );
+      new (Blockly.Events.get(Blockly.Events.BLOCK_CHANGE))(this.sourceBlock, 'comment', null, oldText, newText),
+    )
+    Blockly.Events.fire(new (Blockly.Events.get('block_comment_change'))(this.commentBubble, oldText, newText))
   }
 
   onCollapsed(collapsed: boolean) {
-    Blockly.Events.fire(
-      new (Blockly.Events.get("block_comment_collapse"))(
-        this.commentBubble,
-        collapsed
-      )
-    );
+    Blockly.Events.fire(new (Blockly.Events.get('block_comment_collapse'))(this.commentBubble, collapsed))
   }
 
   onSizeChanged(oldSize: Blockly.utils.Size, newSize: Blockly.utils.Size) {
-    Blockly.Events.fire(
-      new (Blockly.Events.get("block_comment_resize"))(
-        this.commentBubble,
-        oldSize,
-        newSize
-      )
-    );
+    Blockly.Events.fire(new (Blockly.Events.get('block_comment_resize'))(this.commentBubble, oldSize, newSize))
   }
 
   setBubbleSize(size: Blockly.utils.Size) {
-    this.commentBubble?.setSize(size);
+    this.commentBubble?.setSize(size)
   }
 
   getBubbleSize(): Blockly.utils.Size {
-    return this.commentBubble?.getSize() ?? new Blockly.utils.Size(0, 0);
+    return this.commentBubble?.getSize() ?? new Blockly.utils.Size(0, 0)
   }
 
   setBubbleLocation(newLocation: Blockly.utils.Coordinate) {
-    const oldLocation = this.getBubbleLocation();
-    this.commentBubble?.moveTo(newLocation);
-    Blockly.Events.fire(
-      new (Blockly.Events.get("block_comment_move"))(
-        this.commentBubble,
-        oldLocation,
-        newLocation
-      )
-    );
+    const oldLocation = this.getBubbleLocation()
+    this.commentBubble?.moveTo(newLocation)
+    Blockly.Events.fire(new (Blockly.Events.get('block_comment_move'))(this.commentBubble, oldLocation, newLocation))
   }
 
   getBubbleLocation(): Blockly.utils.Coordinate {
-    return this.commentBubble?.getRelativeToSurfaceXY();
+    return this.commentBubble?.getRelativeToSurfaceXY()
   }
 
   saveState(): CommentState | null {
-    if (!this.commentBubble) return null;
-
-    const size = this.getBubbleSize();
-    const bubbleLocation = this.commentBubble.getRelativeToSurfaceXY();
-    const delta = Blockly.utils.Coordinate.difference(
-      bubbleLocation,
-      this.workspaceLocation
-    );
+    if (!this.commentBubble) return null
+
+    const size = this.getBubbleSize()
+    const bubbleLocation = this.commentBubble.getRelativeToSurfaceXY()
+    const delta = Blockly.utils.Coordinate.difference(bubbleLocation, this.workspaceLocation)
     return {
       text: this.getText(),
       height: size.height,
@@ -171,51 +127,46 @@ export class ScratchCommentIcon
       x: delta.x,
       y: delta.y,
       collapsed: this.commentBubble.isCollapsed(),
-    };
+    }
   }
 
   loadState(state: CommentState) {
-    Blockly.Events.setGroup(true);
-    this.setText(state["text"]);
-    this.setBubbleSize(new Blockly.utils.Size(state["width"], state["height"]));
-    const delta = new Blockly.utils.Coordinate(state["x"], state["y"]);
-    const newBubbleLocation = Blockly.utils.Coordinate.sum(
-      this.workspaceLocation,
-      delta
-    );
-    this.commentBubble.moveTo(newBubbleLocation);
-    this.commentBubble.setCollapsed(state["collapsed"]);
-    Blockly.Events.setGroup(false);
+    Blockly.Events.setGroup(true)
+    this.setText(state.text)
+    this.setBubbleSize(new Blockly.utils.Size(state.width, state.height))
+    const delta = new Blockly.utils.Coordinate(state.x, state.y)
+    const newBubbleLocation = Blockly.utils.Coordinate.sum(this.workspaceLocation, delta)
+    this.commentBubble.moveTo(newBubbleLocation)
+    this.commentBubble.setCollapsed(state.collapsed)
+    Blockly.Events.setGroup(false)
   }
 
   bubbleIsVisible(): boolean {
-    return true;
+    return true
   }
 
   async setBubbleVisible(visible: boolean) {
-    this.commentBubble.setCollapsed(!visible);
+    this.commentBubble.setCollapsed(!visible)
   }
 
-  getBubble() {
-    return this.commentBubble;
+  getBubble(): ScratchCommentBubble | null {
+    return this.commentBubble
   }
 
   dispose() {
-    this.commentBubble.dispose();
-    super.dispose();
+    this.commentBubble.dispose()
+    super.dispose()
   }
 
   canBeFocused() {
-    return false;
+    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.Events.fire(new (Blockly.Events.get('block_comment_create'))(this.commentBubble))
   }
 }
 
@@ -223,5 +174,5 @@ Blockly.registry.register(
   Blockly.registry.Type.ICON,
   Blockly.icons.IconType.COMMENT.toString(),
   ScratchCommentIcon,
-  true
-);
+  true,
+)