@gov-design-system-ce/components 4.0.8-rc23 → 4.1.0-rc1

package/dist/collection/components/gov-app/gov-app.js

@@ -0,0 +1,93 @@
+import { Host, h } from "@stencil/core";
+import { Router } from "@vaadin/router";
+import "../../pages/Accordion";
+import "../../pages/Breadcrumbs";
+import "../../pages/Button";
+import "../../pages/Card";
+import "../../pages/Chip";
+import "../../pages/Container";
+import "../../pages/ControlGroup";
+import "../../pages/CookieConsent";
+import "../../pages/Empty";
+import "../../pages/Error";
+import "../../pages/FormLabel";
+import "../../pages/FormMessage";
+import "../../pages/Forms";
+import "../../pages/FormsRestructure";
+import "../../pages/Grid";
+import "../../pages/Home";
+import "../../pages/Infobar";
+import "../../pages/Layout";
+import "../../pages/Loading";
+import "../../pages/Message";
+import "../../pages/Dialog";
+import "../../pages/Pagination";
+import "../../pages/Spacer";
+import "../../pages/Stepper";
+import "../../pages/Tabs";
+import "../../pages/Tag";
+import "../../pages/Tiles.js";
+import "../../pages/ToastMessage";
+import "../../pages/ToastMessageCountdown";
+import "../../pages/Tooltip";
+import "../../pages/Typography";
+import "../../pages/Wizard";
+import "../../pages/Icon";
+export class GovApp {
+    componentWillLoad() {
+        const outlet = document.getElementById('outlet');
+        outlet.innerHTML = '';
+        const router = new Router(outlet, { baseUrl: '/playground/' });
+        router.setRoutes([
+            { path: '/', component: 'home-page' },
+            { path: '/infobar', component: 'infobar-page' },
+            { path: '/accordion', component: 'accordion-page' },
+            { path: '/chip', component: 'chip-page' },
+            { path: '/button', component: 'button-page' },
+            { path: '/breadcrumbs', component: 'breadcrumbs-page' },
+            { path: '/card', component: 'card-page' },
+            { path: '/message', component: 'message-page' },
+            { path: '/cookiebar', component: 'cookiebar-page' },
+            { path: '/container', component: 'container-page' },
+            { path: '/control-group', component: 'control-group-page' },
+            { path: '/empty', component: 'empty-page' },
+            { path: '/error', component: 'error-page' },
+            { path: '/forms', component: 'forms-page' },
+            { path: '/forms-restructure', component: 'forms-restructure-page' },
+            { path: '/form-message', component: 'form-message-page' },
+            { path: '/form-label', component: 'form-label-page' },
+            { path: '/grid', component: 'grid-page' },
+            { path: '/loading', component: 'loading-page' },
+            { path: '/dialog', component: 'dialog-page' },
+            { path: '/spacer', component: 'spacer-page' },
+            { path: '/stepper', component: 'stepper-page' },
+            { path: '/tabs', component: 'tabs-page' },
+            { path: '/tag', component: 'tag-page' },
+            { path: '/tooltip', component: 'tooltip-page' },
+            { path: '/tiles', component: 'tiles-page' },
+            { path: '/typography', component: 'typography-page' },
+            { path: '/toast-message', component: 'toast-message-page' },
+            { path: '/toast-message-countdown', component: 'toast-message-countdown-page' },
+            { path: '/pagination', component: 'pagination-page' },
+            { path: '/wizard', component: 'wizard-page' },
+            { path: '/grid', component: 'grid-page' },
+            { path: '/layout', component: 'layout-page' },
+            { path: '/icon', component: 'icon-page' },
+        ]);
+    }
+    render() {
+        return h(Host, { key: '3aeff0ad83f2c4589fb87c72e284e564d5b3939a' });
+    }
+    static get is() { return "gov-app"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["gov-app.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["gov-app.css"]
+        };
+    }
+}
+//# sourceMappingURL=gov-app.js.map

package/dist/collection/components/gov-app/gov-app.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"gov-app.js","sourceRoot":"","sources":["../../../../../../src/components/gov-app/gov-app.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Host, h } from '@stencil/core'\nimport { Router } from '@vaadin/router'\nimport '../../pages/Accordion'\nimport '../../pages/Breadcrumbs'\nimport '../../pages/Button'\nimport '../../pages/Card'\nimport '../../pages/Chip'\nimport '../../pages/Container'\nimport '../../pages/ControlGroup'\nimport '../../pages/CookieConsent'\nimport '../../pages/Empty'\nimport '../../pages/Error'\nimport '../../pages/FormLabel'\nimport '../../pages/FormMessage'\nimport '../../pages/Forms'\nimport '../../pages/FormsRestructure'\nimport '../../pages/Grid'\nimport '../../pages/Home'\nimport '../../pages/Infobar'\nimport '../../pages/Layout'\nimport '../../pages/Loading'\nimport '../../pages/Message'\nimport '../../pages/Dialog'\nimport '../../pages/Pagination'\nimport '../../pages/Spacer'\nimport '../../pages/Stepper'\nimport '../../pages/Tabs'\nimport '../../pages/Tag'\nimport '../../pages/Tiles.js'\nimport '../../pages/ToastMessage'\nimport '../../pages/ToastMessageCountdown'\nimport '../../pages/Tooltip'\nimport '../../pages/Typography'\nimport '../../pages/Wizard'\nimport '../../pages/Icon'\n\n@Component({\n\ttag: 'gov-app',\n\tstyleUrl: 'gov-app.scss',\n\tshadow: false,\n})\nexport class GovApp {\n\tcomponentWillLoad() {\n\t\tconst outlet = document.getElementById('outlet')\n\t\toutlet.innerHTML = ''\n\t\tconst router = new Router(outlet, {baseUrl: '/playground/'})\n\t\trouter.setRoutes([\n\t\t\t{ path: '/', component: 'home-page' },\n\t\t\t{ path: '/infobar', component: 'infobar-page' },\n\t\t\t{ path: '/accordion', component: 'accordion-page' },\n\t\t\t{ path: '/chip', component: 'chip-page' },\n\t\t\t{ path: '/button', component: 'button-page' },\n\t\t\t{ path: '/breadcrumbs', component: 'breadcrumbs-page' },\n\t\t\t{ path: '/card', component: 'card-page' },\n\t\t\t{ path: '/message', component: 'message-page' },\n\t\t\t{ path: '/cookiebar', component: 'cookiebar-page' },\n\t\t\t{ path: '/container', component: 'container-page' },\n\t\t\t{ path: '/control-group', component: 'control-group-page' },\n\t\t\t{ path: '/empty', component: 'empty-page' },\n\t\t\t{ path: '/error', component: 'error-page' },\n\t\t\t{ path: '/forms', component: 'forms-page' },\n\t\t\t{ path: '/forms-restructure', component: 'forms-restructure-page' },\n\t\t\t{ path: '/form-message', component: 'form-message-page' },\n\t\t\t{ path: '/form-label', component: 'form-label-page' },\n\t\t\t{ path: '/grid', component: 'grid-page' },\n\t\t\t{ path: '/loading', component: 'loading-page' },\n\t\t\t{ path: '/dialog', component: 'dialog-page' },\n\t\t\t{ path: '/spacer', component: 'spacer-page' },\n\t\t\t{ path: '/stepper', component: 'stepper-page' },\n\t\t\t{ path: '/tabs', component: 'tabs-page' },\n\t\t\t{ path: '/tag', component: 'tag-page' },\n\t\t\t{ path: '/tooltip', component: 'tooltip-page' },\n\t\t\t{ path: '/tiles', component: 'tiles-page' },\n\t\t\t{ path: '/typography', component: 'typography-page' },\n\t\t\t{ path: '/toast-message', component: 'toast-message-page' },\n\t\t\t{ path: '/toast-message-countdown', component: 'toast-message-countdown-page' },\n\t\t\t{ path: '/pagination', component: 'pagination-page' },\n\t\t\t{ path: '/wizard', component: 'wizard-page' },\n\t\t\t{ path: '/grid', component: 'grid-page' },\n\t\t\t{ path: '/layout', component: 'layout-page' },\n\t\t\t{ path: '/icon', component: 'icon-page' },\n\t\t])\n\t}\n\n\trender() {\n\t\treturn <Host />\n\t}\n}\n"]}

package/dist/collection/components/gov-attachments/gov-attachments-item.css

@@ -6,193 +6,12 @@
 /* stylelint-enable */
 /* stylelint-disable */
 /* stylelint-enable */
-/* [Core] - Buttons
------------------------------------------------------------------- */
-/*
- * Gets color from theme-colors or from palette-colors
- */
-/*
- * Converts hex value to rgb colors value
- */
-/* stylelint-disable order/order */
+/* Converts hex value to rgb colors value */ /* Generates CSS3 var */ /* stylelint-disable order/order */
 /* stylelint-enable order/order */
-/*
- * Generates list of utility classes for margin, padding
- *
- * Make sure $list of definitions is sorted so that last item is defined last
- * So largest views are mentioned last.
- */
-/*
- -  Variables - Sizes
- */
-/* "Constants" for general usage */
-/*
- -  Variables - Layout
- */
-/**
-* Utilities - Offset
-*/
 /* stylelint-disable order/order */
 /* stylelint-enable order/order */
-/* stylelint-disable order/order */
+/* Variables - breakpoints */ /* Variables - Colors */ /* Variables - Sizes */ /* Variables - General */ /* Variables - Typography */ /* Variables - Container */ /* Variables - Forms */ /* Variables - shadows */ /* Variables - z-index */ /* stylelint-disable order/order */
 /* stylelint-enable order/order */
-/* stylelint-disable order/order */
-/* stylelint-enable order/order */
-/**
-* Generates CSS3 var with button value
-*/
-/*
- -  Variables - General
- */
-/*
- -  Variables - Typography
- */
-/*
- -  Variables - Variants
- */
-/*
- -  Variables - Container
- */
-/*
- -  Variables - Sizes
- */
-/* "Constants" for general usage */
-/*
- -  Variables - Accordion
- */
-/*
- -  Variables - Attachments
- */
-/*
- -  Variables - Infobar
- */
-/*
- -  Variables - Backdrop
- */
-/*
- -  Variables - Buttons (&& Chips)
- */
-/*
- -  Variables - Breadcrumbs
- */
-/*
- -  Variables - Classes
- */
-/*
- -  Variables - Colors
- */
-/*
- -	Variables - Control Group
- */
-/*
- -  Variables - Cookiebar
- */
-/*
- -  Variables - Dropdown
- */
-/*
- -  Variables - Card
- */
-/*
- -  Variables - Message
- */
-/*
- -  Variables - Empty
- */
-/*
- -  Variables - Error code
- */
-/*
- -  Variables - Grid
- */
-/*
- -  Variables - Tiles
- */
-/*
- -  Variables - Modal & Prompt
- */
-/**
-* Utilities - Offset
-*/
-/*
- -  Variables - shadows
- */
-/* "Constants" for general usage */
-/*
- -  Variables - Statsbar
- */
-/*
- -  Variables - Tabs
- */
-/*
- -  Variables - Tooltip
- */
-/*
- -  Variables - Loading
- */
-/*
- -	Variables - Forms
- */
-/*
- -  Variables - Form Autocomplete
- */
-/*
- -  Variables - Form Message
- */
-/*
- -	Variables - Form label
- */
-/*
- -	Variables - Form switch
- */
-/*
- -	Variables - Form select
- */
-/*
- -	Variables - Form input
- */
-/*
- -	Variables - Form multiselect
- */
-/*
- -	Variables - Form password power
- */
-/*
- -	Variables - Form checkbox & radio
- */
-/*
- -  Variables - Form group
- */
-/*
- -	Variables - Form file
- */
-/*
- -  Variables - Toast Message
- */
-/*
- -  Variables - Wizard
- */
-/*
- -  Variables - Stepper
- */
-/*
- -  Variables - Side nav
- */
-/*
- -  Variables - Grid & Tile
- */
-/*
- -  Variables - Pagination
- */
-/*
- -  Variables - Nav
- */
-/*
- -  Variables - Layout
- */
-/*
- -  Variables - Tag
- */
 .gov-spin-animation,
 .gov-pseudo-spin-animation::before {
   animation: spin 4s linear infinite;
@@ -227,35 +46,33 @@
     opacity: 1;
   }
 }
-/*
-*   Attachments - Item
-*/
-.gov-attachments-item {
+/* Attachments - Item */
+gov-attachments-item, .gov-attachments-item {
+  /* Variables - Attachments */
   position: relative;
-  display: block;
+  display: flex;
   width: 100%;
-  margin: 0rem 0rem 0.5rem;
+  gap: var(--spacing-s);
 }
-.gov-attachments-item__messages > *:last-child {
+gov-attachments-item__messages > *:last-child, .gov-attachments-item__messages > *:last-child {
   margin-bottom: 0;
 }
-.gov-attachments-item__file {
+gov-attachments-item__file, .gov-attachments-item__file {
   display: flex;
-  gap: 1rem;
+  gap: var(--spacing-s);
 }
-.gov-attachments-item__name {
+gov-attachments-item__name, .gov-attachments-item__name {
   display: flex;
-  gap: 0 0.5rem;
+  gap: var(--spacing-s);
   flex-wrap: wrap;
   align-items: center;
-  align-self: center;
   margin: 0;
-  color: var(--gov-attachments-name-color, var(--gov-color-primary));
+  color: var(--name-color, var(--text-primary));
 }
-.gov-attachments-item__name span {
-  font-weight: var(--gov-text-xs-font-weight);
-  font-size: var(--gov-text-xs-font-size);
-  line-height: var(--gov-text-xs-line-height);
-  letter-spacing: var(--gov-text-xs-letter-spacing);
-  color: var(--gov-attachments-decor-color, var(--gov-color-secondary-700));
+gov-attachments-item__name span, .gov-attachments-item__name span {
+  font-size: var(--font-size-xs);
+  line-height: var(--height-line-xs);
+  letter-spacing: 0.0125rem;
+  font-weight: 400;
+  color: var(--decor-color, var(--text-secondary));
 }

package/dist/collection/components/gov-attachments/gov-attachments-item.js

@@ -1,29 +1,29 @@
 import { h, Host } from "@stencil/core";
 import { AttachmentsItemClass } from "./constants";
-import { validateWcagLabel } from "../../helpers/Validate/wcag";
+import { validateAccessibleLabel } from "../../helpers/Validate/wcag";
 import { canValidateWcagOnRender } from "../../helpers/Dom/win";
 import { delay } from "../../utils/utils";
 import { govHost } from "../../helpers/Dom/template";
 export class GovAttachmentsItem {
     constructor() {
-        this.wcagRemoveLabel = undefined;
-        this.wcagRemoveLabelledBy = undefined;
+        this.accessibleRemoveLabel = undefined;
+        this.accessibleRemoveLabelledBy = undefined;
         this.h = govHost(this.host);
     }
     async componentDidRender() {
         if (canValidateWcagOnRender()) {
             await delay(500);
-            await this.validateWcag();
+            await this.validateAccessibility();
         }
     }
     render() {
-        return (h(Host, { key: '015f39cdea81c65f2611071cb85c2d72ed5108eb', class: this.h.classes(AttachmentsItemClass.root), role: "listitem" }, h("div", { key: '9ced89cbee422052b997ede6e35e1a5228397d24', class: AttachmentsItemClass.file }, h("p", { key: '674843721e5015d50fbf0d2e6bd7fcc95e38cc4f', class: AttachmentsItemClass.name }, h("slot", { key: '2ce5d7c8afa3655614cab57e6907caa7d84770b6' }), h("slot", { key: 'a0c55792da29507f935841b47cc009bc4c1914bd', name: "info" })), h("gov-button", { key: '08bb5ea2679d8d116f073552d7101bf59c9454e7', variant: "primary", type: "base", size: "s", "wcag-label": this.wcagRemoveLabel, "wcag-labelled-by": this.wcagRemoveLabelledBy, "on-gov-click": this.govRemove.emit }, h("gov-icon", { key: '657e53ab7128c12b6bae2a427ca7b840b0a1b908', slot: "left-icon", name: "x-lg" }))), this.h.hasSlot('message') && (h("div", { key: '8c333c0f6b74ac28502abbcb0d48f1339f2cc38a', class: AttachmentsItemClass.messages }, h("slot", { key: 'c9d727112efad1e589aca3ada9f74600acedc0c1', name: "message" })))));
+        return (h(Host, { key: 'f7878b14f668e2a1b23368dfcdea2e65e5de13b6', class: this.h.classes(AttachmentsItemClass.root), role: "listitem" }, h("div", { key: '4aaa01614a40507bc74d524756be66aac0632a4f', class: AttachmentsItemClass.file }, h("p", { key: '26eb87dd09942ee1d9bbf4bb13a76b4cb0240902', class: AttachmentsItemClass.name }, h("slot", { key: '5d4b3f690907e557526c9c22c88705a7e9ee3ef7' }), h("slot", { key: '1eff0d73e720ce22936a0004c476c3e01cbd88e1', name: "info" })), h("gov-button", { key: 'e2395e9c5139093e01bd48b14221643394a22c6c', color: "primary", type: "base", size: "s", "accessible-label": this.accessibleRemoveLabel, "accessible-labelledby": this.accessibleRemoveLabelledBy, "on-gov-click": this.govRemove.emit }, h("gov-icon", { key: 'c592f72a09dfce70c0cd2563ec0d781cc65ad77c', slot: "left-icon", name: "x-lg" }))), this.h.hasSlot('message') && (h("div", { key: '0bffbbe4622f291fd269637a4b4ff8c624fb04f7', class: AttachmentsItemClass.messages }, h("slot", { key: '2e6ad7d812e9b68f5c0e88ca734bf0bba78924a2', name: "message" })))));
     }
     /**
-     * Validate the WCAG attributes of the component
+     * Validate the accessible attributes of the component
      */
-    async validateWcag() {
-        validateWcagLabel(this.wcagRemoveLabel, this.wcagRemoveLabelledBy, AttachmentsItemClass.root);
+    async validateAccessibility() {
+        validateAccessibleLabel(this.accessibleRemoveLabel, this.accessibleRemoveLabelledBy, AttachmentsItemClass.root, this.host);
     }
     static get is() { return "gov-attachments-item"; }
     static get originalStyleUrls() {
@@ -38,7 +38,7 @@ export class GovAttachmentsItem {
     }
     static get properties() {
         return {
-            "wcagRemoveLabel": {
+            "accessibleRemoveLabel": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -52,10 +52,10 @@ export class GovAttachmentsItem {
                     "tags": [],
                     "text": "Adds accessible label for the remove button that is only shown for screen readers."
                 },
-                "attribute": "wcag-remove-label",
+                "attribute": "accessible-remove-label",
                 "reflect": false
             },
-            "wcagRemoveLabelledBy": {
+            "accessibleRemoveLabelledBy": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -69,7 +69,7 @@ export class GovAttachmentsItem {
                     "tags": [],
                     "text": "Indicates the id of a component that labels the remove button."
                 },
-                "attribute": "wcag-remove-labelled-by",
+                "attribute": "accessible-remove-labelledby",
                 "reflect": false
             }
         };
@@ -99,7 +99,7 @@ export class GovAttachmentsItem {
     }
     static get methods() {
         return {
-            "validateWcag": {
+            "validateAccessibility": {
                 "complexType": {
                     "signature": "() => Promise<void>",
                     "parameters": [],
@@ -112,7 +112,7 @@ export class GovAttachmentsItem {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "Validate the WCAG attributes of the component",
+                    "text": "Validate the accessible attributes of the component",
                     "tags": []
                 }
             }

package/dist/collection/components/gov-attachments/gov-attachments-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"gov-attachments-item.js","sourceRoot":"","sources":["../../../../../../src/components/gov-attachments/gov-attachments-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAC9F,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAA;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAC/D,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAA;AAC/D,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAOpD,MAAM,OAAO,kBAAkB;IAG9B;;;QACC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAiBD,KAAK,CAAC,kBAAkB;QACvB,IAAI,uBAAuB,EAAE,EAAE,CAAC;YAC/B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;YAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;QAC1B,CAAC;IACF,CAAC;IAED,MAAM;QACL,OAAO,CACN,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,oBAAoB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAC,UAAU;YACtE,4DAAK,KAAK,EAAE,oBAAoB,CAAC,IAAI;gBACpC,0DAAG,KAAK,EAAE,oBAAoB,CAAC,IAAI;oBAClC,8DAAQ;oBACR,6DAAM,IAAI,EAAC,MAAM,GAAG,CACjB;gBACJ,mEACC,OAAO,EAAC,SAAS,EACjB,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,GAAG,gBACI,IAAI,CAAC,eAAe,sBACd,IAAI,CAAC,oBAAoB,kBAC7B,IAAI,CAAC,SAAS,CAAC,IAAI;oBAEjC,iEAAU,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,GAAY,CACtC,CACR;YAEL,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,CAC7B,4DAAK,KAAK,EAAE,oBAAoB,CAAC,QAAQ;gBACxC,6DAAM,IAAI,EAAC,SAAS,GAAG,CAClB,CACN,CACK,CACP,CAAA;IACF,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,YAAY;QACjB,iBAAiB,CAAC,IAAI,CAAC,eAAe,EAAE,IAAI,CAAC,oBAAoB,EAAE,oBAAoB,CAAC,IAAI,CAAC,CAAA;IAC9F,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop } from '@stencil/core'\nimport { AttachmentsItemClass } from './constants'\nimport { validateWcagLabel } from '../../helpers/Validate/wcag'\nimport { canValidateWcagOnRender } from '../../helpers/Dom/win'\nimport { delay } from '../../utils/utils'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-attachments-item',\n\tstyleUrl: 'gov-attachments-item.scss',\n})\nexport class GovAttachmentsItem {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAttachmentsItemElement\n\n\t/**\n\t * Adds accessible label for the remove button that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-remove-label' }) readonly wcagRemoveLabel: string\n\t/**\n\t * Indicates the id of a component that labels the remove button.\n\t */\n\t@Prop({ attribute: 'wcag-remove-labelled-by' }) readonly wcagRemoveLabelledBy: string\n\t/**\n\t * Emitted when the file is removed\n\t */\n\t@Event({ eventName: 'gov-remove' }) govRemove: EventEmitter<PointerEvent>\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AttachmentsItemClass.root)} role=\"listitem\">\n\t\t\t\t<div class={AttachmentsItemClass.file}>\n\t\t\t\t\t<p class={AttachmentsItemClass.name}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t<slot name=\"info\" />\n\t\t\t\t\t</p>\n\t\t\t\t\t<gov-button\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\twcag-label={this.wcagRemoveLabel}\n\t\t\t\t\t\twcag-labelled-by={this.wcagRemoveLabelledBy}\n\t\t\t\t\t\ton-gov-click={this.govRemove.emit}\n\t\t\t\t\t>\n\t\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t\t\t</gov-button>\n\t\t\t\t</div>\n\n\t\t\t\t{this.h.hasSlot('message') && (\n\t\t\t\t\t<div class={AttachmentsItemClass.messages}>\n\t\t\t\t\t\t<slot name=\"message\" />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagLabel(this.wcagRemoveLabel, this.wcagRemoveLabelledBy, AttachmentsItemClass.root)\n\t}\n}\n"]}
+{"version":3,"file":"gov-attachments-item.js","sourceRoot":"","sources":["../../../../../../src/components/gov-attachments/gov-attachments-item.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAC,MAAM,eAAe,CAAA;AAC5F,OAAO,EAAC,oBAAoB,EAAC,MAAM,aAAa,CAAA;AAChD,OAAO,EAAC,uBAAuB,EAAC,MAAM,6BAA6B,CAAA;AACnE,OAAO,EAAC,uBAAuB,EAAC,MAAM,uBAAuB,CAAA;AAC7D,OAAO,EAAC,KAAK,EAAC,MAAM,mBAAmB,CAAA;AACvC,OAAO,EAAC,OAAO,EAAC,MAAM,4BAA4B,CAAA;AAOlD,MAAM,OAAO,kBAAkB;IAG9B;;;QACC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAiBD,KAAK,CAAC,kBAAkB;QACvB,IAAI,uBAAuB,EAAE,EAAE,CAAC;YAC/B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;YAChB,MAAM,IAAI,CAAC,qBAAqB,EAAE,CAAA;QACnC,CAAC;IACF,CAAC;IAED,MAAM;QACL,OAAO,CACN,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,oBAAoB,CAAC,IAAI,CAAC,EAAE,IAAI,EAAC,UAAU;YACtE,4DAAK,KAAK,EAAE,oBAAoB,CAAC,IAAI;gBACpC,0DAAG,KAAK,EAAE,oBAAoB,CAAC,IAAI;oBAClC,8DAAO;oBACP,6DAAM,IAAI,EAAC,MAAM,GAAE,CAChB;gBACJ,mEACC,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,MAAM,EACX,IAAI,EAAC,GAAG,sBACU,IAAI,CAAC,qBAAqB,2BACrB,IAAI,CAAC,0BAA0B,kBACxC,IAAI,CAAC,SAAS,CAAC,IAAI;oBAEjC,iEAAU,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,GAAY,CACtC,CACR;YAEL,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,SAAS,CAAC,IAAI,CAC7B,4DAAK,KAAK,EAAE,oBAAoB,CAAC,QAAQ;gBACxC,6DAAM,IAAI,EAAC,SAAS,GAAE,CACjB,CACN,CACK,CACP,CAAA;IACF,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,qBAAqB;QAC1B,uBAAuB,CAAC,IAAI,CAAC,qBAAqB,EAAE,IAAI,CAAC,0BAA0B,EAAE,oBAAoB,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAA;IAC3H,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import {Component, Element, Event, EventEmitter, h, Host, Method, Prop} from '@stencil/core'\nimport {AttachmentsItemClass} from './constants'\nimport {validateAccessibleLabel} from '../../helpers/Validate/wcag'\nimport {canValidateWcagOnRender} from '../../helpers/Dom/win'\nimport {delay} from '../../utils/utils'\nimport {govHost} from '../../helpers/Dom/template'\nimport {GovHost} from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-attachments-item',\n\tstyleUrl: 'gov-attachments-item.scss',\n})\nexport class GovAttachmentsItem {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAttachmentsItemElement\n\n\t/**\n\t * Adds accessible label for the remove button that is only shown for screen readers.\n\t */\n\t@Prop({attribute: 'accessible-remove-label'}) readonly accessibleRemoveLabel: string\n\t/**\n\t * Indicates the id of a component that labels the remove button.\n\t */\n\t@Prop({attribute: 'accessible-remove-labelledby'}) readonly accessibleRemoveLabelledBy: string\n\t/**\n\t * Emitted when the file is removed\n\t */\n\t@Event({eventName: 'gov-remove'}) govRemove: EventEmitter<PointerEvent>\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateAccessibility()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AttachmentsItemClass.root)} role=\"listitem\">\n\t\t\t\t<div class={AttachmentsItemClass.file}>\n\t\t\t\t\t<p class={AttachmentsItemClass.name}>\n\t\t\t\t\t\t<slot/>\n\t\t\t\t\t\t<slot name=\"info\"/>\n\t\t\t\t\t</p>\n\t\t\t\t\t<gov-button\n\t\t\t\t\t\tcolor=\"primary\"\n\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\taccessible-label={this.accessibleRemoveLabel}\n\t\t\t\t\t\taccessible-labelledby={this.accessibleRemoveLabelledBy}\n\t\t\t\t\t\ton-gov-click={this.govRemove.emit}\n\t\t\t\t\t>\n\t\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t\t\t</gov-button>\n\t\t\t\t</div>\n\n\t\t\t\t{this.h.hasSlot('message') && (\n\t\t\t\t\t<div class={AttachmentsItemClass.messages}>\n\t\t\t\t\t\t<slot name=\"message\"/>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Validate the accessible attributes of the component\n\t */\n\t@Method()\n\tasync validateAccessibility(): Promise<void> {\n\t\tvalidateAccessibleLabel(this.accessibleRemoveLabel, this.accessibleRemoveLabelledBy, AttachmentsItemClass.root, this.host)\n\t}\n}\n"]}

package/dist/collection/components/gov-attachments/gov-attachments.js

@@ -17,7 +17,7 @@ export class GovAttachments {
         }
     }
     render() {
-        return (h(Host, { key: 'adc3c386db27941978e9499293729279dfbda8a6', class: this.h.classes(AttachmentsClass.root) }, this.label ? h("p", { class: AttachmentsClass.label }, this.label) : null, h("div", { key: '0c23c9ec4f1370c882826c2752c74642e624f7de', class: AttachmentsClass.list, role: "list", "aria-label": this.wcagLabel }, h("slot", { key: 'ae8301af1d82c13e88f351adb78b6f794c3f0deb' }))));
+        return (h(Host, { key: 'd2b3c1f40f3c5eab7b179c68985d23ed776e9337', class: this.h.classes(AttachmentsClass.root) }, this.label ? h("p", { class: AttachmentsClass.label }, this.label) : null, h("div", { key: 'bbceab5ca1b5443eb7aa8074c2f788fe0e3e7090', class: AttachmentsClass.list, role: "list", "aria-label": this.wcagLabel }, h("slot", { key: '6d1a9999824cdc35e28543d80518855057cf99ce' }))));
     }
     /**
      * Validate the WCAG attributes of the component
@@ -26,16 +26,6 @@ export class GovAttachments {
         validateWcagProp(this.wcagLabel, 'wcag-label', AttachmentsClass.root);
     }
     static get is() { return "gov-attachments"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["gov-attachments.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["gov-attachments.css"]
-        };
-    }
     static get properties() {
         return {
             "label": {

package/dist/collection/components/gov-attachments/gov-attachments.js.map

@@ -1 +1 @@
-{"version":3,"file":"gov-attachments.js","sourceRoot":"","sources":["../../../../../../src/components/gov-attachments/gov-attachments.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AACzE,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAA;AAC9D,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAA;AAC/D,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAOpD,MAAM,OAAO,cAAc;IAG1B;;;QACC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAYD,KAAK,CAAC,kBAAkB;QACvB,IAAI,uBAAuB,EAAE,EAAE,CAAC;YAC/B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;YAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;QAC1B,CAAC;IACF,CAAC;IAED,MAAM;QACL,OAAO,CACN,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC;YAChD,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAG,KAAK,EAAE,gBAAgB,CAAC,KAAK,IAAG,IAAI,CAAC,KAAK,CAAK,CAAC,CAAC,CAAC,IAAI;YACvE,4DAAK,KAAK,EAAE,gBAAgB,CAAC,IAAI,EAAE,IAAI,EAAC,MAAM,gBAAa,IAAI,CAAC,SAAS;gBACxE,8DAAQ,CACH,CACA,CACP,CAAA;IACF,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,YAAY;QACjB,gBAAgB,CAAC,IAAI,CAAC,SAAS,EAAE,YAAY,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAA;IACtE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Element, h, Host, Method, Prop } from '@stencil/core'\nimport { AttachmentsClass } from './constants'\nimport { validateWcagProp } from '../../helpers/Validate/wcag'\nimport { canValidateWcagOnRender } from '../../helpers/Dom/win'\nimport { delay } from '../../utils/utils'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-attachments',\n\tstyleUrl: 'gov-attachments.scss',\n})\nexport class GovAttachments {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAttachmentsElement\n\t/**\n\t * Label of attachments section\n\t */\n\t@Prop() readonly label: string\n\t/**\n\t * Adds accessible label for the attachment section that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AttachmentsClass.root)}>\n\t\t\t\t{this.label ? <p class={AttachmentsClass.label}>{this.label}</p> : null}\n\t\t\t\t<div class={AttachmentsClass.list} role=\"list\" aria-label={this.wcagLabel}>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagProp(this.wcagLabel, 'wcag-label', AttachmentsClass.root)\n\t}\n}\n"]}
+{"version":3,"file":"gov-attachments.js","sourceRoot":"","sources":["../../../../../../src/components/gov-attachments/gov-attachments.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AACzE,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAC9C,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAA;AAC9D,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAA;AAC/D,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AACzC,OAAO,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAMpD,MAAM,OAAO,cAAc;IAG1B;;;QACC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAYD,KAAK,CAAC,kBAAkB;QACvB,IAAI,uBAAuB,EAAE,EAAE,CAAC;YAC/B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;YAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;QAC1B,CAAC;IACF,CAAC;IAED,MAAM;QACL,OAAO,CACN,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC;YAChD,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,SAAG,KAAK,EAAE,gBAAgB,CAAC,KAAK,IAAG,IAAI,CAAC,KAAK,CAAK,CAAC,CAAC,CAAC,IAAI;YACvE,4DAAK,KAAK,EAAE,gBAAgB,CAAC,IAAI,EAAE,IAAI,EAAC,MAAM,gBAAa,IAAI,CAAC,SAAS;gBACxE,8DAAQ,CACH,CACA,CACP,CAAA;IACF,CAAC;IAED;;OAEG;IAEH,KAAK,CAAC,YAAY;QACjB,gBAAgB,CAAC,IAAI,CAAC,SAAS,EAAE,YAAY,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAA;IACtE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Element, h, Host, Method, Prop } from '@stencil/core'\nimport { AttachmentsClass } from './constants'\nimport { validateWcagProp } from '../../helpers/Validate/wcag'\nimport { canValidateWcagOnRender } from '../../helpers/Dom/win'\nimport { delay } from '../../utils/utils'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-attachments',\n})\nexport class GovAttachments {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAttachmentsElement\n\t/**\n\t * Label of attachments section\n\t */\n\t@Prop() readonly label: string\n\t/**\n\t * Adds accessible label for the attachment section that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AttachmentsClass.root)}>\n\t\t\t\t{this.label ? <p class={AttachmentsClass.label}>{this.label}</p> : null}\n\t\t\t\t<div class={AttachmentsClass.list} role=\"list\" aria-label={this.wcagLabel}>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagProp(this.wcagLabel, 'wcag-label', AttachmentsClass.root)\n\t}\n}\n"]}

package/dist/collection/components/gov-backdrop/constants.js

@@ -1,5 +1,5 @@
 export const BackdropClass = {
     root: 'gov-backdrop',
-    bg: 'gov-backdrop__bg',
+    bg: 'gov-backdrop__background',
 };
 //# sourceMappingURL=constants.js.map

package/dist/collection/components/gov-backdrop/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../src/components/gov-backdrop/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAG;IAC5B,IAAI,EAAE,cAAc;IACpB,EAAE,EAAE,kBAAkB;CACtB,CAAA","sourcesContent":["export const BackdropClass = {\n\troot: 'gov-backdrop',\n\tbg: 'gov-backdrop__bg',\n}\n"]}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../src/components/gov-backdrop/constants.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAG;IAC5B,IAAI,EAAE,cAAc;IACpB,EAAE,EAAE,0BAA0B;CAC9B,CAAA","sourcesContent":["export const BackdropClass = {\n\troot: 'gov-backdrop',\n\tbg: 'gov-backdrop__background',\n}\n"]}

package/dist/collection/components/gov-backdrop/gov-backdrop.js

@@ -1,42 +1,36 @@
 import { h, Host } from "@stencil/core";
-import { validateWcagLabel } from "../../helpers/Validate/wcag";
+import { validateAccessibleLabel } from "../../helpers/Validate/wcag";
 import { BackdropClass } from "./constants";
 import { canValidateWcagOnRender } from "../../helpers/Dom/win";
-import { delay } from "../../utils/utils";
 import { govHost } from "../../helpers/Dom/template";
+import { tick } from "../../utils/stencil.utils";
 export class GovBackdrop {
     constructor() {
         this.inverse = false;
-        this.wcagLabel = undefined;
-        this.wcagLabelledBy = undefined;
+        this.disabled = false;
+        this.accessibleLabel = undefined;
+        this.accessibleLabelledBy = undefined;
         this.h = govHost(this.host);
     }
     async componentDidRender() {
         if (canValidateWcagOnRender()) {
-            await delay(500);
-            await this.validateWcag();
+            tick(() => this.validateAccessibility());
         }
     }
     render() {
-        return (h(Host, { key: '5bac97ada5dd6033242d8f32f8d8081ffda63b0e', class: this.h.classes(BackdropClass.root) }, h("div", { key: '1ceee80d74a81381a6aee4c042f94d2adc3d8987', role: 'button', "aria-label": this.wcagLabel, "aria-labelledby": this.wcagLabelledBy, onClick: e => this.govClick.emit(e), class: BackdropClass.bg })));
+        return (h(Host, { key: 'c3a04193bcb6bf07904885794068d15723012177', class: this.h.classes(BackdropClass.root), inverse: this.inverse }, h("div", { key: '722ab2c0f3b9e64e5790f51540f44252a1b3e4e4', role: 'button', "aria-disabled": this.disabled, "aria-label": this.accessibleLabel, "aria-labelledby": this.accessibleLabelledBy, onClick: e => {
+                if (!this.disabled) {
+                    this.govClick.emit(e);
+                }
+            }, class: BackdropClass.bg })));
     }
     /**
-     * Validate the WCAG attributes of the component
+     * Validate the accessibility attributes of the component
      */
-    async validateWcag() {
-        validateWcagLabel(this.wcagLabel, this.wcagLabelledBy, BackdropClass.root);
+    async validateAccessibility() {
+        validateAccessibleLabel(this.accessibleLabel, this.accessibleLabelledBy, BackdropClass.root, this.host);
     }
     static get is() { return "gov-backdrop"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["gov-backdrop.scss"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["gov-backdrop.css"]
-        };
-    }
     static get properties() {
         return {
             "inverse": {
@@ -57,7 +51,25 @@ export class GovBackdrop {
                 "reflect": false,
                 "defaultValue": "false"
             },
-            "wcagLabel": {
+            "disabled": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Makes the backdrop component disabled."
+                },
+                "attribute": "disabled",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "accessibleLabel": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -71,10 +83,10 @@ export class GovBackdrop {
                     "tags": [],
                     "text": "Adds accessible label for the backdrop that is only shown for screen readers."
                 },
-                "attribute": "wcag-label",
+                "attribute": "accessible-label",
                 "reflect": false
             },
-            "wcagLabelledBy": {
+            "accessibleLabelledBy": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -88,7 +100,7 @@ export class GovBackdrop {
                     "tags": [],
                     "text": "String of id's that indicate alternative labels elements"
                 },
-                "attribute": "wcag-labelled-by",
+                "attribute": "accessible-labelledby",
                 "reflect": false
             }
         };
@@ -118,7 +130,7 @@ export class GovBackdrop {
     }
     static get methods() {
         return {
-            "validateWcag": {
+            "validateAccessibility": {
                 "complexType": {
                     "signature": "() => Promise<void>",
                     "parameters": [],
@@ -131,7 +143,7 @@ export class GovBackdrop {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "Validate the WCAG attributes of the component",
+                    "text": "Validate the accessibility attributes of the component",
                     "tags": []
                 }
             }