Skip to content

Commit

Permalink
Merge pull request #2851 from alphagov/ncarey-prototype-kit-v13
Browse files Browse the repository at this point in the history
Supporting v13 of the Prototype Kit
  • Loading branch information
colinrotherham authored Nov 4, 2022
2 parents 41da3f7 + 866286a commit 73c7da8
Show file tree
Hide file tree
Showing 9 changed files with 415 additions and 15 deletions.
1 change: 1 addition & 0 deletions docs/contributing/tasks.md
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ npm scripts are defined in `package.json`. These trigger a number of Gulp tasks.
- clean the `./package` folder
- copy Sass files, applying Autoprefixer via PostCSS
- copy Nunjucks component template/macro files, including JSON configs
- copy GOV.UK Prototype Kit config files
- copy JavaScript ESM source files
- compile JavaScript ESM to CommonJS (`gulp js:compile`)
- runs `npm run test:build:package` (which will test the output is correct)
Expand Down
4 changes: 3 additions & 1 deletion gulpfile.js
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ require('./tasks/gulp/watch.js')

// Node tasks
const { updateDistAssetsVersion } = require('./tasks/asset-version.js')
const { updatePrototypeKitConfig } = require('./tasks/prototype-kit-config.js')
const { clean } = require('./tasks/clean.js')
const { npmScriptTask } = require('./tasks/run.js')

Expand Down Expand Up @@ -73,7 +74,8 @@ gulp.task('dev', gulp.series(
gulp.task('build:package', gulp.series(
clean,
'copy:files',
'js:compile'
'js:compile',
updatePrototypeKitConfig
))

/**
Expand Down
119 changes: 117 additions & 2 deletions package/govuk-prototype-kit.config.json
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,127 @@
"/"
],
"scripts": [
"/govuk/all.js"
"/govuk/all.js",
"/govuk/_govuk-prototype-kit-init.js"
],
"assets": [
"/govuk/assets"
],
"sass": [
"/govuk/all.scss"
"/govuk/_govuk-prototype-kit.scss"
],
"nunjucksMacros": [
{
"importFrom": "govuk/components/accordion/macro.njk",
"macroName": "govukAccordion"
},
{
"importFrom": "govuk/components/back-link/macro.njk",
"macroName": "govukBackLink"
},
{
"importFrom": "govuk/components/breadcrumbs/macro.njk",
"macroName": "govukBreadcrumbs"
},
{
"importFrom": "govuk/components/button/macro.njk",
"macroName": "govukButton"
},
{
"importFrom": "govuk/components/character-count/macro.njk",
"macroName": "govukCharacterCount"
},
{
"importFrom": "govuk/components/checkboxes/macro.njk",
"macroName": "govukCheckboxes"
},
{
"importFrom": "govuk/components/cookie-banner/macro.njk",
"macroName": "govukCookieBanner"
},
{
"importFrom": "govuk/components/date-input/macro.njk",
"macroName": "govukDateInput"
},
{
"importFrom": "govuk/components/details/macro.njk",
"macroName": "govukDetails"
},
{
"importFrom": "govuk/components/error-message/macro.njk",
"macroName": "govukErrorMessage"
},
{
"importFrom": "govuk/components/error-summary/macro.njk",
"macroName": "govukErrorSummary"
},
{
"importFrom": "govuk/components/fieldset/macro.njk",
"macroName": "govukFieldset"
},
{
"importFrom": "govuk/components/file-upload/macro.njk",
"macroName": "govukFileUpload"
},
{
"importFrom": "govuk/components/input/macro.njk",
"macroName": "govukInput"
},
{
"importFrom": "govuk/components/inset-text/macro.njk",
"macroName": "govukInsetText"
},
{
"importFrom": "govuk/components/notification-banner/macro.njk",
"macroName": "govukNotificationBanner"
},
{
"importFrom": "govuk/components/pagination/macro.njk",
"macroName": "govukPagination"
},
{
"importFrom": "govuk/components/panel/macro.njk",
"macroName": "govukPanel"
},
{
"importFrom": "govuk/components/phase-banner/macro.njk",
"macroName": "govukPhaseBanner"
},
{
"importFrom": "govuk/components/radios/macro.njk",
"macroName": "govukRadios"
},
{
"importFrom": "govuk/components/select/macro.njk",
"macroName": "govukSelect"
},
{
"importFrom": "govuk/components/skip-link/macro.njk",
"macroName": "govukSkipLink"
},
{
"importFrom": "govuk/components/summary-list/macro.njk",
"macroName": "govukSummaryList"
},
{
"importFrom": "govuk/components/table/macro.njk",
"macroName": "govukTable"
},
{
"importFrom": "govuk/components/tabs/macro.njk",
"macroName": "govukTabs"
},
{
"importFrom": "govuk/components/tag/macro.njk",
"macroName": "govukTag"
},
{
"importFrom": "govuk/components/textarea/macro.njk",
"macroName": "govukTextarea"
},
{
"importFrom": "govuk/components/warning-text/macro.njk",
"macroName": "govukWarningText"
}
]
}
44 changes: 44 additions & 0 deletions src/govuk-prototype-kit/govuk-prototype-kit.config.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,44 @@
import { join, relative } from 'path'
import slash from 'slash'

import { filterPath, getDirectories, getListing } from '../../lib/file-helper.js'
import { componentNameToMacroName } from '../../lib/helper-functions.js'
import configPaths from '../../config/paths.js'

/**
* GOV.UK Prototype Kit config builder
*/
export default async () => {
const componentsFiles = await getListing(configPaths.components)
const componentNames = await getDirectories(configPaths.components)

// Build array of macros
const nunjucksMacros = componentNames
.map((componentName) => {
const [macroPath] = componentsFiles
.filter(filterPath([`${componentName}/macro.njk`]))

// Relative path to src without 'govuk'
const rootPath = join(configPaths.src, '../')

return {
importFrom: slash(relative(rootPath, join(configPaths.components, macroPath))),
macroName: componentNameToMacroName(componentName)
}
})

return {
assets: [
'/govuk/assets'
],
sass: [
'/govuk-prototype-kit/init.scss'
],
scripts: [
'/govuk/all.js',
'/govuk-prototype-kit/init.js'
],
nunjucksMacros,
nunjucksPaths: ['/']
}
}
163 changes: 163 additions & 0 deletions src/govuk-prototype-kit/govuk-prototype-kit.config.unit.test.mjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,163 @@
import configFn from './govuk-prototype-kit.config.mjs'

describe('GOV.UK Prototype Kit config', () => {
let config

beforeAll(async () => {
config = await configFn()
})

it('includes paths for assets, scripts, sass', () => {
expect(config.assets).toEqual([
'/govuk/assets'
])

expect(config.sass).toEqual([
'/govuk-prototype-kit/init.scss'
])

expect(config.scripts).toEqual([
'/govuk/all.js',
'/govuk-prototype-kit/init.js'
])
})

describe('Nunjucks', () => {
it('includes macros list', () => {
expect(config.nunjucksMacros).toEqual([
{
importFrom: 'govuk/components/accordion/macro.njk',
macroName: 'govukAccordion'
},
{
importFrom: 'govuk/components/back-link/macro.njk',
macroName: 'govukBackLink'
},
{
importFrom: 'govuk/components/breadcrumbs/macro.njk',
macroName: 'govukBreadcrumbs'
},
{
importFrom: 'govuk/components/button/macro.njk',
macroName: 'govukButton'
},
{
importFrom: 'govuk/components/character-count/macro.njk',
macroName: 'govukCharacterCount'
},
{
importFrom: 'govuk/components/checkboxes/macro.njk',
macroName: 'govukCheckboxes'
},
{
importFrom: 'govuk/components/cookie-banner/macro.njk',
macroName: 'govukCookieBanner'
},
{
importFrom: 'govuk/components/date-input/macro.njk',
macroName: 'govukDateInput'
},
{
importFrom: 'govuk/components/details/macro.njk',
macroName: 'govukDetails'
},
{
importFrom: 'govuk/components/error-message/macro.njk',
macroName: 'govukErrorMessage'
},
{
importFrom: 'govuk/components/error-summary/macro.njk',
macroName: 'govukErrorSummary'
},
{
importFrom: 'govuk/components/fieldset/macro.njk',
macroName: 'govukFieldset'
},
{
importFrom: 'govuk/components/file-upload/macro.njk',
macroName: 'govukFileUpload'
},
{
importFrom: 'govuk/components/footer/macro.njk',
macroName: 'govukFooter'
},
{
importFrom: 'govuk/components/header/macro.njk',
macroName: 'govukHeader'
},
{
importFrom: 'govuk/components/hint/macro.njk',
macroName: 'govukHint'
},
{
importFrom: 'govuk/components/input/macro.njk',
macroName: 'govukInput'
},
{
importFrom: 'govuk/components/inset-text/macro.njk',
macroName: 'govukInsetText'
},
{
importFrom: 'govuk/components/label/macro.njk',
macroName: 'govukLabel'
},
{
importFrom: 'govuk/components/notification-banner/macro.njk',
macroName: 'govukNotificationBanner'
},
{
importFrom: 'govuk/components/pagination/macro.njk',
macroName: 'govukPagination'
},
{
importFrom: 'govuk/components/panel/macro.njk',
macroName: 'govukPanel'
},
{
importFrom: 'govuk/components/phase-banner/macro.njk',
macroName: 'govukPhaseBanner'
},
{
importFrom: 'govuk/components/radios/macro.njk',
macroName: 'govukRadios'
},
{
importFrom: 'govuk/components/select/macro.njk',
macroName: 'govukSelect'
},
{
importFrom: 'govuk/components/skip-link/macro.njk',
macroName: 'govukSkipLink'
},
{
importFrom: 'govuk/components/summary-list/macro.njk',
macroName: 'govukSummaryList'
},
{
importFrom: 'govuk/components/table/macro.njk',
macroName: 'govukTable'
},
{
importFrom: 'govuk/components/tabs/macro.njk',
macroName: 'govukTabs'
},
{
importFrom: 'govuk/components/tag/macro.njk',
macroName: 'govukTag'
},
{
importFrom: 'govuk/components/textarea/macro.njk',
macroName: 'govukTextarea'
},
{
importFrom: 'govuk/components/warning-text/macro.njk',
macroName: 'govukWarningText'
}
])
})

it('includes paths', () => {
expect(config.nunjucksPaths).toEqual(['/'])
})
})
})
7 changes: 7 additions & 0 deletions src/govuk-prototype-kit/init.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
if (window.GOVUKPrototypeKit &&
window.GOVUKPrototypeKit.documentReady &&
window.GOVUKPrototypeKit.majorVersion >= 13) {
window.GOVUKPrototypeKit.documentReady(function () {
window.GOVUKFrontend.initAll()
})
}
12 changes: 12 additions & 0 deletions src/govuk-prototype-kit/init.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
$govuk-prototype-kit-major-version: 0 !default;

$govuk-assets-path: if(
$govuk-prototype-kit-major-version > 12,
$govuk-extensions-url-context + "/govuk-frontend/govuk/assets/",
"/govuk/assets/"
) !default;

$govuk-global-styles: true !default;
$govuk-new-link-styles: true !default;

@import "../govuk/all";
Loading

0 comments on commit 73c7da8

Please sign in to comment.