@khanacademy/math-input 3.0.0 → 4.0.0

package/CHANGELOG.md

@@ -1,5 +1,40 @@
 # @khanacademy/math-input
 
+## 4.0.0
+
+### Major Changes
+
+-   c4b8d862: Type safety changes that touch our external exports. These are breaking changes to any consumers of the Key data and types.
+
+### Minor Changes
+
+-   0d352105: Added remaining missing keys for current pages
+-   e900688e: Centralize Key2MathQuill translator. TeXButtons send keypresses, not strings/functions anymore.
+
+### Patch Changes
+
+-   47055ffc: Switch several icons to Phosphor equivalents:
+
+    -   All numbers 0-9
+    -   Minus
+    -   Plus
+    -   Times
+    -   Backspace
+    -   Decimal (though this one is supposed to be a , per the code elsewhere)
+    -   Period (same as decimal right now)
+    -   Divide
+    -   Equal
+    -   Percent
+    -   Centered Dot (same icon as Period/Decimal, without y-axis transform)
+    -   Pi
+    -   X with mathematical chi
+    -   x with small mathematical chi
+    -   Square root with "radical"
+    -   Dismiss with caret
+    -   Operators tab icon with "radical"
+
+-   3a3c317d: Refactor MathWrapper to use shared key2MathQuill translator
+
 ## 3.0.0
 
 ### Major Changes

package/dist/components/input/__tests__/test-math-wrapper.d.ts

@@ -1,6 +1,6 @@
 import MathWrapper from "../math-wrapper";
 export default class TestMathWrapper extends MathWrapper {
-    getContent(): any;
+    getContent(): string;
     selectAll(): void;
     clearSelection(): void;
     moveToStart(): void;

package/dist/components/input/__tests__/test-math-wrapper.js.flow

@@ -6,7 +6,7 @@
  */
 import MathWrapper from "../math-wrapper";
 declare export default class TestMathWrapper extends MathWrapper {
-  getContent(): any;
+  getContent(): string;
   selectAll(): void;
   clearSelection(): void;
   moveToStart(): void;

package/dist/components/input/key-handlers/handle-arrow.d.ts

@@ -0,0 +1,3 @@
+import Key from "../../../data/keys";
+import { MathFieldInterface } from "../mathquill-types";
+export default function handleArrow(mathField: MathFieldInterface, key: Key): void;

package/dist/components/input/key-handlers/handle-arrow.js.flow

@@ -0,0 +1,12 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+import Key from "../../../data/keys";
+import { MathFieldInterface } from "../mathquill-types";
+declare export default function handleArrow(
+  mathField: MathFieldInterface,
+  key: Key
+): void;

package/dist/components/input/key-handlers/handle-backspace.d.ts

@@ -0,0 +1,7 @@
+import { MathFieldInterface } from "../mathquill-types";
+/**
+ * Selects and deletes part of the expression based on the cursor location.
+ * See inline comments for precise behavior of different cases.
+ */
+declare function handleBackspace(mathField: MathFieldInterface): void;
+export default handleBackspace;

package/dist/components/input/key-handlers/handle-backspace.js.flow

@@ -0,0 +1,14 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+import { MathFieldInterface } from "../mathquill-types";
+
+/**
+ * Selects and deletes part of the expression based on the cursor location.
+ * See inline comments for precise behavior of different cases.
+ */
+declare function handleBackspace(mathField: MathFieldInterface): void;
+declare export default typeof handleBackspace;

package/dist/components/input/key-handlers/handle-exponent.d.ts

@@ -0,0 +1,3 @@
+import Key from "../../../data/keys";
+import { MathFieldInterface } from "../mathquill-types";
+export default function handleExponent(mathField: MathFieldInterface, key: Key): void;

package/dist/components/input/key-handlers/handle-exponent.js.flow

@@ -0,0 +1,12 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+import Key from "../../../data/keys";
+import { MathFieldInterface } from "../mathquill-types";
+declare export default function handleExponent(
+  mathField: MathFieldInterface,
+  key: Key
+): void;

package/dist/components/input/key-handlers/handle-jump-out.d.ts

@@ -0,0 +1,7 @@
+import Key from "../../../data/keys";
+import { MathFieldInterface } from "../mathquill-types";
+/**
+ * Advances the cursor to the next logical position.
+ */
+declare function handleJumpOut(mathField: MathFieldInterface, key: Key): void;
+export default handleJumpOut;

package/dist/components/input/key-handlers/handle-jump-out.js.flow

@@ -0,0 +1,14 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+import Key from "../../../data/keys";
+import { MathFieldInterface } from "../mathquill-types";
+
+/**
+ * Advances the cursor to the next logical position.
+ */
+declare function handleJumpOut(mathField: MathFieldInterface, key: Key): void;
+declare export default typeof handleJumpOut;

package/dist/components/input/math-wrapper.d.ts

@@ -1,26 +1,24 @@
+import Key from "../../data/keys";
+import { Cursor } from "../../types";
+import { MathFieldInterface, MathFieldCursor } from "./mathquill-types";
 /**
  * This file contains a wrapper around MathQuill so that we can provide a
  * more regular interface for the functionality we need while insulating us
  * from MathQuill changes.
  */
-import { CursorContext } from "./cursor-contexts";
 declare class MathWrapper {
-    MQ: any;
-    mathField: any;
+    mathField: MathFieldInterface;
     callbacks: any;
     constructor(element: any, options?: {}, callbacks?: {});
     focus(): void;
     blur(): void;
-    _writeNormalFunction(name: string): void;
     /**
      * Handle a key press and return the resulting cursor state.
      *
      * @param {Key} key - an enum representing the key that was pressed
      * @returns {object} a cursor object, consisting of a cursor context
      */
-    pressKey(key: string): {
-        context: CursorContext;
-    };
+    pressKey(key: Key): Cursor;
     /**
      * Place the cursor beside the node located at the given coordinates.
      *
@@ -33,79 +31,10 @@ declare class MathWrapper {
      */
     setCursorPosition(x: number, y: number, hitNode: HTMLElement): void;
     getCursor(): any;
+    contextForCursor(cursor: MathFieldCursor): import("./cursor-contexts").CursorContext;
     getSelection(): any;
-    getContent(): any;
+    getContent(): string;
     setContent(latex: string): void;
     isEmpty(): boolean;
-    _handleBackspaceInNthRoot(cursor: any): void;
-    /**
-     * Advances the cursor to the next logical position.
-     *
-     * @param {cursor} cursor
-     * @private
-     */
-    _handleJumpOut(cursor: any, key: any): void;
-    /**
-     * Selects and deletes part of the expression based on the cursor location.
-     * See inline comments for precise behavior of different cases.
-     *
-     * @param {cursor} cursor
-     * @private
-     */
-    _handleBackspace(cursor: any): void;
-    _handleLeftArrow(cursor: any): void;
-    _handleRightArrow(cursor: any): void;
-    _handleExponent(cursor: any, key: any): void;
-    /**
-     * Return the start node, end node, and full name of the command of which
-     * the initial node is a part, or `null` if the node is not part of a
-     * command.
-     *
-     * @param {node} initialNode - the node to included as part of the command
-     * @returns {null|object} - `null` or an object containing the start node
-     *                          (`startNode`), end node (`endNode`), and full
-     *                          name (`name`) of the command
-     * @private
-     */
-    _maybeFindCommand(initialNode: any): {
-        name: string;
-        startNode: any;
-        endNode: any;
-    } | null;
-    /**
-     * Return the start node, end node, and full name of the command to the left
-     * of `\\left(`, or `null` if there is no command.
-     *
-     * @param {node} leftParenNode - node where .ctrlSeq == `\\left(`
-     * @returns {null|object} - `null` or an object containing the start node
-     *                          (`startNode`), end node (`endNode`), and full
-     *                          name (`name`) of the command
-     * @private
-     */
-    _maybeFindCommandBeforeParens(leftParenNode: any): {
-        name: string;
-        startNode: any;
-        endNode: any;
-    } | null;
-    _selectNode(node: any, cursor: any): void;
-    _isFraction(node: any): any;
-    _isNumerator(node: any): any;
-    _isDenominator(node: any): any;
-    _isSubScript(node: any): any;
-    _isSuperScript(node: any): any;
-    _isParens(node: any): any;
-    _isLeaf(node: any): any;
-    _isSquareRoot(node: any): any;
-    _isNthRoot(node: any): any;
-    _isNthRootIndex(node: any): any;
-    _isInsideLogIndex(cursor: any): boolean;
-    _isInsideEmptyNode(cursor: any): boolean;
-    _handleBackspaceInRootIndex(cursor: any): void;
-    _handleBackspaceInLogIndex(cursor: any): void;
-    _handleBackspaceOutsideParens(cursor: any): void;
-    _handleBackspaceInsideParens(cursor: any): void;
-    _handleBackspaceAfterLigaturedSymbol(cursor: any): void;
-    contextForCursor(cursor: any): CursorContext;
-    _isAtTopLevel(cursor: any): boolean;
 }
 export default MathWrapper;

package/dist/components/input/math-wrapper.js.flow

@@ -4,24 +4,29 @@
  * Flowgen v1.21.0
  * @flow
  */
-import { CursorContext } from "./cursor-contexts";
+import * as $Flowgen$Import$_2e__2f_cursor_2d_contexts from "./cursor-contexts";
+import Key from "../../data/keys";
+import { Cursor } from "../../types";
+import { MathFieldInterface, MathFieldCursor } from "./mathquill-types";
+
+/**
+ * This file contains a wrapper around MathQuill so that we can provide a
+ * more regular interface for the functionality we need while insulating us
+ * from MathQuill changes.
+ */
 declare class MathWrapper {
-  MQ: any;
-  mathField: any;
+  mathField: MathFieldInterface;
   callbacks: any;
   constructor(element: any, options?: {||}, callbacks?: {||}): this;
   focus(): void;
   blur(): void;
-  _writeNormalFunction(name: string): void;
 
   /**
    * Handle a key press and return the resulting cursor state.
    * @param {Key} key - an enum representing the key that was pressed
    * @returns {{...}} a cursor object, consisting of a cursor context
    */
-  pressKey(key: string): {|
-    context: CursorContext,
-  |};
+  pressKey(key: Key): Cursor;
 
   /**
    * Place the cursor beside the node located at the given coordinates.
@@ -34,79 +39,12 @@ declare class MathWrapper {
    */
   setCursorPosition(x: number, y: number, hitNode: HTMLElement): void;
   getCursor(): any;
+  contextForCursor(
+    cursor: MathFieldCursor
+  ): $Flowgen$Import$_2e__2f_cursor_2d_contexts.CursorContext;
   getSelection(): any;
-  getContent(): any;
+  getContent(): string;
   setContent(latex: string): void;
   isEmpty(): boolean;
-  _handleBackspaceInNthRoot(cursor: any): void;
-
-  /**
-   * Advances the cursor to the next logical position.
-   * @param {cursor} cursor
-   * @private
-   */
-  _handleJumpOut(cursor: any, key: any): void;
-
-  /**
-   * Selects and deletes part of the expression based on the cursor location.
-   * See inline comments for precise behavior of different cases.
-   * @param {cursor} cursor
-   * @private
-   */
-  _handleBackspace(cursor: any): void;
-  _handleLeftArrow(cursor: any): void;
-  _handleRightArrow(cursor: any): void;
-  _handleExponent(cursor: any, key: any): void;
-
-  /**
-   * Return the start node, end node, and full name of the command of which
-   * the initial node is a part, or `null` if the node is not part of a
-   * command.
-   * @param {node} initialNode - the node to included as part of the command
-   * @returns {null | {...}} - `null` or an object containing the start node
-   *   (`startNode`), end node (`endNode`), and full
-   *   name (`name`) of the command
-   * @private
-   */
-  _maybeFindCommand(initialNode: any): {|
-    name: string,
-    startNode: any,
-    endNode: any,
-  |} | null;
-
-  /**
-   * Return the start node, end node, and full name of the command to the left
-   * of `\\left(`, or `null` if there is no command.
-   * @param {node} leftParenNode - node where .ctrlSeq == `\\left(`
-   * @returns {null | {...}} - `null` or an object containing the start node
-   *   (`startNode`), end node (`endNode`), and full
-   *   name (`name`) of the command
-   * @private
-   */
-  _maybeFindCommandBeforeParens(leftParenNode: any): {|
-    name: string,
-    startNode: any,
-    endNode: any,
-  |} | null;
-  _selectNode(node: any, cursor: any): void;
-  _isFraction(node: any): any;
-  _isNumerator(node: any): any;
-  _isDenominator(node: any): any;
-  _isSubScript(node: any): any;
-  _isSuperScript(node: any): any;
-  _isParens(node: any): any;
-  _isLeaf(node: any): any;
-  _isSquareRoot(node: any): any;
-  _isNthRoot(node: any): any;
-  _isNthRootIndex(node: any): any;
-  _isInsideLogIndex(cursor: any): boolean;
-  _isInsideEmptyNode(cursor: any): boolean;
-  _handleBackspaceInRootIndex(cursor: any): void;
-  _handleBackspaceInLogIndex(cursor: any): void;
-  _handleBackspaceOutsideParens(cursor: any): void;
-  _handleBackspaceInsideParens(cursor: any): void;
-  _handleBackspaceAfterLigaturedSymbol(cursor: any): void;
-  contextForCursor(cursor: any): CursorContext;
-  _isAtTopLevel(cursor: any): boolean;
 }
 declare export default typeof MathWrapper;

package/dist/components/input/mathquill-helpers.d.ts

@@ -0,0 +1,46 @@
+import { CursorContext } from "./cursor-contexts";
+import { MathFieldCursor, MathFieldInterface } from "./mathquill-types";
+export declare function getCursor(mathField: MathFieldInterface): MathFieldCursor;
+export declare function isFraction(node: any): boolean;
+export declare function isNumerator(node: any): boolean;
+export declare function isDenominator(node: any): boolean;
+export declare function isSubScript(node: any): boolean;
+export declare function isSuperScript(node: any): boolean;
+export declare function isParens(node: any): boolean;
+export declare function isLeaf(node: any): boolean;
+export declare function isSquareRoot(node: any): boolean;
+export declare function isNthRoot(node: any): boolean;
+export declare function isNthRootIndex(node: any): boolean;
+export declare function isInsideLogIndex(cursor: MathFieldCursor): boolean;
+export declare function isInsideEmptyNode(cursor: MathFieldCursor): boolean;
+export declare function selectNode(node: any, cursor: any): void;
+/**
+ * Return the start node, end node, and full name of the command of which
+ * the initial node is a part, or `null` if the node is not part of a
+ * command.
+ *
+ * @param {node} initialNode - the node to included as part of the command
+ * @returns {null|object} - `null` or an object containing the start node
+ *                          (`startNode`), end node (`endNode`), and full
+ *                          name (`name`) of the command
+ */
+export declare function maybeFindCommand(initialNode: any): {
+    name: string;
+    startNode: any;
+    endNode: any;
+} | null;
+/**
+ * Return the start node, end node, and full name of the command to the left
+ * of `\\left(`, or `null` if there is no command.
+ *
+ * @param {node} leftParenNode - node where .ctrlSeq == `\\left(`
+ * @returns {null|object} - `null` or an object containing the start node
+ *                          (`startNode`), end node (`endNode`), and full
+ *                          name (`name`) of the command
+ */
+export declare function maybeFindCommandBeforeParens(leftParenNode: any): {
+    name: string;
+    startNode: any;
+    endNode: any;
+} | null;
+export declare function contextForCursor(cursor: MathFieldCursor): CursorContext;

package/dist/components/input/mathquill-helpers.js.flow

@@ -0,0 +1,56 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+import { CursorContext } from "./cursor-contexts";
+import { MathFieldCursor, MathFieldInterface } from "./mathquill-types";
+declare export function getCursor(
+  mathField: MathFieldInterface
+): MathFieldCursor;
+declare export function isFraction(node: any): boolean;
+declare export function isNumerator(node: any): boolean;
+declare export function isDenominator(node: any): boolean;
+declare export function isSubScript(node: any): boolean;
+declare export function isSuperScript(node: any): boolean;
+declare export function isParens(node: any): boolean;
+declare export function isLeaf(node: any): boolean;
+declare export function isSquareRoot(node: any): boolean;
+declare export function isNthRoot(node: any): boolean;
+declare export function isNthRootIndex(node: any): boolean;
+declare export function isInsideLogIndex(cursor: MathFieldCursor): boolean;
+declare export function isInsideEmptyNode(cursor: MathFieldCursor): boolean;
+declare export function selectNode(node: any, cursor: any): void;
+
+/**
+ * Return the start node, end node, and full name of the command of which
+ * the initial node is a part, or `null` if the node is not part of a
+ * command.
+ * @param {node} initialNode - the node to included as part of the command
+ * @returns {null | {...}} - `null` or an object containing the start node
+ *   (`startNode`), end node (`endNode`), and full
+ *   name (`name`) of the command
+ */
+declare export function maybeFindCommand(initialNode: any): {|
+  name: string,
+  startNode: any,
+  endNode: any,
+|} | null;
+
+/**
+ * Return the start node, end node, and full name of the command to the left
+ * of `\\left(`, or `null` if there is no command.
+ * @param {node} leftParenNode - node where .ctrlSeq == `\\left(`
+ * @returns {null | {...}} - `null` or an object containing the start node
+ *   (`startNode`), end node (`endNode`), and full
+ *   name (`name`) of the command
+ */
+declare export function maybeFindCommandBeforeParens(leftParenNode: any): {|
+  name: string,
+  startNode: any,
+  endNode: any,
+|} | null;
+declare export function contextForCursor(
+  cursor: MathFieldCursor
+): CursorContext;

package/dist/components/input/mathquill-instance.d.ts

@@ -0,0 +1,3 @@
+import { MathQuillInterface } from "./mathquill-types";
+declare const _default: MathQuillInterface;
+export default _default;

package/dist/components/input/mathquill-instance.js.flow

@@ -0,0 +1,9 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+import { MathQuillInterface } from "./mathquill-types";
+declare var _default: MathQuillInterface;
+declare export default typeof _default;

package/dist/components/input/mathquill-types.d.ts

@@ -0,0 +1,25 @@
+import Key from "../../data/keys";
+export interface MathQuillInterface {
+    L: "L";
+    R: "R";
+    MathField: (mount: HTMLDivElement, options: any) => MathFieldInterface;
+}
+export interface MathFieldInterface {
+    write: (input: string) => void;
+    cmd: (input: string) => void;
+    keystroke: (input: string) => void;
+    typedText: (input: string) => void;
+    latex: (input?: string) => string;
+    moveToDirEnd: (direction: "L" | "R") => void;
+    select: () => void;
+    clearSelection: () => void;
+    __controller: any;
+}
+export declare enum MathFieldActionType {
+    WRITE = "write",
+    CMD = "cmd",
+    KEYSTROKE = "keystroke",
+    MQ_END = 0
+}
+export type MathFieldCursor = any;
+export type MathQuillUpdaterCallback = (mathQuill: MathFieldInterface, key: Key) => void;

package/dist/components/input/mathquill-types.js.flow

@@ -0,0 +1,34 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+import Key from "../../data/keys";
+export interface MathQuillInterface {
+  L: "L";
+  R: "R";
+  MathField: (mount: HTMLDivElement, options: any) => MathFieldInterface;
+}
+export interface MathFieldInterface {
+  write: (input: string) => void;
+  cmd: (input: string) => void;
+  keystroke: (input: string) => void;
+  typedText: (input: string) => void;
+  latex: (input?: string) => string;
+  moveToDirEnd: (direction: "L" | "R") => void;
+  select: () => void;
+  clearSelection: () => void;
+  __controller: any;
+}
+declare export var MathFieldActionType: {|
+  +WRITE: "write", // "write"
+  +CMD: "cmd", // "cmd"
+  +KEYSTROKE: "keystroke", // "keystroke"
+  +MQ_END: 0, // 0
+|};
+export type MathFieldCursor = any;
+export type MathQuillUpdaterCallback = (
+  mathQuill: MathFieldInterface,
+  key: Key
+) => void;

package/dist/components/key-translator.d.ts

@@ -0,0 +1,4 @@
+import Key from "../data/keys";
+import { MathQuillUpdaterCallback } from "./input/mathquill-types";
+declare const keyToMathquillMap: Record<Key, MathQuillUpdaterCallback>;
+export default keyToMathquillMap;

package/dist/components/key-translator.js.flow

@@ -0,0 +1,10 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+import Key from "../data/keys";
+import { MathQuillUpdaterCallback } from "./input/mathquill-types";
+declare var keyToMathquillMap: { [key: Key]: MathQuillUpdaterCallback };
+declare export default typeof keyToMathquillMap;

package/dist/components/keypad/button-assets.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
-type KeyId = string;
+import Key from "../../data/keys";
 type Props = {
-    id: KeyId;
+    id: Key;
 };
 export default function ButtonAsset({ id }: Props): React.ReactElement;
 export {};

package/dist/components/keypad/button-assets.js.flow

@@ -5,8 +5,8 @@
  * @flow
  */
 import * as React from "react";
-declare type KeyId = string;
+import Key from "../../data/keys";
 declare type Props = {|
-  id: KeyId,
+  id: Key,
 |};
 declare export default function ButtonAsset(x: Props): React.Element<any>;

package/dist/components/keypad/keypad-page-items.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import type { KeyConfig } from "../../data/key-configs";
+import { KeyConfig } from "../../types";
 import type { StyleType } from "@khanacademy/wonder-blocks-core";
 type KeypadPageContainerProps = {
     children: React.ReactNode;

package/dist/components/keypad/keypad-page-items.js.flow

@@ -5,7 +5,7 @@
  * @flow
  */
 import * as React from "react";
-import type { KeyConfig } from "../../data/key-configs";
+import { KeyConfig } from "../../types";
 import type { StyleType } from "@khanacademy/wonder-blocks-core";
 declare type KeypadPageContainerProps = {|
   children: React.Node,