Style Manage does not hide style blocks
Hi @cartifon ! I believe the stylable attribute only works on Components & not Blocks as in your example. The following should do the trick: Cheers !
Read full answer below βQuestion
Hey @artf, I'm trying to hide style properties based on the selected element. for example, when I drag and drop an image on my GrapesJS, I would like to show only the width property, but the unstylable/stylable attributes are not working.
Version: "grapesjs": "^0.16.18",
Are you able to reproduce the bug from the demo?
[X] Yes [ ] No
What is the expected behavior? To hide the properties that are not on my array
What is the current behavior? It is not hiding anything.
Are you able to attach screenshots, screencasts or a live demo?
[X] Yes (attach) [ ] No
Answers (3)
Hi @cartifon !
I believe the stylable attribute only works on Components & not Blocks as in your example. The following should do the trick:
blocks: [
{
id: "image",
label: "Image",
// Select the component once it's dropped
select: true,
// You can pass components as a JSON instead of a simple HTML string,
// in this case we also use a defined component type `image`
content: { type: "image", stylable: ['width'] },
// This triggers `active` event on dropped components and the `image`
// reacts by opening the AssetManager
activate: true
}
]
Cheers !
I have another question, would the unstylable work in the same way?
Hey @mcottret, thanks for the help. Yes, it does work with that! Maybe the documentation should be more clear on that.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #1141
[Question] - How to extend the existing traits and render the changes in canvas?
I am trying to write a plugin to manage all the element properties of Boostrap Blocks. If someone clicks on the button it will show button...
Issue #2547
Unable to drag an element if style has bottom or right values
Hi @artf , If any component CSS has bottom or right values , not able to drag them. Values are generating as NaN. Attached the screenshot f...
Issue #3404
Style Manager Issue.
Hi @artf I want to hide and show style properties for specific component. After referencing this issue https://github.com/artf/grapesjs/iss...
Issue #3294
FEAT: Adding options to properties list array in style manager
Hi, How can I add buildProps to properties list such that when an option is selected, the properties of that option will be displayed An ex...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Check the open-source GrapesJS plugins on GitHub or run a quick search in our free catalog.
Browse free plugins βPremium plugins ship with support, regular updates, and production-ready features β save days of integration work.
Browse premium plugins βBrowse Plugin Categories
Jump directly to plugin category pages on the marketplace.