@benbraide/inlinejs-stripe 2.0.0 → 2.0.2

package/dist/inlinejs-stripe.js

@@ -7311,6 +7311,8 @@ class StripeDetailElement extends inlinejs_element_1.CustomElement {
     WaitReady() {
         return Promise.resolve();
     }
+    AddChangeListener(listener) { }
+    RemoveChangeListener(listener) { }
     ToggleFocus(focused) {
         const input = this.GetInput_();
         input && (focused ? input.focus() : input.blur());
@@ -7321,7 +7323,7 @@ class StripeDetailElement extends inlinejs_element_1.CustomElement {
     }
     AddDetails(details) {
         const input = this.GetInput_();
-        if (!this.name || (!input && !this.value)) {
+        if (!this.name || (!(input === null || input === void 0 ? void 0 : input.value) && !this.value)) {
             return;
         }
         details.billingDetails = (details.billingDetails || {});
@@ -7389,6 +7391,7 @@ class StripeFieldElement extends inlinejs_element_1.CustomElement {
         this.stripeField_ = null;
         this.isReady_ = false;
         this.readyWaiters_ = new Array();
+        this.changeListeners = new Array();
         this.stripe = null;
         this.options = null;
         this.type = '';
@@ -7401,6 +7404,13 @@ class StripeFieldElement extends inlinejs_element_1.CustomElement {
             this.isReady_ ? resolve() : this.readyWaiters_.push(() => resolve());
         });
     }
+    AddChangeListener(listener) {
+        this.changeListeners.push(listener);
+    }
+    RemoveChangeListener(listener) {
+        const index = this.changeListeners.indexOf(listener);
+        (index >= 0) && this.changeListeners.splice(index, 1);
+    }
     ToggleFocus(focused) {
         var _a, _b;
         (this.stripeField_ && (focused ? (_a = this.stripeField_) === null || _a === void 0 ? void 0 : _a.focus() : (_b = this.stripeField_) === null || _b === void 0 ? void 0 : _b.blur()));
@@ -7437,6 +7447,12 @@ class StripeFieldElement extends inlinejs_element_1.CustomElement {
                     this.stripeField_ = stripe.elements().create(type, (this.options || ((_a = this.GetStripe_()) === null || _a === void 0 ? void 0 : _a.options) || undefined));
                     this.stripeField_.on('ready', () => {
                         this.isReady_ = true;
+                        this.onready && (0, inlinejs_1.EvaluateLater)({
+                            componentId: this.componentId_,
+                            contextElement: this,
+                            expression: this.onready,
+                            disableFunctionCall: false,
+                        })();
                         this.readyWaiters_.splice(0).forEach(waiter => (0, inlinejs_1.JournalTry)(waiter));
                     });
                     this.stripeField_.on('change', (event) => {
@@ -7448,6 +7464,7 @@ class StripeFieldElement extends inlinejs_element_1.CustomElement {
                                 expression: this.onerrors,
                                 disableFunctionCall: false,
                             })(undefined, [], { error: event.error });
+                            this.changeListeners.forEach(listener => (0, inlinejs_1.JournalTry)(() => listener('error', event.error)));
                         }
                         else if (event === null || event === void 0 ? void 0 : event.complete) {
                             (0, inlinejs_1.EvaluateLater)({
@@ -7456,8 +7473,15 @@ class StripeFieldElement extends inlinejs_element_1.CustomElement {
                                 expression: this.oncomplete,
                                 disableFunctionCall: false,
                             })();
+                            this.changeListeners.forEach(listener => (0, inlinejs_1.JournalTry)(() => listener('complete', true)));
                             (_a = this.GetStripe_()) === null || _a === void 0 ? void 0 : _a.FocusNextField(this);
                         }
+                        else {
+                            this.changeListeners.forEach((listener) => {
+                                (0, inlinejs_1.JournalTry)(() => listener('complete', false));
+                                (0, inlinejs_1.JournalTry)(() => listener('error', null));
+                            });
+                        }
                     });
                     this.stripeField_.mount(this);
                 }
@@ -7527,6 +7551,8 @@ class StripePaymentMenthodElement extends inlinejs_element_1.CustomElement {
     WaitReady() {
         return Promise.resolve();
     }
+    AddChangeListener(listener) { }
+    RemoveChangeListener(listener) { }
     ToggleFocus(focused) { }
     Reset() { }
     AddDetails(details) {
@@ -7579,20 +7605,82 @@ class StripeElement extends inlinejs_element_1.CustomElement {
         this.stripe_ = null;
         this.mounting_ = false;
         this.mounted_ = false;
+        this.isReady_ = false;
+        this.readyWaiters_ = new Array();
         this.fields_ = null;
+        this.readyFields_ = null;
         this.instanceWaiters_ = new Array();
+        this.completeFields_ = null;
+        this.errorFields_ = null;
         this.options = null;
         this.publicKey = '';
         this.onready = '';
+        this.oncomplete = '';
+        this.onerrors = '';
         this.defer = false;
         this.autofocus = false;
     }
     AddStripeField(field) {
         this.fields_ = (this.fields_ || []);
         this.fields_.push(field);
+        field.WaitReady().then(() => {
+            this.readyFields_ = (this.readyFields_ || []);
+            this.readyFields_.push(field);
+            (this.fields_ && this.readyFields_ && this.fields_.length <= this.readyFields_.length) && (0, inlinejs_1.JournalTry)(() => {
+                this.isReady_ = true;
+                this.onready && (0, inlinejs_1.EvaluateLater)({
+                    componentId: this.componentId_,
+                    contextElement: this,
+                    expression: this.onready,
+                    disableFunctionCall: false,
+                })();
+                this.readyWaiters_.splice(0).forEach(waiter => (0, inlinejs_1.JournalTry)(waiter));
+            });
+        });
+        field.AddChangeListener((type, data) => {
+            if (type === 'complete') {
+                let changed = false;
+                this.completeFields_ = (this.completeFields_ || []);
+                if (data && !this.completeFields_.includes(field)) {
+                    this.completeFields_.push(field);
+                    changed = !!(this.readyFields_ && this.completeFields_.length == this.readyFields_.length);
+                }
+                else if (!data && this.completeFields_.includes(field)) {
+                    this.completeFields_ = this.completeFields_.filter(x => x !== field);
+                    changed = (this.completeFields_.length == 0);
+                }
+                changed && this.oncomplete && (0, inlinejs_1.EvaluateLater)({
+                    componentId: this.componentId_,
+                    contextElement: this,
+                    expression: this.oncomplete,
+                    disableFunctionCall: false,
+                })(undefined, [!!data], { complete: !!data });
+            }
+            else if (type === 'error') {
+                let changed = false;
+                this.errorFields_ = (this.errorFields_ || []);
+                this.errorFields_.push(field);
+                this.errorFields_ = (this.errorFields_ || []);
+                if (data && !this.errorFields_.includes(field)) {
+                    this.errorFields_.push(field);
+                    changed = (this.errorFields_.length == 1);
+                }
+                else if (!data && this.errorFields_.includes(field)) {
+                    this.errorFields_ = this.errorFields_.filter(x => x !== field);
+                    changed = (this.errorFields_.length == 0);
+                }
+                this.onerrors && (0, inlinejs_1.EvaluateLater)({
+                    componentId: this.componentId_,
+                    contextElement: this,
+                    expression: this.onerrors,
+                    disableFunctionCall: false,
+                })(undefined, [data], { error: data });
+            }
+        });
     }
     RemoveStripeField(field) {
         this.fields_ && (this.fields_ = this.fields_.filter(x => x !== field));
+        this.readyFields_ && (this.readyFields_ = this.readyFields_.filter(x => x !== field));
     }
     FocusNextField(field) {
         if (this.autofocus && this.fields_) {
@@ -7626,6 +7714,11 @@ class StripeElement extends inlinejs_element_1.CustomElement {
     Setup(clientSecret) {
         return this.PayOrSetup_(false, clientSecret);
     }
+    WaitReady() {
+        return new Promise(resolve => {
+            this.isReady_ ? resolve() : this.readyWaiters_.push(() => resolve());
+        });
+    }
     HandleElementScopeCreated_(_a, postAttributesCallback) {
         var { scope } = _a, rest = __rest(_a, ["scope"]);
         super.HandleElementScopeCreated_(Object.assign({ scope }, rest), postAttributesCallback);
@@ -7679,6 +7772,12 @@ __decorate([
 __decorate([
     (0, inlinejs_element_1.Property)({ type: 'string' })
 ], StripeElement.prototype, "onready", void 0);
+__decorate([
+    (0, inlinejs_element_1.Property)({ type: 'string' })
+], StripeElement.prototype, "oncomplete", void 0);
+__decorate([
+    (0, inlinejs_element_1.Property)({ type: 'string' })
+], StripeElement.prototype, "onerrors", void 0);
 __decorate([
     (0, inlinejs_element_1.Property)({ type: 'boolean' })
 ], StripeElement.prototype, "defer", void 0);