Disable Icons

[warmwhisky]

Is there a way to disable icons?

I have tried using fontawesome but cannot get that to work. The documentation says you simply add the fontawesome css and you're ready to go. But that does not work. I don't want to import context-menu-icons.woff2 fonts as I do not use them.

Ultimately I need to use HTML Hex codes for music notation like this "𝅘𝅥𝅮" I have tried to add that in with the title but alas it just renders the Hex code and not the icon.

Any help would be appreciated.

Thanks

[brunoinds]

Did you ever tried to do not pass the icon property to the items?

Passing only the name, the icon will not be rendered.

const data = {
  firstItem: {name: 'First item text'},
  secondItem: {name: 'Second item text'},
  thirdItem: {name: 'Third item text'}
}

$.contextMenu({
    selector: 'path > to > element',
    build: ($triggerElement, e) => {
        const data = {
            firstItem: {name: 'First item text'},
            secondItem: {name: 'Second item text'},
            thirdItem: {name: 'Third item text'}
        }
        return {
            callback: (key, options) => {},
            items: data
        };
    }
});

[warmwhisky]

@brunoinds Hey thanks for the pointer. I had not actually tried that until yesterday. and then figured out how to get my own html icon using the following.

items: {
    "whole": {name: "Whole Note", icon: function (opt, itemElement, itemKey, item) {
            itemElement.html(`<span class="context_menu_icon active" aria-hidden="true">&#119133;</span> ${item.name}`);
            return 'context-menu-icon-updated';
        }
    }
}