Merge branch '3489963-1.1.0-replace-component' into '1.1.x'

replaced

See merge request !133

components/consent_banner/consent_banner.twig

@@ -6,32 +6,21 @@
     <p class="fr-text--sm">{{ content }}</p>
   </div>
   {% set buttons = [
-    component('ui_suite_dsfr:button', {label: 'Accept all'|t}, {
-      attributes: {title: 'Accept all cookies'|t},
-    }),
-    component('ui_suite_dsfr:button', {label: 'Refuse all'|t}, {
-      attributes: {title: 'Refuse all cookies'|t},
-    }),
-    component('ui_suite_dsfr:button', {label: 'Personalize'|t}, {
-      attributes:
-      {'data-fr-opened': 'false', 'aria-controls': modal_id, title: 'Personalize cookies'|t},
-    }, 'secondary'),
+    include('ui_suite_dsfr:button', {label: 'Accept all'|t, attributes: {title: 'Accept all cookies'|t}}, with_context: false),
+    include('ui_suite_dsfr:button', {label: 'Refuse all'|t, attributes: {title: 'Refuse all cookies'|t}}, with_context: false),
+    include('ui_suite_dsfr:button', {
+      label: 'Personalize'|t,
+      attributes: {'data-fr-opened': 'false', 'aria-controls': modal_id, title: 'Personalize cookies'|t},
+      variant: 'secondary'}, with_context: false),
   ] %}
-  {{ component('ui_suite_dsfr:button_group', {
+  {{ include('ui_suite_dsfr:button_group', {
     buttons: buttons,
-  }, {
     attributes: {class: ['fr-consent-banner__buttons', 'fr-btns-group--inline-sm']},
-
-  }, 'inline__inline_reverse__right') }}
+    variant: 'inline__inline_reverse__right'}, with_context: false) }}
 </div>
 
-{{ component('ui_suite_dsfr:modal', {
+{{ include('ui_suite_dsfr:modal', {
   title: modal_title,
-  body: component('ui_suite_dsfr:consent_manager', {
-    title: modal_text,
-  }, {
-    services: services,
-  }),
-}, {
+  body: include('ui_suite_dsfr:consent_manager', {title: modal_text, services: services}, with_context: false),
   modal_id: modal_id,
-}) }}
+}, with_context: false) }}

components/consent_manager/consent_manager.twig

@@ -61,9 +61,8 @@
   </fieldset>
     </div>
   {% endfor %}
-  {{ component('ui_suite_dsfr:button_group', {
-    buttons: [component('ui_suite_dsfr:button', {label: 'Confirm my choices'|t})],
-  }, {
+  {{ include('ui_suite_dsfr:button_group', {
+    buttons: [include('ui_suite_dsfr:button', {label: 'Confirm my choices'|t}, with_context: false)],
     attributes: {class: ['fr-consent-manager__buttons', 'fr-btns-group--inline-sm']},
-  }, 'right') }}
+    variant: 'right'}, with_context: false) }}
 </div>

components/content_media/content_media.twig

@@ -28,8 +28,6 @@
   {% endif %}
 
   {% if transcription %}
-    {{ component('ui_suite_dsfr:transcription', {
-      content: transcription,
-    }, {}) }}
+    {{ include('ui_suite_dsfr:transcription', {content: transcription}, with_context: false) }}
   {% endif %}
 </figure>

components/france_connect/france_connect.twig

@@ -13,12 +13,6 @@
     <span class="fr-connect__brand">{{ brand }}</span>
   </button>
   <p>
-    {{ component('ui_suite_dsfr:link',
-      {
-        label: 'What is @title?'|t({'@title': brand}),
-      }, {
-        url: url,
-      },
-    ) }}
+    {{ include('ui_suite_dsfr:link', {label: 'What is @title?'|t({'@title': brand}), url: url}, with_context: false) }}
   </p>
 </div>

components/nav_menu/nav_menu.twig

@@ -81,13 +81,12 @@
                   <p class="fr-hidden fr-unhidden-lg">{{ parent.content.extra_description }}</p>
                 {% endif %}
                 {% if parent.content.extra_link %}
-                  {{ component('ui_suite_dsfr:link', {
+                  {{ include('ui_suite_dsfr:link', {
                     label: parent.content.extra_link.label,
-                  }, {
                     settings: {icon: 'fr-icon-arrow-right-line', icon_position: 'right'},
                     url: parent.content.extra_link.url,
                     attributes: {class: 'fr-link--align-on-content'},
-                  }) }}
+                  }, with_context: false) }}
                 {% endif %}
               </div>
             </div>

templates/system/breadcrumb.html.twig

@@ -10,5 +10,5 @@
  */
 #}
 {% if breadcrumb %}
-  {{ component('ui_suite_dsfr:breadcrumb', {}, {items: breadcrumb}) }}
+  {{ include('ui_suite_dsfr:breadcrumb', {items: breadcrumb}, with_context: false) }}
 {% endif %}

templates/system/menu--footer.html.twig

@@ -20,6 +20,4 @@
  * @ingroup themeable
  */
 #}
-{{ component('ui_suite_dsfr:footer_menu', {}, {
-  items: items,
-}, 'bottom') }}
+{{ include('ui_suite_dsfr:footer_menu', {items: items, variant: 'bottom'}, with_context: false) }}

templates/system/menu--main.html.twig

@@ -22,9 +22,9 @@
 #}
 
 {% if items %}
-  {{ component('ui_suite_dsfr:nav_menu', {}, {
+  {{ include('ui_suite_dsfr:nav_menu', {
     menu_name: menu_name,
     html_id: 'navigation-main',
     items: items,
-  }) }}
+  }, with_context: false) }}
 {% endif %}

templates/system/menu-local-task.html.twig

@@ -20,9 +20,9 @@
 {% if is_active %}
   {% set attributes = attributes.setAttribute('aria-current', 'page') %}
 {% endif %}
-{{ component('ui_suite_dsfr:tab', {
+{{ include('ui_suite_dsfr:tab', {
   title: link['#title'],
-}, {
   attributes: attributes,
   url: link['#url'].toString(),
-}, variant) }}
+  variant: variant,
+}, with_context: false) }}

templates/system/menu-local-tasks.html.twig

@@ -15,13 +15,9 @@
 #}
 {% if primary %}
   <h2 class="visually-hidden">{{ 'Primary tabs'|t }}</h2>
-  {{ component('ui_suite_dsfr:tabs', {
-    items: primary,
-  }, {}) }}
+  {{ include('ui_suite_dsfr:tabs', {items: primary}, with_context: false) }}
 {% endif %}
 {% if secondary %}
   <h2 class="visually-hidden">{{ 'Secondary tabs'|t }}</h2>
-  {{ component('ui_suite_dsfr:tabs', {
-    items: secondary,
-  }, {}) }}
+  {{ include('ui_suite_dsfr:tabs', {items: secondary}, with_context: false) }}
 {% endif %}

templates/system/page.html.twig

@@ -41,40 +41,33 @@
  */
 #}
 <div class="layout-container">
-  {{ component('ui_suite_dsfr:skiplinks', {
+  {{ include('ui_suite_dsfr:skiplinks', {
     items: [
-      component('ui_suite_dsfr:link', {
-        label: 'Content'|t,
-      }, {
-        url: '#main-content',
-      }),
-      component('ui_suite_dsfr:link', {
-        label: 'Menu'|t,
-      }, {
-        url: '#page-header--menu',
-      }),
-      component('ui_suite_dsfr:link', {
-        label: 'Footer'|t,
-      }, {
-        url: '#footer',
-      }),
+      include('ui_suite_dsfr:link', {
+        label: 'Content'|t, url: '#main-content',
+      }, with_context: false),
+      include('ui_suite_dsfr:link', {
+        label: 'Menu'|t, url: '#page-header--menu',
+      }, with_context: false),
+      include('ui_suite_dsfr:link', {
+        label: 'Footer'|t, url: '#footer',
+      }, with_context: false),
     ],
   }, {
     label: 'Skip links'|t|render,
   }) }}
 
-  {{ component('ui_suite_dsfr:header', {
+  {{ include('ui_suite_dsfr:header', {
     operator_logo: page.header_operator_logo,
     service_title: site_name,
     service_tagline: site_slogan,
     tools_links: page.header_tools_links|render,
     tools_search: page.header_tools_search,
     navbar: page.header_navbar,
-  }, {
     logo_text: logo_text,
     home_url: path('<front>'),
     header_id: 'page-header',
-  }) }}
+  }, with_context: false) }}
   {{ page.top }}
   <main role="main" class="{{ container }} fr-mb-4w fr-mt-4w">
     <a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}
@@ -98,17 +91,16 @@
 
   </main>
   {{ page.bottom }}
-  {{ component('ui_suite_dsfr:footer', {
+  {{ include('ui_suite_dsfr:footer', {
     operator_logo: page.footer_operator_logo,
     content: page.footer_content,
     content_desc: page.footer_content_desc,
     partners: page.footer_partners,
     bottom: page.footer_bottom,
     bottom_copy: page.footer_bottom_copy,
-  }, {
     top: footer_top,
     service_title: site_name,
     logo_text: logo_text,
     home_url: path('<front>'),
-  }) }}
+  }, with_context: false) }}
 </div>

templates/system/pager.html.twig

@@ -32,10 +32,10 @@
  * @ingroup themeable
  */
 #}
-{{ component('ui_suite_dsfr:pagination', {}, {
+{{ include('ui_suite_dsfr:pagination', {
   first: items.first ? items.first.href : false,
   prev: items.previous ? items.previous.href : false,
   pages: items.pages,
   next: items.next ? items.next.href : false,
   last: items.last ? items.last.href : false,
-}) }}
+}, with_context: false) }}

templates/system/status-messages.html.twig

@@ -35,11 +35,7 @@
         For example: we have 1st status message then the 2nd error message,
         so we will have the css classes from 1st in the 2nd.
       #}
-      {{ component('ui_suite_dsfr:alert', {
-        message: message,
-      }, {
-        dismissible: false,
-      }, variant) }}
+      {{ include('ui_suite_dsfr:alert', {message: message, dismissible: false, variant: variant}, with_context: false) }}
     {% endfor %}
   {% endfor %}
 </div>

templates/ui_patterns_library/ui-patterns-overview-page.html.twig

@@ -7,7 +7,7 @@
 {% if groups is not empty %}
 <div class="fr-grid-row"">
   <div class="fr-col-lg-3">
-  {{ include('ui-patterns-overview-quicklinks.html.twig', {groups: groups}, with_context=false) }}
+  {{ include('ui-patterns-overview-quicklinks.html.twig', {groups: groups}, with_context: false) }}
   </div>
   <div class="fr-col-lg-9">
   {% for components in groups %}
@@ -17,10 +17,10 @@
           <a href="{{ url('ui_patterns_library.single', {provider: component.provider, machineName: component.machineName}) }}"
              class="component__link">{{ component.name }}</a>
         </h2>
-        {{ include('ui-patterns-component-metadata.html.twig', {component: component}, with_context=false) }}
-        {{ include('ui-patterns-component-table.html.twig', {component: component}, with_context=false) }}
+        {{ include('ui-patterns-component-metadata.html.twig', {component: component}, with_context: false) }}
+        {{ include('ui-patterns-component-table.html.twig', {component: component}, with_context: false) }}
         {% if component.stories %}
-          {{ include('ui-patterns-stories-compact.html.twig', {component: component}, with_context=false) }}
+          {{ include('ui-patterns-stories-compact.html.twig', {component: component}, with_context: false) }}
         {% endif %}
       </div>
     {% endfor %}

templates/views/views-mini-pager.html.twig

@@ -12,7 +12,7 @@
  * @ingroup themeable
  */
 #}
-{{ component('ui_suite_dsfr:pagination', {}, {
+{{ include('ui_suite_dsfr:pagination', {
   prev: items.previous ? items.previous.href : false,
   pages: [
     {
@@ -20,4 +20,4 @@
     },
   ],
   next: items.next ? items.next.href : false,
-}) }}
+}, with_context: false) }}