How do you add an icon file in front of the Title slot in the Aequos Collapsible data-group-name?

[tedtninety]

I have an Aequos Collapsible and I would like to place the icon in front of the title in a custom template.

I have:
< aequos-collapsible
data-group-name="{{slot-item @root.slots.Title}}"
data-default-collapsed="true" >

How do I add the below to the top please?

< aequos-iconfile
data-extension="{{slot item @root.slots.FileType}}"
data-theme-variant="{{JSONstringify @root.theme}}">< /aequos-iconfile >

Thank you,
ted

[Laul0]

Hi @tedtninety,

You can't add the <aequos-iconfile /> into the collapsible attribute. Only string is allowed.
You can, by the way, use CSS as workaround to position the icon file at the same level than the header of the group collapsible component.

Handlebars

<aequos-iconfile
data-extension="{{slot item @root.slots.FileType}}"
data-theme-variant="{{JSONstringify @root.theme}}"></aequos-iconfile>
<aequos-collapsible data-group-name="{{slot item @root.slots.Title}}" data-default-collapsed="true">
    <template id="collapsible-header">
        <div>
        </div>
     </template>
    ...

CSS

aequos-iconfile {
    position: relative;
    top: 25px;
}
aequos-collapsible > div > div {
    padding-left: 20px;
}

Result