merge main

.babelrc

@@ -2,7 +2,7 @@
     "presets": [
         ["@babel/preset-env", {
             "targets": {
-                "node": "14"
+                "node": "18"
             }
         }]
     ]

.eslintrc.json

@@ -1,5 +1,5 @@
 {
-  "parser": "babel-eslint",
+  "parser": "@babel/eslint-parser",
   "plugins": ["prettier"],
   "extends": ["prettier"],
   "env": {
@@ -23,6 +23,7 @@
     "no-var": [1],
     "one-var": [0],
     "max-len": [0, { "code": 140, "ignoreUrls": true }],
-    "comma-dangle": ["error", "always-multiline"]
+    "comma-dangle": ["error", "always-multiline"],
+    "arrow-parens": 1
   }
 }

.github/PULL_REQUEST_TEMPLATE.md

@@ -1,5 +1,19 @@
+<!-- ignore-task-list-start -->
+
 ### What is the context of this PR?
+
 Describe what you have changed and why, link to other PRs or Issues as appropriate.
 
-### How to review
+### How to review this PR
+
 Describe the steps required to test the changes (include screenshots if appropriate).
+
+### Checklist
+
+This needs to be completed by the person raising the PR.
+
+<!-- ignore-task-list-end -->
+
+- [ ] I have selected the correct Project for this PR (Design System) and selected the correct status
+- [ ] I have selected the correct Assignee
+- [ ] I have linked the correct Issue

.github/release.yml

@@ -7,6 +7,9 @@ changelog:
       labels:
         - Component
         - Pattern
+    - title: Accessibility improvements
+      labels:
+        - Accessibility
     - title: Enhancements
       labels:
         - Enhancement
@@ -16,6 +19,9 @@ changelog:
     - title: Documentation
       labels:
         - Documentation
+    - title: Dependency updates
+      labels:
+        - Dependencies
     - title: Other changes
       labels:
         - "*"

.github/workflows/check-checklist.yml

@@ -0,0 +1,17 @@
+name: Checklist Checker
+on:
+  pull_request:
+    types:
+      - opened
+      - edited
+      - synchronize
+      - reopened
+
+jobs:
+  check-tasks:
+    name: Check tasks
+    runs-on: ubuntu-latest
+    steps:
+      - uses: mheap/require-checklist-action@v2
+        with:
+          requireChecklist: true

.github/workflows/check-labels.yml

@@ -0,0 +1,22 @@
+name: Label Checker
+on:
+  pull_request:
+    types:
+      - opened
+      - synchronize
+      - reopened
+      - labeled
+      - unlabeled
+
+jobs:
+  check-labels:
+    name: Check labels
+    runs-on: ubuntu-latest
+    permissions:
+      pull-requests: read
+    steps:
+      - uses: docker://onsdigital/github-pr-label-checker:v1.2.7
+        with:
+          one_of: Breaking changes,Accessibility,Bug,Documentation,Dependencies,Enhancement,Example
+          none_of: Awaiting resource,Do not merge,Duplicate,Needs validating,Not doing
+          repo_token: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/lighthouse-ci.yml

@@ -7,16 +7,16 @@ jobs:
     name: Lighthouse CI
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v1
+      - uses: actions/checkout@v3
         with:
           ref: ${{ github.event.pull_request.head.sha }}
       - name: Read .nvmrc file
-        run: echo "##[set-output name=NVMRC;]$(cat .nvmrc)"
-        id: nvm
+        id: read-nvmrc-file
+        run: echo "nvmrc=$(cat .nvmrc)" >> $GITHUB_OUTPUT
       - name: Install Node
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
-          node-version: "${{ steps.nvm.outputs.NVMRC }}"
+          node-version: "${{ steps.read-nvmrc-file.outputs.nvmrc }}"
       - name: Install dependencies
         run: yarn install
       - name: Build pages

.github/workflows/npm-bundle.yml

@@ -8,13 +8,17 @@ jobs:
   build:
     runs-on: ubuntu-latest
     steps:
-      - name: Use Node.js 14.15.0
-        uses: actions/checkout@v2
+      - name: Read .nvmrc file
+        id: read-nvmrc-file
+        run: echo "nvmrc=$(cat .nvmrc)" >> $GITHUB_OUTPUT
+      - name: Use Node.js
+        uses: actions/checkout@v3
         with:
           ref: ${{ github.event.release.target_commitish }}
-      - uses: actions/setup-node@v1
+      - name: Install Node
+        uses: actions/setup-node@v3
         with:
-          node-version: 14.15.0
+          node-version: "${{ steps.read-nvmrc-file.outputs.nvmrc }}"
           registry-url: https://registry.npmjs.org/
       - run: yarn install
       - run: git config --global user.name "${{ github.actor }}"

.github/workflows/release.yml

@@ -6,10 +6,14 @@ jobs:
   add-templates-to-release:
     runs-on: ubuntu-latest
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - uses: actions/checkout@v3
+      - name: Read .nvmrc file
+        id: read-nvmrc-file
+        run: echo "nvmrc=$(cat .nvmrc)" >> $GITHUB_OUTPUT
+      - name: Install Node
+        uses: actions/setup-node@v3
         with:
-          node-version: '14'
+          node-version: "${{ steps.read-nvmrc-file.outputs.nvmrc }}"
       - name: Install dependencies
         run: yarn install
       - name: Build templates

.github/workflows/tests.yml

@@ -11,11 +11,14 @@ jobs:
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
+      - name: Read .nvmrc file
+        id: read-nvmrc-file
+        run: echo "nvmrc=$(cat .nvmrc)" >> $GITHUB_OUTPUT
       - name: Install Node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
-          node-version: "14"
+          node-version: "${{ steps.read-nvmrc-file.outputs.nvmrc }}"
       - name: Install dependencies
         run: yarn install
       - name: Run macro and script tests
@@ -41,14 +44,17 @@ jobs:
 
     steps:
       - name: Checkout
-        uses: actions/checkout@v2
+        uses: actions/checkout@v3
         with:
           lfs: true
           url: https://github.com/ONSdigital/design-system.git
+      - name: Read .nvmrc file
+        id: read-nvmrc-file
+        run: echo "nvmrc=$(cat .nvmrc)" >> $GITHUB_OUTPUT
       - name: Install Node
-        uses: actions/setup-node@v2
+        uses: actions/setup-node@v3
         with:
-          node-version: "16"
+          node-version: "${{ steps.read-nvmrc-file.outputs.nvmrc }}"
       - name: Install dependencies
         run: yarn install
       - name: Install Docker
@@ -72,4 +78,3 @@ jobs:
             { "title": "By", "value": "${{ github.actor }}", "short": true },
             { "title": "Branch", "value": "${{ github.head_ref }}", "short": true },
             { "title": "View job", "value": "${env.GITHUB_SERVER_URL}/${env.GITHUB_REPOSITORY}/actions/runs/${env.GITHUB_RUN_ID}"}]
-            

.gitignore

@@ -6,10 +6,14 @@ coverage/
 .vscode/
 .idea/
 package-lock.json
+.husky/pre-push
+.husky/post-commit
+.husky/post-merge
 
 # Generated from visual regression tests
 backstop_data/bitmaps_test/
 backstop_data/html_report/
+backstop.config-for-docker.json
 
 # npm package folders
 /components/
@@ -21,6 +25,8 @@ backstop_data/html_report/
 /img/
 /scripts/
 /scss/
+/js/
+/layout/
 
 secrets.yml
 

.nvmrc

@@ -1 +1 @@
-v14.15.0
+v18.17.1

.stylelintrc.yml

@@ -5,6 +5,7 @@ extends:
     - stylelint-config-sass-guidelines
 plugins:
     - stylelint-scss
+    - stylelint-order
 rules:
     # Line Spacing
     rule-empty-line-before:
@@ -39,7 +40,8 @@ rules:
         - ignoreProperties:
             - 'box-orient'
         - ignoreAtRules: ['each', 'else', 'extend', 'for', 'function', 'if', 'include', 'mixin', 'return', 'while']
-
+    # Imports
+    import-notation: 'string'
     # Nesting
     max-nesting-depth:
         - 5

README.md

@@ -33,6 +33,7 @@ To enable this we use [nvm (Node Version Manager)](https://github.com/creationix
 
 ```bash
 yarn install
+husky install
 ```
 
 ### Start a local server