@khanacademy/math-input 16.1.0 → 16.1.2

package/CHANGELOG.md

@@ -1,5 +1,32 @@
 # @khanacademy/math-input
 
+## 16.1.2
+
+### Patch Changes
+
+-   [#856](https://github.com/Khan/perseus/pull/856) [`6c323dc3`](https://github.com/Khan/perseus/commit/6c323dc37e7cc972fe5a1ab7cbf90a23bf4dd3a0) Thanks [@nedredmond](https://github.com/nedredmond)! - Upgrade WB
+
+*   [#804](https://github.com/Khan/perseus/pull/804) [`2c295e2c`](https://github.com/Khan/perseus/commit/2c295e2c26ff2bf15e1e8e82bcc34e04e4b9bab0) Thanks [@nixterrimus](https://github.com/nixterrimus)! - Upgrade WonderBlocks Popover
+
+*   Updated dependencies [[`1f4e17ba`](https://github.com/Khan/perseus/commit/1f4e17ba77e1491523813655af18a70285a25989), [`8857950b`](https://github.com/Khan/perseus/commit/8857950bdeeb6e13bc3766b1c6545289b21cbe2a)]:
+    -   @khanacademy/perseus-core@1.4.1
+
+## 16.1.1
+
+### Patch Changes
+
+-   [#841](https://github.com/Khan/perseus/pull/841) [`41d3cd93`](https://github.com/Khan/perseus/commit/41d3cd93f78d4649c8a57b6fa4964c0c9f2c45b0) Thanks [@handeyeco](https://github.com/handeyeco)! - Remove unused SVG tooling
+
+*   [#843](https://github.com/Khan/perseus/pull/843) [`27f691aa`](https://github.com/Khan/perseus/commit/27f691aa11f061b54db487b5b35222431776260f) Thanks [@handeyeco](https://github.com/handeyeco)! - Remove seemingly unused index.html
+
+-   [#844](https://github.com/Khan/perseus/pull/844) [`3803452b`](https://github.com/Khan/perseus/commit/3803452b0593649faf4043bf6e1d7681a14078e4) Thanks [@handeyeco](https://github.com/handeyeco)! - Remove seemingly unused Less
+
+*   [#846](https://github.com/Khan/perseus/pull/846) [`ef32b88f`](https://github.com/Khan/perseus/commit/ef32b88f5027154784fb496506d7c96ee3765eac) Thanks [@handeyeco](https://github.com/handeyeco)! - Break up common-styles.ts
+
+-   [#840](https://github.com/Khan/perseus/pull/840) [`820febc5`](https://github.com/Khan/perseus/commit/820febc5814a5a10d7c1743be8aa9d220f2d9bd8) Thanks [@handeyeco](https://github.com/handeyeco)! - Remove Redux as a dependency
+
+*   [#845](https://github.com/Khan/perseus/pull/845) [`67a09051`](https://github.com/Khan/perseus/commit/67a09051c61df98b697349ad75760193e4228bfe) Thanks [@handeyeco](https://github.com/handeyeco)! - Remove some seemingly unused types
+
 ## 16.1.0
 
 ### Minor Changes

package/README.md

@@ -2,7 +2,7 @@
 
 Khan Academy's expression editor for the mobile web. Used in the [Perseus](https://github.com/khan/perseus) exercise framework to power math input and expression editing on small screens.
 
-Built with [React](https://github.com/facebook/react), [Redux](https://github.com/reactjs/redux), [MathQuill](https://github.com/mathquill/mathquill), [Aphrodite](https://github.com/khan/aphrodite), and more.
+Built with [React](https://github.com/facebook/react), [MathQuill](https://github.com/mathquill/mathquill), [Aphrodite](https://github.com/khan/aphrodite), and more.
 
 ![](https://cloud.githubusercontent.com/assets/1309177/15994911/d1acd29e-30c5-11e6-9707-6bef8e69114f.gif)
 
@@ -26,14 +26,6 @@ When you start the project you'll need to be on a device that supports touch or
 
 ![](https://cloud.githubusercontent.com/assets/1309177/15994912/d2b60cdc-30c5-11e6-8eb4-9086d76f327c.gif)
 
-## Demo
-
-A live demo is available via [GitHub Pages](http://khan.github.io/math-input/). You can configure some of the keypad's behaviors, along with the set of active keys, via the [editor](http://khan.github.io/math-input/custom.html).
-
-Note that, as the input and keypad only respond to touch events, you'll need to enable mobile emulation (e.g., as supported by Chrome) in order to use the keypad in a desktop browser.
-
-To run the demo locally, clone the repo, `yarn install`, `yarn watch`, and open the `index.html` page. The local behaviors can similarly be customized via the editor @ `custom.html`.
-
 ## License
 
 [MIT License](http://opensource.org/licenses/MIT)

package/dist/components/input/cursor-styles.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Common parameters used to style components.
+ */
+export declare const cursorHandleRadiusPx = 11;
+export declare const cursorHandleDistanceMultiplier = 1.045;

package/dist/components/input/scroll-into-view.d.ts

@@ -8,4 +8,5 @@
  * TODO(charlie): Move this scroll logic out of our components and into a higher
  * level in the component tree--perhaps even into webapp, beyond Perseus.
  */
+export declare const toolbarHeightPx = 60;
 export declare const scrollIntoView: (containerNode: any, keypadNode: any) => void;

package/dist/enums.d.ts

@@ -7,32 +7,3 @@ export declare enum KeypadType {
 }
 export declare const KeyTypes: string[];
 export type KeyType = typeof KeyTypes[number];
-export declare enum DeviceOrientation {
-    LANDSCAPE = "LANDSCAPE",
-    PORTRAIT = "PORTRAIT"
-}
-export declare enum DeviceType {
-    PHONE = "PHONE",
-    TABLET = "TABLET"
-}
-export declare enum LayoutMode {
-    FULLSCREEN = "FULLSCREEN",
-    COMPACT = "COMPACT"
-}
-export declare enum BorderDirection {
-    LEFT = "LEFT",
-    BOTTOM = "BOTTOM"
-}
-export declare const BorderStyles: {
-    [style: string]: ReadonlyArray<BorderDirection>;
-};
-export declare enum IconType {
-    MATH = "MATH",
-    SVG = "SVG",
-    TEXT = "TEXT"
-}
-export declare enum EchoAnimationType {
-    SLIDE_AND_FADE = "SLIDE_AND_FADE",
-    FADE_ONLY = "FADE_ONLY",
-    LONG_FADE_ONLY = "LONG_FADE_ONLY"
-}

package/dist/es/index.css

@@ -1,45 +1,3 @@
-/**
- * Styles for managing the popover animations.
- *
- * Ideally, we'd be generating these styles with Aphrodite (along with
- * CSSTransitionGroup's support for custom classnames), but the generated
- * styles have issues on mobile Safari.
- *   See: https://github.com/Khan/aphrodite/issues/68.
- *
- * If the animation durations change, the corresponding values in
- * echo-manager.js must change as well.
- */
-.echo-slide-and-fade-enter {
-  opacity: 1 !important;
-  transform: translate3d(0, 0, 0) !important;
-}
-.echo-slide-and-fade-enter.echo-slide-and-fade-enter-active {
-  opacity: 0 !important;
-  transform: translate3d(0, -33%, 0) !important;
-  /**
-         * TODO(charlie): These times are intentionally different, which means
-         * that the animation really "ends" after 400ms
-         * cubic-bezier(1, 0, 0.9, 1) (since the opacity goes to 0), even though
-         * the transform doesn't complete. There's probably a way to achieve the
-         * same effect by manipulating the transform's Bezier curve and total
-         * displacement.
-         */
-  transition: transform 800ms cubic-bezier(0, 1, 0.25, 1), opacity 400ms cubic-bezier(1, 0, 0.9, 1) !important;
-}
-.echo-fade-only-enter {
-  opacity: 1 !important;
-}
-.echo-fade-only-enter.echo-fade-only-enter-active {
-  opacity: 0 !important;
-  transition: opacity 300ms cubic-bezier(0.25, 0, 0.75, 1) !important;
-}
-.echo-long-fade-only-enter {
-  opacity: 1 !important;
-}
-.echo-long-fade-only-enter.echo-long-fade-only-enter-active {
-  opacity: 0 !important;
-  transition: opacity 400ms cubic-bezier(0.75, 0, 0.75, 1) !important;
-}
 .keypad-input {
   outline: none !important;
 }
@@ -120,24 +78,6 @@
   color: white !important;
   display: inline-block !important;
 }
-/**
- * Styles for managing the popover animations.
- *
- * Ideally, we'd be generating these styles with Aphrodite (along with
- * CSSTransitionGroup's support for custom classnames), but the generated
- * styles have issues on mobile Safari.
- *   See: https://github.com/Khan/aphrodite/issues/68.
- *
- * If the animation durations change, the corresponding values in
- * popover-manager.js must change as well.
- */
-.popover-enter {
-  opacity: 0 !important;
-}
-.popover-enter.popover-enter-active {
-  opacity: 1 !important;
-  transition: opacity 200ms ease-out !important;
-}
 /*
  * MathQuill v0.10.1               http://mathquill.com
  * by Han, Jeanine, and Mary  maintainers@mathquill.com
@@ -574,9 +514,3 @@
   margin-top: -0.1em;
 }
 
-.tabbar_item {
-  background-color: red;
-}
-.tabbar_item:focus {
-  background-color: green;
-}

package/dist/es/index.js

@@ -17,7 +17,7 @@ import PropTypes from 'prop-types';
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/math-input";
-const libVersion = "16.1.0";
+const libVersion = "16.1.2";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 function _extends() {
@@ -103,11 +103,6 @@ View.styles = StyleSheet.create({
 /**
  * Common parameters used to style components.
  */
-const wonderBlocksBlue = Color.blue;
-const offBlack = Color.offBlack;
-Color.offBlack32;
-Color.offBlack16;
-Color.offBlack8;
 const cursorHandleRadiusPx = 11;
 
 // The amount to multiply the radius by to get the distance from the
@@ -115,10 +110,6 @@ const cursorHandleRadiusPx = 11;
 // one quadrant replace with a square.  The hypotenuse of the square is
 // 1.045 times the radius of the circle.
 const cursorHandleDistanceMultiplier = 1.045;
-// HACK(charlie): This should be injected by webapp somehow.
-// TODO(charlie): Add a link to the webapp location as soon as the footer
-// has settled down.
-const toolbarHeightPx = 60;
 
 const touchTargetRadiusPx = 2 * cursorHandleRadiusPx;
 const touchTargetHeightPx = 2 * touchTargetRadiusPx;
@@ -1318,6 +1309,11 @@ class MathWrapper {
  * TODO(charlie): Move this scroll logic out of our components and into a higher
  * level in the component tree--perhaps even into webapp, beyond Perseus.
  */
+
+// HACK(charlie): This should be injected by webapp somehow.
+// TODO(charlie): Add a link to the webapp location as soon as the footer
+// has settled down.
+const toolbarHeightPx = 60;
 const scrollIntoView = (containerNode, keypadNode) => {
   // TODO(charlie): There's no need for us to be reading the keypad bounds
   // here, since they're pre-determined by logic in the store. We should
@@ -2037,7 +2033,7 @@ class MathInput extends React.Component {
     const innerStyle = _extends({}, inlineStyles.innerContainer, {
       borderWidth: this.getBorderWidthPx()
     }, focused ? {
-      borderColor: wonderBlocksBlue
+      borderColor: Color.blue
     } : {}, style);
 
     // NOTE(diedra): This label explicitly refers to tapping because this field
@@ -2123,7 +2119,7 @@ const inlineStyles = {
     borderStyle: "solid",
     borderColor: Color.offBlack50,
     borderRadius: 4,
-    color: offBlack
+    color: Color.offBlack
   }
 };
 
@@ -2360,37 +2356,9 @@ function Tabbar(props) {
   })));
 }
 
-/**
- * Constants that are shared between multiple files.
- */
-
-let KeypadType = /*#__PURE__*/function (KeypadType) {
-  KeypadType["FRACTION"] = "FRACTION";
-  KeypadType["EXPRESSION"] = "EXPRESSION";
-  return KeypadType;
-}({});
-let BorderDirection = /*#__PURE__*/function (BorderDirection) {
-  BorderDirection["LEFT"] = "LEFT";
-  BorderDirection["BOTTOM"] = "BOTTOM";
-  return BorderDirection;
-}({});
-({
-  LEFT: [BorderDirection.LEFT],
-  BOTTOM: [BorderDirection.BOTTOM],
-  ALL: [BorderDirection.LEFT, BorderDirection.BOTTOM],
-  NONE: []
-});
-let IconType = /*#__PURE__*/function (IconType) {
-  IconType["MATH"] = "MATH";
-  IconType["SVG"] = "SVG";
-  IconType["TEXT"] = "TEXT";
-  return IconType;
-}({});
-
 const getDefaultOperatorFields = ({
   key,
   keyType: _keyType = "OPERATOR",
-  iconType: _iconType = IconType.SVG,
   ariaLabel: _ariaLabel = key,
   data: _data = key
 }) => ({
@@ -2398,14 +2366,12 @@ const getDefaultOperatorFields = ({
   type: _keyType,
   ariaLabel: _ariaLabel,
   icon: {
-    type: _iconType,
     data: _data
   }
 });
 const getDefaultValueFields = ({
   key,
   keyType: _keyType2 = "VALUE",
-  iconType: _iconType2 = IconType.MATH,
   ariaLabel: _ariaLabel2 = key,
   data: _data2 = key
 }) => ({
@@ -2413,7 +2379,6 @@ const getDefaultValueFields = ({
   type: _keyType2,
   ariaLabel: _ariaLabel2,
   icon: {
-    type: _iconType2,
     data: _data2
   }
 });
@@ -2421,14 +2386,12 @@ const getDefaultNumberFields = ({
   key,
   data: _data3 = key.replace("NUM_", ""),
   keyType: _keyType3 = "VALUE",
-  iconType: _iconType3 = IconType.TEXT,
   ariaLabel: _ariaLabel3 = _data3
 }) => ({
   id: key,
   type: _keyType3,
   ariaLabel: _ariaLabel3,
   icon: {
-    type: _iconType3,
     data: _data3
   }
 });
@@ -5613,5 +5576,15 @@ const KeyArray = ["PLUS", "MINUS", "NEGATIVE", "TIMES", "DIVIDE", "DECIMAL", "PE
 // Perseus' Expression MathInput
 "PHI", "NTHROOT3", "POW", "LOG_B"];
 
+/**
+ * Constants that are shared between multiple files.
+ */
+
+let KeypadType = /*#__PURE__*/function (KeypadType) {
+  KeypadType["FRACTION"] = "FRACTION";
+  KeypadType["EXPRESSION"] = "EXPRESSION";
+  return KeypadType;
+}({});
+
 export { CursorContext, Keypad as DesktopKeypad, KeyArray, KeyConfigs, KeypadContext, MathInput as KeypadInput, KeypadType, MobileKeypad, StatefulKeypadContextProvider, createMathField, getCursorContext, keyToMathquillMap as keyTranslator, keypadElementPropType, libVersion, mathQuillInstance };
 //# sourceMappingURL=index.js.map