govuk_publishing_components 11.0.0 → 11.1.0

data/node_modules/govuk-frontend/components/header/README.md

@@ -152,7 +152,7 @@ Find out when to use the header component in your service in the [GOV.UK Design
 
         <div class="govuk-header__content">
 
-        <button role="button" class="govuk-header__menu-button js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
+        <button type="button" role="button" class="govuk-header__menu-button js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
         <nav>
           <ul id="navigation" class="govuk-header__navigation " aria-label="Top Level Navigation">
 
@@ -257,7 +257,7 @@ Find out when to use the header component in your service in the [GOV.UK Design
           Service Name
         </a>
 
-        <button role="button" class="govuk-header__menu-button js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
+        <button type="button" role="button" class="govuk-header__menu-button js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
         <nav>
           <ul id="navigation" class="govuk-header__navigation " aria-label="Top Level Navigation">
 
@@ -473,6 +473,18 @@ If you are using Nunjucks,then macros take the following arguments
 
 <tr class="govuk-table__row">
 
+<th class="govuk-table__header" scope="row">navigation.{}.attributes</th>
+
+<td class="govuk-table__cell ">object</td>
+
+<td class="govuk-table__cell ">No</td>
+
+<td class="govuk-table__cell ">Any extra HTML attributes (for example data attributes) to add to the navigation item anchor.</td>
+
+</tr>
+
+<tr class="govuk-table__row">
+
 <th class="govuk-table__header" scope="row">navigationClasses</th>
 
 <td class="govuk-table__cell ">string</td>

data/node_modules/govuk-frontend/components/header/_header.scss

@@ -76,8 +76,10 @@
       text-decoration: underline;
     }
 
+    // When focussed, the text colour needs to be darker to ensure that colour
+    // contrast is still acceptable
     &:focus {
-      color: govuk-colour("black");
+      color: $govuk-focus-text-colour;
     }
 
     // alphagov/govuk_template includes a specific a:link:focus selector
@@ -239,6 +241,12 @@
       &:visited {
         color: $govuk-header-link-active;
       }
+
+      // When focussed, the text colour needs to be darker to ensure that colour
+      // contrast is still acceptable
+      &:focus {
+        color: $govuk-focus-text-colour;
+      }
     }
   }
 

data/node_modules/govuk-frontend/components/header/macro-options.json

@@ -0,0 +1,88 @@
+[
+    {
+        "name": "homepageUrl",
+        "type": "string",
+        "required": false,
+        "description": "The url of the homepage. Defaults to /"
+    },
+    {
+        "name": "assetsPath",
+        "type": "string",
+        "required": false,
+        "description": "The public path for the assets folder. If not provided it defaults to /assets/images"
+    },
+    {
+        "name": "productName",
+        "type": "string",
+        "required": false,
+        "description": "Header title that is placed next to GOV.UK. Used for product names (i.e. Pay, Verify)"
+    },
+    {
+        "name": "serviceName",
+        "type": "string",
+        "required": false,
+        "description": "Header title that is placed next to GOV.UK. Used for product names (i.e. Pay, Verify)"
+    },
+    {
+        "name": "serviceUrl",
+        "type": "string",
+        "required": false,
+        "description": "Url for the service name anchor."
+    },
+    {
+        "name": "navigation",
+        "type": "array",
+        "required": false,
+        "description": "An array of navigation item objects.",
+        "params": [
+            {
+                "name": "text",
+                "type": "string",
+                "required": false,
+                "description": "Text of the navigation item."
+            },
+            {
+                "name": "href",
+                "type": "string",
+                "required": false,
+                "description": "Url of the navigation item anchor. Both `href` and `text` attributes for navigation items need to be provided to create an item."
+            },
+            {
+                "name": "active",
+                "type": "boolean",
+                "required": false,
+                "description": "Flag to mark the navigation item as active or not."
+            },
+            {
+                "name": "attributes",
+                "type": "object",
+                "required": false,
+                "description": "HTML attributes (for example data attributes) to add to the navigation item anchor."
+            }
+        ]
+    },
+    {
+        "name": "navigationClasses",
+        "type": "string",
+        "required": false,
+        "description": "Classes for the navigation section of the header."
+    },
+    {
+        "name": "containerClasses",
+        "type": "string",
+        "required": false,
+        "description": "Classes for the container, useful if you want to make the header fixed width."
+    },
+    {
+        "name": "classes",
+        "type": "string",
+        "required": false,
+        "description": "Classes to add to the header container."
+    },
+    {
+        "name": "attributes",
+        "type": "object",
+        "required": false,
+        "description": "HTML attributes (for example data attributes) to add to the header container."
+    }
+]

data/node_modules/govuk-frontend/components/header/template.njk

@@ -63,13 +63,13 @@
     {% endif %}
 
     {% if params.navigation %}
-    <button role="button" class="govuk-header__menu-button js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
+    <button type="button" role="button" class="govuk-header__menu-button js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
     <nav>
       <ul id="navigation" class="govuk-header__navigation {{ params.navigationClasses if params.navigationClasses }}" aria-label="Top Level Navigation">
         {% for item in params.navigation %}
           {% if item.href and item.text %}
             <li class="govuk-header__navigation-item{{ ' govuk-header__navigation-item--active' if item.active }}">
-              <a class="govuk-header__link" href="{{ item.href }}">
+              <a class="govuk-header__link" href="{{ item.href }}"{% for attribute, value in item.attributes %} {{attribute}}="{{value}}"{% endfor %}>
                 {{ item.text }}
               </a>
             </li>

data/node_modules/govuk-frontend/components/hint/macro-options.json

@@ -0,0 +1,32 @@
+[
+    {
+        "name": "text",
+        "type": "string",
+        "required": true,
+        "description": "If `html` is set, this is not required. Text to use within the hint. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "html",
+        "type": "string",
+        "required": true,
+        "description": "If `text` is set, this is not required. HTML to use within the hint. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "id",
+        "type": "string",
+        "required": true,
+        "description": "Optional id attribute to add to the hint span tag."
+    },
+    {
+        "name": "classes",
+        "type": "string",
+        "required": false,
+        "description": "Classes to add to the hint span tag."
+    },
+    {
+        "name": "attributes",
+        "type": "object",
+        "required": false,
+        "description": "HTML attributes (for example data attributes) to add to the hint span tag."
+    }
+]

data/node_modules/govuk-frontend/components/input/README.md

@@ -6,7 +6,7 @@ A single-line text field.
 
 ## Guidance
 
-Find out when to use the input component in your service in the [GOV.UK Design System](https://govuk-design-system-production.cloudapps.digital/components/text-input).
+Find out when to use the input component in your service in the [GOV.UK Design System](https://design-system.service.gov.uk/components/text-input).
 
 ## Quick start examples
 

data/node_modules/govuk-frontend/components/input/_input.scss

@@ -11,9 +11,7 @@
     @include govuk-font($size: 19);
     @include govuk-focusable;
 
-    -webkit-box-sizing: border-box;
-
-            box-sizing: border-box;
+    box-sizing: border-box;
     width: 100%;
     height: 40px;
     margin-top: 0;

data/node_modules/govuk-frontend/components/input/macro-options.json

@@ -0,0 +1,52 @@
+[
+    {
+        "name": "id",
+        "type": "string",
+        "required": true,
+        "description": "The id of the input."
+    },
+    {
+        "name": "name",
+        "type": "string",
+        "required": true,
+        "description": "The name of the input, which is submitted with the form data."
+    },
+    {
+        "name": "type",
+        "type": "string",
+        "required": false,
+        "description": "Type of input control to render. Defaults to \"text\"."
+    },
+    {
+        "name": "value",
+        "type": "string",
+        "required": false,
+        "description": "Optional initial value of the input."
+    },
+    {
+        "name": "hint",
+        "type": "object",
+        "required": false,
+        "description": "Options for the hint component.",
+        "isComponent": true
+    },
+    {
+        "name": "errorMessage",
+        "type": "object",
+        "required": false,
+        "description": "Options for the errorMessage component.",
+        "isComponent": true
+    },
+    {
+        "name": "classes",
+        "type": "string",
+        "required": false,
+        "description": "Classes to add to the anchor tag."
+    },
+    {
+        "name": "attributes",
+        "type": "object",
+        "required": false,
+        "description": "HTML attributes (for example data attributes) to add to the anchor tag."
+    }
+]

data/node_modules/govuk-frontend/components/inset-text/macro-options.json

@@ -0,0 +1,32 @@
+[
+    {
+        "name": "text",
+        "type": "string",
+        "required": true,
+        "description": "If `html` is set, this is not required. Text to use within the back link component. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "html",
+        "type": "string",
+        "required": true,
+        "description": "If `text` is set, this is not required. HTML to use within the back link component. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "id",
+        "type": "string",
+        "required": false,
+        "description": "Id attribute to add to the inset text container."
+    },
+    {
+        "name": "classes",
+        "type": "string",
+        "required": false,
+        "description": "Classes to add to the anchor tag."
+    },
+    {
+        "name": "attributes",
+        "type": "object",
+        "required": false,
+        "description": "HTML attributes (for example data attributes) to add to the anchor tag."
+    }
+]

data/node_modules/govuk-frontend/components/label/macro-options.json

@@ -0,0 +1,38 @@
+[
+    {
+        "name": "text",
+        "type": "string",
+        "required": true,
+        "description": "If `html` is set, this is not required. Text to use within the label. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "html",
+        "type": "string",
+        "required": true,
+        "description": "If `text` is set, this is not required. HTML to use within the label. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "for",
+        "type": "string",
+        "required": true,
+        "description": "The value of the for attribute, the id of the input the label is associated with."
+    },
+    {
+        "name": "isPageHeading",
+        "type": "boolean",
+        "required": false,
+        "description": "Whether the label also acts as the heading for the page."
+    },
+    {
+        "name": "classes",
+        "type": "string",
+        "required": false,
+        "description": "Classes to add to the label tag."
+    },
+    {
+        "name": "attributes",
+        "type": "object",
+        "required": false,
+        "description": "HTML attributes (for example data attributes) to add to the label tag."
+    }
+]

data/node_modules/govuk-frontend/components/panel/README.md

@@ -17,9 +17,9 @@ Find out when to use the panel component in your service in the [GOV.UK Design S
 #### Markup
 
     <div class="govuk-panel govuk-panel--confirmation">
-      <h2 class="govuk-panel__title">
+      <h1 class="govuk-panel__title">
         Application complete
-      </h2>
+      </h1>
 
       <div class="govuk-panel__body">
         Your reference number: HDJ2123F
@@ -43,9 +43,9 @@ Find out when to use the panel component in your service in the [GOV.UK Design S
 #### Markup
 
     <div class="govuk-panel govuk-panel--confirmation">
-      <h1 class="govuk-panel__title">
+      <h2 class="govuk-panel__title">
         Application complete
-      </h1>
+      </h2>
 
       <div class="govuk-panel__body">
         Your reference number: HDJ2123F
@@ -59,7 +59,7 @@ Find out when to use the panel component in your service in the [GOV.UK Design S
 
     {{ govukPanel({
       "titleText": "Application complete",
-      "headingLevel": 1,
+      "headingLevel": 2,
       "text": "Your reference number: HDJ2123F"
     }) }}
 

data/node_modules/govuk-frontend/components/panel/_panel.scss

@@ -7,9 +7,7 @@
   .govuk-panel {
     @include govuk-font($size: 19);
 
-    -webkit-box-sizing: border-box;
-
-            box-sizing: border-box;
+    box-sizing: border-box;
 
     margin-bottom: govuk-spacing(3);
     padding: govuk-spacing(7) - $govuk-border-width;

data/node_modules/govuk-frontend/components/panel/macro-options.json

@@ -0,0 +1,44 @@
+[
+    {
+        "name": "titleText",
+        "type": "string",
+        "required": true,
+        "description": "If `titleHtml` is set, this is not required. Text to use within the panel. If `titleHtml` is provided, the `titleText` argument will be ignored."
+    },
+    {
+        "name": "titleHtml",
+        "type": "string",
+        "required": true,
+        "description": "If `titleText` is set, this is not required. HTML to use within the panel. If `titleHtml` is provided, the `titleText` argument will be ignored."
+    },
+    {
+        "name": "headingLevel",
+        "type": "integer",
+        "required": false,
+        "description": "Heading level, from 1 to 6. Default is 1."
+    },
+    {
+        "name": "text",
+        "type": "string",
+        "required": true,
+        "description": "If `html` is set, this is not required. Text to use within the panel content. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "html",
+        "type": "string",
+        "required": true,
+        "description": "If `text` is set, this is not required. HTML to use within the panel content. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "classes",
+        "type": "string",
+        "required": false,
+        "description": "Classes to add to the panel container."
+    },
+    {
+        "name": "attributes",
+        "type": "object",
+        "required": false,
+        "description": "HTML attributes (for example data attributes) to add to the panel container."
+    }
+]

data/node_modules/govuk-frontend/components/panel/template.njk

@@ -1,5 +1,4 @@
-{#- TODO: Change default title heading level to 1 - https://github.com/alphagov/govuk-frontend/issues/864 -#}
-{% set headingLevel = params.headingLevel if params.headingLevel else 2 %}
+{% set headingLevel = params.headingLevel if params.headingLevel else 1 %}
 <div class="govuk-panel govuk-panel--confirmation
   {%- if params.classes %} {{ params.classes }}{% endif %}"
   {%- for attribute, value in params.attributes %} {{attribute}}="{{value}}"{% endfor %}>

data/node_modules/govuk-frontend/components/phase-banner/macro-options.json

@@ -0,0 +1,33 @@
+[
+    {
+        "name": "text",
+        "type": "string",
+        "required": true,
+        "description": "If `html` is set, this is not required. Text to use within the phase banner. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "html",
+        "type": "string",
+        "required": true,
+        "description": "If `text` is set, this is not required. HTML to use within the phase banner. If `html` is provided, the `text` argument will be ignored."
+    },
+    {
+        "name": "tag",
+        "type": "object",
+        "required": false,
+        "description": "Options for the tag component.",
+        "isComponent": true
+    },
+    {
+        "name": "classes",
+        "type": "string",
+        "required": false,
+        "description": "Classes to add to the phase banner container."
+    },
+    {
+        "name": "attributes",
+        "type": "object",
+        "required": false,
+        "description": "HTML attributes (for example data attributes) to add to the phase banner container."
+    }
+]