@khanacademy/perseus 13.1.0 → 14.0.0

package/dist/index.css

@@ -130,8 +130,6 @@ div.definition {
 
 #problemarea {
     font-size: 14px;
-    width: 70%;
-    min-height: 378px;
     position: relative;
     float: left;
     padding-bottom: 38px;
@@ -2366,11 +2364,6 @@ img.zoom-img {
 .framework-perseus.perseus-mobile .perseus-input-right-align .keypad-input {
   text-align: right;
 }
-.framework-perseus #problemarea input,
-.framework-perseus #problemarea button {
-  position: relative;
-  z-index: 3;
-}
 .framework-perseus div.paragraph {
   font-family: "Lato", sans-serif;
   font-weight: 400;

package/dist/index.js

@@ -16561,7 +16561,7 @@ const doJSONP = function (url, options) {
 // system (with file://). We replace urls that start with `web+graphie`
 // in the perseus json with this `file+graphie` prefix to indicate that
 // they should have the `file://` protocol instead of `https://`.
-const svgLocalLabelsRegex = /^file\+graphie\:/;
+const svgLocalLabelsRegex = /^file\+graphie:/;
 const hashRegex = /\/([^/]+)$/;
 function isImageProbablyPhotograph(imageUrl) {
   // TODO(david): Do an inventory to refine this heuristic. For example, what
@@ -23001,6 +23001,7 @@ const styles$r = aphrodite.StyleSheet.create({
     padding: intermediateCheckboxPadding,
     paddingTop: 0,
     marginLeft: 54,
+    color: Color__default["default"].offBlack64,
     [mediaQueries.smOrSmaller]: {
       padding: intermediateCheckboxPaddingPhone,
       paddingTop: 0
@@ -26856,43 +26857,50 @@ class ImageWidget extends React__namespace.Component {
     } = this.props;
     const backgroundImage = this.props.backgroundImage;
     if (backgroundImage.url) {
-      image = /*#__PURE__*/React__namespace.createElement(SvgImage, {
-        src: backgroundImage.url,
-        alt:
-        /* alt text is formatted in a sr-only
-               div next to the image in addition to
-               the alt attribute.
-               If there is no alt text at all,
-               we don't put an alt attribute on
-               the image, so that screen readers
-               know there's something they can't
-               read there :(.
-               NOTE: React <=0.13 (maybe later)
-               has a bug where it won't ever
-               remove an attribute, so if this
-               alt node is ever defined it's
-               not removed. This is sort of
-               dangerous, but we usually re-key
-               new renderers so that they're
-               rendered from scratch anyways,
-               so this shouldn't be a problem
-               in practice right now, although
-               it will exhibit weird behaviour
-               while editing. */
-        this.props.alt,
-        overrideAriaHidden: true,
-        width: backgroundImage.width,
-        height: backgroundImage.height,
-        preloader: apiOptions.imagePreloader,
-        extraGraphie: {
-          box: this.props.box,
-          range: this.props.range,
-          labels: this.props.labels
-        },
-        trackInteraction: this.props.trackInteraction,
-        zoomToFullSizeOnMobile: apiOptions.isMobile,
-        constrainHeight: apiOptions.isMobile,
-        allowFullBleed: apiOptions.isMobile
+      const url = backgroundImage.url;
+      image = /*#__PURE__*/React__namespace.createElement(context$1.Consumer, null, _ref => {
+        let {
+          setAssetStatus
+        } = _ref;
+        return /*#__PURE__*/React__namespace.createElement(SvgImage, {
+          src: url,
+          alt:
+          /* alt text is formatted in a sr-only
+          div next to the image in addition to
+          the alt attribute.
+          If there is no alt text at all,
+          we don't put an alt attribute on
+          the image, so that screen readers
+          know there's something they can't
+          read there :(.
+          NOTE: React <=0.13 (maybe later)
+          has a bug where it won't ever
+          remove an attribute, so if this
+          alt node is ever defined it's
+          not removed. This is sort of
+          dangerous, but we usually re-key
+          new renderers so that they're
+          rendered from scratch anyways,
+          so this shouldn't be a problem
+          in practice right now, although
+          it will exhibit weird behaviour
+          while editing. */
+          this.props.alt,
+          overrideAriaHidden: true,
+          width: backgroundImage.width,
+          height: backgroundImage.height,
+          preloader: apiOptions.imagePreloader,
+          extraGraphie: {
+            box: this.props.box,
+            range: this.props.range,
+            labels: this.props.labels
+          },
+          trackInteraction: this.props.trackInteraction,
+          zoomToFullSizeOnMobile: apiOptions.isMobile,
+          constrainHeight: apiOptions.isMobile,
+          allowFullBleed: apiOptions.isMobile,
+          setAssetStatus: setAssetStatus
+        });
       });
     }
     if (this.props.alt) {
@@ -27895,15 +27903,20 @@ class Graph extends React__namespace.Component {
     const imageData = this.props.backgroundImage;
     if (imageData.url) {
       const scale = this.props.box[0] / interactiveSizes$1.defaultBoxSize;
-      image =
-      /*#__PURE__*/
-      // @ts-expect-error - TS2741 - Property 'alt' is missing in type '{ src: any; width: any; height: any; scale: number; responsive: false; }' but required in type 'Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "children" | "height" | "width" | "title" | "alt" | "trackInteraction" | "preloader" | "allowFullBleed" | "extraGraphie" | "overrideAriaHidden">'.
-      React__namespace.createElement(SvgImage, {
-        src: imageData.url,
-        width: imageData.width,
-        height: imageData.height,
-        scale: scale,
-        responsive: false
+      image = /*#__PURE__*/React__namespace.createElement(context$1.Consumer, null, _ref => {
+        let {
+          setAssetStatus
+        } = _ref;
+        return /*#__PURE__*/React__namespace.createElement(SvgImage
+        // @ts-expect-error - TS2741 - Property 'alt' is missing in type '{ src: any; width: any; height: any; scale: number; responsive: false; }' but required in type 'Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "children" | "height" | "width" | "title" | "alt" | "trackInteraction" | "preloader" | "allowFullBleed" | "extraGraphie" | "overrideAriaHidden">'.
+        , {
+          src: imageData.url,
+          width: imageData.width,
+          height: imageData.height,
+          scale: scale,
+          responsive: false,
+          setAssetStatus: setAssetStatus
+        });
       });
     } else {
       image = null;
@@ -44208,7 +44221,7 @@ const init = function (options) {
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus";
-const libVersion = "13.1.0";
+const libVersion = "14.0.0";
 perseusCore.addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {
@@ -44763,7 +44776,6 @@ const ProvideKeypad = {
         // @ts-expect-error - TS2339 - Property 'props' does not exist on type '{ readonly propTypes: { readonly apiOptions: React.PropType<{ customKeypad?: boolean | undefined; nativeKeypadProxy?: ((...a: readonly any[]) => unknown) | undefined; }>; readonly keypadStyle: Requireable<any>; }; readonly getInitialState: () => { ...; }; readonly componentDidMount: () => void; readonly componentWil...'.
         ,
         style: _this.props.keypadStyle,
-        useV2Keypad: apiOptions.useV2Keypad,
         onAnalyticsEvent: async () => {
           // Intentionally left empty. This component is
           // deprecated and so we don't want/need to instrument