@khanacademy/math-input 0.6.8 → 0.7.0

package/dist/store/index.d.ts

@@ -0,0 +1 @@
+export declare const createStore: () => any;

package/dist/store/index.js.flow

@@ -0,0 +1,7 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+declare export var createStore: () => any;

package/dist/utils.d.ts

@@ -0,0 +1 @@
+export declare const decimalSeparator: string;

package/dist/utils.js.flow

@@ -0,0 +1,7 @@
+/**
+ * Flowtype definitions for data
+ * Generated by Flowgen from a Typescript Definition
+ * Flowgen v1.21.0
+ * @flow
+ */
+declare export var decimalSeparator: string;

package/package.json

@@ -3,7 +3,7 @@
     "description": "Khan Academy's new expression editor for the mobile web.",
     "author": "Khan Academy",
     "license": "MIT",
-    "version": "0.6.8",
+    "version": "0.7.0",
     "publishConfig": {
         "access": "public"
     },
@@ -16,7 +16,7 @@
     },
     "module": "dist/es/index.js",
     "main": "dist/index.js",
-    "source": "src/index.js",
+    "source": "src/index.ts",
     "scripts": {},
     "dependencies": {
         "performance-now": "^0.2.0"

package/src/components/__tests__/gesture-state-machine_test.js

@@ -1,4 +1,4 @@
-import GestureStateMachine from "../gesture-state-machine.js";
+import GestureStateMachine from "../gesture-state-machine";
 
 const swipeThresholdPx = 5;
 const longPressWaitTimeMs = 5;

package/src/components/__tests__/node-manager_test.js

@@ -1,4 +1,4 @@
-import NodeManager from "../node-manager.js";
+import NodeManager from "../node-manager";
 
 describe("NodeManager", () => {
     let nodeManager;

package/src/components/__tests__/two-page-keypad_test.js

@@ -1,7 +1,7 @@
 import {mount} from "enzyme";
 import * as React from "react";
 
-import TwoPageKeypad from "../two-page-keypad.js";
+import TwoPageKeypad from "../two-page-keypad";
 
 describe("<TwoPageKeyPage />", () => {
     xit("defaults to selecting the right page", () => {

package/src/components/app.js

@@ -1,8 +1,8 @@
 import {StyleSheet} from "aphrodite";
 import * as React from "react";
 
-import {View} from "../fake-react-native-web/index.js";
-import {Keypad, KeypadInput, KeypadTypes} from "../index.js";
+import {View} from "../fake-react-native-web/index";
+import {Keypad, KeypadInput, KeypadTypes} from "../index";
 
 class App extends React.Component {
     state = {

package/src/components/{common-style.js → common-style.ts}

@@ -1,4 +1,3 @@
-// @flow
 /**
  * Common parameters used to style components.
  */

package/src/components/compute-layout-parameters.js

@@ -19,14 +19,14 @@
  * might need to be.
  */
 
-import {DeviceTypes, DeviceOrientations, LayoutModes} from "../consts.js";
+import {DeviceTypes, DeviceOrientations, LayoutModes} from "../consts";
 
 import {
     pageIndicatorHeightPx,
     toolbarHeightPx,
     navigationPadWidthPx,
     innerBorderWidthPx,
-} from "./common-style.js";
+} from "./common-style";
 
 const minButtonHeight = 48;
 const maxButtonSize = 64;

package/src/components/corner-decal.js

@@ -6,9 +6,9 @@ import {StyleSheet} from "aphrodite";
 import PropTypes from "prop-types";
 import * as React from "react";
 
-import {View} from "../fake-react-native-web/index.js";
+import {View} from "../fake-react-native-web/index";
 
-import {offBlack} from "./common-style.js";
+import {offBlack} from "./common-style";
 
 class CornerDecal extends React.Component {
     static propTypes = {

package/src/components/echo-manager.js

@@ -6,17 +6,17 @@ import PropTypes from "prop-types";
 import * as React from "react";
 import {TransitionGroup, CSSTransition} from "react-transition-group";
 
-import {KeyTypes, EchoAnimationTypes} from "../consts.js";
-import KeyConfigs from "../data/key-configs.js";
+import {KeyTypes, EchoAnimationTypes} from "../consts";
+import KeyConfigs from "../data/key-configs";
 
-import KeypadButton from "./keypad-button.js";
+import KeypadButton from "./keypad-button";
 import {
     echoPropType,
     bordersPropType,
     boundingBoxPropType,
     keyIdPropType,
-} from "./prop-types.js";
-import * as zIndexes from "./z-indexes.js";
+} from "./prop-types";
+import * as zIndexes from "./z-indexes";
 
 class Echo extends React.Component {
     static propTypes = {

package/src/components/empty-keypad-button.js

@@ -6,10 +6,10 @@ import PropTypes from "prop-types";
 import * as React from "react";
 import {connect} from "react-redux";
 
-import KeyConfigs from "../data/key-configs.js";
+import KeyConfigs from "../data/key-configs";
 
-import GestureManager from "./gesture-manager.js";
-import KeypadButton from "./keypad-button.js";
+import GestureManager from "./gesture-manager";
+import KeypadButton from "./keypad-button";
 
 class EmptyKeypadButton extends React.Component {
     static propTypes = {

package/src/components/expression-keypad.js

@@ -7,17 +7,17 @@ import PropTypes from "prop-types";
 import * as React from "react";
 import {connect} from "react-redux";
 
-import {BorderStyles} from "../consts.js";
-import KeyConfigs from "../data/key-configs.js";
-import {View} from "../fake-react-native-web/index.js";
+import {BorderStyles} from "../consts";
+import KeyConfigs from "../data/key-configs";
+import {View} from "../fake-react-native-web/index";
 
-import {valueGrey, controlGrey} from "./common-style.js";
-import * as CursorContexts from "./input/cursor-contexts.js";
-import ManyKeypadButton from "./many-keypad-button.js";
-import {cursorContextPropType, keyIdPropType} from "./prop-types.js";
-import Styles from "./styles.js";
-import TouchableKeypadButton from "./touchable-keypad-button.js";
-import TwoPageKeypad from "./two-page-keypad.js";
+import {valueGrey, controlGrey} from "./common-style";
+import * as CursorContexts from "./input/cursor-contexts";
+import ManyKeypadButton from "./many-keypad-button";
+import {cursorContextPropType, keyIdPropType} from "./prop-types";
+import Styles from "./styles";
+import TouchableKeypadButton from "./touchable-keypad-button";
+import TwoPageKeypad from "./two-page-keypad";
 
 const {row, column, oneColumn, fullWidth, roundedTopLeft, roundedTopRight} =
     Styles;

package/src/components/fraction-keypad.js

@@ -7,15 +7,15 @@ import PropTypes from "prop-types";
 import * as React from "react";
 import {connect} from "react-redux";
 
-import {BorderStyles} from "../consts.js";
-import KeyConfigs from "../data/key-configs.js";
-import {View} from "../fake-react-native-web/index.js";
-
-import * as CursorContexts from "./input/cursor-contexts.js";
-import Keypad from "./keypad.js";
-import {cursorContextPropType} from "./prop-types.js";
-import Styles from "./styles.js";
-import TouchableKeypadButton from "./touchable-keypad-button.js";
+import {BorderStyles} from "../consts";
+import KeyConfigs from "../data/key-configs";
+import {View} from "../fake-react-native-web/index";
+
+import * as CursorContexts from "./input/cursor-contexts";
+import Keypad from "./keypad";
+import {cursorContextPropType} from "./prop-types";
+import Styles from "./styles";
+import TouchableKeypadButton from "./touchable-keypad-button";
 
 const {row, roundedTopLeft, roundedTopRight} = Styles;
 

package/src/components/gesture-manager.js

@@ -4,9 +4,9 @@
  * and links them together.
  */
 
-import GestureStateMachine from "./gesture-state-machine.js";
-import NodeManager from "./node-manager.js";
-import PopoverStateMachine from "./popover-state-machine.js";
+import GestureStateMachine from "./gesture-state-machine";
+import NodeManager from "./node-manager";
+import PopoverStateMachine from "./popover-state-machine";
 
 const coordsForEvent = (evt) => {
     return [evt.changedTouches[0].clientX, evt.changedTouches[0].clientY];

package/src/components/icon.js

@@ -6,13 +6,13 @@ import {StyleSheet} from "aphrodite";
 import PropTypes from "prop-types";
 import * as React from "react";
 
-import {IconTypes} from "../consts.js";
+import {IconTypes} from "../consts";
 
-import {offBlack} from "./common-style.js";
-import MathIcon from "./math-icon.js";
-import {iconPropType} from "./prop-types.js";
-import SvgIcon from "./svg-icon.js";
-import TextIcon from "./text-icon.js";
+import {offBlack} from "./common-style";
+import MathIcon from "./math-icon";
+import {iconPropType} from "./prop-types";
+import SvgIcon from "./svg-icon";
+import TextIcon from "./text-icon";
 
 const focusedColor = "#FFF";
 const unfocusedColor = offBlack;

package/src/components/iconography/down.js

@@ -3,7 +3,7 @@
  */
 import * as React from "react";
 
-import Arrow from "./arrow.js";
+import Arrow from "./arrow";
 
 const Down = () => {
     return (

package/src/components/iconography/index.js

@@ -2,44 +2,44 @@
  * A directory of autogenerated icon components.
  */
 
-export {default as COS} from "./cos.js";
-export {default as LOG} from "./log.js";
-export {default as EQUAL} from "./equal.js";
-export {default as BACKSPACE} from "./backspace.js";
-export {default as SQRT} from "./sqrt.js";
-export {default as EXP} from "./exp.js";
-export {default as NEQ} from "./neq.js";
-export {default as GEQ} from "./geq.js";
-export {default as LN} from "./ln.js";
-export {default as DISMISS} from "./dismiss.js";
-export {default as SIN} from "./sin.js";
-export {default as LT} from "./lt.js";
-export {default as CUBE_ROOT} from "./cube-root.js";
-export {default as PLUS} from "./plus.js";
-export {default as TAN} from "./tan.js";
-export {default as LEFT} from "./left.js";
-export {default as UP} from "./up.js";
-export {default as DOWN} from "./down.js";
-export {default as LEFT_PAREN} from "./left-paren.js";
-export {default as RIGHT_PAREN} from "./right-paren.js";
-export {default as GT} from "./gt.js";
-export {default as DIVIDE} from "./divide.js";
-export {default as PERIOD} from "./period.js";
-export {default as PERCENT} from "./percent.js";
-export {default as TIMES} from "./times.js";
-export {default as EXP_3} from "./exp-3.js";
-export {default as EXP_2} from "./exp-2.js";
-export {default as RIGHT} from "./right.js";
-export {default as CDOT} from "./cdot.js";
-export {default as LOG_N} from "./log-n.js";
-export {default as LEQ} from "./leq.js";
-export {default as MINUS} from "./minus.js";
-export {default as NEGATIVE} from "./minus.js";
-export {default as RADICAL} from "./radical.js";
-export {default as FRAC} from "./frac.js";
-export {default as JUMP_OUT_PARENTHESES} from "./jump-out-parentheses.js";
-export {default as JUMP_OUT_EXPONENT} from "./jump-out-exponent.js";
-export {default as JUMP_OUT_BASE} from "./jump-out-base.js";
-export {default as JUMP_INTO_NUMERATOR} from "./jump-into-numerator.js";
-export {default as JUMP_OUT_NUMERATOR} from "./jump-out-numerator.js";
-export {default as JUMP_OUT_DENOMINATOR} from "./jump-out-denominator.js";
+export {default as COS} from "./cos";
+export {default as LOG} from "./log";
+export {default as EQUAL} from "./equal";
+export {default as BACKSPACE} from "./backspace";
+export {default as SQRT} from "./sqrt";
+export {default as EXP} from "./exp";
+export {default as NEQ} from "./neq";
+export {default as GEQ} from "./geq";
+export {default as LN} from "./ln";
+export {default as DISMISS} from "./dismiss";
+export {default as SIN} from "./sin";
+export {default as LT} from "./lt";
+export {default as CUBE_ROOT} from "./cube-root";
+export {default as PLUS} from "./plus";
+export {default as TAN} from "./tan";
+export {default as LEFT} from "./left";
+export {default as UP} from "./up";
+export {default as DOWN} from "./down";
+export {default as LEFT_PAREN} from "./left-paren";
+export {default as RIGHT_PAREN} from "./right-paren";
+export {default as GT} from "./gt";
+export {default as DIVIDE} from "./divide";
+export {default as PERIOD} from "./period";
+export {default as PERCENT} from "./percent";
+export {default as TIMES} from "./times";
+export {default as EXP_3} from "./exp-3";
+export {default as EXP_2} from "./exp-2";
+export {default as RIGHT} from "./right";
+export {default as CDOT} from "./cdot";
+export {default as LOG_N} from "./log-n";
+export {default as LEQ} from "./leq";
+export {default as MINUS} from "./minus";
+export {default as NEGATIVE} from "./minus";
+export {default as RADICAL} from "./radical";
+export {default as FRAC} from "./frac";
+export {default as JUMP_OUT_PARENTHESES} from "./jump-out-parentheses";
+export {default as JUMP_OUT_EXPONENT} from "./jump-out-exponent";
+export {default as JUMP_OUT_BASE} from "./jump-out-base";
+export {default as JUMP_INTO_NUMERATOR} from "./jump-into-numerator";
+export {default as JUMP_OUT_NUMERATOR} from "./jump-out-numerator";
+export {default as JUMP_OUT_DENOMINATOR} from "./jump-out-denominator";

package/src/components/iconography/left.js

@@ -3,7 +3,7 @@
  */
 import * as React from "react";
 
-import Arrow from "./arrow.js";
+import Arrow from "./arrow";
 
 const Left = () => {
     return (

package/src/components/iconography/right.js

@@ -3,7 +3,7 @@
  */
 import * as React from "react";
 
-import Arrow from "./arrow.js";
+import Arrow from "./arrow";
 
 const Right = () => {
     return (

package/src/components/iconography/up.js

@@ -3,7 +3,7 @@
  */
 import * as React from "react";
 
-import Arrow from "./arrow.js";
+import Arrow from "./arrow";
 
 const Up = () => {
     return (

package/src/components/input/__tests__/context-tracking_test.js

@@ -1,7 +1,7 @@
-import Keys from "../../../data/keys.js";
-import * as CursorContexts from "../cursor-contexts.js";
+import Keys from "../../../data/keys";
+import * as CursorContexts from "../cursor-contexts";
 
-import TestMathWrapper from "./test-math-wrapper.jsx";
+import TestMathWrapper from "./test-math-wrapper";
 
 describe("Cursor context", () => {
     let mathField;

package/src/components/input/__tests__/mathquill_test.js

@@ -1,6 +1,6 @@
-import Keys from "../../../data/keys.js";
+import Keys from "../../../data/keys";
 
-import TestMathWrapper from "./test-math-wrapper.jsx";
+import TestMathWrapper from "./test-math-wrapper";
 
 const MQ = {L: "-1", R: "1"};
 const END_OF_EXPR = 0;

package/src/components/input/__tests__/test-math-wrapper.jsx

@@ -1,6 +1,6 @@
 import MathQuill from "mathquill";
 
-import MathWrapper from "../math-wrapper.js";
+import MathWrapper from "../math-wrapper";
 
 const MQ = MathQuill.getInterface(2);
 

package/src/components/input/{cursor-contexts.js → cursor-contexts.ts}

@@ -1,4 +1,3 @@
-// @flow
 /**
  * Constants that define the various contexts in which a cursor can exist. The
  * active context is determined first by looking at the cursor's siblings (e.g.,
@@ -11,23 +10,17 @@
  * the radical.
  */
 
-export type CursorContext =
-    // The cursor is not in any of the other viable contexts.
-    | "NONE"
+export type CursorContext = // The cursor is not in any of the other viable contexts.
     // The cursor is within a set of parentheses.
-    | "IN_PARENS"
-    // The cursor is within a superscript (e.g., an exponent).
-    | "IN_SUPER_SCRIPT"
-    // The cursor is within a subscript (e.g., the base of a custom logarithm).
-    | "IN_SUB_SCRIPT"
-    // The cursor is in the numerator of a fraction.
-    | "IN_NUMERATOR"
-    // The cursor is in the denominator of a fraction.
-    | "IN_DENOMINATOR"
-    // The cursor is sitting before a fraction; that is, the cursor is within
+    | "NONE" // The cursor is within a superscript (e.g., an exponent).
+    | "IN_PARENS" // The cursor is within a subscript (e.g., the base of a custom logarithm).
+    | "IN_SUPER_SCRIPT" // The cursor is in the numerator of a fraction.
+    | "IN_SUB_SCRIPT" // The cursor is in the denominator of a fraction.
+    | "IN_NUMERATOR" // The cursor is sitting before a fraction; that is, the cursor is within
     // what looks to be a mixed number preceding a fraction. This will only be
     // the case when the only math between the cursor and the fraction to its
     // write is non-leaf math (numbers and variables).
+    | "IN_DENOMINATOR"
     | "BEFORE_FRACTION";
 
 // TODO: Get rid of these constants in favour of CursorContext type.

package/src/components/input/{cursor-handle.js → cursor-handle.tsx}

@@ -1,4 +1,3 @@
-// @flow
 /**
  * Renders the green tear-shaped handle under the cursor.
  */
@@ -8,7 +7,7 @@ import * as React from "react";
 import {
     cursorHandleRadiusPx,
     cursorHandleDistanceMultiplier,
-} from "../common-style.js";
+} from "../common-style";
 
 const touchTargetRadiusPx = 2 * cursorHandleRadiusPx;
 const touchTargetHeightPx = 2 * touchTargetRadiusPx;
@@ -18,23 +17,23 @@ const cursorRadiusPx = cursorHandleRadiusPx;
 const cursorHeightPx = cursorHandleDistanceMultiplier * (cursorRadiusPx * 4);
 const cursorWidthPx = 4 * cursorRadiusPx;
 
-type Props = {|
-    animateIntoPosition: ?boolean,
-    onTouchCancel: (SyntheticTouchEvent<HTMLSpanElement>) => void,
-    onTouchEnd: (SyntheticTouchEvent<HTMLSpanElement>) => void,
-    onTouchMove: (SyntheticTouchEvent<HTMLSpanElement>) => void,
-    onTouchStart: (SyntheticTouchEvent<HTMLSpanElement>) => void,
-    visible: boolean,
-    x: number,
-    y: number,
-|};
+type Props = {
+    animateIntoPosition: boolean | null | undefined;
+    onTouchCancel: (arg1: React.TouchEvent<HTMLSpanElement>) => void;
+    onTouchEnd: (arg1: React.TouchEvent<HTMLSpanElement>) => void;
+    onTouchMove: (arg1: React.TouchEvent<HTMLSpanElement>) => void;
+    onTouchStart: (arg1: React.TouchEvent<HTMLSpanElement>) => void;
+    visible: boolean;
+    x: number;
+    y: number;
+};
 
-type DefaultProps = {|
-    animateIntoPosition: Props["animateIntoPosition"],
-    visible: Props["visible"],
-    x: Props["x"],
-    y: Props["y"],
-|};
+type DefaultProps = {
+    animateIntoPosition: Props["animateIntoPosition"];
+    visible: Props["visible"];
+    x: Props["x"];
+    y: Props["y"];
+};
 
 class CursorHandle extends React.Component<Props> {
     static defaultProps: DefaultProps = {
@@ -44,7 +43,7 @@ class CursorHandle extends React.Component<Props> {
         y: 0,
     };
 
-    render(): React.Node {
+    render(): React.ReactNode {
         const {x, y, animateIntoPosition} = this.props;
 
         const animationStyle = animateIntoPosition
@@ -69,7 +68,7 @@ class CursorHandle extends React.Component<Props> {
             // produce page scrolls.
             touchAction: "none",
             ...animationStyle,
-        };
+        } as const;
 
         return (
             <span