Please consider changing the icons in the accordion to using an SVG component instead of the hybrid SVG currently being used.
I can never get the colors to be applied to the SVG to work. Sometimes I have an SVG that needs to the color to be a stroke and other times a fill. I have tried both options and the colors are never set with the current approach.
It is not clear how the current color is going to be be applied.
We could do something similar to the Button component, where you get a dropzone so you can add any component you like - would that work?
@bon I think that would be perfect as it would give maximum flexibility, plus familiarity from the Button component.
@handshaper Adding drop zone support for the Accordion icon is trickier than it seems.
Right now, the setup allows you to drop in an SVG resource, which ensures the icon’s style can change based on the Accordion’s state (open or closed). However, if we allow any component to be added instead, styling it dynamically based on the state won’t be possible.
This means adding an SVG via a drop zone won’t work, as it wouldn’t be able to adjust its appearance based on the Accordion’s state.
What is it exactly you’re finding difficult with the current setup?
@bon The problem I have with the current approach is that it does not give me any control over the color and opacity of both the fill and stroke option for an SVG. All that is available is a color choice with no indication of how that color will be applied. Is it used for a fill or a stroke.
I understand the need for controling the SVG, but at the very least could we have all of the standard properties that are exposed by an SVG component.
I have tried to get the color choice to work and it never seems to be applied to my SVG. I’m sure part of this is due to the finickiness of SVG’s in the first place. But knowing how the color was going to be used would have helped.
So my choice would be to simply expose all of properties of the SVG, or at the very least be more specific about whether the color is for a fill or stroke.
UPDATE: I just spent most of the day experimenting with the SVG icon support. I now understand how the color is being applied and have been able to make it work the way I want. It took some formatting of my SVG assets to make it work, but nothing new there. So my main request now would be to add support for handling the stroking of the SVG, Currently, it is only FILL that appears to be supported. Sorry it took me so long to understand how the color was being applied.