@khanacademy/math-input 17.2.0 → 17.2.2

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

@@ -64,3 +64,4 @@ declare module "mathquill" {
         cursor?: Cursor;
     }
 }
+export type MathQuillAriaStatisStringsMap = MathQuill.v3.AriaStaticStringsMap;

package/dist/components/input/strings.d.ts

@@ -0,0 +1,19 @@
+export declare const mathQuillStrings: {
+    mathInputBox: string;
+    ariaStaticStringsMap: {
+        before: (obj: string) => string;
+        after: (obj: string) => string;
+        "beginning of": (obj: string) => string;
+        "end of": (obj: string) => string;
+        Baseline: string;
+        Superscript: string;
+        selected: (obj: string) => string;
+        "no answer": string;
+        "nothing selected": string;
+        "nothing to the right": string;
+        "nothing to the left": string;
+        "block is empty": string;
+        "nothing above": string;
+        labelValue: (label: string, value: string) => string;
+    };
+};

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 = "17.2.0";
+const libVersion = "17.2.2";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 function _extends() {
@@ -383,6 +383,39 @@ function convertDotToTimesByLocale(convertDotToTimes) {
 const inJest = typeof process !== "undefined" && !!((_process = process) != null && (_process = _process.env) != null && _process.JEST_WORKER_ID);
 // Explicitly checking for undefined because Cypress throws an error
 
+const mathQuillStrings = {
+  mathInputBox: i18n._("Math input box"),
+  ariaStaticStringsMap: {
+    before: obj => i18n._("before %(obj)s", {
+      obj
+    }),
+    after: obj => i18n._("after %(obj)s", {
+      obj
+    }),
+    "beginning of": obj => i18n._("beginning of %(obj)s", {
+      obj
+    }),
+    "end of": obj => i18n._("end of %(obj)s", {
+      obj
+    }),
+    Baseline: i18n._("Baseline"),
+    Superscript: i18n._("Superscript"),
+    selected: obj => i18n._("%(obj)s selected", {
+      obj
+    }),
+    "no answer": i18n._("no answer"),
+    "nothing selected": i18n._("nothing selected"),
+    "nothing to the right": i18n._("nothing to the right"),
+    "nothing to the left": i18n._("nothing to the left"),
+    "block is empty": i18n._("block is empty"),
+    "nothing above": i18n._("nothing above"),
+    labelValue: (label, value) => i18n._("%(label)s: %(value)s", {
+      label,
+      value
+    })
+  }
+};
+
 // We only need one MathQuill instance (referred to as MQ in the docs)
 // and that contains some MQ constants and the MathField constructor
 const mathQuillInstance = MathQuill.getInterface(3);
@@ -431,9 +464,7 @@ const createBaseConfig = () => ({
 function createMathField(container, configCallback) {
   const baseConfig = createBaseConfig();
   const config = configCallback ? configCallback(baseConfig) : baseConfig;
-  const mathField = mathQuillInstance.MathField(container, config)
-  // translated in ./math-input.tsx
-  .setAriaLabel(i18n._("Math input box"));
+  const mathField = mathQuillInstance.MathField(container, config).setAriaLabel(mathQuillStrings.mathInputBox).setAriaStringsOverrideMap(mathQuillStrings.ariaStaticStringsMap);
 
   // We should avoid running SpeechRuleEngine.setup() in Jest. It makes an
   //   HTTP request to fetch non-english speech rules, and cannot be easily
@@ -2176,7 +2207,7 @@ class MathInput extends React.Component {
     // keyboard appear. It should only require one finger, which is how iOS works.
     // TODO(diedra): Fix the bug that is causing Android to require a two finger tap
     // to the open the keyboard, and then remove the second half of this label.
-    const ariaLabel = i18n._("Math input box") + " " + i18n._("Tap with one or two fingers to open keyboard");
+    const ariaLabel = mathQuillStrings.mathInputBox + " " + i18n._("Tap with one or two fingers to open keyboard");
     return /*#__PURE__*/React.createElement(KeypadContext.Consumer, null, ({
       keypadActive,
       setKeypadActive
@@ -2352,10 +2383,22 @@ const IconAsset = function IconAsset({
           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.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}`);
       }
   }
 };