fix(407): clear text on action menu click

[Nikolai-featurebase]

Description

Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.

Fixes #407

Type of change

Please tick the relevant option.

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update

Checklist:

• I have performed a self-review of my own code
• I have commented on my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have checked my code and corrected any misspellings

[Darginec05]

It can break logic for complex blocks with multiple nested Slate children.
My suggesstion:

    const lastNode = Editor.last(newSlate, [0]);
    Transforms.delete(newSlate, { at: lastNode[1] });

[gloaysa]

hi @Darginec05 I was having a look at this one and I noticed that we do a lot more of stuff on the ActionMenuList when the user selects the block on key down.

Shouldn't we unify this behaviour?

if (HOTKEYS.isEnter(event)) {
        event.preventDefault();

        const selected = document.querySelector('[data-action-menu-item][aria-selected=true]') as HTMLElement;
        const type = selected?.dataset.actionMenuItemType;
        if (!type) return;

        const blockEntry: NodeEntry<SlateElement<string>> | undefined = Editor.above(slate, {
          match: (n) => Element.isElement(n) && Editor.isBlock(slate, n),
          mode: 'lowest',
        });

        if (blockEntry) {
          const [, currentNodePath] = blockEntry;
          const path = blockEntry ? currentNodePath : [];

          const start = Editor.start(slate, path);
          const range = { anchor: slate.selection.anchor, focus: start };

          Transforms.select(slate, range);
          Transforms.delete(slate);
        }

        editor.toggleBlock(type, { deleteText: true, focus: true });
        return onClose();
      }

If you noticed, inside the if (blockEntry) statement is where we call Transforms.delete(slate), and that's why the bug is not present when selecting the block using the keyboard. Remove that delete and the bug appears.

I propose to move the whole handleActionMenuKeyDown function to the utils.ts file (to clean up the component and consistency with all the other util functions), and reuse the logic for the click function in getItemProps and the Enter key-down event.