chore(docs): run prettier --write on docs

Author: grega

packages/docs/README.md

@@ -35,6 +35,15 @@ npm run serve
 
 The build folder is now served at http://localhost:3000/.
 
+## Linting
+
+```bash
+# check formatting:
+npm run format:check
+# fix formatting:
+npm run format
+```
+
 ## Generating reference docs
 
 The API reference pages are auto-generated from the Blockly TypeScript source using `@microsoft/api-extractor` and `@microsoft/api-documenter`. This is a separate step from the Docusaurus build and must be run from the `packages/blockly` directory:

packages/docs/docs/codelabs/context-menu-option/add-a-context-menu-item.mdx

@@ -33,11 +33,10 @@ Add a function to `index.js` named `registerHelloWorldItem`. Create a new regist
 function registerHelloWorldItem() {
   const helloWorldItem = {
     displayText: 'Hello World',
-    preconditionFn: function(scope) {
+    preconditionFn: function (scope) {
       return 'enabled';
     },
-    callback: function(scope) {
-    },
+    callback: function (scope) {},
     id: 'hello_world',
     weight: 100,
   };
@@ -52,10 +51,9 @@ function start() {
 
   Blockly.ContextMenuItems.registerCommentOptions();
   // Create main workspace.
-  workspace = Blockly.inject('blocklyDiv',
-    {
-      toolbox: toolboxSimple,
-    });
+  workspace = Blockly.inject('blocklyDiv', {
+    toolbox: toolboxSimple,
+  });
 }
 ```
 
@@ -80,6 +78,10 @@ you will never need to make a new `ContextMenuRegistry`. Always use the singleto
 
 Reload your web page and open a context menu on the workspace (right-click with a mouse, or press `Ctrl+Enter` (Windows) or `Command+Enter` (Mac) if you are navigating Blockly with the keyboard). You should see a new option labeled "Hello World" at the bottom of the context menu.
 
-<CodelabImage> ![A context menu. The last option says "Hello World".](../../../static/images/codelabs/context-menu-option/hello_world.png) </CodelabImage>
+<CodelabImage>
+  {' '}
+  ![A context menu. The last option says "Hello
+  World".](../../../static/images/codelabs/context-menu-option/hello_world.png){' '}
+</CodelabImage>
 
 Next, drag a block onto the workspace and open a context menu on the block. You'll see "Hello World" at the bottom of the block's context menu. Finally, open a context menu on the workspace and create a comment, then open a context menu on the comment's header. "Hello World" should be at the bottom of the context menu.

packages/docs/docs/codelabs/context-menu-option/callback.mdx

@@ -30,5 +30,4 @@ As an example, update the help item's `callback` to add a block to the workspace
 - Select the **Help** option.
 - A text block should appear in the top left of the workspace.
 
-
-![A text block containing the text "Now there is a block".](../../../static/images/codelabs/context-menu-option/there_is_a_block.png)
+![A text block containing the text "Now there is a block".](../../../static/images/codelabs/context-menu-option/there_is_a_block.png)

packages/docs/docs/codelabs/context-menu-option/codelab-overview.mdx

@@ -11,18 +11,21 @@ description: Overview of the "Customizing context menus" codelab.
 ### What you'll learn
 
 In this codelab you will learn how to:
+
 - Add a context menu option to the workspace.
 - Add a context menu option to all blocks.
 - Use precondition functions to hide or disable context menu options.
 - Take an action when a menu option is selected.
 - Customize ordering and display text for context menu options.
 
 ### What you'll build
+
 A very simple Blockly workspace with a few new context menu options.
 
 ### What you'll need
+
 - A browser.
 - A text editor.
 - Basic knowledge of HTML, CSS, and JavaScript.
 
-This codelab is focused on Blockly's context menus. Non-relevant concepts and code are glossed over and are provided for you to simply copy and paste.
+This codelab is focused on Blockly's context menus. Non-relevant concepts and code are glossed over and are provided for you to simply copy and paste.

packages/docs/docs/codelabs/context-menu-option/display-text.mdx

@@ -16,7 +16,7 @@ As an example, add this registry item. The display text depends on the block typ
 ```js
 function registerDisplayItem() {
   const displayItem = {
-    displayText: function(scope) {
+    displayText: function (scope) {
       if (scope.focusedNode.type.startsWith('text')) {
         return 'Text block';
       } else if (scope.focusedNode.type.startsWith('controls')) {
@@ -25,13 +25,12 @@ function registerDisplayItem() {
         return 'Some other block';
       }
     },
-    preconditionFn: function(scope) {
+    preconditionFn: function (scope) {
       return scope.focusedNode instanceof Blockly.BlockSvg
         ? 'enabled'
         : 'hidden';
     },
-    callback: function(scope) {
-    },
+    callback: function (scope) {},
     id: 'display_text_example',
     weight: 100,
   };
@@ -44,4 +43,4 @@ As usual, remember to call `registerDisplayItem()` from your `start` function.
 ### Test it
 
 - Reload the workspace and open context menus on various blocks.
-- The last context menu option's text should vary based on the block type.
+- The last context menu option's text should vary based on the block type.

packages/docs/docs/codelabs/context-menu-option/precondition-blockly-state.mdx

@@ -13,15 +13,14 @@ Disabling your context menu options half of the time is not useful, but you may
 function registerHelpItem() {
   const helpItem = {
     displayText: 'Help! There are no blocks',
-    preconditionFn: function(scope) {
+    preconditionFn: function (scope) {
       if (!(scope.focusedNode instanceof Blockly.WorkspaceSvg)) return 'hidden';
       if (!scope.focusedNode.getTopBlocks().length) {
         return 'enabled';
       }
       return 'hidden';
     },
-    callback: function(scope) {
-    },
+    callback: function (scope) {},
     id: 'help_no_blocks',
     weight: 100,
   };
@@ -34,4 +33,4 @@ Don't forget to call `registerHelpItem` from your `start` function.
 ### Test it
 
 - Reload your page and open a context menu on the workspace. You should see an option labeled "Help! There are no blocks".
-- Add a block to the workspace and open a context menu on the workspace again. The **Help** option should be gone.
+- Add a block to the workspace and open a context menu on the workspace again. The **Help** option should be gone.

packages/docs/docs/codelabs/context-menu-option/precondition-external-state.mdx

@@ -29,4 +29,4 @@ Use of the `preconditionFn` is not limited to checking the type of the Blockly c
 
 Reload your workspace, check your watch, and open a context menu on the workspace to confirm the timing. The option will always be in the menu, but will sometimes be greyed out.
 
-![A context menu. The last option says "Hello World" but the text is grey, indicating that it cannot be selected.](../../../static/images/codelabs/context-menu-option/hello_world_grey.png)
+![A context menu. The last option says "Hello World" but the text is grey, indicating that it cannot be selected.](../../../static/images/codelabs/context-menu-option/hello_world_grey.png)

packages/docs/docs/codelabs/context-menu-option/precondition-node-type.mdx

@@ -17,7 +17,7 @@ The `scope` argument is an object that is passed to `preconditionFn`. You'll use
 
 The return value of `preconditionFn` is `'enabled'`, `'disabled'`, or `'hidden'`. An **enabled** option is shown with black text and is selectable. A **disabled** option is shown with grey text and is not selectable. A **hidden** option is not included in the context menu at all.
 
-### Write the function 
+### Write the function
 
 You can now test `scope.focusedNode` to display the "Hello World" option in workspace and block context menus, but not on any others. Change `preconditionFn` to:
 

packages/docs/docs/codelabs/context-menu-option/separators.mdx

@@ -22,15 +22,15 @@ function registerSeparators() {
     scopeType: Blockly.ContextMenuRegistry.ScopeType.WORKSPACE,
     weight: 99,
     separator: true,
-  }
+  };
   Blockly.ContextMenuRegistry.registry.register(workspaceSeparator);
 
   const blockSeparator = {
     id: 'block_separator',
     scopeType: Blockly.ContextMenuRegistry.ScopeType.BLOCK,
     weight: 99,
     separator: true,
-  }
+  };
   Blockly.ContextMenuRegistry.registry.register(blockSeparator);
 }
 ```

packages/docs/docs/codelabs/context-menu-option/setup.mdx

@@ -24,13 +24,18 @@ git clone https://github.com/RaspberryPiFoundation/blockly.git
 If you downloaded the source as a zip, unpacking it should give you a root folder named `blockly-main`.
 
 The relevant files are in `docs/docs/codelabs/context-menu-option`. There are two versions of the app:
+
 - `starter-code/`: The starter code that you'll build upon in this codelab.
 - `complete-code/`: The code after completing the codelab, in case you get lost or want to compare to your version.
 
 Each folder contains:
+
 - `index.js` - The codelab's logic. To start, it just injects a simple workspace.
 - `index.html` - A web page containing a simple blockly workspace.
 
 To run the code, simple open `starter-code/index.html` in a browser. You should see a Blockly workspace with an always-open flyout.
 
-<CodelabImage>![A web page with the text "Context Menu Codelab" and a simple Blockly workspace.](../../../static/images/codelabs/context-menu-option/starter_workspace.png)</CodelabImage>
+<CodelabImage>
+  ![A web page with the text "Context Menu Codelab" and a simple Blockly
+  workspace.](../../../static/images/codelabs/context-menu-option/starter_workspace.png)
+</CodelabImage>