adp-web-components 0.1.57 → 0.1.59

package/dist/collection/components/form-elements/form-picker-input.js

@@ -0,0 +1,478 @@
+/*!
+ * Built by ShiftSoftware
+ * Copyright (c)
+ */
+import { Host, h } from "@stencil/core";
+import cn from "../../global/lib/cn";
+import { getNestedValue } from "../../global/lib/get-nested-value";
+import { FormInputLabel } from "./components/form-input-label";
+import { FormInputPrefix } from "./components/form-input-prefix";
+import { FormErrorMessage } from "./components/form-error-message";
+import { decodeTimeOffset } from "../../global/lib/decode-time-offset";
+import { format } from "date-fns";
+const partKeyPrefix = 'form-picker-';
+export class FormPickerInput {
+    constructor() {
+        this.inputProps = {};
+        this.type = 'datetime-local';
+        this.iconPosition = 'end';
+        this.prefixWidth = 0;
+        this.updateDisplayValue = () => {
+            var _a;
+            this.displayedValue = ((_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.value) || '';
+            if (this.displayedValue && (this.formatter || this.format)) {
+                if (this.formatter)
+                    this.displayedValue = this.formatter(this.displayedValue);
+                if (this.format)
+                    this.displayedValue = format(new Date(this.displayedValue), this.format);
+                this.form.context[`${this.name}-format`] = this.displayedValue;
+            }
+            else {
+                delete this.form.context[`${this.name}-format`];
+            }
+        };
+        this.onInputChange = (event) => {
+            const target = event.target;
+            if (this.inputRef)
+                this.inputRef.value = target.value;
+            this.updateDisplayValue();
+        };
+        this.onInputClick = () => {
+            var _a;
+            (_a = this.inputRef) === null || _a === void 0 ? void 0 : _a.showPicker();
+        };
+    }
+    async componentWillLoad() {
+        this.form.subscribe(this.name, this);
+        this.onStaticValueChange(this.staticValue, false);
+        this.updateDisplayValue();
+    }
+    async onStaticValueChange(newStaticValue, notInitialLoad = true) {
+        if (!!newStaticValue) {
+            this.defaultValue = newStaticValue;
+            this.inputRef.value = newStaticValue;
+        }
+        else if (notInitialLoad) {
+            this.defaultValue = '';
+            this.inputRef.value = '';
+        }
+        this.updateDisplayValue();
+    }
+    async componentDidLoad() {
+        const prefix = this.el.getElementsByClassName('prefix')[0];
+        this.prefixWidth = prefix ? prefix.getBoundingClientRect().width : 0;
+        this.inputRef = this.el.getElementsByClassName(partKeyPrefix + this.name)[0];
+        this.updateDisplayValue();
+    }
+    async disconnectedCallback() {
+        this.form.unsubscribe(this.name);
+    }
+    reset(newValue) {
+        const value = newValue || this.defaultValue || '';
+        this.inputRef.value = value;
+        this.updateDisplayValue();
+    }
+    render() {
+        var _a, _b;
+        const { disabled, isRequired, meta, isError, errorMessage } = this.form.getInputState(this.name);
+        const [locale] = this.form.getFormLocale();
+        const part = partKeyPrefix + this.name;
+        const label = getNestedValue(locale, meta === null || meta === void 0 ? void 0 : meta.label) || (meta === null || meta === void 0 ? void 0 : meta.label);
+        const placeholder = getNestedValue(locale, meta === null || meta === void 0 ? void 0 : meta.placeholder);
+        const isDisabled = disabled || this.isLoading || !!this.staticValue || this.isDisabled;
+        const isRtl = ((_a = locale === null || locale === void 0 ? void 0 : locale.sharedFormLocales) === null || _a === void 0 ? void 0 : _a.direction) === 'rtl';
+        const isIconStart = this.iconPosition === 'start';
+        const iconPaddingSide = isIconStart ? (isRtl ? 'paddingRight' : 'paddingLeft') : isRtl ? 'paddingLeft' : 'paddingRight';
+        const iconClass = cn('form-input-icon', {
+            'form-input-icon-start': isIconStart,
+            'form-input-icon-end': !isIconStart,
+            'form-input-icon-interactive': !!this.iconAction,
+        });
+        const renderIcon = () => this.iconAction ? (h("button", { type: "button", disabled: isDisabled, onClick: this.iconAction, part: `${this.name}-icon form-input-icon`, class: iconClass }, this.icon)) : (h("span", { part: `${this.name}-icon form-input-icon`, class: iconClass }, this.icon));
+        return (h(Host, { key: '30e8c5dcf6e73545e9ca8a22ad1b867d2bf2dcb9' }, h("label", { key: 'ca64bc027377e91765e6a40cc9e7d557b195b97e', part: this.name, id: this.wrapperId, class: cn('form-input-label-container', this.wrapperClass, { disabled: isDisabled }) }, h(FormInputLabel, { key: 'ec51a34f299503b400274c9a7b25991d037b2dca', isRequired: isRequired, label: label }), h("div", { key: 'c844610ddb85d4f9a675a8ae6661d888cd5acb38', part: `${this.name}-container form-input-container relative`, class: "form-input-container" }, h(FormInputPrefix, { key: '39e07d5f9cecb0b61d45ef43d01d6e288d50ca18', name: this.name, direction: (_b = locale === null || locale === void 0 ? void 0 : locale.sharedFormLocales) === null || _b === void 0 ? void 0 : _b.direction, prefix: this.inputPrefix }), h("input", { key: '88095b71ff639f6040c72d864eb5f53d37015c05', type: "text", onInput: () => { }, part: `form-input`, disabled: isDisabled, value: this.displayedValue, onClick: this.onInputClick, placeholder: placeholder || (meta === null || meta === void 0 ? void 0 : meta.placeholder), style: Object.assign(Object.assign({}, (this.prefixWidth ? { [isRtl ? 'paddingRight' : 'paddingLeft']: `${this.prefixWidth}px` } : {})), (this.icon ? { [iconPaddingSide]: '40px' } : {})), class: cn('form-input-style enabled:cursor-pointer', {
+                'form-input-error-style': isError,
+            }) }), h("input", Object.assign({ key: '085815e83d0e4c2021f8e686082e03718f5da140', type: this.type, name: this.name }, this.inputProps, { onInput: this.onInputChange, part: `${this.name}-input ${part}`, class: cn('shadow-input size-full absolute top-0 left-0 opacity-0 -z-[99]', part), min: Array.isArray(this.min) ? decodeTimeOffset({ offsets: this.min, type: this.type }) : this.min, max: Array.isArray(this.max) ? decodeTimeOffset({ offsets: this.max, type: this.type }) : this.max })), this.icon && renderIcon()), h(FormErrorMessage, { key: 'a3cb212d05e449248b293520eab8eeadbc338452', name: this.name, isError: isError, errorMessage: locale[errorMessage] || errorMessage }))));
+    }
+    static get is() { return "form-picker-input"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["form-inputs.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["form-inputs.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "name": {
+                "type": "string",
+                "attribute": "name",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "format": {
+                "type": "string",
+                "attribute": "format",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "wrapperId": {
+                "type": "string",
+                "attribute": "wrapper-id",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "isLoading": {
+                "type": "boolean",
+                "attribute": "is-loading",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "isDisabled": {
+                "type": "boolean",
+                "attribute": "is-disabled",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "form": {
+                "type": "unknown",
+                "attribute": "form",
+                "mutable": false,
+                "complexType": {
+                    "original": "FormHook<any>",
+                    "resolved": "FormHook<any>",
+                    "references": {
+                        "FormHook": {
+                            "location": "import",
+                            "path": "~features/form-hook/form-hook",
+                            "id": "src/features/form-hook/form-hook.ts::FormHook"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "inputPrefix": {
+                "type": "string",
+                "attribute": "input-prefix",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "wrapperClass": {
+                "type": "string",
+                "attribute": "wrapper-class",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "staticValue": {
+                "type": "string",
+                "attribute": "static-value",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "inputProps": {
+                "type": "any",
+                "attribute": "input-props",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "{}"
+            },
+            "max": {
+                "type": "string",
+                "attribute": "max",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | number[]",
+                    "resolved": "number[] | string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "min": {
+                "type": "string",
+                "attribute": "min",
+                "mutable": false,
+                "complexType": {
+                    "original": "string | number[]",
+                    "resolved": "number[] | string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "type": {
+                "type": "string",
+                "attribute": "type",
+                "mutable": false,
+                "complexType": {
+                    "original": "DateTypes",
+                    "resolved": "\"date\" | \"datetime-local\" | \"time\"",
+                    "references": {
+                        "DateTypes": {
+                            "location": "import",
+                            "path": "~lib/decode-time-offset",
+                            "id": "src/global/lib/decode-time-offset.ts::DateTypes"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "'datetime-local'"
+            },
+            "defaultValue": {
+                "type": "string",
+                "attribute": "default-value",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "formatter": {
+                "type": "unknown",
+                "attribute": "formatter",
+                "mutable": false,
+                "complexType": {
+                    "original": "(value: string) => string",
+                    "resolved": "(value: string) => string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "icon": {
+                "type": "any",
+                "attribute": "icon",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false
+            },
+            "iconAction": {
+                "type": "unknown",
+                "attribute": "icon-action",
+                "mutable": false,
+                "complexType": {
+                    "original": "() => void",
+                    "resolved": "() => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false
+            },
+            "iconPosition": {
+                "type": "string",
+                "attribute": "icon-position",
+                "mutable": false,
+                "complexType": {
+                    "original": "'start' | 'end'",
+                    "resolved": "\"end\" | \"start\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "'end'"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "prefixWidth": {},
+            "displayedValue": {}
+        };
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "staticValue",
+                "methodName": "onStaticValueChange"
+            }];
+    }
+}

package/dist/collection/components/form-elements/form-shadow-input.js

@@ -4,6 +4,9 @@
  */
 import { h } from "@stencil/core";
 export class FormInput {
+    constructor() {
+        this.type = 'string';
+    }
     async handleNameChange(newName) {
         this.form.validateForm(newName, this.value);
     }
@@ -13,7 +16,7 @@ export class FormInput {
         this.form.validateForm(this.name, newValue);
     }
     render() {
-        return h("input", { key: '7a84f6be06d6eda722d643aa203d09c439bb9cdb', hidden: true, name: this.name, type: "string", value: this.value });
+        return h("input", { key: '78d94bf48cd98b488197e1f7839cf14b8fc42712', class: "shadow-input", type: this.type, hidden: true, name: this.name, value: this.value });
     }
     static get is() { return "form-shadow-input"; }
     static get originalStyleUrls() {
@@ -89,6 +92,26 @@ export class FormInput {
                 },
                 "getter": false,
                 "setter": false
+            },
+            "type": {
+                "type": "string",
+                "attribute": "type",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "defaultValue": "'string'"
             }
         };
     }

package/dist/collection/components/form-elements/form-structure-error.js

@@ -16,7 +16,7 @@ export class FormStructureError {
         this.sharedLocales = await getSharedLocal(newLanguage);
     }
     render() {
-        return (h(Host, { key: 'ab5042611718fa3e45610722a37c3f900606eff7' }, h("div", { key: 'bd98e0f8e88ee0cb79ffcf53d9ce5c4f62df5dc1', dir: this.sharedLocales.direction, part: "form-structure-error-container", class: "form-structure-error-container" }, h("div", { key: 'fe632575743b19a9846ee8395193336429aab546', part: "form-structure-error-content", class: "form-structure-error-content" }, this.sharedLocales.errors.wrongFormStructure))));
+        return (h(Host, { key: '7db25de8392c182f045f3ff24647414dc1cfb901' }, h("div", { key: 'f23892982a3d6f63ac06927611b43d22eeebc8d7', dir: this.sharedLocales.direction, part: "form-structure-error-container", class: "form-structure-error-container" }, h("div", { key: '99d0c58ceeec05ea9e4bbb3fbba5f0e31acaa087', part: "form-structure-error-content", class: "form-structure-error-content" }, this.sharedLocales.errors.wrongFormStructure))));
     }
     static get is() { return "form-structure-error"; }
     static get originalStyleUrls() {

package/dist/collection/components/form-elements/form-submit.js

@@ -21,9 +21,9 @@ export class FormSubmit {
     render() {
         const [locale] = this.form.getFormLocale();
         const submitText = getNestedValue(locale, this.submitTextKey) || getNestedValue(locale, 'sharedFormLocales.submit') || 'Submit';
-        return (h("button", { key: '73d566b9c8b84a646004ab0593ddd355f7cfd59d', type: "submit", formnovalidate: true, part: buttonSubscriberKey, disabled: this.isLoading, class: cn('form-submit', {
+        return (h("button", { key: '6623c7443f11a2b52efa7aec6899d1e34090fd5f', type: "submit", formnovalidate: true, part: buttonSubscriberKey, disabled: this.isLoading, class: cn('form-submit', {
                 loading: this.isLoading,
-            }) }, h("div", { key: 'd3628bb8d50562e948b55fa4db01b090ba3319ab', part: "form-submit-text", class: "opacity-0 form-submit-text-style" }, submitText), h("div", { key: '4e15ab333183868c572afedfe77e182288a5d3f6', part: "form-submit-text", class: "form-submit-text-style form-submit-text-position" }, submitText), h("div", { key: 'cd6421d2a6f07a11247e9082a75171b5ff35331b', part: "form-submit-loading-container", class: "form-submit-loading-container" }, h("img", { key: 'fc1692f9e4df784db2179788a5537e55f45a37fc', part: "form-submit-loading-icon", class: "form-submit-loading-icon", src: Loader }))));
+            }) }, h("div", { key: '916a453420a7071f30a2d2e53a88869c2aff3862', part: "form-submit-text", class: "opacity-0 form-submit-text-style" }, submitText), h("div", { key: '12603648db6362a933eaaf93c17226b5e668afca', part: "form-submit-text", class: "form-submit-text-style form-submit-text-position" }, submitText), h("div", { key: '307c45086b22cf0cb1b071eb93d6ef3321870df8', part: "form-submit-loading-container", class: "form-submit-loading-container" }, h("img", { key: '55ec7f07d7cd4372c5fb5061ebd30c97d664ea90', part: "form-submit-loading-icon", class: "form-submit-loading-icon", src: Loader }))));
     }
     static get is() { return "form-submit"; }
     static get originalStyleUrls() {

package/dist/collection/components/form-elements/form-switch.js

@@ -28,7 +28,7 @@ export class FormSwitch {
         const { disabled, meta, errorMessage, isError } = this.form.getInputState(this.name);
         const [locale] = this.form.getFormLocale();
         const label = getNestedValue(locale, meta === null || meta === void 0 ? void 0 : meta.label) || (meta === null || meta === void 0 ? void 0 : meta.label);
-        return (h(Host, { key: '875f6f166627794c63b6ef68ae0b05bc5dd3d513' }, h("div", { key: '02129550f8b1d6dda01fb3bc00678ce30b0941a9', part: `${this.name}`, id: this.wrapperId, class: cn('form-input-label-container', this.wrapperClass, disabled) }, h("div", { key: '3ccd1a14b50baf801abd0bbc90970fc56338389e', part: `${this.name}-container form-input-container`, class: "form-input-container" }, h("shift-switch", { key: 'ec664f769a91c594483d7bdfc22529a8693c35ea', name: this.name, label: label, class: "form-switch" })), h(FormErrorMessage, { key: '171e92927c65cb8f0eea0a46a1c4baa9ae7fd185', name: this.name, isError: isError, errorMessage: locale[errorMessage] || errorMessage }))));
+        return (h(Host, { key: 'cdb534484bc473a634e6755e9c2e80e7ec9fe6ff' }, h("div", { key: 'fd0f6be89414c7428c86d1e42ce509454d9a2a5c', part: `${this.name}`, id: this.wrapperId, class: cn('form-input-label-container', this.wrapperClass, disabled) }, h("div", { key: '81c588dd1710b7b29ed767d3201d145a9014f1d9', part: `${this.name}-container form-input-container`, class: "form-input-container" }, h("shift-switch", { key: '1a45cd794444116750c43d058b7f047a4e46060a', name: this.name, label: label, class: "form-switch" })), h(FormErrorMessage, { key: '3a15b11afd74132642cea3b9e7db5d688263ced7', name: this.name, isError: isError, errorMessage: locale[errorMessage] || errorMessage }))));
     }
     static get is() { return "form-switch"; }
     static get originalStyleUrls() {

package/dist/collection/components/form-elements/form-text-area.js

@@ -39,9 +39,9 @@ export class FormTextArea {
         const label = getNestedValue(locale, meta === null || meta === void 0 ? void 0 : meta.label) || (meta === null || meta === void 0 ? void 0 : meta.label);
         const placeholder = getNestedValue(locale, meta === null || meta === void 0 ? void 0 : meta.placeholder);
         const isDisabled = disabled || this.isLoading || !!this.staticValue || this.isDisabled;
-        return (h(Host, { key: '5eb572a72a2b0ad9b2d3ac3759f99444d024700b' }, h("label", { key: '15698bba5da302ec33acb60e4e7203daed87a29c', part: `${this.name}`, id: this.wrapperId, class: cn('form-input-label-container', this.wrapperClass, { disabled: isDisabled }) }, h(FormInputLabel, { key: '3bdad56fd248557d37612d69959f530d9d460cb6', name: this.name, isRequired: isRequired, label: label }), h("div", { key: '3cf4c5ee53b9aee717407a7ec3a22508d68fd43e', part: `${this.name}-container form-input-container`, class: "form-input-container" }, h("textarea", { key: '6d790215432b63fcce2684a19bf7c3d3d21576bc', name: this.name, disabled: isDisabled, placeholder: placeholder, part: `${this.name}-textarea form-input-textarea`, class: cn('form-input-style form-input-textarea-style', partKeyPrefix + this.name, {
+        return (h(Host, { key: '2abbca4df605994309adb2728b12a8e8fbce49c7' }, h("label", { key: '5302017f95d7e42da25b9d524fdf61a6ee839d5d', part: `${this.name}`, id: this.wrapperId, class: cn('form-input-label-container', this.wrapperClass, { disabled: isDisabled }) }, h(FormInputLabel, { key: '67a31c1a3467402709d388df7cb7f04264065ff7', name: this.name, isRequired: isRequired, label: label }), h("div", { key: '159ea7b8c00d16b494d2c73e8197984b03657cc8', part: `${this.name}-container form-input-container`, class: "form-input-container" }, h("textarea", { key: '91b158f2a12a029a836a5643ab926afbb8479fa7', name: this.name, disabled: isDisabled, placeholder: placeholder, part: `${this.name}-textarea form-input-textarea`, class: cn('form-input-style form-input-textarea-style', partKeyPrefix + this.name, {
                 'form-input-error-style': isError,
-            }) }, this.defaultValue)), h("div", { key: 'c533d450a815bc2cd18bbe71ed2323dc8bee829d', class: "-mt-1" }, h(FormErrorMessage, { key: '5e233890b3d9a49bd563affae055f43005e8968b', name: this.name, isError: isError, errorMessage: locale[errorMessage] || errorMessage })))));
+            }) }, this.defaultValue)), h("div", { key: 'bd90efc257539f9789efa8d00318130aa8e46aef', class: "-mt-1" }, h(FormErrorMessage, { key: '9d7e74c82e7f63da3ace773758f3aa444c0d833a', name: this.name, isError: isError, errorMessage: locale[errorMessage] || errorMessage })))));
     }
     static get is() { return "form-text-area"; }
     static get originalStyleUrls() {