feat: convert several files to typescript (#38)

* chore: convert line_cursor to typescript

* chore: convert constants to ts

* chore: more ts conversions and cleanup

* chore: update announcer to typescript

* chore: update navigation to TS

* chore: convert SHORTCUT_NAMES to an enum

* chore: format

Author: rachel-fenichel

src/announcer.js src/announcer.tssrc/announcer.js renamed to src/announcer.ts

@@ -5,12 +5,14 @@
  */
 
 import {ShortcutRegistry} from 'blockly/core';
+// @ts-expect-error No types in js file
 import {keyCodeArrayToString} from './keynames';
 
 /**
  * Class for surfacing information about keyboard navigation state.
  */
 export class Announcer {
+  outputDiv: HTMLElement | null;
   /**
    * Constructor for an Announcer.
    */
@@ -38,14 +40,19 @@ export class Announcer {
       const prettyPrinted = keyCodeArrayToString(codeArray);
       text += `<tr><td>${keyboardShortcut}</td> <td>${prettyPrinted}</td></tr>`;
     }
-    this.outputDiv.innerHTML = text + '\n</table/>';
+    if (this.outputDiv) {
+      this.outputDiv.innerHTML = text + '\n</table/>';
+    }
   }
 
   /**
    * Set the text of the output div, with no validation.
-   * @param {string} text The text to display.
+   *
+   * @param text The text to display.
    */
-  setText(text) {
-    this.outputDiv.innerHTML = text;
+  setText(text: string) {
+    if (this.outputDiv) {
+      this.outputDiv.innerHTML = text;
+    }
   }
 }

src/constants.js

@@ -0,0 +1,56 @@
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @fileoverview Constants for keyboard navigation.
+ * @author [email protected] (Abby Schmiedt)
+ */
+
+/**
+ * Keyboard navigation states.
+ * The different parts of Blockly that the user navigates between.
+ */
+export enum STATE {
+  WORKSPACE = 'workspace',
+  FLYOUT = 'flyout',
+  TOOLBOX = 'toolbox',
+}
+
+/**
+ * Default keyboard navigation shortcut names.
+ */
+export enum SHORTCUT_NAMES {
+  PREVIOUS = 'previous',
+  NEXT = 'next',
+  IN = 'in',
+  OUT = 'out',
+  INSERT = 'insert',
+  MARK = 'mark',
+  DISCONNECT = 'disconnect',
+  TOOLBOX = 'toolbox',
+  EXIT = 'exit',
+  COPY = 'keyboard_nav_copy',
+  CUT = 'keyboard_nav_cut',
+  PASTE = 'keyboard_nav_paste',
+  DELETE = 'keyboard_nav_delete',
+  /* eslint-disable @typescript-eslint/naming-convention */
+  MOVE_WS_CURSOR_UP = 'workspace_up',
+  MOVE_WS_CURSOR_DOWN = 'workspace_down',
+  MOVE_WS_CURSOR_LEFT = 'workspace_left',
+  MOVE_WS_CURSOR_RIGHT = 'workspace_right',
+  TOGGLE_KEYBOARD_NAV = 'toggle_keyboard_nav',
+  /* eslint-enable @typescript-eslint/naming-convention */
+}
+
+/**
+ * Types of possible messages passed into the loggingCallback in the Navigation
+ * class.
+ */
+export enum LOGGING_MSG_TYPE {
+  ERROR = 'error',
+  WARN = 'warn',
+  LOG = 'log',
+}

src/constants.ts

@@ -15,8 +15,6 @@ import * as Blockly from 'blockly/core';
  * Class for a flyout cursor.
  * This controls how a user navigates blocks in the flyout.
  * This cursor only allows a user to go to the previous or next stack.
- * @constructor
- * @extends {Blockly.Cursor}
  */
 export class FlyoutCursor extends Blockly.Cursor {
   /**
@@ -28,11 +26,11 @@ export class FlyoutCursor extends Blockly.Cursor {
 
   /**
    * Moves the cursor to the next stack of blocks in the flyout.
-   * @returns {Blockly.ASTNode} The next element, or null if the current node is
+   *
+   * @returns The next element, or null if the current node is
    *     not set or there is no next value.
-   * @override
    */
-  next() {
+  override next(): Blockly.ASTNode | null {
     const curNode = this.getCurNode();
     if (!curNode) {
       return null;
@@ -47,20 +45,20 @@ export class FlyoutCursor extends Blockly.Cursor {
 
   /**
    * This is a no-op since a flyout cursor can not go in.
-   * @returns {null} Always null.
-   * @override
+   *
+   * @returns Always null.
    */
-  in() {
+  override in(): null {
     return null;
   }
 
   /**
    * Moves the cursor to the previous stack of blocks in the flyout.
-   * @returns {Blockly.ASTNode} The previous element, or null if the current
+   *
+   * @returns The previous element, or null if the current
    *     node is not set or there is no previous value.
-   * @override
    */
-  prev() {
+  override prev(): Blockly.ASTNode | null {
     const curNode = this.getCurNode();
     if (!curNode) {
       return null;
@@ -75,10 +73,10 @@ export class FlyoutCursor extends Blockly.Cursor {
 
   /**
    * This is a  no-op since a flyout cursor can not go out.
-   * @returns {null} Always null.
-   * @override
+   *
+   * @returns Always null.
    */
-  out() {
+  override out(): null {
     return null;
   }
 }
@@ -89,5 +87,5 @@ export const registrationName = 'FlyoutCursor';
 Blockly.registry.register(registrationType, registrationName, FlyoutCursor);
 
 export const pluginInfo = {
-  [registrationType]: registrationName,
+  [registrationType.toString()]: registrationName,
 };

src/flyout_cursor.js src/flyout_cursor.tssrc/flyout_cursor.js renamed to src/flyout_cursor.ts

@@ -7,7 +7,6 @@
 import * as Blockly from 'blockly/core';
 // @ts-expect-error No types in js file
 import {NavigationController} from './navigation_controller';
-// @ts-expect-error No types in js file
 import {installCursor} from './line_cursor';
 
 /** Plugin for keyboard navigation. */