@harbour-enterprises/superdoc 0.21.0-next.4 → 0.21.0-next.5

package/dist/chunks/{super-editor.es-U-GVCd_F.cjs → super-editor.es-Do6Vcsbv.cjs}

@@ -83569,6 +83569,115 @@ runCommandWithArgumentOnly_fn = function({ item, argument, noArgumentCallback =
     this.updateToolbarState();
   }
 };
+const onMarginClickCursorChange = (event, editor) => {
+  const y2 = event.clientY;
+  const x = event.clientX;
+  const { view } = editor;
+  const editorRect = view.dom.getBoundingClientRect();
+  let coords = {
+    left: 0,
+    top: y2
+  };
+  let isRightMargin = false;
+  if (x > editorRect.right) {
+    coords.left = editorRect.left + editorRect.width - 1;
+    isRightMargin = true;
+  } else if (x < editorRect.left) {
+    coords.left = editorRect.left;
+  }
+  const pos = view.posAtCoords(coords)?.pos;
+  if (pos) {
+    let cursorPos = pos;
+    if (isRightMargin) {
+      const $pos = view.state.doc.resolve(pos);
+      const charOffset = $pos.textOffset;
+      const node = view.state.doc.nodeAt(pos);
+      const text = node?.text;
+      const charAtPos = text?.charAt(charOffset);
+      cursorPos = node?.isText && charAtPos !== " " ? pos - 1 : pos;
+    }
+    const transaction = view.state.tr.setSelection(TextSelection$1.create(view.state.doc, cursorPos));
+    view.dispatch(transaction);
+    view.focus();
+  }
+};
+const checkNodeSpecificClicks = (editor, event, popoverControls) => {
+  if (!editor) return;
+  if (selectionHasNodeOrMark(editor.view.state, "link", { requireEnds: true })) {
+    popoverControls.component = LinkInput;
+    popoverControls.position = {
+      left: `${event.clientX - editor.element.getBoundingClientRect().left}px`,
+      top: `${event.clientY - editor.element.getBoundingClientRect().top + 15}px`
+    };
+    popoverControls.props = {
+      showInput: true
+    };
+    popoverControls.visible = true;
+  }
+};
+function selectionHasNodeOrMark(state2, name, options = {}) {
+  const { requireEnds = false } = options;
+  const $from = state2.selection.$from;
+  const $to = state2.selection.$to;
+  if (requireEnds) {
+    for (let d2 = $from.depth; d2 > 0; d2--) {
+      if ($from.node(d2).type.name === name) {
+        return true;
+      }
+    }
+    for (let d2 = $to.depth; d2 > 0; d2--) {
+      if ($to.node(d2).type.name === name) {
+        return true;
+      }
+    }
+  } else {
+    for (let d2 = $from.depth; d2 > 0; d2--) {
+      if ($from.node(d2).type.name === name) {
+        return true;
+      }
+    }
+  }
+  const markType = state2.schema.marks[name];
+  if (markType) {
+    const { from: from2, to, empty: empty2 } = state2.selection;
+    if (requireEnds) {
+      const fromMarks = markType.isInSet($from.marks());
+      const toMarks = markType.isInSet($to.marks());
+      if (fromMarks || toMarks) {
+        return true;
+      }
+      if (empty2 && markType.isInSet(state2.storedMarks || $from.marks())) {
+        return true;
+      }
+    } else {
+      if (empty2) {
+        if (markType.isInSet(state2.storedMarks || $from.marks())) {
+          return true;
+        }
+      } else {
+        let hasMark = false;
+        state2.doc.nodesBetween(from2, to, (node) => {
+          if (markType.isInSet(node.marks)) {
+            hasMark = true;
+            return false;
+          }
+        });
+        if (hasMark) return true;
+      }
+    }
+  }
+  return false;
+}
+function moveCursorToMouseEvent(event, editor) {
+  const { view } = editor;
+  const coords = { left: event.clientX, top: event.clientY };
+  const pos = view.posAtCoords(coords)?.pos;
+  if (typeof pos === "number") {
+    const tr = view.state.tr.setSelection(TextSelection$1.create(view.state.doc, pos));
+    view.dispatch(tr);
+    view.focus();
+  }
+}
 const ICONS = {
   addRowBefore: plusIconSvg,
   addRowAfter: plusIconSvg,
@@ -83768,6 +83877,30 @@ const getPropsByItemId = (itemId, props) => {
       return baseProps;
   }
 };
+function normalizeClipboardContent(rawClipboardContent) {
+  if (!rawClipboardContent) {
+    return {
+      html: null,
+      text: null,
+      hasContent: false,
+      raw: null
+    };
+  }
+  const html = typeof rawClipboardContent.html === "string" ? rawClipboardContent.html : null;
+  const text = typeof rawClipboardContent.text === "string" ? rawClipboardContent.text : null;
+  const hasHtml = !!html && html.trim().length > 0;
+  const hasText = !!text && text.length > 0;
+  const isObject2 = typeof rawClipboardContent === "object" && rawClipboardContent !== null;
+  const fragmentSize = typeof rawClipboardContent.size === "number" ? rawClipboardContent.size : null;
+  const nestedSize = isObject2 && rawClipboardContent.content && typeof rawClipboardContent.content.size === "number" ? rawClipboardContent.content.size : null;
+  const hasFragmentContent = (fragmentSize ?? nestedSize ?? 0) > 0;
+  return {
+    html,
+    text,
+    hasContent: hasHtml || hasText || hasFragmentContent,
+    raw: rawClipboardContent
+  };
+}
 async function getEditorContext(editor, event) {
   const { view } = editor;
   const { state: state2 } = view;
@@ -83783,123 +83916,144 @@ async function getEditorContext(editor, event) {
     pos = from2;
     node = state2.doc.nodeAt(pos);
   }
-  const clipboardContent = await readFromClipboard(state2);
+  const rawClipboardContent = await readFromClipboard(state2);
+  const clipboardContent = normalizeClipboardContent(rawClipboardContent);
+  const structureFromResolvedPos = pos !== null ? getStructureFromResolvedPos(state2, pos) : null;
+  const isInTable2 = structureFromResolvedPos?.isInTable ?? selectionHasNodeOrMark(state2, "table", { requireEnds: true });
+  const isInList = structureFromResolvedPos?.isInList ?? (selectionHasNodeOrMark(state2, "bulletList", { requireEnds: false }) || selectionHasNodeOrMark(state2, "orderedList", { requireEnds: false }));
+  const isInSectionNode = structureFromResolvedPos?.isInSectionNode ?? selectionHasNodeOrMark(state2, "documentSection", { requireEnds: true });
+  const currentNodeType = node?.type?.name || null;
+  const activeMarks = [];
+  if (event && pos !== null) {
+    const $pos = state2.doc.resolve(pos);
+    if ($pos.marks && typeof $pos.marks === "function") {
+      $pos.marks().forEach((mark) => activeMarks.push(mark.type.name));
+    }
+    if (node && node.marks) {
+      node.marks.forEach((mark) => activeMarks.push(mark.type.name));
+    }
+  } else {
+    state2.storedMarks?.forEach((mark) => activeMarks.push(mark.type.name));
+    state2.selection.$head.marks().forEach((mark) => activeMarks.push(mark.type.name));
+  }
+  const isTrackedChange = activeMarks.includes("trackInsert") || activeMarks.includes("trackDelete");
+  let trackedChangeId = null;
+  if (isTrackedChange && event && pos !== null) {
+    const $pos = state2.doc.resolve(pos);
+    const marksAtPos = $pos.marks();
+    const trackedMark = marksAtPos.find((mark) => mark.type.name === "trackInsert" || mark.type.name === "trackDelete");
+    if (trackedMark) {
+      trackedChangeId = trackedMark.attrs.id;
+    }
+  }
+  const cursorCoords = pos ? view.coordsAtPos(pos) : null;
+  const cursorPosition = cursorCoords ? {
+    x: cursorCoords.left,
+    y: cursorCoords.top
+  } : null;
   return {
-    editor,
+    // Selection info
     selectedText,
+    hasSelection: !empty2,
+    selectionStart: from2,
+    selectionEnd: to,
+    // Document structure
+    isInTable: isInTable2,
+    isInList,
+    isInSectionNode,
+    currentNodeType,
+    activeMarks,
+    // Document state
+    isTrackedChange,
+    trackedChangeId,
+    documentMode: editor.options?.documentMode || "editing",
+    canUndo: computeCanUndo(editor, state2),
+    canRedo: computeCanRedo(editor, state2),
+    isEditable: editor.isEditable,
+    // Clipboard
+    clipboardContent,
+    // Position and trigger info
+    cursorPosition,
     pos,
     node,
     event,
-    clipboardContent
+    // Editor reference for advanced use cases
+    editor
   };
 }
-const onMarginClickCursorChange = (event, editor) => {
-  const y2 = event.clientY;
-  const x = event.clientX;
-  const { view } = editor;
-  const editorRect = view.dom.getBoundingClientRect();
-  let coords = {
-    left: 0,
-    top: y2
-  };
-  let isRightMargin = false;
-  if (x > editorRect.right) {
-    coords.left = editorRect.left + editorRect.width - 1;
-    isRightMargin = true;
-  } else if (x < editorRect.left) {
-    coords.left = editorRect.left;
+function computeCanUndo(editor, state2) {
+  if (typeof editor?.can === "function") {
+    try {
+      const can = editor.can();
+      if (can && typeof can.undo === "function") {
+        return !!can.undo();
+      }
+    } catch (error) {
+      console.warn("[SlashMenu] Unable to determine undo availability via editor.can():", error);
+    }
   }
-  const pos = view.posAtCoords(coords)?.pos;
-  if (pos) {
-    let cursorPos = pos;
-    if (isRightMargin) {
-      const $pos = view.state.doc.resolve(pos);
-      const charOffset = $pos.textOffset;
-      const node = view.state.doc.nodeAt(pos);
-      const text = node?.text;
-      const charAtPos = text?.charAt(charOffset);
-      cursorPos = node?.isText && charAtPos !== " " ? pos - 1 : pos;
+  if (isCollaborationEnabled(editor)) {
+    try {
+      const undoManager = yUndoPluginKey.getState(state2)?.undoManager;
+      return !!undoManager && undoManager.undoStack.length > 0;
+    } catch (error) {
+      console.warn("[SlashMenu] Unable to determine undo availability via y-prosemirror:", error);
     }
-    const transaction = view.state.tr.setSelection(TextSelection$1.create(view.state.doc, cursorPos));
-    view.dispatch(transaction);
-    view.focus();
   }
-};
-const checkNodeSpecificClicks = (editor, event, popoverControls) => {
-  if (!editor) return;
-  if (selectionHasNodeOrMark(editor.view.state, "link", { requireEnds: true })) {
-    popoverControls.component = LinkInput;
-    popoverControls.position = {
-      left: `${event.clientX - editor.element.getBoundingClientRect().left}px`,
-      top: `${event.clientY - editor.element.getBoundingClientRect().top + 15}px`
-    };
-    popoverControls.props = {
-      showInput: true
-    };
-    popoverControls.visible = true;
+  try {
+    return undoDepth(state2) > 0;
+  } catch (error) {
+    console.warn("[SlashMenu] Unable to determine undo availability via history plugin:", error);
+    return false;
   }
-};
-function selectionHasNodeOrMark(state2, name, options = {}) {
-  const { requireEnds = false } = options;
-  const $from = state2.selection.$from;
-  const $to = state2.selection.$to;
-  if (requireEnds) {
-    for (let d2 = $from.depth; d2 > 0; d2--) {
-      if ($from.node(d2).type.name === name) {
-        return true;
-      }
-    }
-    for (let d2 = $to.depth; d2 > 0; d2--) {
-      if ($to.node(d2).type.name === name) {
-        return true;
-      }
-    }
-  } else {
-    for (let d2 = $from.depth; d2 > 0; d2--) {
-      if ($from.node(d2).type.name === name) {
-        return true;
+}
+function computeCanRedo(editor, state2) {
+  if (typeof editor?.can === "function") {
+    try {
+      const can = editor.can();
+      if (can && typeof can.redo === "function") {
+        return !!can.redo();
       }
+    } catch (error) {
+      console.warn("[SlashMenu] Unable to determine redo availability via editor.can():", error);
     }
   }
-  const markType = state2.schema.marks[name];
-  if (markType) {
-    const { from: from2, to, empty: empty2 } = state2.selection;
-    if (requireEnds) {
-      const fromMarks = markType.isInSet($from.marks());
-      const toMarks = markType.isInSet($to.marks());
-      if (fromMarks || toMarks) {
-        return true;
-      }
-      if (empty2 && markType.isInSet(state2.storedMarks || $from.marks())) {
-        return true;
-      }
-    } else {
-      if (empty2) {
-        if (markType.isInSet(state2.storedMarks || $from.marks())) {
-          return true;
-        }
-      } else {
-        let hasMark = false;
-        state2.doc.nodesBetween(from2, to, (node) => {
-          if (markType.isInSet(node.marks)) {
-            hasMark = true;
-            return false;
-          }
-        });
-        if (hasMark) return true;
-      }
+  if (isCollaborationEnabled(editor)) {
+    try {
+      const undoManager = yUndoPluginKey.getState(state2)?.undoManager;
+      return !!undoManager && undoManager.redoStack.length > 0;
+    } catch (error) {
+      console.warn("[SlashMenu] Unable to determine redo availability via y-prosemirror:", error);
     }
   }
-  return false;
+  try {
+    return redoDepth(state2) > 0;
+  } catch (error) {
+    console.warn("[SlashMenu] Unable to determine redo availability via history plugin:", error);
+    return false;
+  }
 }
-function moveCursorToMouseEvent(event, editor) {
-  const { view } = editor;
-  const coords = { left: event.clientX, top: event.clientY };
-  const pos = view.posAtCoords(coords)?.pos;
-  if (typeof pos === "number") {
-    const tr = view.state.tr.setSelection(TextSelection$1.create(view.state.doc, pos));
-    view.dispatch(tr);
-    view.focus();
+function isCollaborationEnabled(editor) {
+  return Boolean(editor?.options?.collaborationProvider && editor?.options?.ydoc);
+}
+function getStructureFromResolvedPos(state2, pos) {
+  try {
+    const $pos = state2.doc.resolve(pos);
+    const ancestors = /* @__PURE__ */ new Set();
+    for (let depth = $pos.depth; depth > 0; depth--) {
+      ancestors.add($pos.node(depth).type.name);
+    }
+    const isInList = ancestors.has("bulletList") || ancestors.has("orderedList");
+    const isInTable2 = ancestors.has("table") || ancestors.has("tableRow") || ancestors.has("tableCell") || ancestors.has("tableHeader");
+    const isInSectionNode = ancestors.has("documentSection");
+    return {
+      isInTable: isInTable2,
+      isInList,
+      isInSectionNode
+    };
+  } catch (error) {
+    console.warn("[SlashMenu] Unable to resolve position for structural context:", error);
+    return null;
   }
 }
 const isModuleEnabled = (editorOptions, moduleName) => {
@@ -83913,8 +84067,52 @@ const isModuleEnabled = (editorOptions, moduleName) => {
       return true;
   }
 };
+function applyCustomMenuConfiguration(defaultSections, context) {
+  const { editor } = context;
+  const slashMenuConfig = editor.options?.slashMenuConfig;
+  if (!slashMenuConfig) {
+    return defaultSections;
+  }
+  let sections = [];
+  if (slashMenuConfig.includeDefaultItems !== false) {
+    sections = [...defaultSections];
+  }
+  if (slashMenuConfig.customItems && Array.isArray(slashMenuConfig.customItems)) {
+    sections = [...sections, ...slashMenuConfig.customItems];
+  }
+  if (typeof slashMenuConfig.menuProvider === "function") {
+    try {
+      sections = slashMenuConfig.menuProvider(context, sections) || sections;
+    } catch (error) {
+      console.warn("[SlashMenu] Error in custom menuProvider:", error);
+    }
+  }
+  return sections;
+}
+function filterCustomItems(sections, context) {
+  return sections.map((section) => {
+    const filteredItems = section.items.filter((item) => {
+      if (typeof item.showWhen === "function") {
+        try {
+          return item.showWhen(context);
+        } catch (error) {
+          console.warn(`[SlashMenu] Error in showWhen for item ${item.id}:`, error);
+          return false;
+        }
+      }
+      return true;
+    });
+    return {
+      ...section,
+      items: filteredItems
+    };
+  }).filter((section) => section.items.length > 0);
+}
 function getItems(context) {
   const { editor, selectedText, trigger: trigger2, clipboardContent } = context;
+  const clipboardHasContent = Boolean(
+    clipboardContent?.hasContent || clipboardContent?.html || clipboardContent?.text || typeof clipboardContent?.size === "number" && clipboardContent.size > 0 || clipboardContent && typeof clipboardContent?.content?.size === "number" && clipboardContent.content.size > 0 || clipboardContent?.raw && typeof clipboardContent.raw.size === "number" && clipboardContent.raw.size > 0 || clipboardContent?.raw && typeof clipboardContent.raw?.content?.size === "number" && clipboardContent.raw.content.size > 0
+  );
   const isInTable2 = selectionHasNodeOrMark(editor.view.state, "table", { requireEnds: true });
   const isInSectionNode = selectionHasNodeOrMark(editor.view.state, "documentSection", { requireEnds: true });
   const sections = [
@@ -84051,12 +84249,13 @@ function getItems(context) {
       ]
     }
   ];
-  const filteredSections = sections.map((section) => {
+  let allSections = applyCustomMenuConfiguration(sections, context);
+  const filteredSections = allSections.map((section) => {
     const filteredItems = section.items.filter((item) => {
       if (item.requiresModule && !isModuleEnabled(editor?.options, item.requiresModule)) return false;
       if (item.requiresSelection && !selectedText) return false;
       if (!item.allowedTriggers.includes(trigger2)) return false;
-      if (item.requiresClipboard && !clipboardContent) return false;
+      if (item.requiresClipboard && !clipboardHasContent) return false;
       if (item.requiresTableParent && !isInTable2 || item.id === "insert-table" && isInTable2) return false;
       if (item.requiresSectionParent && !isInSectionNode) return false;
       return true;
@@ -84066,7 +84265,8 @@ function getItems(context) {
       items: filteredItems
     };
   }).filter((section) => section.items.length > 0);
-  return filteredSections;
+  const finalSections = filterCustomItems(filteredSections, context);
+  return finalSections;
 }
 const _hoisted_1$3 = { class: "slash-menu-items" };
 const _hoisted_2$1 = {
@@ -84101,6 +84301,7 @@ const _sfc_main$4 = {
     const menuRef = vue.ref(null);
     const sections = vue.ref([]);
     const selectedId = vue.ref(null);
+    const currentContext = vue.ref(null);
     const handleEditorUpdate = () => {
       if (!props.editor?.isEditable && isOpen.value) {
         closeMenu({ restoreCursor: false });
@@ -84146,6 +84347,44 @@ const _sfc_main$4 = {
         selectedId.value = newItems[0].id;
       }
     });
+    const customItemRefs = /* @__PURE__ */ new Map();
+    const setCustomItemRef = (el, item) => {
+      if (el && item.render) {
+        customItemRefs.set(item.id, { element: el, item });
+        vue.nextTick(() => {
+          renderCustomItem(item.id);
+        });
+      }
+    };
+    const renderCustomItem = async (itemId) => {
+      const refData = customItemRefs.get(itemId);
+      if (!refData || refData.element.hasCustomContent) return;
+      const { element, item } = refData;
+      try {
+        if (!currentContext.value) {
+          currentContext.value = await getEditorContext(props.editor);
+        }
+        const context = currentContext.value;
+        const customElement = item.render(context);
+        if (customElement instanceof HTMLElement) {
+          element.innerHTML = "";
+          element.appendChild(customElement);
+          element.hasCustomContent = true;
+        }
+      } catch (error) {
+        console.warn(`[SlashMenu] Error rendering custom item ${itemId}:`, error);
+        element.innerHTML = `<span>${item.label || "Custom Item"}</span>`;
+        element.hasCustomContent = true;
+      }
+    };
+    const cleanupCustomItems = () => {
+      customItemRefs.forEach((refData) => {
+        if (refData.element) {
+          refData.element.hasCustomContent = false;
+        }
+      });
+      customItemRefs.clear();
+    };
     const handleGlobalKeyDown = (event) => {
       if (event.key === "Escape") {
         event.preventDefault();
@@ -84196,22 +84435,23 @@ const _sfc_main$4 = {
         return;
       }
       event.preventDefault();
+      const context = await getEditorContext(props.editor, event);
+      currentContext.value = context;
+      sections.value = getItems({ ...context, trigger: "click" });
+      selectedId.value = flattenedItems.value[0]?.id || null;
+      searchQuery.value = "";
       props.editor.view.dispatch(
         props.editor.view.state.tr.setMeta(SlashMenuPluginKey, {
           type: "open",
-          pos: props.editor.view.state.selection.from,
+          pos: context?.pos ?? props.editor.view.state.selection.from,
           clientX: event.clientX,
           clientY: event.clientY
         })
       );
-      searchQuery.value = "";
-      const context = await getEditorContext(props.editor, event);
-      sections.value = getItems({ ...context, trigger: "click" });
-      selectedId.value = flattenedItems.value[0]?.id || null;
     };
     const executeCommand = async (item) => {
       if (props.editor) {
-        item.action ? await item.action(props.editor) : null;
+        item.action ? await item.action(props.editor, currentContext.value) : null;
         if (item.component) {
           menuRef.value;
           const componentProps = getPropsByItemId(item.id, props);
@@ -84229,7 +84469,7 @@ const _sfc_main$4 = {
     const closeMenu = (options = { restoreCursor: true }) => {
       if (props.editor?.view) {
         const pluginState = SlashMenuPluginKey.getState(props.editor.view.state);
-        const { anchorPos } = pluginState;
+        const anchorPos = pluginState?.anchorPos;
         props.editor.view.dispatch(
           props.editor.view.state.tr.setMeta(SlashMenuPluginKey, {
             type: "close"
@@ -84242,6 +84482,8 @@ const _sfc_main$4 = {
           props.editor.view.dispatch(tr);
           props.editor.view.focus();
         }
+        cleanupCustomItems();
+        currentContext.value = null;
         isOpen.value = false;
         searchQuery.value = "";
         sections.value = [];
@@ -84258,19 +84500,29 @@ const _sfc_main$4 = {
         isOpen.value = true;
         menuPosition.value = event.menuPosition;
         searchQuery.value = "";
-        const context = await getEditorContext(props.editor);
-        sections.value = getItems({ ...context, trigger: "slash" });
-        selectedId.value = flattenedItems.value[0]?.id || null;
+        if (!currentContext.value) {
+          const context = await getEditorContext(props.editor);
+          currentContext.value = context;
+          sections.value = getItems({ ...context, trigger: "slash" });
+          selectedId.value = flattenedItems.value[0]?.id || null;
+        } else if (sections.value.length === 0) {
+          const trigger2 = currentContext.value.event?.type === "contextmenu" ? "click" : "slash";
+          sections.value = getItems({ ...currentContext.value, trigger: trigger2 });
+          selectedId.value = flattenedItems.value[0]?.id || null;
+        }
       });
       props.editor.view.dom.addEventListener("contextmenu", handleRightClick);
       props.editor.on("slashMenu:close", () => {
+        cleanupCustomItems();
         isOpen.value = false;
         searchQuery.value = "";
+        currentContext.value = null;
       });
     });
     vue.onBeforeUnmount(() => {
       document.removeEventListener("keydown", handleGlobalKeyDown);
       document.removeEventListener("mousedown", handleGlobalOutsideClick);
+      cleanupCustomItems();
       if (props.editor) {
         try {
           props.editor.off("slashMenu:open");
@@ -84317,12 +84569,19 @@ const _sfc_main$4 = {
                   class: vue.normalizeClass(["slash-menu-item", { "is-selected": item.id === selectedId.value }]),
                   onClick: ($event) => executeCommand(item)
                 }, [
-                  item.icon ? (vue.openBlock(), vue.createElementBlock("span", {
+                  item.render ? (vue.openBlock(), vue.createElementBlock("div", {
                     key: 0,
-                    class: "slash-menu-item-icon",
-                    innerHTML: item.icon
-                  }, null, 8, _hoisted_4)) : vue.createCommentVNode("", true),
-                  vue.createBaseVNode("span", null, vue.toDisplayString(item.label), 1)
+                    ref_for: true,
+                    ref: (el) => setCustomItemRef(el, item),
+                    class: "slash-menu-custom-item"
+                  }, null, 512)) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
+                    item.icon ? (vue.openBlock(), vue.createElementBlock("span", {
+                      key: 0,
+                      class: "slash-menu-item-icon",
+                      innerHTML: item.icon
+                    }, null, 8, _hoisted_4)) : vue.createCommentVNode("", true),
+                    vue.createBaseVNode("span", null, vue.toDisplayString(item.label), 1)
+                  ], 64))
                 ], 10, _hoisted_3$1);
               }), 128))
             ], 64);