@pie-lib/render-ui 5.1.0-next.4 → 5.1.1-next.0

package/lib/ui-layout.js

@@ -0,0 +1,128 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.reflect.construct.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+require("core-js/modules/es.parse-float.js");
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+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 _react = _interopRequireDefault(require("react"));
+var _styles = require("@mui/material/styles");
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _excluded = ["children", "className", "fontSizeFactor"],
+  _excluded2 = ["extraCSSRules"];
+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; })(); }
+var theme = (0, _styles.createTheme)({
+  typography: {
+    fontFamily: 'inherit'
+  },
+  palette: {
+    action: {
+      disabled: 'rgba(0, 0, 0, 0.54);'
+    }
+  },
+  components: {
+    MuiTypography: {
+      styleOverrides: {
+        root: {
+          fontFamily: 'inherit'
+        }
+      }
+    },
+    MuiButton: {
+      styleOverrides: {
+        contained: {
+          backgroundColor: '#e0e0e0',
+          color: '#000000',
+          '&:hover': {
+            backgroundColor: '#bdbdbd'
+          }
+        }
+      }
+    }
+  }
+});
+var StyledContainer = (0, _styles.styled)('div')({
+  // need this because some browsers set their own style on table
+  '& table, th, td': {
+    fontSize: 'inherit' /* Ensure table elements inherit font size */
+  }
+});
+var UiLayout = /*#__PURE__*/function (_React$Component) {
+  function UiLayout(props) {
+    var _this;
+    (0, _classCallCheck2["default"])(this, UiLayout);
+    _this = _callSuper(this, UiLayout, [props]);
+    _this.classesSheet = document.createElement('style');
+    return _this;
+  }
+  (0, _inherits2["default"])(UiLayout, _React$Component);
+  return (0, _createClass2["default"])(UiLayout, [{
+    key: "computeStyle",
+    value: function computeStyle(fontSizeFactor) {
+      var getFontSize = function getFontSize(element) {
+        return parseFloat(getComputedStyle(element).fontSize);
+      };
+      var rootFontSize = getFontSize(document.documentElement);
+      var bodyFontSize = getFontSize(document.body);
+      var effectiveFontSize = Math.max(rootFontSize, bodyFontSize);
+
+      // 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;
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var _this$props = this.props,
+        children = _this$props.children,
+        className = _this$props.className,
+        fontSizeFactor = _this$props.fontSizeFactor,
+        rest = (0, _objectWithoutProperties2["default"])(_this$props, _excluded);
+      var extraCSSRules = rest.extraCSSRules,
+        restProps = (0, _objectWithoutProperties2["default"])(rest, _excluded2);
+      var style = this.computeStyle(fontSizeFactor);
+      return /*#__PURE__*/_react["default"].createElement(_styles.StyledEngineProvider, {
+        injectFirst: true
+      }, /*#__PURE__*/_react["default"].createElement(_styles.ThemeProvider, {
+        theme: theme
+      }, extraCSSRules !== null && extraCSSRules !== void 0 && extraCSSRules.rules ? /*#__PURE__*/_react["default"].createElement("style", {
+        dangerouslySetInnerHTML: {
+          __html: ".extraCSSRules { ".concat(extraCSSRules.rules, " }")
+        }
+      }) : null, /*#__PURE__*/_react["default"].createElement(StyledContainer, (0, _extends2["default"])({
+        className: "".concat(className, " extraCSSRules")
+      }, restProps, style && {
+        style: style
+      }), children)));
+    }
+  }]);
+}(_react["default"].Component);
+(0, _defineProperty2["default"])(UiLayout, "propTypes", {
+  className: _propTypes["default"].string,
+  children: _propTypes["default"].array,
+  extraCSSRules: _propTypes["default"].shape({
+    names: _propTypes["default"].arrayOf(_propTypes["default"].string),
+    rules: _propTypes["default"].string
+  }),
+  fontSizeFactor: _propTypes["default"].number
+});
+(0, _defineProperty2["default"])(UiLayout, "defaultProps", {
+  extraCSSRules: {},
+  fontSizeFactor: 1
+});
+var _default = exports["default"] = UiLayout;
+//# sourceMappingURL=ui-layout.js.map

package/lib/ui-layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-layout.js","names":["_react","_interopRequireDefault","require","_styles","_propTypes","_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","_React$Component","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","rules","dangerouslySetInnerHTML","__html","_extends2","React","Component","_defineProperty2","PropTypes","string","array","shape","names","arrayOf","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';\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 React.Component {\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    fontSizeFactor: PropTypes.number,\n  };\n\n  static defaultProps = {\n    extraCSSRules: {},\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          {extraCSSRules?.rules ? (\n            <style dangerouslySetInnerHTML={{ __html: `.extraCSSRules { ${extraCSSRules.rules} }` }} />\n          ) : null}\n\n          <StyledContainer className={`${className} extraCSSRules`} {...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":[]}

package/lib/withUndoReset.js

@@ -0,0 +1,147 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.object.define-property.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.reflect.construct.js");
+require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+require("core-js/modules/es.array.concat.js");
+require("core-js/modules/es.date.to-json.js");
+require("core-js/modules/es.object.assign.js");
+require("core-js/modules/es.object.keys.js");
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectDestructuringEmpty2 = _interopRequireDefault(require("@babel/runtime/helpers/objectDestructuringEmpty"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+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 React = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _Button = _interopRequireDefault(require("@mui/material/Button"));
+var _styles = require("@mui/material/styles");
+var _Restore = _interopRequireDefault(require("@mui/icons-material/Restore"));
+var _Undo = _interopRequireDefault(require("@mui/icons-material/Undo"));
+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; })(); }
+var Wrapper = (0, _styles.styled)('div')({
+  display: 'flex',
+  flexDirection: 'column'
+});
+var ResetUndoContainer = (0, _styles.styled)('div')({
+  display: 'flex',
+  alignItems: 'center',
+  justifyContent: 'center'
+});
+var StyledIcon = (0, _styles.styled)('div')(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    width: '24px',
+    height: '24px',
+    color: 'gray',
+    marginRight: theme.spacing(1),
+    display: 'flex',
+    alignItems: 'center'
+  };
+});
+var StyledButton = (0, _styles.styled)(_Button["default"])(function (_ref2) {
+  var theme = _ref2.theme;
+  return {
+    display: 'flex',
+    alignItems: 'center',
+    marginLeft: theme.spacing(3),
+    marginRight: theme.spacing(3)
+  };
+});
+
+/**
+ * HOC that adds undo and reset functionality for session values
+ */
+var withUndoReset = function withUndoReset(WrappedComponent) {
+  var WithUndoReset = /*#__PURE__*/function (_React$Component) {
+    function WithUndoReset(props) {
+      var _this;
+      (0, _classCallCheck2["default"])(this, WithUndoReset);
+      _this = _callSuper(this, WithUndoReset, [props]);
+      (0, _defineProperty2["default"])(_this, "onSessionChange", function (session) {
+        _this.setState(function (state) {
+          return {
+            session: session,
+            changes: [].concat((0, _toConsumableArray2["default"])(state.changes), [session])
+          };
+        }, function () {
+          return _this.props.onSessionChange(session);
+        });
+      });
+      (0, _defineProperty2["default"])(_this, "onUndo", function () {
+        _this.setState(function (state) {
+          var newChanges = (0, _toConsumableArray2["default"])(state.changes);
+          newChanges.pop();
+          return {
+            changes: newChanges,
+            session: newChanges.length ? newChanges[newChanges.length - 1] : state.sessionInitialValues
+          };
+        }, function () {
+          return _this.props.onSessionChange(_this.state.session);
+        });
+      });
+      (0, _defineProperty2["default"])(_this, "onReset", function () {
+        _this.setState(function (state) {
+          return {
+            session: state.sessionInitialValues,
+            changes: []
+          };
+        }, function () {
+          return _this.props.onSessionChange(_this.state.sessionInitialValues);
+        });
+      });
+      _this.state = {
+        sessionInitialValues: JSON.parse(JSON.stringify(props.session)),
+        session: props.session,
+        changes: []
+      };
+      return _this;
+    }
+    (0, _inherits2["default"])(WithUndoReset, _React$Component);
+    return (0, _createClass2["default"])(WithUndoReset, [{
+      key: "render",
+      value: function render() {
+        var rest = Object.assign({}, ((0, _objectDestructuringEmpty2["default"])(this.props), this.props));
+        var _this$state = this.state,
+          changes = _this$state.changes,
+          session = _this$state.session;
+        return /*#__PURE__*/React.createElement(Wrapper, null, /*#__PURE__*/React.createElement(ResetUndoContainer, null, /*#__PURE__*/React.createElement(StyledButton, {
+          color: "primary",
+          disabled: changes.length === 0,
+          onClick: this.onUndo
+        }, /*#__PURE__*/React.createElement(StyledIcon, null, /*#__PURE__*/React.createElement(_Undo["default"], null)), "Undo"), /*#__PURE__*/React.createElement(StyledButton, {
+          color: "primary",
+          disabled: changes.length === 0,
+          onClick: this.onReset
+        }, /*#__PURE__*/React.createElement(StyledIcon, null, /*#__PURE__*/React.createElement(_Restore["default"], null)), "Start Over")), /*#__PURE__*/React.createElement(WrappedComponent, (0, _extends2["default"])({}, rest, {
+          session: session,
+          onSessionChange: this.onSessionChange
+        })));
+      }
+    }]);
+  }(React.Component);
+  (0, _defineProperty2["default"])(WithUndoReset, "propTypes", {
+    session: _propTypes["default"].object,
+    onSessionChange: _propTypes["default"].func
+  });
+  return WithUndoReset;
+};
+var _default = exports["default"] = withUndoReset;
+//# sourceMappingURL=withUndoReset.js.map

package/lib/withUndoReset.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"withUndoReset.js","names":["React","_interopRequireWildcard","require","_propTypes","_interopRequireDefault","_Button","_styles","_Restore","_Undo","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","Wrapper","styled","display","flexDirection","ResetUndoContainer","alignItems","justifyContent","StyledIcon","_ref","theme","width","height","color","marginRight","spacing","StyledButton","Button","_ref2","marginLeft","withUndoReset","WrappedComponent","WithUndoReset","_React$Component","props","_this","_classCallCheck2","_defineProperty2","session","setState","state","changes","concat","_toConsumableArray2","onSessionChange","newChanges","pop","length","sessionInitialValues","JSON","parse","stringify","_inherits2","_createClass2","key","value","render","rest","assign","_objectDestructuringEmpty2","_this$state","createElement","disabled","onClick","onUndo","onReset","_extends2","Component","PropTypes","object","func","_default","exports"],"sources":["../src/withUndoReset.jsx"],"sourcesContent":["import * as React from 'react';\nimport PropTypes from 'prop-types';\nimport Button from '@mui/material/Button';\nimport { styled } from '@mui/material/styles';\nimport Restore from '@mui/icons-material/Restore';\nimport Undo from '@mui/icons-material/Undo';\n\nconst Wrapper = styled('div')({\n  display: 'flex',\n  flexDirection: 'column',\n});\n\nconst ResetUndoContainer = styled('div')({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n});\n\nconst StyledIcon = styled('div')(({ theme }) => ({\n  width: '24px',\n  height: '24px',\n  color: 'gray',\n  marginRight: theme.spacing(1),\n  display: 'flex',\n  alignItems: 'center',\n}));\n\nconst StyledButton = styled(Button)(({ theme }) => ({\n  display: 'flex',\n  alignItems: 'center',\n  marginLeft: theme.spacing(3),\n  marginRight: theme.spacing(3),\n}));\n\n/**\n * HOC that adds undo and reset functionality for session values\n */\nconst withUndoReset = (WrappedComponent) => {\n  class WithUndoReset extends React.Component {\n    static propTypes = {\n      session: PropTypes.object,\n      onSessionChange: PropTypes.func,\n    };\n\n    constructor(props) {\n      super(props);\n\n      this.state = {\n        sessionInitialValues: JSON.parse(JSON.stringify(props.session)),\n        session: props.session,\n        changes: [],\n      };\n    }\n\n    onSessionChange = (session) => {\n      this.setState(\n        (state) => ({ session, changes: [...state.changes, session] }),\n        () => this.props.onSessionChange(session),\n      );\n    };\n\n    onUndo = () => {\n      this.setState(\n        (state) => {\n          const newChanges = [...state.changes];\n\n          newChanges.pop();\n\n          return {\n            changes: newChanges,\n            session: newChanges.length ? newChanges[newChanges.length - 1] : state.sessionInitialValues,\n          };\n        },\n        () => this.props.onSessionChange(this.state.session),\n      );\n    };\n\n    onReset = () => {\n      this.setState(\n        (state) => ({ session: state.sessionInitialValues, changes: [] }),\n        () => this.props.onSessionChange(this.state.sessionInitialValues),\n      );\n    };\n\n    render() {\n      const { ...rest } = this.props;\n      const { changes, session } = this.state;\n\n      return (\n        <Wrapper>\n          <ResetUndoContainer>\n            <StyledButton color=\"primary\" disabled={changes.length === 0} onClick={this.onUndo}>\n              <StyledIcon>\n                <Undo />\n              </StyledIcon>\n              Undo\n            </StyledButton>\n            <StyledButton color=\"primary\" disabled={changes.length === 0} onClick={this.onReset}>\n              <StyledIcon>\n                <Restore />\n              </StyledIcon>\n              Start Over\n            </StyledButton>\n          </ResetUndoContainer>\n          <WrappedComponent {...rest} session={session} onSessionChange={this.onSessionChange} />\n        </Wrapper>\n      );\n    }\n  }\n\n  return WithUndoReset;\n};\n\nexport default withUndoReset;\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pie-lib/render-ui",
-  "version": "5.1.0-next.4",
+  "version": "5.1.1-next.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,11 +13,11 @@
     "@emotion/styled": "^11.14.1",
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
-    "@pie-lib/icons": "3.1.0-next.3",
-    "@pie-lib/math-rendering": "4.1.0-next.3",
-    "@pie-lib/test-utils": "1.1.0-next.3",
+    "@pie-lib/icons": "^3.1.1-next.0",
+    "@pie-lib/math-rendering": "^4.1.1-next.0",
+    "@pie-lib/test-utils": "^1.1.1-next.0",
     "debug": "^4.1.1",
-    "lodash": "^4.17.11",
+    "lodash": "^4.17.23",
     "prop-types": "^15.7.2",
     "react-transition-group": "^4.4.5"
   },
@@ -30,5 +30,5 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
-  "gitHead": "8ea41592c5553487014f2694f91b657c4f62d131"
+  "gitHead": "7bb08145106e65c83a8f4a51902cf669d1be19ac"
 }

package/src/preview-prompt.jsx

@@ -10,10 +10,11 @@ const StyledPromptContainer = styled('div')(({ theme, tagName }) => ({
     borderCollapse: 'collapse',
   },
   // Apply vertical striping when first column is a header (th) and NOT mixed with td
-  '&:not(.MathJax) > table:has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)': {
-    backgroundColor: '#f6f8fa',
-    color: theme.palette.common.black,
-  },
+  '&:not(.MathJax) > table:has(tbody tr > th:first-child):not(:has(tbody tr > td:first-child)) tbody td:nth-child(even)':
+    {
+      backgroundColor: '#f6f8fa',
+      color: theme.palette.common.black,
+    },
   // Apply horizontal striping for tables where first element is a data cell (td)
   '&:not(.MathJax) > table:has(tbody tr > td:first-child) tbody tr:nth-child(even) td': {
     backgroundColor: '#f6f8fa',
@@ -42,7 +43,7 @@ const StyledPromptContainer = styled('div')(({ theme, tagName }) => ({
     paddingLeft: theme.spacing(4),
     paddingBottom: theme.spacing(1),
   },
-  '&.label': {
+  '&.prompt-label': {
     color: `${color.text()} !important`,
     display: 'flex',
     flexDirection: 'column',