{"id":13806083,"url":"https://github.com/tgreyuk/govuk-webcomponents","last_synced_at":"2025-04-10T10:04:51.863Z","repository":{"id":54589348,"uuid":"272089565","full_name":"tgreyuk/govuk-webcomponents","owner":"tgreyuk","description":"A set of encapsulated Web components consuming the GOV.UK Design System.","archived":false,"fork":false,"pushed_at":"2021-02-08T22:04:39.000Z","size":1426,"stargazers_count":4,"open_issues_count":1,"forks_count":2,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-19T20:38:37.059Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/tgreyuk.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-06-13T21:37:08.000Z","updated_at":"2024-04-28T09:17:39.000Z","dependencies_parsed_at":"2022-08-13T20:40:28.518Z","dependency_job_id":null,"html_url":"https://github.com/tgreyuk/govuk-webcomponents","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tgreyuk%2Fgovuk-webcomponents","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tgreyuk%2Fgovuk-webcomponents/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tgreyuk%2Fgovuk-webcomponents/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/tgreyuk%2Fgovuk-webcomponents/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/tgreyuk","download_url":"https://codeload.github.com/tgreyuk/govuk-webcomponents/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248198879,"owners_count":21063627,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-04T01:01:07.696Z","updated_at":"2025-04-10T10:04:51.839Z","avatar_url":"https://github.com/tgreyuk.png","language":"JavaScript","funding_links":[],"categories":["Real World"],"sub_categories":["Design Systems"],"readme":"# govuk-webcomponents\n\nA set of encapsulated [Web Components](https://developer.mozilla.org/en-US/docs/Web/Web_Components) consuming the [GOV.UK Design System](https://design-system.service.gov.uk/components/).\n\n[![npm](https://img.shields.io/npm/v/govuk-webcomponents.svg)](https://www.npmjs.com/package/govuk-webcomponents)\n\nPlease note this package is not affiliated to GOV.UK but consumes code as distributed in the [govuk-frontend](https://www.npmjs.com/package/govuk-frontend) npm package (v3.8.0).\n\n## Installation\n\n```bash\nnpm install --save govuk-webcomponents\n```\n\n## Components\n\nPlease visit the [Storybook](https://tgreyuk.github.io/govuk-webcomponents/storybook) site for demos and code examples.\n\n- [\\\u003cgovukwc-accordion\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-accordion/README.md)\n- [\\\u003cgovukwc-back-link\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-back-link/README.md)\n- [\\\u003cgovukwc-breadcrumbs\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-breadcrumbs/README.md)\n- [\\\u003cgovukwc-button\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-button/README.md)\n- [\\\u003cgovukwc-character-count\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-character-count/README.md)\n- [\\\u003cgovukwc-checkboxes\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-checkboxes/README.md)\n- [\\\u003cgovukwc-date-input\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-date-input/README.md)\n- [\\\u003cgovukwc-details\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-details/README.md)\n- [\\\u003cgovukwc-error-summary\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-error-summary/README.md)\n- [\\\u003cgovukwc-fieldset\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-fieldset/README.md)\n- [\\\u003cgovukwc-file-upload\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-file-upload/README.md)\n- [\\\u003cgovukwc-inset-text\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-inset-text/README.md)\n- [\\\u003cgovukwc-panel\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-panel/README.md)\n- [\\\u003cgovukwc-phase-banner\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-phase-banner/README.md)\n- [\\\u003cgovukwc-radios\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-radios/README.md)\n- [\\\u003cgovukwc-select\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-select/README.md)\n- [\\\u003cgovukwc-skip-link\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-skip-link/README.md)\n- [\\\u003cgovukwc-summary-list\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-summary-list/README.md)\n- [\\\u003cgovukwc-table\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-table/README.md)\n- [\\\u003cgovukwc-tabs\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-tabs/README.md)\n- [\\\u003cgovukwc-tag\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-tag/README.md)\n- [\\\u003cgovukwc-text-input\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-text-input/README.md)\n- [\\\u003cgovukwc-textarea\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-textarea/README.md)\n- [\\\u003cgovukwc-warning-text\u003e](https://github.com/tgreyuk/govuk-webcomponents/blob/master/components/govukwc-warning-text/README.md)\n\n## Usage\n\nThe web components are distributed as ES modules and can be used with any platform.\n\n### Modern browsers (Bare module specifiers)\n\nTo quickly try the components import the modules directly in the browser and serve with a process that supports bare module specifier resolution such as [es-dev-server](https://www.npmjs.com/package/es-dev-server).\n\n```html\n\u003cbody\u003e\n  \u003cgovukwc-button label=\"Save and continue\"\u003e\u003c/govukwc-button\u003e\n  \u003cscript type=\"module\"\u003e\n    import 'govuk-webcomponents/components/govukwc-button/govukwc-button';\n  \u003c/script\u003e\n\u003c/body\u003e\n```\n\n### Browsers to IE11 (Compiling to ES5)\n\nTo support browsers (down to IE11) a combination of polyfills and build steps will need to be taken.\n\nAt a highlevel outline the following is required:\n\n- Transpiling to ES5 will be required using build tools such as Webpack or Rollup.\n- The [webcomponents.js](https://www.npmjs.com/package/@webcomponents/webcomponentsjs) pollyfills will need to be loaded.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftgreyuk%2Fgovuk-webcomponents","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ftgreyuk%2Fgovuk-webcomponents","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ftgreyuk%2Fgovuk-webcomponents/lists"}