Abstract menu/collapse... toggles (arrow/plus...) for easier customization

[kuchta]

It would be great if these usually optional parts of components were somehow abstracted/generalized so that they could be more easily reused and customized.

[saadeghi]

Hey 👋
Abstracted how?
Can you give me an expected code? (HTML only)

[kuchta]

Sure, for example instead of

<div class="collapse collapse-arrow">
  <div class="collapse-title">How do I create an account?</div>
  <div class="collapse-content">Click the "Sign Up" button in the top right corner and follow the registration process.</div>
</div>

something like this

<div class="collapse">
  <div class="collapse-title collapse-title-icon open:arrow/plus/...-open... close:arrow/plus/...-close"">
    How do I create an account?
    OR
    <img/xxx class="collapse-title-icon" .../>
    OR
    <img/xxx class="collapse-title-icon-open" .../>
    <img/xxx class="collapse-title-icon-close" .../>
  </div>
  <div class="collapse-content">Click the "Sign Up" button in the top right corner and follow the registration process.</div>
</div>

I don't want to push any specific solution, but it would be great if it was something more general so that it could be used consistently in any relevant component...