@gov-design-system-ce/components 0.0.34 → 0.0.36

package/dist/components/gov-form-input2.js.map

@@ -1 +1 @@
-{"file":"gov-form-input2.js","mappings":"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","names":[],"sources":["../../../packages/core/src/components/gov-form/input/gov-form-input.scss?tag=gov-form-input","../../../packages/core/src/components/gov-form/input/gov-form-input.tsx"],"sourcesContent":["/*\n *   Input\n */\n\n@import \"../input/gov-form-input-core.scss\";\n$class: \".gov-form-input\";\n\n#{$class} {\n\t@extend %form-input-core;\n\n\t// STATES\n\t@include parameter(\"invalid\") {\n\t\t*[slot=\"right-icon\"]:not(.icon-validation):not(.icon-arrow) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t// VARIANTS\n\t&[type=\"reset\"] {\n\t\tinput {\n\t\t\tborder-width: 0;\n\t\t\t&:focus {\n\t\t\t\toutline: none;\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Element, Host, h, Prop, Watch, Event, EventEmitter, State, Method } from '@stencil/core'\nimport { GovHost } from '../../../helpers/Dom/template.types'\nimport { FormInputSizes, FormInputSizesType, InputType, Type } from './constants'\nimport { createID } from '../../../utils/string.utils'\nimport { govHost, toBoolAttrIfDefined, toOnOffAttrIfDefined } from '../../../helpers/Dom/template'\nimport { FormInputClass, FormInputVariants, FormInputVariantType } from './constants'\nimport { validateProp } from '../../../helpers/Validate/props'\nimport { canValidateWcagOnRender } from '../../../helpers/Dom/win'\nimport { delay } from '../../../utils/utils'\nimport { validateWcagLabelFor, validateWcagRef } from '../../../helpers/Validate/wcag'\nimport { GovForm } from '../../../helpers/Dom/form.types'\nimport { govForm } from '../../../helpers/Dom/form'\nimport { FormInputEvent } from './gov-form-input.types'\n\nenum Tags {\n\tINPUT = 'input',\n\tTEXTAREA = 'textarea',\n}\n\n@Component({\n\ttag: 'gov-form-input',\n\tstyleUrl: 'gov-form-input.scss',\n})\nexport class GovFormInput {\n\tprivate f: GovForm\n\tprivate h: GovHost\n\tprivate inputRef?: HTMLInputElement\n\tprivate readonly inputId: string\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.inputId = createID('GovInput')\n\t\tthis.f = govForm(govHost(this.host))\n\t}\n\n\t@Element() host: HTMLGovFormInputElement\n\t/**\n\t * Value of input\n\t */\n\t@Prop({ reflect: true, mutable: true }) value: string\n\t/**\n\t * Custom input identifier.\n\t */\n\t@Prop({ attribute: 'identifier' }) readonly identifier: string\n\t/**\n\t * Style variation of the form input.\n\t */\n\t@Prop() readonly variant?: FormInputVariantType\n\t/**\n\t * Indicates the entered value of child form element does conform to the format expected by the application.\n\t */\n\t@Prop() readonly success: boolean\n\t/**\n\t * Input’s size.\n\t */\n\t@Prop() readonly size?: FormInputSizesType = 'm'\n\t/**\n\t * Name of the input.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Generates a texarea for the possibility of multiple lines\n\t */\n\t@Prop() readonly multiline: boolean\n\t/**\n\t * Same as original parameter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-rows\n\t */\n\t@Prop() readonly rows: number\n\t/**\n\t * Same as original parameter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-cols\n\t */\n\t@Prop() readonly cols: number\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the input component disabled.\n\t * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean\n\t/**\n\t * Text that appears in the form control when it has no value set\n\t */\n\t@Prop() readonly placeholder: string\n\t/**\n\t * The value is not editable\n\t */\n\t@Prop() readonly readonly: boolean\n\t/**\n\t * Minimum length (number of characters) of value\n\t */\n\t@Prop() readonly minlength: number\n\t/**\n\t * Maximum length (number of characters) of value\n\t */\n\t@Prop() readonly maxlength: number\n\t/**\n\t * Minimum value that is acceptable and valid for the input containing the attribute\n\t */\n\t@Prop() readonly min?: string | number\n\t/**\n\t * Maximum value that is acceptable and valid for the input containing the attribute\n\t */\n\t@Prop() readonly max?: string | number\n\t/**\n\t * Same as original parameter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-autocomplete\n\t */\n\t@Prop() readonly autocomplete: boolean\n\t/**\n\t * Same as original parameter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-autocorrect\n\t */\n\t@Prop() readonly autocorrect: boolean\n\t/**\n\t * Defineds the visual style of input\n\t */\n\t@Prop() readonly type?: Type\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types\n\t */\n\t@Prop() readonly inputType: InputType = 'text'\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/input_role\n\t */\n\t@Prop() readonly role: string\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: 'wcag-described-by' }) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({ attribute: 'wcag-labelled-by' }) readonly wcagLabelledBy: string\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: 'wcag-owns' }) readonly wcagOwns: string\n\t/**\n\t * Indicates whether inputting text could trigger display of one or more predictions of the user's intended value.\n\t */\n\t@Prop({ attribute: 'wcag-autocomplete' }) readonly wcagAutocomplete: string\n\t/**\n\t *  Attribute is set on an element to indicate if a control is expanded or collapsed\n\t */\n\t@Prop({ attribute: 'wcag-expanded' }) readonly wcagExpanded: boolean\n\t/**\n\t * Emitted when the input has focus.\n\t */\n\t@Event({ eventName: 'gov-focus' }) govFocus: EventEmitter<FormInputEvent>\n\t/**\n\t * Emitted when the input loses focus.\n\t */\n\t@Event({ eventName: 'gov-blur' }) govBlur: EventEmitter<FormInputEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({ eventName: 'gov-input' }) govInput: EventEmitter<FormInputEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({ eventName: 'gov-keyup' }) govKeyUp: EventEmitter<FormInputEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({ eventName: 'gov-keydown' }) govKeyDown: EventEmitter<FormInputEvent>\n\t@State() focused: boolean\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormInputVariants, newValue, FormInputClass.root)\n\t}\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormInputSizes, newValue, FormInputClass.root)\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\n\t\tthis.f.passAttrToControl('type', this.multiline ? Tags.TEXTAREA : Tags.INPUT)\n\t\tthis.f.passAttrToLabel('required', String(this.required))\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\tconst Tag = this.multiline ? Tags.TEXTAREA : Tags.INPUT\n\n\t\treturn (\n\t\t\t<Host class={FormInputClass.root} size={this.size} variant={this.variant} type={this.type}>\n\t\t\t\t{this.h.hasSlot('prefix') && <slot name=\"prefix\"></slot>}\n\t\t\t\t<span class=\"element\">\n\t\t\t\t\t{this.h.hasSlot('left-icon') && <slot name=\"left-icon\" />}\n\n\t\t\t\t\t{this.h.hasSlot('right-icon') && !(this.success || this.invalid) && <slot name=\"right-icon\" />}\n\n\t\t\t\t\t{this.success && !this.multiline && <gov-icon slot=\"right-icon\" class=\"icon-validation\" name=\"check-lg\"></gov-icon>}\n\t\t\t\t\t{this.invalid && !this.multiline && <gov-icon slot=\"right-icon\" class=\"icon-validation\" name=\"exclamation-lg\"></gov-icon>}\n\t\t\t\t\t<Tag\n\t\t\t\t\t\ttype={this.inputType}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tid={this.identifier || this.inputId}\n\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\tonFocus={this.onFocusHandler.bind(this)}\n\t\t\t\t\t\tonInput={this.onInputHandler.bind(this)}\n\t\t\t\t\t\tonBlur={this.onBlurHandler.bind(this)}\n\t\t\t\t\t\tonKeyUp={this.onKeyUpHandler.bind(this)}\n\t\t\t\t\t\tonKeyDown={this.onKeyDownHandler.bind(this)}\n\t\t\t\t\t\tref={el => (this.inputRef = el as HTMLInputElement)}\n\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\treadonly={toBoolAttrIfDefined(this.readonly)}\n\t\t\t\t\t\tautocomplete={toOnOffAttrIfDefined(this.autocomplete)}\n\t\t\t\t\t\tautocorrect={toOnOffAttrIfDefined(this.autocorrect)}\n\t\t\t\t\t\tminlength={this.minlength}\n\t\t\t\t\t\tmaxlength={this.maxlength}\n\t\t\t\t\t\tmin={this.min}\n\t\t\t\t\t\tmax={this.max}\n\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\trows={this.rows}\n\t\t\t\t\t\tcols={this.cols}\n\t\t\t\t\t\trole={this.role}\n\t\t\t\t\t\taria-required={toBoolAttrIfDefined(this.required)}\n\t\t\t\t\t\taria-invalid={toBoolAttrIfDefined(this.invalid)}\n\t\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\t\taria-describedby={this.wcagDescribedBy}\n\t\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\t\taria-owns={this.wcagOwns}\n\t\t\t\t\t\taria-expanded={toBoolAttrIfDefined(this.wcagExpanded)}\n\t\t\t\t\t\taria-autocomplete={this.wcagAutocomplete}\n\t\t\t\t\t/>\n\t\t\t\t</span>\n\t\t\t\t{this.h.hasSlot('sufix') && <slot name=\"sufix\"></slot>}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.focused = true\n\t\tthis.govFocus.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.focused = false\n\t\tthis.govBlur.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onKeyUpHandler(e: KeyboardEvent) {\n\t\te.stopPropagation()\n\t\tthis.govKeyUp.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onKeyDownHandler(e: KeyboardEvent) {\n\t\te.stopPropagation()\n\t\tthis.govKeyDown.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onInputHandler(e: InputEvent) {\n\t\tthis.value = (e.target as HTMLInputElement).value\n\t\te.stopPropagation()\n\t\tthis.govInput.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync setFocus(options?: FocusOptions): Promise<void> {\n\t\treturn this.inputRef.focus(options)\n\t}\n\n\t/**\n\t * Sets the ordered value of the element\n\t */\n\t@Method()\n\tasync setValue(value: string): Promise<void> {\n\t\tthis.value = value\n\t}\n\n\t/**\n\t * Clears input value\n\t */\n\t@Method()\n\tasync clearValue(): Promise<void> {\n\t\tthis.value = ''\n\t\tthis.inputRef.value = ''\n\t}\n\n\t/**\n\t * Returns an instance of the native html input element\n\t */\n\t@Method()\n\tasync getRef(): Promise<HTMLInputElement> {\n\t\treturn this.inputRef\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\tvalidateWcagRef(this.wcagDescribedBy, 'wcag-described-by', FormInputClass.root)\n\t\tvalidateWcagRef(this.wcagLabelledBy, 'wcag-labelled-by', FormInputClass.root)\n\t\tvalidateWcagRef(this.wcagOwns, 'wcag-owns', FormInputClass.root)\n\t\tvalidateWcagLabelFor(this.identifier || this.inputId, this.wcagLabelledBy, FormInputClass.root)\n\t}\n}\n"],"version":3}
+{"file":"gov-form-input2.js","mappings":";;;;;;;;;;AAAA,MAAM,eAAe,GAAG,khUAAkhU;;ACc1iU,IAAK,IAGJ;AAHD,WAAK,IAAI;EACR,uBAAe,CAAA;EACf,6BAAqB,CAAA;AACtB,CAAC,EAHI,IAAI,KAAJ,IAAI,QAGR;MAMY,YAAY;EAMxB;;;;;;;;;;;;gBA0B6C,GAAG;;;;;oBAqBX,KAAK;;;;;;;;;;;qBA8CF,MAAM;;;;;;;;;IA5F7C,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC3B,IAAI,CAAC,OAAO,GAAG,QAAQ,CAAC,UAAU,CAAC,CAAA;IACnC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAA;GACxB;EA8ID,eAAe,CAAC,QAAgB;IAC/B,YAAY,CAAC,iBAAiB,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;GAC9D;EAGD,YAAY,CAAC,QAAgB;IAC5B,YAAY,CAAC,cAAc,EAAE,QAAQ,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;GAC3D;EAMD,aAAa;IACZ,IAAI,CAAC,gBAAgB,EAAE,CAAA;GACvB;EAEO,gBAAgB;IACvB,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,MAAM,EAAE,IAAI,CAAC,IAAI,CAAC,CAAA;IAC3C,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,UAAU,EAAE,UAAU,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAA;IAC/D,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAA;IAC7D,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,MAAM,EAAE,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,CAAA;GAC7E;EAED,iBAAiB;IAChB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;IAClC,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC5B,IAAI,CAAC,gBAAgB,EAAE,CAAA;IAEvB,IAAI,CAAC,CAAC,CAAC,eAAe,CAAC,UAAU,EAAE,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAA;GACzD;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,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAA;IAEvD,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IACvF,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,YAAM,IAAI,EAAC,QAAQ,GAAQ,EACxD,YAAM,KAAK,EAAC,SAAS,IACnB,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,YAAM,IAAI,EAAC,WAAW,GAAG,EAExD,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,IAAI,YAAM,IAAI,EAAC,YAAY,GAAG,EAE7F,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,gBAAU,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,UAAU,GAAY,EAClH,IAAI,CAAC,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,gBAAU,IAAI,EAAC,YAAY,EAAC,KAAK,EAAC,iBAAiB,EAAC,IAAI,EAAC,gBAAgB,GAAY,EACzH,EAAC,GAAG,IACH,IAAI,EAAE,IAAI,CAAC,SAAS,EACpB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,EAAE,EAAE,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,OAAO,EACnC,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,EACvC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,EACvC,MAAM,EAAE,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,EACrC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,EACvC,SAAS,EAAE,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,IAAI,CAAC,EAC3C,GAAG,EAAE,EAAE,KAAK,IAAI,CAAC,QAAQ,GAAG,EAAsB,CAAC,EACnD,WAAW,EAAE,IAAI,CAAC,WAAW,EAC7B,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,QAAQ,EAAE,mBAAmB,CAAC,IAAI,CAAC,QAAQ,CAAC,EAC5C,YAAY,EAAE,oBAAoB,CAAC,IAAI,CAAC,YAAY,CAAC,EACrD,WAAW,EAAE,oBAAoB,CAAC,IAAI,CAAC,WAAW,CAAC,EACnD,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,mBACA,mBAAmB,CAAC,IAAI,CAAC,QAAQ,CAAC,kBACnC,mBAAmB,CAAC,IAAI,CAAC,OAAO,CAAC,mBAChC,mBAAmB,CAAC,IAAI,CAAC,QAAQ,CAAC,sBAC/B,IAAI,CAAC,eAAe,qBACrB,IAAI,CAAC,cAAc,eACzB,IAAI,CAAC,QAAQ,mBACT,mBAAmB,CAAC,IAAI,CAAC,YAAY,CAAC,uBAClC,IAAI,CAAC,gBAAgB,GACvC,CACI,EACN,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,IAAI,YAAM,IAAI,EAAC,OAAO,GAAQ,CAChD,EACP;GACD;EAEO,cAAc,CAAC,CAAa;IACnC,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAA;IACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;MAClB,SAAS,EAAE,cAAc,CAAC,IAAI;MAC9B,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,aAAa,EAAE,CAAC;KAChB,CAAC,CAAA;GACF;EAEO,aAAa,CAAC,CAAa;IAClC,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,CAAC,OAAO,GAAG,KAAK,CAAA;IACpB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC;MACjB,SAAS,EAAE,cAAc,CAAC,IAAI;MAC9B,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,aAAa,EAAE,CAAC;KAChB,CAAC,CAAA;GACF;EAEO,cAAc,CAAC,CAAgB;IACtC,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;MAClB,SAAS,EAAE,cAAc,CAAC,IAAI;MAC9B,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,aAAa,EAAE,CAAC;KAChB,CAAC,CAAA;GACF;EAEO,gBAAgB,CAAC,CAAgB;IACxC,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;MACpB,SAAS,EAAE,cAAc,CAAC,IAAI;MAC9B,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,aAAa,EAAE,CAAC;KAChB,CAAC,CAAA;GACF;EAEO,cAAc,CAAC,CAAa;IACnC,IAAI,CAAC,KAAK,GAAI,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAA;IACjD,CAAC,CAAC,eAAe,EAAE,CAAA;IACnB,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;MAClB,SAAS,EAAE,cAAc,CAAC,IAAI;MAC9B,KAAK,EAAE,IAAI,CAAC,KAAK;MACjB,aAAa,EAAE,CAAC;KAChB,CAAC,CAAA;GACF;;;;EAMD,MAAM,QAAQ,CAAC,OAAsB;IACpC,OAAO,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,OAAO,CAAC,CAAA;GACnC;;;;EAMD,MAAM,QAAQ,CAAC,KAAa;IAC3B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;GAClB;;;;EAMD,MAAM,UAAU;IACf,IAAI,CAAC,KAAK,GAAG,EAAE,CAAA;IACf,IAAI,CAAC,QAAQ,CAAC,KAAK,GAAG,EAAE,CAAA;GACxB;;;;EAMD,MAAM,MAAM;IACX,OAAO,IAAI,CAAC,QAAQ,CAAA;GACpB;;;;EAMD,MAAM,YAAY;IACjB,eAAe,CAAC,IAAI,CAAC,eAAe,EAAE,mBAAmB,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;IAC/E,eAAe,CAAC,IAAI,CAAC,cAAc,EAAE,kBAAkB,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;IAC7E,eAAe,CAAC,IAAI,CAAC,QAAQ,EAAE,WAAW,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;IAChE,oBAAoB,CAAC,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,cAAc,EAAE,cAAc,CAAC,IAAI,CAAC,CAAA;GAC/F;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["../../../packages/core/src/components/gov-form/input/gov-form-input.scss?tag=gov-form-input","../../../packages/core/src/components/gov-form/input/gov-form-input.tsx"],"sourcesContent":["/*\n *   Input\n */\n\n@import \"../input/gov-form-input-core.scss\";\n$class: \".gov-form-input\";\n\n#{$class} {\n\t@extend %form-input-core;\n\n\t// STATES\n\t@include parameter(\"invalid\") {\n\t\t*[slot=\"right-icon\"]:not(.icon-validation):not(.icon-arrow) {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t// VARIANTS\n\t&[type=\"reset\"] {\n\t\tinput {\n\t\t\tborder-width: 0;\n\t\t\t&:focus {\n\t\t\t\toutline: none;\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Element, Host, h, Prop, Watch, Event, EventEmitter, State, Method } from '@stencil/core'\nimport { GovHost } from '../../../helpers/Dom/template.types'\nimport { FormInputSizes, FormInputSizesType, InputType, Type } from './constants'\nimport { createID } from '../../../utils/string.utils'\nimport { govHost, toBoolAttr, toBoolAttrIfDefined, toOnOffAttrIfDefined } from \"../../../helpers/Dom/template\"\nimport { FormInputClass, FormInputVariants, FormInputVariantType } from './constants'\nimport { validateProp } from '../../../helpers/Validate/props'\nimport { canValidateWcagOnRender } from '../../../helpers/Dom/win'\nimport { delay } from '../../../utils/utils'\nimport { validateWcagLabelFor, validateWcagRef } from '../../../helpers/Validate/wcag'\nimport { GovForm } from '../../../helpers/Dom/form.types'\nimport { govForm } from '../../../helpers/Dom/form'\nimport { FormInputEvent } from './gov-form-input.types'\n\nenum Tags {\n\tINPUT = 'input',\n\tTEXTAREA = 'textarea',\n}\n\n@Component({\n\ttag: 'gov-form-input',\n\tstyleUrl: 'gov-form-input.scss',\n})\nexport class GovFormInput {\n\tprivate f: GovForm\n\tprivate readonly h: GovHost\n\tprivate inputRef?: HTMLInputElement\n\tprivate readonly inputId: string\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t\tthis.inputId = createID('GovInput')\n\t\tthis.f = govForm(this.h)\n\t}\n\n\t@Element() host: HTMLGovFormInputElement\n\t/**\n\t * Value of input\n\t */\n\t@Prop({ reflect: true, mutable: true }) value: string\n\t/**\n\t * Custom input identifier.\n\t */\n\t@Prop({ attribute: 'identifier' }) readonly identifier: string\n\t/**\n\t * Style variation of the form input.\n\t */\n\t@Prop() readonly variant?: FormInputVariantType\n\t/**\n\t * Indicates the entered value of child form element does conform to the format expected by the application.\n\t */\n\t@Prop() readonly success: boolean\n\t/**\n\t * Input’s size.\n\t */\n\t@Prop() readonly size?: FormInputSizesType = 'm'\n\t/**\n\t * Name of the input.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Generates a texarea for the possibility of multiple lines\n\t */\n\t@Prop() readonly multiline: boolean\n\t/**\n\t * Same as original parameter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-rows\n\t */\n\t@Prop() readonly rows: number\n\t/**\n\t * Same as original parameter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-cols\n\t */\n\t@Prop() readonly cols: number\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the input component disabled.\n\t * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean\n\t/**\n\t * Text that appears in the form control when it has no value set\n\t */\n\t@Prop() readonly placeholder: string\n\t/**\n\t * The value is not editable\n\t */\n\t@Prop() readonly readonly: boolean\n\t/**\n\t * Minimum length (number of characters) of value\n\t */\n\t@Prop() readonly minlength: number\n\t/**\n\t * Maximum length (number of characters) of value\n\t */\n\t@Prop() readonly maxlength: number\n\t/**\n\t * Minimum value that is acceptable and valid for the input containing the attribute\n\t */\n\t@Prop() readonly min?: string | number\n\t/**\n\t * Maximum value that is acceptable and valid for the input containing the attribute\n\t */\n\t@Prop() readonly max?: string | number\n\t/**\n\t * Same as original parameter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-autocomplete\n\t */\n\t@Prop() readonly autocomplete: boolean\n\t/**\n\t * Same as original parameter https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#attr-autocorrect\n\t */\n\t@Prop() readonly autocorrect: boolean\n\t/**\n\t * Defineds the visual style of input\n\t */\n\t@Prop() readonly type?: Type\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#input_types\n\t */\n\t@Prop() readonly inputType: InputType = 'text'\n\t/**\n\t * Same as original parameter\n\t * @link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/input_role\n\t */\n\t@Prop() readonly role: string\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: 'wcag-described-by' }) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({ attribute: 'wcag-labelled-by' }) readonly wcagLabelledBy: string\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: 'wcag-owns' }) readonly wcagOwns: string\n\t/**\n\t * Indicates whether inputting text could trigger display of one or more predictions of the user's intended value.\n\t */\n\t@Prop({ attribute: 'wcag-autocomplete' }) readonly wcagAutocomplete: string\n\t/**\n\t *  Attribute is set on an element to indicate if a control is expanded or collapsed\n\t */\n\t@Prop({ attribute: 'wcag-expanded' }) readonly wcagExpanded: boolean\n\t/**\n\t * Emitted when the input has focus.\n\t */\n\t@Event({ eventName: 'gov-focus' }) govFocus: EventEmitter<FormInputEvent>\n\t/**\n\t * Emitted when the input loses focus.\n\t */\n\t@Event({ eventName: 'gov-blur' }) govBlur: EventEmitter<FormInputEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({ eventName: 'gov-input' }) govInput: EventEmitter<FormInputEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({ eventName: 'gov-keyup' }) govKeyUp: EventEmitter<FormInputEvent>\n\t/**\n\t * Emitted when the input change value.\n\t */\n\t@Event({ eventName: 'gov-keydown' }) govKeyDown: EventEmitter<FormInputEvent>\n\t@State() focused: boolean\n\n\t@Watch('variant')\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormInputVariants, newValue, FormInputClass.root)\n\t}\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormInputSizes, newValue, FormInputClass.root)\n\t}\n\n\t@Watch(\"disabled\")\n\t@Watch(\"invalid\")\n\t@Watch(\"type\")\n\t@Watch(\"size\")\n\twatchDisabled(): void {\n\t\tthis.passControlAttrs()\n\t}\n\n\tprivate passControlAttrs() {\n\t\tthis.f.passAttrToControl(\"size\", this.size)\n\t\tthis.f.passAttrToControl(\"disabled\", toBoolAttr(this.disabled))\n\t\tthis.f.passAttrToControl(\"invalid\", toBoolAttr(this.invalid))\n\t\tthis.f.passAttrToControl('type', this.multiline ? Tags.TEXTAREA : Tags.INPUT)\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t\tthis.passControlAttrs()\n\n\t\tthis.f.passAttrToLabel('required', String(this.required))\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\tconst Tag = this.multiline ? Tags.TEXTAREA : Tags.INPUT\n\n\t\treturn (\n\t\t\t<Host class={FormInputClass.root} size={this.size} variant={this.variant} type={this.type}>\n\t\t\t\t{this.h.hasSlot('prefix') && <slot name=\"prefix\"></slot>}\n\t\t\t\t<span class=\"element\">\n\t\t\t\t\t{this.h.hasSlot('left-icon') && <slot name=\"left-icon\" />}\n\n\t\t\t\t\t{this.h.hasSlot('right-icon') && !(this.success || this.invalid) && <slot name=\"right-icon\" />}\n\n\t\t\t\t\t{this.success && !this.multiline && <gov-icon slot=\"right-icon\" class=\"icon-validation\" name=\"check-lg\"></gov-icon>}\n\t\t\t\t\t{this.invalid && !this.multiline && <gov-icon slot=\"right-icon\" class=\"icon-validation\" name=\"exclamation-lg\"></gov-icon>}\n\t\t\t\t\t<Tag\n\t\t\t\t\t\ttype={this.inputType}\n\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\tid={this.identifier || this.inputId}\n\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\tonFocus={this.onFocusHandler.bind(this)}\n\t\t\t\t\t\tonInput={this.onInputHandler.bind(this)}\n\t\t\t\t\t\tonBlur={this.onBlurHandler.bind(this)}\n\t\t\t\t\t\tonKeyUp={this.onKeyUpHandler.bind(this)}\n\t\t\t\t\t\tonKeyDown={this.onKeyDownHandler.bind(this)}\n\t\t\t\t\t\tref={el => (this.inputRef = el as HTMLInputElement)}\n\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\treadonly={toBoolAttrIfDefined(this.readonly)}\n\t\t\t\t\t\tautocomplete={toOnOffAttrIfDefined(this.autocomplete)}\n\t\t\t\t\t\tautocorrect={toOnOffAttrIfDefined(this.autocorrect)}\n\t\t\t\t\t\tminlength={this.minlength}\n\t\t\t\t\t\tmaxlength={this.maxlength}\n\t\t\t\t\t\tmin={this.min}\n\t\t\t\t\t\tmax={this.max}\n\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\trows={this.rows}\n\t\t\t\t\t\tcols={this.cols}\n\t\t\t\t\t\trole={this.role}\n\t\t\t\t\t\taria-required={toBoolAttrIfDefined(this.required)}\n\t\t\t\t\t\taria-invalid={toBoolAttrIfDefined(this.invalid)}\n\t\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\t\taria-describedby={this.wcagDescribedBy}\n\t\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\t\taria-owns={this.wcagOwns}\n\t\t\t\t\t\taria-expanded={toBoolAttrIfDefined(this.wcagExpanded)}\n\t\t\t\t\t\taria-autocomplete={this.wcagAutocomplete}\n\t\t\t\t\t/>\n\t\t\t\t</span>\n\t\t\t\t{this.h.hasSlot('sufix') && <slot name=\"sufix\"></slot>}\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.focused = true\n\t\tthis.govFocus.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.focused = false\n\t\tthis.govBlur.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onKeyUpHandler(e: KeyboardEvent) {\n\t\te.stopPropagation()\n\t\tthis.govKeyUp.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onKeyDownHandler(e: KeyboardEvent) {\n\t\te.stopPropagation()\n\t\tthis.govKeyDown.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onInputHandler(e: InputEvent) {\n\t\tthis.value = (e.target as HTMLInputElement).value\n\t\te.stopPropagation()\n\t\tthis.govInput.emit({\n\t\t\tcomponent: FormInputClass.root,\n\t\t\tvalue: this.value,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync setFocus(options?: FocusOptions): Promise<void> {\n\t\treturn this.inputRef.focus(options)\n\t}\n\n\t/**\n\t * Sets the ordered value of the element\n\t */\n\t@Method()\n\tasync setValue(value: string): Promise<void> {\n\t\tthis.value = value\n\t}\n\n\t/**\n\t * Clears input value\n\t */\n\t@Method()\n\tasync clearValue(): Promise<void> {\n\t\tthis.value = ''\n\t\tthis.inputRef.value = ''\n\t}\n\n\t/**\n\t * Returns an instance of the native html input element\n\t */\n\t@Method()\n\tasync getRef(): Promise<HTMLInputElement> {\n\t\treturn this.inputRef\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\tvalidateWcagRef(this.wcagDescribedBy, 'wcag-described-by', FormInputClass.root)\n\t\tvalidateWcagRef(this.wcagLabelledBy, 'wcag-labelled-by', FormInputClass.root)\n\t\tvalidateWcagRef(this.wcagOwns, 'wcag-owns', FormInputClass.root)\n\t\tvalidateWcagLabelFor(this.identifier || this.inputId, this.wcagLabelledBy, FormInputClass.root)\n\t}\n}\n"],"version":3}

package/dist/components/gov-form-label.js

@@ -37,7 +37,6 @@ function defineCustomElement$1() {
       break;
   } });
 }
-defineCustomElement$1();
 
 const GovFormLabel = GovFormLabel$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/gov-form-label.js.map

@@ -1 +1 @@
-{"file":"gov-form-label.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,8gBAA8gB;;MCOzhBA,cAAY;;;;;;gBAQsB,GAAG;oBAIZ,KAAK;kBAKP,KAAK;;EAMxC,MAAM;IACL,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IAC5C,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAChD,EAAC,GAAG,IAAC,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,IAC9F,eAAa,EACZ,IAAI,CAAC,QAAQ,GAAG,YAAM,KAAK,EAAC,sBAAsB,QAAS,GAAG,IAAI,CAC9D,CACA,EACP;GACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["GovFormLabel"],"sources":["../../../packages/core/src/components/gov-form/label/gov-form-label.scss?tag=gov-form-label","../../../packages/core/src/components/gov-form/label/gov-form-label.tsx"],"sourcesContent":["/*\n *   Label\n */\n\n$class: \".gov-form-label\";\n\n#{$class} {\n\t@include base(flex);\n\t&__label {\n\t\tdisplay: inline-block;\n\t\tcolor: $form-label-color;\n\t\tcursor: pointer;\n\t\tbox-sizing: border-box;\n\t}\n}\n","import { Component, Event, EventEmitter, h, Prop, Host } from '@stencil/core'\nimport { FormLabelClass, FormLabelSizesTypes } from './constants'\n\n@Component({\n\ttag: 'gov-form-label',\n\tstyleUrl: 'gov-form-label.scss',\n})\nexport class GovFormLabel {\n\t/**\n\t * Identifier for label.\n\t */\n\t@Prop({ attribute: 'identifier' }) readonly identifier: string\n\t/**\n\t * Label's size.\n\t */\n\t@Prop() readonly size?: FormLabelSizesTypes = 'm'\n\t/**\n\t * Set whether the input is required or not.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Use label as a legend for better accessibility.\n\t * Note: Don't forget to set the fieldset attribute of the gov-form-control component\n\t */\n\t@Prop() readonly legend: boolean = false\n\t/**\n\t * Emitted when the label click.\n\t */\n\t@Event({ eventName: 'gov-click' }) govClick: EventEmitter<PointerEvent>\n\n\trender() {\n\t\tconst Tag = this.legend ? 'legend' : 'label'\n\t\treturn (\n\t\t\t<Host class={FormLabelClass.root} size={this.size}>\n\t\t\t\t<Tag class={FormLabelClass.label} htmlFor={this.identifier} onClick={() => this.govClick.emit()}>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t\t{this.required ? <span class=\"gov-color--error-500\">*</span> : null}\n\t\t\t\t</Tag>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"gov-form-label.js","mappings":";;;AAAA,MAAM,eAAe,GAAG,8gBAA8gB;;MCOzhBA,cAAY;;;;;;gBAQsB,GAAG;oBAIZ,KAAK;kBAKP,KAAK;;EAMxC,MAAM;IACL,MAAM,GAAG,GAAG,IAAI,CAAC,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;IAC5C,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,cAAc,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,IAChD,EAAC,GAAG,IAAC,KAAK,EAAE,cAAc,CAAC,KAAK,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,OAAO,EAAE,MAAM,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,IAC9F,eAAa,EACZ,IAAI,CAAC,QAAQ,GAAG,YAAM,KAAK,EAAC,sBAAsB,QAAS,GAAG,IAAI,CAC9D,CACA,EACP;GACD;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["GovFormLabel"],"sources":["../../../packages/core/src/components/gov-form/label/gov-form-label.scss?tag=gov-form-label","../../../packages/core/src/components/gov-form/label/gov-form-label.tsx"],"sourcesContent":["/*\n *   Label\n */\n\n$class: \".gov-form-label\";\n\n#{$class} {\n\t@include base(flex);\n\t&__label {\n\t\tdisplay: inline-block;\n\t\tcolor: $form-label-color;\n\t\tcursor: pointer;\n\t\tbox-sizing: border-box;\n\t}\n}\n","import { Component, Event, EventEmitter, h, Prop, Host } from '@stencil/core'\nimport { FormLabelClass, FormLabelSizesTypes } from './constants'\n\n@Component({\n\ttag: 'gov-form-label',\n\tstyleUrl: 'gov-form-label.scss',\n})\nexport class GovFormLabel {\n\t/**\n\t * Identifier for label.\n\t */\n\t@Prop({ attribute: 'identifier' }) readonly identifier: string\n\t/**\n\t * Label's size.\n\t */\n\t@Prop() readonly size?: FormLabelSizesTypes = 'm'\n\t/**\n\t * Set whether the input is required or not.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Use label as a legend for better accessibility.\n\t * Note: Don't forget to set the fieldset attribute of the gov-form-control component\n\t */\n\t@Prop() readonly legend: boolean = false\n\t/**\n\t * Emitted when the label click.\n\t */\n\t@Event({ eventName: 'gov-click' }) govClick: EventEmitter<PointerEvent>\n\n\trender() {\n\t\tconst Tag = this.legend ? 'legend' : 'label'\n\t\treturn (\n\t\t\t<Host class={FormLabelClass.root} size={this.size}>\n\t\t\t\t<Tag class={FormLabelClass.label} htmlFor={this.identifier} onClick={() => this.govClick.emit()}>\n\t\t\t\t\t<slot></slot>\n\t\t\t\t\t{this.required ? <span class=\"gov-color--error-500\">*</span> : null}\n\t\t\t\t</Tag>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/gov-form-message2.js

@@ -51,7 +51,6 @@ function defineCustomElement() {
       break;
   } });
 }
-defineCustomElement();
 
 export { GovFormMessage as G, defineCustomElement as d };
 

package/dist/components/gov-form-message2.js.map

@@ -1 +1 @@
-{"file":"gov-form-message2.js","mappings":";;;;;;AAAA,MAAM,iBAAiB,GAAG,ktCAAktC;;MCW/tC,cAAc;EAI1B;;;mBAS4E,WAAW;IARtF,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC3B,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC,gBAAgB,CAAC,CAAA;GAC3C;EASD,eAAe,CAAC,QAAgB;IAC/B,YAAY,CAAC,mBAAmB,EAAE,QAAQ,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAA;GAClE;EAED,iBAAiB;IAChB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;GAClC;EAED,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,IACvE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KACtB,YAAM,KAAK,EAAE,gBAAgB,CAAC,IAAI,IACjC,YAAM,IAAI,EAAC,MAAM,GAAG,CACd,CACP,EACD,YAAM,EAAE,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,gBAAgB,CAAC,OAAO,IACxD,eAAQ,CACF,CACD,EACP;GACD;;;;EAMD,MAAM,UAAU;IACf,OAAO,IAAI,CAAC,SAAS,CAAA;GACrB;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["../../../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":["/*\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-form-message2.js","mappings":";;;;;;AAAA,MAAM,iBAAiB,GAAG,ktCAAktC;;MCW/tC,cAAc;EAI1B;;;mBAS4E,WAAW;IARtF,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;IAC3B,IAAI,CAAC,SAAS,GAAG,QAAQ,CAAC,gBAAgB,CAAC,CAAA;GAC3C;EASD,eAAe,CAAC,QAAgB;IAC/B,YAAY,CAAC,mBAAmB,EAAE,QAAQ,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAA;GAClE;EAED,iBAAiB;IAChB,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,OAAO,CAAC,CAAA;GAClC;EAED,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,OAAO,EAAE,IAAI,CAAC,OAAO,IACvE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,KACtB,YAAM,KAAK,EAAE,gBAAgB,CAAC,IAAI,IACjC,YAAM,IAAI,EAAC,MAAM,GAAG,CACd,CACP,EACD,YAAM,EAAE,EAAE,IAAI,CAAC,SAAS,EAAE,KAAK,EAAE,gBAAgB,CAAC,OAAO,IACxD,eAAQ,CACF,CACD,EACP;GACD;;;;EAMD,MAAM,UAAU;IACf,OAAO,IAAI,CAAC,SAAS,CAAA;GACrB;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["../../../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":["/*\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/components/gov-form-multi-select.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { t as toBoolAttrIfDefined } from './template.js';
-import { c as FormMultiSelectClass, d as FormMultiselectVariants, e as FormMultiselectSizes } from './form.js';
+import { g as govHost, a as toBoolAttr, t as toBoolAttrIfDefined } from './template.js';
+import { g as govForm, c as FormMultiSelectClass, d as FormMultiselectVariants, e as FormMultiselectSizes } from './form.js';
 import { v as validateProp } from './props.js';
 import { b as validateWcagRef, c as validateWcagLabelFor } from './wcag.js';
 import { c as canValidateWcagOnRender } from './win.js';
@@ -36,6 +36,8 @@ const GovFormMultiSelect$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     this.selectedOptions = [];
     this.selectId = createID("GovSelect");
     this.listId = createID("GovMultiList");
+    this.h = govHost(this.host);
+    this.f = govForm(this.h);
   }
   validateVariant(newValue) {
     validateProp(FormMultiselectVariants, newValue, FormMultiSelectClass.root);
@@ -49,9 +51,18 @@ const GovFormMultiSelect$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
       value: newValue,
     });
   }
+  watchDisabled() {
+    this.passControlAttrs();
+  }
+  passControlAttrs() {
+    this.f.passAttrToControl("size", this.size);
+    this.f.passAttrToControl("disabled", toBoolAttr(this.disabled));
+    this.f.passAttrToControl("invalid", toBoolAttr(this.invalid));
+  }
   componentWillLoad() {
     this.validateVariant(this.variant);
     this.validateSize(this.size);
+    this.watchDisabled();
   }
   getAvailableOptions() {
     return Array.from(this.selectRef.querySelectorAll("option"))
@@ -176,7 +187,7 @@ const GovFormMultiSelect$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
   /**
    * Returns an instance of the native html select element
    */
-  async getInstance() {
+  async getRef() {
     return this.selectRef;
   }
   /**
@@ -191,8 +202,10 @@ const GovFormMultiSelect$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
   get host() { return this; }
   static get watchers() { return {
     "variant": ["validateVariant"],
-    "size": ["validateSize"],
-    "selectedOptions": ["emitChange"]
+    "size": ["validateSize", "watchDisabled"],
+    "selectedOptions": ["emitChange"],
+    "disabled": ["watchDisabled"],
+    "invalid": ["watchDisabled"]
   }; }
   static get style() { return govFormMultiSelectCss; }
 }, [4, "gov-form-multi-select", {
@@ -212,7 +225,7 @@ const GovFormMultiSelect$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     "selectedOptions": [32],
     "setFocus": [64],
     "setValue": [64],
-    "getInstance": [64],
+    "getRef": [64],
     "validateWcag": [64]
   }]);
 function defineCustomElement$1() {
@@ -248,7 +261,6 @@ function defineCustomElement$1() {
       break;
   } });
 }
-defineCustomElement$1();
 
 const GovFormMultiSelect = GovFormMultiSelect$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/gov-form-multi-select.js.map

@@ -1 +1 @@
-{"file":"gov-form-multi-select.js","mappings":"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","names":["GovFormMultiSelect"],"sources":["../../../packages/core/src/components/gov-form/multiselect/gov-form-multi-select.scss?tag=gov-form-multi-select","../../../packages/core/src/components/gov-form/multiselect/gov-form-multi-select.tsx"],"sourcesContent":["/*\n *   Multiselect\n */\n\n@import \"../select/gov-form-select-core.scss\";\n$class: \".gov-form-multi-select\";\n\n#{$class} {\n\t@extend %form-select-core;\n\tflex-wrap: wrap;\n\t&__wrap {\n\t\tdisplay: flex;\n\t\tgap: rem-calc(8);\n\t\twidth: 100%;\n\t}\n\t&__list {\n\t\t@extend %reset-ul;\n\t\t@include typography($font-size-xs);\n\t\tdisplay: flex;\n\t\tgap: rem-calc(8);\n\t\tflex-wrap: wrap;\n\t}\n\t&__list > &__item {\n\t\t@extend %reset-ul-li;\n\t\tposition: relative;\n\t\tdisplay: flex;\n\t\tflex: 0 0 auto;\n\t\talign-items: center;\n\t\tpadding: rem-calc(0 0 0 8);\n\t\tbackground: $form-multiselect-bg;\n\t\ttransition: $t linear background-color;\n\t}\n}\n","import { Component, Element, h, State, Prop, Event, EventEmitter, Watch, Host, Method } from \"@stencil/core\"\nimport { toBoolAttrIfDefined } from \"../../../helpers/Dom/template\"\nimport {\n\tFormMultiselectSizesType,\n\tFormMultiselectVariants,\n\tFormMultiselectVariantType,\n\tFormMultiSelectClass,\n\tFormMultiselectSizes,\n} from \"./constants\"\nimport { validateProp } from \"../../../helpers/Validate/props\"\nimport { validateWcagLabelFor, validateWcagRef } from \"../../../helpers/Validate/wcag\"\nimport { canValidateWcagOnRender } from \"../../../helpers/Dom/win\"\nimport { createID, removeDiacritics } from \"../../../utils/string.utils\"\nimport { delay } from \"../../../utils/utils\"\nimport { Nullable } from \"../../../types/interfaces\"\nimport { FormMultiselectEvent, GovFormMultiSelectItem } from \"./gov-form-multi-select.types\"\nimport { FormAutocompleteEvent } from \"../autocomplete/gov-form-autocomplete.types\"\n\n@Component({\n\ttag: \"gov-form-multi-select\",\n\tstyleUrl: \"gov-form-multi-select.scss\",\n})\nexport class GovFormMultiSelect {\n\tprivate selectRef?: HTMLSelectElement\n\tprivate autocompleteRef?: HTMLGovFormAutocompleteElement\n\n\tprivate readonly selectId: string\n\tprivate readonly listId: string\n\n\tconstructor() {\n\t\tthis.selectId = createID(\"GovSelect\")\n\t\tthis.listId = createID(\"GovMultiList\")\n\t}\n\n\t@Element() host: HTMLGovFormSelectElement\n\t/**\n\t * Custom select identifier.\n\t */\n\t@Prop({ attribute: \"identifier\" }) readonly identifier: string\n\t/**\n\t * Custom select placeholder.\n\t */\n\t@Prop({ attribute: \"placeholder\" }) readonly placeholder: string\n\t/**\n\t * Style variation of the form select.\n\t */\n\t@Prop() readonly variant?: FormMultiselectVariantType\n\t/**\n\t * Select’s size.\n\t */\n\t@Prop() readonly size?: FormMultiselectSizesType = \"m\"\n\t/**\n\t * Name of the select.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the select component disabled.\n\t * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: \"wcag-described-by\" }) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({ attribute: \"wcag-labelled-by\" }) readonly wcagLabelledBy: string\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: \"wcag-owns\" }) readonly wcagOwns: string\n\t/**\n\t * Emitted when the select has focus.\n\t */\n\t@Event({ eventName: \"gov-focus\" }) govFocus: EventEmitter<FormMultiselectEvent>\n\t/**\n\t * Emitted when the select loses focus.\n\t */\n\t@Event({ eventName: \"gov-blur\" }) govBlur: EventEmitter<FormMultiselectEvent>\n\t/**\n\t * Emitted when the select change value.\n\t */\n\t@Event({ eventName: \"gov-change\" }) govChange: EventEmitter<FormMultiselectEvent>\n\n\t@State() focused: boolean\n\t@State() value: string\n\t@State() selectedOptions: GovFormMultiSelectItem[] = []\n\n\t@Watch(\"variant\")\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormMultiselectVariants, newValue, FormMultiSelectClass.root)\n\t}\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormMultiselectSizes, newValue, FormMultiSelectClass.root)\n\t}\n\n\t@Watch(\"selectedOptions\")\n\temitChange(newValue: GovFormMultiSelectItem[]) {\n\t\tthis.govChange.emit({\n\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\tvalue: newValue,\n\t\t})\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t}\n\n\tprivate getAvailableOptions(): GovFormMultiSelectItem[] {\n\t\treturn Array.from(this.selectRef.querySelectorAll(\"option\"))\n\t\t\t.filter((option: HTMLOptionElement) => !(option.disabled || option.selected))\n\t\t\t.map((option: HTMLOptionElement) => ({ name: option.textContent, value: option.value }))\n\t}\n\n\tprivate initAutocomplete() {\n\t\tthis.autocompleteRef.addEventListener(\"gov-select\", this.onSelectHandler.bind(this))\n\t\tthis.autocompleteRef.addEventListener(\"gov-input\", this.onInputHandler.bind(this))\n\t\tthis.autocompleteRef.addEventListener(\"gov-focus\", this.onFocusHandler.bind(this))\n\t\tthis.autocompleteRef.addEventListener(\"gov-blur\", this.onBlurHandler.bind(this))\n\t\tthis.autocompleteRef\n\t\t\t.setSearchCallback(value => {\n\t\t\t\treturn new Promise(resolve => {\n\t\t\t\t\tconst data = this.getAvailableOptions()\n\t\t\t\t\tif (String(value).length === 0) {\n\t\t\t\t\t\treturn resolve(data)\n\t\t\t\t\t}\n\t\t\t\t\tresolve(\n\t\t\t\t\t\tdata.filter(({ name }) => {\n\t\t\t\t\t\t\tif (!name) return false\n\t\t\t\t\t\t\treturn removeDiacritics(name).toLowerCase().indexOf(removeDiacritics(value).toLowerCase()) > -1\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\t.then()\n\t}\n\n\tprivate getOptionIndex(value: GovFormMultiSelectItem): number {\n\t\treturn this.selectedOptions.findIndex(option => option.value === value.value && option.name === value.name)\n\t}\n\n\tprivate getOptionElement(value: GovFormMultiSelectItem): Nullable<HTMLOptionElement> {\n\t\treturn this.selectRef.querySelector(\"option[value=\\\"\" + value.value + \"\\\"]\") as HTMLOptionElement\n\t}\n\n\tprivate selectOption(newOption: GovFormMultiSelectItem) {\n\t\tconst index = this.getOptionIndex(newOption)\n\t\tif (index === -1) {\n\t\t\tthis.selectedOptions = [...this.selectedOptions, newOption]\n\t\t\tconst option = this.getOptionElement(newOption)\n\t\t\tif (option) {\n\t\t\t\toption.selected = true\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate removeOption(removeOption: GovFormMultiSelectItem) {\n\t\tconst index = this.getOptionIndex(removeOption)\n\t\tif (index !== -1) {\n\t\t\tthis.selectedOptions.splice(index, 1)\n\t\t\tthis.selectedOptions = [...this.selectedOptions]\n\t\t\tconst option = this.getOptionElement(removeOption)\n\t\t\tif (option) {\n\t\t\t\toption.selected = false\n\t\t\t}\n\t\t}\n\t}\n\n\tasync componentDidRender() {\n\t\tthis.initAutocomplete()\n\t\tawait delay(0)\n\t\tthis.selectRef.querySelectorAll(\"option\").forEach((option: HTMLOptionElement) => {\n\t\t\tif (option.selected) {\n\t\t\t\tthis.selectOption({\n\t\t\t\t\tname: option.textContent,\n\t\t\t\t\tvalue: option.value,\n\t\t\t\t})\n\t\t\t}\n\t\t})\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={FormMultiSelectClass.root} size={this.size} variant={this.variant}>\n\t\t\t\t<div class={FormMultiSelectClass.wrap}>\n\t\t\t\t\t<div class=\"element\">\n\t\t\t\t\t\t<gov-form-autocomplete\n\t\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\tidentifier={this.identifier || this.selectId}\n\t\t\t\t\t\t\trequired={false}\n\t\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\t\tvariant={this.variant}\n\t\t\t\t\t\t\tinvalid={this.invalid}\n\t\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\t\tref={el => (this.autocompleteRef = el as HTMLGovFormAutocompleteElement)}\n\t\t\t\t\t\t\tminlength={0}\n\t\t\t\t\t\t\twcagDescribedBy={this.wcagDescribedBy}\n\t\t\t\t\t\t\twcagLabelledBy={this.wcagLabelledBy}\n\t\t\t\t\t\t\twcagOwns={this.listId}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<gov-icon slot=\"right-icon\" class=\"icon-arrow\" name=\"chevron-down\"></gov-icon>\n\t\t\t\t\t\t<select\n\t\t\t\t\t\t\thidden\n\t\t\t\t\t\t\taria-hidden={true}\n\t\t\t\t\t\t\tmultiple\n\t\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\tref={el => (this.selectRef = el as HTMLSelectElement)}\n\t\t\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\t\t\taria-required={toBoolAttrIfDefined(this.required)}\n\t\t\t\t\t\t\taria-invalid={toBoolAttrIfDefined(this.invalid)}\n\t\t\t\t\t\t\taria-describedby={this.wcagDescribedBy}\n\t\t\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\t\t\taria-owns={this.wcagOwns}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<ul role=\"listbox\" id={this.listId} class={FormMultiSelectClass.list}>\n\t\t\t\t\t{this.selectedOptions.map(option => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<li class={FormMultiSelectClass.item} role=\"option\">\n\t\t\t\t\t\t\t\t{option.name}\n\t\t\t\t\t\t\t\t<gov-button\n\t\t\t\t\t\t\t\t\twcagLabel={\"Odebrat vybranou položku \" + option.name}\n\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\t\t\t\ton-gov-click={() => this.onTagRemove(option)}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<gov-icon name=\"x-lg\"></gov-icon>\n\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t</ul>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.focused = true\n\t\tthis.govFocus.emit({\n\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\toriginalEvent: e,\n\t\t\tvalue: this.selectedOptions,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\te.stopPropagation()\n\t\tthis.focused = false\n\t\tthis.govBlur.emit({\n\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\toriginalEvent: e,\n\t\t\tvalue: this.selectedOptions,\n\t\t})\n\t}\n\n\tprivate onInputHandler(e: CustomEvent<FormAutocompleteEvent>) {\n\t\tthis.value = e.detail.value\n\t\te.stopPropagation()\n\t}\n\n\tprivate onSelectHandler(e: CustomEvent<FormAutocompleteEvent>) {\n\t\te.stopPropagation()\n\t\tconst value = e.detail.selected\n\t\tthis.selectOption(value as GovFormMultiSelectItem)\n\t\tthis.value = \"\"\n\t\tthis.autocompleteRef.clearValue()\n\t\tthis.autocompleteRef.focus()\n\t}\n\n\tprivate onTagRemove(removeOption: GovFormMultiSelectItem) {\n\t\tthis.removeOption(removeOption)\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync setFocus(options?: FocusOptions): Promise<void> {\n\t\treturn this.selectRef.focus(options)\n\t}\n\n\t/**\n\t * Sets the ordered value of the element\n\t */\n\t@Method()\n\tasync setValue(value: string): Promise<void> {\n\t\tthis.value = value\n\t}\n\n\t/**\n\t * Returns an instance of the native html select element\n\t */\n\t@Method()\n\tasync getInstance(): Promise<HTMLSelectElement> {\n\t\treturn this.selectRef\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\tvalidateWcagRef(this.wcagDescribedBy, \"wcag-described-by\", FormMultiSelectClass.root)\n\t\tvalidateWcagRef(this.wcagLabelledBy, \"wcag-labelled-by\", FormMultiSelectClass.root)\n\t\tvalidateWcagRef(this.wcagOwns, \"wcag-owns\", FormMultiSelectClass.root)\n\t\tvalidateWcagLabelFor(this.identifier || this.selectId, this.wcagLabelledBy, FormMultiSelectClass.root)\n\t}\n}\n"],"version":3}
+{"file":"gov-form-multi-select.js","mappings":"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","names":["GovFormMultiSelect"],"sources":["../../../packages/core/src/components/gov-form/multiselect/gov-form-multi-select.scss?tag=gov-form-multi-select","../../../packages/core/src/components/gov-form/multiselect/gov-form-multi-select.tsx"],"sourcesContent":["/*\n *   Multiselect\n */\n\n@import \"../select/gov-form-select-core.scss\";\n$class: \".gov-form-multi-select\";\n\n#{$class} {\n\t@extend %form-select-core;\n\tflex-wrap: wrap;\n\t&__wrap {\n\t\tdisplay: flex;\n\t\tgap: rem-calc(8);\n\t\twidth: 100%;\n\t}\n\t&__list {\n\t\t@extend %reset-ul;\n\t\t@include typography($font-size-xs);\n\t\tdisplay: flex;\n\t\tgap: rem-calc(8);\n\t\tflex-wrap: wrap;\n\t}\n\t&__list > &__item {\n\t\t@extend %reset-ul-li;\n\t\tposition: relative;\n\t\tdisplay: flex;\n\t\tflex: 0 0 auto;\n\t\talign-items: center;\n\t\tpadding: rem-calc(0 0 0 8);\n\t\tbackground: $form-multiselect-bg;\n\t\ttransition: $t linear background-color;\n\t}\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from \"@stencil/core\"\nimport { govHost, toBoolAttr, toBoolAttrIfDefined } from \"../../../helpers/Dom/template\"\nimport {\n\tFormMultiSelectClass,\n\tFormMultiselectSizes,\n\tFormMultiselectSizesType,\n\tFormMultiselectVariants,\n\tFormMultiselectVariantType,\n} from \"./constants\"\nimport { validateProp } from \"../../../helpers/Validate/props\"\nimport { validateWcagLabelFor, validateWcagRef } from \"../../../helpers/Validate/wcag\"\nimport { canValidateWcagOnRender } from \"../../../helpers/Dom/win\"\nimport { createID, removeDiacritics } from \"../../../utils/string.utils\"\nimport { delay } from \"../../../utils/utils\"\nimport { Nullable } from \"../../../types/interfaces\"\nimport { FormMultiselectEvent, GovFormMultiSelectItem } from \"./gov-form-multi-select.types\"\nimport { FormAutocompleteEvent } from \"../autocomplete/gov-form-autocomplete.types\"\nimport { GovForm } from \"../../../helpers/Dom/form.types\"\nimport { GovHost } from \"../../../helpers/Dom/template.types\"\nimport { govForm } from \"../../../helpers/Dom/form\"\n\n@Component({\n\ttag: \"gov-form-multi-select\",\n\tstyleUrl: \"gov-form-multi-select.scss\",\n})\nexport class GovFormMultiSelect {\n\tprivate f: GovForm\n\tprivate readonly h: GovHost\n\n\tprivate selectRef?: HTMLSelectElement\n\tprivate autocompleteRef?: HTMLGovFormAutocompleteElement\n\n\tprivate readonly selectId: string\n\tprivate readonly listId: string\n\n\tconstructor() {\n\t\tthis.selectId = createID(\"GovSelect\")\n\t\tthis.listId = createID(\"GovMultiList\")\n\n\t\tthis.h = govHost(this.host)\n\t\tthis.f = govForm(this.h)\n\t}\n\n\t@Element() host: HTMLGovFormSelectElement\n\t/**\n\t * Custom select identifier.\n\t */\n\t@Prop({ attribute: \"identifier\" }) readonly identifier: string\n\t/**\n\t * Custom select placeholder.\n\t */\n\t@Prop({ attribute: \"placeholder\" }) readonly placeholder: string\n\t/**\n\t * Style variation of the form select.\n\t */\n\t@Prop() readonly variant?: FormMultiselectVariantType\n\t/**\n\t * Select’s size.\n\t */\n\t@Prop() readonly size?: FormMultiselectSizesType = \"m\"\n\t/**\n\t * Name of the select.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the select component disabled.\n\t * This prevents users from being able to interact with the select, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: \"wcag-described-by\" }) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({ attribute: \"wcag-labelled-by\" }) readonly wcagLabelledBy: string\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: \"wcag-owns\" }) readonly wcagOwns: string\n\t/**\n\t * Emitted when the select has focus.\n\t */\n\t@Event({ eventName: \"gov-focus\" }) govFocus: EventEmitter<FormMultiselectEvent>\n\t/**\n\t * Emitted when the select loses focus.\n\t */\n\t@Event({ eventName: \"gov-blur\" }) govBlur: EventEmitter<FormMultiselectEvent>\n\t/**\n\t * Emitted when the select change value.\n\t */\n\t@Event({ eventName: \"gov-change\" }) govChange: EventEmitter<FormMultiselectEvent>\n\n\t@State() focused: boolean\n\t@State() value: string\n\t@State() selectedOptions: GovFormMultiSelectItem[] = []\n\n\t@Watch(\"variant\")\n\tvalidateVariant(newValue: string): void {\n\t\tvalidateProp(FormMultiselectVariants, newValue, FormMultiSelectClass.root)\n\t}\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormMultiselectSizes, newValue, FormMultiSelectClass.root)\n\t}\n\n\t@Watch(\"selectedOptions\")\n\temitChange(newValue: GovFormMultiSelectItem[]) {\n\t\tthis.govChange.emit({\n\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\tvalue: newValue,\n\t\t})\n\t}\n\n\t@Watch(\"disabled\")\n\t@Watch(\"invalid\")\n\t@Watch(\"size\")\n\twatchDisabled(): void {\n\t\tthis.passControlAttrs()\n\t}\n\n\tprivate passControlAttrs() {\n\t\tthis.f.passAttrToControl(\"size\", this.size)\n\t\tthis.f.passAttrToControl(\"disabled\", toBoolAttr(this.disabled))\n\t\tthis.f.passAttrToControl(\"invalid\", toBoolAttr(this.invalid))\n\t}\n\n\n\tcomponentWillLoad() {\n\t\tthis.validateVariant(this.variant)\n\t\tthis.validateSize(this.size)\n\t\tthis.watchDisabled()\n\t}\n\n\tprivate getAvailableOptions(): GovFormMultiSelectItem[] {\n\t\treturn Array.from(this.selectRef.querySelectorAll(\"option\"))\n\t\t\t.filter((option: HTMLOptionElement) => !(option.disabled || option.selected))\n\t\t\t.map((option: HTMLOptionElement) => ({ name: option.textContent, value: option.value }))\n\t}\n\n\tprivate initAutocomplete() {\n\t\tthis.autocompleteRef.addEventListener(\"gov-select\", this.onSelectHandler.bind(this))\n\t\tthis.autocompleteRef.addEventListener(\"gov-input\", this.onInputHandler.bind(this))\n\t\tthis.autocompleteRef.addEventListener(\"gov-focus\", this.onFocusHandler.bind(this))\n\t\tthis.autocompleteRef.addEventListener(\"gov-blur\", this.onBlurHandler.bind(this))\n\t\tthis.autocompleteRef\n\t\t\t.setSearchCallback(value => {\n\t\t\t\treturn new Promise(resolve => {\n\t\t\t\t\tconst data = this.getAvailableOptions()\n\t\t\t\t\tif (String(value).length === 0) {\n\t\t\t\t\t\treturn resolve(data)\n\t\t\t\t\t}\n\t\t\t\t\tresolve(\n\t\t\t\t\t\tdata.filter(({ name }) => {\n\t\t\t\t\t\t\tif (!name) return false\n\t\t\t\t\t\t\treturn removeDiacritics(name).toLowerCase().indexOf(removeDiacritics(value).toLowerCase()) > -1\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\t.then()\n\t}\n\n\tprivate getOptionIndex(value: GovFormMultiSelectItem): number {\n\t\treturn this.selectedOptions.findIndex(option => option.value === value.value && option.name === value.name)\n\t}\n\n\tprivate getOptionElement(value: GovFormMultiSelectItem): Nullable<HTMLOptionElement> {\n\t\treturn this.selectRef.querySelector(\"option[value=\\\"\" + value.value + \"\\\"]\") as HTMLOptionElement\n\t}\n\n\tprivate selectOption(newOption: GovFormMultiSelectItem) {\n\t\tconst index = this.getOptionIndex(newOption)\n\t\tif (index === -1) {\n\t\t\tthis.selectedOptions = [...this.selectedOptions, newOption]\n\t\t\tconst option = this.getOptionElement(newOption)\n\t\t\tif (option) {\n\t\t\t\toption.selected = true\n\t\t\t}\n\t\t}\n\t}\n\n\tprivate removeOption(removeOption: GovFormMultiSelectItem) {\n\t\tconst index = this.getOptionIndex(removeOption)\n\t\tif (index !== -1) {\n\t\t\tthis.selectedOptions.splice(index, 1)\n\t\t\tthis.selectedOptions = [...this.selectedOptions]\n\t\t\tconst option = this.getOptionElement(removeOption)\n\t\t\tif (option) {\n\t\t\t\toption.selected = false\n\t\t\t}\n\t\t}\n\t}\n\n\tasync componentDidRender() {\n\t\tthis.initAutocomplete()\n\t\tawait delay(0)\n\t\tthis.selectRef.querySelectorAll(\"option\").forEach((option: HTMLOptionElement) => {\n\t\t\tif (option.selected) {\n\t\t\t\tthis.selectOption({\n\t\t\t\t\tname: option.textContent,\n\t\t\t\t\tvalue: option.value,\n\t\t\t\t})\n\t\t\t}\n\t\t})\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={FormMultiSelectClass.root} size={this.size} variant={this.variant}>\n\t\t\t\t<div class={FormMultiSelectClass.wrap}>\n\t\t\t\t\t<div class=\"element\">\n\t\t\t\t\t\t<gov-form-autocomplete\n\t\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\tidentifier={this.identifier || this.selectId}\n\t\t\t\t\t\t\trequired={false}\n\t\t\t\t\t\t\tsize={this.size}\n\t\t\t\t\t\t\tvariant={this.variant}\n\t\t\t\t\t\t\tinvalid={this.invalid}\n\t\t\t\t\t\t\tplaceholder={this.placeholder}\n\t\t\t\t\t\t\tref={el => (this.autocompleteRef = el as HTMLGovFormAutocompleteElement)}\n\t\t\t\t\t\t\tminlength={0}\n\t\t\t\t\t\t\twcagDescribedBy={this.wcagDescribedBy}\n\t\t\t\t\t\t\twcagLabelledBy={this.wcagLabelledBy}\n\t\t\t\t\t\t\twcagOwns={this.listId}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<gov-icon slot=\"right-icon\" class=\"icon-arrow\" name=\"chevron-down\"></gov-icon>\n\t\t\t\t\t\t<select\n\t\t\t\t\t\t\thidden\n\t\t\t\t\t\t\taria-hidden={true}\n\t\t\t\t\t\t\tmultiple\n\t\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\tref={el => (this.selectRef = el as HTMLSelectElement)}\n\t\t\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\t\t\taria-required={toBoolAttrIfDefined(this.required)}\n\t\t\t\t\t\t\taria-invalid={toBoolAttrIfDefined(this.invalid)}\n\t\t\t\t\t\t\taria-describedby={this.wcagDescribedBy}\n\t\t\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\t\t\taria-owns={this.wcagOwns}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<slot></slot>\n\t\t\t\t\t\t</select>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<ul role=\"listbox\" id={this.listId} class={FormMultiSelectClass.list}>\n\t\t\t\t\t{this.selectedOptions.map(option => {\n\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t<li class={FormMultiSelectClass.item} role=\"option\">\n\t\t\t\t\t\t\t\t{option.name}\n\t\t\t\t\t\t\t\t<gov-button\n\t\t\t\t\t\t\t\t\twcagLabel={\"Odebrat vybranou položku \" + option.name}\n\t\t\t\t\t\t\t\t\tvariant=\"primary\"\n\t\t\t\t\t\t\t\t\ttype=\"base\"\n\t\t\t\t\t\t\t\t\tsize=\"s\"\n\t\t\t\t\t\t\t\t\ton-gov-click={() => this.onTagRemove(option)}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<gov-icon name=\"x-lg\"></gov-icon>\n\t\t\t\t\t\t\t\t</gov-button>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t)\n\t\t\t\t\t})}\n\t\t\t\t</ul>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.focused = true\n\t\tthis.govFocus.emit({\n\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\toriginalEvent: e,\n\t\t\tvalue: this.selectedOptions,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\te.stopPropagation()\n\t\tthis.focused = false\n\t\tthis.govBlur.emit({\n\t\t\tcomponent: FormMultiSelectClass.root,\n\t\t\toriginalEvent: e,\n\t\t\tvalue: this.selectedOptions,\n\t\t})\n\t}\n\n\tprivate onInputHandler(e: CustomEvent<FormAutocompleteEvent>) {\n\t\tthis.value = e.detail.value\n\t\te.stopPropagation()\n\t}\n\n\tprivate onSelectHandler(e: CustomEvent<FormAutocompleteEvent>) {\n\t\te.stopPropagation()\n\t\tconst value = e.detail.selected\n\t\tthis.selectOption(value as GovFormMultiSelectItem)\n\t\tthis.value = \"\"\n\t\tthis.autocompleteRef.clearValue()\n\t\tthis.autocompleteRef.focus()\n\t}\n\n\tprivate onTagRemove(removeOption: GovFormMultiSelectItem) {\n\t\tthis.removeOption(removeOption)\n\t}\n\n\t/**\n\t * Returns the current state of the component\n\t */\n\t@Method()\n\tasync setFocus(options?: FocusOptions): Promise<void> {\n\t\treturn this.selectRef.focus(options)\n\t}\n\n\t/**\n\t * Sets the ordered value of the element\n\t */\n\t@Method()\n\tasync setValue(value: string): Promise<void> {\n\t\tthis.value = value\n\t}\n\n\t/**\n\t * Returns an instance of the native html select element\n\t */\n\t@Method()\n\tasync getRef(): Promise<HTMLSelectElement> {\n\t\treturn this.selectRef\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\tvalidateWcagRef(this.wcagDescribedBy, \"wcag-described-by\", FormMultiSelectClass.root)\n\t\tvalidateWcagRef(this.wcagLabelledBy, \"wcag-labelled-by\", FormMultiSelectClass.root)\n\t\tvalidateWcagRef(this.wcagOwns, \"wcag-owns\", FormMultiSelectClass.root)\n\t\tvalidateWcagLabelFor(this.identifier || this.selectId, this.wcagLabelledBy, FormMultiSelectClass.root)\n\t}\n}\n"],"version":3}

package/dist/components/gov-form-password-power.js

@@ -34,7 +34,6 @@ function defineCustomElement$1() {
       break;
   } });
 }
-defineCustomElement$1();
 
 const GovFormPasswordPower = GovFormPasswordPower$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/gov-form-password-power.js.map

@@ -1 +1 @@
-{"file":"gov-form-password-power.js","mappings":";;AAAO,MAAM,sBAAsB,GAAG;EACrC,IAAI,EAAE,yBAAyB;EAC5B,GAAG,EAAE,8BAA8B;EACnC,IAAI,EAAE,+BAA+B;CACxC;;ACJD,MAAM,uBAAuB,GAAG,24DAA24D;;MCO95DA,sBAAoB;;;;;;EAMhC,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,sBAAsB,CAAC,IAAI,IAC3B,YAAM,KAAK,EAAE,sBAAsB,CAAC,GAAG,IACnC,eAAa,EACb,eAAa,EACb,eAAa,CACV,EACP,YAAM,KAAK,EAAE,sBAAsB,CAAC,IAAI,IACpC,eAAQ,CACL,CACb,EACP;GACD;;;;;;;;;;;;;;;;;;;;;;;;;","names":["GovFormPasswordPower"],"sources":["../../../packages/core/src/components/gov-form/password-power/constants.ts","../../../packages/core/src/components/gov-form/password-power/gov-form-password-power.scss?tag=gov-form-password-power","../../../packages/core/src/components/gov-form/password-power/gov-form-password-power.tsx"],"sourcesContent":["export const FormPasswordPowerClass = {\n\troot: 'gov-form-password-power',\n    bar: 'gov-form-password-power__bar',\n    text: 'gov-form-password-power__text',\n}\n","$class: \".gov-form-password-power\";\n\n#{$class} {\n    display: flex;\n    align-items: center;\n    gap: rem-calc(24);\n    height: rem-calc(24);\n    &__bar {\n        display: flex;\n        gap: rem-calc(4);\n        width: 100%;\n        span {\n            display: inline-block;\n            width: 100%;\n            height: $form-password-power-height;\n            border-radius: $form-password-power-radius;\n            background-color: $form-password-power-color;\n        }\n    }\n    &__text {\n        @include typography($font-size-s);\n        text-align: right;\n        flex-basis: rem-calc(56);\n    }\n\n    // STATES\n    &[power=\"1\"] {\n        color: $form-password-power-color-weak;\n        #{$class}__bar {\n            span:nth-child(1) {\n                background-color: $form-password-power-color-weak;\n            }\n        }\n    }\n    &[power=\"2\"] {\n        color: $form-password-power-color-medium;\n        #{$class}__bar {\n            span:nth-child(1),\n            span:nth-child(2) {\n                background-color: $form-password-power-color-medium;\n            }\n        }\n    }\n    &[power=\"3\"] {\n        color: $form-password-power-color-strong;\n        #{$class}__bar {\n            span {\n                background-color: $form-password-power-color-strong;\n            }\n        }\n    }\n}","import { Component, h, Host, Prop } from '@stencil/core'\nimport { FormPasswordPowerClass } from './constants'\n\n@Component({\n\ttag: 'gov-form-password-power',\n\tstyleUrl: 'gov-form-password-power.scss',\n})\nexport class GovFormPasswordPower {\n    /**\n\t * Password power: 0 - none, 1 - weak, 2 - medium, 3 - strong\n\t */\n\t@Prop() readonly power: number\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={FormPasswordPowerClass.root}>\n                <span class={FormPasswordPowerClass.bar}>\n                    <span></span>\n                    <span></span>\n                    <span></span>\n                </span>\n                <span class={FormPasswordPowerClass.text}>\n                    <slot />\n                </span>\n\t\t\t</Host>\n\t\t)\n\t}\n}"],"version":3}
+{"file":"gov-form-password-power.js","mappings":";;AAAO,MAAM,sBAAsB,GAAG;EACrC,IAAI,EAAE,yBAAyB;EAC5B,GAAG,EAAE,8BAA8B;EACnC,IAAI,EAAE,+BAA+B;CACxC;;ACJD,MAAM,uBAAuB,GAAG,24DAA24D;;MCO95DA,sBAAoB;;;;;;EAMhC,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,sBAAsB,CAAC,IAAI,IAC3B,YAAM,KAAK,EAAE,sBAAsB,CAAC,GAAG,IACnC,eAAa,EACb,eAAa,EACb,eAAa,CACV,EACP,YAAM,KAAK,EAAE,sBAAsB,CAAC,IAAI,IACpC,eAAQ,CACL,CACb,EACP;GACD;;;;;;;;;;;;;;;;;;;;;;;;","names":["GovFormPasswordPower"],"sources":["../../../packages/core/src/components/gov-form/password-power/constants.ts","../../../packages/core/src/components/gov-form/password-power/gov-form-password-power.scss?tag=gov-form-password-power","../../../packages/core/src/components/gov-form/password-power/gov-form-password-power.tsx"],"sourcesContent":["export const FormPasswordPowerClass = {\n\troot: 'gov-form-password-power',\n    bar: 'gov-form-password-power__bar',\n    text: 'gov-form-password-power__text',\n}\n","$class: \".gov-form-password-power\";\n\n#{$class} {\n    display: flex;\n    align-items: center;\n    gap: rem-calc(24);\n    height: rem-calc(24);\n    &__bar {\n        display: flex;\n        gap: rem-calc(4);\n        width: 100%;\n        span {\n            display: inline-block;\n            width: 100%;\n            height: $form-password-power-height;\n            border-radius: $form-password-power-radius;\n            background-color: $form-password-power-color;\n        }\n    }\n    &__text {\n        @include typography($font-size-s);\n        text-align: right;\n        flex-basis: rem-calc(56);\n    }\n\n    // STATES\n    &[power=\"1\"] {\n        color: $form-password-power-color-weak;\n        #{$class}__bar {\n            span:nth-child(1) {\n                background-color: $form-password-power-color-weak;\n            }\n        }\n    }\n    &[power=\"2\"] {\n        color: $form-password-power-color-medium;\n        #{$class}__bar {\n            span:nth-child(1),\n            span:nth-child(2) {\n                background-color: $form-password-power-color-medium;\n            }\n        }\n    }\n    &[power=\"3\"] {\n        color: $form-password-power-color-strong;\n        #{$class}__bar {\n            span {\n                background-color: $form-password-power-color-strong;\n            }\n        }\n    }\n}","import { Component, h, Host, Prop } from '@stencil/core'\nimport { FormPasswordPowerClass } from './constants'\n\n@Component({\n\ttag: 'gov-form-password-power',\n\tstyleUrl: 'gov-form-password-power.scss',\n})\nexport class GovFormPasswordPower {\n    /**\n\t * Password power: 0 - none, 1 - weak, 2 - medium, 3 - strong\n\t */\n\t@Prop() readonly power: number\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={FormPasswordPowerClass.root}>\n                <span class={FormPasswordPowerClass.bar}>\n                    <span></span>\n                    <span></span>\n                    <span></span>\n                </span>\n                <span class={FormPasswordPowerClass.text}>\n                    <slot />\n                </span>\n\t\t\t</Host>\n\t\t)\n\t}\n}"],"version":3}

package/dist/components/gov-form-radio.js

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { c as createID } from './string.utils.js';
 import { v as validateProp } from './props.js';
 import { g as govForm, f as FormRadioClass, h as FormRadioSizes } from './form.js';
-import { g as govHost, t as toBoolAttrIfDefined } from './template.js';
+import { g as govHost, a as toBoolAttr, t as toBoolAttrIfDefined } from './template.js';
 import { b as validateWcagRef, c as validateWcagLabelFor } from './wcag.js';
 import { c as canValidateWcagOnRender } from './win.js';
 import { d as delay } from './utils.js';
@@ -23,24 +23,33 @@ const GovFormRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
     this.required = false;
     this.disabled = undefined;
     this.name = undefined;
-    this.size = 'm';
+    this.size = "m";
     this.identifier = undefined;
     this.invalid = undefined;
     this.wcagDescribedBy = undefined;
     this.wcagLabelledBy = undefined;
-    this.radioId = createID('GovRadio');
+    this.radioId = createID("GovRadio");
     this.h = govHost(this.host);
     this.f = govForm(this.h);
   }
   validateSize(newValue) {
     validateProp(FormRadioSizes, newValue, FormRadioClass.root);
   }
+  watchDisabled() {
+    this.passControlAttrs();
+  }
+  passControlAttrs() {
+    this.f.passAttrToControl("size", this.size);
+    this.f.passAttrToControl("disabled", toBoolAttr(this.disabled));
+    this.f.passAttrToControl("invalid", toBoolAttr(this.invalid));
+    this.f.passAttrToControl("type", "radio");
+  }
   componentWillLoad() {
-    this.f.passAttrToControl('type', 'radio');
+    this.passControlAttrs();
   }
   async componentDidRender() {
-    this.f.passAttrToLabel('identifier', this.identifier || this.radioId);
-    this.f.passAttrToLabel('required', String(this.required));
+    this.f.passAttrToLabel("identifier", this.identifier || this.radioId);
+    this.f.passAttrToLabel("required", String(this.required));
     if (canValidateWcagOnRender()) {
       await delay(500);
       await this.validateWcag();
@@ -96,13 +105,15 @@ const GovFormRadio$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElemen
    * Validate the WCAG attributes of the component
    */
   async validateWcag() {
-    validateWcagRef(this.wcagDescribedBy, 'wcag-described-by', FormRadioClass.root);
-    validateWcagRef(this.wcagLabelledBy, 'wcag-labelled-by', FormRadioClass.root);
+    validateWcagRef(this.wcagDescribedBy, "wcag-described-by", FormRadioClass.root);
+    validateWcagRef(this.wcagLabelledBy, "wcag-labelled-by", FormRadioClass.root);
     validateWcagLabelFor(this.identifier || this.radioId, this.wcagLabelledBy, FormRadioClass.root);
   }
   get host() { return this; }
   static get watchers() { return {
-    "size": ["validateSize"]
+    "size": ["validateSize", "watchDisabled"],
+    "disabled": ["watchDisabled"],
+    "invalid": ["watchDisabled"]
   }; }
   static get style() { return govFormRadioCss; }
 }, [4, "gov-form-radio", {
@@ -133,7 +144,6 @@ function defineCustomElement$1() {
       break;
   } });
 }
-defineCustomElement$1();
 
 const GovFormRadio = GovFormRadio$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/gov-form-radio.js.map

@@ -1 +1 @@
-{"file":"gov-form-radio.js","mappings":"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","names":["GovFormRadio"],"sources":["../../../packages/core/src/components/gov-form/radio/gov-form-radio.scss?tag=gov-form-radio","../../../packages/core/src/components/gov-form/radio/gov-form-radio.tsx"],"sourcesContent":["/*\n *   Radio\n */\n\n@import \"../checkbox/gov-form-checkbox-core.scss\";\n$class: \".gov-form-radio\";\n\n#{$class} {\n\t@extend %form-checkbox-core;\n\tinput + span {\n\t\t&::before {\n\t\t\tborder-radius: 50%;\n\t\t}\n\t\t&::after {\n\t\t\t@include pseudo();\n\t\t\tborder-radius: 50%;\n\t\t\tbackground: $form-radio-indicator-bg;\n\t\t\topacity: 0;\n\t\t\ttransition: $t linear opacity;\n\t\t}\n\t}\n\n\t// STATES\n\tinput:checked + span::after {\n\t\topacity: 1;\n\t}\n\t@include parameter(\"invalid\") {\n\t\tinput + span::after {\n\t\t\tbackground: $form-state-color-error;\n\t\t}\n\t}\n\t@include parameter(\"disabled\") {\n\t\tinput:checked + span::after {\n\t\t\tbackground-color: $form-state-bg-disabled;\n\t\t}\n\t}\n\n\t// VARIANTS\n\t@each $size, $definitions in $form-checkbox-core-sizes {\n\t\t&[size=\"#{$size}\"] {\n\t\t\tinput + span::after {\n\t\t\t\ttop: calc((get(\"indicator-size\", $definitions) - get(\"dot-size\", $definitions)) / 2);\n\t\t\t\tleft: calc((get(\"indicator-size\", $definitions) - get(\"dot-size\", $definitions)) / 2);\n\t\t\t\twidth: get(\"dot-size\", $definitions);\n\t\t\t\theight: get(\"dot-size\", $definitions);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Host, h, Prop, Event, EventEmitter, Element, Watch, Method } from '@stencil/core'\nimport { createID } from '../../../utils/string.utils'\nimport { validateProp } from '../../../helpers/Validate/props'\nimport { FormRadioClass, FormRadioSizes, FormRadioSizesType } from './constants'\nimport { toBoolAttrIfDefined } from '../../../helpers/Dom/template'\nimport { validateWcagLabelFor, validateWcagRef } from '../../../helpers/Validate/wcag'\nimport { canValidateWcagOnRender } from '../../../helpers/Dom/win'\nimport { delay } from '../../../utils/utils'\nimport { GovForm } from '../../../helpers/Dom/form.types'\nimport { govHost } from '../../../helpers/Dom/template'\nimport { GovHost } from '../../../helpers/Dom/template.types'\nimport { govForm } from '../../../helpers/Dom/form'\nimport Fragment from '../../../helpers/Fragment'\nimport { FormRadioEvent } from './gov-form-radio.types'\n\n@Component({\n\ttag: 'gov-form-radio',\n\tstyleUrl: 'gov-form-radio.scss',\n})\nexport class GovFormRadio {\n\tprivate readonly h: GovHost\n\tprivate f: GovForm\n\tprivate inputRef?: HTMLInputElement\n\n\tprivate readonly radioId: string\n\n\tconstructor() {\n\t\tthis.radioId = createID('GovRadio')\n\n\t\tthis.h = govHost(this.host)\n\t\tthis.f = govForm(this.h)\n\t}\n\n\t@Element() host: HTMLGovFormRadioElement\n\t/**\n\t * Value of radio\n\t */\n\t@Prop() readonly value: string\n\t/**\n\t * When you can't use the form label.\n\t */\n\t@Prop({ attribute: 'no-label' }) readonly noLabel: boolean = false\n\t/**\n\t * Radio default state\n\t */\n\t@Prop({ reflect: true, mutable: true }) checked = false\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the radio component disabled.\n\t * This prevents users from being able to interact with the radio, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean\n\t/**\n\t * Name of the radio.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Radio's size.\n\t */\n\t@Prop() readonly size?: FormRadioSizesType = 'm'\n\t/**\n\t * Custom radio identifier.\n\t */\n\t@Prop({ attribute: 'identifier' }) readonly identifier: string\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: 'wcag-described-by' }) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({ attribute: 'wcag-labelled-by' }) readonly wcagLabelledBy: string\n\t/**\n\t * Emitted when the radio has focus.\n\t */\n\t@Event({ eventName: 'gov-focus' }) govFocus: EventEmitter<FormRadioEvent>\n\t/**\n\t * Emitted when the radio loses focus.\n\t */\n\t@Event({ eventName: 'gov-blur' }) govBlur: EventEmitter<FormRadioEvent>\n\t/**\n\t * Emitted when the radio change value.\n\t */\n\t@Event({ eventName: 'gov-change' }) govChange: EventEmitter<FormRadioEvent>\n\n\t@Watch('size')\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormRadioSizes, newValue, FormRadioClass.root)\n\t}\n\n\tcomponentWillLoad() {\n\t\tthis.f.passAttrToControl('type', 'radio')\n\t}\n\n\tasync componentDidRender() {\n\t\tthis.f.passAttrToLabel('identifier', this.identifier || this.radioId)\n\t\tthis.f.passAttrToLabel('required', String(this.required))\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\tconst wrapCheckbox = children => {\n\t\t\tif (this.noLabel) {\n\t\t\t\treturn <label>{children}</label>\n\t\t\t}\n\t\t\treturn children\n\t\t}\n\n\t\treturn (\n\t\t\t<Host class={FormRadioClass.root} checked={this.checked} size={this.size} invalid={toBoolAttrIfDefined(this.invalid)}>\n\t\t\t\t<div class={FormRadioClass.holder}>\n\t\t\t\t\t{wrapCheckbox(\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass={FormRadioClass.input}\n\t\t\t\t\t\t\t\tid={this.identifier || this.radioId}\n\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\t\t\tchecked={this.checked}\n\t\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\t\tonClick={this.onClickHandler.bind(this)}\n\t\t\t\t\t\t\t\tonChange={this.onChangeHandler.bind(this)}\n\t\t\t\t\t\t\t\tonFocus={this.onFocusHandler.bind(this)}\n\t\t\t\t\t\t\t\tonBlur={this.onBlurHandler.bind(this)}\n\t\t\t\t\t\t\t\tref={el => (this.inputRef = el as HTMLInputElement)}\n\t\t\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\t\t\taria-checked={this.checked}\n\t\t\t\t\t\t\t\taria-required={toBoolAttrIfDefined(this.required)}\n\t\t\t\t\t\t\t\taria-invalid={toBoolAttrIfDefined(this.invalid)}\n\t\t\t\t\t\t\t\taria-describedby={this.wcagDescribedBy}\n\t\t\t\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t<slot name=\"label\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</Fragment>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onClickHandler(e: PointerEvent) {\n\t\te.stopPropagation()\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.govFocus.emit({\n\t\t\tcomponent: FormRadioClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.govBlur.emit({\n\t\t\tcomponent: FormRadioClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onChangeHandler(e: Event) {\n\t\tthis.checked = (e.target as HTMLInputElement).checked\n\t\te.stopPropagation()\n\t\tthis.govChange.emit({\n\t\t\tcomponent: FormRadioClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\t/**\n\t * Returns the reference of the native element\n\t */\n\t@Method()\n\tasync getRef(): Promise<HTMLInputElement> {\n\t\treturn this.inputRef\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\tvalidateWcagRef(this.wcagDescribedBy, 'wcag-described-by', FormRadioClass.root)\n\t\tvalidateWcagRef(this.wcagLabelledBy, 'wcag-labelled-by', FormRadioClass.root)\n\t\tvalidateWcagLabelFor(this.identifier || this.radioId, this.wcagLabelledBy, FormRadioClass.root)\n\t}\n}\n"],"version":3}
+{"file":"gov-form-radio.js","mappings":"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","names":["GovFormRadio"],"sources":["../../../packages/core/src/components/gov-form/radio/gov-form-radio.scss?tag=gov-form-radio","../../../packages/core/src/components/gov-form/radio/gov-form-radio.tsx"],"sourcesContent":["/*\n *   Radio\n */\n\n@import \"../checkbox/gov-form-checkbox-core.scss\";\n$class: \".gov-form-radio\";\n\n#{$class} {\n\t@extend %form-checkbox-core;\n\tinput + span {\n\t\t&::before {\n\t\t\tborder-radius: 50%;\n\t\t}\n\t\t&::after {\n\t\t\t@include pseudo();\n\t\t\tborder-radius: 50%;\n\t\t\tbackground: $form-radio-indicator-bg;\n\t\t\topacity: 0;\n\t\t\ttransition: $t linear opacity;\n\t\t}\n\t}\n\n\t// STATES\n\tinput:checked + span::after {\n\t\topacity: 1;\n\t}\n\t@include parameter(\"invalid\") {\n\t\tinput + span::after {\n\t\t\tbackground: $form-state-color-error;\n\t\t}\n\t}\n\t@include parameter(\"disabled\") {\n\t\tinput:checked + span::after {\n\t\t\tbackground-color: $form-state-bg-disabled;\n\t\t}\n\t}\n\n\t// VARIANTS\n\t@each $size, $definitions in $form-checkbox-core-sizes {\n\t\t&[size=\"#{$size}\"] {\n\t\t\tinput + span::after {\n\t\t\t\ttop: calc((get(\"indicator-size\", $definitions) - get(\"dot-size\", $definitions)) / 2);\n\t\t\t\tleft: calc((get(\"indicator-size\", $definitions) - get(\"dot-size\", $definitions)) / 2);\n\t\t\t\twidth: get(\"dot-size\", $definitions);\n\t\t\t\theight: get(\"dot-size\", $definitions);\n\t\t\t}\n\t\t}\n\t}\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, Watch } from \"@stencil/core\"\nimport { createID } from \"../../../utils/string.utils\"\nimport { validateProp } from \"../../../helpers/Validate/props\"\nimport { FormRadioClass, FormRadioSizes, FormRadioSizesType } from \"./constants\"\nimport { govHost, toBoolAttr, toBoolAttrIfDefined } from \"../../../helpers/Dom/template\"\nimport { validateWcagLabelFor, validateWcagRef } from \"../../../helpers/Validate/wcag\"\nimport { canValidateWcagOnRender } from \"../../../helpers/Dom/win\"\nimport { delay } from \"../../../utils/utils\"\nimport { GovForm } from \"../../../helpers/Dom/form.types\"\nimport { GovHost } from \"../../../helpers/Dom/template.types\"\nimport { govForm } from \"../../../helpers/Dom/form\"\nimport Fragment from \"../../../helpers/Fragment\"\nimport { FormRadioEvent } from \"./gov-form-radio.types\"\n\n@Component({\n\ttag: \"gov-form-radio\",\n\tstyleUrl: \"gov-form-radio.scss\",\n})\nexport class GovFormRadio {\n\tprivate readonly h: GovHost\n\tprivate f: GovForm\n\tprivate inputRef?: HTMLInputElement\n\n\tprivate readonly radioId: string\n\n\tconstructor() {\n\t\tthis.radioId = createID(\"GovRadio\")\n\n\t\tthis.h = govHost(this.host)\n\t\tthis.f = govForm(this.h)\n\t}\n\n\t@Element() host: HTMLGovFormRadioElement\n\t/**\n\t * Value of radio\n\t */\n\t@Prop() readonly value: string\n\t/**\n\t * When you can't use the form label.\n\t */\n\t@Prop({ attribute: \"no-label\" }) readonly noLabel: boolean = false\n\t/**\n\t * Radio default state\n\t */\n\t@Prop({ reflect: true, mutable: true }) checked = false\n\t/**\n\t * Set whether the input is required or not. Please note that this is necessary for accessible inputs when the user is required to fill them.\n\t * When using this property you need to also set “novalidate” attribute to your form element to prevent browser from displaying its own validation errors.\n\t */\n\t@Prop() readonly required: boolean = false\n\t/**\n\t * Makes the radio component disabled.\n\t * This prevents users from being able to interact with the radio, and conveys its inactive state to assistive technologies.\n\t */\n\t@Prop() readonly disabled: boolean\n\t/**\n\t * Name of the radio.\n\t */\n\t@Prop() readonly name: string\n\t/**\n\t * Radio's size.\n\t */\n\t@Prop() readonly size?: FormRadioSizesType = \"m\"\n\t/**\n\t * Custom radio identifier.\n\t */\n\t@Prop({ attribute: \"identifier\" }) readonly identifier: string\n\t/**\n\t * Indicates the entered value does not conform to the format expected by the application.\n\t */\n\t@Prop() readonly invalid: boolean\n\t/**\n\t * Indicates the id of a component that describes the input.\n\t */\n\t@Prop({ attribute: \"wcag-described-by\" }) readonly wcagDescribedBy: string\n\t/**\n\t * Indicates the id of a component that labels the input.\n\t */\n\t@Prop({ attribute: \"wcag-labelled-by\" }) readonly wcagLabelledBy: string\n\t/**\n\t * Emitted when the radio has focus.\n\t */\n\t@Event({ eventName: \"gov-focus\" }) govFocus: EventEmitter<FormRadioEvent>\n\t/**\n\t * Emitted when the radio loses focus.\n\t */\n\t@Event({ eventName: \"gov-blur\" }) govBlur: EventEmitter<FormRadioEvent>\n\t/**\n\t * Emitted when the radio change value.\n\t */\n\t@Event({ eventName: \"gov-change\" }) govChange: EventEmitter<FormRadioEvent>\n\n\t@Watch(\"size\")\n\tvalidateSize(newValue: string): void {\n\t\tvalidateProp(FormRadioSizes, newValue, FormRadioClass.root)\n\t}\n\n\t@Watch(\"disabled\")\n\t@Watch(\"invalid\")\n\t@Watch(\"size\")\n\twatchDisabled(): void {\n\t\tthis.passControlAttrs()\n\t}\n\n\tprivate passControlAttrs() {\n\t\tthis.f.passAttrToControl(\"size\", this.size)\n\t\tthis.f.passAttrToControl(\"disabled\", toBoolAttr(this.disabled))\n\t\tthis.f.passAttrToControl(\"invalid\", toBoolAttr(this.invalid))\n\t\tthis.f.passAttrToControl(\"type\", \"radio\")\n\t}\n\n\n\tcomponentWillLoad() {\n\t\tthis.passControlAttrs()\n\t}\n\n\tasync componentDidRender() {\n\t\tthis.f.passAttrToLabel(\"identifier\", this.identifier || this.radioId)\n\t\tthis.f.passAttrToLabel(\"required\", String(this.required))\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\tconst wrapCheckbox = children => {\n\t\t\tif (this.noLabel) {\n\t\t\t\treturn <label>{children}</label>\n\t\t\t}\n\t\t\treturn children\n\t\t}\n\n\t\treturn (\n\t\t\t<Host class={FormRadioClass.root} checked={this.checked} size={this.size} invalid={toBoolAttrIfDefined(this.invalid)}>\n\t\t\t\t<div class={FormRadioClass.holder}>\n\t\t\t\t\t{wrapCheckbox(\n\t\t\t\t\t\t<Fragment>\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclass={FormRadioClass.input}\n\t\t\t\t\t\t\t\tid={this.identifier || this.radioId}\n\t\t\t\t\t\t\t\ttype=\"radio\"\n\t\t\t\t\t\t\t\tvalue={this.value}\n\t\t\t\t\t\t\t\tname={this.name}\n\t\t\t\t\t\t\t\tchecked={this.checked}\n\t\t\t\t\t\t\t\tdisabled={this.disabled}\n\t\t\t\t\t\t\t\tonClick={this.onClickHandler.bind(this)}\n\t\t\t\t\t\t\t\tonChange={this.onChangeHandler.bind(this)}\n\t\t\t\t\t\t\t\tonFocus={this.onFocusHandler.bind(this)}\n\t\t\t\t\t\t\t\tonBlur={this.onBlurHandler.bind(this)}\n\t\t\t\t\t\t\t\tref={el => (this.inputRef = el as HTMLInputElement)}\n\t\t\t\t\t\t\t\trequired={this.required}\n\t\t\t\t\t\t\t\taria-checked={this.checked}\n\t\t\t\t\t\t\t\taria-required={toBoolAttrIfDefined(this.required)}\n\t\t\t\t\t\t\t\taria-invalid={toBoolAttrIfDefined(this.invalid)}\n\t\t\t\t\t\t\t\taria-describedby={this.wcagDescribedBy}\n\t\t\t\t\t\t\t\taria-labelledby={this.wcagLabelledBy}\n\t\t\t\t\t\t\t\taria-disabled={toBoolAttrIfDefined(this.disabled)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t<slot name=\"label\" />\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</Fragment>,\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t)\n\t}\n\n\tprivate onClickHandler(e: PointerEvent) {\n\t\te.stopPropagation()\n\t}\n\n\tprivate onFocusHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.govFocus.emit({\n\t\t\tcomponent: FormRadioClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onBlurHandler(e: FocusEvent) {\n\t\te.stopPropagation()\n\t\tthis.govBlur.emit({\n\t\t\tcomponent: FormRadioClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\tprivate onChangeHandler(e: Event) {\n\t\tthis.checked = (e.target as HTMLInputElement).checked\n\t\te.stopPropagation()\n\t\tthis.govChange.emit({\n\t\t\tcomponent: FormRadioClass.root,\n\t\t\tvalue: this.value,\n\t\t\tchecked: this.checked,\n\t\t\toriginalEvent: e,\n\t\t})\n\t}\n\n\t/**\n\t * Returns the reference of the native element\n\t */\n\t@Method()\n\tasync getRef(): Promise<HTMLInputElement> {\n\t\treturn this.inputRef\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\tvalidateWcagRef(this.wcagDescribedBy, \"wcag-described-by\", FormRadioClass.root)\n\t\tvalidateWcagRef(this.wcagLabelledBy, \"wcag-labelled-by\", FormRadioClass.root)\n\t\tvalidateWcagLabelFor(this.identifier || this.radioId, this.wcagLabelledBy, FormRadioClass.root)\n\t}\n}\n"],"version":3}

package/dist/components/gov-form-search.js

@@ -32,7 +32,6 @@ function defineCustomElement$1() {
       break;
   } });
 }
-defineCustomElement$1();
 
 const GovFormSearch = GovFormSearch$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/gov-form-search.js.map

@@ -1 +1 @@
-{"file":"gov-form-search.js","mappings":";;AAAO,MAAM,eAAe,GAAG;EAC9B,IAAI,EAAE,iBAAiB;EACvB,KAAK,EAAE,wBAAwB;EAC/B,MAAM,EAAE,yBAAyB;CACjC;;ACJD,MAAM,gBAAgB,GAAG,owCAAowC;;MCOhxCA,eAAa;;;;;EAGzB,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,eAAe,CAAC,IAAI,IAChC,YAAM,KAAK,EAAE,eAAe,CAAC,KAAK,IACjC,YAAM,IAAI,EAAC,OAAO,GAAG,CACf,EACP,YAAM,KAAK,EAAE,eAAe,CAAC,MAAM,IAClC,YAAM,IAAI,EAAC,QAAQ,GAAG,CAChB,CACD,EACP;GACD;;;;;;;;;;;;;;;;;;;;;;;;","names":["GovFormSearch"],"sources":["../../../packages/core/src/components/gov-form/search/constants.ts","../../../packages/core/src/components/gov-form/search/gov-form-search.scss?tag=gov-form-search","../../../packages/core/src/components/gov-form/search/gov-form-search.tsx"],"sourcesContent":["export const FormSearchClass = {\n\troot: 'gov-form-search',\n\tinput: 'gov-form-search__input',\n\tbutton: 'gov-form-search__button',\n}\n","/*\n *   Search\n */\n\n$class: \".gov-form-search\";\n\n#{$class} {\n\t@include base(flex);\n\t@include focus-outline($border-radius, 0, true);\n\tgap: rem-calc(8);\n\talign-items: center;\n\tborder: $form-input-border;\n\tborder-radius: $border-radius;\n\tbackground-color: $form-bg-color;\n\t&__input {\n\t\tflex: 1 1 auto;\n\t\tinput {\n\t\t\theight: auto;\n\t\t\tborder-width: 0 !important;\n\t\t\t&:focus-visible {\n\t\t\t\toutline: none !important;\n\t\t\t}\n\t\t}\n\t}\n\t&__button {\n\t\tflex: 0 0 auto;\n\t\tmargin: rem-calc(3) rem-calc(3) rem-calc(3) 0;\n\t}\n}\n","import { Component, Element, h, Host } from '@stencil/core'\nimport { FormSearchClass } from './constants'\n\n@Component({\n\ttag: 'gov-form-search',\n\tstyleUrl: 'gov-form-search.scss',\n})\nexport class GovFormSearch {\n\t@Element() host: HTMLGovFormSearchElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={FormSearchClass.root}>\n\t\t\t\t<span class={FormSearchClass.input}>\n\t\t\t\t\t<slot name=\"input\" />\n\t\t\t\t</span>\n\t\t\t\t<span class={FormSearchClass.button}>\n\t\t\t\t\t<slot name=\"button\" />\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}
+{"file":"gov-form-search.js","mappings":";;AAAO,MAAM,eAAe,GAAG;EAC9B,IAAI,EAAE,iBAAiB;EACvB,KAAK,EAAE,wBAAwB;EAC/B,MAAM,EAAE,yBAAyB;CACjC;;ACJD,MAAM,gBAAgB,GAAG,owCAAowC;;MCOhxCA,eAAa;;;;;EAGzB,MAAM;IACL,QACC,EAAC,IAAI,IAAC,KAAK,EAAE,eAAe,CAAC,IAAI,IAChC,YAAM,KAAK,EAAE,eAAe,CAAC,KAAK,IACjC,YAAM,IAAI,EAAC,OAAO,GAAG,CACf,EACP,YAAM,KAAK,EAAE,eAAe,CAAC,MAAM,IAClC,YAAM,IAAI,EAAC,QAAQ,GAAG,CAChB,CACD,EACP;GACD;;;;;;;;;;;;;;;;;;;;;;;","names":["GovFormSearch"],"sources":["../../../packages/core/src/components/gov-form/search/constants.ts","../../../packages/core/src/components/gov-form/search/gov-form-search.scss?tag=gov-form-search","../../../packages/core/src/components/gov-form/search/gov-form-search.tsx"],"sourcesContent":["export const FormSearchClass = {\n\troot: 'gov-form-search',\n\tinput: 'gov-form-search__input',\n\tbutton: 'gov-form-search__button',\n}\n","/*\n *   Search\n */\n\n$class: \".gov-form-search\";\n\n#{$class} {\n\t@include base(flex);\n\t@include focus-outline($border-radius, 0, true);\n\tgap: rem-calc(8);\n\talign-items: center;\n\tborder: $form-input-border;\n\tborder-radius: $border-radius;\n\tbackground-color: $form-bg-color;\n\t&__input {\n\t\tflex: 1 1 auto;\n\t\tinput {\n\t\t\theight: auto;\n\t\t\tborder-width: 0 !important;\n\t\t\t&:focus-visible {\n\t\t\t\toutline: none !important;\n\t\t\t}\n\t\t}\n\t}\n\t&__button {\n\t\tflex: 0 0 auto;\n\t\tmargin: rem-calc(3) rem-calc(3) rem-calc(3) 0;\n\t}\n}\n","import { Component, Element, h, Host } from '@stencil/core'\nimport { FormSearchClass } from './constants'\n\n@Component({\n\ttag: 'gov-form-search',\n\tstyleUrl: 'gov-form-search.scss',\n})\nexport class GovFormSearch {\n\t@Element() host: HTMLGovFormSearchElement\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={FormSearchClass.root}>\n\t\t\t\t<span class={FormSearchClass.input}>\n\t\t\t\t\t<slot name=\"input\" />\n\t\t\t\t</span>\n\t\t\t\t<span class={FormSearchClass.button}>\n\t\t\t\t\t<slot name=\"button\" />\n\t\t\t\t</span>\n\t\t\t</Host>\n\t\t)\n\t}\n}\n"],"version":3}

package/dist/components/gov-form-select2.js

@@ -1,5 +1,5 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { g as govHost, t as toBoolAttrIfDefined } from './template.js';
+import { g as govHost, a as toBoolAttr, t as toBoolAttrIfDefined } from './template.js';
 import { g as govForm, q as FormSelectClass, r as FormSelectVariants, s as FormSelectSizes } from './form.js';
 import { v as validateProp } from './props.js';
 import { b as validateWcagRef, c as validateWcagLabelFor } from './wcag.js';
@@ -32,8 +32,8 @@ const GovFormSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
     this.wcagOwns = undefined;
     this.focused = undefined;
     this.h = govHost(this.host);
+    this.f = govForm(this.h);
     this.selectId = createID("GovSelect");
-    this.f = govForm(govHost(this.host));
   }
   validateVariant(newValue) {
     validateProp(FormSelectVariants, newValue, FormSelectClass.root);
@@ -41,6 +41,15 @@ const GovFormSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   validateSize(newValue) {
     validateProp(FormSelectSizes, newValue, FormSelectClass.root);
   }
+  watchDisabled() {
+    this.passControlAttrs();
+  }
+  passControlAttrs() {
+    this.f.passAttrToControl("size", this.size);
+    this.f.passAttrToControl("disabled", toBoolAttr(this.disabled));
+    this.f.passAttrToControl("invalid", toBoolAttr(this.invalid));
+    this.f.passAttrToControl("type", "select");
+  }
   componentWillLoad() {
     this.validateVariant(this.variant);
     this.validateSize(this.size);
@@ -49,7 +58,7 @@ const GovFormSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
         option.setAttribute("selected", "true");
       }
     });
-    this.f.passAttrToControl("type", "select");
+    this.passControlAttrs();
     this.f.passAttrToLabel("required", String(this.required));
   }
   async componentDidRender() {
@@ -117,7 +126,9 @@ const GovFormSelect = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement
   get host() { return this; }
   static get watchers() { return {
     "variant": ["validateVariant"],
-    "size": ["validateSize"]
+    "size": ["validateSize", "watchDisabled"],
+    "disabled": ["watchDisabled"],
+    "invalid": ["watchDisabled"]
   }; }
   static get style() { return govFormSelectCss; }
 }, [4, "gov-form-select", {
@@ -158,7 +169,6 @@ function defineCustomElement() {
       break;
   } });
 }
-defineCustomElement();
 
 export { GovFormSelect as G, defineCustomElement as d };