@pie-element/inline-dropdown 10.1.1 → 10.1.2-next.0

package/lib/index.js

@@ -1,85 +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 _client = require("react-dom/client");
-var _piePlayerEvents = require("@pie-framework/pie-player-events");
-var _mathRendering = require("@pie-lib/math-rendering");
-var _inlineDropdown = _interopRequireDefault(require("./inline-dropdown"));
-class RootInlineDropdown extends HTMLElement {
-  constructor() {
-    super();
-    (0, _defineProperty2.default)(this, "_render", () => {
-      if (this._model && this._session) {
-        let elem = /*#__PURE__*/_react.default.createElement(_inlineDropdown.default, {
-          model: this._model,
-          prompt: this._model.prompt,
-          rationale: this._model.rationale,
-          teacherInstructions: this._model.teacherInstructions,
-          disabled: this._model.disabled,
-          displayType: this._model.displayType,
-          markup: this._model.markup,
-          mode: this._model.mode,
-          choices: this._model.choices,
-          value: this._session.value,
-          feedback: this._model.feedback,
-          language: this._model.language,
-          onChange: this.changeSession
-        });
-        this.setLangAttribute();
-        if (!this._root) {
-          this._root = (0, _client.createRoot)(this);
-        }
-        this._root.render(elem);
-        queueMicrotask(() => {
-          (0, _mathRendering.renderMath)(this);
-        });
-      }
-    });
-    (0, _defineProperty2.default)(this, "dispatchChangedEvent", () => {
-      this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), this.session && !!this.session.value));
-    });
-    (0, _defineProperty2.default)(this, "changeSession", value => {
-      this.session.value = value;
-      this.dispatchChangedEvent();
-      this._render();
-    });
-    this._model = null;
-    this._session = null;
-    this._root = null;
-  }
-  set model(m) {
-    this._model = m;
-    this.dispatchEvent(new _piePlayerEvents.ModelSetEvent(this.tagName.toLowerCase(), this.session && !!this.session.value, !!this._model));
-    this._render();
-  }
-  set session(s) {
-    this._session = s;
-    this._render();
-  }
-  get session() {
-    return this._session;
-  }
-  setLangAttribute() {
-    const language = this._model && typeof this._model.language ? this._model.language : '';
-    const lang = language ? language.slice(0, 2) : 'en';
-    this.setAttribute('lang', lang);
-  }
-  connectedCallback() {
-    this.setAttribute('aria-label', 'Inline Dropdown Question');
-    this.setAttribute('role', 'region');
-    this._render();
-  }
-  disconnectedCallback() {
-    if (this._root) {
-      this._root.unmount();
-    }
-  }
-}
-exports.default = RootInlineDropdown;
-//# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_client","_piePlayerEvents","_mathRendering","_inlineDropdown","RootInlineDropdown","HTMLElement","constructor","_defineProperty2","default","_model","_session","elem","React","createElement","InlineDropdown","model","prompt","rationale","teacherInstructions","disabled","displayType","markup","mode","choices","value","feedback","language","onChange","changeSession","setLangAttribute","_root","createRoot","render","queueMicrotask","renderMath","dispatchEvent","SessionChangedEvent","tagName","toLowerCase","session","dispatchChangedEvent","_render","m","ModelSetEvent","s","lang","slice","setAttribute","connectedCallback","disconnectedCallback","unmount","exports"],"sources":["../src/index.js"],"sourcesContent":["import React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { ModelSetEvent, SessionChangedEvent } from '@pie-framework/pie-player-events';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport InlineDropdown from './inline-dropdown';\n\nexport default class RootInlineDropdown extends HTMLElement {\n  constructor() {\n    super();\n    this._model = null;\n    this._session = null;\n    this._root = null;\n  }\n  set model(m) {\n    this._model = m;\n    this.dispatchEvent(\n      new ModelSetEvent(this.tagName.toLowerCase(), this.session && !!this.session.value, !!this._model),\n    );\n\n    this._render();\n  }\n\n  set session(s) {\n    this._session = s;\n    this._render();\n  }\n\n  get session() {\n    return this._session;\n  }\n\n  setLangAttribute() {\n    const language = this._model && typeof this._model.language ? this._model.language : '';\n    const lang = language ? language.slice(0, 2) : 'en';\n    this.setAttribute('lang', lang);\n  }\n\n  _render = () => {\n    if (this._model && this._session) {\n      let elem = React.createElement(InlineDropdown, {\n        model: this._model,\n        prompt: this._model.prompt,\n        rationale: this._model.rationale,\n        teacherInstructions: this._model.teacherInstructions,\n        disabled: this._model.disabled,\n        displayType: this._model.displayType,\n        markup: this._model.markup,\n        mode: this._model.mode,\n        choices: this._model.choices,\n        value: this._session.value,\n        feedback: this._model.feedback,\n        language: this._model.language,\n        onChange: this.changeSession,\n      });\n\n      this.setLangAttribute();\n\n      if (!this._root) {\n        this._root = createRoot(this);\n      }\n      this._root.render(elem);\n      queueMicrotask(() => {\n        renderMath(this);\n      });\n    }\n  };\n\n  dispatchChangedEvent = () => {\n    this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), this.session && !!this.session.value));\n  };\n\n  changeSession = (value) => {\n    this.session.value = value;\n    this.dispatchChangedEvent();\n    this._render();\n  };\n\n  connectedCallback() {\n    this.setAttribute('aria-label', 'Inline Dropdown Question');\n    this.setAttribute('role', 'region');\n\n    this._render();\n  }\n\n  disconnectedCallback() {\n    if (this._root) {\n      this._root.unmount();\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/lib/inline-dropdown.js

@@ -1,176 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.InlineDropdown = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _lodashEs = require("lodash-es");
-var _correctAnswerToggle = _interopRequireDefault(require("@pie-lib/correct-answer-toggle"));
-var _maskMarkup = require("@pie-lib/mask-markup");
-var _renderUi = require("@pie-lib/render-ui");
-var _mathRendering = require("@pie-lib/math-rendering");
-var _styles = require("@mui/material/styles");
-const StyledUiLayout = (0, _styles.styled)(_renderUi.UiLayout)({
-  color: _renderUi.color.text(),
-  backgroundColor: _renderUi.color.background()
-});
-const StyledCollapsible = (0, _styles.styled)(_renderUi.Collapsible)(({
-  theme
-}) => ({
-  marginBottom: theme.spacing(2)
-}));
-const ChoiceRationaleWrapper = (0, _styles.styled)('div')(({
-  theme
-}) => ({
-  '&:not(:last-child)': {
-    marginBottom: theme.spacing(2)
-  }
-}));
-const ChoiceRationale = (0, _styles.styled)('div')({
-  display: 'flex',
-  whiteSpace: 'break-spaces'
-});
-const ChoiceRationaleLabel = (0, _styles.styled)('div')(({
-  correct
-}) => ({
-  display: 'flex',
-  ...(correct ? {
-    color: _renderUi.color.correct()
-  } : {
-    color: _renderUi.color.incorrectWithIcon()
-  })
-}));
-const SrOnly = (0, _styles.styled)('h2')({
-  position: 'absolute',
-  left: '-10000px',
-  top: 'auto',
-  width: '1px',
-  height: '1px',
-  overflow: 'hidden'
-});
-class InlineDropdown extends _react.default.Component {
-  constructor(...args) {
-    super(...args);
-    (0, _defineProperty2.default)(this, "state", {
-      showCorrectAnswer: false
-    });
-    (0, _defineProperty2.default)(this, "toggleShowCorrect", () => {
-      this.setState({
-        showCorrectAnswer: !this.state.showCorrectAnswer
-      });
-    });
-  }
-  UNSAFE_componentWillReceiveProps(nextProps) {
-    if ((0, _lodashEs.isEmpty)(nextProps.feedback)) {
-      this.setState({
-        showCorrectAnswer: false
-      });
-    }
-  }
-  componentDidUpdate() {
-    // eslint-disable-next-line
-    const domNode = _reactDom.default.findDOMNode(this);
-    (0, _mathRendering.renderMath)(domNode);
-  }
-  render() {
-    const {
-      showCorrectAnswer
-    } = this.state;
-    const {
-      prompt,
-      mode,
-      model,
-      rationale,
-      teacherInstructions,
-      choices,
-      displayType,
-      language
-    } = this.props;
-    const {
-      extraCSSRules
-    } = model || {};
-    const showCorrectAnswerToggle = mode === 'evaluate';
-    let choiceRationalesHaveText = false;
-    const showRationale = rationale && ((0, _renderUi.hasText)(rationale) || (0, _renderUi.hasMedia)(rationale));
-    const showTeacherInstructions = teacherInstructions && ((0, _renderUi.hasText)(teacherInstructions) || (0, _renderUi.hasMedia)(teacherInstructions));
-    const choiceRationales = (Object.keys(choices) || []).map(key => (choices[key] || []).reduce((acc, currentValue) => {
-      if (currentValue.rationale && (0, _renderUi.hasText)(currentValue.rationale)) {
-        choiceRationalesHaveText = true;
-        acc.push(currentValue);
-      }
-      return acc;
-    }, []));
-    return /*#__PURE__*/_react.default.createElement(StyledUiLayout, {
-      extraCSSRules: extraCSSRules,
-      style: {
-        display: `${displayType}`
-      }
-    }, mode === 'gather' && /*#__PURE__*/_react.default.createElement(SrOnly, null, "Inline Dropdown Question"), showTeacherInstructions && /*#__PURE__*/_react.default.createElement(StyledCollapsible, {
-      labels: {
-        hidden: 'Show Teacher Instructions',
-        visible: 'Hide Teacher Instructions'
-      }
-    }, /*#__PURE__*/_react.default.createElement(_renderUi.PreviewPrompt, {
-      prompt: teacherInstructions
-    })), prompt && /*#__PURE__*/_react.default.createElement(_renderUi.PreviewPrompt, {
-      prompt: prompt
-    }), /*#__PURE__*/_react.default.createElement(_correctAnswerToggle.default, {
-      show: showCorrectAnswerToggle,
-      toggled: showCorrectAnswer,
-      onToggle: this.toggleShowCorrect,
-      language: language
-    }), /*#__PURE__*/_react.default.createElement(_maskMarkup.InlineDropdown, (0, _extends2.default)({}, this.props, {
-      showCorrectAnswer: showCorrectAnswer
-    })), choiceRationalesHaveText && /*#__PURE__*/_react.default.createElement(StyledCollapsible, {
-      labels: {
-        hidden: 'Show Rationale for choices',
-        visible: 'Hide Rationale for choices'
-      }
-    }, choiceRationales.map((choices, index) => /*#__PURE__*/_react.default.createElement(ChoiceRationaleWrapper, {
-      key: index
-    }, choices?.length > 0 && choices.map(choice => /*#__PURE__*/_react.default.createElement(ChoiceRationale, {
-      key: choice.label
-    }, /*#__PURE__*/_react.default.createElement(ChoiceRationaleLabel, {
-      correct: choice.correct,
-      dangerouslySetInnerHTML: {
-        __html: `${choice.label}: `
-      }
-    }), /*#__PURE__*/_react.default.createElement(_renderUi.PreviewPrompt, {
-      prompt: choice.rationale
-    })))))), showRationale && /*#__PURE__*/_react.default.createElement(_renderUi.Collapsible, {
-      labels: {
-        hidden: 'Show Rationale',
-        visible: 'Hide Rationale'
-      }
-    }, /*#__PURE__*/_react.default.createElement(_renderUi.PreviewPrompt, {
-      prompt: rationale
-    })));
-  }
-}
-exports.InlineDropdown = InlineDropdown;
-(0, _defineProperty2.default)(InlineDropdown, "propTypes", {
-  prompt: _propTypes.default.string,
-  disabled: _propTypes.default.bool,
-  markup: _propTypes.default.string,
-  mode: _propTypes.default.string,
-  displayType: _propTypes.default.string,
-  rationale: _propTypes.default.string,
-  teacherInstructions: _propTypes.default.string,
-  model: _propTypes.default.object.isRequired,
-  choices: _propTypes.default.object,
-  value: _propTypes.default.object,
-  feedback: _propTypes.default.object,
-  onChange: _propTypes.default.func,
-  language: _propTypes.default.string
-});
-(0, _defineProperty2.default)(InlineDropdown, "defaultProps", {
-  value: {}
-});
-var _default = exports.default = InlineDropdown;
-//# sourceMappingURL=inline-dropdown.js.map

package/lib/inline-dropdown.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"inline-dropdown.js","names":["_react","_interopRequireDefault","require","_reactDom","_propTypes","_lodashEs","_correctAnswerToggle","_maskMarkup","_renderUi","_mathRendering","_styles","StyledUiLayout","styled","UiLayout","color","text","backgroundColor","background","StyledCollapsible","Collapsible","theme","marginBottom","spacing","ChoiceRationaleWrapper","ChoiceRationale","display","whiteSpace","ChoiceRationaleLabel","correct","incorrectWithIcon","SrOnly","position","left","top","width","height","overflow","InlineDropdown","React","Component","constructor","args","_defineProperty2","default","showCorrectAnswer","setState","state","UNSAFE_componentWillReceiveProps","nextProps","isEmpty","feedback","componentDidUpdate","domNode","ReactDOM","findDOMNode","renderMath","render","prompt","mode","model","rationale","teacherInstructions","choices","displayType","language","props","extraCSSRules","showCorrectAnswerToggle","choiceRationalesHaveText","showRationale","hasText","hasMedia","showTeacherInstructions","choiceRationales","Object","keys","map","key","reduce","acc","currentValue","push","createElement","style","labels","hidden","visible","PreviewPrompt","show","toggled","onToggle","toggleShowCorrect","_extends2","index","length","choice","label","dangerouslySetInnerHTML","__html","exports","PropTypes","string","disabled","bool","markup","object","isRequired","value","onChange","func","_default"],"sources":["../src/inline-dropdown.jsx"],"sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport { isEmpty } from 'lodash-es';\nimport CorrectAnswerToggle from '@pie-lib/correct-answer-toggle';\nimport { InlineDropdown as DropDown } from '@pie-lib/mask-markup';\nimport { color, Collapsible, hasText, hasMedia, PreviewPrompt, UiLayout } from '@pie-lib/render-ui';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport { styled } from '@mui/material/styles';\n\nconst StyledUiLayout = styled(UiLayout)({\n  color: color.text(),\n  backgroundColor: color.background(),\n});\n\nconst StyledCollapsible = styled(Collapsible)(({ theme }) => ({\n  marginBottom: theme.spacing(2),\n}));\n\nconst ChoiceRationaleWrapper = styled('div')(({ theme }) => ({\n  '&:not(:last-child)': {\n    marginBottom: theme.spacing(2),\n  },\n}));\n\nconst ChoiceRationale = styled('div')({\n  display: 'flex',\n  whiteSpace: 'break-spaces',\n});\n\nconst ChoiceRationaleLabel = styled('div')(({ correct }) => ({\n  display: 'flex',\n  ...(correct\n    ? {\n        color: color.correct(),\n      }\n    : {\n        color: color.incorrectWithIcon(),\n      }),\n}));\n\nconst SrOnly = styled('h2')({\n  position: 'absolute',\n  left: '-10000px',\n  top: 'auto',\n  width: '1px',\n  height: '1px',\n  overflow: 'hidden',\n});\n\nexport class InlineDropdown extends React.Component {\n  static propTypes = {\n    prompt: PropTypes.string,\n    disabled: PropTypes.bool,\n    markup: PropTypes.string,\n    mode: PropTypes.string,\n    displayType: PropTypes.string,\n    rationale: PropTypes.string,\n    teacherInstructions: PropTypes.string,\n    model: PropTypes.object.isRequired,\n    choices: PropTypes.object,\n    value: PropTypes.object,\n    feedback: PropTypes.object,\n    onChange: PropTypes.func,\n    language: PropTypes.string,\n  };\n\n  static defaultProps = {\n    value: {},\n  };\n\n  state = {\n    showCorrectAnswer: false,\n  };\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    if (isEmpty(nextProps.feedback)) {\n      this.setState({ showCorrectAnswer: false });\n    }\n  }\n\n  componentDidUpdate() {\n    // eslint-disable-next-line\n    const domNode = ReactDOM.findDOMNode(this);\n\n    renderMath(domNode);\n  }\n\n  toggleShowCorrect = () => {\n    this.setState({ showCorrectAnswer: !this.state.showCorrectAnswer });\n  };\n\n  render() {\n    const { showCorrectAnswer } = this.state;\n    const { prompt, mode, model, rationale, teacherInstructions, choices, displayType, language } = this.props;\n    const { extraCSSRules } = model || {};\n    const showCorrectAnswerToggle = mode === 'evaluate';\n    let choiceRationalesHaveText = false;\n    const showRationale = rationale && (hasText(rationale) || hasMedia(rationale));\n    const showTeacherInstructions =\n      teacherInstructions && (hasText(teacherInstructions) || hasMedia(teacherInstructions));\n\n    const choiceRationales = (Object.keys(choices) || []).map((key) =>\n      (choices[key] || []).reduce((acc, currentValue) => {\n        if (currentValue.rationale && hasText(currentValue.rationale)) {\n          choiceRationalesHaveText = true;\n\n          acc.push(currentValue);\n        }\n\n        return acc;\n      }, []),\n    );\n\n    return (\n      <StyledUiLayout extraCSSRules={extraCSSRules} style={{ display: `${displayType}` }}>\n        {mode === 'gather' && <SrOnly>Inline Dropdown Question</SrOnly>}\n\n        {showTeacherInstructions && (\n          <StyledCollapsible\n            labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n          >\n            <PreviewPrompt prompt={teacherInstructions} />\n          </StyledCollapsible>\n        )}\n\n        {prompt && <PreviewPrompt prompt={prompt} />}\n\n        <CorrectAnswerToggle\n          show={showCorrectAnswerToggle}\n          toggled={showCorrectAnswer}\n          onToggle={this.toggleShowCorrect}\n          language={language}\n        />\n\n        <DropDown {...this.props} showCorrectAnswer={showCorrectAnswer} />\n\n        {choiceRationalesHaveText && (\n          <StyledCollapsible\n            labels={{ hidden: 'Show Rationale for choices', visible: 'Hide Rationale for choices' }}\n          >\n            {choiceRationales.map((choices, index) => (\n              <ChoiceRationaleWrapper key={index}>\n                {choices?.length > 0 &&\n                  choices.map((choice) => (\n                    <ChoiceRationale key={choice.label}>\n                      <ChoiceRationaleLabel\n                        correct={choice.correct}\n                        dangerouslySetInnerHTML={{ __html: `${choice.label}: ` }}\n                      />\n                      <PreviewPrompt prompt={choice.rationale} />\n                    </ChoiceRationale>\n                  ))}\n              </ChoiceRationaleWrapper>\n            ))}\n          </StyledCollapsible>\n        )}\n\n        {showRationale && (\n          <Collapsible labels={{ hidden: 'Show Rationale', visible: 'Hide Rationale' }}>\n            <PreviewPrompt prompt={rationale} />\n          </Collapsible>\n        )}\n      </StyledUiLayout>\n    );\n  }\n}\n\nexport default InlineDropdown;\n"],"mappings":"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","ignoreList":[]}