@benbraide/inlinejs-stripe 2.0.1 → 2.0.3

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 || {});
@@ -7388,7 +7390,10 @@ class StripeFieldElement extends inlinejs_element_1.CustomElement {
         super();
         this.stripeField_ = null;
         this.isReady_ = false;
+        this.isComplete_ = false;
+        this.lastError_ = null;
         this.readyWaiters_ = new Array();
+        this.changeListeners = new Array();
         this.stripe = null;
         this.options = null;
         this.type = '';
@@ -7401,6 +7406,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()));
@@ -7446,23 +7458,25 @@ class StripeFieldElement extends inlinejs_element_1.CustomElement {
                         this.readyWaiters_.splice(0).forEach(waiter => (0, inlinejs_1.JournalTry)(waiter));
                     });
                     this.stripeField_.on('change', (event) => {
-                        var _a;
-                        if (event === null || event === void 0 ? void 0 : event.error) {
+                        if (((event === null || event === void 0 ? void 0 : event.error) || null) !== this.lastError_) {
+                            this.lastError_ = ((event === null || event === void 0 ? void 0 : event.error) || null);
                             (0, inlinejs_1.EvaluateLater)({
                                 componentId: this.componentId_,
                                 contextElement: this,
                                 expression: this.onerrors,
                                 disableFunctionCall: false,
-                            })(undefined, [], { error: event.error });
+                            })(undefined, [this.lastError_], { error: this.lastError_ });
+                            this.changeListeners.forEach(listener => (0, inlinejs_1.JournalTry)(() => listener('error', this.lastError_)));
                         }
-                        else if (event === null || event === void 0 ? void 0 : event.complete) {
+                        if (((event === null || event === void 0 ? void 0 : event.complete) || false) != this.isComplete_) {
+                            this.isComplete_ = ((event === null || event === void 0 ? void 0 : event.complete) || false);
                             (0, inlinejs_1.EvaluateLater)({
                                 componentId: this.componentId_,
                                 contextElement: this,
                                 expression: this.oncomplete,
                                 disableFunctionCall: false,
-                            })();
-                            (_a = this.GetStripe_()) === null || _a === void 0 ? void 0 : _a.FocusNextField(this);
+                            })(undefined, [this.isComplete_], { complete: this.isComplete_ });
+                            this.changeListeners.forEach(listener => (0, inlinejs_1.JournalTry)(() => listener('complete', this.isComplete_)));
                         }
                     });
                     this.stripeField_.mount(this);
@@ -7533,6 +7547,8 @@ class StripePaymentMenthodElement extends inlinejs_element_1.CustomElement {
     WaitReady() {
         return Promise.resolve();
     }
+    AddChangeListener(listener) { }
+    RemoveChangeListener(listener) { }
     ToggleFocus(focused) { }
     Reset() { }
     AddDetails(details) {
@@ -7590,11 +7606,15 @@ class StripeElement extends inlinejs_element_1.CustomElement {
         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;
+        this.focusnext = false;
     }
     AddStripeField(field) {
         this.fields_ = (this.fields_ || []);
@@ -7613,13 +7633,54 @@ class StripeElement extends inlinejs_element_1.CustomElement {
                 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 });
+                !!data && this.focusnext && this.FocusNextField(field);
+            }
+            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);
+                }
+                changed && 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_) {
+        if (this.fields_) {
             const index = this.fields_.indexOf(field);
             (index >= 0 && index < this.fields_.length - 1) && this.fields_[index + 1].ToggleFocus(true);
         }
@@ -7708,12 +7769,18 @@ __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);
 __decorate([
     (0, inlinejs_element_1.Property)({ type: 'boolean' })
-], StripeElement.prototype, "autofocus", void 0);
+], StripeElement.prototype, "focusnext", void 0);
 exports.StripeElement = StripeElement;
 function StripeElementCompact() {
     (0, inlinejs_element_1.RegisterCustomElement)(StripeElement, 'stripe');