@khanacademy/math-input 17.1.0 → 17.2.1

package/dist/index.js

@@ -47,7 +47,7 @@ var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/math-input";
-const libVersion = "17.1.0";
+const libVersion = "17.2.1";
 perseusCore.addLibraryVersionToPerseusDebug(libName, libVersion);
 
 function _extends() {
@@ -1946,6 +1946,13 @@ class MathInput extends React__namespace.Component {
     if (!this.state.focused) {
       this.focus();
     }
+
+    // If the user clicked on the input using a mouse or tap gesture,
+    // we want to set the focus to the inputRef so that the keyUp
+    // event will be triggered when the user types on the keyboard.
+    // This is necessary to support Chromebooks as they use mobile user
+    // agents, do not simulate touch events, and have physical keyboards.
+    this.inputRef?.focus();
   };
 
   // We want to allow the user to be able to focus the input via click
@@ -1977,6 +1984,13 @@ class MathInput extends React__namespace.Component {
     if (!this.state.focused) {
       this.focus();
     }
+
+    // If the user clicked on the input using a mouse or tap gesture,
+    // we want to set the focus to the inputRef so that the keyUp
+    // event will be triggered when the user types on the keyboard.
+    // This is necessary to support Chromebooks as they use mobile user
+    // agents, do not simulate touch events, and have physical keyboards.
+    this.inputRef?.focus();
   };
   handleTouchMove = e => {
     e.stopPropagation();
@@ -2136,7 +2150,7 @@ class MathInput extends React__namespace.Component {
       const value = this.mathField.getContent();
       if (this.props.value !== value) {
         this.mathField.setContent(this.props.value);
-        this.props.onChange(value, false);
+        this.props.onChange(value, () => {});
         this._hideCursorHandle();
       }
     }
@@ -2371,10 +2385,22 @@ const IconAsset = function (_ref) {
           fill: tintColor
         }));
       }
+    case "Fractions":
+      // The Fractions keypad is a special one that never displays anything
+      // in the tabbar. Ideally, we'd separate the KeypadPageType from the
+      // tab bar item types, but that's not easy given how the keypad manages
+      // the selected page. For now, we'll just return a dummy SVG to satisfy
+      // the types here.
+      return /*#__PURE__*/React__namespace.createElement("svg", {
+        width: "44",
+        height: "44",
+        viewBox: "0 0 44 44",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg"
+      });
     default:
       {
-        // type as never;
-        throw new Error("Invalid icon type");
+        throw new Error(`Invalid icon type: ${type}`);
       }
   }
 };