Issue #3358650 by Grimreaper, pdureau: Pattern: list group missing variants

templates/patterns/list_group/list_group.ui_patterns.yml

@@ -30,6 +30,24 @@ list_group:
     horizontal_xxl:
       label: "Horizontal Extra extra large"
       description: "Horizontal starts at breakpoint extra extra large."
+    numbered__horizontal:
+      label: "Numbered Horizontal"
+      description: "Add the .list-group-numbered modifier class (and optionally use an <ol> element) to opt into numbered list group items. Add .list-group-horizontal to change the layout of list group items from vertical to horizontal across all breakpoints. Currently horizontal list groups cannot be combined with flush list groups."
+    numbered__horizontal_sm:
+      label: "Numbered Horizontal Small"
+      description: "Horizontal starts at breakpoint small."
+    numbered__horizontal_md:
+      label: "Numbered Horizontal Medium"
+      description: "Horizontal starts at breakpoint medium."
+    numbered__horizontal_lg:
+      label: "Numbered Horizontal Large"
+      description: "Horizontal starts at breakpoint large."
+    numbered__horizontal_xl:
+      label: "Numbered Horizontal Extra large"
+      description: "Horizontal starts at breakpoint extra large."
+    numbered__horizontal_xxl:
+      label: "Numbered Horizontal Extra extra large"
+      description: "Horizontal starts at breakpoint extra extra large."
   fields:
     items:
       type: "render"

templates/patterns/list_group/pattern-list-group.html.twig

 {% if variant and variant|lower != 'default' %}
-  {% set attributes = attributes.addClass('list-group-' ~ variant|lower|replace({'_': '-'})) %}
+  {% set variants = variant|split('__')|map(v => v|lower|replace({(v): 'list-group-' ~ v})|replace({'_': '-'})) %}
+  {% set attributes = attributes.addClass(variants) %}
 {% endif %}
 
 <div{{ attributes.addClass('list-group') }}>