@khanacademy/perseus 19.7.0 → 19.7.1

package/dist/index.css

@@ -4323,7 +4323,10 @@ html body .mq-editable-field .mq-selection .mq-nthroot-container * {
  */
 .MafsView {
     --mafs-bg: transparent;
-    --mafs-fg: #21242c; /* WB color.offBlack */
+    --mafs-fg: rgb(33, 36, 44); /* WB color.offBlack */
+
+    --mafs-line-color: var(--mafs-fg);
+    --grid-line-subdivision-color: rgba(33, 36, 44, 0.16);
 
     --mafs-blue: #1865f2; /* WB color.blue */
     --mafs-red: #d92916; /* WB color.red */

package/dist/index.js

@@ -29165,7 +29165,7 @@ const MafsGraph = /*#__PURE__*/React__namespace.forwardRef((props, ref) => {
   React__namespace.useImperativeHandle(ref, () => ({
     getUserInput: () => graphRef.current
   }));
-  const [width, height] = getInteractiveBoxFromSizeClass(props.containerSizeClass);
+  const [width, height] = props.box;
   const legacyGrid = getLegacyGrid([width, height], props.backgroundImage);
   return /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
     style: {
@@ -29189,7 +29189,7 @@ const MafsGraph = /*#__PURE__*/React__namespace.forwardRef((props, ref) => {
     zoom: false,
     width: width,
     height: height
-  }, !!legacyGrid && /*#__PURE__*/React__namespace.createElement(Grid, props), renderGraph({
+  }, !legacyGrid && /*#__PURE__*/React__namespace.createElement(Grid, props), renderGraph({
     ...props,
     onGraphChange: handleGraphUpdate
   }))));
@@ -30389,13 +30389,19 @@ class InteractiveGraph extends React__namespace.Component {
   // const segment: boolean = useFeatureIsOn("mafs-segment-graph");
   // <Renderer apiOptions={{flags: {mafs: {segment}}}}
   render() {
+    const box = getInteractiveBoxFromSizeClass(this.props.containerSizeClass);
+    const gridStep = this.props.gridStep || Util.getGridStep(this.props.range, this.props.step, box[0]);
+    const snapStep = this.props.snapStep || Util.snapStepFromGridStep(gridStep);
+
     // Mafs shim
     if (this.props.apiOptions?.flags?.["mafs"]?.[this.props.graph.type]) {
       return /*#__PURE__*/React__namespace.createElement(MafsGraph, _extends({}, this.props, {
-        ref: this.mafsRef
+        ref: this.mafsRef,
+        gridStep: gridStep,
+        snapStep: snapStep,
+        box: box
       }));
     }
-    const box = getInteractiveBoxFromSizeClass(this.props.containerSizeClass);
     let instructions;
     // isClickToAddPoints() only applies to points and polygons
     if (this.isClickToAddPoints() && this.state.shouldShowInstructions) {
@@ -30411,8 +30417,6 @@ class InteractiveGraph extends React__namespace.Component {
     if (this.isClickToAddPoints()) {
       onMouseDown = this.handleAddPointsMouseDown;
     }
-    const gridStep = this.props.gridStep || Util.getGridStep(this.props.range, this.props.step, box[0]);
-    const snapStep = this.props.snapStep || Util.snapStepFromGridStep(gridStep);
     const isMobile = this.props.apiOptions.isMobile;
     return /*#__PURE__*/React__namespace.createElement("div", {
       className: "perseus-widget " + "perseus-widget-interactive-graph",
@@ -42258,7 +42262,7 @@ const init = function (options) {
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus";
-const libVersion = "19.7.0";
+const libVersion = "19.7.1";
 perseusCore.addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {