verbb / vizy

A flexible visual editor for Craft CMS
Other
43 stars 8 forks source link

Allow existing components to be expanded #257

Open ddnetters opened 9 months ago

ddnetters commented 9 months ago

What are you trying to do?

I'm trying to extend the existing LinkMenuBarItem component of Vizy to add a clients requirements without copying or recreating the link button. There are some case-specific requirements for links, e.g. marking them as nofollow or "cloaked" which obfuscates outgoing links if needed.

What's your proposed solution?

Any method allowing the link button to be extended would be really appreciated. Whether it'd be some config call to add boolean fields to links or completely overriding the button. If it's possible, allowing custom components to be registered as show below would save a ton of overhead by letting people use the existing code in the plugin.

    Craft.Vizy.Config.registerButtons((buttons) => {
        return [{
            name: 'extendedLink',
            svg: 'link',
            title: Craft.t('vizy', 'Link'),
            component: 'MyCustomComponentName'
        }];
    });

Additional context

No response

engram-design commented 9 months ago

You can certainly modify buttons but some like the Link and Image buttons are complex, which contain modals, dropdown options and tooltips.

The problem I see here is how we're supposed to handle component resolution from something that you provide and have it all work well with Vue. In addition, it's not just a matter of adding your options to the "view" (the modal for editors to add things), but you'll need to add these attributes to the Node's schema.

For example, if you wanted to add a checkbox for users to mark a link as an "external" one, and if so, would add the appropriate rel attribute values, that's two parts. Adding the checkbox to the modal, and adding the attribute to the link node schema.

I'll have a think through some options.

ddnetters commented 9 months ago

Yeah, I've got to say I'm running into the limits of my front-ending experience here. I'm not totally sure what a clean solution would be. Thank you for taking it into consideration!