@khanacademy/perseus 11.1.0 → 11.3.0

package/CHANGELOG.md

@@ -1,5 +1,41 @@
 # @khanacademy/perseus
 
+## 11.3.0
+
+### Minor Changes
+
+-   26fc0b41: Updated ErrorBoundary logging to include the componentStack as well as the widget type as metadata.
+
+### Patch Changes
+
+-   Updated dependencies [a5a60852]
+    -   @khanacademy/math-input@12.1.0
+
+## 11.2.1
+
+### Patch Changes
+
+-   a383823d: Bump @khanacademy/wonder-stuff-core to v1.5.1 (which adds needed support for `isTruthy` helper function)
+-   Updated dependencies [a383823d]
+    -   @khanacademy/math-input@12.0.1
+    -   @khanacademy/perseus-linter@0.3.3
+    -   @khanacademy/pure-markdown@0.2.5
+
+## 11.2.0
+
+### Minor Changes
+
+-   9ff8a575: Fix image widget caption styling
+-   1b618343: Add new Perseus analytics event: 'perseus:expression-focused'. This event is fired any time the expression widget input box receives focus.
+
+### Patch Changes
+
+-   Updated dependencies [fa5f463b]
+-   Updated dependencies [fa1bb6b4]
+-   Updated dependencies [6d8ede65]
+-   Updated dependencies [3afc0da2]
+    -   @khanacademy/math-input@12.0.0
+
 ## 11.1.0
 
 ### Minor Changes

package/dist/error-boundary.d.ts

@@ -1,6 +1,7 @@
 import * as React from "react";
 type Props = {
     children: React.ReactNode;
+    metadata?: Record<string, string>;
 };
 type State = {
     error: string;

package/dist/es/index.css

@@ -1607,7 +1607,6 @@ body.mobile ul.inequalities-one-line-radios > li {
   font-size: 14px;
   line-height: 19px;
   margin: 16px auto 42px;
-  max-width: 455px;
   text-align: left;
 }
 .framework-perseus.perseus-article:not(.perseus-mobile) .paragraph.perseus-paragraph-full-width {
@@ -2807,7 +2806,6 @@ body.mobile .categorizer-container td.category input[type="radio"] + span:active
 }
 .perseus-image-widget .perseus-image-caption {
   color: rgba(33, 36, 44, 0.7);
-  max-width: 420px;
   padding-left: 16px;
   position: relative;
   top: -12px;

package/dist/es/index.js

@@ -2552,6 +2552,11 @@ class Expression extends React.Component {
       this.props.trackInteraction();
     };
     this._handleFocus = () => {
+      this.props.analytics.onAnalyticsEvent({
+        type: "perseus:expression-focused",
+        payload: null
+      });
+
       /* c8 ignore next */
       this.props.onFocus([]);
     };
@@ -17724,9 +17729,9 @@ class ErrorBoundary extends React.Component {
     });
     Log.error("Perseus error boundary caught error", Errors.Internal, {
       cause: error,
-      loggedMetadata: {
-        info: info.toString()
-      }
+      loggedMetadata: _extends({
+        componentStack: info.componentStack
+      }, this.props.metadata)
     });
   }
   render() {
@@ -19316,7 +19321,11 @@ class Renderer extends React.Component {
         // filtered out in this.render(), so we shouldn't have to
         // worry about using this widget key and ref:
         return /*#__PURE__*/React.createElement(ErrorBoundary, {
-          key: "container:" + id
+          key: "container:" + id,
+          metadata: {
+            widget_type: type,
+            widget_id: id
+          }
         }, /*#__PURE__*/React.createElement(WidgetContainer, {
           ref: "container:" + id,
           type: type,
@@ -26706,7 +26715,10 @@ class ImageWidget extends React.Component {
         // Aphrodite.
         const minWidth = isImageFullWidth ? null : "0 !important";
         titleAndCaption = /*#__PURE__*/React.createElement("figcaption", {
-          className: className
+          className: className,
+          style: {
+            maxWidth: backgroundImage.width
+          }
         }, /*#__PURE__*/React.createElement("div", {
           style: {
             // @ts-expect-error - TS2322 - Type 'string | null' is not assignable to type 'MinWidth<string | number> | undefined'.
@@ -26735,7 +26747,10 @@ class ImageWidget extends React.Component {
     }
     if (this.props.caption) {
       caption = /*#__PURE__*/React.createElement("figcaption", {
-        className: "perseus-image-caption"
+        className: "perseus-image-caption",
+        style: {
+          maxWidth: backgroundImage.width
+        }
       }, /*#__PURE__*/React.createElement(Renderer, {
         content: this.props.caption,
         apiOptions: apiOptions,
@@ -44406,7 +44421,12 @@ 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
+        useV2Keypad: apiOptions.useV2Keypad,
+        onAnalyticsEvent: async () => {
+          // Intentionally left empty. This component is
+          // deprecated and so we don't want/need to instrument
+          // it.
+        }
       }), _this._keypadContainer);
     }
   },