@gov-design-system-ce/components 4.0.8-rc10 → 4.0.8-rc11

package/dist/esm/gov-accordion-item.entry.js.map

@@ -1 +1 @@
-{"file":"gov-accordion-item.entry.js","mappings":"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","names":[],"sources":["../../../packages/core/src/components/gov-accordion/gov-accordion-item.scss?tag=gov-accordion-item","../../../packages/core/src/components/gov-accordion/gov-accordion-item.tsx"],"sourcesContent":["/*\n *   Accordion - Item\n */\n\n$class: \".gov-accordion-item\";\n\n#{$class} {\n\t@include base();\n\t&::before {\n\t\t@include pseudo();\n\t\tright: 0;\n\t\tbottom: -1px;\n\t\tleft: 0;\n\t\theight: 1px;\n\t\tbackground-color: color(\"secondary.500\");\n\t}\n\n\t&__header {\n\t\t@include button-core();\n\t\t@include focus-outline();\n\t\t@include general;\n\t\tposition: relative;\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\talign-items: flex-start;\n\t\twidth: 100%;\n\t\tborder-radius: 0;\n\t\ttext-align: left;\n\t\ttext-transform: none;\n\t\ttransition: background-color $t ease-in-out;\n\n\t\t// STATES\n\t\t&:focus-visible {\n\t\t\t&::before {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t}\n\t\t@include parameter(\"aria-expanded\") {\n\t\t\t#{$class} {\n\t\t\t\t&__arrow .gov-icon:not([slot=\"toggle-icon\"]) {\n\t\t\t\t\ttransform: scale(-1);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t&__icon {\n\t\tdisplay: inline-flex;\n\t\tvertical-align: middle;\n\t\tflex: 0 0 auto;\n\t}\n\t&__title {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tmargin-right: auto;\n\t}\n\t&__label * {\n\t\tmargin-bottom: 0;\n\t\tdisplay: inline-block;\n\t\ttransform: translateY(1px);\n\t}\n\t&__annotation * {\n\t\tcolor: color(\"secondary\");\n\t\tmargin-bottom: 0;\n\t}\n\t&__right {\n\t\tdisplay: flex;\n\t\tflex-shrink: 0;\n\t\talign-items: center;\n\t\tmargin-left: auto;\n\t}\n\t&__suffix {\n\t\tdisplay: inline-flex;\n\t\tvertical-align: middle;\n\t\tflex: 0 0 auto;\n\t\talign-self: start;\n\t\tline-height: initial;\n\t}\n\t&__arrow {\n\t\tflex: 0 0 auto;\n\t}\n\t&__content {\n\t\t@include reset-last-margin();\n\t}\n\n\t// VARIANTS\n\t@each $size, $definitions in $accordion-sizes {\n\t\t&[size=\"#{$size}\"],\n\t\t& #{$class}[size=\"#{$size}\"] {\n\t\t\t#{$class} {\n\t\t\t\t&__header {\n\t\t\t\t\tgap: get(\"headline-gap\", $definitions);\n\t\t\t\t\tmin-height: get(\"min-height\", $definitions);\n\t\t\t\t\tpadding: get(\"padding-y\", $definitions) get(\"padding-x\", $definitions);\n\t\t\t\t}\n\t\t\t\t&__icon {\n\t\t\t\t\twidth: calc(get-font-size(get(\"font\", $definitions)) * 1.2);\n\t\t\t\t\theight: calc(get-font-size(get(\"font\", $definitions)) * 1.2);\n\t\t\t\t\ttransform: translateY(get(\"icon-position\", $definitions));\n\t\t\t\t}\n\t\t\t\t&__label * {\n\t\t\t\t\t@include typography(get(\"font\", $definitions));\n\t\t\t\t}\n\t\t\t\t&__annotation {\n\t\t\t\t\t@include typography(get(\"font-annotation\", $definitions));\n\t\t\t\t}\n\t\t\t\t&__right {\n\t\t\t\t\tgap: get(\"headline-gap\", $definitions);\n\t\t\t\t\ttransform: translateY(get(\"arrow-position\", $definitions));\n\t\t\t\t\t&:has(#{$class}__suffix) {\n\t\t\t\t\t\ttransform: translateY(get(\"icon-position\", $definitions));\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t&__arrow {\n\t\t\t\t\twidth: get(\"icon-size\", $definitions);\n\t\t\t\t\theight: get(\"icon-size\", $definitions);\n\t\t\t\t}\n\t\t\t\t&__content {\n\t\t\t\t\tpadding: get(\"padding-inner\", $definitions);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t@each $variant, $definitions in $accordion-variants {\n\t\t&[variant=\"#{$variant}\"] {\n\t\t\t#{$class} {\n\t\t\t\t&::before {\n\t\t\t\t\tbackground-color: get(\"separator\", $definitions);\n\t\t\t\t}\n\t\t\t\t&__header {\n\t\t\t\t\tbackground-color: get(\"background\", $definitions);\n\t\t\t\t\tcolor: get(\"color\", $definitions);\n\t\t\t\t\t@include hover() {\n\t\t\t\t\t\tbackground-color: get(\"background-hover\", $definitions);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// STATES\n\t\t\t@include parameter(\"disabled\") {\n\t\t\t\t#{$class} {\n\t\t\t\t\t&__header {\n\t\t\t\t\t\tcolor: get(\"disabled-color\", $definitions);\n\t\t\t\t\t\t@include hover() {\n\t\t\t\t\t\t\tbackground: transparent;\n\t\t\t\t\t\t\tcursor: not-allowed;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// MQ\n\t@include mq($until: md) {\n\t\t&__title {\n\t\t\tflex-wrap: wrap;\n\t\t}\n\t\t&__label {\n\t\t\tflex: 0 0 auto;\n\t\t}\n\t}\n}\n","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 button\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<span class={AccordionItemClass.right}>\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\n\t\t\t\t\t\t<span class={AccordionItemClass.arrow}>\n\t\t\t\t\t\t\t{this.h.hasSlot(\"toggle-icon\") ? (\n\t\t\t\t\t\t\t\t<slot name=\"toggle-icon\" />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<gov-icon name=\"chevron-down\"></gov-icon>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</span>\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"],"version":3}
+{"file":"gov-accordion-item.entry.js","mappings":"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","names":[],"sources":["../../../packages/core/src/components/gov-accordion/gov-accordion-item.scss?tag=gov-accordion-item","../../../packages/core/src/components/gov-accordion/gov-accordion-item.tsx"],"sourcesContent":["/*\n *   Accordion - Item\n */\n\n$class: \".gov-accordion-item\";\n\n#{$class} {\n\t@include base();\n\t&::before {\n\t\t@include pseudo();\n\t\tright: 0;\n\t\tbottom: -1px;\n\t\tleft: 0;\n\t\theight: 1px;\n\t\tbackground-color: color(\"secondary.500\");\n\t}\n\n\t&__header {\n\t\t@include button-core();\n\t\t@include focus-outline();\n\t\t@include general;\n\t\tposition: relative;\n\t\tdisplay: flex;\n\t\tjustify-content: space-between;\n\t\talign-items: flex-start;\n\t\twidth: 100%;\n\t\tborder-radius: 0;\n\t\ttext-align: left;\n\t\ttext-transform: none;\n\t\ttransition: background-color $t ease-in-out;\n\n\t\t// STATES\n\t\t&:focus-visible {\n\t\t\t&::before {\n\t\t\t\tdisplay: none;\n\t\t\t}\n\t\t}\n\t\t@include parameter(\"aria-expanded\") {\n\t\t\t#{$class} {\n\t\t\t\t&__arrow .gov-icon:not([slot=\"toggle-icon\"]) {\n\t\t\t\t\ttransform: scale(-1);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t&__icon {\n\t\tdisplay: inline-flex;\n\t\tvertical-align: middle;\n\t\tflex: 0 0 auto;\n\t}\n\t&__title {\n\t\tdisplay: flex;\n\t\tflex-direction: column;\n\t\tmargin-right: auto;\n\t}\n\t&__label * {\n\t\tmargin-bottom: 0;\n\t\tdisplay: inline-block;\n\t\ttransform: translateY(1px);\n\t}\n\t&__annotation * {\n\t\tcolor: color(\"secondary\");\n\t\tmargin-bottom: 0;\n\t}\n\t&__right {\n\t\tdisplay: flex;\n\t\tflex-shrink: 0;\n\t\talign-items: center;\n\t\tmargin-left: auto;\n\t}\n\t&__suffix {\n\t\tdisplay: inline-flex;\n\t\tvertical-align: middle;\n\t\tflex: 0 0 auto;\n\t\talign-self: start;\n\t\tline-height: initial;\n\t}\n\t&__arrow {\n\t\tflex: 0 0 auto;\n\t}\n\t&__content {\n\t\t@include reset-last-margin();\n\t}\n\n\t// VARIANTS\n\t@each $size, $definitions in $accordion-sizes {\n\t\t&[size=\"#{$size}\"],\n\t\t& #{$class}[size=\"#{$size}\"] {\n\t\t\t#{$class} {\n\t\t\t\t&__header {\n\t\t\t\t\tgap: get(\"headline-gap\", $definitions);\n\t\t\t\t\tmin-height: get(\"min-height\", $definitions);\n\t\t\t\t\tpadding: get(\"padding-y\", $definitions) get(\"padding-x\", $definitions);\n\t\t\t\t}\n\t\t\t\t&__icon {\n\t\t\t\t\twidth: calc(get-font-size(get(\"font\", $definitions)) * 1.2);\n\t\t\t\t\theight: calc(get-font-size(get(\"font\", $definitions)) * 1.2);\n\t\t\t\t\ttransform: translateY(get(\"icon-position\", $definitions));\n\t\t\t\t}\n\t\t\t\t&__label * {\n\t\t\t\t\t@include typography(get(\"font\", $definitions));\n\t\t\t\t}\n\t\t\t\t&__annotation {\n\t\t\t\t\t@include typography(get(\"font-annotation\", $definitions));\n\t\t\t\t}\n\t\t\t\t&__right {\n\t\t\t\t\tgap: get(\"headline-gap\", $definitions);\n\t\t\t\t\ttransform: translateY(get(\"arrow-position\", $definitions));\n\t\t\t\t\t&:has(#{$class}__suffix) {\n\t\t\t\t\t\ttransform: translateY(get(\"icon-position\", $definitions));\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t&__arrow {\n\t\t\t\t\twidth: get(\"icon-size\", $definitions);\n\t\t\t\t\theight: get(\"icon-size\", $definitions);\n\t\t\t\t}\n\t\t\t\t&__content {\n\t\t\t\t\tpadding: get(\"padding-inner\", $definitions);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\t@each $variant, $definitions in $accordion-variants {\n\t\t&[variant=\"#{$variant}\"] {\n\t\t\t#{$class} {\n\t\t\t\t&::before {\n\t\t\t\t\tbackground-color: get(\"separator\", $definitions);\n\t\t\t\t}\n\t\t\t\t&__header {\n\t\t\t\t\tbackground-color: get(\"background\", $definitions);\n\t\t\t\t\tcolor: get(\"color\", $definitions);\n\t\t\t\t\t@include hover() {\n\t\t\t\t\t\tbackground-color: get(\"background-hover\", $definitions);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// STATES\n\t\t\t@include parameter(\"disabled\") {\n\t\t\t\t#{$class} {\n\t\t\t\t\t&__header {\n\t\t\t\t\t\tcolor: get(\"disabled-color\", $definitions);\n\t\t\t\t\t\t@include hover() {\n\t\t\t\t\t\t\tbackground: transparent;\n\t\t\t\t\t\t\tcursor: not-allowed;\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\t// MQ\n\t@include mq($until: md) {\n\t\t&__title {\n\t\t\tflex-wrap: wrap;\n\t\t}\n\t\t&__label {\n\t\t\tflex: 0 0 auto;\n\t\t}\n\t}\n}\n","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 button\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<span class={AccordionItemClass.right}>\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\n\t\t\t\t\t\t<span class={AccordionItemClass.arrow}>\n\t\t\t\t\t\t\t{this.h.hasSlot(\"toggle-icon\") ? (\n\t\t\t\t\t\t\t\t<slot name=\"toggle-icon\" />\n\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t<gov-icon name=\"chevron-down\"></gov-icon>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</span>\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"],"version":3}

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

@@ -1,72 +1,73 @@
-import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-eb59f132.js';
-import { v as validateProp } from './props-a85d9c89.js';
-import { A as AccordionItemClass, a as AccordionClass, b as AccordionSizes } from './constants-09bda759.js';
-import { V as Variants } from './variants-2b936d58.js';
-import { v as validateWcagLabel } from './wcag-7d25e12b.js';
-import { c as canValidateWcagOnRender } from './win-1dbd3f5c.js';
-import { d as delay } from './utils-c057a3fa.js';
-import { g as govHost } from './template-a0067bb6.js';
-import './gov.log-49da0221.js';
-import './sizes-6c5943b4.js';
-import './string.utils-f268fc6b.js';
+import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-84a63a3e.js';
+import { v as validateProp } from './props-ec3beb91.js';
+import { A as AccordionItemClass, a as AccordionClass, b as AccordionSizes } from './constants-66db9786.js';
+import { V as Variants } from './variants-69f013c1.js';
+import { v as validateWcagLabel } from './wcag-6ad92279.js';
+import { c as canValidateWcagOnRender } from './win-b64cd8a6.js';
+import { d as delay } from './utils-e10e994d.js';
+import { g as govHost } from './template-94812ab3.js';
+import './gov.log-431da6b2.js';
+import './sizes-5b9e579f.js';
+import './string.utils-5ce3f551.js';
 
 const govAccordionCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}@keyframes countdown{to{transform:scaleX(0)}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes pulse{0%{opacity:1}50%{opacity:0.4}100%{opacity:1}}.gov-accordion{position:relative;display:block;width:100%}.gov-accordion[no-border] .gov-accordion-item::before{background-color:transparent !important}";
+const GovAccordionStyle0 = govAccordionCss;
 
 const GovAccordion = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.govChange = createEvent(this, "gov-change", 7);
-    this.size = 'm';
-    this.variant = 'primary';
-    this.noBorder = false;
-    this.wcagLabel = undefined;
-    this.wcagLabelledBy = undefined;
-    this.h = govHost(this.host);
-  }
-  validateSize(newValue) {
-    validateProp(AccordionSizes, newValue, AccordionClass.root);
-  }
-  validateVariant(newValue) {
-    validateProp(Variants, newValue, AccordionClass.root);
-  }
-  componentWillLoad() {
-    this.validateSize(this.size);
-    this.validateVariant(this.variant);
-  }
-  componentDidLoad() {
-    this.host.querySelectorAll(AccordionItemClass.root).forEach((child) => {
-      child.addEventListener('gov-change', (e) => {
-        e.stopPropagation();
-        this.govChange.emit({
-          component: AccordionClass.root,
-          open: e.detail.open,
-          ref: e.detail.ref
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.govChange = createEvent(this, "gov-change", 7);
+        this.size = 'm';
+        this.variant = 'primary';
+        this.noBorder = false;
+        this.wcagLabel = undefined;
+        this.wcagLabelledBy = undefined;
+        this.h = govHost(this.host);
+    }
+    validateSize(newValue) {
+        validateProp(AccordionSizes, newValue, AccordionClass.root);
+    }
+    validateVariant(newValue) {
+        validateProp(Variants, newValue, AccordionClass.root);
+    }
+    componentWillLoad() {
+        this.validateSize(this.size);
+        this.validateVariant(this.variant);
+    }
+    componentDidLoad() {
+        this.host.querySelectorAll(AccordionItemClass.root).forEach((child) => {
+            child.addEventListener('gov-change', (e) => {
+                e.stopPropagation();
+                this.govChange.emit({
+                    component: AccordionClass.root,
+                    open: e.detail.open,
+                    ref: e.detail.ref
+                });
+            });
         });
-      });
-    });
-  }
-  async componentDidRender() {
-    if (canValidateWcagOnRender()) {
-      await delay(500);
-      await this.validateWcag();
     }
-  }
-  render() {
-    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
-   */
-  async validateWcag() {
-    validateWcagLabel(this.wcagLabel, this.wcagLabelledBy, AccordionClass.root);
-  }
-  get host() { return getElement(this); }
-  static get watchers() { return {
-    "size": ["validateSize"],
-    "variant": ["validateVariant"]
-  }; }
+    async componentDidRender() {
+        if (canValidateWcagOnRender()) {
+            await delay(500);
+            await this.validateWcag();
+        }
+    }
+    render() {
+        return (h(Host, { key: 'ad467ae56f7fc5752bc24da027a8f39630153be2', class: this.h.classes(AccordionClass.root), size: this.size, variant: this.variant, role: 'list', "arial-label": this.wcagLabel, "arial-labelledby": this.wcagLabelledBy }, h("slot", { key: '7d8e02440317a0fd87a32e46faea91d473e64f3a' })));
+    }
+    /**
+     * Validate the WCAG attributes of the component
+     */
+    async validateWcag() {
+        validateWcagLabel(this.wcagLabel, this.wcagLabelledBy, AccordionClass.root);
+    }
+    get host() { return getElement(this); }
+    static get watchers() { return {
+        "size": ["validateSize"],
+        "variant": ["validateVariant"]
+    }; }
 };
-GovAccordion.style = govAccordionCss;
+GovAccordion.style = GovAccordionStyle0;
 
 export { GovAccordion as gov_accordion };
 

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

@@ -1 +1 @@
-{"file":"gov-accordion.entry.js","mappings":";;;;;;;;;;;;AAAA,MAAM,eAAe,GAAG,gfAAgf;;MCe3f,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;GAC3D;EAGD,eAAe,CAAC,QAAgB;IAC/B,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;GACrD;EAED,iBAAiB;IAChB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC5B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;GAClC;EAED,gBAAgB;IACf,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,KAAkC;MAC9F,KAAK,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC,CAAkC;QACvE,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;OACF,CAAC,CAAA;KACF,CAAC,CAAA;GACF;EAED,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,QACC,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,IACrC,eAAQ,CACF,EACP;GACD;;;;EAMD,MAAM,YAAY;IACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;GAC3E;;;;;;;;;;;","names":[],"sources":["../../../packages/core/src/components/gov-accordion/gov-accordion.scss?tag=gov-accordion","../../../packages/core/src/components/gov-accordion/gov-accordion.tsx"],"sourcesContent":["/*\n *   Accordion\n */\n\n$class: \".gov-accordion\";\n\n#{$class} {\n\t@include base();\n\n\t&[no-border] {\n\t\t.gov-accordion-item::before {\n\t\t\tbackground-color: transparent !important;\n\t\t}\n\t}\n}\n","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"],"version":3}
+{"file":"gov-accordion.entry.js","mappings":";;;;;;;;;;;;AAAA,MAAM,eAAe,GAAG,gfAAgf,CAAC;AACzgB,2BAAe,eAAe;;MCcjB,YAAY;IAGxB;;;oBAQ4C,GAAG;uBAIG,SAAS;wBAII,KAAK;;;QAfnE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IA6BD,YAAY,CAAC,QAAgB;QAC5B,YAAY,CAAC,cAAc,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;KAC3D;IAGD,eAAe,CAAC,QAAgB;QAC/B,YAAY,CAAC,QAAQ,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;KACrD;IAED,iBAAiB;QAChB,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;QAC5B,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;KAClC;IAED,gBAAgB;QACf,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC,KAAkC;YAC9F,KAAK,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC,CAAkC;gBACvE,CAAC,CAAC,eAAe,EAAE,CAAA;gBACnB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;oBACnB,SAAS,EAAE,cAAc,CAAC,IAAI;oBAC9B,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,IAAI;oBACnB,GAAG,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG;iBACjB,CAAC,CAAA;aACF,CAAC,CAAA;SACF,CAAC,CAAA;KACF;IAED,MAAM,kBAAkB;QACvB,IAAI,uBAAuB,EAAE,EAAE;YAC9B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;YAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;SACzB;KACD;IAED,MAAM;QACL,QACC,EAAC,IAAI,qDACJ,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,IACrC,8DAAQ,CACF,EACP;KACD;;;;IAMD,MAAM,YAAY;QACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;KAC3E;;;;;;;;;;;","names":[],"sources":["../../../packages/core/src/components/gov-accordion/gov-accordion.scss?tag=gov-accordion","../../../packages/core/src/components/gov-accordion/gov-accordion.tsx"],"sourcesContent":["/*\n *   Accordion\n */\n\n$class: \".gov-accordion\";\n\n#{$class} {\n\t@include base();\n\n\t&[no-border] {\n\t\t.gov-accordion-item::before {\n\t\t\tbackground-color: transparent !important;\n\t\t}\n\t}\n}\n","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"],"version":3}

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

@@ -1,113 +1,116 @@
-import { r as registerInstance, h, a as Host, g as getElement, c as createEvent } from './index-eb59f132.js';
-import { c as validateWcagProp, v as validateWcagLabel } from './wcag-7d25e12b.js';
-import { c as canValidateWcagOnRender } from './win-1dbd3f5c.js';
-import { d as delay } from './utils-c057a3fa.js';
-import { g as govHost } from './template-a0067bb6.js';
-import { F as FormMessageClass, a as FormMessageVariants } from './constants-3df712e2.js';
-import { v as validateProp } from './props-a85d9c89.js';
-import { c as createID } from './string.utils-f268fc6b.js';
-import './gov.log-49da0221.js';
-import './variants-2b936d58.js';
+import { r as registerInstance, h, a as Host, g as getElement, c as createEvent } from './index-84a63a3e.js';
+import { c as validateWcagProp, v as validateWcagLabel } from './wcag-6ad92279.js';
+import { c as canValidateWcagOnRender } from './win-b64cd8a6.js';
+import { d as delay } from './utils-e10e994d.js';
+import { g as govHost } from './template-94812ab3.js';
+import { F as FormMessageClass, a as FormMessageVariants } from './constants-78d0d7ff.js';
+import { v as validateProp } from './props-ec3beb91.js';
+import { c as createID } from './string.utils-5ce3f551.js';
+import './gov.log-431da6b2.js';
+import './variants-69f013c1.js';
 
 const AttachmentsClass = {
-  root: 'gov-attachments',
-  label: 'gov-attachments__label',
-  list: 'gov-attachments__list',
+    root: 'gov-attachments',
+    label: 'gov-attachments__label',
+    list: 'gov-attachments__list',
 };
 const AttachmentsItemClass = {
-  root: 'gov-attachments-item',
-  name: 'gov-attachments-item__name',
-  file: 'gov-attachments-item__file',
-  messages: 'gov-attachments-item__messages',
+    root: 'gov-attachments-item',
+    name: 'gov-attachments-item__name',
+    file: 'gov-attachments-item__file',
+    messages: 'gov-attachments-item__messages',
 };
 
 const govAttachmentsCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}@keyframes countdown{to{transform:scaleX(0)}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes pulse{0%{opacity:1}50%{opacity:0.4}100%{opacity:1}}.gov-attachments{position:relative;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)}.gov-attachments__list>*:last-child{margin-bottom:0}";
+const GovAttachmentsStyle0 = govAttachmentsCss;
 
 const GovAttachments = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.label = undefined;
-    this.wcagLabel = undefined;
-    this.h = govHost(this.host);
-  }
-  async componentDidRender() {
-    if (canValidateWcagOnRender()) {
-      await delay(500);
-      await this.validateWcag();
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.label = undefined;
+        this.wcagLabel = undefined;
+        this.h = govHost(this.host);
     }
-  }
-  render() {
-    return (h(Host, { class: this.h.classes(AttachmentsClass.root) }, this.label ? h("p", { class: AttachmentsClass.label }, this.label) : null, h("div", { class: AttachmentsClass.list, 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); }
+    async componentDidRender() {
+        if (canValidateWcagOnRender()) {
+            await delay(500);
+            await this.validateWcag();
+        }
+    }
+    render() {
+        return (h(Host, { key: 'adc3c386db27941978e9499293729279dfbda8a6', class: this.h.classes(AttachmentsClass.root) }, this.label ? h("p", { class: AttachmentsClass.label }, this.label) : null, h("div", { key: '0c23c9ec4f1370c882826c2752c74642e624f7de', class: AttachmentsClass.list, role: "list", "aria-label": this.wcagLabel }, h("slot", { key: 'ae8301af1d82c13e88f351adb78b6f794c3f0deb' }))));
+    }
+    /**
+     * Validate the WCAG attributes of the component
+     */
+    async validateWcag() {
+        validateWcagProp(this.wcagLabel, 'wcag-label', AttachmentsClass.root);
+    }
+    get host() { return getElement(this); }
 };
-GovAttachments.style = govAttachmentsCss;
+GovAttachments.style = GovAttachmentsStyle0;
 
 const govAttachmentsItemCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}@keyframes countdown{to{transform:scaleX(0)}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes pulse{0%{opacity:1}50%{opacity:0.4}100%{opacity:1}}.gov-attachments-item{position:relative;display:block;width:100%;margin:0rem 0rem 0.5rem}.gov-attachments-item__messages>*:last-child{margin-bottom:0}.gov-attachments-item__file{display:flex;gap:1rem}.gov-attachments-item__name{display:flex;gap:0 0.5rem;flex-wrap:wrap;align-items:center;align-self:center;margin:0;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 GovAttachmentsItemStyle0 = govAttachmentsItemCss;
 
 const GovAttachmentsItem = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.govRemove = createEvent(this, "gov-remove", 7);
-    this.wcagRemoveLabel = undefined;
-    this.wcagRemoveLabelledBy = undefined;
-    this.h = govHost(this.host);
-  }
-  async componentDidRender() {
-    if (canValidateWcagOnRender()) {
-      await delay(500);
-      await this.validateWcag();
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.govRemove = createEvent(this, "gov-remove", 7);
+        this.wcagRemoveLabel = undefined;
+        this.wcagRemoveLabelledBy = undefined;
+        this.h = govHost(this.host);
+    }
+    async componentDidRender() {
+        if (canValidateWcagOnRender()) {
+            await delay(500);
+            await this.validateWcag();
+        }
+    }
+    render() {
+        return (h(Host, { key: '015f39cdea81c65f2611071cb85c2d72ed5108eb', class: this.h.classes(AttachmentsItemClass.root), role: "listitem" }, h("div", { key: '9ced89cbee422052b997ede6e35e1a5228397d24', class: AttachmentsItemClass.file }, h("p", { key: '674843721e5015d50fbf0d2e6bd7fcc95e38cc4f', class: AttachmentsItemClass.name }, h("slot", { key: '2ce5d7c8afa3655614cab57e6907caa7d84770b6' }), h("slot", { key: 'a0c55792da29507f935841b47cc009bc4c1914bd', name: "info" })), h("gov-button", { key: '08bb5ea2679d8d116f073552d7101bf59c9454e7', variant: "primary", type: "base", size: "s", "wcag-label": this.wcagRemoveLabel, "wcag-labelled-by": this.wcagRemoveLabelledBy, "on-gov-click": this.govRemove.emit }, h("gov-icon", { key: '657e53ab7128c12b6bae2a427ca7b840b0a1b908', slot: "left-icon", name: "x-lg" }))), this.h.hasSlot('message') && (h("div", { key: '8c333c0f6b74ac28502abbcb0d48f1339f2cc38a', class: AttachmentsItemClass.messages }, h("slot", { key: 'c9d727112efad1e589aca3ada9f74600acedc0c1', name: "message" })))));
+    }
+    /**
+     * Validate the WCAG attributes of the component
+     */
+    async validateWcag() {
+        validateWcagLabel(this.wcagRemoveLabel, this.wcagRemoveLabelledBy, AttachmentsItemClass.root);
     }
-  }
-  render() {
-    return (h(Host, { class: this.h.classes(AttachmentsItemClass.root), role: "listitem" }, h("div", { class: AttachmentsItemClass.file }, h("p", { 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: "x-lg" }))), this.h.hasSlot('message') && (h("div", { class: AttachmentsItemClass.messages }, h("slot", { name: "message" })))));
-  }
-  /**
-   * Validate the WCAG attributes of the component
-   */
-  async validateWcag() {
-    validateWcagLabel(this.wcagRemoveLabel, this.wcagRemoveLabelledBy, AttachmentsItemClass.root);
-  }
-  get host() { return getElement(this); }
+    get host() { return getElement(this); }
 };
-GovAttachmentsItem.style = govAttachmentsItemCss;
+GovAttachmentsItem.style = GovAttachmentsItemStyle0;
 
 const govFormMessageCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}@keyframes countdown{to{transform:scaleX(0)}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes pulse{0%{opacity:1}50%{opacity:0.4}100%{opacity:1}}.gov-form-message{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);display:flex;gap:0.5rem;margin:0rem 0rem 1rem}.gov-form-message__icon{position:relative;top:calc(var(--gov-text-s-font-size) / 6);display:flex}.gov-form-message__icon>*{width:calc(var(--gov-text-s-font-size) * 1.167);height:calc(var(--gov-text-s-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 GovFormMessageStyle0 = govFormMessageCss;
 
 const GovFormMessage = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.variant = 'secondary';
-    this.h = govHost(this.host);
-    this.messageId = createID('GovFormMessage');
-  }
-  validateVariant(newValue) {
-    validateProp(FormMessageVariants, 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"]
-  }; }
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.variant = 'secondary';
+        this.h = govHost(this.host);
+        this.messageId = createID('GovFormMessage');
+    }
+    validateVariant(newValue) {
+        validateProp(FormMessageVariants, newValue, FormMessageClass.root);
+    }
+    componentWillLoad() {
+        this.validateVariant(this.variant);
+    }
+    render() {
+        return (h(Host, { key: 'e9460c70389a45d8aafa99977659a6d20a54ccf6', class: this.h.classes(FormMessageClass.root), variant: this.variant }, this.h.hasSlot('icon') && (h("span", { key: 'e73260c0d32722fc6468124b58cde3e63ef63ce6', class: FormMessageClass.icon }, h("slot", { key: '1f93d299870bddebd5bd0afdcbb0ef32b981031b', name: "icon" }))), h("span", { key: '7579ce29cb522cfc0b3a67f98fd14769db3c8ac7', id: this.messageId, class: FormMessageClass.content }, h("slot", { key: 'a8e452a6024d6ab15c19a59b526a062522e9cb36' }))));
+    }
+    /**
+     * Returns unique identfiier of message
+     */
+    async identifier() {
+        return this.messageId;
+    }
+    get host() { return getElement(this); }
+    static get watchers() { return {
+        "variant": ["validateVariant"]
+    }; }
 };
-GovFormMessage.style = govFormMessageCss;
+GovFormMessage.style = GovFormMessageStyle0;
 
 export { GovAttachments as gov_attachments, GovAttachmentsItem as gov_attachments_item, GovFormMessage as gov_form_message };
 

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

@@ -1 +1 @@
-{"file":"gov-attachments.gov-attachments-item.gov-form-message.entry.js","mappings":"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","names":[],"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\tlist: 'gov-attachments__list',\n}\n\nexport const AttachmentsItemClass = {\n\troot: 'gov-attachments-item',\n\tname: 'gov-attachments-item__name',\n\tfile: 'gov-attachments-item__file',\n\tmessages: 'gov-attachments-item__messages',\n}\n","/*\n *   Attachments\n */\n\n$class: \".gov-attachments\";\n\n#{$class} {\n\t@include base();\n\t&__label {\n\t\t@include typography($font-size-s);\n\t\tcolor: $form-label-color;\n\t}\n\t&__list {\n\t\t@include reset-last-margin();\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'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-attachments',\n\tstyleUrl: 'gov-attachments.scss',\n})\nexport class GovAttachments {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAttachmentsElement\n\t/**\n\t * Label of attachments section\n\t */\n\t@Prop() readonly label: string\n\t/**\n\t * Adds accessible label for the attachment section that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AttachmentsClass.root)}>\n\t\t\t\t{this.label ? <p class={AttachmentsClass.label}>{this.label}</p> : null}\n\t\t\t\t<div class={AttachmentsClass.list} role=\"list\" aria-label={this.wcagLabel}>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagProp(this.wcagLabel, 'wcag-label', AttachmentsClass.root)\n\t}\n}\n","/*\n *   Attachments - Item\n */\n\n$class: \".gov-attachments-item\";\n\n#{$class} {\n\t@include base();\n\tmargin: rem-calc(0 0 8);\n\t&__messages {\n\t\t@include reset-last-margin();\n\t}\n\t&__file {\n\t\tdisplay: flex;\n\t\tgap: rem-calc(16);\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\tmargin: 0;\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'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-attachments-item',\n\tstyleUrl: 'gov-attachments-item.scss',\n})\nexport class GovAttachmentsItem {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAttachmentsItemElement\n\n\t/**\n\t * Adds accessible label for the remove button that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-remove-label' }) readonly wcagRemoveLabel: string\n\t/**\n\t * Indicates the id of a component that labels the remove button.\n\t */\n\t@Prop({ attribute: 'wcag-remove-labelled-by' }) readonly wcagRemoveLabelledBy: string\n\t/**\n\t * Emitted when the file is removed\n\t */\n\t@Event({ eventName: 'gov-remove' }) govRemove: EventEmitter<PointerEvent>\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AttachmentsItemClass.root)} role=\"listitem\">\n\t\t\t\t<div class={AttachmentsItemClass.file}>\n\t\t\t\t\t<p class={AttachmentsItemClass.name}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t<slot name=\"info\" />\n\t\t\t\t\t</p>\n\t\t\t\t\t<gov-button\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\twcag-label={this.wcagRemoveLabel}\n\t\t\t\t\t\twcag-labelled-by={this.wcagRemoveLabelledBy}\n\t\t\t\t\t\ton-gov-click={this.govRemove.emit}\n\t\t\t\t\t>\n\t\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t\t\t</gov-button>\n\t\t\t\t</div>\n\n\t\t\t\t{this.h.hasSlot('message') && (\n\t\t\t\t\t<div class={AttachmentsItemClass.messages}>\n\t\t\t\t\t\t<slot name=\"message\" />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagLabel(this.wcagRemoveLabel, this.wcagRemoveLabelledBy, AttachmentsItemClass.root)\n\t}\n}\n","/*\n *   Form Message\n */\n\n$class: \".gov-form-message\";\n$font-size: $font-size-s;\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, FormMessageVariants, FormMessageVariantType } from './constants'\nimport { govHost } from '../../../helpers/Dom/template'\nimport { GovHost } from '../../../helpers/Dom/template.types'\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 message.\n\t */\n\t@Prop({ attribute: 'variant' }) readonly variant?: FormMessageVariantType = 'secondary'\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormMessageVariants, 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}
+{"file":"gov-attachments.gov-attachments-item.gov-form-message.entry.js","mappings":"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","names":[],"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\tlist: 'gov-attachments__list',\n}\n\nexport const AttachmentsItemClass = {\n\troot: 'gov-attachments-item',\n\tname: 'gov-attachments-item__name',\n\tfile: 'gov-attachments-item__file',\n\tmessages: 'gov-attachments-item__messages',\n}\n","/*\n *   Attachments\n */\n\n$class: \".gov-attachments\";\n\n#{$class} {\n\t@include base();\n\t&__label {\n\t\t@include typography($font-size-s);\n\t\tcolor: $form-label-color;\n\t}\n\t&__list {\n\t\t@include reset-last-margin();\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'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-attachments',\n\tstyleUrl: 'gov-attachments.scss',\n})\nexport class GovAttachments {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAttachmentsElement\n\t/**\n\t * Label of attachments section\n\t */\n\t@Prop() readonly label: string\n\t/**\n\t * Adds accessible label for the attachment section that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AttachmentsClass.root)}>\n\t\t\t\t{this.label ? <p class={AttachmentsClass.label}>{this.label}</p> : null}\n\t\t\t\t<div class={AttachmentsClass.list} role=\"list\" aria-label={this.wcagLabel}>\n\t\t\t\t\t<slot />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagProp(this.wcagLabel, 'wcag-label', AttachmentsClass.root)\n\t}\n}\n","/*\n *   Attachments - Item\n */\n\n$class: \".gov-attachments-item\";\n\n#{$class} {\n\t@include base();\n\tmargin: rem-calc(0 0 8);\n\t&__messages {\n\t\t@include reset-last-margin();\n\t}\n\t&__file {\n\t\tdisplay: flex;\n\t\tgap: rem-calc(16);\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\tmargin: 0;\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'\nimport { govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-attachments-item',\n\tstyleUrl: 'gov-attachments-item.scss',\n})\nexport class GovAttachmentsItem {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovAttachmentsItemElement\n\n\t/**\n\t * Adds accessible label for the remove button that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-remove-label' }) readonly wcagRemoveLabel: string\n\t/**\n\t * Indicates the id of a component that labels the remove button.\n\t */\n\t@Prop({ attribute: 'wcag-remove-labelled-by' }) readonly wcagRemoveLabelledBy: string\n\t/**\n\t * Emitted when the file is removed\n\t */\n\t@Event({ eventName: 'gov-remove' }) govRemove: EventEmitter<PointerEvent>\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={this.h.classes(AttachmentsItemClass.root)} role=\"listitem\">\n\t\t\t\t<div class={AttachmentsItemClass.file}>\n\t\t\t\t\t<p class={AttachmentsItemClass.name}>\n\t\t\t\t\t\t<slot />\n\t\t\t\t\t\t<slot name=\"info\" />\n\t\t\t\t\t</p>\n\t\t\t\t\t<gov-button\n\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\twcag-label={this.wcagRemoveLabel}\n\t\t\t\t\t\twcag-labelled-by={this.wcagRemoveLabelledBy}\n\t\t\t\t\t\ton-gov-click={this.govRemove.emit}\n\t\t\t\t\t>\n\t\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"x-lg\"></gov-icon>\n\t\t\t\t\t</gov-button>\n\t\t\t\t</div>\n\n\t\t\t\t{this.h.hasSlot('message') && (\n\t\t\t\t\t<div class={AttachmentsItemClass.messages}>\n\t\t\t\t\t\t<slot name=\"message\" />\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagLabel(this.wcagRemoveLabel, this.wcagRemoveLabelledBy, AttachmentsItemClass.root)\n\t}\n}\n","/*\n *   Form Message\n */\n\n$class: \".gov-form-message\";\n$font-size: $font-size-s;\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, FormMessageVariants, FormMessageVariantType } from './constants'\nimport { govHost } from '../../../helpers/Dom/template'\nimport { GovHost } from '../../../helpers/Dom/template.types'\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 message.\n\t */\n\t@Prop({ attribute: 'variant' }) readonly variant?: FormMessageVariantType = 'secondary'\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormMessageVariants, 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

@@ -1,45 +1,46 @@
-import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-eb59f132.js';
-import { v as validateWcagLabel } from './wcag-7d25e12b.js';
-import { c as canValidateWcagOnRender } from './win-1dbd3f5c.js';
-import { d as delay } from './utils-c057a3fa.js';
-import { g as govHost } from './template-a0067bb6.js';
-import './gov.log-49da0221.js';
-import './string.utils-f268fc6b.js';
+import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-84a63a3e.js';
+import { v as validateWcagLabel } from './wcag-6ad92279.js';
+import { c as canValidateWcagOnRender } from './win-b64cd8a6.js';
+import { d as delay } from './utils-e10e994d.js';
+import { g as govHost } from './template-94812ab3.js';
+import './gov.log-431da6b2.js';
+import './string.utils-5ce3f551.js';
 
 const BackdropClass = {
-  root: 'gov-backdrop',
-  bg: 'gov-backdrop__bg',
+    root: 'gov-backdrop',
+    bg: 'gov-backdrop__bg',
 };
 
 const govBackdropCss = ".gov-spin-animation,.gov-pseudo-spin-animation::before{animation:spin 4s linear infinite}@keyframes spin{100%{transform:rotate(360deg)}}@keyframes countdown{to{transform:scaleX(0)}}@keyframes progress{0%{background-position:-200px 0}100%{background-position:calc(200px + 100%) 0}}@keyframes pulse{0%{opacity:1}50%{opacity:0.4}100%{opacity:1}}.gov-backdrop__bg{z-index:100;position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--gov-backdrop-bg, var(--gov-color-secondary));opacity:var(--gov-backdrop-opacity, 0.45)}.gov-backdrop[inverse=\"\"] .gov-backdrop__bg,.gov-backdrop[inverse=true i] .gov-backdrop__bg,.gov-backdrop[inverse=\"1\"] .gov-backdrop__bg{background-color:var(--gov-backdrop-bg-inverse, var(--gov-color-neutral-white));opacity:var(--gov-backdrop-opacity, 0.8)}";
+const GovBackdropStyle0 = govBackdropCss;
 
 const GovBackdrop = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.govClick = createEvent(this, "gov-click", 7);
-    this.inverse = false;
-    this.wcagLabel = undefined;
-    this.wcagLabelledBy = undefined;
-    this.h = govHost(this.host);
-  }
-  async componentDidRender() {
-    if (canValidateWcagOnRender()) {
-      await delay(500);
-      await this.validateWcag();
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.govClick = createEvent(this, "gov-click", 7);
+        this.inverse = false;
+        this.wcagLabel = undefined;
+        this.wcagLabelledBy = undefined;
+        this.h = govHost(this.host);
     }
-  }
-  render() {
-    return (h(Host, { class: this.h.classes(BackdropClass.root) }, h("div", { role: 'button', "aria-label": this.wcagLabel, "aria-labelledby": this.wcagLabelledBy, onClick: e => this.govClick.emit(e), class: BackdropClass.bg })));
-  }
-  /**
-   * Validate the WCAG attributes of the component
-   */
-  async validateWcag() {
-    validateWcagLabel(this.wcagLabel, this.wcagLabelledBy, BackdropClass.root);
-  }
-  get host() { return getElement(this); }
+    async componentDidRender() {
+        if (canValidateWcagOnRender()) {
+            await delay(500);
+            await this.validateWcag();
+        }
+    }
+    render() {
+        return (h(Host, { key: '5bac97ada5dd6033242d8f32f8d8081ffda63b0e', class: this.h.classes(BackdropClass.root) }, h("div", { key: '1ceee80d74a81381a6aee4c042f94d2adc3d8987', role: 'button', "aria-label": this.wcagLabel, "aria-labelledby": this.wcagLabelledBy, onClick: e => this.govClick.emit(e), class: BackdropClass.bg })));
+    }
+    /**
+     * Validate the WCAG attributes of the component
+     */
+    async validateWcag() {
+        validateWcagLabel(this.wcagLabel, this.wcagLabelledBy, BackdropClass.root);
+    }
+    get host() { return getElement(this); }
 };
-GovBackdrop.style = govBackdropCss;
+GovBackdrop.style = GovBackdropStyle0;
 
 export { GovBackdrop as gov_backdrop };
 

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

@@ -1 +1 @@
-{"file":"gov-backdrop.entry.js","mappings":";;;;;;;;AAAO,MAAM,aAAa,GAAG;EAC5B,IAAI,EAAE,cAAc;EACpB,EAAE,EAAE,kBAAkB;CACtB;;ACHD,MAAM,cAAc,GAAG,uxBAAuxB;;MCYjyB,WAAW;EAGvB;;;mBAQoC,KAAK;;;IAPxC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EAoBD,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,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,IAC9C,WACC,IAAI,EAAE,QAAQ,gBACF,IAAI,CAAC,SAAS,qBACT,IAAI,CAAC,cAAc,EACpC,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EACnC,KAAK,EAAE,aAAa,CAAC,EAAE,GACjB,CACD,EACP;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\tbg: 'gov-backdrop__bg',\n}\n","/*\n *   Backdrop\n */\n\n$class: \".gov-backdrop\";\n\n#{$class} {\n\t&__bg {\n\t\t@include z-index(\"modal\", 0);\n\t\tposition: fixed;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\tbackground-color: $backdrop-bg;\n\t\topacity: $backdrop-opacity;\n\t}\n\n\t// VARIANTS\n\t@include parameter(\"inverse\") {\n\t\t#{$class} {\n\t\t\t&__bg {\n\t\t\t\tbackground-color: $backdrop-bg-inverse;\n\t\t\t\topacity: $backdrop-opacity-inverse;\n\t\t\t}\n\t\t}\n\t}\n}\n","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: HTMLGovBackdropElement\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"],"version":3}
+{"file":"gov-backdrop.entry.js","mappings":";;;;;;;;AAAO,MAAM,aAAa,GAAG;IAC5B,IAAI,EAAE,cAAc;IACpB,EAAE,EAAE,kBAAkB;CACtB;;ACHD,MAAM,cAAc,GAAG,uxBAAuxB,CAAC;AAC/yB,0BAAe,cAAc;;MCWhB,WAAW;IAGvB;;;uBAQoC,KAAK;;;QAPxC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KAC3B;IAoBD,MAAM,kBAAkB;QACvB,IAAI,uBAAuB,EAAE,EAAE;YAC9B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;YAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;SACzB;KACD;IAED,MAAM;QACL,QACC,EAAC,IAAI,qDAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,IAC9C,4DACC,IAAI,EAAE,QAAQ,gBACF,IAAI,CAAC,SAAS,qBACT,IAAI,CAAC,cAAc,EACpC,OAAO,EAAE,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,EACnC,KAAK,EAAE,aAAa,CAAC,EAAE,GACjB,CACD,EACP;KACD;;;;IAMD,MAAM,YAAY;QACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,aAAa,CAAC,IAAI,CAAC,CAAA;KAC1E;;;;;;;","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\tbg: 'gov-backdrop__bg',\n}\n","/*\n *   Backdrop\n */\n\n$class: \".gov-backdrop\";\n\n#{$class} {\n\t&__bg {\n\t\t@include z-index(\"modal\", 0);\n\t\tposition: fixed;\n\t\ttop: 0;\n\t\tright: 0;\n\t\tbottom: 0;\n\t\tleft: 0;\n\t\tbackground-color: $backdrop-bg;\n\t\topacity: $backdrop-opacity;\n\t}\n\n\t// VARIANTS\n\t@include parameter(\"inverse\") {\n\t\t#{$class} {\n\t\t\t&__bg {\n\t\t\t\tbackground-color: $backdrop-bg-inverse;\n\t\t\t\topacity: $backdrop-opacity-inverse;\n\t\t\t}\n\t\t}\n\t}\n}\n","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: HTMLGovBackdropElement\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"],"version":3}