q2-tecton-elements 1.36.0 → 1.37.0

package/dist/collection/components/q2-editable-field/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-editable-field/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, State, Prop, h, Listen, Element, Event, EventEmitter, Watch } from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent } from 'src/components';\nimport { handleAriaLabel, isEventFromElement, loc, overrideFocus } from 'src/utils';\nimport { Q2Input } from '../q2-input';\nimport { IFormatterValueObject } from '../q2-input/types';\n\ninterface IExtendedQ2InputElement extends HTMLQ2InputElement {\n    formattedValue: IFormatterValueObject['formattedValue'];\n}\n\n@Component({\n    tag: 'q2-editable-field',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2EditableField {\n    @Prop({ reflect: true, mutable: true }) value: string = '';\n    @Prop({ reflect: true, mutable: true }) editing: boolean = false;\n    @Prop({ reflect: true, mutable: true }) label: string = '';\n    @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n    @Prop({ reflect: true }) type: Q2Input['type'];\n    @Prop({ reflect: true }) formatModifier: string;\n    @Prop({ reflect: true }) truncated: boolean;\n    @Prop({ reflect: true }) maxlength: number;\n    @Prop({ reflect: true }) persistentLabel: boolean;\n    @Prop({ reflect: true }) disabled: boolean;\n    @Prop({ reflect: true }) block: boolean;\n    @Prop() hints: string[];\n    @Prop() errors: string[];\n\n    /** @deprecated */\n    @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n    scheduledAfterRender: (() => void)[] = [];\n\n    @Element() hostElement: HTMLElement;\n    q2InputElement: HTMLQ2InputElement;\n    q2EditBtnElement: HTMLQ2BtnElement;\n\n    @State() formattedValue: string;\n    innerValue: string;\n    defaultValue: string = this.value;\n\n    get locLabel() {\n        return (this.label && loc(this.label)) || '';\n    }\n\n    /////// LIFECYCLE HOOKS ///////\n\n    componentWillLoad() {\n        handleAriaLabel(this);\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n        this.formattedValue = (this.q2InputElement as IExtendedQ2InputElement).formattedValue;\n    }\n\n    componentDidLoad() {\n        overrideFocus(this.hostElement);\n    }\n\n    //////// OBSERVERS ////////\n\n    @Watch('errors')\n    errorsObserver() {\n        const { editing, errors = [] } = this;\n        const focusedElement = this.hostElement.shadowRoot.activeElement;\n        const isInputFocused = focusedElement?.tagName === 'Q2-INPUT' ?? false;\n        const hasErrors = errors.length;\n        if (isInputFocused || !focusedElement || !editing || !hasErrors) return;\n        this.q2InputElement.focus();\n    }\n\n    @Watch('ariaLabel')\n    ariaLabelObserver() {\n        handleAriaLabel(this);\n    }\n\n    @Watch('editing')\n    observesEditing(newValue: boolean, oldValue: boolean) {\n        if (newValue === oldValue) return;\n        this.scheduledAfterRender.push(this.hostElement.focus);\n    }\n\n    get wrapperClass() {\n        return `q2-editable-field-wrapper ${this.editing ? 'editing' : ''}`;\n    }\n\n    ///////// HOST ELEMENT EVENTS //////\n\n    @Listen('change')\n    onHostElementChange(event: CustomEvent) {\n        if (!isEventFromElement(event, this.hostElement) || this.hostElement.onchange) return;\n        switch (event.detail.name) {\n            case 'save':\n                this.value = event.detail.value;\n                break;\n\n            case 'cancel':\n                this.q2InputElement.value = this.value;\n                break;\n        }\n\n        this.editing = event.detail.editing;\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.hostElement.shadowRoot.querySelector<HTMLElement>(this.editing ? 'q2-input' : 'q2-btn.begin-edit').focus();\n    }\n\n    ///////// EVENTS /////////\n\n    @Event() input: EventEmitter;\n    @Event() change: EventEmitter;\n\n    //////// ACTIONS /////////\n\n    inputInput = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n        event.stopPropagation();\n        this.input.emit(event.detail);\n        this.formattedValue = event.detail.formattedValue;\n        this.innerValue = event.detail.value;\n    };\n\n    inputChange = (e: CustomEvent) => {\n        e.stopPropagation();\n    };\n\n    inputKeyDown = (e: KeyboardEvent) => {\n        if (e.key === 'Escape' || e.key === 'Esc') {\n            e.preventDefault();\n            this.cancelClick();\n            return;\n        }\n\n        if (e.key === 'Enter') {\n            e.preventDefault();\n            this.saveClick();\n            return;\n        }\n    };\n\n    inputClick = (event: MouseEvent) => {\n        event.stopPropagation();\n    };\n\n    saveClick = (event?: MouseEvent) => {\n        event && event.stopPropagation();\n        const valueFromInputProp = this.hostElement.shadowRoot.querySelector('q2-input').value;\n        this.defaultValue = valueFromInputProp;\n        this.change.emit({\n            editing: false,\n            name: 'save',\n            value: this.innerValue || valueFromInputProp,\n            formattedValue: this.formattedValue || valueFromInputProp,\n        });\n\n        setTimeout(() => {\n            const { errors = [] } = this;\n            if (!errors.length) return;\n            this.hostElement.focus();\n        }, 1);\n    };\n\n    editClick = (event: MouseEvent) => {\n        event?.stopPropagation();\n        this.change.emit({ editing: true, name: 'edit' });\n    };\n\n    cancelClick = (event?: MouseEvent) => {\n        event?.stopPropagation();\n        this.change.emit({ editing: false, name: 'cancel' });\n        this.hostElement.shadowRoot.querySelector('q2-input').value = this.defaultValue;\n    };\n\n    render() {\n        return (\n            <div>\n                {this.generateEditStateDOM()}\n                {this.generateReadStateDOM()}\n            </div>\n        );\n    }\n\n    generateEditStateDOM() {\n        return (\n            <div\n                class={this.wrapperClass}\n                hidden={!this.editing}\n            >\n                <q2-input\n                    ref={el => (this.q2InputElement = el)}\n                    label={this.locLabel}\n                    hideLabel={this.hideLabel}\n                    value={this.value}\n                    hints={(Array.isArray(this.hints) && this.hints.map(str => loc(str))) || undefined}\n                    errors={(Array.isArray(this.errors) && this.errors.map(str => loc(str))) || undefined}\n                    type={this.type}\n                    disabled={this.disabled}\n                    formatModifier={this.formatModifier}\n                    maxlength={this.maxlength}\n                    test-id=\"editableInput\"\n                    onInput={this.inputInput}\n                    onChange={this.inputChange}\n                    onKeyDown={this.inputKeyDown}\n                    onClick={this.inputClick}\n                />\n                <q2-btn\n                    class=\"cancel-edit\"\n                    label={`${loc('tecton.element.editableField.cancel')} ${this.locLabel}`}\n                    hide-label\n                    test-id=\"cancelButton\"\n                    onClick={this.cancelClick}\n                >\n                    <q2-icon type=\"close\" />\n                </q2-btn>\n                <q2-btn\n                    class=\"save-edit\"\n                    label={`${loc('tecton.element.editableField.save')} ${this.locLabel}`}\n                    hide-label\n                    test-id=\"saveButton\"\n                    onClick={this.saveClick}\n                >\n                    <q2-icon type=\"checkmark\" />\n                </q2-btn>\n            </div>\n        );\n    }\n\n    generateReadStateDOM() {\n        if (this.persistentLabel && this.locLabel) {\n            return (\n                <div\n                    class={this.wrapperClass}\n                    hidden={this.editing}\n                >\n                    <dl>\n                        <dt class=\"read-state-label\">{this.locLabel}</dt>\n                        <dd>\n                            <span class=\"text-wrapper\">{this.formattedValue || this.value}</span>\n                            {this.generateEditBtn()}\n                        </dd>\n                    </dl>\n                </div>\n            );\n        }\n        return (\n            <div\n                class={this.wrapperClass}\n                hidden={this.editing}\n            >\n                <div class=\"text-wrapper\">{this.formattedValue || this.value}</div>\n                {this.generateEditBtn()}\n            </div>\n        );\n    }\n\n    generateEditBtn() {\n        return (\n            <q2-btn\n                ref={el => (this.q2EditBtnElement = el)}\n                class=\"begin-edit\"\n                label={`${loc('tecton.element.editableField.edit')} ${this.locLabel}`}\n                hide-label\n                disabled={this.disabled}\n                test-id=\"editButton\"\n                onClick={this.editClick}\n            >\n                <q2-icon type=\"edit\" />\n            </q2-btn>\n        );\n    }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-editable-field/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, State, Prop, h, Listen, Element, Event, EventEmitter, Method, Watch } from '@stencil/core';\nimport { IEventDetail, Q2InputCustomEvent } from 'src/components';\nimport { handleAriaLabel, isEventFromElement, loc, overrideFocus, waitForNextPaint } from 'src/utils';\nimport { Q2Input } from '../q2-input';\nimport { IFormatterValueObject } from '../q2-input/types';\n\ninterface IExtendedQ2InputElement extends HTMLQ2InputElement {\n    formattedValue: IFormatterValueObject['formattedValue'];\n}\n\n@Component({\n    tag: 'q2-editable-field',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2EditableField {\n    @Prop({ reflect: true, mutable: true }) value: string = '';\n    @Prop({ reflect: true, mutable: true }) editing: boolean = false;\n    @Prop({ reflect: true, mutable: true }) label: string = '';\n    @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n    @Prop({ reflect: true }) type: Q2Input['type'];\n    @Prop({ reflect: true }) formatModifier: string;\n    @Prop({ reflect: true }) truncated: boolean;\n    @Prop({ reflect: true }) maxlength: number;\n    @Prop({ reflect: true }) persistentLabel: boolean;\n    @Prop({ reflect: true }) disabled: boolean;\n    @Prop({ reflect: true }) block: boolean;\n    @Prop() hints: string[];\n    @Prop() errors: string[];\n\n    /** @deprecated */\n    @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n    scheduledAfterRender: (() => void)[] = [];\n\n    @Element() hostElement: HTMLElement;\n    inputElement: HTMLQ2InputElement;\n    editBtnElement: HTMLQ2BtnElement;\n    cancelBtnElement: HTMLQ2BtnElement;\n    saveBtnElement: HTMLQ2BtnElement;\n\n    @State() formattedValue: string;\n    innerValue: string;\n    defaultValue: string = this.value;\n\n    get locLabel() {\n        return (this.label && loc(this.label)) || '';\n    }\n\n    /////// LIFECYCLE HOOKS ///////\n\n    componentWillLoad() {\n        handleAriaLabel(this);\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n        this.formattedValue = (this.inputElement as IExtendedQ2InputElement).formattedValue;\n    }\n\n    componentDidLoad() {\n        overrideFocus(this.hostElement);\n    }\n\n    //////// OBSERVERS ////////\n\n    @Watch('errors')\n    errorsObserver() {\n        const { editing, errors = [] } = this;\n        const focusedElement = this.hostElement.shadowRoot.activeElement;\n        const isInputFocused = focusedElement?.tagName === 'Q2-INPUT' ?? false;\n        const hasErrors = errors.length;\n        if (isInputFocused || !focusedElement || !editing || !hasErrors) return;\n        this.inputElement.focus();\n    }\n\n    @Watch('ariaLabel')\n    ariaLabelObserver() {\n        handleAriaLabel(this);\n    }\n\n    @Watch('editing')\n    observesEditing(newValue: boolean, oldValue: boolean) {\n        if (newValue === oldValue) return;\n        this.scheduledAfterRender.push(this.hostElement.focus);\n    }\n\n    get wrapperClass() {\n        return `q2-editable-field-wrapper ${this.editing ? 'editing' : ''}`;\n    }\n\n    ///////// HOST ELEMENT EVENTS //////\n\n    @Listen('change')\n    onHostElementChange(event: CustomEvent) {\n        if (!isEventFromElement(event, this.hostElement) || this.hostElement.onchange) return;\n        switch (event.detail.name) {\n            case 'save':\n                this.value = event.detail.value;\n                break;\n\n            case 'cancel':\n                this.inputElement.value = this.value;\n                break;\n        }\n\n        this.editing = event.detail.editing;\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.hostElement.shadowRoot.querySelector<HTMLElement>(this.editing ? 'q2-input' : 'q2-btn.begin-edit').focus();\n    }\n\n    ///////// EVENTS /////////\n\n    @Event() input: EventEmitter;\n    @Event() change: EventEmitter;\n\n    /// Methods ///\n    @Method()\n    clickEdit() {\n        if (this.editing) return;\n        this.editBtnElement?.click();\n    }\n\n    @Method()\n    clickCancel() {\n        if (!this.editing) return;\n        this.cancelBtnElement?.click();\n    }\n\n    @Method()\n    clickSave() {\n        if (!this.editing) return;\n        this.saveBtnElement?.click();\n    }\n\n    @Method()\n    async setValue(value: string, options: { clickSave?: boolean } = { clickSave: true }) {\n        await this.clickEdit();\n        await waitForNextPaint();\n\n        await this.inputElement.setValue(value);\n\n        if (options.clickSave) {\n            await this.clickSave();\n            await waitForNextPaint();\n        }\n    }\n\n    //////// ACTIONS /////////\n\n    inputInput = (event: Q2InputCustomEvent<IEventDetail> & InputEvent) => {\n        event.stopPropagation();\n        this.input.emit(event.detail);\n        this.formattedValue = event.detail.formattedValue;\n        this.innerValue = event.detail.value;\n    };\n\n    inputChange = (e: CustomEvent) => {\n        e.stopPropagation();\n    };\n\n    inputKeyDown = (e: KeyboardEvent) => {\n        if (e.key === 'Escape' || e.key === 'Esc') {\n            e.preventDefault();\n            this.cancelClick();\n            return;\n        }\n\n        if (e.key === 'Enter') {\n            e.preventDefault();\n            this.saveClick();\n            return;\n        }\n    };\n\n    inputClick = (event: MouseEvent) => {\n        event.stopPropagation();\n    };\n\n    saveClick = (event?: MouseEvent) => {\n        event && event.stopPropagation();\n        const valueFromInputProp = this.hostElement.shadowRoot.querySelector('q2-input').value;\n        this.defaultValue = valueFromInputProp;\n        this.change.emit({\n            editing: false,\n            name: 'save',\n            value: this.innerValue || valueFromInputProp,\n            formattedValue: this.formattedValue || valueFromInputProp,\n        });\n\n        setTimeout(() => {\n            const { errors = [] } = this;\n            if (!errors.length) return;\n            this.hostElement.focus();\n        }, 1);\n    };\n\n    editClick = (event: MouseEvent) => {\n        event?.stopPropagation();\n        this.change.emit({ editing: true, name: 'edit' });\n    };\n\n    cancelClick = (event?: MouseEvent) => {\n        event?.stopPropagation();\n        this.change.emit({ editing: false, name: 'cancel' });\n        this.hostElement.shadowRoot.querySelector('q2-input').value = this.defaultValue;\n    };\n\n    render() {\n        return (\n            <div>\n                {this.generateEditStateDOM()}\n                {this.generateReadStateDOM()}\n            </div>\n        );\n    }\n\n    generateEditStateDOM() {\n        return (\n            <div\n                class={this.wrapperClass}\n                hidden={!this.editing}\n            >\n                <q2-input\n                    ref={el => (this.inputElement = el)}\n                    label={this.locLabel}\n                    hideLabel={this.hideLabel}\n                    value={this.value}\n                    hints={(Array.isArray(this.hints) && this.hints.map(str => loc(str))) || undefined}\n                    errors={(Array.isArray(this.errors) && this.errors.map(str => loc(str))) || undefined}\n                    type={this.type}\n                    disabled={this.disabled}\n                    formatModifier={this.formatModifier}\n                    maxlength={this.maxlength}\n                    test-id=\"editableInput\"\n                    onInput={this.inputInput}\n                    onChange={this.inputChange}\n                    onKeyDown={this.inputKeyDown}\n                    onClick={this.inputClick}\n                />\n                <q2-btn\n                    ref={el => (this.cancelBtnElement = el)}\n                    class=\"cancel-edit\"\n                    label={`${loc('tecton.element.editableField.cancel')} ${this.locLabel}`}\n                    hide-label\n                    test-id=\"cancelButton\"\n                    onClick={this.cancelClick}\n                >\n                    <q2-icon type=\"close\" />\n                </q2-btn>\n                <q2-btn\n                    ref={el => (this.saveBtnElement = el)}\n                    class=\"save-edit\"\n                    label={`${loc('tecton.element.editableField.save')} ${this.locLabel}`}\n                    hide-label\n                    test-id=\"saveButton\"\n                    onClick={this.saveClick}\n                >\n                    <q2-icon type=\"checkmark\" />\n                </q2-btn>\n            </div>\n        );\n    }\n\n    generateReadStateDOM() {\n        if (this.persistentLabel && this.locLabel) {\n            return (\n                <div\n                    class={this.wrapperClass}\n                    hidden={this.editing}\n                >\n                    <dl>\n                        <dt class=\"read-state-label\">{this.locLabel}</dt>\n                        <dd>\n                            <span class=\"text-wrapper\">{this.formattedValue || this.value}</span>\n                            {this.generateEditBtn()}\n                        </dd>\n                    </dl>\n                </div>\n            );\n        }\n        return (\n            <div\n                class={this.wrapperClass}\n                hidden={this.editing}\n            >\n                <div class=\"text-wrapper\">{this.formattedValue || this.value}</div>\n                {this.generateEditBtn()}\n            </div>\n        );\n    }\n\n    generateEditBtn() {\n        return (\n            <q2-btn\n                ref={el => (this.editBtnElement = el)}\n                class=\"begin-edit\"\n                label={`${loc('tecton.element.editableField.edit')} ${this.locLabel}`}\n                hide-label\n                disabled={this.disabled}\n                test-id=\"editButton\"\n                onClick={this.editClick}\n            >\n                <q2-icon type=\"edit\" />\n            </q2-btn>\n        );\n    }\n}\n"]}

package/dist/collection/components/q2-input/index.js

@@ -1,4 +1,4 @@
-import { h, Fragment } from '@stencil/core';
+import { h, Fragment, } from '@stencil/core';
 import { createGuid, labelDOM, loc, messagesDOM, setMessageHeight, handleAriaLabel, overrideFocus, isEventFromElement, isMobile, } from 'src/utils';
 import formatCurrency from './formatting/currency';
 import formatPhoneNumber from './formatting/phone';
@@ -383,6 +383,19 @@ export class Q2Input {
   errorsObserver() {
     this.hasFocus && this.scheduledAfterRender.push(() => setMessageHeight(this));
   }
+  /// Methods ///
+  setValue(value) {
+    const { inputField } = this;
+    inputField.focus();
+    inputField.dispatchEvent(new FocusEvent('focus'));
+    inputField.value = value;
+    inputField.dispatchEvent(new InputEvent('input'));
+  }
+  clearValue() {
+    if (!this.clearable)
+      return;
+    this.onClearInput();
+  }
   ///////// HOST ELEMENT EVENTS //////
   onHostElementFocus(event) {
     if (!isEventFromElement(event, this.hostElement))
@@ -390,6 +403,7 @@ export class Q2Input {
     this.inputField.focus();
   }
   onHostElementChange(event) {
+    event.stopPropagation();
     if (event.target === this.hostElement && !this.hostElement.onchange) {
       this.value = event.detail.value;
     }
@@ -424,19 +438,12 @@ export class Q2Input {
     const inputClasses = ['input-field'];
     if (hasCustomDisplaySlot)
       inputClasses.push('sr');
-    return (h(Fragment, null, hasCustomDisplaySlot && (h("div", { class: "custom-display-container" }, h("slot", { name: "custom-display" }))), h("input", { class: inputClasses.join(' '), id: this.inputId, type: this.computedType, size: this.formattedValueObject.prefix ? 10 : undefined, max: this.max, min: this.min, step: this.step, "aria-current": this.current || undefined, "aria-describedby": this.inputDescribedBy, "aria-required": `${!this.optional}`, "aria-invalid": `${this.hasError}`, "aria-controls": (this.ariaControls && `${this.ariaControls}`) || undefined, "aria-owns": (this.ariaOwns && `${this.ariaOwns}`) || undefined, "aria-haspopup": (this.ariaHaspopup && `${this.ariaHaspopup}`) || undefined, "aria-expanded": (!!this.ariaExpanded && `${!!this.ariaExpanded}`) || undefined, "aria-activedescendant": this.ariaActivedescendant && `${this.ariaActivedescendant}`, "aria-label": this.hideLabel && this.label ? loc(this.label) : undefined, autocomplete: this.computedAutocomplete, autocapitalize: this.autocapitalize, autocorrect: this.autocorrect === 'on' ? 'on' : 'off', autofocus: this.autofocus, placeholder: (this.placeholder && loc(this.placeholder)) || undefined, role: (this.role && `${this.role}`) || undefined, "test-id": "inputField", readonly: !!this.readonly, disabled: !!this.disabled, onFocus: this.onInputFocus, onBlur: this.onInputBlur, onClick: this.onInputClick, onKeyDown: this.onInputKeydown, onInput: this.onInputInput, onPaste: this.onInputPaste, inputmode: this.inputMode })));
+    return (h(Fragment, null, hasCustomDisplaySlot && (h("div", { class: "custom-display-container" }, h("slot", { name: "custom-display" }))), h("input", { class: inputClasses.join(' '), id: this.inputId, type: this.computedType, size: this.formattedValueObject.prefix ? 10 : undefined, max: this.max, min: this.min, step: this.step, "aria-current": this.current || undefined, "aria-describedby": this.inputDescribedBy, "aria-required": `${!this.optional}`, "aria-invalid": `${this.hasError}`, "aria-controls": (this.ariaControls && `${this.ariaControls}`) || undefined, "aria-owns": (this.ariaOwns && `${this.ariaOwns}`) || undefined, "aria-haspopup": (this.ariaHaspopup && `${this.ariaHaspopup}`) || undefined, "aria-expanded": (!!this.ariaExpanded && `${!!this.ariaExpanded}`) || undefined, "aria-activedescendant": this.ariaActivedescendant && `${this.ariaActivedescendant}`, autocomplete: this.computedAutocomplete, autocapitalize: this.autocapitalize, autocorrect: this.autocorrect === 'on' ? 'on' : 'off', autofocus: this.autofocus, placeholder: (this.placeholder && loc(this.placeholder)) || undefined, role: (this.role && `${this.role}`) || undefined, "test-id": "inputField", readonly: !!this.readonly, disabled: !!this.disabled, onFocus: this.onInputFocus, onBlur: this.onInputBlur, onClick: this.onInputClick, onKeyDown: this.onInputKeydown, onInput: this.onInputInput, onPaste: this.onInputPaste, inputmode: this.inputMode })));
   }
   /* tslint:enable:cyclomatic-complexity */
   pseudoInputDOM() {
     const showPlaceholder = !this.value && !!this.placeholder;
-    let ariaLabelSuffix = '';
-    if (this.optional) {
-      ariaLabelSuffix = loc('tecton.element.input.optional');
-    }
-    if (this.readonly) {
-      ariaLabelSuffix = loc('tecton.element.input.readonly');
-    }
-    return (h("div", { class: "pseudo-input-container" }, h("button", { class: "input-field", type: "button", id: this.inputId, "aria-describedby": this.inputDescribedBy, "aria-invalid": `${this.hasError}`, "aria-controls": (this.ariaControls && `${this.ariaControls}`) || undefined, "aria-owns": (this.ariaOwns && `${this.ariaOwns}`) || undefined, "aria-haspopup": (this.ariaHaspopup && `${this.ariaHaspopup}`) || undefined, "aria-expanded": this.ariaExpanded === 'true' ? 'true' : undefined, "aria-activedescendant": this.ariaActivedescendant && `${this.ariaActivedescendant}`, "aria-label": `${this.value}, ${(this.label && loc(this.label)) || ''}${ariaLabelSuffix}`, role: (this.role && `${this.role}`) || undefined, disabled: !!this.disabled, "test-id": "q2InputInnerClearButton", onFocus: this.onInputFocus, onBlur: this.onInputBlur }, h("div", { class: "custom-display-container" }, h("slot", { name: "custom-display" }, h("span", { class: showPlaceholder ? 'placeholder-text' : '' }, showPlaceholder ? this.placeholder : this.value))))));
+    return (h("div", { class: "pseudo-input-container" }, h("button", { class: "input-field", type: "button", id: this.inputId, "aria-describedby": this.inputDescribedBy, "aria-invalid": `${this.hasError}`, "aria-controls": (this.ariaControls && `${this.ariaControls}`) || undefined, "aria-owns": (this.ariaOwns && `${this.ariaOwns}`) || undefined, "aria-haspopup": (this.ariaHaspopup && `${this.ariaHaspopup}`) || undefined, "aria-expanded": this.ariaExpanded === 'true' ? 'true' : undefined, "aria-activedescendant": this.ariaActivedescendant && `${this.ariaActivedescendant}`, role: (this.role && `${this.role}`) || undefined, disabled: !!this.disabled, "test-id": "q2InputInnerClearButton", onFocus: this.onInputFocus, onBlur: this.onInputBlur }, h("div", { class: "custom-display-container" }, h("slot", { name: "custom-display" }, h("span", { class: showPlaceholder ? 'placeholder-text' : '' }, showPlaceholder ? this.placeholder : this.value))))));
   }
   placeCursorAtEnd() {
     const { inputField } = this;
@@ -1221,6 +1228,37 @@ export class Q2Input {
         }
       }];
   }
+  static get methods() {
+    return {
+      "setValue": {
+        "complexType": {
+          "signature": "(value: string) => Promise<void>",
+          "parameters": [{
+              "tags": [],
+              "text": ""
+            }],
+          "references": {},
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      },
+      "clearValue": {
+        "complexType": {
+          "signature": "() => Promise<void>",
+          "parameters": [],
+          "references": {},
+          "return": "Promise<void>"
+        },
+        "docs": {
+          "text": "",
+          "tags": []
+        }
+      }
+    };
+  }
   static get elementRef() { return "hostElement"; }
   static get watchers() {
     return [{

package/dist/collection/components/q2-input/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-input/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Element, State, Event, EventEmitter, h, Watch, Listen, Fragment } from '@stencil/core';\nimport {\n    createGuid,\n    labelDOM,\n    loc,\n    messagesDOM,\n    setMessageHeight,\n    handleAriaLabel,\n    overrideFocus,\n    isEventFromElement,\n    isMobile,\n} from 'src/utils';\nimport { IFormatterValueObject, ICursorData, IEventDetail } from './types';\nimport formatCurrency from './formatting/currency';\nimport formatPhoneNumber from './formatting/phone';\nimport formatSSN from './formatting/ssn';\nimport formatTIN from './formatting/tin';\nimport formatAlphanumeric from './formatting/alphanumeric';\nimport formatAlpha from './formatting/alpha';\nimport formatNumeric, { formatPercentage } from './formatting/numeric';\nimport formatPostalCode from './formatting/postal';\nimport formatDate from './formatting/date';\nimport formatCreditCard from './formatting/credit-card';\nimport { Q2Icon } from '../q2-icon';\nimport { Q2Badge } from '../q2-badge';\n\nconst inputTypeMap = {\n    text: 'text',\n    tel: 'tel',\n    number: 'number',\n    password: 'text',\n    search: 'search',\n    url: 'url',\n    email: 'email',\n    currency: 'text',\n    phone: 'tel',\n    ssn: 'text',\n    alphanumeric: 'text',\n    alpha: 'text',\n    numeric: 'text',\n    percentage: 'text',\n    postal: 'text',\n    date: 'text',\n    'credit-card': 'text',\n};\n\nexport type InputType = keyof typeof inputTypeMap;\n\n@Component({\n    tag: 'q2-input',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Input {\n    @Prop({ mutable: true }) value: string;\n    @Prop({ reflect: true, mutable: true }) label: string;\n    @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n    @Prop({ reflect: true }) type: InputType = 'text';\n    @Prop({ reflect: true }) placeholder: string;\n    @Prop({ reflect: true }) disabled: boolean = false;\n    @Prop({ reflect: true }) autocomplete: string;\n    @Prop({ reflect: true }) autocorrect: 'on' | 'off';\n    @Prop({ reflect: true }) autocapitalize: string;\n    @Prop({ reflect: true }) autofocus: boolean;\n    @Prop({ reflect: true }) hideMessages: boolean;\n    @Prop({ reflect: true }) iconLeft: Q2Icon['type'];\n    @Prop({ reflect: true }) iconRight: Q2Icon['type'];\n    @Prop({ reflect: true }) readonly: boolean;\n    @Prop({ reflect: true }) clearable: boolean;\n    @Prop({ reflect: true }) optional: boolean;\n    @Prop({ reflect: true }) min: number;\n    @Prop({ reflect: true }) max: number;\n    @Prop({ reflect: true }) step: number;\n    @Prop({ reflect: true }) formatModifier: string;\n    @Prop({ reflect: true, mutable: true }) maxlength: number;\n    @Prop({ reflect: true }) pseudo: boolean;\n    @Prop({ reflect: true }) showVisibilityToggle: boolean = false;\n    @Prop({ reflect: true, mutable: true }) textHidden: boolean;\n    @Prop({ reflect: true }) badgeValue: string;\n    @Prop({ reflect: true }) badgeTheme: Q2Badge['theme'];\n    @Prop() role: string;\n    @Prop() ariaControls: string;\n    @Prop() ariaOwns: string;\n    @Prop() ariaHaspopup: string;\n    @Prop() ariaExpanded: string;\n    @Prop() ariaActivedescendant: string;\n    @Prop() current: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false';\n\n    /** @deprecated */\n    @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n    @Prop() errors: string[];\n    @Prop() hints: string[];\n\n    @State() formattedValueObject: IFormatterValueObject;\n    @State() hasFocus: boolean;\n    @State() isSmall: boolean = false;\n\n    resizeObserver: ResizeObserver;\n    scheduledAfterRender: (() => void)[] = [];\n    valueOnFocus: string;\n    isMobile: boolean = isMobile();\n\n    /////// LIFECYCLE HOOKS ////////\n\n    componentWillLoad() {\n        if (isNaN(this.maxlength)) {\n            this.maxlength = undefined;\n        }\n        this.formattedValueObject = this.getFormattedValue(this.stringValue, true);\n\n        Object.defineProperty(this.hostElement, 'formattedValue', {\n            get: () => this.formattedValueObject?.formattedValue ?? '',\n        });\n\n        handleAriaLabel(this);\n        if (this.textHidden === undefined) {\n            this.textHidden = this.type === 'password';\n        }\n\n        this.manageClearableResizeObserver(this.clearable);\n    }\n\n    componentDidLoad() {\n        if (!this.pseudo) {\n            this.inputField.value = this.formattedValueObject.formattedValue;\n        }\n\n        if (this.autofocus === true) {\n            this.inputField.focus();\n        }\n\n        overrideFocus(this.hostElement);\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    disconnectedCallback() {\n        this.manageClearableResizeObserver();\n    }\n\n    getFormattedValue(value: string, valueChangedFromProperty: boolean): IFormatterValueObject {\n        const formattingFunctions = {\n            currency: formatCurrency,\n            phone: formatPhoneNumber,\n            ssn: formatSSN,\n            tin: formatTIN,\n            alphanumeric: formatAlphanumeric,\n            alpha: formatAlpha,\n            numeric: formatNumeric,\n            percentage: formatPercentage,\n            postal: formatPostalCode,\n            date: formatDate,\n            'credit-card': formatCreditCard.format,\n        };\n\n        if (formattingFunctions[this.type]) {\n            return formattingFunctions[this.type](value, this.formatModifier, valueChangedFromProperty);\n        }\n\n        return {\n            value,\n            formattedValue: value,\n            fullyFormattedValue: value,\n            formattingCharacterCount: 0,\n            unformattedValue: value,\n        };\n    }\n\n    @Element() hostElement: HTMLElement;\n\n    get canClear() {\n        return this.clearable && !!(this.inputField?.value ?? this.value);\n    }\n\n    get shouldCursorStayAtEnd() {\n        return this.isMobile && this.type === 'currency';\n    }\n\n    get hasError() {\n        return Array.isArray(this.errors) && this.errors.length > 0;\n    }\n\n    get messages(): string[] {\n        return (\n            (this.errors && this.errors.length > 0 && this.errors) ||\n            (this.hints && this.hints.length > 0 && this.hints) ||\n            []\n        );\n    }\n\n    get inputField() {\n        return this.hostElement.shadowRoot.querySelector<HTMLInputElement>('.input-field');\n    }\n\n    get showMessages() {\n        return this.messages.length > 0 && !this.hideMessages;\n    }\n\n    guid = createGuid();\n\n    get inputId() {\n        return `input-guid-${this.guid}`;\n    }\n\n    get inputDescribedBy() {\n        return this.showMessages ? `${this.inputId}-description` : undefined;\n    }\n\n    get isMaskedType(): boolean {\n        const maskedTypes: string[] = [\n            'currency',\n            'phone',\n            'ssn',\n            'tin',\n            'alphanumeric',\n            'alpha',\n            'numeric',\n            'percentage',\n            'postal',\n            'date',\n            'credit-card',\n        ];\n\n        return maskedTypes.includes(this.type);\n    }\n\n    get wrapperClasses() {\n        const classNames = ['field-container'];\n        if (this.hasError) classNames.push('has-error');\n        if (!!this.value) classNames.push('has-value');\n        if (this.clearable && !!this.value) classNames.push('has-clear');\n        if (this.hasFocus) classNames.push('has-focus');\n        if (this.isSmall) classNames.push('is-small');\n        if (this.formattedValueObject.prefix) classNames.push('has-prefix');\n        if (this.computedIconLeft) classNames.push('has-icon-left');\n        if (this.showIconSeparator) classNames.push('has-icon-separator');\n        if (this.formattedValueObject.suffix) classNames.push('has-suffix');\n        if (!this.formattedValueObject.suffix && this.iconRight) classNames.push('has-icon-right');\n        if (this.type === 'currency') classNames.push('right-aligned');\n        else classNames.push('left-aligned');\n        if (this.hasCustomDisplaySlot) classNames.push('has-custom-display');\n\n        return classNames.join(' ');\n    }\n\n    get computedType() {\n        if (['password', 'text', 'ssn'].includes(this.type) && this.textHidden) {\n            return 'password';\n        } else {\n            return (this.type && inputTypeMap[this.type]) || 'text';\n        }\n    }\n\n    get computedAutocomplete() {\n        // force off for currency type\n        if (this.type === 'currency') return 'transaction-amount';\n        return this.autocomplete || 'off';\n    }\n\n    get computedIconLeft(): string | undefined {\n        if (this.formattedValueObject.prefix) {\n            return;\n        }\n\n        if (this.type === 'search') {\n            return 'search';\n        }\n\n        if (this.formattedValueObject.leftIcon) {\n            return this.formattedValueObject.leftIcon;\n        }\n\n        return this.iconLeft;\n    }\n\n    get showIconSeparator(): boolean {\n        return this.type === 'credit-card' || !!this.formattedValueObject.prefix;\n    }\n\n    get computedClassForIconLeft(): string | undefined {\n        let className = 'icon-left';\n        if (this.formattedValueObject.leftIconMuted) {\n            className += ' icon-left-muted';\n        }\n        return className;\n    }\n\n    get stringValue(): string {\n        return (this.value && String(this.value)) || '';\n    }\n\n    get canSetSelection(): boolean {\n        // email and number type don't support setSelectionRange\n        return !['email', 'number'].includes(this.computedType);\n    }\n\n    get visibilityToggleText(): string {\n        return loc(`tecton.element.input.toggle.${this.textHidden ? 'show' : 'hide'}`);\n    }\n\n    formatAndUpdateValueFromProp() {\n        this.formattedValueObject = this.getFormattedValue(this.stringValue, true);\n\n        if (!this.pseudo) {\n            const setValue = () => {\n                this.inputField.value = this.formattedValueObject.formattedValue;\n            };\n\n            this.inputField ? setValue() : this.scheduledAfterRender.push(() => setValue());\n        }\n    }\n\n    get inputMode() {\n        const inputModeMap = {\n            currency: 'numeric',\n            ssn: 'numeric',\n            tin: 'numeric',\n            numeric: 'decimal',\n            percentage: 'decimal',\n            postal: 'numeric',\n            date: 'numeric',\n            'credit-card': 'numeric',\n        };\n\n        return (this.type && inputModeMap[this.type]) || undefined;\n    }\n\n    //////// OBSERVERS //////////\n\n    @Watch('clearable')\n    manageClearableResizeObserver(clearable?: boolean) {\n        const isSmallThreshold = 190;\n        if (clearable) {\n            if (this.resizeObserver) return;\n            this.resizeObserver = new ResizeObserver(([entry]) => {\n                this.isSmall = isSmallThreshold > entry.contentRect.width;\n            });\n            this.resizeObserver.observe(this.hostElement);\n        } else {\n            this.isSmall = false;\n            this.resizeObserver?.unobserve(this.hostElement);\n            this.resizeObserver = null;\n        }\n    }\n\n    @Watch('ariaLabel')\n    ariaLabelObserver() {\n        handleAriaLabel(this);\n    }\n\n    @Watch('value')\n    valueObserver() {\n        this.formatAndUpdateValueFromProp();\n    }\n\n    @Watch('formattedValueObject')\n    formattedValueObjectObserver() {\n        this.formatted.emit(this.formattedValueObject);\n    }\n\n    @Watch('type')\n    typeObserver() {\n        this.formatAndUpdateValueFromProp();\n    }\n\n    @Watch('formatModifier')\n    formatModifierObserver() {\n        this.formatAndUpdateValueFromProp();\n    }\n\n    @Watch('hints')\n    hintsObserver() {\n        this.hasFocus && this.scheduledAfterRender.push(() => setMessageHeight(this));\n    }\n\n    @Watch('errors')\n    errorsObserver() {\n        this.hasFocus && this.scheduledAfterRender.push(() => setMessageHeight(this));\n    }\n\n    ///////// HOST ELEMENT EVENTS //////\n    @Listen('focus')\n    onHostElementFocus(event) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.inputField.focus();\n    }\n\n    @Listen('change')\n    onHostElementChange(event: CustomEvent) {\n        if (event.target === this.hostElement && !this.hostElement.onchange) {\n            this.value = event.detail.value;\n        }\n    }\n\n    ///////// Events /////////\n\n    @Event() input: EventEmitter<IEventDetail>;\n    @Event() change: EventEmitter<IEventDetail>;\n    @Event() clear: EventEmitter<IEventDetail>;\n    @Event() formatted: EventEmitter<IEventDetail>;\n\n    ///// ACTIONS ////////\n\n    onToggleVisibility = () => {\n        this.hostElement.dispatchEvent(new FocusEvent('focus'));\n        this.textHidden = !this.textHidden;\n    };\n\n    onInputClick = () => {\n        if (this.shouldCursorStayAtEnd) this.placeCursorAtEnd();\n    };\n\n    onInputFocus = () => {\n        if (this.inputField.tagName === 'INPUT') {\n            this.scheduledAfterRender.push(() =>\n                this.shouldCursorStayAtEnd\n                    ? this.placeCursorAtEnd()\n                    : this.setCursorPosition(this.calculateCursorPositionOnFocus())\n            );\n        }\n        this.hasFocus = true;\n        setMessageHeight(this);\n        this.valueOnFocus = this.value;\n    };\n\n    onInputBlur = () => {\n        this.hasFocus = false;\n        setMessageHeight(this);\n        if (this.valueOnFocus !== this.formattedValueObject.value) {\n            this.valueOnFocus = this.formattedValueObject.value;\n            this.change.emit({\n                value: this.formattedValueObject.value,\n                formattedValue: this.formattedValueObject.fullyFormattedValue,\n                minFormattedLength: this.formattedValueObject.minFormattedLength,\n                ...(this.formattedValueObject.type && { type: this.formattedValueObject.type }),\n            });\n        }\n    };\n\n    onInputInput = (event: InputEvent) => {\n        event.stopPropagation();\n        const newFormattedValue = this.getFormattedValue((event.target as HTMLInputElement).value, false);\n        this.handleDataInput(newFormattedValue);\n    };\n\n    onInputPaste = (event: ClipboardEvent) => {\n        if (this.type === 'currency') {\n            const clipboardData = event.clipboardData.getData('text');\n            const newFormattedValue = this.getFormattedValue(clipboardData, true);\n            event.preventDefault();\n            this.handleDataInput(newFormattedValue);\n        }\n    };\n\n    handleDataInput(newFormattedValue: IFormatterValueObject) {\n        if (\n            this.maxlength === undefined ||\n            newFormattedValue.unformattedValue.length <= this.maxlength ||\n            newFormattedValue.unformattedValue.length <= this.formattedValueObject.unformattedValue.length\n        ) {\n            this.formattedValueObject = newFormattedValue;\n        } else if (this.maxlength) {\n            newFormattedValue = this.getFormattedValue(\n                newFormattedValue.unformattedValue.substring(0, this.maxlength),\n                false\n            );\n            this.formattedValueObject = newFormattedValue;\n        }\n        this.handleValueAndCursor();\n    }\n\n    handleValueAndCursor = () => {\n        // ORDER IMPORTANT:  calculate cursor position -> set value -> set cursor position\n        const cursorPosition = this.calculateCursorPositionOnInput();\n        // when type=number: returns only valid decimal on input event, should not update itself (e.g. typing \"1.\" )\n        if (this.type !== 'number') this.inputField.value = this.formattedValueObject.formattedValue;\n        this.input.emit({\n            value: this.formattedValueObject.value,\n            formattedValue: this.formattedValueObject.fullyFormattedValue,\n            minFormattedLength: this.formattedValueObject.minFormattedLength,\n            ...(this.formattedValueObject.type && { type: this.formattedValueObject.type }),\n        });\n        if (!this.formattedValueObject.value) {\n            this.clear.emit();\n        }\n        this.setCursorPosition(cursorPosition);\n    };\n\n    onInputKeydown = (event: KeyboardEvent) => {\n        const keysThatMoveCursor = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End'];\n        const { key } = event;\n        if (this.shouldCursorStayAtEnd && keysThatMoveCursor.includes(key)) event.preventDefault();\n        if (key === 'Enter' && this.valueOnFocus !== this.formattedValueObject.value) {\n            this.valueOnFocus = this.formattedValueObject.value;\n            this.change.emit({\n                value: this.formattedValueObject.value,\n                formattedValue: this.formattedValueObject.fullyFormattedValue,\n                minFormattedLength: this.formattedValueObject.minFormattedLength,\n                ...(this.formattedValueObject.type && { type: this.formattedValueObject.type }),\n            });\n        }\n    };\n\n    onClearInput = () => {\n        const eventDetail = {\n            value: '',\n            formattedValue: '',\n            minFormattedLength: this.formattedValueObject.minFormattedLength,\n        };\n        this.input.emit(eventDetail);\n        this.change.emit(eventDetail);\n        this.clear.emit();\n        this.inputField.focus();\n    };\n    /////// VIEW METHODS ///////\n\n    render() {\n        return (\n            <div class={this.wrapperClasses}>\n                {labelDOM(this)}\n                {this.inputContainerDOM()}\n                {messagesDOM(this)}\n            </div>\n        );\n    }\n\n    get hasCustomDisplaySlot() {\n        return !!this.hostElement.querySelector('[slot=custom-display]');\n    }\n\n    /* tslint:disable:cyclomatic-complexity */\n    inputContainerDOM() {\n        return (\n            <div\n                class=\"input-container\"\n                tabindex={-1}\n                test-id=\"inputContainer\"\n            >\n                <div class=\"input-icons-container-left\">\n                    {this.formattedValueObject.prefix && (\n                        <div class=\"input-prefix\">{this.formattedValueObject.prefix}</div>\n                    )}\n                    {this.computedIconLeft && (\n                        <div>\n                            <q2-icon\n                                type={this.computedIconLeft}\n                                class={this.computedClassForIconLeft}\n                            />\n                        </div>\n                    )}\n                    <slot name=\"input-left\" />\n                    {this.showIconSeparator && <div class=\"vertical-separator\" />}\n                    {this.hasError && this.type === 'currency' && (\n                        <div>\n                            <q2-icon\n                                type=\"error\"\n                                class=\"icon-error\"\n                                test-id=\"iconError\"\n                            />\n                        </div>\n                    )}\n                </div>\n                {this.pseudo ? this.pseudoInputDOM() : this.standardInputDOM()}\n                <div class=\"input-icons-container-right\">\n                    {this.canClear && (\n                        <q2-btn\n                            class=\"btn-clear\"\n                            ariaLabel={loc('tecton.element.input.clear', [this.label])}\n                            test-id=\"clearButton\"\n                            onClick={this.onClearInput}\n                        >\n                            <q2-icon\n                                type=\"close\"\n                                class=\"icon-clear\"\n                            />\n                        </q2-btn>\n                    )}\n                    {['password', 'text', 'ssn', 'tin'].includes(this.type) && this.showVisibilityToggle && (\n                        <q2-btn\n                            class=\"btn-visibility-toggle\"\n                            test-id=\"toggleVisibilityButton\"\n                            onClick={this.onToggleVisibility}\n                        >\n                            {this.visibilityToggleText}\n                        </q2-btn>\n                    )}\n                    {this.formattedValueObject.suffix && (\n                        <span class=\"input-suffix\">{this.formattedValueObject.suffix}</span>\n                    )}\n                    {this.badgeValue && (\n                        <q2-badge\n                            size=\"large\"\n                            theme={this.badgeTheme}\n                        >\n                            {this.badgeValue}\n                        </q2-badge>\n                    )}\n                    {this.hasError && this.type !== 'currency' && (\n                        <div>\n                            <q2-icon\n                                type=\"error\"\n                                class=\"icon-error\"\n                                test-id=\"iconError\"\n                            />\n                        </div>\n                    )}\n                    {this.iconRight && !this.formattedValueObject.suffix && (\n                        <div>\n                            <q2-icon\n                                type={this.iconRight}\n                                class=\"icon-right\"\n                            />\n                        </div>\n                    )}\n                    <slot name=\"input-right\" />\n                </div>\n            </div>\n        );\n    }\n    /* tslint:enable:cyclomatic-complexity */\n\n    /* tslint:disable:cyclomatic-complexity */\n    standardInputDOM() {\n        const { hasCustomDisplaySlot } = this;\n        const inputClasses = ['input-field'];\n        if (hasCustomDisplaySlot) inputClasses.push('sr');\n        return (\n            <Fragment>\n                {hasCustomDisplaySlot && (\n                    <div class=\"custom-display-container\">\n                        <slot name=\"custom-display\"></slot>\n                    </div>\n                )}\n                <input\n                    class={inputClasses.join(' ')}\n                    id={this.inputId}\n                    type={this.computedType}\n                    size={this.formattedValueObject.prefix ? 10 : undefined}\n                    max={this.max}\n                    min={this.min}\n                    step={this.step}\n                    aria-current={this.current || undefined}\n                    aria-describedby={this.inputDescribedBy}\n                    aria-required={`${!this.optional}`}\n                    aria-invalid={`${this.hasError}`}\n                    aria-controls={(this.ariaControls && `${this.ariaControls}`) || undefined}\n                    aria-owns={(this.ariaOwns && `${this.ariaOwns}`) || undefined}\n                    aria-haspopup={(this.ariaHaspopup && `${this.ariaHaspopup}`) || undefined}\n                    aria-expanded={(!!this.ariaExpanded && `${!!this.ariaExpanded}`) || undefined}\n                    aria-activedescendant={this.ariaActivedescendant && `${this.ariaActivedescendant}`}\n                    aria-label={this.hideLabel && this.label ? loc(this.label) : undefined}\n                    autocomplete={this.computedAutocomplete}\n                    autocapitalize={this.autocapitalize}\n                    autocorrect={this.autocorrect === 'on' ? 'on' : 'off'}\n                    autofocus={this.autofocus}\n                    placeholder={(this.placeholder && loc(this.placeholder)) || undefined}\n                    role={(this.role && `${this.role}`) || undefined}\n                    test-id=\"inputField\"\n                    readonly={!!this.readonly}\n                    disabled={!!this.disabled}\n                    onFocus={this.onInputFocus}\n                    onBlur={this.onInputBlur}\n                    onClick={this.onInputClick}\n                    onKeyDown={this.onInputKeydown}\n                    onInput={this.onInputInput}\n                    onPaste={this.onInputPaste}\n                    inputmode={this.inputMode}\n                />\n            </Fragment>\n        );\n    }\n    /* tslint:enable:cyclomatic-complexity */\n\n    pseudoInputDOM() {\n        const showPlaceholder = !this.value && !!this.placeholder;\n        let ariaLabelSuffix = '';\n        if (this.optional) {\n            ariaLabelSuffix = loc('tecton.element.input.optional');\n        }\n        if (this.readonly) {\n            ariaLabelSuffix = loc('tecton.element.input.readonly');\n        }\n\n        return (\n            <div class=\"pseudo-input-container\">\n                <button\n                    class=\"input-field\"\n                    type=\"button\"\n                    id={this.inputId}\n                    aria-describedby={this.inputDescribedBy}\n                    aria-invalid={`${this.hasError}`}\n                    aria-controls={(this.ariaControls && `${this.ariaControls}`) || undefined}\n                    aria-owns={(this.ariaOwns && `${this.ariaOwns}`) || undefined}\n                    aria-haspopup={(this.ariaHaspopup && `${this.ariaHaspopup}`) || undefined}\n                    aria-expanded={this.ariaExpanded === 'true' ? 'true' : undefined}\n                    aria-activedescendant={this.ariaActivedescendant && `${this.ariaActivedescendant}`}\n                    aria-label={`${this.value}, ${(this.label && loc(this.label)) || ''}${ariaLabelSuffix}`}\n                    role={(this.role && `${this.role}`) || undefined}\n                    disabled={!!this.disabled}\n                    test-id=\"q2InputInnerClearButton\"\n                    onFocus={this.onInputFocus}\n                    onBlur={this.onInputBlur}\n                >\n                    <div class=\"custom-display-container\">\n                        <slot name=\"custom-display\">\n                            <span class={showPlaceholder ? 'placeholder-text' : ''}>\n                                {showPlaceholder ? this.placeholder : this.value}\n                            </span>\n                        </slot>\n                    </div>\n                </button>\n            </div>\n        );\n    }\n\n    placeCursorAtEnd() {\n        const { inputField } = this;\n        inputField.selectionStart = inputField.selectionEnd = inputField.value.length;\n    }\n\n    calculateCursorPositionOnInput(): ICursorData {\n        const input = this.inputField;\n        const formattedLength = this.formattedValueObject.formattedValue.length;\n        const currentValueLength = input.value.length;\n        const defaultPosition = this.type === 'currency' ? formattedLength : 0;\n        return {\n            startingPosition: (input && input.selectionStart) || defaultPosition,\n            valueLength: formattedLength,\n            previousValueLength: input && currentValueLength,\n            hasSelection: false,\n        };\n    }\n\n    calculateCursorPositionOnFocus(): ICursorData {\n        const { inputField } = this;\n        const valueLength = inputField?.value?.length ?? 0;\n        const startingPosition = inputField?.selectionStart ?? valueLength;\n\n        return {\n            startingPosition,\n            valueLength,\n            previousValueLength: valueLength,\n            hasSelection: getSelection().toString().length > 0,\n        };\n    }\n\n    setCursorPosition(cursorData: ICursorData) {\n        if (this.canSetSelection && !cursorData.hasSelection) {\n            const input = this.inputField;\n            const { valueLength, previousValueLength, startingPosition } = cursorData;\n            if (startingPosition === valueLength && valueLength >= previousValueLength && this.type === 'currency') {\n                input.setSelectionRange(valueLength, valueLength);\n            } else {\n                const difference = valueLength - previousValueLength;\n                // Never allow the cursor to move in reverse\n                const newPosition = startingPosition + (difference > 0 ? difference : 0);\n                input.setSelectionRange(newPosition, newPosition);\n            }\n        }\n    }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-input/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n    Component,\n    Prop,\n    Element,\n    State,\n    Event,\n    EventEmitter,\n    h,\n    Watch,\n    Listen,\n    Fragment,\n    Method,\n} from '@stencil/core';\nimport {\n    createGuid,\n    labelDOM,\n    loc,\n    messagesDOM,\n    setMessageHeight,\n    handleAriaLabel,\n    overrideFocus,\n    isEventFromElement,\n    isMobile,\n} from 'src/utils';\nimport { IFormatterValueObject, ICursorData, IEventDetail } from './types';\nimport formatCurrency from './formatting/currency';\nimport formatPhoneNumber from './formatting/phone';\nimport formatSSN from './formatting/ssn';\nimport formatTIN from './formatting/tin';\nimport formatAlphanumeric from './formatting/alphanumeric';\nimport formatAlpha from './formatting/alpha';\nimport formatNumeric, { formatPercentage } from './formatting/numeric';\nimport formatPostalCode from './formatting/postal';\nimport formatDate from './formatting/date';\nimport formatCreditCard from './formatting/credit-card';\nimport { Q2Icon } from '../q2-icon';\nimport { Q2Badge } from '../q2-badge';\n\nconst inputTypeMap = {\n    text: 'text',\n    tel: 'tel',\n    number: 'number',\n    password: 'text',\n    search: 'search',\n    url: 'url',\n    email: 'email',\n    currency: 'text',\n    phone: 'tel',\n    ssn: 'text',\n    alphanumeric: 'text',\n    alpha: 'text',\n    numeric: 'text',\n    percentage: 'text',\n    postal: 'text',\n    date: 'text',\n    'credit-card': 'text',\n};\n\nexport type InputType = keyof typeof inputTypeMap;\n\n@Component({\n    tag: 'q2-input',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Input {\n    @Prop({ mutable: true }) value: string;\n    @Prop({ reflect: true, mutable: true }) label: string;\n    @Prop({ reflect: true, mutable: true }) hideLabel: boolean;\n    @Prop({ reflect: true }) type: InputType = 'text';\n    @Prop({ reflect: true }) placeholder: string;\n    @Prop({ reflect: true }) disabled: boolean = false;\n    @Prop({ reflect: true }) autocomplete: string;\n    @Prop({ reflect: true }) autocorrect: 'on' | 'off';\n    @Prop({ reflect: true }) autocapitalize: string;\n    @Prop({ reflect: true }) autofocus: boolean;\n    @Prop({ reflect: true }) hideMessages: boolean;\n    @Prop({ reflect: true }) iconLeft: Q2Icon['type'];\n    @Prop({ reflect: true }) iconRight: Q2Icon['type'];\n    @Prop({ reflect: true }) readonly: boolean;\n    @Prop({ reflect: true }) clearable: boolean;\n    @Prop({ reflect: true }) optional: boolean;\n    @Prop({ reflect: true }) min: number;\n    @Prop({ reflect: true }) max: number;\n    @Prop({ reflect: true }) step: number;\n    @Prop({ reflect: true }) formatModifier: string;\n    @Prop({ reflect: true, mutable: true }) maxlength: number;\n    @Prop({ reflect: true }) pseudo: boolean;\n    @Prop({ reflect: true }) showVisibilityToggle: boolean = false;\n    @Prop({ reflect: true, mutable: true }) textHidden: boolean;\n    @Prop({ reflect: true }) badgeValue: string;\n    @Prop({ reflect: true }) badgeTheme: Q2Badge['theme'];\n    @Prop() role: string;\n    @Prop() ariaControls: string;\n    @Prop() ariaOwns: string;\n    @Prop() ariaHaspopup: string;\n    @Prop() ariaExpanded: string;\n    @Prop() ariaActivedescendant: string;\n    @Prop() current: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false';\n\n    /** @deprecated */\n    @Prop({ reflect: true, mutable: true }) ariaLabel: string;\n\n    @Prop() errors: string[];\n    @Prop() hints: string[];\n\n    @State() formattedValueObject: IFormatterValueObject;\n    @State() hasFocus: boolean;\n    @State() isSmall: boolean = false;\n\n    resizeObserver: ResizeObserver;\n    scheduledAfterRender: (() => void)[] = [];\n    valueOnFocus: string;\n    isMobile: boolean = isMobile();\n\n    /////// LIFECYCLE HOOKS ////////\n\n    componentWillLoad() {\n        if (isNaN(this.maxlength)) {\n            this.maxlength = undefined;\n        }\n        this.formattedValueObject = this.getFormattedValue(this.stringValue, true);\n\n        Object.defineProperty(this.hostElement, 'formattedValue', {\n            get: () => this.formattedValueObject?.formattedValue ?? '',\n        });\n\n        handleAriaLabel(this);\n        if (this.textHidden === undefined) {\n            this.textHidden = this.type === 'password';\n        }\n\n        this.manageClearableResizeObserver(this.clearable);\n    }\n\n    componentDidLoad() {\n        if (!this.pseudo) {\n            this.inputField.value = this.formattedValueObject.formattedValue;\n        }\n\n        if (this.autofocus === true) {\n            this.inputField.focus();\n        }\n\n        overrideFocus(this.hostElement);\n    }\n\n    componentDidRender() {\n        this.scheduledAfterRender.forEach(fn => fn());\n        this.scheduledAfterRender = [];\n    }\n\n    disconnectedCallback() {\n        this.manageClearableResizeObserver();\n    }\n\n    getFormattedValue(value: string, valueChangedFromProperty: boolean): IFormatterValueObject {\n        const formattingFunctions = {\n            currency: formatCurrency,\n            phone: formatPhoneNumber,\n            ssn: formatSSN,\n            tin: formatTIN,\n            alphanumeric: formatAlphanumeric,\n            alpha: formatAlpha,\n            numeric: formatNumeric,\n            percentage: formatPercentage,\n            postal: formatPostalCode,\n            date: formatDate,\n            'credit-card': formatCreditCard.format,\n        };\n\n        if (formattingFunctions[this.type]) {\n            return formattingFunctions[this.type](value, this.formatModifier, valueChangedFromProperty);\n        }\n\n        return {\n            value,\n            formattedValue: value,\n            fullyFormattedValue: value,\n            formattingCharacterCount: 0,\n            unformattedValue: value,\n        };\n    }\n\n    @Element() hostElement: HTMLElement;\n\n    get canClear() {\n        return this.clearable && !!(this.inputField?.value ?? this.value);\n    }\n\n    get shouldCursorStayAtEnd() {\n        return this.isMobile && this.type === 'currency';\n    }\n\n    get hasError() {\n        return Array.isArray(this.errors) && this.errors.length > 0;\n    }\n\n    get messages(): string[] {\n        return (\n            (this.errors && this.errors.length > 0 && this.errors) ||\n            (this.hints && this.hints.length > 0 && this.hints) ||\n            []\n        );\n    }\n\n    get inputField() {\n        return this.hostElement.shadowRoot.querySelector<HTMLInputElement>('.input-field');\n    }\n\n    get showMessages() {\n        return this.messages.length > 0 && !this.hideMessages;\n    }\n\n    guid = createGuid();\n\n    get inputId() {\n        return `input-guid-${this.guid}`;\n    }\n\n    get inputDescribedBy() {\n        return this.showMessages ? `${this.inputId}-description` : undefined;\n    }\n\n    get isMaskedType(): boolean {\n        const maskedTypes: string[] = [\n            'currency',\n            'phone',\n            'ssn',\n            'tin',\n            'alphanumeric',\n            'alpha',\n            'numeric',\n            'percentage',\n            'postal',\n            'date',\n            'credit-card',\n        ];\n\n        return maskedTypes.includes(this.type);\n    }\n\n    get wrapperClasses() {\n        const classNames = ['field-container'];\n        if (this.hasError) classNames.push('has-error');\n        if (!!this.value) classNames.push('has-value');\n        if (this.clearable && !!this.value) classNames.push('has-clear');\n        if (this.hasFocus) classNames.push('has-focus');\n        if (this.isSmall) classNames.push('is-small');\n        if (this.formattedValueObject.prefix) classNames.push('has-prefix');\n        if (this.computedIconLeft) classNames.push('has-icon-left');\n        if (this.showIconSeparator) classNames.push('has-icon-separator');\n        if (this.formattedValueObject.suffix) classNames.push('has-suffix');\n        if (!this.formattedValueObject.suffix && this.iconRight) classNames.push('has-icon-right');\n        if (this.type === 'currency') classNames.push('right-aligned');\n        else classNames.push('left-aligned');\n        if (this.hasCustomDisplaySlot) classNames.push('has-custom-display');\n\n        return classNames.join(' ');\n    }\n\n    get computedType() {\n        if (['password', 'text', 'ssn'].includes(this.type) && this.textHidden) {\n            return 'password';\n        } else {\n            return (this.type && inputTypeMap[this.type]) || 'text';\n        }\n    }\n\n    get computedAutocomplete() {\n        // force off for currency type\n        if (this.type === 'currency') return 'transaction-amount';\n        return this.autocomplete || 'off';\n    }\n\n    get computedIconLeft(): string | undefined {\n        if (this.formattedValueObject.prefix) {\n            return;\n        }\n\n        if (this.type === 'search') {\n            return 'search';\n        }\n\n        if (this.formattedValueObject.leftIcon) {\n            return this.formattedValueObject.leftIcon;\n        }\n\n        return this.iconLeft;\n    }\n\n    get showIconSeparator(): boolean {\n        return this.type === 'credit-card' || !!this.formattedValueObject.prefix;\n    }\n\n    get computedClassForIconLeft(): string | undefined {\n        let className = 'icon-left';\n        if (this.formattedValueObject.leftIconMuted) {\n            className += ' icon-left-muted';\n        }\n        return className;\n    }\n\n    get stringValue(): string {\n        return (this.value && String(this.value)) || '';\n    }\n\n    get canSetSelection(): boolean {\n        // email and number type don't support setSelectionRange\n        return !['email', 'number'].includes(this.computedType);\n    }\n\n    get visibilityToggleText(): string {\n        return loc(`tecton.element.input.toggle.${this.textHidden ? 'show' : 'hide'}`);\n    }\n\n    formatAndUpdateValueFromProp() {\n        this.formattedValueObject = this.getFormattedValue(this.stringValue, true);\n\n        if (!this.pseudo) {\n            const setValue = () => {\n                this.inputField.value = this.formattedValueObject.formattedValue;\n            };\n\n            this.inputField ? setValue() : this.scheduledAfterRender.push(() => setValue());\n        }\n    }\n\n    get inputMode() {\n        const inputModeMap = {\n            currency: 'numeric',\n            ssn: 'numeric',\n            tin: 'numeric',\n            numeric: 'decimal',\n            percentage: 'decimal',\n            postal: 'numeric',\n            date: 'numeric',\n            'credit-card': 'numeric',\n        };\n\n        return (this.type && inputModeMap[this.type]) || undefined;\n    }\n\n    //////// OBSERVERS //////////\n\n    @Watch('clearable')\n    manageClearableResizeObserver(clearable?: boolean) {\n        const isSmallThreshold = 190;\n        if (clearable) {\n            if (this.resizeObserver) return;\n            this.resizeObserver = new ResizeObserver(([entry]) => {\n                this.isSmall = isSmallThreshold > entry.contentRect.width;\n            });\n            this.resizeObserver.observe(this.hostElement);\n        } else {\n            this.isSmall = false;\n            this.resizeObserver?.unobserve(this.hostElement);\n            this.resizeObserver = null;\n        }\n    }\n\n    @Watch('ariaLabel')\n    ariaLabelObserver() {\n        handleAriaLabel(this);\n    }\n\n    @Watch('value')\n    valueObserver() {\n        this.formatAndUpdateValueFromProp();\n    }\n\n    @Watch('formattedValueObject')\n    formattedValueObjectObserver() {\n        this.formatted.emit(this.formattedValueObject);\n    }\n\n    @Watch('type')\n    typeObserver() {\n        this.formatAndUpdateValueFromProp();\n    }\n\n    @Watch('formatModifier')\n    formatModifierObserver() {\n        this.formatAndUpdateValueFromProp();\n    }\n\n    @Watch('hints')\n    hintsObserver() {\n        this.hasFocus && this.scheduledAfterRender.push(() => setMessageHeight(this));\n    }\n\n    @Watch('errors')\n    errorsObserver() {\n        this.hasFocus && this.scheduledAfterRender.push(() => setMessageHeight(this));\n    }\n\n    /// Methods ///\n    @Method()\n    setValue(value: string) {\n        const { inputField } = this;\n        inputField.focus();\n        inputField.dispatchEvent(new FocusEvent('focus'));\n        inputField.value = value;\n        inputField.dispatchEvent(new InputEvent('input'));\n    }\n\n    @Method()\n    clearValue() {\n        if (!this.clearable) return;\n        this.onClearInput();\n    }\n\n    ///////// HOST ELEMENT EVENTS //////\n    @Listen('focus')\n    onHostElementFocus(event) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.inputField.focus();\n    }\n\n    @Listen('change')\n    onHostElementChange(event: CustomEvent) {\n        event.stopPropagation();\n        if (event.target === this.hostElement && !this.hostElement.onchange) {\n            this.value = event.detail.value;\n        }\n    }\n\n    ///////// Events /////////\n\n    @Event() input: EventEmitter<IEventDetail>;\n    @Event() change: EventEmitter<IEventDetail>;\n    @Event() clear: EventEmitter<IEventDetail>;\n    @Event() formatted: EventEmitter<IEventDetail>;\n\n    ///// ACTIONS ////////\n\n    onToggleVisibility = () => {\n        this.hostElement.dispatchEvent(new FocusEvent('focus'));\n        this.textHidden = !this.textHidden;\n    };\n\n    onInputClick = () => {\n        if (this.shouldCursorStayAtEnd) this.placeCursorAtEnd();\n    };\n\n    onInputFocus = () => {\n        if (this.inputField.tagName === 'INPUT') {\n            this.scheduledAfterRender.push(() =>\n                this.shouldCursorStayAtEnd\n                    ? this.placeCursorAtEnd()\n                    : this.setCursorPosition(this.calculateCursorPositionOnFocus())\n            );\n        }\n        this.hasFocus = true;\n        setMessageHeight(this);\n        this.valueOnFocus = this.value;\n    };\n\n    onInputBlur = () => {\n        this.hasFocus = false;\n        setMessageHeight(this);\n        if (this.valueOnFocus !== this.formattedValueObject.value) {\n            this.valueOnFocus = this.formattedValueObject.value;\n            this.change.emit({\n                value: this.formattedValueObject.value,\n                formattedValue: this.formattedValueObject.fullyFormattedValue,\n                minFormattedLength: this.formattedValueObject.minFormattedLength,\n                ...(this.formattedValueObject.type && { type: this.formattedValueObject.type }),\n            });\n        }\n    };\n\n    onInputInput = (event: InputEvent) => {\n        event.stopPropagation();\n        const newFormattedValue = this.getFormattedValue((event.target as HTMLInputElement).value, false);\n        this.handleDataInput(newFormattedValue);\n    };\n\n    onInputPaste = (event: ClipboardEvent) => {\n        if (this.type === 'currency') {\n            const clipboardData = event.clipboardData.getData('text');\n            const newFormattedValue = this.getFormattedValue(clipboardData, true);\n            event.preventDefault();\n            this.handleDataInput(newFormattedValue);\n        }\n    };\n\n    handleDataInput(newFormattedValue: IFormatterValueObject) {\n        if (\n            this.maxlength === undefined ||\n            newFormattedValue.unformattedValue.length <= this.maxlength ||\n            newFormattedValue.unformattedValue.length <= this.formattedValueObject.unformattedValue.length\n        ) {\n            this.formattedValueObject = newFormattedValue;\n        } else if (this.maxlength) {\n            newFormattedValue = this.getFormattedValue(\n                newFormattedValue.unformattedValue.substring(0, this.maxlength),\n                false\n            );\n            this.formattedValueObject = newFormattedValue;\n        }\n        this.handleValueAndCursor();\n    }\n\n    handleValueAndCursor = () => {\n        // ORDER IMPORTANT:  calculate cursor position -> set value -> set cursor position\n        const cursorPosition = this.calculateCursorPositionOnInput();\n        // when type=number: returns only valid decimal on input event, should not update itself (e.g. typing \"1.\" )\n        if (this.type !== 'number') this.inputField.value = this.formattedValueObject.formattedValue;\n        this.input.emit({\n            value: this.formattedValueObject.value,\n            formattedValue: this.formattedValueObject.fullyFormattedValue,\n            minFormattedLength: this.formattedValueObject.minFormattedLength,\n            ...(this.formattedValueObject.type && { type: this.formattedValueObject.type }),\n        });\n        if (!this.formattedValueObject.value) {\n            this.clear.emit();\n        }\n        this.setCursorPosition(cursorPosition);\n    };\n\n    onInputKeydown = (event: KeyboardEvent) => {\n        const keysThatMoveCursor = ['ArrowLeft', 'ArrowRight', 'ArrowUp', 'ArrowDown', 'Home', 'End'];\n        const { key } = event;\n        if (this.shouldCursorStayAtEnd && keysThatMoveCursor.includes(key)) event.preventDefault();\n        if (key === 'Enter' && this.valueOnFocus !== this.formattedValueObject.value) {\n            this.valueOnFocus = this.formattedValueObject.value;\n            this.change.emit({\n                value: this.formattedValueObject.value,\n                formattedValue: this.formattedValueObject.fullyFormattedValue,\n                minFormattedLength: this.formattedValueObject.minFormattedLength,\n                ...(this.formattedValueObject.type && { type: this.formattedValueObject.type }),\n            });\n        }\n    };\n\n    onClearInput = () => {\n        const eventDetail = {\n            value: '',\n            formattedValue: '',\n            minFormattedLength: this.formattedValueObject.minFormattedLength,\n        };\n        this.input.emit(eventDetail);\n        this.change.emit(eventDetail);\n        this.clear.emit();\n        this.inputField.focus();\n    };\n    /////// VIEW METHODS ///////\n\n    render() {\n        return (\n            <div class={this.wrapperClasses}>\n                {labelDOM(this)}\n                {this.inputContainerDOM()}\n                {messagesDOM(this)}\n            </div>\n        );\n    }\n\n    get hasCustomDisplaySlot() {\n        return !!this.hostElement.querySelector('[slot=custom-display]');\n    }\n\n    /* tslint:disable:cyclomatic-complexity */\n    inputContainerDOM() {\n        return (\n            <div\n                class=\"input-container\"\n                tabindex={-1}\n                test-id=\"inputContainer\"\n            >\n                <div class=\"input-icons-container-left\">\n                    {this.formattedValueObject.prefix && (\n                        <div class=\"input-prefix\">{this.formattedValueObject.prefix}</div>\n                    )}\n                    {this.computedIconLeft && (\n                        <div>\n                            <q2-icon\n                                type={this.computedIconLeft}\n                                class={this.computedClassForIconLeft}\n                            />\n                        </div>\n                    )}\n                    <slot name=\"input-left\" />\n                    {this.showIconSeparator && <div class=\"vertical-separator\" />}\n                    {this.hasError && this.type === 'currency' && (\n                        <div>\n                            <q2-icon\n                                type=\"error\"\n                                class=\"icon-error\"\n                                test-id=\"iconError\"\n                            />\n                        </div>\n                    )}\n                </div>\n                {this.pseudo ? this.pseudoInputDOM() : this.standardInputDOM()}\n                <div class=\"input-icons-container-right\">\n                    {this.canClear && (\n                        <q2-btn\n                            class=\"btn-clear\"\n                            ariaLabel={loc('tecton.element.input.clear', [this.label])}\n                            test-id=\"clearButton\"\n                            onClick={this.onClearInput}\n                        >\n                            <q2-icon\n                                type=\"close\"\n                                class=\"icon-clear\"\n                            />\n                        </q2-btn>\n                    )}\n                    {['password', 'text', 'ssn', 'tin'].includes(this.type) && this.showVisibilityToggle && (\n                        <q2-btn\n                            class=\"btn-visibility-toggle\"\n                            test-id=\"toggleVisibilityButton\"\n                            onClick={this.onToggleVisibility}\n                        >\n                            {this.visibilityToggleText}\n                        </q2-btn>\n                    )}\n                    {this.formattedValueObject.suffix && (\n                        <span class=\"input-suffix\">{this.formattedValueObject.suffix}</span>\n                    )}\n                    {this.badgeValue && (\n                        <q2-badge\n                            size=\"large\"\n                            theme={this.badgeTheme}\n                        >\n                            {this.badgeValue}\n                        </q2-badge>\n                    )}\n                    {this.hasError && this.type !== 'currency' && (\n                        <div>\n                            <q2-icon\n                                type=\"error\"\n                                class=\"icon-error\"\n                                test-id=\"iconError\"\n                            />\n                        </div>\n                    )}\n                    {this.iconRight && !this.formattedValueObject.suffix && (\n                        <div>\n                            <q2-icon\n                                type={this.iconRight}\n                                class=\"icon-right\"\n                            />\n                        </div>\n                    )}\n                    <slot name=\"input-right\" />\n                </div>\n            </div>\n        );\n    }\n    /* tslint:enable:cyclomatic-complexity */\n\n    /* tslint:disable:cyclomatic-complexity */\n    standardInputDOM() {\n        const { hasCustomDisplaySlot } = this;\n        const inputClasses = ['input-field'];\n        if (hasCustomDisplaySlot) inputClasses.push('sr');\n        return (\n            <Fragment>\n                {hasCustomDisplaySlot && (\n                    <div class=\"custom-display-container\">\n                        <slot name=\"custom-display\"></slot>\n                    </div>\n                )}\n                <input\n                    class={inputClasses.join(' ')}\n                    id={this.inputId}\n                    type={this.computedType}\n                    size={this.formattedValueObject.prefix ? 10 : undefined}\n                    max={this.max}\n                    min={this.min}\n                    step={this.step}\n                    aria-current={this.current || undefined}\n                    aria-describedby={this.inputDescribedBy}\n                    aria-required={`${!this.optional}`}\n                    aria-invalid={`${this.hasError}`}\n                    aria-controls={(this.ariaControls && `${this.ariaControls}`) || undefined}\n                    aria-owns={(this.ariaOwns && `${this.ariaOwns}`) || undefined}\n                    aria-haspopup={(this.ariaHaspopup && `${this.ariaHaspopup}`) || undefined}\n                    aria-expanded={(!!this.ariaExpanded && `${!!this.ariaExpanded}`) || undefined}\n                    aria-activedescendant={this.ariaActivedescendant && `${this.ariaActivedescendant}`}\n                    autocomplete={this.computedAutocomplete}\n                    autocapitalize={this.autocapitalize}\n                    autocorrect={this.autocorrect === 'on' ? 'on' : 'off'}\n                    autofocus={this.autofocus}\n                    placeholder={(this.placeholder && loc(this.placeholder)) || undefined}\n                    role={(this.role && `${this.role}`) || undefined}\n                    test-id=\"inputField\"\n                    readonly={!!this.readonly}\n                    disabled={!!this.disabled}\n                    onFocus={this.onInputFocus}\n                    onBlur={this.onInputBlur}\n                    onClick={this.onInputClick}\n                    onKeyDown={this.onInputKeydown}\n                    onInput={this.onInputInput}\n                    onPaste={this.onInputPaste}\n                    inputmode={this.inputMode}\n                />\n            </Fragment>\n        );\n    }\n    /* tslint:enable:cyclomatic-complexity */\n\n    pseudoInputDOM() {\n        const showPlaceholder = !this.value && !!this.placeholder;\n        return (\n            <div class=\"pseudo-input-container\">\n                <button\n                    class=\"input-field\"\n                    type=\"button\"\n                    id={this.inputId}\n                    aria-describedby={this.inputDescribedBy}\n                    aria-invalid={`${this.hasError}`}\n                    aria-controls={(this.ariaControls && `${this.ariaControls}`) || undefined}\n                    aria-owns={(this.ariaOwns && `${this.ariaOwns}`) || undefined}\n                    aria-haspopup={(this.ariaHaspopup && `${this.ariaHaspopup}`) || undefined}\n                    aria-expanded={this.ariaExpanded === 'true' ? 'true' : undefined}\n                    aria-activedescendant={this.ariaActivedescendant && `${this.ariaActivedescendant}`}\n                    role={(this.role && `${this.role}`) || undefined}\n                    disabled={!!this.disabled}\n                    test-id=\"q2InputInnerClearButton\"\n                    onFocus={this.onInputFocus}\n                    onBlur={this.onInputBlur}\n                >\n                    <div class=\"custom-display-container\">\n                        <slot name=\"custom-display\">\n                            <span class={showPlaceholder ? 'placeholder-text' : ''}>\n                                {showPlaceholder ? this.placeholder : this.value}\n                            </span>\n                        </slot>\n                    </div>\n                </button>\n            </div>\n        );\n    }\n\n    placeCursorAtEnd() {\n        const { inputField } = this;\n        inputField.selectionStart = inputField.selectionEnd = inputField.value.length;\n    }\n\n    calculateCursorPositionOnInput(): ICursorData {\n        const input = this.inputField;\n        const formattedLength = this.formattedValueObject.formattedValue.length;\n        const currentValueLength = input.value.length;\n        const defaultPosition = this.type === 'currency' ? formattedLength : 0;\n        return {\n            startingPosition: (input && input.selectionStart) || defaultPosition,\n            valueLength: formattedLength,\n            previousValueLength: input && currentValueLength,\n            hasSelection: false,\n        };\n    }\n\n    calculateCursorPositionOnFocus(): ICursorData {\n        const { inputField } = this;\n        const valueLength = inputField?.value?.length ?? 0;\n        const startingPosition = inputField?.selectionStart ?? valueLength;\n\n        return {\n            startingPosition,\n            valueLength,\n            previousValueLength: valueLength,\n            hasSelection: getSelection().toString().length > 0,\n        };\n    }\n\n    setCursorPosition(cursorData: ICursorData) {\n        if (this.canSetSelection && !cursorData.hasSelection) {\n            const input = this.inputField;\n            const { valueLength, previousValueLength, startingPosition } = cursorData;\n            if (startingPosition === valueLength && valueLength >= previousValueLength && this.type === 'currency') {\n                input.setSelectionRange(valueLength, valueLength);\n            } else {\n                const difference = valueLength - previousValueLength;\n                // Never allow the cursor to move in reverse\n                const newPosition = startingPosition + (difference > 0 ? difference : 0);\n                input.setSelectionRange(newPosition, newPosition);\n            }\n        }\n    }\n}\n"]}

package/dist/collection/components/q2-message/index.js

@@ -1,5 +1,5 @@
 import { h } from '@stencil/core';
-import { isEventFromElement, isFirefox as checkIfFirefox, nextPaint, overrideFocus } from 'src/utils';
+import { isEventFromElement, isFirefox as checkIfFirefox, loc, nextPaint, overrideFocus } from 'src/utils';
 export class Q2Message {
   constructor() {
     this.type = 'info';
@@ -32,7 +32,19 @@ export class Q2Message {
     const addAriaHiddenForAriaLive = isFirefox && this.presentToggle;
     const addDivForAriaLive = !isFirefox && this.presentToggle;
     const { description } = this;
-    return (h("div", { tabindex: "-1", class: "message", role: description ? undefined : 'alert', "aria-live": description ? undefined : 'assertive', "aria-atomic": description ? undefined : 'true', "aria-relevant": description ? undefined : 'all', "test-id": "messageContainer" }, this.appearance === 'standard' ? generateIcon(this.type) : '', addDivForAriaLive && h("div", { class: "sr" }), h("div", { class: "message-content", "aria-hidden": addAriaHiddenForAriaLive ? 'true' : undefined }, h("slot", null))));
+    const messageLabel = loc(`tecton.element.message.type.${this.type ? this.type : 'info'}`);
+    return (h("div", { tabindex: "-1", class: "message", role: description ? undefined : 'alert', "aria-live": description ? undefined : 'assertive', "aria-atomic": description ? undefined : 'true', "aria-relevant": description ? undefined : 'all', "test-id": "messageContainer" }, this.appearance === 'standard' ? this.messageIcon(this.type) : '', addDivForAriaLive && h("div", { class: "sr" }), h("div", { class: "sr message-label" }, messageLabel), h("div", { class: "message-content", "aria-hidden": addAriaHiddenForAriaLive ? 'true' : undefined }, h("slot", null))));
+  }
+  messageIcon(type) {
+    const iconMap = {
+      success: 'success',
+      warning: 'warning',
+      danger: 'error',
+      error: 'error',
+      info: 'info',
+    };
+    const iconType = iconMap[type] || iconMap.info;
+    return (h("q2-icon", { type: iconType, class: "message-icon" }));
   }
   static get is() { return "q2-message"; }
   static get encapsulation() { return "shadow"; }
@@ -140,15 +152,4 @@ export class Q2Message {
       }];
   }
 }
-function generateIcon(type) {
-  const iconMap = {
-    success: 'success',
-    warning: 'warning',
-    danger: 'error',
-    error: 'error',
-    info: 'info',
-  };
-  const icon = iconMap[type] || iconMap.info;
-  return (h("q2-icon", { type: icon, class: "message-icon" }));
-}
 //# sourceMappingURL=index.js.map

package/dist/collection/components/q2-message/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-message/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AACnF,OAAO,EAAE,kBAAkB,EAAE,SAAS,IAAI,cAAc,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAOtG,MAAM,OAAO,SAAS;;gBACmE,MAAM;sBAC7B,UAAU;uBACxB,KAAK;;;EAMrD,IAAI,SAAS;IACT,OAAO,cAAc,EAAE,CAAC;EAC5B,CAAC;EAED,gBAAgB;IACZ,aAAa,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC;EACpC,CAAC;EAGD,KAAK,CAAC,OAAO;IACT,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAC;IACzC,IAAI,CAAC,SAAS;MAAE,OAAO;IACvB,SAAS,CAAC,GAAG,EAAE;MACX,IAAI,CAAC,aAAa,GAAG,KAAK,CAAC;IAC/B,CAAC,CAAC,CAAC;EACP,CAAC;EAGD,aAAa,CAAC,KAAiB;IAC3B,IAAI,CAAC,kBAAkB,CAAC,KAAK,EAAE,IAAI,CAAC,WAAW,CAAC;MAAE,OAAO;IACzD,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,aAAa,CAAc,UAAU,CAAC,CAAC,KAAK,EAAE,CAAC;EAC/E,CAAC;EAED,MAAM;IACF,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC;IAC3B,MAAM,wBAAwB,GAAG,SAAS,IAAI,IAAI,CAAC,aAAa,CAAC;IACjE,MAAM,iBAAiB,GAAG,CAAC,SAAS,IAAI,IAAI,CAAC,aAAa,CAAC;IAC3D,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC;IAC7B,OAAO,CACH,WACI,QAAQ,EAAC,IAAI,EACb,KAAK,EAAC,SAAS,EACf,IAAI,EAAE,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,eAC5B,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,iBACnC,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,mBAC9B,WAAW,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,KAAK,aACtC,kBAAkB;MAEzB,IAAI,CAAC,UAAU,KAAK,UAAU,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE;MAC7D,iBAAiB,IAAI,WAAK,KAAK,EAAC,IAAI,GAAO;MAC5C,WACI,KAAK,EAAC,iBAAiB,iBACV,wBAAwB,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;QAE1D,eAAQ,CACN,CACJ,CACT,CAAC;EACN,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACJ;AAED,SAAS,YAAY,CAAC,IAAY;EAC9B,MAAM,OAAO,GAAG;IACZ,OAAO,EAAE,SAAS;IAClB,OAAO,EAAE,SAAS;IAClB,MAAM,EAAE,OAAO;IACf,KAAK,EAAE,OAAO;IACd,IAAI,EAAE,MAAM;GACf,CAAC;EAEF,MAAM,IAAI,GAAW,OAAO,CAAC,IAAI,CAAC,IAAI,OAAO,CAAC,IAAI,CAAC;EAEnD,OAAO,CACH,eACI,IAAI,EAAE,IAAI,EACV,KAAK,EAAC,cAAc,GACtB,CACL,CAAC;AACN,CAAC","sourcesContent":["import { Component, Prop, h, Method, State, Element, Listen } from '@stencil/core';\nimport { isEventFromElement, isFirefox as checkIfFirefox, nextPaint, overrideFocus } from 'src/utils';\n\n@Component({\n    tag: 'q2-message',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Message {\n    @Prop({ reflect: true }) type: 'info' | 'error' | 'danger' | 'warning' | 'success' = 'info';\n    @Prop({ reflect: true }) appearance: 'minimal' | 'standard' = 'standard';\n    @Prop({ reflect: true }) description: boolean = false;\n\n    @Element() hostElement: HTMLElement;\n\n    @State() presentToggle: boolean;\n\n    get isFirefox() {\n        return checkIfFirefox();\n    }\n\n    componentDidLoad(): void {\n        overrideFocus(this.hostElement);\n    }\n\n    @Method()\n    async present() {\n        const { isFirefox } = this;\n        this.presentToggle = !this.presentToggle;\n        if (!isFirefox) return;\n        nextPaint(() => {\n            this.presentToggle = false;\n        });\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.hostElement.shadowRoot.querySelector<HTMLElement>('.message').focus();\n    }\n\n    render() {\n        const { isFirefox } = this;\n        const addAriaHiddenForAriaLive = isFirefox && this.presentToggle;\n        const addDivForAriaLive = !isFirefox && this.presentToggle;\n        const { description } = this;\n        return (\n            <div\n                tabindex=\"-1\"\n                class=\"message\"\n                role={description ? undefined : 'alert'}\n                aria-live={description ? undefined : 'assertive'}\n                aria-atomic={description ? undefined : 'true'}\n                aria-relevant={description ? undefined : 'all'}\n                test-id=\"messageContainer\"\n            >\n                {this.appearance === 'standard' ? generateIcon(this.type) : ''}\n                {addDivForAriaLive && <div class=\"sr\"></div>}\n                <div\n                    class=\"message-content\"\n                    aria-hidden={addAriaHiddenForAriaLive ? 'true' : undefined}\n                >\n                    <slot />\n                </div>\n            </div>\n        );\n    }\n}\n\nfunction generateIcon(type: string) {\n    const iconMap = {\n        success: 'success',\n        warning: 'warning',\n        danger: 'error',\n        error: 'error',\n        info: 'info',\n    };\n\n    const icon: string = iconMap[type] || iconMap.info;\n\n    return (\n        <q2-icon\n            type={icon}\n            class=\"message-icon\"\n        />\n    );\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/q2-message/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Method, State, Element, Listen } from '@stencil/core';\nimport { isEventFromElement, isFirefox as checkIfFirefox, loc, nextPaint, overrideFocus } from 'src/utils';\n\n@Component({\n    tag: 'q2-message',\n    shadow: true,\n    styleUrl: 'styles.scss',\n})\nexport class Q2Message {\n    @Prop({ reflect: true }) type: 'info' | 'error' | 'danger' | 'warning' | 'success' = 'info';\n    @Prop({ reflect: true }) appearance: 'minimal' | 'standard' = 'standard';\n    @Prop({ reflect: true }) description: boolean = false;\n\n    @Element() hostElement: HTMLElement;\n\n    @State() presentToggle: boolean;\n\n    get isFirefox() {\n        return checkIfFirefox();\n    }\n\n    componentDidLoad(): void {\n        overrideFocus(this.hostElement);\n    }\n\n    @Method()\n    async present() {\n        const { isFirefox } = this;\n        this.presentToggle = !this.presentToggle;\n        if (!isFirefox) return;\n        nextPaint(() => {\n            this.presentToggle = false;\n        });\n    }\n\n    @Listen('focus')\n    delegateFocus(event: FocusEvent) {\n        if (!isEventFromElement(event, this.hostElement)) return;\n        this.hostElement.shadowRoot.querySelector<HTMLElement>('.message').focus();\n    }\n\n    render() {\n        const { isFirefox } = this;\n        const addAriaHiddenForAriaLive = isFirefox && this.presentToggle;\n        const addDivForAriaLive = !isFirefox && this.presentToggle;\n        const { description } = this;\n        const messageLabel: string = loc(`tecton.element.message.type.${this.type ? this.type : 'info'}`);\n\n        return (\n            <div\n                tabindex=\"-1\"\n                class=\"message\"\n                role={description ? undefined : 'alert'}\n                aria-live={description ? undefined : 'assertive'}\n                aria-atomic={description ? undefined : 'true'}\n                aria-relevant={description ? undefined : 'all'}\n                test-id=\"messageContainer\"\n            >\n                {this.appearance === 'standard' ? this.messageIcon(this.type) : ''}\n                {addDivForAriaLive && <div class=\"sr\"></div>}\n                <div class=\"sr message-label\">{messageLabel}</div>\n                <div\n                    class=\"message-content\"\n                    aria-hidden={addAriaHiddenForAriaLive ? 'true' : undefined}\n                >\n                    <slot />\n                </div>\n            </div>\n        );\n    }\n\n    messageIcon(type: string) {\n        const iconMap = {\n            success: 'success',\n            warning: 'warning',\n            danger: 'error',\n            error: 'error',\n            info: 'info',\n        };\n\n        const iconType: string = iconMap[type] || iconMap.info;\n\n        return (\n            <q2-icon\n                type={iconType}\n                class=\"message-icon\"\n            />\n        );\n    }\n}\n"]}

package/dist/collection/components/q2-pill/index.js

@@ -147,9 +147,9 @@ export class Q2Pill {
   get buttonContent() {
     const { label, selectedOptions, selectedOptionElements, optionCount } = this;
     if (!optionCount || selectedOptionElements.length === 0)
-      return label;
+      return loc(label);
     else if (selectedOptionElements.length === 1)
-      return selectedOptionElements[0].display;
+      return loc(selectedOptionElements[0].display);
     return loc('tecton.element.pill.activeCount', { count: selectedOptions.length });
   }
   get truncatedButtonContent() {