@pie-lib/editable-html-tip-tap 1.2.0-next.2 → 1.2.0-next.21

package/lib/styles/editorContainerStyles.js

@@ -63,7 +63,7 @@ var styles = function styles(theme) {
         background: 'var(--black)',
         borderRadius: '0.5rem',
         color: 'var(--white)',
-        fontFamily: "'JetBrainsMono', monospace",
+        fontFamily: '\'JetBrainsMono\', monospace',
         margin: '1.5rem 0',
         padding: '0.75rem 1rem',
         '& code': {
@@ -74,9 +74,10 @@ var styles = function styles(theme) {
         }
       },
       '& blockquote': {
-        borderLeft: '3px solid var(--gray-3)',
-        margin: '1.5rem 0',
-        paddingLeft: '1rem'
+        background: '#f9f9f9',
+        borderLeft: '5px solid #ccc',
+        margin: '1.5em 10px',
+        padding: '.5em 10px'
       },
       '& hr': {
         border: 'none',
@@ -133,4 +134,4 @@ var styles = function styles(theme) {
   };
 };
 var _default = exports["default"] = styles;
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJfcmVuZGVyVWkiLCJyZXF1aXJlIiwic3R5bGVzIiwidGhlbWUiLCJyb290IiwicG9zaXRpb24iLCJwYWRkaW5nIiwiYm9yZGVyIiwiYm9yZGVyUmFkaXVzIiwiY3Vyc29yIiwid29yZEJyZWFrIiwib3ZlcmZsb3ciLCJtYXhIZWlnaHQiLCJtYXJnaW5Ub3AiLCJtYXJnaW4iLCJtYXJnaW5Cb3R0b20iLCJsaW5lSGVpZ2h0IiwidGV4dFdyYXAiLCJmb250U2l6ZSIsImJhY2tncm91bmRDb2xvciIsImNvbG9yIiwiYmFja2dyb3VuZCIsImZvbnRGYW1pbHkiLCJib3JkZXJMZWZ0IiwicGFkZGluZ0xlZnQiLCJib3JkZXJUb3AiLCJ0YWJsZUxheW91dCIsIndpZHRoIiwiYm9yZGVyQ29sbGFwc2UiLCJ0ZXh0IiwidGV4dEFsaWduIiwiY2hpbGRyZW4iLCJlZGl0b3JIb2xkZXIiLCJvdmVyZmxvd1kiLCJkaXNhYmxlZFNjcm9sbGJhciIsImRpc3BsYXkiLCJzY3JvbGxiYXJXaWR0aCIsImVycm9yIiwiY29uY2F0IiwicGFsZXR0ZSIsIm1haW4iLCJub0JvcmRlciIsIm5vUGFkZGluZyIsInRvb2xiYXJPblRvcCIsIl9kZWZhdWx0IiwiZXhwb3J0cyJdLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy9zdHlsZXMvZWRpdG9yQ29udGFpbmVyU3R5bGVzLmpzIl0sInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNvbG9yIH0gZnJvbSAnQHBpZS1saWIvcmVuZGVyLXVpJztcblxuY29uc3Qgc3R5bGVzID0gKHRoZW1lKSA9PiAoe1xuICByb290OiB7XG4gICAgcG9zaXRpb246ICdyZWxhdGl2ZScsXG4gICAgcGFkZGluZzogJzBweCcsXG4gICAgYm9yZGVyOiAnMXB4IHNvbGlkICNjY2MnLFxuICAgIGJvcmRlclJhZGl1czogJzRweCcsXG4gICAgY3Vyc29yOiAndGV4dCcsXG4gICAgJyYgW2RhdGEtc2xhdGUtZWRpdG9yPVwidHJ1ZVwiXSc6IHtcbiAgICAgIHdvcmRCcmVhazogJ2JyZWFrLXdvcmQnLFxuICAgICAgb3ZlcmZsb3c6ICd2aXNpYmxlJyxcbiAgICAgIG1heEhlaWdodDogJzUwMHB4JyxcbiAgICAgIC8vIG5lZWRlZCBpbiBvcmRlciB0byBiZSBhYmxlIHRvIHB1dCB0aGUgZm9jdXMgYmVmb3JlIGEgdm9pZCBlbGVtZW50IHdoZW4gaXQgaXMgdGhlIGZpcnN0IG9uZSBpbiB0aGUgZWRpdG9yXG4gICAgICBwYWRkaW5nOiAnNXB4JyxcbiAgICB9LFxuXG4gICAgJyY6Zmlyc3QtY2hpbGQnOiB7XG4gICAgICBtYXJnaW5Ub3A6IDAsXG4gICAgfSxcblxuICAgICcmIHVsLCAmIG9sJzoge1xuICAgICAgcGFkZGluZzogJzAgMXJlbScsXG4gICAgICBtYXJnaW46ICcxLjI1cmVtIDFyZW0gMS4yNXJlbSAwLjRyZW0nLFxuICAgIH0sXG5cbiAgICAnJiB1bCBsaSBwLCAmIG9sIGxpIHAnOiB7XG4gICAgICBtYXJnaW5Ub3A6ICcwLjI1ZW0nLFxuICAgICAgbWFyZ2luQm90dG9tOiAnMC4yNWVtJyxcbiAgICB9LFxuXG4gICAgJyYgaDEsICYgaDIsICYgaDMsICYgaDQsICYgaDUsICYgaDYnOiB7XG4gICAgICBsaW5lSGVpZ2h0OiAxLjEsXG4gICAgICBtYXJnaW5Ub3A6ICcyLjVyZW0nLFxuICAgICAgdGV4dFdyYXA6ICdwcmV0dHknLFxuICAgIH0sXG5cbiAgICAnJiBoMSwgJiBoMic6IHtcbiAgICAgIG1hcmdpblRvcDogJzMuNXJlbScsXG4gICAgICBtYXJnaW5Cb3R0b206ICcxLjVyZW0nLFxuICAgIH0sXG5cbiAgICAnJiBoMSc6IHtcbiAgICAgIGZvbnRTaXplOiAnMS40cmVtJyxcbiAgICB9LFxuXG4gICAgJyYgaDInOiB7XG4gICAgICBmb250U2l6ZTogJzEuMnJlbScsXG4gICAgfSxcblxuICAgICcmIGgzJzoge1xuICAgICAgZm9udFNpemU6ICcxLjFyZW0nLFxuICAgIH0sXG5cbiAgICAnJiBoNCwgJiBoNSwgJiBoNic6IHtcbiAgICAgIGZvbnRTaXplOiAnMXJlbScsXG4gICAgfSxcblxuICAgICcmIGNvZGUnOiB7XG4gICAgICBiYWNrZ3JvdW5kQ29sb3I6ICd2YXIoLS1wdXJwbGUtbGlnaHQpJyxcbiAgICAgIGJvcmRlclJhZGl1czogJzAuNHJlbScsXG4gICAgICBjb2xvcjogJ3ZhcigtLWJsYWNrKScsXG4gICAgICBmb250U2l6ZTogJzAuODVyZW0nLFxuICAgICAgcGFkZGluZzogJzAuMjVlbSAwLjNlbScsXG4gICAgfSxcblxuICAgICcmIHByZSc6IHtcbiAgICAgIGJhY2tncm91bmQ6ICd2YXIoLS1ibGFjayknLFxuICAgICAgYm9yZGVyUmFkaXVzOiAnMC41cmVtJyxcbiAgICAgIGNvbG9yOiAndmFyKC0td2hpdGUpJyxcbiAgICAgIGZvbnRGYW1pbHk6IFwiJ0pldEJyYWluc01vbm8nLCBtb25vc3BhY2VcIixcbiAgICAgIG1hcmdpbjogJzEuNXJlbSAwJyxcbiAgICAgIHBhZGRpbmc6ICcwLjc1cmVtIDFyZW0nLFxuXG4gICAgICAnJiBjb2RlJzoge1xuICAgICAgICBiYWNrZ3JvdW5kOiAnbm9uZScsXG4gICAgICAgIGNvbG9yOiAnaW5oZXJpdCcsXG4gICAgICAgIGZvbnRTaXplOiAnMC44cmVtJyxcbiAgICAgICAgcGFkZGluZzogMCxcbiAgICAgIH0sXG4gICAgfSxcblxuICAgICcmIGJsb2NrcXVvdGUnOiB7XG4gICAgICBib3JkZXJMZWZ0OiAnM3B4IHNvbGlkIHZhcigtLWdyYXktMyknLFxuICAgICAgbWFyZ2luOiAnMS41cmVtIDAnLFxuICAgICAgcGFkZGluZ0xlZnQ6ICcxcmVtJyxcbiAgICB9LFxuXG4gICAgJyYgaHInOiB7XG4gICAgICBib3JkZXI6ICdub25lJyxcbiAgICAgIGJvcmRlclRvcDogJzFweCBzb2xpZCB2YXIoLS1ncmF5LTIpJyxcbiAgICAgIG1hcmdpbjogJzJyZW0gMCcsXG4gICAgfSxcblxuICAgICcmIHRhYmxlJzoge1xuICAgICAgdGFibGVMYXlvdXQ6ICdmaXhlZCcsXG4gICAgICB3aWR0aDogJzEwMCUnLFxuICAgICAgYm9yZGVyQ29sbGFwc2U6ICdjb2xsYXBzZScsXG4gICAgICBjb2xvcjogY29sb3IudGV4dCgpLFxuICAgICAgYmFja2dyb3VuZENvbG9yOiBjb2xvci5iYWNrZ3JvdW5kKCksXG4gICAgfSxcbiAgICAnJiB0YWJsZTpub3QoW2JvcmRlcj1cIjFcIl0pIHRyJzoge1xuICAgICAgYm9yZGVyVG9wOiAnMXB4IHNvbGlkICNkZmUyZTUnLFxuICAgIH0sXG4gICAgJyYgdGQsIHRoJzoge1xuICAgICAgcGFkZGluZzogJy42ZW0gMWVtJyxcbiAgICAgIHRleHRBbGlnbjogJ2NlbnRlcicsXG4gICAgfSxcbiAgICAnJiB0YWJsZTpub3QoW2JvcmRlcj1cIjFcIl0pIHRkLCB0aCc6IHtcbiAgICAgIGJvcmRlcjogJzFweCBzb2xpZCAjZGZlMmU1JyxcbiAgICB9LFxuICB9LFxuICBjaGlsZHJlbjoge1xuICAgIHBhZGRpbmc6ICcxMHB4IDE2cHgnLFxuICB9LFxuICBlZGl0b3JIb2xkZXI6IHtcbiAgICBwb3NpdGlvbjogJ3JlbGF0aXZlJyxcbiAgICBwYWRkaW5nOiAnMHB4JyxcbiAgICBvdmVyZmxvd1k6ICdhdXRvJyxcbiAgICBjb2xvcjogY29sb3IudGV4dCgpLFxuICAgIGJhY2tncm91bmRDb2xvcjogY29sb3IuYmFja2dyb3VuZCgpLFxuICB9LFxuICBkaXNhYmxlZFNjcm9sbGJhcjoge1xuICAgICcmOjotd2Via2l0LXNjcm9sbGJhcic6IHtcbiAgICAgIGRpc3BsYXk6ICdub25lJyxcbiAgICB9LFxuICAgIHNjcm9sbGJhcldpZHRoOiAnbm9uZScsXG4gICAgJy1tcy1vdmVyZmxvdy1zdHlsZSc6ICdub25lJyxcbiAgfSxcbiAgZXJyb3I6IHtcbiAgICBib3JkZXI6IGAycHggc29saWQgJHt0aGVtZS5wYWxldHRlLmVycm9yLm1haW59ICFpbXBvcnRhbnRgLFxuICB9LFxuICBub0JvcmRlcjoge1xuICAgIGJvcmRlcjogJ25vbmUnLFxuICB9LFxuICBub1BhZGRpbmc6IHtcbiAgICBwYWRkaW5nOiAwLFxuICB9LFxuICB0b29sYmFyT25Ub3A6IHtcbiAgICBtYXJnaW5Ub3A6ICc0NXB4JyxcbiAgfSxcbn0pO1xuXG5leHBvcnQgZGVmYXVsdCBzdHlsZXM7XG4iXSwibWFwcGluZ3MiOiI7Ozs7OztBQUFBLElBQUFBLFNBQUEsR0FBQUMsT0FBQTtBQUVBLElBQU1DLE1BQU0sR0FBRyxTQUFUQSxNQUFNQSxDQUFJQyxLQUFLO0VBQUEsT0FBTTtJQUN6QkMsSUFBSSxFQUFFO01BQ0pDLFFBQVEsRUFBRSxVQUFVO01BQ3BCQyxPQUFPLEVBQUUsS0FBSztNQUNkQyxNQUFNLEVBQUUsZ0JBQWdCO01BQ3hCQyxZQUFZLEVBQUUsS0FBSztNQUNuQkMsTUFBTSxFQUFFLE1BQU07TUFDZCw4QkFBOEIsRUFBRTtRQUM5QkMsU0FBUyxFQUFFLFlBQVk7UUFDdkJDLFFBQVEsRUFBRSxTQUFTO1FBQ25CQyxTQUFTLEVBQUUsT0FBTztRQUNsQjtRQUNBTixPQUFPLEVBQUU7TUFDWCxDQUFDO01BRUQsZUFBZSxFQUFFO1FBQ2ZPLFNBQVMsRUFBRTtNQUNiLENBQUM7TUFFRCxZQUFZLEVBQUU7UUFDWlAsT0FBTyxFQUFFLFFBQVE7UUFDakJRLE1BQU0sRUFBRTtNQUNWLENBQUM7TUFFRCxzQkFBc0IsRUFBRTtRQUN0QkQsU0FBUyxFQUFFLFFBQVE7UUFDbkJFLFlBQVksRUFBRTtNQUNoQixDQUFDO01BRUQsb0NBQW9DLEVBQUU7UUFDcENDLFVBQVUsRUFBRSxHQUFHO1FBQ2ZILFNBQVMsRUFBRSxRQUFRO1FBQ25CSSxRQUFRLEVBQUU7TUFDWixDQUFDO01BRUQsWUFBWSxFQUFFO1FBQ1pKLFNBQVMsRUFBRSxRQUFRO1FBQ25CRSxZQUFZLEVBQUU7TUFDaEIsQ0FBQztNQUVELE1BQU0sRUFBRTtRQUNORyxRQUFRLEVBQUU7TUFDWixDQUFDO01BRUQsTUFBTSxFQUFFO1FBQ05BLFFBQVEsRUFBRTtNQUNaLENBQUM7TUFFRCxNQUFNLEVBQUU7UUFDTkEsUUFBUSxFQUFFO01BQ1osQ0FBQztNQUVELGtCQUFr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
+//# sourceMappingURL=editorContainerStyles.js.map

package/lib/styles/editorContainerStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"editorContainerStyles.js","names":["_renderUi","require","styles","theme","root","position","padding","border","borderRadius","cursor","wordBreak","overflow","maxHeight","marginTop","margin","marginBottom","lineHeight","textWrap","fontSize","backgroundColor","color","background","fontFamily","borderLeft","paddingLeft","borderTop","tableLayout","width","borderCollapse","text","textAlign","children","editorHolder","overflowY","disabledScrollbar","display","scrollbarWidth","error","concat","palette","main","noBorder","noPadding","toolbarOnTop","_default","exports"],"sources":["../../src/styles/editorContainerStyles.js"],"sourcesContent":["import { color } from '@pie-lib/render-ui';\n\nconst styles = (theme) => ({\n  root: {\n    position: 'relative',\n    padding: '0px',\n    border: '1px solid #ccc',\n    borderRadius: '4px',\n    cursor: 'text',\n    '& [data-slate-editor=\"true\"]': {\n      wordBreak: 'break-word',\n      overflow: 'visible',\n      maxHeight: '500px',\n      // needed in order to be able to put the focus before a void element when it is the first one in the editor\n      padding: '5px',\n    },\n\n    '&:first-child': {\n      marginTop: 0,\n    },\n\n    '& ul, & ol': {\n      padding: '0 1rem',\n      margin: '1.25rem 1rem 1.25rem 0.4rem',\n    },\n\n    '& ul li p, & ol li p': {\n      marginTop: '0.25em',\n      marginBottom: '0.25em',\n    },\n\n    '& h1, & h2, & h3, & h4, & h5, & h6': {\n      lineHeight: 1.1,\n      marginTop: '2.5rem',\n      textWrap: 'pretty',\n    },\n\n    '& h1, & h2': {\n      marginTop: '3.5rem',\n      marginBottom: '1.5rem',\n    },\n\n    '& h1': {\n      fontSize: '1.4rem',\n    },\n\n    '& h2': {\n      fontSize: '1.2rem',\n    },\n\n    '& h3': {\n      fontSize: '1.1rem',\n    },\n\n    '& h4, & h5, & h6': {\n      fontSize: '1rem',\n    },\n\n    '& code': {\n      backgroundColor: 'var(--purple-light)',\n      borderRadius: '0.4rem',\n      color: 'var(--black)',\n      fontSize: '0.85rem',\n      padding: '0.25em 0.3em',\n    },\n\n    '& pre': {\n      background: 'var(--black)',\n      borderRadius: '0.5rem',\n      color: 'var(--white)',\n      fontFamily: \"'JetBrainsMono', monospace\",\n      margin: '1.5rem 0',\n      padding: '0.75rem 1rem',\n\n      '& code': {\n        background: 'none',\n        color: 'inherit',\n        fontSize: '0.8rem',\n        padding: 0,\n      },\n    },\n\n    '& blockquote': {\n      borderLeft: '3px solid var(--gray-3)',\n      margin: '1.5rem 0',\n      paddingLeft: '1rem',\n    },\n\n    '& hr': {\n      border: 'none',\n      borderTop: '1px solid var(--gray-2)',\n      margin: '2rem 0',\n    },\n\n    '& table': {\n      tableLayout: 'fixed',\n      width: '100%',\n      borderCollapse: 'collapse',\n      color: color.text(),\n      backgroundColor: color.background(),\n    },\n    '& table:not([border=\"1\"]) tr': {\n      borderTop: '1px solid #dfe2e5',\n    },\n    '& td, th': {\n      padding: '.6em 1em',\n      textAlign: 'center',\n    },\n    '& table:not([border=\"1\"]) td, th': {\n      border: '1px solid #dfe2e5',\n    },\n  },\n  children: {\n    padding: '10px 16px',\n  },\n  editorHolder: {\n    position: 'relative',\n    padding: '0px',\n    overflowY: 'auto',\n    color: color.text(),\n    backgroundColor: color.background(),\n  },\n  disabledScrollbar: {\n    '&::-webkit-scrollbar': {\n      display: 'none',\n    },\n    scrollbarWidth: 'none',\n    '-ms-overflow-style': 'none',\n  },\n  error: {\n    border: `2px solid ${theme.palette.error.main} !important`,\n  },\n  noBorder: {\n    border: 'none',\n  },\n  noPadding: {\n    padding: 0,\n  },\n  toolbarOnTop: {\n    marginTop: '45px',\n  },\n});\n\nexport default styles;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"editorContainerStyles.js","names":["_renderUi","require","styles","theme","root","position","padding","border","borderRadius","cursor","wordBreak","overflow","maxHeight","marginTop","margin","marginBottom","lineHeight","textWrap","fontSize","backgroundColor","color","background","fontFamily","borderLeft","borderTop","tableLayout","width","borderCollapse","text","textAlign","children","editorHolder","overflowY","disabledScrollbar","display","scrollbarWidth","error","concat","palette","main","noBorder","noPadding","toolbarOnTop","_default","exports"],"sources":["../../src/styles/editorContainerStyles.js"],"sourcesContent":["import { color } from '@pie-lib/render-ui';\n\nconst styles = (theme) => ({\n  root: {\n    position: 'relative',\n    padding: '0px',\n    border: '1px solid #ccc',\n    borderRadius: '4px',\n    cursor: 'text',\n    '& [data-slate-editor=\"true\"]': {\n      wordBreak: 'break-word',\n      overflow: 'visible',\n      maxHeight: '500px',\n      // needed in order to be able to put the focus before a void element when it is the first one in the editor\n      padding: '5px',\n    },\n\n    '&:first-child': {\n      marginTop: 0,\n    },\n\n    '& ul, & ol': {\n      padding: '0 1rem',\n      margin: '1.25rem 1rem 1.25rem 0.4rem',\n    },\n\n    '& ul li p, & ol li p': {\n      marginTop: '0.25em',\n      marginBottom: '0.25em',\n    },\n\n    '& h1, & h2, & h3, & h4, & h5, & h6': {\n      lineHeight: 1.1,\n      marginTop: '2.5rem',\n      textWrap: 'pretty',\n    },\n\n    '& h1, & h2': {\n      marginTop: '3.5rem',\n      marginBottom: '1.5rem',\n    },\n\n    '& h1': {\n      fontSize: '1.4rem',\n    },\n\n    '& h2': {\n      fontSize: '1.2rem',\n    },\n\n    '& h3': {\n      fontSize: '1.1rem',\n    },\n\n    '& h4, & h5, & h6': {\n      fontSize: '1rem',\n    },\n\n    '& code': {\n      backgroundColor: 'var(--purple-light)',\n      borderRadius: '0.4rem',\n      color: 'var(--black)',\n      fontSize: '0.85rem',\n      padding: '0.25em 0.3em',\n    },\n\n    '& pre': {\n      background: 'var(--black)',\n      borderRadius: '0.5rem',\n      color: 'var(--white)',\n      fontFamily: '\\'JetBrainsMono\\', monospace',\n      margin: '1.5rem 0',\n      padding: '0.75rem 1rem',\n\n      '& code': {\n        background: 'none',\n        color: 'inherit',\n        fontSize: '0.8rem',\n        padding: 0,\n      },\n    },\n\n    '& blockquote': {\n      background: '#f9f9f9',\n      borderLeft: '5px solid #ccc',\n      margin: '1.5em 10px',\n      padding: '.5em 10px',\n    },\n\n    '& hr': {\n      border: 'none',\n      borderTop: '1px solid var(--gray-2)',\n      margin: '2rem 0',\n    },\n\n    '& table': {\n      tableLayout: 'fixed',\n      width: '100%',\n      borderCollapse: 'collapse',\n      color: color.text(),\n      backgroundColor: color.background(),\n    },\n    '& table:not([border=\"1\"]) tr': {\n      borderTop: '1px solid #dfe2e5',\n    },\n    '& td, th': {\n      padding: '.6em 1em',\n      textAlign: 'center',\n    },\n    '& table:not([border=\"1\"]) td, th': {\n      border: '1px solid #dfe2e5',\n    },\n  },\n  children: {\n    padding: '10px 16px',\n  },\n  editorHolder: {\n    position: 'relative',\n    padding: '0px',\n    overflowY: 'auto',\n    color: color.text(),\n    backgroundColor: color.background(),\n  },\n  disabledScrollbar: {\n    '&::-webkit-scrollbar': {\n      display: 'none',\n    },\n    scrollbarWidth: 'none',\n    '-ms-overflow-style': 'none',\n  },\n  error: {\n    border: `2px solid ${theme.palette.error.main} !important`,\n  },\n  noBorder: {\n    border: 'none',\n  },\n  noPadding: {\n    padding: 0,\n  },\n  toolbarOnTop: {\n    marginTop: '45px',\n  },\n});\n\nexport default styles;\n"],"mappings":"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","ignoreList":[]}

package/lib/theme.js

@@ -5,4 +5,4 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.primary = void 0;
 var primary = exports.primary = '#304ffe';
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJwcmltYXJ5IiwiZXhwb3J0cyJdLCJzb3VyY2VzIjpbIi4uL3NyYy90aGVtZS5qcyJdLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgY29uc3QgcHJpbWFyeSA9ICcjMzA0ZmZlJztcbiJdLCJtYXBwaW5ncyI6Ijs7Ozs7O0FBQU8sSUFBTUEsT0FBTyxHQUFBQyxPQUFBLENBQUFELE9BQUEsR0FBRyxTQUFTIiwiaWdub3JlTGlzdCI6W119
+//# sourceMappingURL=theme.js.map

package/lib/utils/helper.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.normalizeInitialMarkup = void 0;
+var escapeHtml = function escapeHtml(str) {
+  return String(str).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;').replace(/'/g, '&#39;');
+};
+var normalizeInitialMarkup = exports.normalizeInitialMarkup = function normalizeInitialMarkup(markup) {
+  var trimmed = String(markup !== null && markup !== void 0 ? markup : '').trim();
+  if (!trimmed) return '<div></div>';
+  var looksLikeHtml = /<[^>]+>/.test(trimmed);
+  if (looksLikeHtml) return trimmed;
+  return "<div>".concat(escapeHtml(trimmed), "</div>");
+};
+//# sourceMappingURL=helper.js.map

package/lib/utils/helper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper.js","names":["escapeHtml","str","String","replace","normalizeInitialMarkup","exports","markup","trimmed","trim","looksLikeHtml","test","concat"],"sources":["../../src/utils/helper.js"],"sourcesContent":["const escapeHtml = (str) =>\n  String(str)\n    .replace(/&/g, '&amp;')\n    .replace(/</g, '&lt;')\n    .replace(/>/g, '&gt;')\n    .replace(/\"/g, '&quot;')\n    .replace(/'/g, '&#39;');\n\nexport const normalizeInitialMarkup = (markup) => {\n  const trimmed = String(markup ?? '').trim();\n  if (!trimmed) return '<div></div>';\n\n  const looksLikeHtml = /<[^>]+>/.test(trimmed);\n  if (looksLikeHtml) return trimmed;\n\n  return `<div>${escapeHtml(trimmed)}</div>`;\n};\n"],"mappings":";;;;;;AAAA,IAAMA,UAAU,GAAG,SAAbA,UAAUA,CAAIC,GAAG;EAAA,OACrBC,MAAM,CAACD,GAAG,CAAC,CACRE,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC,CACtBA,OAAO,CAAC,IAAI,EAAE,MAAM,CAAC,CACrBA,OAAO,CAAC,IAAI,EAAE,MAAM,CAAC,CACrBA,OAAO,CAAC,IAAI,EAAE,QAAQ,CAAC,CACvBA,OAAO,CAAC,IAAI,EAAE,OAAO,CAAC;AAAA;AAEpB,IAAMC,sBAAsB,GAAAC,OAAA,CAAAD,sBAAA,GAAG,SAAzBA,sBAAsBA,CAAIE,MAAM,EAAK;EAChD,IAAMC,OAAO,GAAGL,MAAM,CAACI,MAAM,aAANA,MAAM,cAANA,MAAM,GAAI,EAAE,CAAC,CAACE,IAAI,CAAC,CAAC;EAC3C,IAAI,CAACD,OAAO,EAAE,OAAO,aAAa;EAElC,IAAME,aAAa,GAAG,SAAS,CAACC,IAAI,CAACH,OAAO,CAAC;EAC7C,IAAIE,aAAa,EAAE,OAAOF,OAAO;EAEjC,eAAAI,MAAA,CAAeX,UAAU,CAACO,OAAO,CAAC;AACpC,CAAC","ignoreList":[]}

package/lib/utils/size.js

@@ -23,4 +23,4 @@ var valueToSize = exports.valueToSize = function valueToSize(v) {
     return "".concat(v, "px");
   }
 };
-//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJuYW1lcyI6WyJ2YWx1ZVRvU2l6ZSIsImV4cG9ydHMiLCJ2IiwiY2FsY1JlZ2V4IiwiZW5kc1dpdGgiLCJ1bmRlZmluZWQiLCJtYXRjaCIsInZhbHVlIiwicGFyc2VJbnQiLCJOdW1iZXIiLCJpc05hTiIsImNvbmNhdCJdLCJzb3VyY2VzIjpbIi4uLy4uL3NyYy91dGlscy9zaXplLmpzIl0sInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCBjb25zdCB2YWx1ZVRvU2l6ZSA9ICh2KSA9PiB7XG4gIGlmICghdikge1xuICAgIHJldHVybjtcbiAgfVxuXG4gIGNvbnN0IGNhbGNSZWdleCA9IC9eY2FsY1xcKCguKilcXCkkLztcblxuICBpZiAodHlwZW9mIHYgPT09ICdzdHJpbmcnKSB7XG4gICAgaWYgKHYuZW5kc1dpdGgoJyUnKSkge1xuICAgICAgcmV0dXJuIHVuZGVmaW5lZDtcbiAgICB9XG5cbiAgICBpZiAoXG4gICAgICB2LmVuZHNXaXRoKCdweCcpIHx8XG4gICAgICB2LmVuZHNXaXRoKCd2aCcpIHx8XG4gICAgICB2LmVuZHNXaXRoKCd2dycpIHx8XG4gICAgICB2LmVuZHNXaXRoKCdjaCcpIHx8XG4gICAgICB2LmVuZHNXaXRoKCdlbScpIHx8XG4gICAgICB2Lm1hdGNoKGNhbGNSZWdleClcbiAgICApIHtcbiAgICAgIHJldHVybiB2O1xuICAgIH1cblxuICAgIGNvbnN0IHZhbHVlID0gcGFyc2VJbnQodiwgMTApO1xuXG4gICAgcmV0dXJuIE51bWJlci5pc05hTih2YWx1ZSkgPyB2YWx1ZSA6IGAke3ZhbHVlfXB4YDtcbiAgfVxuXG4gIGlmICh0eXBlb2YgdiA9PT0gJ251bWJlcicpIHtcbiAgICByZXR1cm4gYCR7dn1weGA7XG4gIH1cbn07XG4iXSwibWFwcGluZ3MiOiI7Ozs7OztBQUFPLElBQU1BLFdBQVcsR0FBQUMsT0FBQSxDQUFBRCxXQUFBLEdBQUcsU0FBZEEsV0FBV0EsQ0FBSUUsQ0FBQyxFQUFLO0VBQ2hDLElBQUksQ0FBQ0EsQ0FBQyxFQUFFO0lBQ047RUFDRjtFQUVBLElBQU1DLFNBQVMsR0FBRyxnQkFBZ0I7RUFFbEMsSUFBSSxPQUFPRCxDQUFDLEtBQUssUUFBUSxFQUFFO0lBQ3pCLElBQUlBLENBQUMsQ0FBQ0UsUUFBUSxDQUFDLEdBQUcsQ0FBQyxFQUFFO01BQ25CLE9BQU9DLFNBQVM7SUFDbEI7SUFFQSxJQUNFSCxDQUFDLENBQUNFLFFBQVEsQ0FBQyxJQUFJLENBQUMsSUFDaEJGLENBQUMsQ0FBQ0UsUUFBUSxDQUFDLElBQUksQ0FBQyxJQUNoQkYsQ0FBQyxDQUFDRSxRQUFRLENBQUMsSUFBSSxDQUFDLElBQ2hCRixDQUFDLENBQUNFLFFBQVEsQ0FBQyxJQUFJLENBQUMsSUFDaEJGLENBQUMsQ0FBQ0UsUUFBUSxDQUFDLElBQUksQ0FBQyxJQUNoQkYsQ0FBQyxDQUFDSSxLQUFLLENBQUNILFNBQVMsQ0FBQyxFQUNsQjtNQUNBLE9BQU9ELENBQUM7SUFDVjtJQUVBLElBQU1LLEtBQUssR0FBR0MsUUFBUSxDQUFDTixDQUFDLEVBQUUsRUFBRSxDQUFDO0lBRTdCLE9BQU9PLE1BQU0sQ0FBQ0MsS0FBSyxDQUFDSCxLQUFLLENBQUMsR0FBR0EsS0FBSyxNQUFBSSxNQUFBLENBQU1KLEtBQUssT0FBSTtFQUNuRDtFQUVBLElBQUksT0FBT0wsQ0FBQyxLQUFLLFFBQVEsRUFBRTtJQUN6QixVQUFBUyxNQUFBLENBQVVULENBQUM7RUFDYjtBQUNGLENBQUMiLCJpZ25vcmVMaXN0IjpbXX0=
+//# sourceMappingURL=size.js.map

package/package.json

@@ -1,6 +1,9 @@
 {
   "name": "@pie-lib/editable-html-tip-tap",
-  "version": "1.2.0-next.2",
+  "publishConfig": {
+    "access": "public"
+  },
+  "version": "1.2.0-next.21",
   "description": "",
   "license": "ISC",
   "main": "lib/index.js",
@@ -13,11 +16,11 @@
     "@dnd-kit/utilities": "3.2.2",
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
-    "@pie-lib/drag": "^3.2.0-next.1",
-    "@pie-lib/math-input": "^7.2.0-next.1",
-    "@pie-lib/math-rendering": "^4.2.0-next.1",
-    "@pie-lib/math-toolbar": "^2.2.0-next.1",
-    "@pie-lib/render-ui": "^5.2.0-next.1",
+    "@pie-lib/drag": "^3.2.0-next.7",
+    "@pie-lib/math-input": "^7.2.0-next.10",
+    "@pie-lib/math-rendering": "^4.2.0-next.3",
+    "@pie-lib/math-toolbar": "^2.2.0-next.12",
+    "@pie-lib/render-ui": "^5.2.0-next.7",
     "@tiptap/core": "3.0.9",
     "@tiptap/extension-character-count": "3.0.9",
     "@tiptap/extension-color": "3.0.9",
@@ -49,16 +52,13 @@
     "to-style": "^1.3.3"
   },
   "devDependencies": {
-    "@pie-framework/mathquill": "^1.1.3",
+    "@pie-framework/mathquill": "1.2.1-beta.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0"
   },
   "peerDependencies": {
     "react": "^18.2.0"
   },
-  "publishConfig": {
-    "access": "public"
-  },
-  "gitHead": "433bcb776c2975739e7417f133d31cd996164116",
+  "gitHead": "a5d035b59963a4bd600a3e0b9e68440665ba69fd",
   "scripts": {}
 }

package/src/__tests__/EditableHtml.test.jsx

@@ -24,7 +24,9 @@ jest.mock('@tiptap/react', () => ({
 
 jest.mock('@tiptap/starter-kit', () => ({
   __esModule: true,
-  default: {},
+  default: {
+    configure: jest.fn(() => ({})),
+  },
 }));
 
 jest.mock('@tiptap/extension-text-style', () => ({
@@ -91,6 +93,9 @@ jest.mock('../extensions/responseArea', () => ({
   InlineDropdownNode: {
     configure: jest.fn(() => ({})),
   },
+  MathTemplatedNode: {
+    configure: jest.fn(() => ({})),
+  },
   ResponseAreaExtension: {
     configure: jest.fn(() => ({})),
   },
@@ -263,4 +268,39 @@ describe('EditableHtml', () => {
     const { container } = render(<EditableHtml {...defaultProps} disableImageAlignmentButtons={true} />);
     expect(container).toBeInTheDocument();
   });
+
+  it('calls editorRef callback when editor is initialized', async () => {
+    const editorRef = jest.fn();
+    render(<EditableHtml {...defaultProps} editorRef={editorRef} />);
+
+    await waitFor(() => {
+      expect(editorRef).toHaveBeenCalled();
+    });
+  });
+
+  it('calls editorRef with the editor instance', async () => {
+    const editorRef = jest.fn();
+    render(<EditableHtml {...defaultProps} editorRef={editorRef} />);
+
+    await waitFor(() => {
+      expect(editorRef).toHaveBeenCalled();
+      // Verify it was called with an object that has editor-like properties
+      const callArg = editorRef.mock.calls[0][0];
+      expect(callArg).toHaveProperty('getHTML');
+      expect(callArg).toHaveProperty('commands');
+    });
+  });
+
+  it('handles editorRef being undefined', () => {
+    const { container } = render(<EditableHtml {...defaultProps} editorRef={undefined} />);
+    expect(container).toBeInTheDocument();
+  });
+
+  it('applies flex display to StyledEditorContent', async () => {
+    const { getByTestId } = render(<EditableHtml {...defaultProps} />);
+    await waitFor(() => {
+      const editorContent = getByTestId('editor-content');
+      expect(editorContent).toBeInTheDocument();
+    });
+  });
 });

package/src/__tests__/index.test.jsx

@@ -13,7 +13,10 @@ jest.mock('@tiptap/react', () => ({
   useEditorState: jest.fn(() => ({ isFocused: false })),
 }));
 
-jest.mock('@tiptap/starter-kit', () => ({ __esModule: true, default: {} }));
+jest.mock('@tiptap/starter-kit', () => ({
+  __esModule: true,
+  default: { configure: jest.fn(() => ({})) },
+}));
 jest.mock('@tiptap/extension-text-style', () => ({ TextStyleKit: {} }));
 jest.mock('@tiptap/extension-character-count', () => ({
   CharacterCount: { configure: jest.fn(() => ({})) },

package/src/components/CharacterPicker.jsx

@@ -121,6 +121,7 @@ export function CharacterPicker({ editor, opts, onClose }) {
         <div
           ref={containerRef}
           className="insert-character-dialog"
+          data-toolbar-for={editor.instanceId}
           style={{
             visibility: position.top === 0 && position.left === 0 ? 'hidden' : 'initial',
             position: 'absolute',

package/src/components/EditableHtml.jsx

@@ -1,5 +1,7 @@
 import React, { useEffect, useMemo, useState } from 'react';
+import debounce from 'lodash-es/debounce';
 import { EditorContent, useEditor, useEditorState } from '@tiptap/react';
+import { styled } from '@mui/material/styles';
 import StarterKit from '@tiptap/starter-kit';
 import { TextStyleKit } from '@tiptap/extension-text-style';
 import { CharacterCount } from '@tiptap/extension-character-count';
@@ -7,11 +9,11 @@ import SuperScript from '@tiptap/extension-superscript';
 import SubScript from '@tiptap/extension-subscript';
 import TextAlign from '@tiptap/extension-text-align';
 import Image from '@tiptap/extension-image';
-import Placeholder from '@tiptap/extension-placeholder'
-import { styled } from '@mui/material/styles';
-import debounce from 'lodash-es/debounce';
+import Placeholder from '@tiptap/extension-placeholder';
+import { normalizeInitialMarkup } from '../utils/helper';
 
 import ExtendedTable from '../extensions/extended-table';
+import { DivNode } from '../extensions/div-node';
 import { TableRow } from '@tiptap/extension-table-row';
 import { TableCell } from '@tiptap/extension-table-cell';
 import { TableHeader } from '@tiptap/extension-table-header';
@@ -19,6 +21,7 @@ import {
   DragInTheBlankNode,
   ExplicitConstructedResponseNode,
   InlineDropdownNode,
+  MathTemplatedNode,
   ResponseAreaExtension,
 } from '../extensions/responseArea';
 import { MathNode } from '../extensions/math';
@@ -134,11 +137,21 @@ export const EditableHtml = (props) => {
   }, [props]);
 
   const extensions = [
+    TextAlign.configure({
+      types: ['heading', 'paragraph', 'div', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'td', 'th'],
+      alignments: ['left', 'right', 'center', 'justify'],
+    }),
     TextStyleKit,
     CharacterCount.configure({
       limit: props.charactersLimit || 1000000,
     }),
-    StarterKit,
+    StarterKit.configure({
+      trailingNode: {
+        node: 'paragraph',
+        notAfter: ['paragraph', 'div'],
+      },
+    }),
+    DivNode,
     Placeholder.configure({
       placeholder: props.placeholder,
       // show placeholder even when editor is focused
@@ -154,15 +167,12 @@ export const EditableHtml = (props) => {
     ExplicitConstructedResponseNode.configure(props.responseAreaProps),
     DragInTheBlankNode.configure(props.responseAreaProps),
     InlineDropdownNode.configure(props.responseAreaProps),
+    MathTemplatedNode.configure(props.responseAreaProps),
     MathNode.configure({
       toolbarOpts: toolbarOptsToUse,
     }),
     SubScript,
     SuperScript,
-    TextAlign.configure({
-      types: ['heading', 'paragraph'],
-      alignments: ['left', 'right', 'center'],
-    }),
     Image,
     ImageUploadNode.configure({
       toolbarOpts: toolbarOptsToUse,
@@ -250,7 +260,7 @@ export const EditableHtml = (props) => {
         },
       },
       editable: !props.disabled,
-      content: props.markup,
+      content: normalizeInitialMarkup(props.markup),
       onUpdate: ({ editor, transaction }) => {
         if (transaction.isDone) {
           props.onChange?.(editor.getHTML());
@@ -258,7 +268,9 @@ export const EditableHtml = (props) => {
       },
       onBlur: debounce(({ editor }) => {
         const otherToolbarOpened =
-          editor._toolbarOpened || editor.isActive('inline_dropdown') || editor.isActive('explicit_constructed_response');
+          editor._toolbarOpened ||
+          editor.isActive('inline_dropdown') ||
+          editor.isActive('explicit_constructed_response');
 
         if (otherToolbarOpened) {
           return;
@@ -276,6 +288,12 @@ export const EditableHtml = (props) => {
     [props.charactersLimit],
   );
 
+  useEffect(() => {
+    if (props.editorRef) {
+      props.editorRef(editor);
+    }
+  }, [props.editorRef, editor]);
+
   useEffect(() => {
     editor?.setEditable(!props.disabled);
   }, [props.disabled, editor]);
@@ -284,9 +302,10 @@ export const EditableHtml = (props) => {
     if (!editor) {
       return;
     }
+    const nextMarkup = normalizeInitialMarkup(props.markup);
 
-    if (props.markup !== editor.getHTML()) {
-      editor.commands.setContent(props.markup, false); // false = don’t emit update
+    if (nextMarkup !== editor.getHTML()) {
+      editor.commands.setContent(nextMarkup, false);
     }
   }, [props.markup, editor]);
 
@@ -345,26 +364,31 @@ export const EditableHtml = (props) => {
 const StyledEditorContent = styled(EditorContent, {
   shouldForwardProp: (prop) => !['showParagraph', 'separateParagraph'].includes(prop),
 })(({ showParagraph, separateParagraph }) => ({
+  display: 'flex',
   outline: 'none !important',
   '& .ProseMirror': {
+    flex: 1,
     padding: '5px',
     maxHeight: '500px',
     outline: 'none !important',
     position: 'initial',
-    '& > p': {
+
+    // reset default margins for all block paragraphs/divs in the editor
+    '& > p, & > div': {
       margin: '0',
     },
 
-    '& p.is-editor-empty:first-child::before': {
+    '& p.is-editor-empty:first-child::before, & div.is-editor-empty:first-child::before': {
       content: 'attr(data-placeholder)',
-      display: 'block',
+      float: 'left',
+      height: 0,
       color: '#9CA3AF',
       pointerEvents: 'none',
       whiteSpace: 'pre-wrap',
     },
 
     ...(showParagraph && {
-      '& > p:has(+ p)::after': {
+      '& > p:has(+ p)::after, & > div:has(+ div)::after': {
         display: 'block',
         content: '"¶"',
         fontSize: '1em',