@pie-element/passage 7.4.4 → 8.0.0-next.20261002094057

package/lib/print.js

@@ -1,78 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _client = require("react-dom/client");
-var _lodashEs = require("lodash-es");
-var _debug = _interopRequireDefault(require("debug"));
-var _stimulusTabs = _interopRequireDefault(require("./stimulus-tabs"));
-const log = (0, _debug.default)('pie-element:passage:print');
-const checkNullish = value => value !== null && value !== undefined;
-const isEnabled = (value, defaultValue) => checkNullish(value) ? value : defaultValue;
-const preparePrintPassage = (model, opts) => {
-  const isInstructor = opts.role === 'instructor';
-
-  // TODO: also update '../../configure/src/defaults.js' and '../../controller/src/defaults.js' when updating defaultValue
-  const teacherInstructionsEnabled = isEnabled(model.teacherInstructionsEnabled, true);
-  const titleEnabled = isEnabled(model.titleEnabled, true);
-  const authorEnabled = isEnabled(model.authorEnabled, false);
-  const subtitleEnabled = isEnabled(model.subtitleEnabled, true);
-  const textEnabled = isEnabled(model.textEnabled, true);
-  return model.passages.map((passage, index) => ({
-    id: index,
-    teacherInstructions: isEnabled(passage.teacherInstructionsEnabled, teacherInstructionsEnabled) ? isInstructor && passage.teacherInstructions || '' : '',
-    label: passage.title || `Passage ${index + 1}`,
-    title: isEnabled(passage.titleEnabled, titleEnabled) ? passage.title || '' : '',
-    author: isEnabled(passage.authorEnabled, authorEnabled) ? passage.author || '' : '',
-    subtitle: isEnabled(passage.subtitleEnabled, subtitleEnabled) ? passage.subtitle || '' : '',
-    text: isEnabled(passage.textEnabled, textEnabled) ? passage.text || '' : ''
-  }));
-};
-class PassagePrint extends HTMLElement {
-  constructor() {
-    super();
-    this._model = null;
-    this._options = null;
-    this._session = [];
-    this._root = null;
-    this._rerender = (0, _lodashEs.debounce)(() => {
-      if (this._model && this._session) {
-        if (this._model.passages && this._model.passages.length > 0) {
-          const printPassage = preparePrintPassage(this._model, this._options);
-          const element = /*#__PURE__*/_react.default.createElement(_stimulusTabs.default, {
-            disabledTabs: true,
-            tabs: printPassage
-          });
-          if (!this._root) {
-            this._root = (0, _client.createRoot)(this);
-          }
-          this._root.render(element);
-        }
-      } else {
-        log('skip');
-      }
-    }, 50, {
-      leading: false,
-      trailing: true
-    });
-  }
-  set model(s) {
-    this._model = s;
-    this._rerender();
-  }
-  set options(o) {
-    this._options = o;
-  }
-  connectedCallback() {}
-  disconnectedCallback() {
-    if (this._root) {
-      this._root.unmount();
-    }
-  }
-}
-exports.default = PassagePrint;
-//# sourceMappingURL=print.js.map

package/lib/print.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"print.js","names":["_react","_interopRequireDefault","require","_client","_lodashEs","_debug","_stimulusTabs","log","debug","checkNullish","value","undefined","isEnabled","defaultValue","preparePrintPassage","model","opts","isInstructor","role","teacherInstructionsEnabled","titleEnabled","authorEnabled","subtitleEnabled","textEnabled","passages","map","passage","index","id","teacherInstructions","label","title","author","subtitle","text","PassagePrint","HTMLElement","constructor","_model","_options","_session","_root","_rerender","debounce","length","printPassage","element","React","createElement","StimulusTabs","disabledTabs","tabs","createRoot","render","leading","trailing","s","options","o","connectedCallback","disconnectedCallback","unmount","exports","default"],"sources":["../src/print.js"],"sourcesContent":["import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { debounce } from 'lodash-es';\nimport debug from 'debug';\n\nimport StimulusTabs from './stimulus-tabs';\n\nconst log = debug('pie-element:passage:print');\n\nconst checkNullish = (value) => value !== null && value !== undefined;\n\nconst isEnabled = (value, defaultValue) => (checkNullish(value) ? value : defaultValue);\n\nconst preparePrintPassage = (model, opts) => {\n  const isInstructor = opts.role === 'instructor';\n\n  // TODO: also update '../../configure/src/defaults.js' and '../../controller/src/defaults.js' when updating defaultValue\n  const teacherInstructionsEnabled = isEnabled(model.teacherInstructionsEnabled, true);\n  const titleEnabled = isEnabled(model.titleEnabled, true);\n  const authorEnabled = isEnabled(model.authorEnabled, false);\n  const subtitleEnabled = isEnabled(model.subtitleEnabled, true);\n  const textEnabled = isEnabled(model.textEnabled, true);\n\n  return model.passages.map((passage, index) => ({\n    id: index,\n    teacherInstructions: isEnabled(passage.teacherInstructionsEnabled, teacherInstructionsEnabled)\n      ? (isInstructor && passage.teacherInstructions) || ''\n      : '',\n    label: passage.title || `Passage ${index + 1}`,\n    title: isEnabled(passage.titleEnabled, titleEnabled) ? passage.title || '' : '',\n    author: isEnabled(passage.authorEnabled, authorEnabled) ? passage.author || '' : '',\n    subtitle: isEnabled(passage.subtitleEnabled, subtitleEnabled) ? passage.subtitle || '' : '',\n    text: isEnabled(passage.textEnabled, textEnabled) ? passage.text || '' : '',\n  }));\n};\n\nexport default class PassagePrint extends HTMLElement {\n  constructor() {\n    super();\n    this._model = null;\n    this._options = null;\n    this._session = [];\n    this._root = null;\n\n    this._rerender = debounce(\n      () => {\n        if (this._model && this._session) {\n          if (this._model.passages && this._model.passages.length > 0) {\n            const printPassage = preparePrintPassage(this._model, this._options);\n\n            const element = React.createElement(StimulusTabs, {\n              disabledTabs: true,\n              tabs: printPassage,\n            });\n\n            if (!this._root) {\n              this._root = createRoot(this);\n            }\n            this._root.render(element);\n          }\n        } else {\n          log('skip');\n        }\n      },\n      50,\n      { leading: false, trailing: true },\n    );\n  }\n\n  set model(s) {\n    this._model = s;\n    this._rerender();\n  }\n\n  set options(o) {\n    this._options = o;\n  }\n\n  connectedCallback() {}\n\n  disconnectedCallback() {\n    if (this._root) {\n      this._root.unmount();\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/lib/stimulus-tabs.js

@@ -1,451 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _Tabs = _interopRequireDefault(require("@mui/material/Tabs"));
-var _Tab = _interopRequireDefault(require("@mui/material/Tab"));
-var _styles = require("@mui/material/styles");
-var _renderUi = require("@pie-lib/render-ui");
-// Must match the breakpoint Quiz Engine passes to the PIE section player for
-// switching from the side-by-side passage/question layout to the tabbed layout.
-// Below (and at) this width the passage tabs scroll with the passage content
-// instead of being locked to the top of the panel, so that they do not lock up
-// space needed for the passage text (WCAG 1.4.10 Reflow, 400% zoom / 320px).
-const STICKY_TABS_BREAKPOINT = 840;
-
-/**
- * Zoom compensation for the passage selection tabs.
- *
- * The tabs scale naturally with browser zoom up to 200%. Beyond 200%,
- * we shrink their CSS size proportionally so their physical on-screen size
- * freezes at the 200% appearance, leaving more room for passage content
- * in high-zoom / small-window situations.
- * The factor is min(1, 2 / zoom): exactly 1 at zoom <= 200% (component
- * behavior unchanged), shrinking proportionally above that. A lower clamp
- * of 0.4 guards against inflated ratios (docked devtools, browser side
- * panels, window chrome) ever making the tabs unusably small.
- */
-const MAX_TABS_ZOOM = 2;
-const MIN_ZOOM_COMPENSATION = 0.4;
-
-// Per-tab horizontal-space floor in CSS pixels. When the passage container is
-// narrow enough that each tab would have at most this much room
-// (containerWidth <= tabs.length * NUMERIC_LABEL_MIN_WIDTH_PER_TAB), tab labels
-// fall back to "Passage 1", "Passage 2", ... so navigation stays usable instead
-// of being dominated by aggressively truncated titles.
-const NUMERIC_LABEL_MIN_WIDTH_PER_TAB = 170;
-const computeZoomCompensation = () => {
-  if (typeof window === 'undefined') return 1;
-  const ratio = window.outerWidth / window.innerWidth;
-  const zoom = Number.isFinite(ratio) && ratio > 0 ? ratio : 1;
-  return Math.max(MIN_ZOOM_COMPENSATION, Math.min(1, MAX_TABS_ZOOM / zoom));
-};
-const PassagesContainer = (0, _styles.styled)('div')({
-  flexGrow: 1,
-  backgroundColor: _renderUi.color.background(),
-  color: _renderUi.color.text(),
-  '&:not(.MathJax) table': {
-    borderCollapse: 'collapse'
-  },
-  '&:not(.MathJax) table td, &:not(.MathJax) table th': {
-    padding: '.6em 1em',
-    textAlign: 'left'
-  }
-});
-const Passage = (0, _styles.styled)('div')(({
-  theme
-}) => ({
-  backgroundColor: _renderUi.color.background(),
-  color: _renderUi.color.text(),
-  padding: theme.spacing(2),
-  '& blockquote': {
-    background: '#f9f9f9',
-    borderLeft: '5px solid #ccc',
-    margin: '1.5em 10px',
-    padding: '.5em 10px'
-  }
-}));
-const PassageTitle = (0, _styles.styled)('div')({
-  fontSize: '1.75rem'
-});
-const PassageSubtitle = (0, _styles.styled)('div')({
-  fontSize: '1.5rem'
-});
-const PassageAuthor = (0, _styles.styled)('div')({
-  fontSize: '1.25rem'
-});
-const TabStyled = (0, _styles.styled)(_Tab.default)(({
-  theme
-}) => ({
-  /*
-   * The tab carries the colour of the panel it opens, which is what makes it read as a
-   * tab rather than a button, and it has to be the themed panel colour: MUI's palette
-   * does not follow `--pie-*`, so `common.white` here left the tab white on every color
-   * scheme while the passage body beneath it went dark. The comment this replaces gated
-   * the change on PD-2801, which is about OT's `color-contrast` class -- the mechanism
-   * pie-theme superseded, and blocked since 2023.
-   */
-  background: _renderUi.color.background(),
-  fontSize: 'inherit',
-  fontFamily: 'Roboto, sans-serif',
-  color: _renderUi.color.text(),
-  borderRadius: `${theme.spacing(2)} ${theme.spacing(2)} 0 0`,
-  /*
-   * `--pie-border-gray` is stepped to the 3:1 non-text minimum in every scheme. The
-   * literal it replaces measured about 1.2:1 against the dark schemes' surfaces, so the
-   * tab outline -- the only thing separating an unselected tab from the strip -- was
-   * invisible there.
-   */
-  border: `1px solid ${_renderUi.color.borderGray()}`,
-  borderBottomWidth: 0,
-  minHeight: '56px',
-  padding: '8px 10px',
-  display: 'flex',
-  alignItems: 'center',
-  justifyContent: 'center',
-  margin: `0 ${theme.spacing(1)}`,
-  textTransform: 'none',
-  '.passage-label': {
-    display: '-webkit-box',
-    WebkitLineClamp: 2,
-    WebkitBoxOrient: 'vertical',
-    overflow: 'hidden',
-    textOverflow: 'ellipsis',
-    whiteSpace: 'normal',
-    margin: 'auto 0',
-    opacity: 0.7
-  },
-  '&.Mui-selected': {
-    color: _renderUi.color.text(),
-    '.passage-label': {
-      opacity: 1
-    },
-    '.passage-label-underline': {
-      backgroundColor: _renderUi.color.tertiary()
-    }
-  },
-  '&:hover': {
-    '.passage-label-underline': {
-      backgroundColor: _renderUi.color.tertiaryLight()
-    }
-  },
-  '& .MuiTouchRipple-root': {
-    opacity: 0.7
-  }
-}));
-
-/*
- * The selection indicator, one per tab. Unselected it has to disappear into the tab, so it
- * paints the tab's own background rather than a fixed white; selected it becomes
- * `--pie-tertiary`, which every scheme sets.
- */
-const Underline = (0, _styles.styled)('div')(() => ({
-  height: '2px',
-  width: '100%',
-  marginTop: '6px',
-  background: _renderUi.color.background()
-}));
-class StimulusTabs extends _react.default.Component {
-  constructor(...args) {
-    super(...args);
-    (0, _defineProperty2.default)(this, "state", {
-      activeTab: 0,
-      zoomCompensation: computeZoomCompensation(),
-      containerWidth: 0
-    });
-    (0, _defineProperty2.default)(this, "containerRef", /*#__PURE__*/_react.default.createRef());
-    (0, _defineProperty2.default)(this, "updateZoomCompensation", () => {
-      this.setState({
-        zoomCompensation: computeZoomCompensation()
-      });
-    });
-    (0, _defineProperty2.default)(this, "updateContainerWidth", () => {
-      const node = this.containerRef.current;
-      if (!node) return;
-      const width = node.clientWidth;
-      if (width !== this.state.containerWidth) {
-        this.setState({
-          containerWidth: width
-        });
-      }
-    });
-    (0, _defineProperty2.default)(this, "handleChange", (event, activeTab) => {
-      this.setState(() => ({
-        activeTab
-      }));
-      setTimeout(() => {
-        const tabChangeEvent = new CustomEvent('pie-ui-passage-tabChanged', {
-          detail: {
-            tab: activeTab
-          }
-        });
-        window.dispatchEvent(tabChangeEvent);
-      });
-    });
-    (0, _defineProperty2.default)(this, "handleKeyDown", (event, currentTabId) => {
-      const {
-        key
-      } = event;
-      const {
-        tabs
-      } = this.props;
-      let newTabIndex = -1;
-      const currentIndex = tabs.findIndex(tab => tab.id === currentTabId);
-      switch (key) {
-        case 'ArrowRight':
-          // Move to the next tab
-          newTabIndex = (currentIndex + 1) % tabs.length;
-          break;
-        case 'ArrowLeft':
-          // Move to the previous tab
-          newTabIndex = (currentIndex - 1 + tabs.length) % tabs.length;
-          break;
-        // Commented out ArrowDown and ArrowUp for future vertical tab navigation
-        // case 'ArrowDown':
-        //   // Move to the next tab (for vertical alignment)
-        //   newTabIndex = (currentIndex + 1) % tabs.length;
-        //   break;
-        // case 'ArrowUp':
-        //   // Move to the previous tab (for vertical alignment)
-        //   newTabIndex = (currentIndex - 1 + tabs.length) % tabs.length;
-        //   break;
-        case 'Home':
-          // Move to the first tab
-          newTabIndex = 0;
-          break;
-        case 'End':
-          // Move to the last tab
-          newTabIndex = tabs.length - 1;
-          break;
-        case 'Enter':
-        case ' ':
-          // Activate the current tab
-          newTabIndex = currentIndex;
-          break;
-        default:
-          break;
-      }
-      if (newTabIndex !== -1) {
-        event.preventDefault();
-        event.stopPropagation();
-        this.handleChange(event, tabs[newTabIndex].id);
-        document.getElementById(`button-${tabs[newTabIndex].id}`).focus();
-      }
-    });
-    (0, _defineProperty2.default)(this, "parsedText", (text = '') => {
-      // fix imported audio content for Safari PD-1391
-      const div = document.createElement('div');
-      div.innerHTML = text.replace(/(<br\/>\n)/g, '<br/>');
-      const audio = div.querySelector('audio');
-      if (audio) {
-        const source = document.createElement('source');
-        source.setAttribute('type', 'audio/mp3');
-        source.setAttribute('src', audio.getAttribute('src'));
-        audio.removeAttribute('src');
-        audio.appendChild(source);
-      }
-      return div.innerHTML;
-    });
-  }
-  componentDidMount() {
-    if (typeof window === 'undefined') return;
-    window.addEventListener('resize', this.updateZoomCompensation);
-    if (this.containerRef.current && typeof ResizeObserver !== 'undefined') {
-      this.resizeObserver = new ResizeObserver(this.updateContainerWidth);
-      this.resizeObserver.observe(this.containerRef.current);
-    }
-    this.updateContainerWidth();
-  }
-  componentWillUnmount() {
-    if (typeof window === 'undefined') return;
-    window.removeEventListener('resize', this.updateZoomCompensation);
-    if (this.resizeObserver) {
-      this.resizeObserver.disconnect();
-      this.resizeObserver = null;
-    }
-  }
-  renderInstructions(teacherInstructions, disabledTabs = false) {
-    if (!teacherInstructions) {
-      return;
-    }
-    const teacherInstructionsDiv = /*#__PURE__*/_react.default.createElement(_renderUi.PreviewPrompt, {
-      tagName: "div",
-      className: "prompt",
-      defaultClassName: "teacher-instructions",
-      prompt: teacherInstructions
-    });
-    if (disabledTabs) {
-      return teacherInstructionsDiv;
-    }
-    return /*#__PURE__*/_react.default.createElement(_renderUi.Collapsible, {
-      labels: {
-        hidden: 'Show Teacher Instructions',
-        visible: 'Hide Teacher Instructions'
-      }
-    }, teacherInstructionsDiv);
-  }
-  renderTab(tab, disabledTabs) {
-    const {
-      baseHeadingLevel
-    } = this.props;
-    const clampedLevel = baseHeadingLevel ? Math.min(6, Math.max(1, baseHeadingLevel)) : undefined;
-    const TitleTag = baseHeadingLevel ? `h${clampedLevel}` : 'h2'; // default to h2 if no base level is provided - this was the previous behavior
-    const textLevel = baseHeadingLevel ? Math.min(6, Math.max(1, clampedLevel + 1)) : undefined; // promote text headings one level above title
-
-    return /*#__PURE__*/_react.default.createElement(Passage, {
-      key: tab.id,
-      id: `tabpanel-${tab.id}`,
-      role: "tabpanel",
-      "aria-labelledby": `button-${tab.id}`
-    }, this.renderInstructions(tab.teacherInstructions, disabledTabs), tab.title && /*#__PURE__*/_react.default.createElement(_renderUi.Purpose, {
-      purpose: "passage-title"
-    }, /*#__PURE__*/_react.default.createElement(TitleTag, null, /*#__PURE__*/_react.default.createElement(PassageTitle, {
-      dangerouslySetInnerHTML: {
-        __html: this.parsedText(tab.title)
-      }
-    }))), tab.subtitle && /*#__PURE__*/_react.default.createElement(_renderUi.Purpose, {
-      purpose: "passage-subtitle"
-    }, /*#__PURE__*/_react.default.createElement(PassageSubtitle, {
-      dangerouslySetInnerHTML: {
-        __html: this.parsedText(tab.subtitle)
-      }
-    })), tab.author && /*#__PURE__*/_react.default.createElement(_renderUi.Purpose, {
-      purpose: "passage-author"
-    }, /*#__PURE__*/_react.default.createElement(PassageAuthor, {
-      className: "author",
-      dangerouslySetInnerHTML: {
-        __html: this.parsedText(tab.author)
-      }
-    })), tab.text && /*#__PURE__*/_react.default.createElement(_renderUi.Purpose, {
-      purpose: "passage-text"
-    }, /*#__PURE__*/_react.default.createElement("div", {
-      key: tab.id,
-      className: "text",
-      dangerouslySetInnerHTML: {
-        __html: baseHeadingLevel ? (0, _renderUi.transformDataHeadings)(tab.text, textLevel) : tab.text
-      }
-    })));
-  }
-  render() {
-    const {
-      model,
-      tabs,
-      disabledTabs
-    } = this.props;
-    const {
-      activeTab,
-      zoomCompensation,
-      containerWidth
-    } = this.state;
-    if (!tabs?.length) {
-      return;
-    }
-    const {
-      extraCSSRules
-    } = model || {};
-    const selectedTab = (tabs || []).find(tab => tab.id === activeTab);
-
-    // cap each tab at 1/n of the passage container width so a single long
-    // title can't push other tabs off-screen. Existing two-line wrap + ellipsis
-    // on .passage-label still trims anything that doesn't fit.
-    const tabMaxWidth = containerWidth > 0 ? containerWidth / tabs.length : null;
-    // When per-tab horizontal space drops to NUMERIC_LABEL_MIN_WIDTH_PER_TAB or
-    // less, titles become unreadably truncated; swap to "Passage N" so users
-    // can still navigate. Container width is read once layout has settled
-    // (>0), so initial render uses real labels.
-    const useNumericLabels = containerWidth > 0 && containerWidth <= tabs.length * NUMERIC_LABEL_MIN_WIDTH_PER_TAB;
-    return /*#__PURE__*/_react.default.createElement(_renderUi.UiLayout, {
-      extraCSSRules: extraCSSRules
-    }, /*#__PURE__*/_react.default.createElement(PassagesContainer, {
-      className: "passages",
-      ref: this.containerRef
-    }, disabledTabs || tabs.length === 1 ? tabs.map(tab => this.renderTab(tab, disabledTabs)) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Tabs.default, {
-      sx: {
-        // Below the breakpoint (e.g. WCAG 400% zoom, ~320px viewport)
-        // the tabs are in normal flow and scroll with the passage text,
-        // so they don't lock up space needed to display the passage.
-        position: 'static',
-        // Above the breakpoint there is adequate screen space, so the
-        // tabs stay locked to the top of the panel while the passage
-        // text scrolls beneath them.
-        [`@media (min-width: ${STICKY_TABS_BREAKPOINT + 1}px)`]: {
-          position: 'sticky',
-          top: 0,
-          zIndex: 1
-        },
-        background: 'var(--pie-passage-header-background, rgba(255,255,255,0))',
-        color: _renderUi.color.text(),
-        fontFamily: 'Roboto, sans-serif',
-        // Freeze the tabs' physical size at their 200%-zoom appearance
-        // when browser zoom exceeds 200%. The factor is 1 at zoom <= 200%,
-        // so behavior below that threshold is unchanged. Using `zoom`
-        // (rather than transform: scale) shrinks the layout box itself,
-        // so the reclaimed space flows to the passage content below.
-        zoom: zoomCompensation,
-        '& .MuiTabs-list': {
-          /*
-           * The strip behind the tabs. A host that has opted into
-           * `--pie-passage-header-background` keeps its own colour on every
-           * scheme -- Knowledge Checks' pale green-blue is deliberate and is not
-           * a scheme's business to override. With no host colour the fallback has
-           * to be a theme token rather than a white literal, or the strip stays
-           * white over a dark passage body.
-           */
-          backgroundColor: `var(--pie-passage-header-background, ${_renderUi.color.backgroundDark()})`,
-          borderBottom: `1px solid ${_renderUi.color.borderGray()}`
-        },
-        '& .MuiTabs-indicator': {
-          backgroundColor: _renderUi.color.white(),
-          marginBottom: '-1px'
-        }
-      },
-      value: activeTab,
-      onChange: this.handleChange
-    }, tabs.map((tab, index) => /*#__PURE__*/_react.default.createElement(TabStyled, {
-      key: tab.id,
-      id: `button-${tab.id}`,
-      sx: tabMaxWidth ? {
-        maxWidth: `${tabMaxWidth}px`
-      } : undefined,
-      label: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_renderUi.Purpose, {
-        purpose: "passage-label"
-      }, useNumericLabels ? /*#__PURE__*/_react.default.createElement("span", {
-        className: "passage-label"
-      }, `Passage ${index + 1}`) : /*#__PURE__*/_react.default.createElement("span", {
-        className: "passage-label",
-        dangerouslySetInnerHTML: {
-          __html: this.parsedText(tab.label)
-        }
-      })), /*#__PURE__*/_react.default.createElement(Underline, {
-        className: "passage-label-underline"
-      })),
-      value: tab.id,
-      tabIndex: activeTab === tab.id ? 0 : -1,
-      "aria-controls": `tabpanel-${tab.id}`,
-      "aria-selected": activeTab === tab.id,
-      onKeyDown: event => this.handleKeyDown(event, tab.id)
-    }))), selectedTab ? this.renderTab(selectedTab, disabledTabs) : null)));
-  }
-}
-StimulusTabs.propTypes = {
-  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,
-  model: _propTypes.default.object,
-  baseHeadingLevel: _propTypes.default.number
-};
-var _default = exports.default = StimulusTabs;
-//# sourceMappingURL=stimulus-tabs.js.map

package/lib/stimulus-tabs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"stimulus-tabs.js","names":["_react","_interopRequireDefault","require","_propTypes","_Tabs","_Tab","_styles","_renderUi","STICKY_TABS_BREAKPOINT","MAX_TABS_ZOOM","MIN_ZOOM_COMPENSATION","NUMERIC_LABEL_MIN_WIDTH_PER_TAB","computeZoomCompensation","window","ratio","outerWidth","innerWidth","zoom","Number","isFinite","Math","max","min","PassagesContainer","styled","flexGrow","backgroundColor","color","background","text","borderCollapse","padding","textAlign","Passage","theme","spacing","borderLeft","margin","PassageTitle","fontSize","PassageSubtitle","PassageAuthor","TabStyled","Tab","fontFamily","borderRadius","border","borderGray","borderBottomWidth","minHeight","display","alignItems","justifyContent","textTransform","WebkitLineClamp","WebkitBoxOrient","overflow","textOverflow","whiteSpace","opacity","tertiary","tertiaryLight","Underline","height","width","marginTop","StimulusTabs","React","Component","constructor","args","_defineProperty2","default","activeTab","zoomCompensation","containerWidth","createRef","setState","node","containerRef","current","clientWidth","state","event","setTimeout","tabChangeEvent","CustomEvent","detail","tab","dispatchEvent","currentTabId","key","tabs","props","newTabIndex","currentIndex","findIndex","id","length","preventDefault","stopPropagation","handleChange","document","getElementById","focus","div","createElement","innerHTML","replace","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","componentDidMount","addEventListener","updateZoomCompensation","ResizeObserver","resizeObserver","updateContainerWidth","observe","componentWillUnmount","removeEventListener","disconnect","renderInstructions","teacherInstructions","disabledTabs","teacherInstructionsDiv","PreviewPrompt","tagName","className","defaultClassName","prompt","Collapsible","labels","hidden","visible","renderTab","baseHeadingLevel","clampedLevel","undefined","TitleTag","textLevel","role","title","Purpose","purpose","dangerouslySetInnerHTML","__html","parsedText","subtitle","author","transformDataHeadings","render","model","extraCSSRules","selectedTab","find","tabMaxWidth","useNumericLabels","UiLayout","ref","map","Fragment","sx","position","top","zIndex","backgroundDark","borderBottom","white","marginBottom","value","onChange","index","maxWidth","label","tabIndex","onKeyDown","handleKeyDown","propTypes","PropTypes","arrayOf","shape","number","isRequired","string","bool","object","_default","exports"],"sources":["../src/stimulus-tabs.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport Tabs from '@mui/material/Tabs';\nimport Tab from '@mui/material/Tab';\nimport { styled } from '@mui/material/styles';\nimport { Collapsible, color, PreviewPrompt, Purpose, UiLayout, transformDataHeadings } from '@pie-lib/render-ui';\n\n// Must match the breakpoint Quiz Engine passes to the PIE section player for\n// switching from the side-by-side passage/question layout to the tabbed layout.\n// Below (and at) this width the passage tabs scroll with the passage content\n// instead of being locked to the top of the panel, so that they do not lock up\n// space needed for the passage text (WCAG 1.4.10 Reflow, 400% zoom / 320px).\nconst STICKY_TABS_BREAKPOINT = 840;\n\n/**\n * Zoom compensation for the passage selection tabs.\n *\n * The tabs scale naturally with browser zoom up to 200%. Beyond 200%,\n * we shrink their CSS size proportionally so their physical on-screen size\n * freezes at the 200% appearance, leaving more room for passage content\n * in high-zoom / small-window situations.\n * The factor is min(1, 2 / zoom): exactly 1 at zoom <= 200% (component\n * behavior unchanged), shrinking proportionally above that. A lower clamp\n * of 0.4 guards against inflated ratios (docked devtools, browser side\n * panels, window chrome) ever making the tabs unusably small.\n */\nconst MAX_TABS_ZOOM = 2;\nconst MIN_ZOOM_COMPENSATION = 0.4;\n\n// Per-tab horizontal-space floor in CSS pixels. When the passage container is\n// narrow enough that each tab would have at most this much room\n// (containerWidth <= tabs.length * NUMERIC_LABEL_MIN_WIDTH_PER_TAB), tab labels\n// fall back to \"Passage 1\", \"Passage 2\", ... so navigation stays usable instead\n// of being dominated by aggressively truncated titles.\nconst NUMERIC_LABEL_MIN_WIDTH_PER_TAB = 170;\n\nconst computeZoomCompensation = () => {\n  if (typeof window === 'undefined') return 1;\n  const ratio = window.outerWidth / window.innerWidth;\n  const zoom = Number.isFinite(ratio) && ratio > 0 ? ratio : 1;\n  return Math.max(MIN_ZOOM_COMPENSATION, Math.min(1, MAX_TABS_ZOOM / zoom));\n};\n\nconst PassagesContainer = styled('div')({\n  flexGrow: 1,\n  backgroundColor: color.background(),\n  color: color.text(),\n  '&:not(.MathJax) table': {\n    borderCollapse: 'collapse',\n  },\n  '&:not(.MathJax) table td, &:not(.MathJax) table th': {\n    padding: '.6em 1em',\n    textAlign: 'left',\n  },\n});\n\nconst Passage = styled('div')(({ theme }) => ({\n  backgroundColor: color.background(),\n  color: color.text(),\n  padding: theme.spacing(2),\n  '& blockquote': {\n    background: '#f9f9f9',\n    borderLeft: '5px solid #ccc',\n    margin: '1.5em 10px',\n    padding: '.5em 10px',\n  },\n}));\n\nconst PassageTitle = styled('div')({\n  fontSize: '1.75rem',\n});\n\nconst PassageSubtitle = styled('div')({\n  fontSize: '1.5rem',\n});\n\nconst PassageAuthor = styled('div')({\n  fontSize: '1.25rem',\n});\n\nconst TabStyled = styled(Tab)(({ theme }) => ({\n  /*\n   * The tab carries the colour of the panel it opens, which is what makes it read as a\n   * tab rather than a button, and it has to be the themed panel colour: MUI's palette\n   * does not follow `--pie-*`, so `common.white` here left the tab white on every color\n   * scheme while the passage body beneath it went dark. The comment this replaces gated\n   * the change on PD-2801, which is about OT's `color-contrast` class -- the mechanism\n   * pie-theme superseded, and blocked since 2023.\n   */\n  background: color.background(),\n  fontSize: 'inherit',\n  fontFamily: 'Roboto, sans-serif',\n  color: color.text(),\n  borderRadius: `${theme.spacing(2)} ${theme.spacing(2)} 0 0`,\n  /*\n   * `--pie-border-gray` is stepped to the 3:1 non-text minimum in every scheme. The\n   * literal it replaces measured about 1.2:1 against the dark schemes' surfaces, so the\n   * tab outline -- the only thing separating an unselected tab from the strip -- was\n   * invisible there.\n   */\n  border: `1px solid ${color.borderGray()}`,\n  borderBottomWidth: 0,\n  minHeight: '56px',\n  padding: '8px 10px',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  margin: `0 ${theme.spacing(1)}`,\n  textTransform: 'none',\n\n  '.passage-label': {\n    display: '-webkit-box',\n    WebkitLineClamp: 2,\n    WebkitBoxOrient: 'vertical',\n    overflow: 'hidden',\n    textOverflow: 'ellipsis',\n    whiteSpace: 'normal',\n    margin: 'auto 0',\n    opacity: 0.7,\n  },\n\n  '&.Mui-selected': {\n    color: color.text(),\n    '.passage-label': {\n      opacity: 1,\n    },\n    '.passage-label-underline': {\n      backgroundColor: color.tertiary(),\n    },\n  },\n\n  '&:hover': {\n    '.passage-label-underline': {\n      backgroundColor: color.tertiaryLight(),\n    },\n  },\n\n  '& .MuiTouchRipple-root': {\n    opacity: 0.7,\n  },\n}));\n\n/*\n * The selection indicator, one per tab. Unselected it has to disappear into the tab, so it\n * paints the tab's own background rather than a fixed white; selected it becomes\n * `--pie-tertiary`, which every scheme sets.\n */\nconst Underline = styled('div')(() => ({\n  height: '2px',\n  width: '100%',\n  marginTop: '6px',\n  background: color.background(),\n}));\n\nclass StimulusTabs extends React.Component {\n  state = {\n    activeTab: 0,\n    zoomCompensation: computeZoomCompensation(),\n    containerWidth: 0,\n  };\n\n  containerRef = React.createRef();\n\n  componentDidMount() {\n    if (typeof window === 'undefined') return;\n    window.addEventListener('resize', this.updateZoomCompensation);\n\n    if (this.containerRef.current && typeof ResizeObserver !== 'undefined') {\n      this.resizeObserver = new ResizeObserver(this.updateContainerWidth);\n      this.resizeObserver.observe(this.containerRef.current);\n    }\n\n    this.updateContainerWidth();\n  }\n\n  componentWillUnmount() {\n    if (typeof window === 'undefined') return;\n    window.removeEventListener('resize', this.updateZoomCompensation);\n\n    if (this.resizeObserver) {\n      this.resizeObserver.disconnect();\n      this.resizeObserver = null;\n    }\n  }\n\n  updateZoomCompensation = () => {\n    this.setState({ zoomCompensation: computeZoomCompensation() });\n  };\n\n  updateContainerWidth = () => {\n    const node = this.containerRef.current;\n    if (!node) return;\n    const width = node.clientWidth;\n    if (width !== this.state.containerWidth) {\n      this.setState({ containerWidth: width });\n    }\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      event.stopPropagation();\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 (!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 { baseHeadingLevel } = this.props;\n    const clampedLevel = baseHeadingLevel ? Math.min(6, Math.max(1, baseHeadingLevel)) : undefined;\n    const TitleTag = baseHeadingLevel ? `h${clampedLevel}` : 'h2'; // default to h2 if no base level is provided - this was the previous behavior\n    const textLevel = baseHeadingLevel ? Math.min(6, Math.max(1, clampedLevel + 1)) : undefined; // promote text headings one level above title\n\n    return (\n      <Passage key={tab.id} id={`tabpanel-${tab.id}`} role=\"tabpanel\" aria-labelledby={`button-${tab.id}`}>\n        {this.renderInstructions(tab.teacherInstructions, disabledTabs)}\n\n        {tab.title && (\n          <Purpose purpose=\"passage-title\">\n            <TitleTag>\n              <PassageTitle dangerouslySetInnerHTML={{ __html: this.parsedText(tab.title) }} />\n            </TitleTag>\n          </Purpose>\n        )}\n\n        {tab.subtitle && (\n          <Purpose purpose=\"passage-subtitle\">\n            <PassageSubtitle dangerouslySetInnerHTML={{ __html: this.parsedText(tab.subtitle) }} />\n          </Purpose>\n        )}\n\n        {tab.author && (\n          <Purpose purpose=\"passage-author\">\n            <PassageAuthor className=\"author\" dangerouslySetInnerHTML={{ __html: this.parsedText(tab.author) }} />\n          </Purpose>\n        )}\n\n        {tab.text && (\n          <Purpose purpose=\"passage-text\">\n            <div key={tab.id} className=\"text\" dangerouslySetInnerHTML={{ __html: baseHeadingLevel ? transformDataHeadings(tab.text, textLevel) : tab.text }} />\n          </Purpose>\n        )}\n      </Passage>\n    );\n  }\n\n  render() {\n    const { model, tabs, disabledTabs } = this.props;\n    const { activeTab, zoomCompensation, containerWidth } = this.state;\n\n    if (!tabs?.length) {\n      return;\n    }\n\n    const { extraCSSRules } = model || {};\n    const selectedTab = (tabs || []).find((tab) => tab.id === activeTab);\n\n    // cap each tab at 1/n of the passage container width so a single long\n    // title can't push other tabs off-screen. Existing two-line wrap + ellipsis\n    // on .passage-label still trims anything that doesn't fit.\n    const tabMaxWidth = containerWidth > 0 ? containerWidth / tabs.length : null;\n    // When per-tab horizontal space drops to NUMERIC_LABEL_MIN_WIDTH_PER_TAB or\n    // less, titles become unreadably truncated; swap to \"Passage N\" so users\n    // can still navigate. Container width is read once layout has settled\n    // (>0), so initial render uses real labels.\n    const useNumericLabels =\n      containerWidth > 0 && containerWidth <= tabs.length * NUMERIC_LABEL_MIN_WIDTH_PER_TAB;\n\n    return (\n      <UiLayout extraCSSRules={extraCSSRules}>\n        <PassagesContainer className=\"passages\" ref={this.containerRef}>\n          {disabledTabs || tabs.length === 1 ? (\n            tabs.map((tab) => this.renderTab(tab, disabledTabs))\n          ) : (\n            <>\n              <Tabs\n                sx={{\n                  // Below the breakpoint (e.g. WCAG 400% zoom, ~320px viewport)\n                  // the tabs are in normal flow and scroll with the passage text,\n                  // so they don't lock up space needed to display the passage.\n                  position: 'static',\n                  // Above the breakpoint there is adequate screen space, so the\n                  // tabs stay locked to the top of the panel while the passage\n                  // text scrolls beneath them.\n                  [`@media (min-width: ${STICKY_TABS_BREAKPOINT + 1}px)`]: {\n                    position: 'sticky',\n                    top: 0,\n                    zIndex: 1,\n                  },\n                  background: 'var(--pie-passage-header-background, rgba(255,255,255,0))',\n                  color: color.text(),\n                  fontFamily: 'Roboto, sans-serif',\n                  // Freeze the tabs' physical size at their 200%-zoom appearance\n                  // when browser zoom exceeds 200%. The factor is 1 at zoom <= 200%,\n                  // so behavior below that threshold is unchanged. Using `zoom`\n                  // (rather than transform: scale) shrinks the layout box itself,\n                  // so the reclaimed space flows to the passage content below.\n                  zoom: zoomCompensation,\n                  '& .MuiTabs-list': {\n                    /*\n                     * The strip behind the tabs. A host that has opted into\n                     * `--pie-passage-header-background` keeps its own colour on every\n                     * scheme -- Knowledge Checks' pale green-blue is deliberate and is not\n                     * a scheme's business to override. With no host colour the fallback has\n                     * to be a theme token rather than a white literal, or the strip stays\n                     * white over a dark passage body.\n                     */\n                    backgroundColor: `var(--pie-passage-header-background, ${color.backgroundDark()})`,\n                    borderBottom: `1px solid ${color.borderGray()}`,\n                  },\n                  '& .MuiTabs-indicator': {\n                    backgroundColor: color.white(),\n                    marginBottom: '-1px',\n                  },\n                }}\n                value={activeTab}\n                onChange={this.handleChange}\n              >\n                {tabs.map((tab, index) => (\n                  <TabStyled\n                    key={tab.id}\n                    id={`button-${tab.id}`}\n                    sx={tabMaxWidth ? { maxWidth: `${tabMaxWidth}px` } : undefined}\n                    label={\n                      <>\n                        <Purpose purpose=\"passage-label\">\n                          {useNumericLabels ? (\n                            <span className=\"passage-label\">{`Passage ${index + 1}`}</span>\n                          ) : (\n                            <span\n                              className=\"passage-label\"\n                              dangerouslySetInnerHTML={{ __html: this.parsedText(tab.label) }}\n                            />\n                          )}\n                        </Purpose>\n                        <Underline className=\"passage-label-underline\" />\n                      </>\n                    }\n                    value={tab.id}\n                    tabIndex={activeTab === tab.id ? 0 : -1}\n                    aria-controls={`tabpanel-${tab.id}`}\n                    aria-selected={activeTab === tab.id}\n                    onKeyDown={(event) => this.handleKeyDown(event, tab.id)}\n                  />\n                ))}\n              </Tabs>\n              {selectedTab ? this.renderTab(selectedTab, disabledTabs) : null}\n            </>\n          )}\n        </PassagesContainer>\n      </UiLayout>\n    );\n  }\n}\n\nStimulusTabs.propTypes = {\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  model: PropTypes.object,\n  baseHeadingLevel: PropTypes.number,\n};\n\nexport default StimulusTabs;\n"],"mappings":"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","ignoreList":[]}

package/module/configure.js

@@ -1 +0,0 @@
-import{_dll_prop_types as e,_dll_mui__material_styles as t,_dll_react as n,_dll_mui__material as a,_dll_mui__icons_material as i,_dll_react_dom_client as s}from"../../../@pie-lib/shared-module@6.0.0/module/index.js";import{_dll_pie_lib__config_ui as l}from"../../../@pie-lib/config-module@5.0.0/module/index.js";import{_dll_pie_lib__editable_html_tip_tap as o}from"../../../@pie-lib/editable-html-module@8.0.0/module/index.js";var r={};Object.defineProperty(r,"__esModule",{value:!0});class d extends CustomEvent{constructor(e,t=!1){super(d.TYPE,{bubbles:!0,detail:{update:e,reset:t}}),this.update=e,this.reset=t}}d.TYPE="model.updated";var u=r.ModelUpdatedEvent=d;class c extends CustomEvent{constructor(e,t){super(c.TYPE,{bubbles:!0,detail:{src:e,done:t}}),this.src=e,this.done=t}}c.TYPE="delete.image";var g=r.DeleteImageEvent=c;class p extends CustomEvent{constructor(e){super(p.TYPE,{bubbles:!0,detail:e}),this.handler=e}}p.TYPE="insert.image";var h=r.InsertImageEvent=p;class m extends CustomEvent{constructor(e,t){super(m.TYPE,{bubbles:!0,detail:{src:e,done:t}}),this.src=e,this.done=t}}m.TYPE="delete.sound";var b=r.DeleteSoundEvent=m;class _ extends CustomEvent{constructor(e){super(_.TYPE,{bubbles:!0,detail:e}),this.handler=e}}_.TYPE="insert.sound";var C=r.InsertSoundEvent=_;const E=n,f=e,{styled:x}=t,{Button:S}=a,{Dialog:I}=a,{DialogTitle:v}=a,{DialogContent:P}=a,{DialogContentText:y}=a,{DialogActions:T}=a,{RemoveCircle:R}=i,{AddCircle:q}=i,D=x(({label:e,type:t="add",onClick:n})=>{const a="add"===t?q:R;return E.createElement(S,{color:"primary",size:"small",onClick:n},E.createElement(a,{fontSize:"small",color:"primary",style:{marginRight:4}}),e)})({textDecoration:"underline","&:hover":{textDecoration:"underline",backgroundColor:"transparent"},display:"flex",alignItems:"center"}),k=({content:e,cancel:t,title:n,ok:a,open:i,onOk:s,onCancel:l})=>E.createElement(I,{open:i},E.createElement(v,null,n),E.createElement(P,null,E.createElement(y,null,e)),E.createElement(T,null,s&&E.createElement(S,{onClick:s,color:"primary"},a),l&&E.createElement(S,{onClick:l,color:"primary"},t)));k.propTypes={content:f.string.isRequired,title:f.string.isRequired,cancel:f.string.isRequired,ok:f.string.isRequired,open:f.bool.isRequired,onCancel:f.func.isRequired,onOk:f.func.isRequired};const A=n,M=e,{styled:w}=t,{InputContainer:j}=l,O=o,{ALL_PLUGINS:Y}=o;function L(e){let t,n=e[0],a=1;for(;a<e.length;){const i=e[a],s=e[a+1];if(a+=2,("optionalAccess"===i||"optionalCall"===i)&&null==n)return;"access"===i||"optionalAccess"===i?(t=n,n=s(n)):"call"!==i&&"optionalCall"!==i||(n=s((...e)=>n.call(t,...e)),t=void 0)}return n}const H=w(j)(({theme:e})=>({paddingTop:e.spacing(2),marginBottom:e.spacing(2),width:"100%"})),W=w("div")(({theme:e})=>({fontSize:e.typography.fontSize-2,color:e.palette.error.main,paddingTop:e.spacing(1)}));class z extends A.Component{static __initStatic(){this.propTypes={onModelChanged:M.func.isRequired,model:M.object.isRequired,configuration:M.object.isRequired,imageSupport:M.object.isRequired,passageIndex:M.number.isRequired,uploadSoundSupport:M.object.isRequired}}static __initStatic2(){this.defaultProps={passageIndex:0}}constructor(e){super(e),z.prototype.__init.call(this)}__init(){this.handleChange=(e,t)=>{const{model:n,onModelChanged:a,passageIndex:i}=this.props;if(!n.passages||i<0||i>=n.passages.length)return;const s=[...n.passages];s[i]={...s[i],[e]:t},a({...n,passages:s})}}render(){const{model:e,configuration:t,imageSupport:n,passageIndex:a,uploadSoundSupport:i}=this.props,{maxImageWidth:s={},maxImageHeight:l={},mathMlOptions:o={},baseInputConfiguration:r={},teacherInstructions:d={},title:u={},subtitle:c={},text:g={},author:p={}}=t||{},{errors:h={},passages:m=[],teacherInstructionsEnabled:b,titleEnabled:_,subtitleEnabled:C,authorEnabled:E,textEnabled:f}=e||{},{passages:x}=h||{},{teacherInstructions:S,title:I,subtitle:v,author:P,text:y}=x&&x[a]||{},T=s&&s.prompt,R=l&&l.prompt,q=e=>({...r,...e}),D=(Y||[]).filter(e=>!["math","table","bulleted-list","numbered-list"].includes(e));return A.createElement(A.Fragment,null,b&&A.createElement(H,{label:d.label},A.createElement(O,{activePlugins:Y,markup:m[a].teacherInstructions||"",onChange:e=>this.handleChange("teacherInstructions",e),nonEmpty:!1,error:S,maxImageWidth:s&&s.teacherInstructions||T,maxImageHeight:l&&l.teacherInstructions||R,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([d,"optionalAccess",e=>e.inputConfiguration]))}),S&&A.createElement(W,null,S)),_&&A.createElement(H,{label:u.label},A.createElement(O,{activePlugins:D,markup:m[a].title||"",onChange:e=>this.handleChange("title",e),nonEmpty:!1,error:I,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([u,"optionalAccess",e=>e.inputConfiguration]))}),I&&A.createElement(W,null,I)),C&&A.createElement(H,{label:c.label},A.createElement(O,{activePlugins:D,markup:m[a].subtitle||"",onChange:e=>this.handleChange("subtitle",e),nonEmpty:!1,error:v,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([c,"optionalAccess",e=>e.inputConfiguration]))}),v&&A.createElement(W,null,v)),E&&A.createElement(H,{label:p.label},A.createElement(O,{activePlugins:D,markup:m[a].author||"",onChange:e=>this.handleChange("author",e),nonEmpty:!1,error:P,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([p,"optionalAccess",e=>e.inputConfiguration]))}),P&&A.createElement(W,null,P)),f&&A.createElement(H,{label:g.label},A.createElement(O,{activePlugins:Y,markup:m[a].text||"",onChange:e=>this.handleChange("text",e),imageSupport:n,uploadSoundSupport:i,nonEmpty:!1,error:y,maxImageWidth:s&&s.text||T,maxImageHeight:l&&l.text||R,mathMlOptions:o,languageCharactersProps:[{language:"spanish"},{language:"special"}],pluginProps:q(L([g,"optionalAccess",e=>e.inputConfiguration]))}),y&&A.createElement(W,null,y)))}}z.__initStatic(),z.__initStatic2();const B=n,$=e,{styled:F}=t,{Typography:U}=a,{settings:G}=l,{layout:N}=l,{Panel:J,toggle:K,dropdown:Q}=G,V=F(U)(({theme:e})=>({paddingTop:e.spacing(2),marginBottom:e.spacing(2)}));class X extends B.Component{static __initStatic(){this.propTypes={onModelChanged:$.func.isRequired,onConfigurationChanged:$.func,model:$.object.isRequired,configuration:$.object.isRequired,imageSupport:$.object.isRequired,uploadSoundSupport:$.object.isRequired,classes:$.object.isRequired}}constructor(e){super(e),X.prototype.__init.call(this),X.prototype.__init2.call(this),X.prototype.__init3.call(this),X.prototype.__init4.call(this),this.state={showConfirmationDialog:!1,indexToRemove:-1}}__init(){this.getInnerText=e=>(e||"").replaceAll(/<[^>]*>/g,"")}__init2(){this.onDelete=(e,t,n)=>{let a=e.passages;a.splice(t,1),n({...e,passages:a}),this.setState({showConfirmationDialog:!1,indexToRemove:-1})}}__init3(){this.removeAdditionalPassage=e=>{const{model:t={},onModelChanged:n}=this.props,{passages:a=[]}=t,{teacherInstructions:i="",title:s="",subtitle:l="",author:o="",text:r=""}=a[e];this.getInnerText(i).trim()||this.getInnerText(s).trim()||this.getInnerText(l).trim()||this.getInnerText(o).trim()||this.getInnerText(r).trim()?this.setState({showConfirmationDialog:!0,indexToRemove:e}):this.onDelete(t,e,n)}}__init4(){this.addAdditionalPassage=()=>{const{model:e,onModelChanged:t}=this.props,n=[...e.passages,{teacherInstructions:"",title:"",subtitle:"",author:"",text:""}];t({...e,passages:n})}}render(){const{model:e,configuration:t,imageSupport:n,onConfigurationChanged:a,onModelChanged:i,uploadSoundSupport:s}=this.props,{settingsPanelDisabled:l,language:o={},languageChoices:r={},teacherInstructions:d={},title:u={},subtitle:c={},text:g={},author:p={},additionalPassage:h={}}=t||{},{extraCSSRules:m,passages:b}=e||{},_={titleEnabled:u&&u.settings&&K(u.label),subtitleEnabled:c&&c.settings&&K(c.label),authorEnabled:p&&p.settings&&K(p.label),textEnabled:g&&g.settings&&K(g.label),"additionalPassage.enabled":h&&h.settings&&K(h.label,!0)},C={teacherInstructionsEnabled:d&&d.settings&&K(d.label),"language.enabled":o&&o.settings&&K(o.label,!0),language:o&&o.settings&&o.enabled&&Q(r.label,r.options)},E=`${h.label} will be deleted`,{indexToRemove:f,showConfirmationDialog:x}=this.state;return B.createElement(N.ConfigLayout,{extraCSSRules:m,hideSettings:l,settings:B.createElement(J,{model:e,configuration:t,onChangeModel:e=>i(e),onChangeConfiguration:e=>a(e),groups:{Settings:_,Properties:C}})},b.map((a,l)=>B.createElement(B.Fragment,{key:l},l>0&&B.createElement(V,{variant:"h5"},h.label),B.createElement(z,{imageSupport:n,uploadSoundSupport:s,model:e,configuration:t,passageIndex:l,onModelChanged:i}),l>0&&h.enabled&&B.createElement(D,{type:"remove",label:`Remove ${h.label}`,onClick:()=>this.removeAdditionalPassage(l)}),0===l&&h.enabled&&b.length<2&&B.createElement(D,{label:`Add ${h.label}`,onClick:this.addAdditionalPassage}))),B.createElement(k,{open:x,title:"Warning",content:E,cancel:"Cancel",ok:"Ok",onCancel:()=>this.setState({showConfirmationDialog:!1}),onOk:()=>this.onDelete(e,f,i)}))}}X.__initStatic();var Z={authorEnabled:!0,passages:[{teacherInstructions:"",title:"",subtitle:"",author:"",text:""}],subtitleEnabled:!0,teacherInstructionsEnabled:!0,textEnabled:!0,titleEnabled:!0},ee={baseInputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1},h3:{disabled:!0},blockquote:{disabled:!0},textAlign:{disabled:!0},showParagraphs:{disabled:!1},separateParagraphs:{disabled:!0}},settingsPanelDisabled:!1,title:{settings:!0,label:"Title",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0},textAlign:{disabled:!1}},required:!0},subtitle:{settings:!0,label:"Subtitle",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0},textAlign:{disabled:!1}},required:!1},author:{settings:!0,label:"Author",inputConfiguration:{audio:{disabled:!0},video:{disabled:!0},image:{disabled:!0}},required:!1},text:{settings:!0,label:"Text",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1},h3:{disabled:!1},blockquote:{disabled:!1},textAlign:{disabled:!1}},required:!0},teacherInstructions:{settings:!0,label:"Teacher Instructions",inputConfiguration:{audio:{disabled:!1},video:{disabled:!1},image:{disabled:!1}},required:!1},maxImageWidth:{teacherInstructions:300,text:300},maxImageHeight:{teacherInstructions:300,text:300},mathMlOptions:{mmlOutput:!1,mmlEditing:!1},language:{settings:!1,label:"Specify Language",enabled:!1},languageChoices:{label:"Language Choices",options:[]},additionalPassage:{settings:!0,label:"Additional Passage",enabled:!1}};const te=n,{createRoot:ne}=s;class ae extends HTMLElement{static __initStatic(){this.createDefaultModel=(e={})=>({...Z,...e})}constructor(){super(),this._root=null,this._model=ae.createDefaultModel(),this._configuration=ee}set model(e){this._model=ae.createDefaultModel(e),this.render()}set configuration(e){this._configuration=e,this.render()}connectedCallback(){this.render()}modelChanged(e){this._model=e,this.dispatchEvent(new u(this._model),!0),this.render()}onConfigurationChanged(e){this._configuration=e,this.render()}insertImage(e){this.dispatchEvent(new h(e))}onDeleteImage(e,t){this.dispatchEvent(new g(e,t))}insertSound(e){this.dispatchEvent(new C(e))}onDeleteSound(e,t){this.dispatchEvent(new b(e,t))}render(){if(this._model){const e=te.createElement(X,{model:this._model,configuration:this._configuration,onModelChanged:this.modelChanged.bind(this),onConfigurationChanged:this.onConfigurationChanged.bind(this),imageSupport:{add:this.insertImage.bind(this),delete:this.onDeleteImage.bind(this)},uploadSoundSupport:{add:this.insertSound.bind(this),delete:this.onDeleteSound.bind(this)}});this._root||(this._root=ne(this)),this._root.render(e)}}disconnectedCallback(){this._root&&(this._root.unmount(),this._root=null)}}ae.__initStatic();export{ae as default};