@khanacademy/perseus 17.3.0 → 17.3.2

package/dist/index.css

@@ -2795,23 +2795,11 @@ body.mobile .categorizer-container td.category input[type="radio"] + span:active
 .framework-perseus .perseus-label-image-widget-instructions div.paragraph {
   margin: 0;
 }
-.framework-perseus button[id*="perseus-label-image-widget-answer-pill"] div.paragraph,
-.framework-perseus div[id*="perseus-label-image-widget-answer-pill"] div.paragraph {
-  all: revert;
-}
-.framework-perseus button[id*="perseus-label-image-widget-answer-pill"] div.perseus-block-math-inner,
-.framework-perseus div[id*="perseus-label-image-widget-answer-pill"] div.perseus-block-math-inner {
-  margin: -5px 0 !important;
-}
 @media (max-width: 767px) {
-  [id*="perseus-label-image-widget-answer-pill"] div.paragraph {
-    all: revert;
-  }
   [id*="perseus-label-image-widget-answer-pill"] > div.perseus-renderer-responsive {
     all: revert;
   }
-  .framework-perseus.perseus-mobile [id*="perseus-label-image-widget-answer-pill"] .perseus-renderer > .paragraph,
-  .framework-perseus.perseus-mobile [id*="perseus-label-image-widget-answer-pill"] .perseus-renderer > .paragraph .paragraph {
+  .framework-perseus.perseus-mobile [id*="perseus-label-image-widget-answer-pill"] mjx-container {
     all: revert;
   }
 }

package/dist/index.js

@@ -17421,10 +17421,18 @@ class ErrorBoundary extends React__namespace.Component {
       error: error.toString()
     });
     this.props.onError?.(error, info);
-    Log.error("Perseus error boundary caught error", Errors.Internal, {
+    Log.error(
+    // NOTE(jeremy): We concatenate the error messsage here. Typical
+    // Khan Academy error handling guidance says that you should never
+    // "build" the error message that might be sent to our error
+    // reporting tool (currently Sentry). However, if we don't
+    // differentiate between the different errors that are thrown, they
+    // all end up being grouped as a single Sentry event, which is very
+    // unhelpful.
+    "Unhandled Perseus error: " + error.message, Errors.Internal, {
       cause: error,
       loggedMetadata: {
-        componentStack: info.componentStack,
+        componentStack: !!info && "componentStack" in info ? info.componentStack : "componentStack not provided",
         ...this.props.metadata
       }
     });
@@ -17439,8 +17447,9 @@ class ErrorBoundary extends React__namespace.Component {
       return /*#__PURE__*/React__namespace.createElement("svg", {
         height: "16",
         width: "16",
-        viewBox: "0 0 16 16"
-      }, /*#__PURE__*/React__namespace.createElement("path", {
+        viewBox: "0 0 16 16",
+        role: "img"
+      }, /*#__PURE__*/React__namespace.createElement("title", null, "Rendering Error!"), /*#__PURE__*/React__namespace.createElement("path", {
         d: "m8 16c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm0-3c0.55 0 1-0.45 1-1s-0.45-1-1-1-1 0.45-1 1 0.45 1 1 1zm0-9c-0.55 0-1 0.45-1 1v4c0 0.55.45 1 1 1s1-0.45 1-1v-4c0-0.55-0.45-1-1-1z",
         fill: "#d92916",
         fillRule: "evenodd"
@@ -18263,7 +18272,7 @@ class QuestionParagraph extends React__namespace.Component {
     // For perseus-article just-in-place-translation (jipt), we need
     // to attach some metadata to top-level QuestionParagraphs:
     return /*#__PURE__*/React__namespace.createElement("div", {
-      className: className,
+      className: this.props.inline ? this.props.className ?? undefined : className,
       "data-perseus-component-index": this.props.translationIndex,
       "data-perseus-paragraph-index": this.props.paragraphIndex
     }, this.props.children);
@@ -19621,7 +19630,8 @@ class Renderer extends React__namespace.Component {
       key: state.key,
       className: className,
       translationIndex: this.translationIndex,
-      paragraphIndex: state.paragraphIndex
+      paragraphIndex: state.paragraphIndex,
+      inline: this.props.inline
     }, /*#__PURE__*/React__namespace.createElement(ErrorBoundary, null, output));
   };
 
@@ -20333,12 +20343,14 @@ class Renderer extends React__namespace.Component {
     this._isTwoColumn = false;
 
     // Parse the string of markdown to a parse tree
-    const parsedMarkdown = PerseusMarkdown.parse(content, {
+    const parsedMarkdown = this.props.inline ? PerseusMarkdown.parseInline(content, {
       // Recognize crowdin IDs while translating articles
       // (This should never be hit by exercises, though if you
       // decide you want to add a check that this is an article,
       // go for it.)
       isJipt: this.translationIndex != null
+    }) : PerseusMarkdown.parse(content, {
+      isJipt: this.translationIndex != null
     });
 
     // Optionally apply the linter to the parse tree
@@ -31203,7 +31215,8 @@ const AnswerPill = props => {
         ":focus": bringToFront
       }, correct && styles$i.correct, incorrect && styles$i.incorrect]
     }, /*#__PURE__*/React__namespace.createElement(Renderer, {
-      content: answerString
+      content: answerString,
+      inline: true
     }));
   });
 };
@@ -31973,7 +31986,7 @@ class LabelImage extends React__namespace.Component {
       };
 
       const adjustPillDistance = {
-        [`margin${markerPosition.charAt(0).toUpperCase() + markerPosition.slice(1)}`]: 5 // move pill further from marker
+        [`margin${markerPosition.charAt(0).toUpperCase() + markerPosition.slice(1)}`]: 15 // move pill further from marker
       };
 
       const showAnswerChoice = !answerChoicesActive && !this.state.hideAnswers;
@@ -38453,9 +38466,12 @@ class PassageRefTarget extends React__namespace.Component {
   render() {
     return /*#__PURE__*/React__namespace.createElement(Renderer, {
       content: this.props.content
-      // @ts-expect-error - TS2322 - Type '{ content: any; inline: boolean; apiOptions: any; linterContext: any; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Renderer> & Pick<Readonly<Props> & Readonly<{ children?: ReactNode; }>, "children" | ... 3 more ... | "legacyPerseusLint"> & InexactPartial<...> & InexactPartial<...>'.
+      // This was already here before inline was recently added (#873)
+      // It was for a different use case a long time ago:
+      // https://phabricator.khanacademy.org/D12113
+      // Commenting out to prevent unanticipated side effects
+      // inline={true}
       ,
-      inline: true,
       apiOptions: this.props.apiOptions,
       linterContext: this.props.linterContext
     });
@@ -44321,7 +44337,7 @@ const init = function (options) {
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus";
-const libVersion = "17.3.0";
+const libVersion = "17.3.2";
 perseusCore.addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {