@pie-element/passage 2.21.4-next.3 → 2.21.5-next.16

package/lib/stimulus-tabs.js

@@ -83,6 +83,10 @@ var styles = function styles(theme) {
   };
 };
 
+var getContent = function getContent(html) {
+  return (html || '').replace(/(<(?!img|iframe)([^>]+)>)/gi, '');
+};
+
 var StimulusTabs = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2["default"])(StimulusTabs, _React$Component);
 
@@ -195,10 +199,10 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
 
   (0, _createClass2["default"])(StimulusTabs, [{
     key: "renderInstructions",
-    value: function renderInstructions(showTeacherInstructions, teacherInstructions) {
-      var disabledTabs = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : false;
+    value: function renderInstructions(teacherInstructions) {
+      var disabledTabs = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
 
-      if (!showTeacherInstructions || !teacherInstructions) {
+      if (!getContent(teacherInstructions)) {
         return;
       }
 
@@ -222,7 +226,7 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
     }
   }, {
     key: "renderTab",
-    value: function renderTab(tab, showTeacherInstructions, disabledTabs) {
+    value: function renderTab(tab, disabledTabs) {
       var classes = this.props.classes;
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _classnames["default"])(classes.passage, 'passage'),
@@ -230,22 +234,22 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
         id: "tabpanel-".concat(tab.id),
         role: "tabpanel",
         "aria-labelledby": "button-".concat(tab.id)
-      }, this.renderInstructions(showTeacherInstructions, tab.teacherInstructions, disabledTabs), /*#__PURE__*/_react["default"].createElement("h2", null, /*#__PURE__*/_react["default"].createElement("div", {
+      }, this.renderInstructions(tab.teacherInstructions, disabledTabs), (getContent(tab.title) || getContent(tab.subtitle)) && /*#__PURE__*/_react["default"].createElement("h2", null, getContent(tab.title) && /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _classnames["default"])(classes.passageTitle, 'title'),
         dangerouslySetInnerHTML: {
           __html: this.parsedText(tab.title)
         }
-      }), /*#__PURE__*/_react["default"].createElement("div", {
+      }), getContent(tab.subtitle) && /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _classnames["default"])(classes.passageSubtitle, 'subtitle'),
         dangerouslySetInnerHTML: {
           __html: this.parsedText(tab.subtitle)
         }
-      })), /*#__PURE__*/_react["default"].createElement("div", {
+      })), getContent(tab.author) && /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _classnames["default"])(classes.passageAuthor, 'author'),
         dangerouslySetInnerHTML: {
           __html: this.parsedText(tab.author)
         }
-      }), /*#__PURE__*/_react["default"].createElement("div", {
+      }), getContent(tab.text) && /*#__PURE__*/_react["default"].createElement("div", {
         key: tab.id,
         className: (0, _classnames["default"])(classes.passageText, 'text'),
         dangerouslySetInnerHTML: {
@@ -261,8 +265,7 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
       var _this$props = this.props,
           classes = _this$props.classes,
           tabs = _this$props.tabs,
-          disabledTabs = _this$props.disabledTabs,
-          showTeacherInstructions = _this$props.showTeacherInstructions;
+          disabledTabs = _this$props.disabledTabs;
       var activeTab = this.state.activeTab;
 
       if (!(tabs !== null && tabs !== void 0 && tabs.length)) {
@@ -275,7 +278,7 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _classnames["default"])(classes.passages, 'passages')
       }, disabledTabs || tabs.length === 1 ? tabs.map(function (tab) {
-        return _this2.renderTab(tab, showTeacherInstructions, disabledTabs);
+        return _this2.renderTab(tab, disabledTabs);
       }) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_Tabs["default"], {
         classes: {
           root: classes.stickyTabs,
@@ -290,7 +293,7 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
           id: "button-".concat(tab.id),
           label: /*#__PURE__*/_react["default"].createElement("span", {
             dangerouslySetInnerHTML: {
-              __html: _this2.parsedText(tab.title)
+              __html: _this2.parsedText(tab.label)
             }
           }),
           value: tab.id,
@@ -304,7 +307,7 @@ var StimulusTabs = /*#__PURE__*/function (_React$Component) {
             return _this2.handleKeyDown(event, tab.id);
           }
         });
-      })), selectedTab ? this.renderTab(selectedTab, showTeacherInstructions, disabledTabs) : null));
+      })), selectedTab ? this.renderTab(selectedTab, disabledTabs) : null));
     }
   }]);
   return StimulusTabs;
@@ -314,14 +317,14 @@ StimulusTabs.propTypes = {
   classes: _propTypes["default"].object.isRequired,
   tabs: _propTypes["default"].arrayOf(_propTypes["default"].shape({
     id: _propTypes["default"].number.isRequired,
+    label: _propTypes["default"].string.isRequired,
     title: _propTypes["default"].string.isRequired,
     subtitle: _propTypes["default"].string,
     author: _propTypes["default"].string,
     text: _propTypes["default"].string.isRequired,
     teacherInstructions: _propTypes["default"].string
   }).isRequired).isRequired,
-  disabledTabs: _propTypes["default"].bool,
-  showTeacherInstructions: _propTypes["default"].bool
+  disabledTabs: _propTypes["default"].bool
 };
 
 var _default = (0, _styles.withStyles)(styles)(StimulusTabs);

package/lib/stimulus-tabs.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/stimulus-tabs.jsx"],"names":["styles","theme","passages","flexGrow","backgroundColor","color","background","text","passage","padding","spacing","unit","passageTitle","fontSize","passageSubtitle","passageAuthor","passageText","stickyTabs","position","top","tab","palette","common","white","black","tabButton","teacherInstructions","marginBottom","StimulusTabs","activeTab","event","setState","setTimeout","tabChangeEvent","CustomEvent","detail","window","dispatchEvent","currentTabId","key","tabs","props","newTabIndex","currentIndex","findIndex","id","length","preventDefault","handleChange","document","getElementById","focus","div","createElement","innerHTML","replace","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","showTeacherInstructions","disabledTabs","teacherInstructionsDiv","hidden","visible","classes","renderInstructions","__html","parsedText","title","subtitle","author","state","selectedTab","find","map","renderTab","root","flexContainer","handleKeyDown","React","Component","propTypes","PropTypes","object","isRequired","arrayOf","shape","number","string","bool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Tabs from '@material-ui/core/Tabs';\nimport Tab from '@material-ui/core/Tab';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Collapsible, color, PreviewPrompt } from '@pie-lib/pie-toolbox/render-ui';\nimport classNames from 'classnames';\n\nconst styles = (theme) => ({\n  passages: {\n    flexGrow: 1,\n    backgroundColor: color.background(),\n    color: color.text(),\n  },\n  passage: {\n    backgroundColor: color.background(),\n    color: color.text(),\n    padding: theme.spacing.unit * 2,\n  },\n  passageTitle: {\n    fontSize: '1.75rem',\n  },\n  passageSubtitle: {\n    fontSize: '1.5rem',\n  },\n  passageAuthor: {\n    fontSize: '1.25rem',\n  },\n  passageText: {},\n  stickyTabs: {\n    background: color.background(),\n    position: 'sticky',\n    top: 0,\n  },\n  tab: {\n    background: theme.palette.common.white, // replace with color.background() once PD-2801 is DONE\n    fontSize: 'inherit',\n    color: theme.palette.common.black, // remove when PD-2801 is DONE\n  },\n  tabButton: {\n    background: theme.palette.common.white, // replace with color.background() once PD-2801 is DONE\n  },\n  teacherInstructions: {\n    marginBottom: theme.spacing.unit * 2,\n  },\n});\n\nclass StimulusTabs extends React.Component {\n  state = {\n    activeTab: 0,\n  };\n\n  handleChange = (event, activeTab) => {\n    this.setState(() => ({ activeTab }));\n\n    setTimeout(() => {\n      const tabChangeEvent = new CustomEvent('pie-ui-passage-tabChanged', {\n        detail: { tab: activeTab },\n      });\n\n      window.dispatchEvent(tabChangeEvent);\n    });\n  };\n\n  handleKeyDown = (event, currentTabId) => {\n    const { key } = event;\n    const { tabs } = this.props;\n\n    let newTabIndex = -1;\n    const currentIndex = tabs.findIndex((tab) => tab.id === currentTabId);\n\n    switch (key) {\n      case 'ArrowRight':\n        // Move to the next tab\n        newTabIndex = (currentIndex + 1) % tabs.length;\n        break;\n      case 'ArrowLeft':\n        // Move to the previous tab\n        newTabIndex = (currentIndex - 1 + tabs.length) % tabs.length;\n        break;\n      // Commented out ArrowDown and ArrowUp for future vertical tab navigation\n      // case 'ArrowDown':\n      //   // Move to the next tab (for vertical alignment)\n      //   newTabIndex = (currentIndex + 1) % tabs.length;\n      //   break;\n      // case 'ArrowUp':\n      //   // Move to the previous tab (for vertical alignment)\n      //   newTabIndex = (currentIndex - 1 + tabs.length) % tabs.length;\n      //   break;\n      case 'Home':\n        // Move to the first tab\n        newTabIndex = 0;\n        break;\n      case 'End':\n        // Move to the last tab\n        newTabIndex = tabs.length - 1;\n        break;\n      case 'Enter':\n      case ' ':\n        // Activate the current tab\n        newTabIndex = currentIndex;\n        break;\n      default:\n        break;\n    }\n\n    if (newTabIndex !== -1) {\n      event.preventDefault();\n      this.handleChange(event, tabs[newTabIndex].id);\n      document.getElementById(`button-${tabs[newTabIndex].id}`).focus();\n    }\n  };\n\n  parsedText = (text = '') => {\n    // fix imported audio content for Safari PD-1391\n    const div = document.createElement('div');\n    div.innerHTML = text.replace(/(<br\\/>\\n)/g, '<br/>');\n\n    const audio = div.querySelector('audio');\n\n    if (audio) {\n      const source = document.createElement('source');\n\n      source.setAttribute('type', 'audio/mp3');\n      source.setAttribute('src', audio.getAttribute('src'));\n\n      audio.removeAttribute('src');\n      audio.appendChild(source);\n    }\n\n    return div.innerHTML;\n  };\n\n  renderInstructions(showTeacherInstructions, teacherInstructions, disabledTabs = false) {\n    if (!showTeacherInstructions || !teacherInstructions) {\n      return;\n    }\n\n    const teacherInstructionsDiv = (\n      <PreviewPrompt\n        tagName=\"div\"\n        className=\"prompt\"\n        defaultClassName=\"teacher-instructions\"\n        prompt={teacherInstructions}\n      />\n    );\n\n    if (disabledTabs) {\n      return teacherInstructionsDiv;\n    }\n\n    return (\n      <Collapsible\n        labels={{\n          hidden: 'Show Teacher Instructions',\n          visible: 'Hide Teacher Instructions',\n        }}\n      >\n        {teacherInstructionsDiv}\n      </Collapsible>\n    );\n  }\n\n  renderTab(tab, showTeacherInstructions, disabledTabs) {\n    const { classes } = this.props;\n\n    return (\n      <div\n        className={classNames(classes.passage, 'passage')}\n        key={tab.id}\n        id={`tabpanel-${tab.id}`}\n        role=\"tabpanel\"\n        aria-labelledby={`button-${tab.id}`}\n      >\n        {this.renderInstructions(showTeacherInstructions, tab.teacherInstructions, disabledTabs)}\n        <h2>\n          <div\n            className={classNames(classes.passageTitle, 'title')}\n            dangerouslySetInnerHTML={{ __html: this.parsedText(tab.title) }}\n          />\n          <div\n            className={classNames(classes.passageSubtitle, 'subtitle')}\n            dangerouslySetInnerHTML={{ __html: this.parsedText(tab.subtitle) }}\n          />\n        </h2>\n        <div\n          className={classNames(classes.passageAuthor, 'author')}\n          dangerouslySetInnerHTML={{ __html: this.parsedText(tab.author) }}\n        />\n        <div\n          key={tab.id}\n          className={classNames(classes.passageText, 'text')}\n          dangerouslySetInnerHTML={{ __html: this.parsedText(tab.text) }}\n        />\n      </div>\n    );\n  }\n\n  render() {\n    const { classes, tabs, disabledTabs, showTeacherInstructions } = this.props;\n    const { activeTab } = this.state;\n\n    if (!tabs?.length) {\n      return;\n    }\n\n    const selectedTab = (tabs || []).find((tab) => tab.id === activeTab);\n\n    return (\n      <div className={classNames(classes.passages, 'passages')}>\n        {disabledTabs || tabs.length === 1 ? (\n          tabs.map((tab) => this.renderTab(tab, showTeacherInstructions, disabledTabs))\n        ) : (\n          <>\n            <Tabs\n              classes={{\n                root: classes.stickyTabs,\n                flexContainer: classes.tabButton,\n              }}\n              value={activeTab}\n              onChange={this.handleChange}\n            >\n              {tabs.map((tab) => (\n                <Tab\n                  className={classes.tab}\n                  key={tab.id}\n                  id={`button-${tab.id}`}\n                  label={<span dangerouslySetInnerHTML={{ __html: this.parsedText(tab.title) }} />}\n                  value={tab.id}\n                  tabIndex={activeTab === tab.id ? 0 : -1}\n                  aria-controls={`tabpanel-${tab.id}`}\n                  aria-selected={activeTab === tab.id}\n                  onFocus={() => this.handleChange(null, tab.id)}\n                  onKeyDown={(event) => this.handleKeyDown(event, tab.id)}\n                />\n              ))}\n            </Tabs>\n            {selectedTab ? this.renderTab(selectedTab, showTeacherInstructions, disabledTabs) : null}\n          </>\n        )}\n      </div>\n    );\n  }\n}\n\nStimulusTabs.propTypes = {\n  classes: PropTypes.object.isRequired,\n  tabs: PropTypes.arrayOf(\n    PropTypes.shape({\n      id: PropTypes.number.isRequired,\n      title: PropTypes.string.isRequired,\n      subtitle: PropTypes.string,\n      author: PropTypes.string,\n      text: PropTypes.string.isRequired,\n      teacherInstructions: PropTypes.string,\n    }).isRequired,\n  ).isRequired,\n  disabledTabs: PropTypes.bool,\n  showTeacherInstructions: PropTypes.bool,\n};\n\nexport default withStyles(styles)(StimulusTabs);\n"],"file":"stimulus-tabs.js"}
+{"version":3,"sources":["../src/stimulus-tabs.jsx"],"names":["styles","theme","passages","flexGrow","backgroundColor","color","background","text","passage","padding","spacing","unit","passageTitle","fontSize","passageSubtitle","passageAuthor","passageText","stickyTabs","position","top","tab","palette","common","white","black","tabButton","teacherInstructions","marginBottom","getContent","html","replace","StimulusTabs","activeTab","event","setState","setTimeout","tabChangeEvent","CustomEvent","detail","window","dispatchEvent","currentTabId","key","tabs","props","newTabIndex","currentIndex","findIndex","id","length","preventDefault","handleChange","document","getElementById","focus","div","createElement","innerHTML","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","disabledTabs","teacherInstructionsDiv","hidden","visible","classes","renderInstructions","title","subtitle","__html","parsedText","author","state","selectedTab","find","map","renderTab","root","flexContainer","label","handleKeyDown","React","Component","propTypes","PropTypes","object","isRequired","arrayOf","shape","number","string","bool"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Tabs from '@material-ui/core/Tabs';\nimport Tab from '@material-ui/core/Tab';\nimport { withStyles } from '@material-ui/core/styles';\nimport { Collapsible, color, PreviewPrompt } from '@pie-lib/pie-toolbox/render-ui';\nimport classNames from 'classnames';\n\nconst styles = (theme) => ({\n  passages: {\n    flexGrow: 1,\n    backgroundColor: color.background(),\n    color: color.text(),\n  },\n  passage: {\n    backgroundColor: color.background(),\n    color: color.text(),\n    padding: theme.spacing.unit * 2,\n  },\n  passageTitle: {\n    fontSize: '1.75rem',\n  },\n  passageSubtitle: {\n    fontSize: '1.5rem',\n  },\n  passageAuthor: {\n    fontSize: '1.25rem',\n  },\n  passageText: {},\n  stickyTabs: {\n    background: color.background(),\n    position: 'sticky',\n    top: 0,\n  },\n  tab: {\n    background: theme.palette.common.white, // replace with color.background() once PD-2801 is DONE\n    fontSize: 'inherit',\n    color: theme.palette.common.black, // remove when PD-2801 is DONE\n  },\n  tabButton: {\n    background: theme.palette.common.white, // replace with color.background() once PD-2801 is DONE\n  },\n  teacherInstructions: {\n    marginBottom: theme.spacing.unit * 2,\n  },\n});\n\nconst getContent = (html) => (html || '').replace(/(<(?!img|iframe)([^>]+)>)/gi, '');\n\nclass StimulusTabs extends React.Component {\n  state = {\n    activeTab: 0,\n  };\n\n  handleChange = (event, activeTab) => {\n    this.setState(() => ({ activeTab }));\n\n    setTimeout(() => {\n      const tabChangeEvent = new CustomEvent('pie-ui-passage-tabChanged', {\n        detail: { tab: activeTab },\n      });\n\n      window.dispatchEvent(tabChangeEvent);\n    });\n  };\n\n  handleKeyDown = (event, currentTabId) => {\n    const { key } = event;\n    const { tabs } = this.props;\n\n    let newTabIndex = -1;\n    const currentIndex = tabs.findIndex((tab) => tab.id === currentTabId);\n\n    switch (key) {\n      case 'ArrowRight':\n        // Move to the next tab\n        newTabIndex = (currentIndex + 1) % tabs.length;\n        break;\n      case 'ArrowLeft':\n        // Move to the previous tab\n        newTabIndex = (currentIndex - 1 + tabs.length) % tabs.length;\n        break;\n      // Commented out ArrowDown and ArrowUp for future vertical tab navigation\n      // case 'ArrowDown':\n      //   // Move to the next tab (for vertical alignment)\n      //   newTabIndex = (currentIndex + 1) % tabs.length;\n      //   break;\n      // case 'ArrowUp':\n      //   // Move to the previous tab (for vertical alignment)\n      //   newTabIndex = (currentIndex - 1 + tabs.length) % tabs.length;\n      //   break;\n      case 'Home':\n        // Move to the first tab\n        newTabIndex = 0;\n        break;\n      case 'End':\n        // Move to the last tab\n        newTabIndex = tabs.length - 1;\n        break;\n      case 'Enter':\n      case ' ':\n        // Activate the current tab\n        newTabIndex = currentIndex;\n        break;\n      default:\n        break;\n    }\n\n    if (newTabIndex !== -1) {\n      event.preventDefault();\n      this.handleChange(event, tabs[newTabIndex].id);\n      document.getElementById(`button-${tabs[newTabIndex].id}`).focus();\n    }\n  };\n\n  parsedText = (text = '') => {\n    // fix imported audio content for Safari PD-1391\n    const div = document.createElement('div');\n    div.innerHTML = text.replace(/(<br\\/>\\n)/g, '<br/>');\n\n    const audio = div.querySelector('audio');\n\n    if (audio) {\n      const source = document.createElement('source');\n\n      source.setAttribute('type', 'audio/mp3');\n      source.setAttribute('src', audio.getAttribute('src'));\n\n      audio.removeAttribute('src');\n      audio.appendChild(source);\n    }\n\n    return div.innerHTML;\n  };\n\n  renderInstructions(teacherInstructions, disabledTabs = false) {\n    if (!getContent(teacherInstructions)) {\n      return;\n    }\n\n    const teacherInstructionsDiv = (\n      <PreviewPrompt\n        tagName=\"div\"\n        className=\"prompt\"\n        defaultClassName=\"teacher-instructions\"\n        prompt={teacherInstructions}\n      />\n    );\n\n    if (disabledTabs) {\n      return teacherInstructionsDiv;\n    }\n\n    return (\n      <Collapsible\n        labels={{\n          hidden: 'Show Teacher Instructions',\n          visible: 'Hide Teacher Instructions',\n        }}\n      >\n        {teacherInstructionsDiv}\n      </Collapsible>\n    );\n  }\n\n  renderTab(tab, disabledTabs) {\n    const { classes } = this.props;\n\n    return (\n      <div\n        className={classNames(classes.passage, 'passage')}\n        key={tab.id}\n        id={`tabpanel-${tab.id}`}\n        role=\"tabpanel\"\n        aria-labelledby={`button-${tab.id}`}\n      >\n        {this.renderInstructions(tab.teacherInstructions, disabledTabs)}\n\n        {(getContent(tab.title) || getContent(tab.subtitle)) && (\n          <h2>\n            {getContent(tab.title) && (\n              <div\n                className={classNames(classes.passageTitle, 'title')}\n                dangerouslySetInnerHTML={{ __html: this.parsedText(tab.title) }}\n              />\n            )}\n            {getContent(tab.subtitle) && (\n              <div\n                className={classNames(classes.passageSubtitle, 'subtitle')}\n                dangerouslySetInnerHTML={{ __html: this.parsedText(tab.subtitle) }}\n              />\n            )}\n          </h2>\n        )}\n\n        {getContent(tab.author) && (\n          <div\n            className={classNames(classes.passageAuthor, 'author')}\n            dangerouslySetInnerHTML={{ __html: this.parsedText(tab.author) }}\n          />\n        )}\n\n        {getContent(tab.text) && (\n          <div\n            key={tab.id}\n            className={classNames(classes.passageText, 'text')}\n            dangerouslySetInnerHTML={{ __html: this.parsedText(tab.text) }}\n          />\n        )}\n      </div>\n    );\n  }\n\n  render() {\n    const { classes, tabs, disabledTabs } = this.props;\n    const { activeTab } = this.state;\n\n    if (!tabs?.length) {\n      return;\n    }\n\n    const selectedTab = (tabs || []).find((tab) => tab.id === activeTab);\n\n    return (\n      <div className={classNames(classes.passages, 'passages')}>\n        {disabledTabs || tabs.length === 1 ? (\n          tabs.map((tab) => this.renderTab(tab, disabledTabs))\n        ) : (\n          <>\n            <Tabs\n              classes={{\n                root: classes.stickyTabs,\n                flexContainer: classes.tabButton,\n              }}\n              value={activeTab}\n              onChange={this.handleChange}\n            >\n              {tabs.map((tab) => (\n                <Tab\n                  className={classes.tab}\n                  key={tab.id}\n                  id={`button-${tab.id}`}\n                  label={<span dangerouslySetInnerHTML={{ __html: this.parsedText(tab.label) }} />}\n                  value={tab.id}\n                  tabIndex={activeTab === tab.id ? 0 : -1}\n                  aria-controls={`tabpanel-${tab.id}`}\n                  aria-selected={activeTab === tab.id}\n                  onFocus={() => this.handleChange(null, tab.id)}\n                  onKeyDown={(event) => this.handleKeyDown(event, tab.id)}\n                />\n              ))}\n            </Tabs>\n            {selectedTab ? this.renderTab(selectedTab, disabledTabs) : null}\n          </>\n        )}\n      </div>\n    );\n  }\n}\n\nStimulusTabs.propTypes = {\n  classes: PropTypes.object.isRequired,\n  tabs: PropTypes.arrayOf(\n    PropTypes.shape({\n      id: PropTypes.number.isRequired,\n      label: PropTypes.string.isRequired,\n      title: PropTypes.string.isRequired,\n      subtitle: PropTypes.string,\n      author: PropTypes.string,\n      text: PropTypes.string.isRequired,\n      teacherInstructions: PropTypes.string,\n    }).isRequired,\n  ).isRequired,\n  disabledTabs: PropTypes.bool,\n};\n\nexport default withStyles(styles)(StimulusTabs);\n"],"file":"stimulus-tabs.js"}

package/module/configure.js

@@ -1,4 +1,4 @@
-import {_dll_react, _dll_prop_types, _dll_react_dom} from "../../../@pie-lib/pie-toolbox-math-rendering-module@1.24.1/module/index.js";
+import {_dll_react, _dll_prop_types, _dll_react_dom} from "../../../@pie-lib/pie-toolbox-math-rendering-module@1.24.2/module/index.js";
 import {_dll_pie_lib__pie_toolbox_config_ui, _dll_pie_lib__pie_toolbox_editable_html} from "../../../@pie-lib/pie-toolbox-module@4.24.3/module/index.js";
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 function getDefaultExportFromCjs(x) {

package/module/controller.js

@@ -1,5 +1,5 @@
 var defaults = {
-  teacherInstructionsEnabled: false,
+  teacherInstructionsEnabled: true,
   titleEnabled: true,
   subtitleEnabled: true,
   textEnabled: true,
@@ -11,7 +11,7 @@ var defaults = {
       subtitle: '',
       author: '',
       text: '',
-    }
+    },
   ],
 };
 
@@ -19,17 +19,21 @@ const getContent = (html) => (html || '').replace(/(<(?!img|iframe)([^>]+)>)/gi,
 
 function createDefaultModel(model = {}) {
   return new Promise((resolve) => {
-    resolve({
-      ...defaults,
-      ...model,
-    });
+    resolve({ ...defaults, ...model });
   });
 }
 
-const normalize = (question) => ({
-  ...defaults,
-  ...question,
-});
+const normalize = (question) => ({ ...defaults, ...question });
+
+const normalizeTeacherInstructions = (instructions, env) => {
+  const { role, mode } = env;
+
+  if (role === 'instructor' && (mode === 'view' || mode === 'evaluate')) {
+    return instructions || '';
+  }
+
+  return '';
+};
 
 /**
  *
@@ -38,21 +42,23 @@ const normalize = (question) => ({
  * @param {*} env
  */
 async function model(question, session, env) {
-  const { role, mode } = env || {};
   const normalizedQuestion = normalize(question);
 
-  const out = {
+  const normalizedPassages = normalizedQuestion.passages.map((passage, index) => ({
+    teacherInstructions: normalizedQuestion.teacherInstructionsEnabled
+      ? normalizeTeacherInstructions(passage.teacherInstructions, env)
+      : '',
+    label: passage.titles || `Passage ${index + 1}`,
+    title: normalizedQuestion.titleEnabled ? passage.title || '' : '',
+    subtitle: normalizedQuestion.subtitleEnabled ? passage.subtitle || '' : '',
+    author: normalizedQuestion.authorEnabled ? passage.author || '' : '',
+    text: normalizedQuestion.textEnabled ? passage.text || '' : '',
+  }));
+
+  return {
     ...normalizedQuestion,
-    teacherInstructions: null
+    passages: normalizedPassages,
   };
-
-  if (role === 'instructor' && (mode === 'view' || mode === 'evaluate')) {
-    if (normalizedQuestion.teacherInstructionsEnabled) {
-      out.teacherInstructions = normalizedQuestion.teacherInstructions;
-    }
-  }
-
-  return out;
 }
 
 const validate = (model = {}, config = {}) => {

package/module/element.js

@@ -1,4 +1,4 @@
-import {_dll_react, _dll_prop_types, _dll_classnames, _dll_react_dom, _dll_pie_lib__pie_toolbox_math_rendering_accessible} from "../../../@pie-lib/pie-toolbox-math-rendering-module@1.24.1/module/index.js";
+import {_dll_react, _dll_prop_types, _dll_classnames, _dll_react_dom, _dll_pie_lib__pie_toolbox_math_rendering_accessible} from "../../../@pie-lib/pie-toolbox-math-rendering-module@1.24.2/module/index.js";
 import {_dll_pie_lib__pie_toolbox_render_ui} from "../../../@pie-lib/pie-toolbox-module@4.24.3/module/index.js";
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 function getDefaultExportFromCjs(x) {
@@ -8641,6 +8641,7 @@ const styles = theme => ({
     marginBottom: theme.spacing.unit * 2
   }
 });
+const getContent = html => (html || '').replace(/(<(?!img|iframe)([^>]+)>)/gi, '');
 class StimulusTabs extends React$1.Component {
   constructor(...args) {
     super(...args);
@@ -8715,8 +8716,8 @@ class StimulusTabs extends React$1.Component {
       return div.innerHTML;
     };
   }
-  renderInstructions(showTeacherInstructions, teacherInstructions, disabledTabs = false) {
-    if (!showTeacherInstructions || !teacherInstructions) {
+  renderInstructions(teacherInstructions, disabledTabs = false) {
+    if (!getContent(teacherInstructions)) {
       return;
     }
     const teacherInstructionsDiv = React$1.createElement(PreviewPrompt, {
@@ -8727,7 +8728,7 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 140
+        lineNumber: 142
       }
     });
     if (disabledTabs) {
@@ -8741,11 +8742,11 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 153
+        lineNumber: 155
       }
     }, teacherInstructionsDiv);
   }
-  renderTab(tab, showTeacherInstructions, disabledTabs) {
+  renderTab(tab, disabledTabs) {
     const {classes} = this.props;
     return React$1.createElement('div', {
       className: classNames(classes.passage, 'passage'),
@@ -8756,15 +8757,15 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 168
+        lineNumber: 170
       }
-    }, this.renderInstructions(showTeacherInstructions, tab.teacherInstructions, disabledTabs), React$1.createElement('h2', {
+    }, this.renderInstructions(tab.teacherInstructions, disabledTabs), (getContent(tab.title) || getContent(tab.subtitle)) && React$1.createElement('h2', {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 176
+        lineNumber: 180
       }
-    }, React$1.createElement('div', {
+    }, getContent(tab.title) && React$1.createElement('div', {
       className: classNames(classes.passageTitle, 'title'),
       dangerouslySetInnerHTML: {
         __html: this.parsedText(tab.title)
@@ -8772,9 +8773,9 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 177
+        lineNumber: 182
       }
-    }), React$1.createElement('div', {
+    }), getContent(tab.subtitle) && React$1.createElement('div', {
       className: classNames(classes.passageSubtitle, 'subtitle'),
       dangerouslySetInnerHTML: {
         __html: this.parsedText(tab.subtitle)
@@ -8782,9 +8783,9 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 181
+        lineNumber: 188
       }
-    })), React$1.createElement('div', {
+    })), getContent(tab.author) && React$1.createElement('div', {
       className: classNames(classes.passageAuthor, 'author'),
       dangerouslySetInnerHTML: {
         __html: this.parsedText(tab.author)
@@ -8792,9 +8793,9 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 186
+        lineNumber: 197
       }
-    }), React$1.createElement('div', {
+    }), getContent(tab.text) && React$1.createElement('div', {
       key: tab.id,
       className: classNames(classes.passageText, 'text'),
       dangerouslySetInnerHTML: {
@@ -8803,12 +8804,12 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 190
+        lineNumber: 204
       }
     }));
   }
   render() {
-    const {classes, tabs, disabledTabs, showTeacherInstructions} = this.props;
+    const {classes, tabs, disabledTabs} = this.props;
     const {activeTab} = this.state;
     if (!_optionalChain([tabs, 'optionalAccess', _ => _.length])) {
       return;
@@ -8819,9 +8820,9 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 210
+        lineNumber: 225
       }
-    }, disabledTabs || tabs.length === 1 ? tabs.map(tab => this.renderTab(tab, showTeacherInstructions, disabledTabs)) : React$1.createElement(React$1.Fragment, null, React$1.createElement(Tabs, {
+    }, disabledTabs || tabs.length === 1 ? tabs.map(tab => this.renderTab(tab, disabledTabs)) : React$1.createElement(React$1.Fragment, null, React$1.createElement(Tabs, {
       classes: {
         root: classes.stickyTabs,
         flexContainer: classes.tabButton
@@ -8831,7 +8832,7 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 215
+        lineNumber: 230
       }
     }, tabs.map(tab => React$1.createElement(Tab, {
       className: classes.tab,
@@ -8839,12 +8840,12 @@ class StimulusTabs extends React$1.Component {
       id: `button-${tab.id}`,
       label: React$1.createElement('span', {
         dangerouslySetInnerHTML: {
-          __html: this.parsedText(tab.title)
+          __html: this.parsedText(tab.label)
         },
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 228
+          lineNumber: 243
         }
       }),
       value: tab.id,
@@ -8856,23 +8857,23 @@ class StimulusTabs extends React$1.Component {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 224
+        lineNumber: 239
       }
-    }))), selectedTab ? this.renderTab(selectedTab, showTeacherInstructions, disabledTabs) : null));
+    }))), selectedTab ? this.renderTab(selectedTab, disabledTabs) : null));
   }
 }
 StimulusTabs.propTypes = {
   classes: PropTypes.object.isRequired,
   tabs: PropTypes.arrayOf(PropTypes.shape({
     id: PropTypes.number.isRequired,
+    label: PropTypes.string.isRequired,
     title: PropTypes.string.isRequired,
     subtitle: PropTypes.string,
     author: PropTypes.string,
     text: PropTypes.string.isRequired,
     teacherInstructions: PropTypes.string
   }).isRequired).isRequired,
-  disabledTabs: PropTypes.bool,
-  showTeacherInstructions: PropTypes.bool
+  disabledTabs: PropTypes.bool
 };
 var StimulusTabs$1 = styles$1.withStyles(styles)(StimulusTabs);
 const {renderMath: renderMath} = _dll_pie_lib__pie_toolbox_math_rendering_accessible;
@@ -8906,19 +8907,14 @@ class PiePassage extends HTMLElement {
     this._render();
   }
   _render() {
-    const {passages = [], showTeacherInstructions = false} = this._model;
+    const {passages = []} = this._model;
     if (this._model.passages.length > 0) {
       const passagesTabs = passages.map((passage, index) => ({
         id: index,
-        title: passage.title,
-        subtitle: passage.subtitle,
-        author: passage.author,
-        text: passage.text,
-        teacherInstructions: passage.teacherInstructions || ''
+        ...passage
       }));
       const elem = React.createElement(StimulusTabs$1, {
-        tabs: passagesTabs,
-        showTeacherInstructions
+        tabs: passagesTabs
       });
       ReactDOM.render(elem, this, () => renderMath(this));
     }

package/module/index.html

@@ -2,7 +2,7 @@
   <!doctype html>
   <html>
     <head>
-      <title>@pie-element/passage@2.21.3</title>
+      <title>@pie-element/passage@2.21.4</title>
       <script
         type="module"
         src="https://cdn.jsdelivr.net/npm/@pslb/demo-el@^1.0.0/dist/demo-el/demo-el.esm.js"></script>

package/module/manifest.json

@@ -1,10 +1,10 @@
 {
   "name": "@pie-element/passage",
-  "version": "2.21.3",
+  "version": "2.21.4",
   "modules": [
     {
       "name": "@pie-lib/pie-toolbox-math-rendering-module",
-      "version": "1.24.1"
+      "version": "1.24.2"
     },
     {
       "name": "@pie-lib/pie-toolbox-module",

package/module/print.html

@@ -2,7 +2,7 @@
   <!doctype html>
   <html>
     <head>
-      <title>@pie-element/passage@2.21.3</title>
+      <title>@pie-element/passage@2.21.4</title>
       <link
         href="https://fonts.googleapis.com/css?family=Roboto&display=swap"
         rel="stylesheet"