Use Twig macros rather than including templates

source/_patterns/00-atoms/_attributes.twig

@@ -1,11 +1,15 @@
-{%- for name, value in attributes|default({}) if value is not same as(false) -%}
+{% macro attributes(attributes) %}
 
-  {{- ' ' ~ name -}}
+  {%- for name, value in attributes|default({}) if value is not same as(false) -%}
 
-  {%- if value is iterable -%}
-    ="{{ value|join(' ') }}"
-  {%- elseif value is not same as(true) -%}
-    ="{{ value }}"
-  {%- endif -%}
+    {{- ' ' ~ name -}}
 
-{%- endfor -%}
+    {%- if value is iterable -%}
+      ="{{ value|join(' ') }}"
+    {%- elseif value is not same as(true) -%}
+      ="{{ value }}"
+    {%- endif -%}
+
+  {%- endfor -%}
+
+{% endmacro attributes %}

source/_patterns/00-atoms/_includes.twig

@@ -0,0 +1,21 @@
+{% macro include(includes) %}
+
+  {%- if includes is iterable -%}
+
+    {%- for include in includes -%}
+
+      {%- if include.template is defined -%}
+        {%- include include.template with include.arguments|default({}) only -%}
+      {%- else -%}
+        {{- include -}}
+      {%- endif -%}
+
+    {%- endfor -%}
+
+  {%- else -%}
+
+    {{- includes -}}
+
+  {%- endif -%}
+
+{% endmacro include %}

source/_patterns/00-atoms/block/heading/heading.twig

@@ -1,5 +1,8 @@
-<h{{ level|default(1) }} {%- include 'atoms-attributes' %}>
+{%- from 'atoms-attributes' import attributes -%}
+{%- from 'atoms-includes' import include -%}
 
-  {%- include 'atoms-text' with {nodes: text} only -%}
+<h{{ level|default(1) }} {{- attributes(attributes|default({})) }}>
+
+  {{- include(text) -}}
 
 </h{{ level|default(1) }}>

source/_patterns/00-atoms/block/paragraph/paragraph.twig

@@ -1,7 +1,10 @@
+{%- from 'atoms-attributes' import attributes -%}
+{%- from 'atoms-includes' import include -%}
+
 {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['paragraph']) }) -%}
 
-<p {%- include 'atoms-attributes' -%}>
+<p {{- attributes(attributes) }}>
 
-  {%- include 'atoms-text' with {nodes: text} -%}
+  {{ include(text) }}
 
 </p>

source/_patterns/00-atoms/inline/bold/bold.twig

@@ -1,8 +1,11 @@
+{%- from 'atoms-attributes' import attributes -%}
+{%- from 'atoms-includes' import include -%}
+
 {% spaceless %}
 
-  <b {%- include 'atoms-attributes' %}>
+  <b {{- attributes(attributes|default({})) }}>
 
-    {%- include 'atoms-text' with {nodes: text} only -%}
+    {{- include(text) -}}
 
   </b>
 

source/_patterns/00-atoms/inline/italic/italic.twig

@@ -1,8 +1,11 @@
+{%- from 'atoms-attributes' import attributes -%}
+{%- from 'atoms-includes' import include -%}
+
 {% spaceless %}
 
-  <i {%- include 'atoms-attributes' %}>
+  <i {{- attributes(attributes|default({})) }}>
 
-    {%- include 'atoms-text' with {nodes: text} only -%}
+    {{- include(text) -}}
 
   </i>
 

source/_patterns/00-atoms/inline/link/link.twig

@@ -1,11 +1,14 @@
+{%- from 'atoms-attributes' import attributes -%}
+{%- from 'atoms-includes' import include -%}
+
 {% spaceless %}
 
   {%- if attributes|default({}).href is defined -%}
-    <a {%- include 'atoms-attributes' %}>{%- include 'atoms-text' with {nodes: text} only -%}</a>
+    <a {{- attributes(attributes|default({})) }}>{{- include(text) -}}</a>
   {%- elseif attributes|default({})|length -%}
-    <span {%- include 'atoms-attributes' %}>{%- include 'atoms-text' with {nodes: text} only -%}</span>
+    <span {{- attributes(attributes|default({})) }}>{{- include(text) -}}</span>
   {%- else -%}
-    {%- include 'atoms-text' with {nodes: text} only -%}
+    {{- include(text) -}}
   {%- endif -%}
 
 {% endspaceless %}

source/_patterns/00-atoms/inline/sub/sub.twig

@@ -1,8 +1,11 @@
+{%- from 'atoms-attributes' import attributes -%}
+{%- from 'atoms-includes' import include -%}
+
 {% spaceless %}
 
-  <sub {%- include 'atoms-attributes' %}>
+  <sub {{- attributes(attributes|default({})) }}>
 
-    {%- include 'atoms-text' with {nodes: text} only -%}
+    {{- include(text) -}}
 
   </sub>
 

source/_patterns/00-atoms/inline/sup/sup.twig

@@ -1,8 +1,11 @@
+{%- from 'atoms-attributes' import attributes -%}
+{%- from 'atoms-includes' import include -%}
+
 {% spaceless %}
 
-  <sup {%- include 'atoms-attributes' %}>
+  <sup {{- attributes(attributes|default({})) }}>
 
-    {%- include 'atoms-text' with {nodes: text} only -%}
+    {{- include(text) -}}
 
   </sup>
 

source/_patterns/01-molecules/content-meta/content-meta.twig

@@ -1,16 +1,18 @@
-{%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['content-meta']) }) -%}
+{%- from 'atoms-attributes' import attributes -%}
 
-<ul {%- include('atoms-attributes') -%}>
+{%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['content-meta']) }) -%}
 
+<ul {{- attributes(attributes|default({})) }}>
   {%- for item in items -%}
 
     {%- with item only -%}
       {%- block item -%}
 
-        {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['content-meta__item']) }) -%}
+        {%- from 'atoms-attributes' import attributes -%}
 
-        <li {%- include('atoms-attributes') -%}>
+        {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['content-meta__item']) }) -%}
 
+        <li {{- attributes(attributes|default({})) }}>
           {%- with content only -%}
             {%- block content -%}
 

source/_patterns/01-molecules/section/section.twig

@@ -1,6 +1,8 @@
+{%- from 'atoms-attributes' import attributes -%}
+
 {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['section']) }) -%}
 
-<section {%- include 'atoms-attributes' -%}>
+<section {{- attributes(attributes|default({})) }}>
 
   {%- with heading|default({}) only -%}
 
@@ -23,10 +25,13 @@
 
     {%- block content -%}
 
+      {%- from 'atoms-attributes' import attributes -%}
+      {%- from 'atoms-includes' import include -%}
+
       {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['section__body']) }) -%}
 
-      <div {%- include 'atoms-attributes' -%}>
-        {%- include 'atoms-text' with {nodes: content} -%}
+      <div {{- attributes(attributes|default({})) }}>
+        {{- include(content) -}}
       </div>
 
     {%- endblock -%}

source/_patterns/01-molecules/tag-list/tag-list.twig

@@ -1,6 +1,8 @@
+{%- from 'atoms-attributes' import attributes -%}
+
 {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['tag-list']) }) -%}
 
-<div {%- include('atoms-attributes') -%}>
+<div {{- attributes(attributes|default({})) }}>
 
   {%- with title|default({}) only -%}
     {%- block title -%}
@@ -18,22 +20,26 @@
   {%- with list only -%}
     {%- block list -%}
 
+      {%- from 'atoms-attributes' import attributes -%}
+
       {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['tag-list__list']) }) -%}
 
       {%- if singleLine|default(false) -%}
         {%- set attributes = attributes|merge({class: attributes.class|merge(['tag-list__list--single-line']) }) -%}
       {%- endif -%}
 
-      <ul {%- include('atoms-attributes') -%}>
+      <ul {{- attributes(attributes|default({})) }}>
 
         {%- for item in items -%}
 
           {%- with item only -%}
             {%- block item -%}
 
+              {%- from 'atoms-attributes' import attributes -%}
+
               {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['tag-list__item']) }) -%}
 
-              <li {%- include('atoms-attributes') -%}>
+              <li {{- attributes(attributes|default({})) }}>
 
                 {%- with content only -%}
                   {%- block content -%}

source/_patterns/02-organisms/content-header/content-header.twig

@@ -1,6 +1,8 @@
+{%- from 'atoms-attributes' import attributes -%}
+
 {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['content-header']) }) -%}
 
-<header {%- include 'atoms-attributes' %}>
+<header {{- attributes(attributes|default({})) }}>
 
   {%- block body -%}
 

source/_patterns/02-organisms/item-tags/item-tags.twig

@@ -1,6 +1,8 @@
+{%- from 'atoms-attributes' import attributes -%}
+
 {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['item-tags']) }) -%}
 
-<div {%- include('atoms-attributes') -%}>
+<div {{- attributes(attributes|default({})) }}>
 
   {%- block body -%}
 

source/_patterns/03-templates/content-grid/content-grid.twig

@@ -1,3 +1,5 @@
+{%- from 'atoms-attributes' import attributes -%}
+
 {%- set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['content-grid']) }) -%}
 
 {%- set hasSecondary = false -%}
@@ -9,7 +11,7 @@
   {%- set attributes = attributes|merge({class: attributes.class|merge(['content-grid--has-secondary']) }) -%}
 {%- endif -%}
 
-<{{ element|default('div') }} {%- include 'atoms-attributes' %}>
+<{{ element|default('div') }} {{- attributes(attributes|default({})) }}>
 
   {%- for area in content -%}
     {%- with area only -%}
@@ -22,10 +24,13 @@
 
           {%- if content|default([])|length -%}
 
+            {%- from 'atoms-attributes' import attributes -%}
+            {%- from 'atoms-includes' import include -%}
+
             {%- set attributes = attributes|merge({class: attributes.class|merge(['content-grid__item--' ~ area]) }) -%}
 
-            <div {%- include 'atoms-attributes' %}>
-              {%- include 'atoms-text' with {nodes: content} -%}
+            <div {{- attributes(attributes|default({})) }}>
+              {{- include(content) -}}
             </div>
 
           {%- endif -%}

source/_patterns/03-templates/page-grid/page-grid.twig

@@ -1,6 +1,8 @@
+{%- from 'atoms-attributes' import attributes -%}
+
 {% set attributes = attributes|default({})|merge({class: attributes.class|default([])|merge(['page-grid']) }) -%}
 
-<div {%- include 'atoms-attributes' %}>
+<div {{- attributes(attributes|default({})) }}>
 
   {%- with start|default({}) only -%}
     {%- block start -%}