@pie-lib/editable-html-tip-tap 2.2.0-beta.8 → 3.0.0-next.35

package/lib/components/CharacterPicker.js

@@ -1,226 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CharacterIcon = void 0;
-exports.CharacterPicker = CharacterPicker;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var _propTypes = _interopRequireDefault(require("prop-types"));
-var _get = _interopRequireDefault(require("lodash-es/get"));
-var _mathToolbar = require("@pie-lib/math-toolbar");
-var _customPopper = _interopRequireDefault(require("./characters/custom-popper"));
-var _characterUtils = require("./characters/characterUtils");
-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 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; }
-var CharacterIcon = exports.CharacterIcon = function CharacterIcon(_ref) {
-  var letter = _ref.letter;
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    style: {
-      fontSize: '24px',
-      lineHeight: '24px'
-    }
-  }, letter);
-};
-CharacterIcon.propTypes = {
-  letter: _propTypes["default"].string
-};
-function CharacterPicker(_ref2) {
-  var _opts$characters;
-  var editor = _ref2.editor,
-    opts = _ref2.opts,
-    onClose = _ref2.onClose;
-  if (!(opts !== null && opts !== void 0 && (_opts$characters = opts.characters) !== null && _opts$characters !== void 0 && _opts$characters.length)) {
-    return null;
-  }
-  var containerRef = (0, _react.useRef)(null);
-  var onCloseRef = (0, _react.useRef)(onClose);
-  var _useState = (0, _react.useState)({
-      top: 0,
-      left: 0
-    }),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    position = _useState2[0],
-    setPosition = _useState2[1];
-  var _useState3 = (0, _react.useState)(null),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    popover = _useState4[0],
-    setPopover = _useState4[1];
-  onCloseRef.current = onClose;
-  var configToUse = (0, _react.useMemo)(function () {
-    if (!opts) return _characterUtils.spanishConfig;
-    switch (true) {
-      case opts.language === 'spanish':
-        return _characterUtils.spanishConfig;
-      case opts.language === 'special':
-        return _characterUtils.specialConfig;
-      default:
-        return opts;
-    }
-  }, [opts]);
-  var layoutForCharacters = (0, _react.useMemo)(function () {
-    return configToUse.characters.reduce(function (obj, arr) {
-      if (arr.length >= obj.columns) {
-        obj.columns = arr.length;
-      }
-      return obj;
-    }, {
-      rows: configToUse.characters.length,
-      columns: 0
-    });
-  }, [configToUse]);
-  var closePopOver = function closePopOver() {
-    return setPopover(null);
-  };
-  (0, _react.useEffect)(function () {
-    return function () {
-      closePopOver();
-    };
-  }, []);
-
-  // Keep `onClose` out of the dependency array — parents often pass a new callback each
-  // render (e.g. after each keystroke), which would re-run this effect constantly. Use a
-  // ref so click-outside always calls the latest close handler.
-  (0, _react.useEffect)(function () {
-    if (!editor) return;
-    var editorDOM = editor.options.element;
-    var editorViewDom = editor.view.dom;
-
-    // Position is computed in viewport coordinates (the dialog uses position: fixed),
-    // so coordsAtPos / getBoundingClientRect values can be used directly without
-    // adding scroll offsets. The dialog is then clamped to the viewport so it does
-    // not get cut off by fixed page headers/footers.
-    var updatePosition = function updatePosition() {
-      if (!containerRef.current) return;
-      var editorRect = editorDOM.getBoundingClientRect();
-      var from = editor.state.selection.from;
-      var start = editor.view.coordsAtPos(from);
-      var dialogHeight = containerRef.current.offsetHeight;
-      var dialogWidth = containerRef.current.offsetWidth;
-
-      // prefer below the editor; flip above when there isn't room below.
-      var spaceBelow = window.innerHeight - (editorRect.bottom + 60);
-      var top = spaceBelow >= dialogHeight || editorRect.top < dialogHeight + 80 ? editorRect.bottom + 60 : editorRect.top - dialogHeight - 20;
-      var left = start.left;
-      var margin = 8;
-      top = Math.max(margin, Math.min(top, window.innerHeight - dialogHeight - margin));
-      left = Math.max(margin, Math.min(left, window.innerWidth - dialogWidth - margin));
-      setPosition({
-        top: top,
-        left: left
-      });
-    };
-    updatePosition();
-    var frame = null;
-    var scheduleUpdate = function scheduleUpdate() {
-      if (frame !== null) return;
-      frame = requestAnimationFrame(function () {
-        frame = null;
-        updatePosition();
-      });
-    };
-    window.addEventListener('scroll', scheduleUpdate, true);
-    window.addEventListener('resize', scheduleUpdate);
-    var handleClickOutside = function handleClickOutside(e) {
-      if (containerRef.current && !containerRef.current.contains(e.target) && !editorViewDom.contains(e.target)) {
-        onCloseRef.current();
-      }
-    };
-    var timeoutId = setTimeout(function () {
-      document.addEventListener('click', handleClickOutside);
-    });
-    return function () {
-      clearTimeout(timeoutId);
-      if (frame !== null) cancelAnimationFrame(frame);
-      window.removeEventListener('scroll', scheduleUpdate, true);
-      window.removeEventListener('resize', scheduleUpdate);
-      document.removeEventListener('click', handleClickOutside);
-    };
-  }, [editor]);
-  var renderPopOver = function renderPopOver(event, el) {
-    return setPopover({
-      anchorEl: event.currentTarget,
-      el: el
-    });
-  };
-  var handleChange = function handleChange(val) {
-    if (typeof val === 'string') {
-      editor.chain().focus().insertContent(val).run();
-    }
-  };
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_reactDom["default"].createPortal(/*#__PURE__*/_react["default"].createElement("div", {
-    ref: containerRef,
-    className: "insert-character-dialog",
-    "data-toolbar-for": editor.instanceId,
-    style: {
-      visibility: position.top === 0 && position.left === 0 ? 'hidden' : 'initial',
-      position: 'fixed',
-      top: "".concat(position.top, "px"),
-      left: "".concat(position.left, "px"),
-      maxWidth: '500px',
-      zIndex: 1000
-    }
-  }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_mathToolbar.PureToolbar, {
-    keyPadCharacterRef: opts.keyPadCharacterRef,
-    setKeypadInteraction: opts.setKeypadInteraction,
-    autoFocus: true,
-    noDecimal: true,
-    hideInput: true,
-    noLatexHandling: true,
-    hideDoneButtonBackground: true,
-    layoutForKeyPad: layoutForCharacters,
-    additionalKeys: configToUse.characters.reduce(function (arr, n) {
-      arr = [].concat((0, _toConsumableArray2["default"])(arr), (0, _toConsumableArray2["default"])(n.map(function (k) {
-        return _objectSpread({
-          name: (0, _get["default"])(k, 'name') || k,
-          write: (0, _get["default"])(k, 'write') || k,
-          label: (0, _get["default"])(k, 'label') || k,
-          category: 'character',
-          extraClass: 'character',
-          extraProps: _objectSpread(_objectSpread({}, k.extraProps || {}), {}, {
-            style: _objectSpread(_objectSpread({}, (k.extraProps || {}).style), {}, {
-              border: '1px solid #000'
-            })
-          })
-        }, configToUse.hasPreview ? {
-          actions: {
-            onMouseEnter: function onMouseEnter(ev) {
-              return renderPopOver(ev, k);
-            },
-            onMouseLeave: closePopOver
-          }
-        } : {});
-      })));
-      return arr;
-    }, []),
-    keypadMode: "language",
-    onChange: handleChange,
-    onDone: onClose
-  }))), document.body), popover && /*#__PURE__*/_reactDom["default"].createPortal(/*#__PURE__*/_react["default"].createElement(_customPopper["default"], {
-    onClose: closePopOver,
-    anchorEl: popover.anchorEl
-  }, /*#__PURE__*/_react["default"].createElement("div", null, popover.el.label), /*#__PURE__*/_react["default"].createElement("div", {
-    style: {
-      fontSize: 20,
-      lineHeight: '20px'
-    }
-  }, popover.el.description), /*#__PURE__*/_react["default"].createElement("div", {
-    style: {
-      fontSize: 20,
-      lineHeight: '20px'
-    }
-  }, popover.el.unicode)), document.body));
-}
-CharacterPicker.propTypes = {
-  editor: _propTypes["default"].object,
-  opts: _propTypes["default"].object,
-  onClose: _propTypes["default"].func.isRequired
-};
-//# sourceMappingURL=CharacterPicker.js.map

package/lib/components/CharacterPicker.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"CharacterPicker.js","names":["_react","_interopRequireWildcard","require","_reactDom","_interopRequireDefault","_propTypes","_get","_mathToolbar","_customPopper","_characterUtils","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","_typeof","has","get","set","_t","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ownKeys","keys","getOwnPropertySymbols","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","CharacterIcon","exports","_ref","letter","createElement","style","fontSize","lineHeight","propTypes","PropTypes","string","CharacterPicker","_ref2","_opts$characters","editor","opts","onClose","characters","containerRef","useRef","onCloseRef","_useState","useState","top","left","_useState2","_slicedToArray2","position","setPosition","_useState3","_useState4","popover","setPopover","current","configToUse","useMemo","spanishConfig","language","specialConfig","layoutForCharacters","reduce","obj","arr","columns","rows","closePopOver","useEffect","editorDOM","options","element","editorViewDom","view","dom","updatePosition","editorRect","getBoundingClientRect","from","state","selection","start","coordsAtPos","dialogHeight","offsetHeight","dialogWidth","offsetWidth","spaceBelow","window","innerHeight","bottom","margin","Math","max","min","innerWidth","frame","scheduleUpdate","requestAnimationFrame","addEventListener","handleClickOutside","contains","target","timeoutId","setTimeout","document","clearTimeout","cancelAnimationFrame","removeEventListener","renderPopOver","event","el","anchorEl","currentTarget","handleChange","val","chain","focus","insertContent","run","Fragment","ReactDOM","createPortal","ref","className","instanceId","visibility","concat","maxWidth","zIndex","PureToolbar","keyPadCharacterRef","setKeypadInteraction","autoFocus","noDecimal","hideInput","noLatexHandling","hideDoneButtonBackground","layoutForKeyPad","additionalKeys","_toConsumableArray2","map","k","name","write","label","category","extraClass","extraProps","border","hasPreview","actions","onMouseEnter","ev","onMouseLeave","keypadMode","onChange","onDone","body","description","unicode","object","func","isRequired"],"sources":["../../src/components/CharacterPicker.jsx"],"sourcesContent":["import React, { useEffect, useMemo, useRef, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport PropTypes from 'prop-types';\nimport get from 'lodash-es/get';\n\nimport { PureToolbar } from '@pie-lib/math-toolbar';\n\nimport CustomPopper from './characters/custom-popper';\nimport { spanishConfig, specialConfig } from './characters/characterUtils';\n\nconst CharacterIcon = ({ letter }) => (\n  <div\n    style={{\n      fontSize: '24px',\n      lineHeight: '24px',\n    }}\n  >\n    {letter}\n  </div>\n);\n\nCharacterIcon.propTypes = {\n  letter: PropTypes.string,\n};\n\nexport function CharacterPicker({ editor, opts, onClose }) {\n  if (!opts?.characters?.length) {\n    return null;\n  }\n\n  const containerRef = useRef(null);\n  const onCloseRef = useRef(onClose);\n  const [position, setPosition] = useState({ top: 0, left: 0 });\n  const [popover, setPopover] = useState(null);\n\n  onCloseRef.current = onClose;\n\n  const configToUse = useMemo(() => {\n    if (!opts) return spanishConfig;\n\n    switch (true) {\n      case opts.language === 'spanish':\n        return spanishConfig;\n      case opts.language === 'special':\n        return specialConfig;\n      default:\n        return opts;\n    }\n  }, [opts]);\n\n  const layoutForCharacters = useMemo(\n    () =>\n      configToUse.characters.reduce(\n        (obj, arr) => {\n          if (arr.length >= obj.columns) {\n            obj.columns = arr.length;\n          }\n\n          return obj;\n        },\n        { rows: configToUse.characters.length, columns: 0 },\n      ),\n    [configToUse],\n  );\n\n  const closePopOver = () => setPopover(null);\n\n  useEffect(\n    () => () => {\n      closePopOver();\n    },\n    [],\n  );\n\n  // Keep `onClose` out of the dependency array — parents often pass a new callback each\n  // render (e.g. after each keystroke), which would re-run this effect constantly. Use a\n  // ref so click-outside always calls the latest close handler.\n  useEffect(() => {\n    if (!editor) return;\n\n    const editorDOM = editor.options.element;\n    const editorViewDom = editor.view.dom;\n\n    // Position is computed in viewport coordinates (the dialog uses position: fixed),\n    // so coordsAtPos / getBoundingClientRect values can be used directly without\n    // adding scroll offsets. The dialog is then clamped to the viewport so it does\n    // not get cut off by fixed page headers/footers.\n    const updatePosition = () => {\n      if (!containerRef.current) return;\n\n      const editorRect = editorDOM.getBoundingClientRect();\n      const { from } = editor.state.selection;\n      const start = editor.view.coordsAtPos(from);\n\n      const dialogHeight = containerRef.current.offsetHeight;\n      const dialogWidth = containerRef.current.offsetWidth;\n\n      // prefer below the editor; flip above when there isn't room below.\n      const spaceBelow = window.innerHeight - (editorRect.bottom + 60);\n      let top =\n        spaceBelow >= dialogHeight || editorRect.top < dialogHeight + 80\n          ? editorRect.bottom + 60\n          : editorRect.top - dialogHeight - 20;\n\n      let left = start.left;\n\n      const margin = 8;\n      top = Math.max(margin, Math.min(top, window.innerHeight - dialogHeight - margin));\n      left = Math.max(margin, Math.min(left, window.innerWidth - dialogWidth - margin));\n\n      setPosition({ top, left });\n    };\n\n    updatePosition();\n\n    let frame = null;\n    const scheduleUpdate = () => {\n      if (frame !== null) return;\n      frame = requestAnimationFrame(() => {\n        frame = null;\n        updatePosition();\n      });\n    };\n\n    window.addEventListener('scroll', scheduleUpdate, true);\n    window.addEventListener('resize', scheduleUpdate);\n\n    const handleClickOutside = (e) => {\n      if (containerRef.current && !containerRef.current.contains(e.target) && !editorViewDom.contains(e.target)) {\n        onCloseRef.current();\n      }\n    };\n\n    const timeoutId = setTimeout(() => {\n      document.addEventListener('click', handleClickOutside);\n    });\n\n    return () => {\n      clearTimeout(timeoutId);\n      if (frame !== null) cancelAnimationFrame(frame);\n      window.removeEventListener('scroll', scheduleUpdate, true);\n      window.removeEventListener('resize', scheduleUpdate);\n      document.removeEventListener('click', handleClickOutside);\n    };\n  }, [editor]);\n\n  const renderPopOver = (event, el) => setPopover({ anchorEl: event.currentTarget, el });\n\n  const handleChange = (val) => {\n    if (typeof val === 'string') {\n      editor.chain().focus().insertContent(val).run();\n    }\n  };\n\n  return (\n    <>\n      {ReactDOM.createPortal(\n        <div\n          ref={containerRef}\n          className=\"insert-character-dialog\"\n          data-toolbar-for={editor.instanceId}\n          style={{\n            visibility: position.top === 0 && position.left === 0 ? 'hidden' : 'initial',\n            position: 'fixed',\n            top: `${position.top}px`,\n            left: `${position.left}px`,\n            maxWidth: '500px',\n            zIndex: 1000,\n          }}\n        >\n          <div>\n            <PureToolbar\n              keyPadCharacterRef={opts.keyPadCharacterRef}\n              setKeypadInteraction={opts.setKeypadInteraction}\n              autoFocus\n              noDecimal\n              hideInput\n              noLatexHandling\n              hideDoneButtonBackground\n              layoutForKeyPad={layoutForCharacters}\n              additionalKeys={configToUse.characters.reduce((arr, n) => {\n                arr = [\n                  ...arr,\n                  ...n.map((k) => ({\n                    name: get(k, 'name') || k,\n                    write: get(k, 'write') || k,\n                    label: get(k, 'label') || k,\n                    category: 'character',\n                    extraClass: 'character',\n                    extraProps: {\n                      ...(k.extraProps || {}),\n                      style: {\n                        ...(k.extraProps || {}).style,\n                        border: '1px solid #000',\n                      },\n                    },\n                    ...(configToUse.hasPreview\n                      ? {\n                          actions: {\n                            onMouseEnter: (ev) => renderPopOver(ev, k),\n                            onMouseLeave: closePopOver,\n                          },\n                        }\n                      : {}),\n                  })),\n                ];\n\n                return arr;\n              }, [])}\n              keypadMode=\"language\"\n              onChange={handleChange}\n              onDone={onClose}\n            />\n          </div>\n        </div>,\n        document.body,\n      )}\n      {popover &&\n        ReactDOM.createPortal(\n          <CustomPopper onClose={closePopOver} anchorEl={popover.anchorEl}>\n            <div>{popover.el.label}</div>\n            <div style={{ fontSize: 20, lineHeight: '20px' }}>{popover.el.description}</div>\n            <div style={{ fontSize: 20, lineHeight: '20px' }}>{popover.el.unicode}</div>\n          </CustomPopper>,\n          document.body,\n        )}\n    </>\n  );\n}\n\nCharacterPicker.propTypes = {\n  editor: PropTypes.object,\n  opts: PropTypes.object,\n  onClose: PropTypes.func.isRequired,\n};\n\nexport { CharacterIcon };\n"],"mappings":";;;;;;;;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,UAAA,GAAAD,sBAAA,CAAAF,OAAA;AACA,IAAAI,IAAA,GAAAF,sBAAA,CAAAF,OAAA;AAEA,IAAAK,YAAA,GAAAL,OAAA;AAEA,IAAAM,aAAA,GAAAJ,sBAAA,CAAAF,OAAA;AACA,IAAAO,eAAA,GAAAP,OAAA;AAA2E,SAAAD,wBAAAS,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAX,uBAAA,YAAAA,wBAAAS,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,mBAAAT,CAAA,iBAAAA,CAAA,gBAAAU,OAAA,CAAAV,CAAA,0BAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,cAAAM,EAAA,IAAAd,CAAA,gBAAAc,EAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,EAAA,OAAAP,CAAA,IAAAD,CAAA,GAAAW,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAnB,CAAA,EAAAc,EAAA,OAAAP,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAM,EAAA,EAAAP,CAAA,IAAAC,CAAA,CAAAM,EAAA,IAAAd,CAAA,CAAAc,EAAA,WAAAN,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAAA,SAAAmB,QAAApB,CAAA,EAAAG,CAAA,QAAAF,CAAA,GAAAgB,MAAA,CAAAI,IAAA,CAAArB,CAAA,OAAAiB,MAAA,CAAAK,qBAAA,QAAAhB,CAAA,GAAAW,MAAA,CAAAK,qBAAA,CAAAtB,CAAA,GAAAG,CAAA,KAAAG,CAAA,GAAAA,CAAA,CAAAiB,MAAA,WAAApB,CAAA,WAAAc,MAAA,CAAAE,wBAAA,CAAAnB,CAAA,EAAAG,CAAA,EAAAqB,UAAA,OAAAvB,CAAA,CAAAwB,IAAA,CAAAC,KAAA,CAAAzB,CAAA,EAAAK,CAAA,YAAAL,CAAA;AAAA,SAAA0B,cAAA3B,CAAA,aAAAG,CAAA,MAAAA,CAAA,GAAAyB,SAAA,CAAAC,MAAA,EAAA1B,CAAA,UAAAF,CAAA,WAAA2B,SAAA,CAAAzB,CAAA,IAAAyB,SAAA,CAAAzB,CAAA,QAAAA,CAAA,OAAAiB,OAAA,CAAAH,MAAA,CAAAhB,CAAA,OAAA6B,OAAA,WAAA3B,CAAA,QAAA4B,gBAAA,aAAA/B,CAAA,EAAAG,CAAA,EAAAF,CAAA,CAAAE,CAAA,SAAAc,MAAA,CAAAe,yBAAA,GAAAf,MAAA,CAAAgB,gBAAA,CAAAjC,CAAA,EAAAiB,MAAA,CAAAe,yBAAA,CAAA/B,CAAA,KAAAmB,OAAA,CAAAH,MAAA,CAAAhB,CAAA,GAAA6B,OAAA,WAAA3B,CAAA,IAAAc,MAAA,CAAAC,cAAA,CAAAlB,CAAA,EAAAG,CAAA,EAAAc,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAE,CAAA,iBAAAH,CAAA;AAE3E,IAAMkC,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG,SAAhBA,aAAaA,CAAAE,IAAA;EAAA,IAAMC,MAAM,GAAAD,IAAA,CAANC,MAAM;EAAA,oBAC7B/C,MAAA,YAAAgD,aAAA;IACEC,KAAK,EAAE;MACLC,QAAQ,EAAE,MAAM;MAChBC,UAAU,EAAE;IACd;EAAE,GAEDJ,MACE,CAAC;AAAA,CACP;AAEDH,aAAa,CAACQ,SAAS,GAAG;EACxBL,MAAM,EAAEM,qBAAS,CAACC;AACpB,CAAC;AAEM,SAASC,eAAeA,CAAAC,KAAA,EAA4B;EAAA,IAAAC,gBAAA;EAAA,IAAzBC,MAAM,GAAAF,KAAA,CAANE,MAAM;IAAEC,IAAI,GAAAH,KAAA,CAAJG,IAAI;IAAEC,OAAO,GAAAJ,KAAA,CAAPI,OAAO;EACrD,IAAI,EAACD,IAAI,aAAJA,IAAI,gBAAAF,gBAAA,GAAJE,IAAI,CAAEE,UAAU,cAAAJ,gBAAA,eAAhBA,gBAAA,CAAkBlB,MAAM,GAAE;IAC7B,OAAO,IAAI;EACb;EAEA,IAAMuB,YAAY,GAAG,IAAAC,aAAM,EAAC,IAAI,CAAC;EACjC,IAAMC,UAAU,GAAG,IAAAD,aAAM,EAACH,OAAO,CAAC;EAClC,IAAAK,SAAA,GAAgC,IAAAC,eAAQ,EAAC;MAAEC,GAAG,EAAE,CAAC;MAAEC,IAAI,EAAE;IAAE,CAAC,CAAC;IAAAC,UAAA,OAAAC,eAAA,aAAAL,SAAA;IAAtDM,QAAQ,GAAAF,UAAA;IAAEG,WAAW,GAAAH,UAAA;EAC5B,IAAAI,UAAA,GAA8B,IAAAP,eAAQ,EAAC,IAAI,CAAC;IAAAQ,UAAA,OAAAJ,eAAA,aAAAG,UAAA;IAArCE,OAAO,GAAAD,UAAA;IAAEE,UAAU,GAAAF,UAAA;EAE1BV,UAAU,CAACa,OAAO,GAAGjB,OAAO;EAE5B,IAAMkB,WAAW,GAAG,IAAAC,cAAO,EAAC,YAAM;IAChC,IAAI,CAACpB,IAAI,EAAE,OAAOqB,6BAAa;IAE/B,QAAQ,IAAI;MACV,KAAKrB,IAAI,CAACsB,QAAQ,KAAK,SAAS;QAC9B,OAAOD,6BAAa;MACtB,KAAKrB,IAAI,CAACsB,QAAQ,KAAK,SAAS;QAC9B,OAAOC,6BAAa;MACtB;QACE,OAAOvB,IAAI;IACf;EACF,CAAC,EAAE,CAACA,IAAI,CAAC,CAAC;EAEV,IAAMwB,mBAAmB,GAAG,IAAAJ,cAAO,EACjC;IAAA,OACED,WAAW,CAACjB,UAAU,CAACuB,MAAM,CAC3B,UAACC,GAAG,EAAEC,GAAG,EAAK;MACZ,IAAIA,GAAG,CAAC/C,MAAM,IAAI8C,GAAG,CAACE,OAAO,EAAE;QAC7BF,GAAG,CAACE,OAAO,GAAGD,GAAG,CAAC/C,MAAM;MAC1B;MAEA,OAAO8C,GAAG;IACZ,CAAC,EACD;MAAEG,IAAI,EAAEV,WAAW,CAACjB,UAAU,CAACtB,MAAM;MAAEgD,OAAO,EAAE;IAAE,CACpD,CAAC;EAAA,GACH,CAACT,WAAW,CACd,CAAC;EAED,IAAMW,YAAY,GAAG,SAAfA,YAAYA,CAAA;IAAA,OAASb,UAAU,CAAC,IAAI,CAAC;EAAA;EAE3C,IAAAc,gBAAS,EACP;IAAA,OAAM,YAAM;MACVD,YAAY,CAAC,CAAC;IAChB,CAAC;EAAA,GACD,EACF,CAAC;;EAED;EACA;EACA;EACA,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAI,CAAChC,MAAM,EAAE;IAEb,IAAMiC,SAAS,GAAGjC,MAAM,CAACkC,OAAO,CAACC,OAAO;IACxC,IAAMC,aAAa,GAAGpC,MAAM,CAACqC,IAAI,CAACC,GAAG;;IAErC;IACA;IACA;IACA;IACA,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,CAAA,EAAS;MAC3B,IAAI,CAACnC,YAAY,CAACe,OAAO,EAAE;MAE3B,IAAMqB,UAAU,GAAGP,SAAS,CAACQ,qBAAqB,CAAC,CAAC;MACpD,IAAQC,IAAI,GAAK1C,MAAM,CAAC2C,KAAK,CAACC,SAAS,CAA/BF,IAAI;MACZ,IAAMG,KAAK,GAAG7C,MAAM,CAACqC,IAAI,CAACS,WAAW,CAACJ,IAAI,CAAC;MAE3C,IAAMK,YAAY,GAAG3C,YAAY,CAACe,OAAO,CAAC6B,YAAY;MACtD,IAAMC,WAAW,GAAG7C,YAAY,CAACe,OAAO,CAAC+B,WAAW;;MAEpD;MACA,IAAMC,UAAU,GAAGC,MAAM,CAACC,WAAW,IAAIb,UAAU,CAACc,MAAM,GAAG,EAAE,CAAC;MAChE,IAAI7C,GAAG,GACL0C,UAAU,IAAIJ,YAAY,IAAIP,UAAU,CAAC/B,GAAG,GAAGsC,YAAY,GAAG,EAAE,GAC5DP,UAAU,CAACc,MAAM,GAAG,EAAE,GACtBd,UAAU,CAAC/B,GAAG,GAAGsC,YAAY,GAAG,EAAE;MAExC,IAAIrC,IAAI,GAAGmC,KAAK,CAACnC,IAAI;MAErB,IAAM6C,MAAM,GAAG,CAAC;MAChB9C,GAAG,GAAG+C,IAAI,CAACC,GAAG,CAACF,MAAM,EAAEC,IAAI,CAACE,GAAG,CAACjD,GAAG,EAAE2C,MAAM,CAACC,WAAW,GAAGN,YAAY,GAAGQ,MAAM,CAAC,CAAC;MACjF7C,IAAI,GAAG8C,IAAI,CAACC,GAAG,CAACF,MAAM,EAAEC,IAAI,CAACE,GAAG,CAAChD,IAAI,EAAE0C,MAAM,CAACO,UAAU,GAAGV,WAAW,GAAGM,MAAM,CAAC,CAAC;MAEjFzC,WAAW,CAAC;QAAEL,GAAG,EAAHA,GAAG;QAAEC,IAAI,EAAJA;MAAK,CAAC,CAAC;IAC5B,CAAC;IAED6B,cAAc,CAAC,CAAC;IAEhB,IAAIqB,KAAK,GAAG,IAAI;IAChB,IAAMC,cAAc,GAAG,SAAjBA,cAAcA,CAAA,EAAS;MAC3B,IAAID,KAAK,KAAK,IAAI,EAAE;MACpBA,KAAK,GAAGE,qBAAqB,CAAC,YAAM;QAClCF,KAAK,GAAG,IAAI;QACZrB,cAAc,CAAC,CAAC;MAClB,CAAC,CAAC;IACJ,CAAC;IAEDa,MAAM,CAACW,gBAAgB,CAAC,QAAQ,EAAEF,cAAc,EAAE,IAAI,CAAC;IACvDT,MAAM,CAACW,gBAAgB,CAAC,QAAQ,EAAEF,cAAc,CAAC;IAEjD,IAAMG,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAIhH,CAAC,EAAK;MAChC,IAAIoD,YAAY,CAACe,OAAO,IAAI,CAACf,YAAY,CAACe,OAAO,CAAC8C,QAAQ,CAACjH,CAAC,CAACkH,MAAM,CAAC,IAAI,CAAC9B,aAAa,CAAC6B,QAAQ,CAACjH,CAAC,CAACkH,MAAM,CAAC,EAAE;QACzG5D,UAAU,CAACa,OAAO,CAAC,CAAC;MACtB;IACF,CAAC;IAED,IAAMgD,SAAS,GAAGC,UAAU,CAAC,YAAM;MACjCC,QAAQ,CAACN,gBAAgB,CAAC,OAAO,EAAEC,kBAAkB,CAAC;IACxD,CAAC,CAAC;IAEF,OAAO,YAAM;MACXM,YAAY,CAACH,SAAS,CAAC;MACvB,IAAIP,KAAK,KAAK,IAAI,EAAEW,oBAAoB,CAACX,KAAK,CAAC;MAC/CR,MAAM,CAACoB,mBAAmB,CAAC,QAAQ,EAAEX,cAAc,EAAE,IAAI,CAAC;MAC1DT,MAAM,CAACoB,mBAAmB,CAAC,QAAQ,EAAEX,cAAc,CAAC;MACpDQ,QAAQ,CAACG,mBAAmB,CAAC,OAAO,EAAER,kBAAkB,CAAC;IAC3D,CAAC;EACH,CAAC,EAAE,CAAChE,MAAM,CAAC,CAAC;EAEZ,IAAMyE,aAAa,GAAG,SAAhBA,aAAaA,CAAIC,KAAK,EAAEC,EAAE;IAAA,OAAKzD,UAAU,CAAC;MAAE0D,QAAQ,EAAEF,KAAK,CAACG,aAAa;MAAEF,EAAE,EAAFA;IAAG,CAAC,CAAC;EAAA;EAEtF,IAAMG,YAAY,GAAG,SAAfA,YAAYA,CAAIC,GAAG,EAAK;IAC5B,IAAI,OAAOA,GAAG,KAAK,QAAQ,EAAE;MAC3B/E,MAAM,CAACgF,KAAK,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC,CAACC,aAAa,CAACH,GAAG,CAAC,CAACI,GAAG,CAAC,CAAC;IACjD;EACF,CAAC;EAED,oBACE7I,MAAA,YAAAgD,aAAA,CAAAhD,MAAA,YAAA8I,QAAA,qBACGC,oBAAQ,CAACC,YAAY,cACpBhJ,MAAA,YAAAgD,aAAA;IACEiG,GAAG,EAAEnF,YAAa;IAClBoF,SAAS,EAAC,yBAAyB;IACnC,oBAAkBxF,MAAM,CAACyF,UAAW;IACpClG,KAAK,EAAE;MACLmG,UAAU,EAAE7E,QAAQ,CAACJ,GAAG,KAAK,CAAC,IAAII,QAAQ,CAACH,IAAI,KAAK,CAAC,GAAG,QAAQ,GAAG,SAAS;MAC5EG,QAAQ,EAAE,OAAO;MACjBJ,GAAG,KAAAkF,MAAA,CAAK9E,QAAQ,CAACJ,GAAG,OAAI;MACxBC,IAAI,KAAAiF,MAAA,CAAK9E,QAAQ,CAACH,IAAI,OAAI;MAC1BkF,QAAQ,EAAE,OAAO;MACjBC,MAAM,EAAE;IACV;EAAE,gBAEFvJ,MAAA,YAAAgD,aAAA,2BACEhD,MAAA,YAAAgD,aAAA,CAACzC,YAAA,CAAAiJ,WAAW;IACVC,kBAAkB,EAAE9F,IAAI,CAAC8F,kBAAmB;IAC5CC,oBAAoB,EAAE/F,IAAI,CAAC+F,oBAAqB;IAChDC,SAAS;IACTC,SAAS;IACTC,SAAS;IACTC,eAAe;IACfC,wBAAwB;IACxBC,eAAe,EAAE7E,mBAAoB;IACrC8E,cAAc,EAAEnF,WAAW,CAACjB,UAAU,CAACuB,MAAM,CAAC,UAACE,GAAG,EAAExE,CAAC,EAAK;MACxDwE,GAAG,MAAA+D,MAAA,KAAAa,mBAAA,aACE5E,GAAG,OAAA4E,mBAAA,aACHpJ,CAAC,CAACqJ,GAAG,CAAC,UAACC,CAAC;QAAA,OAAA/H,aAAA;UACTgI,IAAI,EAAE,IAAA/I,eAAG,EAAC8I,CAAC,EAAE,MAAM,CAAC,IAAIA,CAAC;UACzBE,KAAK,EAAE,IAAAhJ,eAAG,EAAC8I,CAAC,EAAE,OAAO,CAAC,IAAIA,CAAC;UAC3BG,KAAK,EAAE,IAAAjJ,eAAG,EAAC8I,CAAC,EAAE,OAAO,CAAC,IAAIA,CAAC;UAC3BI,QAAQ,EAAE,WAAW;UACrBC,UAAU,EAAE,WAAW;UACvBC,UAAU,EAAArI,aAAA,CAAAA,aAAA,KACJ+H,CAAC,CAACM,UAAU,IAAI,CAAC,CAAC;YACtBzH,KAAK,EAAAZ,aAAA,CAAAA,aAAA,KACA,CAAC+H,CAAC,CAACM,UAAU,IAAI,CAAC,CAAC,EAAEzH,KAAK;cAC7B0H,MAAM,EAAE;YAAgB;UACzB;QACF,GACG7F,WAAW,CAAC8F,UAAU,GACtB;UACEC,OAAO,EAAE;YACPC,YAAY,EAAE,SAAdA,YAAYA,CAAGC,EAAE;cAAA,OAAK5C,aAAa,CAAC4C,EAAE,EAAEX,CAAC,CAAC;YAAA;YAC1CY,YAAY,EAAEvF;UAChB;QACF,CAAC,GACD,CAAC,CAAC;MAAA,CACN,CAAC,EACJ;MAED,OAAOH,GAAG;IACZ,CAAC,EAAE,EAAE,CAAE;IACP2F,UAAU,EAAC,UAAU;IACrBC,QAAQ,EAAE1C,YAAa;IACvB2C,MAAM,EAAEvH;EAAQ,CACjB,CACE,CACF,CAAC,EACNmE,QAAQ,CAACqD,IACX,CAAC,EACAzG,OAAO,iBACNoE,oBAAQ,CAACC,YAAY,cACnBhJ,MAAA,YAAAgD,aAAA,CAACxC,aAAA,WAAY;IAACoD,OAAO,EAAE6B,YAAa;IAAC6C,QAAQ,EAAE3D,OAAO,CAAC2D;EAAS,gBAC9DtI,MAAA,YAAAgD,aAAA,cAAM2B,OAAO,CAAC0D,EAAE,CAACkC,KAAW,CAAC,eAC7BvK,MAAA,YAAAgD,aAAA;IAAKC,KAAK,EAAE;MAAEC,QAAQ,EAAE,EAAE;MAAEC,UAAU,EAAE;IAAO;EAAE,GAAEwB,OAAO,CAAC0D,EAAE,CAACgD,WAAiB,CAAC,eAChFrL,MAAA,YAAAgD,aAAA;IAAKC,KAAK,EAAE;MAAEC,QAAQ,EAAE,EAAE;MAAEC,UAAU,EAAE;IAAO;EAAE,GAAEwB,OAAO,CAAC0D,EAAE,CAACiD,OAAa,CAC/D,CAAC,EACfvD,QAAQ,CAACqD,IACX,CACF,CAAC;AAEP;AAEA7H,eAAe,CAACH,SAAS,GAAG;EAC1BM,MAAM,EAAEL,qBAAS,CAACkI,MAAM;EACxB5H,IAAI,EAAEN,qBAAS,CAACkI,MAAM;EACtB3H,OAAO,EAAEP,qBAAS,CAACmI,IAAI,CAACC;AAC1B,CAAC","ignoreList":[]}

package/lib/components/EditableHtml.js

@@ -1,388 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.EditableHtml = void 0;
-var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
-var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _debounce = _interopRequireDefault(require("lodash-es/debounce"));
-var _react2 = require("@tiptap/react");
-var _styles = require("@mui/material/styles");
-var _starterKit = _interopRequireDefault(require("@tiptap/starter-kit"));
-var _extensionTextStyle = require("@tiptap/extension-text-style");
-var _extensionCharacterCount = require("@tiptap/extension-character-count");
-var _extensionSuperscript = _interopRequireDefault(require("@tiptap/extension-superscript"));
-var _extensionSubscript = _interopRequireDefault(require("@tiptap/extension-subscript"));
-var _extensionTextAlign = _interopRequireDefault(require("@tiptap/extension-text-align"));
-var _extensionImage = _interopRequireDefault(require("@tiptap/extension-image"));
-var _extensionPlaceholder = _interopRequireDefault(require("@tiptap/extension-placeholder"));
-var _helper = require("../utils/helper");
-var _extendedTable = _interopRequireDefault(require("../extensions/extended-table"));
-var _extendedTableCell = require("../extensions/extended-table-cell");
-var _divNode = require("../extensions/div-node");
-var _ensureEmptyRootDiv = require("../extensions/ensure-empty-root-div");
-var _ensureListItemContentIsDiv = require("../extensions/ensure-list-item-content-is-div");
-var _extensionTableRow = require("@tiptap/extension-table-row");
-var _responseArea = require("../extensions/responseArea");
-var _math = require("../extensions/math");
-var _image = require("../extensions/image");
-var _media = require("../extensions/media");
-var _css = require("../extensions/css");
-var _extendedListItem = require("../extensions/extended-list-item");
-var _headingParagraph = require("../extensions/heading-paragraph");
-var _TiptapContainer = _interopRequireDefault(require("./TiptapContainer"));
-var _size = require("../utils/size");
-var _extensions = require("../extensions");
-var _excluded = ["customPlugins"];
-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 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; }
-var defaultToolbarOpts = {
-  position: 'bottom',
-  alignment: 'left',
-  alwaysVisible: false,
-  showDone: true,
-  doneOn: 'blur'
-};
-var defaultResponseAreaProps = {
-  options: {},
-  respAreaToolbar: function respAreaToolbar() {},
-  onHandleAreaChange: function onHandleAreaChange() {}
-};
-var DEFAULT_ACTIVE_PLUGINS = ['bold', 'italic', 'underline', 'strikethrough', 'code', 'bulleted-list', 'numbered-list', 'image', 'math', 'languageCharacters', 'text-align', 'table', 'video', 'audio', 'responseArea', 'superscript', 'subscript', 'css', 'h3', 'undo', 'redo'];
-var cssVariables = {
-  '--white': '#fff',
-  '--black': '#2e2b29',
-  '--black-contrast': '#110f0e',
-  '--gray-1': 'rgba(61, 37, 20, .05)',
-  '--gray-2': 'rgba(61, 37, 20, .08)',
-  '--gray-3': 'rgba(61, 37, 20, .12)',
-  '--gray-4': 'rgba(53, 38, 28, .3)',
-  '--gray-5': 'rgba(28, 25, 23, .6)',
-  '--green': '#22c55e',
-  '--purple': '#6a00f5',
-  '--purple-contrast': '#5800cc',
-  '--purple-light': 'rgba(88, 5, 255, .05)',
-  '--yellow-contrast': '#facc15',
-  '--yellow': 'rgba(250, 204, 21, .4)',
-  '--yellow-light': '#fffae5',
-  '--red': '#ff5c33',
-  '--red-light': '#ffebe5',
-  '--shadow': "0px 12px 33px 0px rgba(0, 0, 0, .06),\n               0px 3.618px 9.949px 0px rgba(0, 0, 0, .04)"
-};
-var EditableHtml = exports.EditableHtml = function EditableHtml(props) {
-  var _props$pluginProps;
-  var _ref = props.pluginProps || {},
-    showParagraphs = _ref.showParagraphs,
-    separateParagraphs = _ref.separateParagraphs;
-  var _useState = (0, _react.useState)([]),
-    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-    pendingImages = _useState2[0],
-    setPendingImages = _useState2[1];
-  var _useState3 = (0, _react.useState)(false),
-    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
-    scheduled = _useState4[0],
-    setScheduled = _useState4[1];
-  var toolbarOpts = props.toolbarOpts;
-  var removePendingImage = (0, _react.useCallback)(function (imagePos) {
-    setPendingImages(function (prev) {
-      var next = prev.filter(function (img) {
-        return img.pos !== imagePos;
-      });
-      if (next.length === 0) {
-        setScheduled(false);
-      }
-      return next;
-    });
-  }, [setPendingImages]);
-  var toolbarOptsToUse = _objectSpread(_objectSpread({}, defaultToolbarOpts), toolbarOpts);
-  var commitEditorContent = (0, _react.useCallback)(function (editor) {
-    var html = editor.getHTML();
-    if (props.markup !== html) {
-      var _props$onChange;
-      (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, html);
-    }
-    if (toolbarOptsToUse.doneOn === 'blur') {
-      var _props$onDone;
-      (_props$onDone = props.onDone) === null || _props$onDone === void 0 || _props$onDone.call(props, html);
-    }
-  }, [props.markup, props.onChange, props.onDone, toolbarOptsToUse.doneOn]);
-  var responseAreaPropsToUse = (0, _react.useMemo)(function () {
-    return _objectSpread(_objectSpread(_objectSpread({}, defaultResponseAreaProps), props.responseAreaProps), {}, {
-      onInlineDropdownToolbarClose: commitEditorContent
-    });
-  }, [props.responseAreaProps, commitEditorContent]);
-  var activePluginsToUse = (0, _react.useMemo)(function () {
-    var _ref3;
-    var _ref2 = props.pluginProps || {},
-      customPlugins = _ref2.customPlugins,
-      otherPluginProps = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
-    customPlugins = customPlugins || [];
-    var filteredActivePlugins = (_ref3 = props.activePlugins || DEFAULT_ACTIVE_PLUGINS) === null || _ref3 === void 0 ? void 0 : _ref3.filter(function (pluginName) {
-      var nameToUse = _extensions.PLUGINS_MAP[pluginName] || pluginName;
-      var pluginInfo = otherPluginProps[nameToUse] || {};
-      return !pluginInfo || !pluginInfo.disabled;
-    });
-    return (0, _extensions.buildExtensions)(filteredActivePlugins, customPlugins, {
-      math: {},
-      textAlign: props.textAlign,
-      html: {},
-      extraCSSRules: props.extraCSSRules || {},
-      image: _objectSpread({}, props.imageSupport),
-      toolbar: {},
-      table: {},
-      responseArea: {
-        type: responseAreaPropsToUse.type
-      },
-      languageCharacters: props.languageCharactersProps,
-      keyPadCharacterRef: {},
-      setKeypadInteraction: {},
-      media: {}
-    });
-  }, [props, responseAreaPropsToUse.type]);
-  var extensions = [_extensionTextAlign["default"].configure({
-    types: ['heading', 'paragraph', 'div', 'headingParagraph', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'td', 'th'],
-    alignments: ['left', 'right', 'center', 'justify']
-  }), _extensionTextStyle.TextStyleKit, _extensionCharacterCount.CharacterCount.configure({
-    limit: props.charactersLimit || 1000000
-  }), _starterKit["default"].configure({
-    trailingNode: {
-      node: 'paragraph',
-      notAfter: ['paragraph', 'div']
-    }
-  }), _extendedListItem.ExtendedListItem, _divNode.DivNode, _headingParagraph.HeadingParagraph, _ensureEmptyRootDiv.EnsureEmptyRootIsDiv, _ensureListItemContentIsDiv.EnsureListItemContentIsDiv, _extensionPlaceholder["default"].configure({
-    placeholder: props.placeholder,
-    // show placeholder even when editor is focused
-    showOnlyWhenEditable: true,
-    showOnlyCurrent: false,
-    // show on all empty nodes, not only the current one
-    includeChildren: true
-  }), _extendedTable["default"], _extensionTableRow.TableRow, _extendedTableCell.ExtendedTableHeader, _extendedTableCell.ExtendedTableCell, _responseArea.ResponseAreaExtension.configure(responseAreaPropsToUse), _responseArea.ExplicitConstructedResponseNode.configure(responseAreaPropsToUse), _responseArea.DragInTheBlankNode.configure(responseAreaPropsToUse), _responseArea.InlineDropdownNode.configure(responseAreaPropsToUse), _responseArea.MathTemplatedNode.configure(responseAreaPropsToUse), _math.MathNode.configure({
-    toolbarOpts: toolbarOptsToUse,
-    math: ((_props$pluginProps = props.pluginProps) === null || _props$pluginProps === void 0 ? void 0 : _props$pluginProps.math) || {}
-  }), _extensionSubscript["default"], _extensionSuperscript["default"], _extensionImage["default"], _image.ImageUploadNode.configure({
-    toolbarOpts: toolbarOptsToUse,
-    imageHandling: {
-      disableImageAlignmentButtons: props.disableImageAlignmentButtons,
-      onDone: function onDone(editor) {
-        var _props$onDone2;
-        return (_props$onDone2 = props.onDone) === null || _props$onDone2 === void 0 ? void 0 : _props$onDone2.call(props, editor.getHTML());
-      },
-      onDelete: props.imageSupport && props.imageSupport["delete"] && function (node) {
-        var src = node.attrs.src;
-        props.imageSupport["delete"](src, function (e) {
-          removePendingImage(node.pos);
-        });
-      },
-      insertImageRequested: props.imageSupport && function (editor, imageInfo, getHandler) {
-        var _imageInfo = (0, _slicedToArray2["default"])(imageInfo, 2),
-          addedImage = _imageInfo[0],
-          pos = _imageInfo[1];
-        var onFinish = function onFinish(result) {
-          var _cb;
-          var cb;
-          if (scheduled && result) {
-            // finish editing only on success
-            cb = props.onChange;
-          }
-          removePendingImage(pos);
-          (_cb = cb) === null || _cb === void 0 || _cb(editor.getHTML());
-        };
-        var callback = function callback() {
-          /**
-           * The handler is the object through which the outer context
-           * communicates file upload events like: fileChosen, cancel, progress
-           */
-          var handler = getHandler(onFinish);
-
-          // If the user closes the file picker without choosing a file, the window regains
-          // focus while _insertingImage is still true — drop the stale pending entry.
-          var focusHandler = (0, _debounce["default"])(function () {
-            var detach = function detach() {
-              return window.removeEventListener('focus', focusHandler);
-            };
-            if (!editor._insertingImage) {
-              detach();
-              return;
-            }
-            removePendingImage(pos);
-            editor._insertingImage = false;
-            detach();
-          }, 500);
-          window.addEventListener('focus', focusHandler);
-          props.imageSupport.add(handler);
-        };
-        editor._insertingImage = true;
-        setPendingImages(function (prev) {
-          return [].concat((0, _toConsumableArray2["default"])(prev), [addedImage]);
-        });
-        callback();
-      },
-      maxImageWidth: props.maxImageWidth,
-      maxImageHeight: props.maxImageHeight
-    },
-    limit: 3
-  }), _media.Media.configure({
-    uploadSoundSupport: props.uploadSoundSupport
-  }), _css.CSSMark.configure({
-    extraCSSRules: props.extraCSSRules
-  })];
-  var editor = (0, _react2.useEditor)({
-    extensions: extensions,
-    immediatelyRender: false,
-    editorProps: {
-      handleKeyDown: function handleKeyDown(view, event) {
-        if (props.onKeyDown) {
-          return props.onKeyDown(event);
-        }
-
-        // Return false to let default behavior continue
-        return false;
-      }
-    },
-    editable: !props.disabled,
-    content: (0, _helper.normalizeInitialMarkup)(props.markup),
-    onUpdate: function onUpdate(_ref4) {
-      var editor = _ref4.editor,
-        transaction = _ref4.transaction;
-      if (transaction.isDone) {
-        var _props$onChange2;
-        (_props$onChange2 = props.onChange) === null || _props$onChange2 === void 0 || _props$onChange2.call(props, editor.getHTML());
-      }
-    },
-    onBlur: function onBlur(_ref5) {
-      var editor = _ref5.editor;
-      var otherToolbarOpened = editor._insertingImage || editor._toolbarOpened || editor.isActive('inline_dropdown') || editor.isActive('explicit_constructed_response');
-      if (otherToolbarOpened || !editor.schema) {
-        return;
-      }
-      commitEditorContent(editor);
-    }
-  }, [props.charactersLimit]);
-  (0, _react.useEffect)(function () {
-    if (props.editorRef) {
-      props.editorRef(editor);
-    }
-  }, [props.editorRef, editor]);
-  (0, _react.useEffect)(function () {
-    editor === null || editor === void 0 || editor.setEditable(!props.disabled);
-  }, [props.disabled, editor]);
-  (0, _react.useEffect)(function () {
-    if (!editor) {
-      return;
-    }
-    var nextMarkup = (0, _helper.normalizeInitialMarkup)(props.markup);
-    if (nextMarkup !== editor.getHTML()) {
-      editor.commands.setContent(nextMarkup, {
-        emitUpdate: false
-      });
-    }
-  }, [props.markup, editor]);
-  (0, _react.useEffect)(function () {
-    Object.entries(cssVariables).forEach(function (_ref6) {
-      var _ref7 = (0, _slicedToArray2["default"])(_ref6, 2),
-        key = _ref7[0],
-        value = _ref7[1];
-      document.documentElement.style.setProperty(key, value);
-    });
-  }, []);
-  var editorState = (0, _react2.useEditorState)({
-    editor: editor,
-    selector: function selector(ctx) {
-      var _ctx$editor;
-      return {
-        isFocused: (_ctx$editor = ctx.editor) === null || _ctx$editor === void 0 ? void 0 : _ctx$editor.isFocused
-      };
-    }
-  });
-  var sizeStyle = (0, _react.useMemo)(function () {
-    var minWidth = props.minWidth,
-      width = props.width,
-      maxWidth = props.maxWidth,
-      minHeight = props.minHeight,
-      height = props.height,
-      maxHeight = props.maxHeight;
-    return {
-      width: (0, _size.valueToSize)(width),
-      minWidth: (0, _size.valueToSize)(minWidth),
-      maxWidth: (0, _size.valueToSize)(maxWidth),
-      height: (0, _size.valueToSize)(height),
-      minHeight: (0, _size.valueToSize)(minHeight),
-      maxHeight: (0, _size.valueToSize)(maxHeight)
-    };
-  }, [props]);
-  return /*#__PURE__*/_react["default"].createElement(_TiptapContainer["default"], (0, _extends2["default"])({}, _objectSpread(_objectSpread({}, props), {}, {
-    activePlugins: activePluginsToUse,
-    toolbarOpts: toolbarOptsToUse
-  }), {
-    editorState: editorState,
-    editor: editor
-  }), editor && /*#__PURE__*/_react["default"].createElement(StyledEditorContent, {
-    style: {
-      minHeight: sizeStyle.minHeight,
-      height: sizeStyle.height,
-      maxHeight: sizeStyle.maxHeight
-    },
-    showParagraph: showParagraphs && !showParagraphs.disabled,
-    separateParagraph: separateParagraphs && !separateParagraphs.disabled,
-    editor: editor
-  }));
-};
-var StyledEditorContent = (0, _styles.styled)(_react2.EditorContent, {
-  shouldForwardProp: function shouldForwardProp(prop) {
-    return !['showParagraph', 'separateParagraph'].includes(prop);
-  }
-})(function (_ref8) {
-  var showParagraph = _ref8.showParagraph,
-    separateParagraph = _ref8.separateParagraph;
-  return {
-    display: 'flex',
-    outline: 'none !important',
-    '& .ProseMirror': _objectSpread(_objectSpread({
-      flex: 1,
-      padding: '5px',
-      maxHeight: '500px',
-      outline: 'none !important',
-      position: 'initial',
-      // reset default margins for all block paragraphs/divs in the editor
-      '& > p, & > div': {
-        margin: '0'
-      },
-      // Out of flow so the caret stays at the start of the block; in-flow ::before pushes the caret after the hint text.
-      // :only-child ensures the placeholder is hidden whenever the editor has other content (images, upload nodes, etc.)
-      // and covers the type+backspace edge case where Tiptap only adds is-empty (not is-editor-empty).
-      '& p[data-placeholder].is-empty:only-child, & div[data-placeholder].is-empty:only-child': {
-        position: 'relative'
-      },
-      '& p[data-placeholder].is-empty:only-child::before, & div[data-placeholder].is-empty:only-child::before': {
-        content: 'attr(data-placeholder)',
-        position: 'absolute',
-        left: 0,
-        top: 0,
-        color: '#9CA3AF',
-        pointerEvents: 'none',
-        whiteSpace: 'pre-wrap'
-      }
-    }, showParagraph && {
-      '& > p:has(+ p)::after, & > div:has(+ div)::after': {
-        display: 'block',
-        content: '"¶"',
-        fontSize: '1em',
-        color: '#146EB3'
-      }
-    }), separateParagraph && {
-      '& > p:has(+ p)': {
-        marginBottom: '1em'
-      }
-    })
-  };
-});
-var _default = exports["default"] = EditableHtml;
-//# sourceMappingURL=EditableHtml.js.map