@khanacademy/perseus 22.0.0 → 22.0.2

package/dist/components/math-input.d.ts

@@ -83,6 +83,7 @@ declare class MathInput extends React.Component<Props, State> {
     }>;
     context: React.ContextType<typeof MathInputI18nContext>;
     inputRef: React.RefObject<InnerMathInput>;
+    blur(): void;
     focus(): void;
     insert(value: any): void;
     render(): JSX.Element;

package/dist/es/index.js

@@ -542,13 +542,17 @@ class MathInput extends React.Component {
     super(...args);
     this.inputRef = /*#__PURE__*/React.createRef();
   }
-  focus() {
+  blur() {
     var _this$inputRef$curren;
-    (_this$inputRef$curren = this.inputRef.current) == null || _this$inputRef$curren.focus();
+    (_this$inputRef$curren = this.inputRef.current) == null || _this$inputRef$curren.blur();
   }
-  insert(value) {
+  focus() {
     var _this$inputRef$curren2;
-    (_this$inputRef$curren2 = this.inputRef.current) == null || _this$inputRef$curren2.insert(value);
+    (_this$inputRef$curren2 = this.inputRef.current) == null || _this$inputRef$curren2.focus();
+  }
+  insert(value) {
+    var _this$inputRef$curren3;
+    (_this$inputRef$curren3 = this.inputRef.current) == null || _this$inputRef$curren3.insert(value);
   }
   render() {
     return /*#__PURE__*/React.createElement(InnerMathInput, _extends({}, this.props, {
@@ -2320,9 +2324,15 @@ class Expression extends React.Component {
       this.refs.input.focus();
     };
     this.blurInputPath = inputPath => {
+      var _this$refs$input;
       // eslint-disable-next-line react/no-string-refs
       // @ts-expect-error - TS2339 - Property 'blur' does not exist on type 'ReactInstance'.
-      this.refs.input.blur();
+      if (typeof ((_this$refs$input = this.refs.input) == null ? void 0 : _this$refs$input.blur) === "function") {
+        var _this$refs$input2;
+        // eslint-disable-next-line react/no-string-refs
+        // @ts-expect-error - TS2339 - Property 'blur' does not exist on type 'ReactInstance'.
+        (_this$refs$input2 = this.refs.input) == null || _this$refs$input2.blur();
+      }
     };
     this.getInputPaths = () => {
       // The widget itself is an input, so we return a single empty list to
@@ -21718,10 +21728,16 @@ class SimpleKeypadInput extends React.Component {
   }
 
   blur() {
+    var _this$refs$input;
+    // eslint-disable-next-line react/no-string-refs
     // @ts-expect-error - TS2339 - Property 'blur' does not exist on type 'ReactInstance'.
-    this.refs.input.blur(); // eslint-disable-line react/no-string-refs
+    if (typeof ((_this$refs$input = this.refs.input) == null ? void 0 : _this$refs$input.blur) === "function") {
+      var _this$refs$input2;
+      // eslint-disable-next-line react/no-string-refs
+      // @ts-expect-error - TS2339 - Property 'blur' does not exist on type 'ReactInstance'.
+      (_this$refs$input2 = this.refs.input) == null || _this$refs$input2.blur();
+    }
   }
-
   getValue() {
     return this.props.value;
   }
@@ -21866,9 +21882,15 @@ class InputNumber extends React.Component {
       this.refs.input.focus();
     };
     this.blurInputPath = inputPath => {
+      var _this$refs$input;
       // eslint-disable-next-line react/no-string-refs
       // @ts-expect-error - TS2339 - Property 'blur' does not exist on type 'ReactInstance'.
-      this.refs.input.blur();
+      if (typeof ((_this$refs$input = this.refs.input) == null ? void 0 : _this$refs$input.blur) === "function") {
+        var _this$refs$input2;
+        // eslint-disable-next-line react/no-string-refs
+        // @ts-expect-error - TS2339 - Property 'blur' does not exist on type 'ReactInstance'.
+        (_this$refs$input2 = this.refs.input) == null || _this$refs$input2.blur();
+      }
     };
     this.getInputPaths = () => {
       // The widget itself is an input, so we return a single empty list to
@@ -28868,6 +28890,7 @@ function scaleCommandBy(scaleFactor) {
 // don't want that.
 const arrowPath = pathBuilder().move(-3, 4).curve(-2.75, 2.5, 0, 0.25, 0.75, 0).curve(0, -0.25, -2.75, -2.5, -3, -4).scale(1.4).build();
 function Arrowhead(props) {
+  var _props$color;
   const [point] = useTransform([props.x, props.y]);
   return /*#__PURE__*/React.createElement("g", {
     transform: `translate(${point[0]} ${point[1]}) rotate(${-props.angle})`
@@ -28877,7 +28900,7 @@ function Arrowhead(props) {
     d: arrowPath,
     fill: "none",
     style: {
-      stroke: "inherit"
+      stroke: (_props$color = props.color) != null ? _props$color : "inherit"
     },
     strokeLinejoin: "round",
     strokeLinecap: "round"
@@ -29472,22 +29495,27 @@ function AxisArrows() {
   const {
     range: [[xMin, xMax], [yMin, yMax]]
   } = useGraphConfig();
+  const axisColor = "var(--mafs-fg)";
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Arrowhead, {
+    color: axisColor,
+    x: xMin,
+    y: 0,
+    angle: 180
+  }), /*#__PURE__*/React__default.createElement(Arrowhead, {
+    color: axisColor,
     x: xMax,
     y: 0,
     angle: 0
   }), /*#__PURE__*/React__default.createElement(Arrowhead, {
+    color: axisColor,
     x: 0,
     y: yMin,
-    angle: 90
-  }), /*#__PURE__*/React__default.createElement(Arrowhead, {
-    x: xMin,
-    y: 0,
-    angle: 180
+    angle: 270
   }), /*#__PURE__*/React__default.createElement(Arrowhead, {
+    color: axisColor,
     x: 0,
     y: yMax,
-    angle: 270
+    angle: 90
   }));
 }
 
@@ -29613,7 +29641,7 @@ const Grid = props => {
   return props.markings === "none" ? null : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Coordinates.Cartesian, {
     xAxis: axisOptions(props, 0),
     yAxis: axisOptions(props, 1)
-  }), props.markings === "graph" && /*#__PURE__*/React.createElement(AxisArrows, null),
+  }),
   // Only render the axis ticks and arrows if the markings are set to a full "graph"
   props.markings === "graph" && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(AxisTicks, {
     range: props.range,
@@ -43009,7 +43037,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 = "22.0.0";
+const libVersion = "22.0.2";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {