@pie-lib/editable-html-tip-tap 1.2.0-next.0 → 1.2.0-next.12

package/lib/extensions/responseArea.js

@@ -13,6 +13,7 @@ var _react2 = require("@tiptap/react");
 var _ExplicitConstructedResponse = _interopRequireDefault(require("../components/respArea/ExplicitConstructedResponse"));
 var _DragInTheBlank = _interopRequireDefault(require("../components/respArea/DragInTheBlank/DragInTheBlank"));
 var _InlineDropdown = _interopRequireDefault(require("../components/respArea/InlineDropdown"));
+var _MathTemplated = _interopRequireDefault(require("../components/respArea/MathTemplated"));
 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 lastIndexMap = {};
@@ -190,10 +191,9 @@ var ResponseAreaExtension = exports.ResponseAreaExtension = _core.Extension.crea
           // tr.setSelection(NodeSelection.create(tr.doc, usedPos))
 
           // --- Cursor move behavior for certain types (Slate: moveFocusTo next text) ---
-          if (['math_templated', 'inline_dropdown', 'drag_in_the_blank', 'explicit_constructed_response'].includes(typeName)) {
+          if (['math_templated', 'inline_dropdown', 'explicit_constructed_response'].includes(typeName)) {
             tr.setSelection(_prosemirrorState.NodeSelection.create(tr.doc, usedPos));
           } else {
-            // Default: put cursor after inserted node
             var after = usedPos + newInline.nodeSize;
             tr.setSelection(selectionAfterPos(tr.doc, after));
           }
@@ -319,8 +319,11 @@ var MathTemplatedNode = exports.MathTemplatedNode = _react2.Node.create({
     }];
   },
   addNodeView: function addNodeView() {
-    return (0, _react2.ReactNodeViewRenderer)(function () {
-      return /*#__PURE__*/_react["default"].createElement("div", null);
+    var _this4 = this;
+    return (0, _react2.ReactNodeViewRenderer)(function (props) {
+      return /*#__PURE__*/_react["default"].createElement(_MathTemplated["default"], _objectSpread(_objectSpread({}, props), {}, {
+        options: _this4.options
+      }));
     });
   }
 });
@@ -376,10 +379,10 @@ var DragInTheBlankNode = exports.DragInTheBlankNode = _react2.Node.create({
     }];
   },
   addNodeView: function addNodeView() {
-    var _this4 = this;
+    var _this5 = this;
     return (0, _react2.ReactNodeViewRenderer)(function (props) {
       return /*#__PURE__*/_react["default"].createElement(_DragInTheBlank["default"], _objectSpread(_objectSpread({}, props), {}, {
-        options: _this4.options
+        options: _this5.options
       }));
     });
   }
@@ -426,10 +429,10 @@ var InlineDropdownNode = exports.InlineDropdownNode = _react2.Node.create({
     }];
   },
   addNodeView: function addNodeView() {
-    var _this5 = this;
+    var _this6 = this;
     return (0, _react2.ReactNodeViewRenderer)(function (props) {
       return /*#__PURE__*/_react["default"].createElement(_InlineDropdown["default"], _objectSpread(_objectSpread({}, props), {}, {
-        options: _this5.options
+        options: _this6.options
       }));
     });
   }

package/lib/extensions/responseArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"responseArea.js","names":["_react","_interopRequireDefault","require","_prosemirrorState","_core","_react2","_ExplicitConstructedResponse","_DragInTheBlank","_InlineDropdown","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","lastIndexMap","normalizeType","type","String","replace","getAttrIndex","node","attrs","index","collectNodesOfType","doc","typeName","results","descendants","pos","name","countNodesOfType","count","getDefaultNode","_ref","schema","nodeType","nodes","create","id","value","selectionAfterPos","$pos","resolve","Math","min","content","size","TextSelection","near","ResponseAreaExtension","exports","Extension","addOptions","maxResponseAreas","error","options","respAreaToolbar","onHandleAreaChange","addProseMirrorPlugins","_this","key","PluginKey","concat","Plugin","view","undefined","state","idx","n","parseInt","Number","isNaN","update","prevState","eq","currentList","oldList","toolbar","disabled","currentIndexSet","Set","map","x","removed","has","addCommands","_this2","insertResponseArea","_ref2","tr","dispatch","commands","currentCount","prevIndex","newIndex","newInline","selection","insertPos","from","tryInsertAt","insert","usedPos","includes","setSelection","NodeSelection","after","nodeSize","focus","refreshResponseArea","_ref3","$from","nodeAfter","nodePos","setNodeMarkup","updated","Date","now","ExplicitConstructedResponseNode","Node","group","inline","atom","addAttributes","parseHTML","tag","getAttrs","el","dataset","renderHTML","_ref4","HTMLAttributes","addNodeView","_this3","ReactNodeViewRenderer","props","createElement","MathTemplatedNode","_ref5","DragInTheBlankNode","inTable","_ref6","_this4","InlineDropdownNode","_ref7","_this5"],"sources":["../../src/extensions/responseArea.js"],"sourcesContent":["import React from 'react';\nimport { NodeSelection, Plugin, PluginKey, TextSelection } from 'prosemirror-state';\nimport { Extension } from '@tiptap/core';\nimport { Node, ReactNodeViewRenderer } from '@tiptap/react';\nimport ExplicitConstructedResponse from '../components/respArea/ExplicitConstructedResponse';\nimport DragInTheBlank from '../components/respArea/DragInTheBlank/DragInTheBlank';\nimport InlineDropdown from '../components/respArea/InlineDropdown';\n\nconst lastIndexMap = {};\n\nconst normalizeType = (type) => String(type || '').replace(/-/g, '_');\n\nconst getAttrIndex = (node) => (node && node.attrs && node.attrs.index != null ? String(node.attrs.index) : null);\n\nconst collectNodesOfType = (doc, typeName) => {\n  const results = [];\n\n  doc.descendants((node, pos) => {\n    if (node.type && node.type.name === typeName) {\n      const index = getAttrIndex(node);\n      if (index != null) results.push({ index, pos, node });\n    }\n    return true;\n  });\n\n  return results;\n};\n\nconst countNodesOfType = (doc, typeName) => {\n  let count = 0;\n  doc.descendants((node) => {\n    if (node.type && node.type.name === typeName) count += 1;\n    return true;\n  });\n  return count;\n};\n\nconst getDefaultNode = ({ schema, typeName, index }) => {\n  const nodeType = schema.nodes[typeName];\n  if (!nodeType) return null;\n\n  // mirror your Slate \"getDefaultElement(opts, newIndex)\"\n  // customize attrs as needed:\n  return nodeType.create({\n    index: String(index),\n    id: String(index),\n    value: '',\n  });\n};\n\n// Find a good cursor position *after* an inserted node.\nconst selectionAfterPos = (doc, pos) => {\n  const $pos = doc.resolve(Math.min(pos, doc.content.size));\n  return TextSelection.near($pos, 1);\n};\n\nexport const ResponseAreaExtension = Extension.create({\n  name: 'responseArea',\n\n  addOptions() {\n    return {\n      maxResponseAreas: null,\n      error: null,\n      options: null,\n      respAreaToolbar: null,\n      onHandleAreaChange: null,\n    };\n  },\n\n  addProseMirrorPlugins() {\n    if (!this.options.type) {\n      return [];\n    }\n\n    const typeName = normalizeType(this.options.type);\n    const key = new PluginKey(`response-area-watcher:${typeName}`);\n\n    return [\n      new Plugin({\n        key,\n\n        view: (view) => {\n          // Lazy init lastIndexMap[typeName]\n          if (lastIndexMap[typeName] === undefined) {\n            lastIndexMap[typeName] = 0;\n\n            view.state.doc.descendants((node) => {\n              if (node.type && node.type.name === typeName) {\n                const idx = getAttrIndex(node);\n                if (idx != null) {\n                  const n = parseInt(idx, 10);\n                  if (!Number.isNaN(n) && n > lastIndexMap[typeName]) {\n                    lastIndexMap[typeName] = n;\n                  }\n                }\n              }\n              return true;\n            });\n          }\n\n          return {\n            update: (view, prevState) => {\n              const state = view.state;\n              if (prevState.doc.eq(state.doc)) return;\n\n              const currentList = collectNodesOfType(state.doc, typeName);\n              const oldList = collectNodesOfType(prevState.doc, typeName);\n\n              if (this.options.toolbar) {\n                this.options.toolbar.disabled = currentList.length >= this.options.maxResponseAreas;\n              }\n\n              // Removed elements (same logic as Slate)\n              if (oldList.length > currentList.length) {\n                const currentIndexSet = new Set(currentList.map((x) => x.index));\n\n                const removed = oldList.filter((x) => !currentIndexSet.has(x.index));\n\n                if (removed.length && typeof this.options.onHandleAreaChange === 'function') {\n                  this.options.onHandleAreaChange(removed);\n                }\n              }\n            },\n          };\n        },\n      }),\n    ];\n  },\n\n  addCommands() {\n    return {\n      insertResponseArea:\n        (type) =>\n        ({ tr, state, dispatch, commands }) => {\n          const typeName = normalizeType(type);\n\n          // --- Slate: currentRespAreaList + max check ---\n          const currentCount = countNodesOfType(state.doc, typeName);\n          if (currentCount >= this.options.maxResponseAreas) {\n            return false;\n          }\n\n          // --- Slate: indexing logic (kept identical) ---\n          if (lastIndexMap[typeName] === undefined) lastIndexMap[typeName] = 0;\n\n          const prevIndex = lastIndexMap[typeName];\n          const newIndex = prevIndex === 0 ? prevIndex : prevIndex + 1;\n\n          // Slate increments map even if newIndex === 0\n          lastIndexMap[typeName] += 1;\n\n          const newInline = getDefaultNode({\n            schema: state.schema,\n            typeName,\n            index: newIndex,\n          });\n\n          if (!newInline) return false;\n\n          // --- Insert logic ---\n          const { selection } = state;\n          let insertPos = selection.from;\n\n          // If we're in a NodeSelection, insert before/after is ambiguous;\n          // We'll insert at its \"from\" (like your current code).\n          // If insertion fails, we fallback to end of doc.\n          const tryInsertAt = (pos) => {\n            try {\n              tr.insert(pos, newInline);\n              return pos;\n            } catch (e) {\n              return null;\n            }\n          };\n\n          let usedPos = tryInsertAt(insertPos);\n\n          // Slate branch: \"markup empty and there's no focus\"\n          // ProseMirror doesn't expose \"no focus\" the same way, so the closest\n          // equivalent fallback is inserting at end of document.\n          if (usedPos == null) {\n            usedPos = tryInsertAt(tr.doc.content.size);\n          }\n          if (usedPos == null) return false;\n\n          // Optionally select the node you just inserted (like your original command)\n          // tr.setSelection(NodeSelection.create(tr.doc, usedPos))\n\n          // --- Cursor move behavior for certain types (Slate: moveFocusTo next text) ---\n          if (\n            ['math_templated', 'inline_dropdown', 'drag_in_the_blank', 'explicit_constructed_response'].includes(\n              typeName,\n            )\n          ) {\n            tr.setSelection(NodeSelection.create(tr.doc, usedPos));\n          } else {\n            // Default: put cursor after inserted node\n            const after = usedPos + newInline.nodeSize;\n            tr.setSelection(selectionAfterPos(tr.doc, after));\n          }\n\n          if (dispatch) {\n            commands.focus();\n            dispatch(tr);\n          }\n\n          return true;\n        },\n      refreshResponseArea:\n        () =>\n        ({ tr, state, commands, dispatch }) => {\n          const { selection } = state;\n          const node = selection.$from.nodeAfter;\n          const nodePos = selection.from;\n\n          tr.setNodeMarkup(nodePos, undefined, { ...node.attrs, updated: `${Date.now()}` });\n          tr.setSelection(NodeSelection.create(tr.doc, nodePos));\n\n          if (dispatch) {\n            commands.focus();\n            dispatch(tr);\n          }\n\n          return true;\n        },\n    };\n  },\n});\n\n/**\n * ExplicitConstructedResponse Node\n */\nexport const ExplicitConstructedResponseNode = Node.create({\n  name: 'explicit_constructed_response',\n  group: 'inline',\n  inline: true,\n  atom: true,\n  addAttributes() {\n    return {\n      index: { default: null },\n      value: { default: '' },\n      updated: { default: '' },\n    };\n  },\n  parseHTML() {\n    return [\n      {\n        tag: 'span[data-type=\"explicit_constructed_response\"]',\n        getAttrs: (el) => ({\n          index: el.dataset.index,\n          value: el.dataset.value,\n        }),\n      },\n    ];\n  },\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'span',\n      {\n        'data-type': 'explicit_constructed_response',\n        'data-index': HTMLAttributes.index,\n        'data-value': HTMLAttributes.value,\n      },\n    ];\n  },\n  addNodeView() {\n    return ReactNodeViewRenderer((props) => <ExplicitConstructedResponse {...{ ...props, options: this.options }} />);\n  },\n});\n\n/**\n * MathTemplated Node\n */\nexport const MathTemplatedNode = Node.create({\n  name: 'math_templated',\n  group: 'inline',\n  inline: true,\n  atom: true,\n  addAttributes() {\n    return {\n      index: { default: null },\n      value: { default: '' },\n      updated: { default: '' },\n    };\n  },\n  parseHTML() {\n    return [\n      {\n        tag: 'span[data-type=\"math_templated\"]',\n        getAttrs: (el) => ({\n          index: el.dataset.index,\n          value: el.dataset.value,\n        }),\n      },\n    ];\n  },\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'span',\n      {\n        'data-type': 'math_templated',\n        'data-index': HTMLAttributes.index,\n        'data-value': HTMLAttributes.value,\n      },\n    ];\n  },\n  addNodeView() {\n    return ReactNodeViewRenderer(() => <div></div>);\n  },\n});\n\n/**\n * DragInTheBlank Node\n */\nexport const DragInTheBlankNode = Node.create({\n  name: 'drag_in_the_blank',\n  group: 'inline',\n  inline: true,\n  atom: true,\n  addAttributes() {\n    return {\n      index: { default: null },\n      id: { default: null },\n      value: { default: '' },\n      inTable: { default: null },\n      updated: { default: '' },\n    };\n  },\n  parseHTML() {\n    return [\n      {\n        tag: 'span[data-type=\"drag_in_the_blank\"]',\n        getAttrs: (el) => ({\n          index: el.dataset.index,\n          id: el.dataset.id,\n          value: el.dataset.value,\n          inTable: el.dataset.inTable,\n        }),\n      },\n    ];\n  },\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'span',\n      {\n        'data-type': 'drag_in_the_blank',\n        'data-index': HTMLAttributes.index,\n        'data-id': HTMLAttributes.id,\n        'data-value': HTMLAttributes.value,\n        'data-in-table': HTMLAttributes.inTable,\n      },\n    ];\n  },\n  addNodeView() {\n    return ReactNodeViewRenderer((props) => <DragInTheBlank {...{ ...props, options: this.options }} />);\n  },\n});\n\n/**\n * InlineDropdown Node\n */\nexport const InlineDropdownNode = Node.create({\n  name: 'inline_dropdown',\n  group: 'inline',\n  inline: true,\n  atom: true,\n  addAttributes() {\n    return {\n      index: { default: null },\n      value: { default: '' },\n      updated: { default: '' },\n    };\n  },\n  parseHTML() {\n    return [\n      {\n        tag: 'span[data-type=\"inline_dropdown\"]',\n        getAttrs: (el) => ({\n          index: el.dataset.index,\n          value: el.dataset.value,\n        }),\n      },\n    ];\n  },\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'span',\n      {\n        'data-type': 'inline_dropdown',\n        'data-index': HTMLAttributes.index,\n        'data-value': HTMLAttributes.value,\n      },\n    ];\n  },\n  addNodeView() {\n    return ReactNodeViewRenderer((props) => <InlineDropdown {...{ ...props, options: this.options }} />);\n  },\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"responseArea.js","names":["_react","_interopRequireDefault","require","_prosemirrorState","_core","_react2","_ExplicitConstructedResponse","_DragInTheBlank","_InlineDropdown","_MathTemplated","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","defineProperty","lastIndexMap","normalizeType","type","String","replace","getAttrIndex","node","attrs","index","collectNodesOfType","doc","typeName","results","descendants","pos","name","countNodesOfType","count","getDefaultNode","_ref","schema","nodeType","nodes","create","id","value","selectionAfterPos","$pos","resolve","Math","min","content","size","TextSelection","near","ResponseAreaExtension","exports","Extension","addOptions","maxResponseAreas","error","options","respAreaToolbar","onHandleAreaChange","addProseMirrorPlugins","_this","key","PluginKey","concat","Plugin","view","undefined","state","idx","n","parseInt","Number","isNaN","update","prevState","eq","currentList","oldList","toolbar","disabled","currentIndexSet","Set","map","x","removed","has","addCommands","_this2","insertResponseArea","_ref2","tr","dispatch","commands","currentCount","prevIndex","newIndex","newInline","selection","insertPos","from","tryInsertAt","insert","usedPos","includes","setSelection","NodeSelection","after","nodeSize","focus","refreshResponseArea","_ref3","$from","nodeAfter","nodePos","setNodeMarkup","updated","Date","now","ExplicitConstructedResponseNode","Node","group","inline","atom","addAttributes","parseHTML","tag","getAttrs","el","dataset","renderHTML","_ref4","HTMLAttributes","addNodeView","_this3","ReactNodeViewRenderer","props","createElement","MathTemplatedNode","_ref5","_this4","DragInTheBlankNode","inTable","_ref6","_this5","InlineDropdownNode","_ref7","_this6"],"sources":["../../src/extensions/responseArea.js"],"sourcesContent":["import React from 'react';\nimport { NodeSelection, Plugin, PluginKey, TextSelection } from 'prosemirror-state';\nimport { Extension } from '@tiptap/core';\nimport { Node, ReactNodeViewRenderer } from '@tiptap/react';\nimport ExplicitConstructedResponse from '../components/respArea/ExplicitConstructedResponse';\nimport DragInTheBlank from '../components/respArea/DragInTheBlank/DragInTheBlank';\nimport InlineDropdown from '../components/respArea/InlineDropdown';\nimport MathTemplated from '../components/respArea/MathTemplated';\n\nconst lastIndexMap = {};\n\nconst normalizeType = (type) => String(type || '').replace(/-/g, '_');\n\nconst getAttrIndex = (node) => (node && node.attrs && node.attrs.index != null ? String(node.attrs.index) : null);\n\nconst collectNodesOfType = (doc, typeName) => {\n  const results = [];\n\n  doc.descendants((node, pos) => {\n    if (node.type && node.type.name === typeName) {\n      const index = getAttrIndex(node);\n      if (index != null) results.push({ index, pos, node });\n    }\n    return true;\n  });\n\n  return results;\n};\n\nconst countNodesOfType = (doc, typeName) => {\n  let count = 0;\n  doc.descendants((node) => {\n    if (node.type && node.type.name === typeName) count += 1;\n    return true;\n  });\n  return count;\n};\n\nconst getDefaultNode = ({ schema, typeName, index }) => {\n  const nodeType = schema.nodes[typeName];\n  if (!nodeType) return null;\n\n  // mirror your Slate \"getDefaultElement(opts, newIndex)\"\n  // customize attrs as needed:\n  return nodeType.create({\n    index: String(index),\n    id: String(index),\n    value: '',\n  });\n};\n\n// Find a good cursor position *after* an inserted node.\nconst selectionAfterPos = (doc, pos) => {\n  const $pos = doc.resolve(Math.min(pos, doc.content.size));\n  return TextSelection.near($pos, 1);\n};\n\nexport const ResponseAreaExtension = Extension.create({\n  name: 'responseArea',\n\n  addOptions() {\n    return {\n      maxResponseAreas: null,\n      error: null,\n      options: null,\n      respAreaToolbar: null,\n      onHandleAreaChange: null,\n    };\n  },\n\n  addProseMirrorPlugins() {\n    if (!this.options.type) {\n      return [];\n    }\n\n    const typeName = normalizeType(this.options.type);\n    const key = new PluginKey(`response-area-watcher:${typeName}`);\n\n    return [\n      new Plugin({\n        key,\n\n        view: (view) => {\n          // Lazy init lastIndexMap[typeName]\n          if (lastIndexMap[typeName] === undefined) {\n            lastIndexMap[typeName] = 0;\n\n            view.state.doc.descendants((node) => {\n              if (node.type && node.type.name === typeName) {\n                const idx = getAttrIndex(node);\n                if (idx != null) {\n                  const n = parseInt(idx, 10);\n                  if (!Number.isNaN(n) && n > lastIndexMap[typeName]) {\n                    lastIndexMap[typeName] = n;\n                  }\n                }\n              }\n              return true;\n            });\n          }\n\n          return {\n            update: (view, prevState) => {\n              const state = view.state;\n              if (prevState.doc.eq(state.doc)) return;\n\n              const currentList = collectNodesOfType(state.doc, typeName);\n              const oldList = collectNodesOfType(prevState.doc, typeName);\n\n              if (this.options.toolbar) {\n                this.options.toolbar.disabled = currentList.length >= this.options.maxResponseAreas;\n              }\n\n              // Removed elements (same logic as Slate)\n              if (oldList.length > currentList.length) {\n                const currentIndexSet = new Set(currentList.map((x) => x.index));\n\n                const removed = oldList.filter((x) => !currentIndexSet.has(x.index));\n\n                if (removed.length && typeof this.options.onHandleAreaChange === 'function') {\n                  this.options.onHandleAreaChange(removed);\n                }\n              }\n            },\n          };\n        },\n      }),\n    ];\n  },\n\n  addCommands() {\n    return {\n      insertResponseArea:\n        (type) =>\n        ({ tr, state, dispatch, commands }) => {\n          const typeName = normalizeType(type);\n\n          // --- Slate: currentRespAreaList + max check ---\n          const currentCount = countNodesOfType(state.doc, typeName);\n          if (currentCount >= this.options.maxResponseAreas) {\n            return false;\n          }\n\n          // --- Slate: indexing logic (kept identical) ---\n          if (lastIndexMap[typeName] === undefined) lastIndexMap[typeName] = 0;\n\n          const prevIndex = lastIndexMap[typeName];\n          const newIndex = prevIndex === 0 ? prevIndex : prevIndex + 1;\n\n          // Slate increments map even if newIndex === 0\n          lastIndexMap[typeName] += 1;\n\n          const newInline = getDefaultNode({\n            schema: state.schema,\n            typeName,\n            index: newIndex,\n          });\n\n          if (!newInline) return false;\n\n          // --- Insert logic ---\n          const { selection } = state;\n          let insertPos = selection.from;\n\n          // If we're in a NodeSelection, insert before/after is ambiguous;\n          // We'll insert at its \"from\" (like your current code).\n          // If insertion fails, we fallback to end of doc.\n          const tryInsertAt = (pos) => {\n            try {\n              tr.insert(pos, newInline);\n              return pos;\n            } catch (e) {\n              return null;\n            }\n          };\n\n          let usedPos = tryInsertAt(insertPos);\n\n          // Slate branch: \"markup empty and there's no focus\"\n          // ProseMirror doesn't expose \"no focus\" the same way, so the closest\n          // equivalent fallback is inserting at end of document.\n          if (usedPos == null) {\n            usedPos = tryInsertAt(tr.doc.content.size);\n          }\n          if (usedPos == null) return false;\n\n          // Optionally select the node you just inserted (like your original command)\n          // tr.setSelection(NodeSelection.create(tr.doc, usedPos))\n\n          // --- Cursor move behavior for certain types (Slate: moveFocusTo next text) ---\n          if (['math_templated', 'inline_dropdown', 'explicit_constructed_response'].includes(typeName)) {\n            tr.setSelection(NodeSelection.create(tr.doc, usedPos));\n          } else {\n            const after = usedPos + newInline.nodeSize;\n            tr.setSelection(selectionAfterPos(tr.doc, after));\n          }\n\n          if (dispatch) {\n            commands.focus();\n            dispatch(tr);\n          }\n\n          return true;\n        },\n      refreshResponseArea:\n        () =>\n        ({ tr, state, commands, dispatch }) => {\n          const { selection } = state;\n          const node = selection.$from.nodeAfter;\n          const nodePos = selection.from;\n\n          tr.setNodeMarkup(nodePos, undefined, { ...node.attrs, updated: `${Date.now()}` });\n          tr.setSelection(NodeSelection.create(tr.doc, nodePos));\n\n          if (dispatch) {\n            commands.focus();\n            dispatch(tr);\n          }\n\n          return true;\n        },\n    };\n  },\n});\n\n/**\n * ExplicitConstructedResponse Node\n */\nexport const ExplicitConstructedResponseNode = Node.create({\n  name: 'explicit_constructed_response',\n  group: 'inline',\n  inline: true,\n  atom: true,\n  addAttributes() {\n    return {\n      index: { default: null },\n      value: { default: '' },\n      updated: { default: '' },\n    };\n  },\n  parseHTML() {\n    return [\n      {\n        tag: 'span[data-type=\"explicit_constructed_response\"]',\n        getAttrs: (el) => ({\n          index: el.dataset.index,\n          value: el.dataset.value,\n        }),\n      },\n    ];\n  },\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'span',\n      {\n        'data-type': 'explicit_constructed_response',\n        'data-index': HTMLAttributes.index,\n        'data-value': HTMLAttributes.value,\n      },\n    ];\n  },\n  addNodeView() {\n    return ReactNodeViewRenderer((props) => <ExplicitConstructedResponse {...{ ...props, options: this.options }} />);\n  },\n});\n\n/**\n * MathTemplated Node\n */\nexport const MathTemplatedNode = Node.create({\n  name: 'math_templated',\n  group: 'inline',\n  inline: true,\n  atom: true,\n  addAttributes() {\n    return {\n      index: { default: null },\n      value: { default: '' },\n      updated: { default: '' },\n    };\n  },\n  parseHTML() {\n    return [\n      {\n        tag: 'span[data-type=\"math_templated\"]',\n        getAttrs: (el) => ({\n          index: el.dataset.index,\n          value: el.dataset.value,\n        }),\n      },\n    ];\n  },\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'span',\n      {\n        'data-type': 'math_templated',\n        'data-index': HTMLAttributes.index,\n        'data-value': HTMLAttributes.value,\n      },\n    ];\n  },\n  addNodeView() {\n    return ReactNodeViewRenderer((props) => <MathTemplated {...{ ...props, options: this.options }} />);\n  },\n});\n\n/**\n * DragInTheBlank Node\n */\nexport const DragInTheBlankNode = Node.create({\n  name: 'drag_in_the_blank',\n  group: 'inline',\n  inline: true,\n  atom: true,\n  addAttributes() {\n    return {\n      index: { default: null },\n      id: { default: null },\n      value: { default: '' },\n      inTable: { default: null },\n      updated: { default: '' },\n    };\n  },\n  parseHTML() {\n    return [\n      {\n        tag: 'span[data-type=\"drag_in_the_blank\"]',\n        getAttrs: (el) => ({\n          index: el.dataset.index,\n          id: el.dataset.id,\n          value: el.dataset.value,\n          inTable: el.dataset.inTable,\n        }),\n      },\n    ];\n  },\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'span',\n      {\n        'data-type': 'drag_in_the_blank',\n        'data-index': HTMLAttributes.index,\n        'data-id': HTMLAttributes.id,\n        'data-value': HTMLAttributes.value,\n        'data-in-table': HTMLAttributes.inTable,\n      },\n    ];\n  },\n  addNodeView() {\n    return ReactNodeViewRenderer((props) => <DragInTheBlank {...{ ...props, options: this.options }} />);\n  },\n});\n\n/**\n * InlineDropdown Node\n */\nexport const InlineDropdownNode = Node.create({\n  name: 'inline_dropdown',\n  group: 'inline',\n  inline: true,\n  atom: true,\n  addAttributes() {\n    return {\n      index: { default: null },\n      value: { default: '' },\n      updated: { default: '' },\n    };\n  },\n  parseHTML() {\n    return [\n      {\n        tag: 'span[data-type=\"inline_dropdown\"]',\n        getAttrs: (el) => ({\n          index: el.dataset.index,\n          value: el.dataset.value,\n        }),\n      },\n    ];\n  },\n  renderHTML({ HTMLAttributes }) {\n    return [\n      'span',\n      {\n        'data-type': 'inline_dropdown',\n        'data-index': HTMLAttributes.index,\n        'data-value': HTMLAttributes.value,\n      },\n    ];\n  },\n  addNodeView() {\n    return ReactNodeViewRenderer((props) => <InlineDropdown {...{ ...props, options: this.options }} />);\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,31 +1,32 @@
 {
   "name": "@pie-lib/editable-html-tip-tap",
-  "version": "1.2.0-next.0+c7578ca",
+  "publishConfig": {
+    "access": "public"
+  },
+  "version": "1.2.0-next.12",
   "description": "",
   "license": "ISC",
   "main": "lib/index.js",
   "module": "src/index.jsx",
   "author": "pie-framework developers",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/pie-framework/pie-lib"
-  },
+  "repository": "pie-framework/pie-lib",
   "dependencies": {
     "@dnd-kit/core": "6.3.1",
     "@dnd-kit/modifiers": "9.0.0",
     "@dnd-kit/utilities": "3.2.2",
     "@mui/icons-material": "^7.3.4",
     "@mui/material": "^7.3.4",
-    "@pie-lib/drag": "^3.2.0-next.0+c7578ca",
-    "@pie-lib/math-input": "^7.2.0-next.0+c7578ca",
-    "@pie-lib/math-rendering": "^4.2.0-next.0+c7578ca",
-    "@pie-lib/math-toolbar": "^2.2.0-next.0+c7578ca",
-    "@pie-lib/render-ui": "^5.2.0-next.0+c7578ca",
+    "@pie-lib/drag": "^3.2.0-next.4",
+    "@pie-lib/math-input": "^7.2.0-next.5",
+    "@pie-lib/math-rendering": "^4.2.0-next.3",
+    "@pie-lib/math-toolbar": "^2.2.0-next.6",
+    "@pie-lib/render-ui": "^5.2.0-next.4",
     "@tiptap/core": "3.0.9",
     "@tiptap/extension-character-count": "3.0.9",
     "@tiptap/extension-color": "3.0.9",
     "@tiptap/extension-image": "3.0.9",
     "@tiptap/extension-list-item": "3.0.9",
+    "@tiptap/extension-placeholder": "3.20.0",
     "@tiptap/extension-subscript": "3.0.9",
     "@tiptap/extension-superscript": "3.0.9",
     "@tiptap/extension-table": "3.0.9",
@@ -58,9 +59,6 @@
   "peerDependencies": {
     "react": "^18.2.0"
   },
-  "publishConfig": {
-    "access": "public"
-  },
-  "gitHead": "c7578cae82de46ec0dae41b7d1ef924401e6226d",
+  "gitHead": "09270ba99e0887119a5ecb5b6670c965a1573347",
   "scripts": {}
 }

package/src/__tests__/EditableHtml.test.jsx

@@ -91,6 +91,9 @@ jest.mock('../extensions/responseArea', () => ({
   InlineDropdownNode: {
     configure: jest.fn(() => ({})),
   },
+  MathTemplatedNode: {
+    configure: jest.fn(() => ({})),
+  },
   ResponseAreaExtension: {
     configure: jest.fn(() => ({})),
   },

package/src/components/CharacterPicker.jsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import ReactDOM from 'react-dom';
 import PropTypes from 'prop-types';
-import { get } from 'lodash-es';
+import get from 'lodash-es/get';
 
 import { PureToolbar } from '@pie-lib/math-toolbar';
 

package/src/components/EditableHtml.jsx

@@ -7,7 +7,9 @@ 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 ExtendedTable from '../extensions/extended-table';
 import { TableRow } from '@tiptap/extension-table-row';
@@ -17,6 +19,7 @@ import {
   DragInTheBlankNode,
   ExplicitConstructedResponseNode,
   InlineDropdownNode,
+  MathTemplatedNode,
   ResponseAreaExtension,
 } from '../extensions/responseArea';
 import { MathNode } from '../extensions/math';
@@ -137,6 +140,13 @@ export const EditableHtml = (props) => {
       limit: props.charactersLimit || 1000000,
     }),
     StarterKit,
+    Placeholder.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,
     TableRow,
     TableHeader,
@@ -145,6 +155,7 @@ export const EditableHtml = (props) => {
     ExplicitConstructedResponseNode.configure(props.responseAreaProps),
     DragInTheBlankNode.configure(props.responseAreaProps),
     InlineDropdownNode.configure(props.responseAreaProps),
+    MathTemplatedNode.configure(props.responseAreaProps),
     MathNode.configure({
       toolbarOpts: toolbarOptsToUse,
     }),
@@ -247,11 +258,13 @@ export const EditableHtml = (props) => {
           props.onChange?.(editor.getHTML());
         }
       },
-      onBlur: ({ editor }) => {
-        const respAreaToolbarActive =
-          editor.isActive('inline_dropdown') || editor.isActive('explicit_constructed_response');
+      onBlur: debounce(({ editor }) => {
+        const otherToolbarOpened =
+          editor._toolbarOpened ||
+          editor.isActive('inline_dropdown') ||
+          editor.isActive('explicit_constructed_response');
 
-        if (respAreaToolbarActive) {
+        if (otherToolbarOpened) {
           return;
         }
 
@@ -262,7 +275,7 @@ export const EditableHtml = (props) => {
         if (toolbarOptsToUse.doneOn === 'blur') {
           props.onDone?.(editor.getHTML());
         }
-      },
+      }, 200),
     },
     [props.charactersLimit],
   );
@@ -345,6 +358,16 @@ const StyledEditorContent = styled(EditorContent, {
     '& > p': {
       margin: '0',
     },
+
+    '& p.is-editor-empty:first-child::before': {
+      content: 'attr(data-placeholder)',
+      float: 'left',
+      height: 0,
+      color: '#9CA3AF',
+      pointerEvents: 'none',
+      whiteSpace: 'pre-wrap',
+    },
+
     ...(showParagraph && {
       '& > p:has(+ p)::after': {
         display: 'block',

package/src/components/MenuBar.jsx

@@ -18,6 +18,7 @@ import Undo from '@mui/icons-material/Undo';
 import TheatersIcon from '@mui/icons-material/Theaters';
 import VolumeUpIcon from '@mui/icons-material/VolumeUp';
 import BorderAll from '@mui/icons-material/BorderAll';
+import Delete from '@mui/icons-material/Delete';
 
 import { useEditorState } from '@tiptap/react';
 
@@ -65,7 +66,15 @@ const HeadingIcon = () => (
   </svg>
 );
 
-function MenuBar({ editor, classes, activePlugins, toolbarOpts: toolOpts, responseAreaProps, onChange }) {
+function MenuBar({
+  editor,
+  classes,
+  activePlugins,
+  toolbarOpts: toolOpts,
+  responseAreaProps,
+  onChange,
+  autoWidthToolbar,
+}) {
   const [showPicker, setShowPicker] = useState(false);
   const toolbarOpts = toolOpts ?? {};
 
@@ -83,7 +92,8 @@ function MenuBar({ editor, classes, activePlugins, toolbarOpts: toolOpts, respon
       const hideDefaultToolbar =
         ctx.editor?.isActive('math') ||
         ctx.editor?.isActive('explicit_constructed_response') ||
-        ctx.editor?.isActive('imageUploadNode');
+        ctx.editor?.isActive('imageUploadNode') ||
+        ctx.editor?.isActive('drag_in_the_blank');
 
       return {
         currentNode,
@@ -122,7 +132,7 @@ function MenuBar({ editor, classes, activePlugins, toolbarOpts: toolOpts, respon
   });
 
   const hasDoneButton = false;
-  const autoWidth = false;
+  const autoWidth = !!autoWidthToolbar;
 
   const names = classNames(classes.toolbar, PIE_TOOLBAR__CLASS, {
     [classes.toolbarWithNoDone]: !hasDoneButton,
@@ -248,7 +258,7 @@ function MenuBar({ editor, classes, activePlugins, toolbarOpts: toolOpts, respon
       },
       {
         icon: <ImageIcon />,
-        hidden: (state) => !activePlugins?.includes('image') || state.isTable,
+        hidden: () => !activePlugins?.includes('image'),
         onClick: (editor) => editor.chain().focus().setImageUploadNode().run(),
       },
       {
@@ -279,12 +289,12 @@ function MenuBar({ editor, classes, activePlugins, toolbarOpts: toolOpts, respon
       },
       {
         icon: <CharacterIcon letter="ñ" />,
-        hidden: (state) => !activePlugins?.includes('languageCharacters') || state.isTable,
+        hidden: () => !activePlugins?.includes('languageCharacters'),
         onClick: () => setShowPicker(spanishConfig),
       },
       {
         icon: <CharacterIcon letter="€" />,
-        hidden: (state) => activePlugins?.filter((p) => p === 'languageCharacters').length !== 2 || state.isTable,
+        hidden: () => activePlugins?.filter((p) => p === 'languageCharacters').length !== 2,
         onClick: () => setShowPicker(specialConfig),
       },
       {
@@ -320,8 +330,29 @@ function MenuBar({ editor, classes, activePlugins, toolbarOpts: toolOpts, respon
     [activePlugins, editor],
   );
 
+  const isDragInTheBlankSelected =
+    editorState.hideDefaultToolbar && editorState.currentNode?.type?.name === 'drag_in_the_blank';
+
   return (
     <div className={names} style={{ ...customStyles }} onMouseDown={handleMouseDown}>
+      {isDragInTheBlankSelected && (
+        <div className={classes.defaultToolbar} tabIndex="1">
+          <div className={classes.buttonsContainer}>
+            <button
+              type="button"
+              className={classes.button}
+              onClick={(e) => {
+                e.preventDefault();
+                editor.chain().focus().deleteSelection().run();
+                onChange?.(editor.getHTML());
+              }}
+              aria-label="Delete response area"
+            >
+              <Delete />
+            </button>
+          </div>
+        </div>
+      )}
       {!editorState.hideDefaultToolbar && (
         <div className={classes.defaultToolbar} tabIndex="1">
           <div className={classes.buttonsContainer}>

package/src/components/TiptapContainer.jsx

@@ -108,13 +108,13 @@ const StyledRoot = styled('div', {
 }));
 
 const StyledEditorHolder = styled('div', {
-  shouldForwardProp: (prop) => prop !== 'disableScrollbar',
-})(({ disableScrollbar }) => ({
+  shouldForwardProp: (prop) => !['disableScrollbar', 'highlightShape'].includes(prop),
+})(({ theme, disableScrollbar, highlightShape }) => ({
   position: 'relative',
   padding: '0px',
   overflowY: 'auto',
   color: color.text(),
-  backgroundColor: color.background(),
+  backgroundColor: highlightShape ? theme.palette.action.selected : color.background(),
   ...(disableScrollbar && {
     '&::-webkit-scrollbar': {
       display: 'none',
@@ -148,6 +148,7 @@ function TiptapContainer(props) {
     minHeight,
     height,
     maxHeight,
+    highlightShape,
     ref,
   } = props;
 
@@ -195,7 +196,7 @@ function TiptapContainer(props) {
       style={{ width: sizeStyle.width, minWidth: sizeStyle.minWidth, maxWidth: sizeStyle.maxWidth }}
       ref={rootRef}
     >
-      <StyledEditorHolder disableScrollbar={disableScrollbar}>
+      <StyledEditorHolder disableScrollbar={disableScrollbar} highlightShape={highlightShape}>
         <StyledChildren noPadding={toolbarOpts && toolbarOpts.noPadding}>{children}</StyledChildren>
       </StyledEditorHolder>
 
@@ -206,6 +207,7 @@ function TiptapContainer(props) {
           toolbarOpts={toolbarOpts}
           activePlugins={activePlugins}
           onChange={props.onChange}
+          autoWidthToolbar={props.autoWidthToolbar}
         />
       )}
     </StyledRoot>

package/src/components/respArea/DragInTheBlank/DragInTheBlank.jsx

@@ -2,7 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 import { NodeViewWrapper } from '@tiptap/react';
 import DragDropTile from './choice';
-import { omit } from 'lodash-es';
+import omit from 'lodash-es/omit';
 
 export const onValueChange = (editor, node, pos, choice) => {
   const { tr } = editor.state;
@@ -33,7 +33,11 @@ const DragDrop = (props) => {
 
   // console.log({nodeProps.children})
   return (
-    <NodeViewWrapper className="drag-in-the-blank" data-selected={selected}>
+    <NodeViewWrapper
+      className="drag-in-the-blank"
+      data-selected={selected}
+      style={{ display: 'inline', whiteSpace: 'normal' }}
+    >
       <span
         {...attributes}
         style={{
@@ -52,6 +56,7 @@ const DragDrop = (props) => {
           pos={pos}
           value={attributes}
           duplicates={options.duplicates}
+          selected={selected}
           onChange={(choice) => onValueChange(editor, node, pos, choice)}
           removeResponse={(choice) => onRemoveResponse(editor, node, choice)}
         ></DragDropTile>

package/src/components/respArea/DragInTheBlank/choice.jsx

@@ -15,7 +15,7 @@ const StyledContent = styled('span')(({ theme }) => ({
   },
 }));
 
-export function BlankContent({ n, children, isDragging, isOver, dragItem, value }) {
+export function BlankContent({ n, children, isDragging, isOver, dragItem, value, selected }) {
   const [hoveredElementSize, setHoveredElementSize] = useState(null);
   const elementRef = useRef(null);
 
@@ -56,15 +56,22 @@ export function BlankContent({ n, children, isDragging, isOver, dragItem, value
   const hasGrip = finalLabel !== '\u00A0';
   const isPreview = dragItem && isOver;
 
+  const borderStyle = selected
+    ? `2px solid ${color.primaryDark()}`
+    : isPreview
+      ? `1px solid ${color.defaults.BORDER_DARK}`
+      : `1px solid ${color.defaults.BORDER_LIGHT}`;
+
   return (
     <div
       ref={elementRef}
+      className={selected ? 'selected' : undefined}
       style={{
         display: 'inline-flex',
         minWidth: '178px',
         minHeight: '36px',
         background: isPreview ? `${color.defaults.BORDER_LIGHT}` : `${color.defaults.WHITE}`,
-        border: isPreview ? `1px solid  ${color.defaults.BORDER_DARK}` : `1px solid  ${color.defaults.BORDER_LIGHT}`,
+        border: borderStyle,
         boxSizing: 'border-box',
         borderRadius: '3px',
         overflow: 'hidden',
@@ -104,9 +111,21 @@ BlankContent.propTypes = {
   isOver: PropTypes.bool,
   dragItem: PropTypes.object,
   value: PropTypes.object,
+  selected: PropTypes.bool,
 };
 
-function DragDropChoice({ value, disabled, instanceId, children, n, onChange, removeResponse, duplicates, pos }) {
+function DragDropChoice({
+  value,
+  disabled,
+  instanceId,
+  children,
+  n,
+  onChange,
+  removeResponse,
+  duplicates,
+  pos,
+  selected,
+}) {
   const {
     attributes: dragAttributes,
     listeners: dragListeners,
@@ -196,7 +215,14 @@ function DragDropChoice({ value, disabled, instanceId, children, n, onChange, re
   };
 
   const dragContent = (
-    <BlankContent n={n} isDragging={isDragging} isOver={isOver} dragItem={dragItem?.data?.current} value={value}>
+    <BlankContent
+      n={n}
+      isDragging={isDragging}
+      isOver={isOver}
+      dragItem={dragItem?.data?.current}
+      value={value}
+      selected={selected}
+    >
       {children}
     </BlankContent>
   );
@@ -223,6 +249,7 @@ DragDropChoice.propTypes = {
   onChange: PropTypes.func.isRequired,
   removeResponse: PropTypes.func.isRequired,
   duplicates: PropTypes.bool,
+  selected: PropTypes.bool,
 };
 
 export default DragDropChoice;