GeorgianStan/vanilla-context-menu

Impossible to concatenate HTML in labels :)

Closed this issue · 3 comments

image

Here is the code I try:

document.querySelectorAll(".btn").forEach((element) => {
  const myContextMenu = new window.VanillaContextMenu({
    scope: element,
    menuItems: [
      {
        label:
          "<i class='fa-duotone fa-arrows-up-down-left-right'></i>" +
          "Assigner un raccourcis",
        callback: (event) => {
          console.log(event);
        },
      },
      {
        label: "Déplacer",
        callback: (event) => {
          console.log(event);
        },
      },
    ],
    customThemeClass: "custom-context",
  });
});

But here is the result:
image

@GeorgianStan, I would really appreciate the help :3

Hi @lunar94 sorry for the late response. From what I see you are trying to display an icon for each label.
As of now there is no option to enable this feature.

I don't know if the insertion of raw HTML will be allowed or only if it will be some separate option for icons providing an icon.
I will work on that and update the library.
Thanks for your feedback!

If you want, you can create a new post in Idea & Suggestions page and I'll close this issue.

Hi, @lunar94. The library was updated and the new version enables icons as well.
If this solves your problem, then please close this issue.

@GeorgianStan Hi Georgian, I tested it all out when I came back from work, this is working flawlessly. Thank you very much, problem solved !

💯