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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3208,6 +3208,115 @@ runCommandWithArgumentOnly_fn = function({ item, argument, noArgumentCallback =
3208
3208
  this.updateToolbarState();
3209
3209
  }
3210
3210
  };
3211
+ const onMarginClickCursorChange = (event, editor) => {
3212
+ const y = event.clientY;
3213
+ const x = event.clientX;
3214
+ const { view } = editor;
3215
+ const editorRect = view.dom.getBoundingClientRect();
3216
+ let coords = {
3217
+ left: 0,
3218
+ top: y
3219
+ };
3220
+ let isRightMargin = false;
3221
+ if (x > editorRect.right) {
3222
+ coords.left = editorRect.left + editorRect.width - 1;
3223
+ isRightMargin = true;
3224
+ } else if (x < editorRect.left) {
3225
+ coords.left = editorRect.left;
3226
+ }
3227
+ const pos = view.posAtCoords(coords)?.pos;
3228
+ if (pos) {
3229
+ let cursorPos = pos;
3230
+ if (isRightMargin) {
3231
+ const $pos = view.state.doc.resolve(pos);
3232
+ const charOffset = $pos.textOffset;
3233
+ const node = view.state.doc.nodeAt(pos);
3234
+ const text = node?.text;
3235
+ const charAtPos = text?.charAt(charOffset);
3236
+ cursorPos = node?.isText && charAtPos !== " " ? pos - 1 : pos;
3237
+ }
3238
+ const transaction = view.state.tr.setSelection(TextSelection$1.create(view.state.doc, cursorPos));
3239
+ view.dispatch(transaction);
3240
+ view.focus();
3241
+ }
3242
+ };
3243
+ const checkNodeSpecificClicks = (editor, event, popoverControls) => {
3244
+ if (!editor) return;
3245
+ if (selectionHasNodeOrMark(editor.view.state, "link", { requireEnds: true })) {
3246
+ popoverControls.component = LinkInput;
3247
+ popoverControls.position = {
3248
+ left: `${event.clientX - editor.element.getBoundingClientRect().left}px`,
3249
+ top: `${event.clientY - editor.element.getBoundingClientRect().top + 15}px`
3250
+ };
3251
+ popoverControls.props = {
3252
+ showInput: true
3253
+ };
3254
+ popoverControls.visible = true;
3255
+ }
3256
+ };
3257
+ function selectionHasNodeOrMark(state, name, options = {}) {
3258
+ const { requireEnds = false } = options;
3259
+ const $from = state.selection.$from;
3260
+ const $to = state.selection.$to;
3261
+ if (requireEnds) {
3262
+ for (let d = $from.depth; d > 0; d--) {
3263
+ if ($from.node(d).type.name === name) {
3264
+ return true;
3265
+ }
3266
+ }
3267
+ for (let d = $to.depth; d > 0; d--) {
3268
+ if ($to.node(d).type.name === name) {
3269
+ return true;
3270
+ }
3271
+ }
3272
+ } else {
3273
+ for (let d = $from.depth; d > 0; d--) {
3274
+ if ($from.node(d).type.name === name) {
3275
+ return true;
3276
+ }
3277
+ }
3278
+ }
3279
+ const markType = state.schema.marks[name];
3280
+ if (markType) {
3281
+ const { from, to, empty } = state.selection;
3282
+ if (requireEnds) {
3283
+ const fromMarks = markType.isInSet($from.marks());
3284
+ const toMarks = markType.isInSet($to.marks());
3285
+ if (fromMarks || toMarks) {
3286
+ return true;
3287
+ }
3288
+ if (empty && markType.isInSet(state.storedMarks || $from.marks())) {
3289
+ return true;
3290
+ }
3291
+ } else {
3292
+ if (empty) {
3293
+ if (markType.isInSet(state.storedMarks || $from.marks())) {
3294
+ return true;
3295
+ }
3296
+ } else {
3297
+ let hasMark = false;
3298
+ state.doc.nodesBetween(from, to, (node) => {
3299
+ if (markType.isInSet(node.marks)) {
3300
+ hasMark = true;
3301
+ return false;
3302
+ }
3303
+ });
3304
+ if (hasMark) return true;
3305
+ }
3306
+ }
3307
+ }
3308
+ return false;
3309
+ }
3310
+ function moveCursorToMouseEvent(event, editor) {
3311
+ const { view } = editor;
3312
+ const coords = { left: event.clientX, top: event.clientY };
3313
+ const pos = view.posAtCoords(coords)?.pos;
3314
+ if (typeof pos === "number") {
3315
+ const tr = view.state.tr.setSelection(TextSelection$1.create(view.state.doc, pos));
3316
+ view.dispatch(tr);
3317
+ view.focus();
3318
+ }
3319
+ }
3211
3320
  const ICONS = {
3212
3321
  addRowBefore: plusIconSvg,
3213
3322
  addRowAfter: plusIconSvg,
@@ -3407,6 +3516,30 @@ const getPropsByItemId = (itemId, props) => {
3407
3516
  return baseProps;
3408
3517
  }
3409
3518
  };
3519
+ function normalizeClipboardContent(rawClipboardContent) {
3520
+ if (!rawClipboardContent) {
3521
+ return {
3522
+ html: null,
3523
+ text: null,
3524
+ hasContent: false,
3525
+ raw: null
3526
+ };
3527
+ }
3528
+ const html = typeof rawClipboardContent.html === "string" ? rawClipboardContent.html : null;
3529
+ const text = typeof rawClipboardContent.text === "string" ? rawClipboardContent.text : null;
3530
+ const hasHtml = !!html && html.trim().length > 0;
3531
+ const hasText = !!text && text.length > 0;
3532
+ const isObject = typeof rawClipboardContent === "object" && rawClipboardContent !== null;
3533
+ const fragmentSize = typeof rawClipboardContent.size === "number" ? rawClipboardContent.size : null;
3534
+ const nestedSize = isObject && rawClipboardContent.content && typeof rawClipboardContent.content.size === "number" ? rawClipboardContent.content.size : null;
3535
+ const hasFragmentContent = (fragmentSize ?? nestedSize ?? 0) > 0;
3536
+ return {
3537
+ html,
3538
+ text,
3539
+ hasContent: hasHtml || hasText || hasFragmentContent,
3540
+ raw: rawClipboardContent
3541
+ };
3542
+ }
3410
3543
  async function getEditorContext(editor, event) {
3411
3544
  const { view } = editor;
3412
3545
  const { state } = view;
@@ -3422,123 +3555,144 @@ async function getEditorContext(editor, event) {
3422
3555
  pos = from;
3423
3556
  node = state.doc.nodeAt(pos);
3424
3557
  }
3425
- const clipboardContent = await readFromClipboard(state);
3558
+ const rawClipboardContent = await readFromClipboard(state);
3559
+ const clipboardContent = normalizeClipboardContent(rawClipboardContent);
3560
+ const structureFromResolvedPos = pos !== null ? getStructureFromResolvedPos(state, pos) : null;
3561
+ const isInTable2 = structureFromResolvedPos?.isInTable ?? selectionHasNodeOrMark(state, "table", { requireEnds: true });
3562
+ const isInList = structureFromResolvedPos?.isInList ?? (selectionHasNodeOrMark(state, "bulletList", { requireEnds: false }) || selectionHasNodeOrMark(state, "orderedList", { requireEnds: false }));
3563
+ const isInSectionNode = structureFromResolvedPos?.isInSectionNode ?? selectionHasNodeOrMark(state, "documentSection", { requireEnds: true });
3564
+ const currentNodeType = node?.type?.name || null;
3565
+ const activeMarks = [];
3566
+ if (event && pos !== null) {
3567
+ const $pos = state.doc.resolve(pos);
3568
+ if ($pos.marks && typeof $pos.marks === "function") {
3569
+ $pos.marks().forEach((mark) => activeMarks.push(mark.type.name));
3570
+ }
3571
+ if (node && node.marks) {
3572
+ node.marks.forEach((mark) => activeMarks.push(mark.type.name));
3573
+ }
3574
+ } else {
3575
+ state.storedMarks?.forEach((mark) => activeMarks.push(mark.type.name));
3576
+ state.selection.$head.marks().forEach((mark) => activeMarks.push(mark.type.name));
3577
+ }
3578
+ const isTrackedChange = activeMarks.includes("trackInsert") || activeMarks.includes("trackDelete");
3579
+ let trackedChangeId = null;
3580
+ if (isTrackedChange && event && pos !== null) {
3581
+ const $pos = state.doc.resolve(pos);
3582
+ const marksAtPos = $pos.marks();
3583
+ const trackedMark = marksAtPos.find((mark) => mark.type.name === "trackInsert" || mark.type.name === "trackDelete");
3584
+ if (trackedMark) {
3585
+ trackedChangeId = trackedMark.attrs.id;
3586
+ }
3587
+ }
3588
+ const cursorCoords = pos ? view.coordsAtPos(pos) : null;
3589
+ const cursorPosition = cursorCoords ? {
3590
+ x: cursorCoords.left,
3591
+ y: cursorCoords.top
3592
+ } : null;
3426
3593
  return {
3427
- editor,
3594
+ // Selection info
3428
3595
  selectedText,
3596
+ hasSelection: !empty,
3597
+ selectionStart: from,
3598
+ selectionEnd: to,
3599
+ // Document structure
3600
+ isInTable: isInTable2,
3601
+ isInList,
3602
+ isInSectionNode,
3603
+ currentNodeType,
3604
+ activeMarks,
3605
+ // Document state
3606
+ isTrackedChange,
3607
+ trackedChangeId,
3608
+ documentMode: editor.options?.documentMode || "editing",
3609
+ canUndo: computeCanUndo(editor, state),
3610
+ canRedo: computeCanRedo(editor, state),
3611
+ isEditable: editor.isEditable,
3612
+ // Clipboard
3613
+ clipboardContent,
3614
+ // Position and trigger info
3615
+ cursorPosition,
3429
3616
  pos,
3430
3617
  node,
3431
3618
  event,
3432
- clipboardContent
3619
+ // Editor reference for advanced use cases
3620
+ editor
3433
3621
  };
3434
3622
  }
3435
- const onMarginClickCursorChange = (event, editor) => {
3436
- const y = event.clientY;
3437
- const x = event.clientX;
3438
- const { view } = editor;
3439
- const editorRect = view.dom.getBoundingClientRect();
3440
- let coords = {
3441
- left: 0,
3442
- top: y
3443
- };
3444
- let isRightMargin = false;
3445
- if (x > editorRect.right) {
3446
- coords.left = editorRect.left + editorRect.width - 1;
3447
- isRightMargin = true;
3448
- } else if (x < editorRect.left) {
3449
- coords.left = editorRect.left;
3623
+ function computeCanUndo(editor, state) {
3624
+ if (typeof editor?.can === "function") {
3625
+ try {
3626
+ const can = editor.can();
3627
+ if (can && typeof can.undo === "function") {
3628
+ return !!can.undo();
3629
+ }
3630
+ } catch (error) {
3631
+ console.warn("[SlashMenu] Unable to determine undo availability via editor.can():", error);
3632
+ }
3450
3633
  }
3451
- const pos = view.posAtCoords(coords)?.pos;
3452
- if (pos) {
3453
- let cursorPos = pos;
3454
- if (isRightMargin) {
3455
- const $pos = view.state.doc.resolve(pos);
3456
- const charOffset = $pos.textOffset;
3457
- const node = view.state.doc.nodeAt(pos);
3458
- const text = node?.text;
3459
- const charAtPos = text?.charAt(charOffset);
3460
- cursorPos = node?.isText && charAtPos !== " " ? pos - 1 : pos;
3634
+ if (isCollaborationEnabled(editor)) {
3635
+ try {
3636
+ const undoManager = yUndoPluginKey.getState(state)?.undoManager;
3637
+ return !!undoManager && undoManager.undoStack.length > 0;
3638
+ } catch (error) {
3639
+ console.warn("[SlashMenu] Unable to determine undo availability via y-prosemirror:", error);
3461
3640
  }
3462
- const transaction = view.state.tr.setSelection(TextSelection$1.create(view.state.doc, cursorPos));
3463
- view.dispatch(transaction);
3464
- view.focus();
3465
3641
  }
3466
- };
3467
- const checkNodeSpecificClicks = (editor, event, popoverControls) => {
3468
- if (!editor) return;
3469
- if (selectionHasNodeOrMark(editor.view.state, "link", { requireEnds: true })) {
3470
- popoverControls.component = LinkInput;
3471
- popoverControls.position = {
3472
- left: `${event.clientX - editor.element.getBoundingClientRect().left}px`,
3473
- top: `${event.clientY - editor.element.getBoundingClientRect().top + 15}px`
3474
- };
3475
- popoverControls.props = {
3476
- showInput: true
3477
- };
3478
- popoverControls.visible = true;
3642
+ try {
3643
+ return undoDepth(state) > 0;
3644
+ } catch (error) {
3645
+ console.warn("[SlashMenu] Unable to determine undo availability via history plugin:", error);
3646
+ return false;
3479
3647
  }
3480
- };
3481
- function selectionHasNodeOrMark(state, name, options = {}) {
3482
- const { requireEnds = false } = options;
3483
- const $from = state.selection.$from;
3484
- const $to = state.selection.$to;
3485
- if (requireEnds) {
3486
- for (let d = $from.depth; d > 0; d--) {
3487
- if ($from.node(d).type.name === name) {
3488
- return true;
3489
- }
3490
- }
3491
- for (let d = $to.depth; d > 0; d--) {
3492
- if ($to.node(d).type.name === name) {
3493
- return true;
3494
- }
3495
- }
3496
- } else {
3497
- for (let d = $from.depth; d > 0; d--) {
3498
- if ($from.node(d).type.name === name) {
3499
- return true;
3648
+ }
3649
+ function computeCanRedo(editor, state) {
3650
+ if (typeof editor?.can === "function") {
3651
+ try {
3652
+ const can = editor.can();
3653
+ if (can && typeof can.redo === "function") {
3654
+ return !!can.redo();
3500
3655
  }
3656
+ } catch (error) {
3657
+ console.warn("[SlashMenu] Unable to determine redo availability via editor.can():", error);
3501
3658
  }
3502
3659
  }
3503
- const markType = state.schema.marks[name];
3504
- if (markType) {
3505
- const { from, to, empty } = state.selection;
3506
- if (requireEnds) {
3507
- const fromMarks = markType.isInSet($from.marks());
3508
- const toMarks = markType.isInSet($to.marks());
3509
- if (fromMarks || toMarks) {
3510
- return true;
3511
- }
3512
- if (empty && markType.isInSet(state.storedMarks || $from.marks())) {
3513
- return true;
3514
- }
3515
- } else {
3516
- if (empty) {
3517
- if (markType.isInSet(state.storedMarks || $from.marks())) {
3518
- return true;
3519
- }
3520
- } else {
3521
- let hasMark = false;
3522
- state.doc.nodesBetween(from, to, (node) => {
3523
- if (markType.isInSet(node.marks)) {
3524
- hasMark = true;
3525
- return false;
3526
- }
3527
- });
3528
- if (hasMark) return true;
3529
- }
3660
+ if (isCollaborationEnabled(editor)) {
3661
+ try {
3662
+ const undoManager = yUndoPluginKey.getState(state)?.undoManager;
3663
+ return !!undoManager && undoManager.redoStack.length > 0;
3664
+ } catch (error) {
3665
+ console.warn("[SlashMenu] Unable to determine redo availability via y-prosemirror:", error);
3530
3666
  }
3531
3667
  }
3532
- return false;
3668
+ try {
3669
+ return redoDepth(state) > 0;
3670
+ } catch (error) {
3671
+ console.warn("[SlashMenu] Unable to determine redo availability via history plugin:", error);
3672
+ return false;
3673
+ }
3533
3674
  }
3534
- function moveCursorToMouseEvent(event, editor) {
3535
- const { view } = editor;
3536
- const coords = { left: event.clientX, top: event.clientY };
3537
- const pos = view.posAtCoords(coords)?.pos;
3538
- if (typeof pos === "number") {
3539
- const tr = view.state.tr.setSelection(TextSelection$1.create(view.state.doc, pos));
3540
- view.dispatch(tr);
3541
- view.focus();
3675
+ function isCollaborationEnabled(editor) {
3676
+ return Boolean(editor?.options?.collaborationProvider && editor?.options?.ydoc);
3677
+ }
3678
+ function getStructureFromResolvedPos(state, pos) {
3679
+ try {
3680
+ const $pos = state.doc.resolve(pos);
3681
+ const ancestors = /* @__PURE__ */ new Set();
3682
+ for (let depth = $pos.depth; depth > 0; depth--) {
3683
+ ancestors.add($pos.node(depth).type.name);
3684
+ }
3685
+ const isInList = ancestors.has("bulletList") || ancestors.has("orderedList");
3686
+ const isInTable2 = ancestors.has("table") || ancestors.has("tableRow") || ancestors.has("tableCell") || ancestors.has("tableHeader");
3687
+ const isInSectionNode = ancestors.has("documentSection");
3688
+ return {
3689
+ isInTable: isInTable2,
3690
+ isInList,
3691
+ isInSectionNode
3692
+ };
3693
+ } catch (error) {
3694
+ console.warn("[SlashMenu] Unable to resolve position for structural context:", error);
3695
+ return null;
3542
3696
  }
3543
3697
  }
3544
3698
  const isModuleEnabled = (editorOptions, moduleName) => {
@@ -3552,8 +3706,52 @@ const isModuleEnabled = (editorOptions, moduleName) => {
3552
3706
  return true;
3553
3707
  }
3554
3708
  };
3709
+ function applyCustomMenuConfiguration(defaultSections, context) {
3710
+ const { editor } = context;
3711
+ const slashMenuConfig = editor.options?.slashMenuConfig;
3712
+ if (!slashMenuConfig) {
3713
+ return defaultSections;
3714
+ }
3715
+ let sections = [];
3716
+ if (slashMenuConfig.includeDefaultItems !== false) {
3717
+ sections = [...defaultSections];
3718
+ }
3719
+ if (slashMenuConfig.customItems && Array.isArray(slashMenuConfig.customItems)) {
3720
+ sections = [...sections, ...slashMenuConfig.customItems];
3721
+ }
3722
+ if (typeof slashMenuConfig.menuProvider === "function") {
3723
+ try {
3724
+ sections = slashMenuConfig.menuProvider(context, sections) || sections;
3725
+ } catch (error) {
3726
+ console.warn("[SlashMenu] Error in custom menuProvider:", error);
3727
+ }
3728
+ }
3729
+ return sections;
3730
+ }
3731
+ function filterCustomItems(sections, context) {
3732
+ return sections.map((section) => {
3733
+ const filteredItems = section.items.filter((item) => {
3734
+ if (typeof item.showWhen === "function") {
3735
+ try {
3736
+ return item.showWhen(context);
3737
+ } catch (error) {
3738
+ console.warn(`[SlashMenu] Error in showWhen for item ${item.id}:`, error);
3739
+ return false;
3740
+ }
3741
+ }
3742
+ return true;
3743
+ });
3744
+ return {
3745
+ ...section,
3746
+ items: filteredItems
3747
+ };
3748
+ }).filter((section) => section.items.length > 0);
3749
+ }
3555
3750
  function getItems(context) {
3556
3751
  const { editor, selectedText, trigger, clipboardContent } = context;
3752
+ const clipboardHasContent = Boolean(
3753
+ 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
3754
+ );
3557
3755
  const isInTable2 = selectionHasNodeOrMark(editor.view.state, "table", { requireEnds: true });
3558
3756
  const isInSectionNode = selectionHasNodeOrMark(editor.view.state, "documentSection", { requireEnds: true });
3559
3757
  const sections = [
@@ -3690,12 +3888,13 @@ function getItems(context) {
3690
3888
  ]
3691
3889
  }
3692
3890
  ];
3693
- const filteredSections = sections.map((section) => {
3891
+ let allSections = applyCustomMenuConfiguration(sections, context);
3892
+ const filteredSections = allSections.map((section) => {
3694
3893
  const filteredItems = section.items.filter((item) => {
3695
3894
  if (item.requiresModule && !isModuleEnabled(editor?.options, item.requiresModule)) return false;
3696
3895
  if (item.requiresSelection && !selectedText) return false;
3697
3896
  if (!item.allowedTriggers.includes(trigger)) return false;
3698
- if (item.requiresClipboard && !clipboardContent) return false;
3897
+ if (item.requiresClipboard && !clipboardHasContent) return false;
3699
3898
  if (item.requiresTableParent && !isInTable2 || item.id === "insert-table" && isInTable2) return false;
3700
3899
  if (item.requiresSectionParent && !isInSectionNode) return false;
3701
3900
  return true;
@@ -3705,7 +3904,8 @@ function getItems(context) {
3705
3904
  items: filteredItems
3706
3905
  };
3707
3906
  }).filter((section) => section.items.length > 0);
3708
- return filteredSections;
3907
+ const finalSections = filterCustomItems(filteredSections, context);
3908
+ return finalSections;
3709
3909
  }
3710
3910
  const _hoisted_1$3 = { class: "slash-menu-items" };
3711
3911
  const _hoisted_2$1 = {
@@ -3740,6 +3940,7 @@ const _sfc_main$4 = {
3740
3940
  const menuRef = ref(null);
3741
3941
  const sections = ref([]);
3742
3942
  const selectedId = ref(null);
3943
+ const currentContext = ref(null);
3743
3944
  const handleEditorUpdate = () => {
3744
3945
  if (!props.editor?.isEditable && isOpen.value) {
3745
3946
  closeMenu({ restoreCursor: false });
@@ -3785,6 +3986,44 @@ const _sfc_main$4 = {
3785
3986
  selectedId.value = newItems[0].id;
3786
3987
  }
3787
3988
  });
3989
+ const customItemRefs = /* @__PURE__ */ new Map();
3990
+ const setCustomItemRef = (el, item) => {
3991
+ if (el && item.render) {
3992
+ customItemRefs.set(item.id, { element: el, item });
3993
+ nextTick(() => {
3994
+ renderCustomItem(item.id);
3995
+ });
3996
+ }
3997
+ };
3998
+ const renderCustomItem = async (itemId) => {
3999
+ const refData = customItemRefs.get(itemId);
4000
+ if (!refData || refData.element.hasCustomContent) return;
4001
+ const { element, item } = refData;
4002
+ try {
4003
+ if (!currentContext.value) {
4004
+ currentContext.value = await getEditorContext(props.editor);
4005
+ }
4006
+ const context = currentContext.value;
4007
+ const customElement = item.render(context);
4008
+ if (customElement instanceof HTMLElement) {
4009
+ element.innerHTML = "";
4010
+ element.appendChild(customElement);
4011
+ element.hasCustomContent = true;
4012
+ }
4013
+ } catch (error) {
4014
+ console.warn(`[SlashMenu] Error rendering custom item ${itemId}:`, error);
4015
+ element.innerHTML = `<span>${item.label || "Custom Item"}</span>`;
4016
+ element.hasCustomContent = true;
4017
+ }
4018
+ };
4019
+ const cleanupCustomItems = () => {
4020
+ customItemRefs.forEach((refData) => {
4021
+ if (refData.element) {
4022
+ refData.element.hasCustomContent = false;
4023
+ }
4024
+ });
4025
+ customItemRefs.clear();
4026
+ };
3788
4027
  const handleGlobalKeyDown = (event) => {
3789
4028
  if (event.key === "Escape") {
3790
4029
  event.preventDefault();
@@ -3835,22 +4074,23 @@ const _sfc_main$4 = {
3835
4074
  return;
3836
4075
  }
3837
4076
  event.preventDefault();
4077
+ const context = await getEditorContext(props.editor, event);
4078
+ currentContext.value = context;
4079
+ sections.value = getItems({ ...context, trigger: "click" });
4080
+ selectedId.value = flattenedItems.value[0]?.id || null;
4081
+ searchQuery.value = "";
3838
4082
  props.editor.view.dispatch(
3839
4083
  props.editor.view.state.tr.setMeta(SlashMenuPluginKey, {
3840
4084
  type: "open",
3841
- pos: props.editor.view.state.selection.from,
4085
+ pos: context?.pos ?? props.editor.view.state.selection.from,
3842
4086
  clientX: event.clientX,
3843
4087
  clientY: event.clientY
3844
4088
  })
3845
4089
  );
3846
- searchQuery.value = "";
3847
- const context = await getEditorContext(props.editor, event);
3848
- sections.value = getItems({ ...context, trigger: "click" });
3849
- selectedId.value = flattenedItems.value[0]?.id || null;
3850
4090
  };
3851
4091
  const executeCommand = async (item) => {
3852
4092
  if (props.editor) {
3853
- item.action ? await item.action(props.editor) : null;
4093
+ item.action ? await item.action(props.editor, currentContext.value) : null;
3854
4094
  if (item.component) {
3855
4095
  menuRef.value;
3856
4096
  const componentProps = getPropsByItemId(item.id, props);
@@ -3868,7 +4108,7 @@ const _sfc_main$4 = {
3868
4108
  const closeMenu = (options = { restoreCursor: true }) => {
3869
4109
  if (props.editor?.view) {
3870
4110
  const pluginState = SlashMenuPluginKey.getState(props.editor.view.state);
3871
- const { anchorPos } = pluginState;
4111
+ const anchorPos = pluginState?.anchorPos;
3872
4112
  props.editor.view.dispatch(
3873
4113
  props.editor.view.state.tr.setMeta(SlashMenuPluginKey, {
3874
4114
  type: "close"
@@ -3881,6 +4121,8 @@ const _sfc_main$4 = {
3881
4121
  props.editor.view.dispatch(tr);
3882
4122
  props.editor.view.focus();
3883
4123
  }
4124
+ cleanupCustomItems();
4125
+ currentContext.value = null;
3884
4126
  isOpen.value = false;
3885
4127
  searchQuery.value = "";
3886
4128
  sections.value = [];
@@ -3897,19 +4139,29 @@ const _sfc_main$4 = {
3897
4139
  isOpen.value = true;
3898
4140
  menuPosition.value = event.menuPosition;
3899
4141
  searchQuery.value = "";
3900
- const context = await getEditorContext(props.editor);
3901
- sections.value = getItems({ ...context, trigger: "slash" });
3902
- selectedId.value = flattenedItems.value[0]?.id || null;
4142
+ if (!currentContext.value) {
4143
+ const context = await getEditorContext(props.editor);
4144
+ currentContext.value = context;
4145
+ sections.value = getItems({ ...context, trigger: "slash" });
4146
+ selectedId.value = flattenedItems.value[0]?.id || null;
4147
+ } else if (sections.value.length === 0) {
4148
+ const trigger = currentContext.value.event?.type === "contextmenu" ? "click" : "slash";
4149
+ sections.value = getItems({ ...currentContext.value, trigger });
4150
+ selectedId.value = flattenedItems.value[0]?.id || null;
4151
+ }
3903
4152
  });
3904
4153
  props.editor.view.dom.addEventListener("contextmenu", handleRightClick);
3905
4154
  props.editor.on("slashMenu:close", () => {
4155
+ cleanupCustomItems();
3906
4156
  isOpen.value = false;
3907
4157
  searchQuery.value = "";
4158
+ currentContext.value = null;
3908
4159
  });
3909
4160
  });
3910
4161
  onBeforeUnmount(() => {
3911
4162
  document.removeEventListener("keydown", handleGlobalKeyDown);
3912
4163
  document.removeEventListener("mousedown", handleGlobalOutsideClick);
4164
+ cleanupCustomItems();
3913
4165
  if (props.editor) {
3914
4166
  try {
3915
4167
  props.editor.off("slashMenu:open");
@@ -3956,12 +4208,19 @@ const _sfc_main$4 = {
3956
4208
  class: normalizeClass(["slash-menu-item", { "is-selected": item.id === selectedId.value }]),
3957
4209
  onClick: ($event) => executeCommand(item)
3958
4210
  }, [
3959
- item.icon ? (openBlock(), createElementBlock("span", {
4211
+ item.render ? (openBlock(), createElementBlock("div", {
3960
4212
  key: 0,
3961
- class: "slash-menu-item-icon",
3962
- innerHTML: item.icon
3963
- }, null, 8, _hoisted_4)) : createCommentVNode("", true),
3964
- createElementVNode("span", null, toDisplayString(item.label), 1)
4213
+ ref_for: true,
4214
+ ref: (el) => setCustomItemRef(el, item),
4215
+ class: "slash-menu-custom-item"
4216
+ }, null, 512)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
4217
+ item.icon ? (openBlock(), createElementBlock("span", {
4218
+ key: 0,
4219
+ class: "slash-menu-item-icon",
4220
+ innerHTML: item.icon
4221
+ }, null, 8, _hoisted_4)) : createCommentVNode("", true),
4222
+ createElementVNode("span", null, toDisplayString(item.label), 1)
4223
+ ], 64))
3965
4224
  ], 10, _hoisted_3$1);
3966
4225
  }), 128))
3967
4226
  ], 64);
@@ -1,6 +1,6 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const superEditor_es = require("./chunks/super-editor.es-U-GVCd_F.cjs");
3
+ const superEditor_es = require("./chunks/super-editor.es-Do6Vcsbv.cjs");
4
4
  require("./chunks/vue-DWle4Cai.cjs");
5
5
  exports.AIWriter = superEditor_es.AIWriter;
6
6
  exports.AnnotatorHelpers = superEditor_es.AnnotatorHelpers;
@@ -1,4 +1,4 @@
1
- import { A, a, _, C, D, E, b, S, c, d, e, f, g, T, h, i, j, k, l, m, n, o, p, r, q } from "./chunks/super-editor.es-Bntob7Wd.es.js";
1
+ import { A, a, _, C, D, E, b, S, c, d, e, f, g, T, h, i, j, k, l, m, n, o, p, r, q } from "./chunks/super-editor.es-HiSJrA0J.es.js";
2
2
  import "./chunks/vue-CXxsqYcP.es.js";
3
3
  export {
4
4
  A as AIWriter,
package/dist/superdoc.cjs CHANGED
@@ -1,7 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
3
- const superEditor_es = require("./chunks/super-editor.es-U-GVCd_F.cjs");
4
- const superdoc = require("./chunks/index-CfYf4T_z.cjs");
3
+ const superEditor_es = require("./chunks/super-editor.es-Do6Vcsbv.cjs");
4
+ const superdoc = require("./chunks/index-CtZxITmf.cjs");
5
5
  require("./chunks/vue-DWle4Cai.cjs");
6
6
  require("./chunks/jszip-b7l8QkfH.cjs");
7
7
  const blankDocx = require("./chunks/blank-docx-CPqX9RF5.cjs");
@@ -1,5 +1,5 @@
1
- import { a, E, b, S, d, i, j, n, r, p, q } from "./chunks/super-editor.es-Bntob7Wd.es.js";
2
- import { D, H, P, S as S2, m, l } from "./chunks/index-MzW5BVNd.es.js";
1
+ import { a, E, b, S, d, i, j, n, r, p, q } from "./chunks/super-editor.es-HiSJrA0J.es.js";
2
+ import { D, H, P, S as S2, m, l } from "./chunks/index-CDJb8aX-.es.js";
3
3
  import "./chunks/vue-CXxsqYcP.es.js";
4
4
  import "./chunks/jszip-B8KIZSNe.es.js";
5
5
  import { B } from "./chunks/blank-docx-iwdyG9RH.es.js";