@khanacademy/perseus-editor 6.2.0 → 6.2.2

package/dist/index.js

@@ -24,10 +24,11 @@ var mathInput = require('@khanacademy/math-input');
 var wonderBlocksDropdown = require('@khanacademy/wonder-blocks-dropdown');
 var wonderBlocksForm = require('@khanacademy/wonder-blocks-form');
 var wonderBlocksTypography = require('@khanacademy/wonder-blocks-typography');
-var Switch = require('@khanacademy/wonder-blocks-switch');
+var Banner = require('@khanacademy/wonder-blocks-banner');
 var wonderBlocksAccordion = require('@khanacademy/wonder-blocks-accordion');
 var Button = require('@khanacademy/wonder-blocks-button');
 var trashIcon = require('@phosphor-icons/core/bold/trash-bold.svg');
+var Switch = require('@khanacademy/wonder-blocks-switch');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -59,13 +60,14 @@ var caretRight__default = /*#__PURE__*/_interopDefaultLegacy(caretRight);
 var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
 var ReactDOM__default = /*#__PURE__*/_interopDefaultLegacy(ReactDOM);
 var KAS__namespace = /*#__PURE__*/_interopNamespace(KAS);
-var Switch__default = /*#__PURE__*/_interopDefaultLegacy(Switch);
+var Banner__default = /*#__PURE__*/_interopDefaultLegacy(Banner);
 var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
 var trashIcon__default = /*#__PURE__*/_interopDefaultLegacy(trashIcon);
+var Switch__default = /*#__PURE__*/_interopDefaultLegacy(Switch);
 
 // This file is processed by a Rollup plugin (replace) to inject the production
 const libName = "@khanacademy/perseus-editor";
-const libVersion = "6.2.0";
+const libVersion = "6.2.2";
 perseusCore.addLibraryVersionToPerseusDebug(libName, libVersion);
 
 function _extends() {
@@ -28417,6 +28419,7 @@ function MathquillInput(props) {
   const mathFieldWrapperRef = React.useRef(null);
   const mathFieldInstance = React.useRef();
   const {
+    locale,
     strings
   } = mathInput.useMathInputI18n();
   React.useEffect(() => {
@@ -28424,7 +28427,7 @@ function MathquillInput(props) {
     // make a new Mathquill input
     if (mathFieldWrapperRef.current && !mathFieldInstance.current) {
       // Initialize MathQuill.MathField instance
-      mathFieldInstance.current = mathInput.createMathField(mathFieldWrapperRef.current, strings, baseConfig => ({
+      mathFieldInstance.current = mathInput.createMathField(mathFieldWrapperRef.current, locale, strings, baseConfig => ({
         ...baseConfig,
         handlers: {
           edit: mathField => {
@@ -30082,7 +30085,11 @@ class InteractiveGraphSettings extends React__namespace.Component {
       showProtractor: this.props.showProtractor,
       onChange: this.change,
       style: styles$k.resetSpaceTop
-    })), this.props.showRuler && /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
+    })), (this.props.showRuler || this.props.showProtractor) && /*#__PURE__*/React__namespace.createElement(Banner__default["default"], {
+      layout: "floating",
+      text: "The ruler and protractor are not accessible. Please consider an alternate approach.",
+      kind: "warning"
+    }), this.props.showRuler && /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
       style: styles$k.spaceTop
     }, /*#__PURE__*/React__namespace.createElement(LabeledRow, {
       label: "Ruler label:",
@@ -30165,7 +30172,8 @@ const styles$k = aphrodite.StyleSheet.create({
   checkboxRow: {
     flexDirection: "row",
     alignItems: "center",
-    justifyContent: "space-between"
+    justifyContent: "space-between",
+    marginBottom: wonderBlocksTokens.spacing.xSmall_8
   },
   rulerSection: {
     marginTop: wonderBlocksTokens.spacing.xSmall_8,
@@ -30361,35 +30369,6 @@ const styles$h = aphrodite.StyleSheet.create({
   }
 });
 
-const LabeledSwitch = props => {
-  const {
-    checked,
-    label,
-    style,
-    onChange
-  } = props;
-  const ids = wonderBlocksCore.useUniqueIdWithMock();
-  const switchId = ids.get("switch");
-  return /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
-    style: [styles$g.row, style]
-  }, /*#__PURE__*/React__namespace.createElement(Switch__default["default"], {
-    id: switchId,
-    checked: checked,
-    onChange: onChange
-  }), /*#__PURE__*/React__namespace.createElement(Strut, {
-    size: wonderBlocksTokens.spacing.xSmall_8
-  }), /*#__PURE__*/React__namespace.createElement(wonderBlocksTypography.LabelMedium, {
-    tag: "label",
-    htmlFor: switchId
-  }, label));
-};
-const styles$g = aphrodite.StyleSheet.create({
-  row: {
-    flexDirection: "row",
-    alignItems: "center"
-  }
-});
-
 const LockedFigureSettingsAccordion = props => {
   const {
     children,
@@ -30404,14 +30383,14 @@ const LockedFigureSettingsAccordion = props => {
   , {
     className: "locked-figure-accordion"
   }, /*#__PURE__*/React__namespace.createElement(wonderBlocksAccordion.AccordionSection, {
-    style: [styles$f.container, containerStyle],
-    headerStyle: styles$f.accordionHeader,
+    style: [styles$g.container, containerStyle],
+    headerStyle: styles$g.accordionHeader,
     header: header
   }, /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
-    style: [styles$f.accordionPanel, panelStyle]
+    style: [styles$g.accordionPanel, panelStyle]
   }, children)));
 };
-const styles$f = aphrodite.StyleSheet.create({
+const styles$g = aphrodite.StyleSheet.create({
   container: {
     backgroundColor: wonderBlocksTokens.color.fadedBlue8,
     marginTop: wonderBlocksTokens.spacing.xSmall_8
@@ -30443,16 +30422,16 @@ const LockedFigureSettingsActions = props => {
     figureAriaLabel
   } = props;
   return /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
-    style: styles$e.container
+    style: styles$f.container
   }, /*#__PURE__*/React__namespace.createElement(Button__default["default"], {
     startIcon: trashIcon__default["default"],
     "aria-label": `Delete ${figureAriaLabel}`,
     onClick: onRemove,
     kind: "tertiary",
-    style: styles$e.deleteButton
+    style: styles$f.deleteButton
   }, "Delete"));
 };
-const styles$e = aphrodite.StyleSheet.create({
+const styles$f = aphrodite.StyleSheet.create({
   container: {
     width: "100%",
     flexDirection: "row",
@@ -30465,6 +30444,35 @@ const styles$e = aphrodite.StyleSheet.create({
   }
 });
 
+const LabeledSwitch = props => {
+  const {
+    checked,
+    label,
+    style,
+    onChange
+  } = props;
+  const ids = wonderBlocksCore.useUniqueIdWithMock();
+  const switchId = ids.get("switch");
+  return /*#__PURE__*/React__namespace.createElement(wonderBlocksCore.View, {
+    style: [styles$e.row, style]
+  }, /*#__PURE__*/React__namespace.createElement(Switch__default["default"], {
+    id: switchId,
+    checked: checked,
+    onChange: onChange
+  }), /*#__PURE__*/React__namespace.createElement(Strut, {
+    size: wonderBlocksTokens.spacing.xSmall_8
+  }), /*#__PURE__*/React__namespace.createElement(wonderBlocksTypography.LabelMedium, {
+    tag: "label",
+    htmlFor: switchId
+  }, label));
+};
+const styles$e = aphrodite.StyleSheet.create({
+  row: {
+    flexDirection: "row",
+    alignItems: "center"
+  }
+});
+
 function focusWithChromeStickyFocusBugWorkaround(element) {
   // NOTE(marksandstrom) Chrome sticky focus bug.
   //
@@ -30510,7 +30518,7 @@ function getValidNumberFromString(value) {
   // If the value is not a number, return 0.
   return isNaN(parsed) ? 0 : parsed;
 }
-const DEFAULT_COLOR = "green";
+const DEFAULT_COLOR = "grayH";
 function getDefaultFigureForType(type) {
   switch (type) {
     case "point":
@@ -30530,7 +30538,6 @@ function getDefaultFigureForType(type) {
         }],
         color: DEFAULT_COLOR,
         lineStyle: "solid",
-        showArrows: false,
         showStartPoint: false,
         showEndPoint: false
       };
@@ -30679,7 +30686,6 @@ const LockedLineSettings = props => {
     points,
     color: lineColor,
     lineStyle = "solid",
-    showArrows,
     showStartPoint,
     showEndPoint,
     onChangeProps,
@@ -30780,13 +30786,7 @@ const LockedLineSettings = props => {
   }), /*#__PURE__*/React__namespace.createElement(wonderBlocksDropdown.OptionItem, {
     value: "dashed",
     label: "dashed"
-  })))), /*#__PURE__*/React__namespace.createElement(LabeledSwitch, {
-    label: "show arrows",
-    checked: showArrows,
-    onChange: newValue => onChangeProps({
-      showArrows: newValue
-    })
-  }), /*#__PURE__*/React__namespace.createElement(LockedPointSettings, _extends({
+  })))), /*#__PURE__*/React__namespace.createElement(LockedPointSettings, _extends({
     label: "Start point",
     toggled: showStartPoint
   }, startPoint, {