Create Button View, ViewComponent and Model

[akdalin-hee]

Description

Create Button View, ViewComponent and Model

Screenshots

Paste screenshots for all views created or changed: mobile, tablet and desktop, wave analyser showing no errors.

---

Developer checks

(Leave tasks unticked if they haven't been appropriate for your ticket.)

I have:

• Run the IDE auto formatter on all files I’ve worked on and made sure there are no IDE errors relating to them
• Written or updated tests for the changes and made sure all tests are passing
• Manually tested my work with and without JavaScript (adding notes where functionality requires JavaScript)
• Tested with Wave Chrome plugin. Addressed any valid accessibility issues and documented any invalid errors
• Scanned over my pull request in GitHub and addressed any warnings from the GitHub Build and Test checks in the GitHub PR ‘Files Changed’ tab
  Either:
• Documented my work in Confluence, updating any business rules applied or modified. Updated GitHub readme/documentation for the repository if appropriate. List of documentation links added/changed:
  • doc_1_here
    Or:
• Confirmed that none of the work that I have undertaken requires any updates to documentation
• CHANGELOG entry

[kevwhitt-hee]

We frequently style links as buttons and include role="button" attribute.

As an example we would have a "Next" submit button in a multi-step flow and to the left of it we would have a "Back" link styled as a secondary button.

They would obvs need a URL param too. We could cater for that in this component, potentially.

@wellhairy should we include this or should we not be using buttons in this way?

[wellhairy]

Sematically im not sure you're meant to add a role of button to a link. I think on occasion we do style a back or cancel links as buttons but i think it's common practice to style these as links. If we were to style a link as a button this would likely just be in styling alone.

Most of the time when you'd use a role="button" its to apply JS functionity or similar but it's more likely you'd just use a button element in most cases. I think the main reason for the role="button" is to tell assisted technology that something thats not normally a button, likea div, has button like functionality. See Button role.

The way the prototyping kit handles this is if a button component has a URL paramiter then it outputs a link with a class="nhsuk-button" or similar.

[wellhairy]

But yeah i think it'd be fine to add this functionality, I just think it'd probably come down to semantic use case or UR around a specific transctional journey.

[kevwhitt-hee]

Looks good.