<% if !@component_doc.accessibility_criteria.present? %>

This component is not valid

Please define accessibility acceptance criteria for this component.

<% end %> <%= render 'govuk_publishing_components/components/lead_paragraph', text: @component_doc.description %> <% if @component_doc.body.present? %>

<%= raw(@component_doc.html_body) %>

<% end %>

How to call this component

<%= render "govuk_publishing_components/component_guide/component_doc/call", component_doc: @component_doc, example: @component_doc.example %> <%= link_to "Search for usage on GitHub", @component_doc.github_search_url, class: "govuk-link" %>

How it looks

<%= render "govuk_publishing_components/component_guide/component_doc/preview", component_doc: @component_doc, example: @component_doc.example %> <% if @component_doc.govuk_frontend_components.any? %>

GOV.UK Design System

This component incorporates components from the <%= link_to "GOV.UK Design System", "https://design-system.service.gov.uk" %>:

<%= link_to component.humanize, "https://design-system.service.gov.uk/components/#{component}" %>

<% end %> <% if @component_doc.accessibility_criteria.present? %>

Accessibility acceptance criteria

<%= raw(@component_doc.html_accessibility_criteria) %>

<% end %> <% if @component_doc.other_examples.any? %>

Other examples (preview all)

<% @component_doc.other_examples.each do |example| %>

<%= example.name %> (preview)

<%= raw(example.html_description) %>

<%= render "govuk_publishing_components/component_guide/component_doc/call", component_doc: @component_doc, example: example %> <%= render "govuk_publishing_components/component_guide/component_doc/preview", component_doc: @component_doc, example: example %>

<% end %>