@khanacademy/perseus 41.1.0 → 41.2.0

package/dist/es/index.js

@@ -31598,6 +31598,63 @@ const lockedFigureFillStyles = {
 
 const plotterPlotTypes = ["bar", "line", "pic", "histogram", "dotplot"];
 
+/**
+ * 44 is touch best practice and AAA compliant for WCAG
+ * https://www.w3.org/WAI/WCAG21/Understanding/target-size.html
+ */
+const TARGET_SIZE = 44;
+const REMOVE_BUTTON_ID = "perseus_mafs_remove_button";
+
+// same as pointsFromNormalized in interactive-graph.tsx
+const normalizePoints = (range, step, coordsList, noSnap) => coordsList.map(coords =>
+// maps over [x, y]
+coords.map((coord, i) => {
+  const axisRange = range[i];
+  if (noSnap) {
+    return axisRange[MIN] + size(axisRange) * coord;
+  }
+  const axisStep = step[i];
+  const nSteps = Math.floor(size(axisRange) / axisStep);
+  const tick = Math.round(coord * nSteps);
+  return axisRange[MIN] + axisStep * tick;
+}));
+
+// same as normalizeCoords in interactive-graph.tsx
+const normalizeCoords = (coordsList, ranges) => coordsList.map(coords => coords.map((coord, i) => {
+  return (coord + ranges[i][1]) / size(ranges[i]);
+}));
+
+// Returns the closest point to the given `point` that is within the graph
+// bounds given in `state`.
+function bound$1({
+  snapStep,
+  range,
+  point
+}) {
+  const boundingBox = inset(snapStep, range);
+  return clampToBox(boundingBox, point);
+}
+function isUnlimitedGraphState(state) {
+  return state.type === "point" && state.numPoints === "unlimited" || state.type === "polygon" && state.numSides === "unlimited";
+}
+
+/**
+ * Replace all text outside of the $ TeX blocks with `\\text{...}`
+ * This way, the entire resulting string can be rendered within <TeX>
+ * and the text outside of the $ blocks will be non-TeX text.
+ */
+function replaceOutsideTeX(mathString) {
+  let currentlyTeX = mathString[0] === "$";
+  let result = "";
+  const splitString = mathString.split("$").filter(part => part !== "");
+  for (let i = 0; i < splitString.length; i++) {
+    const part = splitString[i];
+    result += currentlyTeX ? part : `\\text{${part}}`;
+    currentlyTeX = !currentlyTeX;
+  }
+  return result;
+}
+
 function LockedLabel(props) {
   const {
     coord,
@@ -31610,7 +31667,7 @@ function LockedLabel(props) {
     TeX
   } = getDependencies();
 
-  // Move this all outside the SVG element
+  // Note: The TeX component cannot be rendered within an SVG
   return /*#__PURE__*/React.createElement("span", {
     className: "locked-label",
     style: {
@@ -31622,7 +31679,7 @@ function LockedLabel(props) {
       backgroundColor: "rgba(255, 255, 255, 0.8)"
     },
     "aria-hidden": true
-  }, /*#__PURE__*/React.createElement(TeX, null, text));
+  }, /*#__PURE__*/React.createElement(TeX, null, replaceOutsideTeX(text)));
 }
 
 function GraphLockedLabelsLayer(props) {
@@ -32542,46 +32599,6 @@ function calculateBisectorPoint(point1, point2, vertex, isReflex, allowReflex, a
   return scaledBisector;
 }
 
-/**
- * 44 is touch best practice and AAA compliant for WCAG
- * https://www.w3.org/WAI/WCAG21/Understanding/target-size.html
- */
-const TARGET_SIZE = 44;
-const REMOVE_BUTTON_ID = "perseus_mafs_remove_button";
-
-// same as pointsFromNormalized in interactive-graph.tsx
-const normalizePoints = (range, step, coordsList, noSnap) => coordsList.map(coords =>
-// maps over [x, y]
-coords.map((coord, i) => {
-  const axisRange = range[i];
-  if (noSnap) {
-    return axisRange[MIN] + size(axisRange) * coord;
-  }
-  const axisStep = step[i];
-  const nSteps = Math.floor(size(axisRange) / axisStep);
-  const tick = Math.round(coord * nSteps);
-  return axisRange[MIN] + axisStep * tick;
-}));
-
-// same as normalizeCoords in interactive-graph.tsx
-const normalizeCoords = (coordsList, ranges) => coordsList.map(coords => coords.map((coord, i) => {
-  return (coord + ranges[i][1]) / size(ranges[i]);
-}));
-
-// Returns the closest point to the given `point` that is within the graph
-// bounds given in `state`.
-function bound$1({
-  snapStep,
-  range,
-  point
-}) {
-  const boundingBox = inset(snapStep, range);
-  return clampToBox(boundingBox, point);
-}
-function isUnlimitedGraphState(state) {
-  return state.type === "point" && state.numPoints === "unlimited" || state.type === "polygon" && state.numSides === "unlimited";
-}
-
 var isProduction = process.env.NODE_ENV === 'production';
 var prefix = 'Invariant failed';
 function invariant(condition, message) {
@@ -35924,11 +35941,7 @@ function interactiveGraphValidator(userInput, rubric) {
 
       // If both of the guess points are on the correct line, it's
       // correct.
-      if (
-      // @ts-expect-error - TS2532 - Object is possibly 'undefined'. | TS2532 - Object is possibly 'undefined'.
-      collinear(correct[0], correct[1], guess[0]) &&
-      // @ts-expect-error - TS2532 - Object is possibly 'undefined'. | TS2532 - Object is possibly 'undefined'.
-      collinear(correct[0], correct[1], guess[1])) {
+      if (collinear(correct[0], correct[1], guess[0]) && collinear(correct[0], correct[1], guess[1])) {
         return {
           type: "points",
           earned: 1,
@@ -35950,9 +35963,7 @@ function interactiveGraphValidator(userInput, rubric) {
     } else if (userInput.type === "quadratic" && rubric.correct.type === "quadratic" && userInput.coords != null) {
       // If the parabola coefficients match, it's correct.
       const guessCoeffs = getQuadraticCoefficients(userInput.coords);
-      const correctCoeffs = getQuadraticCoefficients(
-      // @ts-expect-error - TS2345 - Argument of type 'readonly Coord[] | undefined' is not assignable to parameter of type 'readonly Coord[]'.
-      rubric.correct.coords);
+      const correctCoeffs = getQuadraticCoefficients(rubric.correct.coords);
       if (deepEq$2(guessCoeffs, correctCoeffs)) {
         return {
           type: "points",
@@ -35963,9 +35974,7 @@ function interactiveGraphValidator(userInput, rubric) {
       }
     } else if (userInput.type === "sinusoid" && rubric.correct.type === "sinusoid" && userInput.coords != null) {
       const guessCoeffs = getSinusoidCoefficients(userInput.coords);
-      const correctCoeffs = getSinusoidCoefficients(
-      // @ts-expect-error - TS2345 - Argument of type 'readonly Coord[] | undefined' is not assignable to parameter of type 'readonly Coord[]'.
-      rubric.correct.coords);
+      const correctCoeffs = getSinusoidCoefficients(rubric.correct.coords);
       const canonicalGuessCoeffs = canonicalSineCoefficients$1(guessCoeffs);
       const canonicalCorrectCoeffs = canonicalSineCoefficients$1(correctCoeffs);
       // If the canonical coefficients match, it's correct.
@@ -36009,10 +36018,8 @@ function interactiveGraphValidator(userInput, rubric) {
         };
       }
     } else if (userInput.type === "polygon" && rubric.correct.type === "polygon" && userInput.coords != null) {
-      var _userInput$coords, _rubric$correct$coord;
-      const guess = (_userInput$coords = userInput.coords) == null ? void 0 : _userInput$coords.slice();
-      // @ts-expect-error - TS2322 - Type 'Coord[] | undefined' is not assignable to type 'Coord[]'.
-      const correct = (_rubric$correct$coord = rubric.correct.coords) == null ? void 0 : _rubric$correct$coord.slice();
+      const guess = userInput.coords.slice();
+      const correct = rubric.correct.coords.slice();
       let match;
       if (rubric.correct.match === "similar") {
         match = similar(guess, correct, Number.POSITIVE_INFINITY);
@@ -36035,11 +36042,9 @@ function interactiveGraphValidator(userInput, rubric) {
         };
       }
     } else if (userInput.type === "segment" && rubric.correct.type === "segment" && userInput.coords != null) {
-      var _rubric$correct;
       let guess = Util.deepClone(userInput.coords);
-      let correct = Util.deepClone((_rubric$correct = rubric.correct) == null ? void 0 : _rubric$correct.coords);
+      let correct = Util.deepClone(rubric.correct.coords);
       guess = _.invoke(guess, "sort").sort();
-      // @ts-expect-error - TS2345 - Argument of type '(readonly Coord[])[] | undefined' is not assignable to parameter of type 'Collection<any>'.
       correct = _.invoke(correct, "sort").sort();
       if (deepEq$2(guess, correct)) {
         return {
@@ -36052,11 +36057,7 @@ function interactiveGraphValidator(userInput, rubric) {
     } else if (userInput.type === "ray" && rubric.correct.type === "ray" && userInput.coords != null) {
       const guess = userInput.coords;
       const correct = rubric.correct.coords;
-      if (
-      // @ts-expect-error - TS2532 - Object is possibly 'undefined'.
-      deepEq$2(guess[0], correct[0]) &&
-      // @ts-expect-error - TS2532 - Object is possibly 'undefined'. | TS2532 - Object is possibly 'undefined'.
-      collinear(correct[0], correct[1], guess[1])) {
+      if (deepEq$2(guess[0], correct[0]) && collinear(correct[0], correct[1], guess[1])) {
         return {
           type: "points",
           earned: 1,
@@ -44012,41 +44013,16 @@ var extraWidgets = [Categorizer$1, CSProgram$1, Dropdown$1, Explanation$1, Defin
  * This should be called by all clients, specifying whether extra widgets are
  * needed via `loadExtraWidgets`. It is idempotent, so it's not a problem to
  * call it multiple times.
- *
- * skipMathJax:
- *   If false/undefined, MathJax will be configured, and the
- *   promise will wait for MathJax to load (if it hasn't already).
  */
-const init = function init(options) {
+const init = function init() {
   registerWidgets(basicWidgets);
   registerWidgets(extraWidgets);
   replaceDeprecatedWidgets();
-
-  // Pass skipMathJax: true if MathJax is already loaded and configured.
-  const skipMathJax = options.skipMathJax;
-  if (skipMathJax) {
-    // @ts-expect-error - TS2322 - Type 'Promise<void>' is not assignable to type 'Promise<undefined>'.
-    return Promise.resolve();
-  }
-  return new Promise((resolve, reject) => {
-    MathJax.Hub.Config({
-      messageStyle: "none",
-      skipStartupTypeset: "none",
-      "HTML-CSS": {
-        availableFonts: ["TeX"],
-        imageFont: null,
-        scale: 100,
-        showMathMenu: false
-      }
-    });
-    MathJax.Hub.Configured();
-    MathJax.Hub.Queue(resolve);
-  });
 };
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus";
-const libVersion = "41.1.0";
+const libVersion = "41.2.0";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {
@@ -47301,16 +47277,7 @@ const getValidWidgetIds = perseusItem => {
 };
 
 const deepEq = Util.deepEq;
-
-/**
- * Helper to parse PerseusItem JSON
- * Why not just use JSON.parse? We want:
- * - To make sure types are correct
- * - To give us a central place to validate/transform output if needed
- * @param {string} json - the stringified PerseusItem JSON
- * @returns {PerseusItem} the parsed PerseusItem object
- */
-function parsePerseusItem(json) {
+function isRealJSONParse(jsonParse) {
   const randomPhrase = buildRandomPhrase();
   const randomHintPhrase = buildRandomPhrase();
   const randomString = buildRandomString();
@@ -47363,15 +47330,10 @@ function parsePerseusItem(json) {
       }
     }
   });
-  // @ts-expect-error TS2550: Property 'replaceAll' does not exist on type 'string'.
-  const testJSON = buildTestData(testingObject.replaceAll('"', '\\"'));
-  const parsedJSON = JSON.parse(testJSON);
-  const parsedItemData = parsedJSON.data.assessmentItem.item.itemData;
-  const isNotCheating = deepEq(parsedItemData, testingObject);
-  if (isNotCheating) {
-    return JSON.parse(json);
-  }
-  throw new Error("Something went wrong.");
+  const testJSON = buildTestData(testingObject.replace(/"/g, '\\"'));
+  const parsedTestJSON = jsonParse(testJSON);
+  const parsedTestItemData = parsedTestJSON.data.assessmentItem.item.itemData;
+  return deepEq(parsedTestItemData, testingObject);
 }
 function buildRandomString(capitalize = false) {
   let randomString = "";
@@ -47397,6 +47359,23 @@ function buildTestData(testObject) {
   return `{"data":{"assessmentItem":{"__typename":"AssessmentItemOrError","error":null,"item":{"__typename":"AssessmentItem","id":"x890b3c70f3e8f4a6","itemData":"${testObject}","problemType":"Type 1","sha":"c7284a3ad65214b4e62bccce236d92f7f5d35941"}}}}`;
 }
 
+/**
+ * Helper to parse PerseusItem JSON
+ * Why not just use JSON.parse? We want:
+ * - To make sure types are correct
+ * - To give us a central place to validate/transform output if needed
+ * @param {string} json - the stringified PerseusItem JSON
+ * @returns {PerseusItem} the parsed PerseusItem object
+ */
+function parsePerseusItem(json) {
+  // Try to block a cheating vector which relies on monkey-patching
+  // JSON.parse
+  if (isRealJSONParse(JSON.parse)) {
+    return JSON.parse(json);
+  }
+  throw new Error("Something went wrong.");
+}
+
 const genericPerseusItemData = {
   question: {
     content: "",