@pie-lib/editable-html-tip-tap 2.1.11 → 2.2.0-beta.1

package/lib/components/respArea/DragInTheBlank/__tests__/choice.test.js

@@ -0,0 +1,90 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _choice = _interopRequireDefault(require("../choice"));
+// Mock @dnd-kit hooks to avoid DndContext requirement
+jest.mock('@dnd-kit/core', function () {
+  return {
+    useDraggable: jest.fn(function () {
+      return {
+        attributes: {},
+        listeners: {},
+        setNodeRef: jest.fn(),
+        isDragging: false
+      };
+    }),
+    useDroppable: jest.fn(function () {
+      return {
+        setNodeRef: jest.fn(),
+        isOver: false,
+        active: null
+      };
+    })
+  };
+});
+jest.mock('@pie-lib/math-rendering', function () {
+  return {
+    renderMath: jest.fn()
+  };
+});
+
+// Collect the CSS rules emotion/MUI injected into the document (jsdom uses insertRule).
+var collectEmotionRules = function collectEmotionRules() {
+  var rules = [];
+  for (var _i = 0, _Array$from = Array.from(document.styleSheets); _i < _Array$from.length; _i++) {
+    var sheet = _Array$from[_i];
+    try {
+      for (var _i2 = 0, _Array$from2 = Array.from(sheet.cssRules); _i2 < _Array$from2.length; _i2++) {
+        var rule = _Array$from2[_i2];
+        rules.push(rule.cssText);
+      }
+    } catch (e) {
+      /* inaccessible stylesheet */
+    }
+  }
+  return rules;
+};
+describe('DragInTheBlank choice', function () {
+  var defaultProps = {
+    value: {
+      id: '1',
+      value: '<math>1/2</math>'
+    },
+    disabled: false,
+    instanceId: 'test-instance',
+    n: {
+      index: 0
+    },
+    onChange: jest.fn(),
+    removeResponse: jest.fn(),
+    duplicates: false
+  };
+  it('renders without crashing', function () {
+    var _render = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_choice["default"], defaultProps)),
+      container = _render.container;
+    expect(container.firstChild).toBeInTheDocument();
+  });
+  describe('fraction math styling', function () {
+    it('enlarges numerator/denominator digits adjacent to a fraction to 120%', function () {
+      (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_choice["default"], defaultProps));
+      var rule = collectEmotionRules().find(function (r) {
+        return r.includes('mjx-mn') && r.includes('mjx-mfrac');
+      });
+      expect(rule).toBeDefined();
+      expect(rule).toMatch(/mjx-mn:has\(~\s*mjx-mfrac\)/);
+      expect(rule).toMatch(/mjx-mfrac\s*~\s*mjx-mn/);
+      expect(rule).toMatch(/font-size:\s*120%\s*!important/i);
+    });
+    it('keeps the existing mjx-frac 120% rule', function () {
+      (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_choice["default"], defaultProps));
+      var rule = collectEmotionRules().find(function (r) {
+        return /(^|[^-])mjx-frac/.test(r) && !r.includes('mjx-mfrac');
+      });
+      expect(rule).toBeDefined();
+      expect(rule).toMatch(/font-size:\s*120%\s*!important/i);
+    });
+  });
+});
+//# sourceMappingURL=choice.test.js.map

package/lib/components/respArea/DragInTheBlank/__tests__/choice.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"choice.test.js","names":["_react","_interopRequireDefault","require","_react2","_choice","jest","mock","useDraggable","fn","attributes","listeners","setNodeRef","isDragging","useDroppable","isOver","active","renderMath","collectEmotionRules","rules","_i","_Array$from","Array","from","document","styleSheets","length","sheet","_i2","_Array$from2","cssRules","rule","push","cssText","e","describe","defaultProps","value","id","disabled","instanceId","n","index","onChange","removeResponse","duplicates","it","_render","render","createElement","container","expect","firstChild","toBeInTheDocument","find","r","includes","toBeDefined","toMatch","test"],"sources":["../../../../../src/components/respArea/DragInTheBlank/__tests__/choice.test.jsx"],"sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\nimport DragDropChoice from '../choice';\n\n// Mock @dnd-kit hooks to avoid DndContext requirement\njest.mock('@dnd-kit/core', () => ({\n  useDraggable: jest.fn(() => ({\n    attributes: {},\n    listeners: {},\n    setNodeRef: jest.fn(),\n    isDragging: false,\n  })),\n  useDroppable: jest.fn(() => ({\n    setNodeRef: jest.fn(),\n    isOver: false,\n    active: null,\n  })),\n}));\n\njest.mock('@pie-lib/math-rendering', () => ({\n  renderMath: jest.fn(),\n}));\n\n// Collect the CSS rules emotion/MUI injected into the document (jsdom uses insertRule).\nconst collectEmotionRules = () => {\n  const rules = [];\n  for (const sheet of Array.from(document.styleSheets)) {\n    try {\n      for (const rule of Array.from(sheet.cssRules)) {\n        rules.push(rule.cssText);\n      }\n    } catch (e) {\n      /* inaccessible stylesheet */\n    }\n  }\n  return rules;\n};\n\ndescribe('DragInTheBlank choice', () => {\n  const defaultProps = {\n    value: { id: '1', value: '<math>1/2</math>' },\n    disabled: false,\n    instanceId: 'test-instance',\n    n: { index: 0 },\n    onChange: jest.fn(),\n    removeResponse: jest.fn(),\n    duplicates: false,\n  };\n\n  it('renders without crashing', () => {\n    const { container } = render(<DragDropChoice {...defaultProps} />);\n    expect(container.firstChild).toBeInTheDocument();\n  });\n\n  describe('fraction math styling', () => {\n    it('enlarges numerator/denominator digits adjacent to a fraction to 120%', () => {\n      render(<DragDropChoice {...defaultProps} />);\n      const rule = collectEmotionRules().find((r) => r.includes('mjx-mn') && r.includes('mjx-mfrac'));\n      expect(rule).toBeDefined();\n      expect(rule).toMatch(/mjx-mn:has\\(~\\s*mjx-mfrac\\)/);\n      expect(rule).toMatch(/mjx-mfrac\\s*~\\s*mjx-mn/);\n      expect(rule).toMatch(/font-size:\\s*120%\\s*!important/i);\n    });\n\n    it('keeps the existing mjx-frac 120% rule', () => {\n      render(<DragDropChoice {...defaultProps} />);\n      const rule = collectEmotionRules().find((r) => /(^|[^-])mjx-frac/.test(r) && !r.includes('mjx-mfrac'));\n      expect(rule).toBeDefined();\n      expect(rule).toMatch(/font-size:\\s*120%\\s*!important/i);\n    });\n  });\n});\n"],"mappings":"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","ignoreList":[]}

package/lib/components/respArea/MathTemplated.js

@@ -8,7 +8,7 @@ exports["default"] = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _react2 = require("@tiptap/react");
-var _mathInput = require("@pie-lib/math-input");
+var _mathInputMathlive = require("@pie-lib/math-input-mathlive");
 var _styles = require("@mui/material/styles");
 var StyledSpanContainer = (0, _styles.styled)('span')(function () {
   return {
@@ -117,7 +117,7 @@ var MathTemplated = function MathTemplated(props) {
       minWidth: '50px',
       cursor: 'pointer'
     }
-  }, /*#__PURE__*/_react["default"].createElement(StyledSpanContainer, attributes, /*#__PURE__*/_react["default"].createElement(StyledResponseBox, null, keyToDisplay), /*#__PURE__*/_react["default"].createElement(StyledMathBlock, null, /*#__PURE__*/_react["default"].createElement(_mathInput.mq.Static, {
+  }, /*#__PURE__*/_react["default"].createElement(StyledSpanContainer, attributes, /*#__PURE__*/_react["default"].createElement(StyledResponseBox, null, keyToDisplay), /*#__PURE__*/_react["default"].createElement(StyledMathBlock, null, /*#__PURE__*/_react["default"].createElement(_mathInputMathlive.mq.Static, {
     latex: value
   }))));
 };

package/lib/components/respArea/MathTemplated.js.map

@@ -1 +1 @@
-{"version":3,"file":"MathTemplated.js","names":["_react","_interopRequireDefault","require","_propTypes","_react2","_mathInput","_styles","StyledSpanContainer","styled","display","border","margin","cursor","alignItems","justifyContent","minWidth","minHeight","height","StyledResponseBox","_ref","theme","background","palette","grey","color","borderRight","boxSizing","overflow","fontSize","fontFamily","padding","StyledMathBlock","flex","backgroundColor","verticalAlign","borderTop","marginLeft","marginTop","paddingTop","lineHeight","top","left","position","right","MathTemplated","props","node","options","selected","attributes","attrs","value","index","keyToDisplay","concat","parseInt","createElement","NodeViewWrapper","className","style","mq","Static","latex","propTypes","PropTypes","object","string","_default","exports"],"sources":["../../../src/components/respArea/MathTemplated.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { NodeViewWrapper } from '@tiptap/react';\nimport { mq } from '@pie-lib/math-input';\nimport { styled } from '@mui/material/styles';\n\nconst StyledSpanContainer = styled('span')(() => ({\n  display: 'inline-flex',\n  border: '1px solid #C0C3CF',\n  margin: '1px 5px',\n  cursor: 'pointer',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minWidth: '50px',\n  minHeight: '36px',\n  height: 'fit-content',\n}));\n\nconst StyledResponseBox = styled('div')(({ theme }) => ({\n  background: theme.palette.grey['A100'],\n  color: theme.palette.grey['A700'],\n  display: 'inline-flex',\n  borderRight: '2px solid #C0C3CF',\n  boxSizing: 'border-box',\n  overflow: 'hidden',\n  fontSize: '12px',\n  minHeight: '36px',\n  height: '100%',\n  alignItems: 'center',\n  fontFamily: 'Symbola, Times New Roman, serif',\n  padding: '0 2px',\n}));\n\nconst StyledMathBlock = styled('div')(() => ({\n  flex: 8,\n  color: 'var(--pie-text, black)',\n  padding: '4px !important',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  backgroundColor: 'var(--pie-background, rgba(255, 255, 255, 0))',\n  '& > .mq-math-mode sup.mq-nthroot': {\n    fontSize: '70% !important',\n    verticalAlign: '1em !important',\n  },\n  '& > .mq-math-mode .mq-sqrt-stem': {\n    borderTop: '0.07em solid',\n    marginLeft: '-1.5px',\n    marginTop: '-2px !important',\n    paddingTop: '5px !important',\n  },\n  '& .mq-overarrow-inner': {\n    paddingTop: '0 !important',\n    border: 'none !important',\n  },\n  '& .mq-overarrow.mq-arrow-both': {\n    marginTop: '0px',\n    minWidth: '1.23em',\n    '& *': {\n      lineHeight: '1 !important',\n    },\n    '&:before': {\n      top: '-0.4em',\n      left: '-1px',\n    },\n    '&:after': {\n      top: '0px !important',\n      position: 'absolute !important',\n      right: '-2px',\n    },\n    '&.mq-empty:after': {\n      top: '-0.45em',\n    },\n  },\n  '& .mq-overarrow.mq-arrow-right': {\n    '&:before': {\n      top: '-0.4em',\n      right: '-1px',\n    },\n  },\n  '& .mq-overarrow-inner-right': {\n    display: 'none !important',\n  },\n  '& .mq-overarrow-inner-left': {\n    display: 'none !important',\n  },\n}));\nconst MathTemplated = (props) => {\n  const { node, options, selected } = props;\n  const { attrs: attributes } = node;\n  const { value, index } = attributes;\n\n  // add 1 to index to display R 1 instead of R 0\n  const keyToDisplay = `R ${parseInt(index) + 1}`;\n\n  // console.log({nodeProps.children})\n  return (\n    <NodeViewWrapper\n      className=\"math-templated\"\n      data-selected={selected}\n      style={{\n        display: 'inline-flex',\n        minHeight: '36px',\n        minWidth: '50px',\n        cursor: 'pointer',\n      }}\n    >\n      <StyledSpanContainer {...attributes}>\n        <StyledResponseBox>{keyToDisplay}</StyledResponseBox>\n        <StyledMathBlock>\n          <mq.Static latex={value} />\n        </StyledMathBlock>\n      </StyledSpanContainer>\n    </NodeViewWrapper>\n  );\n};\n\nMathTemplated.propTypes = {\n  attributes: PropTypes.object,\n  value: PropTypes.string,\n  keyToDisplay: PropTypes.string,\n};\n\nexport default MathTemplated;\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,UAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,OAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAEA,IAAMK,mBAAmB,GAAG,IAAAC,cAAM,EAAC,MAAM,CAAC,CAAC;EAAA,OAAO;IAChDC,OAAO,EAAE,aAAa;IACtBC,MAAM,EAAE,mBAAmB;IAC3BC,MAAM,EAAE,SAAS;IACjBC,MAAM,EAAE,SAAS;IACjBC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE,QAAQ;IACxBC,QAAQ,EAAE,MAAM;IAChBC,SAAS,EAAE,MAAM;IACjBC,MAAM,EAAE;EACV,CAAC;AAAA,CAAC,CAAC;AAEH,IAAMC,iBAAiB,GAAG,IAAAV,cAAM,EAAC,KAAK,CAAC,CAAC,UAAAW,IAAA;EAAA,IAAGC,KAAK,GAAAD,IAAA,CAALC,KAAK;EAAA,OAAQ;IACtDC,UAAU,EAAED,KAAK,CAACE,OAAO,CAACC,IAAI,CAAC,MAAM,CAAC;IACtCC,KAAK,EAAEJ,KAAK,CAACE,OAAO,CAACC,IAAI,CAAC,MAAM,CAAC;IACjCd,OAAO,EAAE,aAAa;IACtBgB,WAAW,EAAE,mBAAmB;IAChCC,SAAS,EAAE,YAAY;IACvBC,QAAQ,EAAE,QAAQ;IAClBC,QAAQ,EAAE,MAAM;IAChBZ,SAAS,EAAE,MAAM;IACjBC,MAAM,EAAE,MAAM;IACdJ,UAAU,EAAE,QAAQ;IACpBgB,UAAU,EAAE,iCAAiC;IAC7CC,OAAO,EAAE;EACX,CAAC;AAAA,CAAC,CAAC;AAEH,IAAMC,eAAe,GAAG,IAAAvB,cAAM,EAAC,KAAK,CAAC,CAAC;EAAA,OAAO;IAC3CwB,IAAI,EAAE,CAAC;IACPR,KAAK,EAAE,wBAAwB;IAC/BM,OAAO,EAAE,gBAAgB;IACzBrB,OAAO,EAAE,MAAM;IACfI,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE,QAAQ;IACxBmB,eAAe,EAAE,+CAA+C;IAChE,kCAAkC,EAAE;MAClCL,QAAQ,EAAE,gBAAgB;MAC1BM,aAAa,EAAE;IACjB,CAAC;IACD,iCAAiC,EAAE;MACjCC,SAAS,EAAE,cAAc;MACzBC,UAAU,EAAE,QAAQ;MACpBC,SAAS,EAAE,iBAAiB;MAC5BC,UAAU,EAAE;IACd,CAAC;IACD,uBAAuB,EAAE;MACvBA,UAAU,EAAE,cAAc;MAC1B5B,MAAM,EAAE;IACV,CAAC;IACD,+BAA+B,EAAE;MAC/B2B,SAAS,EAAE,KAAK;MAChBtB,QAAQ,EAAE,QAAQ;MAClB,KAAK,EAAE;QACLwB,UAAU,EAAE;MACd,CAAC;MACD,UAAU,EAAE;QACVC,GAAG,EAAE,QAAQ;QACbC,IAAI,EAAE;MACR,CAAC;MACD,SAAS,EAAE;QACTD,GAAG,EAAE,gBAAgB;QACrBE,QAAQ,EAAE,qBAAqB;QAC/BC,KAAK,EAAE;MACT,CAAC;MACD,kBAAkB,EAAE;QAClBH,GAAG,EAAE;MACP;IACF,CAAC;IACD,gCAAgC,EAAE;MAChC,UAAU,EAAE;QACVA,GAAG,EAAE,QAAQ;QACbG,KAAK,EAAE;MACT;IACF,CAAC;IACD,6BAA6B,EAAE;MAC7BlC,OAAO,EAAE;IACX,CAAC;IACD,4BAA4B,EAAE;MAC5BA,OAAO,EAAE;IACX;EACF,CAAC;AAAA,CAAC,CAAC;AACH,IAAMmC,aAAa,GAAG,SAAhBA,aAAaA,CAAIC,KAAK,EAAK;EAC/B,IAAQC,IAAI,GAAwBD,KAAK,CAAjCC,IAAI;IAAEC,OAAO,GAAeF,KAAK,CAA3BE,OAAO;IAAEC,QAAQ,GAAKH,KAAK,CAAlBG,QAAQ;EAC/B,IAAeC,UAAU,GAAKH,IAAI,CAA1BI,KAAK;EACb,IAAQC,KAAK,GAAYF,UAAU,CAA3BE,KAAK;IAAEC,KAAK,GAAKH,UAAU,CAApBG,KAAK;;EAEpB;EACA,IAAMC,YAAY,QAAAC,MAAA,CAAQC,QAAQ,CAACH,KAAK,CAAC,GAAG,CAAC,CAAE;;EAE/C;EACA,oBACEpD,MAAA,YAAAwD,aAAA,CAACpD,OAAA,CAAAqD,eAAe;IACdC,SAAS,EAAC,gBAAgB;IAC1B,iBAAeV,QAAS;IACxBW,KAAK,EAAE;MACLlD,OAAO,EAAE,aAAa;MACtBO,SAAS,EAAE,MAAM;MACjBD,QAAQ,EAAE,MAAM;MAChBH,MAAM,EAAE;IACV;EAAE,gBAEFZ,MAAA,YAAAwD,aAAA,CAACjD,mBAAmB,EAAK0C,UAAU,eACjCjD,MAAA,YAAAwD,aAAA,CAACtC,iBAAiB,QAAEmC,YAAgC,CAAC,eACrDrD,MAAA,YAAAwD,aAAA,CAACzB,eAAe,qBACd/B,MAAA,YAAAwD,aAAA,CAACnD,UAAA,CAAAuD,EAAE,CAACC,MAAM;IAACC,KAAK,EAAEX;EAAM,CAAE,CACX,CACE,CACN,CAAC;AAEtB,CAAC;AAEDP,aAAa,CAACmB,SAAS,GAAG;EACxBd,UAAU,EAAEe,qBAAS,CAACC,MAAM;EAC5Bd,KAAK,EAAEa,qBAAS,CAACE,MAAM;EACvBb,YAAY,EAAEW,qBAAS,CAACE;AAC1B,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,cAEaxB,aAAa","ignoreList":[]}
+{"version":3,"file":"MathTemplated.js","names":["_react","_interopRequireDefault","require","_propTypes","_react2","_mathInputMathlive","_styles","StyledSpanContainer","styled","display","border","margin","cursor","alignItems","justifyContent","minWidth","minHeight","height","StyledResponseBox","_ref","theme","background","palette","grey","color","borderRight","boxSizing","overflow","fontSize","fontFamily","padding","StyledMathBlock","flex","backgroundColor","verticalAlign","borderTop","marginLeft","marginTop","paddingTop","lineHeight","top","left","position","right","MathTemplated","props","node","options","selected","attributes","attrs","value","index","keyToDisplay","concat","parseInt","createElement","NodeViewWrapper","className","style","mq","Static","latex","propTypes","PropTypes","object","string","_default","exports"],"sources":["../../../src/components/respArea/MathTemplated.jsx"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { NodeViewWrapper } from '@tiptap/react';\nimport { mq } from '@pie-lib/math-input-mathlive';\nimport { styled } from '@mui/material/styles';\n\nconst StyledSpanContainer = styled('span')(() => ({\n  display: 'inline-flex',\n  border: '1px solid #C0C3CF',\n  margin: '1px 5px',\n  cursor: 'pointer',\n  alignItems: 'center',\n  justifyContent: 'center',\n  minWidth: '50px',\n  minHeight: '36px',\n  height: 'fit-content',\n}));\n\nconst StyledResponseBox = styled('div')(({ theme }) => ({\n  background: theme.palette.grey['A100'],\n  color: theme.palette.grey['A700'],\n  display: 'inline-flex',\n  borderRight: '2px solid #C0C3CF',\n  boxSizing: 'border-box',\n  overflow: 'hidden',\n  fontSize: '12px',\n  minHeight: '36px',\n  height: '100%',\n  alignItems: 'center',\n  fontFamily: 'Symbola, Times New Roman, serif',\n  padding: '0 2px',\n}));\n\nconst StyledMathBlock = styled('div')(() => ({\n  flex: 8,\n  color: 'var(--pie-text, black)',\n  padding: '4px !important',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  backgroundColor: 'var(--pie-background, rgba(255, 255, 255, 0))',\n  '& > .mq-math-mode sup.mq-nthroot': {\n    fontSize: '70% !important',\n    verticalAlign: '1em !important',\n  },\n  '& > .mq-math-mode .mq-sqrt-stem': {\n    borderTop: '0.07em solid',\n    marginLeft: '-1.5px',\n    marginTop: '-2px !important',\n    paddingTop: '5px !important',\n  },\n  '& .mq-overarrow-inner': {\n    paddingTop: '0 !important',\n    border: 'none !important',\n  },\n  '& .mq-overarrow.mq-arrow-both': {\n    marginTop: '0px',\n    minWidth: '1.23em',\n    '& *': {\n      lineHeight: '1 !important',\n    },\n    '&:before': {\n      top: '-0.4em',\n      left: '-1px',\n    },\n    '&:after': {\n      top: '0px !important',\n      position: 'absolute !important',\n      right: '-2px',\n    },\n    '&.mq-empty:after': {\n      top: '-0.45em',\n    },\n  },\n  '& .mq-overarrow.mq-arrow-right': {\n    '&:before': {\n      top: '-0.4em',\n      right: '-1px',\n    },\n  },\n  '& .mq-overarrow-inner-right': {\n    display: 'none !important',\n  },\n  '& .mq-overarrow-inner-left': {\n    display: 'none !important',\n  },\n}));\nconst MathTemplated = (props) => {\n  const { node, options, selected } = props;\n  const { attrs: attributes } = node;\n  const { value, index } = attributes;\n\n  // add 1 to index to display R 1 instead of R 0\n  const keyToDisplay = `R ${parseInt(index) + 1}`;\n\n  // console.log({nodeProps.children})\n  return (\n    <NodeViewWrapper\n      className=\"math-templated\"\n      data-selected={selected}\n      style={{\n        display: 'inline-flex',\n        minHeight: '36px',\n        minWidth: '50px',\n        cursor: 'pointer',\n      }}\n    >\n      <StyledSpanContainer {...attributes}>\n        <StyledResponseBox>{keyToDisplay}</StyledResponseBox>\n        <StyledMathBlock>\n          <mq.Static latex={value} />\n        </StyledMathBlock>\n      </StyledSpanContainer>\n    </NodeViewWrapper>\n  );\n};\n\nMathTemplated.propTypes = {\n  attributes: PropTypes.object,\n  value: PropTypes.string,\n  keyToDisplay: PropTypes.string,\n};\n\nexport default MathTemplated;\n"],"mappings":"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","ignoreList":[]}

package/lib/components/respArea/__tests__/MathTemplated.test.js

@@ -0,0 +1,217 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+var _react = _interopRequireDefault(require("react"));
+var _react2 = require("@testing-library/react");
+var _MathTemplated = _interopRequireDefault(require("../MathTemplated"));
+var _excluded = ["children"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2["default"])(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+// Mock the dependencies
+jest.mock('@tiptap/react', function () {
+  return {
+    NodeViewWrapper: function NodeViewWrapper(_ref) {
+      var children = _ref.children,
+        props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
+      return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({
+        "data-testid": "node-view-wrapper"
+      }, props), children);
+    }
+  };
+});
+jest.mock('@pie-lib/math-input-mathlive', function () {
+  return {
+    mq: {
+      Static: function Static(_ref2) {
+        var latex = _ref2.latex;
+        return /*#__PURE__*/_react["default"].createElement("div", {
+          "data-testid": "mq-static",
+          "data-latex": latex
+        }, latex);
+      }
+    }
+  };
+});
+describe('MathTemplated', function () {
+  var defaultProps = {
+    node: {
+      attrs: {
+        value: 'x^2 + y^2 = r^2',
+        index: 0
+      }
+    },
+    options: {},
+    selected: false
+  };
+  it('renders without crashing', function () {
+    var _render = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], defaultProps)),
+      container = _render.container;
+    expect(container).toBeInTheDocument();
+  });
+  it('renders NodeViewWrapper with correct className', function () {
+    var _render2 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], defaultProps)),
+      getByTestId = _render2.getByTestId;
+    var wrapper = getByTestId('node-view-wrapper');
+    expect(wrapper).toHaveClass('math-templated');
+  });
+  it('displays correct response key for index 0', function () {
+    var _render3 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], defaultProps)),
+      getByText = _render3.getByText;
+    expect(getByText('R 1')).toBeInTheDocument();
+  });
+  it('displays correct response key for index 1', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      node: {
+        attrs: {
+          value: 'a + b',
+          index: 1
+        }
+      }
+    });
+    var _render4 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByText = _render4.getByText;
+    expect(getByText('R 2')).toBeInTheDocument();
+  });
+  it('displays correct response key for index 5', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      node: {
+        attrs: {
+          value: 'c = d',
+          index: 5
+        }
+      }
+    });
+    var _render5 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByText = _render5.getByText;
+    expect(getByText('R 6')).toBeInTheDocument();
+  });
+  it('renders LaTeX value correctly', function () {
+    var _render6 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], defaultProps)),
+      getByTestId = _render6.getByTestId;
+    var mqStatic = getByTestId('mq-static');
+    expect(mqStatic).toHaveAttribute('data-latex', 'x^2 + y^2 = r^2');
+  });
+  it('renders different LaTeX value', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      node: {
+        attrs: {
+          value: '\\frac{a}{b}',
+          index: 2
+        }
+      }
+    });
+    var _render7 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByTestId = _render7.getByTestId;
+    var mqStatic = getByTestId('mq-static');
+    expect(mqStatic).toHaveAttribute('data-latex', '\\frac{a}{b}');
+  });
+  it('passes selected prop to NodeViewWrapper', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      selected: true
+    });
+    var _render8 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByTestId = _render8.getByTestId;
+    var wrapper = getByTestId('node-view-wrapper');
+    expect(wrapper).toHaveAttribute('data-selected', 'true');
+  });
+  it('passes false selected prop to NodeViewWrapper', function () {
+    var _render9 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], defaultProps)),
+      getByTestId = _render9.getByTestId;
+    var wrapper = getByTestId('node-view-wrapper');
+    expect(wrapper).toHaveAttribute('data-selected', 'false');
+  });
+  it('applies correct inline styles to NodeViewWrapper', function () {
+    var _render0 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], defaultProps)),
+      getByTestId = _render0.getByTestId;
+    var wrapper = getByTestId('node-view-wrapper');
+    expect(wrapper).toHaveStyle({
+      display: 'inline-flex',
+      minHeight: '36px',
+      minWidth: '50px',
+      cursor: 'pointer'
+    });
+  });
+  it('handles string index correctly', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      node: {
+        attrs: {
+          value: 'test',
+          index: '3'
+        }
+      }
+    });
+    var _render1 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByText = _render1.getByText;
+    expect(getByText('R 4')).toBeInTheDocument();
+  });
+  it('handles empty value', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      node: {
+        attrs: {
+          value: '',
+          index: 0
+        }
+      }
+    });
+    var _render10 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByTestId = _render10.getByTestId;
+    var mqStatic = getByTestId('mq-static');
+    expect(mqStatic).toHaveAttribute('data-latex', '');
+  });
+  it('renders all styled components', function () {
+    var _render11 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], defaultProps)),
+      container = _render11.container,
+      getByText = _render11.getByText;
+
+    // Check for response box
+    expect(getByText('R 1')).toBeInTheDocument();
+
+    // Check for math block with LaTeX
+    var mqStatic = container.querySelector('[data-testid="mq-static"]');
+    expect(mqStatic).toBeInTheDocument();
+  });
+  it('handles zero index', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      node: {
+        attrs: {
+          value: 'x = 0',
+          index: 0
+        }
+      }
+    });
+    var _render12 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByText = _render12.getByText;
+    expect(getByText('R 1')).toBeInTheDocument();
+  });
+  it('handles large index values', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      node: {
+        attrs: {
+          value: 'x = 100',
+          index: 99
+        }
+      }
+    });
+    var _render13 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByText = _render13.getByText;
+    expect(getByText('R 100')).toBeInTheDocument();
+  });
+  it('renders with complex LaTeX expression', function () {
+    var props = _objectSpread(_objectSpread({}, defaultProps), {}, {
+      node: {
+        attrs: {
+          value: '\\sqrt{x^2 + y^2}',
+          index: 0
+        }
+      }
+    });
+    var _render14 = (0, _react2.render)(/*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], props)),
+      getByTestId = _render14.getByTestId;
+    var mqStatic = getByTestId('mq-static');
+    expect(mqStatic).toHaveAttribute('data-latex', '\\sqrt{x^2 + y^2}');
+  });
+});
+//# sourceMappingURL=MathTemplated.test.js.map

package/lib/components/respArea/__tests__/MathTemplated.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MathTemplated.test.js","names":["_react","_interopRequireDefault","require","_react2","_MathTemplated","_excluded","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","jest","mock","NodeViewWrapper","_ref","children","props","_objectWithoutProperties2","createElement","_extends2","mq","Static","_ref2","latex","describe","defaultProps","node","attrs","value","index","options","selected","it","_render","render","container","expect","toBeInTheDocument","_render2","getByTestId","wrapper","toHaveClass","_render3","getByText","_render4","_render5","_render6","mqStatic","toHaveAttribute","_render7","_render8","_render9","_render0","toHaveStyle","display","minHeight","minWidth","cursor","_render1","_render10","_render11","querySelector","_render12","_render13","_render14"],"sources":["../../../../src/components/respArea/__tests__/MathTemplated.test.jsx"],"sourcesContent":["import React from 'react';\nimport { render } from '@testing-library/react';\nimport MathTemplated from '../MathTemplated';\n\n// Mock the dependencies\njest.mock('@tiptap/react', () => ({\n  NodeViewWrapper: ({ children, ...props }) => (\n    <div data-testid=\"node-view-wrapper\" {...props}>\n      {children}\n    </div>\n  ),\n}));\n\njest.mock('@pie-lib/math-input-mathlive', () => ({\n  mq: {\n    Static: ({ latex }) => (\n      <div data-testid=\"mq-static\" data-latex={latex}>\n        {latex}\n      </div>\n    ),\n  },\n}));\n\ndescribe('MathTemplated', () => {\n  const defaultProps = {\n    node: {\n      attrs: {\n        value: 'x^2 + y^2 = r^2',\n        index: 0,\n      },\n    },\n    options: {},\n    selected: false,\n  };\n\n  it('renders without crashing', () => {\n    const { container } = render(<MathTemplated {...defaultProps} />);\n    expect(container).toBeInTheDocument();\n  });\n\n  it('renders NodeViewWrapper with correct className', () => {\n    const { getByTestId } = render(<MathTemplated {...defaultProps} />);\n    const wrapper = getByTestId('node-view-wrapper');\n    expect(wrapper).toHaveClass('math-templated');\n  });\n\n  it('displays correct response key for index 0', () => {\n    const { getByText } = render(<MathTemplated {...defaultProps} />);\n    expect(getByText('R 1')).toBeInTheDocument();\n  });\n\n  it('displays correct response key for index 1', () => {\n    const props = {\n      ...defaultProps,\n      node: {\n        attrs: {\n          value: 'a + b',\n          index: 1,\n        },\n      },\n    };\n    const { getByText } = render(<MathTemplated {...props} />);\n    expect(getByText('R 2')).toBeInTheDocument();\n  });\n\n  it('displays correct response key for index 5', () => {\n    const props = {\n      ...defaultProps,\n      node: {\n        attrs: {\n          value: 'c = d',\n          index: 5,\n        },\n      },\n    };\n    const { getByText } = render(<MathTemplated {...props} />);\n    expect(getByText('R 6')).toBeInTheDocument();\n  });\n\n  it('renders LaTeX value correctly', () => {\n    const { getByTestId } = render(<MathTemplated {...defaultProps} />);\n    const mqStatic = getByTestId('mq-static');\n    expect(mqStatic).toHaveAttribute('data-latex', 'x^2 + y^2 = r^2');\n  });\n\n  it('renders different LaTeX value', () => {\n    const props = {\n      ...defaultProps,\n      node: {\n        attrs: {\n          value: '\\\\frac{a}{b}',\n          index: 2,\n        },\n      },\n    };\n    const { getByTestId } = render(<MathTemplated {...props} />);\n    const mqStatic = getByTestId('mq-static');\n    expect(mqStatic).toHaveAttribute('data-latex', '\\\\frac{a}{b}');\n  });\n\n  it('passes selected prop to NodeViewWrapper', () => {\n    const props = {\n      ...defaultProps,\n      selected: true,\n    };\n    const { getByTestId } = render(<MathTemplated {...props} />);\n    const wrapper = getByTestId('node-view-wrapper');\n    expect(wrapper).toHaveAttribute('data-selected', 'true');\n  });\n\n  it('passes false selected prop to NodeViewWrapper', () => {\n    const { getByTestId } = render(<MathTemplated {...defaultProps} />);\n    const wrapper = getByTestId('node-view-wrapper');\n    expect(wrapper).toHaveAttribute('data-selected', 'false');\n  });\n\n  it('applies correct inline styles to NodeViewWrapper', () => {\n    const { getByTestId } = render(<MathTemplated {...defaultProps} />);\n    const wrapper = getByTestId('node-view-wrapper');\n    expect(wrapper).toHaveStyle({\n      display: 'inline-flex',\n      minHeight: '36px',\n      minWidth: '50px',\n      cursor: 'pointer',\n    });\n  });\n\n  it('handles string index correctly', () => {\n    const props = {\n      ...defaultProps,\n      node: {\n        attrs: {\n          value: 'test',\n          index: '3',\n        },\n      },\n    };\n    const { getByText } = render(<MathTemplated {...props} />);\n    expect(getByText('R 4')).toBeInTheDocument();\n  });\n\n  it('handles empty value', () => {\n    const props = {\n      ...defaultProps,\n      node: {\n        attrs: {\n          value: '',\n          index: 0,\n        },\n      },\n    };\n    const { getByTestId } = render(<MathTemplated {...props} />);\n    const mqStatic = getByTestId('mq-static');\n    expect(mqStatic).toHaveAttribute('data-latex', '');\n  });\n\n  it('renders all styled components', () => {\n    const { container, getByText } = render(<MathTemplated {...defaultProps} />);\n\n    // Check for response box\n    expect(getByText('R 1')).toBeInTheDocument();\n\n    // Check for math block with LaTeX\n    const mqStatic = container.querySelector('[data-testid=\"mq-static\"]');\n    expect(mqStatic).toBeInTheDocument();\n  });\n\n  it('handles zero index', () => {\n    const props = {\n      ...defaultProps,\n      node: {\n        attrs: {\n          value: 'x = 0',\n          index: 0,\n        },\n      },\n    };\n    const { getByText } = render(<MathTemplated {...props} />);\n    expect(getByText('R 1')).toBeInTheDocument();\n  });\n\n  it('handles large index values', () => {\n    const props = {\n      ...defaultProps,\n      node: {\n        attrs: {\n          value: 'x = 100',\n          index: 99,\n        },\n      },\n    };\n    const { getByText } = render(<MathTemplated {...props} />);\n    expect(getByText('R 100')).toBeInTheDocument();\n  });\n\n  it('renders with complex LaTeX expression', () => {\n    const props = {\n      ...defaultProps,\n      node: {\n        attrs: {\n          value: '\\\\sqrt{x^2 + y^2}',\n          index: 0,\n        },\n      },\n    };\n    const { getByTestId } = render(<MathTemplated {...props} />);\n    const mqStatic = getByTestId('mq-static');\n    expect(mqStatic).toHaveAttribute('data-latex', '\\\\sqrt{x^2 + y^2}');\n  });\n});\n"],"mappings":"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","ignoreList":[]}

package/lib/extensions/__tests__/css.test.js

@@ -0,0 +1,214 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof2 = _interopRequireDefault(require("@babel/runtime/helpers/typeof"));
+var _css = require("../css");
+jest.mock('@tiptap/core', function () {
+  return {
+    Mark: {
+      create: jest.fn(function (config) {
+        return config;
+      })
+    },
+    mergeAttributes: jest.fn(function () {
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      return Object.assign.apply(Object, [{}].concat(args));
+    })
+  };
+});
+jest.mock('react-dom', function () {
+  return {
+    render: jest.fn()
+  };
+});
+describe('CSSMark', function () {
+  describe('configuration', function () {
+    it('has correct name', function () {
+      expect(_css.CSSMark.name).toBe('cssmark');
+    });
+  });
+  describe('addOptions', function () {
+    it('returns default options with empty classes array', function () {
+      var options = _css.CSSMark.addOptions();
+      expect(options).toHaveProperty('classes');
+      expect(Array.isArray(options.classes)).toBe(true);
+      expect(options.classes).toHaveLength(0);
+    });
+  });
+  describe('addAttributes', function () {
+    it('returns class attribute configuration', function () {
+      var attributes = _css.CSSMark.addAttributes();
+      expect(attributes).toHaveProperty('class');
+      expect(attributes["class"]).toHaveProperty('default', null);
+      expect(attributes["class"]).toHaveProperty('parseHTML');
+      expect(attributes["class"]).toHaveProperty('renderHTML');
+      expect((0, _typeof2["default"])(attributes["class"].parseHTML)).toBe('function');
+      expect((0, _typeof2["default"])(attributes["class"].renderHTML)).toBe('function');
+    });
+    it('parseHTML extracts class attribute', function () {
+      var attributes = _css.CSSMark.addAttributes();
+      var mockEl = {
+        getAttribute: jest.fn(function (attr) {
+          return attr === 'class' ? 'my-class' : null;
+        })
+      };
+      var result = attributes["class"].parseHTML(mockEl);
+      expect(result).toBe('my-class');
+      expect(mockEl.getAttribute).toHaveBeenCalledWith('class');
+    });
+    it('renderHTML returns empty object when no class', function () {
+      var attributes = _css.CSSMark.addAttributes();
+      var result = attributes["class"].renderHTML({
+        "class": null
+      });
+      expect(result).toEqual({});
+    });
+    it('renderHTML returns class when present', function () {
+      var attributes = _css.CSSMark.addAttributes();
+      var result = attributes["class"].renderHTML({
+        "class": 'my-class'
+      });
+      expect(result).toEqual({
+        "class": 'my-class'
+      });
+    });
+  });
+  describe('parseHTML', function () {
+    beforeEach(function () {
+      _css.CSSMark.options = {
+        classes: ['allowed-class', 'another-class']
+      };
+    });
+    it('returns array with span[class] selector', function () {
+      var rules = _css.CSSMark.parseHTML();
+      expect(Array.isArray(rules)).toBe(true);
+      expect(rules).toHaveLength(1);
+      expect(rules[0]).toHaveProperty('tag', 'span[class]');
+      expect(rules[0]).toHaveProperty('getAttrs');
+    });
+    it('matches allowed classes', function () {
+      var rules = _css.CSSMark.parseHTML();
+      var mockEl = {
+        getAttribute: jest.fn(function () {
+          return 'allowed-class some-other';
+        })
+      };
+      var result = rules[0].getAttrs(mockEl);
+      expect(result).toEqual({
+        "class": 'allowed-class'
+      });
+    });
+    it('returns false for non-allowed classes', function () {
+      var rules = _css.CSSMark.parseHTML();
+      var mockEl = {
+        getAttribute: jest.fn(function () {
+          return 'not-allowed';
+        })
+      };
+      var result = rules[0].getAttrs(mockEl);
+      expect(result).toBe(false);
+    });
+    it('handles empty class attribute', function () {
+      var rules = _css.CSSMark.parseHTML();
+      var mockEl = {
+        getAttribute: jest.fn(function () {
+          return '';
+        })
+      };
+      var result = rules[0].getAttrs(mockEl);
+      expect(result).toBe(false);
+    });
+  });
+  describe('renderHTML', function () {
+    it('returns span with merged attributes', function () {
+      var result = _css.CSSMark.renderHTML({
+        HTMLAttributes: {
+          "class": 'my-class'
+        }
+      });
+      expect(result[0]).toBe('span');
+      expect(result[1]).toEqual({
+        "class": 'my-class'
+      });
+      expect(result[2]).toBe(0);
+    });
+  });
+  describe('addCommands', function () {
+    it('returns setCSSClass command', function () {
+      var commands = _css.CSSMark.addCommands();
+      expect(commands).toHaveProperty('setCSSClass');
+      expect((0, _typeof2["default"])(commands.setCSSClass)).toBe('function');
+    });
+    it('returns unsetCSSClass command', function () {
+      var commands = _css.CSSMark.addCommands();
+      expect(commands).toHaveProperty('unsetCSSClass');
+      expect((0, _typeof2["default"])(commands.unsetCSSClass)).toBe('function');
+    });
+    it('returns openCSSClassDialog command', function () {
+      var commands = _css.CSSMark.addCommands();
+      expect(commands).toHaveProperty('openCSSClassDialog');
+      expect((0, _typeof2["default"])(commands.openCSSClassDialog)).toBe('function');
+    });
+    it('setCSSClass sets mark with class name', function () {
+      var context = {
+        name: 'cssmark'
+      };
+      var commands = _css.CSSMark.addCommands.call(context);
+      var mockCommands = {
+        setMark: jest.fn(function () {
+          return true;
+        })
+      };
+      var result = commands.setCSSClass('my-class')({
+        commands: mockCommands
+      });
+      expect(mockCommands.setMark).toHaveBeenCalledWith('cssmark', {
+        "class": 'my-class'
+      });
+      expect(result).toBe(true);
+    });
+    it('unsetCSSClass unsets mark', function () {
+      var context = {
+        name: 'cssmark'
+      };
+      var commands = _css.CSSMark.addCommands.call(context);
+      var mockCommands = {
+        unsetMark: jest.fn(function () {
+          return true;
+        })
+      };
+      var result = commands.unsetCSSClass()({
+        commands: mockCommands
+      });
+      expect(mockCommands.unsetMark).toHaveBeenCalledWith('cssmark');
+      expect(result).toBe(true);
+    });
+  });
+});
+describe('removeDialogs', function () {
+  it('removes all elements with insert-css-dialog class', function () {
+    var mockElements = [{
+      remove: jest.fn()
+    }, {
+      remove: jest.fn()
+    }];
+    document.querySelectorAll = jest.fn(function () {
+      return mockElements;
+    });
+    (0, _css.removeDialogs)();
+    expect(document.querySelectorAll).toHaveBeenCalledWith('.insert-css-dialog');
+    expect(mockElements[0].remove).toHaveBeenCalled();
+    expect(mockElements[1].remove).toHaveBeenCalled();
+  });
+  it('handles no dialogs gracefully', function () {
+    document.querySelectorAll = jest.fn(function () {
+      return [];
+    });
+    expect(function () {
+      return (0, _css.removeDialogs)();
+    }).not.toThrow();
+  });
+});
+//# sourceMappingURL=css.test.js.map