@gov-design-system-ce/components 0.0.52 → 0.0.53

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

@@ -1,39 +1,20 @@
 import { h, Host } from "@stencil/core";
-import { govErrorLog } from "../../helpers/Log/gov.log";
 import { validateProp } from "../../helpers/Validate/props";
-import { AccordionSizes, AccordionItemClass, AccordionVariants, AccordionClass, } from "./constants";
+import { AccordionClass, AccordionItemClass, AccordionSizes, AccordionVariants, } from "./constants";
 import { createID } from "../../utils/string.utils";
-import { booleanString, toBoolAttrIfDefined } from "../../helpers/Dom/template";
-import { govHost } from "../../helpers/Dom/template";
+import { booleanString, govHost, toBoolAttrIfDefined } from "../../helpers/Dom/template";
 export class GovAccordionItem {
   constructor() {
     this.isExpandedState = undefined;
-    this.variant = "primary";
+    this.variant = undefined;
     this.identifier = undefined;
     this.size = undefined;
-    this.label = undefined;
-    this.annotation = undefined;
     this.disabled = false;
     this.isExpanded = false;
-    this.triggerTag = "h3";
-    this.noBorder = false;
     this.h = govHost(this.host);
     this.triggerId = createID("GovAccordionItem");
     this.contentId = createID("GovAccordionContent");
   }
-  validateLabel(newValue) {
-    if (!newValue) {
-      govErrorLog(`[${AccordionItemClass.root}]: Parameter label is required.`);
-    }
-  }
-  validateTriggerTag(newValue) {
-    const validTags = ["h1", "h2", "h3", "h4", "h5", "h6", "span"];
-    if (newValue) {
-      if (!validTags.includes(newValue)) {
-        govErrorLog(`[${AccordionItemClass.root}]: Tag ${newValue} is not allowed.`);
-      }
-    }
-  }
   validateSize(newValue) {
     validateProp(AccordionSizes, newValue, AccordionItemClass.root);
   }
@@ -42,62 +23,57 @@ export class GovAccordionItem {
   }
   emmitChange() {
     this.govChange.emit({
-      open: this.isExpandedState,
+      open: this.isExpanded,
       component: AccordionItemClass.root,
       ref: this.host,
     });
   }
   componentWillLoad() {
-    this.isExpandedState = this.isExpanded;
     this.getPropsFromParents();
-    this.validateLabel(this.label);
-    this.validateTriggerTag(this.triggerTag);
     this.validateSize(this.size);
     this.validateVariant(this.variant);
   }
   getPropsFromParents() {
     const accordion = this.h.getParent(AccordionClass.root);
     if (accordion) {
-      this.size = accordion.getAttribute('size');
-      this.variant = accordion.getAttribute('variant');
+      this.size = accordion.getAttribute("size");
+      this.variant = accordion.getAttribute("variant");
     }
   }
   render() {
     const triggerId = this.identifier || this.triggerId;
     const contentId = this.contentId;
-    const { isExpandedState, label } = this;
-    const TriggerTag = this.triggerTag;
-    return (h(Host, { class: this.h.classes(AccordionItemClass.root), "no-border": this.noBorder, size: this.size, variant: this.variant, role: "listitem" }, h("button", { id: triggerId, class: AccordionItemClass.header, "aria-expanded": booleanString(isExpandedState), "aria-controls": contentId, disabled: this.disabled, type: 'button', "aria-disabled": toBoolAttrIfDefined(this.disabled), onClick: (e) => {
+    return (h(Host, { class: this.h.classes(AccordionItemClass.root), size: this.size, variant: this.variant, role: "listitem" }, h("button", { id: triggerId, class: AccordionItemClass.header, "aria-expanded": booleanString(this.isExpanded), "aria-controls": contentId, disabled: this.disabled, type: "button", "aria-disabled": toBoolAttrIfDefined(this.disabled), onClick: (e) => {
         e.stopPropagation();
         this.toggle().finally();
-      } }, h(TriggerTag, { class: AccordionItemClass.title }, this.h.hasSlot("icon") && (h("span", { class: AccordionItemClass.icon }, h("slot", { name: "icon" }))), h("span", { class: AccordionItemClass.name }, h("span", { class: AccordionItemClass.label }, label), this.annotation && h("span", { class: AccordionItemClass.annot }, this.annotation)), this.h.hasSlot("suffix") && (h("span", { class: AccordionItemClass.suffix }, h("slot", { name: "suffix" })))), h("gov-icon", { class: AccordionItemClass.arrow, name: "chevron-down" })), h("div", { class: AccordionItemClass.content, id: contentId, "aria-hidden": booleanString(!isExpandedState), hidden: !isExpandedState, "aria-labelledby": triggerId }, h("slot", null))));
+      } }, this.h.hasSlot("icon") && (h("span", { class: AccordionItemClass.icon }, h("slot", { name: "icon" }))), h("span", { class: AccordionItemClass.title }, h("span", { class: AccordionItemClass.label }, h("slot", { name: "label" })), this.h.hasSlot("annotation") && (h("span", { class: AccordionItemClass.annotation }, h("slot", { name: "annotation" })))), this.h.hasSlot("suffix") && (h("span", { class: AccordionItemClass.suffix }, h("slot", { name: "suffix" }))), h("span", { class: AccordionItemClass.arrow }, this.h.hasSlot("toggle-icon") ? (h("slot", { name: "toggle-icon" })) : (h("gov-icon", { name: "chevron-down" })))), h("div", { class: AccordionItemClass.content, id: contentId, "aria-hidden": booleanString(!this.isExpanded), hidden: !this.isExpanded, "aria-labelledby": triggerId }, h("slot", null))));
   }
   /**
    * Opening the accordion
    */
   async open() {
-    this.isExpandedState = true;
+    this.isExpanded = true;
     this.emmitChange();
   }
   /**
    * Closing the accordion
    */
   async close() {
-    this.isExpandedState = false;
+    this.isExpanded = false;
     this.emmitChange();
   }
   /**
    * Accordion switch
    */
   async toggle() {
-    this.isExpandedState = !this.isExpandedState;
+    this.isExpanded = !this.isExpanded;
     this.emmitChange();
   }
   /**
    * Returns the current state of the component
    */
   async currentState() {
-    return this.isExpandedState;
+    return this.isExpanded;
   }
   static get is() { return "gov-accordion-item"; }
   static get originalStyleUrls() {
@@ -114,7 +90,7 @@ export class GovAccordionItem {
     return {
       "variant": {
         "type": "string",
-        "mutable": true,
+        "mutable": false,
         "complexType": {
           "original": "AccordionVariantType",
           "resolved": "\"custom\" | \"primary\" | \"secondary\"",
@@ -133,8 +109,7 @@ export class GovAccordionItem {
           "text": "Style variation of the button."
         },
         "attribute": "variant",
-        "reflect": false,
-        "defaultValue": "\"primary\""
+        "reflect": false
       },
       "identifier": {
         "type": "string",
@@ -155,7 +130,7 @@ export class GovAccordionItem {
       },
       "size": {
         "type": "string",
-        "mutable": true,
+        "mutable": false,
         "complexType": {
           "original": "AccordionSizeType",
           "resolved": "\"l\" | \"m\" | \"s\" | \"xs\"",
@@ -176,40 +151,6 @@ export class GovAccordionItem {
         "attribute": "size",
         "reflect": false
       },
-      "label": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Item name of the accordion"
-        },
-        "attribute": "label",
-        "reflect": false
-      },
-      "annotation": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Item annotation of the accordion"
-        },
-        "attribute": "annotation",
-        "reflect": false
-      },
       "disabled": {
         "type": "boolean",
         "mutable": false,
@@ -230,7 +171,7 @@ export class GovAccordionItem {
       },
       "isExpanded": {
         "type": "boolean",
-        "mutable": false,
+        "mutable": true,
         "complexType": {
           "original": "boolean",
           "resolved": "boolean",
@@ -245,42 +186,6 @@ export class GovAccordionItem {
         "attribute": "is-expanded",
         "reflect": false,
         "defaultValue": "false"
-      },
-      "triggerTag": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Used to change the HTML tag in the accordion trigger for correct semantic structure"
-        },
-        "attribute": "trigger-tag",
-        "reflect": false,
-        "defaultValue": "\"h3\""
-      },
-      "noBorder": {
-        "type": "boolean",
-        "mutable": false,
-        "complexType": {
-          "original": "boolean",
-          "resolved": "boolean",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "To remove the main underline of an item"
-        },
-        "attribute": "no-border",
-        "reflect": false,
-        "defaultValue": "false"
       }
     };
   }
@@ -388,12 +293,6 @@ export class GovAccordionItem {
   static get elementRef() { return "host"; }
   static get watchers() {
     return [{
-        "propName": "label",
-        "methodName": "validateLabel"
-      }, {
-        "propName": "triggerTag",
-        "methodName": "validateTriggerTag"
-      }, {
         "propName": "size",
         "methodName": "validateSize"
       }, {

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

@@ -1 +1 @@
-{"version":3,"file":"gov-accordion-item.js","sourceRoot":"","sources":["../../../../../../src/components/gov-accordion/gov-accordion-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Prop, State, Watch, Host, Method, Event, EventEmitter } from \"@stencil/core\"\nimport { govErrorLog } from \"../../helpers/Log/gov.log\"\nimport { validateProp } from \"../../helpers/Validate/props\"\nimport {\n\tAccordionSizeType,\n\tAccordionSizes,\n\tAccordionItemClass,\n\tAccordionVariantType,\n\tAccordionVariants, AccordionClass,\n} from \"./constants\"\nimport { createID } from \"../../utils/string.utils\"\nimport { booleanString, toBoolAttrIfDefined } from \"../../helpers/Dom/template\"\nimport { AccordionItemEvent } from \"./gov-accordion.types\"\nimport { govHost } from \"../../helpers/Dom/template\"\nimport { GovHost } from \"../../helpers/Dom/template.types\"\n\n@Component({\n\ttag: \"gov-accordion-item\",\n\tstyleUrl: \"gov-accordion-item.scss\",\n})\nexport class GovAccordionItem {\n\tprivate readonly triggerId: string\n\tprivate readonly contentId: string\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.triggerId = createID(\"GovAccordionItem\")\n\t\tthis.contentId = createID(\"GovAccordionContent\")\n\t}\n\n\t@Element() readonly host: HTMLGovAccordionItemElement\n\t@State() isExpandedState: boolean\n\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop({mutable: true}) variant?: AccordionVariantType = \"primary\"\n\t/**\n\t * Custom accordion item identifier. Otherwise, it will be generated\n\t */\n\t@Prop() readonly identifier: string\n\t/**\n\t * Accordion’s size.\n\t */\n\t@Prop({mutable: true}) size?: AccordionSizeType\n\t/**\n\t * Item name of the accordion\n\t */\n\t@Prop() readonly label: string\n\t/**\n\t * Item annotation of the accordion\n\t */\n\t@Prop() readonly annotation: string\n\t/**\n\t * Makes the button component disabled.\n\t * This prevents users from being able to interact with the button, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean = false\n\t/**\n\t * Defines whether the accordion is open or closed by default\n\t */\n\t@Prop({ attribute: \"is-expanded\" }) readonly isExpanded: boolean = false\n\t/**\n\t * Used to change the HTML tag in the accordion trigger for correct semantic structure\n\t */\n\t@Prop({ attribute: \"trigger-tag\" }) readonly triggerTag: string = \"h3\"\n\t/**\n\t * To remove the main underline of an item\n\t */\n\t@Prop({ attribute: \"no-border\" }) readonly noBorder: boolean = false\n\t/**\n\t * Called when the accordion state changes\n\t */\n\t@Event({ eventName: \"gov-change\" }) govChange: EventEmitter<AccordionItemEvent>\n\n\t@Watch(\"label\")\n\tvalidateLabel(newValue: string): void {\n\t\tif (!newValue) {\n\t\t\tgovErrorLog(`[${AccordionItemClass.root}]: Parameter label is required.`)\n\t\t}\n\t}\n\n\t@Watch(\"triggerTag\")\n\tvalidateTriggerTag(newValue: string): void {\n\t\tconst validTags = [\"h1\", \"h2\", \"h3\", \"h4\", \"h5\", \"h6\", \"span\"]\n\t\tif (newValue) {\n\t\t\tif (!validTags.includes(newValue)) {\n\t\t\t\tgovErrorLog(`[${AccordionItemClass.root}]: Tag ${newValue} is not allowed.`)\n\t\t\t}\n\t\t}\n\t}\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(AccordionSizes, newValue, AccordionItemClass.root)\n\t}\n\n\t@Watch(\"variant\")\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(AccordionVariants, newValue, AccordionItemClass.root)\n\t}\n\n\tprivate emmitChange(): void {\n\t\tthis.govChange.emit({\n\t\t\topen: this.isExpandedState,\n\t\t\tcomponent: AccordionItemClass.root,\n\t\t\tref: this.host,\n\t\t})\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.isExpandedState = this.isExpanded\n\t\tthis.getPropsFromParents()\n\n\t\tthis.validateLabel(this.label)\n\t\tthis.validateTriggerTag(this.triggerTag)\n\t\tthis.validateSize(this.size)\n\t\tthis.validateVariant(this.variant)\n\n\t}\n\n\tgetPropsFromParents() {\n\t\tconst accordion = this.h.getParent(AccordionClass.root)\n\t\tif(accordion) {\n\t\t\tthis.size = accordion.getAttribute('size') as AccordionSizeType\n\t\t\tthis.variant = accordion.getAttribute('variant') as AccordionVariantType\n\t\t}\n\t}\n\n\trender() {\n\t\tconst triggerId = this.identifier || this.triggerId\n\t\tconst contentId = this.contentId\n\t\tconst { isExpandedState, label } = this\n\t\tconst TriggerTag = this.triggerTag\n\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AccordionItemClass.root)} no-border={this.noBorder} size={this.size} variant={this.variant} role=\"listitem\">\n\t\t\t\t<button\n\t\t\t\t\tid={triggerId}\n\t\t\t\t\tclass={AccordionItemClass.header}\n\t\t\t\t\taria-expanded={booleanString(isExpandedState)}\n\t\t\t\t\taria-controls={contentId}\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\ttype={'button'}\n\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\tonClick={(e: Event) => {\n\t\t\t\t\t\te.stopPropagation()\n\t\t\t\t\t\tthis.toggle().finally()\n\t\t\t\t\t}}>\n\t\t\t\t\t<TriggerTag class={AccordionItemClass.title}>\n\t\t\t\t\t\t{this.h.hasSlot(\"icon\") && (\n\t\t\t\t\t\t\t<span class={AccordionItemClass.icon}>\n\t\t\t\t\t\t\t\t<slot name=\"icon\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t<span class={AccordionItemClass.name}>\n\t\t\t\t\t\t\t<span class={AccordionItemClass.label}>{label}</span>\n\t\t\t\t\t\t\t{this.annotation && <span class={AccordionItemClass.annot}>{this.annotation}</span>}\n\t\t\t\t\t\t</span>\n\n\t\t\t\t\t\t{this.h.hasSlot(\"suffix\") && (\n\t\t\t\t\t\t\t<span class={AccordionItemClass.suffix}>\n\t\t\t\t\t\t\t\t<slot name=\"suffix\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</TriggerTag>\n\n\t\t\t\t\t<gov-icon class={AccordionItemClass.arrow} name=\"chevron-down\"></gov-icon>\n\t\t\t\t</button>\n\t\t\t\t<div\n\t\t\t\t\tclass={AccordionItemClass.content}\n\t\t\t\t\tid={contentId}\n\t\t\t\t\taria-hidden={booleanString(!isExpandedState)}\n\t\t\t\t\thidden={!isExpandedState}\n\t\t\t\t\taria-labelledby={triggerId}>\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 * Opening the accordion\n\t */\n\t@Method()\n\tasync open(): Promise<void> {\n\t\tthis.isExpandedState = true\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Closing the accordion\n\t */\n\t@Method()\n\tasync close(): Promise<void> {\n\t\tthis.isExpandedState = false\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Accordion switch\n\t */\n\t@Method()\n\tasync toggle(): Promise<void> {\n\t\tthis.isExpandedState = !this.isExpandedState\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync currentState(): Promise<boolean> {\n\t\treturn this.isExpandedState\n\t}\n}\n"]}
+{"version":3,"file":"gov-accordion-item.js","sourceRoot":"","sources":["../../../../../../src/components/gov-accordion/gov-accordion-item.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from \"@stencil/core\"\nimport { validateProp } from \"../../helpers/Validate/props\"\nimport {\n\tAccordionClass,\n\tAccordionItemClass,\n\tAccordionSizes,\n\tAccordionSizeType,\n\tAccordionVariants,\n\tAccordionVariantType,\n} from \"./constants\"\nimport { createID } from \"../../utils/string.utils\"\nimport { booleanString, govHost, toBoolAttrIfDefined } from \"../../helpers/Dom/template\"\nimport { AccordionItemEvent } from \"./gov-accordion.types\"\nimport { GovHost } from \"../../helpers/Dom/template.types\"\n\n@Component({\n\ttag: \"gov-accordion-item\",\n\tstyleUrl: \"gov-accordion-item.scss\",\n})\nexport class GovAccordionItem {\n\tprivate readonly triggerId: string\n\tprivate readonly contentId: string\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.triggerId = createID(\"GovAccordionItem\")\n\t\tthis.contentId = createID(\"GovAccordionContent\")\n\t}\n\n\t@Element() readonly host: HTMLGovAccordionItemElement\n\t@State() isExpandedState: boolean\n\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() variant?: AccordionVariantType\n\t/**\n\t * Custom accordion item identifier. Otherwise, it will be generated\n\t */\n\t@Prop() readonly identifier: string\n\t/**\n\t * Accordion’s size.\n\t */\n\t@Prop() size?: AccordionSizeType\n\t/**\n\t * Makes the button component disabled.\n\t * This prevents users from being able to interact with the button, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean = false\n\t/**\n\t * Defines whether the accordion is open or closed by default\n\t */\n\t@Prop({ attribute: \"is-expanded\", mutable: true }) isExpanded = false\n\t/**\n\t * Called when the accordion state changes\n\t */\n\t@Event({ eventName: \"gov-change\" }) govChange: EventEmitter<AccordionItemEvent>\n\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(AccordionSizes, newValue, AccordionItemClass.root)\n\t}\n\n\t@Watch(\"variant\")\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(AccordionVariants, newValue, AccordionItemClass.root)\n\t}\n\n\tprivate emmitChange(): void {\n\t\tthis.govChange.emit({\n\t\t\topen: this.isExpanded,\n\t\t\tcomponent: AccordionItemClass.root,\n\t\t\tref: this.host,\n\t\t})\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.getPropsFromParents()\n\t\tthis.validateSize(this.size)\n\t\tthis.validateVariant(this.variant)\n\n\t}\n\n\tgetPropsFromParents() {\n\t\tconst accordion = this.h.getParent(AccordionClass.root)\n\t\tif (accordion) {\n\t\t\tthis.size = accordion.getAttribute(\"size\") as AccordionSizeType\n\t\t\tthis.variant = accordion.getAttribute(\"variant\") as AccordionVariantType\n\t\t}\n\t}\n\n\trender() {\n\t\tconst triggerId = this.identifier || this.triggerId\n\t\tconst contentId = this.contentId\n\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AccordionItemClass.root)} size={this.size} variant={this.variant} role=\"listitem\">\n\t\t\t\t<button\n\t\t\t\t\tid={triggerId}\n\t\t\t\t\tclass={AccordionItemClass.header}\n\t\t\t\t\taria-expanded={booleanString(this.isExpanded)}\n\t\t\t\t\taria-controls={contentId}\n\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\ttype={\"button\"}\n\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\tonClick={(e: Event) => {\n\t\t\t\t\t\te.stopPropagation()\n\t\t\t\t\t\tthis.toggle().finally()\n\t\t\t\t\t}}>\n\n\t\t\t\t\t{this.h.hasSlot(\"icon\") && (\n\t\t\t\t\t\t<span class={AccordionItemClass.icon}>\n\t\t\t\t\t\t\t<slot name=\"icon\" />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<span class={AccordionItemClass.title}>\n\t\t\t\t\t\t<span class={AccordionItemClass.label}>\n\t\t\t\t\t\t\t<slot name=\"label\" />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t{this.h.hasSlot(\"annotation\") && (\n\t\t\t\t\t\t\t<span class={AccordionItemClass.annotation}>\n\t\t\t\t\t\t\t\t<slot name=\"annotation\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</span>\n\n\t\t\t\t\t{this.h.hasSlot(\"suffix\") && (\n\t\t\t\t\t\t<span class={AccordionItemClass.suffix}>\n\t\t\t\t\t\t\t<slot name=\"suffix\" />\n\t\t\t\t\t\t</span>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<span class={AccordionItemClass.arrow}>\n\t\t\t\t\t\t{this.h.hasSlot(\"toggle-icon\") ? (\n\t\t\t\t\t\t\t<slot name=\"toggle-icon\" />\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<gov-icon name=\"chevron-down\"></gov-icon>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</span>\n\t\t\t\t</button>\n\t\t\t\t<div\n\t\t\t\t\tclass={AccordionItemClass.content}\n\t\t\t\t\tid={contentId}\n\t\t\t\t\taria-hidden={booleanString(!this.isExpanded)}\n\t\t\t\t\thidden={!this.isExpanded}\n\t\t\t\t\taria-labelledby={triggerId}>\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 * Opening the accordion\n\t */\n\t@Method()\n\tasync open(): Promise<void> {\n\t\tthis.isExpanded = true\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Closing the accordion\n\t */\n\t@Method()\n\tasync close(): Promise<void> {\n\t\tthis.isExpanded = false\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Accordion switch\n\t */\n\t@Method()\n\tasync toggle(): Promise<void> {\n\t\tthis.isExpanded = !this.isExpanded\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync currentState(): Promise<boolean> {\n\t\treturn this.isExpanded\n\t}\n}\n"]}

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

@@ -44,7 +44,7 @@ export class GovAccordion {
     }
   }
   render() {
-    return (h(Host, { class: this.h.classes(AccordionClass.root), size: this.size, variant: this.variant }, h("div", { role: 'list', "arial-label": this.wcagLabel, "arial-labelledby": this.wcagLabelledBy }, h("slot", null))));
+    return (h(Host, { class: this.h.classes(AccordionClass.root), size: this.size, variant: this.variant, role: 'list', "arial-label": this.wcagLabel, "arial-labelledby": this.wcagLabelledBy }, h("slot", null)));
   }
   /**
    * Validate the WCAG attributes of the component

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

@@ -1 +1 @@
-{"version":3,"file":"gov-accordion.js","sourceRoot":"","sources":["../../../../../../src/components/gov-accordion/gov-accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACrG,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAC3D,OAAO,EAAE,cAAc,EAAE,cAAc,EAAqB,kBAAkB,EAAwB,MAAM,aAAa,CAAA;AACzH,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AACxD,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;AAQpD,MAAM,OAAO,YAAY;EAGxB;gBAQ4C,GAAG;mBAIG,SAAS;oBAII,KAAK;;;IAfnE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EA6BD,YAAY,CAAC,QAAgB;IAC5B,YAAY,CAAC,cAAc,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;EAC5D,CAAC;EAGD,eAAe,CAAC,QAAgB;IAC/B,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;EACtD,CAAC;EAED,iBAAiB;IAChB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC5B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;EACnC,CAAC;EAED,gBAAgB;IACf,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,KAAkC,EAAE,EAAE;MAClG,KAAK,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC,CAAkC,EAAE,EAAE;QAC3E,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;UACnB,SAAS,EAAE,cAAc,CAAC,IAAI;UAC9B,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI;UACnB,GAAG,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG;SACjB,CAAC,CAAA;MACH,CAAC,CAAC,CAAA;IACH,CAAC,CAAC,CAAA;EACH,CAAC;EAED,KAAK,CAAC,kBAAkB;IACvB,IAAI,uBAAuB,EAAE,EAAE;MAC9B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;MAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;KACzB;EACF,CAAC;EAED,MAAM;IACL,OAAO,CACN,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO;MACvF,WAAK,IAAI,EAAE,MAAM,iBAAe,IAAI,CAAC,SAAS,sBAAoB,IAAI,CAAC,cAAc;QACpF,eAAQ,CACH,CACA,CACP,CAAA;EACF,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,YAAY;IACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;EAC5E,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, Watch } from '@stencil/core'\nimport { validateProp } from '../../helpers/Validate/props'\nimport { AccordionClass, AccordionSizes, AccordionSizeType, AccordionItemClass, AccordionVariantType } from './constants'\nimport { Variants } from '../../core/constants/variants'\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'\nimport { AccordionEvent, AccordionItemEvent } from \"./gov-accordion.types\"\n\n@Component({\n\ttag: 'gov-accordion',\n\tstyleUrl: 'gov-accordion.scss',\n})\nexport class GovAccordion {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAccordionElement\n\t/**\n\t * Accordion’s size.\n\t */\n\t@Prop() readonly size?: AccordionSizeType = 'm'\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() readonly variant?: AccordionVariantType = 'primary'\n\t/**\n\t * Accordion item underline\n\t */\n\t@Prop({ attribute: 'no-border' }) readonly noBorder: boolean = false\n\t/**\n\t * Adds accessible label for the accordion that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\t/**\n\t * String of id's that indicate alternative labels elements\n\t */\n\t@Prop({ attribute: 'wcag-labelled-by' }) readonly wcagLabelledBy: string\n\t/**\n\t * Called when the accordion state changes\n\t */\n\t@Event({ eventName: 'gov-change' }) govChange: EventEmitter<AccordionEvent>\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(AccordionSizes, newValue, AccordionClass.root)\n\t}\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(Variants, newValue, AccordionClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateSize(this.size)\n\t\tthis.validateVariant(this.variant)\n\t}\n\n\tcomponentDidLoad() {\n\t\tthis.host.querySelectorAll(AccordionItemClass.root).forEach((child: HTMLGovAccordionItemElement) => {\n\t\t\tchild.addEventListener('gov-change', (e: CustomEvent<AccordionItemEvent>) => {\n\t\t\t\te.stopPropagation()\n\t\t\t\tthis.govChange.emit({\n\t\t\t\t\tcomponent: AccordionClass.root,\n\t\t\t\t\topen: e.detail.open,\n\t\t\t\t\tref: e.detail.ref\n\t\t\t\t})\n\t\t\t})\n\t\t})\n\t}\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(AccordionClass.root)} size={this.size} variant={this.variant}>\n\t\t\t\t<div role={'list'} arial-label={this.wcagLabel} arial-labelledby={this.wcagLabelledBy}>\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\tvalidateWcagLabel(this.wcagLabel, this.wcagLabelledBy, AccordionClass.root)\n\t}\n}\n"]}
+{"version":3,"file":"gov-accordion.js","sourceRoot":"","sources":["../../../../../../src/components/gov-accordion/gov-accordion.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,eAAe,CAAA;AACrG,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAA;AAC3D,OAAO,EAAE,cAAc,EAAE,cAAc,EAAqB,kBAAkB,EAAwB,MAAM,aAAa,CAAA;AACzH,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AACxD,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;AAQpD,MAAM,OAAO,YAAY;EAGxB;gBAQ4C,GAAG;mBAIG,SAAS;oBAII,KAAK;;;IAfnE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EA6BD,YAAY,CAAC,QAAgB;IAC5B,YAAY,CAAC,cAAc,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;EAC5D,CAAC;EAGD,eAAe,CAAC,QAAgB;IAC/B,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;EACtD,CAAC;EAED,iBAAiB;IAChB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC5B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;EACnC,CAAC;EAED,gBAAgB;IACf,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,KAAkC,EAAE,EAAE;MAClG,KAAK,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC,CAAkC,EAAE,EAAE;QAC3E,CAAC,CAAC,eAAe,EAAE,CAAA;QACnB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;UACnB,SAAS,EAAE,cAAc,CAAC,IAAI;UAC9B,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI;UACnB,GAAG,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG;SACjB,CAAC,CAAA;MACH,CAAC,CAAC,CAAA;IACH,CAAC,CAAC,CAAA;EACH,CAAC;EAED,KAAK,CAAC,kBAAkB;IACvB,IAAI,uBAAuB,EAAE,EAAE;MAC9B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;MAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;KACzB;EACF,CAAC;EAED,MAAM;IACL,OAAO,CACN,EAAC,IAAI,IACJ,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,cAAc,CAAC,IAAI,CAAC,EAC1C,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,IAAI,EAAE,MAAM,iBACC,IAAI,CAAC,SAAS,sBACT,IAAI,CAAC,cAAc;MACrC,eAAQ,CACF,CACP,CAAA;EACF,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,YAAY;IACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;EAC5E,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, Watch } from '@stencil/core'\nimport { validateProp } from '../../helpers/Validate/props'\nimport { AccordionClass, AccordionSizes, AccordionSizeType, AccordionItemClass, AccordionVariantType } from './constants'\nimport { Variants } from '../../core/constants/variants'\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'\nimport { AccordionEvent, AccordionItemEvent } from \"./gov-accordion.types\"\n\n@Component({\n\ttag: 'gov-accordion',\n\tstyleUrl: 'gov-accordion.scss',\n})\nexport class GovAccordion {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAccordionElement\n\t/**\n\t * Accordion’s size.\n\t */\n\t@Prop() readonly size?: AccordionSizeType = 'm'\n\t/**\n\t * Style variation of the button.\n\t */\n\t@Prop() readonly variant?: AccordionVariantType = 'primary'\n\t/**\n\t * Accordion item underline\n\t */\n\t@Prop({ attribute: 'no-border' }) readonly noBorder: boolean = false\n\t/**\n\t * Adds accessible label for the accordion that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\t/**\n\t * String of id's that indicate alternative labels elements\n\t */\n\t@Prop({ attribute: 'wcag-labelled-by' }) readonly wcagLabelledBy: string\n\t/**\n\t * Called when the accordion state changes\n\t */\n\t@Event({ eventName: 'gov-change' }) govChange: EventEmitter<AccordionEvent>\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(AccordionSizes, newValue, AccordionClass.root)\n\t}\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(Variants, newValue, AccordionClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateSize(this.size)\n\t\tthis.validateVariant(this.variant)\n\t}\n\n\tcomponentDidLoad() {\n\t\tthis.host.querySelectorAll(AccordionItemClass.root).forEach((child: HTMLGovAccordionItemElement) => {\n\t\t\tchild.addEventListener('gov-change', (e: CustomEvent<AccordionItemEvent>) => {\n\t\t\t\te.stopPropagation()\n\t\t\t\tthis.govChange.emit({\n\t\t\t\t\tcomponent: AccordionClass.root,\n\t\t\t\t\topen: e.detail.open,\n\t\t\t\t\tref: e.detail.ref\n\t\t\t\t})\n\t\t\t})\n\t\t})\n\t}\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\n\t\t\t\tclass={this.h.classes(AccordionClass.root)}\n\t\t\t\tsize={this.size}\n\t\t\t\tvariant={this.variant}\n\t\t\t\trole={'list'}\n\t\t\t\tarial-label={this.wcagLabel}\n\t\t\t\tarial-labelledby={this.wcagLabelledBy}>\n\t\t\t\t<slot />\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.wcagLabel, this.wcagLabelledBy, AccordionClass.root)\n\t}\n}\n"]}

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

@@ -51,7 +51,7 @@ export class GovBackdrop {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Determide if component should have inversed colors to be used on dark background."
+          "text": "Determine if component should have inverse colors to be used on dark background."
         },
         "attribute": "inverse",
         "reflect": false,

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

@@ -1 +1 @@
-{"version":3,"file":"gov-backdrop.js","sourceRoot":"","sources":["../../../../../../src/components/gov-backdrop/gov-backdrop.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAC9F,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,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,WAAW;EAGvB;mBAQoC,KAAK;;;IAPxC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EAoBD,KAAK,CAAC,kBAAkB;IACvB,IAAI,uBAAuB,EAAE,EAAE;MAC9B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;MAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;KACzB;EACF,CAAC;EAED,MAAM;IACL,OAAO,CACN,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC;MAC9C,WACC,IAAI,EAAE,QAAQ,gBACF,IAAI,CAAC,SAAS,qBACT,IAAI,CAAC,cAAc,EACpC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EACnC,KAAK,EAAE,aAAa,CAAC,EAAE,GACjB,CACD,CACP,CAAA;EACF,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,YAAY;IACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,aAAa,CAAC,IAAI,CAAC,CAAA;EAC3E,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Event, EventEmitter, h, Method, Prop, Host, Element } from '@stencil/core'\nimport { validateWcagLabel } from '../../helpers/Validate/wcag'\nimport { BackdropClass } from './constants'\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-backdrop',\n\tstyleUrl: 'gov-backdrop.scss',\n})\nexport class GovBackdrop {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovAlertElement\n\t/**\n\t * Determide if component should have inversed colors to be used on dark background.\n\t */\n\t@Prop() readonly inverse: boolean = false\n\t/**\n\t * Adds accessible label for the backdrop that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\t/**\n\t * String of id's that indicate alternative labels elements\n\t */\n\t@Prop({ attribute: 'wcag-labelled-by' }) readonly wcagLabelledBy: string\n\t/**\n\t * Emitted when button clicks.\n\t */\n\t@Event({ eventName: 'gov-click' }) govClick: EventEmitter<MouseEvent>\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(BackdropClass.root)}>\n\t\t\t\t<div\n\t\t\t\t\trole={'button'}\n\t\t\t\t\taria-label={this.wcagLabel}\n\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\tonClick={e => this.govClick.emit(e)}\n\t\t\t\t\tclass={BackdropClass.bg}\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\tvalidateWcagLabel(this.wcagLabel, this.wcagLabelledBy, BackdropClass.root)\n\t}\n}\n"]}
+{"version":3,"file":"gov-backdrop.js","sourceRoot":"","sources":["../../../../../../src/components/gov-backdrop/gov-backdrop.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,CAAC,EAAE,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AAC9F,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,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,WAAW;EAGvB;mBAQoC,KAAK;;;IAPxC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EAoBD,KAAK,CAAC,kBAAkB;IACvB,IAAI,uBAAuB,EAAE,EAAE;MAC9B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;MAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;KACzB;EACF,CAAC;EAED,MAAM;IACL,OAAO,CACN,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC;MAC9C,WACC,IAAI,EAAE,QAAQ,gBACF,IAAI,CAAC,SAAS,qBACT,IAAI,CAAC,cAAc,EACpC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EACnC,KAAK,EAAE,aAAa,CAAC,EAAE,GACjB,CACD,CACP,CAAA;EACF,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,YAAY;IACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,aAAa,CAAC,IAAI,CAAC,CAAA;EAC3E,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Event, EventEmitter, h, Method, Prop, Host, Element } from '@stencil/core'\nimport { validateWcagLabel } from '../../helpers/Validate/wcag'\nimport { BackdropClass } from './constants'\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-backdrop',\n\tstyleUrl: 'gov-backdrop.scss',\n})\nexport class GovBackdrop {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovAlertElement\n\t/**\n\t * Determine if component should have inverse colors to be used on dark background.\n\t */\n\t@Prop() readonly inverse: boolean = false\n\t/**\n\t * Adds accessible label for the backdrop that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\t/**\n\t * String of id's that indicate alternative labels elements\n\t */\n\t@Prop({ attribute: 'wcag-labelled-by' }) readonly wcagLabelledBy: string\n\t/**\n\t * Emitted when button clicks.\n\t */\n\t@Event({ eventName: 'gov-click' }) govClick: EventEmitter<MouseEvent>\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(BackdropClass.root)}>\n\t\t\t\t<div\n\t\t\t\t\trole={'button'}\n\t\t\t\t\taria-label={this.wcagLabel}\n\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\tonClick={e => this.govClick.emit(e)}\n\t\t\t\t\tclass={BackdropClass.bg}\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\tvalidateWcagLabel(this.wcagLabel, this.wcagLabelledBy, BackdropClass.root)\n\t}\n}\n"]}

package/dist/collection/components/gov-badge/gov-badge.css

@@ -1115,6 +1115,16 @@
 .gov-badge .gov-button .element {
   border: none;
 }
+.gov-badge--has-right > .element {
+  padding-top: 0 !important;
+  padding-right: 0 !important;
+  padding-bottom: 0 !important;
+}
+.gov-badge--has-left > .element {
+  padding-top: 0 !important;
+  padding-bottom: 0 !important;
+  padding-left: 0 !important;
+}
 .gov-badge[size=xs] .element {
   border-radius: calc(var(--gov-button-xs-min-height, 1.5rem) * 0.5);
 }
@@ -1170,68 +1180,58 @@
   outline: var(--gov-outline-width, 0.125rem) solid var(--gov-color-focus-base);
   outline-offset: 0.0625rem;
 }
-.gov-badge[type=solid][variant=primary][inverse=""] .element, .gov-badge[type=solid][variant=primary][inverse=true i] .element, .gov-badge[type=solid][variant=primary][inverse="1"] .element {
+.gov-badge[variant=primary][inverse=""] .element, .gov-badge[variant=primary][inverse=true i] .element, .gov-badge[variant=primary][inverse="1"] .element {
   border-width: 0.0625rem;
   border-color: var(--gov-badge-inverse-primary-border-color, var(--gov-color-primary-200));
   background-color: var(--gov-badge-inverse-primary-bg, var(--gov-color-primary-100));
   color: var(--gov-badge-inverse-primary-color, var(--gov-color-primary));
 }
 @media not all and (pointer: coarse) {
-  .gov-badge[type=solid][variant=primary][inverse=""] .element:hover, .gov-badge[type=solid][variant=primary][inverse=true i] .element:hover, .gov-badge[type=solid][variant=primary][inverse="1"] .element:hover {
+  .gov-badge[variant=primary][inverse=""] .element:hover, .gov-badge[variant=primary][inverse=true i] .element:hover, .gov-badge[variant=primary][inverse="1"] .element:hover {
     border-color: var(--gov-badge-inverse-primary-border-color-hover, var(--gov-color-primary-100));
   }
 }
-.gov-badge[type=solid][variant=secondary][inverse=""] .element, .gov-badge[type=solid][variant=secondary][inverse=true i] .element, .gov-badge[type=solid][variant=secondary][inverse="1"] .element {
+.gov-badge[variant=secondary][inverse=""] .element, .gov-badge[variant=secondary][inverse=true i] .element, .gov-badge[variant=secondary][inverse="1"] .element {
   border-width: 0.0625rem;
   border-color: var(--gov-badge-inverse-secondary-border-color, var(--gov-color-secondary-400));
   background-color: var(--gov-badge-inverse-secondary-bg, var(--gov-color-secondary-200));
   color: var(--gov-badge-inverse-secondary-color, var(--gov-color-secondary-900));
 }
 @media not all and (pointer: coarse) {
-  .gov-badge[type=solid][variant=secondary][inverse=""] .element:hover, .gov-badge[type=solid][variant=secondary][inverse=true i] .element:hover, .gov-badge[type=solid][variant=secondary][inverse="1"] .element:hover {
+  .gov-badge[variant=secondary][inverse=""] .element:hover, .gov-badge[variant=secondary][inverse=true i] .element:hover, .gov-badge[variant=secondary][inverse="1"] .element:hover {
     border-color: var(--gov-badge-inverse-secondary-border-color-hover, var(--gov-color-secondary-400));
   }
 }
-.gov-badge[type=solid][variant=success][inverse=""] .element, .gov-badge[type=solid][variant=success][inverse=true i] .element, .gov-badge[type=solid][variant=success][inverse="1"] .element {
+.gov-badge[variant=success][inverse=""] .element, .gov-badge[variant=success][inverse=true i] .element, .gov-badge[variant=success][inverse="1"] .element {
   border-width: 0.0625rem;
   border-color: var(--gov-badge-inverse-success-border-color, var(--gov-color-success-200));
   background-color: var(--gov-badge-inverse-success-bg, var(--gov-color-success-100));
   color: var(--gov-badge-inverse-success-color, var(--gov-color-success-600));
 }
 @media not all and (pointer: coarse) {
-  .gov-badge[type=solid][variant=success][inverse=""] .element:hover, .gov-badge[type=solid][variant=success][inverse=true i] .element:hover, .gov-badge[type=solid][variant=success][inverse="1"] .element:hover {
+  .gov-badge[variant=success][inverse=""] .element:hover, .gov-badge[variant=success][inverse=true i] .element:hover, .gov-badge[variant=success][inverse="1"] .element:hover {
     border-color: var(--gov-badge-inverse-success-border-color-hover, var(--gov-color-success-100));
   }
 }
-.gov-badge[type=solid][variant=warning][inverse=""] .element, .gov-badge[type=solid][variant=warning][inverse=true i] .element, .gov-badge[type=solid][variant=warning][inverse="1"] .element {
+.gov-badge[variant=warning][inverse=""] .element, .gov-badge[variant=warning][inverse=true i] .element, .gov-badge[variant=warning][inverse="1"] .element {
   border-width: 0.0625rem;
   border-color: var(--gov-badge-inverse-warning-border-color, var(--gov-color-warning-200));
   background-color: var(--gov-badge-inverse-warning-bg, var(--gov-color-warning-100));
   color: var(--gov-badge-inverse-warning-color, var(--gov-color-warning-600));
 }
 @media not all and (pointer: coarse) {
-  .gov-badge[type=solid][variant=warning][inverse=""] .element:hover, .gov-badge[type=solid][variant=warning][inverse=true i] .element:hover, .gov-badge[type=solid][variant=warning][inverse="1"] .element:hover {
+  .gov-badge[variant=warning][inverse=""] .element:hover, .gov-badge[variant=warning][inverse=true i] .element:hover, .gov-badge[variant=warning][inverse="1"] .element:hover {
     border-color: var(--gov-badge-inverse-warning-border-color-hover, var(--gov-color-warning-100));
   }
 }
-.gov-badge[type=solid][variant=error][inverse=""] .element, .gov-badge[type=solid][variant=error][inverse=true i] .element, .gov-badge[type=solid][variant=error][inverse="1"] .element {
+.gov-badge[variant=error][inverse=""] .element, .gov-badge[variant=error][inverse=true i] .element, .gov-badge[variant=error][inverse="1"] .element {
   border-width: 0.0625rem;
   border-color: var(--gov-badge-inverse-error-border-color, var(--gov-color-error-200));
   background-color: var(--gov-badge-inverse-error-bg, var(--gov-color-error-100));
   color: var(--gov-badge-inverse-error-color, var(--gov-color-error-500));
 }
 @media not all and (pointer: coarse) {
-  .gov-badge[type=solid][variant=error][inverse=""] .element:hover, .gov-badge[type=solid][variant=error][inverse=true i] .element:hover, .gov-badge[type=solid][variant=error][inverse="1"] .element:hover {
+  .gov-badge[variant=error][inverse=""] .element:hover, .gov-badge[variant=error][inverse=true i] .element:hover, .gov-badge[variant=error][inverse="1"] .element:hover {
     border-color: var(--gov-badge-inverse-error-border-color-hover, var(--gov-color-error-500));
   }
-}
-.gov-badge--has-right > .element {
-  padding-top: 0 !important;
-  padding-bottom: 0 !important;
-  padding-right: 0 !important;
-}
-.gov-badge--has-left > .element {
-  padding-top: 0 !important;
-  padding-bottom: 0 !important;
-  padding-left: 0 !important;
 }

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

@@ -2,17 +2,16 @@ import { h, Host } from "@stencil/core";
 import { validateProp } from "../../helpers/Validate/props";
 import { govHost } from "../../helpers/Dom/template";
 import { BadgeClass, NativeType } from "./constants";
-import { ButtonSizes, ButtonVariants, Type, } from "../gov-button/default/constants";
+import { ButtonSizes, ButtonVariants, } from "../gov-button/default/constants";
 export class GovBadge {
   constructor() {
     this.inverse = false;
     this.disabled = false;
     this.href = undefined;
     this.target = undefined;
-    this.size = "m";
-    this.type = "solid";
+    this.size = ButtonSizes._M;
     this.tag = "span";
-    this.variant = "primary";
+    this.variant = ButtonVariants.PRIMARY;
     this.wcagLabel = undefined;
     this.h = govHost(this.host);
   }
@@ -22,13 +21,9 @@ export class GovBadge {
   validateSize(newValue) {
     validateProp(ButtonSizes, newValue, BadgeClass.root);
   }
-  validateType(newValue) {
-    validateProp(Type, newValue, BadgeClass.root);
-  }
   componentWillLoad() {
     this.validateVariant(this.variant);
     this.validateSize(this.size);
-    this.validateType(this.type);
   }
   render() {
     const Tag = this.href ? NativeType.A : this.tag;
@@ -37,7 +32,7 @@ export class GovBadge {
         BadgeClass.root,
         this.h.hasSlot("right") ? BadgeClass.hasRight : undefined,
         this.h.hasSlot("left") ? BadgeClass.hasLeft : undefined,
-      ]), disabled: this.disabled, href: this.href, variant: this.variant, size: this.size, type: this.type, inverse: this.inverse, hoverable: Tag == NativeType.A || Tag == NativeType.BUTTON }, h(Tag, { class: "element", href: this.href, target: this.target, "aria-label": this.wcagLabel, ref: el => (this.triggerRef = el), onClick: this.onClickHandler.bind(this), type: nativeType }, this.h.hasSlot("left") && h("slot", { name: "left" }), this.h.hasSlot("left-icon") && h("slot", { name: "left-icon" }), h("slot", null), this.h.hasSlot("right-icon") && h("slot", { name: "right-icon" }), this.h.hasSlot("right") && h("slot", { name: "right" }))));
+      ]), disabled: this.disabled, href: this.href, variant: this.variant, size: this.size, inverse: this.inverse, hoverable: Tag == NativeType.A || Tag == NativeType.BUTTON }, h(Tag, { class: "element", href: this.href, target: this.target, "aria-label": this.wcagLabel, ref: el => (this.triggerRef = el), onClick: this.onClickHandler.bind(this), type: nativeType }, this.h.hasSlot("left") && h("slot", { name: "left" }), this.h.hasSlot("left-icon") && h("slot", { name: "left-icon" }), h("slot", null), this.h.hasSlot("right-icon") && h("slot", { name: "right-icon" }), this.h.hasSlot("right") && h("slot", { name: "right" }))));
   }
   onClickHandler(e) {
     e.stopPropagation();
@@ -76,7 +71,7 @@ export class GovBadge {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Determide if component should have inversed colors to be used on dark background"
+          "text": "Determine if component should have inverse colors to be used on dark background"
         },
         "attribute": "inverse",
         "reflect": false,
@@ -162,31 +157,7 @@ export class GovBadge {
         },
         "attribute": "size",
         "reflect": false,
-        "defaultValue": "\"m\""
-      },
-      "type": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "TypesType",
-          "resolved": "\"base\" | \"link\" | \"outlined\" | \"solid\"",
-          "references": {
-            "TypesType": {
-              "location": "import",
-              "path": "../gov-button/default/constants",
-              "id": "../../../packages/core/src/components/gov-button/default/constants.ts::TypesType"
-            }
-          }
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "Badges's type"
-        },
-        "attribute": "type",
-        "reflect": false,
-        "defaultValue": "\"solid\""
+        "defaultValue": "ButtonSizes._M"
       },
       "tag": {
         "type": "string",
@@ -206,7 +177,7 @@ export class GovBadge {
         "optional": false,
         "docs": {
           "tags": [],
-          "text": "Used to change the HMTL tag in the badge"
+          "text": "Used to change the HTML tag in the badge"
         },
         "attribute": "tag",
         "reflect": false,
@@ -234,7 +205,7 @@ export class GovBadge {
         },
         "attribute": "variant",
         "reflect": false,
-        "defaultValue": "\"primary\""
+        "defaultValue": "ButtonVariants.PRIMARY"
       },
       "wcagLabel": {
         "type": "string",
@@ -319,9 +290,6 @@ export class GovBadge {
       }, {
         "propName": "size",
         "methodName": "validateSize"
-      }, {
-        "propName": "type",
-        "methodName": "validateType"
       }];
   }
 }

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

@@ -1 +1 @@
-{"version":3,"file":"gov-badge.js","sourceRoot":"","sources":["../../../../../../src/components/gov-badge/gov-badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, Watch } from \"@stencil/core\"\nimport { GovHost } from \"../../helpers/Dom/template.types\"\nimport { validateProp } from \"../../helpers/Validate/props\"\nimport { govHost } from \"../../helpers/Dom/template\"\nimport { BadgeClass, NativeType, NativeTypesType } from \"./constants\"\nimport {\n\tButtonSizes,\n\tButtonSizesType,\n\tButtonVariants,\n\tButtonVariantType,\n\tType,\n\tTypesType,\n} from \"../gov-button/default/constants\"\n\n@Component({\n\ttag: \"gov-badge\",\n\tstyleUrl: \"gov-badge.scss\",\n})\nexport class GovBadge {\n\tprivate triggerRef?: HTMLButtonElement | HTMLLinkElement | HTMLSpanElement\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovBadgeElement\n\n\t/**\n\t * Determide if component should have inversed colors to be used on dark background\n\t */\n\t@Prop() readonly inverse: boolean = false\n\t/**\n\t * Makes the badge component disabled.\n\t * This prevents users from being able to interact with the button, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean = false\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href\n\t */\n\t@Prop() readonly href: string\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-target\n\t */\n\t@Prop() readonly target: string\n\t/**\n\t * Badge’s size.\n\t */\n\t@Prop() readonly size: ButtonSizesType = \"m\"\n\t/**\n\t * Badges's type\n\t */\n\t@Prop() readonly type: TypesType = \"solid\"\n\t/**\n\t * Used to change the HMTL tag in the badge\n\t */\n\t@Prop() readonly tag: NativeTypesType = \"span\"\n\t/**\n\t * Style variation of the badge.\n\t */\n\t@Prop() readonly variant: ButtonVariantType = \"primary\"\n\t/**\n\t * Adds accessible label for the button that is only shown for screen readers.\n\t * Typically, this label text replaces the visible text on the button for users who use assistive technology.\n\t */\n\t@Prop({ attribute: \"wcag-label\" }) readonly wcagLabel: string\n\t/**\n\t * Emitted when the button click.\n\t */\n\t@Event({ eventName: \"gov-click\" }) govClick: EventEmitter<PointerEvent>\n\n\t@Watch(\"variant\")\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(ButtonVariants, newValue, BadgeClass.root)\n\t}\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(ButtonSizes, newValue, BadgeClass.root)\n\t}\n\n\t@Watch(\"type\")\n\tvalidateType(newValue: string): void {\n\t\tvalidateProp(Type, newValue, BadgeClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t\tthis.validateType(this.type)\n\t}\n\n\trender() {\n\t\tconst Tag = this.href ? NativeType.A : this.tag\n\t\tconst nativeType = Tag == NativeType.BUTTON ? NativeType.BUTTON : undefined\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={this.h.classes([\n\t\t\t\t\tBadgeClass.root,\n\t\t\t\t\tthis.h.hasSlot(\"right\") ? BadgeClass.hasRight : undefined,\n\t\t\t\t\tthis.h.hasSlot(\"left\") ? BadgeClass.hasLeft : undefined,\n\t\t\t\t])}\n\t\t\t\tdisabled={this.disabled}\n\t\t\t\thref={this.href}\n\t\t\t\tvariant={this.variant}\n\t\t\t\tsize={this.size}\n\t\t\t\ttype={this.type}\n\t\t\t\tinverse={this.inverse}\n\t\t\t\thoverable={Tag == NativeType.A || Tag == NativeType.BUTTON}\n\t\t\t>\n\t\t\t\t<Tag\n\t\t\t\t\tclass=\"element\"\n\t\t\t\t\thref={this.href}\n\t\t\t\t\ttarget={this.target}\n\t\t\t\t\taria-label={this.wcagLabel}\n\t\t\t\t\tref={el => (this.triggerRef = el as HTMLLinkElement | HTMLButtonElement | HTMLSpanElement)}\n\t\t\t\t\tonClick={this.onClickHandler.bind(this)}\n\t\t\t\t\ttype={nativeType}>\n\t\t\t\t\t{this.h.hasSlot(\"left\") && <slot name=\"left\"></slot>}\n\t\t\t\t\t{this.h.hasSlot(\"left-icon\") && <slot name=\"left-icon\"></slot>}\n\t\t\t\t\t<slot />\n\t\t\t\t\t{this.h.hasSlot(\"right-icon\") && <slot name=\"right-icon\"></slot>}\n\t\t\t\t\t{this.h.hasSlot(\"right\") && <slot name=\"right\"></slot>}\n\t\t\t\t</Tag>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onClickHandler(e: PointerEvent): void {\n\t\te.stopPropagation()\n\t\tif (this.disabled === false && this.tag === NativeType.BUTTON) {\n\t\t\tthis.govClick.emit(e)\n\t\t}\n\t}\n\n\t/**\n\t * Returns a clickable element instance\n\t */\n\t@Method()\n\tasync getTriggerRef() {\n\t\treturn this.triggerRef\n\t}\n}\n"]}
+{"version":3,"file":"gov-badge.js","sourceRoot":"","sources":["../../../../../../src/components/gov-badge/gov-badge.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, Watch } from \"@stencil/core\"\nimport { GovHost } from \"../../helpers/Dom/template.types\"\nimport { validateProp } from \"../../helpers/Validate/props\"\nimport { govHost } from \"../../helpers/Dom/template\"\nimport { BadgeClass, NativeType, NativeTypesType } from \"./constants\"\nimport {\n\tButtonSizes,\n\tButtonSizesType,\n\tButtonVariants,\n\tButtonVariantType,\n} from \"../gov-button/default/constants\"\n\n@Component({\n\ttag: \"gov-badge\",\n\tstyleUrl: \"gov-badge.scss\",\n})\nexport class GovBadge {\n\tprivate triggerRef?: HTMLButtonElement | HTMLLinkElement | HTMLSpanElement\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() host: HTMLGovBadgeElement\n\n\t/**\n\t * Determine if component should have inverse colors to be used on dark background\n\t */\n\t@Prop() readonly inverse: boolean = false\n\t/**\n\t * Makes the badge component disabled.\n\t * This prevents users from being able to interact with the button, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean = false\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-href\n\t */\n\t@Prop() readonly href: string\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#attr-target\n\t */\n\t@Prop() readonly target: string\n\t/**\n\t * Badge’s size.\n\t */\n\t@Prop() readonly size: ButtonSizesType = ButtonSizes._M\n\t/**\n\t * Used to change the HTML tag in the badge\n\t */\n\t@Prop() readonly tag: NativeTypesType = \"span\"\n\t/**\n\t * Style variation of the badge.\n\t */\n\t@Prop() readonly variant: ButtonVariantType = ButtonVariants.PRIMARY\n\t/**\n\t * Adds accessible label for the button that is only shown for screen readers.\n\t * Typically, this label text replaces the visible text on the button for users who use assistive technology.\n\t */\n\t@Prop({ attribute: \"wcag-label\" }) readonly wcagLabel: string\n\t/**\n\t * Emitted when the button click.\n\t */\n\t@Event({ eventName: \"gov-click\" }) govClick: EventEmitter<PointerEvent>\n\n\t@Watch(\"variant\")\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(ButtonVariants, newValue, BadgeClass.root)\n\t}\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(ButtonSizes, newValue, BadgeClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t}\n\n\trender() {\n\t\tconst Tag = this.href ? NativeType.A : this.tag\n\t\tconst nativeType = Tag == NativeType.BUTTON ? NativeType.BUTTON : undefined\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={this.h.classes([\n\t\t\t\t\tBadgeClass.root,\n\t\t\t\t\tthis.h.hasSlot(\"right\") ? BadgeClass.hasRight : undefined,\n\t\t\t\t\tthis.h.hasSlot(\"left\") ? BadgeClass.hasLeft : undefined,\n\t\t\t\t])}\n\t\t\t\tdisabled={this.disabled}\n\t\t\t\thref={this.href}\n\t\t\t\tvariant={this.variant}\n\t\t\t\tsize={this.size}\n\t\t\t\tinverse={this.inverse}\n\t\t\t\thoverable={Tag == NativeType.A || Tag == NativeType.BUTTON}\n\t\t\t>\n\t\t\t\t<Tag\n\t\t\t\t\tclass=\"element\"\n\t\t\t\t\thref={this.href}\n\t\t\t\t\ttarget={this.target}\n\t\t\t\t\taria-label={this.wcagLabel}\n\t\t\t\t\tref={el => (this.triggerRef = el as HTMLLinkElement | HTMLButtonElement | HTMLSpanElement)}\n\t\t\t\t\tonClick={this.onClickHandler.bind(this)}\n\t\t\t\t\ttype={nativeType}>\n\t\t\t\t\t{this.h.hasSlot(\"left\") && <slot name=\"left\"></slot>}\n\t\t\t\t\t{this.h.hasSlot(\"left-icon\") && <slot name=\"left-icon\"></slot>}\n\t\t\t\t\t<slot />\n\t\t\t\t\t{this.h.hasSlot(\"right-icon\") && <slot name=\"right-icon\"></slot>}\n\t\t\t\t\t{this.h.hasSlot(\"right\") && <slot name=\"right\"></slot>}\n\t\t\t\t</Tag>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onClickHandler(e: PointerEvent): void {\n\t\te.stopPropagation()\n\t\tif (this.disabled === false && this.tag === NativeType.BUTTON) {\n\t\t\tthis.govClick.emit(e)\n\t\t}\n\t}\n\n\t/**\n\t * Returns a clickable element instance\n\t */\n\t@Method()\n\tasync getTriggerRef() {\n\t\treturn this.triggerRef\n\t}\n}\n"]}