@khanacademy/perseus 33.2.0 → 33.2.1

package/dist/index.js

@@ -29980,7 +29980,8 @@ function LockedLabel(props) {
       left: x,
       top: y,
       color: lockedFigureColors[color],
-      fontSize: wonderBlocksTokens.font.size[size]
+      fontSize: wonderBlocksTokens.font.size[size],
+      backgroundColor: "rgba(255, 255, 255, 0.8)"
     }
   }, /*#__PURE__*/React__namespace.createElement(TeX, null, text));
 }
@@ -32188,6 +32189,17 @@ function useDraggablePx(args) {
   });
 }
 
+/**
+ * Render the Mafs graph with the specified background and graph elements.
+ *
+ * Render order (back to front):
+ * - Grid
+ * - Axis Ticks, Axis Arrows, and Axis Labels
+ * - Locked Figures
+ * - Locked Labels
+ * - Protractor
+ * - Interactive Graph Elements
+ */
 const MafsGraph = props => {
   const {
     state,
@@ -32266,8 +32278,6 @@ const MafsGraph = props => {
   }, fullGraphAriaDescription), /*#__PURE__*/React__namespace.createElement(LegacyGrid, {
     box: props.box,
     backgroundImage: props.backgroundImage
-  }), props.showLabelsFlag && props.lockedFigures && /*#__PURE__*/React__namespace.createElement(GraphLockedLabelsLayer, {
-    lockedFigures: props.lockedFigures
   }), /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
     style: {
       position: "absolute",
@@ -32297,7 +32307,24 @@ const MafsGraph = props => {
   props.markings === "graph" && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement(AxisTicks, null), /*#__PURE__*/React__namespace.createElement(AxisArrows, null)), /*#__PURE__*/React__namespace.createElement("svg", nestedSVGAttributes, props.lockedFigures && /*#__PURE__*/React__namespace.createElement(GraphLockedLayer, {
     lockedFigures: props.lockedFigures,
     range: state.range
-  }), props.showProtractor && /*#__PURE__*/React__namespace.createElement(Protractor, null), renderGraph({
+  }))), props.showLabelsFlag && props.lockedFigures && /*#__PURE__*/React__namespace.createElement(GraphLockedLabelsLayer, {
+    lockedFigures: props.lockedFigures
+  }), /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
+    style: {
+      position: "absolute"
+    }
+  }, /*#__PURE__*/React__namespace.createElement(mafs.Mafs, {
+    preserveAspectRatio: false,
+    viewBox: {
+      x: state.range[X],
+      y: state.range[Y],
+      padding: 0
+    },
+    pan: false,
+    zoom: false,
+    width: width,
+    height: height
+  }, props.showProtractor && /*#__PURE__*/React__namespace.createElement(Protractor, null), renderGraph({
     state,
     dispatch
   }))))), renderGraphControls({
@@ -43459,7 +43486,7 @@ class PhetSimulation extends React__namespace.Component {
       className: aphrodite.css(styles$6.iframeResponsive),
       src: this.state.url?.toString(),
       allow: "fullscreen"
-    })), /*#__PURE__*/React__namespace.createElement(IconButton__default["default"], {
+    })), this.state.url !== null && /*#__PURE__*/React__namespace.createElement(IconButton__default["default"], {
       icon: cornersOutIcon__default["default"],
       onClick: () => {
         this.iframeRef.current?.requestFullscreen();
@@ -43470,8 +43497,7 @@ class PhetSimulation extends React__namespace.Component {
         marginTop: 5,
         marginBottom: 5,
         alignSelf: "flex-end"
-      },
-      disabled: this.state.url === null
+      }
     }));
   }
 }
@@ -45022,7 +45048,7 @@ const init = function (options) {
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus";
-const libVersion = "33.2.0";
+const libVersion = "33.2.1";
 perseusCore.addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {