{"_id":"uswds","_rev":"126-14c5b95b24fd297f6c67a33b87e1d512","name":"uswds","time":{"modified":"2023-04-07T21:55:54.259Z","created":"2016-03-08T21:25:50.736Z","0.8.3":"2016-03-08T21:25:50.736Z","0.8.4":"2016-03-08T21:34:31.789Z","0.8.5":"2016-03-08T21:48:26.757Z","0.9.0":"2016-03-14T18:22:00.446Z","0.9.1":"2016-03-29T16:40:13.611Z","0.9.2":"2016-05-17T14:20:38.570Z","0.9.3":"2016-06-01T19:03:16.567Z","0.9.4":"2016-06-09T18:30:05.781Z","0.9.5":"2016-07-07T18:34:01.228Z","0.9.6":"2016-07-14T17:54:15.691Z","0.10.0":"2016-07-21T19:15:19.656Z","0.11.0":"2016-08-04T15:48:48.608Z","0.11.1":"2016-08-18T17:43:16.821Z","0.12.0":"2016-09-01T19:24:30.197Z","0.12.1":"2016-09-09T21:09:32.125Z","0.13.0":"2016-10-06T20:06:05.352Z","0.13.1":"2016-10-06T20:46:38.231Z","0.13.2":"2016-11-17T16:25:46.330Z","0.13.3":"2016-12-01T19:19:31.891Z","0.14.0":"2016-12-15T22:14:46.113Z","1.0.0-pre":"2017-02-23T18:47:05.472Z","1.0.0":"2017-02-23T19:00:50.150Z","1.1.0-pre":"2017-04-17T21:04:11.043Z","1.1.0":"2017-04-26T17:20:54.144Z","1.2.0-pre":"2017-05-24T21:35:15.706Z","1.2.0-rc1":"2017-05-24T22:33:43.209Z","1.2.0":"2017-06-06T14:49:24.211Z","1.2.1":"2017-06-07T16:59:52.393Z","1.3.0":"2017-07-21T20:11:32.480Z","1.3.1":"2017-08-22T22:33:34.694Z","1.4.0":"2017-09-29T21:34:46.533Z","1.4.1":"2017-10-06T22:04:17.597Z","1.4.2":"2017-11-02T21:30:22.078Z","1.4.3":"2017-11-20T19:37:30.476Z","1.4.4":"2017-12-18T19:27:39.661Z","1.4.5":"2018-01-23T20:05:35.257Z","1.4.6":"2018-02-12T19:23:33.341Z","1.5.0":"2018-02-26T22:39:57.215Z","1.6.0":"2018-03-12T17:57:25.030Z","1.6.1":"2018-03-26T17:21:00.911Z","1.6.2":"2018-04-23T18:02:01.005Z","1.6.3":"2018-05-07T17:57:45.529Z","1.6.4":"2018-06-04T16:51:11.972Z","1.6.6":"2018-06-13T18:40:51.800Z","2.0.0-alpha":"2018-07-16T18:07:19.765Z","2.0.0-alpha.1":"2018-07-18T17:10:48.259Z","1.6.7":"2018-07-23T17:39:52.653Z","1.6.8":"2018-08-06T17:17:46.802Z","2.0.0-alpha.2":"2018-08-20T17:44:58.607Z","2.0.0-alpha.3":"2018-09-04T20:48:00.542Z","2.0.0-beta":"2018-09-27T21:23:18.883Z","1.6.9":"2018-10-15T17:39:45.483Z","2.0.0-beta.2":"2018-10-15T18:17:13.064Z","2.0.0-beta.3":"2018-10-29T18:45:39.824Z","2.0.0-beta.4":"2018-11-14T21:48:08.823Z","2.0.0-beta.5":"2019-02-20T19:12:38.066Z","2.0.0-beta.6":"2019-03-11T17:19:52.018Z","2.0.0-beta.7":"2019-03-25T17:15:46.480Z","1.6.10":"2019-03-25T22:05:08.811Z","1.6.11":"2019-03-26T19:38:20.023Z","1.6.12":"2019-03-27T01:20:56.877Z","2.0.0":"2019-04-04T20:22:48.673Z","2.0.1":"2019-04-05T21:35:35.355Z","2.0.2":"2019-05-08T16:10:32.147Z","2.0.3":"2019-06-07T17:05:29.823Z","2.1.0":"2019-08-14T21:44:09.344Z","2.2.0":"2019-09-19T05:53:49.593Z","2.2.1":"2019-09-23T18:53:36.917Z","2.3.0":"2019-11-20T21:58:34.029Z","2.3.1":"2019-11-21T00:26:41.536Z","1.6.13":"2019-11-26T12:57:16.456Z","2.4.0":"2019-12-18T22:48:23.589Z","2.5.0":"2020-02-14T18:30:46.704Z","2.5.1":"2020-03-03T22:12:29.725Z","2.6.0":"2020-03-18T20:37:12.257Z","2.7.0":"2020-05-11T21:16:35.634Z","2.7.1":"2020-06-17T18:54:30.534Z","2.8.0":"2020-07-09T21:40:59.757Z","2.8.1":"2020-08-17T15:18:42.184Z","2.9.0":"2020-09-22T14:43:17.961Z","2.10.0-alpha.0":"2020-09-23T18:16:06.011Z","2.10.0-beta.0":"2020-09-28T17:31:48.101Z","2.10.0":"2020-12-17T17:25:03.449Z","2.10.1":"2021-02-19T22:11:09.850Z","2.10.2":"2021-03-03T22:31:26.282Z","2.10.3":"2021-03-15T18:21:59.760Z","2.11.0":"2021-03-17T21:17:04.314Z","2.11.1":"2021-03-17T22:33:55.294Z","2.11.2":"2021-04-28T17:11:55.262Z","1.6.14":"2021-06-14T17:42:36.844Z","2.12.0":"2021-06-16T21:49:18.504Z","2.14.0-beta.1":"2021-07-09T21:41:40.931Z","2.12.1":"2021-08-18T20:53:04.820Z","2.12.2":"2021-11-01T21:47:16.230Z","3.0.0-beta.1":"2021-11-04T21:01:58.381Z","2.13.0":"2021-12-14T21:32:15.997Z","3.0.0-beta.2":"2022-01-07T21:28:26.168Z","2.13.1":"2022-01-20T17:18:19.256Z","2.13.2":"2022-03-07T19:36:05.827Z","3.0.0-beta.3":"2022-03-08T17:16:14.344Z","2.13.3":"2022-04-11T21:48:06.305Z","2.14.0":"2023-04-07T21:37:28.518Z"},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"dist-tags":{"latest":"2.14.0","dev":"1.2.0","alpha":"2.10.0-alpha.0","beta":"3.0.0-beta.3","uswds-1.x":"1.6.14"},"description":"Open source UI components and visual style guide for U.S. government websites","readme":"","versions":{"0.8.4":{"name":"uswds","version":"0.8.4","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"gulp no-gem build"},"assets":"assets/","style":"assets/_scss/all.scss","repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4"},"devDependencies":{"browserify":"^13.0.0","gulp":"^3.9.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-rename":"^1.2.2","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","merge-stream":"^1.0.0","minimist":"^1.2.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"fe39da2282ac3d77864265ed650e957d776879b4","_id":"uswds@0.8.4","_shasum":"992ce7086a46ff57794ff7cd9f17f30b6d92090a","_from":".","_npmVersion":"3.3.12","_nodeVersion":"5.5.0","_npmUser":{"name":"rogeruiz","email":"hi@rog.gr"},"maintainers":[{"name":"rogeruiz","email":"hi@rog.gr"}],"dist":{"shasum":"992ce7086a46ff57794ff7cd9f17f30b6d92090a","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.8.4.tgz","integrity":"sha512-NdYU420JSPZAIIjaYyiTiEI3ZPeMnz9OX7dI32KINJPIWHSxxamLKK5A00B6m2BQ3/pDuySaBn+ZCBHbwK4rBg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIH0iRrN5ocIgdrEkIgTHV2r0FcbWWpEQwyYSWYZO1WGkAiAPs5Zw6IxDgwHsEbcySliKjcvXQUwHsHEkbtxsAmOU+w=="}]},"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.8.4.tgz_1457472865871_0.9508750501554459"},"directories":{}},"0.8.5":{"name":"uswds","version":"0.8.5","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"gulp no-gem build"},"assets":"assets/","style":"assets/_scss/all.scss","repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4"},"devDependencies":{"browserify":"^13.0.0","gulp":"^3.9.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-rename":"^1.2.2","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","merge-stream":"^1.0.0","minimist":"^1.2.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"fe39da2282ac3d77864265ed650e957d776879b4","_id":"uswds@0.8.5","_shasum":"4df4609869472c9316d593be60c4de31a9912339","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"msecret","email":"msegreto@miceover.com"},"dist":{"shasum":"4df4609869472c9316d593be60c4de31a9912339","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.8.5.tgz","integrity":"sha512-AoICzt7PfU6xFNw6YNtiFRKZUdiovpoIphLgl7dI73XZX7siF0NFRKJZ7sQnIEvN1NZon7uK8ZqWBNXRNmjDUw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIF0YnvwygOjicGUTtGh5tGxskpzarCROy9lQUaUK7FICAiBtmdJR4+v0ONGmkZhgWY48CRTz+1W2HrdYZiO8lnFQAA=="}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.8.5.tgz_1457473700911_0.5440687623340636"},"directories":{}},"0.9.0":{"name":"uswds","version":"0.9.0","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp build","start":"gulp website:serve","build":"gulp release","test":"gulp eslint scss-lint","preversion":"npm test","version":"npm run prepublish","deploy":"gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-rename":"^1.2.2","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","merge-stream":"^1.0.0","minimist":"^1.2.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"f2216ae8e555c269f520f32fc34410ad4d77e167","_id":"uswds@0.9.0","_shasum":"8a0f11226e5e91dd05bbdfb77759bc66c5c2c6e6","_from":".","_npmVersion":"2.7.5","_nodeVersion":"0.12.2","_npmUser":{"name":"mbenari","email":"hello@maya-benari.com"},"dist":{"shasum":"8a0f11226e5e91dd05bbdfb77759bc66c5c2c6e6","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.9.0.tgz","integrity":"sha512-CUTf3Vnj9l7wr3XRHwmT3YZbfaMQFOfGEqVne2YtXG+XBoHjtQnZUHjp4eL6vRJonmqPvXy97MXu5+tJdFNLTQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCaJacXS4gnVq7QhCh5P8RviWpkYbhVSHn6zM9dtLaZWgIhANymz9p5z/bYW1GIG+2A6ps0YbahoxfL3yPDeiIVZmtK"}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.9.0.tgz_1457979720007_0.8345948387868702"},"directories":{}},"0.9.1":{"name":"uswds","version":"0.9.1","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint","preversion":"npm test","version":"npm run prepublish","deploy":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-rename":"^1.2.2","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","merge-stream":"^1.0.0","minimist":"^1.2.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"178e5537d0bd8be6ddb989d6918e775648ec22f9","_id":"uswds@0.9.1","_shasum":"81b2b91667e449497d7c7f7ec7cac26e51bbd3b1","_from":".","_npmVersion":"3.7.3","_nodeVersion":"5.8.0","_npmUser":{"name":"rogeruiz","email":"hi@rog.gr"},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"dist":{"shasum":"81b2b91667e449497d7c7f7ec7cac26e51bbd3b1","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.9.1.tgz","integrity":"sha512-BWN1O3sUijGEdqzksDhyD2ef9W1p4sSUQvZ/N2k77gaXPr2RhOMWUop+jsxnZ5wMBvXgZ1QWeYh4ppg02IqpXg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCZArA4+Ry7cpVUw+DF7W576yRqvnJ9Mb9a8hsWraTT2AIgDuGbXDjKuAenYIt8qE/yrcpGs96rgRa6mKZrYClzn+E="}]},"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.9.1.tgz_1459269610669_0.15216712304390967"},"directories":{}},"0.9.2":{"name":"uswds","version":"0.9.2","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint","preversion":"npm test","version":"npm run prepublish","deploy":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-rename":"^1.2.2","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","merge-stream":"^1.0.0","minimist":"^1.2.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"015ce01e5c801c38b14253ebcacc8dfda230145b","_id":"uswds@0.9.2","_shasum":"f99eef881a869015a8ff8e2974849c245ce1b6a3","_from":".","_npmVersion":"3.8.8","_nodeVersion":"5.11.0","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"f99eef881a869015a8ff8e2974849c245ce1b6a3","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.9.2.tgz","integrity":"sha512-rldpk/T5k4FleAk4SCUtwNRZj5KfHHfd5Iep5YlpxdH2mfHYV3R2iJJ8+zqO8oAzWy+Y6Dz03S4yku+BOLQljQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAQQHe1yZH3D3saXvXOla3VAVCGgPbzxOM0rD+NFWDHYAiEAu1YP+/Mbk710GBZlCztC96b9lWsgqisK340lqsI3J68="}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.9.2.tgz_1463494835557_0.7753910352475941"},"directories":{}},"0.9.3":{"name":"uswds","version":"0.9.3","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"a943c23beeb2a63e6ad16d13bf4ef38bd3ab0872","_id":"uswds@0.9.3","_shasum":"68d847cc6ea0c3808685481e3e514ea9cb1329d7","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"68d847cc6ea0c3808685481e3e514ea9cb1329d7","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.9.3.tgz","integrity":"sha512-2SbVdmPdTHM6ObXfshlBQcU0DGxGhrDfYQkS/cVBrLxUXyckiqLPgaN6YIkO+zACFU609tcl1Kr6GpHPdFQO4w==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQColoERaFoSEDhPHiTzG+k1S2g4AvNNPywRuWV8gQ+OEQIhAJbUGGA0hWqGNGPxc/H8yIp7BdAQnvBebcw9XTAgx8YB"}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-16-east.internal.npmjs.com","tmp":"tmp/uswds-0.9.3.tgz_1464807795089_0.8323089459445328"},"directories":{}},"0.9.4":{"name":"uswds","version":"0.9.4","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"a50298e7695828db38e7386632b9541e0ac6eb4a","_id":"uswds@0.9.4","_shasum":"29d6e790193d278eca5a27abf27e64884c0506c8","_from":".","_npmVersion":"3.7.3","_nodeVersion":"5.8.0","_npmUser":{"name":"rogeruiz","email":"hi@rog.gr"},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"dist":{"shasum":"29d6e790193d278eca5a27abf27e64884c0506c8","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.9.4.tgz","integrity":"sha512-kZQ3EwzvMPZDEGQFPfzmy9z2cmS2yxQv1sAVd91a/mhZJyWkYIEgAbEXR5c4l6g6/J60kuk6FNfwi4r3hzRq7A==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIQClIKhAzm+HoCfPXnCTNHfXDULuqMqBf5kFmrSsig1jCwIfZpS53jLmiKP2T3YnnwpghcOTzV5AuumEenUvpV/1YQ=="}]},"_npmOperationalInternal":{"host":"packages-16-east.internal.npmjs.com","tmp":"tmp/uswds-0.9.4.tgz_1465497003372_0.20863603870384395"},"directories":{}},"0.9.5":{"name":"uswds","version":"0.9.5","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"211e77098116cf0efbd571c09dd7ac7c828cd154","_id":"uswds@0.9.5","_shasum":"bae59e334b2828166e68d11136b623233c17ef48","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"bae59e334b2828166e68d11136b623233c17ef48","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.9.5.tgz","integrity":"sha512-4tbjFIGtvvuVhzDdcPGwksjHArbUFl6lxjxe37ndeSsNoJLuHpLuA2FoLJG1PYw/4Bd2dDbV7a28C8m6Eva07g==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEtysxrgGkLewrrBNqfmlWuSSEb0xaJIyMF4p5jrN0Q8AiBXMC9ypAQMCSN5NrGLnZI+CGs5Qrr+Njjm8qoMVLt04A=="}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.9.5.tgz_1467916437919_0.27933866903185844"},"directories":{}},"0.9.6":{"name":"uswds","version":"0.9.6","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4","prismjs":"^1.5.1"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"534f35f7a2324f566c19bee347e327c23a3dd63c","_id":"uswds@0.9.6","_shasum":"6d9a6b037b81de5df0aab06d4e91853f1b936cbb","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"6d9a6b037b81de5df0aab06d4e91853f1b936cbb","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.9.6.tgz","integrity":"sha512-gCkgd0AiFxtw+Eh/VFEKX5+todlhrv07OtCjayHs/W7EUXvsx0k2/7StUt+Si3jIK2xyGhXP3sLhbRCBO744pg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICcB9eOGcNHx3WekdRJbnpkgA1kfKtsuK68wm3ntekwLAiEA56mKjMjyhHx6zKTv0pRvrb1D5nAnsSt/R1yqZEsk9/I="}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.9.6.tgz_1468518851734_0.8361255975905806"},"directories":{}},"0.10.0":{"name":"uswds","version":"0.10.0","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4","prismjs":"^1.5.1"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"2069a1808e52db4b73bf95725cf19d049e358392","_id":"uswds@0.10.0","_shasum":"32258519eb8c05456d0e772844144ee5a950ebc8","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"msecret","email":"msegreto@miceover.com"},"dist":{"shasum":"32258519eb8c05456d0e772844144ee5a950ebc8","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.10.0.tgz","integrity":"sha512-kvazAXgYdTlrrkBKkeHgB4WV7oPGJQqxG4yVeSfdEUp39rhfRKuot3leay3KHbtFyerlNse5vFFwWyQzcAPCtw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCj1hpR3s7U2X7j4cnZS8Y41rSamrwdBxDzosxNJnzc8gIhANuk7Xa6frLcL9rpIRI/6Wzm6fyqb/X7VRcXRCezrjFj"}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-16-east.internal.npmjs.com","tmp":"tmp/uswds-0.10.0.tgz_1469128515828_0.18140001618303359"},"directories":{}},"0.11.0":{"name":"uswds","version":"0.11.0","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4","prismjs":"^1.5.1"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"e92e6ad2fd4bcafa6a3a8f03794c4bc679c3d2a5","_id":"uswds@0.11.0","_shasum":"b717109eeb5761b63e836fdfcdcb6e433ee5bf4e","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"b717109eeb5761b63e836fdfcdcb6e433ee5bf4e","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.11.0.tgz","integrity":"sha512-UCqXx3s+9nmGeINhafJlHyM0ogbotD88gfjr+T4rC1p5k7koT+IdftRD40jynnsTCfaylLFaR51Wjeg8nzdVKA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIC+PUwEWNszCUTCbGYxlKvupi5JClY1zcxmfSZ0nD1ivAiBhSXFfexMfA4hgLmJ6W5Lunhi+8AJ0i1pUmQXJvKRE6g=="}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.11.0.tgz_1470325725618_0.39242188283242285"},"directories":{}},"0.11.1":{"name":"uswds","version":"0.11.1","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"^0.1.4","prismjs":"^1.5.1"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"cb9eb45aaee7de0d2f2554cdf6bf38d2e17a85b6","_id":"uswds@0.11.1","_shasum":"493d2363ad3b838a053989f6aa0b15f7e5f294a2","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"493d2363ad3b838a053989f6aa0b15f7e5f294a2","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.11.1.tgz","integrity":"sha512-c1c7OunWLxcG84TuoBMLqdL0XvgmIC+IaktsA5SB9ibT98Q4089C0H6jkasURkWNS/pmuR82/OCvWBStXC8lXA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDajF2AfX6RknVd58+VTbOATG7HdKRfy1O4pfv5VoG4jQIhAPEt56iJLvHWDYTSDO8XjZcjwp12cMgxAtEzaz1mnXiX"}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.11.1.tgz_1471542190821_0.37852453091181815"},"directories":{}},"0.12.0":{"name":"uswds","version":"0.12.0","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"0.1.4","prismjs":"^1.5.1"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","lodash.debounce":"^4.0.7","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","sinon":"^1.17.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"0fa653acd1f6192250eecc475897491e3cb14e9f","_id":"uswds@0.12.0","_shasum":"166145c1b0f6d0d6d224e5c892faf1f5021e0070","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"166145c1b0f6d0d6d224e5c892faf1f5021e0070","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.12.0.tgz","integrity":"sha512-8pe5gBN00LIwmR0kPw4/3bWLmFb7VvfndxP7HrzSK4DcW+yWH3GlDDDyVAkS/PP6SaUeAgbN8VnhSsryCS9Opw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDbtlHEy0kLdCnEyPegrDm/pr4NVVoTfOUDog+MpD7oigIgD+5nR8YM4nPDlaFw4xhdObFVuGqHfoK4bmTgQQc2iU8="}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.12.0.tgz_1472757867253_0.02725523035041988"},"directories":{}},"0.12.1":{"name":"uswds","version":"0.12.1","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"bundle && gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","start":"gulp website:serve","build:package":"gulp copy-vendor-sass && gulp release","test":"gulp eslint scss-lint scss-lint-docs test","preversion":"npm test","version":"npm run prepublish","build:website":"gulp copy-vendor-sass && gulp website:build"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"}],"license":"SEE LICENSE in LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"0.1.4","prismjs":"^1.5.1"},"devDependencies":{"browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-cached":"^1.1.0","gulp-clean":"^0.3.1","gulp-concat":"^2.6.0","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-if":"^2.0.0","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-scss-lint":"^0.3.9","gulp-sourcemaps":"^1.6.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","inquirer":"^0.11.4","jsdom":"^9.0.0","lodash.debounce":"^4.0.7","merge-stream":"^1.0.0","minimist":"^1.2.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","sinon":"^1.17.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watchify":"^3.7.0"},"gitHead":"b73fa55551c1d03932f4ef4103d32177048f43a2","_id":"uswds@0.12.1","_shasum":"1bfcfc13cd767a72e12ef51009f5ed04d8833ee8","_from":".","_npmVersion":"2.14.7","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"1bfcfc13cd767a72e12ef51009f5ed04d8833ee8","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.12.1.tgz","integrity":"sha512-8t1QeVTa7XkxHHVDCGfqymiHiUxMlT6qDc08h5IFFmshX2E5FT8pQPQxDcCWNEoN4z+BzDLTkbQ3kcjwiAyiFg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCoh1EkyeC7o5iN2Fg+Jor8GiWwdQHxzJF+WDJ6Pb5oVQIgBtehIUuNCQVzWFzjQoMKt+9PF9+YXWildVFJ3QrQEO8="}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"}],"_npmOperationalInternal":{"host":"packages-16-east.internal.npmjs.com","tmp":"tmp/uswds-0.12.1.tgz_1473455370464_0.285381484311074"},"directories":{}},"0.13.1":{"name":"uswds","version":"0.13.1","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","build:package":"gulp copy-vendor-sass && gulp release","build":"gulp build","test":"gulp eslint test","preversion":"npm test","version":"npm run prepublish","watch":"watch 'npm run build' ./src"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"0.1.4","prismjs":"^1.5.1"},"devDependencies":{"@18f/stylelint-rules":"^1.0.1","browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","jsdom":"^9.0.0","lodash.debounce":"^4.0.7","merge-stream":"^1.0.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","sinon":"^1.17.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watch":"^0.17.1"},"gitHead":"959e8835b09b5f6b6690516f604437f2b0415f31","_id":"uswds@0.13.1","_shasum":"243666ca5fc8e487fc7b49621eb74df3486c3821","_from":".","_npmVersion":"3.10.8","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"243666ca5fc8e487fc7b49621eb74df3486c3821","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.13.1.tgz","integrity":"sha512-PlUkRE+EQg2GzEmOeDsOnyGRrj6z4c+bPzvl0WYjV8FEmqHv5D+Fl5l0J0gBvifPbmbpkUCaaYyzx+JOY/fNoQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHKOAAEALCLhv6Ic5E34X5i2CNKKNrf11GoUaxnt+EopAiEA0rbo/P9Mc93VHGQItfNdxVi5APyay5tdAvy/fFs0s/s="}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"juliaelman","email":"hello@juliaelman.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"},{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"packages-16-east.internal.npmjs.com","tmp":"tmp/uswds-0.13.1.tgz_1475786795608_0.8006996943149716"},"directories":{}},"0.13.2":{"name":"uswds","version":"0.13.2","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","build:package":"gulp copy-vendor-sass && gulp release","build":"gulp build","test":"gulp eslint test","preversion":"npm test","version":"npm run prepublish","watch":"watch 'npm run build' ./src"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","classlist-polyfill":"^1.0.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"0.1.4","prismjs":"^1.5.1"},"devDependencies":{"@18f/stylelint-rules":"^1.0.1","browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","lodash.debounce":"^4.0.7","merge-stream":"^1.0.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","sinon":"^1.17.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watch":"^0.17.1"},"gitHead":"5a8653c6c1dc4c36555bda96ca219d91e070c1d3","_id":"uswds@0.13.2","_shasum":"70aff3eacbbe5cb054f22747cc26cbd59084237a","_from":".","_npmVersion":"3.10.8","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"70aff3eacbbe5cb054f22747cc26cbd59084237a","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.13.2.tgz","integrity":"sha512-YYT/LkJwKEtODOTtfGr78/gLxff4xRrV0z0b24PUYa4iXC0lF2J0I/IwRCfeYIRbVofuKU5swVQ9cWsmaVHurg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC2lSQ+1tpk+UQiNl7t8h8xFK/hWpAcN/nopmGMClQNCQIhANdE8OgfTI4fj5iBFDmb6AtbdfRmKQRs9tv4YG0AwgLP"}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"juliaelman","email":"hello@juliaelman.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"},{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"packages-18-east.internal.npmjs.com","tmp":"tmp/uswds-0.13.2.tgz_1479399945596_0.42470341734588146"},"directories":{}},"0.13.3":{"name":"uswds","version":"0.13.3","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","build:package":"gulp copy-vendor-sass && gulp release","build":"gulp build","test":"gulp eslint test","preversion":"npm test","version":"npm run prepublish","watch":"watch 'npm run build' ./src"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"^1.7.3","classlist-polyfill":"^1.0.3","cross-spawn":"^2.1.5","jquery":"^2.2.0","normalize.css":"^3.0.3","politespace":"0.1.4","prismjs":"^1.5.1"},"devDependencies":{"@18f/stylelint-rules":"^1.0.1","browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","lodash.debounce":"^4.0.7","merge-stream":"^1.0.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","sinon":"^1.17.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watch":"^0.17.1"},"gitHead":"62f93e8913dc321f59a1a6c5403cd7d82d8deaba","_id":"uswds@0.13.3","_shasum":"730b58023aa22212fde6c63a5eeb4dd14dfa6e1a","_from":".","_npmVersion":"3.10.8","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"730b58023aa22212fde6c63a5eeb4dd14dfa6e1a","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.13.3.tgz","integrity":"sha512-U4jj5vkFUvcJ0pNGliJ1OwIVTltivj8wjQ9gfkuJTUfUsYtqyFAY5iTjMyXjaFkeTfYG8zzRW4amBJsioMQuLQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDXieaKhQIqyxmTN89YklCLcvpBeahkSjyWzCETJqcf3AIhAPS5mTanOIBho7NANGYqJ4Doqq3c/E4KrG6sfKqtSdsk"}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"juliaelman","email":"hello@juliaelman.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"},{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.13.3.tgz_1480619968072_0.09602190344594419"},"directories":{}},"0.14.0":{"name":"uswds","version":"0.14.0","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"prepublish":"gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","build:package":"gulp copy-vendor-sass && gulp release","build":"gulp build","test":"gulp eslint test","preversion":"npm test","version":"npm run prepublish","watch":"watch 'npm run build' ./src"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"github:thoughtbot/neat#neat-1.8.0-node-sass","classlist-polyfill":"^1.0.3","cross-spawn":"^2.1.5","normalize.css":"^3.0.3"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","lodash.debounce":"^4.0.7","merge-stream":"^1.0.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","sinon":"^1.17.5","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watch":"^0.17.1"},"gitHead":"a09e7429f9287d42637eeb0f3dd60553569a9b3d","_id":"uswds@0.14.0","_shasum":"91c93d6bf2cffec6278b74eeae67e726d1c34c65","_from":".","_npmVersion":"3.10.8","_nodeVersion":"4.2.3","_npmUser":{"name":"juliaelman","email":"hello@juliaelman.com"},"dist":{"shasum":"91c93d6bf2cffec6278b74eeae67e726d1c34c65","tarball":"https://registry.npmjs.org/uswds/-/uswds-0.14.0.tgz","integrity":"sha512-bb44UJ2AaeRusVr4m4eRhQ4FU/ME+qM7BiAqwY/6BK95y4sIpMEaNqmcTVWxecjm98nhkLs7Mdzb4shhnQKLdA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDcCvfw38IoYQ/6Xl+zYrrx5JUDYHHZqYOttW+NTFSTEAIhAPQWGQR4sIuLrqF3D8UWuxiNo88C4VBciWLslgpG29bK"}]},"maintainers":[{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"juliaelman","email":"hello@juliaelman.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"},{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-0.14.0.tgz_1481840082938_0.7875726216007024"},"directories":{}},"1.0.0-pre":{"name":"uswds","version":"1.0.0-pre","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"check-publish":"npm publish","prepublish":"gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","build:package":"gulp copy-vendor-sass && gulp release","build":"gulp build","test":"gulp eslint test","cover":"istanbul cover --config config/istanbul.yml gulp cover","preversion":"npm test","version":"npm run prepublish","watch":"watch 'npm run build' ./src"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","classlist-polyfill":"^1.0.3","cross-spawn":"^2.1.5","lodash.debounce":"^4.0.7","normalize.css":"^3.0.3"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watch":"^0.17.1"},"_id":"uswds@1.0.0-pre","_shasum":"7d5a2a4c15a6e52b80eae8984a85563e3092f180","_from":".","_npmVersion":"2.13.5","_nodeVersion":"5.1.0","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"7d5a2a4c15a6e52b80eae8984a85563e3092f180","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.0.0-pre.tgz","integrity":"sha512-7Bvcy2i8vq9ynt4lURFlazs2PynCY5Jr47to25G2Slv31JiU1rCZf3TXyi8OdZRUVau5QGc9K/e766rFwSemZA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFWIJNcBj9AbiDbjYePurqqIr47mWSL0PgS9kbuqG9tYAiA7tx8oPes1IUmGHmYWBzEbra6TKT4hC4H3a/LzZpEtFA=="}]},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"juliaelman","email":"hello@juliaelman.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"},{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-1.0.0-pre.tgz_1487875622228_0.541850526817143"},"directories":{}},"1.0.0":{"name":"uswds","version":"1.0.0","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"check-publish":"npm publish","prepublish":"gulp copy-vendor-sass && gulp build","prestart":"gulp copy-vendor-sass","build:package":"gulp copy-vendor-sass && gulp release","build":"gulp build","test":"gulp eslint test","cover":"istanbul cover --config config/istanbul.yml gulp cover","preversion":"npm test","version":"npm run prepublish","watch":"watch 'npm run build' ./src"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"bourbon":"^4.2.6","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","classlist-polyfill":"^1.0.3","cross-spawn":"^2.1.5","lodash.debounce":"^4.0.7","normalize.css":"^3.0.3"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","browserify":"^13.0.0","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^2.4.5","node-notifier":"^4.6.0","node-sass":"^3.4.2","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0","watch":"^0.17.1"},"_id":"uswds@1.0.0","_shasum":"ef881ae87b1de745a650aecf11fff87106920f52","_from":".","_npmVersion":"2.13.5","_nodeVersion":"5.1.0","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"ef881ae87b1de745a650aecf11fff87106920f52","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.0.0.tgz","integrity":"sha512-DZriUM4J+Go2/fbBQT2s/FpxCa+HFHAHxbNndR9YaoMuaGIlIvheDM6smXH+n5fwO58tTE4SRrkG7SIQJMVK5Q==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHfzCgl8x36KiUwugr6RMSmWWn4OWKRILNq7hxXeKpmpAiBVEhYLfdJEf6ezzeYg081QqU0xheqUmET7Rio7slZj6g=="}]},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"juliaelman","email":"hello@juliaelman.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"},{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"packages-18-east.internal.npmjs.com","tmp":"tmp/uswds-1.0.0.tgz_1487876449427_0.37484756810590625"},"directories":{}},"1.1.0-pre":{"name":"uswds","version":"1.1.0-pre","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"build":"gulp build","build:package":"gulp release","check-publish":"npm publish","cover":"istanbul cover --config config/istanbul.yml gulp cover","federalist":"gulp build && fractal build","prepublish":"gulp build","preversion":"npm test","start":"fractal start --sync","test":"gulp eslint stylelint test","version":"npm run prepublish"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","bourbon":"^4.2.6","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","lodash.debounce":"^4.0.7","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"devDependencies":{"istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^2.4.5","watch":"^0.17.1"},"gitHead":"cb642f3674df067fb4eb125a42aea8e289e48290","_id":"uswds@1.1.0-pre","_shasum":"0e6de5b0677bddc5e1bd3748ea5e24d240c85c66","_from":".","_npmVersion":"3.8.6","_nodeVersion":"5.12.0","_npmUser":{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"juliaelman","email":"hello@juliaelman.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"},{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"dist":{"shasum":"0e6de5b0677bddc5e1bd3748ea5e24d240c85c66","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.1.0-pre.tgz","integrity":"sha512-27SFCwCCp/HRC1VacFcrhyZwp1j9YJlfOdhqFhEVRG6BGKM3VsAzTCg3kcplgOGqtnVKMBe+RDAN8KOOh3ck6Q==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC8hnYf6txUM9YWZz53tS0bwdg3hCvJ1XgR9ZXMqwQoSAIhAOcSPwUoa7KYXbeiov79RXo3FEh01o+9kh9SRflwiSFt"}]},"_npmOperationalInternal":{"host":"packages-12-west.internal.npmjs.com","tmp":"tmp/uswds-1.1.0-pre.tgz_1492463050707_0.9344782142434269"},"directories":{}},"1.1.0":{"name":"uswds","version":"1.1.0","description":"Open source UI components and visual style guide for U.S. government websites","main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","build:package":"gulp release","check-publish":"npm publish","cover":"istanbul cover --config config/istanbul.yml gulp cover","federalist":"gulp build && fractal build","prepublish":"gulp build","preversion":"npm test","start":"fractal start --sync","test":"gulp eslint stylelint test","watch":"nswatch","version":"npm run prepublish"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","bourbon":"^4.2.6","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-mocha":"^2.2.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","lodash.debounce":"^4.0.7","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","run-sequence":"^1.1.5","should":"^8.3.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"devDependencies":{"istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^2.4.5","watch":"^0.17.1"},"_id":"uswds@1.1.0","_shasum":"e5608e43d38e4f8166218940563d66dceaba99ee","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.10.2","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"e5608e43d38e4f8166218940563d66dceaba99ee","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.1.0.tgz","integrity":"sha512-MJW0j+iptEpGg0X5gvF7sLkeM9Xw7sG5zzBeSwJZFp8Idz1cBPQy4G11kCIx3pGyq9DrDXHrAeMJQ7u9VOno8A==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAYXCV3NsqDAKhh79LRgP8mQnqEka6wthND1232ykfP4AiEA0gNkKhEhJMlUoDBJd7yQW30643JEfPnx41auQSe+djU="}]},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"aidanfeldman","email":"aidan.feldman@gmail.com"},{"name":"juliaelman","email":"hello@juliaelman.com"},{"name":"mbenari","email":"hello@maya-benari.com"},{"name":"msecret","email":"msegreto@miceover.com"},{"name":"rogeruiz","email":"hi@rog.gr"},{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"packages-18-east.internal.npmjs.com","tmp":"tmp/uswds-1.1.0.tgz_1493227252714_0.24128408450633287"},"directories":{}},"1.2.0-rc1":{"name":"uswds","version":"1.2.0-rc1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"^4.2.6","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","run-sequence":"^1.1.5","should":"^11.2.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.2.0-rc1","_shasum":"71528c14881041363549dff8707df8a46de905df","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.10.3","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"71528c14881041363549dff8707df8a46de905df","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.2.0-rc1.tgz","integrity":"sha512-8viq0uVQ3ORwiETdNEQ+C4loafT6EZA8JQ95SCvZlmo+zuxRw477NpzGBgEJi/qvp2W15+grLuaE3piKVGmZyA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCF/e0Z1L2GM0c5D4aRashiZBDI0BnBeBnwP9cscIxc0wIgY8flrs9Z58tcqrN0qcueNZDQXOwCwHFHulPuq//IGos="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.2.0-rc1.tgz_1495665220999_0.92409239965491"},"directories":{}},"1.2.0":{"name":"uswds","version":"1.2.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"^4.2.6","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","run-sequence":"^1.1.5","should":"^11.2.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.2.0","_shasum":"eeffe47072dad42efc13432175a5f5008674d210","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.10.3","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"eeffe47072dad42efc13432175a5f5008674d210","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.2.0.tgz","integrity":"sha512-tPEi7BX3kJU5lGiq6OOFdWWs9GyJxjpkkFKkAvZz/oTIHhovPOws3KlXyj1/ps8udGpTe8WGBd8L/LLscmEnqw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB8zQpeRHhUzuU3MIGsgY5UmJVmnFz/0xjCNIW2zYD0kAiEAuUiBKYWhDPqgiUQ3qF9/DZb/fF5139NdSyIt9i5r0Us="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.2.0.tgz_1496760561547_0.763928011059761"},"directories":{}},"1.2.1":{"name":"uswds","version":"1.2.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"^4.2.6","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","run-sequence":"^1.1.5","should":"^11.2.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.2.1","_shasum":"df350f5b55ed211301369445cfa285f24231dded","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.0","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"df350f5b55ed211301369445cfa285f24231dded","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.2.1.tgz","integrity":"sha512-wo8W8y8vgZQ54MV5oxB63dllvAFy15tSNXpyLIwlB4flCPjWHzoxXFbF3E4OA1nqjuxMEI4ckKPkt7w4NGCZuw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIB3gupcwrHT+18zpm/GwIQ1mjQ2N2q5vnczA7seY+cLKAiEA+7iac65asEtgJPTP8aC1qVa99Nej4fvvDxCaWfxXP4g="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.2.1.tgz_1496854790245_0.643992104800418"},"directories":{}},"1.3.0":{"name":"uswds","version":"1.3.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@types/node":"^8.0.14","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","run-sequence":"^1.1.5","should":"^11.2.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.3.0","_shasum":"0c67eac6ec4685afad9dd5c03f498dface8d3fd4","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.1","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"0c67eac6ec4685afad9dd5c03f498dface8d3fd4","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.3.0.tgz","integrity":"sha512-2wG0UBJd7+3n8a82cyB4Nc9Pb/I11kvmuhPOly70ooctV9K6Zng1I4GrOCjm0HxjnALmWiqnby109SLbLAajUg==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICkWNWwLfXOIDJgVOJs8lsRI9wEAG7kLJI5+QisfSbvWAiAvVODDFDL+kjYpb4SYq4FXnxB/K/8szHFO3BY7JVmILg=="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.3.0.tgz_1500667889484_0.7564403859432787"},"directories":{}},"1.3.1":{"name":"uswds","version":"1.3.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@types/node":"^8.0.14","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","run-sequence":"^1.1.5","should":"^11.2.1","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.3.1","_shasum":"1687b2a8f844e328013465a09c78d32c75d096da","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.2","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"1687b2a8f844e328013465a09c78d32c75d096da","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.3.1.tgz","integrity":"sha512-HLPaHLbiYwwg3iEuSw5fTwqCOK9QnbK871fS11tgBILD/xm0gZgm4EznOM1FGsP05BmA6y6cVuG463CnaQzfxw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCtoExVw761vogzJcs1ruareXcd6ewnE12zYteojRxIZgIhAMKf9dG2QOCbrOQ7Qh+JV6wcRrQr/wC9LL0ChjzBhyqS"}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.3.1.tgz_1503441211654_0.5463047903031111"},"directories":{}},"1.4.0":{"name":"uswds","version":"1.4.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@types/node":"^8.0.14","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.3.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.4.0","_shasum":"f210552404fe229bce4df137a9c77b63d378828f","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.3","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"f210552404fe229bce4df137a9c77b63d378828f","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.4.0.tgz","integrity":"sha512-oUVESPPasU4GM9+JXa1vyQzNu4cEolWWyeHQXe2UP/fI38YuOhIQM/YHgIGZZiDKFQEUEz5jVz2xKHONP+InLQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCMjOXJ322m23u6TS2rmLU+1f5+h6Eoey55HfkVOLl/agIhAOUq5RBsBZr41cvg17QUbJnYoSCk2bVFwdpfv8WO6vdL"}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.4.0.tgz_1506720884486_0.7219989246223122"},"directories":{}},"1.4.1":{"name":"uswds","version":"1.4.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@types/node":"^8.0.14","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.3.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.4.1","_shasum":"5cc613d16f71f79eef36056d5172351eb9d32dfb","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.4","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"5cc613d16f71f79eef36056d5172351eb9d32dfb","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.4.1.tgz","integrity":"sha512-hwhQxfoELe3So2opFB6z3I5RP1NaLJ+G6SbDsJMEYoqsOxIPT8pXzVyW7CzXsWUIAd48eX3HWedvIEja/9IE7g==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDOu5Wazvba/YOUHmiQZnIC8LlFAtrDaBKsratraXqRSwIgUVMYnO2OSAziimJmMIwlhOKu9q6g9QO2kyk4n148D7U="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.4.1.tgz_1507327454851_0.8280760280322284"},"directories":{}},"1.4.2":{"name":"uswds","version":"1.4.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@types/node":"^8.0.14","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.3.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.4.2","_shasum":"a64617a83d79deff20503cc5b879072e547a3c29","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.11.5","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"a64617a83d79deff20503cc5b879072e547a3c29","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.4.2.tgz","integrity":"sha512-kRHAVZJSai4IwloAy5qgw+4mNcNqfCZIq1C6h0kbMoRyBeK/WFLM/lDwfqLNDIK6IaDeKVfidDVaTAyI+71G8g==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGmCxNsVouhIlNFphTqdCD/ykhno2qwD2iS1hnVq86CbAiEA3czklC/yZMZhEqnKdrw0uUONoEaomrYXp2dvgigjF1A="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.4.2.tgz_1509658219697_0.4152583326213062"},"directories":{}},"1.4.3":{"name":"uswds","version":"1.4.3","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@types/node":"^8.0.14","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.3.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^2.2.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"_id":"uswds@1.4.3","_shasum":"859e3312ad3a64b9901fe6f4acb4add13eedb3cd","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.12.0","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"859e3312ad3a64b9901fe6f4acb4add13eedb3cd","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.4.3.tgz","integrity":"sha512-M7q/P3CpBv166NCgYcAo+IfoqB8D9CN2+OP3zsi727yDULgSsmMlcBWX7JwAsGKIf27NGOgkbHDtjmR59X3VIQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFkAjTbBCsNhtyi5mmrK8ZnGpUqej6W0pU547RPfNAE3AiEAhR+imwjxi8hfJuq0mtHY8Ulh3bu6Y4noDcOPOpRQvcc="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.4.3.tgz_1511206647943_0.9646713968832046"},"directories":{}},"1.4.4":{"name":"uswds","version":"1.4.4","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/18F/web-design-standards.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/18F/web-design-standards/issues"},"homepage":"https://github.com/18F/web-design-standards#readme","dependencies":{"@types/node":"^8.0.14","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.4","@frctl/mandelbrot":"^1.1.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.3.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.2.2","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.0.0","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.0","vinyl-source-stream":"^1.1.0"},"gitHead":"ed7058183473dd4876c845bd33e7612f860419c0","_id":"uswds@1.4.4","_shasum":"bbfe15af7bf00b90c0bf3c1927320c4eadaba6af","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.12.2","_npmUser":{"name":"18f-devops","email":"devops@gsa.gov"},"dist":{"shasum":"bbfe15af7bf00b90c0bf3c1927320c4eadaba6af","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.4.4.tgz","integrity":"sha512-lDzl3mOjRRCK9TOQeVvLYAZc1oiseAAlMYUEHyT9DIMN+Wt9LAIph5BPv1c253D4HAG3N4VHz/uCh9GhF2dfNw==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIFw89ahYz2FK+DNUnxITSrzyW64016QZXXX8ETTzthTSAiEAuLvjbQbbbYg6CLH+TeO6z2iMUkx7wi5vLTFmChkUUVI="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.4.4.tgz_1513625257513_0.18153043929487467"},"directories":{}},"1.4.5":{"name":"uswds","version":"1.4.5","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"f60e7bdd1ea032dfe293da1cbf9d72bac89ade4a","_id":"uswds@1.4.5","_shasum":"3e4098ee474c726afab3a6f6980d1c4462e311cc","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.12.3","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"shasum":"3e4098ee474c726afab3a6f6980d1c4462e311cc","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.4.5.tgz","integrity":"sha512-Ernh/XlNP+4au6kMrxL1rcXrIxiA41WBoV5/xZvFktMsRKDw8nzstbcOuXH27trV7cyKuE64njQeTZoKwthNXQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDsJQM+0+UKja1uNc0s/g8qdOCS70BwNKdHY62Pa2PBigIhAJSXOFy9AmJMfVxHhBwh0UzgITDIkTjdemh+807vKlBt"}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds-1.4.5.tgz_1516737932905_0.6057454915717244"},"directories":{}},"1.4.6":{"name":"uswds","version":"1.4.6","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"4e5f4b4d9e86c8dac488c754f9476147a6cbbb62","_id":"uswds@1.4.6","_shasum":"13b342570440bb1fb34fda7c126c55163daeb903","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.12.3","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"shasum":"13b342570440bb1fb34fda7c126c55163daeb903","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.4.6.tgz","fileCount":652,"unpackedSize":8119105,"integrity":"sha512-ORdCBpspaVboJtXTZH51Q5WLqt01UHgv0PoD6MDCtnV2nZLtnD3COK6Yjj5ESiYsBHnNZGXsXFFeGLSuS8Ql2A==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCrEQW+a4AT+vJQcfJfWTVQnMDxPmbOtDPqEJnbLL8XdAIgYxqduXEv1W9D4lr7yoOA48DR7L+S4jnUqVwLWrN4xr8="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.4.6_1518463411071_0.284146601870531"},"_hasShrinkwrap":false},"1.5.0":{"name":"uswds","version":"1.5.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"c1d908c206cc919b2efd7c1435c199abb61292f0","_id":"uswds@1.5.0","_shasum":"fd49116d88d29a0d1f0225a2e3af6d4ac60efc49","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.13.0","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"shasum":"fd49116d88d29a0d1f0225a2e3af6d4ac60efc49","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.5.0.tgz","fileCount":652,"unpackedSize":8134729,"integrity":"sha512-2fUJUQTUB6LYI1TxlbtSDyDNTPbomgSIzjil3QaBdhBLQKfVQsrfZCkFSf8Zi+/HkEcMREA9DgOv60sUo6wyoA==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCemhxhI/NlWV2eKTQBoaBVNCl/2YGDPb4IKVvFk8WErwIhAIUDyQBT31UfT6daB6vCgmIp8ni5ioXX+96kR8WmXelA"}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.5.0_1519684796206_0.3904643707669819"},"_hasShrinkwrap":false},"1.6.0":{"name":"uswds","version":"1.6.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepublish":"gulp build release","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"npm run prepublish","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^2.1.1","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^3.4.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"4df902a85ecbc15c2de3fc5254f3909f84a49115","_id":"uswds@1.6.0","_shasum":"26bf63a443cfda4b64d9d432d6d29ba99704919f","_from":".","_npmVersion":"3.10.10","_nodeVersion":"6.13.1","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"shasum":"26bf63a443cfda4b64d9d432d6d29ba99704919f","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.0.tgz","fileCount":652,"unpackedSize":8135968,"integrity":"sha512-6//+RhUMKPbyR1lGDbfJgQHAdVibfRLyQ1RPCp4XRV6tkCLNm4a2myZnH1Slevpz0tRll0jW1k85x4Yyn5XkcQ==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAYtUHtfyxlIyQiXY4Bg6Rt6cyKi3t338fw3cvZZaFWCAiEA1ECb59fE2wTyCsAD7wYCrkPokM1k6eqhiIKnCTQjDSM="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.0_1520877444059_0.04338441407431248"},"_hasShrinkwrap":false},"1.6.1":{"name":"uswds","version":"1.6.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"8d3eaf8656e9ae760a3e3f8aa87bf6d9ed811b46","_id":"uswds@1.6.1","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"integrity":"sha512-h7DvkJKOwlCWTT106seB+tJxGNejZ+i3tn/OBs8o3an3lQs0q1oJKu5IgR3t0wsEXZt3zghHvVhmU7vbQjvOQQ==","shasum":"9879a4abdad31126067bb3ea8ed0d55f50eded7c","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.1.tgz","fileCount":644,"unpackedSize":5793204,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHJ+rj6HFMknO35u7Hfpqvm23ZSbEPKvJXC2mjzIAisPAiB5RZRT2HIQMZmQHPQBiMA2OOg42ka+BXF3nayhlevbsQ=="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.1_1522084860690_0.6501448688176654"},"_hasShrinkwrap":false},"1.6.2":{"name":"uswds","version":"1.6.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"9f804d35eae30b97520008413ada7906185ba842","_id":"uswds@1.6.2","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"integrity":"sha512-/aohhytrUrTHBWybRFwZfffQB/52aRy+AI79p0cgy0IEE8Qor4Bs3DSfAmfiqW74tqjHx9BE56WDvQw8BUqEEg==","shasum":"41d0cdcb4a9e4373f5340a41eafe6dba1b6fed34","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.2.tgz","fileCount":644,"unpackedSize":5792756,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa3h+aCRA9TVsSAnZWagAAX+MQAJI1SSypsDRRNU947M1I\ns6GVeAK/qTLd0gekpl769yHe5BXbtZgd/yB4UMkt3EslJyS8zRzEF3rqk028\na+/uRq43vnAYKxcyuk1nB50JqBJ+lYvufIds2x938BpShRprjNvjjNBwBXBr\nbdljCPUNlEF/MqdL2Bt0q2gumJ4K7Nw+VqNhNB2oFjb2CejG7Tbv+rkZWNAT\nrN00bn9Uf1fBgOQnF0Tnlyuvfa2GAlCqQkRaJgrp03t49gLp6SlRfKzivWHR\nsrlD3mkwl5jDPv2ilswOvwstz55uDpJz7D33CYv8i0P4FrdqYRuUxIEUFFSR\n+qpRCio/J3EZKI1Wkqk5Yj0jiOoohRD9fKaJLhexsXIQekgGHqG1VOZfyRh+\nPMw8LyoRMcUIbA9VB4vY09VSDM65/Y43sD3GHhEJ5zTSf4WhuYuU/bJoTy96\n5W9g8AMYxmnKbP+TS/Q1oStYXacq0ETva9Lbr1fR6O60sPKDJv+ibCcH0m99\n72PSO0gPVBJOl0ZZDsAdI6J3kUcU811xhfXeG1H4ChZmytkbR+85PXoTktrX\n2Rlir4RRL+CILTqHJh+mSF8aMoAn149vQlWrQtx+RstwQe6rFJzVNvlvtE0Q\ndkmKJXKU4ZPuxg5j71SirWXaCLwWbnHy7tNgxiE46zOvLyBnGW5qmqI6TcqR\niwMS\r\n=JYY9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDBCKDcW945RjAOGa3rY8xATvRJG419OoP+6RuELEw0KQIhAPLqRTn2EWWIn52ykkvSauxc01Hl6vh7Wr8s6fUmD3o0"}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.2_1524506520743_0.4756738254150208"},"_hasShrinkwrap":false},"1.6.3":{"name":"uswds","version":"1.6.3","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"363327a7416e97163dfda10834aa394c8aeebabf","_id":"uswds@1.6.3","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"integrity":"sha512-eJ9EEKvSRZ0A1Yh9FXe7JaMC2ZV7QX8Wf0bbMWyqFTAZ37oLD9e0BcckkajswHgV6vfA08PURN98trIXIK/aAA==","shasum":"00bc3cca8eb04925b6c94d52b984addcc7464fff","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.3.tgz","fileCount":644,"unpackedSize":5808981,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJa8JOcCRA9TVsSAnZWagAAJjQP/AyxKNfqGSibPya02Ujy\nN53HDwmRoB7cQTNjO40WjO6lxj2BPbiGe0AVoV4ncvDK5PabH1PkXVowf3N+\nADAfiP/EqZRRiDSklIHhuDnOIOhfE9M1MXM3S88l/vnpr3ndxlbMaQx5pmB8\nMQzEJF7w/UBUHmZQu8qzKSW12E/IAy0Hr+X3e9Y+D9LgageuUEVu6RqcTeeA\nc6vZBqS6QiCXkMqlLigR1f2Rb4IqcDHdKX/0WriiDKHughaRhNiOb/Etmp3d\nBGqa6LSzIOqcD7CSp0xviBJalFjffB6MUFnylrcaNFHFR47ajrZNyeoeDVzb\nRN0/lOeTPXl3vm20Aj6EaOtAZ2IZJttBpwJ/84dd6OQwnKeejjonSYD/FGZg\nk6tfxq+ofef9pCKiS7N8zbTm6QzVbnwOX7ZvU9ePTvqZ8NIEfHKk0GABN8wL\nUV71e7aFaYtM0948fZiaiM+9mEYfhML9vZocbB/AbnQ8676PLn4hfrEuSd1R\n0BqGCFdzy5H+iD158FL9cZNkr9RtRPnKY1fQhrFKwJWqOHxbD5nRs3wQ1M4B\nGNkk/EXhJVgcenFVOtND9z11FN+urAYPPcMr2ozOySKFBUF2MPorzE4tp+hV\ng88tWlL+S7MfbloC2RXB1/JhOrVYCxHRIvBXEMYnkc9BbUlKrIOPGS6ZXSYJ\njlV9\r\n=5J+P\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIFtHOK9i7sqQ78u/clsuweMEJ2dYbEhIY6+44MVtaViQAiBGWf58hcjFhixkHbkux2ekFjmLMrRDedZX9MOBFeDLSQ=="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.3_1525715865223_0.6558329955901494"},"_hasShrinkwrap":false},"1.6.4":{"name":"uswds","version":"1.6.4","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.24.2","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"a5f69d09fa47b423372b9b722586e80e14d2c2b0","_id":"uswds@1.6.4","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"integrity":"sha512-ivtLeJfd61OwqfrV8FMEJ8THP63fGTGYc2JSHVLBBuekbGHMv5KcpZhiY95P0fvQXbdbFQCqO5gT7n1vVsOyyQ==","shasum":"a02dce0ffd727c9b2ab2f3b11ab0109e9183e080","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.4.tgz","fileCount":644,"unpackedSize":5808760,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbFW4CCRA9TVsSAnZWagAAM1cP/imkwfH0tX14su4fTlqK\nSSODz6XNM3EHx4T3ndfbuy6YRErUf7J9YYyKl1EZR5CeYli427f6o9Zdjew1\nhPKJAV7GTB3OgLp6oPw8GeNvaM76w08N+WyCGVHi1mmqWFhTe8VjMAdb+93D\nWaEhEcY8Q+v/3dTrypULmPn9U0chuksgy+3Waz+f60AbpMORAj85tymQ4YO1\nb69RkLbpEH2wQJs5azlc81sFboo5RnnqKcazzEI5y9kU5QmA/JZ5t2FSC17Q\nE4rfqXfiDhresoddgUfquCl0CN2wmR/WtxyDuUo6KbEi6OiF41XYsmQrshku\nThpfxsrKJt+tBhUZq4m1MfAh5F/W5qsg/5PG0mNbCo3mx/G5J/h3ytujADj5\nF83+nnTV7d/CUSQq2wdAkQaKZ2mpkQ/e3MhlPyOTKJGvKKOMTE6dDEWD8i4y\nKQA+NdEqTpVkJxZyLIqJoJb1eOaN5JymBuzK3Is6Hb6lRO5swOmJsbymgB7k\nqJzIXaSRgPoedbyw0vEPxke5wCA0dlGQXX/xxEpOJWLNvMDRBz1zar+AEUZY\nJuE//Db99Eta8Tpl/2wLyjZyBdcg3VZ165LK2BKnHPZUn4gSXNIqcpImINUF\nG7sYVslVhgAGZfJUsDRQz2rLuzLRSN7oxMLNHFd+RGcFjn5PKapFX2UKupC3\neTPP\r\n=j8aL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIC7FYIecFzt3WOTEb2pUl42Ww/Kh9JhbnLuX/6FfreoAAiEA2EmJtp/mu0rkk9G6uMDDAJl1sDFO/WhIZI4rAVBAxPA="}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.4_1528131071739_0.06140809382798751"},"_hasShrinkwrap":false},"1.6.6":{"name":"uswds","version":"1.6.6","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"918d0f6bdc41d542ebaead106d7e7584fedcc378","_id":"uswds@1.6.6","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"18f-devops","email":"18f-devops@gsa.gov"},"dist":{"integrity":"sha512-XpneVRLOcTO5u1f7vLCvqJbQXrUfYkN0sQa7KyC1+3TkXGRNIRTL+YtPvLFRTinTvjRg0E/POX12dGPYG2Kiow==","shasum":"f8b64b4fe3541eaf4dd6d8eb2422e815a1645633","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.6.tgz","fileCount":648,"unpackedSize":5545648,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbIWU1CRA9TVsSAnZWagAAojYP/j3JfHS8ENttKsGeeeMm\noYAKZA60JrhILV6kq3SsZ+M1cC4SgH6DQDmPPX4YE8DSDFtG3WbO6U9Pwewh\nYNka5AQ6iFYCLFBqv37fR7D86h1+NCL21xjppjM5kLFaNg2ZEt9gb3E9b7WA\nOi1ieuEnwv6zj4vweKKqf/yDj43RtWNtbkod/OkzvHHznrE2Y/wsZ3LpH3vC\nUMJzeLamz+7YbzNNtPU/Qbd66T5/eU+sH+TSun8J4QtJ3FaS0U70B9RDb9Io\nzoOCbRCD0w+/1EUwLQJPp2x2zjCH/szGUxgQB/zsZPu+z+Q+4+18mhVfIWTS\ngrNDHpwPK5iyCLkhQESo5otA2xUa15EGNyKJ7GghxxhMKqaGRAEgxTbEWlac\nKKGfZDfmjvK0IZQ3eapT2D21x1UfOO4YZJyffCfiW7CK7Vbgp0p0L4hnuiLh\nviKnFhPT1Ve12LdcRdl44MJtqAJtZLJE+G9wslCKXQTIiyRmu0FeFpSwEXF9\nOAD4CGa0voFky4Fc7sbgcIruDGO8fgyMwj3n/ABAdCvnw5aTjU5jICCZ+uZy\nbMErr4MRrN7m/l94Fn4bnuv+BqirEVLS6K7uj8HV7jFGPDMvqBPDlEh41IZG\ndEScWT/3t3OdH4k6nPwMdsfkyY2RjJ4PVyQqR1rrkQPkUA/OcRo6zwbaMkKo\nkyaH\r\n=5xKz\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDYZ5Rh5/MzKWDmmVecXb4s94gv2Q9bHzkCxPEsDZJqiQIhAO74iMkYPQfpAXADOtj3tJ1fNAnYfVDKSlpyeal18Keo"}]},"maintainers":[{"name":"shawnbot","email":"shawnbot-npm@nym.hush.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.6_1528915251541_0.20793184393824693"},"_hasShrinkwrap":false},"2.0.0-alpha":{"name":"uswds","version":"2.0.0-alpha","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-combine-mq":"^0.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# U.S. Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [U.S. Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the Design System itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the Design System and documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the Design System](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Importing assets](#importing-assets)\n    * [Sass](#sass)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization and theming](#customization-and-theming)\n  * [Set the base asset path (fonts and images)](#set-the-base-asset-path-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nThe components and style guide of the U.S. Web Design System follows industry-standard web accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created the U.S. Web Design System for designers and developers. The U.S. Web Design System is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the Design System can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the Design System — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the Design System are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the Design System\n\nThere are a few different ways to use the Design System within your project. Which one you choose depends on the needs of your project and how you are most comfortable working. Here are a few notes on what to consider when deciding which installation method to use:\n\n*Download the Design System if:*\n- You are not familiar with `npm` and package management.\n\n*Use the Design System `npm` package if:*\n- You are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/latest) from the latest release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-1.0.0/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-1.0.0/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project.\n\n3. To use the Design System on your project, you’ll need to reference the [CSS (*C*ascading *S*tyle *S*heets)](https://developer.mozilla.org/en-US/docs/Web/CSS) and JavaScript files in each HTML page or dynamic templates in your project. (We also provide Sass (SCSS) files in the zip file which you can compile to CSS. See [Sass](#sass).)\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-1.0.0/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-1.0.0/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both files, the CSS and the JavaScript, in two versions — a minified version, and an un-minified one. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. And the un-minified files are better if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the Design System.\n\n### Install using npm\n\n`npm` is a package manager for Node based projects. The U.S. Web Design System maintains a [`uswds` package](https://www.npmjs.com/package/uswds) for you to utilize both the pre-compiled and compiled files on your project.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `src/` or the compiled files in the `dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── html/\n│   ├── img/\n│   ├── js/\n└── src/\n    ├── fonts/\n    ├── img/\n    ├── js/\n    ├── stylesheets/\n    └── templates/\n```\n\n#### Importing assets\n\nSince you are already using `npm`, the U.S. Web Design System team recommends leveraging the ability to write custom scripts. Here are some links to how we do this with our docs website using `npm` + [`gulp`](http://gulpjs.com/):\n\n[Link to `npm` scripts example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/package.json#L28)\n\n[Link to gulpfile.js example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/gulpfile.js)\n\n#### Sass\n\nThe Design System is easily customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The main Sass (SCSS) source file is located here:\n\n```\nnode_modules/uswds/src/stylesheets/uswds.scss\n```\n\nGlobal variables are defined in the `node_modules/uswds/src/stylesheets/core/_variables.scss` file. Custom theming can be done by copying the `_variables.scss` file into your own project’s Sass folder, changing applicable variable values, and importing it before `uswds.scss`.\n\nBelow is an example of how you might setup your main Sass file to achieve this:\n\n```scss\n@import 'variables.scss'; # Custom Sass variables file\n@import 'node_modules/uswds/src/stylesheets/uswds.scss';\n```\n\nYou can now use your copied version of `_variables.scss` to override any styles to create a more custom look and feel to your application.\n\nThe Design System uses [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets (`css/uswds.min.css` and `css/uswds.css`) however prefixes will not be applied when using the Sass source files directly. If your project requires the use of Sass and vendor prefixes we recommend incorportaing a plugin such as [Autoprefixer](https://github.com/postcss/autoprefixer) into your build process.\n\n#### JavaScript\n`require('uswds')` will load all of the U.S. Web Design System’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute the U.S. Web Design System, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* Uses **[Bourbon](http://bourbon.io/)** for its simple and lightweight Sass mixin library, and the **[Neat](http://neat.bourbon.io/)** library for the grid framework. Bourbon and Neat are open-source products from **[thoughtbot](https://thoughtbot.com/)**.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of the U.S. Web Design System.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-cool_feature-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided and, if necessary, defined in the `core/variables` scss file.\n* Media queries are built **mobile first**.\n* **Spacing units** are as much as possible defined as rem or em units so they scale appropriately with text size. Pixels can be used for detail work and should not exceed 5px (For example: 3px borders).\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the Design System.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization and theming\n\nThe Design System can be customized to use different typography, colors and grid systems. The easiest way to do this is to use Sass and override the Design System’s global variables. If it isn’t possible to use Sass, do theming by overriding the CSS rules in the Design System set.\n\nTo start theming through Sass, copy the `core/variables` file into your own project’s Sass folder, changing applicable variable values, and importing it before the WDS. Below is an example of customizing the import of the Design System's all.scss file.\n\n```scss\n// src/main.scss\n@import 'path/to/my/scss/files/main/scss/my-custom-vars';\n@import 'lib/uswds/src/stylesheets/all';\n```\n\n```scss\n// path/to/my/scss/files/main/scss/my-custom_vars.scss\n\n// Colors\n$color-primary: #2c3e50;\n$color-secondary: #ad2020;\n$color-secondary-dark: #b0392e;\n\n// Typography\n$font-serif: 'Georgia', 'Times', serif;\n$h2-font-size: 2rem;\n$h3-font-size: 1.75rem;\n$heading-line-height: 1.4;\n\n// Grid/breakpoints\n$small-screen:  540px !default;\n$medium-screen: 620px !default;\n$large-screen:  1120px !default;\n```\n\n### Set the base asset path (fonts and images)\nIf you copy the USWDS `dist` directory to a folder on your project or your fonts and images are in the same folder, set the location of the directory with `$asset-path: path/to/my/assets/`. The default is set to `$asset-path: ../`. This will be appended to the font and image path variables so you only need to set this variable. You can also set the font and image paths individually:\n\n```\n$theme-font-path: path/to/my/fonts;\n$theme-image-path: path/to/my/images;\n```\n\nNOTE: If you plan on upgrading to newer versions of the Design System in the future, or are not using your own forked version of the Design System, try to avoid making changes in the Design System folder itself. Doing so could make it impossible to upgrade in the future without undoing your custom changes.\n\n### Main variables that can be customized\n* Colors can be found in the `core/variables` [file, line 35](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L35).\n* Font families can be found in the `core/variables` [file, line 28](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L28).\n* Typography sizing can be found in `core/variables` [file, line 13](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L13).\n* Grid and breakpoint settings can be found in `core/variables` [file, line 87](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L87).\n\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/html` in the site root.\n* **Sass** styles are located in: `src/stylesheets/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js/components (accordion.js, toggle-field-mark.js, toggle-form-input.js, validator.js)`.\n* **Fonts** are located in: `src/fonts`.\n* **Images** and icons are located in: `src/img`.\n\n\n## Browser support\n\nWe’ve designed the Design System to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the Design System (1.0) is designed to support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 9 and up. The next major release (2.0) will follow the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we will officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the Design System version 2.0 will support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe Design System also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the Design System. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the Design System in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the Design System style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in the U.S. Web Design System leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"46a752e32823b99a65e39b1261b6e7d8c2931ab6","_id":"uswds@2.0.0-alpha","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-sAmNaobZH0fjGEcHVxz7YELehMFqgS1KlxyUX8kpGahMYOjm02Xx7Q6hPHC8IvIY+Rl5Q17FADeZeKqm3vEnGw==","shasum":"2f541f166168e39ef42ac065c548a1459a7417a4","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-alpha.tgz","fileCount":1208,"unpackedSize":17291383,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbTN7XCRA9TVsSAnZWagAAwpYP/Ahk8orDC3WGefB3JMeh\nADCkk65wH+o32KJkAtvhpk4GNdPYRWEMRZrwDo2zKWeb9dbCfwwpl4B7YA/+\n1Ud9AUO4OjtTkaKC1bD65aoWlEYNBEx1W4sio6iclbmPW9QDJLXaw4UBzSHW\nrbV3wqcJmlkyml63fiXuvpmmm+aDsazNtppmMVwRl8m1V2mD5i4cUcKyQzQn\ncIKTOCUepaFXEGHKxCjaK6PZ+MQx+BdaFob1purvtDRNGqC0FBdMJ2qONTF+\nQEKEj8k9aKkUi33EP4aY7u6etyHFZlzt6O9Xz6xBP7eQwmpVTPA/ttmjsfIK\notlvzdUwZOLzbpWi0B7jmLrJcP04JYJfX/AO8sHGM8tgbydtEg1xgNYqiI11\nReKKjD4t326fkrKt7prc90YoVYtBhI6r4pfYAq+gjY+qEyfCmVq8BldVKYZR\noZ+uVCs1DTVbmonCZFEkFGzRoprYWs8Sty2m5YgbNrgfo/VI193xHvURn4za\nF13MwLepvWJVtozh74HBmtJZP1HGD69XxzZc8ZbrVI6Vl8sPxb/5reUfDW3Z\ndvUw9FTtnM0BDeHw16qmCvI35prENFLbzfxqray8frRCwdd6knbglm1ran+m\nReptEyFz4ZqcgM1zK4yGnNwawaNd5QWBmUZeK+opVvZT54cVUh4AD3J2NcRD\nk8zL\r\n=GwC7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDBwbjs0qO+L2o3o1MyDj88Li8qGFVPyXlGm5/3lWDOQAIgaAoZF8U0wcxWObT12h0qcdxCULwo6nr5fLdUGzgMoNI="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-alpha_1531764438924_0.8095937522426839"},"_hasShrinkwrap":false},"2.0.0-alpha.1":{"name":"uswds","version":"2.0.0-alpha.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-combine-mq":"^0.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^1.1.1","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# U.S. Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [U.S. Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the Design System itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the Design System and documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the Design System](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Importing assets](#importing-assets)\n    * [Sass](#sass)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization and theming](#customization-and-theming)\n  * [Set the base asset path (fonts and images)](#set-the-base-asset-path-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nThe components and style guide of the U.S. Web Design System follows industry-standard web accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created the U.S. Web Design System for designers and developers. The U.S. Web Design System is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the Design System can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the Design System — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the Design System are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the Design System\n\nThere are a few different ways to use the Design System within your project. Which one you choose depends on the needs of your project and how you are most comfortable working. Here are a few notes on what to consider when deciding which installation method to use:\n\n*Download the Design System if:*\n- You are not familiar with `npm` and package management.\n\n*Use the Design System `npm` package if:*\n- You are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/latest) from the latest release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-1.0.0/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-1.0.0/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project.\n\n3. To use the Design System on your project, you’ll need to reference the [CSS (*C*ascading *S*tyle *S*heets)](https://developer.mozilla.org/en-US/docs/Web/CSS) and JavaScript files in each HTML page or dynamic templates in your project. (We also provide Sass (SCSS) files in the zip file which you can compile to CSS. See [Sass](#sass).)\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-1.0.0/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-1.0.0/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both files, the CSS and the JavaScript, in two versions — a minified version, and an un-minified one. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. And the un-minified files are better if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the Design System.\n\n### Install using npm\n\n`npm` is a package manager for Node based projects. The U.S. Web Design System maintains a [`uswds` package](https://www.npmjs.com/package/uswds) for you to utilize both the pre-compiled and compiled files on your project.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `src/` or the compiled files in the `dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── html/\n│   ├── img/\n│   ├── js/\n└── src/\n    ├── fonts/\n    ├── img/\n    ├── js/\n    ├── stylesheets/\n    └── templates/\n```\n\n#### Importing assets\n\nSince you are already using `npm`, the U.S. Web Design System team recommends leveraging the ability to write custom scripts. Here are some links to how we do this with our docs website using `npm` + [`gulp`](http://gulpjs.com/):\n\n[Link to `npm` scripts example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/package.json#L28)\n\n[Link to gulpfile.js example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/gulpfile.js)\n\n#### Sass\n\nThe Design System is easily customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The main Sass (SCSS) source file is located here:\n\n```\nnode_modules/uswds/src/stylesheets/uswds.scss\n```\n\nGlobal variables are defined in the `node_modules/uswds/src/stylesheets/core/_variables.scss` file. Custom theming can be done by copying the `_variables.scss` file into your own project’s Sass folder, changing applicable variable values, and importing it before `uswds.scss`.\n\nBelow is an example of how you might setup your main Sass file to achieve this:\n\n```scss\n@import 'variables.scss'; # Custom Sass variables file\n@import 'node_modules/uswds/src/stylesheets/uswds.scss';\n```\n\nYou can now use your copied version of `_variables.scss` to override any styles to create a more custom look and feel to your application.\n\nThe Design System uses [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets (`css/uswds.min.css` and `css/uswds.css`) however prefixes will not be applied when using the Sass source files directly. If your project requires the use of Sass and vendor prefixes we recommend incorportaing a plugin such as [Autoprefixer](https://github.com/postcss/autoprefixer) into your build process.\n\n#### JavaScript\n`require('uswds')` will load all of the U.S. Web Design System’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute the U.S. Web Design System, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* Uses **[Bourbon](http://bourbon.io/)** for its simple and lightweight Sass mixin library, and the **[Neat](http://neat.bourbon.io/)** library for the grid framework. Bourbon and Neat are open-source products from **[thoughtbot](https://thoughtbot.com/)**.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of the U.S. Web Design System.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-cool_feature-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided and, if necessary, defined in the `core/variables` scss file.\n* Media queries are built **mobile first**.\n* **Spacing units** are as much as possible defined as rem or em units so they scale appropriately with text size. Pixels can be used for detail work and should not exceed 5px (For example: 3px borders).\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the Design System.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization and theming\n\nThe Design System can be customized to use different typography, colors and grid systems. The easiest way to do this is to use Sass and override the Design System’s global variables. If it isn’t possible to use Sass, do theming by overriding the CSS rules in the Design System set.\n\nTo start theming through Sass, copy the `core/variables` file into your own project’s Sass folder, changing applicable variable values, and importing it before the WDS. Below is an example of customizing the import of the Design System's all.scss file.\n\n```scss\n// src/main.scss\n@import 'path/to/my/scss/files/main/scss/my-custom-vars';\n@import 'lib/uswds/src/stylesheets/all';\n```\n\n```scss\n// path/to/my/scss/files/main/scss/my-custom_vars.scss\n\n// Colors\n$color-primary: #2c3e50;\n$color-secondary: #ad2020;\n$color-secondary-dark: #b0392e;\n\n// Typography\n$font-serif: 'Georgia', 'Times', serif;\n$h2-font-size: 2rem;\n$h3-font-size: 1.75rem;\n$heading-line-height: 1.4;\n\n// Grid/breakpoints\n$small-screen:  540px !default;\n$medium-screen: 620px !default;\n$large-screen:  1120px !default;\n```\n\n### Set the base asset path (fonts and images)\nIf you copy the USWDS `dist` directory to a folder on your project or your fonts and images are in the same folder, set the location of the directory with `$asset-path: path/to/my/assets/`. The default is set to `$asset-path: ../`. This will be appended to the font and image path variables so you only need to set this variable. You can also set the font and image paths individually:\n\n```\n$theme-font-path: path/to/my/fonts;\n$theme-image-path: path/to/my/images;\n```\n\nNOTE: If you plan on upgrading to newer versions of the Design System in the future, or are not using your own forked version of the Design System, try to avoid making changes in the Design System folder itself. Doing so could make it impossible to upgrade in the future without undoing your custom changes.\n\n### Main variables that can be customized\n* Colors can be found in the `core/variables` [file, line 35](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L35).\n* Font families can be found in the `core/variables` [file, line 28](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L28).\n* Typography sizing can be found in `core/variables` [file, line 13](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L13).\n* Grid and breakpoint settings can be found in `core/variables` [file, line 87](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L87).\n\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/html` in the site root.\n* **Sass** styles are located in: `src/stylesheets/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js/components (accordion.js, toggle-field-mark.js, toggle-form-input.js, validator.js)`.\n* **Fonts** are located in: `src/fonts`.\n* **Images** and icons are located in: `src/img`.\n\n\n## Browser support\n\nWe’ve designed the Design System to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the Design System (1.0) is designed to support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 9 and up. The next major release (2.0) will follow the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we will officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the Design System version 2.0 will support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe Design System also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the Design System. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the Design System in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the Design System style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in the U.S. Web Design System leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"24a33da15a3d982a34439d0f38dbf3ba8b1d0b47","_id":"uswds@2.0.0-alpha.1","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-G+2TBP4Bze5dvqM5ey1JlzgFpygtuiR+IxB5B4DX5WlbQPixuHFLTrmhOK+PEIFqQ6PLZ5Aa6XzblK4R2RThPQ==","shasum":"8b1b0efca60ba27f654fc940c7113c830ed59fd9","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-alpha.1.tgz","fileCount":1208,"unpackedSize":17291406,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbT3SYCRA9TVsSAnZWagAAQWEQAJR++ZcRO2NurlPZS0Ji\ndezkjiBZ8d36yvC1wDaLIpmXvD2yb0VrQGRSAkprLEscgovEEDtM+FXCI/Lx\ntpDhE5P2dQp33JTfhjUBEZZWtn2F+DvRp28wnYYTxQxPnT1YHjHK5YAtHHOf\nIvYWKeQ1kY5Hw6IH5gQJ1cTYJR2EMgT9mrD9Ss05HQqHkryJELSFlakt5Gi9\nSvLg5zgAhheYriMUcfRvL/TnGuY2bLX+8g7TEV09ewHuc65IVIexlyErnu9K\nZfTCXbCqw7g/uRlj9SWBdpD+fcg1HBf5obwuhLIRKzKdKuuCf9WbK6YqFiXN\nUXssVODkOTOcCkUro36AqFubpDr0TqGDwqNJjfChjL3oNRuOw0R6BKksbAWt\nW/lmuxCWgpgMW7UJHD52pHpSEhg5GcZ2yqsmMXn2W7hBvymPLeEHycbkTTaJ\n7vi0GFn3lWCMVS7nJka3K4R3nqVbqy4T0glmPeP1WafVWYRs2tBPrzdDs6p3\nxfvuMqDWfZcKWpXidiZodoSvTzUu5yi4g9aAcjV4plZhM0FCVLnehs1DX164\nljWNTKDV8+WbSl6DtGsC8GvDqGirSLKMXVMOpQiFTMt5js5j9usR0u8XTYxZ\nCFEAYzOcIcZpLKVwxDEjjKaOe7Hhx/ImoAFf89tIZSGGDVX5oIXCJVxXUcjn\nPpBG\r\n=Qjx2\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDvuLG8JvXVvGC6AF84p4dnxblaerspPDMYGw7gt6bHwAiAskRwLF0mPy7vWQOSQMslw7eQ3dTJuynLCn/aTMGFzZw=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-alpha.1_1531933847776_0.08943757642164796"},"_hasShrinkwrap":false},"1.6.7":{"name":"uswds","version":"1.6.7","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"6ef5bf0ca47d58e24d8473a3ee38c6d0a4b5f782","_id":"uswds@1.6.7","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-uehXhZeBR/a5ePMQkImK77mJgyb06qC6J5wspbuiDlgrZenRH2IEVbnvvKmlv3P/D3vfw6vhHUKIzWuE8pe2iA==","shasum":"85ffa94a26da333e7e709b9fbc7292edab04ac82","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.7.tgz","fileCount":650,"unpackedSize":5590951,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbVhLoCRA9TVsSAnZWagAAe3oP/3CqyapuP/TvEcEa3Fga\n2J7SVv2W48twzzwkdfGNXp6TdI0TJkXnx6m9pFNosUS4prh9LjM8L6CRg2h9\n85DoBY+zsXbSds2uBL7iM2opFGtpSFQn0bDiNMmGxwBt0BdBttbbJJKjNNn/\nJ/8pHw9FQFAq7Q56VFjH9kEJyP2LZHFKU4IgRAPSGY2FgkiJ6+7+o+Lk5I8x\nni+UM8vbbyjw8m2UZp5x9aYLRWcT1sqTkCH6JPQNVd6sPtJ0GXSjM5xFSPqO\nYKoOuadR4NoI1CFd5B2c3Kg3amAjWb1jc6NNezs2sJpKZSquaRVivmaBYcY3\np7f7kUhQCriVhshUko9rsI5iRwJpfsRHA0/cnaQYUNTEZG7BHNuS+2k1h3DG\nCbABFRhViSZ1mE3xmCL/nKpRKacKNStmJRl7Igr3lZK8tfuI0092QslHDOAP\nA44XPWiPRdTYPgui0QoocUkzNau79Hv6N57w6K62NzB1WcPE+mDmCjyDoMJf\n5Fc3uUpe6VoIRpONFuavoHeTip8s5p+qyUGBNkoUph20AgmX6gBy+TGYbjPA\nXW9c/q/nn4wqSZDKTGyq8i2AjTX8bAtifiqxnAzaH1ctiGRdM3VNrQYG1hx6\nUuLzAhkB5H2PlvXK4FusvpTpIUt8h3jRv6HqWOQylc9TUg4ANyMvCj1NrDdy\nCKcB\r\n=DRKl\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCy5GSQgV1OjkFc4/vPGuM33f7yfAxTUVVXn+DG45jJOQIgfJYevuw8bUcttoax5EwS7MjkclTzp4Zp28U4So/BhNM="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.7_1532367592413_0.6289344206100569"},"_hasShrinkwrap":false},"1.6.8":{"name":"uswds","version":"1.6.8","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"3f3fcca941d7f165a88aebe240abd97448560819","_id":"uswds@1.6.8","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-W0IFpBP7ycOzqxrSJ7B2j8KGEm0HcUZBIXmhmDeHW122jRMfHHwuPBP6vgh78IgkSv0mH3900Fa5XumkjpSBxg==","shasum":"bb6d7307fbb7198c1c78c5269991575addf34af3","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.8.tgz","fileCount":651,"unpackedSize":5593415,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbaIK7CRA9TVsSAnZWagAAbT8QAJLTzbqWqMdr3L7A2Vp2\nb3F0bKj3SP2MBHRyGM9ULkdFcAnEJLagQKDDudC3ePuGpypkhDvfzpIrlpPu\n4F8Cn8da9auk8R6HgHssp/5zkGShjQPsZ2MM8s+dxO7MfhI5unTHFNRSwgOA\neD0e3IdKwh/0jl5q6WwUgqk2RCmI78b5KCCXgf0wFAyV/6/D9S4Aqepy6vQA\nKnTEfy6ThsKUj7iE0U1nxaQq1M5bBD58H4MeQH++cJOoko1eH3Ki4oY1S1qK\nMlTQ7iDhu08ZnbhJSLej1LDqX90Db6qyGqQbPQMv8d5l344sHxv/sgLQgzwD\n7zw5sTCXTabkYXMZQGibGRhv3V9QKnEiyfXkoCJ2NSVP57hcAZXJzyBL7IYP\noZah9RDE58eVIYl0EiBl7t8GtGc2QF4s8IhS4gjetvDK219mop10pWBOiwHr\nG2qhAlzn+HLGGRYJk0rxvMXuiknhi4dMZ5g1FE/c/DUqnrDHV9uCbcu1U4EJ\n6ztoYwzjuIYrNMeRNfIf+5G2wEIL6XqBIctVV6OT1EGDeLHKjGVeGHK9sV+l\nSdQDZw5SBXBSiCzLWEK+/LciM2JAFFZOjYS3M6IHTLRIGvTSZOOmOORRqkRN\nj40G0tqXhhgFzTi7abD8SPfCl1x0NnNxGCGEef8J2Q1fmtZckT/0kdqPpImL\n9VyY\r\n=lXMo\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDrrYHCT/6POnrHxXNPB5/4R4f+rN8vaJKY68L3zHyn0gIgbug6rEOR7bXaUMdrkzUPMAYEuSIuCs/i4v2pBbtKXME="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.8_1533575866275_0.27673698471146757"},"_hasShrinkwrap":false},"2.0.0-alpha.2":{"name":"uswds","version":"2.0.0-alpha.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","gulp-postcss":"^7.0.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","autoprefixer":"^9.0.0","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","css-mqpacker":"^7.0.0","cssnano":"^4.0.3","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# U.S. Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [U.S. Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the Design System itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the Design System and documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the Design System](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Importing assets](#importing-assets)\n    * [Sass](#sass)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization and theming](#customization-and-theming)\n  * [Set the base asset path (fonts and images)](#set-the-base-asset-path-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nThe components and style guide of the U.S. Web Design System follows industry-standard web accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created the U.S. Web Design System for designers and developers. The U.S. Web Design System is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the Design System can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the Design System — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the Design System are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the Design System\n\nThere are a few different ways to use the Design System within your project. Which one you choose depends on the needs of your project and how you are most comfortable working. Here are a few notes on what to consider when deciding which installation method to use:\n\n*Download the Design System if:*\n- You are not familiar with `npm` and package management.\n\n*Use the Design System `npm` package if:*\n- You are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/latest) from the latest release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-1.0.0/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-1.0.0/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project.\n\n3. To use the Design System on your project, you’ll need to reference the [CSS (*C*ascading *S*tyle *S*heets)](https://developer.mozilla.org/en-US/docs/Web/CSS) and JavaScript files in each HTML page or dynamic templates in your project. (We also provide Sass (SCSS) files in the zip file which you can compile to CSS. See [Sass](#sass).)\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-1.0.0/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-1.0.0/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both files, the CSS and the JavaScript, in two versions — a minified version, and an un-minified one. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. And the un-minified files are better if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the Design System.\n\n### Install using npm\n\n`npm` is a package manager for Node based projects. The U.S. Web Design System maintains a [`uswds` package](https://www.npmjs.com/package/uswds) for you to utilize both the pre-compiled and compiled files on your project.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `src/` or the compiled files in the `dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n└── src/\n    |── components/\n    ├── fonts/\n    ├── img/\n    ├── js/\n    └── stylesheets/\n```\n\n#### Importing assets\n\nSince you are already using `npm`, the U.S. Web Design System team recommends leveraging the ability to write custom scripts. Here are some links to how we do this with our docs website using `npm` + [`gulp`](http://gulpjs.com/):\n\n[Link to `npm` scripts example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/package.json#L28)\n\n[Link to gulpfile.js example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/gulpfile.js)\n\n#### Sass\n\nThe Design System is easily customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The main Sass (SCSS) source file is located here:\n\n```\nnode_modules/uswds/src/stylesheets/uswds.scss\n```\n\nGlobal variables are defined in the `node_modules/uswds/src/stylesheets/core/_variables.scss` file. Custom theming can be done by copying the `_variables.scss` file into your own project’s Sass folder, changing applicable variable values, and importing it before `uswds.scss`.\n\nBelow is an example of how you might setup your main Sass file to achieve this:\n\n```scss\n@import 'variables.scss'; # Custom Sass variables file\n@import 'node_modules/uswds/src/stylesheets/uswds.scss';\n```\n\nYou can now use your copied version of `_variables.scss` to override any styles to create a more custom look and feel to your application.\n\nThe Design System uses [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets (`css/uswds.min.css` and `css/uswds.css`) however prefixes will not be applied when using the Sass source files directly. If your project requires the use of Sass and vendor prefixes we recommend incorportaing a plugin such as [Autoprefixer](https://github.com/postcss/autoprefixer) into your build process.\n\n#### JavaScript\n`require('uswds')` will load all of the U.S. Web Design System’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute the U.S. Web Design System, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* Uses **[Bourbon](http://bourbon.io/)** for its simple and lightweight Sass mixin library, and the **[Neat](http://neat.bourbon.io/)** library for the grid framework. Bourbon and Neat are open-source products from **[thoughtbot](https://thoughtbot.com/)**.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of the U.S. Web Design System.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-cool_feature-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided and, if necessary, defined in the `core/variables` scss file.\n* Media queries are built **mobile first**.\n* **Spacing units** are as much as possible defined as rem or em units so they scale appropriately with text size. Pixels can be used for detail work and should not exceed 5px (For example: 3px borders).\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the Design System.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization and theming\n\nThe Design System can be customized to use different typography, colors and grid systems. The easiest way to do this is to use Sass and override the Design System’s global variables. If it isn’t possible to use Sass, do theming by overriding the CSS rules in the Design System set.\n\nTo start theming through Sass, copy the `core/variables` file into your own project’s Sass folder, changing applicable variable values, and importing it before the WDS. Below is an example of customizing the import of the Design System's all.scss file.\n\n```scss\n// src/main.scss\n@import 'path/to/my/scss/files/main/scss/my-custom-vars';\n@import 'lib/uswds/src/stylesheets/all';\n```\n\n```scss\n// path/to/my/scss/files/main/scss/my-custom_vars.scss\n\n// Colors\n$color-primary: #2c3e50;\n$color-secondary: #ad2020;\n$color-secondary-dark: #b0392e;\n\n// Typography\n$font-serif: 'Georgia', 'Times', serif;\n$h2-font-size: 2rem;\n$h3-font-size: 1.75rem;\n$heading-line-height: 1.4;\n\n// Grid/breakpoints\n$small-screen:  540px !default;\n$medium-screen: 620px !default;\n$large-screen:  1120px !default;\n```\n\n### Set the base asset path (fonts and images)\nIf you copy the USWDS `dist` directory to a folder on your project or your fonts and images are in the same folder, set the location of the directory with `$asset-path: path/to/my/assets/`. The default is set to `$asset-path: ../`. This will be appended to the font and image path variables so you only need to set this variable. You can also set the font and image paths individually:\n\n```\n$theme-font-path: path/to/my/fonts;\n$theme-image-path: path/to/my/images;\n```\n\nNOTE: If you plan on upgrading to newer versions of the Design System in the future, or are not using your own forked version of the Design System, try to avoid making changes in the Design System folder itself. Doing so could make it impossible to upgrade in the future without undoing your custom changes.\n\n### Main variables that can be customized\n* Colors can be found in the `core/variables` [file, line 35](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L35).\n* Font families can be found in the `core/variables` [file, line 28](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L28).\n* Typography sizing can be found in `core/variables` [file, line 13](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L13).\n* Grid and breakpoint settings can be found in `core/variables` [file, line 87](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L87).\n\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/html` in the site root.\n* **Sass** styles are located in: `src/stylesheets/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `src/fonts`.\n* **Images** and icons are located in: `src/img`.\n\n\n## Browser support\n\nWe’ve designed the Design System to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the Design System (1.0) is designed to support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 9 and up. The next major release (2.0) will follow the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we will officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the Design System version 2.0 will support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe Design System also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the Design System. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the Design System in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the Design System style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in the U.S. Web Design System leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"aec7ef4bdd223ea9d1606edbaae09ef21e535ae3","_id":"uswds@2.0.0-alpha.2","_npmVersion":"6.1.0","_nodeVersion":"8.9.4","_npmUser":{"name":"adam.biagianti","email":"adam.biagianti@gsa.gov"},"dist":{"integrity":"sha512-lM1Idk6XLRAVB7UgjG4OMZEkoED9AeLR6iz11y4dWaqiBgpMvhCSPN3dtuW1MiWg+sHBX9XOksPfaL3DpA+k+A==","shasum":"358389dbdfe7833ddfc0ff000a3cd6501c054afe","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-alpha.2.tgz","fileCount":1352,"unpackedSize":24576220,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbev4bCRA9TVsSAnZWagAARD0P/2mY4XNtBkrw6k0X2DVw\nw/d3We68Wcj5I2yoHLwlobJ5hX3HptkduSdJd3hT+0AFrIaeuvDdvi9F6YUA\noYD7owSMXQmFG/mMA7bOlacFwfIcSC0NpDlzQB7mh2gIbD8rRYiQeWQ03ymh\n64nlLTII4oxIWY/Iggw+ovP/JrGniDC4WjStOK3qFGlm+ZklOzdewip4ayQf\nzpgQyDXH4OCWwfcy/QknKi1eKuZMabp4MlpGYirjEqHA+uatHPOM7a2HgtRZ\n2m9WwDEjh3SDv9yObMGooLEelwyvB1pCyPy/nR7DfeyAaoDHM1XHXAaVmjOM\nwNEkux3cM7l+taiBAsBVDwB0qwaBCIQ0d0biAJXvL+gIRniC/Wpnd5yI//oQ\nfDYA27bsUGX5XqlJQC1rMtStPKT9gVU5ghQZUwiQ/MrYDE7C5qANSFTOq3w2\n2ItXr2rcKusmAhB5C5q6EJ7q+hES+Uy6BQXKmqAkpowoNqqPmNvpl4qpwub4\nNsnpOcZYO/7/VIYxZoLC81w+5z+mC/g1BXy7gmhmTCXxQJ+c/A/v6ucIBXJt\nxl1Yc3y5M9Q4yC2cTv5Oc+asUJlxBgZKBRbblba46m/ZrfWUwczve/PdWGOk\n9YVAnkfasZO4MnTr//HzhRdKf/ewoU9My/0CC+LHOLETnp7CqzhV2mlC+hwC\nr0s/\r\n=CsEN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGN/1q5gVgsGC+v6RpolMAKaXAPCXrogK9Bet1JOaHynAiEA6bCqc5thyl8drP+C2NIhXl8I4oe8fNe/qWqNE7w8WzE="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-alpha.2_1534787098104_0.07437362141353532"},"_hasShrinkwrap":false},"2.0.0-alpha.3":{"name":"uswds","version":"2.0.0-alpha.3","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","gulp-postcss":"^7.0.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","autoprefixer":"^9.1.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.0.3","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.5.0","stylelint-scss":"^3.3.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# U.S. Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [U.S. Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the Design System itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the Design System and documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the Design System](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Importing assets](#importing-assets)\n    * [Sass](#sass)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization and theming](#customization-and-theming)\n  * [Set the base asset path (fonts and images)](#set-the-base-asset-path-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nThe components and style guide of the U.S. Web Design System follows industry-standard web accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created the U.S. Web Design System for designers and developers. The U.S. Web Design System is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the Design System can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the Design System — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the Design System are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the Design System\n\nThere are a few different ways to use the Design System within your project. Which one you choose depends on the needs of your project and how you are most comfortable working. Here are a few notes on what to consider when deciding which installation method to use:\n\n*Download the Design System if:*\n- You are not familiar with `npm` and package management.\n\n*Use the Design System `npm` package if:*\n- You are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/latest) from the latest release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-1.0.0/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-1.0.0/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project.\n\n3. To use the Design System on your project, you’ll need to reference the [CSS (*C*ascading *S*tyle *S*heets)](https://developer.mozilla.org/en-US/docs/Web/CSS) and JavaScript files in each HTML page or dynamic templates in your project. (We also provide Sass (SCSS) files in the zip file which you can compile to CSS. See [Sass](#sass).)\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-1.0.0/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-1.0.0/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both files, the CSS and the JavaScript, in two versions — a minified version, and an un-minified one. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. And the un-minified files are better if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the Design System.\n\n### Install using npm\n\n`npm` is a package manager for Node based projects. The U.S. Web Design System maintains a [`uswds` package](https://www.npmjs.com/package/uswds) for you to utilize both the pre-compiled and compiled files on your project.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `src/` or the compiled files in the `dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n└── src/\n    |── components/\n    ├── fonts/\n    ├── img/\n    ├── js/\n    └── stylesheets/\n```\n\n#### Importing assets\n\nSince you are already using `npm`, the U.S. Web Design System team recommends leveraging the ability to write custom scripts. Here are some links to how we do this with our docs website using `npm` + [`gulp`](http://gulpjs.com/):\n\n[Link to `npm` scripts example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/package.json#L28)\n\n[Link to gulpfile.js example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/gulpfile.js)\n\n#### Sass\n\nThe Design System is easily customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The main Sass (SCSS) source file is located here:\n\n```\nnode_modules/uswds/src/stylesheets/uswds.scss\n```\n\nGlobal variables are defined in the `node_modules/uswds/src/stylesheets/core/_variables.scss` file. Custom theming can be done by copying the `_variables.scss` file into your own project’s Sass folder, changing applicable variable values, and importing it before `uswds.scss`.\n\nBelow is an example of how you might setup your main Sass file to achieve this:\n\n```scss\n@import 'variables.scss'; # Custom Sass variables file\n@import 'node_modules/uswds/src/stylesheets/uswds.scss';\n```\n\nYou can now use your copied version of `_variables.scss` to override any styles to create a more custom look and feel to your application.\n\nThe Design System uses [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets (`css/uswds.min.css` and `css/uswds.css`) however prefixes will not be applied when using the Sass source files directly. If your project requires the use of Sass and vendor prefixes we recommend incorportaing a plugin such as [Autoprefixer](https://github.com/postcss/autoprefixer) into your build process.\n\n#### JavaScript\n`require('uswds')` will load all of the U.S. Web Design System’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute the U.S. Web Design System, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* Uses **[Bourbon](http://bourbon.io/)** for its simple and lightweight Sass mixin library, and the **[Neat](http://neat.bourbon.io/)** library for the grid framework. Bourbon and Neat are open-source products from **[thoughtbot](https://thoughtbot.com/)**.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of the U.S. Web Design System.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-cool_feature-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided and, if necessary, defined in the `core/variables` scss file.\n* Media queries are built **mobile first**.\n* **Spacing units** are as much as possible defined as rem or em units so they scale appropriately with text size. Pixels can be used for detail work and should not exceed 5px (For example: 3px borders).\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the Design System.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization and theming\n\nThe Design System can be customized to use different typography, colors and grid systems. The easiest way to do this is to use Sass and override the Design System’s global variables. If it isn’t possible to use Sass, do theming by overriding the CSS rules in the Design System set.\n\nTo start theming through Sass, copy the `core/variables` file into your own project’s Sass folder, changing applicable variable values, and importing it before the WDS. Below is an example of customizing the import of the Design System's all.scss file.\n\n```scss\n// src/main.scss\n@import 'path/to/my/scss/files/main/scss/my-custom-vars';\n@import 'lib/uswds/src/stylesheets/all';\n```\n\n```scss\n// path/to/my/scss/files/main/scss/my-custom_vars.scss\n\n// Colors\n$color-primary: #2c3e50;\n$color-secondary: #ad2020;\n$color-secondary-dark: #b0392e;\n\n// Typography\n$font-serif: 'Georgia', 'Times', serif;\n$h2-font-size: 2rem;\n$h3-font-size: 1.75rem;\n$heading-line-height: 1.4;\n\n// Grid/breakpoints\n$small-screen:  540px !default;\n$medium-screen: 620px !default;\n$large-screen:  1120px !default;\n```\n\n### Set the base asset path (fonts and images)\nIf you copy the USWDS `dist` directory to a folder on your project or your fonts and images are in the same folder, set the location of the directory with `$asset-path: path/to/my/assets/`. The default is set to `$asset-path: ../`. This will be appended to the font and image path variables so you only need to set this variable. You can also set the font and image paths individually:\n\n```\n$theme-font-path: path/to/my/fonts;\n$theme-image-path: path/to/my/images;\n```\n\nNOTE: If you plan on upgrading to newer versions of the Design System in the future, or are not using your own forked version of the Design System, try to avoid making changes in the Design System folder itself. Doing so could make it impossible to upgrade in the future without undoing your custom changes.\n\n### Main variables that can be customized\n* Colors can be found in the `core/variables` [file, line 35](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L35).\n* Font families can be found in the `core/variables` [file, line 28](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L28).\n* Typography sizing can be found in `core/variables` [file, line 13](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L13).\n* Grid and breakpoint settings can be found in `core/variables` [file, line 87](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L87).\n\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/html` in the site root.\n* **Sass** styles are located in: `src/stylesheets/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `src/fonts`.\n* **Images** and icons are located in: `src/img`.\n\n\n## Browser support\n\nWe’ve designed the Design System to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the Design System (1.0) is designed to support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 9 and up. The next major release (2.0) will follow the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we will officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the Design System version 2.0 will support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe Design System also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the Design System. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the Design System in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the Design System style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in the U.S. Web Design System leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"609133936d3f02620b9a2897f0575793f1131165","_id":"uswds@2.0.0-alpha.3","_npmVersion":"6.1.0","_nodeVersion":"8.9.4","_npmUser":{"name":"adam.biagianti","email":"adam.biagianti@gsa.gov"},"dist":{"integrity":"sha512-vANcU2QHkm9eOvAQqwDtdqqB6o0V3pg6kx+RveVQ0vKG9Fvqx08/r9JsMxaDokoda1r2w5yXwj8jZYgr6q/bWg==","shasum":"d3cbd93ca9933fb91343b6914c43631013c8d67a","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-alpha.3.tgz","fileCount":1368,"unpackedSize":24700498,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbju+BCRA9TVsSAnZWagAAePIP/0BGGIh2zUqWC/fH/GSv\nZJ4dJdHLO3CT4RocyKtoarh+31lNIhULjpfrEG2hWpsZAoZJ4jktXT5R9q/E\nEdICF6QSZegREd947tkfmHG1oeauaoCOvMqeJ6hfArJYr42mEgr21TaIf4V4\nazoL4qyLbj91dMBNGNRq+Q2dchbBQuUBPmOYtUEjuNM7ejpPIvICFsLu6xq/\njEDM+OS7aIAF835g0lxZJCQTzbPrmzkdvYepb2n/4nlu60QzcYYAXmV/zKTL\nZKUQtmRD6Dx7O4qxjqF8r7gtg/chT0rlZ1872zYj3Y/fV49wVlV4PmZA6Ybs\n4AX2JqG9vPrnU712Xv29a7AUEsCS764Md6nEnuqx4tdiVLBHIdMbUHTNBWJo\ntIzYpEt8wzP18ydKRo0iVSRojblTpGteDFFt9WVZatb2bKDlX7QtICoUSYJ7\n7xlMXwqo3tRZivrysCQavfMU3iFvMJnbea9KZ776kTt4h31QhEMPbDdRfHOh\nCiAptG82JXBTeAr9NcrXhXCNCJR66QIoF3R2z8iYIftZpIzYPskDRg40SVg3\n44D4tVykxJfjN5laJQFBJgR21fKAXe10RU2pKxnh1TKZbqDyYXYyRu/U8S8W\n8MlvslZF15qN+T5q2ikOCniO1SV2rw7SuLDQi0fYEJZCIjczLuGUAasnaGz3\n0uNM\r\n=fszx\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD8SXiEih+rcDf6KCPhFslrVWZwdg4e0JfsXxkewnqD0gIhAN3V0z7h/ojlHnvJX4sNSeCZvn3NakW4Wath+83r2QR3"}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-alpha.3_1536094079657_0.748088801858934"},"_hasShrinkwrap":false},"2.0.0-beta":{"name":"uswds","version":"2.0.0-beta","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","gulp-postcss":"^7.0.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^8.0.2"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","autoprefixer":"^9.1.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.0.3","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.5.0","stylelint-scss":"^3.3.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# U.S. Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [U.S. Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the Design System itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the Design System and documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the Design System](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Importing assets](#importing-assets)\n    * [Sass](#sass)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization and theming](#customization-and-theming)\n  * [Set the base asset path (fonts and images)](#set-the-base-asset-path-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nThe components and style guide of the U.S. Web Design System follows industry-standard web accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created the U.S. Web Design System for designers and developers. The U.S. Web Design System is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the Design System can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the Design System — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the Design System are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the Design System\n\nThere are a few different ways to use the Design System within your project. Which one you choose depends on the needs of your project and how you are most comfortable working. Here are a few notes on what to consider when deciding which installation method to use:\n\n*Download the Design System if:*\n- You are not familiar with `npm` and package management.\n\n*Use the Design System `npm` package if:*\n- You are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/latest) from the latest release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-1.0.0/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-1.0.0/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project.\n\n3. To use the Design System on your project, you’ll need to reference the [CSS (*C*ascading *S*tyle *S*heets)](https://developer.mozilla.org/en-US/docs/Web/CSS) and JavaScript files in each HTML page or dynamic templates in your project. (We also provide Sass (SCSS) files in the zip file which you can compile to CSS. See [Sass](#sass).)\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-1.0.0/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-1.0.0/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both files, the CSS and the JavaScript, in two versions — a minified version, and an un-minified one. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. And the un-minified files are better if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the Design System.\n\n### Install using npm\n\n`npm` is a package manager for Node based projects. The U.S. Web Design System maintains a [`uswds` package](https://www.npmjs.com/package/uswds) for you to utilize both the pre-compiled and compiled files on your project.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `src/` or the compiled files in the `dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n└── src/\n    |── components/\n    ├── fonts/\n    ├── img/\n    ├── js/\n    └── stylesheets/\n```\n\n#### Importing assets\n\nSince you are already using `npm`, the U.S. Web Design System team recommends leveraging the ability to write custom scripts. Here are some links to how we do this with our docs website using `npm` + [`gulp`](http://gulpjs.com/):\n\n[Link to `npm` scripts example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/package.json#L28)\n\n[Link to gulpfile.js example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/gulpfile.js)\n\n#### Sass\n\nThe Design System is easily customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The main Sass (SCSS) source file is located here:\n\n```\nnode_modules/uswds/src/stylesheets/uswds.scss\n```\n\nGlobal variables are defined in the `node_modules/uswds/src/stylesheets/core/_variables.scss` file. Custom theming can be done by copying the `_variables.scss` file into your own project’s Sass folder, changing applicable variable values, and importing it before `uswds.scss`.\n\nBelow is an example of how you might setup your main Sass file to achieve this:\n\n```scss\n@import 'variables.scss'; # Custom Sass variables file\n@import 'node_modules/uswds/src/stylesheets/uswds.scss';\n```\n\nYou can now use your copied version of `_variables.scss` to override any styles to create a more custom look and feel to your application.\n\nThe Design System uses [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets (`css/uswds.min.css` and `css/uswds.css`) however prefixes will not be applied when using the Sass source files directly. If your project requires the use of Sass and vendor prefixes we recommend incorportaing a plugin such as [Autoprefixer](https://github.com/postcss/autoprefixer) into your build process.\n\n#### JavaScript\n`require('uswds')` will load all of the U.S. Web Design System’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute the U.S. Web Design System, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of the U.S. Web Design System.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-cool_feature-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided and, if necessary, defined in the `core/variables` scss file.\n* Media queries are built **mobile first**.\n* **Spacing units** are as much as possible defined as rem or em units so they scale appropriately with text size. Pixels can be used for detail work and should not exceed 5px (For example: 3px borders).\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the Design System.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization and theming\n\nThe Design System can be customized to use different typography, colors and grid systems. The easiest way to do this is to use Sass and override the Design System’s global variables. If it isn’t possible to use Sass, do theming by overriding the CSS rules in the Design System set.\n\nTo start theming through Sass, copy the `core/variables` file into your own project’s Sass folder, changing applicable variable values, and importing it before the WDS. Below is an example of customizing the import of the Design System's all.scss file.\n\n```scss\n// src/main.scss\n@import 'path/to/my/scss/files/main/scss/my-custom-vars';\n@import 'lib/uswds/src/stylesheets/all';\n```\n\n```scss\n// path/to/my/scss/files/main/scss/my-custom_vars.scss\n\n// Colors\n$color-primary: #2c3e50;\n$color-secondary: #ad2020;\n$color-secondary-dark: #b0392e;\n\n// Typography\n$font-serif: 'Georgia', 'Times', serif;\n$h2-font-size: 2rem;\n$h3-font-size: 1.75rem;\n$heading-line-height: 1.4;\n\n// Grid/breakpoints\n$small-screen:  540px !default;\n$medium-screen: 620px !default;\n$large-screen:  1120px !default;\n```\n\n### Set the base asset path (fonts and images)\nIf you copy the USWDS `dist` directory to a folder on your project or your fonts and images are in the same folder, set the location of the directory with `$asset-path: path/to/my/assets/`. The default is set to `$asset-path: ../`. This will be appended to the font and image path variables so you only need to set this variable. You can also set the font and image paths individually:\n\n```\n$theme-font-path: path/to/my/fonts;\n$theme-image-path: path/to/my/images;\n```\n\nNOTE: If you plan on upgrading to newer versions of the Design System in the future, or are not using your own forked version of the Design System, try to avoid making changes in the Design System folder itself. Doing so could make it impossible to upgrade in the future without undoing your custom changes.\n\n### Main variables that can be customized\n* Colors can be found in the `core/variables` [file, line 35](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L35).\n* Font families can be found in the `core/variables` [file, line 28](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L28).\n* Typography sizing can be found in `core/variables` [file, line 13](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L13).\n* Grid and breakpoint settings can be found in `core/variables` [file, line 87](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L87).\n\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/html` in the site root.\n* **Sass** styles are located in: `src/stylesheets/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `src/fonts`.\n* **Images** and icons are located in: `src/img`.\n\n\n## Browser support\n\nWe’ve designed the Design System to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the Design System (1.0) is designed to support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 9 and up. The next major release (2.0) will follow the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we will officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the Design System version 2.0 will support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe Design System also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the Design System. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the Design System in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the Design System style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in the U.S. Web Design System leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"62bd965a37e2bb43a3873dd9dd5a6a28a5f72717","_id":"uswds@2.0.0-beta","_npmVersion":"6.1.0","_nodeVersion":"8.11.2","_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"dist":{"integrity":"sha512-DQXqyBVzHBKsfZrBLyaARhB93OISqlGZa5Qt77ZP9Ly1+Dm6wmCDFBKyJOALW7GHQnDd2oUQnGrHzO5DRP2cow==","shasum":"666e6c17fc3d609a44dc6be79005d52e2cc9148a","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-beta.tgz","fileCount":1279,"unpackedSize":17409072,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbrUpHCRA9TVsSAnZWagAA4jcP/isXl02nWRhCDra2pUGD\nz9cxrDe3cVHfVr1Vzj9B3sDxibwz6H7rSvme15negcZ3PGlTZ2q9OHNsD3hA\n+vQUNS5sCuthdSWvTYuw5h7ehYnhyp91GqMcjcQlznjNtgze4qQ24oHiaPRp\nRFR75TPGJiqbspSPPKCLp8lpb9GOm2JQN/D86aNNHdIdalLT/3YktqDQNGKi\ntlihiyJg/ANqsVjM88D11pfk485M8f2aIdOzTjJZsVxIz+0ye1liZDhM7Mn4\n7BTY3FeJj/ZC6w6sXl2Jk3V1DxykWTpOq17RNnbtyoULfU1M+HRgMo8fB1wN\nmRnD9uXALrjGCqh3HXDMaMviorPAJOsEtCx7jahwnt9uoyA/ZdFld4HF11yz\nmwVjz+sq7fhuEp9piEleLRFODss6Al627SNrF6NjtZAXF0gUKLjdcfmzvtJW\nDlOqhzaFfNk9Gb2dxnA4Rz3kF4FUbqZWjiCPmJOl3Nlc7a9a/vLtsBRMup+c\n9pwDP1MKHm6+7m044FL6vX9CfoqKS/p2mbpZgZysozro6TwUFzH1Yx7zdgfL\nVQUgQ0/mEg2fa6h2jQmUHB+xtJxi/+7dhy/ZfXjahRYh8BQvSl4FyvDWjGqv\nAGDnkC2QeVhnpXs0jciI/0DdgolELj0xpnGHJld4kCCjveAwOq55pp6Q9l4n\n2TQi\r\n=uG2l\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIEA3OMzfY5p/+5hnDx1mMpPTpErK0HG+9ezc0oAtXRXYAiBL2RAn5Pon4ejBOtXXYPZ61FL4jJopeJcHTz8LXHNXqQ=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-beta_1538083398453_0.5786059034206352"},"_hasShrinkwrap":false},"1.6.9":{"name":"uswds","version":"1.6.9","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"e57e5ea580767028d734d788c8f314f67229c5c6","_id":"uswds@1.6.9","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-k4Sai/5X95Mg3VxLJffg9fTynUEhqiC15Rr+PlwZd4MbR8vnq+eBECNi27Iky7WncwMXg/29ubXAg9eli2jUXQ==","shasum":"4227a286b78c89ccb1dad86dba2c503393fb7c64","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.9.tgz","fileCount":655,"unpackedSize":5600703,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbxNDiCRA9TVsSAnZWagAAGx4P/ROj8N6i9CQ/S801gyy6\nC009CuDReoujaJkjRsLKJkeo9PyHWNOZ3a6SbrMf9Jeed3mavLtxUA6ttrPe\nDJRtlnm9zNisVlVITt4IxqDZX/S5PqHYGLDe93ctUdWF8VlJjIpwuceFXZhs\nvd6dTCnElZC53OU6zyBfbPt6GxMT1L2mQgHZXVy6Ja32lt3D1eZ89hmmCM+3\nG1N+VkgbyEVfd935tR5euhUVtf2pi1kBBh8J8cYUPnC2KKKUOqxjR7wHjf5+\nufz6iHNhSalF9FmK6EAGtXonI8y7lYA+UU9xxS/ppZX3ekVBt9xVLWz7KWyU\nCutKKWMbwQCTSCYwyfTSpApOUs3MaTbrf1ZsBq6yITLBGnR6SKwgF+iQwoZg\n4RmiZM1v2TA+G8fDn0lLPByItnFl3X/9LYIhMEGWNGzz8N9538jATmG+NABB\ncvDLU9+KRJkgTaIAu4FBHlqnsXQbJUyzmvvuo9WA02GinCRePVk481ilsnAC\nZ07/74wwG0pDiVqwAO7MpM+OXfEjVjDZT4cYs4Ou8s/BLIgSOpU1eFkEg8+7\nVrgvravw016vgc0JrG9atHj/UZpAJEZEXVp/nhJpRFTg4E8SEFF8LxVhWR8R\nSyczMSUKvRdODuNBnj03iIi+9000ZtdvQY57wZS8FeSSXZu4Y5UMlsRsKjeK\n0XbE\r\n=x/du\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGfK0+gYUOfpqPa8ykm7E94b+f80jSRmzASgg1DQvvJEAiEAjHtiXUTSwUFYWSNOA60wNQRpsk7MuuCxo9Btq3khrNs="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.9_1539625185082_0.7592423268774549"},"_hasShrinkwrap":false},"2.0.0-beta.2":{"name":"uswds","version":"2.0.0-beta.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","gulp-postcss":"^7.0.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.2"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","autoprefixer":"^9.1.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.0.3","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","handlebars":"^4.0.12","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.5.0","stylelint-scss":"^3.3.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# U.S. Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [U.S. Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the Design System itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the Design System and documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the Design System](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Using the USWDS package](#using-the-uswds-package)\n    * [Sass and theme settings](#sass-and-theme-settings)\n    * [Sass compilation requirements](#sass-compilation-requirements)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization, theming, and tokens](#customization-theming-and-tokens)\n  * [Using tokens in theme settings](#using-tokens-in-theme-settings)\n  * [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nThe components and style guide of the U.S. Web Design System follows industry-standard web accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created the U.S. Web Design System for designers and developers. The U.S. Web Design System is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the Design System can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the Design System — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the Design System are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the Design System\n\nHow you implement the Design System depends on the needs of your project and your workstyle. We recommend implementing the Design System with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the Design System](#download)** if you are not familiar with `npm` and package management.\n\n- **[Use the Design System `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/latest) from the latest release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-2.0.0-beta/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-2.0.0-beta/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the CSS and JavaScript files in each HTML page or dynamic templates in your project. We also provide Sass (.scss) files in the zip package which you can use to generate new CSS with project-specific settings. See [Sass](#sass) for more information.\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-2.0.0-beta/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-2.0.0-beta/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files  if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the Design System.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. The U.S. Web Design System maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds@2.0.0-beta\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the  `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the Design System files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe Design System is easily customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The main Sass (.scss) source file is located here:\n\nThe critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── _uswds-theme.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `_uswds-theme.scss`: Collects all theme files together [**note:** _slated for deprecation by 2.0.0 Beta 2_]\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.css` looks something like the following: it's adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import 'uswds-theme-general';\n@import 'uswds-theme-typography';\n@import 'uswds-theme-spacing';\n@import 'uswds-theme-color';\n@import 'uswds-theme-utilities';\n@import 'uswds';\n@import 'uswds-theme-custom-styles';\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in  [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe Design System requires both **autoprefixing** and **media query** packing to work properly. These are included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n- **autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings:\n\n```\n'> 1%','Last 2 versions', 'IE 11'\n```\n\n- **media query packing** collects all similar media queries together at the end of the compiled stylesheet. USWDS and `uswds-gulp` use [`css-mqpacker`](https://github.com/hail2u/node-css-mqpacker). This is necessary to provide the proper cascade and specificity for utility classes. If you are not implementing utility classes, media query packing may not be necessary — but it it still a good idea.\n\nAdditionally, we recommend using a minifier like [`cssnano`](https://cssnano.co/) to compress your final compiled CSS and sourcemaps like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n`require('uswds')` will load all of the U.S. Web Design System’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute the U.S. Web Design System, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of the U.S. Web Design System.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-cool_feature-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided..\n* Media queries are built **mobile first**.\n* **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://v2.designsystem.digital.gov/style/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the Design System.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settgings), above.\n\nSet theme settings with USWDS style tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Style section](https://v2.designsystem.digital.gov/style/) of USWDS 2.0 documentation for more on the available tokens for [color](https://v2.designsystem.digital.gov/style/color), [spacing units](https://v2.designsystem.digital.gov/style/spacing-units), [typescale](https://v2.designsystem.digital.gov/style/typescale), and more.\n\n**Note:** These style tokens sections are still in progress in USWDS 2.0.0 Beta. We expect to finish them in October 2018.\n\n### Using tokens in theme settings\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```sass\n$theme-site-max-width:              'desktop';\n$theme-site-margins-breakpoint:     'desktop';\n$theme-site-margins-width:          4;\n$theme-site-margins-mobile-width:   2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```sass\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```sass\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units('desktop');\n\n  @include at-media('desktop') {\n    @include u-padding-x(4);\n  }\n}\n```\n\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output  something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;    \n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [v2.designsystem.digital.gov/components](https://v2.designsystem.digital.gov/components)\n* **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `dist/fonts`.\n* **Images** and icons are located in: `dist/img`.\n\n\n## Browser support\n\nWe’ve designed the Design System to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the Design System (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the Design System version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe Design System also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the Design System. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the Design System in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the Design System style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in the U.S. Web Design System leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"4dc78455ee2efeaf56b5496478129c5c81d88480","_id":"uswds@2.0.0-beta.2","_npmVersion":"6.4.1","_nodeVersion":"8.11.2","_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"dist":{"integrity":"sha512-DwrbHnRc7Ro8k6HtR2qnYNxNM7BPhRo6Z7/QmaZpli+rgXvo5SQU+20OmrIiYOhWJ3Ifce5yWwClhRqPIM2ofw==","shasum":"3d928619c37f001fefddc34e5a81ef4e7361db77","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-beta.2.tgz","fileCount":1366,"unpackedSize":17437520,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbxNmpCRA9TVsSAnZWagAAcPIP/2uYT7T7jcFmoQdrc1JB\nf3kgizkPf3ksxw7qA62wZ+a3+I5wY+RybXLiqKhKCgyMTENsUq5YRIU0m29d\n4pjaRyFy94UpAq6malFItulLeRU4/vEQeQL/anoYNLgUmK6GnZ2n9ve0T9Pf\ns8Y/OgNWXdzOKfybHLrOeXYJ7YEA2LLmKBNWmT1AcS2U4EAOHIi//Dq8F7GH\nbWx4cPdIWNeOYQ8I3sjYrBQW9jvrF5YR3AVh7Bf/MDknZsKIcbtr+kM43FqG\n7hGLhn5/NVU1YfbpcN4ekCVt75lSr7fLChAMs/5QWG8B29pmtSoiJ3G/6zTj\nJqQcwLe806pr//XlybdTA6IiYwmKmWEgxRbsu7D0Jt/Qur4psbAprU8tC1Hc\nwm96JjDDTmq6SmrSaWEsl+i6D4X/umNlXu5exoznwQHx4SmSYjfTIwXM4zJ3\n7vmXpTzjOJQCQo9Dbpx8I+XkEp2Ub6C/Id7rMyMx//tRjEhL7R+IMNoC5QBS\nWiP7chdlmvRFvvuLZfF77LzhjwePhRk6G3kMuAheyxQ0UoJ4KPvZ4n1HdM/1\nAohGXIIGY542gVTimlSeJsvVxYiZHms5QgqJ9bEpL0rUlVFc6nWTlom5NUNQ\nmhzvEu+bTebAxs717UP31v+5sNPuErq+QKowZ7H0qjpDrbfjqDMg6U9UOguF\n+TsY\r\n=7msH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIHr47JBCTrvjTTjWNWp83JgFeaq1J3SQB2dk/r5/8M+xAiEAsB8cozUFXp3cuFEff6cz87aN3CLmUs343sE6hnxowG8="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-beta.2_1539627432546_0.3405755463750344"},"_hasShrinkwrap":false},"2.0.0-beta.3":{"name":"uswds","version":"2.0.0-beta.3","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","gulp-postcss":"^7.0.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.2"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","autoprefixer":"^9.1.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.0.3","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","handlebars":"^4.0.12","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.5.0","stylelint-scss":"^3.3.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# U.S. Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [U.S. Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the Design System itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the Design System and documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the Design System](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Using the USWDS package](#using-the-uswds-package)\n    * [Sass and theme settings](#sass-and-theme-settings)\n    * [Sass compilation requirements](#sass-compilation-requirements)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization, theming, and tokens](#customization-theming-and-tokens)\n  * [Using tokens in theme settings](#using-tokens-in-theme-settings)\n  * [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nThe components and style guide of the U.S. Web Design System follows industry-standard web accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created the U.S. Web Design System for designers and developers. The U.S. Web Design System is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the Design System can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the Design System — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the Design System are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the Design System\n\nHow you implement the Design System depends on the needs of your project and your workstyle. We recommend implementing the Design System with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the Design System](#download)** if you are not familiar with `npm` and package management.\n\n- **[Use the Design System `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/tag/v2.0.0-beta.2) from the latest USWDS 2.0.0 Beta release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-2.0.0-beta.2/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-2.0.0-beta.2/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the CSS and JavaScript files in each HTML page or dynamic templates in your project. We also provide Sass (.scss) files in the zip package which you can use to generate new CSS with project-specific settings. See [Sass](#sass) for more information.\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-2.0.0-beta.2/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-2.0.0-beta.2/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files  if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the Design System.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. The U.S. Web Design System maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds@2.0.0-beta.2\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the  `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the Design System files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe Design System is easily customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The main Sass (.scss) source file is located here:\n\nThe critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.css` looks something like the following: it's adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import 'uswds-theme-general';\n@import 'uswds-theme-typography';\n@import 'uswds-theme-spacing';\n@import 'uswds-theme-color';\n@import 'uswds-theme-utilities';\n@import 'uswds';\n@import 'uswds-theme-custom-styles';\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in  [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe Design System requires both **autoprefixing** and **media query** packing to work properly. These are included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n- **autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings:\n\n```\n'> 1%','Last 2 versions', 'IE 11'\n```\n\n- **media query packing** collects all similar media queries together at the end of the compiled stylesheet. USWDS and `uswds-gulp` use [`css-mqpacker`](https://github.com/hail2u/node-css-mqpacker). This is necessary to provide the proper cascade and specificity for utility classes. If you are not implementing utility classes, media query packing may not be necessary — but it it still a good idea.\n\nAdditionally, we recommend using a minifier like [`cssnano`](https://cssnano.co/) to compress your final compiled CSS and sourcemaps like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n`require('uswds')` will load all of the U.S. Web Design System’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute the U.S. Web Design System, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of the U.S. Web Design System.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-cool_feature-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided..\n* Media queries are built **mobile first**.\n* **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://v2.designsystem.digital.gov/style/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the Design System.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settgings), above.\n\nSet theme settings with USWDS style tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Style section](https://v2.designsystem.digital.gov/style/) of USWDS 2.0 documentation for more on the available tokens for [color](https://v2.designsystem.digital.gov/style/color), [spacing units](https://v2.designsystem.digital.gov/style/spacing-units), [typescale](https://v2.designsystem.digital.gov/style/typescale), and more.\n\n**Note:** These style tokens sections are still in progress in USWDS 2.0.0 Beta. We expect to finish them in October 2018.\n\n### Using tokens in theme settings\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```sass\n$theme-site-max-width:              'desktop';\n$theme-site-margins-breakpoint:     'desktop';\n$theme-site-margins-width:          4;\n$theme-site-margins-mobile-width:   2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```sass\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```sass\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units('desktop');\n\n  @include at-media('desktop') {\n    @include u-padding-x(4);\n  }\n}\n```\n\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output  something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;    \n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [v2.designsystem.digital.gov/components](https://v2.designsystem.digital.gov/components)\n* **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `dist/fonts`.\n* **Images** and icons are located in: `dist/img`.\n\n\n## Browser support\n\nWe’ve designed the Design System to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the Design System (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the Design System version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe Design System also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the Design System. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the Design System in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the Design System style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in the U.S. Web Design System leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"887531edd0a8a24ed923e0c0c2a254fbd26e8f7e","_id":"uswds@2.0.0-beta.3","_npmVersion":"6.4.1","_nodeVersion":"8.11.2","_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"dist":{"integrity":"sha512-U4GpyE9A4SrPGlebxcz04+57i110rk2O38p6LTp477YBVAZoialVaMdK8F88iXmlNBUuqWJnnLNLakuNu5Ujqw==","shasum":"80233bf003fdb2e232dc56d1546f9607e0dd4636","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-beta.3.tgz","fileCount":1366,"unpackedSize":17449188,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb11VUCRA9TVsSAnZWagAAEaUQAKUnW7awyt0cGrxPE4e8\nnGinrtml1UKXvIAEQMdNNJ3bixk2IVRxmQtfSCCY8gM86ZCmBIPsHrArksEa\nhlIT+NnpPgN05MpXyKzSuEmaQ/+kHwEPj/oadXhF6kjLp1bgwJMaNaxO6P7H\nC3ARY5RA7SxSGrUBUDmtZGGMJcVKzSmpOuq5z4TbKUuvSZemtjCF2pOwWih6\nQ6B6kuwYlmurj6DatTkV/e5JpLLRRffBzyEzjfy3sbfdQnnDaqobY9sLfonI\neY0t7hetg/xmexcIAywuT9dSOplbBjAIxsxAyraNTE+4d7g4q4ySqaP0Klq4\nt3lZhMfa8jzIFxEw3628mXGwqwz0jrceQdfKl3kBiCpSKVPsaxTgT29kSuHp\nCv7r8yV09sYDMSs/Kn7yXW5mzHKmahQnsf8dPTXGa8n1Z+YlP0gmbj2861md\nHI5NWY4IhTSH9dq6iOM1SN1cJ0gpAqzNsLjFSvJbxFYgnWMfOPShosi0l3yt\nXPYo2t4KD9IkEP7cIGnzo2bCUYKt42XpbwWymn8bE2CN8SWA3S8Ak4PLm40/\n5jWsKaoUcycbhOEd12vpcS1dG5NzKeClnypTSd1iHj0JSwvRLV4rbEdbb05T\nRuBGpBKcW+3s4y0a67+D63/w29oTfH4cmmAIk4QWZXpbaqoduy3JTK7Y59Jt\nowir\r\n=4TPZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICqJYa0n5mpFM4j+pC3/tGFvPoHn0XiQWvQSRo1dwV5+AiEAjA/kcaZFUIjjIGlNURa2pN5t1/aJyjlRt3S1qQpL2Ms="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-beta.3_1540838739309_0.42504304172267804"},"_hasShrinkwrap":false},"2.0.0-beta.4":{"name":"uswds","version":"2.0.0-beta.4","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","gulp-postcss":"^7.0.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.2"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","autoprefixer":"^9.1.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.0.3","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","handlebars":"^4.0.12","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.5.0","stylelint-scss":"^3.3.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the design system](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Using the USWDS package](#using-the-uswds-package)\n    * [Sass and theme settings](#sass-and-theme-settings)\n    * [Sass compilation requirements](#sass-compilation-requirements)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization, theming, and tokens](#customization-theming-and-tokens)\n  * [Using tokens in theme settings](#using-tokens-in-theme-settings)\n  * [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/tag/v2.0.0-beta.3) from the latest USWDS 2.0.0 Beta release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-2.0.0-beta.3/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-2.0.0-beta.3/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the CSS and JavaScript files in each HTML page or dynamic templates in your project. We also provide Sass (.scss) files in the zip package which you can use to generate new CSS with project-specific settings. See [Sass](#sass) for more information.\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-2.0.0-beta.3/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-2.0.0-beta.3/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files  if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds@2.0.0-beta.3\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the  `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.css` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import 'uswds-theme-general';\n@import 'uswds-theme-typography';\n@import 'uswds-theme-spacing';\n@import 'uswds-theme-color';\n@import 'uswds-theme-utilities';\n@import 'uswds';\n@import 'uswds-theme-custom-styles';\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in  [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires both **autoprefixing** and **media query packing** to work properly. These are included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n- **autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings:\n\n```\n'> 2%','Last 2 versions', 'IE 11'\n```\n\n- **media query packing** collects all similar media queries together at the end of the compiled stylesheet. USWDS and `uswds-gulp` use [`css-mqpacker`](https://github.com/hail2u/node-css-mqpacker). This is necessary to provide the proper cascade and specificity for utility classes. If you are not implementing utility classes, media query packing may not be necessary — but it it still a good idea.\n\nAdditionally, we recommend using a minifier like [`cssnano`](https://cssnano.co/) to compress your final compiled CSS and sourcemaps like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-feature_name-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided..\n* Media queries are built **mobile first**.\n* **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://v2.designsystem.digital.gov/style/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settgings), above.\n\nSet theme settings with USWDS style tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Style tokens section](https://v2.designsystem.digital.gov/style/) of USWDS 2.0 documentation for more on the available tokens for [color](https://v2.designsystem.digital.gov/style/color), [spacing units](https://v2.designsystem.digital.gov/style/spacing-units), [typescale](https://v2.designsystem.digital.gov/style/typescale), and more.\n\n### Using tokens in theme settings\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```sass\n$theme-site-max-width:              'desktop';\n$theme-site-margins-breakpoint:     'desktop';\n$theme-site-margins-width:          4;\n$theme-site-margins-mobile-width:   2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```sass\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```sass\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units('desktop');\n\n  @include at-media('desktop') {\n    @include u-padding-x(4);\n  }\n}\n```\n\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output  something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;    \n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [v2.designsystem.digital.gov/components](https://v2.designsystem.digital.gov/components)\n* **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `dist/fonts`.\n* **Images** and icons are located in: `dist/img`.\n\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"8b090ea77969f54255654ccbb4ff0c9fd044029f","_id":"uswds@2.0.0-beta.4","_npmVersion":"6.4.1","_nodeVersion":"8.11.2","_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"dist":{"integrity":"sha512-ZvsyzfinkY3aJVDQ5IRsv8h0nUxqMDT+ktAB3buSgpQAoTWZZB5sR9ZOSUj4tv7qKNlWIXJq+0hnUyRPB8AHww==","shasum":"e340c7ced7c56fd45a682f499d8a783251198d7c","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-beta.4.tgz","fileCount":1398,"unpackedSize":20798385,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb7JgZCRA9TVsSAnZWagAAYK4P/AzTJmZl8qDaBKtOM89u\nL+k61pb0Hm18YJCJk2OTzblb6al1BZQyUIfbZPD6wiBens+AtlZC75yGk4wL\nafhSQEu+fV9Zg/ClHsx5AwCuScfivCtr/QLoEcxQPqzVaFFBMHJ9F0fzIEaM\n8jBYUAc+/9jwVqA11ebZfhtqBrIV0Z1L3pMRG3IIIDd8GhS1I8aXBa4qdYx1\nIw75rDTegFnJZJjUjwCCdPCTlmwgJ4vMewSfMjeuFVAUwfgUvAVx7FDIkr8B\n/pB9BTYC+shBH0MBduL478r0B9cLlpbLiI7Xa1ZCBE7w+Yo3vAPsxJAAf4ju\n2BdAfkteV9C9acpSAcBHsT6FIKYd5kM84WQU0jpf8DulKq3NT38M0A7gBBu6\nmPfww1to7Z3T2fQN4f2BmVAfDB6J2OKnSVxXIBadOJyFSMFhMLfBF6oV5OWV\nm/nBlEeeZa6nCo1wqJJowkRuc9GWLp+N8tQvbhUz2c4BIF21UJSAZT8SiVwf\nHQZudmyEwPLmgrdpoyvqLvZd2Gxylvmd57YdtXZbwy9ZUR+7VgVMhh+BohND\nOmzCNUHAp2hsGh04VXLU8JRwBn3mVzp0jyZVuG2UuftCLnMlCanfs+VII6jD\n2qlbsvXZqpA9NMKesI8m9cTpyaY9pQr3B+GazNx35Dd32BRtrxmB7opAx0aS\nGVP6\r\n=uEKY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD8dZsNXUBRlj8xc8u+e4l6xbkW8amHFnzchgxh0GTr/AIgGaHEO+mftyY8dNDbwq6KUYoG/+35rNnvkfLTcoNJqgM="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-beta.4_1542232088402_0.8939380344757915"},"_hasShrinkwrap":false},"2.0.0-beta.5":{"name":"uswds","version":"2.0.0-beta.5","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.39","array-filter":"^1.0.0","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","gulp-postcss":"^7.0.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","acorn":"^6.0.6","autoprefixer":"^9.4.7","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.8","del":"^2.2.0","eslint":"^5.12.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.16.0","gulp":"^3.9.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","handlebars":"^4.0.12","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","natives":"^1.1.6","node-notifier":"^4.6.0","node-sass":"^4.11.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^3.0.0","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.10.1","stylelint-scss":"^3.5.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the design system](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Using the USWDS package](#using-the-uswds-package)\n    * [Sass and theme settings](#sass-and-theme-settings)\n    * [Sass compilation requirements](#sass-compilation-requirements)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization, theming, and tokens](#customization-theming-and-tokens)\n  * [Using tokens in theme settings](#using-tokens-in-theme-settings)\n  * [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/tag/v2.0.0-beta.4) from the latest USWDS 2.0.0 Beta release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-2.0.0-beta.4/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-2.0.0-beta.4/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the CSS and JavaScript files in each HTML page or dynamic templates in your project. We also provide Sass (.scss) files in the zip package which you can use to generate new CSS with project-specific settings. See [Sass](#sass) for more information.\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-2.0.0-beta.4/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-2.0.0-beta.4/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files  if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds@2.0.0-beta.4\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the  `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.css` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import 'uswds-theme-general';\n@import 'uswds-theme-typography';\n@import 'uswds-theme-spacing';\n@import 'uswds-theme-color';\n@import 'uswds-theme-utilities';\n@import 'uswds';\n@import 'uswds-theme-custom-styles';\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in  [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires both **autoprefixing** and **media query packing** to work properly. These are included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n- **autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings:\n\n```\n'> 2%','Last 2 versions', 'IE 11'\n```\n\n- **media query packing** collects all similar media queries together at the end of the compiled stylesheet. USWDS and `uswds-gulp` use [`css-mqpacker`](https://github.com/hail2u/node-css-mqpacker). This is necessary to provide the proper cascade and specificity for utility classes. If you are not implementing utility classes, media query packing may not be necessary — but it it still a good idea.\n\nAdditionally, we recommend using a minifier like [`cssnano`](https://cssnano.co/) to compress your final compiled CSS and sourcemaps like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-feature_name-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided..\n* Media queries are built **mobile first**.\n* **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://v2.designsystem.digital.gov/style/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settgings), above.\n\nSet theme settings with USWDS style tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Style tokens section](https://v2.designsystem.digital.gov/style/) of USWDS 2.0 documentation for more on the available tokens for [color](https://v2.designsystem.digital.gov/style/color), [spacing units](https://v2.designsystem.digital.gov/style/spacing-units), [typescale](https://v2.designsystem.digital.gov/style/typescale), and more.\n\n### Using tokens in theme settings\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```sass\n$theme-site-max-width:              'desktop';\n$theme-site-margins-breakpoint:     'desktop';\n$theme-site-margins-width:          4;\n$theme-site-margins-mobile-width:   2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```sass\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```sass\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units('desktop');\n\n  @include at-media('desktop') {\n    @include u-padding-x(4);\n  }\n}\n```\n\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output  something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;    \n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [v2.designsystem.digital.gov/components](https://v2.designsystem.digital.gov/components)\n* **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `dist/fonts`.\n* **Images** and icons are located in: `dist/img`.\n\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"75c304a4621b3b31725e1513adc23ad6f4d31a02","_id":"uswds@2.0.0-beta.5","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"dist":{"integrity":"sha512-9UGgVOJYrvTBQT9UWbIpb95qh0AAZfy6QOHfxxSqz4E+9R1MqPVa5LvlOTMsOQAj926o9qCLph72irk2hytk5A==","shasum":"feb40a7e4c9fdd2a67d28043ccae4b71ed13bc0e","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-beta.5.tgz","fileCount":1410,"unpackedSize":20908966,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcbaamCRA9TVsSAnZWagAA5dsQAJ/CN3m8D3WE1HpbkMIH\nu6QEGTelNDppra6FymzOkDBTZcLZToPWHLEOVcf0YQsM57htW/owil4KNMRt\nPIYFtmvsGBIE0h28JbeL8KiJdVA5Nv32wrjzRdy91Jh6S2VN29Ai6sOGmy+M\nIKbMgKDTAnXKIJHDSoH16lnsTBPaDeO4PI054m1fbBfzfsrr8xRQ4qpsqtfj\ngvO8lHg1Pgu8dsMKjP5m7VXchdgDwGiKSKDo35qH2IEKeB51HJP4ASw/YaEJ\nd/uTLp6XSytYrNZgj2vz2BwUC8hj6jyGFIwiuAXvu5STgzHqb5Gv/1p2x+iv\nurQe9Xoprh7hgHOmMFFhAPk8S8cOVYUWhGSfsbJsOnLTxCIFg73AxjLCca64\nLsFqLJ5snXq/N4eCcRTFQfhcnbjjyeKX6Of6ZQceEy0ugAQI+nidyBPD6pzQ\nTka+/P2QYwRFK+ymVVKLOeIhvIJtdhUtNRY4xSD1wWtW1lXbtZ4F5nwYle/9\nxinXujyoOl9Hee7g+bCT1GSGB0NOJ0JYjLRe29zD9Yl9zPlhyofDNMBhqHkK\nsdx9mGKL/i4gbr1bUvbT1Dj7wzIolwe+sTCKX6vO2U9Qlt8tm4p+PmTQoP3W\nsQnQttEnyiDAB45wjH1Z3LcCVixyTjePaSiGBTjig4fo235XvKwZOKCYWS8C\nJ80Y\r\n=BaEv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDrJmkIdZPahZMbXBmPpfuN+i7ipy49QKr9ejjaIP/DwwIhAJzVYfGkT1Xdz9xGDt+qsOWrY2KAygreyZzrOHScfHBB"}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-beta.5_1550689957500_0.3207465430427203"},"_hasShrinkwrap":false},"2.0.0-beta.6":{"name":"uswds","version":"2.0.0-beta.6","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.39","array-filter":"^1.0.0","browserify":"^13.0.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","gulp-postcss":"^7.0.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","acorn":"^6.0.6","autoprefixer":"^9.4.7","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.8","del":"^2.2.0","eslint":"^5.12.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.16.0","gulp":"^3.9.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","handlebars":"^4.0.12","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","natives":"^1.1.6","node-notifier":"^4.6.0","node-sass":"^4.11.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^3.0.0","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.10.1","stylelint-scss":"^3.5.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2"},"gitHead":"13881abe2a960ca42e701b6902163def44793564","readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the design system](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Using the USWDS package](#using-the-uswds-package)\n    * [Sass and theme settings](#sass-and-theme-settings)\n    * [Sass compilation requirements](#sass-compilation-requirements)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization, theming, and tokens](#customization-theming-and-tokens)\n  * [Using tokens in theme settings](#using-tokens-in-theme-settings)\n  * [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/tag/v2.0.0-beta.6) from the latest USWDS 2.0.0 Beta release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-2.0.0-beta.6/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-2.0.0-beta.6/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the CSS and JavaScript files in each HTML page or dynamic templates in your project. We also provide Sass (.scss) files in the zip package which you can use to generate new CSS with project-specific settings. See [Sass](#sass) for more information.\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-2.0.0-beta.6/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-2.0.0-beta.6/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files  if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v4.2.3+, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    3.10.8 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds@2.0.0-beta.6\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the  `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.css` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import 'uswds-theme-general';\n@import 'uswds-theme-typography';\n@import 'uswds-theme-spacing';\n@import 'uswds-theme-color';\n@import 'uswds-theme-utilities';\n@import 'uswds';\n@import 'uswds-theme-custom-styles';\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in  [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires both **autoprefixing** and **media query packing** to work properly. These are included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n- **autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings:\n\n```\n'> 2%','Last 2 versions', 'IE 11'\n```\n\n- **media query packing** collects all similar media queries together at the end of the compiled stylesheet. USWDS and `uswds-gulp` use [`css-mqpacker`](https://github.com/hail2u/node-css-mqpacker). This is necessary to provide the proper cascade and specificity for utility classes. If you are not implementing utility classes, media query packing may not be necessary — but it it still a good idea.\n\nAdditionally, we recommend using a minifier like [`cssnano`](https://cssnano.co/) to compress your final compiled CSS and sourcemaps like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n* Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided..\n* Media queries are built **mobile first**.\n* **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://v2.designsystem.digital.gov/style/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion__button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settgings), above.\n\nSet theme settings with USWDS style tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Style tokens section](https://v2.designsystem.digital.gov/style/) of USWDS 2.0 documentation for more on the available tokens for [color](https://v2.designsystem.digital.gov/style/color), [spacing units](https://v2.designsystem.digital.gov/style/spacing-units), [typescale](https://v2.designsystem.digital.gov/style/typescale), and more.\n\n### Using tokens in theme settings\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```sass\n$theme-site-max-width:              'desktop';\n$theme-site-margins-breakpoint:     'desktop';\n$theme-site-margins-width:          4;\n$theme-site-margins-mobile-width:   2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```sass\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```sass\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units('desktop');\n\n  @include at-media('desktop') {\n    @include u-padding-x(4);\n  }\n}\n```\n\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output  something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;    \n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [v2.designsystem.digital.gov/components](https://v2.designsystem.digital.gov/components)\n* **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `dist/fonts`.\n* **Images** and icons are located in: `dist/img`.\n\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","_id":"uswds@2.0.0-beta.6","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"dist":{"integrity":"sha512-48jnlNnSmCwI6oV+HyS+vFPbqRslOY6+oI/Xmq/vblZbXzGYqB8niTNbzaOUoUAXSzad2MSJROdcFbtQbgGoGA==","shasum":"549fc38e0fd04747b3bbee6915595065aacd03d6","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-beta.6.tgz","fileCount":1418,"unpackedSize":21037021,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJchpi4CRA9TVsSAnZWagAAnyMQAIQTfSqRsYjwEJ5neQTr\nimIQtAVYgJ/UfQxrjQxsrefgu8ejSzQ36LrU3xfwBIEUdE1zbzMGEnn3Gy62\nB+qcFwgrNVhjgfLUEcrSmEOd63f6TsC7U0sIYLRKck02Z0e3cx0VPeTTkrGY\nLvpgne3l/8j70YIj3JeSGVXJmWVcIqs12wrmrmXKqBYs/SYbOV21Rxd56fTh\nLiC92AwXsClhPD/1iRvPKT8qEHp4fUd/ijl5cWCshrZlQjvUy5vnhtDgezUJ\nsZDqGZrcTBHFtidTx7ylurD2ToVqsfuqemReDYfEK7g0BwPJqrHK8mX6Yv6w\nIe0q8QQ7ylbsVtJizAVOwmPfc20XKAYOPfggmNWOzJLdmNDoL18S0usGuAmj\nhKstVio5yXw6WnljZFlBAp1bObTieZl3RgGAsWpukBDllIIfF+euSt/rF0Wg\nFSxy/j+E7/+GJruiWWs0pPkAIm2oyykBJotmXil3XzNUtu3H6adzOg0pkag5\nE6BEjbfa0vnRoD2O+O4ppfVfD8QXiIy6FOjiKR1J6sdar+5hEjYNFaCI4yrt\nC6PU554qZdSm1drY53SFUL9QQQqe2GcoHp1+qfa9HoYat5CwN/1heInJqpia\nzm21xX1Dgm1r6XumtRzQZacOY1ziRi95At/gPZDh6QvJoWphh/oFQIFmCK7Y\nEKWL\r\n=ll5a\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDnu4JKH6RD/w087qMxcHiNuoEQyx5N8T9KlVKvTyzyHQIhAIVb9zU4amSCn9S0ze3mPOws6hiqVJqEna7P1PRzS5dZ"}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-beta.6_1552324791337_0.38988200403434736"},"_hasShrinkwrap":false},"2.0.0-beta.7":{"name":"uswds","version":"2.0.0-beta.7","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"gulp eslint typecheck stylelint test","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.39","array-filter":"^1.0.0","classlist-polyfill":"^1.0.3","del":"^2.2.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","acorn":"^6.0.6","ansi-colors":"^3.2.4","autoprefixer":"^9.4.7","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","browserify":"^16.2.3","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.8","eslint":"^5.12.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.16.0","fancy-log":"^1.3.3","gulp":"^4.0.0","gulp-cli":"^2.0.1","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^5.1.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^8.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.1.0","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.0.0","node-notifier":"^4.6.0","node-sass":"^4.11.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^3.0.0","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.10.1","stylelint-scss":"^3.5.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"d1028e6c83245c4b51454a56c1c7bfa6e787e58e","readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the design system](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Using the USWDS package](#using-the-uswds-package)\n    * [Sass and theme settings](#sass-and-theme-settings)\n    * [Sass compilation requirements](#sass-compilation-requirements)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization, theming, and tokens](#customization-theming-and-tokens)\n  * [Using tokens in theme settings](#using-tokens-in-theme-settings)\n  * [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/tag/v2.0.0-beta.7) from the latest USWDS 2.0.0 Beta release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-2.0.0-beta.7/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-2.0.0-beta.7/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the CSS and JavaScript files in each HTML page or dynamic templates in your project. We also provide Sass (.scss) files in the zip package which you can use to generate new CSS with project-specific settings. See [Sass](#sass) for more information.\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-2.0.0-beta.7/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-2.0.0-beta.7/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files  if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v10.15.1, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    6.4.1 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds@2.0.0-beta.7\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the  `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.css` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import 'uswds-theme-general';\n@import 'uswds-theme-typography';\n@import 'uswds-theme-spacing';\n@import 'uswds-theme-color';\n@import 'uswds-theme-utilities';\n@import 'uswds';\n@import 'uswds-theme-custom-styles';\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in  [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires both **autoprefixing** and **media query packing** to work properly. These are included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n- **autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings:\n\n```\n'> 2%','Last 2 versions', 'IE 11'\n```\n\n- **media query packing** collects all similar media queries together at the end of the compiled stylesheet. USWDS and `uswds-gulp` use [`css-mqpacker`](https://github.com/hail2u/node-css-mqpacker). This is necessary to provide the proper cascade and specificity for utility classes. If you are not implementing utility classes, media query packing may not be necessary — but it it still a good idea.\n\nAdditionally, we recommend using a minifier like [`cssnano`](https://cssnano.co/) to compress your final compiled CSS and sourcemaps like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n* Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided..\n* Media queries are built **mobile first**.\n* **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://v2.designsystem.digital.gov/style/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion__button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settgings), above.\n\nSet theme settings with USWDS style tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Style tokens section](https://v2.designsystem.digital.gov/style/) of USWDS 2.0 documentation for more on the available tokens for [color](https://v2.designsystem.digital.gov/style/color), [spacing units](https://v2.designsystem.digital.gov/style/spacing-units), [typescale](https://v2.designsystem.digital.gov/style/typescale), and more.\n\n### Using tokens in theme settings\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```sass\n$theme-site-max-width:              'desktop';\n$theme-site-margins-breakpoint:     'desktop';\n$theme-site-margins-width:          4;\n$theme-site-margins-mobile-width:   2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```sass\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```sass\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units('desktop');\n\n  @include at-media('desktop') {\n    @include u-padding-x(4);\n  }\n}\n```\n\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output  something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;    \n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [v2.designsystem.digital.gov/components](https://v2.designsystem.digital.gov/components)\n* **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js (/components, /utils)`.\n* **Fonts** are located in: `dist/fonts`.\n* **Images** and icons are located in: `dist/img`.\n\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","_id":"uswds@2.0.0-beta.7","_nodeVersion":"10.15.1","_npmVersion":"6.9.0","dist":{"integrity":"sha512-IzMaA8WwGDsyFX/bZ1Ve20oaf24t31nfzodLJxNcNVj1Zh7dYpvcAqMNY9rSzXsLNMeSBRehtSTEyniN7P1dBA==","shasum":"7d4a3b4e0caf7c4506522ab869fafe96e6b15a2d","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0-beta.7.tgz","fileCount":1413,"unpackedSize":17571325,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcmQzDCRA9TVsSAnZWagAAbiIP/1sckiC2iPh6xBxNWRg4\nrEK7wBRkrrLxqJC4MQQGwnjfa7SCOoN3vByC3yTa1G+gQoQgtlIvWmj4dUBR\nKPfwONtM+ef7KjicdriydGj+5a1XrAZoPYIlEu1Kf2Hkg3MBBAqGRqnldbeY\nCyq+kVKpc8vC0LUUs1RoT7FRIJ8pYwjf4OjZ6pSEmVqVCmxc35tR1Dm5RDyS\nKuUKdW8x2NKxevt/fRVxEBW3+uKtdXKTBdKvjJUadTrI5wKcvFuTriAzYmLp\n6qpt6x98gzwyBjvuDHsecSfusNpFkXg3MVlLJtOCDGz/yDHiIBGwXwLCf3lL\nJZeM6nDIzoSHWAsmEaiCHCEMc5yiaioTv+LRBlP0zkWhGTsyb2qynrWVG+7f\nVbMEZ5SkEuy9rdHE2Rc9c4Prl2cxoUQL2y9a8v65o/IZMlpkrToWYWcsrzHz\nJZdMTF3AP+l+6FmcZ7mODAFOcgh1h5LJUVM+dRyign0OAgYAqDAUVR6hxQ+g\n/Y6thrUAleEdXOvMJMz+PG3VZSHKjwrCuUGpShDDVRMSGevFqidtuVbzxk1v\naBjBGQW7CsrR2ySqyM+31ZbqKC3KWq+JVYPXMrk+xsLqmUVAwF2Em/elpIeM\noL8USZwONoW43iSimx/8Upl5HN+d/gI16BViv8qiWdZdQyGLeZcqf7LLQ5zE\nMWtT\r\n=C8Ep\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHVmQtzVA9yOmpmemlLVMo9r96NHqyiStLRjfepc3P46AiBhE0YEfEPcYwxUhQkg0ifGyvb225VxdagELJu+SETMBg=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0-beta.7_1553534146055_0.6080280529369075"},"_hasShrinkwrap":false},"1.6.10":{"name":"uswds","version":"1.6.10","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.3.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2","snyk":"^1.136.1"},"gitHead":"43f8f697e7924ccaae26654f815fcf4860a5ac15","_id":"uswds@1.6.10","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-byx/2dXUg/M+tVMgJQD8ga4XzfXKwPgTgJno6LNZiDGiHwyk4zQwa2wxTk4Hf/2j85/XDip0Aiqg3oCgm6umZQ==","shasum":"82ca95f23edb9b0462df2f4bb472f013f0ca914d","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.10.tgz","fileCount":656,"unpackedSize":5604246,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcmVCVCRA9TVsSAnZWagAAwVkP/jPu2b+UBkckV4yDcUMU\nOb4lO7nSjYTwrEUevttJWyBXewgUbz6PR0YkYb5gy971mCvFumkY+kLpCAvM\n8B2j9XNaWc6bUD+BDv2VmnNuq97WtIk5TkasYGisyY1P8xo45Lbr7DeA2yyk\nmiHAmtjq0aVz8pFgp/j0bSB/TmKow7ya7m6uOJ+MxNIslLS80vrOO7weyI4X\nWD+yxZu/JtOTJxf8EjwGSOP1uUQYFGHKRAeiK9LEVnp+5PP6FOACRulIepLE\ngahyGbbJpPmrDJeMCDmY1vDPTIKOwWCwNvx4mTWPVXu1k8cLCMEiOwlX01nM\n/0Aihdz5aggKnka0DNogwFkQ/2Gkm1BW7iqExFkdobd3odxHG/7XKdAFRVj9\ngwYVTxvaxoUaRAN1h8lv5dIv118GJPISpOUnE8SCwh8YNpQdoKE4hk+GoAA+\nHoTFkFTB6ZYSHEdrKUcLNeVXOtAvmHL7xYTqUOBVuXMK3DLTT5JkvzSSMdiq\nxcqN8kqmrp10TumaDEk56pFGXdKfWP+Q0HVb8CUudY570MoDnpDTzDpmzdra\nQaldgy/toql+0Jd3aE1axOLQ1B8x+uxRB5T8ix1wnXj3wSJQwQNTxzGr8aaU\nOarqiFmShOTCIeG8OEUA9dyzx/kGPnJxEFNB2t0WGze1L8Y+Ydaakqwt/N7T\nvqT4\r\n=ntNA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE8nqMNDN53AreQbmBMSwyJBIM76gd5cpX8kbpHZbe0dAiA2cQkz4oWxGrNCNKbf5R44R3qRCnRROCWW1FoiNdtPsA=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.10_1553551508511_0.9320314177992506"},"_hasShrinkwrap":false},"1.6.11":{"name":"uswds","version":"1.6.11","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.3.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2","snyk":"^1.136.1"},"gitHead":"8eda38202a29f37232f63c021b489192faba784e","_id":"uswds@1.6.11","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-xpPPBs/vpt+imsyM8PXgwzTVL9vMs7qvqE4oJHe4rBnxGGskJiFchK+KhBw4SHea29PzbwEJy992YBTgQNHpHg==","shasum":"974bb4095977caa010d37c1ee6d48fba99cb8f80","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.11.tgz","fileCount":656,"unpackedSize":5604176,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcmn+tCRA9TVsSAnZWagAAJeIP/2ZmQNY5boBKRMVoGeGI\nF5M/WEXR0sdRbLNZI7AW/hhOGCbPlyFxiiFsnu1WiH/STzlI7PqMxW80NF0T\nbzOhYWa/hldiplX2syqi3KfOvfM//c1fOh9LdeefdREEHzhiVrIv+RktnOX0\nKF3OeynILYZUr3L2nrPLMkiqR8xaO1pNrbKQRgYgOSU3hLoleLJMJ9EksS7Y\nzDV4SQ4Y3oKq+qPTYEMqUQadyiu/07CXhalWosJ7Y3KwQUhhvedE/jiWNjGA\nVoD1cvVk415psqyzvJ6H14uXLZ9PCcQm+uMHOANbWVcx6qG4vsEEz8oYHGLt\nLAoxcUQerC2foEK+ZsnZG+AyBBn7DrRDM4687yGo4DV6Uj8lXnErLHCckKMa\neYX0WP9lMso82PBlFo1CE/YkFI/i9lxwPlPZaPHwUqb7cxEndrHV3hJHRwOw\n6UFP852wCNZGpD3Sf8LPj0jzEsK0sWyKnU907g1e6kFOxW9h853uuaX6pJeF\nXQOQTVR6Fpbrpaol5kb6H0hBHc+ksEtb3pdiM6TOx1SCDT+oD0fEWH47eBRo\nIcW/kEJCRfmaYu9bweugOp7dWsPQWK4dxchZ5QjxJg8ckIQhUFHemTXvH04y\nt1xWKR+pe//OP5yjSldLVB4n0kJfEx0/gIBrb91+3piSqprqgNnUF+Xbcg8f\nGfC4\r\n=aE3J\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCfbOxDpAi7sN9cueQsCMx89Oil/Th74HCLmyi/lV6MEAIgbybj1bY5iLkmbWfO/mYgRjk94TttTTj3FvOdnDdWGxY="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.11_1553629099789_0.1915253546625708"},"_hasShrinkwrap":false},"1.6.12":{"name":"uswds","version":"1.6.12","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,}/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^13.3.0","classlist-polyfill":"^1.0.3","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.2"},"devDependencies":{"@18f/stylelint-rules":"^1.2.0","@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","del":"^2.2.0","eslint":"^4.19.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.13.0","gulp":"^3.9.0","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^1.4.0","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^3.3.1","gulp-stylelint":"^2.0.2","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^3.5.3","node-notifier":"^4.6.0","node-sass":"^4.7.2","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^1.1.2","snyk":"^1.136.1"},"gitHead":"c504936c2f974d20f0477ea8e21dc01282f34db4","_id":"uswds@1.6.12","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-yeeGob7RfBJiI/sHSMNbsgXPYDdHOMVwD388neLpq7XhsONBXanXfRoTOfFPt3Jn9IJsLHQ2oGvck7Oop3lKvg==","shasum":"907eec479d603efd1ba2b17e4230cdcb016eaa22","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.12.tgz","fileCount":656,"unpackedSize":5604260,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcms/5CRA9TVsSAnZWagAAiwkP/R1bgYL1Hs4IvYFQGlva\nGZ3Zbs/+o4iDePyx2WkxrCAeCwGRzeK5A+X+UX7FBfLTgIbjNf+Cjl4UxFQi\nShwALYh5FcFFDnG0LWtQ5dXUNZDpN7G9t+DhJqVJyjl19vGAmdyivEhPqI0T\n7oNS8ALWI5SEyueeg13veUKTM/xxDBsEVkAxduDu9O/bEWMDW9TpW66Igk5K\n3yysUx6Ztycqdq1PtYiBrrN7yXiVEKrSMon8dZrltojU9D1Lv/fjY/EDeomD\nhQWNbRNojGXjuUjFktJRXQn4BozlnDwLlVlyhUBx9Pv1Fn2PG5DIriAPgXgQ\npnUE1wTLGi5WT7br6a9h5yHu3rDUAl11cyQNt62G1GOANz6ThjkEyP9zJZ/N\nJFEkYSyByUAC84eGiEUcPDw/IAMIYijAqPLQXa8aciyNI1gXKa2vKVmmAJay\nkMGXy27TEr3fd24zl4cKmHy4+qSpeLL+F/zxKsmrczfAgIb+G+OAszw3ZgUt\nUb1cglVAiz6oXY+21oDvPg5P9GWVm1jXurOm9aSb5qGgPvTkcIGVqttx1F6t\n4haCd0KV1GvZUKcSr40m27b929Orp2wguq7OiqoKjz/1HeQHqSPwqW8zIN8N\nm4jJsr2MSyaqQuHEGlWau81PNmV9KrhvnsPdKUfYAZkEVC4gCiv8gET1pDBv\nZVhs\r\n=ifde\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCP194zgU6tXjTRikCFotT6D9I2lPnFTAXG8tHLd7JD1wIhAKJUsCVmcfPlexr4PeWF67UO7uvq9Rp9UAQ50ShOjV6C"}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.12_1553649656637_0.6849104482976187"},"_hasShrinkwrap":false},"2.0.0":{"name":"uswds","version":"2.0.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.39","array-filter":"^1.0.0","classlist-polyfill":"^1.0.3","del":"^2.2.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","acorn":"^6.0.6","ansi-colors":"^3.2.4","autoprefixer":"^9.4.7","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","browserify":"^16.2.3","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.8","eslint":"^5.12.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.16.0","fancy-log":"^1.3.3","gulp":"^4.0.0","gulp-cli":"^2.0.1","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^5.1.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^8.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.1.0","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.0.0","node-notifier":"^4.6.0","node-sass":"^4.11.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^3.0.0","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.10.1","stylelint-scss":"^3.5.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"7d87eb2dea9a56d31277d48aa3bedd4d21db9eb0","_id":"uswds@2.0.0","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-rHFBaZhpxLr4J1/CBnyCKjVSWuiqnhBAJrI84Syj39inUjHa9ZzpMDSzFgviBPfbRoeCXqYAp8aZxtoZw26a6Q==","shasum":"62b61ef6051d50c18b1c3828f76231e90cb70e35","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.0.tgz","fileCount":1089,"unpackedSize":13783613,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcpmeZCRA9TVsSAnZWagAAcRoP/RidIgfrwU54TnXazXrG\nb6dnOEYjdy+dttz90+G823eM4iNcCQEY8BPMnUT/T5qVOaiXZE9IGCthiYoN\n2rBZrdFNMEYfDcUZ7y7VQpRSj6dSHNY1X+S80wavJN/+2eVghFtNDjrA6Ynk\nUtQpCz990CJVRpoHjsrNnqV6tXEDSsz5Txj62KLUAeya++SuRbDlpVgvxJ/e\n856AeS9uq6Fgt4Kayzo+eJu96vAP+ME/h+NZiRVKv8rRGxLvNmg27DdNmLXU\nXc0V8VChYbMXDmGTyIdlzbT2ZAgEpxVWENqO0QqTh4Yq6ofqnYxZljRl1u6V\nHp3g16ODiMjb7hLs0Vbmwz+hhkZmiYZjylSEQrPnDdSDTxexaDbHhNj9vZfz\nUOtYg9KZPLm/zNEoXbwlYozzz+hTemq8XUZgyXX0dIZxuvNLx+gC6iEvKUpo\nxZSnTQMzDLkZydXQU0EJ4biL1rNO+xee/NgdgSQvBY18mPXPqTq0BRzeMuNO\ne/Cw34PYKFOqxoPv5lf6N4j7nMm6eGQrvwMgicEWEpi7tWxAnbiCqiv9oz93\ntwALx5YPzq6g5ijoqhJF1YnXyrZrxAIz5Rfpy4eXygngdEqI/jO7vi4J6LXC\n9FhP2X4GxImkDkHsrs3Bk76Jb+lZIfUAGVtM8LhIDYAM9fFZn0bPKYnmnoWL\n5sFG\r\n=B8yV\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAQT4X353HUCeReOC7FRDBcxdb1HTG0OAYNVQjn23UN8AiAJwLLTJbGnmY3kK8sFOIGlGsr3xcAcCfiVEckS9WQoHQ=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.0_1554409368240_0.30576720303442806"},"_hasShrinkwrap":false},"2.0.1":{"name":"uswds","version":"2.0.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.39","array-filter":"^1.0.0","classlist-polyfill":"^1.0.3","del":"^2.2.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","acorn":"^6.0.6","ansi-colors":"^3.2.4","autoprefixer":"^9.4.7","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","browserify":"^16.2.3","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.8","eslint":"^5.12.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.16.0","fancy-log":"^1.3.3","gulp":"^4.0.0","gulp-cli":"^2.0.1","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^5.1.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-strip-css-comments":"^2.0.0","gulp-stylelint":"^8.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.1.0","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.0.0","node-notifier":"^4.6.0","node-sass":"^4.11.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","resemblejs":"^3.0.0","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.10.1","stylelint-scss":"^3.5.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"c1634da26f3d34f965554027893cde7322ba4ca4","_id":"uswds@2.0.1","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-meiawyiy37hrMF88b8JE2olsewqSmcQsRlDQE9M7vwgarYPGMl18dBYaI/NcDuSuYKCCd4WrM+pI/4jrZ2rtEg==","shasum":"fea1bc1a88666ce602a6c334839b8f1f5e4ce23d","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.1.tgz","fileCount":1089,"unpackedSize":13782672,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcp8onCRA9TVsSAnZWagAAgcYP/jwHfXUda9liXvbMGzQg\nzCTh06WeVUOc3y1VoilD5zfTe1L/JsS2dYZNO4j0DRow31mhecUSdRfTXHfS\n+aRFJFcpEIxN9uXKeEbyTMLZonMxIb70FPlDtMgi04h9kgUkevh5HsHX4s3x\n/yC4wVT9whN4DboDQAr+3251iTgvyQ3ZCePxL/bR6BtgXKZBlQl/trPgFy8+\nNZbUXtKR/BMnp1ZyxUCW9QfhjHypZ8KBNc2fhpBLpGPdomxwYtPLbmNYv3tM\nvWJERaDeEfPuGN1i12X78NopAo/dwYnhTRI/58uz4plY08PIH8Iyxmo0laSb\n9noLrJgcabvrw0em10zpAJlgG7W8NlHPt9aiy3C4CvQpRSvgnBnnQ00LXQ9k\nb2JtDpDjE4J/xjDKWclgEfTsZhqPbOh6bVnkqSQe6EscYffO0kKWIc4KJ6h4\nf9n9mUqTqJU3QQ/FwHU9dsm397dYJax2XFzzXFiIK2ZCyecj/vXAko0A12gD\nyUqrsROlPDpxZ6H9RMfrFbqSKese0n9+GTqhX51VbfuAGFak/OZkabictBRP\nwt9xsTRRw028uZuP8sESNkfifFRJMv0/v/EmcmlSkqSaF6mUmvCTwtFpJT8H\ng4iDA8XUfeSot9EHjLl6mH+ax7w4WcuJjNxeiKLO97D+RT5BHJKiuFS8P1nq\n01X/\r\n=RBcI\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQD6JM/Nu+CCOzFKKlRGh2p9/ohcuoQRP6eJNPNXmc9mDQIhAJFd0Cn4XBXxLhir6E+vvaAVCCVZCb4uI9CRR0hYKN6g"}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.1_1554500131949_0.3788075081373836"},"_hasShrinkwrap":false},"2.0.2":{"name":"uswds","version":"2.0.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.39","array-filter":"^1.0.0","classlist-polyfill":"^1.0.3","del":"^2.2.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","acorn":"^6.0.6","ansi-colors":"^3.2.4","autoprefixer":"^9.4.7","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","browserify":"^16.2.3","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.8","eslint":"^5.12.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.16.0","fancy-log":"^1.3.3","gulp":"^4.0.0","gulp-cli":"^2.0.1","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^5.1.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-stylelint":"^8.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.1.0","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.0.0","node-notifier":"^4.6.0","node-sass":"^4.11.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","postcss-discard-comments":"^4.0.2","resemblejs":"^3.0.0","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.10.1","stylelint-scss":"^3.5.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"4d210b3e118f5ee84638b5d896a340203caeacb0","_id":"uswds@2.0.2","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-njiXZDFKeRAtVJZVx4tA/mvFpMpXIIi8iR0BxGYtuKQTOZGvFivdqZvBxoCgyC/aZSQMiOjFd+ONuYbZRGuafA==","shasum":"8e763bfea541ed8bdfcc3d6170f3961e5cfa3372","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.2.tgz","fileCount":1090,"unpackedSize":14360751,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc0v94CRA9TVsSAnZWagAAwy0P/1fOpBwQdWjSLZXE3e6n\nHbIBEFC0WODKQIqXMkiU6NHgIXEAhtt+CUzDywlGT85TewOU/bRvVVS1yqcS\nFEDaFTcTUZdW0ZkK5qSjWYk9fOCgnc0szDYuNDup68nZorTO/4RRlQE3Ghxs\npt58uV3VstEMq5Xlfkj40stU91MirGXkGzMYTfvIHW43KHihkCiLK2X9JnoW\nDZXw5S9mxEtvuDv+sF38A/45b0iTeq//V/89ecKenxs2GMfQOYv9HO4j/a/Y\n+Bir5jWSFn/6n3yFIfCYpROjtSWfF2Ur9kyrjfvkTG/98zqIhGhNdLTjst9I\nZpiJeud7MAUKbja3wyd5vAlixF4A3haRW/nqsl5T7vhkUzEpNdIRf3/tBhlg\naqjDfi6P5uVWy+ZKGNXut/jKSntQfhP2WLBIVIF3w2iafmU6EwrYUa/wY5Oh\nmvQkd/dJO1GRs8ONgfTnQkXgxtioKFPLw8O9plX4YGRagXebrDI9+1OPcKSP\nhAAiJLHV0VbyevyZI2KLpciobojTycnQAP4Pq1phfAXdfpQftAOqixYYmSt6\nbVrBSMyV7DmR6jE9ryH88J56cP2H84zOT3JNsp1j5rUQG47z8R9DYYPWOevo\noQgDoqfXgnMbOGm9huq01F+mf+E9F2l1rYsxGk/mEgtiwJhsWQ0YVErhX2kS\nxjpN\r\n=G8SM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDuui2Km0Kr+2a8mzgiObiKeI53Xdl2/BXKRRKhjQhqvgIgUvrHve1McEuAucr5AtKEBG4jPackF0pr8vhlwQH+CiE="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.2_1557331831441_0.46337836014695033"},"_hasShrinkwrap":false},"2.0.3":{"name":"uswds","version":"2.0.3","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.39","array-filter":"^1.0.0","classlist-polyfill":"^1.0.3","del":"^2.2.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","acorn":"^6.0.6","ansi-colors":"^3.2.4","autoprefixer":"^9.4.7","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","browserify":"^16.2.3","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.8","eslint":"^5.12.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.16.0","fancy-log":"^1.3.3","gulp":"^4.0.0","gulp-cli":"^2.0.1","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^5.1.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-stylelint":"^8.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.1.0","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.0.0","node-notifier":"^4.6.0","node-sass":"^4.11.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","postcss-discard-comments":"^4.0.2","resemblejs":"^3.0.0","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.10.1","stylelint-scss":"^3.5.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"15382fdf9b3c45c020c311ab9f6fc4bf3ffe9af2","_id":"uswds@2.0.3","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-VxiMrtdlbZZ5VCaoZ81Jie4ijVloYcN7WQ/75lEdgReJ6l7zYDcmNLsZ7l+PYJMQPP555FSjHKiBDPT6A990MA==","shasum":"ab1bff7c0bd33bcefdcbb65cb86c881c3af0c3a9","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.0.3.tgz","fileCount":1091,"unpackedSize":15809921,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJc+plaCRA9TVsSAnZWagAA+ToQAIXJFOmwqhlByAkn5RCW\ncZ5pclm4y7ibfohKtz9SxbxLzNdJ4Y3ZlGRVHlkavwrkVj4R5gy/RyuIpM2j\n2eSoBcP2Xv9nu990x7tvGU2rYoaoK3NRC2uFsH+cKo20bdCmTRNVSv7oFaT+\ndJUuCock1OvHePgJW8vfZCmp1OER52EC8kGnBRFqlbANtTXiEkxKPJ4GWj5H\nRWdazkgD9vGzYU2GLHLV8MRAOA5ZPkEA9w8FhFp5HO3Zrlc+PG6PH/fF4if1\nfDvBnE4eOTz0Vybi2PxkcwrkJJccZCCFOslK3/faB1d88tHvQbsBwf97ZnTW\nnObvJmMDHBdENAxnN1RzoCaayv6DYg6D8NChIFutooXFK0GUGs21FQ/orwCz\n6b7QQt4tHAcEsQpYy1cuZd7SZ+rJYmtJcTCvmxALwHwV8ltJ7l113nxFI2oa\n8pe43e9/E00c6iyKE0HygvUGhIhealtL3HVFKcTWX7dOHEZ7HuO6Jjkgfz04\nO6F/sXHKDr78APuns64lr3Qd2GQHE+AuD/2lJjcfJ1uVnU6JZNVdlejGwEdX\nJHGg+1R+Gzn4m5cEZxcaxGob3FeKEuzqKf+dcRqw/FTmyx+espcRY9iL4xih\nLS+0sZ7J0dyrWZCtL5OVOaupkNrn8XDOmhvZTvO+v/nBJTyqAMKTGR6KyAWX\nH1WN\r\n=/0GD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCXUGgigGzQXKJsObzKBf8ILcYZkDFbamXjhUa5ZQnYigIhAIAiZsqy3DCtk5iyVKmnlcSuXhCSHDdN5bU9yNXG8m17"}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.0.3_1559927129317_0.5769875620134539"},"_hasShrinkwrap":false},"2.1.0":{"name":"uswds","version":"2.1.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"istanbul cover --config config/istanbul.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint typecheck stylelint test regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.39","array-filter":"^1.0.0","classlist-polyfill":"^1.0.3","del":"^2.2.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@frctl/fractal":"^1.1.7","@frctl/mandelbrot":"^1.2.0","@frctl/nunjucks":"^1.0.3","acorn":"^6.0.6","ansi-colors":"^3.2.4","autoprefixer":"^9.4.7","axe-core":"^2.6.1","babel-preset-es2015":"^6.24.0","babelify":"^7.3.0","browserify":"^16.2.3","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.8","eslint":"^5.12.1","eslint-config-airbnb-base":"^13.0.0","eslint-plugin-import":"^2.16.0","fancy-log":"^1.3.3","gulp":"^4.0.0","gulp-cli":"^2.0.1","gulp-cssnano":"^2.1.2","gulp-eslint":"^5.0.0","gulp-filter":"^5.1.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-stylelint":"^8.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.1.0","handlebars-helpers":"^0.10.0","istanbul":"^0.4.5","jquery":"^3.2.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.0.0","node-notifier":"^4.6.0","node-sass":"^4.11.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","postcss-discard-comments":"^4.0.2","resemblejs":"^3.0.0","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^9.10.1","stylelint-scss":"^3.5.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"f0da7b93eb11e06ec7f37cbcf12226e373daeebb","_id":"uswds@2.1.0","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-RlI9AVptOaav1O6jvXZLoBkqjxTgrIhIIwjX7b6fRnnJA6BbfIq/bZweErcFsMuaSYXRTkH3rslBu3tY1hlc9w==","shasum":"c835e5233b51ad7d2ef538f44c303c98e662e8f1","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.1.0.tgz","fileCount":1183,"unpackedSize":15068727,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdVICqCRA9TVsSAnZWagAAWD0P/iDwru+4NoC+2oReso/g\nh4nfHsbObmyXxL1gKt9VggEx/O8tDWM9DWR/izOwOeLGhwPFtIoKZmJ2RkTS\nHqV38ORyH7xnDwDbpxy+YcZzWHSbOVN7SLdqwFx78XdWCY/tw3OmbjMndTUg\njK4/2eWLgJ42rSeoX5ka6ssJHTOsNMnV8eaVmeeOyS437xGdvv4BB4IbKJfv\nUauy2ywpahGtipIiJhVEVD90+V6yI+UxioE63Jqkpz3zQbSw3l0ScFKMyQQA\nXhCIZMwrBHEEgM9FpcexjoRietikKPIBjmOh4mDbtNqHuRDPTRHkS+5kst8v\nowy0pc5kGqIGbEezQgUm/YaH6bq0jx9q0khtEYPjKmP36ds26NraLyiVn/1L\nR1DvsYWSMC5iLdxwrDygQP/h/f86fE+NSqOYhmx6feiPGXkZZbd/vy1Zh62j\nNZefG4ZlxDIGMotMCfihRWgcgoLl/xEDbi3PLaFnjgQFv/Ruyz69g0MQgCI5\no7H8bp3UzQEWKM3+kI1RcT/zLxBgIE4Jl69fKhgWcM0uUBzRaY1v29VzssMi\nOj2x4MCqhyPYUXU1XyzsvJSSlvaEj6Zt/nC9HWq8G6/1DhWigykP7yb6zYoA\ny/W8QUIwkpkrPrUX1e0TtiMlKoBoHQs62edoGKbzcwBCgkm/YJxGUN9YGafn\npAL+\r\n=Jge/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICCtS6EB7oAwfBY3FPjS0mC618dmKTrmV9cpUCxgWA0UAiEA8wvZ2T8GMBVTxGM+Zqt5p4Ntd1zeznA0pGHqbQGthYo="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.1.0_1565819048824_0.03046550842871043"},"_hasShrinkwrap":false},"2.2.0":{"name":"uswds","version":"2.2.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.52","array-filter":"^1.0.0","classlist-polyfill":"^1.0.3","del":"^2.2.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@babel/preset-env":"^7.5.5","@frctl/fractal":"^1.2.0","@frctl/mandelbrot":"^1.2.1","@frctl/nunjucks":"^2.0.1","acorn":"^6.3.0","ansi-colors":"^3.2.4","autoprefixer":"^9.6.1","axe-core":"^2.6.1","babelify":"^10.0.0","browserify":"^16.5.0","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.10","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-plugin-import":"^2.18.2","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^5.1.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-stylelint":"^9.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.1.2","handlebars-helpers":"^0.10.0","jquery":"^3.4.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.2.0","node-notifier":"^5.4.3","node-sass":"^4.12.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","nyc":"^14.1.1","postcss-discard-comments":"^4.0.2","resemblejs":"^3.2.0","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^10.1.0","stylelint-scss":"^3.10.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"70a987702f097c2b29c925ae440251e006a2300b","_id":"uswds@2.2.0","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-9gxjEQkW3Pm+OBYANak8iHCvBUHTjUxznXZGPsSxEL5rlDkYcI1Pb7F9mxeSrjMtkFSP6/GaNbGxGrMbSdH6Dw==","shasum":"6f82ae426c54a5c1352b265fcbfaf7c5e3cb7ce3","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.2.0.tgz","fileCount":1185,"unpackedSize":15073527,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdgxfuCRA9TVsSAnZWagAA2goQAINGCFMotCzRWfi2aPIG\nc4Gt3O4u+nfm5mfQNg604aPDJDfntLzfh8KQpb75q/5XeZlGpegUMRpNfM/k\nrPnCo6LOXigRAmi9yKrPpIYF4lCgYg/8QVCyyfwP5ZRDQrd+269sxuJzj2Tr\n8A+AZyTVqQMK9HogkvXu1+OMrkm7E6GaloQsZuH9ZnLT5jjEZmD4oAWis/8d\nVzwzbBiy6CknuNDGjiyS+qbNeJx1rfU9cgSj+HLOG2GxNzxxdZMjzcieQiog\n9QldvAZvkZ8DPQH9nAiYhWO7PayBbEsHImAcEhFp4QE9TKUU5wNNI8hYtNVU\nmP+yt5b7JkkQs1Jc0bi+eHByD9v0fOv9xC7mNn6qkiYDpLCyMtZOjEje6B5j\nhuaV7kuhCHfVuCsZ/y1RC1gL+gGvmBylPRA5ilPrdP5KarMpesGJQGqZrIxA\nSe3nUQw379wHi7tE3pCfo+QyG5qFiHd8A6LqDAIjSrPJoDYCIPU7DRtxlLCd\n0CZGn6lWiDOV8ypCHRM+6LaqqyQ5vElyTu4framA+11QYakIBqKRRrq1aDBt\nWXX/SAUuaIKhNES6GpfzEd1URGnEI9f22vAa4NXQoHSeAAzPOWUB/SABE7in\n08SjgajoOaqw6fDHnHWEV5YXZfrI68LM9ZqJo7VBnLJB3JNm2rvgIYTQMuNx\nS8+s\r\n=FhwX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHoG9cIEO9XxywoQjB/iGQGmH7pUuVwLoonFotldKIyfAiAVUPN+jpq046tMiTHaTQTd9je/olsYmV05R4Yi13gwNQ=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.2.0_1568872429070_0.13787103568746306"},"_hasShrinkwrap":false},"2.2.1":{"name":"uswds","version":"2.2.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","cracks":"cracks --paths package.json,spec","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install --only=dev && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.10.52","array-filter":"^1.0.0","classlist-polyfill":"^1.0.3","del":"^2.2.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@babel/preset-env":"^7.5.5","@frctl/fractal":"^1.2.0","@frctl/mandelbrot":"^1.2.1","@frctl/nunjucks":"^2.0.1","acorn":"^6.3.0","ansi-colors":"^3.2.4","autoprefixer":"^9.6.1","axe-core":"^2.6.1","babelify":"^10.0.0","browserify":"^16.5.0","canvas-prebuilt":"1.6.11","chalk":"^2.4.2","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cracks":"^3.1.2","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.10","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-plugin-import":"^2.18.2","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^5.1.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-stylelint":"^9.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.1.2","handlebars-helpers":"^0.10.0","jquery":"^3.4.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.2.0","node-notifier":"^5.4.3","node-sass":"^4.12.0","normalize.css":"^3.0.3","nswatch":"^0.2.0","nyc":"^14.1.1","postcss-discard-comments":"^4.0.2","resemblejs":"^3.2.0","should":"^11.2.1","sinon":"^2.3.8","stylelint":"^10.1.0","stylelint-scss":"^3.10.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"3d10edcc278fcd9c9f190b976792393e8e59178b","_id":"uswds@2.2.1","_npmVersion":"6.4.1","_nodeVersion":"10.15.1","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-VCi8q4G95JJb5Vf9L3cPMtVsGTlZg/5GIYoM0aFQxFJQOLtw96nfoZWyxliVixn5f8blCEZsnYavuNFXndCbKw==","shasum":"a524fb06703ca53033d433f984966af89cbd780b","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.2.1.tgz","fileCount":1185,"unpackedSize":15073815,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJdiRSxCRA9TVsSAnZWagAAWF8P/iZB5DCJDh8HESuRu8it\nPATE0SARZWKxMhP0TLWe1Cy1JU10i9yb6nUscJMYCZen9uSkIJw16SzYjZ3J\n8yKQjm79P5OIc2b1z6pH4O24+Tivy1ACE/ZYA8cBv2Y71kFeBWgsmz4TYLfw\n8Gih2LF0hiwyXa2+mXgTJ1xMUrit6Y5wFM0A0IaPXqd8oDA9u7b/LihEIZ6Q\ni27zbfZbnfCBXyqRxoprMi9Efo2AYGEH5fq1JbeJw1ZHmadhYG+YsjpoH9vw\nv8ZVSmheVsFd9GFYAsmdTorHeakdIOR+Id/DzRi4SS34U3acAtP6oZFzRAON\nt5TW0as2eh1qKF4N73FwPHfzW3M9HuCTU02uRuURH7sDZEEQ2J6OLKvM9osd\n6lQi6xNSnuYrZAhtPJCHdSOXc701jP9My7zykTcCSKGKNiDmJQcsG4/6ctTP\neNIIbkeAXQrCZ2nhaujkygKYH+MU/RKpZI59WAuehPWfl2EMN3YTQ2YDfoeI\nznwSNKoI1Ek6HuLyfapGLul/LBJKr3ZuBinlZjBlzEZIzCJltS3S/Rwd8OGA\n7zp6Ond+5sL9icCnWINMl7/hCLuzriQZvyU8EkDPe+DybffJM4j0JaZGLv0z\nay5CWj5OHmLinj3b59R1hfhXUL1dOqN5CBXptiMqu8Q6cZSY03oUmipe0asf\n9I3J\r\n=13xX\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCID8Uk6TEP0R0DXba0yMYcYUXyNZJ0eoUJ0MJHnJAbDFdAiAvXTlhJ2X/gYqnCu8vA9Dt3NuicCvj264e+a202ejn9g=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.2.1_1569264816448_0.33785840500118125"},"_hasShrinkwrap":false},"2.3.0":{"name":"uswds","version":"2.3.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^12.12.9","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@babel/preset-env":"^7.7.1","@frctl/fractal":"^1.2.1-beta.1","@frctl/nunjucks":"^2.0.1","ansi-colors":"^4.1.1","autoprefixer":"^9.7.1","axe-core":"^2.6.1","babelify":"^10.0.0","browserify":"^16.5.0","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.10","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.6.0","eslint-plugin-import":"^2.18.2","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-stylelint":"^10.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.5.3","handlebars-helpers":"^0.10.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.2.0","node-notifier":"^6.0.0","node-sass":"^4.13.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^14.1.1","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.3","sinon":"^7.5.0","stylelint":"^11.1.1","stylelint-config-prettier":"^6.0.0","stylelint-config-recommended-scss":"^4.0.0","stylelint-prettier":"^1.1.1","stylelint-scss":"^3.12.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"d8604d224b83763f4308786ec78c5e5d7b6f35c0","_id":"uswds@2.3.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-OQUi+KvygkeewYyyeUazdr0abx25QMMasOXVyjYisR3BaE+mU7y263kNcYTKRiUp3rOBfJf8H45rS0cM45TEBw==","shasum":"58f8b86cc6bb8c6cc00eb6ce238727f4a4a10c49","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.3.0.tgz","fileCount":1185,"unpackedSize":15107489,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd1bcKCRA9TVsSAnZWagAAWTkQAIlAuFM+LIsRWnGI6owA\nGj08CFfuOTOKkS67txtNUw60DtmHp57JBpVGCwl35q+2mH9j/EWlMpwXsqj7\n8JulLxM/C4QVbw/w/yBiTcNZHSos5HioF9244vvfaBuRuYrJ2l5bQ5/ZMkku\nao3yEkMDG77CmxkrQrLeBOCPoi36bGgEF9L+urWG83C9fEwKIdjZUkkwXL1N\nUkzwTsr/UFh9v1EI6MFehUHdeCSSzzK6lOjayT0iteleNhkqTm/oCVScf6+R\nDsO6krbN+rnPJt2YvO0mn8sPmlQVT/Ws9tGumV3iJOycykHlMWgcswvCjiC+\nxIs1iCHsR9k/Kwz/1Hkpu96AbDhajqHajxGrlXLS/VVhBiOE1nJaIntoUCr/\n3y4iXTVCnOTHetZ7JIFRArLwL5BOr7SDU+gbdaMEXsAMwKKgfvUKG9l7Yx+u\n3qml23R4IO1i+8Z6v9uqqc0EUXLpMVy00YNjyMJQ65ozUWZ+BMgKb3SrhMbl\nF0B4OcxJ3AGbiR3Vi0UQ+M+5T7XpCL3M/AvCCE5lLPNEiTEaK0/OJ5+dTHWZ\nU8mddcWVXXQkmYboIo5TeH7PgTAH8YlpT/rYThJMVBKgZEXR0DVbDDGLHENI\nyqRAtCB7m8DsFpNCYioJlMC0uIxM+tGTtQRN4nGN6KBrlF+EvCNfWSBAykEV\niKs1\r\n=VUeA\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIA8X98H64n53zw9QdoodQ03bngZTZsEETj6ZhoYsxy4MAiA46R+qiopuucR6SqOHkekaHkx9XD/MHGbWmpQbtoUDtA=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.3.0_1574287113602_0.23861570722017755"},"_hasShrinkwrap":false},"2.3.1":{"name":"uswds","version":"2.3.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^12.12.9","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@babel/preset-env":"^7.7.1","@frctl/fractal":"^1.2.1-beta.1","@frctl/nunjucks":"^2.0.1","ansi-colors":"^4.1.1","autoprefixer":"^9.7.1","axe-core":"^2.6.1","babelify":"^10.0.0","browserify":"^16.5.0","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.10","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.6.0","eslint-plugin-import":"^2.18.2","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-stylelint":"^10.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.5.3","handlebars-helpers":"^0.10.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.2.0","node-notifier":"^6.0.0","node-sass":"^4.13.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^14.1.1","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.3","sinon":"^7.5.0","stylelint":"^11.1.1","stylelint-config-prettier":"^6.0.0","stylelint-config-recommended-scss":"^4.0.0","stylelint-prettier":"^1.1.1","stylelint-scss":"^3.12.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"26bf66f5bdcbec54eb9515426ab7d797ae722d9c","_id":"uswds@2.3.1","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-+jzEhNjTMc/ZfVooPdnHEM+kTr8IkrKHjlp2EnJI4/LSZu0n8AXClykzj/E0Qo9u6ueonSE7af/1K/TC6+JH6A==","shasum":"040dcff599e1e1e3eee78814ea3c5e9f3b26e869","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.3.1.tgz","fileCount":1185,"unpackedSize":15106525,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd1dnBCRA9TVsSAnZWagAAmYQQAJ/MN35TmKGkQbWUrg0Y\nkCFuMKOvb/2CT7c9l4uCL1rP634Yqs6ISdHbsV1cqeEHjJl2p9tEXyv62O50\nbGb7fdU9iFFVk4H2a1Al9NTMLd7wb4kR6hCTrmlRYcEXaIx1zF1o4vWMJtvB\np2QeOOIMJwyFznA8g3HeliTAv2CuVpDZaxItruWZjG4lhJibJJ6nv1hal2NN\neOR12x78p33hO6H1WP15/JLiN1uJ1x3N1nnHpKzHJ59dUEp2XTl0B5ktQE92\n1IT4ZrWQ7z/QRGYH5NvvOWCTMUjA2MLAKqBVoef9v2L2/vtjvoauvLrgEVfY\n/wUM7d3pEEuS5sETztHYcM94eZO3kYGBTqY+l6IKPDQOW6u2lOJRhABi0uTr\nS2mZnT/MlBV/KLvVeBYFueCeQdhtS2OjkiGLu6qqGBmEyh1Wz+3O7h5G2/Xf\nN9TWYobZft0bxvC7iSWQcjabiyOXTRMKCVe8H4pT7/oPIurVkhg8ZTasgaag\nLIs14fAM4mQBB9j6WhMoO7qBsy808Imkd3lYuq7mQ2Rj3ZPcJ5Iabwzccqb0\nVH/vPj1DqTzoEfflz0KAz5piVmYwJ1yHHvCZ7emeo5n0rr4c8wAfxOtJeP2e\ngDiTZVd2K6LOC8kVGNJMAHZi3eC5+RgfGtp0exX7V1c8bS8/caTH9iZS+srJ\nYitQ\r\n=UiU8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIH6ykI7vPR9E+GAHXqGg0S3FJ+WAn9juw4kjENtoMZ5PAiBXlmzyWnM41c5LbgCbglhxIoiqq3khAwQe+jUE+JRiow=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.3.1_1574296001144_0.24279294706419452"},"_hasShrinkwrap":false},"1.6.13":{"name":"uswds","version":"1.6.13","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","force-build":"npm install && gulp build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test","test:unit":"gulp test","version":"gulp build release"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^8.5.5","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^16.5.0","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","stylelint":"^11.1.1","typescript":"^2.4.1","yargs":"^12.0.2"},"devDependencies":{"@babel/core":"^7.7.4","@babel/preset-env":"^7.7.4","acorn":"^6.3.0","axe-core":"^2.6.1","babelify":"^10.0.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chalk":"^2.0.1","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cross-spawn":"^2.1.5","cssnano":"^4.1.10","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-plugin-import":"^2.18.2","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.3.1","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^3.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^10.0.0","gulp-uglify":"^1.5.1","gulp-util":"^3.0.7","gulp-zip":"^3.1.0","jquery":"^3.4.1","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^6.2.2","node-notifier":"^6.0.0","node-sass":"^4.13.0","normalize.css":"^3.0.3","nyc":"^14.1.1","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^2.2.4","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","snyk":"^1.136.1","stylelint-config-recommended-scss":"^4.1.0","stylelint-scss":"^3.13.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"e4d80eb1ed96663ef5ddca63b9a4e957d2a73aa7","_id":"uswds@1.6.13","_npmVersion":"5.6.0","_nodeVersion":"8.10.0","_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"dist":{"integrity":"sha512-s0Nr/TU4bcrqG89oC9ncxR9uhx2mf7C83qKnyKkhWHsdda9J8bDCcf7fFSDLcNC2DQYWHvXXPCRly9/od8XtAg==","shasum":"194c03cf58be9885432bab4783b59e877e27e61e","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.13.tgz","fileCount":805,"unpackedSize":6142451,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd3SEsCRA9TVsSAnZWagAADEkP/31Gd6BuHqkMdCu9nu2F\niRm2tf9/bMMra3PnLzI7A8quxjWwFYzdcxaN9sIxfk9RDNoHEglgmM4FTeod\nSn48qiRiUDRPU4EvEdnaX21phbQKwG9w1Be5r6PPG7BuBia7/qRu/Y8+xBgV\nhGWzMfDoHDAX+/NgUrahGjEVcbOdoa89Q1c+LvtlluSyq+YYnbDcaKamzhCt\nGr3OY8cu/2STb3C/J0byYxz0tED3/5PWgDzLu77Wijmn1vyhZSQ+jG6m6zYT\npeBe5QsF9sVmlBhc8xkqdZQp1T8KAdizutzLS/Qa5omIH8XmMwXQcKp6c1sh\ntaY8FRzLPS/5r8DzdjILvlgdul6GVZjEfj78ctL4WwcQn8SZICmxjtB6gOTN\nGN97ravuaXCVbL4frROgR7+Y2Tl0t7Wujy9TVMYCY1aQ59TWYXrpI2DgkT0h\nOLG6xD/Jjf9PEGNk+A1KDr8Y8ulbsa4OlS9RT2YMaLPPdYrEkOfLbzqTbtkT\njVjBeLm/312m0DXRmT73lt7BoAcexfPzllTAldHrqsadT32MOOvvo7iUGXu1\n3RJfSkgjk9iIN3Fp+tqH2nWdwgnDMqRFZUY9XaE4hz516EyLib9K0xnsTlvh\nN6XGbkkuBQnyharsXaV1upx2DixypSz2Fx4q3rR3alxYOfeGTvvHsrKhmzLr\nAJM3\r\n=dkqY\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDVP/hxWrjRTMn6+aMfjbqyyc1SMTaUUL0hbG0o320dHwIhAOQ/NMXOlDON5kc/fKugabFOb6rDqCDECqUXpqytw1NZ"}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.13_1574773036068_0.699006368232217"},"_hasShrinkwrap":false},"2.4.0":{"name":"uswds","version":"2.4.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/{components,core,elements,utilities,settings,}/*.scss":"build:css","src/stylesheets/uswds.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^12.12.20","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@babel/preset-env":"^7.7.6","@frctl/fractal":"^1.2.1","@frctl/nunjucks":"^2.0.1","ansi-colors":"^4.1.1","autoprefixer":"^9.7.3","axe-core":"^2.6.1","babelify":"^10.0.0","browserify":"^16.5.0","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cross-spawn":"^2.1.5","css-mqpacker":"^7.0.0","cssnano":"^4.1.10","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.7.0","eslint-plugin-import":"^2.19.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^5.0.1","gulp-stylelint":"^10.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.5.3","handlebars-helpers":"^0.10.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^5.2.0","node-notifier":"^6.0.0","node-sass":"^4.13.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^14.1.1","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.3","sinon":"^7.5.0","stylelint":"^11.1.1","stylelint-config-prettier":"^6.0.0","stylelint-config-recommended-scss":"^4.1.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.13.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"d7ba268fe177df17817f01b397ae24b057c9f179","_id":"uswds@2.4.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-2/4sQmkO7g8YlVNbb8hwCrw6+HTXHukjWFXhgCCYKAyEaHBUAAkrOqqCh8jVUyEsj73K/91FhRIyAXxHhRviBw==","shasum":"6dc24263c1f60aabeff600fdde33de43f5917534","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.4.0.tgz","fileCount":1189,"unpackedSize":15119858,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJd+qy3CRA9TVsSAnZWagAAysUP+werz2VTDnuyw/lVAxCn\nW9BVH7ufgHY0p8HL43zvzDcIFbBbxrQoMOgfPyyUIue+77PtjmOS32QdjZUZ\ns83C5paigdffAa1LzJWd4FN7rNvm0kgXr39kRNnYVKl0Mv0NsJM5+K5sOkud\nkfM89iZv69x0WMBQCA0xoCXb3tISuXseDI2AdchUnauAJQurnmJAyFm7izR8\nKCAd0UgedfSHN6b4Af4Jtvj5erwLtaOsuASGPs0l7BSNnXTI/5JOGmbPtxIb\n55b3djqXkPfvh5059G3w9NVHxLwMr431oTYVyQJXDfgEaCUPhzvKqwMufrlg\nfLAyGLkbMjXiV8FZnA92JcO5/syuZV2QL5VNeDaDTg7FPnfMxaEwrgs3YFQ2\nUnkmNaJtrPHsvbnw2QhjzV17eBupqPNCtcoAEj7dAoIJSGkyoWvEXlZS9YYk\nWGHM8sQ/NPKm55ohLpKrBCatSqiPEG39+CAUVOkLpOgoWkpdnwsXlRcJZyoJ\n9qN0CTt1v2ZwLFQksgHgw5x/C9l9//bkYexaF/4SYpK0X7o/KWU/oL9P3n47\nujJTbWh7NtwVrKkWY0lLQkbJ7uv4s5WymyTmo4BSvhXp2kNbgR6XGEX8OWXu\ntfFVqmutsCD+9e4LApUAF8pIChuJTcdt9JPgYyu+KWO0DDYqTrmO5Z46Aonh\njqTn\r\n=Ndq/\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIDVknU53xR/yIHQAYNGsATPD1qMsZ6cHEyuBvbDnq5VDAiEA/yw2pAWsRJmvsGESFRvfOe2AIi4melDnw/t1ffOGTgw="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.4.0_1576709302983_0.6015826506678923"},"_hasShrinkwrap":false},"2.5.0":{"name":"uswds","version":"2.5.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^13.5.0","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@babel/preset-env":"^7.7.6","@frctl/fractal":"^1.2.1","@frctl/nunjucks":"^2.0.1","ansi-colors":"^4.1.1","autoprefixer":"^9.7.3","axe-core":"^3.4.1","babelify":"^10.0.0","browserify":"^16.5.0","chrome-launcher":"^0.3.2","chrome-remote-interface":"^0.25.6","cross-spawn":"^2.1.5","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.7.0","eslint-plugin-import":"^2.19.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^10.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.5.3","handlebars-helpers":"^0.10.0","jsdom":"^16.0.1","jsdom-global":"^3.0.2","mocha":"^7.0.1","node-notifier":"^6.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.0.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.3","sass":"^1.25.0","sinon":"^7.5.0","stylelint":"^11.1.1","stylelint-config-prettier":"^6.0.0","stylelint-config-recommended-scss":"^4.1.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.13.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"216e186830a04a27d0c9c2412eecefe06456b8b9","_id":"uswds@2.5.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-DQpFpLCqPxxgCUeLYEapvfeP/+E0a3vEzLMYVJJqTOjGWgqwrgeQxgw0U8ip091L67y70709CEE5rYny7kLzSA==","shasum":"cc4c993f86db63ddb5109abf4ac0ab7e1ffff3b2","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.5.0.tgz","fileCount":1192,"unpackedSize":15522343,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeRudXCRA9TVsSAnZWagAAbYYP/iLNx1hWCQ2MPkFyYvb8\nT8gRlgBQgil8pms+mvb3lJAHKtqKnshx8Y6p/8f0VSOZn5BGYYtosOI4934V\n1GYpagalC6WToghg+BXIDEuphyiGZKjDqpzvW6JX0lqelH/kURHFOsQcoK3j\nip9y/y9XvFzfDaKPuvQMM7j3Kgd0QobT5dnWBWlkF24vKm6QTiXB+0UfsCiR\nDRwJrF4dcETft8fnjxPo54lBhPw2x0UOZA7uq1/Nc7efIz9IbBdhm5sxmElH\n+tpe5zGkch2e01X6IFQT1LplzX4U4QA71rj4spNiNf4tRPKiP8EBQFvSjRvU\n4gRK6IcWu288Vk46MqKE7PGTxB7fakwKejsg9XhJAneXgjkSHQyfaE/GyGeL\nr5sT86A6gFQv2Ld6pV9gs4Axg30lrsEolfRxF0wSo59nwFBQLjYvLUrUWIPs\nVxD/IRWXRLqZsnW5w8LJ1VzmzMEOpCtNpL/SThyFNrM2bweV7nGyJLZwTJ35\nnvnJIgB9KOIFTUrXMY2BmM+YJPRPhZhPkYJWZsYRlMXXDU6bTtoCqCQUhI4x\nnHnaaLfpwdDQdSFppLZs1iM0KwkHOWUOist4cUbovthHQc7/8rp61HiyWcpf\nwTu8wVmxappW7us6DAGXwVyQxmCm7KQ7qvrBcm0gcFviedfHjnJdSTfHQWKt\n8rML\r\n=hiLD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIA6DNZaBQrrhWSVYQkVGncxdxmgQioVzCPEEQ3nULKdiAiAVT7uiZSaeixW7pmXlY76JhAj+xyFqh6BK9JF3UgPtiQ=="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.5.0_1581705046270_0.31661501306706796"},"_hasShrinkwrap":false},"2.5.1":{"name":"uswds","version":"2.5.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^13.5.0","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^12.0.5"},"devDependencies":{"@babel/preset-env":"^7.7.6","@frctl/fractal":"^1.2.1","@frctl/nunjucks":"^2.0.1","ansi-colors":"^4.1.1","autoprefixer":"^9.7.3","axe-core":"^3.4.1","babelify":"^10.0.0","browserify":"^16.5.0","chrome-launcher":"^0.12.0","chrome-remote-interface":"^0.28.1","cross-spawn":"^7.0.1","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.7.0","eslint-plugin-import":"^2.19.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^10.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.5.3","handlebars-helpers":"^0.10.0","jsdom":"^16.0.1","jsdom-global":"^3.0.2","mocha":"^7.0.1","node-notifier":"^6.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.0.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.3","sass":"^1.25.0","sinon":"^7.5.0","stylelint":"^11.1.1","stylelint-config-prettier":"^6.0.0","stylelint-config-recommended-scss":"^4.1.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.13.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"fe40d6f29fa9db2606cfb066486ad091a5f66e05","_id":"uswds@2.5.1","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-Ga4PFiscrLcKiluPQMlbxKKL/RQJnDh/zQEDxhUbWjUGRgvANeyulq+KUDaCHieuu4owFAFWDo+zdZzy5GPjrA==","shasum":"28cd0f07c1533dc94819ce9f94f423bd66ba600b","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.5.1.tgz","fileCount":1192,"unpackedSize":15537562,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeXtZOCRA9TVsSAnZWagAAG6EP/RNZsw9ioQaR+6PiHtbc\n4gMPwsjPaE9r7WPuhV7YV+oS3EoHRlWQaZFHNzKzXSnfCbUPG92PHkkb+Yyw\npIofUIURqJyBQT1TtGYsLkGmlzvOjlZ94ydJmayFgRvuU7K7PJ9Qb7vJdYAx\n/Tyt6BIjaD68DVSTpZjwwc239LVyQT/g59HtCdq951iRzIaoR5oWmaJjXOM5\nmF1kCn6btZSDXA0KslmO+9eDEWQneAyoxrgUFSReMi6u+RPJo1Y5gi9Y6cDq\nDpIDyUO02Oj9Q8l4BkHb0mG7x4R1gq6g3maEfbibDV2t94/HGH4StdTaYnwn\nPZMvn2CLH1kitntL5JaNs3IMHF7qTsjvI09xCWamSRo3ZJ/lCYs1aO3WOrAC\n+R1TR5078LZ1tezkWyZUA51Wb0CoujEBBGwT+w9Gx5KZk8Tc6Mkkfoj+3Tck\n7SVfzm/392L9dSqljd1h2+xgaNCZy6OgOlE3lseLicfoLCBa3xZakY/jCFMv\n8Ii8sWAVR24o3G/sZHcgpza5d5rqgV9fZvJs1GlXyLV8vzyWu6+Eep18wcV3\n2htj2tQTVzZqHOdvTT/r4mGRqJoVdjZ33GguYbSnSovDKExl8qhF0ohnSEmm\neEz1olq3lbA3Be9Rm5okLI4V0daVxWCCKL6eyoYXeLG9xf0UmCcgyRwXv8w/\n+1bp\r\n=BzqL\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQD3MJCq6JifnpcnG+ZJleAuL/1QhrC4WubK4rGe0/U4AgIgBmp9b+sp39UeD/SqcDLZ0HVhp7ATaa+indWtG9JNIWQ="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.5.1_1583273549253_0.24440254377003257"},"_hasShrinkwrap":false},"2.6.0":{"name":"uswds","version":"2.6.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^13.9.1","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^15.3.1"},"devDependencies":{"@babel/preset-env":"^7.8.7","@frctl/fractal":"^1.2.1","@frctl/nunjucks":"^2.0.1","ansi-colors":"^4.1.1","autoprefixer":"^9.7.4","axe-core":"^3.5.2","babelify":"^10.0.0","browserify":"^16.5.0","chrome-launcher":"^0.12.0","chrome-remote-interface":"^0.28.1","cross-spawn":"^7.0.1","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.10.0","eslint-plugin-import":"^2.20.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.7.3","handlebars-helpers":"^0.10.0","jsdom":"^16.2.1","jsdom-global":"^3.0.2","mocha":"^7.1.0","node-notifier":"^6.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.0.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.4","sass":"^1.26.3","sinon":"^7.5.0","stylelint":"^13.2.1","stylelint-config-prettier":"^8.0.1","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.15.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"91c56d4d03c51e691a31eec32b449549551438be","_id":"uswds@2.6.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-5Q8ijTMBJdJSoiU01RTTk/eGVkjeKBsIOTiY1l5xq8M0wURKWeHzfh0a/Lj4vozwbh1h0onrvPJkyaklHKtFOQ==","shasum":"69aa3d80cb81f1ca99ccf59fae6a76b1c5c2ce8a","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.6.0.tgz","fileCount":1193,"unpackedSize":15540577,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJecoZ4CRA9TVsSAnZWagAAkP8P/1ydiKFvPxeL+mimvkjc\nVfQTqZ0Uv3nxqLUvKZnZXMgB5/GqgQqOLBGSBeZi0QFTs2HjxyY49s57e/f8\nGmne0J6cDgHl8dZpqEwNnW5B0gLMzidQaDtaxlEDHOM8LpVASnomacKI0uX3\nGQgV1nhNblohB76+KSBXd9HFP2/L1txrSyOQG538T99VGw0Sr3v8zB58asx7\nHB4EUeSD2n/s8XTfOZRhAn7p+ioQL1sTJacY2v5ReekGBtUF0A6ekK5XbT9t\nACMwpGw67SXccx+jITqs15O9dv1kxt2HIX6LlSITTYzSMNsmYC1npseKAWWK\nboFokMdBU/vhj0hY73NItNH3ppSQgeOwxxr3Hj8HRiKPd1fpbQ5WKveyAGt/\n7c3XJa39M1iDq3dPSMQaS7yUNHXImV4ZKpFPHF9BEHcHA/+bWdSwbFGfdCUa\nQvxNgjAo7hnnKNE/DNjN86sx7C4ua+6a0g2rILzfUhZjg/fgAlttPyLP0oAI\nc//q/cLOiSQfsjnWT93p814/gxZscgDJ32EWwqa+N8SFBj8LFMfzvTPfniKI\nl3gJvW1aF7v2eZEK+hsC0CWNVd8NTCs5WNbnZ64Ufw3BAEhgvlk7s3kjh7I+\n4g7H67SNkLKB74dh74ROoJb7LBKR//lyL1ILmszldg1Y96TppAs171bg8E7z\nlNlf\r\n=158s\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDVX2Fqn0WAOvx3p1XrVFQtx9Oih6EohDE1WsjgFqabmAIgFfhJM+GzW9C5QlQR/6FS6DJGsF0BokGosix54YKwUjQ="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.6.0_1584563831457_0.4805437125185499"},"_hasShrinkwrap":false},"2.7.0":{"name":"uswds","version":"2.7.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^13.9.1","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^15.3.1"},"devDependencies":{"@babel/preset-env":"^7.8.7","@frctl/fractal":"^1.2.1","@frctl/nunjucks":"^2.0.1","ansi-colors":"^4.1.1","autoprefixer":"^9.7.4","axe-core":"^3.5.2","babelify":"^10.0.0","browserify":"^16.5.0","chrome-launcher":"^0.13.2","chrome-remote-interface":"^0.28.1","cross-spawn":"^7.0.1","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.10.0","eslint-plugin-import":"^2.20.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.2.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.0.2","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.2.1","jsdom-global":"^3.0.2","mocha":"^7.1.2","node-notifier":"^6.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.0.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.4","sass":"^1.26.3","sinon":"^7.5.0","stylelint":"^13.2.1","stylelint-config-prettier":"^8.0.1","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.15.0","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"4eb6f95b2a1b28ecefc1c9e2ec0f77d94b298cf0","_id":"uswds@2.7.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-1NJJFg5PzPHWt/s7lHGzU1ox4xEA4+Njs/2h2xWHDscA3THvm+vMCvpnrKP1M9yzdXNd3Rb/G5se0w+2n69XkQ==","shasum":"83af2f8d097b1f3d313d8b43f004558d0d40fc18","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.7.0.tgz","fileCount":1217,"unpackedSize":15786153,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJeucC0CRA9TVsSAnZWagAAD2cP/jwnErtDNS8rOy9rsz/u\npUj4FbKElt6kaYCgP+1gjGfPY24LOLlENhwuIvFBZXCvmiKF8sDpmAsOP7On\ned0JqB/vKbmANlQrO4Ep1f8Wxm4R4TKXW1RsAbXqv50Dq6bTB4uKbJnVwUHP\nQRsYVOKDJREloaKgoOD5pkUCEivsu7gcI2JZ3qgAu2Nk7gICuxZcO2s+Q+Gg\nlcLz6LZpOGxrDzeyTj4TsmfQckh1mFou740O2FiLFvB7lRYy4sEWWBPbOV6a\nTR/J3p+/WBT5xDKiCO9NacBv490kkzge9gkVM4MiD5EJBlDcyTjEZ4hHSjQ3\nmdYubHV77WMeGzcjozjNgp3/rh3FDkLs0HSasCmCS2wX70qHg73dAM2xm9aW\na9IcnqFlCcDcUlOQzM76t82TqUU/nSRiGOrR7XO6X8k4T+lsjI70AMoSmuTQ\nkRiUkrhJGPBMXDvxslPVv6BrNgFXHhpsWE296r6SBymRRWIyVDzGlQMFP0X3\nUgUU/vK/DZLzC3oTlJR3SxR3I2F+Nfv2LJSaSCiJmBQOQVbOMpQesMP+HV14\n2ibK1+fI0jViehaKZjKPtZXdhYqoXYsKWJfFsBh9ZoyqxVZ8cvt60/2kMLMc\n3uuN6Vp/o8mBw9gYpgJ15G36CyCmAzwp8cwVnfL/cCVXQtVTfNq8SrKPxHgD\nrcRM\r\n=bvz7\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIApbu2bUmyTpbjIGBG5ZYU4WvckE6gAVbUbByt3KLg/yAiEA1/73Yrn0H0eBeB5tlEzRpq997rLPfKILqD3HVZj6D2E="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.7.0_1589231795257_0.6285423426355108"},"_hasShrinkwrap":false},"2.7.1":{"name":"uswds","version":"2.7.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^13.13.12","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0","typescript":"^2.4.1","yargs":"^15.3.1"},"devDependencies":{"@babel/preset-env":"^7.10.2","@frctl/fractal":"^1.3.0","@frctl/nunjucks":"^2.0.2","ansi-colors":"^4.1.1","autoprefixer":"^9.8.0","axe-core":"^3.5.4","babelify":"^10.0.0","browserify":"^16.5.1","chrome-launcher":"^0.13.3","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.11.0","eslint-plugin-import":"^2.21.2","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.3.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.2.2","jsdom-global":"^3.0.2","mocha":"^7.2.0","node-notifier":"^6.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.4","sass":"^1.26.8","sinon":"^7.5.0","stylelint":"^13.6.0","stylelint-config-prettier":"^8.0.1","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.17.2","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0"},"gitHead":"1b6984f37d163d140e2afa5108dd0bc2866e6db5","_id":"uswds@2.7.1","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-RzczCK4TfnJud6WFj7pV6er5BQ0qQviM/GZgyDkYT6ZvOIXR0khbk7WZR72a+vy75fEiAzJut4N/x5/UZq0ZrA==","shasum":"43f719fb3ef450e3faef722d336b29a39f6eee3b","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.7.1.tgz","fileCount":1225,"unpackedSize":15872532,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe6mbmCRA9TVsSAnZWagAABwsP/0rjfONV9tGB10g40SDi\nGWheIOk87FiGVk+XGz5CLTRJEV/7uCWox+hLsZ7/NuZfvl/+mki9LGsOqXTd\nLD04I2TJiqtlyMNzFU+SMB0Cea7eTukqUn/fXMQCNXPio8jihQljQgItW9DW\n4uP/DjWdtekRmFyu8BtuwRKGxjz+sXqb0d/WtHu5qwaqdhWtHzmDxSwiEnSG\n9g0EbeMqNpoq2Y1laTbKJLvhz8RVN8h3bBsRJwqv1qZBtnypvwYklyqH7HCa\ndusDU3NLIzVCXANf3h6SW3N3lbgmdIEc4lVo8qv4Iwpmxxr5qjA1BHLvChTh\nk6MnZcmr4VNgkp9Q6gWsGuajPpsvRczLNMd6mvMxyP06pDtFkfiQ4RTUn9zR\nKO+mU4Ei/3uGcKQYarQaW39vzkuB2hF5UZpP3kMETm4Xv3EbSMOXV77+IRjQ\n1upHzLLhmFZD2m78bOmPNxIs2KoPC8Bt69rPZZXXNAVYp2TsZ8ln0JO3rnBk\nu3QFoZY/aN7FxEU+ChCODapeyhtS5H9jpWyzRI4UU1hGBGSiIu/GZjESVufp\n413xpVU47RXu7usZZM5BhNmwhyt7TWiQFYBRuHhKmnGgzTt1hNlU571dQS1W\nHDvW0nto4NX17urUX7afl3nHg3CUKQa3fFZxlEFZev8LgpZS04r47j6LRqYU\nk1k1\r\n=AK2M\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCtqzDrwSR3JzeKvKwECWVOlbKqS8ylRt60ddPh6w/PRAIgEGPYqC9Ua/U+TTPbaDi6eSpq9E8jeL4ONZiJOZ2HV4M="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.7.1_1592420070164_0.12380979649071189"},"_hasShrinkwrap":false},"2.8.0":{"name":"uswds","version":"2.8.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.10.4","@frctl/fractal":"^1.3.0","@frctl/nunjucks":"^2.0.2","@types/node":"^13.13.13","ansi-colors":"^4.1.1","autoprefixer":"^9.8.4","axe-core":"^3.5.5","babelify":"^10.0.0","browserify":"^16.5.1","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^5.16.0","eslint-config-airbnb-base":"^13.2.0","eslint-config-prettier":"^6.11.0","eslint-plugin-import":"^2.22.0","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.3.0","gulp-eslint":"^5.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^1.2.2","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.2.2","jsdom-global":"^3.0.2","mocha":"^7.2.0","node-notifier":"^6.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.4","sass":"^1.26.10","sinon":"^7.5.0","stylelint":"^13.6.1","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^2.4.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^15.4.0"},"gitHead":"ccf41c579ede18ca844ca5ff2555f90e500f58d2","_id":"uswds@2.8.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-LI7ZNbh823ehtThvebwQ5eHNKGY791vcT5d3T9gJ+RY511HgstWLRSEEso7YO/ifjoV/FwuTAtDwQqt7zsXRvA==","shasum":"635e829555a359562f28ab51e1b6c983f149f739","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.8.0.tgz","fileCount":1305,"unpackedSize":16727171,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfB47sCRA9TVsSAnZWagAAbVUP/0XAp8ZOVwilcYNU9t45\nB2xlBo8YSWZNBhqF5kvJb+qRkod7T/gMnRlLj2dTWasY05D8qO6PzW5xB6lG\n/pKK3AwxUEJByxWMnfWotuETMUzTrLIFV0y2zhqdzjWDbAMTrhy4KBFxHcs0\nwkIY7pd+Xby3CfAXSsqLXJzO8N/pRSun/cujZDZnauTnjcTX0FS2eyele4jZ\nV/lQDZ4iZd43gDxmoJcngbCqlVgbTeYfqX2VbCU9/n3dmEOQ1xpifE0JNQYZ\nVnr0g1TSnKfwNnAC3NUsjSM8Y5xtJ8tb3bB6XtzzZPfn/OCxgw30i2oQwByC\nNSgP8Fw9eDuizk5Z78ZbA0O8TqxyWtMvo+MUu1Vtz3LVGEFvKjTgzq6xdpo4\nfLes4DKT2bUDDZU5LzCF+8Y5MNwv2l5kGSUJrs0EDEX5/rvNx6WIL6o8ylE4\nzprFjOUA//ShJ5Qh7tehDehCPB+x9GTXz23+CfDE8zTkoguGoljblXVRCuic\nCooC51CI9ZY1IRSM40HvY8Jl7X8utpIjIAEQ6zLtgXD05dQJHXF6TGFH11yU\nKUKETl3fd+6XbUwyyQCIq7vRl0H1+impzjodyg/n0l/eOWwwlfuva5DmQO2w\niR1wpQI4fpQ5SGcWlxgsAnOzv7GFdaOxLwH9CGV0l5jXx6Nj1iannL5HkGxp\nFDre\r\n=QjPB\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC3ZxwZb4uh9umok55p4Y4GiS5GV8YS9G/enlQ5k+IakgIgIyAyr5wPRXQn55TsXm1kwRDk4dJ8PnBlfZHk8t2QYtc="}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.8.0_1594330859450_0.8487225031597139"},"_hasShrinkwrap":false},"2.8.1":{"name":"uswds","version":"2.8.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.11.0","@frctl/fractal":"^1.3.0","@frctl/nunjucks":"^2.0.2","@types/node":"^14.0.27","ansi-colors":"^4.1.1","autoprefixer":"^9.8.6","axe-core":"^4.0.1","babelify":"^10.0.0","browserify":"^16.5.2","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.6.0","eslint-config-airbnb-base":"^14.2.0","eslint-config-prettier":"^6.11.0","eslint-plugin-import":"^2.22.0","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.1.1","node-notifier":"^8.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.0.5","resemblejs":"^3.2.5","sass":"^1.26.10","sinon":"^9.0.3","stylelint":"^13.6.1","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^3.9.7","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^15.4.1"},"gitHead":"bb4e084fdab2e4f78def74254ce11efe780d8e2a","_id":"uswds@2.8.1","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-x7RkaVFVuRxptsuUZka6Mc+wUUL98keorOUFVxrBIgd3KV18upuF5V7osm9sN/q6bGvwh2zJyfONETLUU8Eemg==","shasum":"937505ad8f7be4c131e6d4e01d0128cf0995a49c","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.8.1.tgz","fileCount":1309,"unpackedSize":16757733,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfOp/ZCRA9TVsSAnZWagAApAkQAJ/B1ycHTkI0CvfeY4pm\nhaEBRxMOZjvErw1w5+aaY7/Nyj5XgOs2jGlXBEbwgJJYEB1mfSt279MUfUge\nX2uCv6OXoU5+NWF0NffzDiZwUNQM1zRKkE0XJZFtomehSopG4oXuDtWNnDz1\nbFRzxQfM8RwLHNRB18GMi8gKWPDEJ9YadJKQNhCZG7gZksTaIF1/h4AUiXlN\nsWv/VM+NPniLPSf8/pUgK7frEwYcTfgen1eTG6j61nOC02rfKgb3d22W1RSH\nn9+Tr9vBQBShg72ipIs2F1Q0H79WA2kCkQSP+VUfQ9fRKQeQK/XjS/dW+0uq\no7+2VyEegEIhH8bop8LiBc1oBSXPCnsLel6lrqZI8KQ1ORbILOPvuHYPWhzS\nn5L0+B52asLO1/l0/f2ZJvqBDgFaBp7Q94v8rBXNqoouvDgT6tcoM4eeFtPN\nu0GzdRc14MhEbR84tdniS7fWvkosGufVKuXdwAG6OQf9o7qWk+wjpR3z/uao\n+Hn21f41Cp7f4Ot/P8HhPUYZSqSPpkybKqra6WAz5DlWyiSqF9kut7Y36LPD\nKC/sKhEe9ON8yxfYDsk/xYKA27Zw7vUrqj0UbVx7dDLH9mFt4RI/xrFJ+EHx\nXv9JfmiMiygzuJ8PqAcnVUc7xPMGWUsXmgC61vBHamQ2kcqyV5KIX0ZFgsPB\nNUJ3\r\n=77HP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDAOw9N3vP+16s+gMVLWy3sGJMdQ/Ikx88ZT1OPDkwNpwIhALBgdR3ZPbiewwNqNO+SwJyQMVqH9XFfTRxfSGoFE3KR"}]},"maintainers":[{"email":"devops@gsa.gov","name":"18f-devops"},{"email":"hello@maya-benari.com","name":"mbenari"},{"email":"dan.o.williams@gmail.com","name":"thisisdano"},{"email":"uswds@gsa.gov","name":"uswds-bot"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.8.1_1597677521349_0.20386792781009366"},"_hasShrinkwrap":false},"2.9.0":{"name":"uswds","version":"2.9.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.11.5","@frctl/fractal":"^1.3.0","@frctl/nunjucks":"^2.0.2","@types/node":"^14.11.1","ansi-colors":"^4.1.1","autoprefixer":"^9.8.6","axe-core":"^4.0.2","babelify":"^10.0.0","browserify":"^16.5.2","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.9.0","eslint-config-airbnb-base":"^14.2.0","eslint-config-prettier":"^6.11.0","eslint-plugin-import":"^2.22.0","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.1.3","node-notifier":"^8.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.1.2","resemblejs":"^3.2.5","sass":"^1.26.11","sinon":"^9.0.3","stylelint":"^13.7.1","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.0.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.0.3"},"gitHead":"6246a6a8a47dd50bd4092ca8e9eef28f51ff6780","_id":"uswds@2.9.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-5IMVgMCUUlgWVFrB7Wf1qTvv5L3oDDlSsAgvJ02+/sV2uh4JzO9YPm3493RTaMuHTc+feRCuYyEIloXsEQY0Pg==","shasum":"002089d74582960099b0ee836f89f043cdf6d0bc","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.9.0.tgz","fileCount":1335,"unpackedSize":16915467,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfag2GCRA9TVsSAnZWagAAmg0P+wQQcvDQmDmQ5vzVYzxN\nM3UaUdq2MqgGcjYKo4pCZavnLJIutZ2f7KSqZsAr+sUbtKwtwKASbnM9NCW8\njUVTE4DphVlJqjCfueuGfOgpo5ipWS2SGHU8/hMfU7hEVRFzO1uR0s20uda+\nyhsLPlEUm2n985B6R3TsXrBy1FjhYu8xgwYP87FHkWnGTZ1t4xfBtk6tZaOs\nbCHb8WO4c87BTurL/Er/xiHlu4eeT6rrZVVpqvn6nHFaAwOhRzlVpMeRlPcu\njUO1ElfuM83iS7LB/NieTZwIVO9yx3Vsb9P2MpZHY2BV/4WrVEN+GVI93h9o\nTurG5su+czMJjsgsXgLlATG9K56YJnACZIEJkAUM3+iIND0bOq+LmR4749wH\nSTwq3PiOvh8mssppwx7pva0Vw3PJwEWMYVvvt5lwd9pEQyQsZDD2TLtldOZQ\nj37JAuOjEEtMDiUlXeYJoJWdpwFzvaRqka8bcFCUoY5fnVRERJ6Qm3ktnqF0\nShMMZ0/u+G+XD0HtsKBng128yL88vjDP/NVQIunmXTWXbx29J1BhG+pu8Ec9\nez2rI7E67PRtkIj01zE8tBbzCWkVXpafgk58ZuKe5y+W1i9Dwbad0xN2WRAs\nRRq8WxEkFIeCRKf/dKoYRTMKqVDA3+nnm06CyLK/Vd1MX+tIQrTgmojbj6wC\nML9g\r\n=c/8u\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDdHiarpf0OF6pjoxMVspx8H3ndxbxccz7EZYoEe6WLGgIhANHOrdV6QNWQCq2UHuDNdQDA0lSJV2QgdH0PtNfZbdL9"}]},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.9.0_1600785797496_0.5768563562924436"},"_hasShrinkwrap":false},"2.10.0-alpha.0":{"name":"uswds","version":"2.10.0-alpha.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.11.5","@frctl/fractal":"^1.3.0","@frctl/nunjucks":"^2.0.2","@types/node":"^14.11.1","ansi-colors":"^4.1.1","autoprefixer":"^9.8.6","axe-core":"^4.0.2","babelify":"^10.0.0","browserify":"^16.5.2","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.9.0","eslint-config-airbnb-base":"^14.2.0","eslint-config-prettier":"^6.11.0","eslint-plugin-import":"^2.22.0","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.1.3","node-notifier":"^8.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.1.2","resemblejs":"^3.2.5","sass":"^1.26.11","sinon":"^9.0.3","stylelint":"^13.7.1","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.0.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.0.3"},"readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://img.shields.io/circleci/build/gh/uswds/uswds/develop?style=for-the-badge&logo=circleci)](https://circleci.com/gh/uswds/uswds/tree/develop) ![Snyk vulnerabilities](https://img.shields.io/snyk/vulnerabilities/npm/uswds?style=for-the-badge) [![npm Version](https://img.shields.io/npm/v/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![npm Downloads](https://img.shields.io/npm/dt/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![GitHub issues](https://img.shields.io/github/issues/uswds/uswds?style=for-the-badge&logo=github)](https://github.com/uswds/uswds/issues) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4?style=for-the-badge)](https://github.com/prettier/prettier)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n- [Background](#background)\n- [Recent updates](#recent-updates)\n- [Getting started](#getting-started)\n- [Using the design system](#using-the-design-system)\n  - [Download](#download)\n  - [Install using `npm`](#install-using-npm)\n    - [Using the USWDS package](#using-the-uswds-package)\n    - [Sass and theme settings](#sass-and-theme-settings)\n    - [Sass compilation requirements](#sass-compilation-requirements)\n    - [JavaScript](#javascript)\n  - [Use another framework or package manager](#use-another-framework-or-package-manager)\n- [CSS architecture](#css-architecture)\n- [JS customization](#js-customization)\n- [Customization, theming, and tokens](#customization-theming-and-tokens)\n  - [Using tokens in theme settings](#using-tokens-in-theme-settings)\n  - [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  - [Main variables that can be customized](#main-variables-that-can-be-customized)\n- [Where things live](#where-things-live)\n- [Browser support](#browser-support)\n- [Accessibility](#accessibility)\n- [Fractal](#fractal)\n  - [Template compatibility](#template-compatibility)\n- [Need installation help?](#need-installation-help)\n- [Contributing to the code base](#contributing-to-the-code-base)\n- [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n- [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.usds.gov/) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n- Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  - [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n- Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  - [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/download/v2.9.0/uswds-2.9.0.zip) from the latest USWDS release and open that file.\n\n   After extracting the zip file you should see the following file and folder structure:\n\n   ```\n   uswds-2.9.0/\n   ├── css/\n   │   ├── uswds.min.css.map\n   │   ├── uswds.min.css\n   │   └── uswds.css\n   ├── fonts/\n   ├── img/\n   ├── js/\n   │   ├── uswds.min.js.map\n   │   ├── uswds.min.js\n   │   └── uswds.js\n   └── scss/\n\n   ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n   ```\n   example-project/\n   ├── assets/\n   │   ├── uswds-2.9.0/\n   │   ├── stylesheets/\n   │   ├── images/\n   │   └── javascript/\n   └── index.html\n   ```\n\n   You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the CSS and JavaScript files in each HTML page or dynamic templates in your project. We also provide Sass (.scss) files in the zip package which you can use to generate new CSS with project-specific settings. See [Sass and theme settings](#sass-and-theme-settings) for more information.\n\n   Here is an example of how to reference these assets in your `index.html` file:\n\n   ```html\n   <!DOCTYPE html>\n   <html>\n     <head>\n       <meta charset=\"utf-8\" />\n       <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n       <title>My Example Project</title>\n       <link rel=\"stylesheet\" href=\"assets/uswds-2.9.0/css/uswds.min.css\" />\n     </head>\n     <body>\n       <script src=\"assets/uswds-2.9.0/js/uswds.min.js\"></script>\n     </body>\n   </html>\n   ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n   - Node v12.13.0 (current LTS), [Installation guides](https://nodejs.org/en/download/)\n\n   **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n   ```shell\n   npm -v\n   6.13.0 # This line may vary depending on what version of Node you've installed.\n   ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n   ```shell\n   npm install --save uswds@latest\n   ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.scss` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import \"uswds-theme-general\";\n@import \"uswds-theme-typography\";\n@import \"uswds-theme-spacing\";\n@import \"uswds-theme-color\";\n@import \"uswds-theme-utilities\";\n@import \"uswds\";\n@import \"uswds-theme-custom-styles\";\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires **autoprefixing** to work properly. This is included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n**Autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings via `.browserslistrc` config:\n\n```\n> 2%\nlast 2 versions\nIE 11\nnot dead\n```\n\n> Note: **media query sorting** is no longer required as of USWDS 2.5.0. We stopped sorting media queries with [csso](https://github.com/css/csso) in USWDS 2.5.1 because it wasn't outputting as expected. While both the minified and unminified CSS files are modestly larger as a result: `268 KB` unsorted vs. `259 KB` sorted, our testing indicates that once the files are compressed server side with gzip, the unsorted CSS is actually smaller: `36 KB` unsorted and gzipped vs. `38 KB` sorted and gzipped. As a result, we recommend that teams do not use media query sorting at this time.\n\nWe recommend using a **minifier** like [csso](https://github.com/css/csso) to compress your final compiled CSS and **sourcemaps** like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n## CSS architecture\n\n- The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n- The CSS organization and naming conventions follow **[18F’s Front End Guide](https://frontend.18f.gov/css/)**.\n- We format our code with [Prettier](https://prettier.io/), per the formatting section of the **[18F Front End Guide](https://frontend.18f.gov/css/formatting/)**.\n- CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n- Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n- Uses **modular CSS** for scalable, modular, and flexible code.\n- Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n- Hard-coded magic numbers are avoided.\n- Media queries are built **mobile first**.\n- **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://designsystem.digital.gov/design-tokens/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require(\"./components\");\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion__button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settings), above.\n\nSet theme settings with USWDS design tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Design tokens section](https://designsystem.digital.gov/design-tokens/) of USWDS 2.0 documentation for more on the available tokens for [color](https://designsystem.digital.gov/design-tokens/color), [spacing units](https://designsystem.digital.gov/design-tokens/spacing-units), [font size](https://designsystem.digital.gov/design-tokens/typesetting/font-size/), and more.\n\n### Using tokens in theme settings\n\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```scss\n$theme-site-max-width: \"desktop\";\n$theme-site-margins-breakpoint: \"desktop\";\n$theme-site-margins-width: 4;\n$theme-site-margins-mobile-width: 2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```scss\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```scss\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units(\"desktop\");\n\n  @include at-media(\"desktop\") {\n    @include u-padding-x(4);\n  }\n}\n```\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;\n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\n\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n- **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [designsystem.digital.gov/components](https://designsystem.digital.gov/components)\n- **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n- **JS** is located in: `src/js (/components, /utils)`.\n- **Fonts** are located in: `dist/fonts`.\n- **Images** and icons are located in: `dist/img`.\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n## Long-term support of v1.x\n\n[Version 1.x](https://v1.designsystem.digital.gov) is in maintenance mode. We will only make critical updates like security patches.\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n- Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n- U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n- Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n- UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n- Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n- Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"540801a518bc4edf01142859503ea8b04d1012bf","_id":"uswds@2.10.0-alpha.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-c2viixxlKnnqLPqW+Dfnz2853Ps4T6rIdaLY1XKXf7uVp7eye/sul2t5pjLFx0D4Fim0oxhCVGOu4bBWymXJZg==","shasum":"b9b2e70ecaf6833bb17b1f4c87dace3a0ea71ebd","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.10.0-alpha.0.tgz","fileCount":1663,"unpackedSize":17010809,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfa5DmCRA9TVsSAnZWagAAqGAQAJgLAmgM7Oobc9pTp4iA\nFGdpJ5t/7Zni16R2CYdAblsyIUQYODQbTjEvYEmppWWylTTfnP0xG+UcA70B\nczTBAB9f2SQL1KWElyyjE4EaiaTf7u2ul+oT1Xc6sdJrYj9lQIyx9C/QueuR\nNLi97ElE4YYgfjwpKL6oj5yGreYi4htRY7Og+cFHxmq4K31L4eX1RI9hqort\ndtUGsayc4HAUAtYlNn6nD2/pY7AZTuuMSaQGe8Etq9AKDlVYKDNowYtan6Ap\nxabkSSylLv9OpE4tn8VyRk7hgsJRQl7Ght+dH4hYhD4y+CesNhQWyoinKD9r\nFJYgY6cHMzcKHkgqljn0qDfsMjhdK3GSxloCveR/X85S5lzrWigZc64uk6z5\nXCgJySih+f/QDM3YPmgmgpLJIllQYb6Nttp0J8jIgMddwqutjvunFW5q520S\nQZs3v/Vq6B9CQZooV/l+5Q9xzFq+Zz+UYy8FPaZz+UMPGuhhvwUpn+CG7LUF\nfyW0+s4jio5/mInzeg03/7KceS+afquUOifk+ModrrxbomoKDG4Q3qCtd7WB\n3feJK6mYxAt6z3s1ll0uElNZRVI2A2fxdmfMh7p4zNMIvMJdPvTanag6CED7\n5EsX6tne+fVZwv+s2prH9gxwOHtOI8/KNRFgAxwW++0uQtFRHnqmbuiFtds+\n6hG7\r\n=bYjN\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC7M6z5vsgZkPHsL+VeL6OFMzZE8QH5tbhF8CcR2+7XzwIgDfHoFAEsco+ncGh6sJPuSLr2Ge98WriPNEoFNY/20JY="}]},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.10.0-alpha.0_1600884965623_0.9849456529611016"},"_hasShrinkwrap":false},"2.10.0-beta.0":{"name":"uswds","version":"2.10.0-beta.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:js":"npx prettier --write ./src/js/**/*.js"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.11.5","@frctl/fractal":"^1.3.0","@frctl/nunjucks":"^2.0.2","@types/node":"^14.11.1","ansi-colors":"^4.1.1","autoprefixer":"^9.8.6","axe-core":"^4.0.2","babelify":"^10.0.0","browserify":"^16.5.2","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.9.0","eslint-config-airbnb-base":"^14.2.0","eslint-config-prettier":"^6.11.0","eslint-plugin-import":"^2.22.0","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^8.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^2.6.5","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-uglify":"^3.0.0","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.1.3","node-notifier":"^8.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss-csso":"^4.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.1.2","resemblejs":"^3.2.5","sass":"^1.26.11","sinon":"^9.0.3","stylelint":"^13.7.1","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.0.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.0.3"},"readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://img.shields.io/circleci/build/gh/uswds/uswds/develop?style=for-the-badge&logo=circleci)](https://circleci.com/gh/uswds/uswds/tree/develop) ![Snyk vulnerabilities](https://img.shields.io/snyk/vulnerabilities/npm/uswds?style=for-the-badge) [![npm Version](https://img.shields.io/npm/v/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![npm Downloads](https://img.shields.io/npm/dt/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![GitHub issues](https://img.shields.io/github/issues/uswds/uswds?style=for-the-badge&logo=github)](https://github.com/uswds/uswds/issues) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4?style=for-the-badge)](https://github.com/prettier/prettier)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n- [Background](#background)\n- [Recent updates](#recent-updates)\n- [Getting started](#getting-started)\n- [Using the design system](#using-the-design-system)\n  - [Download](#download)\n  - [Install using `npm`](#install-using-npm)\n    - [Using the USWDS package](#using-the-uswds-package)\n    - [Sass and theme settings](#sass-and-theme-settings)\n    - [Sass compilation requirements](#sass-compilation-requirements)\n    - [JavaScript](#javascript)\n  - [Use another framework or package manager](#use-another-framework-or-package-manager)\n- [CSS architecture](#css-architecture)\n- [JS customization](#js-customization)\n- [Customization, theming, and tokens](#customization-theming-and-tokens)\n  - [Using tokens in theme settings](#using-tokens-in-theme-settings)\n  - [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  - [Main variables that can be customized](#main-variables-that-can-be-customized)\n- [Where things live](#where-things-live)\n- [Browser support](#browser-support)\n- [Accessibility](#accessibility)\n- [Fractal](#fractal)\n  - [Template compatibility](#template-compatibility)\n- [Need installation help?](#need-installation-help)\n- [Contributing to the code base](#contributing-to-the-code-base)\n- [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n- [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.usds.gov/) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n- Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  - [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n- Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  - [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/download/v2.9.0/uswds-2.9.0.zip) from the latest USWDS release and open that file.\n\n   After extracting the zip file you should see the following file and folder structure:\n\n   ```\n   uswds-2.9.0/\n   ├── css/\n   │   ├── uswds.min.css.map\n   │   ├── uswds.min.css\n   │   └── uswds.css\n   ├── fonts/\n   ├── img/\n   ├── js/\n   │   ├── uswds.min.js.map\n   │   ├── uswds.min.js\n   │   └── uswds.js\n   └── scss/\n\n   ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n   ```\n   example-project/\n   ├── assets/\n   │   ├── uswds-2.9.0/\n   │   ├── stylesheets/\n   │   ├── images/\n   │   └── javascript/\n   └── index.html\n   ```\n\n   You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the CSS and JavaScript files in each HTML page or dynamic templates in your project. We also provide Sass (.scss) files in the zip package which you can use to generate new CSS with project-specific settings. See [Sass and theme settings](#sass-and-theme-settings) for more information.\n\n   Here is an example of how to reference these assets in your `index.html` file:\n\n   ```html\n   <!DOCTYPE html>\n   <html>\n     <head>\n       <meta charset=\"utf-8\" />\n       <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n       <title>My Example Project</title>\n       <link rel=\"stylesheet\" href=\"assets/uswds-2.9.0/css/uswds.min.css\" />\n     </head>\n     <body>\n       <script src=\"assets/uswds-2.9.0/js/uswds.min.js\"></script>\n     </body>\n   </html>\n   ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n   - Node v12.13.0 (current LTS), [Installation guides](https://nodejs.org/en/download/)\n\n   **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n   ```shell\n   npm -v\n   6.13.0 # This line may vary depending on what version of Node you've installed.\n   ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n   ```shell\n   npm install --save uswds@latest\n   ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.scss` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import \"uswds-theme-general\";\n@import \"uswds-theme-typography\";\n@import \"uswds-theme-spacing\";\n@import \"uswds-theme-color\";\n@import \"uswds-theme-utilities\";\n@import \"uswds\";\n@import \"uswds-theme-custom-styles\";\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires **autoprefixing** to work properly. This is included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n**Autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings via `.browserslistrc` config:\n\n```\n> 2%\nlast 2 versions\nIE 11\nnot dead\n```\n\n> Note: **media query sorting** is no longer required as of USWDS 2.5.0. We stopped sorting media queries with [csso](https://github.com/css/csso) in USWDS 2.5.1 because it wasn't outputting as expected. While both the minified and unminified CSS files are modestly larger as a result: `268 KB` unsorted vs. `259 KB` sorted, our testing indicates that once the files are compressed server side with gzip, the unsorted CSS is actually smaller: `36 KB` unsorted and gzipped vs. `38 KB` sorted and gzipped. As a result, we recommend that teams do not use media query sorting at this time.\n\nWe recommend using a **minifier** like [csso](https://github.com/css/csso) to compress your final compiled CSS and **sourcemaps** like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n## CSS architecture\n\n- The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n- The CSS organization and naming conventions follow **[18F’s Front End Guide](https://frontend.18f.gov/css/)**.\n- We format our code with [Prettier](https://prettier.io/), per the formatting section of the **[18F Front End Guide](https://frontend.18f.gov/css/formatting/)**.\n- CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n- Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n- Uses **modular CSS** for scalable, modular, and flexible code.\n- Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n- Hard-coded magic numbers are avoided.\n- Media queries are built **mobile first**.\n- **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://designsystem.digital.gov/design-tokens/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require(\"./components\");\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion__button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settings), above.\n\nSet theme settings with USWDS design tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Design tokens section](https://designsystem.digital.gov/design-tokens/) of USWDS 2.0 documentation for more on the available tokens for [color](https://designsystem.digital.gov/design-tokens/color), [spacing units](https://designsystem.digital.gov/design-tokens/spacing-units), [font size](https://designsystem.digital.gov/design-tokens/typesetting/font-size/), and more.\n\n### Using tokens in theme settings\n\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```scss\n$theme-site-max-width: \"desktop\";\n$theme-site-margins-breakpoint: \"desktop\";\n$theme-site-margins-width: 4;\n$theme-site-margins-mobile-width: 2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```scss\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```scss\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units(\"desktop\");\n\n  @include at-media(\"desktop\") {\n    @include u-padding-x(4);\n  }\n}\n```\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;\n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\n\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n- **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [designsystem.digital.gov/components](https://designsystem.digital.gov/components)\n- **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n- **JS** is located in: `src/js (/components, /utils)`.\n- **Fonts** are located in: `dist/fonts`.\n- **Images** and icons are located in: `dist/img`.\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n## Long-term support of v1.x\n\n[Version 1.x](https://v1.designsystem.digital.gov) is in maintenance mode. We will only make critical updates like security patches.\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n- Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n- U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n- Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n- UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n- Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n- Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"284e9eb4cf70c59e20bc40c84d67ec9e3ccd9dea","_id":"uswds@2.10.0-beta.0","_nodeVersion":"12.13.0","_npmVersion":"6.12.0","dist":{"integrity":"sha512-kjTutH8MX17+xzO/yJusbLPiYSaDjk6C3errbqmg5/CQqw93wToS6sdUrtmb7I7FRV0LGj8nJ5h43Oq8Ed3r2w==","shasum":"2bc37dbe78d97eae2beeabb166aca65dc39a1236","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.10.0-beta.0.tgz","fileCount":1663,"unpackedSize":17010865,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfch4ECRA9TVsSAnZWagAA7dcP+gL9w0t6dhdMSsrFf+2R\nnlZHmP/Lq/ka8o0ZX20McWuz/8YOeLolHq5bfkMUPqRgpopkpUMh55wEXGPO\njluRRWLtolwk9W2dmVw2NqES9tJySoqXnvfzn/miVVIgrajiQp8zEGdvz58X\nvtCx5lPrfdDhgGdOdJhWs+1K1+AEoiBm0MyYmPpaMuYDTXqsPdl6HwcwgjJO\nl/eoZ/e/d4RXLI6FGkJ+i53sxv6rUy/Z0rgMlxUjKY0EftNVPH+ar+9OMSly\noe+mPKuC7cEuZHWEn3ZPuieZNfdyCkg/a6il3QHP755bnylSdTyl99jFxp0t\nDIby0k2zRKHgLSSx1mvQJg73Nh+PUd7fHHTgy4s+CS6dyIyxpkjjXSYe2SZF\nCxLJFiufjPxrgfWcONDERRL7IJSZLwS491OiD40fsubVPVpN89KAEPhTnY8j\nv8dslW5Kyb3BlxU3VXfZH3HNiq8LmBlX5aqRrNPf7Nz4E8MItI7VLS7VKBeZ\nWNgruF78MYNaH2o7jx4mqv09Pg+vqUGJVoNuiTCOkb2GooIZproxHLJJNjWz\nj79mljntzE/pUcs9K0Ley/Unxef50WIzxHz5IE0YKvJ8FCyvhwD6NIOXDAxq\n4XZGOu5BF3gbkW7CIHz83RdQX+PQCmMTpoUXsEWrqQLubc23qPnxIDa2Ykw9\n2DHC\r\n=ugiw\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICjzMEye8SUCxgXrrTo9YHApJOqDzXEAe3JmedHEq0vbAiAi9eaAKCzMPF3rVwOuqvcnZcVuyNSKCPHh/w3QZ3VmaA=="}]},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"}],"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.10.0-beta.0_1601314307753_0.9746384239843053"},"_hasShrinkwrap":false},"2.10.0":{"name":"uswds","version":"2.10.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.12.10","@frctl/fractal":"^1.5.1","@frctl/nunjucks":"^2.0.5","@types/node":"^14.14.13","ansi-colors":"^4.1.1","autoprefixer":"^10.1.0","axe-core":"^4.1.1","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.14.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^7.0.0","eslint-plugin-import":"^2.22.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.2.1","node-notifier":"^9.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.2.1","postcss-csso":"^5.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.2.0","resemblejs":"^3.2.5","sass":"^1.29.0","sinon":"^9.2.2","snyk":"^1.437.0","stylelint":"^13.8.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.1.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.1.1"},"gitHead":"9705d694c0d5cf4c1c4ff023cc6226d473d4ccaf","_id":"uswds@2.10.0","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-A6HjL42ryf9pdfbm6JrGxZywKzCZraHO4v3Ve21uFDqoA3ijoNjiSYME+3SG86CIgC6zRasrbQVuI3bvd3Xv2w==","shasum":"c7ecb779c82302fa189b36ca3eefe59dfde7f782","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.10.0.tgz","fileCount":4462,"unpackedSize":18609541,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJf25RvCRA9TVsSAnZWagAA8xkP/jA3YQ2OCV9GqRl/UhOH\nbqBEzcvHPSmRUpwVzvoBeokGa/1xUxW9x5bw4XJwzR+SuelNZnTypPi6b40Z\nG4u8h8nkE34iav4VpENII2z8Q4hjX4CcVht28j41czKsxX3jh2KdVyZ2xRq3\nB/xJCHHJX375S34wfFQW+BjzxqwSng3nmnQtSFlZgR4sSQK+pewJmiRsF4qM\nT40MH/Rsojy1AhC+8ujF55h+6VJEERnSbt8F92qm/lO+Fu4WGZ91EFbMgixQ\n2evzkTRX/frjl2taW/49akurmLxhx21N8nVlhgGBj8wMPU1rNgFCgmpU9gs1\naBWmgnrVKOjn5SMYxyxNq6Cr0Hd9UYpVv19e6hRIhfhHgoJcykPcgbHK6CX9\nUs74XUY7vtQqOLVEDx4dRGmZZd6znpuHPNkKRp/FzQRwLWoZMcOYWSkp7nbm\nkhXPh2xfDtvFrXsfvoXZ65RvPtjUR9klgg7+DHIpjcY7KIfqOPTIMMfpV78m\nD5h0dmSlX1uX6dS6cjwUwqb+P3s5Wn9iiRr6hn9iI3xd8hQR74BZ1AaxQFXv\n3JHaUoE2jHRxn9pwRzWvjZ7HGk7XGT16xa0UPP10/W5d2Eirtqf95nG70HGt\niQLWOib32zX5vXCUsM+/02nG7j3Jl1MTZvYEWxdG6cYbQBz8G+G/QEWT2x7i\nx/SH\r\n=yQAD\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDtjPFIlWDKLj3q8+kzoGIMyuF9BIGmsxGX7BFEFvQkRQIhALTex/1vL9uz2CNHVEIfR4PHGn/8KktqLelo9hXV6t54"}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.10.0_1608225903056_0.6402780613722985"},"_hasShrinkwrap":false},"2.10.1":{"name":"uswds","version":"2.10.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.12.10","@frctl/fractal":"^1.5.4","@frctl/nunjucks":"^2.0.8","@types/node":"^14.14.13","ansi-colors":"^4.1.1","autoprefixer":"^10.1.0","axe-core":"^4.1.1","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.14.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^7.0.0","eslint-plugin-import":"^2.22.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.2.1","node-notifier":"^9.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.2.1","postcss-csso":"^5.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.2.0","resemblejs":"^3.2.5","sass":"^1.29.0","sass-true":"^6.0.1","sinon":"^9.2.2","snyk":"^1.439.1","stylelint":"^13.8.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.1.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.1.1"},"gitHead":"bd0c371a935833d8acc75d47fba6f62048f5af28","_id":"uswds@2.10.1","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-8HS6yjV8eoL3VE1nk++/VMEaSqXpJCG18SMKwCj2wrZGgtIFKMaYh2746SGxDcJzO5V6g4McEN1gL2eRLfy2GA==","shasum":"544fcf9b3550b54c4b48071c9e8c51423c6ffd24","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.10.1.tgz","fileCount":4517,"unpackedSize":18706526,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgMDd+CRA9TVsSAnZWagAATG8QAJ3jkx5CCyHzRHv07vok\nkxu5cacuNyEgfKM45ln0T5ivX8q6crQWXncSNredcjJkv+iVvM360Knh4+J+\n+S1v6sLgTfSlTtKRow4+7iHjzbl0vxXh49jh7z9qDU26S1HI5rtaeJmL8vMZ\nkSeXhgurOs3PmqFXwYMgOuDinryxKenj9dvcdlVdxzLqH2tybziFhZdCyQnY\nwp0nDPwPuJN2bpC5xVpbl1nKsy6igGOGNVx8iNwdjD19obKkwPZTbtVI3Z8I\nmvoxdVgXxZq0tC7sZONSLlJ+wA/doHoPICHk7dY3emztiuaXTwcWA+DkZgUb\nMdtfwrwwF7v7QIVmz7kWwDT7ZM2DYJEWelM6YNtheTX8u/itoOhmeEYaz76o\nFY93PEw6SQvXavpLHFVUYij2ePxdIFu/+YExUhNCpANmRZkJI+au2nGornfS\nVfrBGVK3nyksJhd+EiudMk1uhTnEyT5xf4gULiNkxpbq6K8RzuKhkO4zgfN4\nGTz4ZMDTvDXVX2eg6avjE9mYUI68c3VU6V40agH/+bg002h3lvw+zOyXaYlS\nYgLZpgZ40tkppZPma8SxnBigq6YOQPI0huaSfZjcXfKU5ivLjjEe6QZAD/w4\nNIUsEb4JMAw9N8FzoiWqc2pyVbObAaagatOZHfSMAp6ICy/EoHzmA4srKAEj\nmTRj\r\n=nJhg\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCgovOuyEM15g5YnPWrzEFSEpT0ixe+SnZvF94a/57djwIgWXFWUQZXZS7E+8zT0hZhQetcNTFPjNWHll0zgbT6w70="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.10.1_1613772669396_0.7253178937714051"},"_hasShrinkwrap":false},"2.10.2":{"name":"uswds","version":"2.10.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.12.10","@frctl/fractal":"^1.5.4","@frctl/nunjucks":"^2.0.8","@types/node":"^14.14.13","ansi-colors":"^4.1.1","autoprefixer":"^10.1.0","axe-core":"^4.1.1","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.14.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^7.0.0","eslint-plugin-import":"^2.22.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.2.1","node-notifier":"^9.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.2.1","postcss-csso":"^5.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.2.0","resemblejs":"^3.2.5","sass":"^1.29.0","sass-true":"^6.0.1","sinon":"^9.2.2","snyk":"^1.467.0","stylelint":"^13.8.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.1.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.1.1"},"gitHead":"5c7d46543c571bcd84e3fa6f11c9070a39e96c62","_id":"uswds@2.10.2","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-xH6QRd0LZ5BWSjRYZq1wdEM6LcUbmvkRMWRrPMXod0uUekBzxrbkNJvejsfBOiDo9tt9FLic60f/WoZAWZb45w==","shasum":"27e3dba2861902701e5d4c11367fd2c52d094de7","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.10.2.tgz","fileCount":4524,"unpackedSize":18704635,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgQA4+CRA9TVsSAnZWagAAQYwP/jq1ewsj4iHwrMCMrwAu\n91GQtEImlWSZBCPnO4sR8QmMu+JKN0LmLFAeH2XeYYmzmuB1oMIaH+d5DrhQ\nGzGxpeLDiTG75OoZoi+8qCEukPcYuuiRcLCIjpRIBFbfgC25zNEoTJeNuZQD\nNz0ZCtBBgtcPHb2DddBYncchPj1i93jr9dV/rnjxHAH9JJHew/tZLO72lKVp\n/iYXpGiHVFqop+gG+vxNjLxJtWa2qKAhdLLtQMloThBNoQl6/JjAadRqEwNg\n1aSf1X4mwViNAP45T54pe9lfKQxKSAQt5uSHh+S5YPlyG3hHK2nUMoL8GeJm\nkMcgFyWKYCRyhSe0dEqQyhK/8N1+HwYgggW5mNxwUsQEPjdEIVLdnGSSAxHh\n6hAcUWBu2RATQNzlH3oEgNaBr3ULOeGnlvERE8K50C8R9nfXZUD3NtPs5qYm\nZt0yYHudac5CPD4Ldy8p6trRY/9ciEL7sRneA2TKclzWmxVLmoTj24hZOVr4\nKdnAtLBbGgw6l3xTYavhaX3QYAd/89644jkZnubeF5bUGhsm+SpMMPf5Days\npqCP1JaX5LnugtEQtrlrE+c6jFRKeOOaAiN9F7JGqNWi5ULaLzQjcu7rMQNf\nuX04fl5logbg4UamG4ewFoBNkU1z06XtlGqXwrogpBcRDFpUN7iua4ni6hmr\nxkum\r\n=QOSR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIF+8tKJ6vGtdFkC6pKjBZD/haeZNGnAWPEzWS6Ln1HFFAiEA6fVIdUoqT1QC128X2Qj5Y102SL6Uas1IDoAbbCCBI1o="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.10.2_1614810685816_0.011675939747731512"},"_hasShrinkwrap":false},"2.10.3":{"name":"uswds","version":"2.10.3","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.12.10","@frctl/fractal":"^1.5.4","@frctl/nunjucks":"^2.0.8","@types/node":"^14.14.13","ansi-colors":"^4.1.1","autoprefixer":"^10.1.0","axe-core":"^4.1.1","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.14.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^7.0.0","eslint-plugin-import":"^2.22.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.2.1","node-notifier":"^9.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.2.1","postcss-csso":"^5.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.2.0","resemblejs":"^3.2.5","sass":"^1.29.0","sass-true":"^6.0.1","sinon":"^9.2.2","snyk":"^1.467.0","stylelint":"^13.8.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.1.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.1.1"},"gitHead":"1da984a45bcf753232f3dd223f017f35ac4e596e","_id":"uswds@2.10.3","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-krNRzx1jRzOJpuH/qtmQhd5zxnXTaDVqrPNYT99sJbxzWUqjb1zZHh3jFNo+xKDpNuiO0XMPwZwlaSp2YdZ3Ag==","shasum":"16d34cee81897762d6d69d3ac83aa55129826fa6","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.10.3.tgz","fileCount":4525,"unpackedSize":18704717,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgT6XICRA9TVsSAnZWagAAkjQP/AjEnnU9UmPp4RUAzMwd\nsNlQIOlxFjHNiZPoAWRRT1xbmKQfKDTSAkEHxdT7dJPSxBtwVUp2pfg11E6h\nAXVFqeW/C5d0Zt782GDQ9qKo46lVUYgf+bfZLnO5DtKe2w7BuvtSUoZeCBzN\nhTErQnEqzKkHxFmtqj4B3hCN1aQ4rK5bfTzAtlfpJnblpAa+hB75x+KBYka0\nsYK3RaDpkyHtvHQydqfSliev7Z7+wcIkR1k+FRvz8lMSXDoj9tNQdLY88dr7\nJsdkiGKgqoNzSGmCA9WMuqcunLVCgWrUUfl2oCE/uYSy4WK59Ol9a9ljPU74\nPHBGbbN/JRnOnZaMYjPX2K7l14mS6JH5/XfAw1o4cGV6GfYGDWjU6nApbH0i\nLkw5byHfSWipB+qE8nlJ2L+R50N8KLCxF2vUwf000RF++a1Yrzadr1c4kXNF\n179EbOGEzvxVjqgCO8udbtD3lCt3zjihmynOeJ/L49Plrm6AVi7OlgtxRZ9h\nQjPmrlko00Jj1q6EVGMzfizoO/mJoLt5d1unPtaAan/X9nCBiULUG4DRbC0K\n7JKtbaLimHHTkJ0VJK1STfJkRUGsgbsl3bcigyRNQ4J7qRdkpqkg7D9zOmlP\n9yoMjqrSd+JXrSvtyx2Z8++znVaBJKgtixvqHnXmDMolP0uhyWmzsBa85F32\nAmB4\r\n=8Y1A\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICiD03M5wMhmbONYv6I0y708dxLiU9I9wo9vthH2JLTPAiB+kk0cqlDgM2hU42dnoW+rZ/ofFT9zPIeyIiG5hbI/TA=="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.10.3_1615832519392_0.144111337433944"},"_hasShrinkwrap":false},"2.11.0":{"name":"uswds","version":"2.11.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.12.10","@frctl/fractal":"^1.5.4","@frctl/nunjucks":"^2.0.8","@types/node":"^14.14.13","ansi-colors":"^4.1.1","autoprefixer":"^10.1.0","axe-core":"^4.1.1","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.14.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^7.0.0","eslint-plugin-import":"^2.22.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.2.1","node-notifier":"^9.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.2.1","postcss-csso":"^5.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.2.0","resemblejs":"^3.2.5","sass":"^1.29.0","sass-true":"^6.0.1","sinon":"^9.2.2","snyk":"^1.467.0","stylelint":"^13.8.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.1.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.1.1"},"gitHead":"e06173bd4be19d48acf0169800a1305858e35601","_id":"uswds@2.11.0","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-UGRv8cc55ccYzWuc7i/m9cndZhaFgPbKSmhdkG3GJiaM3qdO7KG+vYxzhGyubBOKSIBYoxj4lvRGVCBycN/roA==","shasum":"7fd419ce6da5849e17bb16946b5c13292aa13e12","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.11.0.tgz","fileCount":5040,"unpackedSize":19225064,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgUnHQCRA9TVsSAnZWagAA19YP/2Jo1NJoEib8ievkTU2V\n6NHEGW4vA4FRXmkq27fEtRho+CnL2Bhrz6dikORLSiCfMKXouugsqm6f9g4D\nc1d21uQhYTHnwdXUWqRC+vFTofinCeiJ9ao6Qfn+7VVhOp+nYQbYUja2veaU\nZpHAWycTeA/LVQ7tSRex1PHG4VFV0R+mj2VKzW61cDNvflouBx4D6X6iURp/\nKjBVDM5FZWxIXLkxD0kDgnLS8IQ8q0Y2xxQ1R+za1TWLwrC19T5xs6z4z9Hb\nl/Pya84KtUWJuhAeu6gca2CoF1KORC1QHgcq2f8jDx3xbCVpoyG5yrgZgwUT\nPZTIj9wCcooeVOyekgzRwov8qFHYDTQNvTXGS52qoVDJK3YrP7rUiyiX4vvv\ntDZthvHPecvukEXSuhrlAdJ7hqbOgk7VcOv1SEqniSpWzqvvBnIo96akEv80\nYHsHpfYY1tKptelCiukbumTq7zkWEVQCxcHEIXjWIsv3d0BU8Z1iJ/vbXrCa\nPonrTLivCvl4raIUq0TqiXlaxYlkfY6Eec52bB2YodgDHSR9tSnS2H6D/GXo\nisiI4IZkyRxUslaZ9dvVhei7Xf9LpZRewXoKdrBws1K2r2oDbQNGpVCCImIA\ngz3bfMpWaRq43HkHyGRkx/GeGkQ1CtPilRskP0xJP2xoEcx8/jhfQmqrStj/\nk9M6\r\n=UUAR\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDdeMfeozrC73tueG+s+HOkAY3H2vL5qI79If5IySZJHgIgDASVcR9FJGEmF1Z4NYZhRGW4i7sT2weXZM8y8mGKT3s="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.11.0_1616015823884_0.5161163321794733"},"_hasShrinkwrap":false},"2.11.1":{"name":"uswds","version":"2.11.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","elem-dataset":"^2.0.0","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.12.10","@frctl/fractal":"^1.5.4","@frctl/nunjucks":"^2.0.8","@types/node":"^14.14.13","ansi-colors":"^4.1.1","autoprefixer":"^10.1.0","axe-core":"^4.1.1","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.14.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^7.0.0","eslint-plugin-import":"^2.22.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.0.0","gulp-sass":"^4.1.0","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.6","handlebars-helpers":"^0.10.0","jsdom":"^16.4.0","jsdom-global":"^3.0.2","mocha":"^8.2.1","node-notifier":"^9.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.2.1","postcss-csso":"^5.0.0","postcss-discard-comments":"^4.0.2","prettier":"^2.2.0","resemblejs":"^3.2.5","sass":"^1.29.0","sass-true":"^6.0.1","sinon":"^9.2.2","snyk":"^1.467.0","stylelint":"^13.8.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.1.2","stylelint-scss":"^3.18.0","typescript":"^4.1.3","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.1.1"},"gitHead":"af0bc5c0cad15540095f087b6de590178aee3912","_id":"uswds@2.11.1","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-yhLTik8AuiLdp+e7/v84unn1PF3f+qtYjcdsFRjy8+7TI2mTa4wk8/5oDaMJnk1LMA3tSQNkmxGetmOS1q4zXA==","shasum":"3061ca8d958d6cbcd1f08e1d760e2028c3d025df","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.11.1.tgz","fileCount":5055,"unpackedSize":19228761,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgUoPTCRA9TVsSAnZWagAA8tUQAJ5se5o+71tMBAN0oGzn\nTmJdtz/iTUBw29DHXsAevA7g+Av+cqOjHJyRk2Bh1ew7fUe+iY9MuwDfZvqp\n37U0dDoD1jSiN1jGnmqTcUoxcJDv7QUU0S1XXrv1kEAmg2zEFrNRbS9yHSgC\nBxPkcVM2uvQR7LUeApQdQ1KYV6CwkmMJJqsAAIdWHiYtTq9Fao7KXveJnY1Z\nL6ofqk7Yiv9sF+nib/m/x2WJq5c7zq6rFBr8MqwwqkVQWJnZYBAZS0Yr+7qo\nHtI+C+yTaXVmoLlc2JNMNoo4OKxV5FKxb1JFillvc9lO2VNpqXpig1RcDhp9\nxYCE8ssj8ZBXp27u8C2Whoq/B3Oq0a3UbX31stXi4mUh0GhfG4gA8MQobHgm\no6Tf8q3E3Ig/OGWom9lCb7pX3guziwv1Yh5no+j7Dhb7lPNsBKnC7Ub7Iefo\ncYpN471WgBcyOo9um6bOnahkPmkwXF0IU+pIh5S/tpBs7tp2pPc1VdP1m+cR\n4BjkbfpautDNAc/hlZuEcsxk43ul/DJaBe6zcmUdrHlhvANFlzTJvBEgrrDB\n91dVI/CmX5TvrCB6cjPsdA3P9r1YZlYHMcb/3gUzpPms4AOts3W72umIDgTZ\nCP+0UmdJCj2yp5PnLMe13gQNSV1QREwXSFSb1fq31dJdyrWvLbiABeHODqcG\nXKKo\r\n=BM+N\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICdr7wFDutIoQJgXT2jVbj7AqkTrVSryDUm2BCYcAz8lAiEA90Xz1BIGiI8YOEdFqq8McW+stOq+xOwL+R8dUba3VuA="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.11.1_1616020434799_0.9839595372213341"},"_hasShrinkwrap":false},"2.11.2":{"name":"uswds","version":"2.11.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","elem-dataset":"^2.0.0","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.13.15","@frctl/fractal":"^1.5.6","@frctl/nunjucks":"^2.0.10","@types/node":"^14.14.43","ansi-colors":"^4.1.1","autoprefixer":"^10.2.5","axe-core":"^4.2.0","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.13.4","chrome-remote-interface":"^0.28.2","cross-spawn":"^7.0.3","eslint":"^7.25.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^7.2.0","eslint-plugin-import":"^2.22.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.2","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.1.1","gulp-sass":"^4.1.0","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^16.5.3","jsdom-global":"^3.0.2","mocha":"^8.3.2","mq-polyfill":"^1.1.8","node-notifier":"^9.0.1","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.2.13","postcss-csso":"^5.0.1","postcss-discard-comments":"^4.0.2","prettier":"^2.2.0","resemblejs":"^3.2.5","sass":"^1.32.11","sass-true":"^6.0.1","sinon":"^9.2.4","snyk":"^1.570.0","stylelint":"^13.13.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.2.0","stylelint-scss":"^3.19.0","typescript":"^4.2.4","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.1.1"},"gitHead":"de44902441415952ae313418a566a06d7867a789","_id":"uswds@2.11.2","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-JISTXCjPIlrufbObIifjrMDn5jF9bbLu7UYhGWmEs9iqB6Z2KDCXHVoBUyzMmIrIjW/UWWYHZzPqOOHO6/IMCQ==","shasum":"bf5ff132f6324c0939d01b7eefebde340c22dcec","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.11.2.tgz","fileCount":5062,"unpackedSize":19226907,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgiZdbCRA9TVsSAnZWagAA8SsP/RPaTgLOmzx1J4BZQQI2\nmBq1bIO3fk76XEzJfik99YXKgkdig9Bbrj+EdPvDT897m+wAiy5ljLrrURYN\nn+ghZD8YUtr+yO8qJ2bvflYXpYmHk9ShGnHUz2yZvHjYgnKdSofo5GMsBh+s\nX1IQg+F97f7i9jSLhnuQYsVCPLzyFERWnVbp/s09hwmdWAwyKsK5i9TJ5fh0\n14sheIHxSGS5Ew10zm6PLjDLOQuUU8tflFmr4C28VcQbd6cfn1ovZskvPiZv\nktUolTgvAtcPTrqBJny83By7LoWwsVax6TuYQ2Uv7dM9lUS90EnfrFS/nTGq\nACnX8WgfN/Jog2f85r74TCQbkujhWDfxwgR9vqqNUDLv+aisp+Dk26XhZMr8\nPdF6aghS7T43KM5ZvQNaM/G80HNWT7VbAdONjLiZ5xTJzzxXstHgAeyw45He\nQWcS9OD3AAs9LAPrkCLUcFCflGs6DmtGxvDj5PvktPWJcx+/qlgIbhJQH3Yf\nRsmggSx2lTruLwFzACCSjrRbKCGXcH4F+f+IvWBmiQ6AYiMBxRlLfEV4Jlw6\njWVRWnmt8eM/sHRJsFfVjzVUbzsMpmIukvyJdA+CYMeEShXzAvCCR/k78rop\nHYAsJRLWy/fFRtv9h/v1ADnputJaleS8L3/KhufLipP3uj6MVJA+oS402u5G\nhDd1\r\n=DDTt\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCCl4YfTwcCrcCXJ5iOP3DSBgp6wmnFfBgITk4ShcTE1AIgMrCMgNnuUNoNeAVVNnRJQzy0ObL9luNswvS+hzeiKGI="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.11.2_1619629914680_0.6330305458956831"},"_hasShrinkwrap":false},"1.6.14":{"name":"uswds","version":"1.6.14","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","force-build":"npm install && gulp build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha --opts spec/mocha.opts","prepare":"gulp build","preversion":"npm test","release":"gulp build release","spec":"npm run mocha -- 'spec/**/*.spec.js'","test":"snyk test && gulp eslint && gulp typecheck && gulp test","test:ci":"gulp eslint && gulp typecheck && gulp test","test:unit":"gulp test","version":"gulp build release"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"@types/node":"^15.6.0","array-filter":"^1.0.0","array-foreach":"^1.0.2","browserify":"^16.5.0","classlist-polyfill":"^1.0.3","del":"^5.1.0","domready":"^1.0.8","elem-dataset":"^1.1.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/core":"^7.7.4","@babel/preset-env":"^7.7.4","acorn":"^6.3.0","ansi-colors":"^4.1.1","axe-core":"^2.6.1","babelify":"^10.0.0","bourbon":"4.2.7","bourbon-neat":"https://github.com/thoughtbot/neat/archive/neat-1.8.0-node-sass.tar.gz","chrome-launcher":"^0.14.0","chrome-remote-interface":"^0.25.6","cross-spawn":"^2.1.5","eslint":"^6.8.0","eslint-config-airbnb-base":"^14.2.1","eslint-plugin-import":"^2.18.2","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-autoprefixer":"^3.1.0","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-eslint":"^5.0.0","gulp-filter":"^3.0.1","gulp-postcss":"^9.0.0","gulp-rename":"^1.2.2","gulp-replace":"^0.5.4","gulp-sass":"^4.1.0","gulp-sourcemaps":"^1.6.0","gulp-spawn-mocha":"^6.0.0","gulp-uglify":"^1.5.1","gulp-zip":"^3.1.0","jquery":"^3.6.0","jsdom":"^9.0.0","jsdom-global":"^2.1.0","mocha":"^6.2.2","node-notifier":"^6.0.0","node-sass":"^6.0.0","normalize.css":"^3.0.3","nyc":"^14.1.1","postcss":"^8.3.0","postcss-csso":"^5.0.1","postcss-discard-comments":"^4.0.2","prettier":"^1.19.1","resemblejs":"^3.2.5","run-sequence":"^1.1.5","should":"^11.2.1","sinon":"^2.3.8","snyk":"^1.605.0","typescript":"^4.3.2","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^17.0.1"},"readme":"# U.S. Web Design System\n\n[![CircleCI Build Status](https://circleci.com/gh/uswds/uswds/tree/develop.svg?style=shield)](https://circleci.com/gh/uswds/uswds/tree/develop) [![Test Coverage](https://api.codeclimate.com/v1/badges/c10cd4505d61d161cd3a/test_coverage)](https://codeclimate.com/github/uswds/uswds/test_coverage)\n\nThe [U.S. Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the Design System itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the Design System and documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n* [Background](#background)\n* [Recent updates](#recent-updates)\n* [Getting started](#getting-started)\n* [Using the Design System](#using-the-design-system)\n  * [Download](#download)\n  * [Install using `npm`](#install-using-npm)\n    * [Importing assets](#importing-assets)\n    * [Sass](#sass)\n    * [JavaScript](#javascript)\n  * [Use another framework or package manager](#use-another-framework-or-package-manager)\n* [CSS architecture](#css-architecture)\n* [JS customization](#js-customization)\n* [Customization and theming](#customization-and-theming)\n  * [Set the base asset path (fonts and images)](#set-the-base-asset-path-fonts-and-images)\n  * [Main variables that can be customized](#main-variables-that-can-be-customized)\n* [Where things live](#where-things-live)\n* [Browser support](#browser-support)\n* [Accessibility](#accessibility)\n* [Fractal](#fractal)\n  * [Template compatibility](#template-compatibility)\n* [Need installation help?](#need-installation-help)\n* [Contributing to the code base](#contributing-to-the-code-base)\n* [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n* [Licenses and attribution](#licenses-and-attribution)\n\n## Background\n\nThe components and style guide of the U.S. Web Design System follows industry-standard web accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.whitehouse.gov/digital/united-states-digital-service) and [18F](https://18f.gsa.gov/) created the U.S. Web Design System for designers and developers. The U.S. Web Design System is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n\n## Recent updates\n\nInformation about the most recent release of the Design System can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n\n## Getting started\n\nWe’re glad you’d like to use the Design System — here’s how you can get started:\n\n* Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  * [Design files of all the assets included in the Design System are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n* Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  * [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n\n## Using the Design System\n\nThere are a few different ways to use the Design System within your project. Which one you choose depends on the needs of your project and how you are most comfortable working. Here are a few notes on what to consider when deciding which installation method to use:\n\n*Download the Design System if:*\n- You are not familiar with `npm` and package management.\n\n*Use the Design System `npm` package if:*\n- You are familiar with using `npm` and package management.\n\n### Download\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/latest) from the latest release and open that file.\n\n    After extracting the zip file you should see the following file and folder structure:\n\n    ```\n    uswds-1.0.0/\n    ├── css/\n    │   ├── uswds.min.css.map\n    │   ├── uswds.min.css\n    │   └── uswds.css\n    ├── fonts/\n    ├── img/\n    ├── js/\n    │   ├── uswds.min.js.map\n    │   ├── uswds.min.js\n    │   └── uswds.js\n    └── scss/\n\n    ```\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n    ```\n    example-project/\n    ├── assets/\n    │   ├── uswds-1.0.0/\n    │   ├── stylesheets/\n    │   ├── images/\n    │   └── javascript/\n    └── index.html\n    ```\n\n    You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project.\n\n3. To use the Design System on your project, you’ll need to reference the [CSS (*C*ascading *S*tyle *S*heets)](https://developer.mozilla.org/en-US/docs/Web/CSS) and JavaScript files in each HTML page or dynamic templates in your project. (We also provide Sass (SCSS) files in the zip file which you can compile to CSS. See [Sass](#sass).)\n\n    Here is an example of how to reference these assets in your `index.html` file:\n\n    ```html\n    <!DOCTYPE html>\n    <html>\n    <head>\n      <meta charset=\"utf-8\">\n      <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">\n      <title>My Example Project</title>\n      <link rel=\"stylesheet\" href=\"assets/uswds-1.0.0/css/uswds.min.css\">\n    </head>\n    <body>\n\n      <script src=\"assets/uswds-1.0.0/js/uswds.min.js\"></script>\n    </body>\n    </html>\n    ```\n\nWe offer both files, the CSS and the JavaScript, in two versions — a minified version, and an un-minified one. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. And the un-minified files are better if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the Design System.\n\n### Install using npm\n\n`npm` is a package manager for Node based projects. The U.S. Web Design System maintains a [`uswds` package](https://www.npmjs.com/package/uswds) for you to utilize both the pre-compiled and compiled files on your project.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n    - Node v8.14.1, [Installation guides](https://nodejs.org/en/download/)\n\n    **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n    ```shell\n    npm -v\n    6.4.1 # This line may vary depending on what version of Node you've installed.\n    ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n    ```shell\n    npm install --save uswds\n    ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `src/` or the compiled files in the `dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n└── src/\n    |── components/\n    ├── fonts/\n    ├── img/\n    ├── js/\n    └── stylesheets/\n```\n\n#### Importing assets\n\nSince you are already using `npm`, the U.S. Web Design System team recommends leveraging the ability to write custom scripts. Here are some links to how we do this with our docs website using `npm` + [`gulp`](http://gulpjs.com/):\n\n[Link to `npm` scripts example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/package.json#L28)\n\n[Link to gulpfile.js example in `uswds-site`](https://github.com/uswds/uswds-site/blob/master/gulpfile.js)\n\n#### Sass\n\nThe Design System is easily customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The main Sass (SCSS) source file is located here:\n\n```\nnode_modules/uswds/src/stylesheets/uswds.scss\n```\n\nGlobal variables are defined in the `node_modules/uswds/src/stylesheets/core/_variables.scss` file. Custom theming can be done by copying the `_variables.scss` file into your own project’s Sass folder, changing applicable variable values, and importing it before `uswds.scss`.\n\nBelow is an example of how you might setup your main Sass file to achieve this:\n\n```scss\n@import 'variables.scss'; # Custom Sass variables file\n@import 'node_modules/uswds/src/stylesheets/uswds.scss';\n```\n\nYou can now use your copied version of `_variables.scss` to override any styles to create a more custom look and feel to your application.\n\nThe Design System uses [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets (`css/uswds.min.css` and `css/uswds.css`) however prefixes will not be applied when using the Sass source files directly. If your project requires the use of Sass and vendor prefixes we recommend incorportaing a plugin such as [Autoprefixer](https://github.com/postcss/autoprefixer) into your build process.\n\n#### JavaScript\n`require('uswds')` will load all of the U.S. Web Design System’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute the U.S. Web Design System, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n\n## CSS architecture\n\n* The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n* Uses **[Bourbon](http://bourbon.io/)** for its simple and lightweight Sass mixin library, and the **[Neat](http://neat.bourbon.io/)** library for the grid framework. Bourbon and Neat are open-source products from **[thoughtbot](https://thoughtbot.com/)**.\n* The CSS organization and naming conventions follow **[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)**.\n* CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of the U.S. Web Design System.\n* Uses a **[modified BEM](https://frontend.18f.gov/css/naming/)** approach created by 18F for naming CSS selectors. Objects in CSS are separated by single dashes. Multi-word objects are separated by an underscore (For example: `.usa-button-cool_feature-active`).\n* Uses **modular CSS** for scalable, modular, and flexible code.\n* Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n* Hard-coded magic numbers are avoided and, if necessary, defined in the `core/variables` scss file.\n* Media queries are built **mobile first**.\n* **Spacing units** are as much as possible defined as rem or em units so they scale appropriately with text size. Pixels can be used for detail work and should not exceed 5px (For example: 3px borders).\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the Design System.**\n\nThe JavaScript for the USWDS is separated into components in the same manner as the visual interface which is all initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files which then must be built for the browser. The components are currently not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require('./components');\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class name (e.g. `.usa-accordion-button[aria-controls]`) that's used to link HTML elements with the JS component, so when a component is initialized, it will search through the current HTML DOM finding all elements that match its class and inialize the component JavaScript for those elements. The primary methods each component has are as follows:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods for manipulating specific aspects of them based on what they are and what they do. These can be found in the component's JS file.\n\n\n## Customization and theming\n\nThe Design System can be customized to use different typography, colors and grid systems. The easiest way to do this is to use Sass and override the Design System’s global variables. If it isn’t possible to use Sass, do theming by overriding the CSS rules in the Design System set.\n\nTo start theming through Sass, copy the `core/variables` file into your own project’s Sass folder, changing applicable variable values, and importing it before the WDS. Below is an example of customizing the import of the Design System's all.scss file.\n\n```scss\n// src/main.scss\n@import 'path/to/my/scss/files/main/scss/my-custom-vars';\n@import 'lib/uswds/src/stylesheets/all';\n```\n\n```scss\n// path/to/my/scss/files/main/scss/my-custom_vars.scss\n\n// Colors\n$color-primary: #2c3e50;\n$color-secondary: #ad2020;\n$color-secondary-dark: #b0392e;\n\n// Typography\n$font-serif: 'Georgia', 'Times', serif;\n$h2-font-size: 2rem;\n$h3-font-size: 1.75rem;\n$heading-line-height: 1.4;\n\n// Grid/breakpoints\n$small-screen:  540px !default;\n$medium-screen: 620px !default;\n$large-screen:  1120px !default;\n```\n\n### Set the base asset path (fonts and images)\nIf you copy the USWDS `dist` directory to a folder on your project or your fonts and images are in the same folder, set the location of the directory with `$asset-path: path/to/my/assets/`. The default is set to `$asset-path: ../`. This will be appended to the font and image path variables so you only need to set this variable. You can also set the font and image paths individually:\n\n```\n$font-path: path/to/my/fonts;\n$image-path: path/to/my/images;\n```\n\nNOTE: If you plan on upgrading to newer versions of the Design System in the future, or are not using your own forked version of the Design System, try to avoid making changes in the Design System folder itself. Doing so could make it impossible to upgrade in the future without undoing your custom changes.\n\n### Main variables that can be customized\n* Colors can be found in the `core/variables` [file, line 35](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L35).\n* Font families can be found in the `core/variables` [file, line 28](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L28).\n* Typography sizing can be found in `core/variables` [file, line 13](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L13).\n* Grid and breakpoint settings can be found in `core/variables` [file, line 87](https://github.com/uswds/uswds/blob/develop/src/stylesheets/core/_variables.scss#L87).\n\n\n## Where things live\n\n* **HTML** markup for the components is located in: `src/html` in the site root.\n* **Sass** styles are located in: `src/stylesheets/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n* **JS** is located in: `src/js/components (accordion.js, toggle-field-mark.js, toggle-form-input.js, validator.js)`.\n* **Fonts** are located in: `src/fonts`.\n* **Images** and icons are located in: `src/img`.\n\n\n## Browser support\n\nWe’ve designed the Design System to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the Design System (1.0) is designed to support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 9 and up. The next major release (2.0) will follow the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we will officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the Design System version 2.0 will support the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n\n## Accessibility\n\nThe Design System also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the Design System. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the Design System in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.sensiolabs.org/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the Design System style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n\n## Reuse of open-source style guides\n\nMuch of the guidance in the U.S. Web Design System leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n* Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n* U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n* Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n* UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n* Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n* Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"c4c9410d54b537c6112037a36ed289d8b7e8940a","_id":"uswds@1.6.14","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-JDgpbcdIhxE7yOXr+pAJoK4TayAabr1Oh+43tRxj/JSDM0vIN05vqKyilHfk77+FWem2ToBO0iMlK87Fie8buQ==","shasum":"7ebeda127242c1dfee235830d8c55ba7f1c152a2","tarball":"https://registry.npmjs.org/uswds/-/uswds-1.6.14.tgz","fileCount":804,"unpackedSize":6137679,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgx5UMCRA9TVsSAnZWagAA5U4P/2zy1iEJ6iycSs0LV7lD\nrE60ln8EJsKc3isrc8nWZIk88OX1m2zeGbE5+44L2g3aA7J3zGPXoUHidQ69\nrpk/L46iEiy0E6kyPKPC0GqDeuUjiK/5wwHRLw4GIuJ6dkJlXfKPtu46MMxG\nwmu2Pq8Nvzymu8CRT4y1x3rM2S72FudNIMY76Ye6EOtMhuHs2KiklDDrA/Uk\na9qpFnLjHpouiP268T/zsaUE/jTA8EXQ2yinzzKfxRvP2deeQ2OSBSqCfwm/\nQMw/3kdfdV5CIQHShDhB+bZge8gEPT/SIqx5pC2Krt2yETIapUnjK5nhtRXk\nmf7xwZV3sx87RFdXkMHPHVmhRObB8IM2teLs62oiseOnDzx9WSGcwT1WjeOx\n2l18h+733EBpS5mfeqRy1SlCcnNKHVxFv2tHobWh3cvgPdg4jKs5+yfLQcRN\nn8oxEcvsiIpGHX+47DQX/h4ntXSXIPpQ4ChQkwca56iV8oApFDkTGlYENvj1\nwhVSZRdtcNsGJBCmqH06SnFlU9H3c8pqe0E5Sfv8EhPLgQokgfNGSR4pYmSq\n/H9N9CvMT2705fAZBfKO2BEy/GE07yQqpM5Cd//mFVHW14bXqb38Xu6sEDsG\n/caMxNJsBXHBIvJAh2L2DKDIHmOHvPewt9DaeBpK6XpwKyydgBKHiE6fHIf4\nNW4/\r\n=k5Pq\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIBoK77cJi5Wjjd0L5B14PifwFRMUfCRnnCTA2J+NsuG8AiEAwBjVu4yuQbz6I/OibUQkARo9MfJ3LqxEfBVVoKKOdhk="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_1.6.14_1623692556618_0.6239908235121501"},"_hasShrinkwrap":false},"2.12.0":{"name":"uswds","version":"2.12.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:templates":"npx prettier --write './build/components/render/*.html'"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.14.5","@frctl/fractal":"^1.5.8","@frctl/nunjucks":"^2.0.10","@types/node":"^14.17.3","ansi-colors":"^4.1.1","autoprefixer":"^10.2.6","axe-core":"^4.2.2","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.14.0","chrome-remote-interface":"^0.30.1","cross-spawn":"^7.0.3","eslint":"^7.28.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^7.2.0","eslint-plugin-import":"^2.23.4","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-eslint":"^6.0.0","gulp-filter":"^6.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.1.1","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^16.5.3","jsdom-global":"^3.0.2","mocha":"^8.3.2","mq-polyfill":"^1.1.8","node-notifier":"^9.0.1","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.3.4","postcss-csso":"^5.0.1","postcss-discard-comments":"^4.0.2","prettier":"^2.3.1","resemblejs":"^3.2.5","sass":"^1.35.1","sass-true":"^6.0.1","sinon":"^9.2.4","snyk":"^1.634.0","stylelint":"^13.13.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.2.0","stylelint-scss":"^3.19.0","typescript":"^4.3.2","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^16.1.1"},"gitHead":"3633bb1290deda15494b6a6252a0336a5656332b","_id":"uswds@2.12.0","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-zunOnGXVOye8CSTjzakHBTdhH+Swi6uJLD5xOcI6xmlZFgNzk5qpLdcsxrjtknELBqRUccMRAp4MIlds9QQUMw==","shasum":"6430ca5dc0cda01a11f37519fb8f4cd3fe88944f","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.12.0.tgz","fileCount":5071,"unpackedSize":19157682,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJgynHeCRA9TVsSAnZWagAApVAP/3CkAXyUV1to5XtCysT9\np/NnjDKQj0qLD4Ej2u/XB1jYATc1o3AO+YExE9jvSUuLjHHNjwmQ35XpOdBl\nw1lmQ6lFKVyik29YIAYVbBTeTFIGtpW7SIFXrv+N6Z4VyaD+qhkcJa5pVODq\ngUbOLEMh/1sVwWwAlpSrFpL4TTeK2JF7lL+05ssPw/FmZN1a/4/enLCwO28Z\niihZdulITNHUrKFMeRrQNL4TEO3G3BUlZwXYPKA+vZsTaNQmnzO1UFB6jfyl\nrvMcdOtBnHf0X12LsjVD5smTHWmxf3MqVT2ZuLRTQ7EmORHmJwpq4o/Rtd0o\nzKyTsY+HciizP2eHg+8I6AUlTukwgmUT7Dv3Ctj4t5RwdDdm5FwdEDVU1jY1\ncp026ckeqNRxXsLjLlg7Cb6YVb7sr3gwRjgL/MBNDUiQrDlYRXQpRlC+IdCk\nwfodfXcYMN8Vavh3Rql2GlTQfnLWtIZ0Vj3KtsON8hl6iOjgRmc5m6RBvbIc\nBvTylKbfmDovPt7Hk+KGi2q5g9AD5fikVukpOSKQZdOb7DyahO7MsqBOME6d\nNsxOYqCYID/OXh+o8/WtPjCHhv2b7ZxX//4gsJfkfK1jtx/6Jit5gTXAQZ3V\n8Ra9XTvUQwNcukbJH/L5kTHBMiwX0c4K80jwfIg84hETjyYVvFvupBPRI8jV\nGvvE\r\n=dVl8\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICdZuMrX9LpjDqUcDzy15W3jSgapxTA8gTmzPYWoWIM7AiBDBpe3tLGHeyxT62BMFvIgPOtXExqV+N0wH8sAPTx3bA=="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.12.0_1623880158079_0.6123369823992406"},"_hasShrinkwrap":false},"2.14.0-beta.1":{"name":"uswds","version":"2.14.0-beta.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/patterns/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"src/patterns/utils/test/.mocharc.json"},"scripts":{"build":"gulp","cover":"nyc --reporter=lcov gulp cover","format-tokens":"node ./src/patterns/utils/style-format.js --file './src/patterns/data/colors' --output './src/patterns/stylesheets/core/system-tokens'","lint":"gulp lint","mocha":"mocha","prepare":"npx gulp","preversion":"npm test","release":"gulp release","federalist":"npm install && npx gulp","start":"gulp watch","test":"snyk test && gulp test","test:ci":"gulp test","test:a11y":"gulp a11y","test:sass":"gulp sassTests","test:unit":"gulp unitTests","version":"gulp build release","watch":"gulp watch","prettier:scss":"npx prettier --write './src/patterns/**/**/*.scss'","prettier:templates":"npx prettier --write './build/patterns/!(test*)/**/*.markup-only.html'","pl:build":"patternlab build --config ./patternlab-config.json","pl:help":"patternlab --help","pl:version":"patternlab --version"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","express":"^4.17.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.14.7","@pattern-lab/cli":"^5.14.3","@pattern-lab/core":"^5.14.3","@pattern-lab/engine-twig":"^5.14.3","@pattern-lab/uikit-workshop":"^5.14.3","@types/node":"^15.12.5","ansi-colors":"^4.1.1","autoprefixer":"^10.2.6","axe-core":"^4.2.3","babelify":"^10.0.0","browser-sync":"^2.27.3","browserify":"^17.0.0","chrome-launcher":"^0.14.0","chrome-remote-interface":"^0.30.1","cross-spawn":"^7.0.3","eslint":"^7.29.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.23.4","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-eslint":"^6.0.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.1.3","gulp-run-command":"0.0.10","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^16.6.0","jsdom-global":"^3.0.2","mocha":"^6.2.0","mq-polyfill":"^1.1.8","normalize.css":"^8.0.1","nyc":"^15.1.0","postcss":"^8.3.5","postcss-csso":"^5.0.1","postcss-discard-comments":"^4.0.2","prettier":"^2.3.2","sass":"^1.35.1","sass-true":"^6.0.1","sinon":"^9.2.2","snyk":"^1.650.0","stylelint":"^13.13.1","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.2.0","stylelint-scss":"^3.18.0","typescript":"^4.3.4","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","webpack":"^5.41.1","yargs":"^16.1.1"},"readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://img.shields.io/circleci/build/gh/uswds/uswds/develop?style=for-the-badge&logo=circleci)](https://circleci.com/gh/uswds/uswds/tree/develop) ![Snyk vulnerabilities](https://img.shields.io/snyk/vulnerabilities/npm/uswds?style=for-the-badge) [![npm Version](https://img.shields.io/npm/v/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![npm Downloads](https://img.shields.io/npm/dt/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![GitHub issues](https://img.shields.io/github/issues/uswds/uswds?style=for-the-badge&logo=github)](https://github.com/uswds/uswds/issues) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4?style=for-the-badge)](https://github.com/prettier/prettier)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n- [United States Web Design System](#united-states-web-design-system)\n  - [Contents](#contents)\n  - [Background](#background)\n  - [Recent updates](#recent-updates)\n  - [Getting started](#getting-started)\n  - [Using the design system](#using-the-design-system)\n    - [Download and install](#download-and-install)\n    - [Install using npm](#install-using-npm)\n      - [Using the USWDS package](#using-the-uswds-package)\n      - [Sass and theme settings](#sass-and-theme-settings)\n      - [Sass compilation requirements](#sass-compilation-requirements)\n      - [JavaScript](#javascript)\n    - [Use another framework or package manager](#use-another-framework-or-package-manager)\n  - [CSS architecture](#css-architecture)\n  - [JS customization](#js-customization)\n  - [Customization, theming, and tokens](#customization-theming-and-tokens)\n    - [Using tokens in theme settings](#using-tokens-in-theme-settings)\n    - [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  - [Where things live](#where-things-live)\n  - [Browser support](#browser-support)\n  - [Accessibility](#accessibility)\n  - [Fractal](#fractal)\n    - [Template compatibility](#template-compatibility)\n  - [Long-term support of v1.x](#long-term-support-of-v1x)\n  - [Need installation help?](#need-installation-help)\n  - [Contributing to the code base](#contributing-to-the-code-base)\n  - [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n  - [Licenses and attribution](#licenses-and-attribution)\n  - [Contributing](#contributing)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.usds.gov/) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n- Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  - [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n- Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  - [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download-and-install)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download and install\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/download/v2.11.2/uswds-2.11.2.zip) from the latest USWDS release and open that file.\n\n   After extracting the zip file you should see the following file and folder structure:\n\n   ```\n   uswds-2.11.2/\n   ├── css/\n   │   ├── uswds.min.css.map\n   │   ├── uswds.min.css\n   │   └── uswds.css\n   ├── fonts/\n   ├── img/\n   ├── js/\n   │   ├── uswds-init.js\n   │   ├── uswds-init.min.js\n   │   ├── uswds-init.min.js.map\n   │   ├── uswds.min.js.map\n   │   ├── uswds.min.js\n   │   └── uswds.js\n   └── scss/\n\n   ```\n\n   The three files critical to any USWDS project are the **stylesheet**, the **library**, and the **intializer**. Any project requires both the stylesheet and library to function properly.\n\n   **Stylesheet:** This is the compiled CSS stylesheet that describes how design system components look. Reference either `uswds.css` or `uswds.min.css` in the `<head>` of your document.\n\n   **Library:** This is the compiled JavaScript that controls component interactivity. Reference either `uswds.js` or `uswds.min.js` at the end of the `<body>` of your document.\n\n   **Initializer:** This small JavaScript file (less than 1 KB minified) helps the browser know if the USWDS JavaScript library is loading properly. This prevents component content from \"flashing\" or \"shifting\" while the page loads. Reference `uswds-init.min.js` in the `<head>` of your page, or inline its contents directly into the `<script>` tag.\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n   ```\n   example-project/\n   ├── assets/\n   │   ├── uswds-2.11.2/\n   │   ├── stylesheets/\n   │   ├── images/\n   │   └── javascript/\n   └── index.html\n   ```\n\n   You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the stylesheet, library, and initializer in each HTML page or dynamic template in your project. We also provide Sass (.scss) files in the zip package which you should use to generate new CSS with project-specific settings. See [Sass and theme settings](#sass-and-theme-settings) for more information.\n\n   Here is an example of how to reference these assets in your `index.html` file:\n\n   ```html\n   <!DOCTYPE html>\n   <html>\n     <head>\n       <meta charset=\"utf-8\" />\n       <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n       <title>My Example Project</title>\n       <script src=\"assets/uswds-2.11.2/js/uswds-init.min.js\"></script>\n       <link rel=\"stylesheet\" href=\"assets/uswds-2.11.2/css/uswds.min.css\" />\n     </head>\n     <body>\n       <script src=\"assets/uswds-2.11.2/js/uswds.min.js\"></script>\n     </body>\n   </html>\n   ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n   - Node v12.13.0 (current LTS), [Installation guides](https://nodejs.org/en/download/)\n\n   **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n   ```shell\n   npm -v\n   6.13.0 # This line may vary depending on what version of Node you've installed.\n   ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n   ```shell\n   npm install --save uswds@latest\n   ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.scss` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import \"uswds-theme-general\";\n@import \"uswds-theme-typography\";\n@import \"uswds-theme-spacing\";\n@import \"uswds-theme-color\";\n@import \"uswds-theme-utilities\";\n@import \"uswds\";\n@import \"uswds-theme-custom-styles\";\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires **autoprefixing** to work properly. This is included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n**Autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings via `.browserslistrc` config:\n\n```\n> 2%\nlast 2 versions\nIE 11\nnot dead\n```\n\n> Note: **media query sorting** is no longer required as of USWDS 2.5.0. We stopped sorting media queries with [csso](https://github.com/css/csso) in USWDS 2.5.1 because it wasn't outputting as expected. While both the minified and unminified CSS files are modestly larger as a result: `268 KB` unsorted vs. `259 KB` sorted, our testing indicates that once the files are compressed server side with gzip, the unsorted CSS is actually smaller: `36 KB` unsorted and gzipped vs. `38 KB` sorted and gzipped. As a result, we recommend that teams do not use media query sorting at this time.\n\nWe recommend using a **minifier** like [csso](https://github.com/css/csso) to compress your final compiled CSS and **sourcemaps** like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download-and-install). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n## CSS architecture\n\n- The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n- The CSS organization and naming conventions follow **[18F’s Front End Guide](https://frontend.18f.gov/css/)**.\n- We format our code with [Prettier](https://prettier.io/), per the formatting section of the **[18F Front End Guide](https://frontend.18f.gov/css/formatting/)**.\n- CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n- Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n- Uses **modular CSS** for scalable, modular, and flexible code.\n- Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n- Hard-coded magic numbers are avoided.\n- Media queries are built **mobile first**.\n- **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://designsystem.digital.gov/design-tokens/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nUSWDS JavaScript is separated into components (just as with the CSS and HTML) and initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files, then built for the browser. The components are not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require(\"./components\");\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class (like `.usa-accordion__button[aria-controls]`) used to link HTML elements with the JavaScript component. When a component is initialized, it searches through the current HTML DOM to find all elements that match the class and initializes the component JavaScript for those elements. The primary methods for each component include:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods based on that component's functionality. Any additional methods are found in that component's JavaScript file.\n\n**If you’re using a modern framework like React or Angular you can import components and initialize them in your library's DOM ready lifecycle event.**\n\nImporting a modular component.\n\n```js\nimport USWDS from \"../node_modules/uswds/src/js/components\";\nconst { characterCount, accordion } = USWDS; // deconstruct your components here\n```\n\nReact hooks example:\n\n```js\nfunction App() {\n  const ref = document.body;\n\n  useEffect(() => {\n    // initialize\n    characterCount.on(ref);\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments    accordion.on();\n\n    // remove event listeners when component un-mounts.\n    return () => {\n      characterCount.off();\n      accordion.off();\n    };\n  });\n}\n```\n\nAngular example:\n\n```js\nexport class App implements OnInit {\n  constructor() {\n    this.ref = document.body;\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments\n  }\n\n  ngOnInit() {\n    // initialize\n    characterCount.on(this.ref);\n    accordion.on();\n  }\n\n  // remove event listeners when component un-mounts.\n  ngOnDestroy() {\n    characterCount.off();\n    accordion.off();\n  }\n}\n```\n\n> Those using **Webpack 5** can take advantage of the updated exports field which allows declaration for requests like `import \"uswds\"` or `import accordion from \"uswds/src/js/components/accordion\"`\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settings), above.\n\nSet theme settings with USWDS design tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Design tokens section](https://designsystem.digital.gov/design-tokens/) of USWDS 2.0 documentation for more on the available tokens for [color](https://designsystem.digital.gov/design-tokens/color), [spacing units](https://designsystem.digital.gov/design-tokens/spacing-units), [font size](https://designsystem.digital.gov/design-tokens/typesetting/font-size/), and more.\n\n### Using tokens in theme settings\n\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```scss\n$theme-site-max-width: \"desktop\";\n$theme-site-margins-breakpoint: \"desktop\";\n$theme-site-margins-width: 4;\n$theme-site-margins-mobile-width: 2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```scss\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```scss\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units(\"desktop\");\n\n  @include at-media(\"desktop\") {\n    @include u-padding-x(4);\n  }\n}\n```\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;\n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\n\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n- **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [designsystem.digital.gov/components](https://designsystem.digital.gov/components)\n- **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n- **JS** is located in: `src/js (/components, /utils)`.\n- **Fonts** are located in: `dist/fonts`.\n- **Images** and icons are located in: `dist/img`.\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n## Pattern library\n\nWe're using [Pattern lab](https://patternlab.io/) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action. It will watch for changes in twig, scss, and JS and refresh.\n\n\n### Template compatibility\nWe're using `engine-twig`, which uses Twing, to get rid of the PHP dependency. This means there are a few differences between this Twig engine and the more common PHP engine.\n\n**Key differences**\n\nNamespacing not supported - Use relative paths.\n\n```twig\n❌ {% include \"@components/usa-card/usa-card.twig\" %}\n\n✔ {% include \"./components/usa-card/usa-card.twig\" %}\n```\n\n~~Generated variants with YML *~~\n```\n✔ usa-button-group.twig\n❕ usa-button-group~segmented.yml\n```\n\n~~*Works with patch [`31931c7`](https://github.com/uswds/uswds/commit/31931c7ee1ecf31c54981c1691a047157d458bfb).~~\n\nFixed in @pattern-lab/engine-twig@5.14.3\n\nHTML in YML renders as string\n```yml\n# Given\nitems:\n  - '<button class=\"usa-button\">Map</button>'\n  - '<button class=\"usa-button usa-button--outline\">Satellite</button>'\n  - '<button class=\"usa-button usa-button--outline\">Hybrid</button>'\n```\n\nResults in the markup being output as a string.\n\nWorkarounds available with `autoescape false` and `|raw` filter.\n\n```twig\n<li class=\"usa-button-group__item\">\n  {% autoescape false %}\n    {{ item }}\n  {% endautoescape %}\n</li>\n```\n\n```twig\n{{ domain.text | trim | raw }}\n```\n\n> ⚠ When using the `|raw` filter make sure you use it like so `| trim | raw`. Otherwise you'll get errors due to the whitespace.\n\nGlobal variables don't work as expected\nSetting a variable like `img_path` in `src/styleguide/data/data.yml` renders as empty string in some templates, for example in `usa-nav__primary.twig`.\n\nJust be aware when using macro's and ensure you have a proper fallback value.\n\n## Long-term support of v1.x\n\n[Version 1.x](https://v1.designsystem.digital.gov) is in maintenance mode. We will only make critical updates like security patches.\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n- Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n- U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n- Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n- UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n- Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n- Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"d6539bed574f2eada11c9daffb6732cf443c4bb8","_id":"uswds@2.14.0-beta.1","_nodeVersion":"14.16.0","_npmVersion":"6.14.11","dist":{"integrity":"sha512-1184qWGu2s/FYS+JwlknS1mPvT3nhUyeCantYBeOzXVkbAVjXfMtqnV9N0hKZaIrptaNwLwLhoFj9S2vbobO7Q==","shasum":"2763f0d7a36d14dec45ca8e4d1e59ba451034293","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.14.0-beta.1.tgz","fileCount":5344,"unpackedSize":19554788,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJg6MKVCRA9TVsSAnZWagAAmHAP/2NxJH31ZOu+m8qGd/1L\nvlJxe+kd6dmqDA6S2iy5hHq91epwxA2s21UXg0mKfecp/7ulJd+n7Kd56I9d\nBkIsScRoRBIbNkMr0aWntijfHEnaaQX9bp4wNqrw0fFKZLGquqg8Cauhsj3j\nVsiorLthzNIUPZHFuWrubT2Kc12HOcm1X+qg2FBLNZ4/KmgWoK+CR3ExK3IL\nEtoF+4DBtsgK08BleHiWUvZQ+c0yI21CQBiuqGxpMWFdJXB1ChweoHNlwtQU\n+lLPzA1MGU40CGVCogsgkm2Mluw0ik5KKzP+QvdWDW7J/UxBAn5HUTYLWURy\nxMSvfLBDG3xXuAwmCk087P8rNnUyGzdZ5Dkke4dBR9gKQa38vms+brfQDXx7\noRPPAs/cmCkfjatzFY6chm2ScWlBPoxut6dT8TXuWGYqYCw6rpQYN3SjOmNA\n47BQ+0ELN9lu0qT93uMb0KrAs+TjeXjquhCwYCYR3B9UTrfYokd7/ppFTDEE\n7BfFL95/UbpviYwjLIJhM6D8Nj3IIlX2cfqisJYJYzhXQ+ATKHNtb9aAOY9b\nzMFXKi0g3Rr650bjjGEjlmgnW4TSrGECmC/Es6+DNNzjvBu1G62CdClzLBTZ\nz3YZ05VehMhoXN7+IKuCwAxHdf5GESjuYVRsb6PGGHqG/1nA+w9Z/SG9Eyzy\n5URD\r\n=j2gT\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCzuCVNOrBcRYFFoN99wLSYXfZWeNblX094yexKfyXpbAIgAT7tOF0p2140ry9Kur1dXBzdiiTyehQ5VKAgPPjTeFk="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.14.0-beta.1_1625866900563_0.1062191171968323"},"_hasShrinkwrap":false},"2.12.1":{"name":"uswds","version":"2.12.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:templates":"npx prettier --write './build/components/render/*.html'"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","del":"^6.0.0","domready":"^1.0.8","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.15.0","@frctl/fractal":"^1.5.11","@frctl/nunjucks":"^2.0.13","@types/node":"^16.6.1","ansi-colors":"^4.1.1","autoprefixer":"^10.3.1","axe-core":"^4.3.2","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.14.0","chrome-remote-interface":"^0.31.0","cross-spawn":"^7.0.3","eslint":"^7.32.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.24.0","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-eslint":"^6.0.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.0","gulp-rename":"^2.0.0","gulp-replace":"^1.1.1","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^17.0.0","jsdom-global":"^3.0.2","merge-stream":"^2.0.0","mocha":"^9.0.3","mq-polyfill":"^1.1.8","node-notifier":"^10.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.3.6","postcss-csso":"^5.0.1","postcss-discard-comments":"^5.0.1","prettier":"^2.3.2","resemblejs":"^4.0.0","sass":"^1.38.0","sass-true":"^6.0.1","sinon":"^11.1.2","snyk":"^1.683.0","stylelint":"^13.13.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.3.0","stylelint-prettier":"^1.2.0","stylelint-scss":"^3.20.1","typescript":"^4.3.5","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^17.1.1"},"gitHead":"f1144a09954312db2efb442b7720f419a98faece","_id":"uswds@2.12.1","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-/GxcYeDGeRYwdTg03MokGXczMJ+0gbJ3uLXPHSkSPktzjO+6tuWu7EtXCSxa3yBzNGXTUTeYRRIhTF+WzzbA4w==","shasum":"5c4d3ad41ba408b2468d0e094e3ff800c07b84da","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.12.1.tgz","fileCount":5072,"unpackedSize":18955432,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhHXMwCRA9TVsSAnZWagAA7BgP/jRjqvqxpYcDoHXNldS6\nZ21/nxUasOCKtjP+RJvD8ZA+/nVJ3RU/0HEk+sn+lu69KaZXa2fpJWq02XEf\nagadMm8Kchb3VmBm94cjaw8v6PEQPIx/Jep0T1P49pvcOadOi1P341cuDYCI\nuecAB365o8V0qA5Z9zPk1QmmPk1bK5WK3OvNYDnb82DB5LlbAwaDbBBEBXUx\nWZxnuA3p1ygEU6Rrkxa8T9QzXPdspUyWdmL77N63va3tFNhveIQHS9QR7xvo\nbBunbYd1JSzJGrM5o3kGp5QdME4fjKqhKCeBwFqC1t1N951uLb/jrJ8NKCGE\n6wwRysPsL9whvqtocGJvOKx8NFeUldemLZ5eqv2bj+/tWlj+L90W50TlIuP8\n4fLP5GmzQ/gELl3AjRfGSuYo8W5j3mWBnCtszdnhycB7b10zRSV+8Rn5aY0j\nmm7Iv4imwK/kNyh4KioU+xe1kvxB1B07vdmGM1+kLIdKj29B5b/2TieVYFZp\n/kSwi6dbX1KE2Lo5cgPEOVlQ6mWmN5UzMKBXDQECzVFzv4fG5nvasFb+0dNN\nSldV4tMTW060DSSCMp75rHGvVFky7ILoBHUhXhFWhjuwHfkIojrWazPw3X1u\nLbvgbQiWOzzmAkiEZtTJOdkB2jG1MC8INv3wgHRfBLpQZ8fQxmB6uz9tiEvV\nJGi0\r\n=V8DM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCXlcGzVTdeCd4RMIJhQeFDKeEHMd1YV1eZ6AC6nvWwCwIgZH1HEfPa53KG6COgmzRaUnILnsJy7JzmOauP1VHfgb8="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.12.1_1629319984514_0.6417883026834212"},"_hasShrinkwrap":false},"2.12.2":{"name":"uswds","version":"2.12.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"gulp eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:templates":"npx prettier --write './build/components/render/*.html'"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","domready":"^1.0.8","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/preset-env":"^7.15.8","@frctl/fractal":"^1.5.11","@frctl/nunjucks":"^2.0.13","@types/node":"^16.11.6","ansi-colors":"^4.1.1","autoprefixer":"^10.3.7","axe-core":"^4.3.4","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.14.1","chrome-remote-interface":"^0.31.0","cross-spawn":"^7.0.3","del":"^6.0.0","eslint":"^7.32.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.25.2","eslint-plugin-no-unsanitized":"^3.2.0","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-eslint":"^6.0.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.1","gulp-rename":"^2.0.0","gulp-replace":"^1.1.1","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^17.0.0","jsdom-global":"^3.0.2","merge-stream":"^2.0.0","mocha":"^9.1.3","mq-polyfill":"^1.1.8","node-notifier":"^10.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.3.11","postcss-csso":"^5.0.1","postcss-discard-comments":"^5.0.1","prettier":"^2.4.1","resemblejs":"^4.0.0","sass":"^1.43.4","sass-true":"^6.0.1","sinon":"^11.1.2","snyk":"^1.746.0","stylelint":"^13.13.0","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.3.0","stylelint-prettier":"^1.2.0","stylelint-scss":"^3.21.0","typescript":"^4.4.4","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^17.2.1"},"gitHead":"b91372059a778655082c9c7d917f29fb40773c32","_id":"uswds@2.12.2","_nodeVersion":"12.18.4","_npmVersion":"6.14.6","dist":{"integrity":"sha512-Y9YeILoe4xiH26JpyznSbIsC8osHY88QjTFM3K5r7GcSuryauu7CpPnQdBUCw5R7myc24N5X8S/nxnXvOEtudg==","shasum":"810555721b4ee0cd28d08ceed003e33006e5a17e","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.12.2.tgz","fileCount":5068,"unpackedSize":19009160,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCzMzNrsj/MwWvzli/RxUEE3FCHNufwVq/x3IwOkfvEjAIhALH1zIzNlYtBgZ1hLvBJRTra872U3dKxABPlyKN6AenM"}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.12.2_1635803235819_0.7639384068555073"},"_hasShrinkwrap":false},"3.0.0-beta.1":{"name":"uswds","version":"3.0.0-beta.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"src/utils/test/.mocharc.json"},"scripts":{"build":"gulp","cover":"nyc --reporter=lcov gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","lint":"gulp lint","mocha":"mocha","prepare":"npx gulp","preversion":"npm test","release":"gulp release","federalist":"npm install && npm run build:storybook","start":"npm run start:storybook","test":"snyk test && gulp test","test:ci":"gulp test && npm run test:a11y","test:a11y":"build-storybook && axe-storybook","test:sass":"gulp sassTests","test:unit":"gulp unitTests","version":"gulp build release","watch":"gulp watch","prettier:scss":"npx prettier --write './src/**/**/*.scss'","prettier:templates":"npx prettier --write './build/!(test*)/**/*.markup-only.html'","pl:build":"patternlab build --config ./patternlab-config.json","pl:help":"patternlab --help","pl:version":"patternlab --version","start:storybook":"start-storybook -p 6006","build:storybook":"build-storybook"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","domready":"^1.0.8","express":"^4.17.1","lodash.debounce":"^4.0.7","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/core":"^7.15.4","@babel/preset-env":"^7.15.4","@chanzuckerberg/axe-storybook-testing":"^4.1.3","@pattern-lab/cli":"^5.14.3","@pattern-lab/core":"^5.14.3","@pattern-lab/engine-twig":"^5.14.3","@pattern-lab/uikit-workshop":"^5.14.3","@storybook/addon-a11y":"^6.3.8","@storybook/addon-actions":"^6.3.8","@storybook/addon-essentials":"^6.3.8","@storybook/addon-links":"^6.3.8","@storybook/addon-postcss":"^2.0.0","@storybook/builder-webpack5":"^6.3.8","@storybook/html":"^6.3.8","@storybook/manager-webpack5":"^6.3.8","@storybook/preset-scss":"^1.0.3","@storybook/web-components":"^6.3.8","@types/node":"^16.7.10","ansi-colors":"^4.1.1","autoprefixer":"^10.3.4","axe-core":"^4.3.3","babel-loader":"^8.2.2","babelify":"^10.0.0","browser-sync":"^2.27.3","browserify":"^17.0.0","chrome-launcher":"^0.14.0","chrome-remote-interface":"^0.31.0","cross-spawn":"^7.0.3","css-loader":"^6.2.0","del":"^6.0.0","eslint":"^7.29.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.24.2","eslint-plugin-no-unsanitized":"^4.0.0","extract-loader":"^5.1.0","fancy-log":"^1.3.3","file-loader":"^6.2.0","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-eslint":"^6.0.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.1","gulp-rename":"^2.0.0","gulp-replace":"^1.1.3","gulp-run-command":"0.0.10","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^16.6.0","jsdom-global":"^3.0.2","lit":"^2.0.0-rc.3","lit-element":"^2.5.1","lit-html":"^1.4.1","lit-scss-loader":"^1.1.0","merge-stream":"^2.0.0","mocha":"^6.2.0","mq-polyfill":"^1.1.8","normalize.css":"^8.0.1","nyc":"^15.1.0","path":"^0.12.7","postcss":"^8.3.6","postcss-csso":"^5.0.1","postcss-discard-comments":"^4.0.2","postcss-loader":"^6.1.1","postcss-preset-env":"^6.7.0","postcss-sass-loader":"^1.1.0","prettier":"^2.3.2","resolve-url-loader":"^4.0.0","sass":"^1.39.0","sass-loader":"^12.1.0","sass-true":"^6.0.1","sinon":"^9.2.2","snyk":"^1.696.0","style-loader":"^3.2.1","stylelint":"^13.13.1","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.2.0","stylelint-scss":"^3.18.0","twig":"^1.15.4","twigjs-loader":"^1.0.2","typescript":"^4.3.4","url-loader":"^4.1.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","webpack":"^5.52.0","yaml-loader":"^0.6.0","yargs":"^17.1.1"},"readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://img.shields.io/circleci/build/gh/uswds/uswds/develop?style=for-the-badge&logo=circleci)](https://circleci.com/gh/uswds/uswds/tree/develop) ![Snyk vulnerabilities](https://img.shields.io/snyk/vulnerabilities/npm/uswds?style=for-the-badge) [![npm Version](https://img.shields.io/npm/v/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![npm Downloads](https://img.shields.io/npm/dt/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![GitHub issues](https://img.shields.io/github/issues/uswds/uswds?style=for-the-badge&logo=github)](https://github.com/uswds/uswds/issues) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4?style=for-the-badge)](https://github.com/prettier/prettier)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n- [United States Web Design System](#united-states-web-design-system)\n  - [Contents](#contents)\n  - [Background](#background)\n  - [Recent updates](#recent-updates)\n  - [Getting started](#getting-started)\n  - [Using the design system](#using-the-design-system)\n    - [Download and install](#download-and-install)\n    - [Install using npm](#install-using-npm)\n      - [Using the USWDS package](#using-the-uswds-package)\n      - [Sass and theme settings](#sass-and-theme-settings)\n      - [Sass compilation requirements](#sass-compilation-requirements)\n      - [JavaScript](#javascript)\n    - [Use another framework or package manager](#use-another-framework-or-package-manager)\n  - [CSS architecture](#css-architecture)\n  - [JS customization](#js-customization)\n  - [Customization, theming, and tokens](#customization-theming-and-tokens)\n    - [Using tokens in theme settings](#using-tokens-in-theme-settings)\n    - [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  - [Where things live](#where-things-live)\n  - [Browser support](#browser-support)\n  - [Accessibility](#accessibility)\n  - [Fractal](#fractal)\n    - [Template compatibility](#template-compatibility)\n  - [Long-term support of v1.x](#long-term-support-of-v1x)\n  - [Need installation help?](#need-installation-help)\n  - [Contributing to the code base](#contributing-to-the-code-base)\n  - [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n  - [Licenses and attribution](#licenses-and-attribution)\n  - [Contributing](#contributing)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.usds.gov/) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n- Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  - [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n- Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  - [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download-and-install)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download and install\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/download/v2.12.2/uswds-2.12.2.zip) from the latest USWDS release and open that file.\n\n   After extracting the zip file you should see the following file and folder structure:\n\n   ```\n   uswds-2.12.2/\n   ├── css/\n   │   ├── uswds.min.css.map\n   │   ├── uswds.min.css\n   │   └── uswds.css\n   ├── fonts/\n   ├── img/\n   ├── js/\n   │   ├── uswds-init.js\n   │   ├── uswds-init.min.js\n   │   ├── uswds-init.min.js.map\n   │   ├── uswds.min.js.map\n   │   ├── uswds.min.js\n   │   └── uswds.js\n   └── scss/\n\n   ```\n\n   The three files critical to any USWDS project are the **stylesheet**, the **library**, and the **intializer**. Any project requires both the stylesheet and library to function properly.\n\n   **Stylesheet:** This is the compiled CSS stylesheet that describes how design system components look. Reference either `uswds.css` or `uswds.min.css` in the `<head>` of your document.\n\n   **Library:** This is the compiled JavaScript that controls component interactivity. Reference either `uswds.js` or `uswds.min.js` at the end of the `<body>` of your document.\n\n   **Initializer:** This small JavaScript file (less than 1 KB minified) helps the browser know if the USWDS JavaScript library is loading properly. This prevents component content from \"flashing\" or \"shifting\" while the page loads. Reference `uswds-init.min.js` in the `<head>` of your page, or inline its contents directly into the `<script>` tag.\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n   ```\n   example-project/\n   ├── assets/\n   │   ├── uswds-2.12.2/\n   │   ├── stylesheets/\n   │   ├── images/\n   │   └── javascript/\n   └── index.html\n   ```\n\n   You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the stylesheet, library, and initializer in each HTML page or dynamic template in your project. We also provide Sass (.scss) files in the zip package which you should use to generate new CSS with project-specific settings. See [Sass and theme settings](#sass-and-theme-settings) for more information.\n\n   Here is an example of how to reference these assets in your `index.html` file:\n\n   ```html\n   <!DOCTYPE html>\n   <html>\n     <head>\n       <meta charset=\"utf-8\" />\n       <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n       <title>My Example Project</title>\n       <script src=\"assets/uswds-2.12.2/js/uswds-init.min.js\"></script>\n       <link rel=\"stylesheet\" href=\"assets/uswds-2.12.2/css/uswds.min.css\" />\n     </head>\n     <body>\n       <script src=\"assets/uswds-2.12.2/js/uswds.min.js\"></script>\n     </body>\n   </html>\n   ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n   - Node v12.13.0 (current LTS), [Installation guides](https://nodejs.org/en/download/)\n\n   **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n   ```shell\n   npm -v\n   6.13.0 # This line may vary depending on what version of Node you've installed.\n   ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n   ```shell\n   npm install --save uswds@latest\n   ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.scss` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import \"uswds-theme-general\";\n@import \"uswds-theme-typography\";\n@import \"uswds-theme-spacing\";\n@import \"uswds-theme-color\";\n@import \"uswds-theme-utilities\";\n@import \"uswds\";\n@import \"uswds-theme-custom-styles\";\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires **autoprefixing** to work properly. This is included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n**Autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings via `.browserslistrc` config:\n\n```\n> 2%\nlast 2 versions\nIE 11\nnot dead\n```\n\n> Note: **media query sorting** is no longer required as of USWDS 2.5.0. We stopped sorting media queries with [csso](https://github.com/css/csso) in USWDS 2.5.1 because it wasn't outputting as expected. While both the minified and unminified CSS files are modestly larger as a result: `268 KB` unsorted vs. `259 KB` sorted, our testing indicates that once the files are compressed server side with gzip, the unsorted CSS is actually smaller: `36 KB` unsorted and gzipped vs. `38 KB` sorted and gzipped. As a result, we recommend that teams do not use media query sorting at this time.\n\nWe recommend using a **minifier** like [csso](https://github.com/css/csso) to compress your final compiled CSS and **sourcemaps** like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download-and-install). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n## CSS architecture\n\n- The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n- The CSS organization and naming conventions follow **[18F’s Front End Guide](https://frontend.18f.gov/css/)**.\n- We format our code with [Prettier](https://prettier.io/), per the formatting section of the **[18F Front End Guide](https://frontend.18f.gov/css/formatting/)**.\n- CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n- Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n- Uses **modular CSS** for scalable, modular, and flexible code.\n- Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n- Hard-coded magic numbers are avoided.\n- Media queries are built **mobile first**.\n- **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://designsystem.digital.gov/design-tokens/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nUSWDS JavaScript is separated into components (just as with the CSS and HTML) and initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files, then built for the browser. The components are not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require(\"./components\");\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class (like `.usa-accordion__button[aria-controls]`) used to link HTML elements with the JavaScript component. When a component is initialized, it searches through the current HTML DOM to find all elements that match the class and initializes the component JavaScript for those elements. The primary methods for each component include:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods based on that component's functionality. Any additional methods are found in that component's JavaScript file.\n\n**If you’re using a modern framework like React or Angular you can import components and initialize them in your library's DOM ready lifecycle event.**\n\nImporting a modular component.\n\n```js\nimport USWDS from \"../node_modules/uswds/src/js/components\";\nconst { characterCount, accordion } = USWDS; // deconstruct your components here\n```\n\nReact hooks example:\n\n```js\nfunction App() {\n  const ref = document.body;\n\n  useEffect(() => {\n    // initialize\n    characterCount.on(ref);\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments    accordion.on();\n\n    // remove event listeners when component un-mounts.\n    return () => {\n      characterCount.off();\n      accordion.off();\n    };\n  });\n}\n```\n\nAngular example:\n\n```js\nexport class App implements OnInit {\n  constructor() {\n    this.ref = document.body;\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments\n  }\n\n  ngOnInit() {\n    // initialize\n    characterCount.on(this.ref);\n    accordion.on();\n  }\n\n  // remove event listeners when component un-mounts.\n  ngOnDestroy() {\n    characterCount.off();\n    accordion.off();\n  }\n}\n```\n\n> Those using **Webpack 5** can take advantage of the updated exports field which allows declaration for requests like `import \"uswds\"` or `import accordion from \"uswds/src/js/components/accordion\"`\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settings), above.\n\nSet theme settings with USWDS design tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Design tokens section](https://designsystem.digital.gov/design-tokens/) of USWDS 2.0 documentation for more on the available tokens for [color](https://designsystem.digital.gov/design-tokens/color), [spacing units](https://designsystem.digital.gov/design-tokens/spacing-units), [font size](https://designsystem.digital.gov/design-tokens/typesetting/font-size/), and more.\n\n### Using tokens in theme settings\n\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```scss\n$theme-site-max-width: \"desktop\";\n$theme-site-margins-breakpoint: \"desktop\";\n$theme-site-margins-width: 4;\n$theme-site-margins-mobile-width: 2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```scss\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```scss\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units(\"desktop\");\n\n  @include at-media(\"desktop\") {\n    @include u-padding-x(4);\n  }\n}\n```\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;\n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\n\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n- **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [designsystem.digital.gov/components](https://designsystem.digital.gov/components)\n- **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n- **JS** is located in: `src/js (/components, /utils)`.\n- **Fonts** are located in: `dist/fonts`.\n- **Images** and icons are located in: `dist/img`.\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n## Pattern library\n\nWe're using [Pattern lab](https://patternlab.io/) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action. It will watch for changes in twig, scss, and JS and refresh.\n\n\n### Template compatibility\nWe're using `engine-twig`, which uses Twing, to get rid of the PHP dependency. This means there are a few differences between this Twig engine and the more common PHP engine.\n\n**Key differences**\n\nNamespacing not supported - Use relative paths.\n\n```twig\n❌ {% include \"@components/usa-card/usa-card.twig\" %}\n\n✔ {% include \"./components/usa-card/usa-card.twig\" %}\n```\n\n~~Generated variants with YML *~~\n```\n✔ usa-button-group.twig\n❕ usa-button-group~segmented.yml\n```\n\n~~*Works with patch [`31931c7`](https://github.com/uswds/uswds/commit/31931c7ee1ecf31c54981c1691a047157d458bfb).~~\n\nFixed in @pattern-lab/engine-twig@5.14.3\n\nHTML in YML renders as string\n```yml\n# Given\nitems:\n  - '<button class=\"usa-button\">Map</button>'\n  - '<button class=\"usa-button usa-button--outline\">Satellite</button>'\n  - '<button class=\"usa-button usa-button--outline\">Hybrid</button>'\n```\n\nResults in the markup being output as a string.\n\nWorkarounds available with `autoescape false` and `|raw` filter.\n\n```twig\n<li class=\"usa-button-group__item\">\n  {% autoescape false %}\n    {{ item }}\n  {% endautoescape %}\n</li>\n```\n\n```twig\n{{ domain.text | trim | raw }}\n```\n\n> ⚠ When using the `|raw` filter make sure you use it like so `| trim | raw`. Otherwise you'll get errors due to the whitespace.\n\nGlobal variables don't work as expected\nSetting a variable like `img_path` in `src/styleguide/data/data.yml` renders as empty string in some templates, for example in `usa-nav__primary.twig`.\n\nJust be aware when using macro's and ensure you have a proper fallback value.\n\n## Long-term support of v1.x\n\n[Version 1.x](https://v1.designsystem.digital.gov) is in maintenance mode. We will only make critical updates like security patches.\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n- Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n- U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n- Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n- UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n- Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n- Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"cce2874ae32bc3edcf16127038d91aef7d5cd5a2","_id":"uswds@3.0.0-beta.1","_nodeVersion":"14.16.0","_npmVersion":"6.14.11","dist":{"integrity":"sha512-77IeCFlqjfUs4ckxOscUrIeF47JMIengC+IDdl3UIKQ+ir0gSwMP/IgN1piXF2me7ilmJ0bjiFSRLJjuYG3iBg==","shasum":"5fffee5dc99f410cc03bf0920cb3d8de4fba827a","tarball":"https://registry.npmjs.org/uswds/-/uswds-3.0.0-beta.1.tgz","fileCount":5355,"unpackedSize":19390186,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDgNI0Bers+1npLmBhrpF9B9pVeMjNUR7BAFtyEvCi7mAIhAI0DJuazREy0ILtXjG25dNF8IKVtDsOxRBmMDdwRebgE"}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_3.0.0-beta.1_1636059718042_0.8690439673239081"},"_hasShrinkwrap":false},"2.13.0":{"name":"uswds","version":"2.13.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:templates":"npx prettier --write './build/components/render/*.html'"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","domready":"^1.0.8","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@18f/identity-stylelint-config":"^1.0.0","@babel/preset-env":"^7.15.8","@frctl/fractal":"^1.5.11","@frctl/nunjucks":"^2.0.13","@types/node":"^16.11.6","ansi-colors":"^4.1.1","autoprefixer":"^10.3.7","axe-core":"^4.3.4","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.15.0","chrome-remote-interface":"^0.31.0","cross-spawn":"^7.0.3","del":"^6.0.0","eslint":"^8.4.1","eslint-config-airbnb-base":"^15.0.0","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.25.2","eslint-plugin-no-unsanitized":"^4.0.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.1","gulp-rename":"^2.0.0","gulp-replace":"^1.1.1","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^19.0.0","jsdom-global":"^3.0.2","merge-stream":"^2.0.0","mocha":"^6.2.0","mq-polyfill":"^1.1.8","node-notifier":"^10.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.3.11","postcss-csso":"^5.0.1","postcss-discard-comments":"^5.0.1","prettier":"^2.4.1","resemblejs":"^4.0.0","sass":"^1.43.4","sass-true":"^6.0.1","sinon":"^12.0.1","snyk":"^1.746.0","stylelint":"^14.1.0","typescript":"^4.4.4","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^17.2.1"},"gitHead":"797fb74aae26fca7e716f8f01ec5fdfa2cb17a38","_id":"uswds@2.13.0","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-DybO7wnczHtP5UXjRLHzVB3R4Dbl5hCIaONA4ctPoiof7FkEhST6zIveC2tUQNjmDiacbpvAtp9aNzEfxLCpcw==","shasum":"7ad910d43f1ab4595664619dfb6f701f64de7193","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.13.0.tgz","fileCount":5069,"unpackedSize":19024812,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJhuQ1gCRA9TVsSAnZWagAAgpwP/jTiyMPHYjuizCzPndhh\njIeImTksklK/V+LFgKxUlDmGg5ucrNs5Da3VkzpSZnkk4d31B3P1yKDoS56B\nwSq2TcCOP32owQYaI/iOKzFmNSNkMVCGMdgJE1cnTzxdtXcmdJYpewGfxXaK\nLwj0KpExNQwWCMwqCkaBT0bagc/1s8DGC0DZGqCzKodsMOtlhCFMaE0+3Nmi\nN8KEg3Lnb+1MtwOkfmRKmn5ND2Z8czhCznzRnSxqo4S3f2AHIh2degy+BRk+\neUKL7Gi7X+lE4a+OENi4Ut9IXsK/0fnymYTGEvw41aB3lq3fgko8NvgSVrd+\nvMqYPIOGdpyTuxnBD5CJdHwSwQ7snNnHLOeEqaVNLAtg7oPi+Bb2D7qyHAyB\nOc+qTOUD1A8PvdBKBkmgpF1ezfqhsA4aIwCHgRLt3rwn79WfJPqL3v5eQE3b\nBT6IQ4BTKS155cJtmFKJh8uLQO4LfhSuAZnIfqPgYwsHQh7/pjPk97jzZ8nC\nodA8ewPBci2JRny4/IdWRfZgT9t2uUDt0kHrUjcCTsOSrA9I5ZGgk0zUO183\n6ard0zHI/5nBMsmvlqTxZxCAu1nk2x01fDwsEuvVSK5UfXqmogB280Py/fq4\nNk1XO4QeVpny4V+XMNX5phbJ9SrBrsZw+FHJt6/uNejt02zsB+EZ2mPk9RM6\nKK3b\r\n=HIYb\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCFLtVJRr80xMcIjCMIlTWbm7YkYOUUvjZO0vcqXlBqmQIhAKSqYhNwHqZJdPMFPKYpl2aYk+DLEW4dKgYJEHs85csV"}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.13.0_1639517535650_0.4718681781766627"},"_hasShrinkwrap":false},"3.0.0-beta.2":{"name":"uswds","version":"3.0.0-beta.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"src/utils/test/.mocharc.json"},"scripts":{"build":"gulp","cover":"nyc --reporter=lcov gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","lint":"gulp lint","mocha":"mocha","prepare":"npx gulp","preversion":"npm test","release":"gulp release","federalist":"npm install && npm run build:storybook","start":"npm run start:storybook","test":"snyk test && gulp test","test:ci":"gulp test && npm run test:a11y","test:a11y":"build-storybook && axe-storybook","test:sass":"gulp sassTests","test:unit":"gulp unitTests","version":"gulp release","watch":"gulp watch","prettier:html":"npx prettier --write './html-templates/**/**/*.html'","prettier:scss":"npx prettier --write './src/**/**/*.scss'","start:storybook":"start-storybook -p 6006 -s ./dist","build:storybook":"build-storybook -s ./dist","build:html":"webpack build --config ./webpack.twig.config.js && npm run prettier:html"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","domready":"^1.0.8","express":"^4.17.2","lodash.debounce":"^4.0.7","lodash.merge":"^4.6.2","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@babel/core":"^7.16.7","@babel/preset-env":"^7.16.7","@chanzuckerberg/axe-storybook-testing":"^5.0.0","@storybook/addon-a11y":"^6.3.12","@storybook/addon-actions":"^6.3.12","@storybook/addon-essentials":"^6.3.12","@storybook/addon-links":"^6.3.12","@storybook/addon-postcss":"^2.0.0","@storybook/builder-webpack5":"^6.3.12","@storybook/html":"^6.3.12","@storybook/manager-webpack5":"^6.3.12","@types/node":"^16.11.19","@whitespace/storybook-addon-html":"^5.0.0","ansi-colors":"^4.1.1","autoprefixer":"^10.4.1","axe-core":"^4.3.3","babel-loader":"^8.2.2","babelify":"^10.0.0","browser-sync":"^2.27.3","browserify":"^17.0.0","chrome-launcher":"^0.14.0","chrome-remote-interface":"^0.31.0","cross-spawn":"^7.0.3","css-loader":"^6.2.0","del":"^6.0.0","eslint":"^7.29.0","eslint-config-airbnb-base":"^14.2.1","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.25.4","eslint-plugin-no-unsanitized":"^4.0.0","extract-loader":"^5.1.0","fancy-log":"^1.3.3","file-loader":"^6.2.0","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-eslint":"^6.0.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.1","gulp-rename":"^2.0.0","gulp-replace":"^1.1.3","gulp-run-command":"0.0.10","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-stylelint":"^13.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","html-webpack-plugin":"^5.4.0","jsdom":"^17.0.0","jsdom-global":"^3.0.2","lit":"^2.0.2","lit-element":"^2.5.1","lit-html":"^1.4.1","lit-scss-loader":"^1.1.0","merge-stream":"^2.0.0","mocha":"^6.2.0","mq-polyfill":"^1.1.8","normalize.css":"^8.0.1","nyc":"^15.1.0","path":"^0.12.7","postcss":"^8.3.9","postcss-csso":"^5.0.1","postcss-discard-comments":"^5.0.1","postcss-loader":"^6.1.1","postcss-preset-env":"^6.7.0","postcss-sass-loader":"^1.1.0","prettier":"^2.4.1","raw-loader":"^4.0.2","resolve-url-loader":"^4.0.0","sass":"^1.45.2","sass-loader":"^12.1.0","sass-true":"^6.0.1","sinon":"^11.1.2","snyk":"^1.817.0","storybook-addon-html-document":"^1.0.1","style-loader":"^3.3.0","stylelint":"^13.13.1","stylelint-config-prettier":"^8.0.2","stylelint-config-recommended-scss":"^4.2.0","stylelint-prettier":"^1.2.0","stylelint-scss":"^3.21.0","twig-html-loader":"^0.1.9","twig-loader":"^0.5.5","twigjs-loader":"^1.0.2","typescript":"^4.4.3","url-loader":"^4.1.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","webpack":"^5.58.1","webpack-cli":"^4.9.1","yargs":"^17.3.1"},"readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://img.shields.io/circleci/build/gh/uswds/uswds/develop?style=for-the-badge&logo=circleci)](https://circleci.com/gh/uswds/uswds/tree/develop) ![Snyk vulnerabilities](https://img.shields.io/snyk/vulnerabilities/npm/uswds?style=for-the-badge) [![npm Version](https://img.shields.io/npm/v/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![npm Downloads](https://img.shields.io/npm/dt/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![GitHub issues](https://img.shields.io/github/issues/uswds/uswds?style=for-the-badge&logo=github)](https://github.com/uswds/uswds/issues) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4?style=for-the-badge)](https://github.com/prettier/prettier)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n- [United States Web Design System](#united-states-web-design-system)\n  - [Contents](#contents)\n  - [Background](#background)\n  - [Recent updates](#recent-updates)\n  - [Getting started](#getting-started)\n  - [Using the design system](#using-the-design-system)\n    - [Download and install](#download-and-install)\n    - [Install using npm](#install-using-npm)\n      - [Using the USWDS package](#using-the-uswds-package)\n      - [Sass and theme settings](#sass-and-theme-settings)\n      - [Sass compilation requirements](#sass-compilation-requirements)\n      - [JavaScript](#javascript)\n    - [Use another framework or package manager](#use-another-framework-or-package-manager)\n  - [CSS architecture](#css-architecture)\n  - [JS customization](#js-customization)\n  - [Customization, theming, and tokens](#customization-theming-and-tokens)\n    - [Using tokens in theme settings](#using-tokens-in-theme-settings)\n    - [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  - [Where things live](#where-things-live)\n  - [Browser support](#browser-support)\n  - [Accessibility](#accessibility)\n  - [Pattern library](#pattern-library)\n    - [Template compatibility](#template-compatibility)\n  - [Long-term support of v1.x](#long-term-support-of-v1x)\n  - [Need installation help?](#need-installation-help)\n  - [Contributing to the code base](#contributing-to-the-code-base)\n  - [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n  - [Licenses and attribution](#licenses-and-attribution)\n  - [Contributing](#contributing)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.usds.gov/) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n- Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  - [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n- Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  - [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download-and-install)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download and install\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/download/v2.12.2/uswds-2.12.2.zip) from the latest USWDS release and open that file.\n\n   After extracting the zip file you should see the following file and folder structure:\n\n   ```\n   uswds-2.12.2/\n   ├── css/\n   │   ├── uswds.min.css.map\n   │   ├── uswds.min.css\n   │   └── uswds.css\n   ├── fonts/\n   ├── img/\n   ├── js/\n   │   ├── uswds-init.js\n   │   ├── uswds-init.min.js\n   │   ├── uswds-init.min.js.map\n   │   ├── uswds.min.js.map\n   │   ├── uswds.min.js\n   │   └── uswds.js\n   └── scss/\n\n   ```\n\n   The three files critical to any USWDS project are the **stylesheet**, the **library**, and the **intializer**. Any project requires both the stylesheet and library to function properly.\n\n   **Stylesheet:** This is the compiled CSS stylesheet that describes how design system components look. Reference either `uswds.css` or `uswds.min.css` in the `<head>` of your document.\n\n   **Library:** This is the compiled JavaScript that controls component interactivity. Reference either `uswds.js` or `uswds.min.js` at the end of the `<body>` of your document.\n\n   **Initializer:** This small JavaScript file (less than 1 KB minified) helps the browser know if the USWDS JavaScript library is loading properly. This prevents component content from \"flashing\" or \"shifting\" while the page loads. Reference `uswds-init.min.js` in the `<head>` of your page, or inline its contents directly into the `<script>` tag.\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n   ```\n   example-project/\n   ├── assets/\n   │   ├── uswds-2.12.2/\n   │   ├── stylesheets/\n   │   ├── images/\n   │   └── javascript/\n   └── index.html\n   ```\n\n   You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the stylesheet, library, and initializer in each HTML page or dynamic template in your project. We also provide Sass (.scss) files in the zip package which you should use to generate new CSS with project-specific settings. See [Sass and theme settings](#sass-and-theme-settings) for more information.\n\n   Here is an example of how to reference these assets in your `index.html` file:\n\n   ```html\n   <!DOCTYPE html>\n   <html>\n     <head>\n       <meta charset=\"utf-8\" />\n       <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n       <title>My Example Project</title>\n       <script src=\"assets/uswds-2.12.2/js/uswds-init.min.js\"></script>\n       <link rel=\"stylesheet\" href=\"assets/uswds-2.12.2/css/uswds.min.css\" />\n     </head>\n     <body>\n       <script src=\"assets/uswds-2.12.2/js/uswds.min.js\"></script>\n     </body>\n   </html>\n   ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n   - Node v12.13.0 (current LTS), [Installation guides](https://nodejs.org/en/download/)\n\n   **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n   ```shell\n   npm -v\n   6.13.0 # This line may vary depending on what version of Node you've installed.\n   ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n   ```shell\n   npm install --save uswds@latest\n   ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.scss` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import \"uswds-theme-general\";\n@import \"uswds-theme-typography\";\n@import \"uswds-theme-spacing\";\n@import \"uswds-theme-color\";\n@import \"uswds-theme-utilities\";\n@import \"uswds\";\n@import \"uswds-theme-custom-styles\";\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires **autoprefixing** to work properly. This is included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n**Autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings via `.browserslistrc` config:\n\n```\n> 2%\nlast 2 versions\nIE 11\nnot dead\n```\n\n> Note: **media query sorting** is no longer required as of USWDS 2.5.0. We stopped sorting media queries with [csso](https://github.com/css/csso) in USWDS 2.5.1 because it wasn't outputting as expected. While both the minified and unminified CSS files are modestly larger as a result: `268 KB` unsorted vs. `259 KB` sorted, our testing indicates that once the files are compressed server side with gzip, the unsorted CSS is actually smaller: `36 KB` unsorted and gzipped vs. `38 KB` sorted and gzipped. As a result, we recommend that teams do not use media query sorting at this time.\n\nWe recommend using a **minifier** like [csso](https://github.com/css/csso) to compress your final compiled CSS and **sourcemaps** like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download-and-install). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n## CSS architecture\n\n- The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n- The CSS organization and naming conventions follow **[18F’s Front End Guide](https://frontend.18f.gov/css/)**.\n- We format our code with [Prettier](https://prettier.io/), per the formatting section of the **[18F Front End Guide](https://frontend.18f.gov/css/formatting/)**.\n- CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n- Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n- Uses **modular CSS** for scalable, modular, and flexible code.\n- Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n- Hard-coded magic numbers are avoided.\n- Media queries are built **mobile first**.\n- **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://designsystem.digital.gov/design-tokens/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nUSWDS JavaScript is separated into components (just as with the CSS and HTML) and initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files, then built for the browser. The components are not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require(\"./components\");\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class (like `.usa-accordion__button[aria-controls]`) used to link HTML elements with the JavaScript component. When a component is initialized, it searches through the current HTML DOM to find all elements that match the class and initializes the component JavaScript for those elements. The primary methods for each component include:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods based on that component's functionality. Any additional methods are found in that component's JavaScript file.\n\n**If you’re using a modern framework like React or Angular you can import components and initialize them in your library's DOM ready lifecycle event.**\n\nImporting a modular component.\n\n```js\nimport USWDS from \"../node_modules/uswds/src/js/components\";\nconst { characterCount, accordion } = USWDS; // deconstruct your components here\n```\n\nReact hooks example:\n\n```js\nfunction App() {\n  const ref = document.body;\n\n  useEffect(() => {\n    // initialize\n    characterCount.on(ref);\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments\n    accordion.on();\n\n    // remove event listeners when component un-mounts.\n    return () => {\n      characterCount.off();\n      accordion.off();\n    };\n  });\n}\n```\n\nAngular example:\n\n```js\nexport class App implements OnInit {\n  constructor() {\n    this.ref = document.body;\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments\n  }\n\n  ngOnInit() {\n    // initialize\n    characterCount.on(this.ref);\n    accordion.on();\n  }\n\n  // remove event listeners when component un-mounts.\n  ngOnDestroy() {\n    characterCount.off();\n    accordion.off();\n  }\n}\n```\n\n> Those using **Webpack 5** can take advantage of the updated exports field which allows declaration for requests like `import \"uswds\"` or `import accordion from \"uswds/src/js/components/accordion\"`\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settings), above.\n\nSet theme settings with USWDS design tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Design tokens section](https://designsystem.digital.gov/design-tokens/) of USWDS 2.0 documentation for more on the available tokens for [color](https://designsystem.digital.gov/design-tokens/color), [spacing units](https://designsystem.digital.gov/design-tokens/spacing-units), [font size](https://designsystem.digital.gov/design-tokens/typesetting/font-size/), and more.\n\n### Using tokens in theme settings\n\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```scss\n$theme-site-max-width: \"desktop\";\n$theme-site-margins-breakpoint: \"desktop\";\n$theme-site-margins-width: 4;\n$theme-site-margins-mobile-width: 2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```scss\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```scss\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units(\"desktop\");\n\n  @include at-media(\"desktop\") {\n    @include u-padding-x(4);\n  }\n}\n```\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;\n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\n\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n- **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [designsystem.digital.gov/components](https://designsystem.digital.gov/components)\n- **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n- **JS** is located in: `src/js (/components, /utils)`.\n- **Fonts** are located in: `dist/fonts`.\n- **Images** and icons are located in: `dist/img`.\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n## Pattern library\n\nWe're using [Pattern lab](https://patternlab.io/) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action. It will watch for changes in twig, scss, and JS and refresh.\n\n\n### Template compatibility\nWe're using `engine-twig`, which uses Twing, to get rid of the PHP dependency. This means there are a few differences between this Twig engine and the more common PHP engine.\n\n**Key differences**\n\nNamespacing not supported - Use relative paths.\n\n```twig\n❌ {% include \"@components/usa-card/usa-card.twig\" %}\n\n✔ {% include \"./components/usa-card/usa-card.twig\" %}\n```\n\n~~Generated variants with YML *~~\n```\n✔ usa-button-group.twig\n❕ usa-button-group~segmented.yml\n```\n\n~~*Works with patch [`31931c7`](https://github.com/uswds/uswds/commit/31931c7ee1ecf31c54981c1691a047157d458bfb).~~\n\nFixed in @pattern-lab/engine-twig@5.14.3\n\nHTML in YML renders as string\n```yml\n# Given\nitems:\n  - '<button class=\"usa-button\">Map</button>'\n  - '<button class=\"usa-button usa-button--outline\">Satellite</button>'\n  - '<button class=\"usa-button usa-button--outline\">Hybrid</button>'\n```\n\nResults in the markup being output as a string.\n\nWorkarounds available with `autoescape false` and `|raw` filter.\n\n```twig\n<li class=\"usa-button-group__item\">\n  {% autoescape false %}\n    {{ item }}\n  {% endautoescape %}\n</li>\n```\n\n```twig\n{{ domain.text | trim | raw }}\n```\n\n> ⚠ When using the `|raw` filter make sure you use it like so `| trim | raw`. Otherwise you'll get errors due to the whitespace.\n\nGlobal variables don't work as expected\nSetting a variable like `img_path` in `src/styleguide/data/data.yml` renders as empty string in some templates, for example in `usa-nav__primary.twig`.\n\nJust be aware when using macro's and ensure you have a proper fallback value.\n\n## Long-term support of v1.x\n\n[Version 1.x](https://v1.designsystem.digital.gov) is in maintenance mode. We will only make critical updates like security patches.\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n- Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n- U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n- Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n- UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n- Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n- Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"f0a2914238348fe5f13fb1b0c0e21370ecd901a4","_id":"uswds@3.0.0-beta.2","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-43bsnj6AWt6uQzruL7Ia+8IwqhffZhVPjfOYt3l9SbHPw76CrpjWmEP8uAHlOQlzpXh3ZnkOR5lwp7HltuVEdA==","shasum":"bde46676e7c2403d8d95144fbd47f49f59c2bb90","tarball":"https://registry.npmjs.org/uswds/-/uswds-3.0.0-beta.2.tgz","fileCount":5346,"unpackedSize":19459312,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh2LB6CRA9TVsSAnZWagAAhSAP/2aDGbv9wnLTfUxdXU2M\n9YQnLqXAuK8w5/mJNXg4+BjcQvza0DBFH1J0HO2yNu5oHafkGohDEjNoqbyZ\nCXqT+R1EXmUfqg+iTwVCNndNEnE6PZRGMWN4kN53gA5v+C+hLwNkm16vVtND\ndQcQI91P+9SGmsAvvZ7xMTxWIzBtrwz4bo1eBQo7sf9UCJ6COyHCEW7NADfE\nI+18SGrZukllyeB9AF1qaskgWm4ktRDQodo6hyqA6Nd4vvpN+ptNTjVsciAD\nKqgsGnpeRALg2ZM+CflLrkGPqk49vwXdrXuGnDl5fEPCPgpGjVrqNVm1+eBN\n4NkzqHBWzztlPAAuCczIhjoeMj5FAuCZwmzoOZbRZ6cYwHj3gaetzp6rb2bt\n5Gcq46ZCtIDFLI5Y6z6uwopK4yXosJtL82F4D57jH3ZXJmlINbRtuY1JRnGV\nxIA8zfF8Yylc8blAJsdUn4eeeqxAKgGP146ey2jgjlXf/YAQITo5yT0G07bV\ntU4A5Gkc1lp0a+Ef6eQJlv0alJCBWocyVmF88Gdj0/LVnpuDA+XK7TyLZAQq\nempmWzM+UZ6HijzgZGSHaKxCSl2mRh9CpMq1fOyIUwnyWpWnE/FpGAtq4r2V\nSoN6y9f/FjCtR/PAccevGH/eQ4B9n1Wy1Iygbm7cuX/jDE2V6l/+ckGDg5dc\nQr5U\r\n=u/DP\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDiur/gO6aKrj+pEI6iaAZSV7SSnOD6xVnund7vfZGcxAIhAO7ryiT6YlQfup9JV6K9YynEc+cdpS1jwd8M9xdIfYiC"}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_3.0.0-beta.2_1641590905631_0.7980577095259156"},"_hasShrinkwrap":false},"2.13.1":{"name":"uswds","version":"2.13.1","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js","./src/fonts/*":"./src/fonts/*","./src/img/*":"./src/img/*","./js/*":"./dist/js/*","./css/*":"./dist/css/*","./scss/*":"./dist/scss/*","./img/*":"./dist/img/*","./fonts/*":"./dist/fonts/*"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:templates":"npx prettier --write './build/components/render/*.html'"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","domready":"^1.0.8","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@18f/identity-stylelint-config":"^1.0.0","@babel/preset-env":"^7.15.8","@frctl/fractal":"^1.5.11","@frctl/nunjucks":"^2.0.13","@types/node":"^16.11.6","ansi-colors":"^4.1.1","autoprefixer":"^10.3.7","axe-core":"^4.3.4","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.15.0","chrome-remote-interface":"^0.31.0","cross-spawn":"^7.0.3","del":"^6.0.0","eslint":"^8.4.1","eslint-config-airbnb-base":"^15.0.0","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.25.2","eslint-plugin-no-unsanitized":"^4.0.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.1","gulp-rename":"^2.0.0","gulp-replace":"^1.1.1","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^19.0.0","jsdom-global":"^3.0.2","merge-stream":"^2.0.0","mocha":"^6.2.0","mq-polyfill":"^1.1.8","node-notifier":"^10.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.3.11","postcss-csso":"^5.0.1","postcss-discard-comments":"^5.0.1","prettier":"^2.4.1","resemblejs":"^4.0.0","sass":"^1.43.4","sass-true":"^6.0.1","sinon":"^12.0.1","snyk":"^1.746.0","stylelint":"^14.1.0","typescript":"^4.4.4","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^17.2.1"},"gitHead":"b49291b9df375c093653e09bcd9c09d45a1dbc8a","_id":"uswds@2.13.1","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-tl4bSB+0ejZw90gwqsbO5XA+1b9nnGdbvVhY4ARGKoTIJ7M8/vpUBoz+Tm327ATZI2LUWmoced5V986muq1Iew==","shasum":"4a1d1cb88debacfb854edef4d946be87ee306e7b","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.13.1.tgz","fileCount":5070,"unpackedSize":19033068,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.13\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJh6ZlbCRA9TVsSAnZWagAAR68P/Agcn2zBggu9i1zyFupC\nmkl01UA7uK8CFeQ+2xWmabz93rw9ARZS0CXEu2A/OrlYJ6a3GJze7SbiFO9U\n2GH1KX311YY++l1IOn0SSEaamw0RIHdLyXEErENlLmIs0R6dVbdkDgJV4URu\nST4S3Kv1dXdB1iQQ3Hx3czK6GEogCKmFRmxzEKpS7DfH/QYTdclj2aKGvCW7\nCwlajBSatkGYeRvMyqKyegG1IJGyvsNeBl+g5FHE+KNit7h/C5sxE3qm/UKP\n71K9XO6PJtStskjt6TBzDfa2++ZkHrlSEUl5uLhMyapcKYypOl1sGjDccmWM\nMlr3+bjbhGJaGAsY1gF1yZ0xmyLpjrQbjPLiHJ724eZBw/073P0ml77pJkt9\nc5Zgawdn115ApkyPfACcOqcmXs41VsFmQi4jaVRNbmcM/uoItI4P3gAsnlys\naxFZNhSy6cmBgCfzEqjGoMJAJKCEgvMgQY47AoD3JAIDZoeeXssffi3vprru\nS/KYsv12wu2a4fqOF0eai+XButJ6RojRIEbulewh8x20xg4RtYfrhY+GsqIW\nRqrn7W2cGeS+dmrVTmROEHQ1pL5Ygm8ENh/CaYso7zzskO3NXx6aacnokjby\nIh+ZjeTZc0y+oPRAkxKCcZcEzdquVnnJTFSg9kGLLUEpAtr2EqotRq13f0OW\ncs80\r\n=/oso\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQClfiG6PIuAE1E6JRHrkvAX9p60WHbY5+QMWohA/3kraQIhAL3FmGu4eJxG1zDYgsehUVhJbwWFPUQ5EbmVBjyhqhN4"}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.13.1_1642699098772_0.2404064686853873"},"_hasShrinkwrap":false},"2.13.2":{"name":"uswds","version":"2.13.2","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js","./src/fonts/*":"./src/fonts/*","./src/img/*":"./src/img/*","./js/*":"./dist/js/*","./css/*":"./dist/css/*","./scss/*":"./dist/scss/*","./img/*":"./dist/img/*","./fonts/*":"./dist/fonts/*"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:templates":"npx prettier --write './_site/components/render/*.html'"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","domready":"^1.0.8","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@18f/identity-stylelint-config":"^1.0.0","@babel/preset-env":"^7.15.8","@frctl/fractal":"^1.5.11","@frctl/nunjucks":"^2.0.13","@types/node":"^16.11.6","ansi-colors":"^4.1.1","autoprefixer":"^10.3.7","axe-core":"^4.3.4","babelify":"^10.0.0","browserify":"^17.0.0","chrome-launcher":"^0.15.0","chrome-remote-interface":"^0.31.0","cross-spawn":"^7.0.3","del":"^6.0.0","eslint":"^8.4.1","eslint-config-airbnb-base":"^15.0.0","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.25.2","eslint-plugin-no-unsanitized":"^4.0.1","fancy-log":"^1.3.3","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.1","gulp-rename":"^2.0.0","gulp-replace":"^1.1.1","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","jsdom":"^19.0.0","jsdom-global":"^3.0.2","merge-stream":"^2.0.0","mocha":"^6.2.0","mq-polyfill":"^1.1.8","node-notifier":"^10.0.0","normalize.css":"^8.0.1","nswatch":"^0.2.0","nyc":"^15.1.0","postcss":"^8.3.11","postcss-csso":"^6.0.0","postcss-discard-comments":"^5.0.1","prettier":"^2.4.1","resemblejs":"^4.0.0","sass":"^1.43.4","sass-true":"^6.0.1","sinon":"^12.0.1","snyk":"^1.746.0","stylelint":"^14.1.0","typescript":"^4.4.4","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","yargs":"^17.2.1"},"gitHead":"857cf5045c3504b0ece2b5e6a5f1425af1c14db8","_id":"uswds@2.13.2","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-dhHH2SgFfZFQz7OckCig5oa/4AO0eYKWZM0pRLZUovbU5zwy1USsnjZkPhlVw9eKL6OG87mc1wuhj5Jbw28uvw==","shasum":"5567eb97c94546c670b7a2d085a13aa298398748","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.13.2.tgz","fileCount":5070,"unpackedSize":19032563,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiJl6lACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpNxA//WOEDKFezvL9nyvxiHQ787vHeHRoatlabwU9HhIDwd2cEkXB9\r\nof3PbwGKOTpMR4h9vwqHorGI7EZD+5Tu+YWKMwQJFLAK/UApyI5f5bj8sbYF\r\nZo+tEiMg63kPS+kyd/twlfREpZUg3Ub6cJ4siaxyp1ORNKOt+3EiVkz7aaHr\r\nuZ14yQTdkNwPskYk001kG984x5yJQjzqmJ3+gpMlEIquj8QJOioaCQQBFTMn\r\numCylv/ftsPYy8x3ywiGEYYgkYSSeIiLH+p4tBuuQYwIGejO1eNoil7oWQRN\r\nu4tZiI8yhYrWgeCKKvF8juQ2U1UGMmiaoRpKXJ3uggIMlwSTHe6aVUqHm8md\r\naTc83lkdEBWaEpqRZTCfiD/XqC9U6b6FVCHrVfJnnj2IopdEAA910AgSEAYs\r\nJBnJ/2fGgw3nCoFtD5mbnKFe/aqoDS0pRqmuaWG0qkbAJ+RTqO5zzA5rxvhB\r\ntRWlrzhakidVJUQticp3fiZvy0qmFJz0loI39aXJlVRP9M4z2TNDYHYKo9wh\r\nreiedaD/GAr0G0z30gOtLQHsqaBLUGDzX/TXixf6jtcU9Xx6y2gi52LUU6Wx\r\nXnTBROBeI2gm8Okm8Yjb/kv26EOKqoxnmQw87regryV7DfQsMrQdhc+dAvIy\r\nz5dBgpkkOyyhscv4+QCx7B/eMjJgiVvnptU=\r\n=zz1s\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCICqkw/L1QmN6Q1eWgzX+m1SK8/RYYitFaxoE+kOcYDknAiBLmy2fVVtOykBCe048do6tszlMxxwjJe9M8EAxTKrucg=="}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.13.2_1646681765481_0.18700388027694514"},"_hasShrinkwrap":false},"3.0.0-beta.3":{"name":"uswds","version":"3.0.0-beta.3","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/components/index.js","./src/js/components/*":"./src/js/components/*.js","./src/fonts/*":"./src/fonts/*","./src/img/*":"./src/img/*","./js/*":"./dist/js/*","./css/*":"./dist/css/*","./scss/*":"./dist/scss/*","./img/*":"./dist/img/*","./fonts/*":"./dist/fonts/*"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"src/utils/test/.mocharc.json"},"scripts":{"build":"gulp","cover":"nyc --reporter=lcov gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/tokens/color'","lint":"eslint src/**/**/*.js","mocha":"mocha","prepare":"npx gulp","preversion":"npm test","release":"gulp release","federalist":"npm run build:storybook","start":"npm run start:storybook","test":"snyk test && npm run lint && gulp typecheck && gulp lintSass && gulp test","test:ci":"npm run lint && gulp test && gulp lintSass && npm run test:a11y","test:a11y":"build-storybook && axe-storybook","test:sass":"gulp sassTests","test:unit":"gulp unitTests","version":"gulp release","watch":"gulp watch","prettier:html":"npx prettier --write './html-templates/**/**/*.html'","prettier:scss":"npx prettier --write './src/**/**/*.scss'","start:storybook":"start-storybook -p 6006","build:storybook":"build-storybook -o _site","build:html":"webpack build --config ./webpack.twig.config.js && npm run prettier:html"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"^1.0.3","domready":"^1.0.8","express":"^4.17.2","lodash.debounce":"^4.0.7","lodash.merge":"^4.6.2","object-assign":"^4.1.1","receptor":"^1.0.0","resolve-id-refs":"^0.1.0"},"devDependencies":{"@18f/identity-stylelint-config":"^1.0.0","@babel/core":"^7.16.7","@babel/preset-env":"^7.16.7","@chanzuckerberg/axe-storybook-testing":"^5.0.0","@storybook/addon-a11y":"^6.4.18","@storybook/addon-actions":"^6.4.18","@storybook/addon-essentials":"^6.4.18","@storybook/addon-links":"^6.4.18","@storybook/addon-postcss":"^2.0.0","@storybook/builder-webpack5":"^6.4.18","@storybook/html":"^6.4.18","@storybook/manager-webpack5":"^6.4.18","@types/node":"^16.11.19","@whitespace/storybook-addon-html":"^5.0.0","ansi-colors":"^4.1.1","autoprefixer":"^10.4.1","axe-core":"^4.3.3","babel-loader":"^8.2.2","babelify":"^10.0.0","browser-sync":"^2.27.3","browserify":"^17.0.0","chrome-launcher":"^0.15.0","chrome-remote-interface":"^0.31.0","cross-spawn":"^7.0.3","css-loader":"^6.2.0","del":"^6.0.0","eslint":"^8.4.1","eslint-config-airbnb-base":"^15.0.0","eslint-config-prettier":"^8.3.0","eslint-plugin-import":"^2.25.4","eslint-plugin-no-unsanitized":"^4.0.1","extract-loader":"^5.1.0","fancy-log":"^1.3.3","file-loader":"^6.2.0","gulp":"^4.0.2","gulp-changed":"^4.0.3","gulp-clean":"^0.4.0","gulp-cli":"^2.3.0","gulp-dart-scss":"^1.1.0","gulp-filter":"^7.0.0","gulp-postcss":"^9.0.1","gulp-rename":"^2.0.0","gulp-replace":"^1.1.3","gulp-run-command":"0.0.10","gulp-sass":"^5.1.0","gulp-sourcemaps":"^3.0.0","gulp-spawn-mocha":"^6.0.0","gulp-svg-sprite":"^1.5.0","gulp-uglify":"^3.0.2","handlebars":"^4.7.7","handlebars-helpers":"^0.10.0","html-webpack-plugin":"^5.4.0","jsdom":"^19.0.0","jsdom-global":"^3.0.2","lit":"^2.0.2","lit-element":"^2.5.1","lit-html":"^1.4.1","lit-scss-loader":"^1.1.0","merge-stream":"^2.0.0","mocha":"^6.2.0","mq-polyfill":"^1.1.8","normalize.css":"^8.0.1","nyc":"^15.1.0","path":"^0.12.7","postcss":"^8.3.9","postcss-csso":"^6.0.0","postcss-discard-comments":"^5.0.1","postcss-loader":"^6.1.1","postcss-preset-env":"^7.4.2","postcss-sass-loader":"^1.1.0","prettier":"^2.4.1","raw-loader":"^4.0.2","resolve-url-loader":"^4.0.0","sass":"^1.45.2","sass-loader":"^12.1.0","sass-true":"^6.0.1","sinon":"^12.0.1","snyk":"^1.817.0","storybook-addon-html-document":"^1.0.1","style-loader":"^3.3.0","stylelint":"^14.1.0","twig-html-loader":"^0.1.9","twig-loader":"^0.5.5","twigjs-loader":"^1.0.2","typescript":"^4.4.4","url-loader":"^4.1.1","vinyl-buffer":"^1.0.1","vinyl-source-stream":"^2.0.0","webpack":"^5.58.1","webpack-cli":"^4.9.1","yargs":"^17.3.1"},"readme":"# United States Web Design System\n\n[![CircleCI Build Status](https://img.shields.io/circleci/build/gh/uswds/uswds/develop?style=for-the-badge&logo=circleci)](https://circleci.com/gh/uswds/uswds/tree/develop) ![Snyk vulnerabilities](https://img.shields.io/snyk/vulnerabilities/npm/uswds?style=for-the-badge) [![npm Version](https://img.shields.io/npm/v/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![npm Downloads](https://img.shields.io/npm/dt/uswds?style=for-the-badge)](https://www.npmjs.com/package/uswds) [![GitHub issues](https://img.shields.io/github/issues/uswds/uswds?style=for-the-badge&logo=github)](https://github.com/uswds/uswds/issues) [![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4?style=for-the-badge)](https://github.com/prettier/prettier)\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n- [United States Web Design System](#united-states-web-design-system)\n  - [Contents](#contents)\n  - [Background](#background)\n  - [Recent updates](#recent-updates)\n  - [Getting started](#getting-started)\n  - [Using the design system](#using-the-design-system)\n    - [Download and install](#download-and-install)\n    - [Install using npm](#install-using-npm)\n      - [Using the USWDS package](#using-the-uswds-package)\n      - [Sass and theme settings](#sass-and-theme-settings)\n      - [Sass compilation requirements](#sass-compilation-requirements)\n      - [JavaScript](#javascript)\n    - [Use another framework or package manager](#use-another-framework-or-package-manager)\n  - [CSS architecture](#css-architecture)\n  - [JS customization](#js-customization)\n  - [Customization, theming, and tokens](#customization-theming-and-tokens)\n    - [Using tokens in theme settings](#using-tokens-in-theme-settings)\n    - [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  - [Where things live](#where-things-live)\n  - [Browser support](#browser-support)\n  - [Accessibility](#accessibility)\n  - [Pattern library](#pattern-library)\n    - [Template compatibility](#template-compatibility)\n  - [Long-term support of v1.x](#long-term-support-of-v1x)\n  - [Need installation help?](#need-installation-help)\n  - [Contributing to the code base](#contributing-to-the-code-base)\n  - [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n  - [Licenses and attribution](#licenses-and-attribution)\n  - [Contributing](#contributing)\n\n## Background\n\nUSWDS components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.usds.gov/) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. They are designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/) and to view websites and applications check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backwards incompatible changes along with a list of all changes.\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n- Designers: [Check out our Getting Started for Designers information](https://designsystem.digital.gov/getting-started/designers/).\n  - [Design files of all the assets included in the design system are available for download](https://github.com/uswds/uswds-assets/archive/master.zip).\n- Developers: [Follow the instructions in this README to get started.](#using-the-design-system)\n  - [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download-and-install)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](#install-using-npm)** if you are familiar with using `npm` and package management.\n\n### Download and install\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/download/v2.13.1/uswds-2.13.1.zip) from the latest USWDS release and open that file.\n\n   After extracting the zip file you should see the following file and folder structure:\n\n   ```\n   uswds-2.13.1/\n   ├── css/\n   │   ├── uswds.min.css.map\n   │   ├── uswds.min.css\n   │   └── uswds.css\n   ├── fonts/\n   ├── img/\n   ├── js/\n   │   ├── uswds-init.js\n   │   ├── uswds-init.min.js\n   │   ├── uswds-init.min.js.map\n   │   ├── uswds.min.js.map\n   │   ├── uswds.min.js\n   │   └── uswds.js\n   └── scss/\n\n   ```\n\n   The three files critical to any USWDS project are the **stylesheet**, the **library**, and the **intializer**. Any project requires both the stylesheet and library to function properly.\n\n   **Stylesheet:** This is the compiled CSS stylesheet that describes how design system components look. Reference either `uswds.css` or `uswds.min.css` in the `<head>` of your document.\n\n   **Library:** This is the compiled JavaScript that controls component interactivity. Reference either `uswds.js` or `uswds.min.js` at the end of the `<body>` of your document.\n\n   **Initializer:** This small JavaScript file (less than 1 KB minified) helps the browser know if the USWDS JavaScript library is loading properly. This prevents component content from \"flashing\" or \"shifting\" while the page loads. Reference `uswds-init.min.js` in the `<head>` of your page, or inline its contents directly into the `<script>` tag.\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n   ```\n   example-project/\n   ├── assets/\n   │   ├── uswds-2.13.1/\n   │   ├── stylesheets/\n   │   ├── images/\n   │   └── javascript/\n   └── index.html\n   ```\n\n   You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the stylesheet, library, and initializer in each HTML page or dynamic template in your project. We also provide Sass (.scss) files in the zip package which you should use to generate new CSS with project-specific settings. See [Sass and theme settings](#sass-and-theme-settings) for more information.\n\n   Here is an example of how to reference these assets in your `index.html` file:\n\n   ```html\n   <!DOCTYPE html>\n   <html>\n     <head>\n       <meta charset=\"utf-8\" />\n       <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n       <title>My Example Project</title>\n       <script src=\"assets/uswds-2.13.1/js/uswds-init.min.js\"></script>\n       <link rel=\"stylesheet\" href=\"assets/uswds-2.13.1/css/uswds.min.css\" />\n     </head>\n     <body>\n       <script src=\"assets/uswds-2.13.1/js/uswds.min.js\"></script>\n     </body>\n   </html>\n   ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n   - Node v12.13.1 (current LTS), [Installation guides](https://nodejs.org/en/download/)\n\n   **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n   ```shell\n   npm -v\n   6.13.0 # This line may vary depending on what version of Node you've installed.\n   ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n   ```shell\n   npm install --save uswds@latest\n   ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.scss` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import \"uswds-theme-general\";\n@import \"uswds-theme-typography\";\n@import \"uswds-theme-spacing\";\n@import \"uswds-theme-color\";\n@import \"uswds-theme-utilities\";\n@import \"uswds\";\n@import \"uswds-theme-custom-styles\";\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires **autoprefixing** to work properly. This is included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n**Autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings via `.browserslistrc` config:\n\n```\n> 2%\nlast 2 versions\nIE 11\nnot dead\n```\n\n> Note: **media query sorting** is no longer required as of USWDS 2.5.0. We stopped sorting media queries with [csso](https://github.com/css/csso) in USWDS 2.5.1 because it wasn't outputting as expected. While both the minified and unminified CSS files are modestly larger as a result: `268 KB` unsorted vs. `259 KB` sorted, our testing indicates that once the files are compressed server side with gzip, the unsorted CSS is actually smaller: `36 KB` unsorted and gzipped vs. `38 KB` sorted and gzipped. As a result, we recommend that teams do not use media query sorting at this time.\n\nWe recommend using a **minifier** like [csso](https://github.com/css/csso) to compress your final compiled CSS and **sourcemaps** like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download-and-install). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n## CSS architecture\n\n- The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n- The CSS organization and naming conventions follow **[18F’s Front End Guide](https://frontend.18f.gov/css/)**.\n- We format our code with [Prettier](https://prettier.io/), per the formatting section of the **[18F Front End Guide](https://frontend.18f.gov/css/formatting/)**.\n- CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n- Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n- Uses **modular CSS** for scalable, modular, and flexible code.\n- Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n- Hard-coded magic numbers are avoided.\n- Media queries are built **mobile first**.\n- **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://designsystem.digital.gov/design-tokens/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nUSWDS JavaScript is separated into components (just as with the CSS and HTML) and initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files, then built for the browser. The components are not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require(\"./components\");\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class (like `.usa-accordion__button[aria-controls]`) used to link HTML elements with the JavaScript component. When a component is initialized, it searches through the current HTML DOM to find all elements that match the class and initializes the component JavaScript for those elements. The primary methods for each component include:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods based on that component's functionality. Any additional methods are found in that component's JavaScript file.\n\n**If you’re using a modern framework like React or Angular you can import components and initialize them in your library's DOM ready lifecycle event.**\n\nImporting a modular component.\n\n```js\nimport USWDS from \"../node_modules/uswds/src/js/components\";\nconst { characterCount, accordion } = USWDS; // deconstruct your components here\n```\n\nReact hooks example:\n\n```js\nfunction App() {\n  const ref = document.body;\n\n  useEffect(() => {\n    // initialize\n    characterCount.on(ref);\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments\n    accordion.on();\n\n    // remove event listeners when component un-mounts.\n    return () => {\n      characterCount.off();\n      accordion.off();\n    };\n  });\n}\n```\n\nAngular example:\n\n```js\nexport class App implements OnInit {\n  constructor() {\n    this.ref = document.body;\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments\n  }\n\n  ngOnInit() {\n    // initialize\n    characterCount.on(this.ref);\n    accordion.on();\n  }\n\n  // remove event listeners when component un-mounts.\n  ngOnDestroy() {\n    characterCount.off();\n    accordion.off();\n  }\n}\n```\n\n> Those using **Webpack 5** can take advantage of the updated exports field which allows declaration for requests like `import \"uswds\"` or `import accordion from \"uswds/src/js/components/accordion\"`\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settings), above.\n\nSet theme settings with USWDS design tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Design tokens section](https://designsystem.digital.gov/design-tokens/) of USWDS 2.0 documentation for more on the available tokens for [color](https://designsystem.digital.gov/design-tokens/color), [spacing units](https://designsystem.digital.gov/design-tokens/spacing-units), [font size](https://designsystem.digital.gov/design-tokens/typesetting/font-size/), and more.\n\n### Using tokens in theme settings\n\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```scss\n$theme-site-max-width: \"desktop\";\n$theme-site-margins-breakpoint: \"desktop\";\n$theme-site-margins-width: 4;\n$theme-site-margins-mobile-width: 2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```scss\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```scss\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units(\"desktop\");\n\n  @include at-media(\"desktop\") {\n    @include u-padding-x(4);\n  }\n}\n```\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;\n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\n\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n- **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [designsystem.digital.gov/components](https://designsystem.digital.gov/components)\n- **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n- **JS** is located in: `src/js (/components, /utils)`.\n- **Fonts** are located in: `dist/fonts`.\n- **Images** and icons are located in: `dist/img`.\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/). We’re happy to answer questions about accessibility — email us for more information.\n\n## Pattern library\n\nWe're using [Pattern lab](https://patternlab.io/) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action. It will watch for changes in twig, scss, and JS and refresh.\n\n\n### Template compatibility\nWe're using `engine-twig`, which uses Twing, to get rid of the PHP dependency. This means there are a few differences between this Twig engine and the more common PHP engine.\n\n**Key differences**\n\nNamespacing not supported - Use relative paths.\n\n```twig\n❌ {% include \"@components/usa-card/usa-card.twig\" %}\n\n✔ {% include \"./components/usa-card/usa-card.twig\" %}\n```\n\n~~Generated variants with YML *~~\n```\n✔ usa-button-group.twig\n❕ usa-button-group~segmented.yml\n```\n\n~~*Works with patch [`31931c7`](https://github.com/uswds/uswds/commit/31931c7ee1ecf31c54981c1691a047157d458bfb).~~\n\nFixed in @pattern-lab/engine-twig@5.14.3\n\nHTML in YML renders as string\n```yml\n# Given\nitems:\n  - '<button class=\"usa-button\">Map</button>'\n  - '<button class=\"usa-button usa-button--outline\">Satellite</button>'\n  - '<button class=\"usa-button usa-button--outline\">Hybrid</button>'\n```\n\nResults in the markup being output as a string.\n\nWorkarounds available with `autoescape false` and `|raw` filter.\n\n```twig\n<li class=\"usa-button-group__item\">\n  {% autoescape false %}\n    {{ item }}\n  {% endautoescape %}\n</li>\n```\n\n```twig\n{{ domain.text | trim | raw }}\n```\n\n> ⚠ When using the `|raw` filter make sure you use it like so `| trim | raw`. Otherwise you'll get errors due to the whitespace.\n\nGlobal variables don't work as expected\nSetting a variable like `img_path` in `src/styleguide/data/data.yml` renders as empty string in some templates, for example in `usa-nav__primary.twig`.\n\nJust be aware when using macro's and ensure you have a proper fallback value.\n\n## Long-term support of v1.x\n\n[Version 1.x](https://v1.designsystem.digital.gov) is in maintenance mode. We will only make critical updates like security patches.\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n- Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n- U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n- Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n- UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n- Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n- Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"dac00f196689751bd309d7a2bbcdc599956d4c7b","_id":"uswds@3.0.0-beta.3","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-FXu96xk4S1FYw59ziOmzoax1V7ZnWCSW519icOm1bTSGOIdKSzOo2+RW6AXop9TWbAVBtd6Dn4/8H3gIDhuGSg==","shasum":"2e42ac633f0e0541ba6a9e87bc5782388bea265e","tarball":"https://registry.npmjs.org/uswds/-/uswds-3.0.0-beta.3.tgz","fileCount":5691,"unpackedSize":19838958,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiJ49eACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrHOA/6AgXH3VYrKUG4UPIBVOWYzgg+3oP943CQH1yuTq7ookRuiVXz\r\ncOpMduEUdAlSJwdmL54pPMwoyjyAuxOkFtBL1zjhL0Q/yW7lzNYmC4gKN8uF\r\nXNQ7YsfRTdieG2rzmXJntHRm+Sx3wh0dTH/NiTzaEGhYi2P82yxMyc+TwcqR\r\njeR5ATH6v9k7xdkg3xUNy+dbW1v2ubAP0LVNZYNRcGbjy1E3Ehn39R2yezmh\r\nrfbvqRv6I+8KiNSpofkU0QMKe2n/OsbMIxBARcY5iSOWbLgBMQsJK/MRIXP/\r\n9I9XlZQcPgCwcFWiNPIKx+6/r7ur7+d1PFIyRNwddKAS6GcxcA+MiZUBsd9O\r\nFTmHW3oajmpjT2Pe7eGP9RPvwf+QsNaZNIRFjy7p8TJsjtlhuklHJzKNOMyg\r\nMmj8IMlHUmyzEiUB/gto3/febS/hLwgEns/fTvWTzFKioiTyqLORkl9L7tRy\r\nBJZW5rstNE5mIZXt7qiytxpGt9KQh2ZesaFXA63kAmiym5Ma9nMn4TIEsKui\r\nZTOza/wczp7H7qA+weqt0ihNTvw6Sdr6E1kdxv7uJDGT/tapIDPYxxwOCqHo\r\nclT3DBS+w16HcmhPevdWyXXG5X0Utz8cUgFXj9z1Rt/AWLirHS24D5MXt8aO\r\n0Na8CZdmIbQxQeZ7O+37zH4dZMqRPUD9OfI=\r\n=y79U\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCtB82ng5bESlmtNG7ZEID47mLjgSc4VlJoHTTd9c+vtAIhAJ8Hu8n0Rs1TthFb8BR4egctghLVn87AiJgfL52CuBaW"}]},"_npmUser":{"name":"uswds-bot","email":"uswds@gsa.gov"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_3.0.0-beta.3_1646759773914_0.19692168524979814"},"_hasShrinkwrap":false},"2.13.3":{"name":"uswds","version":"2.13.3","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js","./src/fonts/*":"./src/fonts/*","./src/img/*":"./src/img/*","./js/*":"./dist/js/*","./css/*":"./dist/css/*","./scss/*":"./dist/scss/*","./img/*":"./dist/img/*","./fonts/*":"./dist/fonts/*"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","mocha":{"config":"spec/.mocharc.json"},"scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","cover":"nyc --reporter=lcov --config config/nycrc.yml gulp cover","format-tokens":"node ./src/utils/style-format.js --file './src/data/colors' --output './src/stylesheets/core/system-tokens'","federalist":"npm install && gulp build && fractal build","lint":"eslint src/js/**/*.js spec/**/*.js","mocha":"mocha","prepare":"gulp build","preversion":"npm test","release":"gulp release","spec":"npm run mocha -- 'spec/**/*.spec.js'","start":"npm run build && fractal start --sync & npm run watch","test":"snyk test && eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression && npm run test:sass","test:ci":"eslint && gulp typecheck && gulp stylelint && fractal build && gulp test && gulp regression","test:sass":"mocha spec/unit/sass/sass-spec.js","test:unit":"gulp test","test:visual":"node ./spec/visual-regression-tester.js test","test:visual:update":" node ./spec/visual-regression-tester.js test --updateGolden","version":"gulp build release","watch":"NODE_ENV=development nswatch","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:templates":"npx prettier --write './_site/components/render/*.html'"},"watch":{"src/stylesheets/**/*.scss":"build:css","src/js/**/*.js":"build:js"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"1.0.3","domready":"1.0.8","object-assign":"4.1.1","receptor":"1.0.0","resolve-id-refs":"0.1.0"},"devDependencies":{"@18f/identity-stylelint-config":"1.0.0","@babel/preset-env":"7.15.8","@frctl/fractal":"1.5.11","@frctl/nunjucks":"2.0.13","@types/node":"16.11.6","ansi-colors":"4.1.1","autoprefixer":"10.3.7","axe-core":"4.3.4","babelify":"10.0.0","browserify":"17.0.0","chrome-launcher":"0.15.0","chrome-remote-interface":"0.31.0","cross-spawn":"7.0.3","del":"6.0.0","eslint":"8.4.1","eslint-config-airbnb-base":"15.0.0","eslint-config-prettier":"8.3.0","eslint-plugin-import":"2.25.2","eslint-plugin-no-unsanitized":"4.0.1","fancy-log":"1.3.3","gulp":"4.0.2","gulp-changed":"4.0.3","gulp-clean":"0.4.0","gulp-cli":"2.3.0","gulp-dart-scss":"1.1.0","gulp-filter":"7.0.0","gulp-postcss":"9.0.1","gulp-rename":"2.0.0","gulp-replace":"1.1.1","gulp-sourcemaps":"3.0.0","gulp-spawn-mocha":"6.0.0","gulp-svg-sprite":"1.5.0","gulp-uglify":"3.0.2","handlebars":"4.7.7","handlebars-helpers":"0.10.0","jsdom":"19.0.0","jsdom-global":"3.0.2","merge-stream":"2.0.0","mocha":"6.2.3","mq-polyfill":"1.1.8","node-notifier":"10.0.0","normalize.css":"8.0.1","nswatch":"0.2.0","nyc":"15.1.0","postcss":"8.3.11","postcss-csso":"6.0.0","postcss-discard-comments":"5.0.1","prettier":"2.4.1","resemblejs":"4.0.0","sass":"1.43.4","sass-true":"6.0.1","sinon":"12.0.1","snyk":"1.746.0","stylelint":"14.1.0","typescript":"4.4.4","vinyl-buffer":"1.0.1","vinyl-source-stream":"2.0.0","yargs":"17.2.1"},"gitHead":"974f976c85e06c37ca9641b68f308864136bc3f9","_id":"uswds@2.13.3","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-qCblljeaRvS3+PrSxoHqQwmMnp746+Y1YZA34BkTzJknvo2bhhdzGE21yJaInumzIqV3glLD13TFdRwrwikMMQ==","shasum":"f2a0623b496941ff30ad3a0ea1610407d35a6b14","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.13.3.tgz","fileCount":5071,"unpackedSize":19118553,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHuCOoOoGukmF3FiPqip1K4tReWpjuiy8dk0pr5gidJYAiBQlxd620YOzwelQ1mPM7lbD6iYbM+XomUyzCgn799Klg=="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiVKIWACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmozxhAAkpRfa1fZRY33ifi22BVbChZ8sEUExuVW8Nn4p5KeRSa5QnUh\r\nUplja8d/bCKL7PKUalZsujYS3BLl1mxFveVIa6jCcYgUaes10ioUlQOT3id9\r\n89OFb8WPKCLE0KV0sm0Ze1eilKggAeyZTov0T1H1DXHOdGuV1hfnUJBGFisV\r\nCY0484PvhvQ9zMuImU8TsvStGLbkKygXMlK1EQOOsMggOQm77gUoGCj4OA6G\r\nuC03tDoPCyNlJIdfQPl0dtoGFlyYTDH/of0RcQ+spLHiWHrMPIUyjXEfa4tn\r\nQaJF4bqihVSjASQeyXGgoZXCNVCMEwo7pqr7+SlUJsNv3L7IEBGEzA/3jh9K\r\nvbDOenqx6WngvGQfjNVQREQwgVm5ugeAwTRb0sxr2zO+OAFNyateSzSjzM0c\r\naiER7N1vcmubdfaRmWOZGYzNDz57EbvwSXIG1No7qj1mJDbhj0TEKdc3JSZU\r\nCaXm5K7Wn/2VzLhgiR06ye5tpxhjIGmUNgMHb4HYMogR0cuInhvwpVPVL0F3\r\n9uXalWllLGEfzVqYZicggbPBw0n5/hVL/Ph6oJCexV3IilvidK30kFFi5+bn\r\nM4k8NzW9U/bHv2qfcep6UvmaJKXA/X1uG0tJlKhU1Kj6PR6B3/IPA8vsTezQ\r\nCUS/JGXdVZLmh/YgDo7e3eRjDhNJJ0Og90I=\r\n=Bgnm\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.13.3_1649713685913_0.8422394273654006"},"_hasShrinkwrap":false},"2.14.0":{"name":"uswds","version":"2.14.0","description":"Open source UI components and visual style guide for U.S. government websites","engines":{"node":">= 4"},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"],"module":"./dist/js/uswds.min.js","exports":{".":{"import":"./dist/js/uswds.min.js","default":"./dist/js/uswds.min.js"},"./src/js/components":"./src/js/components/index.js","./src/js/components/*":"./src/js/components/*.js","./src/fonts/*":"./src/fonts/*","./src/img/*":"./src/img/*","./js/*":"./dist/js/*","./css/*":"./dist/css/*","./scss/*":"./dist/scss/*","./img/*":"./dist/img/*","./fonts/*":"./dist/fonts/*"},"types":"./index.d.ts","main":"dist/js/uswds.min.js","jsnext:main":"src/js/start.js","style":"dist/css/uswds.min.css","sass":"src/stylesheets/uswds.scss","scripts":{"build":"gulp build","build:css":"gulp sass","build:js":"gulp javascript","federalist":"npm install && gulp build","lint":"eslint src/js/**/*.js","prepare":"gulp build","release":"gulp release","start":"npm run build","test":"snyk test && eslint && gulp typecheck && gulp stylelint","test:ci":"eslint && gulp typecheck && gulp stylelint","version":"gulp build release","prettier:scss":"npx prettier --write ./src/stylesheets/**/*.scss","prettier:templates":"npx prettier --write './_site/components/render/*.html'"},"repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"author":{"name":"18F"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"license":"SEE LICENSE IN LICENSE.md","bugs":{"url":"https://github.com/uswds/uswds/issues"},"homepage":"https://github.com/uswds/uswds#readme","dependencies":{"classlist-polyfill":"1.2.0","domready":"1.0.8","object-assign":"4.1.1","receptor":"1.0.0","resolve-id-refs":"0.1.0"},"devDependencies":{"@18f/identity-stylelint-config":"1.0.0","@babel/preset-env":"7.20.2","@types/node":"18.15.5","ansi-colors":"4.1.3","autoprefixer":"10.4.14","babelify":"10.0.0","browserify":"17.0.0","cross-spawn":"7.0.3","del":"6.0.0","eslint":"8.36.0","eslint-config-airbnb-base":"15.0.0","eslint-config-prettier":"8.8.0","eslint-plugin-import":"2.27.5","eslint-plugin-no-unsanitized":"4.0.2","fancy-log":"1.3.3","gulp":"4.0.2","gulp-changed":"4.0.3","gulp-clean":"0.4.0","gulp-cli":"2.3.0","gulp-dart-scss":"1.1.0","gulp-filter":"7.0.0","gulp-postcss":"9.0.1","gulp-rename":"2.0.0","gulp-replace":"1.1.4","gulp-sourcemaps":"3.0.0","gulp-uglify":"3.0.2","merge-stream":"2.0.0","mq-polyfill":"1.1.8","node-notifier":"10.0.1","normalize.css":"8.0.1","postcss":"8.4.21","postcss-csso":"6.0.1","postcss-discard-comments":"5.1.2","prettier":"2.8.6","sass":"1.59.3","snyk":"1.1123.0","stylelint":"14.9.1","typescript":"5.0.2","vinyl-buffer":"1.0.1","vinyl-source-stream":"2.0.0"},"overrides":{"glob-parent":"6.0.2"},"readme":"# United States Web Design System\n\n## :mega: **USWDS 3.0 is now live** :mega:\n\nStarting with USWDS 3.0, we're publishing USWDS as a scoped package at [@uswds/uswds](https://www.npmjs.com/package/@uswds/uswds).\n\nThis unscoped `uswds` package for USWDS 2.x. is in maintenance mode and will only receive security updates.\n\n---\n\nThe [United States Web Design System](https://designsystem.digital.gov) includes a library of open source UI components and a visual style guide for U.S. federal government websites.\n\nThis repository is for the design system code itself. We maintain [another repository for the documentation and website](https://github.com/uswds/uswds-site). To see the design system and its documentation on the web, visit [https://designsystem.digital.gov](https://designsystem.digital.gov).\n\n## Contents\n\n- [United States Web Design System](#united-states-web-design-system)\n  - [:mega: **USWDS 3.0 is now live** :mega:](#mega-uswds-30-is-now-live-mega)\n  - [Contents](#contents)\n  - [Background](#background)\n  - [Recent updates](#recent-updates)\n  - [Getting started](#getting-started)\n  - [Using the design system](#using-the-design-system)\n    - [Download and install without `npm`](#download-and-install-without-npm)\n    - [Install using npm](#install-using-npm)\n      - [Using the USWDS package](#using-the-uswds-package)\n      - [Sass and theme settings](#sass-and-theme-settings)\n      - [Sass compilation requirements](#sass-compilation-requirements)\n      - [JavaScript](#javascript)\n    - [Use another framework or package manager](#use-another-framework-or-package-manager)\n  - [CSS architecture](#css-architecture)\n  - [JS customization](#js-customization)\n  - [Customization, theming, and tokens](#customization-theming-and-tokens)\n    - [Using tokens in theme settings](#using-tokens-in-theme-settings)\n    - [Set the base asset paths (fonts and images)](#set-the-base-asset-paths-fonts-and-images)\n  - [Where things live](#where-things-live)\n  - [Browser support](#browser-support)\n  - [Accessibility](#accessibility)\n  - [Fractal](#fractal)\n    - [Template compatibility](#template-compatibility)\n  - [Long-term support of v1.x](#long-term-support-of-v1x)\n  - [Need installation help?](#need-installation-help)\n  - [Contributing to the code base](#contributing-to-the-code-base)\n  - [Reuse of open-source style guides](#reuse-of-open-source-style-guides)\n  - [Licenses and attribution](#licenses-and-attribution)\n  - [Contributing](#contributing)\n\n## Background\n\nUSWDS's components and style guide follow industry-standard accessibility guidelines and use the best practices of existing style libraries and modern web design. The [U.S. Digital Service](https://www.usds.gov/) and [18F](https://18f.gsa.gov/) created USWDS for designers and developers. USWDS is a project of GSA’s [Technology Transformation Service](https://www.gsa.gov/about-us/organization/federal-acquisition-service/technology-transformation-services), maintained by the Office of Products and Programs. It is designed for use by government product teams who want to create beautiful, easy-to-use online experiences for the public. To learn more about the project, check out this [blog post](https://18f.gsa.gov/2015/09/28/web-design-standards/), and to view websites and applications, check out our list [here](docs/WHO_IS_USING_USWDS.md).\n\n## Recent updates\n\nInformation about the most recent release of the design system can always be found in the [release history](https://github.com/uswds/uswds/releases). We include details about significant updates and any backward-incompatible changes along with a list of all changes.\n\n## Getting started\n\nWe’re glad you’d like to use the design system — here’s how you can get started:\n\n- Designers: Check out our [Getting started for designers information](https://designsystem.digital.gov/documentation/getting-started-for-designers/).\n- Developers: Follow the guidance on our website to [get started with `npm` (recommended)](https://designsystem.digital.gov/documentation/getting-started-for-developers/). Follow the instructions in this README to [get started without `npm`.](#using-the-design-system)\n  - [CSS, JavaScript, image, and font files of all the assets on this site are available for download](https://github.com/uswds/uswds/releases/latest).\n\n## Using the design system\n\nHow you implement the design system depends on the needs of your project and your workstyle. We recommend implementing the design system with `npm`, but we also provide a direct download if `npm` will not work for you or your project.\n\n- **[Download the design system](#download-and-install-without-npm)** if you are not familiar with `npm` and package management.\n\n- **[Use the design system `npm` package](https://designsystem.digital.gov/documentation/getting-started-for-developers/)** if you are familiar with using `npm` and package management.\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n### Download and install without `npm`\nIf you’re using a framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the steps outlined in this section. Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\n1. Download the [USWDS zip file](https://github.com/uswds/uswds/releases/download/v2.14.0/uswds-2.14.0.zip) from the latest USWDS release and open that file.\n\n   After extracting the zip file you should see the following file and folder structure:\n\n   ```\n   uswds-2.14.0/\n   ├── css/\n   │   ├── uswds.min.css.map\n   │   ├── uswds.min.css\n   │   └── uswds.css\n   ├── fonts/\n   ├── img/\n   ├── js/\n   │   ├── uswds-init.js\n   │   ├── uswds-init.min.js\n   │   ├── uswds-init.min.js.map\n   │   ├── uswds.min.js.map\n   │   ├── uswds.min.js\n   │   └── uswds.js\n   └── scss/\n\n   ```\n\n   The three files critical to any USWDS project are the **stylesheet**, the **library**, and the **intializer**. Any project requires both the stylesheet and library to function properly.\n\n   **Stylesheet:** This is the compiled CSS stylesheet that describes how design system components look. Reference either `uswds.css` or `uswds.min.css` in the `<head>` of your document.\n\n   **Library:** This is the compiled JavaScript that controls component interactivity. Reference either `uswds.js` or `uswds.min.js` at the end of the `<body>` of your document.\n\n   **Initializer:** This small JavaScript file (less than 1 KB minified) helps the browser know if the USWDS JavaScript library is loading properly. This prevents component content from \"flashing\" or \"shifting\" while the page loads. Reference `uswds-init.min.js` in the `<head>` of your page, or inline its contents directly into the `<script>` tag.\n\n2. Copy these files and folders into a relevant place in your project's code base. Here is an example structure for how this might look:\n\n   ```\n   example-project/\n   ├── assets/\n   │   ├── uswds-2.14.0/\n   │   ├── stylesheets/\n   │   ├── images/\n   │   └── javascript/\n   └── index.html\n   ```\n\n   You'll notice in our example above that we also outline a `stylesheets`, `images` and `javascript` folder in your `assets` folder. These folders are to help organize any assets that are unique to your project and separate from the design system assets.\n\n3. Reference the stylesheet, library, and initializer in each HTML page or dynamic template in your project. We also provide Sass (.scss) files in the zip package which you should use to generate new CSS with project-specific settings. See [Sass and theme settings](#sass-and-theme-settings) for more information.\n\n   Here is an example of how to reference these assets in your `index.html` file:\n\n   ```html\n   <!DOCTYPE html>\n   <html>\n     <head>\n       <meta charset=\"utf-8\" />\n       <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n       <title>My Example Project</title>\n       <script src=\"assets/uswds-2.14.0/js/uswds-init.min.js\"></script>\n       <link rel=\"stylesheet\" href=\"assets/uswds-2.14.0/css/uswds.min.css\" />\n     </head>\n     <body>\n       <script src=\"assets/uswds-2.14.0/js/uswds.min.js\"></script>\n     </body>\n   </html>\n   ```\n\nWe offer both the CSS and the JavaScript in two versions — minified and un-minified. (In the examples above, we are using the minified files.) Use the minified files in a production environment or to reduce the file size of your downloaded assets. Use the un-minified files if you are in a development environment or would like to debug the CSS or JavaScript assets in the browser.\n\nAnd that’s it — you should now be able to copy our code samples into your `index.html` and start using the design system.\n\n### Install using npm\n\n`npm` is a package manager for Node-based projects. USWDS maintains a [`uswds` package](https://www.npmjs.com/package/uswds) that includes both the pre-compiled and compiled files — just like the direct download. `npm` packages make it easy to update and install the design system from the command line.\n\n1. Install `Node/npm`. Below is a link to find the install method that coincides with your operating system:\n\n   - Node v12.13.2 (current LTS), [Installation guides](https://nodejs.org/en/download/)\n\n   **Note for Windows users:** If you are using Windows and are unfamiliar with `Node` or `npm`, we recommend following [Team Treehouse's tutorial](http://blog.teamtreehouse.com/install-node-js-npm-windows) for more information.\n\n2. Make sure you have installed it correctly:\n\n   ```shell\n   npm -v\n   6.13.0 # This line may vary depending on what version of Node you've installed.\n   ```\n\n3. Create a `package.json` file. You can do this manually, but an easier method is to use the `npm init` command. This command will prompt you with a few questions to create your `package.json` file.\n\n4. Add `uswds` to your project’s `package.json`:\n\n   ```shell\n   npm install --save uswds@latest\n   ```\n\nThe `uswds` module is now installed as a dependency. You can use the un-compiled files found in the `node_modules/uswds/dist/` directory.\n\n```\nnode_modules/uswds/\n├── dist/\n│   ├── css/\n│   ├── fonts/\n│   ├── img/\n│   ├── js/\n│   └── scss/\n```\n\n**Note:** We do _not_ recommend directly editing the design system files in `node_modules`. One of the benefits of using a package manager is its ease of upgrade and installation. If you make customizations to the files in the package, any upgrade or re-installation will wipe them out.\n\n#### Using the USWDS package\n\nIf you want to take full advantage of USWDS custom settings and add build new styles and components with the USWDS toolset, you'll need a way to access the assets in the USWDS package and compile custom CSS from the USWDS source files.\n\nUSWDS uses the task manager [Gulp](http://gulpjs.com/) as a way to add USWDS assets to a project and compile our CSS from the package source. Gulp is a useful and powerful tool, but it can be difficult to set up if you are new to it.\n\nThe [`uswds-gulp` repo](https://github.com/uswds/uswds-gulp) is made for developers new to Gulp or those who just want a simple setup to get started quickly. The repo contains files and instructions for installing Gulp 4.0 in your project, initializing USWDS, and compiling CSS from the source files.\n\n#### Sass and theme settings\n\nThe design system is customizable using the power of [Sass (Syntactically Awesome Style Sheets)](http://sass-lang.com/). The critical files you'll need in your project are those in `dist/scss/theme`:\n\n```\nscss\n├── components/\n├── core/\n├── elements/\n├── lib/\n├── packages/\n├── settings/\n├── theme/\n│   ├── _uswds-theme-color.scss\n│   ├── _uswds-theme-components.scss\n│   ├── _uswds-theme-custom-styles.scss\n│   ├── _uswds-theme-general.scss\n│   ├── _uswds-theme-spacing.scss\n│   ├── _uswds-theme-typography.scss\n│   ├── _uswds-theme-utilities.scss\n│   ├── styles.scss\n```\n\n- `_uswds-theme-color.scss`: theme color settings\n- `_uswds-theme-components.scss`: theme component settings\n- `_uswds-theme-custom-styles.scss`: additional project CSS for customizing or adding to what USWDS provides\n- `_uswds-theme-general.scss`: General theme settings\n- `_uswds-theme-spacing.scss`: Theme spacing settings\n- `_uswds-theme-typography.scss`: Theme typography settings\n- `_uswds-theme-utilities.scss`: Utility class output settings\n- `styles.scss`: The primary Sass file that you'll compile. It collects theme settings, USWDS source files, and custom CSS\n\n`styles.scss` looks something like the following code. It adds all the project theme settings, then adds USWDS source, and finally adds your project's custom styles:\n\n```scss\n@import \"uswds-theme-general\";\n@import \"uswds-theme-typography\";\n@import \"uswds-theme-spacing\";\n@import \"uswds-theme-color\";\n@import \"uswds-theme-utilities\";\n@import \"uswds\";\n@import \"uswds-theme-custom-styles\";\n```\n\n**Technical note:** The `@import 'uswds'` statement above needs to reference the `uswds.scss` file in `node_modules/uswds/dist/scss`. The gulpfile in [`uswds-gulp`](https://github.com/uswds/uswds-gulp) is set up to do this automatically, using `gulp-sass` and `includePaths`.\n\n#### Sass compilation requirements\n\nThe design system requires **autoprefixing** to work properly. This is included in the [`uswds-gulp`](https://github.com/uswds/uswds-gulp) package.\n\n**Autoprefixing** uses a service like [gulp-autoprefixer](https://github.com/sindresorhus/gulp-autoprefixer) to automatically add vendor prefixes to the precompiled stylesheets. Don't add vendor prefixes to your custom styles manually — it is more reliable to use autoprefixing. We use the following autoprefixer settings via `.browserslistrc` config:\n\n```\n> 2%\nlast 2 versions\nIE 11\nnot dead\n```\n\n> Note: **media query sorting** is no longer required as of USWDS 2.5.0. We stopped sorting media queries with [csso](https://github.com/css/csso) in USWDS 2.5.1 because it wasn't outputting as expected. While both the minified and unminified CSS files are modestly larger as a result: `268 KB` unsorted vs. `259 KB` sorted, our testing indicates that once the files are compressed server side with gzip, the unsorted CSS is actually smaller: `36 KB` unsorted and gzipped vs. `38 KB` sorted and gzipped. As a result, we recommend that teams do not use media query sorting at this time.\n\nWe recommend using a **minifier** like [csso](https://github.com/css/csso) to compress your final compiled CSS and **sourcemaps** like [`gulp-sourcemaps`](https://www.npmjs.com/package/gulp-sourcemaps) to keep track of the location of all the source Sass for easier debugging.\n\n#### JavaScript\n\n`require('uswds')` will load all of USWDS’s JavaScript onto the page. Add this line to whatever initializer you use to load JavaScript into your application.\n\n### Use another framework or package manager\n\nIf you’re using another framework or package manager that doesn’t support `npm`, you can find the source files in this repository and use them in your project. Otherwise, we recommend that you follow the [download instructions](#download-and-install). Please note that the core team [isn’t responsible for all frameworks’ implementations](https://github.com/uswds/uswds/issues/877).\n\nIf you’re interested in maintaining a package that helps us distribute USWDS, the project’s build system can help you create distribution bundles to use in your project. Please read our [contributing guidelines](CONTRIBUTING.md#building-the-project-locally-with--gulp-) to locally build distributions for your framework or package manager.\n\n## CSS architecture\n\n- The CSS foundation of this site is built with the **[Sass](https://sass-lang.com)** preprocessor language.\n- The CSS organization and naming conventions follow **[18F’s Front End Guide](https://frontend.18f.gov/css/)**.\n- We format our code with [Prettier](https://prettier.io/), per the formatting section of the **[18F Front End Guide](https://frontend.18f.gov/css/formatting/)**.\n- CSS selectors are **prefixed** with `usa` (For example: `.usa-button`). This identifier helps the design system avoid conflicts with other styles on a site which are not part of USWDS.\n- Uses a **[BEM](http://getbem.com/)** approach for naming CSS selectors. Blocks are separated from elements with two underscores (`__`). Multi-word blocks use single hyphens instead of spaces. Modifier classes are additive — proper markup requires the base class _and_ the modifier class or classes. Modifier classes consist of the base class plus a modifier suffix, separated by two hyphens (`--`) as in `.usa-button.usa-button--secondary` or `usa-accordion.usa-accordion--bordered`.\n- Uses **modular CSS** for scalable, modular, and flexible code.\n- Uses **nesting** when appropriate. Nest minimally with up to two levels of nesting.\n- Hard-coded magic numbers are avoided.\n- Media queries are built **mobile first**.\n- **Spacing units** are set with the `units()` function as described in [the USWDS 2.0 documentation](https://designsystem.digital.gov/design-tokens/spacing-units/). In general, we use spacing in multiples of `8px` — expressed as a multiple in `units([multiple])`. For instance `units(2)` is the equivalent of `2 * 8px` or `16px`. In the final, compiled CSS, this value will be expressed in rem, as a multiple of the base font size set with `$theme-base-font-size`.\n\n**For more information, visit:**\n[18F’s CSS Front End Guide](https://frontend.18f.gov/css/)\n\n## JS customization\n\n**Unfortunately, customizing the JavaScript for the USWDS currently requires NodeJS and a module bundler like Browserify or Webpack. We apologize for this inconvenience, and are working to resolve it in a future release of the design system.**\n\nUSWDS JavaScript is separated into components (just as with the CSS and HTML) and initialized with event handlers when the DOM is ready. These components are accessible as CommonJS modules that can be required in other JavaScript files, then built for the browser. The components are not accessible in the global browser scope, but can be extended to be included by requiring `components` and setting it to a global scope:\n\n```js\nwindow.uswds = require(\"./components\");\n```\n\nEach component has a standardized interface that can be used to extend it further. The components store a HTML class (like `.usa-accordion__button[aria-controls]`) used to link HTML elements with the JavaScript component. When a component is initialized, it searches through the current HTML DOM to find all elements that match the class and initializes the component JavaScript for those elements. The primary methods for each component include:\n\n- `on`: Initialize a component's JavaScript behavior by passing the root element, such as `window.document`.\n- `off`: The opposite of `on`, de-initializes a component, removing any JavaScript event handlers on the component.\n- `hide`: Hide the whole component.\n- `show`: Shows a whole, hidden component.\n- `toggle`: Toggles the visibility of a component on and off based on the previous state.\n\nSome components have additional methods based on that component's functionality. Any additional methods are found in that component's JavaScript file.\n\n**If you’re using a modern framework like React or Angular you can import components and initialize them in your library's DOM ready lifecycle event.**\n\nImporting a modular component.\n\n```js\nimport USWDS from \"../node_modules/uswds/src/js/components\";\nconst { characterCount, accordion } = USWDS; // deconstruct your components here\n```\n\nReact hooks example:\n\n```js\nfunction App() {\n  const ref = document.body;\n\n  useEffect(() => {\n    // initialize\n    characterCount.on(ref);\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments\n    accordion.on();\n\n    // remove event listeners when component un-mounts.\n    return () => {\n      characterCount.off();\n      accordion.off();\n    };\n  });\n}\n```\n\nAngular example:\n\n```js\nexport class App implements OnInit {\n  constructor() {\n    this.ref = document.body;\n    // default ref is document.body, if you want to use\n    // default you do not have to pass arguments\n  }\n\n  ngOnInit() {\n    // initialize\n    characterCount.on(this.ref);\n    accordion.on();\n  }\n\n  // remove event listeners when component un-mounts.\n  ngOnDestroy() {\n    characterCount.off();\n    accordion.off();\n  }\n}\n```\n\n> Those using **Webpack 5** can take advantage of the updated exports field which allows declaration for requests like `import \"uswds\"` or `import accordion from \"uswds/src/js/components/accordion\"`\n\n## Customization, theming, and tokens\n\nUSWDS 2.0 provides extensive support for theming via its theme settings files introduced in [Sass and theme settings](#sass-and-theme-settings), above.\n\nSet theme settings with USWDS design tokens, not with values directly. They tend to be quoted strings like `'desktop'` or `'md'` or unitless numbers like `2` or `-1.5`. Tokens are the values _passed into_ the USWDS functions and mixins that parse them. They are the _keys_ that, through the mechanism of a function or mixin, unlock a _value_ — they are not the values themselves.\n\nVisit the [Design tokens section](https://designsystem.digital.gov/design-tokens/) of USWDS 2.0 documentation for more on the available tokens for [color](https://designsystem.digital.gov/design-tokens/color), [spacing units](https://designsystem.digital.gov/design-tokens/spacing-units), [font size](https://designsystem.digital.gov/design-tokens/typesetting/font-size/), and more.\n\n### Using tokens in theme settings\n\nThe following is an example of theme settings from `_uswds-theme-spacing.scss`:\n\n```scss\n$theme-site-max-width: \"desktop\";\n$theme-site-margins-breakpoint: \"desktop\";\n$theme-site-margins-width: 4;\n$theme-site-margins-mobile-width: 2;\n```\n\nThe USWDS uses those tokens to build component styles:\n\n```scss\n.usa-example {\n  @include u-padding-x($theme-site-margins-mobile-width);\n  max-width: units($theme-site-max-width);\n\n  @include at-media($theme-site-margins-breakpoint) {\n    @include u-padding-x($theme-site-margins-width);\n  }\n}\n```\n\nThis is the functional equivalent of:\n\n```scss\n.usa-example {\n  @include u-padding-x(2);\n  max-width: units(\"desktop\");\n\n  @include at-media(\"desktop\") {\n    @include u-padding-x(4);\n  }\n}\n```\n\nWhich, if `$theme-respect-user-font-size` is set to `true` would output something like:\n\n```css\n.usa-example {\n  padding-left: 1rem;\n  padding-right: 1rem;\n  max-width: 64rem;\n}\n\n@media screen and (min-width: 64em) {\n  .usa-example {\n    padding-left: 2rem;\n    padding-right: 2rem;\n  }\n}\n```\n\nIn general, USWDS sets **variables** with **tokens**, and passes those variables into **functions and mixins** in the source Sass.\n\n### Set the base asset paths (fonts and images)\n\nThe values of `$theme-font-path` and `$theme-image-path` will be appended to USWDS font paths and image paths, respectively:\n\n```\n$theme-font-path:   '../fonts';\n$theme-image-path:  '../img';\n```\n\n## Where things live\n\n- **HTML** markup for the components is located in: `src/components` in the site root. These, however, are written in the templating language Nunjucks. It's best to get HTML source markup directly from [designsystem.digital.gov/components](https://designsystem.digital.gov/components)\n- **Sass** stylesheets are located in: `dist/scss/ (/core, /elements, /components)`. **Compiled CSS** is located in the [downloadable zip file](https://github.com/uswds/uswds/releases/latest).\n- **JS** is located in: `src/js (/components, /utils)`.\n- **Fonts** are located in: `dist/fonts`.\n- **Images** and icons are located in: `dist/img`.\n\n## Browser support\n\nWe’ve designed the design system to support older and newer browsers through [progressive enhancement](https://en.wikipedia.org/wiki/Progressive_enhancement). The current major version of the design system (2.0) follows the [2% rule](https://gds.blog.gov.uk/2012/01/25/support-for-browsers/): we officially support any browser above 2% usage as observed by [analytics.usa.gov](https://analytics.usa.gov/). Currently, this means that the design system version 2.0 supports the newest versions of Chrome, Firefox, Safari, and Internet Explorer 11 and up.\n\n## Accessibility\n\nThe design system also meets the [WCAG 2.0 AA accessibility guidelines](https://www.w3.org/TR/WCAG20/) and conforms to the standards of [Section 508 of the Rehabilitation Act](http://www.section508.gov/).\n\nWe use the following tools to ensure USWDS is accessible:\n- [ANDI](https://www.ssa.gov/accessibility/andi/help/install.html).\n- [Axe core](https://www.deque.com/axe/).\n- [Axe dev tools](https://chrome.google.com/webstore/detail/axe-devtools-web-accessib/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US).\n\nWe’re happy to answer questions about accessibility — email us for more information.\n\n## Fractal\n\nWe're using [Fractal](http://fractal.build) to generate an interactive component library for the design system. You can run it locally after `npm install` with:\n\n```sh\nnpm start\n```\n\nThen, visit [http://localhost:3000/](http://localhost:3000/) to see the design system in action.\n\n_**Optional**: To re-build when code changes are made, run the following command from the project directory in a separate terminal window:_\n\n```sh\nnpm run watch\n```\n\n### Template compatibility\n\nMany of our Fractal view templates are compatible with [Nunjucks](https://mozilla.github.io/nunjucks/) (for JavaScript/Node), [Jinja](http://jinja.pocoo.org/docs/2.9/) (Python), and [Twig](https://twig.symfony.com/) (PHP) out of the box. Components that reference other components use a Fractal-specific `{% render %}` tag that will either need to be implemented in other environments or replaced with the appropriate `{% include %}` tags.\n\n## Long-term support of v1.x\n\n[Version 1.x](https://v1.designsystem.digital.gov) is in maintenance mode. We will only make critical updates like security patches.\n\n## Need installation help?\n\nDo you have questions or need help with setup? Did you run into any weird errors while following these instructions? Feel free to open an issue here:\n\n[https://github.com/uswds/uswds/issues](https://github.com/uswds/uswds/issues).\n\nYou can also email us directly at uswds@gsa.gov.\n\n## Contributing to the code base\n\nFor complete instructions on how to contribute code, please read [CONTRIBUTING.md](CONTRIBUTING.md). These instructions also include guidance on how to set up your own copy of the design system style guide website for development.\n\nIf you would like to learn more about our workflow process, check out the [Workflow](https://github.com/uswds/uswds/wiki/Workflow) and [Issue label Glossary](https://github.com/uswds/uswds/wiki/Issue-label-glossary) pages on the wiki.\n\nIf you have questions or concerns about our contributing workflow, please contact us by [filing a GitHub issue](https://github.com/uswds/uswds/issues) or [emailing our team](mailto:uswebdesignstandards@gsa.gov).\n\n## Reuse of open-source style guides\n\nMuch of the guidance in USWDS leans on open source designs, code, and patterns from other civic and government organizations, including:\n\n- Consumer Financial Protection Bureau’s [Design Manual](https://cfpb.github.io/design-manual/)\n- U.S. Patent and Trademark Office’s [Design Patterns](http://uspto.github.io/designpatterns/)\n- Healthcare.gov [Style Guide](http://styleguide.healthcare.gov/)\n- UK’s Government Digital Service’s [UI Elements](http://govuk-elements.herokuapp.com/)\n- Code for America’s Chime [Styleguide](https://github.com/chimecms/chime-starter)\n- Pivotal Labs [Component Library](http://styleguide.cfapps.io/)\n\n## Licenses and attribution\n\nA few parts of this project are not in the public domain. Attribution and licensing information for those parts are described in detail in [LICENSE.md](LICENSE.md).\n\nThe rest of this project is in the worldwide public domain, released under the [CC0 1.0 Universal public domain dedication](https://creativecommons.org/publicdomain/zero/1.0/).\n\n## Contributing\n\nAll contributions to this project will be released under the CC0 dedication alongside the public domain portions of this project. For more information, see [CONTRIBUTING.md](CONTRIBUTING.md).\n","readmeFilename":"README.md","gitHead":"41fb7c8c54689c071249b2f9859d6c4fda011d40","_id":"uswds@2.14.0","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-r5ebL3av9jOPcbXTxKnGiT5k5NVIAWmtYcO8LeJkA5Svh2qc90YRhzCUWbz9TbGdXJriMCPb7whiULPDxmRhxg==","shasum":"f7861aec6512b38d8c6ec70f1e01b3590cdbd914","tarball":"https://registry.npmjs.org/uswds/-/uswds-2.14.0.tgz","fileCount":5068,"unpackedSize":19025643,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQC4DpgauopaxWszKV0G9OmyNoof8T7m5i1tJrHSerm/+AIhALLgfRAa2W2j0Wt1iFXkdC7A+VPG398QPqzRJpT/CTml"}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJkMI0YACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmpYrQ//SBNepiDT5JIwnySOpdw7mvYNmPoMfdUBkn68x7u47KhrzNeU\r\n566r20Gb/Lv+lZwfd9o8gj7o8l85KxMXAyxfBtzPLv+U78rx8T1j7wrVP4K3\r\nZxqwv6kx99KrBRxr5UhlX37bYbjwrNZTHM3q9TLYFBi1o/9WyXtJ7HxRXBZz\r\nYeu3sTFaMiPYRgk7hhM3I5YHFKYHdCKy3QKqDHO7gAw3X8xtK6eIuKNKc135\r\nnu/PbqQjik4k+RlMtsz3yS0rf7T765mnGsm0QJw2gffoMMkM9GJ9q7eqGrc1\r\nBr3uEpSQi0S281bG8JDqLN+JdzLsp2MIdCXPrCnlZ3fIkidyrmSeVwQD9YQv\r\n+nwrumiKNhaTIODKC4Ldj6Fie/tR51cBWMPNyvzxroL7jRVmgY7/yRefZrpq\r\nM/dug1xxzR0I/LqyZeFGb2LnbQUUn3jx8MFgvropn6jIUXDLnpbfEYpeqP6q\r\neUPHqPuqOQn5cOZhC6QPXkMFZLrmri4euRAMIVz6JhzmStGfMyr/onNahwdx\r\nwp927tAW71DNDCbizFYcazpmsTdAWiOuQ1z4nlNSEroyNjfCAzVzEE0GLT3x\r\ntov7ZFkddxRG1yc+OwWFSWykv75eAywUfwdnS2wXgLAnutaCEIFmWp7Z+9va\r\nX1NtZXIfhHMBlhvRSItwPG/M+U+ETOKNrUs=\r\n=xLky\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"thisisdano","email":"dan.o.williams@gmail.com"},"directories":{},"maintainers":[{"name":"18f-devops","email":"devops@gsa.gov"},{"name":"thisisdano","email":"dan.o.williams@gmail.com"},{"name":"uswds-bot","email":"uswds@gsa.gov"},{"name":"afeijoo","email":"ammie.farrajfeijoo@gsa.gov"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/uswds_2.14.0_1680903448075_0.261815025107353"},"_hasShrinkwrap":false}},"homepage":"https://github.com/uswds/uswds#readme","repository":{"type":"git","url":"git+https://github.com/uswds/uswds.git"},"contributors":[{"name":"Shawn Allen","email":"shawn.allen@gsa.gov"},{"name":"Maya Benari","email":"maya.ben-ari@gsa.gov"},{"name":"Adam Biagianti","email":"adam.biagianti@gsa.gov"},{"name":"John Donmoyer","email":"john.donmoyer@gsa.gov"},{"name":"Julia Elman","email":"julia.elman@gsa.gov"},{"name":"Brian Hurst","email":"brian.hurst@gsa.gov"},{"name":"Jeremia Kimelman","email":"jeremia.kimelman@gsa.gov"},{"name":"Roger Steve Ruiz","email":"roger.ruiz@gsa.gov"},{"name":"Marco Segreto","email":"marco.segreto@gsa.gov"},{"name":"Atul Varma","email":"atul.varma@gsa.gov"},{"name":"Dan O. Williams","email":"daniel.williams@gsa.gov"},{"name":"Sara D. Cope","email":"sara.cope@gsa.gov"},{"name":"Stephanie Green"}],"author":{"name":"18F"},"bugs":{"url":"https://github.com/uswds/uswds/issues"},"license":"SEE LICENSE IN LICENSE.md","readmeFilename":"","users":{"rogeruiz":true,"webslung":true},"keywords":["ui","uswds","components","library","open source","united states","usa","u.s.","government","websites"]}