Advanced Select: <optgroup> groups are not rendered (is it supported?)

[sureMOISE]

Summary

<optgroup> inside a <select>, the groups are not rendered

Detailed Description

When using the Advanced Select component with native HTML <optgroup> inside a <select>, the groups are not rendered (group labels are ignored and items appear ungrouped). Documentation does not clearly state whether is supported by Advanced Select, and I haven’t found an explicit example in the docs. Could you please clarify support status and, if supported, the correct markup/configuration?

Plugin docs (@preline/select): https://preline.co/plugins/html/advanced-select.html
HTML semantics

preline version: 3.2.3
Framework: Angular
Browser: Chrome

Use Cases

Steps to reproduce

Install and initialize Preline and the Advanced Select plugin following the docs

https://preline.co/docs/advanced-select.html
https://preline.co/plugins/html/advanced-select.html

Use this minimal markup with an :

<div class="relative">
  <select
    data-hs-select='{
      "hasSearch": true,
      "placeholder": "Choose an option..."
    }'
    class="hidden"
  >
    <optgroup label="Frontend">
      <option value="react">React</option>
      <option value="vue">Vue</option>
      <option value="svelte">Svelte</option>
    </optgroup>

    <optgroup label="Backend" disabled>
      <option value="node">Node.js</option>
      <option value="dotnet">.NET</option>
      <option value="java">Java</option>
    </optgroup>
  </select>
</div>

[danielfnz]

Hi @sureMOISE , have you solve this issue?

[sureMOISE]

Hi, @danielfnz I haven't solved it yet. I found a temporary workaround, but I can confirm that Preline's select component doesn't support the tag.