@khanacademy/perseus 15.0.0 → 17.0.0

package/dist/index.css

@@ -675,30 +675,6 @@ div.timeline-total {
     width: 100px;
 }
 
-#previous-step {
-    margin: 5px;
-    cursor: pointer;
-    float: left;
-    width: 100px;
-}
-
-#next-step {
-    margin: 5px;
-    cursor: pointer;
-    float: right;
-    width: 80px;
-}
-
-#previous-step span {
-    background: url(/images/previous-step.png) no-repeat 0 50% transparent;
-    padding: 4px 0 4px 25px;
-}
-
-#next-step span {
-    background: url(/images/next-step.png) no-repeat 100% 50% transparent;
-    padding: 4px 25px 4px 0;
-}
-
 #next-problem {
     margin: 5px;
     cursor: pointer;
@@ -3584,48 +3560,6 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
     font-size: 18px;
   }
 }
-/**
- * Styles for managing the popover animations.
- *
- * Ideally, we'd be generating these styles with Aphrodite (along with
- * CSSTransitionGroup's support for custom classnames), but the generated
- * styles have issues on mobile Safari.
- *   See: https://github.com/Khan/aphrodite/issues/68.
- *
- * If the animation durations change, the corresponding values in
- * echo-manager.js must change as well.
- */
-.echo-slide-and-fade-enter {
-  opacity: 1 !important;
-  transform: translate3d(0, 0, 0) !important;
-}
-.echo-slide-and-fade-enter.echo-slide-and-fade-enter-active {
-  opacity: 0 !important;
-  transform: translate3d(0, -33%, 0) !important;
-  /**
-         * TODO(charlie): These times are intentionally different, which means
-         * that the animation really "ends" after 400ms
-         * cubic-bezier(1, 0, 0.9, 1) (since the opacity goes to 0), even though
-         * the transform doesn't complete. There's probably a way to achieve the
-         * same effect by manipulating the transform's Bezier curve and total
-         * displacement.
-         */
-  transition: transform 800ms cubic-bezier(0, 1, 0.25, 1), opacity 400ms cubic-bezier(1, 0, 0.9, 1) !important;
-}
-.echo-fade-only-enter {
-  opacity: 1 !important;
-}
-.echo-fade-only-enter.echo-fade-only-enter-active {
-  opacity: 0 !important;
-  transition: opacity 300ms cubic-bezier(0.25, 0, 0.75, 1) !important;
-}
-.echo-long-fade-only-enter {
-  opacity: 1 !important;
-}
-.echo-long-fade-only-enter.echo-long-fade-only-enter-active {
-  opacity: 0 !important;
-  transition: opacity 400ms cubic-bezier(0.75, 0, 0.75, 1) !important;
-}
 .keypad-input {
   outline: none !important;
 }
@@ -3706,24 +3640,6 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
   color: white !important;
   display: inline-block !important;
 }
-/**
- * Styles for managing the popover animations.
- *
- * Ideally, we'd be generating these styles with Aphrodite (along with
- * CSSTransitionGroup's support for custom classnames), but the generated
- * styles have issues on mobile Safari.
- *   See: https://github.com/Khan/aphrodite/issues/68.
- *
- * If the animation durations change, the corresponding values in
- * popover-manager.js must change as well.
- */
-.popover-enter {
-  opacity: 0 !important;
-}
-.popover-enter.popover-enter-active {
-  opacity: 1 !important;
-  transition: opacity 200ms ease-out !important;
-}
 /*
  * MathQuill v0.10.1               http://mathquill.com
  * by Han, Jeanine, and Mary  maintainers@mathquill.com
@@ -4160,9 +4076,3 @@ body.mobile .framework-perseus table.perseus-widget-table-of-values.non-markdown
   margin-top: -0.1em;
 }
 
-.tabbar_item {
-  background-color: red;
-}
-.tabbar_item:focus {
-  background-color: green;
-}

package/dist/index.js

@@ -44216,7 +44216,7 @@ const init = function (options) {
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus";
-const libVersion = "15.0.0";
+const libVersion = "17.0.0";
 perseusCore.addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {
@@ -44749,6 +44749,7 @@ class ServerItemRenderer extends React__namespace.Component {
   static defaultProps = {
     apiOptions: {},
     // a deep default is done in `this.update()`
+    linterContext: PerseusLinter__namespace.linterContextDefault,
     onRendered: isRendered => {}
   };
   constructor(props) {
@@ -45027,13 +45028,15 @@ class ServerItemRenderer extends React__namespace.Component {
       },
       content: this.props.item.question.content,
       widgets: this.props.item.question.widgets,
-      images: this.props.item.question.images
+      images: this.props.item.question.images,
+      linterContext: PerseusLinter__namespace.pushContextStack(this.props.linterContext, "question")
     }, this.props.dependencies)));
     const hintsRenderer = /*#__PURE__*/React__namespace.createElement(HintsRenderer, {
       hints: this.props.item.hints,
       hintsVisible: this.props.hintsVisible,
       apiOptions: apiOptions,
-      ref: elem => this.hintsRenderer = elem
+      ref: elem => this.hintsRenderer = elem,
+      linterContext: PerseusLinter__namespace.pushContextStack(this.props.linterContext, "hints")
     });
     return /*#__PURE__*/React__namespace.createElement(DependenciesContext.Provider, {
       value: this.props.dependencies
@@ -45498,238 +45501,6 @@ class RangeInput extends React__namespace.Component {
   };
 }
 
-/* eslint-disable @khanacademy/ts-no-error-suppressions */
-const prettyBig = {
-  fontSize: "150%"
-};
-const slightlyBig = {
-  fontSize: "120%"
-};
-const symbStyle = {
-  fontSize: "130%"
-};
-// These are functions because we want to generate a new component for each use
-// on the page rather than reusing an instance (which will cause an error).
-// Also, it's useful for things which might look different depending on the
-// props.
-const basic = [() => [/*#__PURE__*/React__namespace.createElement("span", {
-  key: "plus",
-  style: slightlyBig
-}, "+"), "PLUS", i18n__namespace._("Plus")], () => [/*#__PURE__*/React__namespace.createElement("span", {
-  key: "minus",
-  style: prettyBig
-}, "-"), "MINUS", i18n__namespace._("Minus")],
-// TODO(joel) - display as \cdot when appropriate
-props => {
-  const {
-    TeX
-  } = getDependencies();
-  if (props.convertDotToTimes) {
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "times",
-      style: prettyBig
-    }, i18n__namespace.doNotTranslate("\\times")), "TIMES", i18n__namespace._("Multiply")];
-  }
-  return [/*#__PURE__*/React__namespace.createElement(TeX, {
-    key: "times",
-    style: prettyBig
-  }, i18n__namespace.doNotTranslate("\\cdot")), "CDOT", i18n__namespace._("Multiply")];
-}, () => {
-  const {
-    TeX
-  } = getDependencies();
-  return [/*#__PURE__*/React__namespace.createElement(TeX, {
-    key: "frac",
-    style: prettyBig
-  }, i18n__namespace.doNotTranslate("\\frac{x}{y}")), "FRAC", i18n__namespace._("Fraction, excluding the current expression")];
-}];
-const buttonSets = {
-  basic,
-  "basic+div": basic.concat([() => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "div"
-    }, i18n__namespace.doNotTranslate("\\div")), "DIVIDE", i18n__namespace._("Divide")];
-  }]),
-  trig: [() => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "sin"
-    }, i18n__namespace.doNotTranslate("\\sin")), "SIN", i18n__namespace._("Sine")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "cos"
-    }, i18n__namespace.doNotTranslate("\\cos")), "COS", i18n__namespace._("Cosine")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "tan"
-    }, i18n__namespace.doNotTranslate("\\tan")), "TAN", i18n__namespace._("Tangent")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "theta",
-      style: symbStyle
-    }, i18n__namespace.doNotTranslate("\\theta")), "THETA", i18n__namespace._("Theta")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement("span", {
-      key: "phi"
-    }, /*#__PURE__*/React__namespace.createElement("span", {
-      className: "perseus-sr-only"
-    }, i18n__namespace.doNotTranslate("phi")), /*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "pi",
-      style: symbStyle
-    }, i18n__namespace.doNotTranslate("\\phi"))), "PHI", i18n__namespace._("Phi")];
-  }],
-  prealgebra: [() => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "sqrt"
-    }, i18n__namespace.doNotTranslate("\\sqrt{x}")), "SQRT", i18n__namespace._("Square root")];
-  },
-  // TODO(joel) - how does desmos do this?
-  () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "nthroot"
-    }, i18n__namespace.doNotTranslate("\\sqrt[3]{x}")), "NTHROOT3", i18n__namespace._("Cube root")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "pow",
-      style: slightlyBig
-    }, i18n__namespace.doNotTranslate("a^b")), "POW", i18n__namespace._("Exponent")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "pi",
-      style: slightlyBig
-    }, i18n__namespace.doNotTranslate("\\pi")), "PI", i18n__namespace._("Pi")];
-  }],
-  logarithms: [() => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "log"
-    }, i18n__namespace.doNotTranslate("\\log")), "LOG", i18n__namespace._("Logarithm with base 10")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "ln"
-    }, i18n__namespace.doNotTranslate("\\ln")), "LN", i18n__namespace._("Natural logarithm")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "log_b"
-    }, i18n__namespace.doNotTranslate("\\log_b")), "LOG_B", i18n__namespace._("Logarithm with custom base")];
-  }],
-  "basic relations": [() => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "eq"
-    }, "="), "EQUAL", i18n__namespace._("Equals sign")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "lt"
-    }, i18n__namespace.doNotTranslate("\\lt")), "LT", i18n__namespace._("Less than sign")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "gt"
-    }, i18n__namespace.doNotTranslate("\\gt")), "GT", i18n__namespace._("Greater than sign")];
-  }],
-  "advanced relations": [() => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "neq"
-    }, i18n__namespace.doNotTranslate("\\neq")), "NEQ", i18n__namespace._("Not-equals sign")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "leq"
-    }, i18n__namespace.doNotTranslate("\\leq")), "LEQ", i18n__namespace._("Less than or equal to sign")];
-  }, () => {
-    const {
-      TeX
-    } = getDependencies();
-    return [/*#__PURE__*/React__namespace.createElement(TeX, {
-      key: "geq"
-    }, i18n__namespace.doNotTranslate("\\geq")), "GEQ", i18n__namespace._("Greater than or equal to sign")];
-  }]
-};
-const buttonSetsPropType = PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOf(___default["default"](buttonSets).keys()));
-class TexButtons extends React__namespace.Component {
-  static buttonSets = buttonSets;
-  static buttonSetsType = buttonSetsPropType;
-  render() {
-    // Always show buttonSets in the same order. Note: Technically it's ok
-    // for _.keys() to return the keys in an arbitrary order, but in
-    // practice, they will be ordered as listed above.
-    const sortedButtonSets = ___default["default"].sortBy(this.props.sets, setName => ___default["default"].keys(buttonSets).indexOf(setName));
-    const buttons = ___default["default"](sortedButtonSets).map(setName => buttonSets[setName]);
-    const buttonRows = ___default["default"](buttons).map(row => row.map(symbGen => {
-      // create a (component, thing we should send to mathquill) pair
-      const symbol = symbGen(this.props);
-      return /*#__PURE__*/React__namespace.createElement("button", {
-        onClick: () => this.props.onInsert(symbol[1]),
-        className: "tex-button"
-        // @ts-expect-error - TS2533 - Object is possibly 'null' or 'undefined'. | TS2339 - Property 'key' does not exist on type 'boolean | ReactChild | ReactFragment | ReactPortal'.
-        ,
-        key: symbol[0].key,
-        type: "button",
-        "aria-label": symbol[2]
-      }, symbol[0]);
-    }));
-    const buttonPopup = ___default["default"](buttonRows).map((row, i) => {
-      return /*#__PURE__*/React__namespace.createElement("div", {
-        className: "clearfix tex-button-row",
-        key: this.props.sets[i]
-      }, row);
-    });
-    return /*#__PURE__*/React__namespace.createElement("div", {
-      className: `${this.props.className || ""} preview-measure`
-    }, buttonPopup);
-  }
-}
-
 var components = /*#__PURE__*/Object.freeze({
   __proto__: null,
   ButtonGroup: ButtonGroup,
@@ -45746,7 +45517,6 @@ var components = /*#__PURE__*/Object.freeze({
   RangeInput: RangeInput,
   SvgImage: SvgImage,
   TextInput: TextInput,
-  TexButtons: TexButtons,
   TextListEditor: TextListEditor
 });