@khanacademy/perseus 17.3.2 → 17.4.0

package/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @khanacademy/perseus
 
+## 17.4.0
+
+### Minor Changes
+
+-   [#902](https://github.com/Khan/perseus/pull/902) [`c9db8185`](https://github.com/Khan/perseus/commit/c9db818510e2e0fd142c23298890dcad89a7549a) Thanks [@SonicScrewdriver](https://github.com/SonicScrewdriver)! - Updated OnFocusChange method to return the keypadHeight rather than the DOMNode
+
+### Patch Changes
+
+-   [#887](https://github.com/Khan/perseus/pull/887) [`d09fdb98`](https://github.com/Khan/perseus/commit/d09fdb98963f23dbeb2009518513db671e0f09bb) Thanks [@jeremywiebe](https://github.com/jeremywiebe)! - Export `PerseusItem` type which represents an exercise question
+
+## 17.3.3
+
+### Patch Changes
+
+-   [#876](https://github.com/Khan/perseus/pull/876) [`fdc00c90`](https://github.com/Khan/perseus/commit/fdc00c90a19d3e241b3a5cdc2b1df5d761b24af3) Thanks [@jeremywiebe](https://github.com/jeremywiebe)! - Adjust CSS to ensure all `code` and `pre` blocks rendered by Perseus have a monospace font and common styling
+
 ## 17.3.2
 
 ### Patch Changes

package/dist/es/index.css

@@ -1490,6 +1490,18 @@ body.mobile ul.inequalities-one-line-radios > li {
   clear: both;
 }
 /* Fall back colors? Eg educator, talks & interviews */
+.framework-perseus code {
+  font-family: Courier, monospace;
+}
+.framework-perseus pre {
+  background-color: #f0f1f2;
+  border-radius: 4px;
+  color: #21242c;
+  font-size: 18px;
+  padding: 16px;
+  white-space: pre;
+  overflow: auto;
+}
 .framework-perseus.perseus-article:not(.perseus-mobile) .perseus-widget-container:not(.perseus-widget__definition) {
   font-size: 14px;
   line-height: 19.6px;
@@ -1634,17 +1646,7 @@ body.mobile ul.inequalities-one-line-radios > li {
   line-height: 1.5;
   margin: 0;
 }
-.framework-perseus.perseus-article:not(.perseus-mobile) code {
-  font-family: Courier, monospace;
-}
 .framework-perseus.perseus-article:not(.perseus-mobile) pre {
-  background-color: #f0f1f2;
-  border-radius: 4px;
-  color: #21242c;
-  font-size: 18px;
-  padding: 16px;
-  white-space: pre;
-  overflow: auto;
   margin: 0 -16px 32px -16px;
 }
 .framework-perseus:not(.perseus-article):not(.perseus-mobile) .perseus-radio-option-content .perseus-renderer > .paragraph {

package/dist/es/index.js

@@ -44202,7 +44202,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 = "17.3.2";
+const libVersion = "17.4.0";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {
@@ -44258,9 +44258,6 @@ class ArticleRenderer extends React.Component {
         });
         focusedInput = this.sectionRenderers[sectionIndex].getDOMNodeForPath(focusPath);
       }
-      if (this.props.apiOptions.onFocusChange != null) {
-        this.props.apiOptions.onFocusChange(this._currentFocus, prevFocusPath, didFocusInput ? keypadElement == null ? void 0 : keypadElement.getDOMNode() : null, didFocusInput ? focusedInput : null);
-      }
       if (keypadElement && isMobile) {
         if (didFocusInput) {
           keypadElement.activate();
@@ -44268,6 +44265,11 @@ class ArticleRenderer extends React.Component {
           keypadElement.dismiss();
         }
       }
+      if (this.props.apiOptions.onFocusChange != null) {
+        const keypadDomNode = keypadElement == null ? void 0 : keypadElement.getDOMNode();
+        const keypadHeight = keypadDomNode && didFocusInput ? keypadDomNode.getBoundingClientRect().height : 0;
+        this.props.apiOptions.onFocusChange(this._currentFocus, prevFocusPath, keypadHeight, didFocusInput ? focusedInput : null);
+      }
     };
     this._onRendererBlur = blurPath => {
       const blurringFocusPath = this._currentFocus;
@@ -44833,11 +44835,6 @@ class ServerItemRenderer extends React.Component {
     const didFocusInput = this._currentFocus && inputPaths.some(inputPath => {
       return Util.inputPathsEqual(inputPath, this._currentFocus);
     });
-    if (onFocusChange != null) {
-      onFocusChange(this._currentFocus, prevFocus, didFocusInput ? keypadElement == null ? void 0 : keypadElement.getDOMNode() : null,
-      // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'false | Element | Text | null | undefined' is not assignable to parameter of type 'HTMLElement | undefined'.
-      didFocusInput && this.questionRenderer.getDOMNodeForPath(newFocus));
-    }
     if (keypadElement && isMobile) {
       if (didFocusInput) {
         keypadElement.activate();
@@ -44845,6 +44842,16 @@ class ServerItemRenderer extends React.Component {
         keypadElement.dismiss();
       }
     }
+    if (onFocusChange != null) {
+      // First, calculate the current keypad height
+      const keypadDomNode = keypadElement == null ? void 0 : keypadElement.getDOMNode();
+      const keypadHeight = keypadDomNode && didFocusInput ? keypadDomNode.getBoundingClientRect().height : 0;
+
+      // Then call the callback
+      onFocusChange(this._currentFocus, prevFocus, keypadHeight,
+      // @ts-expect-error [FEI-5003] - TS2345 - Argument of type 'false | Element | Text | null | undefined' is not assignable to parameter of type 'HTMLElement | undefined'.
+      didFocusInput && this.questionRenderer.getDOMNodeForPath(newFocus));
+    }
   }
   _onRendererBlur(blurPath) {
     const blurringFocusPath = this._currentFocus;