Is there a way to prevent style property/trait edits in the sidebar from actually propagating to the component?

[anishpdoshi]

Hello,

I'm currently building a dynamic styling editor using grapesjs. The goal is for someone to be able to set styles/traits for an "initial" state for a given component, but then also support a "dynamic" state that lets someone set conditional styles/trait updates when a rule is selected

The way i've done this so far is to have rules logic elsewhere and then a "rule selector". Then, i'm capturing updates to the styles/traits like so:

editorInstance.on('style:property:update', (property, changes) => {
    ... (logic that assigns style changes to the current rule
    ? how do i stop this from applying to the base 
 });
 
 editorInstance.on('trait:value', ({ trait, component, value }) => {
    ... (logic that assigns style changes to the current rule
        ? how do i stop this from applying to the base 
});

But as the above question marks indicate - how owuld I not just listen to, but actually sto these changes from propagating back to the main component styles?

[asabryil]

You can try intercepting addStyleTargets calls by hooking onto it

[anishpdoshi]

Thank you! this solved my use case.