@domternal/core 0.9.1 → 0.11.0

package/README.md

@@ -21,14 +21,14 @@ See <u>[Packages & Bundle Size](https://domternal.dev/v1/packages)</u> for a ful
 - **Vue components** - composable `Domternal` component, `useEditor`/`useEditorState` composables, toolbar, bubble menu, floating menu, emoji picker, notion color picker, custom node views (Vue 3.3+)
 - **Vanilla wrapper** - framework-free class-based API for Astro, Svelte, Solid, plain HTML, and Web Components - editor, toolbar, bubble menu, floating menu, emoji picker, notion color picker
 - **Notion-style block UX** - drag-to-reorder, block context menu, slash command, smart paste, keyboard reorder, floating Table of Contents
-- **65+ extensions across 15 packages** - nodes, marks, and behavior extensions
-- **120+ chainable commands** - `editor.chain().focus().toggleBold().run()`
+- **70+ extensions across 16 packages** - nodes, marks, and behavior extensions
+- **125+ chainable commands** - `editor.chain().focus().toggleBold().run()`
 - **Full table support** - cell merging, column resize, row/column controls, cell toolbar, all free and MIT licensed
 - **Tree-shakeable** - import only what you use, your bundler strips the rest
 - **~44 KB gzipped** (own code), <u>[see Packages](https://domternal.dev/v1/packages)</u> for full bundle breakdown with ProseMirror
 - **TypeScript first** - 100% typed, zero `any`
 - **15,000+ tests** - 4,000+ unit and 11,000+ E2E across 230+ Playwright specs and 4 demo apps
-- **Light and dark theme** - 70+ CSS custom properties for full visual control
+- **Light and dark theme** - 120+ CSS custom properties for full visual control
 - **Inline styles export** - `getHTML({ styled: true })` produces inline CSS ready for email clients, CMS, and Google Docs
 - **SSR helpers** - `generateHTML`, `generateJSON`, `generateText` for server-side rendering
 

package/dist/index.cjs

@@ -201,6 +201,7 @@ function inputRulesPlugin({ rules }) {
       handleDOMEvents: {
         compositionend: (view) => {
           setTimeout(() => {
+            if (view.isDestroyed) return;
             const { $cursor } = view.state.selection;
             if ($cursor) {
               run(view, $cursor.pos, $cursor.pos, "", rules, plugin);
@@ -1421,26 +1422,31 @@ var insertContent = (content) => ({ state, tr, dispatch }) => {
   const { schema } = state;
   const { from, to } = tr.selection;
   let fragment;
-  if (typeof content === "string") {
-    if (typeof window === "undefined") {
-      return false;
-    }
-    const parser = model.DOMParser.fromSchema(schema);
-    const wrapper = document.createElement("div");
-    wrapper.innerHTML = content;
-    const parsed = parser.parse(wrapper);
-    fragment = parsed.content;
-  } else if (content && typeof content === "object") {
-    if (Array.isArray(content)) {
-      const nodes = content.map((item) => schema.nodeFromJSON(item));
-      fragment = model.Fragment.from(nodes);
-    } else if ("type" in content) {
-      const node = schema.nodeFromJSON(content);
-      fragment = node.type.name === "doc" ? node.content : model.Fragment.from(node);
+  try {
+    if (typeof content === "string") {
+      if (typeof window === "undefined") {
+        return false;
+      }
+      const parser = model.DOMParser.fromSchema(schema);
+      const wrapper = document.createElement("div");
+      wrapper.innerHTML = content;
+      const parsed = parser.parse(wrapper);
+      fragment = parsed.content;
+    } else if (content && typeof content === "object") {
+      if (Array.isArray(content)) {
+        if (content.length === 0) return false;
+        const nodes = content.map((item) => schema.nodeFromJSON(item));
+        fragment = model.Fragment.from(nodes);
+      } else if ("type" in content) {
+        const node = schema.nodeFromJSON(content);
+        fragment = node.type.name === "doc" ? node.content : model.Fragment.from(node);
+      } else {
+        return false;
+      }
     } else {
       return false;
     }
-  } else {
+  } catch {
     return false;
   }
   if (!dispatch) {
@@ -4134,6 +4140,21 @@ function copyThemeClass(view, target) {
   });
 }
 
+// src/utils/refocusEditorAfterCommand.ts
+function refocusEditorAfterCommand(view) {
+  requestAnimationFrame(() => {
+    const ae = document.activeElement;
+    if (!ae) {
+      view.focus();
+      return;
+    }
+    if (ae.closest("[data-dm-editor-ui]") && !ae.closest(".dm-toolbar") && !ae.closest(".dm-bubble-menu") && !ae.closest(".dm-floating-menu") && !view.dom.contains(ae)) {
+      return;
+    }
+    view.focus();
+  });
+}
+
 // src/utils/defaultBubbleContexts.ts
 var NOTION_MODE_CLASS = "dm-notion-mode";
 var NOTION_TEXT_CONTEXT = Object.freeze([
@@ -4142,6 +4163,7 @@ var NOTION_TEXT_CONTEXT = Object.freeze([
   "underline",
   "strike",
   "code",
+  "mathInline",
   "|",
   "link",
   "|",
@@ -4153,6 +4175,7 @@ var STANDARD_TEXT_CONTEXT = Object.freeze([
   "underline",
   "strike",
   "code",
+  "mathInline",
   "|",
   "link"
 ]);
@@ -5389,6 +5412,9 @@ var defaultIcons = {
   highlighterCircle: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M201.54,54.46A104,104,0,0,0,54.46,201.54,104,104,0,0,0,201.54,54.46ZM96,210V152h64v58a88.33,88.33,0,0,1-64,0Zm48-74H112V100.94l32-16Zm46.22,54.22A88.09,88.09,0,0,1,176,201.77V152a16,16,0,0,0-16-16V72a8,8,0,0,0-11.58-7.16l-48,24A8,8,0,0,0,96,96v40a16,16,0,0,0-16,16v49.77a88,88,0,1,1,110.22-11.55Z"/></svg>',
   textSubscript: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M248,208a8,8,0,0,1-8,8H192a8,8,0,0,1-6.4-12.8l43.17-57.56a16,16,0,1,0-27.86-15,8,8,0,0,1-15.09-5.34,32.18,32.18,0,0,1,4.63-8.59,32,32,0,0,1,51.11,38.52L208,200h32A8,8,0,0,1,248,208ZM149.24,50a8,8,0,0,0-11.29.81L92,103.78l-45.95-53A8,8,0,0,0,34,61.24L81.41,116,34,170.76a8,8,0,0,0,12.1,10.48l46-53,45.95,53a8,8,0,1,0,12.1-10.48L102.59,116l47.46-54.76A8,8,0,0,0,149.24,50Z"/></svg>',
   textSuperscript: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M248,144a8,8,0,0,1-8,8H192a8,8,0,0,1-6.4-12.8l43.17-57.55a16,16,0,1,0-27.86-15,8,8,0,0,1-15.09-5.33,32,32,0,1,1,55.74,29.92L208,136h32A8,8,0,0,1,248,144ZM149.24,74a8,8,0,0,0-11.29.8L92,127.79l-45.95-53A8,8,0,0,0,34,85.24L81.41,140,34,194.76a8,8,0,0,0,12.1,10.48l46-53,45.95,53a8,8,0,1,0,12.1-10.48L102.59,140l47.46-54.76A8,8,0,0,0,149.24,74Z"/></svg>',
+  // --- Math ---
+  sigma: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="none" stroke="currentColor" stroke-width="18" stroke-linecap="round" stroke-linejoin="round"><path d="M196 56H64l64 72-64 72h132"/></svg>',
+  radical: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="none" stroke="currentColor" stroke-width="18" stroke-linecap="round" stroke-linejoin="round"><path d="M24 150 L66 200 L118 56 L236 56 M150 98 L204 156 M204 98 L150 156"/></svg>',
   link: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M240,88.23a54.43,54.43,0,0,1-16,37L189.25,160a54.27,54.27,0,0,1-38.63,16h-.05A54.63,54.63,0,0,1,96,119.84a8,8,0,0,1,16,.45A38.62,38.62,0,0,0,150.58,160h0a38.39,38.39,0,0,0,27.31-11.31l34.75-34.75a38.63,38.63,0,0,0-54.63-54.63l-11,11A8,8,0,0,1,135.7,59l11-11A54.65,54.65,0,0,1,224,48,54.86,54.86,0,0,1,240,88.23ZM109,185.66l-11,11A38.41,38.41,0,0,1,70.6,208h0a38.63,38.63,0,0,1-27.29-65.94L78,107.31A38.63,38.63,0,0,1,144,135.71a8,8,0,0,0,16,.45A54.86,54.86,0,0,0,144,96a54.65,54.65,0,0,0-77.27,0L32,130.75A54.62,54.62,0,0,0,70.56,224h0a54.28,54.28,0,0,0,38.64-16l11-11A8,8,0,0,0,109,185.66Z"/></svg>',
   // --- Format: Block ---
   paragraph: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" fill="currentColor"><path d="M208,40H96a64,64,0,0,0,0,128h40v40a8,8,0,0,0,16,0V56h24V208a8,8,0,0,0,16,0V56h16a8,8,0,0,0,0-16ZM136,152H96a48,48,0,0,1,0-96h40Z"/></svg>',
@@ -5525,7 +5551,7 @@ var Heading = Node2.create({
   },
   renderHTML({ node, HTMLAttributes }) {
     const level = node.attrs["level"];
-    const validLevel = this.options.levels.includes(level) ? level : this.options.levels[0];
+    const validLevel = this.options.levels.includes(level) ? level : this.options.levels[0] ?? 1;
     return [`h${String(validLevel)}`, { ...this.options.HTMLAttributes, ...HTMLAttributes }, 0];
   },
   addCommands() {
@@ -9409,7 +9435,7 @@ var TextColor = Extension.create({
         return commands.setMark("textStyle", { color, colorToken: null });
       },
       unsetTextColor: () => ({ commands }) => {
-        if (!commands.setMark("textStyle", { color: null })) return false;
+        if (!commands.setMark("textStyle", { color: null, colorToken: null })) return false;
         commands.removeEmptyTextStyle();
         return true;
       },
@@ -9554,7 +9580,7 @@ var Highlight = Extension.create({
         return commands.setMark("textStyle", { backgroundColor: color, backgroundColorToken: null });
       },
       unsetHighlight: () => ({ commands }) => {
-        if (!commands.setMark("textStyle", { backgroundColor: null })) return false;
+        if (!commands.setMark("textStyle", { backgroundColor: null, backgroundColorToken: null })) return false;
         commands.removeEmptyTextStyle();
         return true;
       },
@@ -10622,6 +10648,7 @@ exports.outdentBlockFromListItem = outdentBlockFromListItem;
 exports.placeholderPluginKey = placeholderPluginKey;
 exports.positionFloating = positionFloating;
 exports.positionFloatingOnce = positionFloatingOnce;
+exports.refocusEditorAfterCommand = refocusEditorAfterCommand;
 exports.resetAttributes = resetAttributes;
 exports.selectAll = selectAll;
 exports.selectNodeBackward = selectNodeBackward;