@pie-lib/render-ui 4.45.0-mui-update.0 → 4.49.0-mui-update.0

package/CHANGELOG.md

@@ -3,6 +3,45 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [4.49.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.48.0-mui-update.0...@pie-lib/render-ui@4.49.0-mui-update.0) (2025-12-29)
+
+**Note:** Version bump only for package @pie-lib/render-ui
+
+
+
+
+
+# [4.48.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.47.0-mui-update.0...@pie-lib/render-ui@4.48.0-mui-update.0) (2025-12-29)
+
+
+### Bug Fixes
+
+* **render-ui:** handle invalid values for fontSizeFactor PD-5412 ([39b13c0](https://github.com/pie-framework/pie-lib/commit/39b13c0583f3f83575e4c32ed2873eecfd4903cd))
+
+
+
+
+
+# [4.47.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.46.0-mui-update.0...@pie-lib/render-ui@4.47.0-mui-update.0) (2025-12-17)
+
+**Note:** Version bump only for package @pie-lib/render-ui
+
+
+
+
+
+# [4.46.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.45.0-mui-update.0...@pie-lib/render-ui@4.46.0-mui-update.0) (2025-12-17)
+
+
+### Bug Fixes
+
+* Add MutationObserver to PreviewPrompt for prompt, rationale & TI  math rendering ([d77ef3c](https://github.com/pie-framework/pie-lib/commit/d77ef3c15c6928f3a7dae627e6c49380cef01745))
+* simplify math render logic ([de11ebe](https://github.com/pie-framework/pie-lib/commit/de11ebe7f2faeb9dce6215673a90b79e86cbc590))
+
+
+
+
+
 # [4.45.0-mui-update.0](https://github.com/pie-framework/pie-lib/compare/@pie-lib/render-ui@4.44.0-mui-update.0...@pie-lib/render-ui@4.45.0-mui-update.0) (2025-12-11)
 
 **Note:** Version bump only for package @pie-lib/render-ui

package/lib/feedback.js

@@ -12,17 +12,14 @@ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime
 var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _styles = require("@mui/material/styles");
 var _react = _interopRequireDefault(require("react"));
-var _reactTransitionGroup = require("react-transition-group");
-var _classnames = _interopRequireDefault(require("classnames"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
+var _styles = require("@mui/material/styles");
+var _reactTransitionGroup = require("react-transition-group");
 var color = _interopRequireWildcard(require("./color"));
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
-function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); } /**
- * Lifted from multiple-choice - TODO: create a shared package for it.
- */
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
 var FeedbackContainer = (0, _styles.styled)('div')({
   transformOrigin: '0% 0px 0px',
   width: '100%',
@@ -48,55 +45,62 @@ var FeedbackContent = (0, _styles.styled)('div')({
     backgroundColor: "var(--feedback-incorrect-bg-color, ".concat(color.incorrect(), ")")
   }
 });
-var transitionClasses = {
-  feedbackEnter: 'feedback-enter',
-  feedbackEnterActive: 'feedback-enter-active',
-  feedbackLeave: 'feedback-leave',
-  feedbackLeaveActive: 'feedback-leave-active'
-};
-var TransitionWrapper = (0, _styles.styled)('div')((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, "&.".concat(transitionClasses.feedbackEnter), {
-  height: '1px'
-}), "&.".concat(transitionClasses.feedbackEnterActive), {
-  height: '45px',
-  transition: 'height 500ms'
-}), "&.".concat(transitionClasses.feedbackLeave), {
-  height: '45px'
-}), "&.".concat(transitionClasses.feedbackLeaveActive), {
-  height: '1px',
-  transition: 'height 200ms'
-}));
+var TransitionWrapper = (0, _styles.styled)('div')({
+  '&.feedback-enter': {
+    height: '1px'
+  },
+  '&.feedback-enter-active': {
+    height: '45px',
+    transition: 'height 500ms'
+  },
+  '&.feedback-exit': {
+    height: '45px'
+  },
+  '&.feedback-exit-active': {
+    height: '1px',
+    transition: 'height 200ms'
+  }
+});
 var Feedback = exports.Feedback = /*#__PURE__*/function (_React$Component) {
   function Feedback() {
+    var _this;
     (0, _classCallCheck2["default"])(this, Feedback);
-    return _callSuper(this, Feedback, arguments);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    _this = _callSuper(this, Feedback, [].concat(args));
+    (0, _defineProperty2["default"])(_this, "nodeRef", /*#__PURE__*/_react["default"].createRef());
+    return _this;
   }
   (0, _inherits2["default"])(Feedback, _React$Component);
   return (0, _createClass2["default"])(Feedback, [{
-    key: "render",
-    value: function render() {
+    key: "renderFeedback",
+    value: function renderFeedback() {
       var _this$props = this.props,
         correctness = _this$props.correctness,
         feedback = _this$props.feedback;
-      function chooseFeedback(correctness) {
-        if (correctness && feedback) {
-          return /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.CSSTransition, {
-            classNames: transitionClasses,
-            key: "hasFeedback",
-            timeout: {
-              enter: 500,
-              exit: 300
-            }
-          }, /*#__PURE__*/_react["default"].createElement(TransitionWrapper, null, /*#__PURE__*/_react["default"].createElement(FeedbackContainer, null, /*#__PURE__*/_react["default"].createElement(FeedbackContent, {
-            className: (0, _classnames["default"])(correctness),
-            dangerouslySetInnerHTML: {
-              __html: feedback
-            }
-          }))));
-        } else {
-          return null;
+      if (!correctness || !feedback) return null;
+      return /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.CSSTransition, {
+        key: "hasFeedback",
+        nodeRef: this.nodeRef,
+        timeout: {
+          enter: 500,
+          exit: 200
+        },
+        classNames: "feedback"
+      }, /*#__PURE__*/_react["default"].createElement(TransitionWrapper, {
+        ref: this.nodeRef
+      }, /*#__PURE__*/_react["default"].createElement(FeedbackContainer, null, /*#__PURE__*/_react["default"].createElement(FeedbackContent, {
+        className: correctness,
+        dangerouslySetInnerHTML: {
+          __html: feedback
         }
-      }
-      return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.TransitionGroup, null, chooseFeedback(correctness)));
+      }))));
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_reactTransitionGroup.TransitionGroup, null, this.renderFeedback()));
     }
   }]);
 }(_react["default"].Component);

package/lib/feedback.js.map

@@ -1 +1 @@
-{"version":3,"file":"feedback.js","names":["_styles","require","_react","_interopRequireDefault","_reactTransitionGroup","_classnames","_propTypes","color","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_callSuper","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","FeedbackContainer","styled","transformOrigin","width","display","overflow","FeedbackContent","WebkitFontSmoothing","backgroundColor","concat","disabled","borderRadius","lineHeight","margin","padding","verticalAlign","correct","incorrect","transitionClasses","feedbackEnter","feedbackEnterActive","feedbackLeave","feedbackLeaveActive","TransitionWrapper","_defineProperty2","height","transition","Feedback","exports","_React$Component","_classCallCheck2","arguments","_inherits2","_createClass2","key","value","render","_this$props","props","correctness","feedback","chooseFeedback","createElement","CSSTransition","classNames","timeout","enter","exit","className","dangerouslySetInnerHTML","__html","TransitionGroup","React","Component","PropTypes","string","_default"],"sources":["../src/feedback.jsx"],"sourcesContent":["/**\n * Lifted from multiple-choice - TODO: create a shared package for it.\n */\nimport { styled } from '@mui/material/styles';\n\nimport React from 'react';\nimport { TransitionGroup, CSSTransition } from 'react-transition-group';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport * as color from './color';\n\nconst FeedbackContainer = styled('div')({\n  transformOrigin: '0% 0px 0px',\n  width: '100%',\n  display: 'block',\n  overflow: 'hidden',\n  '&.incorrect': {\n    color: '#946202',\n  },\n});\n\nconst FeedbackContent = styled('div')({\n  WebkitFontSmoothing: 'antialiased',\n  backgroundColor: `var(--feedback-bg-color, ${color.disabled()})`,\n  borderRadius: '4px',\n  lineHeight: '25px',\n  margin: '0px',\n  padding: '10px',\n  verticalAlign: 'middle',\n  color: 'var(--feedback-color, white)',\n  '&.correct': {\n    backgroundColor: `var(--feedback-correct-bg-color, ${color.correct()})`,\n  },\n  '&.incorrect': {\n    backgroundColor: `var(--feedback-incorrect-bg-color, ${color.incorrect()})`,\n  },\n});\n\nconst transitionClasses = {\n  feedbackEnter: 'feedback-enter',\n  feedbackEnterActive: 'feedback-enter-active',\n  feedbackLeave: 'feedback-leave',\n  feedbackLeaveActive: 'feedback-leave-active',\n};\n\nconst TransitionWrapper = styled('div')({\n  [`&.${transitionClasses.feedbackEnter}`]: {\n    height: '1px',\n  },\n  [`&.${transitionClasses.feedbackEnterActive}`]: {\n    height: '45px',\n    transition: 'height 500ms',\n  },\n  [`&.${transitionClasses.feedbackLeave}`]: {\n    height: '45px',\n  },\n  [`&.${transitionClasses.feedbackLeaveActive}`]: {\n    height: '1px',\n    transition: 'height 200ms',\n  },\n});\n\nexport class Feedback extends React.Component {\n  static propTypes = {\n    correctness: PropTypes.string,\n    feedback: PropTypes.string,\n  };\n\n  render() {\n    const { correctness, feedback } = this.props;\n\n    function chooseFeedback(correctness) {\n      if (correctness && feedback) {\n        return (\n          <CSSTransition classNames={transitionClasses} key=\"hasFeedback\" timeout={{ enter: 500, exit: 300 }}>\n            <TransitionWrapper>\n              <FeedbackContainer>\n                <FeedbackContent className={classNames(correctness)} dangerouslySetInnerHTML={{ __html: feedback }} />\n              </FeedbackContainer>\n            </TransitionWrapper>\n          </CSSTransition>\n        );\n      } else {\n        return null;\n      }\n    }\n\n    return (\n      <div>\n        <TransitionGroup>{chooseFeedback(correctness)}</TransitionGroup>\n      </div>\n    );\n  }\n}\n\nexport default Feedback;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"feedback.js","names":["_react","_interopRequireDefault","require","_propTypes","_styles","_reactTransitionGroup","color","_interopRequireWildcard","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_callSuper","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","FeedbackContainer","styled","transformOrigin","width","display","overflow","FeedbackContent","WebkitFontSmoothing","backgroundColor","concat","disabled","borderRadius","lineHeight","margin","padding","verticalAlign","correct","incorrect","TransitionWrapper","height","transition","Feedback","exports","_React$Component","_this","_classCallCheck2","_len","arguments","length","args","Array","_key","_defineProperty2","React","createRef","_inherits2","_createClass2","key","value","renderFeedback","_this$props","props","correctness","feedback","createElement","CSSTransition","nodeRef","timeout","enter","exit","classNames","ref","className","dangerouslySetInnerHTML","__html","render","TransitionGroup","Component","PropTypes","string","_default"],"sources":["../src/feedback.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { styled } from '@mui/material/styles';\nimport { TransitionGroup, CSSTransition } from 'react-transition-group';\nimport * as color from './color';\n\nconst FeedbackContainer = styled('div')({\n  transformOrigin: '0% 0px 0px',\n  width: '100%',\n  display: 'block',\n  overflow: 'hidden',\n  '&.incorrect': {\n    color: '#946202',\n  },\n});\n\nconst FeedbackContent = styled('div')({\n  WebkitFontSmoothing: 'antialiased',\n  backgroundColor: `var(--feedback-bg-color, ${color.disabled()})`,\n  borderRadius: '4px',\n  lineHeight: '25px',\n  margin: '0px',\n  padding: '10px',\n  verticalAlign: 'middle',\n  color: 'var(--feedback-color, white)',\n  '&.correct': {\n    backgroundColor: `var(--feedback-correct-bg-color, ${color.correct()})`,\n  },\n  '&.incorrect': {\n    backgroundColor: `var(--feedback-incorrect-bg-color, ${color.incorrect()})`,\n  },\n});\n\nconst TransitionWrapper = styled('div')({\n  '&.feedback-enter': {\n    height: '1px',\n  },\n  '&.feedback-enter-active': {\n    height: '45px',\n    transition: 'height 500ms',\n  },\n  '&.feedback-exit': {\n    height: '45px',\n  },\n  '&.feedback-exit-active': {\n    height: '1px',\n    transition: 'height 200ms',\n  },\n});\n\nexport class Feedback extends React.Component {\n  static propTypes = {\n    correctness: PropTypes.string,\n    feedback: PropTypes.string,\n  };\n\n  nodeRef = React.createRef();\n\n  renderFeedback() {\n    const { correctness, feedback } = this.props;\n\n    if (!correctness || !feedback) return null;\n\n    return (\n      <CSSTransition\n        key=\"hasFeedback\"\n        nodeRef={this.nodeRef}\n        timeout={{ enter: 500, exit: 200 }}\n        classNames=\"feedback\"\n      >\n        <TransitionWrapper ref={this.nodeRef}>\n          <FeedbackContainer>\n            <FeedbackContent\n              className={correctness}\n              dangerouslySetInnerHTML={{ __html: feedback }}\n            />\n          </FeedbackContainer>\n        </TransitionWrapper>\n      </CSSTransition>\n    );\n  }\n\n  render() {\n    return (\n      <div>\n        <TransitionGroup>\n          {this.renderFeedback()}\n        </TransitionGroup>\n      </div>\n    );\n  }\n}\n\nexport default Feedback;\n"],"mappings":"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","ignoreList":[]}

package/lib/preview-prompt.js

@@ -16,6 +16,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _styles = require("@mui/material/styles");
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var color = _interopRequireWildcard(require("./color"));
+var _mathRendering = require("@pie-lib/math-rendering");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, "default": e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
 function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
@@ -188,17 +189,34 @@ var PreviewPrompt = exports.PreviewPrompt = /*#__PURE__*/function (_Component) {
     value: function componentDidMount() {
       this.alignImages();
       this.addCustomAudioButtonControls();
+      this.setupMathRendering();
     }
   }, {
     key: "componentDidUpdate",
-    value: function componentDidUpdate() {
+    value: function componentDidUpdate(prevProps) {
       this.alignImages();
+      if (prevProps.prompt !== this.props.prompt) {
+        this.renderMathContent();
+      }
     }
   }, {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       this.removeCustomAudioButtonListeners();
     }
+  }, {
+    key: "setupMathRendering",
+    value: function setupMathRendering() {
+      this.renderMathContent();
+    }
+  }, {
+    key: "renderMathContent",
+    value: function renderMathContent() {
+      var container = document.getElementById('preview-prompt');
+      if (container && typeof _mathRendering.renderMath === 'function') {
+        (0, _mathRendering.renderMath)(container);
+      }
+    }
   }, {
     key: "alignImages",
     value: function alignImages() {

package/lib/preview-prompt.js.map

@@ -1 +1 @@
-{"version":3,"file":"preview-prompt.js","names":["_react","_interopRequireWildcard","require","_styles","_propTypes","_interopRequireDefault","color","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_createForOfIteratorHelper","Symbol","iterator","Array","isArray","_unsupportedIterableToArray","length","_n","F","s","done","value","TypeError","a","u","next","_arrayLikeToArray","toString","slice","constructor","name","from","test","_callSuper","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","apply","Boolean","prototype","valueOf","StyledPromptContainer","styled","_ref","theme","tagName","borderCollapse","backgroundColor","palette","common","black","padding","textAlign","verticalAlign","text","width","fontSize","paddingLeft","spacing","paddingBottom","concat","display","flexDirection","cursor","margin","NEWLINE_BLOCK_REGEX","NEWLINE_LATEX","PreviewPrompt","exports","_Component","_this","_classCallCheck2","_len","arguments","args","_key","_defineProperty2","customAudioButton","props","div","document","createElement","innerHTML","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","style","playButton","id","assign","height","backgroundImage","pauseImage","backgroundSize","borderRadius","border","parentNode","insertBefore","_inherits2","_createClass2","key","addCustomAudioButtonControls","_this$props","autoplayAudioEnabled","getElementById","play","then","addEventListener","handleAudioEnded","error","console","handlePlayClick","paused","includes","playImage","handleAudioPlay","handleAudioPause","_handlePlayClick","_handleAudioPlay","_handleAudioPause","_handleAudioEnded","removeCustomAudioButtonListeners","removeEventListener","componentDidMount","alignImages","componentDidUpdate","componentWillUnmount","previewPrompts","querySelectorAll","forEach","previewPrompt","images","getElementsByTagName","_iterator","_step","image","attributes","alignment","parentElement","copyImage","cloneNode","replaceChild","err","render","_this$props2","prompt","className","onClick","defaultClassName","legendClass","customClasses","trim","as","dangerouslySetInnerHTML","__html","parsedText","replace","Component","PropTypes","string","func","bool","_default"],"sources":["../src/preview-prompt.jsx"],"sourcesContent":["import React, { Component } from 'react';\nimport { styled } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\nimport * as color from './color';\n\nconst StyledPromptContainer = styled('div')(({ theme, tagName }) => ({\n  // Base promptTable styles\n  '&:not(.MathJax) > table': {\n    borderCollapse: 'collapse',\n  },\n  // Apply vertical striping when first column is a header (th) and NOT mixed with td\n  '&:not(.MathJax) > table:has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)': {\n    backgroundColor: '#f6f8fa',\n    color: theme.palette.common.black,\n  },\n  // Apply horizontal striping for tables where first element is a data cell (td)\n  '&:not(.MathJax) > table:has(tbody tr > td:first-child) tbody tr:nth-child(even) td': {\n    backgroundColor: '#f6f8fa',\n    color: theme.palette.common.black,\n  },\n  // align table content to left as per STAR requirement PD-3687\n  '&:not(.MathJax) table td, &:not(.MathJax) table th': {\n    padding: '.6em 1em',\n    textAlign: 'left',\n  },\n  // added this to fix alignment of text in prompt imported from studio (PD-3423)\n  '&:not(.MathJax) > table td > p.kds-indent': {\n    textAlign: 'initial',\n  },\n\n  // Conditional styles based on class names\n  '&.prompt': {\n    verticalAlign: 'middle',\n    color: color.text(),\n  },\n  '&.legend': {\n    width: '100%',\n    fontSize: 'inherit !important',\n  },\n  '&.rationale': {\n    paddingLeft: theme.spacing(4),\n    paddingBottom: theme.spacing(1),\n  },\n  '&.label': {\n    color: `${color.text()} !important`,\n    display: 'flex',\n    flexDirection: 'column',\n    verticalAlign: 'middle',\n    cursor: 'pointer',\n    '& > p': {\n      margin: '0 0 0 0 !important',\n    },\n  },\n}));\n\n//Used these below to replace \\\\embed{newLine} with \\\\newline from prompt which will get parsed in MathJax\nconst NEWLINE_BLOCK_REGEX = /\\\\embed\\{newLine\\}\\[\\]/g;\nconst NEWLINE_LATEX = '\\\\newline ';\n\nexport class PreviewPrompt extends Component {\n  static propTypes = {\n    prompt: PropTypes.string,\n    tagName: PropTypes.string,\n    className: PropTypes.string,\n    onClick: PropTypes.func,\n    defaultClassName: PropTypes.string,\n    autoplayAudioEnabled: PropTypes.bool,\n    customAudioButton: {\n      playImage: PropTypes.string,\n      pauseImage: PropTypes.string,\n    },\n  };\n\n  static defaultProps = {\n    onClick: () => {},\n  };\n\n  parsedText = (text) => {\n    const { customAudioButton } = this.props;\n    const div = document.createElement('div');\n    div.innerHTML = text;\n\n    const audio = div.querySelector('audio');\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.setAttribute('id', 'pie-prompt-audio-player');\n\n      audio.appendChild(source);\n\n      if (customAudioButton) {\n        audio.style.display = 'none';\n\n        const playButton = document.createElement('div');\n        playButton.id = 'play-audio-button';\n\n        Object.assign(playButton.style, {\n          cursor: 'pointer',\n          display: 'block',\n          width: '128px',\n          height: '128px',\n          backgroundImage: `url(${customAudioButton.pauseImage})`,\n          backgroundSize: 'cover',\n          borderRadius: '50%',\n          border: '1px solid #326295',\n        });\n\n        audio.parentNode.insertBefore(playButton, audio);\n      }\n    }\n\n    return div.innerHTML;\n  };\n\n  addCustomAudioButtonControls() {\n    const { autoplayAudioEnabled, customAudioButton } = this.props;\n    const playButton = document.getElementById('play-audio-button');\n    const audio = document.getElementById('pie-prompt-audio-player');\n\n    if (autoplayAudioEnabled && audio) {\n      audio\n        .play()\n        .then(() => {\n          if (playButton && customAudioButton) {\n            audio.addEventListener('ended', handleAudioEnded);\n          }\n        })\n        .catch((error) => {\n          console.error('Error playing audio', error);\n        });\n    }\n\n    if (!playButton || !audio || !customAudioButton) return;\n\n    const handlePlayClick = () => {\n      // if already playing, don't play again\n      if (!audio.paused) return;\n      if (playButton.style.backgroundImage.includes(customAudioButton.pauseImage)) return;\n\n      audio.play();\n    };\n\n    const handleAudioEnded = () => {\n      playButton.style.backgroundImage = `url(${customAudioButton.playImage})`;\n    };\n\n    const handleAudioPlay = () => {\n      Object.assign(playButton.style, {\n        backgroundImage: `url(${customAudioButton.pauseImage})`,\n        border: '1px solid #ccc',\n      });\n    };\n\n    const handleAudioPause = () => {\n      Object.assign(playButton.style, {\n        backgroundImage: `url(${customAudioButton.playImage})`,\n        border: '1px solid #326295',\n      });\n    };\n\n    playButton.addEventListener('click', handlePlayClick);\n    audio.addEventListener('play', handleAudioPlay);\n    audio.addEventListener('pause', handleAudioPause);\n    audio.addEventListener('ended', handleAudioEnded);\n\n    // store event handler references so they can be removed later\n    this._handlePlayClick = handlePlayClick;\n    this._handleAudioPlay = handleAudioPlay;\n    this._handleAudioPause = handleAudioPause;\n    this._handleAudioEnded = handleAudioEnded;\n  }\n\n  removeCustomAudioButtonListeners() {\n    const playButton = document.getElementById('play-audio-button');\n    const audio = document.querySelector('audio');\n\n    if (!playButton || !audio) return;\n\n    // remove event listeners using stored references\n    playButton.removeEventListener('click', this._handlePlayClick);\n    audio.removeEventListener('play', this._handleAudioPlay);\n    audio.removeEventListener('pause', this._handleAudioPause);\n    audio.removeEventListener('ended', this._handleAudioEnded);\n  }\n\n  componentDidMount() {\n    this.alignImages();\n    this.addCustomAudioButtonControls();\n  }\n\n  componentDidUpdate() {\n    this.alignImages();\n  }\n\n  componentWillUnmount() {\n    this.removeCustomAudioButtonListeners();\n  }\n\n  alignImages() {\n    const previewPrompts = document.querySelectorAll('#preview-prompt');\n\n    previewPrompts.forEach((previewPrompt) => {\n      const images = previewPrompt.getElementsByTagName('img');\n\n      if (images && images.length) {\n        for (let image of images) {\n          // check if alignment property was set\n          if (image.attributes && image.attributes.alignment && image.attributes.alignment.value) {\n            const parentNode = image.parentElement;\n\n            // check if div is not already added to dom and replace current image with wrapped image\n            if (\n              !(\n                parentNode.tagName === 'DIV' &&\n                parentNode.style.display === 'flex' &&\n                parentNode.style.width === '100%'\n              )\n            ) {\n              const div = document.createElement('div');\n              div.style.display = 'flex';\n              div.style.width = '100%';\n\n              const copyImage = image.cloneNode(true);\n              div.appendChild(copyImage);\n              parentNode.replaceChild(div, image);\n            }\n          }\n        }\n      }\n    });\n  }\n\n  render() {\n    const { prompt, tagName, className, onClick, defaultClassName } = this.props;\n    // legend tag was added once with accessibility tasks, we need extra style to make it work with images alignment\n    const legendClass = tagName === 'legend' ? 'legend' : '';\n    const customClasses = `${className || ''} ${defaultClassName || ''} ${legendClass}`.trim();\n\n    return (\n      <StyledPromptContainer\n        as={tagName || 'div'}\n        id={'preview-prompt'}\n        onClick={onClick}\n        className={customClasses}\n        tagName={tagName}\n        dangerouslySetInnerHTML={{\n          __html: this.parsedText(prompt || '').replace(NEWLINE_BLOCK_REGEX, NEWLINE_LATEX),\n        }}\n      />\n    );\n  }\n}\n\nexport default PreviewPrompt;\n"],"mappings":";;;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,KAAA,GAAAL,uBAAA,CAAAC,OAAA;AAAiC,SAAAD,wBAAAM,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAR,uBAAA,YAAAA,wBAAAM,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,mBAAAT,CAAA,iBAAAA,CAAA,gBAAAU,OAAA,CAAAV,CAAA,0BAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,cAAAM,EAAA,IAAAd,CAAA,gBAAAc,EAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,EAAA,OAAAP,CAAA,IAAAD,CAAA,GAAAW,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAnB,CAAA,EAAAc,EAAA,OAAAP,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAM,EAAA,EAAAP,CAAA,IAAAC,CAAA,CAAAM,EAAA,IAAAd,CAAA,CAAAc,EAAA,WAAAN,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAAA,SAAAmB,2BAAAjB,CAAA,EAAAH,CAAA,QAAAC,CAAA,yBAAAoB,MAAA,IAAAlB,CAAA,CAAAkB,MAAA,CAAAC,QAAA,KAAAnB,CAAA,qBAAAF,CAAA,QAAAsB,KAAA,CAAAC,OAAA,CAAArB,CAAA,MAAAF,CAAA,GAAAwB,2BAAA,CAAAtB,CAAA,MAAAH,CAAA,IAAAG,CAAA,uBAAAA,CAAA,CAAAuB,MAAA,IAAAzB,CAAA,KAAAE,CAAA,GAAAF,CAAA,OAAA0B,EAAA,MAAAC,CAAA,YAAAA,EAAA,eAAAC,CAAA,EAAAD,CAAA,EAAAxB,CAAA,WAAAA,EAAA,WAAAuB,EAAA,IAAAxB,CAAA,CAAAuB,MAAA,KAAAI,IAAA,WAAAA,IAAA,MAAAC,KAAA,EAAA5B,CAAA,CAAAwB,EAAA,UAAA3B,CAAA,WAAAA,EAAAG,CAAA,UAAAA,CAAA,KAAAK,CAAA,EAAAoB,CAAA,gBAAAI,SAAA,iJAAA1B,CAAA,EAAA2B,CAAA,OAAAC,CAAA,gBAAAL,CAAA,WAAAA,EAAA,IAAA5B,CAAA,GAAAA,CAAA,CAAAe,IAAA,CAAAb,CAAA,MAAAC,CAAA,WAAAA,EAAA,QAAAD,CAAA,GAAAF,CAAA,CAAAkC,IAAA,WAAAF,CAAA,GAAA9B,CAAA,CAAA2B,IAAA,EAAA3B,CAAA,KAAAH,CAAA,WAAAA,EAAAG,CAAA,IAAA+B,CAAA,OAAA5B,CAAA,GAAAH,CAAA,KAAAK,CAAA,WAAAA,EAAA,UAAAyB,CAAA,YAAAhC,CAAA,cAAAA,CAAA,8BAAAiC,CAAA,QAAA5B,CAAA;AAAA,SAAAmB,4BAAAtB,CAAA,EAAA8B,CAAA,QAAA9B,CAAA,2BAAAA,CAAA,SAAAiC,iBAAA,CAAAjC,CAAA,EAAA8B,CAAA,OAAAhC,CAAA,MAAAoC,QAAA,CAAArB,IAAA,CAAAb,CAAA,EAAAmC,KAAA,6BAAArC,CAAA,IAAAE,CAAA,CAAAoC,WAAA,KAAAtC,CAAA,GAAAE,CAAA,CAAAoC,WAAA,CAAAC,IAAA,aAAAvC,CAAA,cAAAA,CAAA,GAAAsB,KAAA,CAAAkB,IAAA,CAAAtC,CAAA,oBAAAF,CAAA,+CAAAyC,IAAA,CAAAzC,CAAA,IAAAmC,iBAAA,CAAAjC,CAAA,EAAA8B,CAAA;AAAA,SAAAG,kBAAAjC,CAAA,EAAA8B,CAAA,aAAAA,CAAA,IAAAA,CAAA,GAAA9B,CAAA,CAAAuB,MAAA,MAAAO,CAAA,GAAA9B,CAAA,CAAAuB,MAAA,YAAA1B,CAAA,MAAAI,CAAA,GAAAmB,KAAA,CAAAU,CAAA,GAAAjC,CAAA,GAAAiC,CAAA,EAAAjC,CAAA,IAAAI,CAAA,CAAAJ,CAAA,IAAAG,CAAA,CAAAH,CAAA,UAAAI,CAAA;AAAA,SAAAuC,WAAA1C,CAAA,EAAAK,CAAA,EAAAN,CAAA,WAAAM,CAAA,OAAAsC,gBAAA,aAAAtC,CAAA,OAAAuC,2BAAA,aAAA5C,CAAA,EAAA6C,yBAAA,KAAAC,OAAA,CAAAC,SAAA,CAAA1C,CAAA,EAAAN,CAAA,YAAA4C,gBAAA,aAAA3C,CAAA,EAAAsC,WAAA,IAAAjC,CAAA,CAAA2C,KAAA,CAAAhD,CAAA,EAAAD,CAAA;AAAA,SAAA8C,0BAAA,cAAA7C,CAAA,IAAAiD,OAAA,CAAAC,SAAA,CAAAC,OAAA,CAAApC,IAAA,CAAA+B,OAAA,CAAAC,SAAA,CAAAE,OAAA,iCAAAjD,CAAA,aAAA6C,yBAAA,YAAAA,0BAAA,aAAA7C,CAAA;AAEjC,IAAMoD,qBAAqB,GAAG,IAAAC,cAAM,EAAC,KAAK,CAAC,CAAC,UAAAC,IAAA;EAAA,IAAGC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAEC,OAAO,GAAAF,IAAA,CAAPE,OAAO;EAAA,OAAQ;IACnE;IACA,yBAAyB,EAAE;MACzBC,cAAc,EAAE;IAClB,CAAC;IACD;IACA,sHAAsH,EAAE;MACtHC,eAAe,EAAE,SAAS;MAC1B5D,KAAK,EAAEyD,KAAK,CAACI,OAAO,CAACC,MAAM,CAACC;IAC9B,CAAC;IACD;IACA,oFAAoF,EAAE;MACpFH,eAAe,EAAE,SAAS;MAC1B5D,KAAK,EAAEyD,KAAK,CAACI,OAAO,CAACC,MAAM,CAACC;IAC9B,CAAC;IACD;IACA,oDAAoD,EAAE;MACpDC,OAAO,EAAE,UAAU;MACnBC,SAAS,EAAE;IACb,CAAC;IACD;IACA,2CAA2C,EAAE;MAC3CA,SAAS,EAAE;IACb,CAAC;IAED;IACA,UAAU,EAAE;MACVC,aAAa,EAAE,QAAQ;MACvBlE,KAAK,EAAEA,KAAK,CAACmE,IAAI,CAAC;IACpB,CAAC;IACD,UAAU,EAAE;MACVC,KAAK,EAAE,MAAM;MACbC,QAAQ,EAAE;IACZ,CAAC;IACD,aAAa,EAAE;MACbC,WAAW,EAAEb,KAAK,CAACc,OAAO,CAAC,CAAC,CAAC;MAC7BC,aAAa,EAAEf,KAAK,CAACc,OAAO,CAAC,CAAC;IAChC,CAAC;IACD,SAAS,EAAE;MACTvE,KAAK,KAAAyE,MAAA,CAAKzE,KAAK,CAACmE,IAAI,CAAC,CAAC,gBAAa;MACnCO,OAAO,EAAE,MAAM;MACfC,aAAa,EAAE,QAAQ;MACvBT,aAAa,EAAE,QAAQ;MACvBU,MAAM,EAAE,SAAS;MACjB,OAAO,EAAE;QACPC,MAAM,EAAE;MACV;IACF;EACF,CAAC;AAAA,CAAC,CAAC;;AAEH;AACA,IAAMC,mBAAmB,GAAG,yBAAyB;AACrD,IAAMC,aAAa,GAAG,YAAY;AAAC,IAEtBC,aAAa,GAAAC,OAAA,CAAAD,aAAA,0BAAAE,UAAA;EAAA,SAAAF,cAAA;IAAA,IAAAG,KAAA;IAAA,IAAAC,gBAAA,mBAAAJ,aAAA;IAAA,SAAAK,IAAA,GAAAC,SAAA,CAAA3D,MAAA,EAAA4D,IAAA,OAAA/D,KAAA,CAAA6D,IAAA,GAAAG,IAAA,MAAAA,IAAA,GAAAH,IAAA,EAAAG,IAAA;MAAAD,IAAA,CAAAC,IAAA,IAAAF,SAAA,CAAAE,IAAA;IAAA;IAAAL,KAAA,GAAAvC,UAAA,OAAAoC,aAAA,KAAAP,MAAA,CAAAc,IAAA;IAAA,IAAAE,gBAAA,aAAAN,KAAA,gBAkBX,UAAChB,IAAI,EAAK;MACrB,IAAQuB,iBAAiB,GAAKP,KAAA,CAAKQ,KAAK,CAAhCD,iBAAiB;MACzB,IAAME,GAAG,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;MACzCF,GAAG,CAACG,SAAS,GAAG5B,IAAI;MAEpB,IAAM6B,KAAK,GAAGJ,GAAG,CAACK,aAAa,CAAC,OAAO,CAAC;MACxC,IAAID,KAAK,EAAE;QACT,IAAME,MAAM,GAAGL,QAAQ,CAACC,aAAa,CAAC,QAAQ,CAAC;QAE/CI,MAAM,CAACC,YAAY,CAAC,MAAM,EAAE,WAAW,CAAC;QACxCD,MAAM,CAACC,YAAY,CAAC,KAAK,EAAEH,KAAK,CAACI,YAAY,CAAC,KAAK,CAAC,CAAC;QAErDJ,KAAK,CAACK,eAAe,CAAC,KAAK,CAAC;QAC5BL,KAAK,CAACG,YAAY,CAAC,IAAI,EAAE,yBAAyB,CAAC;QAEnDH,KAAK,CAACM,WAAW,CAACJ,MAAM,CAAC;QAEzB,IAAIR,iBAAiB,EAAE;UACrBM,KAAK,CAACO,KAAK,CAAC7B,OAAO,GAAG,MAAM;UAE5B,IAAM8B,UAAU,GAAGX,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;UAChDU,UAAU,CAACC,EAAE,GAAG,mBAAmB;UAEnCvF,MAAM,CAACwF,MAAM,CAACF,UAAU,CAACD,KAAK,EAAE;YAC9B3B,MAAM,EAAE,SAAS;YACjBF,OAAO,EAAE,OAAO;YAChBN,KAAK,EAAE,OAAO;YACduC,MAAM,EAAE,OAAO;YACfC,eAAe,SAAAnC,MAAA,CAASiB,iBAAiB,CAACmB,UAAU,MAAG;YACvDC,cAAc,EAAE,OAAO;YACvBC,YAAY,EAAE,KAAK;YACnBC,MAAM,EAAE;UACV,CAAC,CAAC;UAEFhB,KAAK,CAACiB,UAAU,CAACC,YAAY,CAACV,UAAU,EAAER,KAAK,CAAC;QAClD;MACF;MAEA,OAAOJ,GAAG,CAACG,SAAS;IACtB,CAAC;IAAA,OAAAZ,KAAA;EAAA;EAAA,IAAAgC,UAAA,aAAAnC,aAAA,EAAAE,UAAA;EAAA,WAAAkC,aAAA,aAAApC,aAAA;IAAAqC,GAAA;IAAArF,KAAA,EAED,SAAAsF,4BAA4BA,CAAA,EAAG;MAC7B,IAAAC,WAAA,GAAoD,IAAI,CAAC5B,KAAK;QAAtD6B,oBAAoB,GAAAD,WAAA,CAApBC,oBAAoB;QAAE9B,iBAAiB,GAAA6B,WAAA,CAAjB7B,iBAAiB;MAC/C,IAAMc,UAAU,GAAGX,QAAQ,CAAC4B,cAAc,CAAC,mBAAmB,CAAC;MAC/D,IAAMzB,KAAK,GAAGH,QAAQ,CAAC4B,cAAc,CAAC,yBAAyB,CAAC;MAEhE,IAAID,oBAAoB,IAAIxB,KAAK,EAAE;QACjCA,KAAK,CACF0B,IAAI,CAAC,CAAC,CACNC,IAAI,CAAC,YAAM;UACV,IAAInB,UAAU,IAAId,iBAAiB,EAAE;YACnCM,KAAK,CAAC4B,gBAAgB,CAAC,OAAO,EAAEC,gBAAgB,CAAC;UACnD;QACF,CAAC,CAAC,SACI,CAAC,UAACC,KAAK,EAAK;UAChBC,OAAO,CAACD,KAAK,CAAC,qBAAqB,EAAEA,KAAK,CAAC;QAC7C,CAAC,CAAC;MACN;MAEA,IAAI,CAACtB,UAAU,IAAI,CAACR,KAAK,IAAI,CAACN,iBAAiB,EAAE;MAEjD,IAAMsC,eAAe,GAAG,SAAlBA,eAAeA,CAAA,EAAS;QAC5B;QACA,IAAI,CAAChC,KAAK,CAACiC,MAAM,EAAE;QACnB,IAAIzB,UAAU,CAACD,KAAK,CAACK,eAAe,CAACsB,QAAQ,CAACxC,iBAAiB,CAACmB,UAAU,CAAC,EAAE;QAE7Eb,KAAK,CAAC0B,IAAI,CAAC,CAAC;MACd,CAAC;MAED,IAAMG,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAA,EAAS;QAC7BrB,UAAU,CAACD,KAAK,CAACK,eAAe,UAAAnC,MAAA,CAAUiB,iBAAiB,CAACyC,SAAS,MAAG;MAC1E,CAAC;MAED,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAA,EAAS;QAC5BlH,MAAM,CAACwF,MAAM,CAACF,UAAU,CAACD,KAAK,EAAE;UAC9BK,eAAe,SAAAnC,MAAA,CAASiB,iBAAiB,CAACmB,UAAU,MAAG;UACvDG,MAAM,EAAE;QACV,CAAC,CAAC;MACJ,CAAC;MAED,IAAMqB,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAA,EAAS;QAC7BnH,MAAM,CAACwF,MAAM,CAACF,UAAU,CAACD,KAAK,EAAE;UAC9BK,eAAe,SAAAnC,MAAA,CAASiB,iBAAiB,CAACyC,SAAS,MAAG;UACtDnB,MAAM,EAAE;QACV,CAAC,CAAC;MACJ,CAAC;MAEDR,UAAU,CAACoB,gBAAgB,CAAC,OAAO,EAAEI,eAAe,CAAC;MACrDhC,KAAK,CAAC4B,gBAAgB,CAAC,MAAM,EAAEQ,eAAe,CAAC;MAC/CpC,KAAK,CAAC4B,gBAAgB,CAAC,OAAO,EAAES,gBAAgB,CAAC;MACjDrC,KAAK,CAAC4B,gBAAgB,CAAC,OAAO,EAAEC,gBAAgB,CAAC;;MAEjD;MACA,IAAI,CAACS,gBAAgB,GAAGN,eAAe;MACvC,IAAI,CAACO,gBAAgB,GAAGH,eAAe;MACvC,IAAI,CAACI,iBAAiB,GAAGH,gBAAgB;MACzC,IAAI,CAACI,iBAAiB,GAAGZ,gBAAgB;IAC3C;EAAC;IAAAR,GAAA;IAAArF,KAAA,EAED,SAAA0G,gCAAgCA,CAAA,EAAG;MACjC,IAAMlC,UAAU,GAAGX,QAAQ,CAAC4B,cAAc,CAAC,mBAAmB,CAAC;MAC/D,IAAMzB,KAAK,GAAGH,QAAQ,CAACI,aAAa,CAAC,OAAO,CAAC;MAE7C,IAAI,CAACO,UAAU,IAAI,CAACR,KAAK,EAAE;;MAE3B;MACAQ,UAAU,CAACmC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAACL,gBAAgB,CAAC;MAC9DtC,KAAK,CAAC2C,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAACJ,gBAAgB,CAAC;MACxDvC,KAAK,CAAC2C,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAACH,iBAAiB,CAAC;MAC1DxC,KAAK,CAAC2C,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAACF,iBAAiB,CAAC;IAC5D;EAAC;IAAApB,GAAA;IAAArF,KAAA,EAED,SAAA4G,iBAAiBA,CAAA,EAAG;MAClB,IAAI,CAACC,WAAW,CAAC,CAAC;MAClB,IAAI,CAACvB,4BAA4B,CAAC,CAAC;IACrC;EAAC;IAAAD,GAAA;IAAArF,KAAA,EAED,SAAA8G,kBAAkBA,CAAA,EAAG;MACnB,IAAI,CAACD,WAAW,CAAC,CAAC;IACpB;EAAC;IAAAxB,GAAA;IAAArF,KAAA,EAED,SAAA+G,oBAAoBA,CAAA,EAAG;MACrB,IAAI,CAACL,gCAAgC,CAAC,CAAC;IACzC;EAAC;IAAArB,GAAA;IAAArF,KAAA,EAED,SAAA6G,WAAWA,CAAA,EAAG;MACZ,IAAMG,cAAc,GAAGnD,QAAQ,CAACoD,gBAAgB,CAAC,iBAAiB,CAAC;MAEnED,cAAc,CAACE,OAAO,CAAC,UAACC,aAAa,EAAK;QACxC,IAAMC,MAAM,GAAGD,aAAa,CAACE,oBAAoB,CAAC,KAAK,CAAC;QAExD,IAAID,MAAM,IAAIA,MAAM,CAACzH,MAAM,EAAE;UAAA,IAAA2H,SAAA,GAAAjI,0BAAA,CACT+H,MAAM;YAAAG,KAAA;UAAA;YAAxB,KAAAD,SAAA,CAAAxH,CAAA,MAAAyH,KAAA,GAAAD,SAAA,CAAAjJ,CAAA,IAAA0B,IAAA,GAA0B;cAAA,IAAjByH,KAAK,GAAAD,KAAA,CAAAvH,KAAA;cACZ;cACA,IAAIwH,KAAK,CAACC,UAAU,IAAID,KAAK,CAACC,UAAU,CAACC,SAAS,IAAIF,KAAK,CAACC,UAAU,CAACC,SAAS,CAAC1H,KAAK,EAAE;gBACtF,IAAMiF,UAAU,GAAGuC,KAAK,CAACG,aAAa;;gBAEtC;gBACA,IACE,EACE1C,UAAU,CAACvD,OAAO,KAAK,KAAK,IAC5BuD,UAAU,CAACV,KAAK,CAAC7B,OAAO,KAAK,MAAM,IACnCuC,UAAU,CAACV,KAAK,CAACnC,KAAK,KAAK,MAAM,CAClC,EACD;kBACA,IAAMwB,GAAG,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;kBACzCF,GAAG,CAACW,KAAK,CAAC7B,OAAO,GAAG,MAAM;kBAC1BkB,GAAG,CAACW,KAAK,CAACnC,KAAK,GAAG,MAAM;kBAExB,IAAMwF,SAAS,GAAGJ,KAAK,CAACK,SAAS,CAAC,IAAI,CAAC;kBACvCjE,GAAG,CAACU,WAAW,CAACsD,SAAS,CAAC;kBAC1B3C,UAAU,CAAC6C,YAAY,CAAClE,GAAG,EAAE4D,KAAK,CAAC;gBACrC;cACF;YACF;UAAC,SAAAO,GAAA;YAAAT,SAAA,CAAArJ,CAAA,CAAA8J,GAAA;UAAA;YAAAT,SAAA,CAAA7I,CAAA;UAAA;QACH;MACF,CAAC,CAAC;IACJ;EAAC;IAAA4G,GAAA;IAAArF,KAAA,EAED,SAAAgI,MAAMA,CAAA,EAAG;MACP,IAAAC,YAAA,GAAkE,IAAI,CAACtE,KAAK;QAApEuE,MAAM,GAAAD,YAAA,CAANC,MAAM;QAAExG,OAAO,GAAAuG,YAAA,CAAPvG,OAAO;QAAEyG,SAAS,GAAAF,YAAA,CAATE,SAAS;QAAEC,OAAO,GAAAH,YAAA,CAAPG,OAAO;QAAEC,gBAAgB,GAAAJ,YAAA,CAAhBI,gBAAgB;MAC7D;MACA,IAAMC,WAAW,GAAG5G,OAAO,KAAK,QAAQ,GAAG,QAAQ,GAAG,EAAE;MACxD,IAAM6G,aAAa,GAAG,GAAA9F,MAAA,CAAG0F,SAAS,IAAI,EAAE,OAAA1F,MAAA,CAAI4F,gBAAgB,IAAI,EAAE,OAAA5F,MAAA,CAAI6F,WAAW,EAAGE,IAAI,CAAC,CAAC;MAE1F,oBACE9K,MAAA,YAAAoG,aAAA,CAACxC,qBAAqB;QACpBmH,EAAE,EAAE/G,OAAO,IAAI,KAAM;QACrB+C,EAAE,EAAE,gBAAiB;QACrB2D,OAAO,EAAEA,OAAQ;QACjBD,SAAS,EAAEI,aAAc;QACzB7G,OAAO,EAAEA,OAAQ;QACjBgH,uBAAuB,EAAE;UACvBC,MAAM,EAAE,IAAI,CAACC,UAAU,CAACV,MAAM,IAAI,EAAE,CAAC,CAACW,OAAO,CAAC/F,mBAAmB,EAAEC,aAAa;QAClF;MAAE,CACH,CAAC;IAEN;EAAC;AAAA,EAnMgC+F,gBAAS;AAAA,IAAArF,gBAAA,aAA/BT,aAAa,eACL;EACjBkF,MAAM,EAAEa,qBAAS,CAACC,MAAM;EACxBtH,OAAO,EAAEqH,qBAAS,CAACC,MAAM;EACzBb,SAAS,EAAEY,qBAAS,CAACC,MAAM;EAC3BZ,OAAO,EAAEW,qBAAS,CAACE,IAAI;EACvBZ,gBAAgB,EAAEU,qBAAS,CAACC,MAAM;EAClCxD,oBAAoB,EAAEuD,qBAAS,CAACG,IAAI;EACpCxF,iBAAiB,EAAE;IACjByC,SAAS,EAAE4C,qBAAS,CAACC,MAAM;IAC3BnE,UAAU,EAAEkE,qBAAS,CAACC;EACxB;AACF,CAAC;AAAA,IAAAvF,gBAAA,aAZUT,aAAa,kBAcF;EACpBoF,OAAO,EAAE,SAATA,OAAOA,CAAA,EAAQ,CAAC;AAClB,CAAC;AAAA,IAAAe,QAAA,GAAAlG,OAAA,cAsLYD,aAAa","ignoreList":[]}
+{"version":3,"file":"preview-prompt.js","names":["_react","_interopRequireWildcard","require","_styles","_propTypes","_interopRequireDefault","color","_mathRendering","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_createForOfIteratorHelper","Symbol","iterator","Array","isArray","_unsupportedIterableToArray","length","_n","F","s","done","value","TypeError","a","u","next","_arrayLikeToArray","toString","slice","constructor","name","from","test","_callSuper","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","apply","Boolean","prototype","valueOf","StyledPromptContainer","styled","_ref","theme","tagName","borderCollapse","backgroundColor","palette","common","black","padding","textAlign","verticalAlign","text","width","fontSize","paddingLeft","spacing","paddingBottom","concat","display","flexDirection","cursor","margin","NEWLINE_BLOCK_REGEX","NEWLINE_LATEX","PreviewPrompt","exports","_Component","_this","_classCallCheck2","_len","arguments","args","_key","_defineProperty2","customAudioButton","props","div","document","createElement","innerHTML","audio","querySelector","source","setAttribute","getAttribute","removeAttribute","appendChild","style","playButton","id","assign","height","backgroundImage","pauseImage","backgroundSize","borderRadius","border","parentNode","insertBefore","_inherits2","_createClass2","key","addCustomAudioButtonControls","_this$props","autoplayAudioEnabled","getElementById","play","then","addEventListener","handleAudioEnded","error","console","handlePlayClick","paused","includes","playImage","handleAudioPlay","handleAudioPause","_handlePlayClick","_handleAudioPlay","_handleAudioPause","_handleAudioEnded","removeCustomAudioButtonListeners","removeEventListener","componentDidMount","alignImages","setupMathRendering","componentDidUpdate","prevProps","prompt","renderMathContent","componentWillUnmount","container","renderMath","previewPrompts","querySelectorAll","forEach","previewPrompt","images","getElementsByTagName","_iterator","_step","image","attributes","alignment","parentElement","copyImage","cloneNode","replaceChild","err","render","_this$props2","className","onClick","defaultClassName","legendClass","customClasses","trim","as","dangerouslySetInnerHTML","__html","parsedText","replace","Component","PropTypes","string","func","bool","_default"],"sources":["../src/preview-prompt.jsx"],"sourcesContent":["import React, { Component } from 'react';\nimport { styled } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\nimport * as color from './color';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nconst StyledPromptContainer = styled('div')(({ theme, tagName }) => ({\n  // Base promptTable styles\n  '&:not(.MathJax) > table': {\n    borderCollapse: 'collapse',\n  },\n  // Apply vertical striping when first column is a header (th) and NOT mixed with td\n  '&:not(.MathJax) > table:has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)': {\n    backgroundColor: '#f6f8fa',\n    color: theme.palette.common.black,\n  },\n  // Apply horizontal striping for tables where first element is a data cell (td)\n  '&:not(.MathJax) > table:has(tbody tr > td:first-child) tbody tr:nth-child(even) td': {\n    backgroundColor: '#f6f8fa',\n    color: theme.palette.common.black,\n  },\n  // align table content to left as per STAR requirement PD-3687\n  '&:not(.MathJax) table td, &:not(.MathJax) table th': {\n    padding: '.6em 1em',\n    textAlign: 'left',\n  },\n  // added this to fix alignment of text in prompt imported from studio (PD-3423)\n  '&:not(.MathJax) > table td > p.kds-indent': {\n    textAlign: 'initial',\n  },\n\n  // Conditional styles based on class names\n  '&.prompt': {\n    verticalAlign: 'middle',\n    color: color.text(),\n  },\n  '&.legend': {\n    width: '100%',\n    fontSize: 'inherit !important',\n  },\n  '&.rationale': {\n    paddingLeft: theme.spacing(4),\n    paddingBottom: theme.spacing(1),\n  },\n  '&.label': {\n    color: `${color.text()} !important`,\n    display: 'flex',\n    flexDirection: 'column',\n    verticalAlign: 'middle',\n    cursor: 'pointer',\n    '& > p': {\n      margin: '0 0 0 0 !important',\n    },\n  },\n}));\n\n//Used these below to replace \\\\embed{newLine} with \\\\newline from prompt which will get parsed in MathJax\nconst NEWLINE_BLOCK_REGEX = /\\\\embed\\{newLine\\}\\[\\]/g;\nconst NEWLINE_LATEX = '\\\\newline ';\n\nexport class PreviewPrompt extends Component {\n  static propTypes = {\n    prompt: PropTypes.string,\n    tagName: PropTypes.string,\n    className: PropTypes.string,\n    onClick: PropTypes.func,\n    defaultClassName: PropTypes.string,\n    autoplayAudioEnabled: PropTypes.bool,\n    customAudioButton: {\n      playImage: PropTypes.string,\n      pauseImage: PropTypes.string,\n    },\n  };\n\n  static defaultProps = {\n    onClick: () => {},\n  };\n\n  parsedText = (text) => {\n    const { customAudioButton } = this.props;\n    const div = document.createElement('div');\n    div.innerHTML = text;\n\n    const audio = div.querySelector('audio');\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.setAttribute('id', 'pie-prompt-audio-player');\n\n      audio.appendChild(source);\n\n      if (customAudioButton) {\n        audio.style.display = 'none';\n\n        const playButton = document.createElement('div');\n        playButton.id = 'play-audio-button';\n\n        Object.assign(playButton.style, {\n          cursor: 'pointer',\n          display: 'block',\n          width: '128px',\n          height: '128px',\n          backgroundImage: `url(${customAudioButton.pauseImage})`,\n          backgroundSize: 'cover',\n          borderRadius: '50%',\n          border: '1px solid #326295',\n        });\n\n        audio.parentNode.insertBefore(playButton, audio);\n      }\n    }\n\n    return div.innerHTML;\n  };\n\n  addCustomAudioButtonControls() {\n    const { autoplayAudioEnabled, customAudioButton } = this.props;\n    const playButton = document.getElementById('play-audio-button');\n    const audio = document.getElementById('pie-prompt-audio-player');\n\n    if (autoplayAudioEnabled && audio) {\n      audio\n        .play()\n        .then(() => {\n          if (playButton && customAudioButton) {\n            audio.addEventListener('ended', handleAudioEnded);\n          }\n        })\n        .catch((error) => {\n          console.error('Error playing audio', error);\n        });\n    }\n\n    if (!playButton || !audio || !customAudioButton) return;\n\n    const handlePlayClick = () => {\n      // if already playing, don't play again\n      if (!audio.paused) return;\n      if (playButton.style.backgroundImage.includes(customAudioButton.pauseImage)) return;\n\n      audio.play();\n    };\n\n    const handleAudioEnded = () => {\n      playButton.style.backgroundImage = `url(${customAudioButton.playImage})`;\n    };\n\n    const handleAudioPlay = () => {\n      Object.assign(playButton.style, {\n        backgroundImage: `url(${customAudioButton.pauseImage})`,\n        border: '1px solid #ccc',\n      });\n    };\n\n    const handleAudioPause = () => {\n      Object.assign(playButton.style, {\n        backgroundImage: `url(${customAudioButton.playImage})`,\n        border: '1px solid #326295',\n      });\n    };\n\n    playButton.addEventListener('click', handlePlayClick);\n    audio.addEventListener('play', handleAudioPlay);\n    audio.addEventListener('pause', handleAudioPause);\n    audio.addEventListener('ended', handleAudioEnded);\n\n    // store event handler references so they can be removed later\n    this._handlePlayClick = handlePlayClick;\n    this._handleAudioPlay = handleAudioPlay;\n    this._handleAudioPause = handleAudioPause;\n    this._handleAudioEnded = handleAudioEnded;\n  }\n\n  removeCustomAudioButtonListeners() {\n    const playButton = document.getElementById('play-audio-button');\n    const audio = document.querySelector('audio');\n\n    if (!playButton || !audio) return;\n\n    // remove event listeners using stored references\n    playButton.removeEventListener('click', this._handlePlayClick);\n    audio.removeEventListener('play', this._handleAudioPlay);\n    audio.removeEventListener('pause', this._handleAudioPause);\n    audio.removeEventListener('ended', this._handleAudioEnded);\n  }\n\n  componentDidMount() {\n    this.alignImages();\n    this.addCustomAudioButtonControls();\n    this.setupMathRendering();\n  }\n\n  componentDidUpdate(prevProps) {\n    this.alignImages();\n\n    if (prevProps.prompt !== this.props.prompt) {\n      this.renderMathContent();\n    }\n  }\n\n  componentWillUnmount() {\n    this.removeCustomAudioButtonListeners();\n  }\n\n  setupMathRendering() {\n    this.renderMathContent();\n  }\n\n  renderMathContent() {\n    const container = document.getElementById('preview-prompt');\n    if (container && typeof renderMath === 'function') {\n      renderMath(container);\n    }\n  }\n\n  alignImages() {\n    const previewPrompts = document.querySelectorAll('#preview-prompt');\n\n    previewPrompts.forEach((previewPrompt) => {\n      const images = previewPrompt.getElementsByTagName('img');\n\n      if (images && images.length) {\n        for (let image of images) {\n          // check if alignment property was set\n          if (image.attributes && image.attributes.alignment && image.attributes.alignment.value) {\n            const parentNode = image.parentElement;\n\n            // check if div is not already added to dom and replace current image with wrapped image\n            if (\n              !(\n                parentNode.tagName === 'DIV' &&\n                parentNode.style.display === 'flex' &&\n                parentNode.style.width === '100%'\n              )\n            ) {\n              const div = document.createElement('div');\n              div.style.display = 'flex';\n              div.style.width = '100%';\n\n              const copyImage = image.cloneNode(true);\n              div.appendChild(copyImage);\n              parentNode.replaceChild(div, image);\n            }\n          }\n        }\n      }\n    });\n  }\n\n  render() {\n    const { prompt, tagName, className, onClick, defaultClassName } = this.props;\n    // legend tag was added once with accessibility tasks, we need extra style to make it work with images alignment\n    const legendClass = tagName === 'legend' ? 'legend' : '';\n    const customClasses = `${className || ''} ${defaultClassName || ''} ${legendClass}`.trim();\n\n    return (\n      <StyledPromptContainer\n        as={tagName || 'div'}\n        id={'preview-prompt'}\n        onClick={onClick}\n        className={customClasses}\n        tagName={tagName}\n        dangerouslySetInnerHTML={{\n          __html: this.parsedText(prompt || '').replace(NEWLINE_BLOCK_REGEX, NEWLINE_LATEX),\n        }}\n      />\n    );\n  }\n}\n\nexport default PreviewPrompt;\n"],"mappings":";;;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,KAAA,GAAAL,uBAAA,CAAAC,OAAA;AACA,IAAAK,cAAA,GAAAL,OAAA;AAAqD,SAAAD,wBAAAO,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAT,uBAAA,YAAAA,wBAAAO,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,mBAAAT,CAAA,iBAAAA,CAAA,gBAAAU,OAAA,CAAAV,CAAA,0BAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,cAAAM,EAAA,IAAAd,CAAA,gBAAAc,EAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,EAAA,OAAAP,CAAA,IAAAD,CAAA,GAAAW,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAnB,CAAA,EAAAc,EAAA,OAAAP,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAM,EAAA,EAAAP,CAAA,IAAAC,CAAA,CAAAM,EAAA,IAAAd,CAAA,CAAAc,EAAA,WAAAN,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAAA,SAAAmB,2BAAAjB,CAAA,EAAAH,CAAA,QAAAC,CAAA,yBAAAoB,MAAA,IAAAlB,CAAA,CAAAkB,MAAA,CAAAC,QAAA,KAAAnB,CAAA,qBAAAF,CAAA,QAAAsB,KAAA,CAAAC,OAAA,CAAArB,CAAA,MAAAF,CAAA,GAAAwB,2BAAA,CAAAtB,CAAA,MAAAH,CAAA,IAAAG,CAAA,uBAAAA,CAAA,CAAAuB,MAAA,IAAAzB,CAAA,KAAAE,CAAA,GAAAF,CAAA,OAAA0B,EAAA,MAAAC,CAAA,YAAAA,EAAA,eAAAC,CAAA,EAAAD,CAAA,EAAAxB,CAAA,WAAAA,EAAA,WAAAuB,EAAA,IAAAxB,CAAA,CAAAuB,MAAA,KAAAI,IAAA,WAAAA,IAAA,MAAAC,KAAA,EAAA5B,CAAA,CAAAwB,EAAA,UAAA3B,CAAA,WAAAA,EAAAG,CAAA,UAAAA,CAAA,KAAAK,CAAA,EAAAoB,CAAA,gBAAAI,SAAA,iJAAA1B,CAAA,EAAA2B,CAAA,OAAAC,CAAA,gBAAAL,CAAA,WAAAA,EAAA,IAAA5B,CAAA,GAAAA,CAAA,CAAAe,IAAA,CAAAb,CAAA,MAAAC,CAAA,WAAAA,EAAA,QAAAD,CAAA,GAAAF,CAAA,CAAAkC,IAAA,WAAAF,CAAA,GAAA9B,CAAA,CAAA2B,IAAA,EAAA3B,CAAA,KAAAH,CAAA,WAAAA,EAAAG,CAAA,IAAA+B,CAAA,OAAA5B,CAAA,GAAAH,CAAA,KAAAK,CAAA,WAAAA,EAAA,UAAAyB,CAAA,YAAAhC,CAAA,cAAAA,CAAA,8BAAAiC,CAAA,QAAA5B,CAAA;AAAA,SAAAmB,4BAAAtB,CAAA,EAAA8B,CAAA,QAAA9B,CAAA,2BAAAA,CAAA,SAAAiC,iBAAA,CAAAjC,CAAA,EAAA8B,CAAA,OAAAhC,CAAA,MAAAoC,QAAA,CAAArB,IAAA,CAAAb,CAAA,EAAAmC,KAAA,6BAAArC,CAAA,IAAAE,CAAA,CAAAoC,WAAA,KAAAtC,CAAA,GAAAE,CAAA,CAAAoC,WAAA,CAAAC,IAAA,aAAAvC,CAAA,cAAAA,CAAA,GAAAsB,KAAA,CAAAkB,IAAA,CAAAtC,CAAA,oBAAAF,CAAA,+CAAAyC,IAAA,CAAAzC,CAAA,IAAAmC,iBAAA,CAAAjC,CAAA,EAAA8B,CAAA;AAAA,SAAAG,kBAAAjC,CAAA,EAAA8B,CAAA,aAAAA,CAAA,IAAAA,CAAA,GAAA9B,CAAA,CAAAuB,MAAA,MAAAO,CAAA,GAAA9B,CAAA,CAAAuB,MAAA,YAAA1B,CAAA,MAAAI,CAAA,GAAAmB,KAAA,CAAAU,CAAA,GAAAjC,CAAA,GAAAiC,CAAA,EAAAjC,CAAA,IAAAI,CAAA,CAAAJ,CAAA,IAAAG,CAAA,CAAAH,CAAA,UAAAI,CAAA;AAAA,SAAAuC,WAAA1C,CAAA,EAAAK,CAAA,EAAAN,CAAA,WAAAM,CAAA,OAAAsC,gBAAA,aAAAtC,CAAA,OAAAuC,2BAAA,aAAA5C,CAAA,EAAA6C,yBAAA,KAAAC,OAAA,CAAAC,SAAA,CAAA1C,CAAA,EAAAN,CAAA,YAAA4C,gBAAA,aAAA3C,CAAA,EAAAsC,WAAA,IAAAjC,CAAA,CAAA2C,KAAA,CAAAhD,CAAA,EAAAD,CAAA;AAAA,SAAA8C,0BAAA,cAAA7C,CAAA,IAAAiD,OAAA,CAAAC,SAAA,CAAAC,OAAA,CAAApC,IAAA,CAAA+B,OAAA,CAAAC,SAAA,CAAAE,OAAA,iCAAAjD,CAAA,aAAA6C,yBAAA,YAAAA,0BAAA,aAAA7C,CAAA;AAErD,IAAMoD,qBAAqB,GAAG,IAAAC,cAAM,EAAC,KAAK,CAAC,CAAC,UAAAC,IAAA;EAAA,IAAGC,KAAK,GAAAD,IAAA,CAALC,KAAK;IAAEC,OAAO,GAAAF,IAAA,CAAPE,OAAO;EAAA,OAAQ;IACnE;IACA,yBAAyB,EAAE;MACzBC,cAAc,EAAE;IAClB,CAAC;IACD;IACA,sHAAsH,EAAE;MACtHC,eAAe,EAAE,SAAS;MAC1B7D,KAAK,EAAE0D,KAAK,CAACI,OAAO,CAACC,MAAM,CAACC;IAC9B,CAAC;IACD;IACA,oFAAoF,EAAE;MACpFH,eAAe,EAAE,SAAS;MAC1B7D,KAAK,EAAE0D,KAAK,CAACI,OAAO,CAACC,MAAM,CAACC;IAC9B,CAAC;IACD;IACA,oDAAoD,EAAE;MACpDC,OAAO,EAAE,UAAU;MACnBC,SAAS,EAAE;IACb,CAAC;IACD;IACA,2CAA2C,EAAE;MAC3CA,SAAS,EAAE;IACb,CAAC;IAED;IACA,UAAU,EAAE;MACVC,aAAa,EAAE,QAAQ;MACvBnE,KAAK,EAAEA,KAAK,CAACoE,IAAI,CAAC;IACpB,CAAC;IACD,UAAU,EAAE;MACVC,KAAK,EAAE,MAAM;MACbC,QAAQ,EAAE;IACZ,CAAC;IACD,aAAa,EAAE;MACbC,WAAW,EAAEb,KAAK,CAACc,OAAO,CAAC,CAAC,CAAC;MAC7BC,aAAa,EAAEf,KAAK,CAACc,OAAO,CAAC,CAAC;IAChC,CAAC;IACD,SAAS,EAAE;MACTxE,KAAK,KAAA0E,MAAA,CAAK1E,KAAK,CAACoE,IAAI,CAAC,CAAC,gBAAa;MACnCO,OAAO,EAAE,MAAM;MACfC,aAAa,EAAE,QAAQ;MACvBT,aAAa,EAAE,QAAQ;MACvBU,MAAM,EAAE,SAAS;MACjB,OAAO,EAAE;QACPC,MAAM,EAAE;MACV;IACF;EACF,CAAC;AAAA,CAAC,CAAC;;AAEH;AACA,IAAMC,mBAAmB,GAAG,yBAAyB;AACrD,IAAMC,aAAa,GAAG,YAAY;AAAC,IAEtBC,aAAa,GAAAC,OAAA,CAAAD,aAAA,0BAAAE,UAAA;EAAA,SAAAF,cAAA;IAAA,IAAAG,KAAA;IAAA,IAAAC,gBAAA,mBAAAJ,aAAA;IAAA,SAAAK,IAAA,GAAAC,SAAA,CAAA3D,MAAA,EAAA4D,IAAA,OAAA/D,KAAA,CAAA6D,IAAA,GAAAG,IAAA,MAAAA,IAAA,GAAAH,IAAA,EAAAG,IAAA;MAAAD,IAAA,CAAAC,IAAA,IAAAF,SAAA,CAAAE,IAAA;IAAA;IAAAL,KAAA,GAAAvC,UAAA,OAAAoC,aAAA,KAAAP,MAAA,CAAAc,IAAA;IAAA,IAAAE,gBAAA,aAAAN,KAAA,gBAkBX,UAAChB,IAAI,EAAK;MACrB,IAAQuB,iBAAiB,GAAKP,KAAA,CAAKQ,KAAK,CAAhCD,iBAAiB;MACzB,IAAME,GAAG,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;MACzCF,GAAG,CAACG,SAAS,GAAG5B,IAAI;MAEpB,IAAM6B,KAAK,GAAGJ,GAAG,CAACK,aAAa,CAAC,OAAO,CAAC;MACxC,IAAID,KAAK,EAAE;QACT,IAAME,MAAM,GAAGL,QAAQ,CAACC,aAAa,CAAC,QAAQ,CAAC;QAE/CI,MAAM,CAACC,YAAY,CAAC,MAAM,EAAE,WAAW,CAAC;QACxCD,MAAM,CAACC,YAAY,CAAC,KAAK,EAAEH,KAAK,CAACI,YAAY,CAAC,KAAK,CAAC,CAAC;QAErDJ,KAAK,CAACK,eAAe,CAAC,KAAK,CAAC;QAC5BL,KAAK,CAACG,YAAY,CAAC,IAAI,EAAE,yBAAyB,CAAC;QAEnDH,KAAK,CAACM,WAAW,CAACJ,MAAM,CAAC;QAEzB,IAAIR,iBAAiB,EAAE;UACrBM,KAAK,CAACO,KAAK,CAAC7B,OAAO,GAAG,MAAM;UAE5B,IAAM8B,UAAU,GAAGX,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;UAChDU,UAAU,CAACC,EAAE,GAAG,mBAAmB;UAEnCvF,MAAM,CAACwF,MAAM,CAACF,UAAU,CAACD,KAAK,EAAE;YAC9B3B,MAAM,EAAE,SAAS;YACjBF,OAAO,EAAE,OAAO;YAChBN,KAAK,EAAE,OAAO;YACduC,MAAM,EAAE,OAAO;YACfC,eAAe,SAAAnC,MAAA,CAASiB,iBAAiB,CAACmB,UAAU,MAAG;YACvDC,cAAc,EAAE,OAAO;YACvBC,YAAY,EAAE,KAAK;YACnBC,MAAM,EAAE;UACV,CAAC,CAAC;UAEFhB,KAAK,CAACiB,UAAU,CAACC,YAAY,CAACV,UAAU,EAAER,KAAK,CAAC;QAClD;MACF;MAEA,OAAOJ,GAAG,CAACG,SAAS;IACtB,CAAC;IAAA,OAAAZ,KAAA;EAAA;EAAA,IAAAgC,UAAA,aAAAnC,aAAA,EAAAE,UAAA;EAAA,WAAAkC,aAAA,aAAApC,aAAA;IAAAqC,GAAA;IAAArF,KAAA,EAED,SAAAsF,4BAA4BA,CAAA,EAAG;MAC7B,IAAAC,WAAA,GAAoD,IAAI,CAAC5B,KAAK;QAAtD6B,oBAAoB,GAAAD,WAAA,CAApBC,oBAAoB;QAAE9B,iBAAiB,GAAA6B,WAAA,CAAjB7B,iBAAiB;MAC/C,IAAMc,UAAU,GAAGX,QAAQ,CAAC4B,cAAc,CAAC,mBAAmB,CAAC;MAC/D,IAAMzB,KAAK,GAAGH,QAAQ,CAAC4B,cAAc,CAAC,yBAAyB,CAAC;MAEhE,IAAID,oBAAoB,IAAIxB,KAAK,EAAE;QACjCA,KAAK,CACF0B,IAAI,CAAC,CAAC,CACNC,IAAI,CAAC,YAAM;UACV,IAAInB,UAAU,IAAId,iBAAiB,EAAE;YACnCM,KAAK,CAAC4B,gBAAgB,CAAC,OAAO,EAAEC,gBAAgB,CAAC;UACnD;QACF,CAAC,CAAC,SACI,CAAC,UAACC,KAAK,EAAK;UAChBC,OAAO,CAACD,KAAK,CAAC,qBAAqB,EAAEA,KAAK,CAAC;QAC7C,CAAC,CAAC;MACN;MAEA,IAAI,CAACtB,UAAU,IAAI,CAACR,KAAK,IAAI,CAACN,iBAAiB,EAAE;MAEjD,IAAMsC,eAAe,GAAG,SAAlBA,eAAeA,CAAA,EAAS;QAC5B;QACA,IAAI,CAAChC,KAAK,CAACiC,MAAM,EAAE;QACnB,IAAIzB,UAAU,CAACD,KAAK,CAACK,eAAe,CAACsB,QAAQ,CAACxC,iBAAiB,CAACmB,UAAU,CAAC,EAAE;QAE7Eb,KAAK,CAAC0B,IAAI,CAAC,CAAC;MACd,CAAC;MAED,IAAMG,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAA,EAAS;QAC7BrB,UAAU,CAACD,KAAK,CAACK,eAAe,UAAAnC,MAAA,CAAUiB,iBAAiB,CAACyC,SAAS,MAAG;MAC1E,CAAC;MAED,IAAMC,eAAe,GAAG,SAAlBA,eAAeA,CAAA,EAAS;QAC5BlH,MAAM,CAACwF,MAAM,CAACF,UAAU,CAACD,KAAK,EAAE;UAC9BK,eAAe,SAAAnC,MAAA,CAASiB,iBAAiB,CAACmB,UAAU,MAAG;UACvDG,MAAM,EAAE;QACV,CAAC,CAAC;MACJ,CAAC;MAED,IAAMqB,gBAAgB,GAAG,SAAnBA,gBAAgBA,CAAA,EAAS;QAC7BnH,MAAM,CAACwF,MAAM,CAACF,UAAU,CAACD,KAAK,EAAE;UAC9BK,eAAe,SAAAnC,MAAA,CAASiB,iBAAiB,CAACyC,SAAS,MAAG;UACtDnB,MAAM,EAAE;QACV,CAAC,CAAC;MACJ,CAAC;MAEDR,UAAU,CAACoB,gBAAgB,CAAC,OAAO,EAAEI,eAAe,CAAC;MACrDhC,KAAK,CAAC4B,gBAAgB,CAAC,MAAM,EAAEQ,eAAe,CAAC;MAC/CpC,KAAK,CAAC4B,gBAAgB,CAAC,OAAO,EAAES,gBAAgB,CAAC;MACjDrC,KAAK,CAAC4B,gBAAgB,CAAC,OAAO,EAAEC,gBAAgB,CAAC;;MAEjD;MACA,IAAI,CAACS,gBAAgB,GAAGN,eAAe;MACvC,IAAI,CAACO,gBAAgB,GAAGH,eAAe;MACvC,IAAI,CAACI,iBAAiB,GAAGH,gBAAgB;MACzC,IAAI,CAACI,iBAAiB,GAAGZ,gBAAgB;IAC3C;EAAC;IAAAR,GAAA;IAAArF,KAAA,EAED,SAAA0G,gCAAgCA,CAAA,EAAG;MACjC,IAAMlC,UAAU,GAAGX,QAAQ,CAAC4B,cAAc,CAAC,mBAAmB,CAAC;MAC/D,IAAMzB,KAAK,GAAGH,QAAQ,CAACI,aAAa,CAAC,OAAO,CAAC;MAE7C,IAAI,CAACO,UAAU,IAAI,CAACR,KAAK,EAAE;;MAE3B;MACAQ,UAAU,CAACmC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAACL,gBAAgB,CAAC;MAC9DtC,KAAK,CAAC2C,mBAAmB,CAAC,MAAM,EAAE,IAAI,CAACJ,gBAAgB,CAAC;MACxDvC,KAAK,CAAC2C,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAACH,iBAAiB,CAAC;MAC1DxC,KAAK,CAAC2C,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAACF,iBAAiB,CAAC;IAC5D;EAAC;IAAApB,GAAA;IAAArF,KAAA,EAED,SAAA4G,iBAAiBA,CAAA,EAAG;MAClB,IAAI,CAACC,WAAW,CAAC,CAAC;MAClB,IAAI,CAACvB,4BAA4B,CAAC,CAAC;MACnC,IAAI,CAACwB,kBAAkB,CAAC,CAAC;IAC3B;EAAC;IAAAzB,GAAA;IAAArF,KAAA,EAED,SAAA+G,kBAAkBA,CAACC,SAAS,EAAE;MAC5B,IAAI,CAACH,WAAW,CAAC,CAAC;MAElB,IAAIG,SAAS,CAACC,MAAM,KAAK,IAAI,CAACtD,KAAK,CAACsD,MAAM,EAAE;QAC1C,IAAI,CAACC,iBAAiB,CAAC,CAAC;MAC1B;IACF;EAAC;IAAA7B,GAAA;IAAArF,KAAA,EAED,SAAAmH,oBAAoBA,CAAA,EAAG;MACrB,IAAI,CAACT,gCAAgC,CAAC,CAAC;IACzC;EAAC;IAAArB,GAAA;IAAArF,KAAA,EAED,SAAA8G,kBAAkBA,CAAA,EAAG;MACnB,IAAI,CAACI,iBAAiB,CAAC,CAAC;IAC1B;EAAC;IAAA7B,GAAA;IAAArF,KAAA,EAED,SAAAkH,iBAAiBA,CAAA,EAAG;MAClB,IAAME,SAAS,GAAGvD,QAAQ,CAAC4B,cAAc,CAAC,gBAAgB,CAAC;MAC3D,IAAI2B,SAAS,IAAI,OAAOC,yBAAU,KAAK,UAAU,EAAE;QACjD,IAAAA,yBAAU,EAACD,SAAS,CAAC;MACvB;IACF;EAAC;IAAA/B,GAAA;IAAArF,KAAA,EAED,SAAA6G,WAAWA,CAAA,EAAG;MACZ,IAAMS,cAAc,GAAGzD,QAAQ,CAAC0D,gBAAgB,CAAC,iBAAiB,CAAC;MAEnED,cAAc,CAACE,OAAO,CAAC,UAACC,aAAa,EAAK;QACxC,IAAMC,MAAM,GAAGD,aAAa,CAACE,oBAAoB,CAAC,KAAK,CAAC;QAExD,IAAID,MAAM,IAAIA,MAAM,CAAC/H,MAAM,EAAE;UAAA,IAAAiI,SAAA,GAAAvI,0BAAA,CACTqI,MAAM;YAAAG,KAAA;UAAA;YAAxB,KAAAD,SAAA,CAAA9H,CAAA,MAAA+H,KAAA,GAAAD,SAAA,CAAAvJ,CAAA,IAAA0B,IAAA,GAA0B;cAAA,IAAjB+H,KAAK,GAAAD,KAAA,CAAA7H,KAAA;cACZ;cACA,IAAI8H,KAAK,CAACC,UAAU,IAAID,KAAK,CAACC,UAAU,CAACC,SAAS,IAAIF,KAAK,CAACC,UAAU,CAACC,SAAS,CAAChI,KAAK,EAAE;gBACtF,IAAMiF,UAAU,GAAG6C,KAAK,CAACG,aAAa;;gBAEtC;gBACA,IACE,EACEhD,UAAU,CAACvD,OAAO,KAAK,KAAK,IAC5BuD,UAAU,CAACV,KAAK,CAAC7B,OAAO,KAAK,MAAM,IACnCuC,UAAU,CAACV,KAAK,CAACnC,KAAK,KAAK,MAAM,CAClC,EACD;kBACA,IAAMwB,GAAG,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;kBACzCF,GAAG,CAACW,KAAK,CAAC7B,OAAO,GAAG,MAAM;kBAC1BkB,GAAG,CAACW,KAAK,CAACnC,KAAK,GAAG,MAAM;kBAExB,IAAM8F,SAAS,GAAGJ,KAAK,CAACK,SAAS,CAAC,IAAI,CAAC;kBACvCvE,GAAG,CAACU,WAAW,CAAC4D,SAAS,CAAC;kBAC1BjD,UAAU,CAACmD,YAAY,CAACxE,GAAG,EAAEkE,KAAK,CAAC;gBACrC;cACF;YACF;UAAC,SAAAO,GAAA;YAAAT,SAAA,CAAA3J,CAAA,CAAAoK,GAAA;UAAA;YAAAT,SAAA,CAAAnJ,CAAA;UAAA;QACH;MACF,CAAC,CAAC;IACJ;EAAC;IAAA4G,GAAA;IAAArF,KAAA,EAED,SAAAsI,MAAMA,CAAA,EAAG;MACP,IAAAC,YAAA,GAAkE,IAAI,CAAC5E,KAAK;QAApEsD,MAAM,GAAAsB,YAAA,CAANtB,MAAM;QAAEvF,OAAO,GAAA6G,YAAA,CAAP7G,OAAO;QAAE8G,SAAS,GAAAD,YAAA,CAATC,SAAS;QAAEC,OAAO,GAAAF,YAAA,CAAPE,OAAO;QAAEC,gBAAgB,GAAAH,YAAA,CAAhBG,gBAAgB;MAC7D;MACA,IAAMC,WAAW,GAAGjH,OAAO,KAAK,QAAQ,GAAG,QAAQ,GAAG,EAAE;MACxD,IAAMkH,aAAa,GAAG,GAAAnG,MAAA,CAAG+F,SAAS,IAAI,EAAE,OAAA/F,MAAA,CAAIiG,gBAAgB,IAAI,EAAE,OAAAjG,MAAA,CAAIkG,WAAW,EAAGE,IAAI,CAAC,CAAC;MAE1F,oBACEpL,MAAA,YAAAqG,aAAA,CAACxC,qBAAqB;QACpBwH,EAAE,EAAEpH,OAAO,IAAI,KAAM;QACrB+C,EAAE,EAAE,gBAAiB;QACrBgE,OAAO,EAAEA,OAAQ;QACjBD,SAAS,EAAEI,aAAc;QACzBlH,OAAO,EAAEA,OAAQ;QACjBqH,uBAAuB,EAAE;UACvBC,MAAM,EAAE,IAAI,CAACC,UAAU,CAAChC,MAAM,IAAI,EAAE,CAAC,CAACiC,OAAO,CAACpG,mBAAmB,EAAEC,aAAa;QAClF;MAAE,CACH,CAAC;IAEN;EAAC;AAAA,EAnNgCoG,gBAAS;AAAA,IAAA1F,gBAAA,aAA/BT,aAAa,eACL;EACjBiE,MAAM,EAAEmC,qBAAS,CAACC,MAAM;EACxB3H,OAAO,EAAE0H,qBAAS,CAACC,MAAM;EACzBb,SAAS,EAAEY,qBAAS,CAACC,MAAM;EAC3BZ,OAAO,EAAEW,qBAAS,CAACE,IAAI;EACvBZ,gBAAgB,EAAEU,qBAAS,CAACC,MAAM;EAClC7D,oBAAoB,EAAE4D,qBAAS,CAACG,IAAI;EACpC7F,iBAAiB,EAAE;IACjByC,SAAS,EAAEiD,qBAAS,CAACC,MAAM;IAC3BxE,UAAU,EAAEuE,qBAAS,CAACC;EACxB;AACF,CAAC;AAAA,IAAA5F,gBAAA,aAZUT,aAAa,kBAcF;EACpByF,OAAO,EAAE,SAATA,OAAOA,CAAA,EAAQ,CAAC;AAClB,CAAC;AAAA,IAAAe,QAAA,GAAAvG,OAAA,cAsMYD,aAAa","ignoreList":[]}

package/lib/ui-layout.js

@@ -16,7 +16,6 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _react = _interopRequireDefault(require("react"));
 var _styles = require("@mui/material/styles");
 var _propTypes = _interopRequireDefault(require("prop-types"));
-var _classnames = _interopRequireDefault(require("classnames"));
 var _appendCssRules = _interopRequireDefault(require("./append-css-rules"));
 var _excluded = ["children", "className", "fontSizeFactor"],
   _excluded2 = ["extraCSSRules"];
@@ -76,8 +75,11 @@ var UiLayout = /*#__PURE__*/function (_AppendCSSRules) {
       var rootFontSize = getFontSize(document.documentElement);
       var bodyFontSize = getFontSize(document.body);
       var effectiveFontSize = Math.max(rootFontSize, bodyFontSize);
-      return fontSizeFactor !== 1 ? {
-        fontSize: "".concat(effectiveFontSize * fontSizeFactor, "px")
+
+      // Handle null, undefined, or invalid values by defaulting to 1
+      var factor = fontSizeFactor != null && typeof fontSizeFactor === 'number' ? fontSizeFactor : 1;
+      return factor !== 1 ? {
+        fontSize: "".concat(effectiveFontSize * factor, "px")
       } : null;
     }
   }, {

package/lib/ui-layout.js.map

@@ -1 +1 @@
-{"version":3,"file":"ui-layout.js","names":["_react","_interopRequireDefault","require","_styles","_propTypes","_classnames","_appendCssRules","_excluded","_excluded2","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","theme","createTheme","typography","fontFamily","palette","action","disabled","components","MuiTypography","styleOverrides","root","MuiButton","contained","backgroundColor","color","StyledContainer","styled","fontSize","UiLayout","_AppendCSSRules","props","_this","_classCallCheck2","classesSheet","document","createElement","_inherits2","_createClass2","key","value","computeStyle","fontSizeFactor","getFontSize","element","parseFloat","getComputedStyle","rootFontSize","documentElement","bodyFontSize","body","effectiveFontSize","Math","max","concat","render","_this$props","children","className","rest","_objectWithoutProperties2","extraCSSRules","restProps","style","StyledEngineProvider","injectFirst","ThemeProvider","_extends2","AppendCSSRules","_defineProperty2","PropTypes","string","array","shape","names","arrayOf","rules","classes","number","_default","exports"],"sources":["../src/ui-layout.jsx"],"sourcesContent":["import React from 'react';\nimport { createTheme, ThemeProvider, StyledEngineProvider } from '@mui/material/styles';\nimport { styled } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\nimport classNames from 'classnames';\nimport AppendCSSRules from './append-css-rules';\n\nconst theme = createTheme({\n  typography: {\n    fontFamily: 'inherit',\n  },\n  palette: {\n    action: {\n      disabled: 'rgba(0, 0, 0, 0.54);',\n    },\n  },\n  components: {\n    MuiTypography: {\n      styleOverrides: {\n        root: { fontFamily: 'inherit' },\n      },\n    },\n    MuiButton: {\n      styleOverrides: {\n        contained: {\n          backgroundColor: '#e0e0e0',\n          color: '#000000',\n          '&:hover': {\n            backgroundColor: '#bdbdbd',\n          },\n        },\n      },\n    },\n  },\n});\n\nconst StyledContainer = styled('div')({\n  // need this because some browsers set their own style on table\n  '& table, th, td': {\n    fontSize: 'inherit' /* Ensure table elements inherit font size */,\n  },\n});\n\nclass UiLayout extends AppendCSSRules {\n  static propTypes = {\n    className: PropTypes.string,\n    children: PropTypes.array,\n    extraCSSRules: PropTypes.shape({\n      names: PropTypes.arrayOf(PropTypes.string),\n      rules: PropTypes.string,\n    }),\n    classes: PropTypes.shape({\n      extraCSSRules: PropTypes.string,\n    }),\n    fontSizeFactor: PropTypes.number,\n  };\n\n  static defaultProps = {\n    extraCSSRules: {},\n    classes: {},\n    fontSizeFactor: 1,\n  };\n\n  constructor(props) {\n    super(props);\n    this.classesSheet = document.createElement('style');\n  }\n\n  computeStyle(fontSizeFactor) {\n    const getFontSize = (element) => parseFloat(getComputedStyle(element).fontSize);\n\n    const rootFontSize = getFontSize(document.documentElement);\n    const bodyFontSize = getFontSize(document.body);\n    const effectiveFontSize = Math.max(rootFontSize, bodyFontSize);\n\n    return fontSizeFactor !== 1 ? { fontSize: `${effectiveFontSize * fontSizeFactor}px` } : null;\n  }\n\n  render() {\n    const { children, className, fontSizeFactor, ...rest } = this.props;\n\n    const { extraCSSRules, ...restProps } = rest;\n    const style = this.computeStyle(fontSizeFactor);\n\n    return (\n      <StyledEngineProvider injectFirst>\n        <ThemeProvider theme={theme}>\n          <StyledContainer className={className} {...restProps} {...(style && { style })}>\n            {children}\n          </StyledContainer>\n        </ThemeProvider>\n      </StyledEngineProvider>\n    );\n  }\n}\n\nexport default UiLayout;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ui-layout.js","names":["_react","_interopRequireDefault","require","_styles","_propTypes","_appendCssRules","_excluded","_excluded2","_callSuper","t","o","e","_getPrototypeOf2","_possibleConstructorReturn2","_isNativeReflectConstruct","Reflect","construct","constructor","apply","Boolean","prototype","valueOf","call","theme","createTheme","typography","fontFamily","palette","action","disabled","components","MuiTypography","styleOverrides","root","MuiButton","contained","backgroundColor","color","StyledContainer","styled","fontSize","UiLayout","_AppendCSSRules","props","_this","_classCallCheck2","classesSheet","document","createElement","_inherits2","_createClass2","key","value","computeStyle","fontSizeFactor","getFontSize","element","parseFloat","getComputedStyle","rootFontSize","documentElement","bodyFontSize","body","effectiveFontSize","Math","max","factor","concat","render","_this$props","children","className","rest","_objectWithoutProperties2","extraCSSRules","restProps","style","StyledEngineProvider","injectFirst","ThemeProvider","_extends2","AppendCSSRules","_defineProperty2","PropTypes","string","array","shape","names","arrayOf","rules","classes","number","_default","exports"],"sources":["../src/ui-layout.jsx"],"sourcesContent":["import React from 'react';\nimport { createTheme, ThemeProvider, StyledEngineProvider } from '@mui/material/styles';\nimport { styled } from '@mui/material/styles';\nimport PropTypes from 'prop-types';\nimport AppendCSSRules from './append-css-rules';\n\nconst theme = createTheme({\n  typography: {\n    fontFamily: 'inherit',\n  },\n  palette: {\n    action: {\n      disabled: 'rgba(0, 0, 0, 0.54);',\n    },\n  },\n  components: {\n    MuiTypography: {\n      styleOverrides: {\n        root: { fontFamily: 'inherit' },\n      },\n    },\n    MuiButton: {\n      styleOverrides: {\n        contained: {\n          backgroundColor: '#e0e0e0',\n          color: '#000000',\n          '&:hover': {\n            backgroundColor: '#bdbdbd',\n          },\n        },\n      },\n    },\n  },\n});\n\nconst StyledContainer = styled('div')({\n  // need this because some browsers set their own style on table\n  '& table, th, td': {\n    fontSize: 'inherit' /* Ensure table elements inherit font size */,\n  },\n});\n\nclass UiLayout extends AppendCSSRules {\n  static propTypes = {\n    className: PropTypes.string,\n    children: PropTypes.array,\n    extraCSSRules: PropTypes.shape({\n      names: PropTypes.arrayOf(PropTypes.string),\n      rules: PropTypes.string,\n    }),\n    classes: PropTypes.shape({\n      extraCSSRules: PropTypes.string,\n    }),\n    fontSizeFactor: PropTypes.number,\n  };\n\n  static defaultProps = {\n    extraCSSRules: {},\n    classes: {},\n    fontSizeFactor: 1,\n  };\n\n  constructor(props) {\n    super(props);\n    this.classesSheet = document.createElement('style');\n  }\n\n  computeStyle(fontSizeFactor) {\n    const getFontSize = (element) => parseFloat(getComputedStyle(element).fontSize);\n\n    const rootFontSize = getFontSize(document.documentElement);\n    const bodyFontSize = getFontSize(document.body);\n    const effectiveFontSize = Math.max(rootFontSize, bodyFontSize);\n\n    // Handle null, undefined, or invalid values by defaulting to 1\n    const factor = fontSizeFactor != null && typeof fontSizeFactor === 'number' ? fontSizeFactor : 1;\n    return factor !== 1 ? { fontSize: `${effectiveFontSize * factor}px` } : null;\n  }\n\n  render() {\n    const { children, className, fontSizeFactor, ...rest } = this.props;\n\n    const { extraCSSRules, ...restProps } = rest;\n    const style = this.computeStyle(fontSizeFactor);\n\n    return (\n      <StyledEngineProvider injectFirst>\n        <ThemeProvider theme={theme}>\n          <StyledContainer className={className} {...restProps} {...(style && { style })}>\n            {children}\n          </StyledContainer>\n        </ThemeProvider>\n      </StyledEngineProvider>\n    );\n  }\n}\n\nexport default UiLayout;\n"],"mappings":";;;;;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAEA,IAAAE,UAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,eAAA,GAAAJ,sBAAA,CAAAC,OAAA;AAAgD,IAAAI,SAAA;EAAAC,UAAA;AAAA,SAAAC,WAAAC,CAAA,EAAAC,CAAA,EAAAC,CAAA,WAAAD,CAAA,OAAAE,gBAAA,aAAAF,CAAA,OAAAG,2BAAA,aAAAJ,CAAA,EAAAK,yBAAA,KAAAC,OAAA,CAAAC,SAAA,CAAAN,CAAA,EAAAC,CAAA,YAAAC,gBAAA,aAAAH,CAAA,EAAAQ,WAAA,IAAAP,CAAA,CAAAQ,KAAA,CAAAT,CAAA,EAAAE,CAAA;AAAA,SAAAG,0BAAA,cAAAL,CAAA,IAAAU,OAAA,CAAAC,SAAA,CAAAC,OAAA,CAAAC,IAAA,CAAAP,OAAA,CAAAC,SAAA,CAAAG,OAAA,iCAAAV,CAAA,aAAAK,yBAAA,YAAAA,0BAAA,aAAAL,CAAA;AAEhD,IAAMc,KAAK,GAAG,IAAAC,mBAAW,EAAC;EACxBC,UAAU,EAAE;IACVC,UAAU,EAAE;EACd,CAAC;EACDC,OAAO,EAAE;IACPC,MAAM,EAAE;MACNC,QAAQ,EAAE;IACZ;EACF,CAAC;EACDC,UAAU,EAAE;IACVC,aAAa,EAAE;MACbC,cAAc,EAAE;QACdC,IAAI,EAAE;UAAEP,UAAU,EAAE;QAAU;MAChC;IACF,CAAC;IACDQ,SAAS,EAAE;MACTF,cAAc,EAAE;QACdG,SAAS,EAAE;UACTC,eAAe,EAAE,SAAS;UAC1BC,KAAK,EAAE,SAAS;UAChB,SAAS,EAAE;YACTD,eAAe,EAAE;UACnB;QACF;MACF;IACF;EACF;AACF,CAAC,CAAC;AAEF,IAAME,eAAe,GAAG,IAAAC,cAAM,EAAC,KAAK,CAAC,CAAC;EACpC;EACA,iBAAiB,EAAE;IACjBC,QAAQ,EAAE,SAAS,CAAC;EACtB;AACF,CAAC,CAAC;AAAC,IAEGC,QAAQ,0BAAAC,eAAA;EAoBZ,SAAAD,SAAYE,KAAK,EAAE;IAAA,IAAAC,KAAA;IAAA,IAAAC,gBAAA,mBAAAJ,QAAA;IACjBG,KAAA,GAAApC,UAAA,OAAAiC,QAAA,GAAME,KAAK;IACXC,KAAA,CAAKE,YAAY,GAAGC,QAAQ,CAACC,aAAa,CAAC,OAAO,CAAC;IAAC,OAAAJ,KAAA;EACtD;EAAC,IAAAK,UAAA,aAAAR,QAAA,EAAAC,eAAA;EAAA,WAAAQ,aAAA,aAAAT,QAAA;IAAAU,GAAA;IAAAC,KAAA,EAED,SAAAC,YAAYA,CAACC,cAAc,EAAE;MAC3B,IAAMC,WAAW,GAAG,SAAdA,WAAWA,CAAIC,OAAO;QAAA,OAAKC,UAAU,CAACC,gBAAgB,CAACF,OAAO,CAAC,CAAChB,QAAQ,CAAC;MAAA;MAE/E,IAAMmB,YAAY,GAAGJ,WAAW,CAACR,QAAQ,CAACa,eAAe,CAAC;MAC1D,IAAMC,YAAY,GAAGN,WAAW,CAACR,QAAQ,CAACe,IAAI,CAAC;MAC/C,IAAMC,iBAAiB,GAAGC,IAAI,CAACC,GAAG,CAACN,YAAY,EAAEE,YAAY,CAAC;;MAE9D;MACA,IAAMK,MAAM,GAAGZ,cAAc,IAAI,IAAI,IAAI,OAAOA,cAAc,KAAK,QAAQ,GAAGA,cAAc,GAAG,CAAC;MAChG,OAAOY,MAAM,KAAK,CAAC,GAAG;QAAE1B,QAAQ,KAAA2B,MAAA,CAAKJ,iBAAiB,GAAGG,MAAM;MAAK,CAAC,GAAG,IAAI;IAC9E;EAAC;IAAAf,GAAA;IAAAC,KAAA,EAED,SAAAgB,MAAMA,CAAA,EAAG;MACP,IAAAC,WAAA,GAAyD,IAAI,CAAC1B,KAAK;QAA3D2B,QAAQ,GAAAD,WAAA,CAARC,QAAQ;QAAEC,SAAS,GAAAF,WAAA,CAATE,SAAS;QAAEjB,cAAc,GAAAe,WAAA,CAAdf,cAAc;QAAKkB,IAAI,OAAAC,yBAAA,aAAAJ,WAAA,EAAA/D,SAAA;MAEpD,IAAQoE,aAAa,GAAmBF,IAAI,CAApCE,aAAa;QAAKC,SAAS,OAAAF,yBAAA,aAAKD,IAAI,EAAAjE,UAAA;MAC5C,IAAMqE,KAAK,GAAG,IAAI,CAACvB,YAAY,CAACC,cAAc,CAAC;MAE/C,oBACEtD,MAAA,YAAAgD,aAAA,CAAC7C,OAAA,CAAA0E,oBAAoB;QAACC,WAAW;MAAA,gBAC/B9E,MAAA,YAAAgD,aAAA,CAAC7C,OAAA,CAAA4E,aAAa;QAACxD,KAAK,EAAEA;MAAM,gBAC1BvB,MAAA,YAAAgD,aAAA,CAACV,eAAe,MAAA0C,SAAA;QAACT,SAAS,EAAEA;MAAU,GAAKI,SAAS,EAAOC,KAAK,IAAI;QAAEA,KAAK,EAALA;MAAM,CAAC,GAC1EN,QACc,CACJ,CACK,CAAC;IAE3B;EAAC;AAAA,EApDoBW,0BAAc;AAAA,IAAAC,gBAAA,aAA/BzC,QAAQ,eACO;EACjB8B,SAAS,EAAEY,qBAAS,CAACC,MAAM;EAC3Bd,QAAQ,EAAEa,qBAAS,CAACE,KAAK;EACzBX,aAAa,EAAES,qBAAS,CAACG,KAAK,CAAC;IAC7BC,KAAK,EAAEJ,qBAAS,CAACK,OAAO,CAACL,qBAAS,CAACC,MAAM,CAAC;IAC1CK,KAAK,EAAEN,qBAAS,CAACC;EACnB,CAAC,CAAC;EACFM,OAAO,EAAEP,qBAAS,CAACG,KAAK,CAAC;IACvBZ,aAAa,EAAES,qBAAS,CAACC;EAC3B,CAAC,CAAC;EACF9B,cAAc,EAAE6B,qBAAS,CAACQ;AAC5B,CAAC;AAAA,IAAAT,gBAAA,aAZGzC,QAAQ,kBAcU;EACpBiC,aAAa,EAAE,CAAC,CAAC;EACjBgB,OAAO,EAAE,CAAC,CAAC;EACXpC,cAAc,EAAE;AAClB,CAAC;AAAA,IAAAsC,QAAA,GAAAC,OAAA,cAqCYpD,QAAQ","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/render-ui",
-  "version": "4.45.0-mui-update.0",
+  "version": "4.49.0-mui-update.0",
   "description": "Some shared ui elements when rendering - but not worthy of their own package yet.",
   "module": "src/index.js",
   "main": "lib/index.js",
@@ -13,14 +13,13 @@
     "@emotion/styled": "^11.14.1",
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
-    "@pie-lib/icons": "2.34.0-mui-update.0",
-    "@pie-lib/math-rendering": "3.36.0-mui-update.0",
-    "@pie-lib/test-utils": "0.32.0-mui-update.0",
-    "classnames": "^2.2.6",
+    "@pie-lib/icons": "2.38.0-mui-update.0",
+    "@pie-lib/math-rendering": "3.40.0-mui-update.0",
+    "@pie-lib/test-utils": "0.36.0-mui-update.0",
     "debug": "^4.1.1",
     "lodash": "^4.17.11",
     "prop-types": "^15.7.2",
-    "react-transition-group": "^2.5.2"
+    "react-transition-group": "^4.4.5"
   },
   "peerDependencies": {
     "@pie-lib/test-utils": "0.20.0-mui-update.0",
@@ -31,5 +30,5 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
-  "gitHead": "ca668571e7896ba16dd21c2ef58b7d90c84230f6"
+  "gitHead": "1e3f5fd7812b0a334d3b2719026a01c3102398c9"
 }

package/src/feedback.jsx

@@ -1,12 +1,7 @@
-/**
- * Lifted from multiple-choice - TODO: create a shared package for it.
- */
-import { styled } from '@mui/material/styles';
-
 import React from 'react';
-import { TransitionGroup, CSSTransition } from 'react-transition-group';
-import classNames from 'classnames';
 import PropTypes from 'prop-types';
+import { styled } from '@mui/material/styles';
+import { TransitionGroup, CSSTransition } from 'react-transition-group';
 import * as color from './color';
 
 const FeedbackContainer = styled('div')({
@@ -36,25 +31,18 @@ const FeedbackContent = styled('div')({
   },
 });
 
-const transitionClasses = {
-  feedbackEnter: 'feedback-enter',
-  feedbackEnterActive: 'feedback-enter-active',
-  feedbackLeave: 'feedback-leave',
-  feedbackLeaveActive: 'feedback-leave-active',
-};
-
 const TransitionWrapper = styled('div')({
-  [`&.${transitionClasses.feedbackEnter}`]: {
+  '&.feedback-enter': {
     height: '1px',
   },
-  [`&.${transitionClasses.feedbackEnterActive}`]: {
+  '&.feedback-enter-active': {
     height: '45px',
     transition: 'height 500ms',
   },
-  [`&.${transitionClasses.feedbackLeave}`]: {
+  '&.feedback-exit': {
     height: '45px',
   },
-  [`&.${transitionClasses.feedbackLeaveActive}`]: {
+  '&.feedback-exit-active': {
     height: '1px',
     transition: 'height 200ms',
   },
@@ -66,28 +54,38 @@ export class Feedback extends React.Component {
     feedback: PropTypes.string,
   };
 
-  render() {
+  nodeRef = React.createRef();
+
+  renderFeedback() {
     const { correctness, feedback } = this.props;
 
-    function chooseFeedback(correctness) {
-      if (correctness && feedback) {
-        return (
-          <CSSTransition classNames={transitionClasses} key="hasFeedback" timeout={{ enter: 500, exit: 300 }}>
-            <TransitionWrapper>
-              <FeedbackContainer>
-                <FeedbackContent className={classNames(correctness)} dangerouslySetInnerHTML={{ __html: feedback }} />
-              </FeedbackContainer>
-            </TransitionWrapper>
-          </CSSTransition>
-        );
-      } else {
-        return null;
-      }
-    }
+    if (!correctness || !feedback) return null;
+
+    return (
+      <CSSTransition
+        key="hasFeedback"
+        nodeRef={this.nodeRef}
+        timeout={{ enter: 500, exit: 200 }}
+        classNames="feedback"
+      >
+        <TransitionWrapper ref={this.nodeRef}>
+          <FeedbackContainer>
+            <FeedbackContent
+              className={correctness}
+              dangerouslySetInnerHTML={{ __html: feedback }}
+            />
+          </FeedbackContainer>
+        </TransitionWrapper>
+      </CSSTransition>
+    );
+  }
 
+  render() {
     return (
       <div>
-        <TransitionGroup>{chooseFeedback(correctness)}</TransitionGroup>
+        <TransitionGroup>
+          {this.renderFeedback()}
+        </TransitionGroup>
       </div>
     );
   }

package/src/preview-prompt.jsx

@@ -2,6 +2,7 @@ import React, { Component } from 'react';
 import { styled } from '@mui/material/styles';
 import PropTypes from 'prop-types';
 import * as color from './color';
+import { renderMath } from '@pie-lib/math-rendering';
 
 const StyledPromptContainer = styled('div')(({ theme, tagName }) => ({
   // Base promptTable styles
@@ -190,16 +191,32 @@ export class PreviewPrompt extends Component {
   componentDidMount() {
     this.alignImages();
     this.addCustomAudioButtonControls();
+    this.setupMathRendering();
   }
 
-  componentDidUpdate() {
+  componentDidUpdate(prevProps) {
     this.alignImages();
+
+    if (prevProps.prompt !== this.props.prompt) {
+      this.renderMathContent();
+    }
   }
 
   componentWillUnmount() {
     this.removeCustomAudioButtonListeners();
   }
 
+  setupMathRendering() {
+    this.renderMathContent();
+  }
+
+  renderMathContent() {
+    const container = document.getElementById('preview-prompt');
+    if (container && typeof renderMath === 'function') {
+      renderMath(container);
+    }
+  }
+
   alignImages() {
     const previewPrompts = document.querySelectorAll('#preview-prompt');
 

package/src/ui-layout.jsx

@@ -2,7 +2,6 @@ import React from 'react';
 import { createTheme, ThemeProvider, StyledEngineProvider } from '@mui/material/styles';
 import { styled } from '@mui/material/styles';
 import PropTypes from 'prop-types';
-import classNames from 'classnames';
 import AppendCSSRules from './append-css-rules';
 
 const theme = createTheme({
@@ -73,7 +72,9 @@ class UiLayout extends AppendCSSRules {
     const bodyFontSize = getFontSize(document.body);
     const effectiveFontSize = Math.max(rootFontSize, bodyFontSize);
 
-    return fontSizeFactor !== 1 ? { fontSize: `${effectiveFontSize * fontSizeFactor}px` } : null;
+    // Handle null, undefined, or invalid values by defaulting to 1
+    const factor = fontSizeFactor != null && typeof fontSizeFactor === 'number' ? fontSizeFactor : 1;
+    return factor !== 1 ? { fontSize: `${effectiveFontSize * factor}px` } : null;
   }
 
   render() {