Clarify use of paragraph tags with inset text

[frankieroberto]

The guidance for inset text currently uses the following HTML as an example:

<div class="govuk-inset-text">
  It can take up to 8 weeks to register a lasting power of attorney 
  if there are no mistakes in the application.
</div>

generated from the following Nunjucks macro:

{{ govukInsetText({
  text: "It can take up to 8 weeks to register a lasting power of attorney 
         if there are no mistakes in the application."
}) }}

...which is fine, except that it felt odd to me that there was no <p> tag involved, given that it’s clearly a paragraph of text. This probably makes no difference to anyone in the real world, but the HTML spec does say:

Authors are strongly encouraged to view the div element as an element of last resort, for when no other element is suitable. Use of more appropriate elements instead of the div element leads to better accessibility for readers and easier maintainability for authors.
HTML5: div element

This could be accomplished by making the example use the html option of the macro, eg:

{{ govukInsetText({
  html: "<p class='govuk-body'>It can take up to 8 weeks to register a lasting power of attorney 
         if there are no mistakes in the application.</p>"
}) }}

Or perhaps the text option of the macro could render a <p> tag, either within <div class="govuk-inset-text">, or as a replacement for the <div> itself, ie <p class="govuk-inset-text">text</p>.

Not really a big deal in the grand scheme of things, but thought I'd log this as something to consider anyway.

[NickColley]

Hey Frankie,

Thanks for the feedback, you can definitely use this component with or without paragraphs that's up to you.

We tend not to include paragraphs elements for single paragraphs inside components like these, and that is seen in other components too.

We could consider configuring the macro to output differently depending on the input, or updating the guidance.

We've spoken about this as a team and decided that for now we're going to close this as we think we'd have to consistently make this change in the other components too, we can review this in the future if something more pressing comes up.

Thanks for the feedback as always, it's really helpful.

Nick