Expand-icon slot rotated at <wa-select>

[patrickvuarnoz]

When a select menu is toggled, the whole expand-icon slot/part is rotated. This is not ideal as that specific behaviour limits the styling options on the <wa-select>. In my example I'm trying to apply a separator line before the chevron. This is what happens:

I know that I could also style the right edge of the suffix slot to create the desired effect, but for that I would need to always put something into this slot.

To have more styling options it would be better if the rotation would only be applied to the contents of the slot and not the slot itself. But that might cause problems if the slot contains multiple elements. Maybe it could also be nested differently:

<div part="expand-icon">
  <slot name="expand-icon" class="expand-icon">
    <wa-icon library="system" name="chevron-down" variant="solid" aria-hidden="true"></wa-icon>
  </slot>
</div>

3.0.0-alpha.10

[patrickvuarnoz]

By the way, the .expand-icon shows an invalid CSS property:

[claviska]

Thanks for bringing this up. This will be fixed in the next alpha release.