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

package/dist/chunks/{super-editor.es-CcKbh84I.cjs → super-editor.es-Cve8WKfM.cjs}

@@ -42427,7 +42427,7 @@ const _SuperConverter = class _SuperConverter2 {
   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);
   }
   /**
@@ -58566,28 +58566,28 @@ const setImageNodeSelection = (view, pos) => {
   }
   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 text = "abcdefghijklmnopqrstuvwxyz0123456789";
-    ctx2.font = `72px ${fallbackFont2}`;
+    ctx2.font = `72px ${uiDisplayFallbackFont2}`;
     const initialTextMeasurement = ctx2.measureText(text);
     const fallbackWidth = initialTextMeasurement.width;
     const fallbackHeight = initialTextMeasurement.actualBoundingBoxDescent;
-    ctx2.font = `72px "${fontName2}", ${fallbackFont2}`;
+    ctx2.font = `72px "${fontName2}", ${uiDisplayFallbackFont2}`;
     const customTextMeasurement = ctx2.measureText(text);
     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) {
@@ -59655,7 +59655,7 @@ const isHeadless = (editor) => {
 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) {
@@ -60444,7 +60444,7 @@ const _Editor = class _Editor2 extends EventEmitter$1 {
       { default: remarkStringify },
       { default: remarkGfm }
     ] = await Promise.all([
-      Promise.resolve().then(() => require("./index-BDVXUeCy-Di6ozaOM.cjs")),
+      Promise.resolve().then(() => require("./index-DLO-SgUP-BNtYQDPq.cjs")),
       Promise.resolve().then(() => require("./index-DRCvimau-H4Ck3S9a.cjs")),
       Promise.resolve().then(() => require("./index-C_x_N6Uh-Db3CUJMX.cjs")),
       Promise.resolve().then(() => require("./index-D_sWOSiG-BtDZzJ6I.cjs")),
@@ -60649,7 +60649,7 @@ const _Editor = class _Editor2 extends EventEmitter$1 {
    * 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");
@@ -68379,9 +68379,9 @@ const extractFirstTextRunFont = (para) => {
   const font = findFirstTextFont(para.content);
   return font;
 };
-const applyBaseRunDefaults = (run2, defaults, fallbackFont, fallbackSize) => {
+const applyBaseRunDefaults = (run2, defaults, uiDisplayFallbackFont, fallbackSize) => {
   if (!run2) return;
-  if (defaults.fontFamily && run2.fontFamily === fallbackFont) {
+  if (defaults.fontFamily && run2.fontFamily === uiDisplayFallbackFont) {
     run2.fontFamily = defaults.fontFamily;
   }
   if (defaults.fontSizePx != null && run2.fontSize === fallbackSize) {
@@ -86218,8 +86218,8 @@ async function measureParagraphBlock(block, maxWidth) {
     }
   }
   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,
@@ -110856,316 +110856,6 @@ const toolbarIcons = {
   paste: pasteIconSvg,
   strikethrough: strikethroughSvg
 };
-const _hoisted_1$4$1 = { class: "toolbar-icon" };
-const _hoisted_2$3$1 = ["innerHTML"];
-const _sfc_main$5$1 = {
-  __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 = vue.computed(() => {
-      if (props.name === "color") return { backgroundColor: props.color || "#111111" };
-      if (props.name === "highlight") return { backgroundColor: props.color || "#D6D6D6" };
-    });
-    const hasColorBar = vue.computed(() => {
-      return ["color", "highlight"].includes(props.name);
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4$1, [
-        vue.createBaseVNode("div", {
-          class: vue.normalizeClass(["toolbar-icon__icon", [`toolbar-icon__icon--${props.name}`]]),
-          innerHTML: __props.icon
-        }, null, 10, _hoisted_2$3$1),
-        hasColorBar.value ? (vue.openBlock(), vue.createElementBlock("div", {
-          key: 0,
-          class: "color-bar",
-          style: vue.normalizeStyle(getBarColor.value)
-        }, null, 4)) : vue.createCommentVNode("", true)
-      ]);
-    };
-  }
-};
-const ToolbarButtonIcon = /* @__PURE__ */ _export_sfc(_sfc_main$5$1, [["__scopeId", "data-v-6d7523ab"]]);
-const _hoisted_1$3$1 = ["role", "aria-label", "onKeydown"];
-const _hoisted_2$2$1 = ["data-item"];
-const _hoisted_3$2$1 = {
-  key: 1,
-  class: "button-label"
-};
-const _hoisted_4$1$1 = { key: 2 };
-const _hoisted_5$4 = ["onKeydown", "id"];
-const _hoisted_6$2 = ["placeholder", "onKeydown", "id"];
-const _hoisted_7$1 = ["innerHTML"];
-const _hoisted_8$1 = {
-  "aria-live": "polite",
-  class: "visually-hidden"
-};
-const _sfc_main$4$1 = {
-  __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 emit = __emit;
-    const props = __props;
-    const {
-      name,
-      active,
-      icon,
-      label,
-      hideLabel,
-      iconColor,
-      hasCaret,
-      disabled,
-      inlineTextInputVisible,
-      hasInlineTextInput,
-      minWidth,
-      style: style2,
-      attributes
-    } = props.toolbarItem;
-    const inlineTextInput = vue.ref(label);
-    const inlineInput = vue.ref(null);
-    const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode();
-    const handleClick2 = () => {
-      if (hasInlineTextInput) {
-        vue.nextTick(() => {
-          inlineInput.value?.focus();
-          inlineInput.value?.select();
-        });
-      }
-      emit("buttonClick");
-    };
-    const handleInputSubmit = () => {
-      const value = inlineTextInput.value;
-      const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
-      emit("textSubmit", cleanValue);
-      inlineTextInput.value = cleanValue;
-    };
-    const getStyle = vue.computed(() => {
-      if (style2.value) return style2.value;
-      return {
-        minWidth: props.minWidth
-      };
-    });
-    const caretIcon = vue.computed(() => {
-      return active.value ? toolbarIcons.dropdownCaretUp : toolbarIcons.dropdownCaretDown;
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", {
-        class: vue.normalizeClass(["toolbar-item", vue.unref(attributes).className]),
-        style: vue.normalizeStyle(getStyle.value),
-        role: __props.isOverflowItem ? "menuitem" : "button",
-        "aria-label": vue.unref(attributes).ariaLabel,
-        onClick: handleClick2,
-        onKeydown: vue.withKeys(vue.withModifiers(handleClick2, ["stop"]), ["enter"]),
-        tabindex: "0"
-      }, [
-        vue.createBaseVNode("div", {
-          class: vue.normalizeClass(["toolbar-button", {
-            active: vue.unref(active),
-            disabled: vue.unref(disabled),
-            narrow: __props.isNarrow,
-            wide: __props.isWide,
-            "has-inline-text-input": vue.unref(hasInlineTextInput),
-            "high-contrast": vue.unref(isHighContrastMode2)
-          }]),
-          "data-item": `btn-${vue.unref(name) || ""}`
-        }, [
-          vue.unref(icon) ? (vue.openBlock(), vue.createBlock(ToolbarButtonIcon, {
-            key: 0,
-            color: vue.unref(iconColor),
-            class: "toolbar-icon",
-            icon: vue.unref(icon),
-            name: vue.unref(name)
-          }, null, 8, ["color", "icon", "name"])) : vue.createCommentVNode("", true),
-          vue.unref(label) && !vue.unref(hideLabel) && !vue.unref(inlineTextInputVisible) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$2$1, vue.toDisplayString(vue.unref(label)), 1)) : vue.createCommentVNode("", true),
-          vue.unref(inlineTextInputVisible) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$1$1, [
-            vue.unref(name) === "fontSize" ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
-              key: 0,
-              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inlineTextInput.value = $event),
-              onKeydown: vue.withKeys(vue.withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
-              type: "text",
-              class: vue.normalizeClass(["button-text-input button-text-input--font-size", { "high-contrast": vue.unref(isHighContrastMode2) }]),
-              id: "inlineTextInput-" + vue.unref(name),
-              autocomplete: "off",
-              ref_key: "inlineInput",
-              ref: inlineInput
-            }, null, 42, _hoisted_5$4)), [
-              [vue.vModelText, inlineTextInput.value]
-            ]) : vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
-              key: 1,
-              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inlineTextInput.value = $event),
-              placeholder: vue.unref(label),
-              onKeydown: vue.withKeys(vue.withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
-              type: "text",
-              class: "button-text-input",
-              id: "inlineTextInput-" + vue.unref(name),
-              autocomplete: "off",
-              ref_key: "inlineInput",
-              ref: inlineInput
-            }, null, 40, _hoisted_6$2)), [
-              [vue.vModelText, inlineTextInput.value]
-            ])
-          ])) : vue.createCommentVNode("", true),
-          vue.unref(hasCaret) ? (vue.openBlock(), vue.createElementBlock("div", {
-            key: 3,
-            class: "dropdown-caret",
-            innerHTML: caretIcon.value,
-            style: vue.normalizeStyle({ opacity: vue.unref(disabled) ? 0.6 : 1 })
-          }, null, 12, _hoisted_7$1)) : vue.createCommentVNode("", true),
-          vue.createBaseVNode("div", _hoisted_8$1, vue.toDisplayString(`${vue.unref(attributes).ariaLabel} ${vue.unref(active) ? "selected" : "unset"}`), 1)
-        ], 10, _hoisted_2$2$1)
-      ], 46, _hoisted_1$3$1);
-    };
-  }
-};
-const ToolbarButton = /* @__PURE__ */ _export_sfc(_sfc_main$4$1, [["__scopeId", "data-v-ea93b080"]]);
-const _hoisted_1$2$1 = {
-  class: "toolbar-separator",
-  role: "separator",
-  "aria-label": "Toolbar separator"
-};
-const _sfc_main$3$1 = {
-  __name: "ToolbarSeparator",
-  props: {
-    active: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ["command"],
-  setup(__props, { emit: __emit }) {
-    const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode();
-    const getSeparatorColor = () => {
-      if (isHighContrastMode2.value) {
-        return "#000";
-      }
-      return "#dbdbdb";
-    };
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2$1, [
-        vue.createBaseVNode("div", {
-          class: "separator-inner",
-          style: vue.normalizeStyle({ backgroundColor: getSeparatorColor() })
-        }, null, 4)
-      ]);
-    };
-  }
-};
-const ToolbarSeparator = /* @__PURE__ */ _export_sfc(_sfc_main$3$1, [["__scopeId", "data-v-4ef9aa18"]]);
-const _hoisted_1$1$1 = { class: "overflow-menu" };
-const _hoisted_2$1$1 = { class: "overflow-menu-trigger" };
-const _hoisted_3$1$1 = {
-  key: 0,
-  class: "overflow-menu_items",
-  role: "group"
-};
-const _sfc_main$2$1 = {
-  __name: "OverflowMenu",
-  props: {
-    toolbarItem: {
-      type: Object,
-      required: true
-    },
-    overflowItems: {
-      type: Array,
-      required: true
-    }
-  },
-  emits: ["buttonClick", "close"],
-  setup(__props, { emit: __emit }) {
-    const { proxy } = vue.getCurrentInstance();
-    const emit = __emit;
-    const props = __props;
-    const isOverflowMenuOpened = vue.computed(() => props.toolbarItem.expand.value);
-    const hasOpenDropdown = vue.ref(false);
-    const overflowToolbarItem = vue.computed(() => ({
-      ...props.toolbarItem,
-      active: isOverflowMenuOpened.value
-    }));
-    const toggleOverflowMenu = () => {
-      emit("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();
-          emit("close");
-        }
-      }
-    };
-    vue.onMounted(() => {
-      document.addEventListener("keydown", handleKeyDown2, true);
-    });
-    vue.onBeforeUnmount(() => {
-      document.removeEventListener("keydown", handleKeyDown2, true);
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1$1, [
-        vue.createBaseVNode("div", _hoisted_2$1$1, [
-          vue.createVNode(ToolbarButton, {
-            "toolbar-item": overflowToolbarItem.value,
-            onButtonClick: toggleOverflowMenu
-          }, null, 8, ["toolbar-item"])
-        ]),
-        isOverflowMenuOpened.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$1$1, [
-          vue.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"])
-        ])) : vue.createCommentVNode("", true)
-      ]);
-    };
-  }
-};
-const OverflowMenu = /* @__PURE__ */ _export_sfc(_sfc_main$2$1, [["__scopeId", "data-v-ef28da92"]]);
 function plugin$1(options) {
   let _bPrefix = ".";
   let _ePrefix = "__";
@@ -114776,30 +114466,30 @@ const defaultClsPrefix = "n";
 function useConfig(props = {}, options = {
   defaultBordered: true
 }) {
-  const NConfigProvider = vue.inject(configProviderInjectionKey, null);
+  const NConfigProvider2 = vue.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: vue.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 : vue.shallowRef(defaultClsPrefix),
-    namespaceRef: vue.computed(() => NConfigProvider === null || NConfigProvider === void 0 ? void 0 : NConfigProvider.mergedNamespaceRef.value)
+    mergedClsPrefixRef: NConfigProvider2 ? NConfigProvider2.mergedClsPrefixRef : vue.shallowRef(defaultClsPrefix),
+    namespaceRef: vue.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 = vue.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 = vue.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 = vue.ref("");
   const ssrAdapter2 = useSsrAdapter();
   let renderCallback;
@@ -116144,7 +115834,7 @@ function useRtl(mountId, rtlStateRef, clsPrefixRef) {
     }
     return componentRtlState;
   });
-  const NConfigProvider = vue.inject(configProviderInjectionKey, null);
+  const NConfigProvider2 = vue.inject(configProviderInjectionKey, null);
   const mountStyle = () => {
     vue.watchEffect(() => {
       const {
@@ -116164,7 +115854,7 @@ function useRtl(mountId, rtlStateRef, clsPrefixRef) {
           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
       });
     });
   };
@@ -116222,7 +115912,7 @@ function createTheme(theme) {
 }
 function useTheme(resolveId, mountId, style2, defaultTheme, props, clsPrefixRef) {
   const ssrAdapter2 = useSsrAdapter();
-  const NConfigProvider = vue.inject(configProviderInjectionKey, null);
+  const NConfigProvider2 = vue.inject(configProviderInjectionKey, null);
   if (style2) {
     const mountStyle = () => {
       const clsPrefix = clsPrefixRef === null || clsPrefixRef === void 0 ? void 0 : clsPrefixRef.value;
@@ -116234,15 +115924,15 @@ function useTheme(resolveId, mountId, style2, defaultTheme, props, clsPrefixRef)
         },
         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
         });
       }
     };
@@ -116274,11 +115964,11 @@ function useTheme(resolveId, mountId, style2, defaultTheme, props, clsPrefixRef)
         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 = {}
@@ -119036,6 +118726,209 @@ const NPopover = vue.defineComponent({
     });
   }
 });
+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 = vue.defineComponent({
+  name: "ConfigProvider",
+  alias: ["App"],
+  props: configProviderProps,
+  setup(props) {
+    const NConfigProvider2 = vue.inject(configProviderInjectionKey, null);
+    const mergedThemeRef = vue.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 = vue.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({}, 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 = vue.computed(() => {
+      const {
+        icons: icons2
+      } = props;
+      return icons2 === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedIconsRef.value : icons2;
+    });
+    const mergedComponentPropsRef = vue.computed(() => {
+      const {
+        componentOptions
+      } = props;
+      if (componentOptions !== void 0) return componentOptions;
+      return NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedComponentPropsRef.value;
+    });
+    const mergedClsPrefixRef = vue.computed(() => {
+      const {
+        clsPrefix
+      } = props;
+      if (clsPrefix !== void 0) return clsPrefix;
+      if (NConfigProvider2) return NConfigProvider2.mergedClsPrefixRef.value;
+      return defaultClsPrefix;
+    });
+    const mergedRtlRef = vue.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] = vue.markRaw(rtlInfo);
+        (_a2 = rtlInfo.peers) === null || _a2 === void 0 ? void 0 : _a2.forEach((peerRtlInfo) => {
+          if (!(peerRtlInfo.name in rtlEnabledState)) {
+            rtlEnabledState[peerRtlInfo.name] = vue.markRaw(peerRtlInfo);
+          }
+        });
+      }
+      return rtlEnabledState;
+    });
+    const mergedBreakpointsRef = vue.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 = vue.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 "";
+      }
+    });
+    vue.provide(configProviderInjectionKey, {
+      mergedThemeHashRef,
+      mergedBreakpointsRef,
+      mergedRtlRef,
+      mergedIconsRef,
+      mergedComponentPropsRef,
+      mergedBorderedRef,
+      mergedNamespaceRef,
+      mergedClsPrefixRef,
+      mergedLocaleRef: vue.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: vue.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: vue.computed(() => {
+        const {
+          hljs
+        } = props;
+        return hljs === void 0 ? NConfigProvider2 === null || NConfigProvider2 === void 0 ? void 0 : NConfigProvider2.mergedHljsRef.value : hljs;
+      }),
+      mergedKatexRef: vue.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 ? vue.h(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 = {
   padding: "4px 0",
   optionIconSizeSmall: "14px",
@@ -120513,6 +120406,316 @@ const NSkeleton = vue.defineComponent({
     return child;
   }
 });
+const _hoisted_1$4$1 = { class: "toolbar-icon" };
+const _hoisted_2$3$1 = ["innerHTML"];
+const _sfc_main$5$1 = {
+  __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 = vue.computed(() => {
+      if (props.name === "color") return { backgroundColor: props.color || "#111111" };
+      if (props.name === "highlight") return { backgroundColor: props.color || "#D6D6D6" };
+    });
+    const hasColorBar = vue.computed(() => {
+      return ["color", "highlight"].includes(props.name);
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$4$1, [
+        vue.createBaseVNode("div", {
+          class: vue.normalizeClass(["toolbar-icon__icon", [`toolbar-icon__icon--${props.name}`]]),
+          innerHTML: __props.icon
+        }, null, 10, _hoisted_2$3$1),
+        hasColorBar.value ? (vue.openBlock(), vue.createElementBlock("div", {
+          key: 0,
+          class: "color-bar",
+          style: vue.normalizeStyle(getBarColor.value)
+        }, null, 4)) : vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+};
+const ToolbarButtonIcon = /* @__PURE__ */ _export_sfc(_sfc_main$5$1, [["__scopeId", "data-v-6d7523ab"]]);
+const _hoisted_1$3$1 = ["role", "aria-label", "onKeydown"];
+const _hoisted_2$2$1 = ["data-item"];
+const _hoisted_3$2$1 = {
+  key: 1,
+  class: "button-label"
+};
+const _hoisted_4$1$1 = { key: 2 };
+const _hoisted_5$4 = ["onKeydown", "id"];
+const _hoisted_6$2 = ["placeholder", "onKeydown", "id"];
+const _hoisted_7$1 = ["innerHTML"];
+const _hoisted_8$1 = {
+  "aria-live": "polite",
+  class: "visually-hidden"
+};
+const _sfc_main$4$1 = {
+  __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 emit = __emit;
+    const props = __props;
+    const {
+      name,
+      active,
+      icon,
+      label,
+      hideLabel,
+      iconColor,
+      hasCaret,
+      disabled,
+      inlineTextInputVisible,
+      hasInlineTextInput,
+      minWidth,
+      style: style2,
+      attributes
+    } = props.toolbarItem;
+    const inlineTextInput = vue.ref(label);
+    const inlineInput = vue.ref(null);
+    const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode();
+    const handleClick2 = () => {
+      if (hasInlineTextInput) {
+        vue.nextTick(() => {
+          inlineInput.value?.focus();
+          inlineInput.value?.select();
+        });
+      }
+      emit("buttonClick");
+    };
+    const handleInputSubmit = () => {
+      const value = inlineTextInput.value;
+      const cleanValue = value.match(/^\d+(\.5)?$/) ? value : Math.floor(parseFloat(value)).toString();
+      emit("textSubmit", cleanValue);
+      inlineTextInput.value = cleanValue;
+    };
+    const getStyle = vue.computed(() => {
+      if (style2.value) return style2.value;
+      return {
+        minWidth: props.minWidth
+      };
+    });
+    const caretIcon = vue.computed(() => {
+      return active.value ? toolbarIcons.dropdownCaretUp : toolbarIcons.dropdownCaretDown;
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", {
+        class: vue.normalizeClass(["toolbar-item", vue.unref(attributes).className]),
+        style: vue.normalizeStyle(getStyle.value),
+        role: __props.isOverflowItem ? "menuitem" : "button",
+        "aria-label": vue.unref(attributes).ariaLabel,
+        onClick: handleClick2,
+        onKeydown: vue.withKeys(vue.withModifiers(handleClick2, ["stop"]), ["enter"]),
+        tabindex: "0"
+      }, [
+        vue.createBaseVNode("div", {
+          class: vue.normalizeClass(["toolbar-button", {
+            active: vue.unref(active),
+            disabled: vue.unref(disabled),
+            narrow: __props.isNarrow,
+            wide: __props.isWide,
+            "has-inline-text-input": vue.unref(hasInlineTextInput),
+            "high-contrast": vue.unref(isHighContrastMode2)
+          }]),
+          "data-item": `btn-${vue.unref(name) || ""}`
+        }, [
+          vue.unref(icon) ? (vue.openBlock(), vue.createBlock(ToolbarButtonIcon, {
+            key: 0,
+            color: vue.unref(iconColor),
+            class: "toolbar-icon",
+            icon: vue.unref(icon),
+            name: vue.unref(name)
+          }, null, 8, ["color", "icon", "name"])) : vue.createCommentVNode("", true),
+          vue.unref(label) && !vue.unref(hideLabel) && !vue.unref(inlineTextInputVisible) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$2$1, vue.toDisplayString(vue.unref(label)), 1)) : vue.createCommentVNode("", true),
+          vue.unref(inlineTextInputVisible) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4$1$1, [
+            vue.unref(name) === "fontSize" ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
+              key: 0,
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inlineTextInput.value = $event),
+              onKeydown: vue.withKeys(vue.withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
+              type: "text",
+              class: vue.normalizeClass(["button-text-input button-text-input--font-size", { "high-contrast": vue.unref(isHighContrastMode2) }]),
+              id: "inlineTextInput-" + vue.unref(name),
+              autocomplete: "off",
+              ref_key: "inlineInput",
+              ref: inlineInput
+            }, null, 42, _hoisted_5$4)), [
+              [vue.vModelText, inlineTextInput.value]
+            ]) : vue.withDirectives((vue.openBlock(), vue.createElementBlock("input", {
+              key: 1,
+              "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => inlineTextInput.value = $event),
+              placeholder: vue.unref(label),
+              onKeydown: vue.withKeys(vue.withModifiers(handleInputSubmit, ["prevent"]), ["enter"]),
+              type: "text",
+              class: "button-text-input",
+              id: "inlineTextInput-" + vue.unref(name),
+              autocomplete: "off",
+              ref_key: "inlineInput",
+              ref: inlineInput
+            }, null, 40, _hoisted_6$2)), [
+              [vue.vModelText, inlineTextInput.value]
+            ])
+          ])) : vue.createCommentVNode("", true),
+          vue.unref(hasCaret) ? (vue.openBlock(), vue.createElementBlock("div", {
+            key: 3,
+            class: "dropdown-caret",
+            innerHTML: caretIcon.value,
+            style: vue.normalizeStyle({ opacity: vue.unref(disabled) ? 0.6 : 1 })
+          }, null, 12, _hoisted_7$1)) : vue.createCommentVNode("", true),
+          vue.createBaseVNode("div", _hoisted_8$1, vue.toDisplayString(`${vue.unref(attributes).ariaLabel} ${vue.unref(active) ? "selected" : "unset"}`), 1)
+        ], 10, _hoisted_2$2$1)
+      ], 46, _hoisted_1$3$1);
+    };
+  }
+};
+const ToolbarButton = /* @__PURE__ */ _export_sfc(_sfc_main$4$1, [["__scopeId", "data-v-ea93b080"]]);
+const _hoisted_1$2$1 = {
+  class: "toolbar-separator",
+  role: "separator",
+  "aria-label": "Toolbar separator"
+};
+const _sfc_main$3$1 = {
+  __name: "ToolbarSeparator",
+  props: {
+    active: {
+      type: Boolean,
+      default: false
+    }
+  },
+  emits: ["command"],
+  setup(__props, { emit: __emit }) {
+    const { isHighContrastMode: isHighContrastMode2 } = useHighContrastMode();
+    const getSeparatorColor = () => {
+      if (isHighContrastMode2.value) {
+        return "#000";
+      }
+      return "#dbdbdb";
+    };
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$2$1, [
+        vue.createBaseVNode("div", {
+          class: "separator-inner",
+          style: vue.normalizeStyle({ backgroundColor: getSeparatorColor() })
+        }, null, 4)
+      ]);
+    };
+  }
+};
+const ToolbarSeparator = /* @__PURE__ */ _export_sfc(_sfc_main$3$1, [["__scopeId", "data-v-4ef9aa18"]]);
+const _hoisted_1$1$1 = { class: "overflow-menu" };
+const _hoisted_2$1$1 = { class: "overflow-menu-trigger" };
+const _hoisted_3$1$1 = {
+  key: 0,
+  class: "overflow-menu_items",
+  role: "group"
+};
+const _sfc_main$2$1 = {
+  __name: "OverflowMenu",
+  props: {
+    toolbarItem: {
+      type: Object,
+      required: true
+    },
+    overflowItems: {
+      type: Array,
+      required: true
+    }
+  },
+  emits: ["buttonClick", "close"],
+  setup(__props, { emit: __emit }) {
+    const { proxy } = vue.getCurrentInstance();
+    const emit = __emit;
+    const props = __props;
+    const isOverflowMenuOpened = vue.computed(() => props.toolbarItem.expand.value);
+    const hasOpenDropdown = vue.ref(false);
+    const overflowToolbarItem = vue.computed(() => ({
+      ...props.toolbarItem,
+      active: isOverflowMenuOpened.value
+    }));
+    const toggleOverflowMenu = () => {
+      emit("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();
+          emit("close");
+        }
+      }
+    };
+    vue.onMounted(() => {
+      document.addEventListener("keydown", handleKeyDown2, true);
+    });
+    vue.onBeforeUnmount(() => {
+      document.removeEventListener("keydown", handleKeyDown2, true);
+    });
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("div", _hoisted_1$1$1, [
+        vue.createBaseVNode("div", _hoisted_2$1$1, [
+          vue.createVNode(ToolbarButton, {
+            "toolbar-item": overflowToolbarItem.value,
+            onButtonClick: toggleOverflowMenu
+          }, null, 8, ["toolbar-item"])
+        ]),
+        isOverflowMenuOpened.value ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_3$1$1, [
+          vue.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"])
+        ])) : vue.createCommentVNode("", true)
+      ]);
+    };
+  }
+};
+const OverflowMenu = /* @__PURE__ */ _export_sfc(_sfc_main$2$1, [["__scopeId", "data-v-ef28da92"]]);
 const _hoisted_1$h = ["onKeydown", "tabindex", "data-item-id"];
 const _hoisted_2$b = { key: 0 };
 const _hoisted_3$9 = { key: 0 };
@@ -120528,6 +120731,16 @@ const _sfc_main$1$1 = {
       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"
@@ -120720,6 +120933,7 @@ const _sfc_main$1$1 = {
               options: dropdownOptions(item),
               trigger: item.disabled.value ? null : "click",
               show: item.expand.value,
+              "content-style": { fontFamily: props.uiFontFamily },
               size: "medium",
               placement: "bottom-start",
               class: vue.normalizeClass(["toolbar-button toolbar-dropdown sd-editor-toolbar-dropdown", { "high-contrast": vue.unref(isHighContrastMode2) }]),
@@ -120727,14 +120941,16 @@ const _sfc_main$1$1 = {
               onUpdateShow: handleDropdownUpdateShow,
               style: vue.normalizeStyle(item.dropdownStyles.value),
               "menu-props": () => ({
-                role: "menu"
+                role: "menu",
+                style: { fontFamily: props.uiFontFamily }
               }),
               "node-props": (option) => getDropdownAttributes(option, item)
             }, {
               default: vue.withCtx(() => [
                 vue.createVNode(vue.unref(NTooltip), {
                   trigger: "hover",
-                  disabled: !item.tooltip?.value
+                  disabled: !item.tooltip?.value,
+                  "content-style": { fontFamily: props.uiFontFamily }
                 }, {
                   trigger: vue.withCtx(() => [
                     vue.createVNode(ToolbarButton, {
@@ -120751,13 +120967,14 @@ const _sfc_main$1$1 = {
                     ])
                   ]),
                   _: 2
-                }, 1032, ["disabled"])
+                }, 1032, ["disabled", "content-style"])
               ]),
               _: 2
-            }, 1032, ["options", "trigger", "show", "class", "onSelect", "style", "node-props"])) : isButton(item) ? (vue.openBlock(), vue.createBlock(vue.unref(NTooltip), {
+            }, 1032, ["options", "trigger", "show", "content-style", "class", "onSelect", "style", "menu-props", "node-props"])) : isButton(item) ? (vue.openBlock(), vue.createBlock(vue.unref(NTooltip), {
               key: 2,
               trigger: "hover",
-              class: "sd-editor-toolbar-tooltip"
+              class: "sd-editor-toolbar-tooltip",
+              "content-style": { fontFamily: props.uiFontFamily }
             }, {
               trigger: vue.withCtx(() => [
                 vue.createVNode(ToolbarButton, {
@@ -120774,7 +120991,7 @@ const _sfc_main$1$1 = {
                 ])) : vue.createCommentVNode("", true)
               ]),
               _: 2
-            }, 1024)) : vue.createCommentVNode("", true),
+            }, 1032, ["content-style"])) : vue.createCommentVNode("", true),
             isOverflow(item) && __props.overflowItems.length ? (vue.openBlock(), vue.createBlock(OverflowMenu, {
               key: 3,
               "toolbar-item": item,
@@ -120788,13 +121005,21 @@ const _sfc_main$1$1 = {
     };
   }
 };
-const ButtonGroup = /* @__PURE__ */ _export_sfc(_sfc_main$1$1, [["__scopeId", "data-v-c80a1e51"]]);
+const ButtonGroup = /* @__PURE__ */ _export_sfc(_sfc_main$1$1, [["__scopeId", "data-v-f732136c"]]);
+const DEFAULT_UI_FONT_FAMILY = "Arial, Helvetica, sans-serif";
 const _sfc_main$j = {
   __name: "Toolbar",
   emits: ["command", "toggle", "select"],
   setup(__props, { emit: __emit }) {
     const { proxy } = vue.getCurrentInstance();
     let toolbarKey = vue.ref(1);
+    const uiFontFamily = vue.computed(() => {
+      const configured = proxy?.$toolbar?.config?.uiDisplayFallbackFont;
+      if (typeof configured === "string" && configured.trim()) {
+        return configured.trim();
+      }
+      return DEFAULT_UI_FONT_FAMILY;
+    });
     const showLeftSide = proxy.$toolbar.config?.toolbarGroups?.includes("left");
     const showRightSide = proxy.$toolbar.config?.toolbarGroups?.includes("right");
     const excludeButtonsList = proxy.$toolbar.config?.toolbarButtonsExclude || [];
@@ -120841,37 +121066,48 @@ const _sfc_main$j = {
         "aria-label": "Toolbar",
         "data-editor-ui-surface": ""
       }, [
-        vue.unref(showLeftSide) ? (vue.openBlock(), vue.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"])) : vue.createCommentVNode("", true),
-        vue.createVNode(ButtonGroup, {
-          tabindex: "0",
-          "toolbar-items": getFilteredItems("center"),
-          "overflow-items": vue.unref(proxy).$toolbar.overflowItems,
-          position: "center",
-          onCommand: handleCommand,
-          onItemClicked: restoreSelection2
-        }, null, 8, ["toolbar-items", "overflow-items"]),
-        vue.unref(showRightSide) ? (vue.openBlock(), vue.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"])) : vue.createCommentVNode("", true)
+        vue.createVNode(vue.unref(NConfigProvider), {
+          abstract: "",
+          "preflight-style-disabled": ""
+        }, {
+          default: vue.withCtx(() => [
+            vue.unref(showLeftSide) ? (vue.openBlock(), vue.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"])) : vue.createCommentVNode("", true),
+            vue.createVNode(ButtonGroup, {
+              tabindex: "0",
+              "toolbar-items": getFilteredItems("center"),
+              "overflow-items": vue.unref(proxy).$toolbar.overflowItems,
+              "ui-font-family": uiFontFamily.value,
+              position: "center",
+              onCommand: handleCommand,
+              onItemClicked: restoreSelection2
+            }, null, 8, ["toolbar-items", "overflow-items", "ui-font-family"]),
+            vue.unref(showRightSide) ? (vue.openBlock(), vue.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"])) : vue.createCommentVNode("", true)
+          ]),
+          _: 1
+        })
       ]);
     };
   }
 };
-const Toolbar = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__scopeId", "data-v-3f5ec271"]]);
+const Toolbar = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__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 = {}) {
@@ -121388,7 +121624,7 @@ const _sfc_main$i = {
     };
   }
 };
-const AIWriter = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-d869be75"]]);
+const AIWriter = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__scopeId", "data-v-a4bc3d14"]]);
 async function createZip(blobs, fileNames) {
   const zip = new JSZip();
   blobs.forEach((blob, index2) => {
@@ -124237,6 +124473,10 @@ const _SuperToolbar = class _SuperToolbar2 extends EventEmitter2 {
       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,