@khanacademy/perseus 33.3.0 → 34.1.0

package/dist/es/index.js

@@ -1,8 +1,7 @@
 import * as KAS from '@khanacademy/kas';
 import { MathInputI18nContext, CursorContext, getKeyTranslator, createMathField, getCursorContext, DesktopKeypad, convertDotToTimesByLocale, mathQuillInstance, KeypadInput, KeypadType, KeyArray, keypadElementPropType } from '@khanacademy/math-input';
-import { PerseusError, Errors, addLibraryVersionToPerseusDebug } from '@khanacademy/perseus-core';
 import * as PerseusLinter from '@khanacademy/perseus-linter';
-import { linterContextDefault, Rule, linterContextProps } from '@khanacademy/perseus-linter';
+import { linterContextDefault, Rule } from '@khanacademy/perseus-linter';
 import { View, RenderStateRoot, UniqueIDProvider, useLatestRef, useUniqueIdWithMock, Text as Text$2 } from '@khanacademy/wonder-blocks-core';
 import Tooltip$1 from '@khanacademy/wonder-blocks-tooltip';
 import { HeadingMedium, LabelSmall, Body, LabelMedium } from '@khanacademy/wonder-blocks-typography';
@@ -18,6 +17,7 @@ import { Popover, PopoverContentCore, PopoverContent } from '@khanacademy/wonder
 import { color, spacing, font } from '@khanacademy/wonder-blocks-tokens';
 import $ from 'jquery';
 import { v4 } from 'uuid';
+import { PerseusError, Errors, addLibraryVersionToPerseusDebug } from '@khanacademy/perseus-core';
 import PropTypes from 'prop-types';
 import { number, point, vector as vector$1, line } from '@khanacademy/kmath';
 import { entries, UnreachableCaseError, keys } from '@khanacademy/wonder-stuff-core';
@@ -732,23 +732,6 @@ var dependencies = /*#__PURE__*/Object.freeze({
   useDependencies: useDependencies
 });
 
-// TODO(LP-11481): Change the primary API we use for logging in Perseus to use
-// getDependencies() internally... simplify usage to just using a "singleton"
-// which get's the injected logger.
-/**
- * Provides logging infrastructure for Perseus
- */
-const Log = {
-  // Logs a message
-  log: (message, extra) => {
-    getDependencies().Log.log(message, extra);
-  },
-  // Logs an error with a message
-  error: (message, kind, extra) => {
-    getDependencies().Log.error(message, kind, extra);
-  }
-};
-
 /**
  * These are things that widgets should exclude when serializing themselves.
  *
@@ -1192,6 +1175,23 @@ const ClassNames = {
   MOBILE: "perseus-mobile"
 };
 
+// TODO(LP-11481): Change the primary API we use for logging in Perseus to use
+// getDependencies() internally... simplify usage to just using a "singleton"
+// which get's the injected logger.
+/**
+ * Provides logging infrastructure for Perseus
+ */
+const Log = {
+  // Logs a message
+  log: (message, extra) => {
+    getDependencies().Log.log(message, extra);
+  },
+  // Logs an error with a message
+  error: (message, kind, extra) => {
+    getDependencies().Log.error(message, kind, extra);
+  }
+};
+
 const KhanMath = {
   // Simplify formulas before display
   cleanMath: function (expr) {
@@ -2106,6 +2106,176 @@ const KhanAnswerTypes = {
   }
 };
 
+/**
+ *  Get the character used for separating decimals.
+ */
+const getDecimalSeparator = locale => {
+  var _match$;
+  switch (locale) {
+    // TODO(somewhatabstract): Remove this when Chrome supports the `ka`
+    // locale properly.
+    // https://github.com/formatjs/formatjs/issues/1526#issuecomment-559891201
+    //
+    // Supported locales in Chrome:
+    // https://source.chromium.org/chromium/chromium/src/+/master:third_party/icu/scripts/chrome_ui_languages.list
+    case "ka":
+      return ",";
+    default:
+      const numberWithDecimalSeparator = 1.1;
+      // TODO(FEI-3647): Update to use .formatToParts() once we no longer have to
+      // support Safari 12.
+      const match = new Intl.NumberFormat(locale).format(numberWithDecimalSeparator)
+      // 0x661 is ARABIC-INDIC DIGIT ONE
+      // 0x6F1 is EXTENDED ARABIC-INDIC DIGIT ONE
+      .match(/[^\d\u0661\u06F1]/);
+      return (_match$ = match == null ? void 0 : match[0]) != null ? _match$ : ".";
+  }
+};
+
+/* Content creators input a list of answers which are matched from top to
+ * bottom. The intent is that they can include spcific solutions which should
+ * be graded as correct or incorrect (or ungraded!) first, then get more
+ * general.
+ *
+ * We iterate through each answer, trying to match it with the user's input
+ * using the following angorithm:
+ * - Try to parse the user's input. If it doesn't parse then return "not
+ *   graded".
+ * - For each answer:
+ *   ~ Try to validate the user's input against the answer. The answer is
+ *     expected to parse.
+ *   ~ If the user's input validates (the validator judges it "correct"), we've
+ *     matched and can stop considering answers.
+ * - If there were no matches or the matching answer is considered "ungraded",
+ *   show the user an error. TODO(joel) - what error?
+ * - Otherwise, pass through the resulting points and message.
+ */
+function expressionValidator(userInput, rubric,
+// @ts-expect-error - TS2322 - Type '() => void' is not assignable to type 'OnInputErrorFunctionType'.
+onInputError = function () {}, strings, locale) {
+  const options = _.clone(rubric);
+  _.extend(options, {
+    decimal_separator: getDecimalSeparator(locale)
+  });
+  const createValidator = answer => {
+    // We give options to KAS.parse here because it is parsing the
+    // solution answer, not the student answer, and we don't want a
+    // solution to work if the student is using a different language
+    // (different from the content creation language, ie. English).
+    const expression = KAS.parse(answer.value, rubric);
+    // An answer may not be parsed if the expression was defined
+    // incorrectly. For example if the answer is using a symbol defined
+    // in the function variables list for the expression.
+    if (!expression.parsed) {
+      /* c8 ignore next */
+      Log.error("Unable to parse solution answer for expression", Errors.InvalidInput, {
+        loggedMetadata: {
+          rubric: JSON.stringify(rubric)
+        }
+      });
+      return null;
+    }
+    return KhanAnswerTypes.expression.createValidatorFunctional(expression.expr, _({}).extend(options, {
+      simplify: answer.simplify,
+      form: answer.form
+    }), strings);
+  };
+
+  // Find the first answer form that matches the user's input and that
+  // is considered correct. Also, track whether the input is
+  // considered "empty" for all answer forms, and keep the validation
+  // result for the first answer form for which the user's input was
+  // considered "ungraded".
+  // (Terminology reminder: the answer forms are provided by the
+  // assessment items; they are not the user's input. Each one might
+  // represent a correct answer, an incorrect one (if the exercise
+  // creator has predicted certain common wrong answers and wants to
+  // provide guidance via a message), or an ungraded one (same idea,
+  // but without giving the user an incorrect mark for the question).
+  let matchingAnswerForm;
+  let matchMessage;
+  let allEmpty = true;
+  let firstUngradedResult;
+  for (const answerForm of rubric.answerForms || []) {
+    const validator = createValidator(answerForm);
+    if (!validator) {
+      continue;
+    }
+    const result = validator(userInput);
+
+    // Short-circuit as soon as the user's input matches some answer
+    // (independently of whether the answer is correct)
+    if (result.correct) {
+      matchingAnswerForm = answerForm;
+      matchMessage = result.message || "";
+      break;
+    }
+    allEmpty = allEmpty && result.empty;
+    // If this answer form is correct and the user's input is considered
+    // "ungraded" for it, we'll want to keep the evaluation result for
+    // later. If the user's input doesn't match any answer forms, we'll
+    // show the message from this validation.
+    if (answerForm.considered === "correct" && result.ungraded && !firstUngradedResult) {
+      firstUngradedResult = result;
+    }
+  }
+
+  // Now check to see if we matched any answer form at all, and if
+  // we did, whether it's considered correct, incorrect, or ungraded
+  if (!matchingAnswerForm) {
+    if (firstUngradedResult) {
+      // While we didn't directly match with any answer form, we
+      // did at some point get an "ungraded" validation result,
+      // which might indicate e.g. a mismatch in variable casing.
+      // We'll return "invalid", which will let the user try again
+      // with no penalty, and the hopefully helpful validation
+      // message.
+      return {
+        type: "invalid",
+        message: firstUngradedResult.message,
+        suppressAlmostThere: firstUngradedResult.suppressAlmostThere
+      };
+    }
+    if (allEmpty) {
+      // If everything graded as empty, it's invalid.
+      return {
+        type: "invalid",
+        message: null
+      };
+    }
+    // We fell through all the possibilities and we're not empty,
+    // so the answer is considered incorrect.
+    return {
+      type: "points",
+      earned: 0,
+      total: 1
+    };
+  }
+  if (matchingAnswerForm.considered === "ungraded") {
+    // We matched an ungraded answer form - return "invalid", which
+    // will let the user try again with no penalty
+    const apiResult = onInputError(null,
+    // Reserved for some widget identifier
+    userInput, matchMessage);
+    return {
+      type: "invalid",
+      message: apiResult === false ? null : matchMessage
+    };
+  }
+  // We matched a graded answer form, so we can now tell the user
+  // whether their input was correct or incorrect, and hand out
+  // points accordingly
+  // TODO(eater): Seems silly to translate result to this
+  // invalid/points thing and immediately translate it back in
+  // ItemRenderer.scoreInput()
+  return {
+    type: "points",
+    earned: matchingAnswerForm.considered === "correct" ? 1 : 0,
+    total: 1,
+    message: matchMessage
+  };
+}
+
 const _excluded$5 = ["scoring"];
 // Map of international operator names to their English equivalents
 const englishOperators = {
@@ -2136,32 +2306,6 @@ const deriveKeypadVersion = apiOptions => {
   // can remove this `virtualKeypadVersion` field entirely.
   return apiOptions.nativeKeypadProxy != null ? "REACT_NATIVE_KEYPAD" : "MATH_INPUT_KEYPAD_V2";
 };
-/**
- *  Get the character used for separating decimals.
- */
-const getDecimalSeparator = locale => {
-  var _match$;
-  switch (locale) {
-    // TODO(somewhatabstract): Remove this when Chrome supports the `ka`
-    // locale properly.
-    // https://github.com/formatjs/formatjs/issues/1526#issuecomment-559891201
-    //
-    // Supported locales in Chrome:
-    // https://source.chromium.org/chromium/chromium/src/+/master:third_party/icu/scripts/chrome_ui_languages.list
-    case "ka":
-      return ",";
-    default:
-      const numberWithDecimalSeparator = 1.1;
-      // TODO(FEI-3647): Update to use .formatToParts() once we no longer have to
-      // support Safari 12.
-      const match = new Intl.NumberFormat(locale).format(numberWithDecimalSeparator)
-      // 0x661 is ARABIC-INDIC DIGIT ONE
-      // 0x6F1 is EXTENDED ARABIC-INDIC DIGIT ONE
-      .match(/[^\d\u0661\u06F1]/);
-      return (_match$ = match == null ? void 0 : match[0]) != null ? _match$ : ".";
-  }
-};
-
 // The new, MathQuill input expression widget
 class Expression extends React.Component {
   constructor(..._args) {
@@ -2230,7 +2374,7 @@ class Expression extends React.Component {
           scoring
         } = _ref,
         rubric = _objectWithoutPropertiesLoose(_ref, _excluded$5);
-      const score = Expression.validate(this.getUserInput(), rubric, onInputError || function () {}, this.context.strings, this.context.locale);
+      const score = expressionValidator(this.getUserInput(), rubric, onInputError || function () {}, this.context.strings, this.context.locale);
 
       // "scoring" is a flag that indicates when we are checking answers.
       // otherwise, we may just be checking validity after changes.
@@ -2320,149 +2464,11 @@ class Expression extends React.Component {
       }, cb);
     };
   }
-  //#region Previously a class extension
-  /* Content creators input a list of answers which are matched from top to
-   * bottom. The intent is that they can include spcific solutions which should
-   * be graded as correct or incorrect (or ungraded!) first, then get more
-   * general.
-   *
-   * We iterate through each answer, trying to match it with the user's input
-   * using the following angorithm:
-   * - Try to parse the user's input. If it doesn't parse then return "not
-   *   graded".
-   * - For each answer:
-   *   ~ Try to validate the user's input against the answer. The answer is
-   *     expected to parse.
-   *   ~ If the user's input validates (the validator judges it "correct"), we've
-   *     matched and can stop considering answers.
-   * - If there were no matches or the matching answer is considered "ungraded",
-   *   show the user an error. TODO(joel) - what error?
-   * - Otherwise, pass through the resulting points and message.
-   */
+  // TODO remove this in favor of just using expressionValidator
   static validate(userInput, rubric,
   // @ts-expect-error - TS2322 - Type '() => void' is not assignable to type 'OnInputErrorFunctionType'.
   onInputError = function () {}, strings, locale) {
-    const options = _.clone(rubric);
-    _.extend(options, {
-      decimal_separator: getDecimalSeparator(locale)
-    });
-    const createValidator = answer => {
-      // We give options to KAS.parse here because it is parsing the
-      // solution answer, not the student answer, and we don't want a
-      // solution to work if the student is using a different language
-      // (different from the content creation language, ie. English).
-      const expression = KAS.parse(answer.value, rubric);
-      // An answer may not be parsed if the expression was defined
-      // incorrectly. For example if the answer is using a symbol defined
-      // in the function variables list for the expression.
-      if (!expression.parsed) {
-        /* c8 ignore next */
-        Log.error("Unable to parse solution answer for expression", Errors.InvalidInput, {
-          loggedMetadata: {
-            rubric: JSON.stringify(rubric)
-          }
-        });
-        return null;
-      }
-      return KhanAnswerTypes.expression.createValidatorFunctional(expression.expr, _({}).extend(options, {
-        simplify: answer.simplify,
-        form: answer.form
-      }), strings);
-    };
-
-    // Find the first answer form that matches the user's input and that
-    // is considered correct. Also, track whether the input is
-    // considered "empty" for all answer forms, and keep the validation
-    // result for the first answer form for which the user's input was
-    // considered "ungraded".
-    // (Terminology reminder: the answer forms are provided by the
-    // assessment items; they are not the user's input. Each one might
-    // represent a correct answer, an incorrect one (if the exercise
-    // creator has predicted certain common wrong answers and wants to
-    // provide guidance via a message), or an ungraded one (same idea,
-    // but without giving the user an incorrect mark for the question).
-    let matchingAnswerForm;
-    let matchMessage;
-    let allEmpty = true;
-    let firstUngradedResult;
-    for (const answerForm of rubric.answerForms || []) {
-      const validate = createValidator(answerForm);
-      if (!validate) {
-        continue;
-      }
-      const result = validate(userInput);
-
-      // Short-circuit as soon as the user's input matches some answer
-      // (independently of whether the answer is correct)
-      if (result.correct) {
-        matchingAnswerForm = answerForm;
-        matchMessage = result.message || "";
-        break;
-      }
-      allEmpty = allEmpty && result.empty;
-      // If this answer form is correct and the user's input is considered
-      // "ungraded" for it, we'll want to keep the evaluation result for
-      // later. If the user's input doesn't match any answer forms, we'll
-      // show the message from this validation.
-      if (answerForm.considered === "correct" && result.ungraded && !firstUngradedResult) {
-        firstUngradedResult = result;
-      }
-    }
-
-    // Now check to see if we matched any answer form at all, and if
-    // we did, whether it's considered correct, incorrect, or ungraded
-    if (!matchingAnswerForm) {
-      if (firstUngradedResult) {
-        // While we didn't directly match with any answer form, we
-        // did at some point get an "ungraded" validation result,
-        // which might indicate e.g. a mismatch in variable casing.
-        // We'll return "invalid", which will let the user try again
-        // with no penalty, and the hopefully helpful validation
-        // message.
-        return {
-          type: "invalid",
-          message: firstUngradedResult.message,
-          suppressAlmostThere: firstUngradedResult.suppressAlmostThere
-        };
-      }
-      if (allEmpty) {
-        // If everything graded as empty, it's invalid.
-        return {
-          type: "invalid",
-          message: null
-        };
-      }
-      // We fell through all the possibilities and we're not empty,
-      // so the answer is considered incorrect.
-      return {
-        type: "points",
-        earned: 0,
-        total: 1
-      };
-    }
-    if (matchingAnswerForm.considered === "ungraded") {
-      // We matched an ungraded answer form - return "invalid", which
-      // will let the user try again with no penalty
-      const apiResult = onInputError(null,
-      // Reserved for some widget identifier
-      userInput, matchMessage);
-      return {
-        type: "invalid",
-        message: apiResult === false ? null : matchMessage
-      };
-    }
-    // We matched a graded answer form, so we can now tell the user
-    // whether their input was correct or incorrect, and hand out
-    // points accordingly
-    // TODO(eater): Seems silly to translate result to this
-    // invalid/points thing and immediately translate it back in
-    // ItemRenderer.scoreInput()
-    return {
-      type: "points",
-      earned: matchingAnswerForm.considered === "correct" ? 1 : 0,
-      total: 1,
-      message: matchMessage
-    };
+    return expressionValidator(userInput, rubric, onInputError, strings, locale);
   }
   static getUserInputFromProps(props) {
     return normalizeTex(props.value);
@@ -2670,10 +2676,10 @@ const ExpressionWithDependencies = /*#__PURE__*/React.forwardRef((props, ref) =>
 
 // HACK: Propogate "static" methods onto our wrapper component.
 // In the future we should adjust client apps to not depend on these static
-// methods and instead adjust Peresus to provide these facilities through
+// methods and instead adjust Perseus to provide these facilities through
 // instance methods on our Renderers.
 // @ts-expect-error - TS2339 - Property 'validate' does not exist on type
-ExpressionWithDependencies.validate = Expression.validate;
+ExpressionWithDependencies.validate = expressionValidator;
 // @ts-expect-error - TS2339 - Property 'validate' does not exist on type
 ExpressionWithDependencies.getUserInputFromProps = Expression.getUserInputFromProps;
 // @ts-expect-error - TS2339 - Property 'validate' does not exist on type
@@ -19620,9 +19626,7 @@ const isIdPathPrefix = function isIdPathPrefix(prefixArray, wholeArray) {
 
 // The return type for getUserInput. Widgets have full control of what is
 // returned so it's not easily typed (some widgets return a scalar (string),
-// some return a custom-built object, some delegate to
-// `WidgetJsonifyDeprecated` which returns an object containing widget props
-// (filtered by deprecated keys)).
+// some return a custom-built object
 /**
  * The Widget type represents the common API that the Renderer uses to interact
  * with all widgets. All widgets must implement the methods in this API, unless
@@ -21734,6 +21738,47 @@ const answerTypes = {
     forms: "pi"
   }
 };
+function inputNumberValidator(state, rubric, strings, onInputError = () => {}) {
+  if (rubric.answerType == null) {
+    rubric.answerType = "number";
+  }
+
+  // note(matthewc): this will get immediately parsed again by
+  // `KhanAnswerTypes.number.convertToPredicate`, but a string is
+  // expected here
+  const stringValue = `${rubric.value}`;
+  const val = KhanAnswerTypes.number.createValidatorFunctional(stringValue, {
+    simplify: rubric.simplify,
+    inexact: rubric.inexact || undefined,
+    maxError: rubric.maxError,
+    forms: answerTypes[rubric.answerType].forms
+  }, 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$1(state.currentValue);
+  const result = val(currentValue);
+
+  // TODO(eater): Seems silly to translate result to this invalid/points
+  // thing and immediately translate it back in ItemRenderer.scoreInput()
+  if (result.empty) {
+    // TODO(FEI-3867): remove null-check once we have APIOptionsInternal
+    const apiResult = onInputError == null ? void 0 : onInputError(null,
+    // reserved for some widget identifier
+    state.currentValue, result.message);
+    return {
+      type: "invalid",
+      message: apiResult === false ? null : result.message
+    };
+  }
+  return {
+    type: "points",
+    earned: result.correct ? 1 : 0,
+    total: 1,
+    message: result.message
+  };
+}
+
 const formExamples$1 = {
   integer: function (options, strings) {
     return strings.integerExample;
@@ -21824,7 +21869,7 @@ class InputNumber extends React.Component {
     };
     this.simpleValidate = (rubric, onInputError) => {
       onInputError = onInputError || function () {};
-      return InputNumber.validate(this.getUserInput(), rubric, this.context.strings, onInputError);
+      return inputNumberValidator(this.getUserInput(), rubric, this.context.strings, onInputError);
     };
     this.examples = () => {
       const {
@@ -21837,44 +21882,7 @@ class InputNumber extends React.Component {
     };
   }
   static validate(state, rubric, strings, onInputError = () => {}) {
-    if (rubric.answerType == null) {
-      rubric.answerType = "number";
-    }
-
-    // note(matthewc): this will get immediately parsed again by
-    // `KhanAnswerTypes.number.convertToPredicate`, but a string is
-    // expected here
-    const stringValue = `${rubric.value}`;
-    const val = KhanAnswerTypes.number.createValidatorFunctional(stringValue, {
-      simplify: rubric.simplify,
-      inexact: rubric.inexact || undefined,
-      maxError: rubric.maxError,
-      forms: answerTypes[rubric.answerType].forms
-    }, 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$1(state.currentValue);
-    const result = val(currentValue);
-
-    // TODO(eater): Seems silly to translate result to this invalid/points
-    // thing and immediately translate it back in ItemRenderer.scoreInput()
-    if (result.empty) {
-      // TODO(FEI-3867): remove null-check once we have APIOptionsInternal
-      const apiResult = onInputError == null ? void 0 : onInputError(null,
-      // reserved for some widget identifier
-      state.currentValue, result.message);
-      return {
-        type: "invalid",
-        message: apiResult === false ? null : result.message
-      };
-    }
-    return {
-      type: "points",
-      earned: result.correct ? 1 : 0,
-      total: 1,
-      message: result.message
-    };
+    return inputNumberValidator(state, rubric, strings, onInputError);
   }
   static getUserInputFromProps(props) {
     return {
@@ -22024,6 +22032,131 @@ const answerFormButtons = [{
   value: "pi",
   content: "\u03C0"
 }];
+
+// This function checks if the user inputted a percent value, parsing
+// it as a number (and maybe scaling) so that it can be graded.
+// NOTE(michaelpolyak): Unlike `KhanAnswerTypes.number.percent()` which
+// can accept several input forms with or without "%", the decision
+// to parse based on the presence of "%" in the input, is so that we
+// don't accidently scale the user typed value before grading, CP-930.
+function maybeParsePercentInput(inputValue, normalizedAnswerExpected) {
+  // If the input value is not a string ending with "%", then there's
+  // nothing more to do. The value will be graded as inputted by user.
+  if (!(typeof inputValue === "string" && inputValue.endsWith("%"))) {
+    return inputValue;
+  }
+  const value = parseFloat(inputValue.slice(0, -1));
+  // If the input value stripped of the "%" cannot be parsed as a
+  // number (the slice is not really necessary for parseFloat to work
+  // if the string starts with a number) then return the original
+  // input for grading.
+  if (isNaN(value)) {
+    return inputValue;
+  }
+
+  // Next, if all correct answers are in the range of |0,1| then we
+  // scale the user typed value. We assume this is the correct thing
+  // to do since the input value ends with "%".
+  if (normalizedAnswerExpected) {
+    return value / 100;
+  }
+
+  // Otherwise, we return input valuåe (number) stripped of the "%".
+  return value;
+}
+function numericInputValidator(userInput, rubric, strings) {
+  const defaultAnswerForms = answerFormButtons.map(e => e["value"])
+  // Don't default to validating the answer as a pi answer
+  // if answerForm isn't set on the answer
+  // https://khanacademy.atlassian.net/browse/LC-691
+  .filter(e => e !== "pi");
+  const createValidator = answer => {
+    var _answer$answerForms;
+    const stringAnswer = `${answer.value}`;
+
+    // Always validate against the provided answer forms (pi, decimal, etc.)
+    const validatorForms = [...((_answer$answerForms = answer.answerForms) != null ? _answer$answerForms : [])];
+
+    // When an answer is set to strict, we validate using ONLY
+    // the provided answerForms. If strict is false, or if there
+    // were no provided answer forms, we will include all
+    // of the default answer forms in our validator.
+    if (!answer.strict || validatorForms.length === 0) {
+      validatorForms.push(...defaultAnswerForms);
+    }
+    return KhanAnswerTypes.number.createValidatorFunctional(stringAnswer, {
+      message: answer.message,
+      simplify: answer.status === "correct" ? answer.simplify : "optional",
+      inexact: true,
+      // TODO(merlob) backfill / delete
+      maxError: answer.maxError,
+      forms: validatorForms
+    }, 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 correctAnswers = rubric.answers.filter(answer => answer.status === "correct");
+  const normalizedAnswerExpected = correctAnswers.every(answer => Math.abs(answer.value) <= 1);
+
+  // Look through all correct answers for one that matches either
+  // precisely or approximately and return the appropriate message:
+  // - if precise, return the message that the answer came with
+  // - if it needs to be simplified, etc., show that message
+  let result = correctAnswers.map(answer => {
+    // The coefficient is an attribute of the widget
+    let localValue = currentValue;
+    if (rubric.coefficient) {
+      if (!localValue) {
+        localValue = 1;
+      } else if (localValue === "-") {
+        localValue = -1;
+      }
+    }
+    const validate = createValidator(answer);
+    return validate(maybeParsePercentInput(localValue, normalizedAnswerExpected));
+  }).find(match => match.correct || match.empty);
+  if (!result) {
+    // Otherwise, if the guess is not correct
+    const otherAnswers = [].concat(
+    // @ts-expect-error - TS2769 - No overload matches this call.
+    rubric.answers.filter(answer => answer.status === "ungraded"), rubric.answers.filter(answer => answer.status === "wrong"));
+
+    // Look through all other answers and if one matches either
+    // precisely or approximately return the answer's message
+    const match = otherAnswers.find(answer => {
+      const validate = createValidator(answer);
+      return validate(maybeParsePercentInput(currentValue, normalizedAnswerExpected)).correct;
+    });
+    result = {
+      // @ts-expect-error - TS2339 - Property 'status' does not exist on type 'never'.
+      empty: match ? match.status === "ungraded" : false,
+      // @ts-expect-error - TS2339 - Property 'status' does not exist on type 'never'.
+      correct: match ? match.status === "correct" : false,
+      // @ts-expect-error - TS2339 - Property 'message' does not exist on type 'never'.
+      message: match ? match.message : null,
+      guess: currentValue
+    };
+  }
+
+  // TODO(eater): Seems silly to translate result to this
+  // invalid/points thing and immediately translate it
+  // back in ItemRenderer.scoreInput()
+  if (result.empty) {
+    return {
+      type: "invalid",
+      message: result.message
+    };
+  }
+  return {
+    type: "points",
+    earned: result.correct ? 1 : 0,
+    total: 1,
+    message: result.message
+  };
+}
+
 const formExamples = {
   integer: (form, strings) => strings.integerExample,
   proper: (form, strings) => form.simplify === "optional" ? strings.properExample : strings.simplifiedProperExample,
@@ -22070,7 +22203,7 @@ class NumericInput extends React.Component {
       return !noFormsAccepted && !allFormsAccepted;
     };
     this.simpleValidate = rubric => {
-      return NumericInput.validate(this.getUserInput(), rubric, this.context.strings);
+      return numericInputValidator(this.getUserInput(), rubric, this.context.strings);
     };
     this.focus = () => {
       var _this$inputRef;
@@ -22151,98 +22284,7 @@ class NumericInput extends React.Component {
     return answerStrings[0];
   }
   static validate(userInput, rubric, strings) {
-    const defaultAnswerForms = answerFormButtons.map(e => e["value"])
-    // Don't default to validating the answer as a pi answer
-    // if answerForm isn't set on the answer
-    // https://khanacademy.atlassian.net/browse/LC-691
-    .filter(e => e !== "pi");
-    const createValidator = answer => {
-      var _answer$answerForms;
-      const stringAnswer = `${answer.value}`;
-
-      // Always validate against the provided answer forms (pi, decimal, etc.)
-      const validatorForms = [...((_answer$answerForms = answer.answerForms) != null ? _answer$answerForms : [])];
-
-      // When an answer is set to strict, we validate using ONLY
-      // the provided answerForms. If strict is false, or if there
-      // were no provided answer forms, we will include all
-      // of the default answer forms in our validator.
-      if (!answer.strict || validatorForms.length === 0) {
-        validatorForms.push(...defaultAnswerForms);
-      }
-      return KhanAnswerTypes.number.createValidatorFunctional(stringAnswer, {
-        message: answer.message,
-        simplify: answer.status === "correct" ? answer.simplify : "optional",
-        inexact: true,
-        // TODO(merlob) backfill / delete
-        maxError: answer.maxError,
-        forms: validatorForms
-      }, 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 correctAnswers = rubric.answers.filter(answer => answer.status === "correct");
-    const normalizedAnswerExpected = correctAnswers.every(answer => Math.abs(answer.value) <= 1);
-
-    // Look through all correct answers for one that matches either
-    // precisely or approximately and return the appropriate message:
-    // - if precise, return the message that the answer came with
-    // - if it needs to be simplified, etc., show that message
-    let result = correctAnswers.map(answer => {
-      // The coefficient is an attribute of the widget
-      let localValue = currentValue;
-      if (rubric.coefficient) {
-        if (!localValue) {
-          // @ts-expect-error - TS2322 - Type 'number' is not assignable to type 'string'.
-          localValue = 1;
-        } else if (localValue === "-") {
-          // @ts-expect-error - TS2322 - Type 'number' is not assignable to type 'string'.
-          localValue = -1;
-        }
-      }
-      const validate = createValidator(answer);
-      return validate(maybeParsePercentInput(localValue, normalizedAnswerExpected));
-    }).find(match => match.correct || match.empty);
-    if (!result) {
-      // Otherwise, if the guess is not correct
-      const otherAnswers = [].concat(
-      // @ts-expect-error - TS2769 - No overload matches this call.
-      rubric.answers.filter(answer => answer.status === "ungraded"), rubric.answers.filter(answer => answer.status === "wrong"));
-
-      // Look through all other answers and if one matches either
-      // precisely or approximately return the answer's message
-      const match = otherAnswers.find(answer => {
-        const validate = createValidator(answer);
-        return validate(maybeParsePercentInput(currentValue, normalizedAnswerExpected)).correct;
-      });
-      result = {
-        // @ts-expect-error - TS2339 - Property 'status' does not exist on type 'never'.
-        empty: match ? match.status === "ungraded" : false,
-        // @ts-expect-error - TS2339 - Property 'status' does not exist on type 'never'.
-        correct: match ? match.status === "correct" : false,
-        // @ts-expect-error - TS2339 - Property 'message' does not exist on type 'never'.
-        message: match ? match.message : null,
-        guess: currentValue
-      };
-    }
-
-    // TODO(eater): Seems silly to translate result to this
-    // invalid/points thing and immediately translate it
-    // back in ItemRenderer.scoreInput()
-    if (result.empty) {
-      return {
-        type: "invalid",
-        message: result.message
-      };
-    }
-    return {
-      type: "points",
-      earned: result.correct ? 1 : 0,
-      total: 1,
-      message: result.message
-    };
+    return numericInputValidator(userInput, rubric, strings);
   }
   render() {
     let labelText = this.props.labelText;
@@ -22343,37 +22385,6 @@ const unionAnswerForms = function unionAnswerForms(answerFormsList) {
     return formExampleKeys.indexOf(form.name);
   });
 };
-// This function checks if the user inputted a percent value, parsing
-// it as a number (and maybe scaling) so that it can be graded.
-// NOTE(michaelpolyak): Unlike `KhanAnswerTypes.number.percent()` which
-// can accept several input forms with or without "%", the decision
-// to parse based on the presence of "%" in the input, is so that we
-// don't accidently scale the user typed value before grading, CP-930.
-function maybeParsePercentInput(inputValue, normalizedAnswerExpected) {
-  // If the input value is not a string ending with "%", then there's
-  // nothing more to do. The value will be graded as inputted by user.
-  if (!(typeof inputValue === "string" && inputValue.endsWith("%"))) {
-    return inputValue;
-  }
-  const value = parseFloat(inputValue.slice(0, -1));
-  // If the input value stripped of the "%" cannot be parsed as a
-  // number (the slice is not really necessary for parseFloat to work
-  // if the string starts with a number) then return the original
-  // input for grading.
-  if (isNaN(value)) {
-    return inputValue;
-  }
-
-  // Next, if all correct answers are in the range of |0,1| then we
-  // scale the user typed value. We assume this is the correct thing
-  // to do since the input value ends with "%".
-  if (normalizedAnswerExpected) {
-    return value / 100;
-  }
-
-  // Otherwise, we return input valuåe (number) stripped of the "%".
-  return value;
-}
 const propsTransform = function propsTransform(widgetOptions) {
   const rendererProps = _.extend(_.omit(widgetOptions, "answers"), {
     answerForms: unionAnswerForms(
@@ -22401,6 +22412,23 @@ var NumericInput$1 = {
   isLintable: true
 };
 
+/**
+ * Several widgets don't have "right"/"wrong" validation logic,
+ * so this just says to move on past those widgets
+ *
+ * TODO(LEMS-2396) widgets that use this probably shouldn't have any
+ * validation logic and the thing validating an exercise
+ * should just know to skip these
+ */
+function noopValidator(points = 0) {
+  return {
+    type: "points",
+    earned: points,
+    total: points,
+    message: null
+  };
+}
+
 const EN_DASH$1 = "\u2013";
 class PassageRef extends React.Component {
   constructor(..._args) {
@@ -22448,17 +22476,10 @@ class PassageRef extends React.Component {
         }
       }
     };
-    this.simpleValidate = rubric => {
-      return PassageRef.validate(this.getUserInput(), rubric);
-    };
   }
-  static validate(userInput, rubric) {
-    return {
-      type: "points",
-      earned: 0,
-      total: 0,
-      message: null
-    };
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  static validate() {
+    return noopValidator();
   }
   componentDidMount() {
     // TODO(scottgrant): This is a hack to remove the deprecated call to
@@ -22478,6 +22499,10 @@ class PassageRef extends React.Component {
     window.removeEventListener("resize", this._throttledUpdateRange);
     this._isMounted = false;
   }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
+  }
   render() {
     const {
       strings
@@ -22521,6 +22546,7 @@ PassageRef.defaultProps = {
 var PassageRef$1 = {
   name: "passage-ref",
   displayName: "PassageRef (SAT only)",
+  hidden: true,
   defaultAlignment: "inline",
   widget: PassageRef,
   transform: widgetOptions => ({
@@ -24406,22 +24432,30 @@ var Radio = {
 /* eslint-disable import/no-named-as-default */
 var basicWidgets = [Radio, InputNumber$1, NumericInput$1, Expression$1];
 
-/* Free implementation of getUserInput. This should be used sparingly, since it
- * just returns all the widget's props rather than picking out those which were
- * input by the user.
- */
-const WidgetJsonifyDeprecated = {
-  getUserInput: function () {
-    // Omit props that get passed to all widgets
-    // @ts-expect-error - TS2339 - Property 'props' does not exist on type '{ readonly getUserInput: () => any; readonly getUserInputFromProps: (props: any) => any; }'.
-    return _.omit(this.props, denylist);
-  },
-  // Static version of `WidgetJsonifyDeprecated.getUserInput`
-  getUserInputFromProps: function (props) {
-    // Omit props that get passed to all widgets
-    return _.omit(props, denylist);
+function categorizerValidator(userInput, rubric, strings) {
+  let completed = true;
+  let allCorrect = true;
+  rubric.values.forEach((value, i) => {
+    if (userInput.values[i] == null) {
+      completed = false;
+    }
+    if (userInput.values[i] !== value) {
+      allCorrect = false;
+    }
+  });
+  if (!completed) {
+    return {
+      type: "invalid",
+      message: strings.invalidSelection
+    };
   }
-};
+  return {
+    type: "points",
+    earned: allCorrect ? 1 : 0,
+    total: 1,
+    message: null
+  };
+}
 
 /* eslint-disable @khanacademy/ts-no-error-suppressions */
 class Categorizer extends React.Component {
@@ -24438,35 +24472,16 @@ class Categorizer extends React.Component {
       return Categorizer.getUserInputFromProps(this.props);
     };
     this.simpleValidate = rubric => {
-      return Categorizer.validate(this.getUserInput(), rubric, this.context.strings);
+      return categorizerValidator(this.getUserInput(), rubric, this.context.strings);
     };
   }
   static validate(userInput, rubric, strings) {
-    let completed = true;
-    let allCorrect = true;
-    rubric.values.forEach((value, i) => {
-      if (userInput.values[i] == null) {
-        completed = false;
-      }
-      if (userInput.values[i] !== value) {
-        allCorrect = false;
-      }
-    });
-    if (!completed) {
-      return {
-        type: "invalid",
-        message: strings.invalidSelection
-      };
-    }
-    return {
-      type: "points",
-      earned: allCorrect ? 1 : 0,
-      total: 1,
-      message: null
-    };
+    return categorizerValidator(userInput, rubric, strings);
   }
   static getUserInputFromProps(props) {
-    return WidgetJsonifyDeprecated.getUserInputFromProps(props);
+    return {
+      values: props.values
+    };
   }
   onChange(itemNum, catNum) {
     const values = [...this.props.values];
@@ -24612,6 +24627,7 @@ const styles$s = StyleSheet.create({
 var Categorizer$1 = {
   name: "categorizer",
   displayName: "Categorizer",
+  hidden: true,
   widget: Categorizer,
   transform: widgetOptions => {
     return _.pick(widgetOptions, "items", "categories", "randomizeItems");
@@ -24669,6 +24685,9 @@ const parseUrl = url => new URL(url, location().origin);
  */
 const toAbsoluteUrl = url => parseUrl(url).href;
 
+/**
+ * This widget is for embedding Khan Academy CS programs.
+ */
 const {
   updateQueryString: updateQueryString$1
 } = Util;
@@ -24714,12 +24733,6 @@ class CSProgram extends React.Component {
       // @ts-expect-error - TS2345 - Argument of type 'readonly unknown[]' is not assignable to parameter of type 'any[]'.
       return change.apply(this, args);
     };
-    this.simpleValidate = rubric => {
-      return CSProgram.validate({
-        status: this.props.status,
-        message: this.props.message
-      }, rubric);
-    };
   }
   // The widget's grading function
   static validate(state, rubric) {
@@ -24752,6 +24765,12 @@ class CSProgram extends React.Component {
   componentWillUnmount() {
     $(window).off("message", this.handleMessageEvent);
   }
+  simpleValidate(rubric) {
+    return CSProgram.validate({
+      status: this.props.status,
+      message: this.props.message
+    }, rubric);
+  }
   render() {
     if (!this.props.programID) {
       return /*#__PURE__*/React.createElement("div", null);
@@ -24811,18 +24830,6 @@ class CSProgram extends React.Component {
     }));
   }
 }
-CSProgram.propTypes = _extends({}, propTypes, {
-  programID: PropTypes.string,
-  programType: PropTypes.oneOf(["pjs", "sql", "webpage"]),
-  width: PropTypes.number,
-  height: PropTypes.number,
-  // eslint-disable-next-line react/forbid-prop-types
-  settings: PropTypes.array,
-  showEditor: PropTypes.bool,
-  showButtons: PropTypes.bool,
-  status: PropTypes.oneOf(["incomplete", "incorrect", "correct"]),
-  message: PropTypes.string
-});
 CSProgram.defaultProps = {
   showEditor: false,
   showButtons: false,
@@ -24854,17 +24861,14 @@ class Definition extends React.Component {
     this.getUserInput = () => {
       return {};
     };
-    this.simpleValidate = rubric => {
-      return Definition.validate(this.getUserInput(), rubric);
-    };
   }
-  static validate(userInput, rubric) {
-    return {
-      type: "points",
-      earned: 0,
-      total: 0,
-      message: null
-    };
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  static validate() {
+    return noopValidator();
+  }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
   }
   render() {
     return /*#__PURE__*/React.createElement(DefinitionConsumer, null, ({
@@ -24932,18 +24936,13 @@ class DeprecatedStandin extends React__default.Component {
       return {};
     };
     this.simpleValidate = rubric => {
-      return DeprecatedStandin.validate(this.getUserInput(), rubric);
+      return noopValidator(1);
     };
   }
   static validate(userInput, rubric) {
     // Since this mean to replace an existing widget the learner
     // WILL earn points for this widget
-    return {
-      type: "points",
-      earned: 1,
-      total: 1,
-      message: null
-    };
+    return noopValidator(1);
   }
   render() {
     return /*#__PURE__*/React__default.createElement("div", {
@@ -24966,6 +24965,23 @@ var DeprecatedStandin$1 = {
   hidden: true
 };
 
+function dropdownValidator(userInput, rubric) {
+  const selected = userInput.value;
+  if (selected === 0) {
+    return {
+      type: "invalid",
+      message: null
+    };
+  }
+  const correct = rubric.choices[selected - 1].correct;
+  return {
+    type: "points",
+    earned: correct ? 1 : 0,
+    total: 1,
+    message: null
+  };
+}
+
 class Dropdown extends React.Component {
   constructor(...args) {
     super(...args);
@@ -24992,24 +25008,11 @@ class Dropdown extends React.Component {
       };
     };
     this.simpleValidate = rubric => {
-      return Dropdown.validate(this.getUserInput(), rubric);
+      return dropdownValidator(this.getUserInput(), rubric);
     };
   }
   static validate(userInput, rubric) {
-    const selected = userInput.value;
-    if (selected === 0) {
-      return {
-        type: "invalid",
-        message: null
-      };
-    }
-    const correct = rubric.choices[selected - 1].correct;
-    return {
-      type: "points",
-      earned: correct ? 1 : 0,
-      total: 1,
-      message: null
-    };
+    return dropdownValidator(userInput, rubric);
   }
   render() {
     const children = [/*#__PURE__*/React.createElement(OptionItem, {
@@ -25087,17 +25090,10 @@ class Explanation extends React.Component {
     this.getUserInput = () => {
       return {};
     };
-    this.simpleValidate = rubric => {
-      return Explanation.validate(this.getUserInput(), rubric);
-    };
   }
-  static validate(userInput, rubric) {
-    return {
-      type: "points",
-      earned: 0,
-      total: 0,
-      message: null
-    };
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  static validate() {
+    return noopValidator();
   }
   componentDidMount() {
     this._mounted = true;
@@ -25105,6 +25101,10 @@ class Explanation extends React.Component {
   componentWillUnmount() {
     this._mounted = false;
   }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
+  }
   render() {
     const promptText = this.state.expanded ? this.props.hidePrompt : this.props.showPrompt;
     const caretIcon = this.state.expanded ? caretUp : caretDown;
@@ -26925,6 +26925,7 @@ const staticTransform$4 = editorProps => {
 var Grapher$1 = {
   name: "grapher",
   displayName: "Grapher",
+  hidden: true,
   widget: Grapher,
   transform: propTransform$2,
   staticTransform: staticTransform$4
@@ -27074,21 +27075,25 @@ var Group$1 = {
   displayName: "Group (SAT only)",
   widget: Group,
   traverseChildWidgets: traverseChildWidgets,
-  hidden: false,
+  hidden: true,
   isLintable: true
 };
 
+/**
+ * This is an iframe widget. It is used for rendering an iframe that
+ *  then communicates its state via window.postMessage
+ * This is useful for embedding arbitrary visualizations/simulations with
+ *  completed conditions, such as the mazes and games in Algorithms.
+ * It's particularly well suited for embedding our ProcessingJS programs,
+ *  but could also be used for embedding viz's hosted elsewhere.
+ */
 const {
   updateQueryString
 } = Util;
-
 /* This renders the iframe and handles validation via window.postMessage */
 class Iframe extends React.Component {
   constructor(..._args) {
     super(..._args);
-    this.getUserInput = () => {
-      return WidgetJsonifyDeprecated.getUserInput.call(this);
-    };
     this.handleMessageEvent = e => {
       // We receive data from the iframe that contains {passed: true/false}
       //  and use that to set the status
@@ -27123,6 +27128,12 @@ class Iframe extends React.Component {
   componentWillUnmount() {
     $(window).off("message", this.handleMessageEvent);
   }
+  getUserInput() {
+    return {
+      status: this.props.status,
+      message: this.props.message
+    };
+  }
   render() {
     const style = {
       width: String(this.props.width),
@@ -27188,16 +27199,6 @@ class Iframe extends React.Component {
 /**
  * This is the widget's grading function
  */
-Iframe.propTypes = _extends({}, propTypes, {
-  width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  url: PropTypes.string,
-  settings: PropTypes.array,
-  status: PropTypes.oneOf(["incomplete", "incorrect", "correct"]),
-  message: PropTypes.string,
-  allowFullScreen: PropTypes.bool,
-  allowTopNavigation: PropTypes.bool
-});
 Iframe.defaultProps = {
   status: "incomplete",
   // optional message
@@ -27260,18 +27261,15 @@ class ImageWidget extends React.Component {
     this.getUserInput = () => {
       return null;
     };
-    this.simpleValidate = rubric => {
-      return ImageWidget.validate(this.getUserInput(), rubric);
-    };
     this.focus = () => {};
   }
-  static validate(userInput, rubric) {
-    return {
-      type: "points",
-      earned: 0,
-      total: 0,
-      message: null
-    };
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  static validate() {
+    return noopValidator();
+  }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
   }
   // no-op
 
@@ -27587,17 +27585,10 @@ class Interaction extends React.Component {
       // anything.
       return {};
     };
-    this.simpleValidate = rubric => {
-      return Interaction.validate(this.getUserInput(), rubric);
-    };
   }
-  static validate(state, rubric) {
-    return {
-      type: "points",
-      earned: 0,
-      total: 0,
-      message: null
-    };
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  static validate() {
+    return noopValidator();
   }
   UNSAFE_componentWillReceiveProps(nextProps) {
     // HACK(michaelpolyak): This widget is not wired to use the Perseus
@@ -27617,6 +27608,10 @@ class Interaction extends React.Component {
       });
     }
   }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
+  }
   render() {
     const range = this.props.graph.range;
     let labels = this.props.graph.labels;
@@ -29663,17 +29658,31 @@ function LockedLabel(props) {
 
 function GraphLockedLabelsLayer(props) {
   const {
+    flags,
     lockedFigures
   } = props;
   return lockedFigures.map((figure, i) => {
+    var _flags$mafs, _flags$mafs2;
     if (figure.type === "label") {
       return /*#__PURE__*/React.createElement(LockedLabel, _extends({
         key: `label-${i}`
       }, figure));
     }
-
-    // TODO(LEMS-2271): Add support for labels within
-    // other locked figure types
+    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") {
+      return /*#__PURE__*/React.createElement(React.Fragment, {
+        key: i
+      }, 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].labels.map((label, k) => /*#__PURE__*/React.createElement(LockedLabel, _extends({
+        key: `locked-figure-${i}-point-1-label-${k}`
+      }, label))), figure.points[1].labels.map((label, k) => /*#__PURE__*/React.createElement(LockedLabel, _extends({
+        key: `locked-figure-${i}-point-2-label-${k}`
+      }, label)))));
+    }
     return null;
   });
 }
@@ -30012,7 +30021,9 @@ const GraphLockedLayer = props => {
 
 const actions = {
   global: {
-    deleteIntent
+    deleteIntent,
+    changeInteractionMode,
+    changeKeyboardInvitationVisibility
   },
   angle: {
     movePoint
@@ -30104,6 +30115,20 @@ function clickPoint(index) {
     index
   };
 }
+const CHANGE_INTERACTION_MODE = "point-change-interaction-mode";
+function changeInteractionMode(mode) {
+  return {
+    type: CHANGE_INTERACTION_MODE,
+    mode
+  };
+}
+const CHANGE_KEYBOARD_INVITATION_VISIBILITY = "change-keyboard-interaction-invitation-visibility";
+function changeKeyboardInvitationVisibility(shouldShow) {
+  return {
+    type: CHANGE_KEYBOARD_INVITATION_VISIBILITY,
+    shouldShow
+  };
+}
 const MOVE_ALL = "move-all";
 function moveAll(delta) {
   return {
@@ -31884,6 +31909,7 @@ function useDraggablePx(args) {
  */
 const REMOVE_BUTTON_ID = "perseus_mafs_remove_button";
 const MafsGraph = props => {
+  var _props$flags;
   const {
     state,
     dispatch,
@@ -31941,16 +31967,18 @@ const MafsGraph = props => {
       height
     },
     onKeyUp: event => {
-      if (event.key === "Backspace") {
-        var _graphRef$current;
-        dispatch(actions.global.deleteIntent());
-        (_graphRef$current = graphRef.current) == null || _graphRef$current.focus();
-      }
+      handleKeyboardEvent(event, state, dispatch);
     },
     "aria-label": fullGraphAriaLabel,
     "aria-describedby": fullGraphAriaDescription ? descriptionId : undefined,
     ref: graphRef,
-    tabIndex: 0
+    tabIndex: 0,
+    onFocus: event => {
+      handleFocusEvent(event, state, dispatch);
+    },
+    onBlur: event => {
+      handleBlurEvent(event, state, dispatch);
+    }
   }, fullGraphAriaDescription && /*#__PURE__*/React.createElement(View, {
     id: descriptionId,
     tabIndex: -1,
@@ -31991,7 +32019,8 @@ const MafsGraph = props => {
   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, {
     lockedFigures: props.lockedFigures,
     range: state.range
-  }))), props.showLabelsFlag && props.lockedFigures && /*#__PURE__*/React.createElement(GraphLockedLabelsLayer, {
+  }))), ((_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,
     lockedFigures: props.lockedFigures
   }), /*#__PURE__*/React.createElement(View, {
     style: {
@@ -32011,30 +32040,63 @@ const MafsGraph = props => {
   }, /*#__PURE__*/React.createElement("svg", nestedSVGAttributes, props.showProtractor && /*#__PURE__*/React.createElement(Protractor, null), renderGraph({
     state,
     dispatch
-  })))))), renderGraphControls({
+  }))))), state.type === "point" && state.showKeyboardInteractionInvitation && /*#__PURE__*/React.createElement(View, {
+    style: {
+      textAlign: "center",
+      backgroundColor: "white",
+      border: "1px solid #21242C52",
+      padding: "16px 0",
+      boxShadow: "0px 8px 8px 0px #21242C14",
+      // This translates the box to the center of the
+      // graph Then backs it off by half of its
+      // overall height so it's perfectly centered
+      top: "50%",
+      transform: "translateY(-50%)"
+    }
+  }, /*#__PURE__*/React.createElement(LabelMedium, null, "Press ", /*#__PURE__*/React.createElement("strong", null, "Shift + Enter"), " to interact with the graph"))), renderGraphControls({
     state,
     dispatch,
     width
   })));
 };
-const renderPointGraphControls = props => /*#__PURE__*/React.createElement(View, {
-  style: {
-    flexDirection: "row",
-    width: props.width
-  }
-}, props.state.showRemovePointButton && props.state.focusedPointIndex !== null && /*#__PURE__*/React.createElement(Button, {
-  id: REMOVE_BUTTON_ID,
-  kind: "secondary",
-  color: "destructive",
-  tabIndex: -1,
-  style: {
-    width: "100%",
-    marginLeft: "20px"
-  },
-  onClick: event => {
-    props.dispatch(actions.pointGraph.removePoint(props.state.focusedPointIndex));
-  }
-}, "Remove Point"));
+const renderPointGraphControls = props => {
+  const {
+    interactionMode,
+    showRemovePointButton,
+    focusedPointIndex
+  } = props.state;
+  return /*#__PURE__*/React.createElement(View, {
+    style: {
+      flexDirection: "row",
+      width: props.width
+    }
+  }, interactionMode === "keyboard" && /*#__PURE__*/React.createElement(Button, {
+    kind: "secondary",
+    style: {
+      width: "100%",
+      marginLeft: "20px"
+    },
+    tabIndex: 0,
+    onClick: () => {
+      props.dispatch(actions.pointGraph.addPoint([0, 0]));
+    }
+  }, "Add Point"), interactionMode === "mouse" && showRemovePointButton && focusedPointIndex !== null && /*#__PURE__*/React.createElement(Button, {
+    id: REMOVE_BUTTON_ID,
+    kind: "secondary",
+    color: "destructive"
+    // This button is meant to be interacted with by the mouse only
+    // Never allow learners to tab to this button
+    ,
+    tabIndex: -1,
+    style: {
+      width: "100%",
+      marginLeft: "20px"
+    },
+    onClick: event => {
+      props.dispatch(actions.pointGraph.removePoint(props.state.focusedPointIndex));
+    }
+  }, "Remove Point"));
+};
 const renderGraphControls = props => {
   const {
     state,
@@ -32058,6 +32120,34 @@ const renderGraphControls = props => {
       return null;
   }
 };
+function handleFocusEvent(event, state, dispatch) {
+  if (state.type === "point" && state.numPoints === "unlimited") {
+    if (event.target.classList.contains("mafs-graph") && state.interactionMode === "mouse") {
+      dispatch(actions.global.changeKeyboardInvitationVisibility(true));
+    }
+  }
+}
+function handleBlurEvent(event, state, dispatch) {
+  if (state.type === "point" && state.numPoints === "unlimited") {
+    dispatch(actions.global.changeKeyboardInvitationVisibility(false));
+  }
+}
+function handleKeyboardEvent(event, state, dispatch) {
+  if (state.type === "point" && state.numPoints === "unlimited") {
+    if (event.key === "Backspace") {
+      dispatch(actions.global.deleteIntent());
+
+      // After removing a point blur
+      // It would be nice if this could focus on the graph but doing so
+      // would trigger the message to prompt a learner to enter keyboard mode
+      document.activeElement.blur();
+    } else if (event.shiftKey && event.key === "Enter") {
+      dispatch(actions.global.changeInteractionMode("keyboard"));
+    } else if (state.interactionMode === "keyboard" && event.key === "a") {
+      dispatch(actions.pointGraph.addPoint([0, 0]));
+    }
+  }
+}
 
 // Calculate the difference between the min and max values of a range
 const getRangeDiff = range => {
@@ -32222,7 +32312,9 @@ function initializeGraphState(params) {
         coords: getPointCoords(graph, range, step),
         numPoints: graph.numPoints || 0,
         focusedPointIndex: null,
-        showRemovePointButton: false
+        showRemovePointButton: false,
+        interactionMode: "mouse",
+        showKeyboardInteractionInvitation: false
       });
     case "circle":
       return _extends({}, shared, {
@@ -32492,6 +32584,10 @@ function interactiveGraphReducer(state, action) {
       return doDeleteIntent(state);
     case CLICK_POINT:
       return doClickPoint(state, action);
+    case CHANGE_INTERACTION_MODE:
+      return doChangeInteractionMode(state, action);
+    case CHANGE_KEYBOARD_INVITATION_VISIBILITY:
+      return doChangeKeyboardInvitationVisibility(state, action);
     default:
       throw new UnreachableCaseError(action);
   }
@@ -32540,6 +32636,31 @@ function doClickPoint(state, action) {
   }
   return state;
 }
+function doChangeInteractionMode(state, action) {
+  if (state.type !== "point") {
+    return state;
+  }
+  if (state.numPoints === "unlimited") {
+    const nextKeyboardInvitation = action.mode === "keyboard" ? false : state.showKeyboardInteractionInvitation;
+    return _extends({}, state, {
+      interactionMode: action.mode,
+      showKeyboardInteractionInvitation: nextKeyboardInvitation
+    });
+  }
+  return state;
+}
+function doChangeKeyboardInvitationVisibility(state, action) {
+  if (state.type !== "point") {
+    return state;
+  }
+  if (state.numPoints === "unlimited") {
+    return _extends({}, state, {
+      showKeyboardInteractionInvitation: action.shouldShow,
+      hasBeenInteractedWith: true
+    });
+  }
+  return state;
+}
 function doMovePointInFigure(state, action) {
   switch (state.type) {
     case "segment":
@@ -33276,7 +33397,7 @@ const StatefulMafsGraph = /*#__PURE__*/React.forwardRef((props, ref) => {
   const snapTo = graph.type === "polygon" ? graph.snapTo : null;
   const showAngles = graph.type === "polygon" ? graph.showAngles : null;
   const showSides = graph.type === "polygon" ? graph.showSides : null;
-  const startCoords = "startCoords" in graph ? graph.startCoords : null;
+  const startCoords = "startCoords" in graph ? graph.startCoords : undefined;
   const originalPropsRef = useRef(props);
   const latestPropsRef = useLatestRef(props);
   useEffect(() => {
@@ -34600,7 +34721,7 @@ class InteractiveGraph extends React.Component {
       const gridStep = this.props.gridStep || Util.getGridStep(this.props.range, this.props.step, box[0]);
       const snapStep = this.props.snapStep || Util.snapStepFromGridStep(gridStep);
       return /*#__PURE__*/React.createElement(StatefulMafsGraph, _extends({}, this.props, {
-        showLabelsFlag: (_this$props$apiOption2 = this.props.apiOptions) == null || (_this$props$apiOption2 = _this$props$apiOption2.flags) == null || (_this$props$apiOption2 = _this$props$apiOption2["mafs"]) == null ? void 0 : _this$props$apiOption2["interactive-graph-locked-features-labels"],
+        flags: (_this$props$apiOption2 = this.props.apiOptions) == null ? void 0 : _this$props$apiOption2.flags,
         ref: this.mafsRef,
         gridStep: gridStep,
         snapStep: snapStep,
@@ -35211,7 +35332,7 @@ function shouldUseMafs(mafsFlags, graph) {
 const staticTransform$3 = _.identity;
 var InteractiveGraph$1 = {
   name: "interactive-graph",
-  displayName: "Interactive graph",
+  displayName: "Interactive graph (Assessments only)",
   widget: InteractiveGraph,
   staticTransform: staticTransform$3
 };
@@ -37147,11 +37268,6 @@ var LabelImage$1 = {
   isLintable: true
 };
 
-let Layout = /*#__PURE__*/function (Layout) {
-  Layout["HORIZONTAL"] = "horizontal";
-  Layout["VERTICAL"] = "vertical";
-  return Layout;
-}({});
 var ItemState = /*#__PURE__*/function (ItemState) {
   ItemState["STATIC"] = "static";
   ItemState["DRAGGING"] = "dragging";
@@ -37178,7 +37294,7 @@ class Placeholder extends React.Component {
     const {
       layout
     } = this.props;
-    const className = css(styles$d.card, styles$d.placeholder, layout === Layout.HORIZONTAL && styles$d.horizontalCard);
+    const className = css(styles$d.card, styles$d.placeholder, layout === "horizontal" && styles$d.horizontalCard);
     const style = {
       width: this.props.width,
       height: this.props.height
@@ -37382,7 +37498,7 @@ class Draggable extends React.Component {
     // We need to keep backwards compatbility with rules specified directly
     // in CSS. Hence the hacky tacking on of manual classNames.
     // See sortable.less for details.
-    let className = css(styles$d.card, styles$d.draggable, layout === Layout.HORIZONTAL && styles$d.horizontalCard, layout === Layout.VERTICAL && styles$d.verticalCard, type === ItemState.DRAGGING && styles$d.dragging, type === ItemState.DISABLED && styles$d.disabled, !includePadding && styles$d.unpaddedCard) + " " + ClassNames.INTERACTIVE + " perseus-sortable-draggable";
+    let className = css(styles$d.card, styles$d.draggable, layout === "horizontal" && styles$d.horizontalCard, layout === "vertical" && styles$d.verticalCard, type === ItemState.DRAGGING && styles$d.dragging, type === ItemState.DISABLED && styles$d.disabled, !includePadding && styles$d.unpaddedCard) + " " + ClassNames.INTERACTIVE + " perseus-sortable-draggable";
     if (!includePadding) {
       className += " perseus-sortable-draggable-unpadded";
     }
@@ -37511,7 +37627,7 @@ class Sortable extends React.Component {
     if (constraints != null && constraints.width) {
       // Items must be at least as wide as the specified constraint
       syncWidth = _.max(widths.concat(constraints.width));
-    } else if (layout === Layout.VERTICAL) {
+    } else if (layout === "vertical") {
       // Sync widths to get a clean column
       syncWidth = _.max(widths);
     }
@@ -37519,7 +37635,7 @@ class Sortable extends React.Component {
     if (constraints != null && constraints.height) {
       // Items must be at least as high as the specified constraint
       syncHeight = _.max(heights.concat(constraints.height));
-    } else if (layout === Layout.HORIZONTAL) {
+    } else if (layout === "horizontal") {
       // Sync widths to get a clean row
       syncHeight = _.max(heights);
     }
@@ -37601,7 +37717,7 @@ class Sortable extends React.Component {
 
     // @ts-expect-error - TS2551 - Property 'splice' does not exist on type 'readonly SortableItem[]'. Did you mean 'slice'?
     items.splice(currentIndex, 1);
-    if (this.props.layout === Layout.HORIZONTAL) {
+    if (this.props.layout === "horizontal") {
       // @ts-expect-error - TS2339 - Property 'offset' does not exist on type 'JQueryStatic'. | TS2339 - Property 'offset' does not exist on type 'JQueryStatic'.
       const midWidth = $draggable.offset().left - $sortable.offset().left;
       let sumWidth = 0;
@@ -37716,19 +37832,19 @@ class Sortable extends React.Component {
     // We need to keep backwards compatbility with rules specified directly
     // in CSS. See sortable.less for details.
     const className = css(styles$d.sortable) + " perseus-sortable";
-    const syncWidth = ((_this$props$constrain = this.props.constraints) == null ? void 0 : _this$props$constrain.width) || layout === Layout.VERTICAL;
-    const syncHeight = ((_this$props$constrain2 = this.props.constraints) == null ? void 0 : _this$props$constrain2.height) || layout === Layout.HORIZONTAL;
+    const syncWidth = ((_this$props$constrain = this.props.constraints) == null ? void 0 : _this$props$constrain.width) || layout === "vertical";
+    const syncHeight = ((_this$props$constrain2 = this.props.constraints) == null ? void 0 : _this$props$constrain2.height) || layout === "horizontal";
     _.each(this.state.items, function (item, i, items) {
       const isLast = i === items.length - 1;
       const isStatic = item.state === ItemState.STATIC || item.state === ItemState.DISABLED;
       let margin;
 
       // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
-      if (this.props.layout === Layout.HORIZONTAL) {
+      if (this.props.layout === "horizontal") {
         // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
         margin = "0 " + this.props.margin + "px 0 0"; // right
         // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
-      } else if (this.props.layout === Layout.VERTICAL) {
+      } else if (this.props.layout === "vertical") {
         // @ts-expect-error - TS2683 - 'this' implicitly has type 'any' because it does not have a type annotation.
         margin = "0 0 " + this.props.margin + "px 0"; // bottom
       }
@@ -37802,7 +37918,7 @@ class Sortable extends React.Component {
   }
 }
 Sortable.defaultProps = {
-  layout: Layout.HORIZONTAL,
+  layout: "horizontal",
   padding: true,
   disabled: false,
   constraints: {},
@@ -37861,7 +37977,6 @@ const styles$d = StyleSheet.create({
   }
 });
 
-/* eslint-disable @khanacademy/ts-no-error-suppressions */
 const {
   shuffle: shuffle$1,
   seededRNG
@@ -37995,7 +38110,7 @@ class Matcher extends React.Component {
       className: css(styles$c.column)
     }, /*#__PURE__*/React.createElement(Sortable, {
       options: left,
-      layout: Layout.VERTICAL,
+      layout: "vertical",
       padding: this.props.padding,
       disabled: !this.props.orderMatters,
       constraints: constraints,
@@ -38008,11 +38123,9 @@ class Matcher extends React.Component {
       ref: "left"
     })), /*#__PURE__*/React.createElement("td", {
       className: css(styles$c.column, styles$c.columnRight)
-    }, /*#__PURE__*/React.createElement(Sortable
-    // @ts-expect-error - TS2322 - Type 'readonly unknown[]' is not assignable to type 'readonly string[]'.
-    , {
+    }, /*#__PURE__*/React.createElement(Sortable, {
       options: right,
-      layout: Layout.VERTICAL,
+      layout: "vertical",
       padding: this.props.padding,
       constraints: constraints,
       onMeasure: this.onMeasureRight,
@@ -38026,18 +38139,6 @@ class Matcher extends React.Component {
   }
 }
 Matcher.contextType = PerseusI18nContext;
-Matcher.propTypes = {
-  apiOptions: ApiOptions.propTypes,
-  labels: PropTypes.array,
-  left: PropTypes.array,
-  onChange: PropTypes.func,
-  orderMatters: PropTypes.bool,
-  padding: PropTypes.bool,
-  problemNum: PropTypes.number,
-  right: PropTypes.array,
-  trackInteraction: PropTypes.func.isRequired,
-  linterContext: linterContextProps
-};
 Matcher.defaultProps = {
   left: [],
   right: [],
@@ -38557,6 +38658,7 @@ const staticTransform$2 = editorProps => {
 var Matrix$1 = {
   name: "matrix",
   displayName: "Matrix",
+  hidden: true,
   widget: Matrix,
   transform: propTransform$1,
   staticTransform: staticTransform$2,
@@ -38658,9 +38760,8 @@ const Measurer = createReactClass({
   getUserInput: function () {
     return {};
   },
-  simpleValidate: function (rubric) {
-    // TODO(joel) - I don't understand how this is useful!
-    return Measurer.validate(this.getUserInput(), rubric);
+  simpleValidate: function () {
+    return noopValidator(1);
   },
   focus: $.noop,
   render: function () {
@@ -38689,14 +38790,7 @@ const Measurer = createReactClass({
   }
 });
 _.extend(Measurer, {
-  validate: function (state, rubric) {
-    return {
-      type: "points",
-      earned: 1,
-      total: 1,
-      message: null
-    };
-  }
+  validate: noopValidator(1)
 });
 const propUpgrades = {
   "1": v0props => {
@@ -38713,6 +38807,7 @@ const propUpgrades = {
 var Measurer$1 = {
   name: "measurer",
   displayName: "Measurer",
+  hidden: true,
   widget: Measurer,
   version: {
     major: 1,
@@ -39587,28 +39682,17 @@ Molecule.contextType = PerseusI18nContext;
 class MoleculeWidget extends React.Component {
   constructor(...args) {
     super(...args);
-    this.simpleValidate = () => {
-      return {
-        type: "points",
-        earned: 0,
-        total: 0,
-        message: null
-      };
-    };
     this.getUserInput = () => {
       return [];
     };
-    this.validate = (state, rubric) => {
-      // TODO(colin): this is here as part of the interface for a component.
-      // Figure out if there is something more appropriate that this should
-      // return.
-      return {
-        type: "points",
-        earned: 0,
-        total: 0,
-        message: null
-      };
-    };
+  }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
+  }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  validate() {
+    return noopValidator();
   }
   render() {
     return /*#__PURE__*/React.createElement(Molecule, {
@@ -40214,15 +40298,11 @@ class PlaceholderCard extends React.Component {
     }, /*#__PURE__*/React.createElement("div", {
       className: "card placeholder",
       style: {
-        height: this.props.height
+        height: this.props.width
       }
     }));
   }
 }
-PlaceholderCard.propTypes = {
-  width: PropTypes.number.isRequired,
-  height: PropTypes.number.isRequired
-};
 class DragHintCard extends React.Component {
   render() {
     return /*#__PURE__*/React.createElement("div", {
@@ -40232,10 +40312,6 @@ class DragHintCard extends React.Component {
     }));
   }
 }
-const PropTypePosition = PropTypes.shape({
-  left: PropTypes.number,
-  top: PropTypes.number
-});
 class Card extends React.Component {
   constructor(...args) {
     super(...args);
@@ -40316,7 +40392,7 @@ class Card extends React.Component {
     this.props.fakeRef !== nextProps.fakeRef;
   }
   componentDidUpdate(prevProps, prevState) {
-    if (this.props.animating && !prevProps.animating) {
+    if (this.props.animating && !prevProps.animating && this.props.animateTo && this.props.startOffset) {
       // If we just were changed into animating, start the animation.
       // We pick the animation speed based on the distance that the card
       // needs to travel. (Why sqrt? Just because it looks nice -- with a
@@ -40339,10 +40415,11 @@ class Card extends React.Component {
   render() {
     let style = {};
     if (this.props.floating) {
+      var _this$props$startOffs, _this$props$startOffs2;
       style = {
         position: "absolute",
-        left: this.props.startOffset.left,
-        top: this.props.startOffset.top
+        left: (_this$props$startOffs = this.props.startOffset) == null ? void 0 : _this$props$startOffs.left,
+        top: (_this$props$startOffs2 = this.props.startOffset) == null ? void 0 : _this$props$startOffs2.top
       };
     }
     if (this.props.width) {
@@ -40352,7 +40429,7 @@ class Card extends React.Component {
     if (this.props.stack) {
       className.push("stack");
     }
-    if (this.props.floating && !this.props.animating) {
+    if (this.props.floating && !this.props.animating && this.props.mouse && this.props.startMouse) {
       className.push("dragging");
       style.left += this.props.mouse.left - this.props.startMouse.left;
       style.top += this.props.mouse.top - this.props.startMouse.top;
@@ -40377,28 +40454,13 @@ class Card extends React.Component {
   }
 }
 Card.contextType = PerseusI18nContext;
-Card.propTypes = {
-  floating: PropTypes.bool.isRequired,
-  animating: PropTypes.bool,
-  width: PropTypes.number,
-  stack: PropTypes.bool,
-  onMouseDown: PropTypes.func,
-  onMouseMove: PropTypes.func,
-  onMouseUp: PropTypes.func,
-  // Used only for floating/animating cards
-  startMouse: PropTypePosition,
-  startOffset: PropTypePosition,
-  animateTo: PropTypePosition,
-  onAnimationEnd: PropTypes.func,
-  linterContext: linterContextProps
-};
 Card.defaultProps = {
   stack: false,
   animating: false,
   linterContext: linterContextDefault
 };
 const NORMAL = "normal",
-  HORIZONTAL$1 = "horizontal";
+  HORIZONTAL = "horizontal";
 class Orderer extends React.Component {
   constructor(...args) {
     super(...args);
@@ -40545,7 +40607,7 @@ class Orderer extends React.Component {
     };
     this.findCorrectIndex = (draggable, list) => {
       // Find the correct index for a card given the current cards.
-      const isHorizontal = this.props.layout === HORIZONTAL$1;
+      const isHorizontal = this.props.layout === HORIZONTAL;
       // eslint-disable-next-line react/no-string-refs
       // @ts-expect-error - TS2769 - No overload matches this call.
       const $dragList = $(ReactDOM__default.findDOMNode(this.refs.dragList));
@@ -40595,7 +40657,7 @@ class Orderer extends React.Component {
       if (draggable == null) {
         return false;
       }
-      const isHorizontal = this.props.layout === HORIZONTAL$1,
+      const isHorizontal = this.props.layout === HORIZONTAL,
         // @ts-expect-error - TS2769 - No overload matches this call.
         $draggable = $(ReactDOM__default.findDOMNode(draggable)),
         // eslint-disable-next-line react/no-string-refs
@@ -40767,7 +40829,7 @@ Orderer.defaultProps = {
   options: [],
   correctOptions: [],
   height: NORMAL,
-  layout: HORIZONTAL$1,
+  layout: HORIZONTAL,
   linterContext: linterContextDefault
 };
 _.extend(Orderer, {
@@ -40790,6 +40852,7 @@ _.extend(Orderer, {
 var Orderer$1 = {
   name: "orderer",
   displayName: "Orderer",
+  hidden: true,
   widget: Orderer,
   isLintable: true
 };
@@ -42593,13 +42656,9 @@ class Passage extends React.Component {
       });
     };
   }
-  static validate(state, rubric) {
-    return {
-      type: "points",
-      earned: 0,
-      total: 0,
-      message: null
-    };
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  static validate() {
+    return noopValidator();
   }
   componentDidMount() {
     this._updateState();
@@ -42814,8 +42873,10 @@ class Passage extends React.Component {
   getUserInput() {
     return null;
   }
-  simpleValidate(rubric) {
-    return Passage.validate(this.getUserInput(), rubric);
+
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
   }
 
   /**
@@ -42965,6 +43026,7 @@ Passage.defaultProps = {
 var Passage$1 = {
   name: "passage",
   displayName: "Passage (SAT only)",
+  hidden: true,
   widget: Passage,
   transform: editorProps => {
     return _.pick(editorProps, "passageTitle", "passageText", "footnotes", "showLineNumbers");
@@ -42976,23 +43038,22 @@ var Passage$1 = {
 class PassageRefTarget extends React.Component {
   constructor(..._args) {
     super(..._args);
+    // TODO passage-ref-target isn't interactive; remove
     this.getUserInput = () => {
-      return WidgetJsonifyDeprecated.getUserInput.call(this);
+      return;
     };
+    // TODO passage-ref-target isn't interactive; remove
     this.change = (...args) => {
       return change.apply(this, args);
     };
-    this.simpleValidate = rubric => {
-      return PassageRefTarget.validate(this.getUserInput(), rubric);
-    };
   }
-  static validate(state, rubric) {
-    return {
-      type: "points",
-      earned: 0,
-      total: 0,
-      message: null
-    };
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  static validate() {
+    return noopValidator();
+  }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
   }
   render() {
     return /*#__PURE__*/React.createElement(Renderer, {
@@ -44054,6 +44115,7 @@ const staticTransform = _.identity;
 var Plotter$1 = {
   name: "plotter",
   displayName: "Plotter",
+  hidden: true,
   widget: Plotter,
   staticTransform: staticTransform
 };
@@ -44104,17 +44166,13 @@ var PythonProgram$1 = {
   widget: PythonProgram
 };
 
-/* eslint-disable @khanacademy/ts-no-error-suppressions */
 const {
   shuffle
 } = Util;
-const HORIZONTAL = "horizontal";
-const VERTICAL = "vertical";
 class Sorter extends React.Component {
   constructor(...args) {
     super(...args);
-    // @ts-expect-error - TS2564 - Property '_isMounted' has no initializer and is not definitely assigned in the constructor.
-    this._isMounted = void 0;
+    this._isMounted = false;
     this.state = {
       changed: false
     };
@@ -44188,9 +44246,7 @@ class Sorter extends React.Component {
     const marginPx = apiOptions.isMobile ? 8 : 5;
     return /*#__PURE__*/React.createElement("div", {
       className: "perseus-widget-sorter perseus-clearfix"
-    }, /*#__PURE__*/React.createElement(Sortable
-    // @ts-expect-error - TS2322 - Type 'readonly unknown[]' is not assignable to type 'readonly string[]'.
-    , {
+    }, /*#__PURE__*/React.createElement(Sortable, {
       options: options,
       layout: this.props.layout,
       margin: marginPx,
@@ -44203,20 +44259,9 @@ class Sorter extends React.Component {
     }));
   }
 }
-Sorter.propTypes = {
-  apiOptions: ApiOptions.propTypes,
-  // eslint-disable-next-line react/forbid-prop-types
-  correct: PropTypes.array,
-  layout: PropTypes.oneOf([HORIZONTAL, VERTICAL]),
-  onChange: PropTypes.func,
-  padding: PropTypes.bool,
-  problemNum: PropTypes.number,
-  trackInteraction: PropTypes.func.isRequired,
-  linterContext: linterContextProps
-};
 Sorter.defaultProps = {
   correct: [],
-  layout: HORIZONTAL,
+  layout: "horizontal",
   padding: true,
   problemNum: 0,
   onChange: function () {},
@@ -44232,7 +44277,6 @@ var Sorter$1 = {
 const {
   assert
 } = InteractiveUtil;
-
 /* Input handling: Maps a (row, column) pair to a unique ref used by React,
  * and extracts (row, column) pairs from input paths, used to allow outsiders
  * to focus, blur, set input values, etc. */
@@ -44419,16 +44463,6 @@ class Table extends React.Component {
   }
 }
 Table.contextType = PerseusI18nContext;
-Table.propTypes = {
-  answers: PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.string)),
-  editableHeaders: PropTypes.bool,
-  // The editor to use when editableHeaders is enabled
-  Editor: PropTypes.func,
-  headers: PropTypes.arrayOf(PropTypes.string),
-  keypadElement: keypadElementPropType,
-  trackInteraction: PropTypes.func.isRequired,
-  linterContext: linterContextProps
-};
 Table.defaultProps = function () {
   const defaultRows = 4;
   const defaultColumns = 1;
@@ -44616,9 +44650,6 @@ class Video extends React.Component {
     this.getUserInput = () => {
       return null;
     };
-    this.simpleValidate = rubric => {
-      return Video.validate(null, rubric);
-    };
     this.change = (...args) => {
       // @ts-expect-error - TS2345 - Argument of type 'readonly unknown[]' is not assignable to parameter of type 'any[]'.
       return change.apply(this, args);
@@ -44628,14 +44659,13 @@ class Video extends React.Component {
    * This is the widget's grading function.
    * Points for videos are tallied by the embedded video itself, in the case
    * of Khan Academy videos.
-   */
-  static validate(userInput, rubric) {
-    return {
-      type: "points",
-      earned: 0,
-      total: 0,
-      message: null
-    };
+   */ // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  static validate() {
+    return noopValidator();
+  }
+  // TODO (LEMS-2396): remove validation logic from widgets that don't validate
+  simpleValidate() {
+    return noopValidator();
   }
   render() {
     const {
@@ -44740,7 +44770,7 @@ const init = function init(options) {
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus";
-const libVersion = "33.3.0";
+const libVersion = "34.1.0";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {
@@ -48203,5 +48233,5 @@ const EditorJsonify = {
   }
 };
 
-export { ApiOptions, ArticleRenderer, BaseRadio, Categorizer$1 as Categorizer, changeable as Changeable, ClassNames, dependencies as Dependencies, EditorJsonify, Expression, util as GrapherUtil, Grapher$1 as GrapherWidget, HintRenderer, HintsRenderer, InputNumber$1 as InputNumber, InteractiveGraph$1 as InteractiveGraphWidget, ItemExtras, JiptParagraphs, KhanColors, KhanMath, context as LoadingContext, Log, Matrix$1 as MatrixWidget, MultiItems, NumericInput$1 as NumericInput, PerseusExpressionAnswerFormConsidered, PerseusI18nContext, PerseusI18nContextProvider, PerseusMarkdown, Plotter$1 as PlotterWidget, QUESTION_WIDGETS, Radio, Renderer, ref as ServerItemRenderer, sizingUtils as SizingUtils, Table$1 as TableWidget, Util, denylist as WIDGET_PROP_DENYLIST, WidgetJsonifyDeprecated, widgets$1 as Widgets, addWidget, apiVersion, buildEmptyItemTreeForShape, buildMapper, components, constants, contentHasWidgetType, convertWidgetNameToEnum, displaySigFigs, generateTestCategorizerWidget, generateTestExpressionWidget, generateTestInteractiveGraphWidget, generateTestNumericInputWidget, generateTestPerseusItem, generateTestRadioWidget, genericPerseusItemData, getAngleCoords, getAnswerFromUserInput, getAnswersFromWidgets, getCircleCoords, getCorrectAnswerForWidgetId, getLineCoords, getLinearSystemCoords, getPointCoords, getPolygonCoords, getQuadraticCoords, getSegmentCoords, getSinusoidCoords, getValidWidgetIds, getWidgetFromWidgetMap, getWidgetIdsFromContent, getWidgetIdsFromContentByType, getWidgetTypeByWidgetId, getWidgetsFromWidgetMap, getWidgetsMapFromItemData, globalConstants, globalStyles, iconPaths as icons, init, injectWidgets, interactiveSizes$1 as interactiveSizes, isItemRenderableByVersion, isWidgetIdInContent, isWrongAnswerSupported, itemDataVersion, itemToTree, ItemVersion as itemVersion, libVersion, lockedFigureColors, lockedFigureFillStyles, makeSafeUrl, mediaQueries, parsePerseusItem, plotterPlotTypes, preprocessTex, registerAllWidgetsForTesting, shapes, shouldHaveIndividualAnswer, traverse, usePerseusI18n, violatingWidgets, allWidgets as widgets };
+export { ApiOptions, ArticleRenderer, BaseRadio, Categorizer$1 as Categorizer, changeable as Changeable, ClassNames, dependencies as Dependencies, EditorJsonify, Expression, util as GrapherUtil, Grapher$1 as GrapherWidget, HintRenderer, HintsRenderer, InputNumber$1 as InputNumber, InteractiveGraph$1 as InteractiveGraphWidget, ItemExtras, JiptParagraphs, KhanColors, KhanMath, context as LoadingContext, Log, Matrix$1 as MatrixWidget, MultiItems, NumericInput$1 as NumericInput, PerseusExpressionAnswerFormConsidered, PerseusI18nContext, PerseusI18nContextProvider, PerseusMarkdown, Plotter$1 as PlotterWidget, QUESTION_WIDGETS, Radio, Renderer, ref as ServerItemRenderer, sizingUtils as SizingUtils, Table$1 as TableWidget, Util, denylist as WIDGET_PROP_DENYLIST, widgets$1 as Widgets, addWidget, apiVersion, buildEmptyItemTreeForShape, buildMapper, components, constants, contentHasWidgetType, convertWidgetNameToEnum, displaySigFigs, generateTestCategorizerWidget, generateTestExpressionWidget, generateTestInteractiveGraphWidget, generateTestNumericInputWidget, generateTestPerseusItem, generateTestRadioWidget, genericPerseusItemData, getAngleCoords, getAnswerFromUserInput, getAnswersFromWidgets, getCircleCoords, getCorrectAnswerForWidgetId, getLineCoords, getLinearSystemCoords, getPointCoords, getPolygonCoords, getQuadraticCoords, getSegmentCoords, getSinusoidCoords, getValidWidgetIds, getWidgetFromWidgetMap, getWidgetIdsFromContent, getWidgetIdsFromContentByType, getWidgetTypeByWidgetId, getWidgetsFromWidgetMap, getWidgetsMapFromItemData, globalConstants, globalStyles, iconPaths as icons, init, injectWidgets, interactiveSizes$1 as interactiveSizes, isItemRenderableByVersion, isWidgetIdInContent, isWrongAnswerSupported, itemDataVersion, itemToTree, ItemVersion as itemVersion, libVersion, lockedFigureColors, lockedFigureFillStyles, makeSafeUrl, mediaQueries, parsePerseusItem, plotterPlotTypes, preprocessTex, registerAllWidgetsForTesting, shapes, shouldHaveIndividualAnswer, traverse, usePerseusI18n, violatingWidgets, allWidgets as widgets };
 //# sourceMappingURL=index.js.map