As part of a design system we have a component with 108 variants which serve as row items for a sidebar menu. The sidebar menu items can be collapsed or expanded, have icons or not and be up to 3 levels nested, hence the need for 108 variants. Preview:
We however want to make this component easier to scale as want to add more variants (like being able to have menu items featuring badges/counters).
Is there a more ergonomic way to handle this component? Or is this best practice?