@khanacademy/perseus-editor 6.5.1 → 6.7.0

package/dist/components/locked-figure-settings.d.ts

@@ -8,6 +8,7 @@
 import type { Props as LockedLineProps } from "./locked-line-settings";
 import type { Props as LockedPointProps } from "./locked-point-settings";
 export type AccordionProps = {
+    showM2Features?: boolean;
     /**
      * Whether this accordion is expanded.
      */

package/dist/components/locked-figures-section.d.ts

@@ -2,6 +2,7 @@
 import type { Props as InteractiveGraphEditorProps } from "../widgets/interactive-graph-editor";
 import type { LockedFigure } from "@khanacademy/perseus";
 type Props = {
+    showM2Features?: boolean;
     figures?: Array<LockedFigure>;
     onChange: (props: Partial<InteractiveGraphEditorProps>) => void;
 };

package/dist/es/index.js

@@ -14,7 +14,7 @@ import { PhosphorIcon } from '@khanacademy/wonder-blocks-icon';
 import caretRight from '@phosphor-icons/core/bold/caret-right-bold.svg';
 import classNames from 'classnames';
 import ReactDOM from 'react-dom';
-import { point, number } from '@khanacademy/kmath';
+import { point, vector, number } from '@khanacademy/kmath';
 import * as KAS from '@khanacademy/kas';
 import { isTruthy, UnreachableCaseError } from '@khanacademy/wonder-stuff-core';
 import { useMathInputI18n, createMathField } from '@khanacademy/math-input';
@@ -29,7 +29,7 @@ import trashIcon from '@phosphor-icons/core/bold/trash-bold.svg';
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus-editor";
-const libVersion = "6.5.1";
+const libVersion = "6.7.0";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 function _extends() {
@@ -30642,7 +30642,9 @@ const LockedLineSettings = props => {
   const capitalizeKind = kind.charAt(0).toUpperCase() + kind.slice(1);
   const lineLabel = `${capitalizeKind} (${point1.coord[0]},
         ${point1.coord[1]}), (${point2.coord[0]}, ${point2.coord[1]})`;
-  const isInvalid = point1.coord[0] === point2.coord[0] && point1.coord[1] === point2.coord[1];
+
+  // Check if the line has length 0.
+  const isInvalid = vector.equal(point1.coord, point2.coord);
   function handleChangePoint(newPointProps, index) {
     const newPoints = [...points];
     newPoints[index] = _extends({}, points[index], newPointProps);
@@ -30916,6 +30918,15 @@ function getDefaultFigureForType(type) {
         showPoint1: false,
         showPoint2: false
       };
+    case "circle":
+      return {
+        type: "circle",
+        center: [0, 0],
+        radius: 1,
+        color: DEFAULT_COLOR,
+        fillStyle: "none",
+        strokeStyle: "solid"
+      };
     default:
       throw new UnreachableCaseError(type);
   }
@@ -30970,18 +30981,27 @@ const LockedFiguresSection = props => {
   const allCollapsed = expandedStates.every(value => !value);
   const buttonLabel = allCollapsed ? "Expand all" : "Collapse all";
   const showExpandButton = !!(figures != null && figures.length);
-  return /*#__PURE__*/React.createElement(View, null, figures == null ? void 0 : figures.map((figure, index) => /*#__PURE__*/React.createElement(LockedFigureSettings, _extends({
-    expanded: expandedStates[index],
-    onToggle: newValue => {
-      const newExpanded = [...expandedStates];
-      newExpanded[index] = newValue;
-      setExpandedStates(newExpanded);
-    },
-    key: `${uniqueId}-locked-${figure}-${index}`
-  }, figure, {
-    onChangeProps: newProps => changeProps(index, newProps),
-    onRemove: () => removeLockedFigure(index)
-  }))), /*#__PURE__*/React.createElement(View, {
+  return /*#__PURE__*/React.createElement(View, null, figures == null ? void 0 : figures.map((figure, index) => {
+    if (figure.type === "circle") {
+      // TODO(LEMS-1941): Implement circle locked figure settings.
+      // Remove this block once circle locked figure settings are
+      // implemented.
+      return;
+    }
+    return /*#__PURE__*/React.createElement(LockedFigureSettings, _extends({
+      showM2Features: props.showM2Features,
+      expanded: expandedStates[index],
+      onToggle: newValue => {
+        const newExpanded = [...expandedStates];
+        newExpanded[index] = newValue;
+        setExpandedStates(newExpanded);
+      },
+      key: `${uniqueId}-locked-${figure}-${index}`
+    }, figure, {
+      onChangeProps: newProps => changeProps(index, newProps),
+      onRemove: () => removeLockedFigure(index)
+    }));
+  }), /*#__PURE__*/React.createElement(View, {
     style: styles$c.buttonContainer
   }, /*#__PURE__*/React.createElement(LockedFigureSelect, {
     id: `${uniqueId}-select`,
@@ -31079,13 +31099,25 @@ class InteractiveGraphEditor extends React.Component {
         correct: correct
       });
     };
+    this.getSaveWarnings = () => {
+      const issues = [];
+
+      // A locked line on the graph cannot have length 0.
+      for (const figure of (_this$props$lockedFig = this.props.lockedFigures) != null ? _this$props$lockedFig : []) {
+        var _this$props$lockedFig;
+        if (figure.type === "line" && vector.equal(figure.points[0].coord, figure.points[1].coord)) {
+          issues.push("The line cannot have length 0.");
+        }
+      }
+      return issues;
+    };
   }
   // TODO(jangmi, CP-3288): Remove usage of `UNSAFE_componentWillMount`
   UNSAFE_componentWillMount() {
     DeprecationMixin.UNSAFE_componentWillMount.call(this);
   }
   render() {
-    var _this$props$graph$typ, _this$props$graph, _this$props$correct, _this$props$correct2, _this$props$correct3, _this$props$correct4, _this$props$correct5, _this$props$correct6, _this$props$correct7, _this$props$correct8, _this$props$correct9, _this$props$correct10, _this$props$correct11, _this$props$apiOption, _this$props$apiOption2;
+    var _this$props$graph$typ, _this$props$graph, _this$props$correct, _this$props$correct2, _this$props$correct3, _this$props$correct4, _this$props$correct5, _this$props$correct6, _this$props$correct7, _this$props$correct8, _this$props$correct9, _this$props$correct10, _this$props$correct11, _this$props$apiOption, _this$props$apiOption2, _this$props$apiOption3;
     let graph;
     let equationString;
     const gridStep = this.props.gridStep || Util.getGridStep(this.props.range, this.props.step, interactiveSizes.defaultBoxSize);
@@ -31337,6 +31369,7 @@ class InteractiveGraphEditor extends React.Component {
     // Only show the "Add locked figure" dropdown if the graph
     // is using Mafs.
     this.props.graph && ((_this$props$apiOption = this.props.apiOptions) == null || (_this$props$apiOption = _this$props$apiOption.flags) == null || (_this$props$apiOption = _this$props$apiOption.mafs) == null ? void 0 : _this$props$apiOption["interactive-graph-locked-features-m1"]) && ((_this$props$apiOption2 = this.props.apiOptions) == null || (_this$props$apiOption2 = _this$props$apiOption2.flags) == null || (_this$props$apiOption2 = _this$props$apiOption2.mafs) == null ? void 0 : _this$props$apiOption2[this.props.graph.type]) && /*#__PURE__*/React.createElement(LockedFiguresSection, {
+      showM2Features: (_this$props$apiOption3 = this.props.apiOptions) == null || (_this$props$apiOption3 = _this$props$apiOption3.flags) == null || (_this$props$apiOption3 = _this$props$apiOption3.mafs) == null ? void 0 : _this$props$apiOption3["interactive-graph-locked-features-m2"],
       figures: this.props.lockedFigures,
       onChange: this.props.onChange
     }));