@gov-design-system-ce/components 0.0.1

package/dist/esm/gov-attachments_3.entry.js

@@ -0,0 +1,108 @@
+import { r as registerInstance, h, H as Host, g as getElement, c as createEvent } from './index-e498b7fa.js';
+import { c as canValidateWcagOnRender, d as validateWcagProp, v as validateWcagLabel } from './win-fe20a39d.js';
+import { d as delay } from './utils-43789c71.js';
+import { F as FormMessageClass, V as Variants$1 } from './constants-9aaa1aa0.js';
+import { g as govHost } from './template-c616c14f.js';
+import { V as Variants } from './variants-3bade035.js';
+import { v as validateProp } from './props-5a1380a0.js';
+import { c as createID } from './string.utils-858e1565.js';
+import './gov.log-3b6eb67c.js';
+
+const AttachmentsClass = {
+  root: "gov-attachments",
+  label: "gov-attachments__label",
+};
+const AttachmentsItemClass = {
+  root: 'gov-attachments-item',
+  name: 'gov-attachments-item__name',
+};
+
+const govAttachmentsCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}.gov-attachments{display:block;width:100%}.gov-attachments__label{font-weight:var(--gov-text-s-font-weight);font-size:var(--gov-text-s-font-size);line-height:var(--gov-text-s-line-height);letter-spacing:var(--gov-text-s-letter-spacing);color:var(--gov-form-label-color, #686868)}";
+
+const GovAttachments = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.label = undefined;
+    this.wcagLabel = undefined;
+  }
+  async componentDidRender() {
+    if (canValidateWcagOnRender()) {
+      await delay(500);
+      await this.validateWcag();
+    }
+  }
+  render() {
+    return (h(Host, { class: AttachmentsClass.root }, this.label ? (h("p", { class: AttachmentsClass.label }, this.label)) : null, h("div", { role: "list", "aria-label": this.wcagLabel }, h("slot", null))));
+  }
+  /**
+   * Validate the WCAG attributes of the component
+   */
+  async validateWcag() {
+    validateWcagProp(this.wcagLabel, "wcag-label", AttachmentsClass.root);
+  }
+  get host() { return getElement(this); }
+};
+GovAttachments.style = govAttachmentsCss;
+
+const govAttachmentsItemCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}.gov-attachments-item{display:flex;gap:1rem;width:100%;margin:0rem 0rem 0.5rem}.gov-attachments-item:last-child{margin:0}.gov-attachments-item__name{display:flex;gap:0 0.5rem;flex-wrap:wrap;align-items:center;align-self:center;color:var(--gov-attachments-name-color, var(--gov-color-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))}";
+
+const GovAttachmentsItem = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.govRemove = createEvent(this, "gov-remove", 7);
+    this.wcagRemoveLabel = undefined;
+    this.wcagRemoveLabelledBy = undefined;
+  }
+  async componentDidRender() {
+    if (canValidateWcagOnRender()) {
+      await delay(500);
+      await this.validateWcag();
+    }
+  }
+  render() {
+    return (h(Host, { class: AttachmentsItemClass.root, role: "listitem" }, h("span", { class: AttachmentsItemClass.name }, h("slot", null), h("slot", { name: "info" })), h("gov-button", { variant: "primary", type: "base", size: "s", "wcag-label": this.wcagRemoveLabel, "wcag-labelled-by": this.wcagRemoveLabelledBy, "on-gov-click": this.govRemove.emit }, h("gov-icon", { slot: "left-icon", name: "cross" }))));
+  }
+  /**
+   * Validate the WCAG attributes of the component
+   */
+  async validateWcag() {
+    validateWcagLabel(this.wcagRemoveLabel, this.wcagRemoveLabelledBy, AttachmentsItemClass.root);
+  }
+  get host() { return getElement(this); }
+};
+GovAttachmentsItem.style = govAttachmentsItemCss;
+
+const govFormMessageCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}.gov-form-message{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);display:flex;gap:0.5rem;margin:0rem 0rem 1rem}.gov-form-message__icon{position:relative;top:calc(var(--gov-text-xs-font-size) / 6);display:flex}.gov-form-message__icon>*{width:calc(var(--gov-text-xs-font-size) * 1.167);height:calc(var(--gov-text-xs-font-size) * 1.167)}.gov-form-message[variant=error]{color:var(--gov-form-message-error-color, var(--gov-color-error-400))}.gov-form-message[variant=secondary]{color:var(--gov-form-message-secondary-color, var(--gov-color-secondary-700))}.gov-form-message[variant=warning]{color:var(--gov-form-message-warning-color, var(--gov-color-warning-500))}.gov-form-message[variant=success]{color:var(--gov-form-message-success-color, var(--gov-color-success-500))}";
+
+const GovFormMessage = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.variant = Variants.SECONDARY;
+    this.h = govHost(this.host);
+    this.messageId = createID("GovFormMessage");
+  }
+  validateVariant(newValue) {
+    validateProp(Variants$1, newValue, FormMessageClass.root);
+  }
+  componentWillLoad() {
+    this.validateVariant(this.variant);
+  }
+  render() {
+    return (h(Host, { class: this.h.classes(FormMessageClass.root), variant: this.variant }, this.h.hasSlot("icon") && (h("span", { class: FormMessageClass.icon }, h("slot", { name: "icon" }))), h("span", { id: this.messageId, class: FormMessageClass.content }, h("slot", null))));
+  }
+  /**
+   * Returns unique identfiier of message
+   */
+  async identifier() {
+    return this.messageId;
+  }
+  get host() { return getElement(this); }
+  static get watchers() { return {
+    "variant": ["validateVariant"]
+  }; }
+};
+GovFormMessage.style = govFormMessageCss;
+
+export { GovAttachments as gov_attachments, GovAttachmentsItem as gov_attachments_item, GovFormMessage as gov_form_message };
+
+//# sourceMappingURL=gov-attachments_3.entry.js.map

package/dist/esm/gov-attachments_3.entry.js.map

@@ -0,0 +1 @@
+{"file":"gov-attachments.gov-attachments-item.gov-form-message.entry.js","mappings":"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","names":["GlobalVariants","Variants"],"sources":["../../../packages/core/src/components/gov-attachments/constants.ts","../../../packages/core/src/components/gov-attachments/gov-attachments.scss?tag=gov-attachments","../../../packages/core/src/components/gov-attachments/gov-attachments.tsx","../../../packages/core/src/components/gov-attachments/gov-attachments-item.scss?tag=gov-attachments-item","../../../packages/core/src/components/gov-attachments/gov-attachments-item.tsx","../../../packages/core/src/components/gov-form/message/gov-form-message.scss?tag=gov-form-message","../../../packages/core/src/components/gov-form/message/gov-form-message.tsx"],"sourcesContent":["export const AttachmentsClass = {\n\troot: \"gov-attachments\",\n\tlabel: \"gov-attachments__label\",\n}\n\nexport const AttachmentsItemClass = {\n\troot: 'gov-attachments-item',\n\tname: 'gov-attachments-item__name',\n}\n","/*\n *   Attachments\n */\n\n$class: \".gov-attachments\";\n\n#{$class} {\n\tdisplay: block;\n\twidth: 100%;\n\t&__label {\n\t\t@include typography($font-size-s);\n\t\tcolor: $form-label-color;\n\t}\n}\n","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\"\n\n@Component({\n\ttag: \"gov-attachments\",\n\tstyleUrl: \"gov-attachments.scss\",\n})\nexport class GovAttachments {\n\t@Element() readonly host: HTMLGovAttachmentsElement\n\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={AttachmentsClass.root}>\n\t\t\t\t{this.label ? (\n\t\t\t\t\t<p class={AttachmentsClass.label}>\n\t\t\t\t\t\t{this.label}\n\t\t\t\t\t</p>\n\t\t\t\t) : null}\n\t\t\t\t<div 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}\n","/*\n *   Attachments - Item\n */\n\n$class: \".gov-attachments-item\";\n\n#{$class} {\n\tdisplay: flex;\n\tgap: rem-calc(16);\n\twidth: 100%;\n\tmargin: rem-calc(0 0 8);\n\t&:last-child {\n\t\tmargin: 0;\n\t}\n\t&__name {\n\t\tdisplay: flex;\n\t\tgap: 0 rem-calc(8);\n\t\tflex-wrap: wrap;\n\t\talign-items: center;\n\t\talign-self: center;\n\t\tcolor: $attachments-name-color;\n\t\tspan {\n\t\t\t@include typography($font-size-xs);\n\t\t\tcolor: $attachments-decor-color;\n\t\t}\n\t}\n}\n","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\"\n\n@Component({\n\ttag: \"gov-attachments-item\",\n\tstyleUrl: \"gov-attachments-item.scss\",\n})\nexport class GovAttachmentsItem {\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\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={AttachmentsItemClass.root} role=\"listitem\">\n\t\t\t\t<span class={AttachmentsItemClass.name}>\n\t\t\t\t\t<slot />\n\t\t\t\t\t<slot name=\"info\" />\n\t\t\t\t</span>\n\n\t\t\t\t<gov-button\n\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\ttype=\"base\"\n\t\t\t\t\tsize=\"s\"\n\t\t\t\t\twcag-label={this.wcagRemoveLabel}\n\t\t\t\t\twcag-labelled-by={this.wcagRemoveLabelledBy}\n\t\t\t\t\ton-gov-click={this.govRemove.emit}>\n\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"cross\"></gov-icon>\n\t\t\t\t</gov-button>\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","/*\n *   Form Message\n */\n\n$class: \".gov-form-message\";\n$font-size: $font-size-xs;\n\n#{$class} {\n\t@include typography($font-size);\n\tdisplay: flex;\n\tgap: rem-calc(8);\n\tmargin: rem-calc(0 0 16);\n\t&__icon {\n\t\tposition: relative;\n\t\ttop: calc(var(--gov-text-#{$font-size}-font-size) / 6);\n\t\tdisplay: flex;\n\t\t& > * {\n\t\t\twidth: calc(var(--gov-text-#{$font-size}-font-size) * 1.167);\n\t\t\theight: calc(var(--gov-text-#{$font-size}-font-size) * 1.167);\n\t\t}\n\t}\n\n\t@each $variant, $definitions in $form-message-variants {\n\t\t&[variant=\"#{$variant}\"] {\n\t\t\tcolor: get(\"color\", $definitions);\n\t\t}\n\t}\n}\n","import { Component, Element, h, Host, Method, Prop, Watch } from \"@stencil/core\"\nimport { FormMessageClass, Variants, VariantType } from \"./constants\"\nimport { govHost } from \"../../../helpers/Dom/template\"\nimport { GovHost } from \"../../../helpers/Dom/template.d\"\nimport { Variants as GlobalVariants } from \"../../../core/constants/variants\"\nimport { validateProp } from \"../../../helpers/Validate/props\"\nimport { createID } from \"../../../utils/string.utils\"\n\n@Component({\n\ttag: \"gov-form-message\",\n\tstyleUrl: \"gov-form-message.scss\",\n})\nexport class GovFormMessage {\n\th: GovHost\n\tprivate readonly messageId: string\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.messageId = createID(\"GovFormMessage\")\n\t}\n\n\t@Element() host: HTMLGovFormMessageElement\n\t/**\n\t * Style variation of the mesage.\n\t */\n\t@Prop({ attribute: \"variant\" }) readonly variant?: VariantType = GlobalVariants.SECONDARY\n\n\t@Watch(\"variant\")\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(Variants, newValue, FormMessageClass.root)\n\t}\n\n\tcomponentWillLoad(): void {\n\t\tthis.validateVariant(this.variant)\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(FormMessageClass.root)} variant={this.variant}>\n\t\t\t\t{this.h.hasSlot(\"icon\") && (\n\t\t\t\t\t<span class={FormMessageClass.icon}>\n\t\t\t\t\t\t<slot name=\"icon\" />\n\t\t\t\t\t</span>\n\t\t\t\t)}\n\t\t\t\t<span id={this.messageId} class={FormMessageClass.content}>\n\t\t\t\t\t<slot />\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Returns unique identfiier of message\n\t */\n\t@Method()\n\tasync identifier(): Promise<string> {\n\t\treturn this.messageId\n\t}\n}\n"],"version":3}

package/dist/esm/gov-backdrop.entry.js

@@ -0,0 +1,43 @@
+import { r as registerInstance, c as createEvent, h } from './index-e498b7fa.js';
+import { c as canValidateWcagOnRender, v as validateWcagLabel } from './win-fe20a39d.js';
+import { d as delay } from './utils-43789c71.js';
+import './gov.log-3b6eb67c.js';
+import './string.utils-858e1565.js';
+
+const BackdropClass = {
+  root: 'gov-backdrop',
+};
+
+const govBackdropCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}.gov-backdrop{z-index:100;position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--gov-backdrop-bg, var(--gov-color-secondary));opacity:0;transition:opacity 150ms;will-change:opacity}.gov-backdrop.is-visible{opacity:var(--gov-backdrop-opacity, 0.45)}";
+
+const GovBackdrop = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.govClick = createEvent(this, "gov-click", 7);
+    this.visible = false;
+    this.wcagLabel = undefined;
+    this.wcagLabelledBy = undefined;
+  }
+  async componentDidRender() {
+    if (canValidateWcagOnRender()) {
+      await delay(500);
+      await this.validateWcag();
+    }
+  }
+  render() {
+    if (!this.visible)
+      return null;
+    return (h("div", { role: 'button', "aria-label": this.wcagLabel, "aria-labelledby": this.wcagLabelledBy, onClick: (e) => this.govClick.emit(e), class: "gov-backdrop is-visible" }));
+  }
+  /**
+   * Validate the WCAG attributes of the component
+   */
+  async validateWcag() {
+    validateWcagLabel(this.wcagLabel, this.wcagLabelledBy, BackdropClass.root);
+  }
+};
+GovBackdrop.style = govBackdropCss;
+
+export { GovBackdrop as gov_backdrop };
+
+//# sourceMappingURL=gov-backdrop.entry.js.map

package/dist/esm/gov-backdrop.entry.js.map

@@ -0,0 +1 @@
+{"file":"gov-backdrop.entry.js","mappings":";;;;;;AAAO,MAAM,aAAa,GAAG;EAC5B,IAAI,EAAE,cAAc;CACpB;;ACFD,MAAM,cAAc,GAAG,+YAA+Y;;MCUzZ,WAAW;;;;mBAII,KAAK;;;;EAchC,MAAM,kBAAkB;IACvB,IAAI,uBAAuB,EAAE,EAAE;MAC9B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;MAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;KACzB;GACD;EAED,MAAM;IACL,IAAI,CAAC,IAAI,CAAC,OAAO;MAAE,OAAO,IAAI,CAAA;IAC9B,QACC,WAAK,IAAI,EAAE,QAAQ,gBACF,IAAI,CAAC,SAAS,qBACT,IAAI,CAAC,cAAc,EACpC,OAAO,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EACrC,KAAK,EAAC,yBAAyB,GAC9B,EACN;GACD;;;;EAMD,MAAM,YAAY;IACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,aAAa,CAAC,IAAI,CAAC,CAAA;GAC1E;;;;;;","names":[],"sources":["../../../packages/core/src/components/gov-backdrop/constants.ts","../../../packages/core/src/components/gov-backdrop/gov-backdrop.scss?tag=gov-backdrop","../../../packages/core/src/components/gov-backdrop/gov-backdrop.tsx"],"sourcesContent":["export const BackdropClass = {\n\troot: 'gov-backdrop',\n}\n","/*\n *   Backdrop\n */\n\n$class: \".gov-backdrop\";\n\n#{$class} {\n\t@include z-index(\"modal\", 0);\n\tposition: fixed;\n\ttop: 0;\n\tright: 0;\n\tbottom: 0;\n\tleft: 0;\n\tbackground-color: $backdrop-bg;\n\topacity: 0;\n\ttransition: opacity $t;\n\twill-change: opacity;\n\t&.is-visible {\n\t\topacity: $backdrop-opacity;\n\t}\n}\n","import { Component, Event, EventEmitter, h, Method, Prop } from \"@stencil/core\"\nimport { validateWcagLabel } from \"../../helpers/Validate/wcag\"\nimport { BackdropClass } from \"./constants\"\nimport { canValidateWcagOnRender } from \"../../helpers/Dom/win\"\nimport { delay } from \"../../utils/utils\"\n\n@Component({\n\ttag: \"gov-backdrop\",\n\tstyleUrl: \"gov-backdrop.scss\",\n})\nexport class GovBackdrop {\n\t/**\n\t * Default attribute for backdrop display\n\t */\n\t@Prop() visible: 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\tif (!this.visible) return null\n\t\treturn (\n\t\t\t<div role={'button'}\n\t\t\t     aria-label={this.wcagLabel}\n\t\t\t     aria-labelledby={this.wcagLabelledBy}\n\t\t\t     onClick={(e) => this.govClick.emit(e)}\n\t\t\t     class=\"gov-backdrop is-visible\">\n\t\t\t</div>\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}\n"],"version":3}

package/dist/esm/gov-badge.entry.js

@@ -0,0 +1,79 @@
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-e498b7fa.js';
+import { v as validateProp } from './props-5a1380a0.js';
+import { S as Sizes } from './sizes-6c5943b4.js';
+import { g as govHost } from './template-c616c14f.js';
+import { T as Types } from './constants-7a8adcd1.js';
+import { V as Variants } from './variants-3bade035.js';
+import './gov.log-3b6eb67c.js';
+
+var NativeType;
+(function (NativeType) {
+  NativeType["SPAN"] = "span";
+  NativeType["BUTTON"] = "button";
+})(NativeType || (NativeType = {}));
+const BadgeClass = {
+  root: "gov-badge",
+  inner: "gov-badge__inner",
+};
+
+const govBadgeCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}.gov-badge{display:inline-flex}.gov-badge .element{margin:0;padding:0;font-family:\"Roboto\", sans-serif;font-weight:400;box-sizing:border-box;display:inline-flex;vertical-align:middle;justify-content:center;align-items:center;border:0;background-color:transparent;text-align:center;text-decoration:none;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:var(--gov-button-border-width, 0.0625rem) solid transparent;transition:background-color 150ms ease-in-out, border-color 150ms ease-in-out, color 150ms ease-in-out;cursor:inherit;will-change:background-color, border-color}.gov-badge .element:focus{outline:none}.gov-badge .element .gov-icon{flex:0 0 auto;color:inherit}.gov-badge .element>*{display:flex}[hoverable].gov-badge .element{cursor:pointer}[hoverable].gov-badge .element:focus{outline:none}[hoverable].gov-badge .element:focus-visible{border-radius:var(--gov-border-radius, 0.1875rem);outline:var(--gov-outline-width, 0.125rem) solid var(--gov-color-focus-base);outline-offset:0.0625rem}[hoverable][type=outlined].gov-badge .element:focus-visible,[hoverable][type=base].gov-badge .element:focus-visible{outline-offset:0}[hoverable][disabled=\"\"].gov-badge,[hoverable][disabled=true i].gov-badge,[hoverable][disabled=\"1\"].gov-badge{cursor:not-allowed}[hoverable][disabled=\"\"].gov-badge .element,[hoverable][disabled=true i].gov-badge .element,[hoverable][disabled=\"1\"].gov-badge .element{pointer-events:none}[expanded=\"\"].gov-badge,[expanded=true i].gov-badge,[expanded=\"1\"].gov-badge{display:block}[expanded=\"\"].gov-badge .element,[expanded=true i].gov-badge .element,[expanded=\"1\"].gov-badge .element{display:flex;width:100%;margin-right:0;margin-left:0}[type=solid][variant=primary].gov-badge .element{background-color:var(--gov-button-primary-solid-bg, var(--gov-color-primary));color:var(--gov-button-primary-solid-color, var(--gov-color-secondary-100));border-width:0}[type=solid][variant=primary][inverse=\"\"].gov-badge .element,[type=solid][variant=primary][inverse=true i].gov-badge .element,[type=solid][variant=primary][inverse=\"1\"].gov-badge .element{color:var(--gov-button-primary-solid-inverse-color, var(--gov-color-primary));background-color:var(--gov-button-primary-solid-inverse-bg, var(--gov-color-secondary-100))}[type=solid][variant=primary][disabled=\"\"].gov-badge .element,[type=solid][variant=primary][disabled=true i].gov-badge .element,[type=solid][variant=primary][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-primary-solid-disabled-bg, var(--gov-color-primary-300));color:var(--gov-button-primary-solid-disabled-color, var(--gov-color-secondary-100))}[type=solid][variant=primary][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=solid][variant=primary][disabled=\"\"][inverse=true i].gov-badge .element,[type=solid][variant=primary][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=solid][variant=primary][disabled=true i][inverse=\"\"].gov-badge .element,[type=solid][variant=primary][disabled=true i][inverse=true i].gov-badge .element,[type=solid][variant=primary][disabled=true i][inverse=\"1\"].gov-badge .element,[type=solid][variant=primary][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=solid][variant=primary][disabled=\"1\"][inverse=true i].gov-badge .element,[type=solid][variant=primary][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-primary-solid-inverse-color, var(--gov-color-primary));opacity:0.6;background-color:var(--gov-button-primary-solid-inverse-bg, var(--gov-color-secondary-100))}@media not all and (pointer: coarse){[type=solid][variant=primary][hoverable].gov-badge .element:hover{background-color:var(--gov-button-primary-solid-hover-bg, var(--gov-color-primary-700));color:var(--gov-button-primary-solid-hover-color, var(--gov-color-secondary-100))}[type=solid][variant=primary][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-primary-solid-active-bg, var(--gov-color-primary-800))}}@media not all and (pointer: coarse){[type=solid][variant=primary][hoverable][inverse=\"\"].gov-badge .element:hover,[type=solid][variant=primary][hoverable][inverse=true i].gov-badge .element:hover,[type=solid][variant=primary][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-primary-solid-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-primary-solid-inverse-hover-color, var(--gov-color-primary-700))}[type=solid][variant=primary][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=solid][variant=primary][hoverable][inverse=true i].gov-badge .element:hover:active,[type=solid][variant=primary][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-primary-solid-inverse-active-color, var(--gov-color-primary-800))}}[type=outlined][variant=primary].gov-badge .element{color:var(--gov-button-primary-outlined-color, var(--gov-color-primary));border-color:var(--gov-button-primary-outlined-border, var(--gov-color-primary))}[type=outlined][variant=primary][inverse=\"\"].gov-badge .element,[type=outlined][variant=primary][inverse=true i].gov-badge .element,[type=outlined][variant=primary][inverse=\"1\"].gov-badge .element{color:var(--gov-button-primary-outlined-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-primary-outlined-inverse-bg, transparent);border-color:var(--gov-button-primary-outlined-inverse-border, var(--gov-color-secondary-100))}[type=outlined][variant=primary][disabled=\"\"].gov-badge .element,[type=outlined][variant=primary][disabled=true i].gov-badge .element,[type=outlined][variant=primary][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-primary-outlined-disabled-bg, transparent);color:var(--gov-button-primary-outlined-disabled-color, var(--gov-color-primary-400));border-color:var(--gov-button-primary-outlined-disabled-border, var(--gov-color-primary-300))}[type=outlined][variant=primary][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=primary][disabled=\"\"][inverse=true i].gov-badge .element,[type=outlined][variant=primary][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=outlined][variant=primary][disabled=true i][inverse=\"\"].gov-badge .element,[type=outlined][variant=primary][disabled=true i][inverse=true i].gov-badge .element,[type=outlined][variant=primary][disabled=true i][inverse=\"1\"].gov-badge .element,[type=outlined][variant=primary][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=primary][disabled=\"1\"][inverse=true i].gov-badge .element,[type=outlined][variant=primary][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-primary-outlined-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-primary-outlined-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=outlined][variant=primary][hoverable].gov-badge .element:hover{background-color:var(--gov-button-primary-outlined-hover-bg, var(--gov-color-primary-100));color:var(--gov-button-primary-outlined-hover-color, var(--gov-color-primary))}[type=outlined][variant=primary][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-primary-outlined-active-bg, var(--gov-color-primary-300))}}@media not all and (pointer: coarse){[type=outlined][variant=primary][hoverable][inverse=\"\"].gov-badge .element:hover,[type=outlined][variant=primary][hoverable][inverse=true i].gov-badge .element:hover,[type=outlined][variant=primary][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-primary-outlined-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-primary-outlined-inverse-hover-color, var(--gov-color-primary))}[type=outlined][variant=primary][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=outlined][variant=primary][hoverable][inverse=true i].gov-badge .element:hover:active,[type=outlined][variant=primary][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-primary-outline-inverse-active-color, var(--gov-color-primary-700))}}[type=base][variant=primary].gov-badge .element{color:var(--gov-button-primary-base-color, var(--gov-color-primary));border-width:0}[type=base][variant=primary][inverse=\"\"].gov-badge .element,[type=base][variant=primary][inverse=true i].gov-badge .element,[type=base][variant=primary][inverse=\"1\"].gov-badge .element{color:var(--gov-button-primary-base-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-primary-base-inverse-bg, transparent)}[type=base][variant=primary][disabled=\"\"].gov-badge .element,[type=base][variant=primary][disabled=true i].gov-badge .element,[type=base][variant=primary][disabled=\"1\"].gov-badge .element{color:var(--gov-button-primary-base-disabled-color, var(--gov-color-primary-400))}[type=base][variant=primary][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=base][variant=primary][disabled=\"\"][inverse=true i].gov-badge .element,[type=base][variant=primary][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=base][variant=primary][disabled=true i][inverse=\"\"].gov-badge .element,[type=base][variant=primary][disabled=true i][inverse=true i].gov-badge .element,[type=base][variant=primary][disabled=true i][inverse=\"1\"].gov-badge .element,[type=base][variant=primary][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=base][variant=primary][disabled=\"1\"][inverse=true i].gov-badge .element,[type=base][variant=primary][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-primary-base-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-primary-base-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=base][variant=primary][hoverable].gov-badge .element:hover{background-color:var(--gov-button-primary-base-hover-bg, var(--gov-color-primary-100));color:var(--gov-button-primary-base-hover-color, var(--gov-color-primary))}[type=base][variant=primary][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-primary-base-active-bg, var(--gov-color-primary-300))}}@media not all and (pointer: coarse){[type=base][variant=primary][hoverable][inverse=\"\"].gov-badge .element:hover,[type=base][variant=primary][hoverable][inverse=true i].gov-badge .element:hover,[type=base][variant=primary][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-primary-base-inverse-hover-bg, transparent);color:var(--gov-button-primary-base-inverse-hover-color, var(--gov-color-primary-200))}[type=base][variant=primary][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=base][variant=primary][hoverable][inverse=true i].gov-badge .element:hover:active,[type=base][variant=primary][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-primary-base-inverse-active-color, var(--gov-color-primary-300))}}[type=solid][variant=secondary].gov-badge .element{background-color:var(--gov-button-secondary-solid-bg, var(--gov-color-secondary));color:var(--gov-button-secondary-solid-color, var(--gov-color-secondary-100));border-width:0}[type=solid][variant=secondary][inverse=\"\"].gov-badge .element,[type=solid][variant=secondary][inverse=true i].gov-badge .element,[type=solid][variant=secondary][inverse=\"1\"].gov-badge .element{color:var(--gov-button-secondary-solid-inverse-color, var(--gov-color-secondary));background-color:var(--gov-button-secondary-solid-inverse-bg, var(--gov-color-secondary-100))}[type=solid][variant=secondary][disabled=\"\"].gov-badge .element,[type=solid][variant=secondary][disabled=true i].gov-badge .element,[type=solid][variant=secondary][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-secondary-solid-disabled-bg, var(--gov-color-secondary-300));color:var(--gov-button-secondary-solid-disabled-color, var(--gov-color-secondary-600))}[type=solid][variant=secondary][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=solid][variant=secondary][disabled=\"\"][inverse=true i].gov-badge .element,[type=solid][variant=secondary][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=solid][variant=secondary][disabled=true i][inverse=\"\"].gov-badge .element,[type=solid][variant=secondary][disabled=true i][inverse=true i].gov-badge .element,[type=solid][variant=secondary][disabled=true i][inverse=\"1\"].gov-badge .element,[type=solid][variant=secondary][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=solid][variant=secondary][disabled=\"1\"][inverse=true i].gov-badge .element,[type=solid][variant=secondary][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-secondary-solid-inverse-color, var(--gov-color-secondary));opacity:0.6;background-color:var(--gov-button-secondary-solid-inverse-bg, var(--gov-color-secondary-100))}@media not all and (pointer: coarse){[type=solid][variant=secondary][hoverable].gov-badge .element:hover{background-color:var(--gov-button-secondary-solid-hover-bg, var(--gov-color-secondary-900));color:var(--gov-button-secondary-solid-hover-color, var(--gov-color-secondary-100))}[type=solid][variant=secondary][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-secondary-solid-active-bg, var(--gov-color-secondary))}}@media not all and (pointer: coarse){[type=solid][variant=secondary][hoverable][inverse=\"\"].gov-badge .element:hover,[type=solid][variant=secondary][hoverable][inverse=true i].gov-badge .element:hover,[type=solid][variant=secondary][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-secondary-solid-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-secondary-solid-inverse-hover-color, var(--gov-color-secondary-900))}[type=solid][variant=secondary][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=solid][variant=secondary][hoverable][inverse=true i].gov-badge .element:hover:active,[type=solid][variant=secondary][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-secondary-solid-inverse-active-color, var(--gov-color-secondary))}}[type=outlined][variant=secondary].gov-badge .element{color:var(--gov-button-secondary-outlined-color, var(--gov-color-secondary));border-color:var(--gov-button-secondary-outlined-border, var(--gov-color-secondary))}[type=outlined][variant=secondary][inverse=\"\"].gov-badge .element,[type=outlined][variant=secondary][inverse=true i].gov-badge .element,[type=outlined][variant=secondary][inverse=\"1\"].gov-badge .element{color:var(--gov-button-secondary-outlined-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-secondary-outlined-inverse-bg, transparent);border-color:var(--gov-button-secondary-outlined-inverse-border, var(--gov-color-secondary-100))}[type=outlined][variant=secondary][disabled=\"\"].gov-badge .element,[type=outlined][variant=secondary][disabled=true i].gov-badge .element,[type=outlined][variant=secondary][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-secondary-outlined-disabled-bg, transparent);color:var(--gov-button-secondary-outlined-disabled-color, var(--gov-color-secondary-500));border-color:var(--gov-button-secondary-outlined-disabled-border, var(--gov-color-secondary-500))}[type=outlined][variant=secondary][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=secondary][disabled=\"\"][inverse=true i].gov-badge .element,[type=outlined][variant=secondary][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=outlined][variant=secondary][disabled=true i][inverse=\"\"].gov-badge .element,[type=outlined][variant=secondary][disabled=true i][inverse=true i].gov-badge .element,[type=outlined][variant=secondary][disabled=true i][inverse=\"1\"].gov-badge .element,[type=outlined][variant=secondary][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=secondary][disabled=\"1\"][inverse=true i].gov-badge .element,[type=outlined][variant=secondary][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-secondary-outlined-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-secondary-outlined-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=outlined][variant=secondary][hoverable].gov-badge .element:hover{background-color:var(--gov-button-secondary-outlined-hover-bg, var(--gov-color-secondary-300));color:var(--gov-button-secondary-outlined-hover-color, var(--gov-color-secondary))}[type=outlined][variant=secondary][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-secondary-outlined-active-bg, var(--gov-color-secondary-400))}}@media not all and (pointer: coarse){[type=outlined][variant=secondary][hoverable][inverse=\"\"].gov-badge .element:hover,[type=outlined][variant=secondary][hoverable][inverse=true i].gov-badge .element:hover,[type=outlined][variant=secondary][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-secondary-outlined-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-secondary-outlined-inverse-hover-color, var(--gov-color-secondary))}[type=outlined][variant=secondary][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=outlined][variant=secondary][hoverable][inverse=true i].gov-badge .element:hover:active,[type=outlined][variant=secondary][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-secondary-outline-inverse-active-color, var(--gov-color-secondary-900))}}[type=base][variant=secondary].gov-badge .element{color:var(--gov-button-secondary-outlined-color, var(--gov-color-secondary));border-width:0}[type=base][variant=secondary][inverse=\"\"].gov-badge .element,[type=base][variant=secondary][inverse=true i].gov-badge .element,[type=base][variant=secondary][inverse=\"1\"].gov-badge .element{color:var(--gov-button-secondary-base-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-secondary-base-inverse-bg, transparent)}[type=base][variant=secondary][disabled=\"\"].gov-badge .element,[type=base][variant=secondary][disabled=true i].gov-badge .element,[type=base][variant=secondary][disabled=\"1\"].gov-badge .element{color:var(--gov-button-secondary-outlined-disabled-color, var(--gov-color-secondary-600))}[type=base][variant=secondary][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=base][variant=secondary][disabled=\"\"][inverse=true i].gov-badge .element,[type=base][variant=secondary][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=base][variant=secondary][disabled=true i][inverse=\"\"].gov-badge .element,[type=base][variant=secondary][disabled=true i][inverse=true i].gov-badge .element,[type=base][variant=secondary][disabled=true i][inverse=\"1\"].gov-badge .element,[type=base][variant=secondary][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=base][variant=secondary][disabled=\"1\"][inverse=true i].gov-badge .element,[type=base][variant=secondary][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-secondary-base-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-secondary-base-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=base][variant=secondary][hoverable].gov-badge .element:hover{background-color:var(--gov-button-secondary-outlined-hover-bg, var(--gov-color-secondary-300));color:var(--gov-button-secondary-outlined-hover-color, var(--gov-color-secondary))}[type=base][variant=secondary][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-secondary-outlined-active-bg, var(--gov-color-secondary-400))}}@media not all and (pointer: coarse){[type=base][variant=secondary][hoverable][inverse=\"\"].gov-badge .element:hover,[type=base][variant=secondary][hoverable][inverse=true i].gov-badge .element:hover,[type=base][variant=secondary][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-secondary-base-inverse-hover-bg, transparent);color:var(--gov-button-secondary-base-inverse-hover-color, var(--gov-color-secondary-500))}[type=base][variant=secondary][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=base][variant=secondary][hoverable][inverse=true i].gov-badge .element:hover:active,[type=base][variant=secondary][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-secondary-base-inverse-active-color, var(--gov-color-secondary-600))}}[type=solid][variant=error].gov-badge .element{background-color:var(--gov-button-error-solid-bg, var(--gov-color-error));color:var(--gov-button-error-solid-color, var(--gov-color-secondary-100));border-width:0}[type=solid][variant=error][inverse=\"\"].gov-badge .element,[type=solid][variant=error][inverse=true i].gov-badge .element,[type=solid][variant=error][inverse=\"1\"].gov-badge .element{color:var(--gov-button-error-solid-inverse-color, var(--gov-color-error));background-color:var(--gov-button-error-solid-inverse-bg, var(--gov-color-secondary-100))}[type=solid][variant=error][disabled=\"\"].gov-badge .element,[type=solid][variant=error][disabled=true i].gov-badge .element,[type=solid][variant=error][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-error-solid-disabled-bg, var(--gov-color-error-200));color:var(--gov-button-error-solid-disabled-color, var(--gov-color-secondary-100))}[type=solid][variant=error][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=solid][variant=error][disabled=\"\"][inverse=true i].gov-badge .element,[type=solid][variant=error][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=solid][variant=error][disabled=true i][inverse=\"\"].gov-badge .element,[type=solid][variant=error][disabled=true i][inverse=true i].gov-badge .element,[type=solid][variant=error][disabled=true i][inverse=\"1\"].gov-badge .element,[type=solid][variant=error][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=solid][variant=error][disabled=\"1\"][inverse=true i].gov-badge .element,[type=solid][variant=error][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-error-solid-inverse-color, var(--gov-color-error));opacity:0.6;background-color:var(--gov-button-error-solid-inverse-bg, var(--gov-color-secondary-100))}@media not all and (pointer: coarse){[type=solid][variant=error][hoverable].gov-badge .element:hover{background-color:var(--gov-button-error-solid-hover-bg, var(--gov-color-error-500));color:var(--gov-button-error-solid-hover-color, var(--gov-color-secondary-100))}[type=solid][variant=error][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-error-solid-active-bg, var(--gov-color-error-600))}}@media not all and (pointer: coarse){[type=solid][variant=error][hoverable][inverse=\"\"].gov-badge .element:hover,[type=solid][variant=error][hoverable][inverse=true i].gov-badge .element:hover,[type=solid][variant=error][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-error-solid-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-error-solid-inverse-hover-color, var(--gov-color-error-500))}[type=solid][variant=error][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=solid][variant=error][hoverable][inverse=true i].gov-badge .element:hover:active,[type=solid][variant=error][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-error-solid-inverse-active-color, var(--gov-color-error-600))}}[type=outlined][variant=error].gov-badge .element{color:var(--gov-button-error-outlined-color, var(--gov-color-error));border-color:var(--gov-button-error-outlined-border, var(--gov-color-error))}[type=outlined][variant=error][inverse=\"\"].gov-badge .element,[type=outlined][variant=error][inverse=true i].gov-badge .element,[type=outlined][variant=error][inverse=\"1\"].gov-badge .element{color:var(--gov-button-error-outlined-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-error-outlined-inverse-bg, transparent);border-color:var(--gov-button-error-outlined-inverse-border, var(--gov-color-secondary-100))}[type=outlined][variant=error][disabled=\"\"].gov-badge .element,[type=outlined][variant=error][disabled=true i].gov-badge .element,[type=outlined][variant=error][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-error-outlined-disabled-bg, transparent);color:var(--gov-button-error-outlined-disabled-color, var(--gov-color-error-200));border-color:var(--gov-button-error-outlined-disabled-border, var(--gov-color-error-200))}[type=outlined][variant=error][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=error][disabled=\"\"][inverse=true i].gov-badge .element,[type=outlined][variant=error][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=outlined][variant=error][disabled=true i][inverse=\"\"].gov-badge .element,[type=outlined][variant=error][disabled=true i][inverse=true i].gov-badge .element,[type=outlined][variant=error][disabled=true i][inverse=\"1\"].gov-badge .element,[type=outlined][variant=error][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=error][disabled=\"1\"][inverse=true i].gov-badge .element,[type=outlined][variant=error][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-error-outlined-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-error-outlined-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=outlined][variant=error][hoverable].gov-badge .element:hover{background-color:var(--gov-button-error-outlined-hover-bg, var(--gov-color-error-100));color:var(--gov-button-error-outlined-hover-color, var(--gov-color-error))}[type=outlined][variant=error][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-error-outlined-active-bg, var(--gov-color-error-200))}}@media not all and (pointer: coarse){[type=outlined][variant=error][hoverable][inverse=\"\"].gov-badge .element:hover,[type=outlined][variant=error][hoverable][inverse=true i].gov-badge .element:hover,[type=outlined][variant=error][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-error-outlined-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-error-outlined-inverse-hover-color, var(--gov-color-error))}[type=outlined][variant=error][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=outlined][variant=error][hoverable][inverse=true i].gov-badge .element:hover:active,[type=outlined][variant=error][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-error-outlined-inverse-active-color, var(--gov-color-error-500))}}[type=base][variant=error].gov-badge .element{color:var(--gov-button-error-outlined-color, var(--gov-color-error));border-width:0}[type=base][variant=error][inverse=\"\"].gov-badge .element,[type=base][variant=error][inverse=true i].gov-badge .element,[type=base][variant=error][inverse=\"1\"].gov-badge .element{color:var(--gov-button-error-base-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-error-base-inverse-bg, transparent)}[type=base][variant=error][disabled=\"\"].gov-badge .element,[type=base][variant=error][disabled=true i].gov-badge .element,[type=base][variant=error][disabled=\"1\"].gov-badge .element{color:var(--gov-button-error-outlined-disabled-color, var(--gov-color-error-200))}[type=base][variant=error][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=base][variant=error][disabled=\"\"][inverse=true i].gov-badge .element,[type=base][variant=error][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=base][variant=error][disabled=true i][inverse=\"\"].gov-badge .element,[type=base][variant=error][disabled=true i][inverse=true i].gov-badge .element,[type=base][variant=error][disabled=true i][inverse=\"1\"].gov-badge .element,[type=base][variant=error][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=base][variant=error][disabled=\"1\"][inverse=true i].gov-badge .element,[type=base][variant=error][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-error-base-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-error-base-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=base][variant=error][hoverable].gov-badge .element:hover{background-color:var(--gov-button-error-outlined-hover-bg, var(--gov-color-error-100));color:var(--gov-button-error-outlined-hover-color, var(--gov-color-error))}[type=base][variant=error][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-error-outlined-active-bg, var(--gov-color-error-200))}}@media not all and (pointer: coarse){[type=base][variant=error][hoverable][inverse=\"\"].gov-badge .element:hover,[type=base][variant=error][hoverable][inverse=true i].gov-badge .element:hover,[type=base][variant=error][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-error-base-inverse-hover-bg, transparent);color:var(--gov-button-error-base-inverse-hover-color, var(--gov-color-error-200))}[type=base][variant=error][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=base][variant=error][hoverable][inverse=true i].gov-badge .element:hover:active,[type=base][variant=error][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-error-base-inverse-active-color, var(--gov-color-error-300))}}[type=solid][variant=success].gov-badge .element{background-color:var(--gov-button-success-solid-bg, var(--gov-color-success-500));color:var(--gov-button-success-solid-color, var(--gov-color-secondary-100));border-width:0}[type=solid][variant=success][inverse=\"\"].gov-badge .element,[type=solid][variant=success][inverse=true i].gov-badge .element,[type=solid][variant=success][inverse=\"1\"].gov-badge .element{color:var(--gov-button-success-solid-inverse-color, var(--gov-color-success-500));background-color:var(--gov-button-success-solid-inverse-bg, var(--gov-color-secondary-100))}[type=solid][variant=success][disabled=\"\"].gov-badge .element,[type=solid][variant=success][disabled=true i].gov-badge .element,[type=solid][variant=success][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-success-solid-disabled-bg, var(--gov-color-success-200));color:var(--gov-button-success-solid-disabled-color, var(--gov-color-secondary-100))}[type=solid][variant=success][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=solid][variant=success][disabled=\"\"][inverse=true i].gov-badge .element,[type=solid][variant=success][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=solid][variant=success][disabled=true i][inverse=\"\"].gov-badge .element,[type=solid][variant=success][disabled=true i][inverse=true i].gov-badge .element,[type=solid][variant=success][disabled=true i][inverse=\"1\"].gov-badge .element,[type=solid][variant=success][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=solid][variant=success][disabled=\"1\"][inverse=true i].gov-badge .element,[type=solid][variant=success][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-success-solid-inverse-color, var(--gov-color-success-500));opacity:0.6;background-color:var(--gov-button-success-solid-inverse-bg, var(--gov-color-secondary-100))}@media not all and (pointer: coarse){[type=solid][variant=success][hoverable].gov-badge .element:hover{background-color:var(--gov-button-success-solid-hover-bg, var(--gov-color-success-600));color:var(--gov-button-success-solid-hover-color, var(--gov-color-secondary-100))}[type=solid][variant=success][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-success-solid-active-bg, var(--gov-color-success-700))}}@media not all and (pointer: coarse){[type=solid][variant=success][hoverable][inverse=\"\"].gov-badge .element:hover,[type=solid][variant=success][hoverable][inverse=true i].gov-badge .element:hover,[type=solid][variant=success][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-success-solid-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-success-solid-inverse-hover-color, var(--gov-color-success-600))}[type=solid][variant=success][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=solid][variant=success][hoverable][inverse=true i].gov-badge .element:hover:active,[type=solid][variant=success][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-success-solid-inverse-active-color, var(--gov-color-success-700))}}[type=outlined][variant=success].gov-badge .element{color:var(--gov-button-success-outlined-color, var(--gov-color-success-500));border-color:var(--gov-button-success-outlined-border, var(--gov-color-success-500))}[type=outlined][variant=success][inverse=\"\"].gov-badge .element,[type=outlined][variant=success][inverse=true i].gov-badge .element,[type=outlined][variant=success][inverse=\"1\"].gov-badge .element{color:var(--gov-button-success-outlined-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-success-outlined-inverse-bg, transparent);border-color:var(--gov-button-success-outlined-inverse-border, var(--gov-color-secondary-100))}[type=outlined][variant=success][disabled=\"\"].gov-badge .element,[type=outlined][variant=success][disabled=true i].gov-badge .element,[type=outlined][variant=success][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-success-outlined-disabled-bg, transparent);color:var(--gov-button-success-outlined-disabled-color, var(--gov-color-success-300));border-color:var(--gov-button-success-outlined-disabled-border, var(--gov-color-success-300))}[type=outlined][variant=success][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=success][disabled=\"\"][inverse=true i].gov-badge .element,[type=outlined][variant=success][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=outlined][variant=success][disabled=true i][inverse=\"\"].gov-badge .element,[type=outlined][variant=success][disabled=true i][inverse=true i].gov-badge .element,[type=outlined][variant=success][disabled=true i][inverse=\"1\"].gov-badge .element,[type=outlined][variant=success][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=success][disabled=\"1\"][inverse=true i].gov-badge .element,[type=outlined][variant=success][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-success-outlined-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-success-outlined-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=outlined][variant=success][hoverable].gov-badge .element:hover{background-color:var(--gov-button-success-outlined-hover-bg, var(--gov-color-success-100));color:var(--gov-button-success-outlined-hover-color, var(--gov-color-success-500))}[type=outlined][variant=success][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-success-outlined-active-bg, var(--gov-color-success-200))}}@media not all and (pointer: coarse){[type=outlined][variant=success][hoverable][inverse=\"\"].gov-badge .element:hover,[type=outlined][variant=success][hoverable][inverse=true i].gov-badge .element:hover,[type=outlined][variant=success][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-success-outlined-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-success-outlined-inverse-hover-color, var(--gov-color-success-500))}[type=outlined][variant=success][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=outlined][variant=success][hoverable][inverse=true i].gov-badge .element:hover:active,[type=outlined][variant=success][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-success-outlined-inverse-active-color, var(--gov-color-success-600))}}[type=base][variant=success].gov-badge .element{color:var(--gov-button-success-outlined-color, var(--gov-color-success-500));border-width:0}[type=base][variant=success][inverse=\"\"].gov-badge .element,[type=base][variant=success][inverse=true i].gov-badge .element,[type=base][variant=success][inverse=\"1\"].gov-badge .element{color:var(--gov-button-success-base-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-success-base-inverse-bg, transparent)}[type=base][variant=success][disabled=\"\"].gov-badge .element,[type=base][variant=success][disabled=true i].gov-badge .element,[type=base][variant=success][disabled=\"1\"].gov-badge .element{color:var(--gov-button-success-outlined-disabled-color, var(--gov-color-success-300))}[type=base][variant=success][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=base][variant=success][disabled=\"\"][inverse=true i].gov-badge .element,[type=base][variant=success][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=base][variant=success][disabled=true i][inverse=\"\"].gov-badge .element,[type=base][variant=success][disabled=true i][inverse=true i].gov-badge .element,[type=base][variant=success][disabled=true i][inverse=\"1\"].gov-badge .element,[type=base][variant=success][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=base][variant=success][disabled=\"1\"][inverse=true i].gov-badge .element,[type=base][variant=success][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-success-base-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-success-base-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=base][variant=success][hoverable].gov-badge .element:hover{background-color:var(--gov-button-success-outlined-hover-bg, var(--gov-color-success-100));color:var(--gov-button-success-outlined-hover-color, var(--gov-color-success-500))}[type=base][variant=success][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-success-outlined-active-bg, var(--gov-color-success-200))}}@media not all and (pointer: coarse){[type=base][variant=success][hoverable][inverse=\"\"].gov-badge .element:hover,[type=base][variant=success][hoverable][inverse=true i].gov-badge .element:hover,[type=base][variant=success][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-success-base-inverse-hover-bg, transparent);color:var(--gov-button-success-base-inverse-hover-color, var(--gov-color-success-200))}[type=base][variant=success][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=base][variant=success][hoverable][inverse=true i].gov-badge .element:hover:active,[type=base][variant=success][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-success-base-inverse-active-color, var(--gov-color-success-300))}}[type=solid][variant=warning].gov-badge .element{background-color:var(--gov-button-warning-solid-bg, var(--gov-color-warning-500));color:var(--gov-button-warning-solid-color, var(--gov-color-secondary-100));border-width:0}[type=solid][variant=warning][inverse=\"\"].gov-badge .element,[type=solid][variant=warning][inverse=true i].gov-badge .element,[type=solid][variant=warning][inverse=\"1\"].gov-badge .element{color:var(--gov-button-warning-solid-inverse-color, var(--gov-color-warning-500));background-color:var(--gov-button-warning-solid-inverse-bg, var(--gov-color-secondary-100))}[type=solid][variant=warning][disabled=\"\"].gov-badge .element,[type=solid][variant=warning][disabled=true i].gov-badge .element,[type=solid][variant=warning][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-warning-solid-disabled-bg, var(--gov-color-warning-200));color:var(--gov-button-warning-solid-disabled-color, var(--gov-color-secondary-100))}[type=solid][variant=warning][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=solid][variant=warning][disabled=\"\"][inverse=true i].gov-badge .element,[type=solid][variant=warning][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=solid][variant=warning][disabled=true i][inverse=\"\"].gov-badge .element,[type=solid][variant=warning][disabled=true i][inverse=true i].gov-badge .element,[type=solid][variant=warning][disabled=true i][inverse=\"1\"].gov-badge .element,[type=solid][variant=warning][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=solid][variant=warning][disabled=\"1\"][inverse=true i].gov-badge .element,[type=solid][variant=warning][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-warning-solid-inverse-color, var(--gov-color-warning-500));opacity:0.6;background-color:var(--gov-button-warning-solid-inverse-bg, var(--gov-color-secondary-100))}@media not all and (pointer: coarse){[type=solid][variant=warning][hoverable].gov-badge .element:hover{background-color:var(--gov-button-warning-solid-hover-bg, var(--gov-color-warning-600));color:var(--gov-button-warning-solid-hover-color, var(--gov-color-secondary-100))}[type=solid][variant=warning][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-warning-solid-active-bg, var(--gov-color-warning-700))}}@media not all and (pointer: coarse){[type=solid][variant=warning][hoverable][inverse=\"\"].gov-badge .element:hover,[type=solid][variant=warning][hoverable][inverse=true i].gov-badge .element:hover,[type=solid][variant=warning][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-warning-solid-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-warning-solid-inverse-hover-color, var(--gov-color-warning-600))}[type=solid][variant=warning][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=solid][variant=warning][hoverable][inverse=true i].gov-badge .element:hover:active,[type=solid][variant=warning][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-warning-solid-inverse-active-color, var(--gov-color-warning-700))}}[type=outlined][variant=warning].gov-badge .element{color:var(--gov-button-warning-outlined-color, var(--gov-color-warning-500));border-color:var(--gov-button-warning-outlined-border, var(--gov-color-warning-500))}[type=outlined][variant=warning][inverse=\"\"].gov-badge .element,[type=outlined][variant=warning][inverse=true i].gov-badge .element,[type=outlined][variant=warning][inverse=\"1\"].gov-badge .element{color:var(--gov-button-warning-outlined-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-warning-outlined-inverse-bg, transparent);border-color:var(--gov-button-warning-outlined-inverse-border, var(--gov-color-secondary-100))}[type=outlined][variant=warning][disabled=\"\"].gov-badge .element,[type=outlined][variant=warning][disabled=true i].gov-badge .element,[type=outlined][variant=warning][disabled=\"1\"].gov-badge .element{background-color:var(--gov-button-warning-outlined-disabled-bg, transparent);color:var(--gov-button-warning-outlined-disabled-color, var(--gov-color-warning));border-color:var(--gov-button-warning-outlined-disabled-border, var(--gov-color-warning))}[type=outlined][variant=warning][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=warning][disabled=\"\"][inverse=true i].gov-badge .element,[type=outlined][variant=warning][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=outlined][variant=warning][disabled=true i][inverse=\"\"].gov-badge .element,[type=outlined][variant=warning][disabled=true i][inverse=true i].gov-badge .element,[type=outlined][variant=warning][disabled=true i][inverse=\"1\"].gov-badge .element,[type=outlined][variant=warning][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=outlined][variant=warning][disabled=\"1\"][inverse=true i].gov-badge .element,[type=outlined][variant=warning][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-warning-outlined-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-warning-outlined-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=outlined][variant=warning][hoverable].gov-badge .element:hover{background-color:var(--gov-button-warning-outlined-hover-bg, var(--gov-color-warning-200));color:var(--gov-button-warning-outlined-hover-color, var(--gov-color-warning-500))}[type=outlined][variant=warning][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-warning-outlined-active-bg, var(--gov-color-warning-300))}}@media not all and (pointer: coarse){[type=outlined][variant=warning][hoverable][inverse=\"\"].gov-badge .element:hover,[type=outlined][variant=warning][hoverable][inverse=true i].gov-badge .element:hover,[type=outlined][variant=warning][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-warning-outlined-inverse-hover-bg, var(--gov-color-secondary-100));color:var(--gov-button-warning-outlined-inverse-hover-color, var(--gov-color-warning-500))}[type=outlined][variant=warning][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=outlined][variant=warning][hoverable][inverse=true i].gov-badge .element:hover:active,[type=outlined][variant=warning][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-warning-outlined-inverse-active-color, var(--gov-color-warning-600))}}[type=base][variant=warning].gov-badge .element{color:var(--gov-button-warning-outlined-color, var(--gov-color-warning-500));border-width:0}[type=base][variant=warning][inverse=\"\"].gov-badge .element,[type=base][variant=warning][inverse=true i].gov-badge .element,[type=base][variant=warning][inverse=\"1\"].gov-badge .element{color:var(--gov-button-warning-base-inverse-color, var(--gov-color-secondary-100));background-color:var(--gov-button-warning-base-inverse-bg, transparent)}[type=base][variant=warning][disabled=\"\"].gov-badge .element,[type=base][variant=warning][disabled=true i].gov-badge .element,[type=base][variant=warning][disabled=\"1\"].gov-badge .element{color:var(--gov-button-warning-outlined-disabled-color, var(--gov-color-warning))}[type=base][variant=warning][disabled=\"\"][inverse=\"\"].gov-badge .element,[type=base][variant=warning][disabled=\"\"][inverse=true i].gov-badge .element,[type=base][variant=warning][disabled=\"\"][inverse=\"1\"].gov-badge .element,[type=base][variant=warning][disabled=true i][inverse=\"\"].gov-badge .element,[type=base][variant=warning][disabled=true i][inverse=true i].gov-badge .element,[type=base][variant=warning][disabled=true i][inverse=\"1\"].gov-badge .element,[type=base][variant=warning][disabled=\"1\"][inverse=\"\"].gov-badge .element,[type=base][variant=warning][disabled=\"1\"][inverse=true i].gov-badge .element,[type=base][variant=warning][disabled=\"1\"][inverse=\"1\"].gov-badge .element{color:var(--gov-button-warning-base-inverse-color, var(--gov-color-secondary-100));opacity:0.6;background-color:var(--gov-button-warning-base-inverse-bg, transparent)}@media not all and (pointer: coarse){[type=base][variant=warning][hoverable].gov-badge .element:hover{background-color:var(--gov-button-warning-outlined-hover-bg, var(--gov-color-warning-200));color:var(--gov-button-warning-outlined-hover-color, var(--gov-color-warning-500))}[type=base][variant=warning][hoverable].gov-badge .element:hover:active{background-color:var(--gov-button-warning-outlined-active-bg, var(--gov-color-warning-300))}}@media not all and (pointer: coarse){[type=base][variant=warning][hoverable][inverse=\"\"].gov-badge .element:hover,[type=base][variant=warning][hoverable][inverse=true i].gov-badge .element:hover,[type=base][variant=warning][hoverable][inverse=\"1\"].gov-badge .element:hover{background-color:var(--gov-button-warning-base-inverse-hover-bg, transparent);color:var(--gov-button-warning-base-inverse-hover-color, var(--gov-color-warning-200))}[type=base][variant=warning][hoverable][inverse=\"\"].gov-badge .element:hover:active,[type=base][variant=warning][hoverable][inverse=true i].gov-badge .element:hover:active,[type=base][variant=warning][hoverable][inverse=\"1\"].gov-badge .element:hover:active{color:var(--gov-button-warning-base-inverse-active-color, var(--gov-color-warning-300))}}[size=xs].gov-badge .element{font-weight:var(--gov-button-text-s-font-weight, var(--gov-text-s-font-weight));font-size:var(--gov-button-text-s-font-size, var(--gov-text-s-font-size));line-height:var(--gov-button-text-s-line-height, var(--gov-text-s-line-height));letter-spacing:var(--gov-button-text-s-letter-spacing, var(--gov-text-s-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 0.75rem);column-gap:var(--gov-button-padding-x, 0.75rem);min-height:var(--gov-button-min-height, 2rem);padding:var(--gov-button-padding-y, 0.25rem) var(--gov-button-padding-x, 0.75rem)}[size=xs].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1rem);height:var(--gov-button-icon-size, 1rem)}@media (min-width: 48em){[size=xs].gov-badge .element{font-weight:var(--gov-button-text-xs-font-weight, var(--gov-text-xs-font-weight));font-size:var(--gov-button-text-xs-font-size, var(--gov-text-xs-font-size));line-height:var(--gov-button-text-xs-line-height, var(--gov-text-xs-line-height));letter-spacing:var(--gov-button-text-xs-letter-spacing, var(--gov-text-xs-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 0.75rem);column-gap:var(--gov-button-padding-x, 0.75rem);min-height:var(--gov-button-min-height, 1.375rem);padding:var(--gov-button-padding-y, 0.0625rem) var(--gov-button-padding-x, 0.75rem)}[size=xs].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1rem);height:var(--gov-button-icon-size, 1rem)}}[size=s].gov-badge .element{font-weight:var(--gov-button-text-s-font-weight, var(--gov-text-s-font-weight));font-size:var(--gov-button-text-s-font-size, var(--gov-text-s-font-size));line-height:var(--gov-button-text-s-line-height, var(--gov-text-s-line-height));letter-spacing:var(--gov-button-text-s-letter-spacing, var(--gov-text-s-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 0.75rem);column-gap:var(--gov-button-padding-x, 0.75rem);min-height:var(--gov-button-min-height, 2rem);padding:var(--gov-button-padding-y, 0.25rem) var(--gov-button-padding-x, 0.75rem)}[size=s].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1rem);height:var(--gov-button-icon-size, 1rem)}@media (min-width: 48em){[size=s].gov-badge .element{font-weight:var(--gov-button-text-s-font-weight, var(--gov-text-s-font-weight));font-size:var(--gov-button-text-s-font-size, var(--gov-text-s-font-size));line-height:var(--gov-button-text-s-line-height, var(--gov-text-s-line-height));letter-spacing:var(--gov-button-text-s-letter-spacing, var(--gov-text-s-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 0.75rem);column-gap:var(--gov-button-padding-x, 0.75rem);min-height:var(--gov-button-min-height, 2rem);padding:var(--gov-button-padding-y, 0.25rem) var(--gov-button-padding-x, 0.75rem)}[size=s].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1rem);height:var(--gov-button-icon-size, 1rem)}}[size=m].gov-badge .element{font-weight:var(--gov-button-text-s-font-weight, var(--gov-text-s-font-weight));font-size:var(--gov-button-text-s-font-size, var(--gov-text-s-font-size));line-height:var(--gov-button-text-s-line-height, var(--gov-text-s-line-height));letter-spacing:var(--gov-button-text-s-letter-spacing, var(--gov-text-s-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 0.75rem);column-gap:var(--gov-button-padding-x, 0.75rem);min-height:var(--gov-button-min-height, 2rem);padding:var(--gov-button-padding-y, 0.25rem) var(--gov-button-padding-x, 0.75rem)}[size=m].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1rem);height:var(--gov-button-icon-size, 1rem)}@media (min-width: 48em){[size=m].gov-badge .element{font-weight:var(--gov-button-text-m-font-weight, var(--gov-text-m-font-weight));font-size:var(--gov-button-text-m-font-size, var(--gov-text-m-font-size));line-height:var(--gov-button-text-m-line-height, var(--gov-text-m-line-height));letter-spacing:var(--gov-button-text-m-letter-spacing, var(--gov-text-m-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 0.75rem);column-gap:var(--gov-button-padding-x, 0.75rem);min-height:var(--gov-button-min-height, 2.5rem);padding:var(--gov-button-padding-y, 0.375rem) var(--gov-button-padding-x, 0.75rem)}[size=m].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1.25rem);height:var(--gov-button-icon-size, 1.25rem)}}[size=l].gov-badge .element{font-weight:var(--gov-button-text-m-font-weight, var(--gov-text-m-font-weight));font-size:var(--gov-button-text-m-font-size, var(--gov-text-m-font-size));line-height:var(--gov-button-text-m-line-height, var(--gov-text-m-line-height));letter-spacing:var(--gov-button-text-m-letter-spacing, var(--gov-text-m-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 0.75rem);column-gap:var(--gov-button-padding-x, 0.75rem);min-height:var(--gov-button-min-height, 2.5rem);padding:var(--gov-button-padding-y, 0.375rem) var(--gov-button-padding-x, 0.75rem)}[size=l].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1.25rem);height:var(--gov-button-icon-size, 1.25rem)}@media (min-width: 48em){[size=l].gov-badge .element{font-weight:var(--gov-button-text-l-font-weight, var(--gov-text-l-font-weight));font-size:var(--gov-button-text-l-font-size, var(--gov-text-l-font-size));line-height:var(--gov-button-text-l-line-height, var(--gov-text-l-line-height));letter-spacing:var(--gov-button-text-l-letter-spacing, var(--gov-text-l-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 1rem);column-gap:var(--gov-button-padding-x, 1rem);min-height:var(--gov-button-min-height, 3rem);padding:var(--gov-button-padding-y, 0.5rem) var(--gov-button-padding-x, 1rem)}[size=l].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1.5rem);height:var(--gov-button-icon-size, 1.5rem)}}[size=xl].gov-badge .element{font-weight:var(--gov-button-text-l-font-weight, var(--gov-text-l-font-weight));font-size:var(--gov-button-text-l-font-size, var(--gov-text-l-font-size));line-height:var(--gov-button-text-l-line-height, var(--gov-text-l-line-height));letter-spacing:var(--gov-button-text-l-letter-spacing, var(--gov-text-l-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 1rem);column-gap:var(--gov-button-padding-x, 1rem);min-height:var(--gov-button-min-height, 3rem);padding:var(--gov-button-padding-y, 0.5rem) var(--gov-button-padding-x, 1rem)}[size=xl].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1.5rem);height:var(--gov-button-icon-size, 1.5rem)}@media (min-width: 48em){[size=xl].gov-badge .element{font-weight:var(--gov-button-text-xl-font-weight, var(--gov-text-xl-font-weight));font-size:var(--gov-button-text-xl-font-size, var(--gov-text-xl-font-size));line-height:var(--gov-button-text-xl-line-height, var(--gov-text-xl-line-height));letter-spacing:var(--gov-button-text-xl-letter-spacing, var(--gov-text-xl-letter-spacing));-moz-column-gap:var(--gov-button-padding-x, 1.25rem);column-gap:var(--gov-button-padding-x, 1.25rem);min-height:var(--gov-button-min-height, 3.5rem);padding:var(--gov-button-padding-y, 0.75rem) var(--gov-button-padding-x, 1.25rem)}[size=xl].gov-badge .element .gov-icon{width:var(--gov-button-icon-size, 1.75rem);height:var(--gov-button-icon-size, 1.75rem)}}.gov-badge a .gov-icon{margin:0}.gov-badge .element{padding:0.25rem 0.625rem;font-family:\"Roboto\", sans-serif;font-weight:400;letter-spacing:initial}.gov-badge[size=xs] .element{border-radius:calc(var(--gov-button-min-height, 1.375rem) * 0.5)}.gov-badge[size=xs][hoverable] .element:focus{outline:none}.gov-badge[size=xs][hoverable] .element:focus-visible{border-radius:calc(var(--gov-button-min-height, 1.375rem) * 0.5);outline:var(--gov-outline-width, 0.125rem) solid var(--gov-color-focus-base);outline-offset:0.0625rem}.gov-badge[size=s] .element{border-radius:calc(var(--gov-button-min-height, 2rem) * 0.5)}.gov-badge[size=s][hoverable] .element:focus{outline:none}.gov-badge[size=s][hoverable] .element:focus-visible{border-radius:calc(var(--gov-button-min-height, 2rem) * 0.5);outline:var(--gov-outline-width, 0.125rem) solid var(--gov-color-focus-base);outline-offset:0.0625rem}.gov-badge[size=m] .element{border-radius:calc(var(--gov-button-min-height, 2.5rem) * 0.5)}.gov-badge[size=m][hoverable] .element:focus{outline:none}.gov-badge[size=m][hoverable] .element:focus-visible{border-radius:calc(var(--gov-button-min-height, 2.5rem) * 0.5);outline:var(--gov-outline-width, 0.125rem) solid var(--gov-color-focus-base);outline-offset:0.0625rem}.gov-badge[size=l] .element{border-radius:calc(var(--gov-button-min-height, 3rem) * 0.5)}.gov-badge[size=l][hoverable] .element:focus{outline:none}.gov-badge[size=l][hoverable] .element:focus-visible{border-radius:calc(var(--gov-button-min-height, 3rem) * 0.5);outline:var(--gov-outline-width, 0.125rem) solid var(--gov-color-focus-base);outline-offset:0.0625rem}.gov-badge[size=xl] .element{border-radius:calc(var(--gov-button-min-height, 3.5rem) * 0.5)}.gov-badge[size=xl][hoverable] .element:focus{outline:none}.gov-badge[size=xl][hoverable] .element:focus-visible{border-radius:calc(var(--gov-button-min-height, 3.5rem) * 0.5);outline:var(--gov-outline-width, 0.125rem) solid var(--gov-color-focus-base);outline-offset:0.0625rem}";
+
+var Tags;
+(function (Tags) {
+  Tags["A"] = "a";
+  Tags["SPAN"] = "span";
+  Tags["BUTTON"] = "button";
+})(Tags || (Tags = {}));
+const GovBadge = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.govClick = createEvent(this, "gov-click", 7);
+    this.inverse = false;
+    this.disabled = false;
+    this.href = undefined;
+    this.target = undefined;
+    this.size = Sizes._M;
+    this.type = "solid";
+    this.tag = "span";
+    this.nativeType = NativeType.SPAN;
+    this.variant = Variants.PRIMARY;
+    this.wcagLabel = undefined;
+    this.h = govHost(this.host);
+  }
+  validateVariant(newValue) {
+    validateProp(Variants, newValue, BadgeClass.root);
+  }
+  validateSize(newValue) {
+    validateProp(Sizes, newValue, BadgeClass.root);
+  }
+  validateType(newValue) {
+    validateProp(Types, newValue, BadgeClass.root);
+  }
+  componentWillLoad() {
+    this.validateVariant(this.variant);
+    this.validateSize(this.size);
+    this.validateType(this.type);
+  }
+  render() {
+    const Tag = this.href ? Tags.A : this.nativeType == 'button' ? Tags.BUTTON : this.tag;
+    const nativeType = Tag == Tags.BUTTON ? this.nativeType : undefined;
+    return (h(Host, { class: BadgeClass.root, disabled: this.disabled, href: this.href, variant: this.variant, size: this.size, type: this.type, inverse: this.inverse, hoverable: Tag == Tags.A || Tag == Tags.BUTTON }, h(Tag, { class: "element", href: this.href, target: this.target, "aria-label": this.wcagLabel, onClick: this.onClickHandler.bind(this), type: nativeType }, this.h.hasSlot("left-icon") && h("slot", { name: "left-icon" }), h("slot", null), this.h.hasSlot("right-icon") && h("slot", { name: "right-icon" }))));
+  }
+  onClickHandler(e) {
+    e.stopPropagation();
+    if (this.disabled === false) {
+      this.govClick.emit(e);
+    }
+  }
+  get host() { return getElement(this); }
+  static get watchers() { return {
+    "variant": ["validateVariant"],
+    "size": ["validateSize"],
+    "type": ["validateType"]
+  }; }
+};
+GovBadge.style = govBadgeCss;
+
+export { GovBadge as gov_badge };
+
+//# sourceMappingURL=gov-badge.entry.js.map

package/dist/esm/gov-badge.entry.js.map

@@ -0,0 +1 @@
+{"file":"gov-badge.entry.js","mappings":"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","names":[],"sources":["../../../packages/core/src/components/gov-badge/constants.ts","../../../packages/core/src/components/gov-badge/gov-badge.scss?tag=gov-badge","../../../packages/core/src/components/gov-badge/gov-badge.tsx"],"sourcesContent":["export enum NativeType {\n\tSPAN = \"span\",\n\tBUTTON = \"button\",\n}\n\nexport const NativeTypes = [undefined, NativeType.BUTTON, NativeType.SPAN] as const\nexport type NativeTypesType = typeof NativeTypes[number]\n\nexport const BadgeClass = {\n\troot: \"gov-badge\",\n\tinner: \"gov-badge__inner\",\n}\n","/*\n *   Badge\n */\n\n// Shared definitions - button & badge\n@import \"../gov-button/gov-button-core.scss\";\n\n.gov-badge {\n\t@extend %button-core;\n\n\ta .gov-icon {\n\t\tmargin: 0;\n\t}\n\n\t.element {\n\t\tpadding: rem-calc(4 10);\n\t\tfont-family: $font-family-primary;\n\t\tfont-weight: 400;\n\t\tletter-spacing: initial;\n\t}\n\n\t// Generate radiuses\n\t@each $size, $definitions in $button-sizes {\n\t\t$radius: calc(#{get(\"min-height\", $definitions)} * 0.5);\n\t\t&[size=\"#{$size}\"] {\n\t\t\t.element {\n\t\t\t\tborder-radius: $radius;\n\t\t\t}\n\n\t\t\t// HOVERS\n\t\t\t&[hoverable] .element {\n\t\t\t\t@include focus-outline($radius, $outline-offset);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Element, h, Host, Prop, Watch, Event, EventEmitter } from \"@stencil/core\"\nimport { GovHost } from \"../../helpers/Dom/template.d\"\nimport { validateProp } from \"../../helpers/Validate/props\"\nimport { Sizes } from \"../../core/constants/sizes\"\nimport { govHost } from \"../../helpers/Dom/template\"\nimport { BadgeClass, NativeType, NativeTypesType } from \"./constants\"\nimport { SizesType, Type, Types, VariantType } from \"../gov-button/constants\"\nimport { Variants } from \"../../core/constants/variants\"\n\nenum Tags {\n\tA = \"a\",\n\tSPAN = \"span\",\n\tBUTTON = \"button\"\n}\n\n@Component({\n\ttag: \"gov-badge\",\n\tstyleUrl: \"gov-badge.scss\",\n})\nexport class GovBadge {\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: SizesType = Sizes._M\n\t/**\n\t * Badges's type\n\t */\n\t@Prop() readonly type: Type = \"solid\";\n\t/**\n\t * Used to change the HMTL tag in the badge\n\t */\n\t@Prop() readonly tag: string = \"span\"\n\t/**\n\t * Same as original parameter\n\t * https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-type\n\t */\n\t@Prop() readonly nativeType: NativeTypesType = NativeType.SPAN\n\t/**\n\t * Style variation of the badge.\n\t */\n\t@Prop() readonly variant: VariantType = Variants.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\tvalidateProp(Variants, newValue, BadgeClass.root)\n\t}\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(Sizes, newValue, BadgeClass.root)\n\t\t\n\t}\n\n\t@Watch(\"type\")\n\tvalidateType(newValue: string): void {\n\t\tvalidateProp(Types, 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 ? Tags.A : this.nativeType == 'button' ? Tags.BUTTON : this.tag;\n\t\tconst nativeType = Tag == Tags.BUTTON ? this.nativeType : undefined;\n\n\t\treturn (\n\t\t\t<Host\n\t\t\t\tclass={BadgeClass.root}\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 == Tags.A || Tag == Tags.BUTTON}>\n\t\t\t\t<Tag class=\"element\"\n\t\t\t\t     href={this.href}\n\t\t\t\t     target={this.target}\n\t\t\t\t     aria-label={this.wcagLabel}\n\t\t\t\t\t onClick={this.onClickHandler.bind(this)}\n\t\t\t\t\t type={nativeType}>\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</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) {\n\t\t\tthis.govClick.emit(e)\n\t\t}\n\t}\n}\n"],"version":3}