Can't apply ids to row keys, values and anchor links on summary list component

[adeel718]

Bug Report

On the summary list component it is currently not possible to add ids to rows.keys, rows.values or the action item hrefs.

What is the issue?

There should be the ability to add ids

What steps are required to reproduce the issue?

Create a summary list component

Is there anything else you think would be useful in recreating the issue?

[GWRowley]

Suggested fix for actions in components/summary-list/template.njk lines 1-8

{%- macro _link(action) %}
  <a href="{{ action.href }}" {%- if action.classes %} class="{{ action.classes }}"{% endif %} {%- if action.id %} id="{{ action.id }}"{% endif %}>
    {{ action.html | safe if action.html else action.text }}
    {%- if action.visuallyHiddenText -%}
    <span class="nhsuk-u-visually-hidden"> {{ action.visuallyHiddenText }}</span>
    {% endif -%}
  </a>
{% endmacro -%}

Suggested fix for adding IDs to key and value in components/summary-list/template.njk lines 12-17

<dt class="nhsuk-summary-list__key {%- if row.key.classes %} {{ row.key.classes }}{% endif %}" {% for attribute, value in row.key.attributes %} {{attribute}}="{{value}}"{% endfor %}>
   {{ row.key.html | safe if row.key.html else row.key.text }}
</dt>
<dd class="nhsuk-summary-list__value {%- if row.value.classes %} {{ row.value.classes }}{% endif %}" {% for attribute, value in row.value.attributes %} {{attribute}}="{{value}}"{% endfor %}>
   {{ row.value.html | indent(8) | trim | safe if row.value.html else row.value.text }}
</dd>

Then in your nunjucks file you can use something like:

key: {
  text: "Starts on",
  attributes: {
    id: "starts-on-key"
  }
}

Whilst maintaining flexibility to add other attributes not just ID if ever necessary.