[Question] adding filter to styleManager

Question

Hi, I am trying to add a filter property to Styles. The problem that I am having is that the property demands 2 arguments: 1. The type of filter 2. The strength. e.g filter: blur(10%). the problem I am having is that when added to the css file I am getting- filter: blur 10%. I understand that I should be using property.functionName to fix this, but cannot figure out how (there appear to be no examples of this in the existing libraries). The code I have is: Thank you

artf · Accepted Answer

Hi @shlomoko to make the filter work properly via stack type you have to add a custom style manager type, because, as you already noticed, you have to deal with dynamic stuff (eg. functionName). Unfortunately, we didn't document that part yet and the only example we have is grapesjs-style-gradient. Extending the stack property might be even a bit harder (probably will require also some enhancement on the current API), so I'll try to provide an example of this case.

artf · Answer

Hi @shlomoko I've created a plugin with the filter type input https://github.com/artf/grapesjs-style-filter You can use it with the latest release https://github.com/artf/grapesjs/releases/tag/v0.14.40

Adding filter to styleManager

Question

Answers (3)

Related Questions and Answers

[Bug]: adding css variables as style manager property

add a font-size type prop

[Question] Firing events with custom components

[Question] Cannot load styles saved as !important

Paid Plugins That Match This Issue

Browse Plugin Categories