diff --git a/.gitignore b/.gitignore index e6634574..f59253fd 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,5 @@ /dist +/build /node_modules /tmp .DS_Store diff --git a/CHANGELOG.md b/CHANGELOG.md index c49f0622..3e813978 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,10 @@ - Graphic list should use `h2` as a heading element instead of `h3`. - "Official government website" banner text has been updated. Refer to [USWDS guidance](https://designsystem.digital.gov/components/banner/) for updated markup. +### New Features + +- The published NPM package can now be imported into a project. Bundlers that support dead-code elimination (Webpack, etc.) can automatically remove unused code to optimize bundle size. See [Usage guide](https://design.login.gov/usage/) for more information. Existing usage of JavaScript code from `dist/assets/` is unaffected by these changes. + ### Bug Fixes - Fixed support for multiple dropdown buttons on a page. diff --git a/Makefile b/Makefile index cb8035c7..202a7b0a 100644 --- a/Makefile +++ b/Makefile @@ -1,6 +1,7 @@ MAKEFLAGS += --jobs=6 TMP_DIR = ./tmp OUTPUT_DIR = ./dist +PACKAGE_DIR = ./build # Federalist builds overwrite the output directory. ifdef SITE_PREFIX @@ -33,17 +34,20 @@ validate-package-lock: package.json package-lock.json validate-lockfiles: validate-gemfile-lock validate-package-lock -lint: +lint: build-package ./node_modules/.bin/gulp lint make validate-lockfiles -build: build-docs build-assets +build: build-docs build-assets build-package build-docs: JEKYLL_ENV=production bundle exec jekyll build build-assets: build-sass-and-js build-fonts build-images copy-scss +build-package: + ./node_modules/.bin/gulp build-package + build-sass-and-js: NODE_ENV=production \ DISABLE_NOTIFIER=true \ @@ -76,3 +80,4 @@ test-runner-jest: clean: rm -rf $(OUTPUT_DIR) rm -rf $(TMP_DIR) + rm -rf $(PACKAGE_DIR) diff --git a/docs/usage.md b/docs/usage.md index 62eca597..3540cad2 100644 --- a/docs/usage.md +++ b/docs/usage.md @@ -96,3 +96,26 @@ $image-path: 'img'; @import 'identity-style-guide/dist/assets/scss/styles'; ``` + +### Use as a JavaScript package + +If you're already using a JavaScript bundler in your project, you can import specific component implementations from the `identity-style-guide` package. Most modern bundlers that support dead-code elimination will automatically optimize the bundle size to include only the code necessary in your project. + +```js +import { accordion } from 'identity-style-guide'; + +accordion.on(); +``` + +Note that unlike the pre-built JavaScript assets found in the `dist/assets` directory, importing the package from NPM will not automatically initialize the components on the page or include polyfills necessary to support older browsers. You will have to call the `on()` method for each component you import. + +If you need support for older browsers in your project, it's suggested you import polyfills shipped with the `uswds` package and import it before any components: + +``` +npm install uswds +``` + +```js +import 'uswds/src/js/polyfills'; +import { accordion } from 'identity-style-guide'; +``` diff --git a/gulpfile.js b/gulpfile.js index c902f58b..1f4b71a8 100644 --- a/gulpfile.js +++ b/gulpfile.js @@ -13,6 +13,7 @@ const gulpStylelint = require('gulp-stylelint'); const sourcemaps = require('gulp-sourcemaps'); const uswds = require('uswds-gulp/config/uswds'); const browserify = require('browserify'); +const babel = require('gulp-babel'); const source = require('vinyl-source-stream'); const buffer = require('vinyl-buffer'); const uglify = require('gulp-uglify'); @@ -22,8 +23,10 @@ const pkg = require('./package.json'); const PROJECT_SASS_SRC = './src/scss'; const PROJECT_JS_SRC = './src/js'; -const PROJECT_JS_MAIN = 'main.js'; +const PROJECT_JS_AUTO = 'auto.js'; +const PROJECT_JS_AUTO_OUT = 'main.js'; const OUTPUT_DIR = process.env.OUTPUT_DIR || './dist'; +const PACKAGE_DEST = 'build'; const JS_DEST = `${OUTPUT_DIR}/assets/js`; const CSS_DEST = `${OUTPUT_DIR}/assets/css`; const SCSS_DEST = `${OUTPUT_DIR}/assets/scss`; @@ -58,13 +61,28 @@ gulp.task('lint-js', () => .pipe(eslint.failAfterError()), ); +gulp.task('build-package-cjs', () => + gulp + .src(`${PROJECT_JS_SRC}/**/*.js`) + .pipe(babel({ presets: [['@babel/preset-env', { modules: 'cjs' }]] })) + .pipe(gulp.dest(`${PACKAGE_DEST}/cjs`)), +); + +gulp.task('build-package-esm', () => + gulp + .src(`${PROJECT_JS_SRC}/**/*.js`) + .pipe(babel({ presets: [['@babel/preset-env', { modules: false }]] })) + .pipe(gulp.dest(`${PACKAGE_DEST}/esm`)), +); + gulp.task('build-js', () => { - const stream = browserify({ entries: `${PROJECT_JS_SRC}/${PROJECT_JS_MAIN}`, debug: true }) + const stream = browserify({ entries: `${PROJECT_JS_SRC}/${PROJECT_JS_AUTO}`, debug: true }) .transform('babelify', { global: true, presets: ['@babel/preset-env'] }) .bundle() .on('error', notificationOptions.handler) - .pipe(source(PROJECT_JS_MAIN)) + .pipe(source(PROJECT_JS_AUTO)) .pipe(buffer()) + .pipe(rename(PROJECT_JS_AUTO_OUT)) .pipe(gulp.dest(JS_DEST)) .pipe(notify(notificationOptions.success)); @@ -150,6 +168,8 @@ gulp.task('lint', gulp.parallel('lint-js', 'lint-sass')); gulp.task('build', gulp.parallel('build-js', 'build-sass')); +gulp.task('build-package', gulp.parallel('build-package-cjs', 'build-package-esm')); + gulp.task( 'watch', gulp.parallel(gulp.series('build-js', 'watch-js'), gulp.series('build-sass', 'watch-sass')), diff --git a/package-lock.json b/package-lock.json index 9b7059e8..e662669f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2014,7 +2014,6 @@ "version": "2.1.3", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.3.tgz", "integrity": "sha512-eGmwYQn3gxo4r7jdQnkrrN6bY478C3P+a/y72IJukF8LjB6ZHeB3c+Ehacj3sYeSmUXGlnA67/PmbM9CVwL7Dw==", - "dev": true, "requires": { "@nodelib/fs.stat": "2.0.3", "run-parallel": "^1.1.9" @@ -2023,14 +2022,12 @@ "@nodelib/fs.stat": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-2.0.3.tgz", - "integrity": "sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==", - "dev": true + "integrity": "sha512-bQBFruR2TAwoevBEd/NWMoAAtNGzTRgdrqnYCc7dhzfoNvqPzLyqlEQnzZ3kVnNrSp25iyxE00/3h2fqGAGArA==" }, "@nodelib/fs.walk": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/@nodelib/fs.walk/-/fs.walk-1.2.4.tgz", "integrity": "sha512-1V9XOY4rDW0rehzbrcqAmHnz8e7SKvX27gh8Gt2WgB0+pdzdiLV83p72kZPU+jvMbS1qU5mauP2iOvO8rhmurQ==", - "dev": true, "requires": { "@nodelib/fs.scandir": "2.1.3", "fastq": "^1.6.0" @@ -2118,7 +2115,6 @@ "version": "7.1.3", "resolved": "https://registry.npmjs.org/@types/glob/-/glob-7.1.3.tgz", "integrity": "sha512-SEYeGAIQIQX8NN6LDKprLjbrd5dARM5EXsd8GI/A5l0apYI1fGMWgPHSe4ZKL4eozlAyI+doUE9XbYS4xCkQ1w==", - "dev": true, "requires": { "@types/minimatch": "*", "@types/node": "*" @@ -2166,8 +2162,7 @@ "@types/minimatch": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz", - "integrity": "sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==", - "dev": true + "integrity": "sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==" }, "@types/minimist": { "version": "1.2.0", @@ -2178,8 +2173,7 @@ "@types/node": { "version": "14.11.8", "resolved": "https://registry.npmjs.org/@types/node/-/node-14.11.8.tgz", - "integrity": "sha512-KPcKqKm5UKDkaYPTuXSx8wEP7vE9GnuaXIZKijwRYcePpZFDVuy2a57LarFKiORbHOuTOOwYzxVxcUzsh2P2Pw==", - "dev": true + "integrity": "sha512-KPcKqKm5UKDkaYPTuXSx8wEP7vE9GnuaXIZKijwRYcePpZFDVuy2a57LarFKiORbHOuTOOwYzxVxcUzsh2P2Pw==" }, "@types/normalize-package-data": { "version": "2.4.0", @@ -2340,7 +2334,6 @@ "version": "3.1.0", "resolved": "https://registry.npmjs.org/aggregate-error/-/aggregate-error-3.1.0.tgz", "integrity": "sha512-4I7Td01quW/RpocfNayFdFVk1qSuoh0E7JrbRJ16nH01HhKFQ88INq9Sd+nd72zqRySlr9BmDA8xlEJ6vJMrYA==", - "dev": true, "requires": { "clean-stack": "^2.0.0", "indent-string": "^4.0.0" @@ -2349,8 +2342,7 @@ "indent-string": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/indent-string/-/indent-string-4.0.0.tgz", - "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==", - "dev": true + "integrity": "sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==" } } }, @@ -3294,8 +3286,7 @@ "balanced-match": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", - "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=", - "dev": true + "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=" }, "base": { "version": "0.11.2", @@ -3489,7 +3480,6 @@ "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", - "dev": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -4148,14 +4138,12 @@ "classlist-polyfill": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/classlist-polyfill/-/classlist-polyfill-1.2.0.tgz", - "integrity": "sha1-k1vC39lFiodrJ5YXUUY4vKqWSi4=", - "dev": true + "integrity": "sha1-k1vC39lFiodrJ5YXUUY4vKqWSi4=" }, "clean-stack": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", - "integrity": "sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==", - "dev": true + "integrity": "sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==" }, "cli-boxes": { "version": "1.0.0", @@ -4567,8 +4555,7 @@ "concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", - "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", - "dev": true + "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=" }, "concat-stream": { "version": "1.6.2", @@ -5415,81 +5402,6 @@ "integrity": "sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM=", "dev": true }, - "del": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/del/-/del-5.1.0.tgz", - "integrity": "sha512-wH9xOVHnczo9jN2IW68BabcecVPxacIA3g/7z6vhSU/4stOKQzeCRK0yD0A24WiAAUJmmVpWqrERcTxnLo3AnA==", - "dev": true, - "requires": { - "globby": "^10.0.1", - "graceful-fs": "^4.2.2", - "is-glob": "^4.0.1", - "is-path-cwd": "^2.2.0", - "is-path-inside": "^3.0.1", - "p-map": "^3.0.0", - "rimraf": "^3.0.0", - "slash": "^3.0.0" - }, - "dependencies": { - "array-union": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz", - "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==", - "dev": true - }, - "glob": { - "version": "7.1.6", - "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz", - "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==", - "dev": true, - "requires": { - "fs.realpath": "^1.0.0", - "inflight": "^1.0.4", - "inherits": "2", - "minimatch": "^3.0.4", - "once": "^1.3.0", - "path-is-absolute": "^1.0.0" - } - }, - "globby": { - "version": "10.0.2", - "resolved": "https://registry.npmjs.org/globby/-/globby-10.0.2.tgz", - "integrity": "sha512-7dUi7RvCoT/xast/o/dLN53oqND4yk0nsHkhRgn9w65C4PofCLOoJ39iSOg+qVDdWQPIEj+eszMHQ+aLVwwQSg==", - "dev": true, - "requires": { - "@types/glob": "^7.1.1", - "array-union": "^2.1.0", - "dir-glob": "^3.0.1", - "fast-glob": "^3.0.3", - "glob": "^7.1.3", - "ignore": "^5.1.1", - "merge2": "^1.2.3", - "slash": "^3.0.0" - } - }, - "graceful-fs": { - "version": "4.2.4", - "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.4.tgz", - "integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw==", - "dev": true - }, - "ignore": { - "version": "5.1.8", - "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.8.tgz", - "integrity": "sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw==", - "dev": true - }, - "rimraf": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", - "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", - "dev": true, - "requires": { - "glob": "^7.1.3" - } - } - } - }, "delayed-stream": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz", @@ -5582,7 +5494,6 @@ "version": "3.0.1", "resolved": "https://registry.npmjs.org/dir-glob/-/dir-glob-3.0.1.tgz", "integrity": "sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==", - "dev": true, "requires": { "path-type": "^4.0.0" }, @@ -5590,8 +5501,7 @@ "path-type": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/path-type/-/path-type-4.0.0.tgz", - "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==", - "dev": true + "integrity": "sha512-gDKb8aZMDeD/tZWs9P6+q0J9Mwkdl6xMV8TjnGP3qJVJ06bdMgkbBlLU8IdfOsIsFz2BW1rNVT3XuNEl8zPAvw==" } } }, @@ -5663,8 +5573,7 @@ "domready": { "version": "1.0.8", "resolved": "https://registry.npmjs.org/domready/-/domready-1.0.8.tgz", - "integrity": "sha1-kfJS5Ze2Wvd+dFriTdAYXV4m1Yw=", - "dev": true + "integrity": "sha1-kfJS5Ze2Wvd+dFriTdAYXV4m1Yw=" }, "domutils": { "version": "1.7.0", @@ -5770,17 +5679,10 @@ "integrity": "sha512-0JZEDKOQAE05EO/4rk3vLAE+PYFI9OLCVLAS4QAq1y+Bb2y1N6MyQJz62ynzHN/y0Ka/nO5jVJcahbCEdfiXLQ==", "dev": true }, - "elem-dataset": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/elem-dataset/-/elem-dataset-2.0.0.tgz", - "integrity": "sha512-e7gieGopWw5dMdEgythH3lUS7nMizutPDTtkzfQW/q2gCvFnACyNnK3ytCncAXKxdBXQWcXeKaYTTODiMnp8mw==", - "dev": true - }, "element-closest": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/element-closest/-/element-closest-2.0.2.tgz", - "integrity": "sha1-cqdAoQdFM4LijfnOXbtajfD5Zuw=", - "dev": true + "integrity": "sha1-cqdAoQdFM4LijfnOXbtajfD5Zuw=" }, "elliptic": { "version": "6.5.3", @@ -6884,7 +6786,6 @@ "version": "3.2.4", "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.4.tgz", "integrity": "sha512-kr/Oo6PX51265qeuCYsyGypiO5uJFgBS0jksyG7FUeCyQzNwYnzrNIMR1NXfkZXsMYXYLRAHgISHBz8gQcxKHQ==", - "dev": true, "requires": { "@nodelib/fs.stat": "^2.0.2", "@nodelib/fs.walk": "^1.2.3", @@ -6898,7 +6799,6 @@ "version": "3.0.2", "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz", "integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==", - "dev": true, "requires": { "fill-range": "^7.0.1" } @@ -6907,7 +6807,6 @@ "version": "7.0.1", "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz", "integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==", - "dev": true, "requires": { "to-regex-range": "^5.0.1" } @@ -6916,7 +6815,6 @@ "version": "5.1.1", "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.1.tgz", "integrity": "sha512-FnI+VGOpnlGHWZxthPGR+QhR78fuiK0sNLkHQv+bL9fQi57lNNdquIbna/WrfROrolq8GK5Ek6BiMwqL/voRYQ==", - "dev": true, "requires": { "is-glob": "^4.0.1" } @@ -6924,14 +6822,12 @@ "is-number": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", - "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==", - "dev": true + "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==" }, "micromatch": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.2.tgz", "integrity": "sha512-y7FpHSbMUMoyPbYUSzO6PaZ6FyRnQOpHuKwbo1G+Knck95XVU4QAiKdGEnj5wwoS7PlOgthX/09u5iFJ+aYf5Q==", - "dev": true, "requires": { "braces": "^3.0.1", "picomatch": "^2.0.5" @@ -6941,7 +6837,6 @@ "version": "5.0.1", "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==", - "dev": true, "requires": { "is-number": "^7.0.0" } @@ -6985,7 +6880,6 @@ "version": "1.8.0", "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.8.0.tgz", "integrity": "sha512-SMIZoZdLh/fgofivvIkmknUXyPnvxRE3DhtZ5Me3Mrsk5gyPL42F0xr51TdRXskBxHfMp+07bcYzfsYEsSQA9Q==", - "dev": true, "requires": { "reusify": "^1.0.4" } @@ -7307,8 +7201,7 @@ "fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", - "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=", - "dev": true + "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=" }, "fsevents": { "version": "2.1.3", @@ -7954,6 +7847,32 @@ } } }, + "gulp-babel": { + "version": "8.0.0", + "resolved": "https://registry.npmjs.org/gulp-babel/-/gulp-babel-8.0.0.tgz", + "integrity": "sha512-oomaIqDXxFkg7lbpBou/gnUkX51/Y/M2ZfSjL2hdqXTAlSWZcgZtd2o0cOH0r/eE8LWD0+Q/PsLsr2DKOoqToQ==", + "dev": true, + "requires": { + "plugin-error": "^1.0.1", + "replace-ext": "^1.0.0", + "through2": "^2.0.0", + "vinyl-sourcemaps-apply": "^0.2.0" + }, + "dependencies": { + "plugin-error": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/plugin-error/-/plugin-error-1.0.1.tgz", + "integrity": "sha512-L1zP0dk7vGweZME2i+EeakvUNqSrdiI3F91TwEoYiGrAfUXmVv6fJIq4g82PAXxNsWOp0J7ZqQy/3Szz0ajTxA==", + "dev": true, + "requires": { + "ansi-colors": "^1.0.1", + "arr-diff": "^4.0.0", + "arr-union": "^3.1.0", + "extend-shallow": "^3.0.2" + } + } + } + }, "gulp-eslint": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/gulp-eslint/-/gulp-eslint-6.0.0.tgz", @@ -9094,7 +9013,6 @@ "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=", - "dev": true, "requires": { "once": "^1.3.0", "wrappy": "1" @@ -9103,8 +9021,7 @@ "inherits": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz", - "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=", - "dev": true + "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=" }, "ini": { "version": "1.3.5", @@ -9469,8 +9386,7 @@ "is-extglob": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", - "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=", - "dev": true + "integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=" }, "is-finite": { "version": "1.1.0", @@ -9503,7 +9419,6 @@ "version": "4.0.1", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.1.tgz", "integrity": "sha512-5G0tKtBTFImOqDnLB2hG6Bp2qcKEFduo4tZu9MT/H6NQv/ghhy30o55ufafxJ/LdH79LLs2Kfrn85TLKyA7BUg==", - "dev": true, "requires": { "is-extglob": "^2.1.1" } @@ -9552,18 +9467,6 @@ "integrity": "sha1-PkcprB9f3gJc19g6iW2rn09n2w8=", "dev": true }, - "is-path-cwd": { - "version": "2.2.0", - "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz", - "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==", - "dev": true - }, - "is-path-inside": { - "version": "3.0.2", - "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.2.tgz", - "integrity": "sha512-/2UGPSgmtqwo1ktx8NDHjuPwZWmHhO+gj0f93EkhLB5RgW9RZevWYYlIkS6zePc6U2WpOdQYIwHe9YC4DWEBVg==", - "dev": true - }, "is-plain-obj": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz", @@ -12242,8 +12145,7 @@ "keyboardevent-key-polyfill": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/keyboardevent-key-polyfill/-/keyboardevent-key-polyfill-1.1.0.tgz", - "integrity": "sha1-ijGdjkWhMXL8pWKGNy+QwdTHAUw=", - "dev": true + "integrity": "sha1-ijGdjkWhMXL8pWKGNy+QwdTHAUw=" }, "kind-of": { "version": "6.0.3", @@ -12420,8 +12322,7 @@ "lodash.debounce": { "version": "4.0.8", "resolved": "https://registry.npmjs.org/lodash.debounce/-/lodash.debounce-4.0.8.tgz", - "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168=", - "dev": true + "integrity": "sha1-gteb/zCmfEAF/9XiUVMArZyk168=" }, "lodash.memoize": { "version": "4.1.2", @@ -12679,8 +12580,7 @@ "matches-selector": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/matches-selector/-/matches-selector-1.2.0.tgz", - "integrity": "sha512-c4vLwYWyl+Ji+U43eU/G5FwxWd4ZH0ePUsFs5y0uwD9HUEFBXUQ1zUUan+78IpRD+y4pUfG0nAzNM292K7ItvA==", - "dev": true + "integrity": "sha512-c4vLwYWyl+Ji+U43eU/G5FwxWd4ZH0ePUsFs5y0uwD9HUEFBXUQ1zUUan+78IpRD+y4pUfG0nAzNM292K7ItvA==" }, "mathml-tag-names": { "version": "2.1.3", @@ -12787,8 +12687,7 @@ "merge2": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz", - "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==", - "dev": true + "integrity": "sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==" }, "micromatch": { "version": "3.1.10", @@ -12878,7 +12777,6 @@ "version": "3.0.4", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz", "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==", - "dev": true, "requires": { "brace-expansion": "^1.1.7" } @@ -13355,8 +13253,7 @@ "object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", - "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", - "dev": true + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=" }, "object-copy": { "version": "0.1.0", @@ -13599,7 +13496,6 @@ "version": "1.4.0", "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=", - "dev": true, "requires": { "wrappy": "1" } @@ -13707,7 +13603,6 @@ "version": "3.0.0", "resolved": "https://registry.npmjs.org/p-map/-/p-map-3.0.0.tgz", "integrity": "sha512-d3qXVTF/s+W+CdJ5A29wywV2n8CQQYahlgz2bFiA+4eVNJbHJodPZ+/gXwPGh0bOqA+j8S+6+ckmvLGPk1QpxQ==", - "dev": true, "requires": { "aggregate-error": "^3.0.0" } @@ -14060,8 +13955,7 @@ "path-is-absolute": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", - "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", - "dev": true + "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=" }, "path-is-inside": { "version": "1.0.2", @@ -14147,8 +14041,7 @@ "picomatch": { "version": "2.2.2", "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.2.2.tgz", - "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==", - "dev": true + "integrity": "sha512-q0M/9eZHzmr0AulXyPwNfZjtwZ/RBZlbN3K3CErVrk50T2ASYI7Bye0EvekFY3IP1Nt2DHu0re+V2ZHIpMkuWg==" }, "pify": { "version": "2.3.0", @@ -16123,7 +16016,6 @@ "version": "1.0.0", "resolved": "https://registry.npmjs.org/receptor/-/receptor-1.0.0.tgz", "integrity": "sha1-v1RHfgOH5Evr84VRILvaWt6gj4s=", - "dev": true, "requires": { "element-closest": "^2.0.1", "keyboardevent-key-polyfill": "^1.0.2", @@ -16536,8 +16428,7 @@ "resolve-id-refs": { "version": "0.1.0", "resolved": "https://registry.npmjs.org/resolve-id-refs/-/resolve-id-refs-0.1.0.tgz", - "integrity": "sha1-MSZiS4h0idqPwK6IljL4QTrGw+w=", - "dev": true + "integrity": "sha1-MSZiS4h0idqPwK6IljL4QTrGw+w=" }, "resolve-options": { "version": "1.1.0", @@ -16573,8 +16464,7 @@ "reusify": { "version": "1.0.4", "resolved": "https://registry.npmjs.org/reusify/-/reusify-1.0.4.tgz", - "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==", - "dev": true + "integrity": "sha512-U9nH88a3fc/ekCF1l0/UP1IosiuIjyTh7hBvXVMHYgVcfGvt897Xguj2UOLDeI5BG2m7/uwyaLVT6fbtCwTyzw==" }, "rgb-regex": { "version": "1.0.1", @@ -16638,8 +16528,7 @@ "run-parallel": { "version": "1.1.9", "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.1.9.tgz", - "integrity": "sha512-DEqnSRTDw/Tc3FXf49zedI638Z9onwUotBMiUFKmrO2sdFKIbXamXGQ3Axd4qgphxKB4kw/qP1w5kTxnfU1B9Q==", - "dev": true + "integrity": "sha512-DEqnSRTDw/Tc3FXf49zedI638Z9onwUotBMiUFKmrO2sdFKIbXamXGQ3Axd4qgphxKB4kw/qP1w5kTxnfU1B9Q==" }, "rx": { "version": "4.1.0", @@ -16989,8 +16878,7 @@ "slash": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/slash/-/slash-3.0.0.tgz", - "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==", - "dev": true + "integrity": "sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==" }, "slice-ansi": { "version": "2.1.0", @@ -19684,7 +19572,6 @@ "version": "2.9.0", "resolved": "https://registry.npmjs.org/uswds/-/uswds-2.9.0.tgz", "integrity": "sha512-5IMVgMCUUlgWVFrB7Wf1qTvv5L3oDDlSsAgvJ02+/sV2uh4JzO9YPm3493RTaMuHTc+feRCuYyEIloXsEQY0Pg==", - "dev": true, "requires": { "classlist-polyfill": "^1.0.3", "del": "^5.1.0", @@ -19694,6 +19581,89 @@ "object-assign": "^4.1.1", "receptor": "^1.0.0", "resolve-id-refs": "^0.1.0" + }, + "dependencies": { + "array-union": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz", + "integrity": "sha512-HGyxoOTYUyCM6stUe6EJgnd4EoewAI7zMdfqO+kGjnlZmBDz/cR5pf8r/cR4Wq60sL/p0IkcjUEEPwS3GFrIyw==" + }, + "del": { + "version": "5.1.0", + "resolved": "https://registry.npmjs.org/del/-/del-5.1.0.tgz", + "integrity": "sha512-wH9xOVHnczo9jN2IW68BabcecVPxacIA3g/7z6vhSU/4stOKQzeCRK0yD0A24WiAAUJmmVpWqrERcTxnLo3AnA==", + "requires": { + "globby": "^10.0.1", + "graceful-fs": "^4.2.2", + "is-glob": "^4.0.1", + "is-path-cwd": "^2.2.0", + "is-path-inside": "^3.0.1", + "p-map": "^3.0.0", + "rimraf": "^3.0.0", + "slash": "^3.0.0" + } + }, + "elem-dataset": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/elem-dataset/-/elem-dataset-2.0.0.tgz", + "integrity": "sha512-e7gieGopWw5dMdEgythH3lUS7nMizutPDTtkzfQW/q2gCvFnACyNnK3ytCncAXKxdBXQWcXeKaYTTODiMnp8mw==" + }, + "glob": { + "version": "7.1.6", + "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.6.tgz", + "integrity": "sha512-LwaxwyZ72Lk7vZINtNNrywX0ZuLyStrdDtabefZKAY5ZGJhVtgdznluResxNmPitE0SAO+O26sWTHeKSI2wMBA==", + "requires": { + "fs.realpath": "^1.0.0", + "inflight": "^1.0.4", + "inherits": "2", + "minimatch": "^3.0.4", + "once": "^1.3.0", + "path-is-absolute": "^1.0.0" + } + }, + "globby": { + "version": "10.0.2", + "resolved": "https://registry.npmjs.org/globby/-/globby-10.0.2.tgz", + "integrity": "sha512-7dUi7RvCoT/xast/o/dLN53oqND4yk0nsHkhRgn9w65C4PofCLOoJ39iSOg+qVDdWQPIEj+eszMHQ+aLVwwQSg==", + "requires": { + "@types/glob": "^7.1.1", + "array-union": "^2.1.0", + "dir-glob": "^3.0.1", + "fast-glob": "^3.0.3", + "glob": "^7.1.3", + "ignore": "^5.1.1", + "merge2": "^1.2.3", + "slash": "^3.0.0" + } + }, + "graceful-fs": { + "version": "4.2.4", + "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.4.tgz", + "integrity": "sha512-WjKPNJF79dtJAVniUlGGWHYGz2jWxT6VhN/4m1NdkbZ2nOsEF+cI1Edgql5zCRhs/VsQYRvrXctxktVXZUkixw==" + }, + "ignore": { + "version": "5.1.8", + "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.1.8.tgz", + "integrity": "sha512-BMpfD7PpiETpBl/A6S498BaIJ6Y/ABT93ETbby2fP00v4EbvPBXWEoaR1UBPKs3iR53pJY7EtZk5KACI57i1Uw==" + }, + "is-path-cwd": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz", + "integrity": "sha512-w942bTcih8fdJPJmQHFzkS76NEP8Kzzvmw92cXsazb8intwLqPibPPdXf4ANdKV3rYMuuQYGIWtvz9JilB3NFQ==" + }, + "is-path-inside": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/is-path-inside/-/is-path-inside-3.0.2.tgz", + "integrity": "sha512-/2UGPSgmtqwo1ktx8NDHjuPwZWmHhO+gj0f93EkhLB5RgW9RZevWYYlIkS6zePc6U2WpOdQYIwHe9YC4DWEBVg==" + }, + "rimraf": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-3.0.2.tgz", + "integrity": "sha512-JZkJMZkAGFFPP2YqXZXPbMlMBgsxzE8ILs4lMIX/2o0L9UBw9O/Y3o6wFw/i9YLapcUJWwqbi3kdxIPdC62TIA==", + "requires": { + "glob": "^7.1.3" + } + } } }, "uswds-gulp": { @@ -20256,8 +20226,7 @@ "wrappy": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", - "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=", - "dev": true + "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=" }, "write": { "version": "1.0.3", diff --git a/package.json b/package.json index f099d23e..a54d8010 100644 --- a/package.json +++ b/package.json @@ -2,10 +2,17 @@ "name": "identity-style-guide", "version": "2.2.3", "description": "The global style of login.gov", - "main": "dist/assets/js/main.js", + "main": "./build/cjs/index.js", + "module": "./build/esm/index.js", + "exports": { + "require": "./build/cjs/index.js", + "import": "./build/esm/index.js" + }, + "sideEffects": false, "scripts": { "start": "make start", "clean": "make clean", + "prelint": "make build-package", "lint": "gulp lint", "test": "make test", "test-pa11y": "make test-runner-pa11y", @@ -13,9 +20,10 @@ "build": "make build", "federalist": "npm install && make build-assets", "prepare": "make install-jekyll", - "prepublishOnly": "make lint && make clean && make build-assets" + "prepublishOnly": "make lint && make clean && make build-assets build-package" }, "files": [ + "build", "dist/assets/**/*" ], "repository": { @@ -33,6 +41,7 @@ }, "homepage": "https://github.com/18F/identity-style-guide#readme", "dependencies": { + "uswds": "^2.9.0", "zxcvbn": "^4.4.2" }, "devDependencies": { @@ -50,6 +59,7 @@ "eslint-plugin-prettier": "^3.1.4", "get-port-cli": "^2.0.0", "gulp": "^4.0.2", + "gulp-babel": "^8.0.0", "gulp-eslint": "^6.0.0", "gulp-if": "^3.0.0", "gulp-notify": "^3.2.0", @@ -74,7 +84,6 @@ "serve": "^11.3.2", "stylelint": "^13.7.2", "stylelint-scss": "^3.18.0", - "uswds": "^2.9.0", "uswds-gulp": "github:uswds/uswds-gulp", "vinyl-buffer": "^1.0.1", "vinyl-source-stream": "^2.0.0", diff --git a/src/js/auto.js b/src/js/auto.js new file mode 100644 index 00000000..e4fb6c7c --- /dev/null +++ b/src/js/auto.js @@ -0,0 +1,12 @@ +import 'uswds/src/js/polyfills'; +import domready from 'domready'; +import * as components from './components'; +import './components/dropdownButton'; + +domready(() => { + const target = document.body; + Object.keys(components).forEach((key) => { + const behavior = components[key]; + behavior.on(target); + }); +}); diff --git a/src/js/components/accordionCloseButton.js b/src/js/components/accordionCloseButton.js index 082d2789..6263d63c 100644 --- a/src/js/components/accordionCloseButton.js +++ b/src/js/components/accordionCloseButton.js @@ -1,5 +1,5 @@ -const accordion = require('uswds/src/js/components/accordion'); -const behavior = require('uswds/src/js/utils/behavior'); +import accordion from 'uswds/src/js/components/accordion'; +import behavior from 'uswds/src/js/utils/behavior'; const accordionCloseButton = behavior({ click: { @@ -11,4 +11,4 @@ const accordionCloseButton = behavior({ }, }); -module.exports = accordionCloseButton; +export default accordionCloseButton; diff --git a/src/js/components/index.js b/src/js/components/index.js new file mode 100644 index 00000000..ea250a2e --- /dev/null +++ b/src/js/components/index.js @@ -0,0 +1,41 @@ +import accordion from 'uswds/src/js/components/accordion'; +import banner from 'uswds/src/js/components/banner'; +import characterCount from 'uswds/src/js/components/character-count'; +import comboBox from 'uswds/src/js/components/combo-box'; +import datePicker from 'uswds/src/js/components/date-picker'; +import dateRangePicker from 'uswds/src/js/components/date-range-picker'; +import fileInput from 'uswds/src/js/components/file-input'; +import footer from 'uswds/src/js/components/footer'; +import navigation from 'uswds/src/js/components/navigation'; +import password from 'uswds/src/js/components/password'; +import search from 'uswds/src/js/components/search'; +import skipnav from 'uswds/src/js/components/skipnav'; +import timePicker from 'uswds/src/js/components/time-picker'; +import tooltip from 'uswds/src/js/components/tooltip'; +import validator from 'uswds/src/js/components/validator'; +import accordionCloseButton from './accordionCloseButton'; +import dropdownButton from './dropdownButton'; +import inputPasswordMeter from './inputPasswordStrength'; +import invokeSpinner from './invokeSpinner'; + +export { + accordion, + banner, + characterCount, + comboBox, + datePicker, + dateRangePicker, + fileInput, + footer, + navigation, + password, + search, + skipnav, + timePicker, + tooltip, + validator, + accordionCloseButton, + dropdownButton, + inputPasswordMeter, + invokeSpinner, +}; diff --git a/src/js/components/inputPasswordStrength.js b/src/js/components/inputPasswordStrength.js index a89cabed..0b3fca74 100644 --- a/src/js/components/inputPasswordStrength.js +++ b/src/js/components/inputPasswordStrength.js @@ -1,6 +1,6 @@ /* eslint-disable prefer-destructuring */ -const behavior = require('uswds/src/js/utils/behavior'); -const zxcvbn = require('zxcvbn'); +import behavior from 'uswds/src/js/utils/behavior'; +import zxcvbn from 'zxcvbn'; // zxcvbn returns a strength score from 0 to 4 // we map those scores to: @@ -92,4 +92,4 @@ const inputPasswordMeter = behavior({ }, }); -module.exports = inputPasswordMeter; +export default inputPasswordMeter; diff --git a/src/js/components/invokeSpinner.js b/src/js/components/invokeSpinner.js index 764bbe42..b9dd8d3b 100644 --- a/src/js/components/invokeSpinner.js +++ b/src/js/components/invokeSpinner.js @@ -1,4 +1,4 @@ -const behavior = require('uswds/src/js/utils/behavior'); +import behavior from 'uswds/src/js/utils/behavior'; const HIDDEN_CLASS = 'lg-spinner--hidden'; const COLLAPSED_SPINNER = 'usa-button__lg-invokeSpinner--hidden'; @@ -13,4 +13,4 @@ const invokeSpinner = behavior({ }, }); -module.exports = invokeSpinner; +export default invokeSpinner; diff --git a/src/js/index.js b/src/js/index.js new file mode 100644 index 00000000..07635cbb --- /dev/null +++ b/src/js/index.js @@ -0,0 +1 @@ +export * from './components'; diff --git a/src/js/main.js b/src/js/main.js deleted file mode 100644 index 42366cd8..00000000 --- a/src/js/main.js +++ /dev/null @@ -1,29 +0,0 @@ -const domready = require('domready'); - -/** - * The 'polyfills' define key ECMAScript 5 methods that may be missing from - * older browsers, so must be loaded first. - */ -require('uswds/src/js/polyfills'); - -const uswds = require('uswds/src/js/config'); - -const components = require('uswds/src/js/components'); - -// login.gov additions -components.accordionCloseButton = require('./components/accordionCloseButton'); -components.inputPasswordMeter = require('./components/inputPasswordStrength'); -components.invokeSpinner = require('./components/invokeSpinner'); -components.dropdownButton = require('./components/dropdownButton'); - -uswds.components = components; - -domready(() => { - const target = document.body; - Object.keys(components).forEach((key) => { - const behavior = components[key]; - behavior.on(target); - }); -}); - -module.exports = uswds; diff --git a/test/components/index.test.js b/test/components/index.test.js new file mode 100644 index 00000000..c63e36c2 --- /dev/null +++ b/test/components/index.test.js @@ -0,0 +1,13 @@ +/** + * @jest-environment jsdom + */ + +const uswdsComponents = require('uswds/src/js/components'); +const localComponents = require('../..'); + +test('re-exports all uswds components', () => { + const localComponentKeys = Object.keys(localComponents); + const uswdsComponentKeys = Object.keys(uswdsComponents); + + expect(localComponentKeys).toEqual(expect.arrayContaining(uswdsComponentKeys)); +});