@harbour-enterprises/superdoc 1.0.0-next.2 → 1.0.0-next.3

package/dist/superdoc.umd.js

@@ -42428,7 +42428,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     static getStoredSuperdocVersion(docx) {
       return _SuperConverter2.getStoredCustomProperty(docx, "SuperdocVersion");
     }
-    static setStoredSuperdocVersion(docx = this.convertedXml, version2 = "1.0.0-next.2") {
+    static setStoredSuperdocVersion(docx = this.convertedXml, version2 = "1.0.0-next.3") {
       return _SuperConverter2.setStoredCustomProperty(docx, "SuperdocVersion", version2, false);
     }
     /**
@@ -66424,28 +66424,28 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     }
     return false;
   };
-  function canRenderFont(fontName, fallbackFont = "sans-serif") {
-    const _canRenderFont = (fontName2, fallbackFont2) => {
+  function canRenderFont(fontName, uiDisplayFallbackFont = "sans-serif") {
+    const _canRenderFont = (fontName2, uiDisplayFallbackFont2) => {
       const canvas2 = document.createElement("canvas");
       const ctx2 = canvas2.getContext("2d");
       ctx2.textBaseline = "top";
       const text2 = "abcdefghijklmnopqrstuvwxyz0123456789";
-      ctx2.font = `72px ${fallbackFont2}`;
+      ctx2.font = `72px ${uiDisplayFallbackFont2}`;
       const initialTextMeasurement = ctx2.measureText(text2);
       const fallbackWidth = initialTextMeasurement.width;
       const fallbackHeight = initialTextMeasurement.actualBoundingBoxDescent;
-      ctx2.font = `72px "${fontName2}", ${fallbackFont2}`;
+      ctx2.font = `72px "${fontName2}", ${uiDisplayFallbackFont2}`;
       const customTextMeasurement = ctx2.measureText(text2);
       const customFontWidth = customTextMeasurement.width;
       const customFontHeight = customTextMeasurement.actualBoundingBoxDescent;
       const isAvailable = customFontWidth !== fallbackWidth || customFontHeight !== fallbackHeight;
       return isAvailable;
     };
-    if (_canRenderFont(fontName, fallbackFont)) {
+    if (_canRenderFont(fontName, uiDisplayFallbackFont)) {
       return true;
     }
-    const oppositeFallbackFont = fallbackFont === "sans-serif" ? "serif" : "sans-serif";
-    return _canRenderFont(fontName, oppositeFallbackFont);
+    const oppositeUiDisplayFallbackFont = uiDisplayFallbackFont === "sans-serif" ? "serif" : "sans-serif";
+    return _canRenderFont(fontName, oppositeUiDisplayFallbackFont);
   }
   const { findChildren: findChildren$3 } = helpers;
   function getAllFieldAnnotations(state2) {
@@ -67513,7 +67513,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
   const shouldSkipNodeView = (editor) => {
     return isHeadless(editor);
   };
-  const summaryVersion = "1.0.0-next.2";
+  const summaryVersion = "1.0.0-next.3";
   const nodeKeys = ["group", "content", "marks", "inline", "atom", "defining", "code", "tableRole", "summary"];
   const markKeys = ["group", "inclusive", "excludes", "spanning", "code"];
   function mapAttributes(attrs) {
@@ -68302,7 +68302,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
         { default: remarkStringify2 },
         { default: remarkGfm2 }
       ] = await Promise.all([
-        Promise.resolve().then(() => indexBDVXUeCy),
+        Promise.resolve().then(() => indexDLOSgUP),
         Promise.resolve().then(() => indexDRCvimau),
         Promise.resolve().then(() => indexC_x_N6Uh),
         Promise.resolve().then(() => indexD_sWOSiG),
@@ -68507,7 +68507,7 @@ Please report this to https://github.com/markedjs/marked.`, e) {
      * Process collaboration migrations
      */
     processCollaborationMigrations() {
-      console.debug("[checkVersionMigrations] Current editor version", "1.0.0-next.2");
+      console.debug("[checkVersionMigrations] Current editor version", "1.0.0-next.3");
       if (!this.options.ydoc) return;
       const metaMap = this.options.ydoc.getMap("meta");
       let docVersion = metaMap.get("version");
@@ -76237,9 +76237,9 @@ Please report this to https://github.com/markedjs/marked.`, e) {
     const font = findFirstTextFont(para.content);
     return font;
   };
-  const applyBaseRunDefaults = (run2, defaults2, fallbackFont, fallbackSize) => {
+  const applyBaseRunDefaults = (run2, defaults2, uiDisplayFallbackFont, fallbackSize) => {
     if (!run2) return;
-    if (defaults2.fontFamily && run2.fontFamily === fallbackFont) {
+    if (defaults2.fontFamily && run2.fontFamily === uiDisplayFallbackFont) {
       run2.fontFamily = defaults2.fontFamily;
     }
     if (defaults2.fontSizePx != null && run2.fontSize === fallbackSize) {
@@ -94076,8 +94076,8 @@ ${l}
       }
     }
     if (!currentLine && lines.length === 0) {
-      const fallbackFontSize = (block.runs[0]?.kind === "text" ? block.runs[0].fontSize : void 0) ?? 12;
-      const metrics = calculateTypographyMetrics(fallbackFontSize, spacing);
+      const uiDisplayFallbackFontSize = (block.runs[0]?.kind === "text" ? block.runs[0].fontSize : void 0) ?? 12;
+      const metrics = calculateTypographyMetrics(uiDisplayFallbackFontSize, spacing);
       const fallbackLine = {
         fromRun: 0,
         fromChar: 0,
@@ -118714,316 +118714,6 @@ ${l}
     paste: pasteIconSvg,
     strikethrough: strikethroughSvg
   };
-  const _hoisted_1$4$2 = { class: "toolbar-icon" };
-  const _hoisted_2$3$2 = ["innerHTML"];
-  const _sfc_main$5$2 = {
-    __name: "ToolbarButtonIcon",
-    props: {
-      name: {
-        type: String,
-        required: true
-      },
-      color: {
-        type: String,
-        default: null
-      },
-      icon: {
-        type: String,
-        default: null
-      }
-    },
-    setup(__props) {
-      const props = __props;
-      const getBarColor = computed(() => {
-        if (props.name === "color") return { backgroundColor: props.color || "#111111" };
-        if (props.name === "highlight") return { backgroundColor: props.color || "#D6D6D6" };
-      });
-      const hasColorBar = computed(() => {
-        return ["color", "highlight"].includes(props.name);
-      });
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", _hoisted_1$4$2, [
-          createBaseVNode("div", {
-            class: normalizeClass(["toolbar-icon__icon", [`toolbar-icon__icon--${props.name}`]]),
-            innerHTML: __props.icon
-          }, null, 10, _hoisted_2$3$2),
-          hasColorBar.value ? (openBlock(), createElementBlock("div", {
-            key: 0,
-            class: "color-bar",
-            style: normalizeStyle(getBarColor.value)
-          }, null, 4)) : createCommentVNode("", true)
-        ]);
-      };
-    }
-  };
-  const ToolbarButtonIcon = /* @__PURE__ */ _export_sfc$1(_sfc_main$5$2, [["__scopeId", "data-v-6d7523ab"]]);
-  const _hoisted_1$3$2 = ["role", "aria-label", "onKeydown"];
-  const _hoisted_2$2$2 = ["data-item"];
-  const _hoisted_3$2$2 = {
-    key: 1,
-    class: "button-label"
-  };
-  const _hoisted_4$1$2 = { key: 2 };
-  const _hoisted_5$5 = ["onKeydown", "id"];
-  const _hoisted_6$3 = ["placeholder", "onKeydown", "id"];
-  const _hoisted_7$3 = ["innerHTML"];
-  const _hoisted_8$3 = {
-    "aria-live": "polite",
-    class: "visually-hidden"
-  };
-  const _sfc_main$4$2 = {
-    __name: "ToolbarButton",
-    props: {
-      iconColor: {
-        type: String,
-        default: null
-      },
-      active: {
-        type: Boolean,
-        default: false
-      },
-      isNarrow: {
-        type: Boolean,
-        default: false
-      },
-      isWide: {
-        type: Boolean,
-        default: false
-      },
-      toolbarItem: {
-        type: Object,
-        required: true
-      },
-      defaultLabel: {
-        type: String,
-        default: null
-      },
-      isOverflowItem: {
-        type: Boolean,
-        default: false
-      }
-    },
-    emits: ["buttonClick", "textSubmit"],
-    setup(__props, { emit: __emit }) {
-      const emit2 = __emit;
-      const props = __props;
-      const {
-        name,
-        active,
-        icon,
-        label,
-        hideLabel,
-        iconColor,
-        hasCaret,
-        disabled,
-        inlineTextInputVisible,
-        hasInlineTextInput,
-        minWidth,
-        style: style2,
-        attributes
-      } = props.toolbarItem;
-      const inlineTextInput = ref(label);
-      const inlineInput = ref(null);
-      const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode$1();
-      const handleClick2 = () => {
-        if (hasInlineTextInput) {
-          nextTick(() => {
-            inlineInput.value?.focus();
-            inlineInput.value?.select();
-          });
-        }
-        emit2("buttonClick");
-      };
-      const handleInputSubmit = () => {
-        const value = inlineTextInput.value;
-        const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
-        emit2("textSubmit", cleanValue);
-        inlineTextInput.value = cleanValue;
-      };
-      const getStyle = computed(() => {
-        if (style2.value) return style2.value;
-        return {
-          minWidth: props.minWidth
-        };
-      });
-      const caretIcon = computed(() => {
-        return active.value ? toolbarIcons.dropdownCaretUp : toolbarIcons.dropdownCaretDown;
-      });
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", {
-          class: normalizeClass(["toolbar-item", unref(attributes).className]),
-          style: normalizeStyle(getStyle.value),
-          role: __props.isOverflowItem ? "menuitem" : "button",
-          "aria-label": unref(attributes).ariaLabel,
-          onClick: handleClick2,
-          onKeydown: withKeys(withModifiers(handleClick2, ["stop"]), ["enter"]),
-          tabindex: "0"
-        }, [
-          createBaseVNode("div", {
-            class: normalizeClass(["toolbar-button", {
-              active: unref(active),
-              disabled: unref(disabled),
-              narrow: __props.isNarrow,
-              wide: __props.isWide,
-              "has-inline-text-input": unref(hasInlineTextInput),
-              "high-contrast": unref(isHighContrastMode2)
-            }]),
-            "data-item": `btn-${unref(name) || ""}`
-          }, [
-            unref(icon) ? (openBlock(), createBlock(ToolbarButtonIcon, {
-              key: 0,
-              color: unref(iconColor),
-              class: "toolbar-icon",
-              icon: unref(icon),
-              name: unref(name)
-            }, null, 8, ["color", "icon", "name"])) : createCommentVNode("", true),
-            unref(label) && !unref(hideLabel) && !unref(inlineTextInputVisible) ? (openBlock(), createElementBlock("div", _hoisted_3$2$2, toDisplayString(unref(label)), 1)) : createCommentVNode("", true),
-            unref(inlineTextInputVisible) ? (openBlock(), createElementBlock("span", _hoisted_4$1$2, [
-              unref(name) === "fontSize" ? withDirectives((openBlock(), createElementBlock("input", {
-                key: 0,
-                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inlineTextInput.value = $event),
-                onKeydown: withKeys(withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
-                type: "text",
-                class: normalizeClass(["button-text-input button-text-input--font-size", { "high-contrast": unref(isHighContrastMode2) }]),
-                id: "inlineTextInput-" + unref(name),
-                autocomplete: "off",
-                ref_key: "inlineInput",
-                ref: inlineInput
-              }, null, 42, _hoisted_5$5)), [
-                [vModelText, inlineTextInput.value]
-              ]) : withDirectives((openBlock(), createElementBlock("input", {
-                key: 1,
-                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inlineTextInput.value = $event),
-                placeholder: unref(label),
-                onKeydown: withKeys(withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
-                type: "text",
-                class: "button-text-input",
-                id: "inlineTextInput-" + unref(name),
-                autocomplete: "off",
-                ref_key: "inlineInput",
-                ref: inlineInput
-              }, null, 40, _hoisted_6$3)), [
-                [vModelText, inlineTextInput.value]
-              ])
-            ])) : createCommentVNode("", true),
-            unref(hasCaret) ? (openBlock(), createElementBlock("div", {
-              key: 3,
-              class: "dropdown-caret",
-              innerHTML: caretIcon.value,
-              style: normalizeStyle({ opacity: unref(disabled) ? 0.6 : 1 })
-            }, null, 12, _hoisted_7$3)) : createCommentVNode("", true),
-            createBaseVNode("div", _hoisted_8$3, toDisplayString(`${unref(attributes).ariaLabel} ${unref(active) ? "selected" : "unset"}`), 1)
-          ], 10, _hoisted_2$2$2)
-        ], 46, _hoisted_1$3$2);
-      };
-    }
-  };
-  const ToolbarButton = /* @__PURE__ */ _export_sfc$1(_sfc_main$4$2, [["__scopeId", "data-v-ea93b080"]]);
-  const _hoisted_1$2$2 = {
-    class: "toolbar-separator",
-    role: "separator",
-    "aria-label": "Toolbar separator"
-  };
-  const _sfc_main$3$2 = {
-    __name: "ToolbarSeparator",
-    props: {
-      active: {
-        type: Boolean,
-        default: false
-      }
-    },
-    emits: ["command"],
-    setup(__props, { emit: __emit }) {
-      const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode$1();
-      const getSeparatorColor = () => {
-        if (isHighContrastMode2.value) {
-          return "#000";
-        }
-        return "#dbdbdb";
-      };
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", _hoisted_1$2$2, [
-          createBaseVNode("div", {
-            class: "separator-inner",
-            style: normalizeStyle({ backgroundColor: getSeparatorColor() })
-          }, null, 4)
-        ]);
-      };
-    }
-  };
-  const ToolbarSeparator = /* @__PURE__ */ _export_sfc$1(_sfc_main$3$2, [["__scopeId", "data-v-4ef9aa18"]]);
-  const _hoisted_1$1$2 = { class: "overflow-menu" };
-  const _hoisted_2$1$2 = { class: "overflow-menu-trigger" };
-  const _hoisted_3$1$2 = {
-    key: 0,
-    class: "overflow-menu_items",
-    role: "group"
-  };
-  const _sfc_main$2$2 = {
-    __name: "OverflowMenu",
-    props: {
-      toolbarItem: {
-        type: Object,
-        required: true
-      },
-      overflowItems: {
-        type: Array,
-        required: true
-      }
-    },
-    emits: ["buttonClick", "close"],
-    setup(__props, { emit: __emit }) {
-      const { proxy } = getCurrentInstance();
-      const emit2 = __emit;
-      const props = __props;
-      const isOverflowMenuOpened = computed(() => props.toolbarItem.expand.value);
-      const hasOpenDropdown = ref(false);
-      const overflowToolbarItem = computed(() => ({
-        ...props.toolbarItem,
-        active: isOverflowMenuOpened.value
-      }));
-      const toggleOverflowMenu = () => {
-        emit2("buttonClick", props.toolbarItem);
-      };
-      const handleCommand = ({ item, argument }) => {
-        proxy.$toolbar.emitCommand({ item, argument });
-      };
-      const handleKeyDown2 = (e) => {
-        if (e.key === "Escape") {
-          if (isOverflowMenuOpened.value && !hasOpenDropdown.value) {
-            e.preventDefault();
-            emit2("close");
-          }
-        }
-      };
-      onMounted(() => {
-        document.addEventListener("keydown", handleKeyDown2, true);
-      });
-      onBeforeUnmount(() => {
-        document.removeEventListener("keydown", handleKeyDown2, true);
-      });
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", _hoisted_1$1$2, [
-          createBaseVNode("div", _hoisted_2$1$2, [
-            createVNode(ToolbarButton, {
-              "toolbar-item": overflowToolbarItem.value,
-              onButtonClick: toggleOverflowMenu
-            }, null, 8, ["toolbar-item"])
-          ]),
-          isOverflowMenuOpened.value ? (openBlock(), createElementBlock("div", _hoisted_3$1$2, [
-            createVNode(ButtonGroup, {
-              class: "superdoc-toolbar-overflow",
-              "toolbar-items": __props.overflowItems,
-              "from-overflow": "",
-              onCommand: handleCommand,
-              onDropdownUpdateShow: _cache[0] || (_cache[0] = ($event) => hasOpenDropdown.value = $event)
-            }, null, 8, ["toolbar-items"])
-          ])) : createCommentVNode("", true)
-        ]);
-      };
-    }
-  };
-  const OverflowMenu = /* @__PURE__ */ _export_sfc$1(_sfc_main$2$2, [["__scopeId", "data-v-ef28da92"]]);
   function plugin$1$1(options) {
     let _bPrefix = ".";
     let _ePrefix = "__";
@@ -122634,30 +122324,30 @@ ${style2}
   function useConfig$1(props = {}, options = {
     defaultBordered: true
   }) {
-    const NConfigProvider = inject(configProviderInjectionKey$1, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
     return {
       // NConfigProvider,
-      inlineThemeDisabled: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.inlineThemeDisabled,
-      mergedRtlRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedRtlRef,
-      mergedComponentPropsRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedComponentPropsRef,
-      mergedBreakpointsRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedBreakpointsRef,
+      inlineThemeDisabled: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.inlineThemeDisabled,
+      mergedRtlRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedRtlRef,
+      mergedComponentPropsRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef,
+      mergedBreakpointsRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBreakpointsRef,
       mergedBorderedRef: computed(() => {
         var _a2, _b2;
         const {
           bordered
         } = props;
         if (bordered !== void 0) return bordered;
-        return (_b2 = (_a2 = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedBorderedRef.value) !== null && _a2 !== void 0 ? _a2 : options.defaultBordered) !== null && _b2 !== void 0 ? _b2 : true;
+        return (_b2 = (_a2 = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBorderedRef.value) !== null && _a2 !== void 0 ? _a2 : options.defaultBordered) !== null && _b2 !== void 0 ? _b2 : true;
       }),
-      mergedClsPrefixRef: NConfigProvider ? NConfigProvider.mergedClsPrefixRef : shallowRef(defaultClsPrefix$1),
-      namespaceRef: computed(() => NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedNamespaceRef.value)
+      mergedClsPrefixRef: NConfigProvider2 ? NConfigProvider2.mergedClsPrefixRef : shallowRef(defaultClsPrefix$1),
+      namespaceRef: computed(() => NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedNamespaceRef.value)
     };
   }
   function useThemeClass$1(componentName, hashRef, cssVarsRef, props) {
     if (!cssVarsRef) throwError$1("useThemeClass", "cssVarsRef is not passed");
-    const NConfigProvider = inject(configProviderInjectionKey$1, null);
-    const mergedThemeHashRef = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeHashRef;
-    const styleMountTarget = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget;
+    const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
+    const mergedThemeHashRef = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeHashRef;
+    const styleMountTarget = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget;
     const themeClassRef = ref("");
     const ssrAdapter2 = useSsrAdapter$1();
     let renderCallback;
@@ -124002,7 +123692,7 @@ ${style2}
       }
       return componentRtlState;
     });
-    const NConfigProvider = inject(configProviderInjectionKey$1, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
     const mountStyle = () => {
       watchEffect(() => {
         const {
@@ -124022,7 +123712,7 @@ ${style2}
             bPrefix: clsPrefix ? `.${clsPrefix}-` : void 0
           },
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
       });
     };
@@ -124080,7 +123770,7 @@ ${style2}
   }
   function useTheme$1(resolveId, mountId, style2, defaultTheme, props, clsPrefixRef) {
     const ssrAdapter2 = useSsrAdapter$1();
-    const NConfigProvider = inject(configProviderInjectionKey$1, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
     if (style2) {
       const mountStyle = () => {
         const clsPrefix = clsPrefixRef === null || clsPrefixRef === void 0 ? void 0 : clsPrefixRef.value;
@@ -124092,15 +123782,15 @@ ${style2}
           },
           anchorMetaName: cssrAnchorMetaName$2,
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
-        if (!(NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.preflightStyleDisabled)) {
+        if (!(NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled)) {
           globalStyle$1.mount({
             id: "n-global",
             head: true,
             anchorMetaName: cssrAnchorMetaName$2,
             ssr: ssrAdapter2,
-            parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+            parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
           });
         }
       };
@@ -124132,11 +123822,11 @@ ${style2}
           self: globalSelf = void 0,
           peers: globalPeers = {}
         } = {}
-      } = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeRef.value) || {};
+      } = (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeRef.value) || {};
       const {
         common: globalCommonOverrides = void 0,
         [resolveId]: globalSelfOverrides = {}
-      } = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeOverridesRef.value) || {};
+      } = (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value) || {};
       const {
         common: globalSelfCommonOverrides,
         peers: globalPeersOverrides = {}
@@ -126894,6 +126584,209 @@ ${style2}
       });
     }
   });
+  const configProviderProps$1 = {
+    abstract: Boolean,
+    bordered: {
+      type: Boolean,
+      default: void 0
+    },
+    clsPrefix: String,
+    locale: Object,
+    dateLocale: Object,
+    namespace: String,
+    rtl: Array,
+    tag: {
+      type: String,
+      default: "div"
+    },
+    hljs: Object,
+    katex: Object,
+    theme: Object,
+    themeOverrides: Object,
+    componentOptions: Object,
+    icons: Object,
+    breakpoints: Object,
+    preflightStyleDisabled: Boolean,
+    styleMountTarget: Object,
+    inlineThemeDisabled: {
+      type: Boolean,
+      default: void 0
+    },
+    // deprecated
+    as: {
+      type: String,
+      validator: () => {
+        warn$3("config-provider", "`as` is deprecated, please use `tag` instead.");
+        return true;
+      },
+      default: void 0
+    }
+  };
+  const NConfigProvider$1 = /* @__PURE__ */ defineComponent({
+    name: "ConfigProvider",
+    alias: ["App"],
+    props: configProviderProps$1,
+    setup(props) {
+      const NConfigProvider2 = inject(configProviderInjectionKey$1, null);
+      const mergedThemeRef = computed(() => {
+        const {
+          theme
+        } = props;
+        if (theme === null) return void 0;
+        const inheritedTheme = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeRef.value;
+        return theme === void 0 ? inheritedTheme : inheritedTheme === void 0 ? theme : Object.assign({}, inheritedTheme, theme);
+      });
+      const mergedThemeOverridesRef = computed(() => {
+        const {
+          themeOverrides
+        } = props;
+        if (themeOverrides === null) return void 0;
+        if (themeOverrides === void 0) {
+          return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value;
+        } else {
+          const inheritedThemeOverrides = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value;
+          if (inheritedThemeOverrides === void 0) {
+            return themeOverrides;
+          } else {
+            return merge$1$1({}, inheritedThemeOverrides, themeOverrides);
+          }
+        }
+      });
+      const mergedNamespaceRef = useMemo$1(() => {
+        const {
+          namespace: namespace2
+        } = props;
+        return namespace2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedNamespaceRef.value : namespace2;
+      });
+      const mergedBorderedRef = useMemo$1(() => {
+        const {
+          bordered
+        } = props;
+        return bordered === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBorderedRef.value : bordered;
+      });
+      const mergedIconsRef = computed(() => {
+        const {
+          icons: icons2
+        } = props;
+        return icons2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedIconsRef.value : icons2;
+      });
+      const mergedComponentPropsRef = computed(() => {
+        const {
+          componentOptions
+        } = props;
+        if (componentOptions !== void 0) return componentOptions;
+        return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef.value;
+      });
+      const mergedClsPrefixRef = computed(() => {
+        const {
+          clsPrefix
+        } = props;
+        if (clsPrefix !== void 0) return clsPrefix;
+        if (NConfigProvider2) return NConfigProvider2.mergedClsPrefixRef.value;
+        return defaultClsPrefix$1;
+      });
+      const mergedRtlRef = computed(() => {
+        var _a2;
+        const {
+          rtl
+        } = props;
+        if (rtl === void 0) {
+          return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedRtlRef.value;
+        }
+        const rtlEnabledState = {};
+        for (const rtlInfo of rtl) {
+          rtlEnabledState[rtlInfo.name] = markRaw(rtlInfo);
+          (_a2 = rtlInfo.peers) === null || _a2 === void 0 ? void 0 : _a2.forEach((peerRtlInfo) => {
+            if (!(peerRtlInfo.name in rtlEnabledState)) {
+              rtlEnabledState[peerRtlInfo.name] = markRaw(peerRtlInfo);
+            }
+          });
+        }
+        return rtlEnabledState;
+      });
+      const mergedBreakpointsRef = computed(() => {
+        return props.breakpoints || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBreakpointsRef.value);
+      });
+      const inlineThemeDisabled = props.inlineThemeDisabled || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.inlineThemeDisabled);
+      const preflightStyleDisabled = props.preflightStyleDisabled || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled);
+      const styleMountTarget = props.styleMountTarget || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget);
+      const mergedThemeHashRef = computed(() => {
+        const {
+          value: theme
+        } = mergedThemeRef;
+        const {
+          value: mergedThemeOverrides
+        } = mergedThemeOverridesRef;
+        const hasThemeOverrides = mergedThemeOverrides && Object.keys(mergedThemeOverrides).length !== 0;
+        const themeName = theme === null || theme === void 0 ? void 0 : theme.name;
+        if (themeName) {
+          if (hasThemeOverrides) {
+            return `${themeName}-${murmur2$1(JSON.stringify(mergedThemeOverridesRef.value))}`;
+          }
+          return themeName;
+        } else {
+          if (hasThemeOverrides) {
+            return murmur2$1(JSON.stringify(mergedThemeOverridesRef.value));
+          }
+          return "";
+        }
+      });
+      provide(configProviderInjectionKey$1, {
+        mergedThemeHashRef,
+        mergedBreakpointsRef,
+        mergedRtlRef,
+        mergedIconsRef,
+        mergedComponentPropsRef,
+        mergedBorderedRef,
+        mergedNamespaceRef,
+        mergedClsPrefixRef,
+        mergedLocaleRef: computed(() => {
+          const {
+            locale
+          } = props;
+          if (locale === null) return void 0;
+          return locale === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedLocaleRef.value : locale;
+        }),
+        mergedDateLocaleRef: computed(() => {
+          const {
+            dateLocale
+          } = props;
+          if (dateLocale === null) return void 0;
+          return dateLocale === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedDateLocaleRef.value : dateLocale;
+        }),
+        mergedHljsRef: computed(() => {
+          const {
+            hljs
+          } = props;
+          return hljs === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedHljsRef.value : hljs;
+        }),
+        mergedKatexRef: computed(() => {
+          const {
+            katex
+          } = props;
+          return katex === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedKatexRef.value : katex;
+        }),
+        mergedThemeRef,
+        mergedThemeOverridesRef,
+        inlineThemeDisabled: inlineThemeDisabled || false,
+        preflightStyleDisabled: preflightStyleDisabled || false,
+        styleMountTarget
+      });
+      return {
+        mergedClsPrefix: mergedClsPrefixRef,
+        mergedBordered: mergedBorderedRef,
+        mergedNamespace: mergedNamespaceRef,
+        mergedTheme: mergedThemeRef,
+        mergedThemeOverrides: mergedThemeOverridesRef
+      };
+    },
+    render() {
+      var _a2, _b2, _c, _d;
+      return !this.abstract ? h$1(this.as || this.tag, {
+        class: `${this.mergedClsPrefix || defaultClsPrefix$1}-config-provider`
+      }, (_b2 = (_a2 = this.$slots).default) === null || _b2 === void 0 ? void 0 : _b2.call(_a2)) : (_d = (_c = this.$slots).default) === null || _d === void 0 ? void 0 : _d.call(_c);
+    }
+  });
   const commonVariables$5 = {
     padding: "4px 0",
     optionIconSizeSmall: "14px",
@@ -128371,6 +128264,316 @@ ${style2}
       return child;
     }
   });
+  const _hoisted_1$4$2 = { class: "toolbar-icon" };
+  const _hoisted_2$3$2 = ["innerHTML"];
+  const _sfc_main$5$2 = {
+    __name: "ToolbarButtonIcon",
+    props: {
+      name: {
+        type: String,
+        required: true
+      },
+      color: {
+        type: String,
+        default: null
+      },
+      icon: {
+        type: String,
+        default: null
+      }
+    },
+    setup(__props) {
+      const props = __props;
+      const getBarColor = computed(() => {
+        if (props.name === "color") return { backgroundColor: props.color || "#111111" };
+        if (props.name === "highlight") return { backgroundColor: props.color || "#D6D6D6" };
+      });
+      const hasColorBar = computed(() => {
+        return ["color", "highlight"].includes(props.name);
+      });
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", _hoisted_1$4$2, [
+          createBaseVNode("div", {
+            class: normalizeClass(["toolbar-icon__icon", [`toolbar-icon__icon--${props.name}`]]),
+            innerHTML: __props.icon
+          }, null, 10, _hoisted_2$3$2),
+          hasColorBar.value ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: "color-bar",
+            style: normalizeStyle(getBarColor.value)
+          }, null, 4)) : createCommentVNode("", true)
+        ]);
+      };
+    }
+  };
+  const ToolbarButtonIcon = /* @__PURE__ */ _export_sfc$1(_sfc_main$5$2, [["__scopeId", "data-v-6d7523ab"]]);
+  const _hoisted_1$3$2 = ["role", "aria-label", "onKeydown"];
+  const _hoisted_2$2$2 = ["data-item"];
+  const _hoisted_3$2$2 = {
+    key: 1,
+    class: "button-label"
+  };
+  const _hoisted_4$1$2 = { key: 2 };
+  const _hoisted_5$5 = ["onKeydown", "id"];
+  const _hoisted_6$3 = ["placeholder", "onKeydown", "id"];
+  const _hoisted_7$3 = ["innerHTML"];
+  const _hoisted_8$3 = {
+    "aria-live": "polite",
+    class: "visually-hidden"
+  };
+  const _sfc_main$4$2 = {
+    __name: "ToolbarButton",
+    props: {
+      iconColor: {
+        type: String,
+        default: null
+      },
+      active: {
+        type: Boolean,
+        default: false
+      },
+      isNarrow: {
+        type: Boolean,
+        default: false
+      },
+      isWide: {
+        type: Boolean,
+        default: false
+      },
+      toolbarItem: {
+        type: Object,
+        required: true
+      },
+      defaultLabel: {
+        type: String,
+        default: null
+      },
+      isOverflowItem: {
+        type: Boolean,
+        default: false
+      }
+    },
+    emits: ["buttonClick", "textSubmit"],
+    setup(__props, { emit: __emit }) {
+      const emit2 = __emit;
+      const props = __props;
+      const {
+        name,
+        active,
+        icon,
+        label,
+        hideLabel,
+        iconColor,
+        hasCaret,
+        disabled,
+        inlineTextInputVisible,
+        hasInlineTextInput,
+        minWidth,
+        style: style2,
+        attributes
+      } = props.toolbarItem;
+      const inlineTextInput = ref(label);
+      const inlineInput = ref(null);
+      const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode$1();
+      const handleClick2 = () => {
+        if (hasInlineTextInput) {
+          nextTick(() => {
+            inlineInput.value?.focus();
+            inlineInput.value?.select();
+          });
+        }
+        emit2("buttonClick");
+      };
+      const handleInputSubmit = () => {
+        const value = inlineTextInput.value;
+        const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
+        emit2("textSubmit", cleanValue);
+        inlineTextInput.value = cleanValue;
+      };
+      const getStyle = computed(() => {
+        if (style2.value) return style2.value;
+        return {
+          minWidth: props.minWidth
+        };
+      });
+      const caretIcon = computed(() => {
+        return active.value ? toolbarIcons.dropdownCaretUp : toolbarIcons.dropdownCaretDown;
+      });
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", {
+          class: normalizeClass(["toolbar-item", unref(attributes).className]),
+          style: normalizeStyle(getStyle.value),
+          role: __props.isOverflowItem ? "menuitem" : "button",
+          "aria-label": unref(attributes).ariaLabel,
+          onClick: handleClick2,
+          onKeydown: withKeys(withModifiers(handleClick2, ["stop"]), ["enter"]),
+          tabindex: "0"
+        }, [
+          createBaseVNode("div", {
+            class: normalizeClass(["toolbar-button", {
+              active: unref(active),
+              disabled: unref(disabled),
+              narrow: __props.isNarrow,
+              wide: __props.isWide,
+              "has-inline-text-input": unref(hasInlineTextInput),
+              "high-contrast": unref(isHighContrastMode2)
+            }]),
+            "data-item": `btn-${unref(name) || ""}`
+          }, [
+            unref(icon) ? (openBlock(), createBlock(ToolbarButtonIcon, {
+              key: 0,
+              color: unref(iconColor),
+              class: "toolbar-icon",
+              icon: unref(icon),
+              name: unref(name)
+            }, null, 8, ["color", "icon", "name"])) : createCommentVNode("", true),
+            unref(label) && !unref(hideLabel) && !unref(inlineTextInputVisible) ? (openBlock(), createElementBlock("div", _hoisted_3$2$2, toDisplayString(unref(label)), 1)) : createCommentVNode("", true),
+            unref(inlineTextInputVisible) ? (openBlock(), createElementBlock("span", _hoisted_4$1$2, [
+              unref(name) === "fontSize" ? withDirectives((openBlock(), createElementBlock("input", {
+                key: 0,
+                "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inlineTextInput.value = $event),
+                onKeydown: withKeys(withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
+                type: "text",
+                class: normalizeClass(["button-text-input button-text-input--font-size", { "high-contrast": unref(isHighContrastMode2) }]),
+                id: "inlineTextInput-" + unref(name),
+                autocomplete: "off",
+                ref_key: "inlineInput",
+                ref: inlineInput
+              }, null, 42, _hoisted_5$5)), [
+                [vModelText, inlineTextInput.value]
+              ]) : withDirectives((openBlock(), createElementBlock("input", {
+                key: 1,
+                "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inlineTextInput.value = $event),
+                placeholder: unref(label),
+                onKeydown: withKeys(withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
+                type: "text",
+                class: "button-text-input",
+                id: "inlineTextInput-" + unref(name),
+                autocomplete: "off",
+                ref_key: "inlineInput",
+                ref: inlineInput
+              }, null, 40, _hoisted_6$3)), [
+                [vModelText, inlineTextInput.value]
+              ])
+            ])) : createCommentVNode("", true),
+            unref(hasCaret) ? (openBlock(), createElementBlock("div", {
+              key: 3,
+              class: "dropdown-caret",
+              innerHTML: caretIcon.value,
+              style: normalizeStyle({ opacity: unref(disabled) ? 0.6 : 1 })
+            }, null, 12, _hoisted_7$3)) : createCommentVNode("", true),
+            createBaseVNode("div", _hoisted_8$3, toDisplayString(`${unref(attributes).ariaLabel} ${unref(active) ? "selected" : "unset"}`), 1)
+          ], 10, _hoisted_2$2$2)
+        ], 46, _hoisted_1$3$2);
+      };
+    }
+  };
+  const ToolbarButton = /* @__PURE__ */ _export_sfc$1(_sfc_main$4$2, [["__scopeId", "data-v-ea93b080"]]);
+  const _hoisted_1$2$2 = {
+    class: "toolbar-separator",
+    role: "separator",
+    "aria-label": "Toolbar separator"
+  };
+  const _sfc_main$3$2 = {
+    __name: "ToolbarSeparator",
+    props: {
+      active: {
+        type: Boolean,
+        default: false
+      }
+    },
+    emits: ["command"],
+    setup(__props, { emit: __emit }) {
+      const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode$1();
+      const getSeparatorColor = () => {
+        if (isHighContrastMode2.value) {
+          return "#000";
+        }
+        return "#dbdbdb";
+      };
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", _hoisted_1$2$2, [
+          createBaseVNode("div", {
+            class: "separator-inner",
+            style: normalizeStyle({ backgroundColor: getSeparatorColor() })
+          }, null, 4)
+        ]);
+      };
+    }
+  };
+  const ToolbarSeparator = /* @__PURE__ */ _export_sfc$1(_sfc_main$3$2, [["__scopeId", "data-v-4ef9aa18"]]);
+  const _hoisted_1$1$2 = { class: "overflow-menu" };
+  const _hoisted_2$1$2 = { class: "overflow-menu-trigger" };
+  const _hoisted_3$1$2 = {
+    key: 0,
+    class: "overflow-menu_items",
+    role: "group"
+  };
+  const _sfc_main$2$2 = {
+    __name: "OverflowMenu",
+    props: {
+      toolbarItem: {
+        type: Object,
+        required: true
+      },
+      overflowItems: {
+        type: Array,
+        required: true
+      }
+    },
+    emits: ["buttonClick", "close"],
+    setup(__props, { emit: __emit }) {
+      const { proxy } = getCurrentInstance();
+      const emit2 = __emit;
+      const props = __props;
+      const isOverflowMenuOpened = computed(() => props.toolbarItem.expand.value);
+      const hasOpenDropdown = ref(false);
+      const overflowToolbarItem = computed(() => ({
+        ...props.toolbarItem,
+        active: isOverflowMenuOpened.value
+      }));
+      const toggleOverflowMenu = () => {
+        emit2("buttonClick", props.toolbarItem);
+      };
+      const handleCommand = ({ item, argument }) => {
+        proxy.$toolbar.emitCommand({ item, argument });
+      };
+      const handleKeyDown2 = (e) => {
+        if (e.key === "Escape") {
+          if (isOverflowMenuOpened.value && !hasOpenDropdown.value) {
+            e.preventDefault();
+            emit2("close");
+          }
+        }
+      };
+      onMounted(() => {
+        document.addEventListener("keydown", handleKeyDown2, true);
+      });
+      onBeforeUnmount(() => {
+        document.removeEventListener("keydown", handleKeyDown2, true);
+      });
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", _hoisted_1$1$2, [
+          createBaseVNode("div", _hoisted_2$1$2, [
+            createVNode(ToolbarButton, {
+              "toolbar-item": overflowToolbarItem.value,
+              onButtonClick: toggleOverflowMenu
+            }, null, 8, ["toolbar-item"])
+          ]),
+          isOverflowMenuOpened.value ? (openBlock(), createElementBlock("div", _hoisted_3$1$2, [
+            createVNode(ButtonGroup, {
+              class: "superdoc-toolbar-overflow",
+              "toolbar-items": __props.overflowItems,
+              "from-overflow": "",
+              onCommand: handleCommand,
+              onDropdownUpdateShow: _cache[0] || (_cache[0] = ($event) => hasOpenDropdown.value = $event)
+            }, null, 8, ["toolbar-items"])
+          ])) : createCommentVNode("", true)
+        ]);
+      };
+    }
+  };
+  const OverflowMenu = /* @__PURE__ */ _export_sfc$1(_sfc_main$2$2, [["__scopeId", "data-v-ef28da92"]]);
   const _hoisted_1$j = ["onKeydown", "tabindex", "data-item-id"];
   const _hoisted_2$c = { key: 0 };
   const _hoisted_3$a = { key: 0 };
@@ -128386,6 +128589,16 @@ ${style2}
         type: Array,
         default: () => []
       },
+      /**
+       * The font-family to use for UI elements like dropdowns and tooltips.
+       * This ensures consistent typography across toolbar UI components.
+       * @type {string}
+       * @default 'Arial, Helvetica, sans-serif'
+       */
+      uiFontFamily: {
+        type: String,
+        default: "Arial, Helvetica, sans-serif"
+      },
       position: {
         type: String,
         default: "left"
@@ -128578,6 +128791,7 @@ ${style2}
                 options: dropdownOptions(item),
                 trigger: item.disabled.value ? null : "click",
                 show: item.expand.value,
+                "content-style": { fontFamily: props.uiFontFamily },
                 size: "medium",
                 placement: "bottom-start",
                 class: normalizeClass(["toolbar-button toolbar-dropdown sd-editor-toolbar-dropdown", { "high-contrast": unref(isHighContrastMode2) }]),
@@ -128585,14 +128799,16 @@ ${style2}
                 onUpdateShow: handleDropdownUpdateShow,
                 style: normalizeStyle(item.dropdownStyles.value),
                 "menu-props": () => ({
-                  role: "menu"
+                  role: "menu",
+                  style: { fontFamily: props.uiFontFamily }
                 }),
                 "node-props": (option) => getDropdownAttributes(option, item)
               }, {
                 default: withCtx(() => [
                   createVNode(unref(NTooltip), {
                     trigger: "hover",
-                    disabled: !item.tooltip?.value
+                    disabled: !item.tooltip?.value,
+                    "content-style": { fontFamily: props.uiFontFamily }
                   }, {
                     trigger: withCtx(() => [
                       createVNode(ToolbarButton, {
@@ -128609,13 +128825,14 @@ ${style2}
                       ])
                     ]),
                     _: 2
-                  }, 1032, ["disabled"])
+                  }, 1032, ["disabled", "content-style"])
                 ]),
                 _: 2
-              }, 1032, ["options", "trigger", "show", "class", "onSelect", "style", "node-props"])) : isButton(item) ? (openBlock(), createBlock(unref(NTooltip), {
+              }, 1032, ["options", "trigger", "show", "content-style", "class", "onSelect", "style", "menu-props", "node-props"])) : isButton(item) ? (openBlock(), createBlock(unref(NTooltip), {
                 key: 2,
                 trigger: "hover",
-                class: "sd-editor-toolbar-tooltip"
+                class: "sd-editor-toolbar-tooltip",
+                "content-style": { fontFamily: props.uiFontFamily }
               }, {
                 trigger: withCtx(() => [
                   createVNode(ToolbarButton, {
@@ -128632,7 +128849,7 @@ ${style2}
                   ])) : createCommentVNode("", true)
                 ]),
                 _: 2
-              }, 1024)) : createCommentVNode("", true),
+              }, 1032, ["content-style"])) : createCommentVNode("", true),
               isOverflow(item) && __props.overflowItems.length ? (openBlock(), createBlock(OverflowMenu, {
                 key: 3,
                 "toolbar-item": item,
@@ -128646,13 +128863,21 @@ ${style2}
       };
     }
   };
-  const ButtonGroup = /* @__PURE__ */ _export_sfc$1(_sfc_main$1$2, [["__scopeId", "data-v-c80a1e51"]]);
+  const ButtonGroup = /* @__PURE__ */ _export_sfc$1(_sfc_main$1$2, [["__scopeId", "data-v-f732136c"]]);
+  const DEFAULT_UI_FONT_FAMILY$1 = "Arial, Helvetica, sans-serif";
   const _sfc_main$k = {
     __name: "Toolbar",
     emits: ["command", "toggle", "select"],
     setup(__props, { emit: __emit }) {
       const { proxy } = getCurrentInstance();
       let toolbarKey = ref(1);
+      const uiFontFamily = computed(() => {
+        const configured = proxy?.$toolbar?.config?.uiDisplayFallbackFont;
+        if (typeof configured === "string" && configured.trim()) {
+          return configured.trim();
+        }
+        return DEFAULT_UI_FONT_FAMILY$1;
+      });
       const showLeftSide = proxy.$toolbar.config?.toolbarGroups?.includes("left");
       const showRightSide = proxy.$toolbar.config?.toolbarGroups?.includes("right");
       const excludeButtonsList = proxy.$toolbar.config?.toolbarButtonsExclude || [];
@@ -128699,37 +128924,48 @@ ${style2}
           "aria-label": "Toolbar",
           "data-editor-ui-surface": ""
         }, [
-          unref(showLeftSide) ? (openBlock(), createBlock(ButtonGroup, {
-            key: 0,
-            tabindex: "0",
-            "toolbar-items": getFilteredItems("left"),
-            position: "left",
-            onCommand: handleCommand,
-            onItemClicked: restoreSelection2,
-            class: "superdoc-toolbar-group-side"
-          }, null, 8, ["toolbar-items"])) : createCommentVNode("", true),
-          createVNode(ButtonGroup, {
-            tabindex: "0",
-            "toolbar-items": getFilteredItems("center"),
-            "overflow-items": unref(proxy).$toolbar.overflowItems,
-            position: "center",
-            onCommand: handleCommand,
-            onItemClicked: restoreSelection2
-          }, null, 8, ["toolbar-items", "overflow-items"]),
-          unref(showRightSide) ? (openBlock(), createBlock(ButtonGroup, {
-            key: 1,
-            tabindex: "0",
-            "toolbar-items": getFilteredItems("right"),
-            position: "right",
-            onCommand: handleCommand,
-            onItemClicked: restoreSelection2,
-            class: "superdoc-toolbar-group-side"
-          }, null, 8, ["toolbar-items"])) : createCommentVNode("", true)
+          createVNode(unref(NConfigProvider$1), {
+            abstract: "",
+            "preflight-style-disabled": ""
+          }, {
+            default: withCtx(() => [
+              unref(showLeftSide) ? (openBlock(), createBlock(ButtonGroup, {
+                key: 0,
+                tabindex: "0",
+                "toolbar-items": getFilteredItems("left"),
+                "ui-font-family": uiFontFamily.value,
+                position: "left",
+                onCommand: handleCommand,
+                onItemClicked: restoreSelection2,
+                class: "superdoc-toolbar-group-side"
+              }, null, 8, ["toolbar-items", "ui-font-family"])) : createCommentVNode("", true),
+              createVNode(ButtonGroup, {
+                tabindex: "0",
+                "toolbar-items": getFilteredItems("center"),
+                "overflow-items": unref(proxy).$toolbar.overflowItems,
+                "ui-font-family": uiFontFamily.value,
+                position: "center",
+                onCommand: handleCommand,
+                onItemClicked: restoreSelection2
+              }, null, 8, ["toolbar-items", "overflow-items", "ui-font-family"]),
+              unref(showRightSide) ? (openBlock(), createBlock(ButtonGroup, {
+                key: 1,
+                tabindex: "0",
+                "toolbar-items": getFilteredItems("right"),
+                "ui-font-family": uiFontFamily.value,
+                position: "right",
+                onCommand: handleCommand,
+                onItemClicked: restoreSelection2,
+                class: "superdoc-toolbar-group-side"
+              }, null, 8, ["toolbar-items", "ui-font-family"])) : createCommentVNode("", true)
+            ]),
+            _: 1
+          })
         ]);
       };
     }
   };
-  const Toolbar = /* @__PURE__ */ _export_sfc$1(_sfc_main$k, [["__scopeId", "data-v-3f5ec271"]]);
+  const Toolbar = /* @__PURE__ */ _export_sfc$1(_sfc_main$k, [["__scopeId", "data-v-c7a72aa9"]]);
   const DEFAULT_API_ENDPOINT = "https://sd-dev-express-gateway-i6xtm.ondigitalocean.app/insights";
   const SYSTEM_PROMPT = "You are an expert copywriter and you are immersed in a document editor. You are to provide document related text responses based on the user prompts. Only write what is asked for. Do not provide explanations. Try to keep placeholders as short as possible. Do not output your prompt. Your instructions are: ";
   async function baseInsightsFetch(payload, options = {}) {
@@ -129246,7 +129482,7 @@ ${style2}
       };
     }
   };
-  const AIWriter = /* @__PURE__ */ _export_sfc$1(_sfc_main$j, [["__scopeId", "data-v-d869be75"]]);
+  const AIWriter = /* @__PURE__ */ _export_sfc$1(_sfc_main$j, [["__scopeId", "data-v-a4bc3d14"]]);
   async function createZip(blobs, fileNames) {
     const zip = new JSZip();
     blobs.forEach((blob, index2) => {
@@ -132095,6 +132331,10 @@ ${style2}
         this.config.selector = this.config.element;
       }
       this.toolbarContainer = this.findElementBySelector(this.config.selector);
+      if (this.toolbarContainer) {
+        const uiFontFamily = (this.config?.uiDisplayFallbackFont || "").toString().trim() || "Arial, Helvetica, sans-serif";
+        this.toolbarContainer.style.setProperty("--sd-ui-font-family", uiFontFamily);
+      }
       __privateMethod(this, _SuperToolbar_instances, initToolbarGroups_fn).call(this);
       __privateMethod(this, _SuperToolbar_instances, makeToolbarItems_fn).call(this, {
         superToolbar: this,
@@ -139076,6 +139316,62 @@ ${reason}`);
       handleTrackedChangeUpdate
     };
   });
+  const commentIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M512 240c0 114.9-114.6 208-256 208c-37.1 0-72.3-6.4-104.1-17.9c-11.9 8.7-31.3 20.6-54.3 30.6C73.6 471.1 44.7 480 16 480c-6.5 0-12.3-3.9-14.8-9.9c-2.5-6-1.1-12.8 3.4-17.4c0 0 0 0 0 0s0 0 0 0s0 0 0 0c0 0 0 0 0 0l.3-.3c.3-.3 .7-.7 1.3-1.4c1.1-1.2 2.8-3.1 4.9-5.7c4.1-5 9.6-12.4 15.2-21.6c10-16.6 19.5-38.4 21.4-62.9C17.7 326.8 0 285.1 0 240C0 125.1 114.6 32 256 32s256 93.1 256 208z"/></svg>';
+  const caretDownIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z"/></svg>';
+  const userCheckIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM0 482.3C0 383.8 79.8 304 178.3 304l91.4 0C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7L29.7 512C13.3 512 0 498.7 0 482.3zM625 177L497 305c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L591 143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z"/></svg>';
+  const usersIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M144 0a80 80 0 1 1 0 160A80 80 0 1 1 144 0zM512 0a80 80 0 1 1 0 160A80 80 0 1 1 512 0zM0 298.7C0 239.8 47.8 192 106.7 192l42.7 0c15.9 0 31 3.5 44.6 9.7c-1.3 7.2-1.9 14.7-1.9 22.3c0 38.2 16.8 72.5 43.3 96c-.2 0-.4 0-.7 0L21.3 320C9.6 320 0 310.4 0 298.7zM405.3 320c-.2 0-.4 0-.7 0c26.6-23.5 43.3-57.8 43.3-96c0-7.6-.7-15-1.9-22.3c13.6-6.3 28.7-9.7 44.6-9.7l42.7 0C592.2 192 640 239.8 640 298.7c0 11.8-9.6 21.3-21.3 21.3l-213.3 0zM224 224a96 96 0 1 1 192 0 96 96 0 1 1 -192 0zM128 485.3C128 411.7 187.7 352 261.3 352l117.3 0C452.3 352 512 411.7 512 485.3c0 14.7-11.9 26.7-26.7 26.7l-330.7 0c-14.7 0-26.7-11.9-26.7-26.7z"/></svg>';
+  const checkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"/></svg>';
+  const xmarkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/></svg>';
+  const ellipsisVerticalSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z"/></svg>';
+  const superdocIcons = {
+    comment: commentIconSvg,
+    caretDown: caretDownIconSvg,
+    internal: userCheckIconSvg,
+    external: usersIconSvg,
+    markDone: checkIconSvg,
+    acceptChange: checkIconSvg,
+    rejectChange: xmarkIconSvg,
+    overflow: ellipsisVerticalSvg
+  };
+  const _export_sfc = (sfc, props) => {
+    const target = sfc.__vccOpts || sfc;
+    for (const [key2, val] of props) {
+      target[key2] = val;
+    }
+    return target;
+  };
+  const _hoisted_1$g = { class: "user-container" };
+  const _hoisted_2$9 = ["src"];
+  const _hoisted_3$7 = {
+    key: 1,
+    class: "user-bg"
+  };
+  const _sfc_main$h = {
+    __name: "Avatar",
+    props: {
+      user: {
+        type: Object,
+        required: true
+      }
+    },
+    setup(__props) {
+      const getInitials2 = (name, email) => {
+        if (!name && !email) return;
+        const firstLetter = name?.substring(0, 1) || email?.substring(0, 1) || null;
+        return firstLetter;
+      };
+      return (_ctx, _cache) => {
+        return openBlock(), createElementBlock("div", _hoisted_1$g, [
+          __props.user.image ? (openBlock(), createElementBlock("img", {
+            key: 0,
+            class: "user-bg",
+            src: __props.user.image.startsWith("http") ? __props.user.image : `data:image/png;base64,${__props.user.image}`
+          }, null, 8, _hoisted_2$9)) : (openBlock(), createElementBlock("span", _hoisted_3$7, toDisplayString(getInitials2(__props.user.name, __props.user.email)), 1))
+        ]);
+      };
+    }
+  };
+  const Avatar = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-53e13009"]]);
   function plugin$1(options) {
     let _bPrefix = ".";
     let _ePrefix = "__";
@@ -142663,30 +142959,30 @@ ${style2}
   function useConfig(props = {}, options = {
     defaultBordered: true
   }) {
-    const NConfigProvider = inject(configProviderInjectionKey, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
     return {
       // NConfigProvider,
-      inlineThemeDisabled: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.inlineThemeDisabled,
-      mergedRtlRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedRtlRef,
-      mergedComponentPropsRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedComponentPropsRef,
-      mergedBreakpointsRef: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedBreakpointsRef,
+      inlineThemeDisabled: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.inlineThemeDisabled,
+      mergedRtlRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedRtlRef,
+      mergedComponentPropsRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef,
+      mergedBreakpointsRef: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBreakpointsRef,
       mergedBorderedRef: computed(() => {
         var _a2, _b2;
         const {
           bordered
         } = props;
         if (bordered !== void 0) return bordered;
-        return (_b2 = (_a2 = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedBorderedRef.value) !== null && _a2 !== void 0 ? _a2 : options.defaultBordered) !== null && _b2 !== void 0 ? _b2 : true;
+        return (_b2 = (_a2 = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBorderedRef.value) !== null && _a2 !== void 0 ? _a2 : options.defaultBordered) !== null && _b2 !== void 0 ? _b2 : true;
       }),
-      mergedClsPrefixRef: NConfigProvider ? NConfigProvider.mergedClsPrefixRef : shallowRef(defaultClsPrefix),
-      namespaceRef: computed(() => NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedNamespaceRef.value)
+      mergedClsPrefixRef: NConfigProvider2 ? NConfigProvider2.mergedClsPrefixRef : shallowRef(defaultClsPrefix),
+      namespaceRef: computed(() => NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedNamespaceRef.value)
     };
   }
   function useThemeClass(componentName, hashRef, cssVarsRef, props) {
     if (!cssVarsRef) throwError("useThemeClass", "cssVarsRef is not passed");
-    const NConfigProvider = inject(configProviderInjectionKey, null);
-    const mergedThemeHashRef = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeHashRef;
-    const styleMountTarget = NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget;
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
+    const mergedThemeHashRef = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeHashRef;
+    const styleMountTarget = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget;
     const themeClassRef = ref("");
     const ssrAdapter2 = useSsrAdapter();
     let renderCallback;
@@ -144155,7 +144451,7 @@ ${style2}
       }
       return componentRtlState;
     });
-    const NConfigProvider = inject(configProviderInjectionKey, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
     const mountStyle = () => {
       watchEffect(() => {
         const {
@@ -144175,7 +144471,7 @@ ${style2}
             bPrefix: clsPrefix ? `.${clsPrefix}-` : void 0
           },
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
       });
     };
@@ -144233,7 +144529,7 @@ ${style2}
       return;
     }
     const ssrAdapter2 = useSsrAdapter();
-    const NConfigProvider = inject(configProviderInjectionKey, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
     const mountStyle = () => {
       const clsPrefix = clsPrefixRef.value;
       style2.mount({
@@ -144244,15 +144540,15 @@ ${style2}
           bPrefix: clsPrefix ? `.${clsPrefix}-` : void 0
         },
         ssr: ssrAdapter2,
-        parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+        parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
       });
-      if (!(NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.preflightStyleDisabled)) {
+      if (!(NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled)) {
         globalStyle.mount({
           id: "n-global",
           head: true,
           anchorMetaName: cssrAnchorMetaName,
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
       }
     };
@@ -144267,7 +144563,7 @@ ${style2}
   }
   function useTheme(resolveId, mountId, style2, defaultTheme, props, clsPrefixRef) {
     const ssrAdapter2 = useSsrAdapter();
-    const NConfigProvider = inject(configProviderInjectionKey, null);
+    const NConfigProvider2 = inject(configProviderInjectionKey, null);
     if (style2) {
       const mountStyle = () => {
         const clsPrefix = clsPrefixRef === null || clsPrefixRef === void 0 ? void 0 : clsPrefixRef.value;
@@ -144279,15 +144575,15 @@ ${style2}
           },
           anchorMetaName: cssrAnchorMetaName,
           ssr: ssrAdapter2,
-          parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+          parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
         });
-        if (!(NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.preflightStyleDisabled)) {
+        if (!(NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled)) {
           globalStyle.mount({
             id: "n-global",
             head: true,
             anchorMetaName: cssrAnchorMetaName,
             ssr: ssrAdapter2,
-            parent: NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.styleMountTarget
+            parent: NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget
           });
         }
       };
@@ -144319,11 +144615,11 @@ ${style2}
           self: globalSelf = void 0,
           peers: globalPeers = {}
         } = {}
-      } = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeRef.value) || {};
+      } = (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeRef.value) || {};
       const {
         common: globalCommonOverrides = void 0,
         [resolveId]: globalSelfOverrides = {}
-      } = (NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedThemeOverridesRef.value) || {};
+      } = (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value) || {};
       const {
         common: globalSelfCommonOverrides,
         peers: globalPeersOverrides = {}
@@ -148129,6 +148425,209 @@ ${style2}
       }))), labelNode);
     }
   });
+  const configProviderProps = {
+    abstract: Boolean,
+    bordered: {
+      type: Boolean,
+      default: void 0
+    },
+    clsPrefix: String,
+    locale: Object,
+    dateLocale: Object,
+    namespace: String,
+    rtl: Array,
+    tag: {
+      type: String,
+      default: "div"
+    },
+    hljs: Object,
+    katex: Object,
+    theme: Object,
+    themeOverrides: Object,
+    componentOptions: Object,
+    icons: Object,
+    breakpoints: Object,
+    preflightStyleDisabled: Boolean,
+    styleMountTarget: Object,
+    inlineThemeDisabled: {
+      type: Boolean,
+      default: void 0
+    },
+    // deprecated
+    as: {
+      type: String,
+      validator: () => {
+        warn("config-provider", "`as` is deprecated, please use `tag` instead.");
+        return true;
+      },
+      default: void 0
+    }
+  };
+  const NConfigProvider = /* @__PURE__ */ defineComponent({
+    name: "ConfigProvider",
+    alias: ["App"],
+    props: configProviderProps,
+    setup(props) {
+      const NConfigProvider2 = inject(configProviderInjectionKey, null);
+      const mergedThemeRef = computed(() => {
+        const {
+          theme
+        } = props;
+        if (theme === null) return void 0;
+        const inheritedTheme = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeRef.value;
+        return theme === void 0 ? inheritedTheme : inheritedTheme === void 0 ? theme : Object.assign({}, inheritedTheme, theme);
+      });
+      const mergedThemeOverridesRef = computed(() => {
+        const {
+          themeOverrides
+        } = props;
+        if (themeOverrides === null) return void 0;
+        if (themeOverrides === void 0) {
+          return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value;
+        } else {
+          const inheritedThemeOverrides = NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedThemeOverridesRef.value;
+          if (inheritedThemeOverrides === void 0) {
+            return themeOverrides;
+          } else {
+            return merge$2({}, inheritedThemeOverrides, themeOverrides);
+          }
+        }
+      });
+      const mergedNamespaceRef = useMemo(() => {
+        const {
+          namespace: namespace2
+        } = props;
+        return namespace2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedNamespaceRef.value : namespace2;
+      });
+      const mergedBorderedRef = useMemo(() => {
+        const {
+          bordered
+        } = props;
+        return bordered === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBorderedRef.value : bordered;
+      });
+      const mergedIconsRef = computed(() => {
+        const {
+          icons: icons2
+        } = props;
+        return icons2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedIconsRef.value : icons2;
+      });
+      const mergedComponentPropsRef = computed(() => {
+        const {
+          componentOptions
+        } = props;
+        if (componentOptions !== void 0) return componentOptions;
+        return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef.value;
+      });
+      const mergedClsPrefixRef = computed(() => {
+        const {
+          clsPrefix
+        } = props;
+        if (clsPrefix !== void 0) return clsPrefix;
+        if (NConfigProvider2) return NConfigProvider2.mergedClsPrefixRef.value;
+        return defaultClsPrefix;
+      });
+      const mergedRtlRef = computed(() => {
+        var _a2;
+        const {
+          rtl
+        } = props;
+        if (rtl === void 0) {
+          return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedRtlRef.value;
+        }
+        const rtlEnabledState = {};
+        for (const rtlInfo of rtl) {
+          rtlEnabledState[rtlInfo.name] = markRaw(rtlInfo);
+          (_a2 = rtlInfo.peers) === null || _a2 === void 0 ? void 0 : _a2.forEach((peerRtlInfo) => {
+            if (!(peerRtlInfo.name in rtlEnabledState)) {
+              rtlEnabledState[peerRtlInfo.name] = markRaw(peerRtlInfo);
+            }
+          });
+        }
+        return rtlEnabledState;
+      });
+      const mergedBreakpointsRef = computed(() => {
+        return props.breakpoints || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedBreakpointsRef.value);
+      });
+      const inlineThemeDisabled = props.inlineThemeDisabled || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.inlineThemeDisabled);
+      const preflightStyleDisabled = props.preflightStyleDisabled || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.preflightStyleDisabled);
+      const styleMountTarget = props.styleMountTarget || (NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.styleMountTarget);
+      const mergedThemeHashRef = computed(() => {
+        const {
+          value: theme
+        } = mergedThemeRef;
+        const {
+          value: mergedThemeOverrides
+        } = mergedThemeOverridesRef;
+        const hasThemeOverrides = mergedThemeOverrides && Object.keys(mergedThemeOverrides).length !== 0;
+        const themeName = theme === null || theme === void 0 ? void 0 : theme.name;
+        if (themeName) {
+          if (hasThemeOverrides) {
+            return `${themeName}-${murmur2(JSON.stringify(mergedThemeOverridesRef.value))}`;
+          }
+          return themeName;
+        } else {
+          if (hasThemeOverrides) {
+            return murmur2(JSON.stringify(mergedThemeOverridesRef.value));
+          }
+          return "";
+        }
+      });
+      provide(configProviderInjectionKey, {
+        mergedThemeHashRef,
+        mergedBreakpointsRef,
+        mergedRtlRef,
+        mergedIconsRef,
+        mergedComponentPropsRef,
+        mergedBorderedRef,
+        mergedNamespaceRef,
+        mergedClsPrefixRef,
+        mergedLocaleRef: computed(() => {
+          const {
+            locale
+          } = props;
+          if (locale === null) return void 0;
+          return locale === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedLocaleRef.value : locale;
+        }),
+        mergedDateLocaleRef: computed(() => {
+          const {
+            dateLocale
+          } = props;
+          if (dateLocale === null) return void 0;
+          return dateLocale === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedDateLocaleRef.value : dateLocale;
+        }),
+        mergedHljsRef: computed(() => {
+          const {
+            hljs
+          } = props;
+          return hljs === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedHljsRef.value : hljs;
+        }),
+        mergedKatexRef: computed(() => {
+          const {
+            katex
+          } = props;
+          return katex === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedKatexRef.value : katex;
+        }),
+        mergedThemeRef,
+        mergedThemeOverridesRef,
+        inlineThemeDisabled: inlineThemeDisabled || false,
+        preflightStyleDisabled: preflightStyleDisabled || false,
+        styleMountTarget
+      });
+      return {
+        mergedClsPrefix: mergedClsPrefixRef,
+        mergedBordered: mergedBorderedRef,
+        mergedNamespace: mergedNamespaceRef,
+        mergedTheme: mergedThemeRef,
+        mergedThemeOverrides: mergedThemeOverridesRef
+      };
+    },
+    render() {
+      var _a2, _b2, _c, _d;
+      return !this.abstract ? h$1(this.as || this.tag, {
+        class: `${this.mergedClsPrefix || defaultClsPrefix}-config-provider`
+      }, (_b2 = (_a2 = this.$slots).default) === null || _b2 === void 0 ? void 0 : _b2.call(_a2)) : (_d = (_c = this.$slots).default) === null || _d === void 0 ? void 0 : _d.call(_c);
+    }
+  });
   const commonVariables$1 = {
     padding: "4px 0",
     optionIconSizeSmall: "14px",
@@ -150224,62 +150723,20 @@ ${style2}
       })) : icon;
     }
   });
-  const commentIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M512 240c0 114.9-114.6 208-256 208c-37.1 0-72.3-6.4-104.1-17.9c-11.9 8.7-31.3 20.6-54.3 30.6C73.6 471.1 44.7 480 16 480c-6.5 0-12.3-3.9-14.8-9.9c-2.5-6-1.1-12.8 3.4-17.4c0 0 0 0 0 0s0 0 0 0s0 0 0 0c0 0 0 0 0 0l.3-.3c.3-.3 .7-.7 1.3-1.4c1.1-1.2 2.8-3.1 4.9-5.7c4.1-5 9.6-12.4 15.2-21.6c10-16.6 19.5-38.4 21.4-62.9C17.7 326.8 0 285.1 0 240C0 125.1 114.6 32 256 32s256 93.1 256 208z"/></svg>';
-  const caretDownIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M137.4 374.6c12.5 12.5 32.8 12.5 45.3 0l128-128c9.2-9.2 11.9-22.9 6.9-34.9s-16.6-19.8-29.6-19.8L32 192c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9l128 128z"/></svg>';
-  const userCheckIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M96 128a128 128 0 1 1 256 0A128 128 0 1 1 96 128zM0 482.3C0 383.8 79.8 304 178.3 304l91.4 0C368.2 304 448 383.8 448 482.3c0 16.4-13.3 29.7-29.7 29.7L29.7 512C13.3 512 0 498.7 0 482.3zM625 177L497 305c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L591 143c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z"/></svg>';
-  const usersIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M144 0a80 80 0 1 1 0 160A80 80 0 1 1 144 0zM512 0a80 80 0 1 1 0 160A80 80 0 1 1 512 0zM0 298.7C0 239.8 47.8 192 106.7 192l42.7 0c15.9 0 31 3.5 44.6 9.7c-1.3 7.2-1.9 14.7-1.9 22.3c0 38.2 16.8 72.5 43.3 96c-.2 0-.4 0-.7 0L21.3 320C9.6 320 0 310.4 0 298.7zM405.3 320c-.2 0-.4 0-.7 0c26.6-23.5 43.3-57.8 43.3-96c0-7.6-.7-15-1.9-22.3c13.6-6.3 28.7-9.7 44.6-9.7l42.7 0C592.2 192 640 239.8 640 298.7c0 11.8-9.6 21.3-21.3 21.3l-213.3 0zM224 224a96 96 0 1 1 192 0 96 96 0 1 1 -192 0zM128 485.3C128 411.7 187.7 352 261.3 352l117.3 0C452.3 352 512 411.7 512 485.3c0 14.7-11.9 26.7-26.7 26.7l-330.7 0c-14.7 0-26.7-11.9-26.7-26.7z"/></svg>';
-  const checkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"/></svg>';
-  const xmarkIconSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/></svg>';
-  const ellipsisVerticalSvg = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 512"><!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z"/></svg>';
-  const superdocIcons = {
-    comment: commentIconSvg,
-    caretDown: caretDownIconSvg,
-    internal: userCheckIconSvg,
-    external: usersIconSvg,
-    markDone: checkIconSvg,
-    acceptChange: checkIconSvg,
-    rejectChange: xmarkIconSvg,
-    overflow: ellipsisVerticalSvg
-  };
-  const _export_sfc = (sfc, props) => {
-    const target = sfc.__vccOpts || sfc;
-    for (const [key2, val] of props) {
-      target[key2] = val;
-    }
-    return target;
-  };
-  const _hoisted_1$g = { class: "user-container" };
-  const _hoisted_2$9 = ["src"];
-  const _hoisted_3$7 = {
-    key: 1,
-    class: "user-bg"
-  };
-  const _sfc_main$h = {
-    __name: "Avatar",
-    props: {
-      user: {
-        type: Object,
-        required: true
+  const DEFAULT_UI_FONT_FAMILY = "Arial, Helvetica, sans-serif";
+  function useUiFontFamily() {
+    const instance = getCurrentInstance();
+    const uiFontFamily = computed(() => {
+      const configured = instance?.proxy?.$superdoc?.config?.uiDisplayFallbackFont;
+      if (typeof configured === "string" && configured.trim()) {
+        return configured.trim();
       }
-    },
-    setup(__props) {
-      const getInitials2 = (name, email) => {
-        if (!name && !email) return;
-        const firstLetter = name?.substring(0, 1) || email?.substring(0, 1) || null;
-        return firstLetter;
-      };
-      return (_ctx, _cache) => {
-        return openBlock(), createElementBlock("div", _hoisted_1$g, [
-          __props.user.image ? (openBlock(), createElementBlock("img", {
-            key: 0,
-            class: "user-bg",
-            src: __props.user.image.startsWith("http") ? __props.user.image : `data:image/png;base64,${__props.user.image}`
-          }, null, 8, _hoisted_2$9)) : (openBlock(), createElementBlock("span", _hoisted_3$7, toDisplayString(getInitials2(__props.user.name, __props.user.email)), 1))
-        ]);
-      };
-    }
-  };
-  const Avatar = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__scopeId", "data-v-53e13009"]]);
+      return DEFAULT_UI_FONT_FAMILY;
+    });
+    return {
+      uiFontFamily
+    };
+  }
   const _hoisted_1$f = { class: "comment-option" };
   const _hoisted_2$8 = ["innerHTML"];
   const _hoisted_3$6 = { class: "option-state" };
@@ -150300,6 +150757,7 @@ ${style2}
     setup(__props, { emit: __emit }) {
       const emit2 = __emit;
       const props = __props;
+      const { uiFontFamily } = useUiFontFamily();
       const renderIcon = (icon) => {
         return () => {
           return h$1("div", { innerHTML: icon, class: "internal-dropdown__item-icon" });
@@ -150361,7 +150819,8 @@ ${style2}
             trigger: "click",
             options,
             onSelect: _cache[0] || (_cache[0] = ($event) => handleSelect($event)),
-            disabled: __props.isDisabled
+            disabled: __props.isDisabled,
+            "content-style": { fontFamily: unref(uiFontFamily) }
           }, {
             default: withCtx(() => [
               createBaseVNode("div", _hoisted_1$f, [
@@ -150377,12 +150836,12 @@ ${style2}
               ])
             ]),
             _: 1
-          }, 8, ["disabled"])
+          }, 8, ["disabled", "content-style"])
         ], 4);
       };
     }
   };
-  const InternalDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-a88dddd9"]]);
+  const InternalDropdown = /* @__PURE__ */ _export_sfc(_sfc_main$g, [["__scopeId", "data-v-8b9e3b75"]]);
   function formatDate(timestamp) {
     const date = new Date(timestamp);
     const hours = date.getHours();
@@ -150528,6 +150987,7 @@ ${style2}
       const role = proxy.$superdoc.config.role;
       const isInternal = proxy.$superdoc.config.isInternal;
       const isOwnComment = props.comment.creatorEmail === proxy.$superdoc.config.user.email;
+      const { uiFontFamily } = useUiFontFamily();
       const OVERFLOW_OPTIONS = Object.freeze({
         edit: { label: "Edit", key: "edit" },
         delete: { label: "Delete", key: "delete" }
@@ -150631,7 +151091,8 @@ ${style2}
               key: 2,
               trigger: "click",
               options: getOverflowOptions.value,
-              onSelect: handleSelect
+              onSelect: handleSelect,
+              "content-style": { fontFamily: unref(uiFontFamily) }
             }, {
               default: withCtx(() => [
                 createBaseVNode("div", {
@@ -150646,13 +151107,13 @@ ${style2}
                 ])
               ]),
               _: 1
-            }, 8, ["options"])) : createCommentVNode("", true)
+            }, 8, ["options", "content-style"])) : createCommentVNode("", true)
           ])
         ]);
       };
     }
   };
-  const CommentHeader = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-0f4f53ef"]]);
+  const CommentHeader = /* @__PURE__ */ _export_sfc(_sfc_main$f, [["__scopeId", "data-v-5e404f08"]]);
   const _hoisted_1$d = { class: "input-section" };
   const _sfc_main$e = {
     __name: "CommentInput",
@@ -151072,7 +151533,7 @@ ${style2}
       };
     }
   };
-  const CommentDialog = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-36e5f63e"]]);
+  const CommentDialog = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-abfa4e05"]]);
   const _hoisted_1$b = { class: "comments-list" };
   const _hoisted_2$5 = { key: 0 };
   const _hoisted_3$3 = { class: "comment-item" };
@@ -151673,7 +152134,7 @@ ${style2}
       };
     }
   };
-  const SelectField = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-b8cacb22"]]);
+  const SelectField = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-1e49d9b3"]]);
   const floor = (val, precision) => {
     const multiplier = 10 ** precision;
     return Math.floor(val * multiplier) / multiplier;
@@ -152118,11 +152579,15 @@ ${style2}
       const { proxy } = getCurrentInstance();
       commentsStore.proxy = proxy;
       const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode();
+      const { uiFontFamily } = useUiFontFamily();
       const commentsModuleConfig = computed(() => {
         const config2 = modules.comments;
         if (config2 === false || config2 == null) return null;
         return config2;
       });
+      const superdocStyleVars = computed(() => ({
+        "--sd-ui-font-family": uiFontFamily.value
+      }));
       const layers = ref(null);
       const commentsLayer = ref(null);
       const toolsMenuPosition = reactive({ top: null, right: "-25px", zIndex: 101 });
@@ -152639,155 +153104,164 @@ ${style2}
       });
       return (_ctx, _cache) => {
         const _directive_click_outside = resolveDirective("click-outside");
-        return openBlock(), createElementBlock("div", {
-          class: normalizeClass(["superdoc", { "superdoc--with-sidebar": showCommentsSidebar.value, "high-contrast": unref(isHighContrastMode2) }])
-        }, [
-          createBaseVNode("div", {
-            class: "superdoc__layers layers",
-            ref_key: "layers",
-            ref: layers,
-            role: "group"
-          }, [
-            showToolsFloatingMenu.value ? (openBlock(), createElementBlock("div", {
-              key: 0,
-              class: "superdoc__tools tools",
-              style: normalizeStyle(toolsMenuPosition)
+        return openBlock(), createBlock(unref(NConfigProvider), {
+          abstract: "",
+          "preflight-style-disabled": ""
+        }, {
+          default: withCtx(() => [
+            createBaseVNode("div", {
+              class: normalizeClass(["superdoc", { "superdoc--with-sidebar": showCommentsSidebar.value, "high-contrast": unref(isHighContrastMode2) }]),
+              style: normalizeStyle(superdocStyleVars.value)
             }, [
               createBaseVNode("div", {
-                class: "tools-item",
-                "data-id": "is-tool",
-                onMousedown: _cache[0] || (_cache[0] = withModifiers(($event) => handleToolClick("comments"), ["stop", "prevent"]))
-              }, [
-                createBaseVNode("div", {
-                  class: "superdoc__tools-icon",
-                  innerHTML: unref(superdocIcons).comment
-                }, null, 8, _hoisted_1$1)
-              ], 32),
-              unref(proxy).$superdoc.config.modules.ai ? (openBlock(), createElementBlock("div", {
-                key: 0,
-                class: "tools-item",
-                "data-id": "is-tool",
-                onMousedown: _cache[1] || (_cache[1] = withModifiers(($event) => handleToolClick("ai"), ["stop", "prevent"]))
-              }, [..._cache[3] || (_cache[3] = [
-                createBaseVNode("div", { class: "superdoc__tools-icon ai-tool" }, null, -1)
-              ])], 32)) : createCommentVNode("", true)
-            ], 4)) : createCommentVNode("", true),
-            createBaseVNode("div", _hoisted_2, [
-              isCommentsEnabled.value ? (openBlock(), createElementBlock("div", {
-                key: 0,
-                class: "superdoc__selection-layer selection-layer",
-                onMousedown: handleSelectionStart,
-                onMouseup: handleDragEnd,
-                ref_key: "selectionLayer",
-                ref: selectionLayer
+                class: "superdoc__layers layers",
+                ref_key: "layers",
+                ref: layers,
+                role: "group"
               }, [
-                unref(selectionPosition) && shouldShowSelection.value ? (openBlock(), createElementBlock("div", {
+                showToolsFloatingMenu.value ? (openBlock(), createElementBlock("div", {
                   key: 0,
-                  style: normalizeStyle(getSelectionPosition.value),
-                  class: "superdoc__temp-selection temp-selection sd-highlight sd-initial-highlight"
-                }, null, 4)) : createCommentVNode("", true)
-              ], 544)) : createCommentVNode("", true),
-              "hrbr-fields" in unref(modules) && layers.value ? (openBlock(), createBlock(HrbrFieldsLayer, {
-                key: 1,
-                fields: unref(modules)["hrbr-fields"],
-                class: "superdoc__comments-layer comments-layer",
-                style: { "z-index": "2" },
-                ref_key: "hrbrFieldsLayer",
-                ref: hrbrFieldsLayer
-              }, null, 8, ["fields"])) : createCommentVNode("", true),
-              layers.value ? (openBlock(), createBlock(CommentsLayer, {
-                key: 2,
-                class: "superdoc__comments-layer comments-layer",
-                style: { "z-index": "3" },
-                ref_key: "commentsLayer",
-                ref: commentsLayer,
-                parent: layers.value,
-                user: unref(user),
-                onHighlightClick: handleHighlightClick
-              }, null, 8, ["parent", "user"])) : createCommentVNode("", true),
-              unref(showAiLayer) ? (openBlock(), createBlock(AiLayer, {
-                key: 3,
-                class: "ai-layer",
-                style: { "z-index": "4" },
-                ref_key: "aiLayer",
-                ref: aiLayer,
-                editor: unref(proxy).$superdoc.activeEditor
-              }, null, 8, ["editor"])) : createCommentVNode("", true),
-              (openBlock(true), createElementBlock(Fragment, null, renderList(unref(documents), (doc2) => {
-                return openBlock(), createElementBlock("div", {
-                  class: "superdoc__sub-document sub-document",
-                  key: doc2.id
+                  class: "superdoc__tools tools",
+                  style: normalizeStyle(toolsMenuPosition)
                 }, [
-                  doc2.type === unref(PDF) ? (openBlock(), createBlock(unref(PdfViewer2), {
+                  createBaseVNode("div", {
+                    class: "tools-item",
+                    "data-id": "is-tool",
+                    onMousedown: _cache[0] || (_cache[0] = withModifiers(($event) => handleToolClick("comments"), ["stop", "prevent"]))
+                  }, [
+                    createBaseVNode("div", {
+                      class: "superdoc__tools-icon",
+                      innerHTML: unref(superdocIcons).comment
+                    }, null, 8, _hoisted_1$1)
+                  ], 32),
+                  unref(proxy).$superdoc.config.modules.ai ? (openBlock(), createElementBlock("div", {
                     key: 0,
-                    "document-data": doc2,
-                    config: unref(pdfConfig),
-                    onSelectionChange: handleSelectionChange,
-                    onReady: handleDocumentReady,
-                    onPageLoaded: unref(handlePageReady),
-                    onBypassSelection: handlePdfClick
-                  }, null, 8, ["document-data", "config", "onPageLoaded"])) : createCommentVNode("", true),
-                  createVNode(unref(NMessageProvider), null, {
-                    default: withCtx(() => [
-                      doc2.type === unref(DOCX) ? (openBlock(), createBlock(unref(SuperEditor), {
+                    class: "tools-item",
+                    "data-id": "is-tool",
+                    onMousedown: _cache[1] || (_cache[1] = withModifiers(($event) => handleToolClick("ai"), ["stop", "prevent"]))
+                  }, [..._cache[3] || (_cache[3] = [
+                    createBaseVNode("div", { class: "superdoc__tools-icon ai-tool" }, null, -1)
+                  ])], 32)) : createCommentVNode("", true)
+                ], 4)) : createCommentVNode("", true),
+                createBaseVNode("div", _hoisted_2, [
+                  isCommentsEnabled.value ? (openBlock(), createElementBlock("div", {
+                    key: 0,
+                    class: "superdoc__selection-layer selection-layer",
+                    onMousedown: handleSelectionStart,
+                    onMouseup: handleDragEnd,
+                    ref_key: "selectionLayer",
+                    ref: selectionLayer
+                  }, [
+                    unref(selectionPosition) && shouldShowSelection.value ? (openBlock(), createElementBlock("div", {
+                      key: 0,
+                      style: normalizeStyle(getSelectionPosition.value),
+                      class: "superdoc__temp-selection temp-selection sd-highlight sd-initial-highlight"
+                    }, null, 4)) : createCommentVNode("", true)
+                  ], 544)) : createCommentVNode("", true),
+                  "hrbr-fields" in unref(modules) && layers.value ? (openBlock(), createBlock(HrbrFieldsLayer, {
+                    key: 1,
+                    fields: unref(modules)["hrbr-fields"],
+                    class: "superdoc__comments-layer comments-layer",
+                    style: { "z-index": "2" },
+                    ref_key: "hrbrFieldsLayer",
+                    ref: hrbrFieldsLayer
+                  }, null, 8, ["fields"])) : createCommentVNode("", true),
+                  layers.value ? (openBlock(), createBlock(CommentsLayer, {
+                    key: 2,
+                    class: "superdoc__comments-layer comments-layer",
+                    style: { "z-index": "3" },
+                    ref_key: "commentsLayer",
+                    ref: commentsLayer,
+                    parent: layers.value,
+                    user: unref(user),
+                    onHighlightClick: handleHighlightClick
+                  }, null, 8, ["parent", "user"])) : createCommentVNode("", true),
+                  unref(showAiLayer) ? (openBlock(), createBlock(AiLayer, {
+                    key: 3,
+                    class: "ai-layer",
+                    style: { "z-index": "4" },
+                    ref_key: "aiLayer",
+                    ref: aiLayer,
+                    editor: unref(proxy).$superdoc.activeEditor
+                  }, null, 8, ["editor"])) : createCommentVNode("", true),
+                  (openBlock(true), createElementBlock(Fragment, null, renderList(unref(documents), (doc2) => {
+                    return openBlock(), createElementBlock("div", {
+                      class: "superdoc__sub-document sub-document",
+                      key: doc2.id
+                    }, [
+                      doc2.type === unref(PDF) ? (openBlock(), createBlock(unref(PdfViewer2), {
                         key: 0,
+                        "document-data": doc2,
+                        config: unref(pdfConfig),
+                        onSelectionChange: handleSelectionChange,
+                        onReady: handleDocumentReady,
+                        onPageLoaded: unref(handlePageReady),
+                        onBypassSelection: handlePdfClick
+                      }, null, 8, ["document-data", "config", "onPageLoaded"])) : createCommentVNode("", true),
+                      createVNode(unref(NMessageProvider), null, {
+                        default: withCtx(() => [
+                          doc2.type === unref(DOCX) ? (openBlock(), createBlock(unref(SuperEditor), {
+                            key: 0,
+                            "file-source": doc2.data,
+                            state: doc2.state,
+                            "document-id": doc2.id,
+                            options: { ...editorOptions(doc2), rulers: doc2.rulers },
+                            onEditorReady,
+                            onPageMarginsChange: ($event) => handleSuperEditorPageMarginsChange(doc2, $event)
+                          }, null, 8, ["file-source", "state", "document-id", "options", "onPageMarginsChange"])) : createCommentVNode("", true)
+                        ]),
+                        _: 2
+                      }, 1024),
+                      doc2.type === unref(HTML) ? (openBlock(), createBlock(HtmlViewer, {
+                        key: 1,
+                        onReady: _cache[2] || (_cache[2] = (id) => handleDocumentReady(id, null)),
+                        onSelectionChange: handleSelectionChange,
                         "file-source": doc2.data,
-                        state: doc2.state,
-                        "document-id": doc2.id,
-                        options: { ...editorOptions(doc2), rulers: doc2.rulers },
-                        onEditorReady,
-                        onPageMarginsChange: ($event) => handleSuperEditorPageMarginsChange(doc2, $event)
-                      }, null, 8, ["file-source", "state", "document-id", "options", "onPageMarginsChange"])) : createCommentVNode("", true)
-                    ]),
-                    _: 2
-                  }, 1024),
-                  doc2.type === unref(HTML) ? (openBlock(), createBlock(HtmlViewer, {
-                    key: 1,
-                    onReady: _cache[2] || (_cache[2] = (id) => handleDocumentReady(id, null)),
-                    onSelectionChange: handleSelectionChange,
-                    "file-source": doc2.data,
-                    "document-id": doc2.id
-                  }, null, 8, ["file-source", "document-id"])) : createCommentVNode("", true)
-                ]);
-              }), 128))
-            ])
-          ], 512),
-          showCommentsSidebar.value ? (openBlock(), createElementBlock("div", _hoisted_3, [
-            unref(pendingComment) ? withDirectives((openBlock(), createBlock(CommentDialog, {
-              key: 0,
-              comment: unref(pendingComment),
-              "auto-focus": true,
-              "is-floating": true
-            }, null, 8, ["comment"])), [
-              [_directive_click_outside, cancelPendingComment]
-            ]) : createCommentVNode("", true),
-            createBaseVNode("div", _hoisted_4, [
-              unref(hasInitializedLocations) && unref(getFloatingComments).length > 0 ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(unref(documentsWithConverations), (doc2) => {
-                return openBlock(), createBlock(FloatingComments, {
-                  parent: layers.value,
-                  "current-document": doc2
-                }, null, 8, ["parent", "current-document"]);
-              }), 256)) : createCommentVNode("", true)
-            ])
-          ])) : createCommentVNode("", true),
-          unref(showAiWriter) ? (openBlock(), createElementBlock("div", {
-            key: 1,
-            class: "ai-writer-container",
-            style: normalizeStyle(unref(aiWriterPosition))
-          }, [
-            createVNode(unref(AIWriter), {
-              "selected-text": unref(selectedText),
-              "handle-close": unref(handleAiWriterClose),
-              editor: unref(proxy).$superdoc.activeEditor,
-              "api-key": unref(proxy).$superdoc.toolbar?.config?.aiApiKey,
-              endpoint: unref(proxy).$superdoc.config?.modules?.ai?.endpoint
-            }, null, 8, ["selected-text", "handle-close", "editor", "api-key", "endpoint"])
-          ], 4)) : createCommentVNode("", true)
-        ], 2);
+                        "document-id": doc2.id
+                      }, null, 8, ["file-source", "document-id"])) : createCommentVNode("", true)
+                    ]);
+                  }), 128))
+                ])
+              ], 512),
+              showCommentsSidebar.value ? (openBlock(), createElementBlock("div", _hoisted_3, [
+                unref(pendingComment) ? withDirectives((openBlock(), createBlock(CommentDialog, {
+                  key: 0,
+                  comment: unref(pendingComment),
+                  "auto-focus": true,
+                  "is-floating": true
+                }, null, 8, ["comment"])), [
+                  [_directive_click_outside, cancelPendingComment]
+                ]) : createCommentVNode("", true),
+                createBaseVNode("div", _hoisted_4, [
+                  unref(hasInitializedLocations) && unref(getFloatingComments).length > 0 ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(unref(documentsWithConverations), (doc2) => {
+                    return openBlock(), createBlock(FloatingComments, {
+                      parent: layers.value,
+                      "current-document": doc2
+                    }, null, 8, ["parent", "current-document"]);
+                  }), 256)) : createCommentVNode("", true)
+                ])
+              ])) : createCommentVNode("", true),
+              unref(showAiWriter) ? (openBlock(), createElementBlock("div", {
+                key: 1,
+                class: "ai-writer-container",
+                style: normalizeStyle(unref(aiWriterPosition))
+              }, [
+                createVNode(unref(AIWriter), {
+                  "selected-text": unref(selectedText),
+                  "handle-close": unref(handleAiWriterClose),
+                  editor: unref(proxy).$superdoc.activeEditor,
+                  "api-key": unref(proxy).$superdoc.toolbar?.config?.aiApiKey,
+                  endpoint: unref(proxy).$superdoc.config?.modules?.ai?.endpoint
+                }, null, 8, ["selected-text", "handle-close", "editor", "api-key", "endpoint"])
+              ], 4)) : createCommentVNode("", true)
+            ], 6)
+          ]),
+          _: 1
+        });
       };
     }
   };
-  const App = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-e229774d"]]);
+  const App = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-309688b3"]]);
   const createSuperdocVueApp = () => {
     const app = createApp(App);
     const pinia = createPinia();
@@ -152897,6 +153371,8 @@ ${style2}
       toolbarGroups: ["left", "center", "right"],
       toolbarIcons: {},
       toolbarTexts: {},
+      // UI font for SuperDoc surfaces (toolbar, comments UI, etc.)
+      uiDisplayFallbackFont: "Arial, Helvetica, sans-serif",
       isDev: false,
       // telemetry config
       telemetry: null,
@@ -152967,7 +153443,7 @@ ${style2}
       this.config.colors = shuffleArray(this.config.colors);
       this.userColorMap = /* @__PURE__ */ new Map();
       this.colorIndex = 0;
-      this.version = "1.0.0-next.2";
+      this.version = "1.0.0-next.3";
       this.#log("🦋 [superdoc] Using SuperDoc version:", this.version);
       this.superdocId = config2.superdocId || v4();
       this.colors = this.config.colors;
@@ -153326,6 +153802,7 @@ ${style2}
         superdoc: this,
         aiApiKey: this.config.modules?.ai?.apiKey,
         aiEndpoint: this.config.modules?.ai?.endpoint,
+        uiDisplayFallbackFont: this.config.uiDisplayFallbackFont,
         ...moduleConfig,
         excludeItems
         // Override moduleConfig.excludeItems with our computed list
@@ -155439,7 +155916,7 @@ ${style2}
       value && typeof value === "object" && "byteLength" in value && "byteOffset" in value
     );
   }
-  const indexBDVXUeCy = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  const indexDLOSgUP = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
     __proto__: null,
     unified
   }, Symbol.toStringTag, { value: "Module" }));