Add nested options description into table caption

alphagov · Aug 15, 2023 · 0ea60fc · 0ea60fc
1 parent 5cd1b9d
commit 0ea60fc
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 1 deletion.
diff --git a/lib/get-macro-options/index.js b/lib/get-macro-options/index.js
@@ -184,13 +184,15 @@ function getMacroOptions(componentName) {
       nestedOptions.map((option) => ({
         name: `Options for ${option.name}`,
         id: option.slug,
+        description: option.description,
         options: option.params
       }))
     )
     .concat(
       additionalComponents.map((option) => ({
         name: `Options for ${option.name}`,
         id: option.slug,
+        description: option.description,
         options: getMacroOptionsJson(option.name)
           .map(addSlugs)
           .map(renderNameWithBreaks)

diff --git a/views/partials/_example.njk b/views/partials/_example.njk
@@ -94,7 +94,12 @@
           </p>
           {% for table in macroOptions %}
             <table class="govuk-table app-options__table" id="options-{{ exampleId }}--{{ table.id }}">
-              <caption class="govuk-table__caption govuk-heading-m {% if table.id == 'primary' %} govuk-visually-hidden{% endif %}">{{ table.name | safe }}</caption>
+              <caption class="govuk-table__caption{% if table.id == 'primary' %} govuk-visually-hidden{% endif %}">
+                <h3 class="govuk-heading-m">{{ table.name | safe }}</h3>
+                {% if table.description %}
+                <p class="govuk-body">{{ table.description | safe }}</p>
+                {% endif %}
+              </caption>
               <thead class="govuk-table__head">
                 <tr class="govuk-table__row">
                   <th class="govuk-table__header app-options__limit-table-cell" scope="col">Name</th>