@khanacademy/perseus 49.1.7 → 49.2.1

package/dist/es/index.js

@@ -326,11 +326,11 @@ const mockStrings = {
     angleMeasure,
     vertexX,
     vertexY,
-    isX,
-    isY,
-    tsX,
-    tsY
-  }) => `The angle measure is ${angleMeasure} degrees with a vertex at ${vertexX} comma ${vertexY}, a point on the initial side at ${isX} comma ${isY} and a point on the terminal side at ${tsX} comma ${tsY}.`
+    startingSideX,
+    startingSideY,
+    endingSideX,
+    endingSideY
+  }) => `The angle measure is ${angleMeasure} degrees with a vertex at ${vertexX} comma ${vertexY}, a point on the starting side at ${startingSideX} comma ${startingSideY} and a point on the ending side at ${endingSideX} comma ${endingSideY}.`
   // The above strings are used for interactive graph SR descriptions.
 };
 
@@ -741,6 +741,9 @@ const mapButtonSets = buttonSets => {
       case "trig":
         keypadButtonSets.trigonometry = true;
         break;
+      case "scientific":
+        keypadButtonSets.scientific = true;
+        break;
     }
   });
   return keypadButtonSets;
@@ -3821,7 +3824,9 @@ ZoomServiceClass.prototype._scrollHandler = function (e) {
   }
 };
 ZoomServiceClass.prototype._keyHandler = function (e) {
-  if (e.keyCode === 27) {
+  // 27: Esc, 13: Enter, 32: Space
+  const keyCodes = [27, 13, 32];
+  if (keyCodes.includes(e.keyCode)) {
     this._activeZoomClose();
   }
 };
@@ -3910,6 +3915,7 @@ Zoom.prototype.zoomImage = function () {
   }.bind(this);
   img.src = this._targetImage.src;
   img.alt = this._targetImage.alt;
+  img.tabIndex = 0;
   this.$zoomedImage = $zoomedImage;
 };
 Zoom.prototype._zoomOriginal = function () {
@@ -17020,6 +17026,7 @@ class ImageLoader extends React.Component {
       }
       const staticUrl = getDependencies().staticUrl;
       return /*#__PURE__*/React.createElement("img", _extends({
+        tabIndex: 0,
         src: staticUrl(src),
         onKeyUp: onKeyUp,
         onKeyDown: onKeyDown
@@ -22219,7 +22226,7 @@ function scoreNumericInput(userInput, rubric, strings) {
   // We may have received TeX; try to parse it before grading.
   // If `currentValue` is not TeX, this should be a no-op.
   const currentValue = ParseTex(userInput.currentValue);
-  const normalizedAnswerExpected = rubric.answers.filter(answer => answer.status === "correct").every(answer => answer.value !== undefined && Math.abs(answer.value) <= 1);
+  const normalizedAnswerExpected = rubric.answers.filter(answer => answer.status === "correct").every(answer => answer.value != null && Math.abs(answer.value) <= 1);
 
   // The coefficient is an attribute of the widget
   let localValue = currentValue;
@@ -27455,6 +27462,7 @@ class Dropdown extends React.Component {
     }, this.props.visibleLabel), /*#__PURE__*/React.createElement(SingleSelect, {
       id: dropdownId,
       placeholder: "",
+      className: "perseus-dropdown",
       onChange: value => this._handleChange(parseInt(value)),
       selectedValue: String(this.props.selected),
       disabled: this.props.apiOptions.readOnly,
@@ -32362,7 +32370,7 @@ const LegacyGrid = ({
  *         "new-awesomeness": MyAwesomeNewWidget;
  *
  *         // A deprecated widget
- *         "super-old-widget": AutoCorrectWidget;
+ *         "super-old-widget": DeprecatedStandinWidget;
  *     }
  * }
  *
@@ -32556,46 +32564,28 @@ function LockedLabel(props) {
 
 function GraphLockedLabelsLayer(props) {
   const {
-    flags,
     lockedFigures
   } = props;
   return lockedFigures.map((figure, i) => {
-    var _flags$mafs, _flags$mafs2, _flags$mafs3, _flags$mafs4, _flags$mafs5, _flags$mafs6;
+    var _figure$labels, _figure$points$0$labe, _figure$points$1$labe;
     if (figure.type === "label") {
       return /*#__PURE__*/React.createElement(LockedLabel, _extends({
         key: `label-${i}`
       }, figure));
     }
-    if (
-    // Point flag + point type
-    flags != null && (_flags$mafs = flags["mafs"]) != null && _flags$mafs["locked-point-labels"] && figure.type === "point" ||
-    // Line flag + line type
-    flags != null && (_flags$mafs2 = flags["mafs"]) != null && _flags$mafs2["locked-line-labels"] && figure.type === "line" ||
-    // Vector flag + vector type
-    flags != null && (_flags$mafs3 = flags["mafs"]) != null && _flags$mafs3["locked-vector-labels"] && figure.type === "vector" ||
-    // Ellipse flag + ellipse type
-    flags != null && (_flags$mafs4 = flags["mafs"]) != null && _flags$mafs4["locked-ellipse-labels"] && figure.type === "ellipse" ||
-    // Polygon flag + polygon type
-    flags != null && (_flags$mafs5 = flags["mafs"]) != null && _flags$mafs5["locked-polygon-labels"] && figure.type === "polygon" ||
-    // Function flag + function type
-    flags != null && (_flags$mafs6 = flags["mafs"]) != null && _flags$mafs6["locked-function-labels"] && figure.type === "function") {
-      var _figure$labels, _figure$points$0$labe, _figure$points$1$labe;
-      return /*#__PURE__*/React.createElement(React.Fragment, {
-        key: i
-      }, (_figure$labels = figure.labels) == null ? void 0 : _figure$labels.map((label, j) => /*#__PURE__*/React.createElement(LockedLabel, _extends({
-        key: `${i}-label-${j}`
-      }, label))), figure.type === "line" && /*#__PURE__*/React.createElement(React.Fragment, null, (_figure$points$0$labe = figure.points[0].labels) == null ? void 0 : _figure$points$0$labe.map((label, k) => /*#__PURE__*/React.createElement(LockedLabel, _extends({
-        key: `locked-figure-${i}-point-1-label-${k}`
-      }, label))), (_figure$points$1$labe = figure.points[1].labels) == null ? void 0 : _figure$points$1$labe.map((label, k) => /*#__PURE__*/React.createElement(LockedLabel, _extends({
-        key: `locked-figure-${i}-point-2-label-${k}`
-      }, label)))));
-    }
-    return null;
+    return /*#__PURE__*/React.createElement(React.Fragment, {
+      key: i
+    }, (_figure$labels = figure.labels) == null ? void 0 : _figure$labels.map((label, j) => /*#__PURE__*/React.createElement(LockedLabel, _extends({
+      key: `${i}-label-${j}`
+    }, label))), figure.type === "line" && /*#__PURE__*/React.createElement(React.Fragment, null, (_figure$points$0$labe = figure.points[0].labels) == null ? void 0 : _figure$points$0$labe.map((label, k) => /*#__PURE__*/React.createElement(LockedLabel, _extends({
+      key: `locked-figure-${i}-point-1-label-${k}`
+    }, label))), (_figure$points$1$labe = figure.points[1].labels) == null ? void 0 : _figure$points$1$labe.map((label, k) => /*#__PURE__*/React.createElement(LockedLabel, _extends({
+      key: `locked-figure-${i}-point-2-label-${k}`
+    }, label)))));
   });
 }
 
 const LockedEllipse = props => {
-  var _flags$mafs;
   const {
     center,
     radius,
@@ -32603,10 +32593,9 @@ const LockedEllipse = props => {
     color: color$1,
     fillStyle,
     strokeStyle,
-    ariaLabel,
-    flags
+    ariaLabel
   } = props;
-  const hasAria = ariaLabel && (flags == null || (_flags$mafs = flags["mafs"]) == null ? void 0 : _flags$mafs["locked-figures-aria"]);
+  const hasAria = !!ariaLabel;
   return /*#__PURE__*/React.createElement("g", {
     className: "locked-ellipse",
     "aria-label": hasAria ? ariaLabel : undefined,
@@ -32631,7 +32620,6 @@ const LockedEllipse = props => {
 };
 
 const LockedFunction = props => {
-  var _props$flags;
   const [equation, setEquation] = useState();
   const {
     color,
@@ -32644,7 +32632,7 @@ const LockedFunction = props => {
     style: strokeStyle,
     domain
   };
-  const hasAria = props.ariaLabel && ((_props$flags = props.flags) == null || (_props$flags = _props$flags["mafs"]) == null ? void 0 : _props$flags["locked-figures-aria"]);
+  const hasAria = !!props.ariaLabel;
   useEffect(() => {
     // Parsing the equation in a "useEffect" hook saves about 2ms each frame
     //    when the learner is interacting with the graph (i.e. moving points).
@@ -32760,7 +32748,6 @@ function getArrayWithoutDuplicates(array) {
 }
 
 const LockedLine = props => {
-  var _flags$mafs;
   const {
     color: color$1,
     lineStyle,
@@ -32769,11 +32756,10 @@ const LockedLine = props => {
     showPoint1,
     showPoint2,
     ariaLabel,
-    flags,
     range
   } = props;
   const [point1, point2] = points;
-  const hasAria = ariaLabel && (flags == null || (_flags$mafs = flags["mafs"]) == null ? void 0 : _flags$mafs["locked-figures-aria"]);
+  const hasAria = !!ariaLabel;
   let line;
   if (kind === "ray") {
     // Rays extend to the end of the graph in one direction.
@@ -32840,16 +32826,14 @@ const LockedLine = props => {
 };
 
 const LockedPoint = props => {
-  var _flags$mafs;
   const {
-    flags,
     color: color$1,
     coord,
     filled,
     ariaLabel
   } = props;
   const [x, y] = coord;
-  const hasAria = ariaLabel && (flags == null || (_flags$mafs = flags["mafs"]) == null ? void 0 : _flags$mafs["locked-figures-aria"]);
+  const hasAria = !!ariaLabel;
   return /*#__PURE__*/React.createElement("g", {
     className: "locked-point",
     "aria-label": hasAria ? ariaLabel : undefined,
@@ -32868,7 +32852,6 @@ const LockedPoint = props => {
 };
 
 const LockedPolygon = props => {
-  var _props$flags;
   const {
     points,
     color: color$1,
@@ -32876,7 +32859,7 @@ const LockedPolygon = props => {
     fillStyle,
     strokeStyle
   } = props;
-  const hasAria = props.ariaLabel && ((_props$flags = props.flags) == null || (_props$flags = _props$flags["mafs"]) == null ? void 0 : _props$flags["locked-figures-aria"]);
+  const hasAria = !!props.ariaLabel;
   return /*#__PURE__*/React.createElement("g", {
     className: "locked-polygon",
     "aria-label": hasAria ? props.ariaLabel : undefined,
@@ -32904,15 +32887,13 @@ const LockedPolygon = props => {
 };
 
 const LockedVector = props => {
-  var _flags$mafs;
   const {
     color,
     points,
-    ariaLabel,
-    flags
+    ariaLabel
   } = props;
   const [tail, tip] = points;
-  const hasAria = ariaLabel && (flags == null || (_flags$mafs = flags["mafs"]) == null ? void 0 : _flags$mafs["locked-figures-aria"]);
+  const hasAria = !!ariaLabel;
   return /*#__PURE__*/React.createElement("g", {
     className: "locked-vector",
     "aria-label": hasAria ? ariaLabel : undefined,
@@ -32926,7 +32907,6 @@ const LockedVector = props => {
 
 const GraphLockedLayer = props => {
   const {
-    flags,
     lockedFigures
   } = props;
   return /*#__PURE__*/React.createElement(React.Fragment, null, lockedFigures.map((figure, index) => {
@@ -32934,40 +32914,28 @@ const GraphLockedLayer = props => {
       case "point":
         return /*#__PURE__*/React.createElement(LockedPoint, _extends({
           key: `point-${index}`
-        }, figure, {
-          flags: flags
-        }));
+        }, figure));
       case "line":
         return /*#__PURE__*/React.createElement(LockedLine, _extends({
           key: `line-${index}`,
           range: props.range
-        }, figure, {
-          flags: flags
-        }));
+        }, figure));
       case "vector":
         return /*#__PURE__*/React.createElement(LockedVector, _extends({
           key: `vector-${index}`
-        }, figure, {
-          flags: flags
-        }));
+        }, figure));
       case "ellipse":
         return /*#__PURE__*/React.createElement(LockedEllipse, _extends({
           key: `ellipse-${index}`
-        }, figure, {
-          flags: flags
-        }));
+        }, figure));
       case "polygon":
         return /*#__PURE__*/React.createElement(LockedPolygon, _extends({
           key: `polygon-${index}`
-        }, figure, {
-          flags: flags
-        }));
+        }, figure));
       case "function":
         return /*#__PURE__*/React.createElement(LockedFunction, _extends({
           key: `function-${index}`
-        }, figure, {
-          flags: flags
-        }));
+        }, figure));
       case "label":
         // This is rendered outside the SVG element, since
         // TeX cannot be rendered inside an SVG.
@@ -34131,10 +34099,10 @@ function AngleGraph(props) {
     angleMeasure,
     vertexX: srFormatNumber(coords[1][X], locale),
     vertexY: srFormatNumber(coords[1][Y], locale),
-    isX: srFormatNumber(coords[2][X], locale),
-    isY: srFormatNumber(coords[2][Y], locale),
-    tsX: srFormatNumber(coords[0][X], locale),
-    tsY: srFormatNumber(coords[0][Y], locale)
+    startingSideX: srFormatNumber(coords[2][X], locale),
+    startingSideY: srFormatNumber(coords[2][Y], locale),
+    endingSideX: srFormatNumber(coords[0][X], locale),
+    endingSideY: srFormatNumber(coords[0][Y], locale)
   });
   const formatCoordinates = (x, y) => ({
     x: srFormatNumber(x, locale),
@@ -35438,7 +35406,6 @@ function useDraggablePx(args) {
  * - Interactive Graph Elements
  */
 const MafsGraph = props => {
-  var _props$flags;
   const {
     state,
     dispatch,
@@ -35575,11 +35542,9 @@ const MafsGraph = props => {
   })),
   // Only render the axis ticks and arrows if the markings are set to a full "graph"
   props.markings === "graph" && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AxisTicks, null), /*#__PURE__*/React.createElement(AxisArrows, null)), /*#__PURE__*/React.createElement("svg", nestedSVGAttributes, props.lockedFigures && /*#__PURE__*/React.createElement(GraphLockedLayer, {
-    flags: props.flags,
     lockedFigures: props.lockedFigures,
     range: state.range
-  }))), ((_props$flags = props.flags) == null || (_props$flags = _props$flags["mafs"]) == null ? void 0 : _props$flags["interactive-graph-locked-features-labels"]) && props.lockedFigures && /*#__PURE__*/React.createElement(GraphLockedLabelsLayer, {
-    flags: props.flags,
+  }))), props.lockedFigures && /*#__PURE__*/React.createElement(GraphLockedLabelsLayer, {
     lockedFigures: props.lockedFigures
   }), /*#__PURE__*/React.createElement(View, {
     style: {
@@ -45552,7 +45517,7 @@ const init = function init() {
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus";
-const libVersion = "49.1.7";
+const libVersion = "49.2.1";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {
@@ -47893,9 +47858,9 @@ function parseWidgetWithVersion(parseVersion, parseType, parseOptions) {
 const parseCategorizerWidget = parseWidget(constant("categorizer"), object({
   items: array(string),
   categories: array(string),
-  randomizeItems: boolean,
+  randomizeItems: defaulted(boolean, () => false),
   static: defaulted(boolean, () => false),
-  values: array(number),
+  values: array(defaulted(number, () => 0)),
   highlightLint: optional(boolean),
   linterContext: optional(object({
     contentType: string,
@@ -47915,7 +47880,7 @@ const parseCSProgramWidget = parseWidget(constant("cs-program"), object({
   showButtons: boolean,
   width: number,
   height: number,
-  static: boolean
+  static: defaulted(boolean, () => false)
 }));
 
 const parseDefinitionWidget = parseWidget(constant("definition"), object({
@@ -47925,7 +47890,7 @@ const parseDefinitionWidget = parseWidget(constant("definition"), object({
 }));
 
 const parseDropdownWidget = parseWidget(constant("dropdown"), object({
-  placeholder: string,
+  placeholder: defaulted(string, () => ""),
   ariaLabel: optional(string),
   visibleLabel: optional(string),
   static: defaulted(boolean, () => false),
@@ -47942,33 +47907,127 @@ const parseExplanationWidget = parseWidget(constant("explanation"), object({
   // We wrap parseWidgetsMap in a function here to make sure it is not
   // referenced before it is defined. There is an import cycle between
   // this file and widgets-map.ts that could cause it to be undefined.
-  widgets: (rawVal, ctx) => parseWidgetsMap(rawVal, ctx),
-  static: boolean
+  widgets: defaulted((rawVal, ctx) => parseWidgetsMap(rawVal, ctx), () => ({})),
+  static: defaulted(boolean, () => false)
 }));
 
-const parseAnswerForm = object({
-  value: string,
-  form: boolean,
-  simplify: boolean,
+// Given a function, creates a PartialParser that converts one type to another
+// using that function. The returned parser never fails.
+function convert(f) {
+  return (rawValue, ctx) => ctx.success(f(rawValue));
+}
+
+/**
+ * Creates a parser for a widget options type with multiple major versions. Old
+ * versions are migrated to the latest version. The parse fails if the input
+ * data does not match any of the versions.
+ *
+ * @example
+ * const parseOptions = versionedWidgetOptions(3, parseOptionsV3)
+ *     .withMigrationFrom(2, parseOptionsV2, migrateV2ToV3)
+ *     .withMigrationFrom(1, parseOptionsV1, migrateV1ToV2)
+ *     .withMigrationFrom(0, parseOptionsV0, migrateV0ToV1)
+ *     .parser;
+ *
+ * @param latestMajorVersion the latest major version of the widget options.
+ * @param parseLatest a {@link Parser} for the latest version of the widget
+ * options.
+ * @returns a builder object, to which migrations from earlier versions can be
+ * added. Migrations must be added in "reverse chronological" order as in the
+ * example above.
+ */
+function versionedWidgetOptions(latestMajorVersion, parseLatest) {
+  return new VersionedWidgetOptionsParserBuilder(latestMajorVersion, parseLatest, latest => latest, (raw, ctx) => ctx.failure("widget options with a known version number", raw));
+}
+class VersionedWidgetOptionsParserBuilder {
+  constructor(majorVersion, parseThisVersion, migrateToLatest, parseOtherVersions) {
+    this.parser = void 0;
+    this.migrateToLatest = migrateToLatest;
+    this.parseOtherVersions = parseOtherVersions;
+    const parseThisVersionAndMigrateToLatest = pipeParsers(parseThisVersion).then(convert(this.migrateToLatest)).parser;
+    this.parser = (raw, ctx) => {
+      if (!isObject(raw)) {
+        return ctx.failure("object", raw);
+      }
+      const versionParseResult = parseVersionedObject(raw, ctx);
+      if (isFailure(versionParseResult)) {
+        return versionParseResult;
+      }
+      if (versionParseResult.value.version.major !== majorVersion) {
+        return this.parseOtherVersions(raw, ctx);
+      }
+      return parseThisVersionAndMigrateToLatest(raw, ctx);
+    };
+  }
+
+  /**
+   * Add a migration from an old version of the widget options.
+   */
+  withMigrationFrom(majorVersion, parseOldVersion, migrateToNextVersion) {
+    const parseOtherVersions = this.parser;
+    const migrateToLatest = old => this.migrateToLatest(migrateToNextVersion(old));
+    return new VersionedWidgetOptionsParserBuilder(majorVersion, parseOldVersion, migrateToLatest, parseOtherVersions);
+  }
+}
+const parseVersionedObject = object({
+  version: defaulted(object({
+    major: number,
+    minor: number
+  }), () => ({
+    major: 0,
+    minor: 0
+  }))
+});
+
+const stringOrNumberOrNullOrUndefined = union(string).or(number).or(constant(null)).or(constant(undefined)).parser;
+const parsePossiblyInvalidAnswerForm = object({
+  // `value` is the possibly invalid part of this. It should always be a
+  // string, but some answer forms don't have it. The Expression widget
+  // ignores invalid values, so we can safely filter them out during parsing.
+  value: optional(string),
+  form: defaulted(boolean, () => false),
+  simplify: defaulted(boolean, () => false),
   considered: enumeration("correct", "wrong", "ungraded"),
-  key: pipeParsers(optional(union(string).or(number).parser)).then((key, ctx) => ctx.success(String(key))).parser
+  key: pipeParsers(stringOrNumberOrNullOrUndefined).then(convert(String)).parser
 });
-const parseExpressionWidgetV1 = parseWidgetWithVersion(object({
+function removeInvalidAnswerForms(possiblyInvalid) {
+  const valid = [];
+  for (const answerForm of possiblyInvalid) {
+    const {
+      value
+    } = answerForm;
+    if (value != null) {
+      // Copying the object seems to be needed to make TypeScript happy
+      valid.push(_extends({}, answerForm, {
+        value
+      }));
+    }
+  }
+  return valid;
+}
+
+// NOTE(benchristel): I copied the default buttonSets from
+// expression.tsx. See the parse-perseus-json/README.md for
+// an explanation of why we want to duplicate the default here.
+const parseButtonSets = defaulted(array(enumeration("basic", "basic+div", "trig", "prealgebra", "logarithms", "basic relations", "advanced relations")), () => ["basic", "trig", "prealgebra", "logarithms"]);
+const version1 = object({
   major: constant(1),
   minor: number
-}), constant("expression"), object({
-  answerForms: array(parseAnswerForm),
+});
+const parseExpressionWidgetV1 = parseWidgetWithVersion(version1, constant("expression"), object({
+  answerForms: pipeParsers(array(parsePossiblyInvalidAnswerForm)).then(convert(removeInvalidAnswerForms)).parser,
   functions: array(string),
   times: boolean,
   visibleLabel: optional(string),
   ariaLabel: optional(string),
-  buttonSets: array(enumeration("basic", "basic+div", "trig", "prealgebra", "logarithms", "basic relations", "advanced relations")),
+  buttonSets: parseButtonSets,
   buttonsVisible: optional(enumeration("always", "never", "focused"))
 }));
-const parseExpressionWidgetV0 = parseWidgetWithVersion(optional(object({
+const version0 = optional(object({
   major: constant(0),
   minor: number
-})), constant("expression"), object({
+}));
+const parseExpressionWidgetV0 = parseWidgetWithVersion(version0, constant("expression"), object({
   functions: array(string),
   times: boolean,
   visibleLabel: optional(string),
@@ -47976,14 +48035,14 @@ const parseExpressionWidgetV0 = parseWidgetWithVersion(optional(object({
   form: boolean,
   simplify: boolean,
   value: string,
-  buttonSets: array(enumeration("basic", "basic+div", "trig", "prealgebra", "logarithms", "basic relations", "advanced relations")),
+  buttonSets: parseButtonSets,
   buttonsVisible: optional(enumeration("always", "never", "focused"))
 }));
-function migrateV0ToV1(widget, ctx) {
+function migrateV0ToV1(widget) {
   const {
     options
   } = widget;
-  return ctx.success(_extends({}, widget, {
+  return _extends({}, widget, {
     version: {
       major: 1,
       minor: 0
@@ -48002,9 +48061,9 @@ function migrateV0ToV1(widget, ctx) {
         value: options.value
       }]
     }
-  }));
+  });
 }
-const parseExpressionWidget = union(parseExpressionWidgetV1).or(pipeParsers(parseExpressionWidgetV0).then(migrateV0ToV1).parser).parser;
+const parseExpressionWidget = versionedWidgetOptions(1, parseExpressionWidgetV1).withMigrationFrom(0, parseExpressionWidgetV0, migrateV0ToV1).parser;
 
 const parsePerseusRenderer = defaulted(object({
   // TODO(benchristel): content is also defaulted to empty string in
@@ -48025,13 +48084,14 @@ const parsePerseusRenderer = defaulted(object({
   images: {}
 }));
 
+const falseToNull = pipeParsers(constant(false)).then(convert(() => null)).parser;
 const parseGradedGroupWidgetOptions = object({
   title: defaulted(string, () => ""),
   hasHint: optional(nullable(boolean)),
   // This module has an import cycle with parsePerseusRenderer.
   // The anonymous function below ensures that we don't try to access
   // parsePerseusRenderer before it's defined.
-  hint: optional(nullable((rawVal, ctx) => parsePerseusRenderer(rawVal, ctx))),
+  hint: union(falseToNull).or(constant(null)).or(constant(undefined)).or((rawVal, ctx) => parsePerseusRenderer(rawVal, ctx)).parser,
   content: string,
   // This module has an import cycle with parseWidgetsMap.
   // The anonymous function below ensures that we don't try to access
@@ -48050,31 +48110,69 @@ const parseGradedGroupSetWidget = parseWidget(constant("graded-group-set"), obje
   gradedGroups: array(parseGradedGroupWidgetOptions)
 }));
 
+/**
+ * discriminatedUnion() should be preferred over union() when parsing a
+ * discriminated union type, because discriminatedUnion() produces more
+ * understandable failure messages. It takes the discriminant as the source of
+ * truth for which variant is to be parsed, and expects the other data to match
+ * that variant.
+ */
+function discriminatedUnionOn(discriminantKey) {
+  const noMoreBranches = (raw, ctx) => {
+    if (!isObject(raw)) {
+      return ctx.failure("object", raw);
+    }
+    return ctx.forSubtree(discriminantKey).failure("a valid value", raw[discriminantKey]);
+  };
+  return new DiscriminatedUnionBuilder(discriminantKey, noMoreBranches);
+}
+class DiscriminatedUnionBuilder {
+  constructor(discriminantKey, parser) {
+    this.discriminantKey = discriminantKey;
+    this.parser = parser;
+  }
+  withBranch(discriminantValue, parseNewVariant) {
+    const parseNewBranch = discriminatedUnionBranch(this.discriminantKey, discriminantValue, parseNewVariant, this.parser);
+    return new DiscriminatedUnionBuilder(this.discriminantKey, parseNewBranch);
+  }
+}
+function discriminatedUnionBranch(discriminantKey, discriminantValue, parseVariant, parseOtherBranches) {
+  return (raw, ctx) => {
+    if (!isObject(raw)) {
+      return ctx.failure("object", raw);
+    }
+    if (raw[discriminantKey] === discriminantValue) {
+      return parseVariant(raw, ctx);
+    }
+    return parseOtherBranches(raw, ctx);
+  };
+}
+
 const pairOfNumbers$3 = pair(number, number);
 const pairOfPoints = pair(pairOfNumbers$3, pairOfNumbers$3);
 const parseGrapherWidget = parseWidget(constant("grapher"), object({
   availableTypes: array(enumeration("absolute_value", "exponential", "linear", "logarithm", "quadratic", "sinusoid", "tangent")),
-  correct: union(object({
+  correct: discriminatedUnionOn("type").withBranch("absolute_value", object({
     type: constant("absolute_value"),
     coords: pairOfPoints
-  })).or(object({
+  })).withBranch("exponential", object({
     type: constant("exponential"),
     asymptote: pairOfPoints,
     coords: pairOfPoints
-  })).or(object({
+  })).withBranch("linear", object({
     type: constant("linear"),
-    coords: pairOfPoints
-  })).or(object({
+    coords: defaulted(pairOfPoints, () => [[-5, 5], [5, 5]])
+  })).withBranch("logarithm", object({
     type: constant("logarithm"),
     asymptote: pairOfPoints,
     coords: pairOfPoints
-  })).or(object({
+  })).withBranch("quadratic", object({
     type: constant("quadratic"),
     coords: pairOfPoints
-  })).or(object({
+  })).withBranch("sinusoid", object({
     type: constant("sinusoid"),
     coords: pairOfPoints
-  })).or(object({
+  })).withBranch("tangent", object({
     type: constant("tangent"),
     coords: pairOfPoints
   })).parser,
@@ -48134,15 +48232,22 @@ const stringToNumber = (rawValue, ctx) => {
   return ctx.success(parsedNumber);
 };
 
-const numericToNumber = pipeParsers(union(number).or(string).parser).then(stringToNumber).parser;
+function emptyToZero(x) {
+  return x === "" ? 0 : x;
+}
+const imageDimensionToNumber = pipeParsers(union(number).or(string).parser)
+// In this specific case, empty string is equivalent to zero. An empty
+// string parses to either NaN (using parseInt) or 0 (using unary +) and
+// CSS will treat NaN as invalid and default to 0 instead.
+.then(convert(emptyToZero)).then(stringToNumber).parser;
 const parsePerseusImageBackground = object({
   url: optional(nullable(string)),
-  width: optional(numericToNumber),
-  height: optional(numericToNumber),
-  top: optional(numericToNumber),
-  left: optional(numericToNumber),
-  bottom: optional(numericToNumber),
-  scale: optional(numericToNumber)
+  width: optional(imageDimensionToNumber),
+  height: optional(imageDimensionToNumber),
+  top: optional(imageDimensionToNumber),
+  left: optional(imageDimensionToNumber),
+  bottom: optional(imageDimensionToNumber),
+  scale: optional(imageDimensionToNumber)
 });
 
 const pairOfNumbers$2 = pair(number, number);
@@ -48183,8 +48288,10 @@ const parseInputNumberWidget = parseWidget(constant("input-number"), object({
 }));
 
 const pairOfNumbers$1 = pair(number, number);
+const stringOrEmpty = defaulted(string, () => "");
+const parseFunctionType = constant("function");
 const parseFunctionElement = object({
-  type: constant("function"),
+  type: parseFunctionType,
   key: string,
   options: object({
     value: string,
@@ -48196,8 +48303,9 @@ const parseFunctionElement = object({
     strokeWidth: number
   })
 });
+const parseLabelType = constant("label");
 const parseLabelElement = object({
-  type: constant("label"),
+  type: parseLabelType,
   key: string,
   options: object({
     label: string,
@@ -48206,8 +48314,9 @@ const parseLabelElement = object({
     coordY: string
   })
 });
+const parseLineType = constant("line");
 const parseLineElement = object({
-  type: constant("line"),
+  type: parseLineType,
   key: string,
   options: object({
     color: string,
@@ -48220,8 +48329,9 @@ const parseLineElement = object({
     arrows: string
   })
 });
+const parseMovableLineType = constant("movable-line");
 const parseMovableLineElement = object({
-  type: constant("movable-line"),
+  type: parseMovableLineType,
   key: string,
   options: object({
     startX: string,
@@ -48239,8 +48349,9 @@ const parseMovableLineElement = object({
     constraintYMax: string
   })
 });
+const parseMovablePointType = constant("movable-point");
 const parseMovablePointElement = object({
-  type: constant("movable-point"),
+  type: parseMovablePointType,
   key: string,
   options: object({
     startX: string,
@@ -48249,14 +48360,15 @@ const parseMovablePointElement = object({
     constraint: string,
     snap: number,
     constraintFn: string,
-    constraintXMin: string,
-    constraintXMax: string,
-    constraintYMin: string,
-    constraintYMax: string
+    constraintXMin: stringOrEmpty,
+    constraintXMax: stringOrEmpty,
+    constraintYMin: stringOrEmpty,
+    constraintYMax: stringOrEmpty
   })
 });
+const parseParametricType = constant("parametric");
 const parseParametricElement = object({
-  type: constant("parametric"),
+  type: parseParametricType,
   key: string,
   options: object({
     x: string,
@@ -48268,8 +48380,9 @@ const parseParametricElement = object({
     strokeWidth: number
   })
 });
+const parsePointType = constant("point");
 const parsePointElement = object({
-  type: constant("point"),
+  type: parsePointType,
   key: string,
   options: object({
     color: string,
@@ -48277,8 +48390,9 @@ const parsePointElement = object({
     coordY: string
   })
 });
+const parseRectangleType = constant("rectangle");
 const parseRectangleElement = object({
-  type: constant("rectangle"),
+  type: parseRectangleType,
   key: string,
   options: object({
     color: string,
@@ -48289,7 +48403,7 @@ const parseRectangleElement = object({
   })
 });
 const parseInteractionWidget = parseWidget(constant("interaction"), object({
-  static: boolean,
+  static: defaulted(boolean, () => false),
   graph: object({
     editableSettings: optional(array(enumeration("canvas", "graph"))),
     box: pairOfNumbers$1,
@@ -48306,7 +48420,7 @@ const parseInteractionWidget = parseWidget(constant("interaction"), object({
     rulerTicks: optional(number),
     tickStep: pairOfNumbers$1
   }),
-  elements: array(union(parseFunctionElement).or(parseLabelElement).or(parseLineElement).or(parseMovableLineElement).or(parseMovablePointElement).or(parseParametricElement).or(parsePointElement).or(parseRectangleElement).parser)
+  elements: array(discriminatedUnionOn("type").withBranch("function", parseFunctionElement).withBranch("label", parseLabelElement).withBranch("line", parseLineElement).withBranch("movable-line", parseMovableLineElement).withBranch("movable-point", parseMovablePointElement).withBranch("parametric", parseParametricElement).withBranch("point", parsePointElement).withBranch("rectangle", parseRectangleElement).parser)
 }));
 
 // Used to represent 2-D points and ranges
@@ -48364,7 +48478,7 @@ const parsePerseusGraphTypePolygon = object({
   showAngles: optional(boolean),
   showSides: optional(boolean),
   snapTo: optional(enumeration("grid", "angles", "sides")),
-  match: optional(enumeration("similar", "congruent", "approx")),
+  match: optional(enumeration("similar", "congruent", "approx", "exact")),
   startCoords: optional(array(pairOfNumbers)),
   // TODO: remove coord? it's legacy.
   coord: optional(pairOfNumbers)
@@ -48399,7 +48513,7 @@ const parsePerseusGraphTypeSinusoid = object({
   // TODO: remove coord? it's legacy.
   coord: optional(pairOfNumbers)
 });
-const parsePerseusGraphType = union(parsePerseusGraphTypeAngle).or(parsePerseusGraphTypeAngle).or(parsePerseusGraphTypeCircle).or(parsePerseusGraphTypeLinear).or(parsePerseusGraphTypeLinearSystem).or(parsePerseusGraphTypeNone).or(parsePerseusGraphTypePoint).or(parsePerseusGraphTypePolygon).or(parsePerseusGraphTypeQuadratic).or(parsePerseusGraphTypeRay).or(parsePerseusGraphTypeSegment).or(parsePerseusGraphTypeSinusoid).parser;
+const parsePerseusGraphType = discriminatedUnionOn("type").withBranch("angle", parsePerseusGraphTypeAngle).withBranch("circle", parsePerseusGraphTypeCircle).withBranch("linear", parsePerseusGraphTypeLinear).withBranch("linear-system", parsePerseusGraphTypeLinearSystem).withBranch("none", parsePerseusGraphTypeNone).withBranch("point", parsePerseusGraphTypePoint).withBranch("polygon", parsePerseusGraphTypePolygon).withBranch("quadratic", parsePerseusGraphTypeQuadratic).withBranch("ray", parsePerseusGraphTypeRay).withBranch("segment", parsePerseusGraphTypeSegment).withBranch("sinusoid", parsePerseusGraphTypeSinusoid).parser;
 const parseLockedFigureColor = enumeration(...lockedFigureColorNames);
 const parseLockedFigureFillType = enumeration("none", "white", "translucent", "solid");
 const parseLockedLineStyle = enumeration("solid", "dashed");
@@ -48518,7 +48632,7 @@ const parseLabelImageWidget = parseWidget(constant("label-image"), object({
   })),
   hideChoicesFromInstructions: boolean,
   multipleAnswers: boolean,
-  static: boolean
+  static: defaulted(boolean, () => false)
 }));
 
 const parseMatcherWidget = parseWidget(constant("matcher"), object({
@@ -48529,10 +48643,12 @@ const parseMatcherWidget = parseWidget(constant("matcher"), object({
   padding: boolean
 }));
 
+const numberOrString = union(number).or(string).parser;
+const numeric = pipeParsers(defaulted(numberOrString, () => NaN)).then(stringToNumber).parser;
 const parseMatrixWidget = parseWidget(defaulted(constant("matrix"), () => "matrix"), object({
   prefix: optional(string),
   suffix: optional(string),
-  answers: array(array(number)),
+  answers: array(array(numeric)),
   cursorPosition: optional(array(number)),
   matrixBoardSize: array(number),
   static: optional(boolean)
@@ -48547,7 +48663,8 @@ const parseMeasurerWidget = parseWidget(constant("measurer"), object({
   rulerPixels: number,
   rulerLength: number,
   box: pair(number, number),
-  static: boolean
+  // TODO(benchristel): static is not used. Remove it?
+  static: defaulted(boolean, () => false)
 }));
 
 const parseMoleculeRendererWidget = parseWidget(constant("molecule-renderer"), object({
@@ -48556,9 +48673,10 @@ const parseMoleculeRendererWidget = parseWidget(constant("molecule-renderer"), o
   smiles: optional(string)
 }));
 
+const emptyStringToNull = pipeParsers(constant("")).then(convert(() => null)).parser;
 const parseNumberLineWidget = parseWidget(constant("number-line"), object({
   range: array(number),
-  labelRange: array(nullable(number)),
+  labelRange: array(nullable(union(number).or(emptyStringToNull).parser)),
   labelStyle: string,
   labelTicks: boolean,
   isTickCtrl: optional(nullable(boolean)),
@@ -48570,26 +48688,32 @@ const parseNumberLineWidget = parseWidget(constant("number-line"), object({
   snapDivisions: defaulted(number, () => 2),
   tickStep: optional(nullable(number)),
   correctRel: optional(nullable(string)),
-  correctX: number,
+  correctX: nullable(number),
   initialX: optional(nullable(number)),
   showTooltip: optional(boolean),
-  static: boolean
+  static: defaulted(boolean, () => false)
 }));
 
 const parseMathFormat = enumeration("integer", "mixed", "improper", "proper", "decimal", "percent", "pi");
 const parseNumericInputWidget = parseWidget(constant("numeric-input"), object({
   answers: array(object({
     message: string,
-    value: optional(number),
+    // TODO(benchristel): value should never be null or undefined,
+    // but we have some content where it is anyway. If we backfill
+    // the data, simplify this.
+    value: optional(nullable(number)),
     status: string,
     answerForms: optional(array(parseMathFormat)),
     strict: boolean,
     maxError: optional(nullable(number)),
-    simplify: optional(nullable(string))
+    // TODO(benchristel): simplify should never be a boolean, but we
+    // have some content where it is anyway. If we ever backfill
+    // the data, we should simplify `simplify`.
+    simplify: optional(nullable(union(string).or(pipeParsers(boolean).then(convert(String)).parser).parser))
   })),
   labelText: optional(string),
   size: string,
-  coefficient: boolean,
+  coefficient: defaulted(boolean, () => false),
   rightAlign: optional(boolean),
   static: defaulted(boolean, () => false),
   answerForms: optional(array(object({
@@ -48621,13 +48745,13 @@ const parseOrdererWidget = parseWidget(constant("orderer"), object({
 const parsePassageRefWidget = parseWidget(constant("passage-ref"), object({
   passageNumber: number,
   referenceNumber: number,
-  summaryText: string
+  summaryText: optional(string)
 }));
 
 const parsePassageWidget = parseWidget(constant("passage"), object({
-  footnotes: string,
+  footnotes: defaulted(string, () => ""),
   passageText: string,
-  passageTitle: string,
+  passageTitle: defaulted(string, () => ""),
   showLineNumbers: boolean,
   static: defaulted(boolean, () => false)
 }));
@@ -48809,6 +48933,12 @@ const parseWidgetsMapEntry = ([key, widget], widgetMap, ctx) => {
       // sequence is a deprecated widget type, and the corresponding
       // widget component no longer exists.
       return parseAndAssign(`sequence ${id}`, parseDeprecatedWidget);
+    case "lights-puzzle":
+      return parseAndAssign(`lights-puzzle ${id}`, parseDeprecatedWidget);
+    case "simulator":
+      return parseAndAssign(`simulator ${id}`, parseDeprecatedWidget);
+    case "transformer":
+      return parseAndAssign(`transformer ${id}`, parseDeprecatedWidget);
     default:
       if (getWidget(type)) {
         // @ts-expect-error - 'type' is not a valid widget type