@justifi/webcomponents 5.7.4-rc-01 → 5.7.5

package/dist/esm/{hidden-input_2.entry.js → iframe-input.entry.js}

@@ -1,106 +1,10 @@
-import { r as registerInstance, h, H as Host, c as createEvent, a as getElement } from './index-N3w5zrz2.js';
-import { c as createStore } from './index-BAq5IUBW.js';
-import { i as inputInvalidAndFocused, b as inputInvalid, a as inputFocused, c as input, l as label } from './parts-_6eQgwfE.js';
+import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-N3w5zrz2.js';
 import { g as getDefaultExportFromCjs } from './_commonjsHelpers-BFTU3MAI.js';
-import { F as FormControlErrorText } from './form-control-error-text-C93L7yFm.js';
-import { p as packageJson } from './package-rzqedGq4.js';
-
-const iframeInputStylesStore = createStore({
-    focused: {
-        boxShadow: '',
-        border: '',
-    },
-    focusedAndInvalid: {
-        boxShadow: '',
-        border: '',
-    },
-    fontStyles: {
-        fontFamily: '',
-        fontSize: '',
-        fontWeight: '',
-        lineHeight: '',
-        margin: '',
-        padding: '',
-    },
-});
-const { state: iframeInputStyles, set: iframeInputStylesSet, } = iframeInputStylesStore;
-
-const HiddenInput = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.isFocused = false;
-        this.errorText = '';
-    }
-    async componentDidLoad() {
-        const fontStyles = await this.getBaseFontStyles();
-        iframeInputStylesSet('fontStyles', fontStyles);
-        const focusedStyles = await this.getFocusedStyles();
-        iframeInputStylesSet('focused', focusedStyles);
-        const focusedAndInvalidStyles = await this.getFocusedAndInvalidStyles();
-        iframeInputStylesSet('focusedAndInvalid', focusedAndInvalidStyles);
-    }
-    async getBaseFontStyles() {
-        return new Promise((resolve, _reject) => {
-            setTimeout(() => {
-                const computedStyles = getComputedStyle(this.hiddenInput);
-                const styles = {
-                    fontFamily: computedStyles.fontFamily,
-                    fontSize: computedStyles.fontSize,
-                    fontWeight: computedStyles.fontWeight,
-                    lineHeight: computedStyles.lineHeight,
-                    margin: computedStyles.margin,
-                    padding: computedStyles.padding,
-                    color: computedStyles.color,
-                };
-                resolve(styles);
-            }, 500);
-        });
-    }
-    ;
-    async getFocusedStyles() {
-        return new Promise((resolve, _reject) => {
-            this.hiddenInput.focus();
-            setTimeout(() => {
-                this.hiddenInput.blur();
-                let computedStyles = getComputedStyle(this.hiddenInput);
-                resolve({
-                    boxShadow: computedStyles.boxShadow,
-                    border: computedStyles.border,
-                });
-            }, 500);
-        });
-    }
-    async getFocusedAndInvalidStyles() {
-        return new Promise((resolve, _reject) => {
-            this.hiddenInput.focus();
-            this.errorText = 'Error';
-            setTimeout(() => {
-                const computedStyles = getComputedStyle(this.hiddenInput);
-                const styles = {
-                    boxShadow: computedStyles.boxShadow,
-                    border: computedStyles.border,
-                };
-                this.hiddenInput.blur();
-                resolve(styles);
-            }, 500);
-        });
-    }
-    get part() {
-        if (this.isFocused && this.errorText) {
-            return inputInvalidAndFocused;
-        }
-        if (this.errorText) {
-            return inputInvalid;
-        }
-        if (this.isFocused) {
-            return inputFocused;
-        }
-        return input;
-    }
-    render() {
-        return (h(Host, { key: '05e1f461fcdf006dc2b5db2b4c10450cd7db1c8c' }, h("input", { key: 'dc7589d1a68f7eb31c97281445448a8f2dcf3796', ref: el => this.hiddenInput = el, type: "text", class: this.errorText ? "form-control is-invalid" : "form-control", onFocus: () => this.isFocused = true, onBlur: () => this.isFocused = false, part: this.part, tabindex: "-1", style: { height: '0', opacity: '0', pointerEvents: 'none', animation: 'none' } })));
-    }
-};
+import { F as FormControlErrorText } from './form-control-error-text-CYWqNNkG.js';
+import { p as packageJson } from './package-B0XIc_FO.js';
+import { i as iframeInputStyles } from './iframe-input-styles-state-DqkcQMM1.js';
+import { i as inputInvalidAndFocused, b as inputInvalid, a as inputFocused, c as input, l as label } from './parts-BrLVc_85.js';
+import './index-BAq5IUBW.js';
 
 var iframeResizer = {exports: {}};
 
@@ -1713,10 +1617,10 @@ const IframeInput = class {
         return params;
     }
     render() {
-        return (h(Host, { key: '2af3e5fa30d517f882488289c4b547c28adae089', class: "form-group d-flex flex-column" }, h("div", { key: '361be04621a8cc152701744a1a06692cc8740fec', style: {
+        return (h(Host, { key: '7482645d98277dfb65e78a2003e020216fcb52c3', class: "form-group d-flex flex-column" }, h("div", { key: '746fca9a555309152d5cf3943d31d3b3b2c9bfde', style: {
                 visibility: this.iframeLoaded ? 'visible' : 'hidden',
                 height: this.iframeLoaded ? 'auto' : '0',
-            } }, h("label", { key: '807e8814bbac8cd2e2b409367b3205238b8f7d1c', class: "form-label", htmlFor: "", part: label }, this.label || ''), h("div", { key: '0cfd76ca44133fd218542cd97391754d33c2b205', class: `p-0 d-flex form-control ${this.isValid ? '' : 'is-invalid'}`, part: this.part, style: Object.assign(Object.assign({}, this.style), { overflow: 'hidden' }) }, h("iframe", { key: '53eb1248d2596a306c6b36b41983fa51cba73fc4', id: this.inputId, name: this.inputId, src: `${this.iframeOrigin}?${this.urlParams}`, ref: el => {
+            } }, h("label", { key: '55b203e278ec100baf7949a91eb6a43135c82402', class: "form-label", htmlFor: "", part: label }, this.label || ''), h("div", { key: 'c3dd73db2accf012c5a8f3a5c8e32863fe87fd73', class: `p-0 d-flex form-control ${this.isValid ? '' : 'is-invalid'}`, part: this.part, style: Object.assign(Object.assign({}, this.style), { overflow: 'hidden' }) }, h("iframe", { key: '5eb7c35da6ca7910ccf74a24d77ee47d6b4479f9', id: this.inputId, name: this.inputId, src: `${this.iframeOrigin}?${this.urlParams}`, ref: el => {
                 this.iframeElement = el;
                 this.initializeFrameCommunicationService();
             }, width: "100%", onLoad: () => {
@@ -1726,9 +1630,9 @@ const IframeInput = class {
                         this.iframeLoaded.emit();
                     }
                 }, this.iframeElement);
-            } })), h(FormControlErrorText, { key: '681f58f474a0c82c5b0b9888156865e0dd496477', errorText: this.errorText, name: this.inputId }))));
+            } })), h(FormControlErrorText, { key: '291b487d0b798b6658d83b9c9f775ba4f02e09de', errorText: this.errorText, name: this.inputId }))));
     }
     get el() { return getElement(this); }
 };
 
-export { HiddenInput as hidden_input, IframeInput as iframe_input };
+export { IframeInput as iframe_input };