@justifi/webcomponents 4.12.2 → 4.13.0-rc.1

package/dist/collection/components/form/form-control-file.js

@@ -0,0 +1,169 @@
+import { Host, h, } from "@stencil/core";
+export class FileInput {
+    constructor() {
+        this.label = undefined;
+        this.name = undefined;
+        this.error = undefined;
+        this.inputHandler = undefined;
+        this.disabled = undefined;
+        this.input = undefined;
+        this.file = undefined;
+    }
+    updateInput(newValue) {
+        const inputElement = this.el.shadowRoot.querySelector('input');
+        if (inputElement) {
+            inputElement.value = newValue || '';
+        }
+    }
+    handleFormControlInput(event) {
+        const target = event.target;
+        const name = target.getAttribute('name');
+        this.inputHandler(name, target.value);
+        this.formControlInput.emit(target.value);
+    }
+    handleFileChange(event) {
+        this.file = event.target.files[0];
+    }
+    render() {
+        return (h(Host, { exportparts: "label,input,input-invalid" }, h("label", { part: "label", class: "form-label", htmlFor: this.name }, this.label), h("input", { type: "file", name: this.name, part: `input ${this.error ? 'input-invalid ' : ''}${this.disabled ? ' input-disabled' : ''}`, class: this.error ? 'form-control is-invalid' : 'form-control', disabled: this.disabled, onChange: (event) => this.handleFileChange(event), onInput: (event) => this.handleFormControlInput(event), onBlur: () => this.formControlBlur.emit() }), this.error && h("div", { class: "invalid-feedback" }, this.error)));
+    }
+    static get is() { return "form-control-file"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["form-control-file.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["form-control-file.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "label",
+                "reflect": false
+            },
+            "name": {
+                "type": "any",
+                "mutable": false,
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "name",
+                "reflect": false
+            },
+            "error": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "error",
+                "reflect": false
+            },
+            "inputHandler": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "(name: string, value: string) => void",
+                    "resolved": "(name: string, value: string) => void",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                }
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "disabled",
+                "reflect": false
+            }
+        };
+    }
+    static get states() {
+        return {
+            "input": {},
+            "file": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "formControlInput",
+                "name": "formControlInput",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "formControlBlur",
+                "name": "formControlBlur",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+    static get elementRef() { return "el"; }
+}