@khanacademy/perseus 19.6.0 → 19.6.2

package/dist/es/index.js

@@ -24184,13 +24184,6 @@ class Categorizer extends React.Component {
     this.getUserInput = () => {
       return Categorizer.getUserInputFromProps(this.props);
     };
-    this.onChange = (itemNum, catNum) => {
-      const values = [...this.props.values];
-      // @ts-expect-error - TS2322 - Type 'number' is not assignable to type 'never'.
-      values[itemNum] = catNum;
-      this.change("values", values);
-      this.props.trackInteraction();
-    };
     this.simpleValidate = rubric => {
       return Categorizer.validate(this.getUserInput(), rubric);
     };
@@ -24242,18 +24235,14 @@ class Categorizer extends React.Component {
         }, /*#__PURE__*/React.createElement("div", {
           className: ClassNames.INTERACTIVE,
           role: "button",
-          "aria-label": catName
-          // eslint-disable-next-line react/jsx-no-bind
-          ,
-          onClick: this.onChange.bind(this, itemNum, catNum)
+          "aria-label": catName,
+          onClick: () => this.onChange(itemNum, catNum)
         }, isMobile && /*#__PURE__*/React.createElement("input", {
           type: "radio",
           name: uniqueId,
           className: css(sharedStyles.responsiveInput, sharedStyles.responsiveRadioInput),
-          checked: selected
-          // eslint-disable-next-line react/jsx-no-bind
-          ,
-          onChange: this.onChange.bind(this, itemNum, catNum),
+          checked: selected,
+          onChange: () => this.onChange(itemNum, catNum),
           onClick: e => e.stopPropagation()
         }), !isMobile && /*#__PURE__*/React.createElement("span", {
           className: css(styles$r.radioSpan, selected && styles$r.checkedRadioSpan, this.props.static && selected && styles$r.staticCheckedRadioSpan)
@@ -24273,10 +24262,17 @@ class Categorizer extends React.Component {
       className: extraClassNames + " " + css(...inlineStyles)
     }, table);
   }
+  onChange(itemNum, catNum) {
+    const values = [...this.props.values];
+    // @ts-expect-error - TS2322 - Type 'number' is not assignable to type 'never'.
+    values[itemNum] = catNum;
+    this.change("values", values);
+    this.props.trackInteraction();
+  }
   static validate(userInput, rubric) {
     let completed = true;
     let allCorrect = true;
-    _.each(rubric.values, function (value, i) {
+    rubric.values.forEach((value, i) => {
       if (userInput.values[i] == null) {
         completed = false;
       }
@@ -24844,22 +24840,19 @@ class Explanation extends React.Component {
     };
   }
   render() {
-    const {
-      Link
-    } = this.props.apiOptions.baseElements;
     const {
       isArticle,
       isMobile
     } = this.props.apiOptions;
-    const linkAnchor = this.state.expanded ? this.props.hidePrompt : this.props.showPrompt;
-    let linkContainer;
+    const promptText = this.state.expanded ? this.props.hidePrompt : this.props.showPrompt;
+    let promptContainer;
 
     // TODO(diedra): This isn't a valid href;
     // change this to a button that looks like a link.
     const href = "javascript:void(0)";
     const onClick = this._onClick;
     if (isMobile) {
-      linkContainer = /*#__PURE__*/React.createElement("div", {
+      promptContainer = /*#__PURE__*/React.createElement("div", {
         className: css(styles$o.linkContainer)
       }, /*#__PURE__*/React.createElement("a", {
         className: css(styles$o.mobileExplanationLink),
@@ -24867,7 +24860,7 @@ class Explanation extends React.Component {
         onClick: onClick,
         role: "button",
         "aria-expanded": this.state.expanded
-      }, linkAnchor), this.state.expanded && /*#__PURE__*/React.createElement("svg", {
+      }, promptText), this.state.expanded && /*#__PURE__*/React.createElement("svg", {
         className: css(styles$o.disclosureArrow)
       }, /*#__PURE__*/React.createElement("polygon", {
         style: {
@@ -24876,41 +24869,18 @@ class Explanation extends React.Component {
         points: `0,${arrowHeight} ` + `${arrowWidth},${arrowHeight} ` + `${arrowWidth / 2},0`
       })));
     } else {
-      if (isArticle) {
-        // NOTE: For articles, the baseElements `Link` may is either be
-        // an anchor tag (if rendered in a modal) or a Wonder Blocks
-        // link component in lesson page, see: `article-page.jsx`.
-        linkContainer = /*#__PURE__*/React.createElement("div", {
-          className: css(styles$o.linkContainer, styles$o.articleLink)
-        }, /*#__PURE__*/React.createElement(Link, {
-          className: css(styles$o.explanationLink)
-          // HACK(michaelpolyak): WB Link doesn't passthrough
-          // class name.
-          ,
-          style: styles$o.explanationLink,
-          href: href,
-          onClick: onClick,
-          role: "button",
-          "aria-expanded": this.state.expanded
-        }, `[${linkAnchor}]`));
-      } else {
-        // NOTE: For exercises, the baseElements `Link` is an
-        // anchor tag, see: `perseus-api.jsx`.
-        linkContainer = /*#__PURE__*/React.createElement("div", {
-          className: css(styles$o.linkContainer, styles$o.exerciseLink)
-        }, /*#__PURE__*/React.createElement(Link, {
-          className: css(styles$o.explanationLink),
-          href: href,
-          onClick: onClick,
-          role: "button",
-          "aria-expanded": this.state.expanded
-        }, `[${linkAnchor}]`));
-      }
+      const viewStyling = isArticle ? [styles$o.explanationLink, styles$o.articleLink] : [styles$o.explanationLink, styles$o.exerciseLink];
+      promptContainer = /*#__PURE__*/React.createElement(Clickable, {
+        onClick: onClick,
+        "aria-expanded": this.state.expanded
+      }, () => /*#__PURE__*/React.createElement(View, {
+        style: viewStyling
+      }, `[${promptText}]`));
     }
     const expandedStyle = isMobile ? styles$o.contentExpandedMobile : styles$o.contentExpanded;
     return /*#__PURE__*/React.createElement("div", {
       className: css(styles$o.container)
-    }, linkContainer, this.state.expanded && /*#__PURE__*/React.createElement("div", {
+    }, promptContainer, this.state.expanded && /*#__PURE__*/React.createElement("div", {
       className: css(styles$o.content, isMobile && styles$o.contentMobile, this.state.expanded && expandedStyle)
       // eslint-disable-next-line react/no-string-refs
       ,
@@ -41580,7 +41550,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 = "19.6.0";
+const libVersion = "19.6.2";
 addLibraryVersionToPerseusDebug(libName, libVersion);
 
 const apiVersion = {