@odus/checkout 0.29.0 → 0.29.1

package/dist/elements.es.js

@@ -1,4 +1,4 @@
-import { k as a, I as m, S as y, g as C, b as g, A as E, F as k, h as z, a as c, f as N, J as S, E as P, j as x, P as F, l as R, w as A, m as V, n as M, i as B } from "./shared.js";
+import { k as a, I as m, S as y, g as C, b as g, A as E, F as k, h as z, a as c, f as N, J as P, E as S, j as x, P as F, l as R, w as A, m as V, n as M, i as B } from "./shared.js";
 const l = ".form-helper-text{color:#dc2727;font-family:var(--odus-font-family, inherit);font-size:12px;font-weight:500;margin-top:4px;display:block;overflow:hidden;max-height:100px;transition:max-height .3s ease-in-out,opacity .3s ease-in-out,margin .3s ease-in-out}.form-helper-text-hidden{max-height:0;opacity:0;margin-top:0;overflow:hidden}", h = ".input-wrapper{display:flex;flex-direction:column;width:100%;min-width:0;box-sizing:border-box;align-items:stretch}.input-wrapper *{box-sizing:border-box}.form-input{opacity:1;font-size:var(--odus-input-font-size, 16px);font-weight:var(--odus-input-font-weight, 400);letter-spacing:var(--odus-input-letter-spacing, .02em);transition:box-shadow .1s ease-in,border-radius .2s ease-in;box-shadow:0 0 0 1px var(--odus-border-color, #e0e0e0),0 2px 4px #00000012,0 1px 1.5px #0000000d;background:var(--odus-color-background, #fff);padding:var(--odus-input-padding, 8px 12px);border:none;outline:none;line-height:var(--odus-input-line-height, 1.5);z-index:0;box-sizing:border-box;min-height:0;flex:1;width:100%}.form-input[name=cardNumber]{padding-right:100px}.form-input-error{color:#dc2727}.form-input::placeholder{color:var(--odus-input-placeholder-color, #717173);opacity:var(--odus-input-placeholder-opacity, .3)}.form-input:focus{box-shadow:0 0 0 1px #3297d3b3,0 1px 1px #00000012,0 0 0 4px #3297d34d;position:relative;z-index:2}", u = ".input-label{font-family:var(--odus-font-family, inherit);font-size:var(--odus-label-font-size, 14px);font-weight:var(--odus-label-font-weight, 400);color:var(--odus-label-color, var(--odus-color-text, #1a1a1a));letter-spacing:var(--odus-label-letter-spacing, normal);line-height:var(--odus-label-line-height, 1.4);margin-bottom:var(--odus-label-margin-bottom, 6px)}", I = ":host{--odus-font-family: system-ui, sans-serif;--odus-font-size: 16px;--odus-color-error: #dc2727;--odus-color-text: #1a1a1a;--odus-color-background: #ffffff;--odus-border-color: #e0e0e0;--odus-border-radius: 6px;--odus-spacing-sm: 8px;--odus-spacing-md: 16px;--odus-spacing-lg: 24px;--odus-input-height: 44px;--odus-input-padding: 8px 12px;--odus-input-font-size: var(--odus-font-size);--odus-input-font-weight: 400;--odus-input-letter-spacing: .02em;--odus-input-line-height: 1.5;--odus-input-placeholder-color: #717173;--odus-input-placeholder-opacity: .3;--odus-input-focus-shadow: 0 0 0 1px rgba(50, 151, 211, .7), 0 1px 1px 0 rgba(0, 0, 0, .07), 0 0 0 4px rgba(50, 151, 211, .3);--odus-label-font-size: 14px;--odus-label-font-weight: 400;--odus-label-color: var(--odus-color-text);--odus-label-letter-spacing: normal;--odus-label-line-height: 1.4;--odus-label-margin-bottom: 6px;--odus-card-gap: 12px;--odus-button-height: 48px;--odus-button-border-radius: var(--odus-border-radius)}.form-input{opacity:1;font-weight:var(--odus-input-font-weight, 400);letter-spacing:var(--odus-input-letter-spacing, .02em);transition:box-shadow .1s ease-in,border-radius .2s ease-in;box-shadow:0 0 0 1px var(--odus-border-color, #e0e0e0),0 2px 4px #00000012,0 1px 1.5px #0000000d;background:var(--odus-color-background, #fff);padding:var(--odus-input-padding, 8px 12px);border:none;outline:none;line-height:var(--odus-input-line-height, 1.5);z-index:0;box-sizing:border-box;min-height:0;flex:1;width:100%}.form-input::placeholder{color:var(--odus-input-placeholder-color, #717173);opacity:var(--odus-input-placeholder-opacity, .3)}.form-input:focus{box-shadow:var( --odus-input-focus-shadow, 0 0 0 1px rgba(50, 151, 211, .7), 0 1px 1px 0 rgba(0, 0, 0, .07), 0 0 0 4px rgba(50, 151, 211, .3) );position:relative;z-index:2}.input-label{font-family:var(--odus-font-family, inherit)!important;font-size:var(--odus-label-font-size, 14px)!important;font-weight:var(--odus-label-font-weight, 400)!important;color:var(--odus-label-color, var(--odus-color-text, #1a1a1a))!important;letter-spacing:var(--odus-label-letter-spacing, normal)!important;line-height:var(--odus-label-line-height, 1.4)!important;margin-bottom:var(--odus-label-margin-bottom, 6px)!important}.form-helper-text{font-family:var(--odus-font-family, inherit)!important}";
 class d {
   shadowRoot = null;
@@ -336,30 +336,21 @@ class D extends d {
   _country = "";
   _input = null;
   _select = null;
-  _allowedStates;
-  setStates(e) {
-    this._allowedStates = e.length > 0 ? e : void 0, this._value && this._allowedStates && !this._allowedStates.includes(this._value) && (this._value = "", this.emit("change", this._value)), this.shadowRoot && this.render();
-  }
   setCountry(e) {
     const t = this._country;
     if (this._country = e, !this.shadowRoot) return;
     const r = b.has(t), o = b.has(e);
     if (r && o && t !== e) {
       const { t: s } = a(), i = e, p = s(i === "US" ? "address.chooseState" : "address.chooseProvince");
-      this._select?.setOptions(
-        g(this._allowedStates, i),
-        p
-      ), this._value = "";
+      this._select?.setOptions(g(i), p), this._value = "";
       return;
     }
     r !== o && (this._value = "", this.render());
   }
   render() {
     if (!this.shadowRoot) return;
-    this._input?.getElement().remove(), this._select?.getElement().remove(), this._input = null, this._select = null;
-    const e = b.has(this._country);
-    if (this._allowedStates || e) {
-      const t = e ? this._country : "US";
+    if (this._input?.getElement().remove(), this._select?.getElement().remove(), this._input = null, this._select = null, b.has(this._country)) {
+      const t = this._country;
       this._renderSelect(t);
     } else
       this._renderInput();
@@ -381,7 +372,7 @@ class D extends d {
     }), this.shadowRoot.appendChild(this._input.getElement());
   }
   _renderSelect(e) {
-    const { t } = a(), r = g(this._allowedStates, e), o = t(e === "US" ? "address.chooseState" : "address.chooseProvince");
+    const { t } = a(), r = g(e), o = t(e === "US" ? "address.chooseState" : "address.chooseProvince");
     this._select = new y({
       name: "billingAddress.state",
       label: t("address.state"),
@@ -572,7 +563,7 @@ class Z extends d {
     return this._error;
   }
 }
-const K = "apple-pay-button{-webkit-appearance:-apple-pay-button;-apple-pay-button-type:plain;-apple-pay-button-style:black;appearance:-apple-pay-button;height:40px;min-height:40px;border-radius:4px;cursor:pointer;display:inline-block;width:100%;box-sizing:border-box}apple-pay-button:hover{filter:brightness(.9)}", U = {
+const K = "apple-pay-button{-webkit-appearance:-apple-pay-button;-apple-pay-button-type:plain;-apple-pay-button-style:black;appearance:-apple-pay-button;height:40px;min-height:40px;border-radius:4px;cursor:pointer;display:inline-block;width:100%;box-sizing:border-box}apple-pay-button:hover{filter:brightness(.9)}", Q = {
   name: "odus-elements",
   styles: {
     fontSize: 14,
@@ -597,7 +588,7 @@ const K = "apple-pay-button{-webkit-appearance:-apple-pay-button;-apple-pay-butt
   },
   additionalPaymentMethods: {}
 };
-class Q extends d {
+class U extends d {
   _paymentContext = null;
   _applePayData = null;
   _authorized = !1;
@@ -620,7 +611,7 @@ class Q extends d {
       onAuthorize: w
     } = this._paymentContext;
     i?.length && o?.countryCode && !i.map((f) => f.toUpperCase()).includes(o.countryCode.toUpperCase()) || (this._button = new E({
-      checkoutProfile: U,
+      checkoutProfile: Q,
       paymentId: e,
       checkoutKey: t,
       environment: r,
@@ -790,7 +781,7 @@ class Y extends d {
     };
   }
   getPayload() {
-    const e = this._environment === "live" ? H : J, t = new S();
+    const e = this._environment === "live" ? H : J, t = new P();
     t.setPublicKey(e);
     const r = this._cardNumber.replace(/\s+/g, ""), o = this._cardExpiry.replace(/\s+/g, "").split("/"), s = o[0] ?? "";
     let i = o[1] ?? "";
@@ -948,7 +939,7 @@ class ee extends d {
     if (!this.shadowRoot) return;
     this._field?.getElement().remove(), this.options.initialValue && !this._email && (this._email = String(this.options.initialValue));
     const { t: e } = a();
-    this._field = new P({
+    this._field = new S({
       value: this._email,
       error: !1,
       checkoutProfile: $,
@@ -1259,7 +1250,7 @@ class ue {
     });
     const r = {};
     Object.defineProperty(r, "applePay", {
-      get: () => (this._applePay || (this._applePay = new Q(), this._trackElement(this._applePay), this._paymentState.paymentId && this._paymentState.checkoutKey && this._applePay.setPaymentContext({
+      get: () => (this._applePay || (this._applePay = new U(), this._trackElement(this._applePay), this._paymentState.paymentId && this._paymentState.checkoutKey && this._applePay.setPaymentContext({
         paymentId: this._paymentState.paymentId,
         checkoutKey: this._paymentState.checkoutKey,
         environment: this._config.environment,
@@ -1489,7 +1480,7 @@ export {
   D as AddressStateElement,
   O as AddressStreetElement,
   Z as AddressZipCodeElement,
-  Q as ApplePayElement,
+  U as ApplePayElement,
   d as BaseElement,
   Y as CardElement,
   X as CardholderElement,

package/dist/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@odus/checkout",
-  "version": "0.29.0",
+  "version": "0.29.1",
   "displayName": "Odus Checkout SDK",
   "keywords": [
     "odus",

package/dist/phone.js

@@ -537,7 +537,7 @@ function P(e, t) {
 function Ge(e, t) {
   var r = typeof Symbol < "u" && e[Symbol.iterator] || e["@@iterator"];
   if (r) return (r = r.call(e)).next.bind(r);
-  if (Array.isArray(e) || (r = Be(e)) || t) {
+  if (Array.isArray(e) || (r = je(e)) || t) {
     r && (e = r);
     var n = 0;
     return function() {
@@ -547,7 +547,7 @@ function Ge(e, t) {
   throw new TypeError(`Invalid attempt to iterate non-iterable instance.
 In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
 }
-function Be(e, t) {
+function je(e, t) {
   if (e) {
     if (typeof e == "string") return It(e, t);
     var r = {}.toString.call(e).slice(8, -1);
@@ -559,7 +559,7 @@ function It(e, t) {
   for (var r = 0, n = Array(t); r < t; r++) n[r] = e[r];
   return n;
 }
-var je = ["MOBILE", "PREMIUM_RATE", "TOLL_FREE", "SHARED_COST", "VOIP", "PERSONAL_NUMBER", "PAGER", "UAN", "VOICEMAIL"];
+var Be = ["MOBILE", "PREMIUM_RATE", "TOLL_FREE", "SHARED_COST", "VOIP", "PERSONAL_NUMBER", "PAGER", "UAN", "VOICEMAIL"];
 function mt(e, t, r) {
   if (t = t || {}, !(!e.country && !e.countryCallingCode)) {
     r = new c(r), r.selectNumberingPlan(e.country, e.countryCallingCode);
@@ -567,7 +567,7 @@ function mt(e, t, r) {
     if (P(n, r.nationalNumberPattern())) {
       if (nt(n, "FIXED_LINE", r))
         return r.type("MOBILE") && r.type("MOBILE").pattern() === "" || !r.type("MOBILE") || nt(n, "MOBILE", r) ? "FIXED_LINE_OR_MOBILE" : "FIXED_LINE";
-      for (var d = Ge(je), i; !(i = d()).done; ) {
+      for (var d = Ge(Be), i; !(i = d()).done; ) {
         var a = i.value;
         if (nt(n, a, r))
           return a;
@@ -1303,10 +1303,10 @@ function X(e) {
   }
   return t;
 }
-function Br(e, t) {
+function jr(e, t) {
   var r = typeof Symbol < "u" && e[Symbol.iterator] || e["@@iterator"];
   if (r) return (r = r.call(e)).next.bind(r);
-  if (Array.isArray(e) || (r = jr(e)) || t) {
+  if (Array.isArray(e) || (r = Br(e)) || t) {
     r && (e = r);
     var n = 0;
     return function() {
@@ -1316,7 +1316,7 @@ function Br(e, t) {
   throw new TypeError(`Invalid attempt to iterate non-iterable instance.
 In order to be iterable, non-array objects must have a [Symbol.iterator]() method.`);
 }
-function jr(e, t) {
+function Br(e, t) {
   if (e) {
     if (typeof e == "string") return Mt(e, t);
     var r = {}.toString.call(e).slice(8, -1);
@@ -1329,7 +1329,7 @@ function Mt(e, t) {
   return n;
 }
 function Lt(e) {
-  for (var t = "", r = Br(e.split("")), n; !(n = r()).done; ) {
+  for (var t = "", r = jr(e.split("")), n; !(n = r()).done; ) {
     var d = n.value;
     t += Ur(d, t) || "";
   }
@@ -1481,7 +1481,7 @@ function R(e) {
     return t && typeof Symbol == "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
   }, R(e);
 }
-function Bt(e, t) {
+function jt(e, t) {
   var r = Object.keys(e);
   if (Object.getOwnPropertySymbols) {
     var n = Object.getOwnPropertySymbols(e);
@@ -1491,12 +1491,12 @@ function Bt(e, t) {
   }
   return r;
 }
-function jt(e) {
+function Bt(e) {
   for (var t = 1; t < arguments.length; t++) {
     var r = arguments[t] != null ? arguments[t] : {};
-    t % 2 ? Bt(Object(r), !0).forEach(function(n) {
+    t % 2 ? jt(Object(r), !0).forEach(function(n) {
       ln(e, n, r[n]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : Bt(Object(r)).forEach(function(n) {
+    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(r)) : jt(Object(r)).forEach(function(n) {
       Object.defineProperty(e, n, Object.getOwnPropertyDescriptor(r, n));
     });
   }
@@ -1520,7 +1520,7 @@ function fn(e, t) {
   return (t === "string" ? String : Number)(e);
 }
 function cn(e, t, r) {
-  return dn(e, jt(jt({}, t), {}, {
+  return dn(e, Bt(Bt({}, t), {}, {
     v2: !0
   }), r);
 }
@@ -1854,16 +1854,16 @@ function kn(e, t, r) {
 function Gn(e, t, r) {
   var n = r.metadata, d = r.shouldTryNationalPrefixFormattingRule, i = r.getSeparatorAfterNationalPrefix, a = new RegExp("^(?:".concat(t.pattern(), ")$"));
   if (a.test(e.nationalSignificantNumber))
-    return jn(e, t, {
+    return Bn(e, t, {
       metadata: n,
       shouldTryNationalPrefixFormattingRule: d,
       getSeparatorAfterNationalPrefix: i
     });
 }
-function Bn(e, t, r) {
+function jn(e, t, r) {
   return q(e, t, r) === "IS_POSSIBLE";
 }
-function jn(e, t, r) {
+function Bn(e, t, r) {
   var n = r.metadata, d = r.shouldTryNationalPrefixFormattingRule, i = r.getSeparatorAfterNationalPrefix;
   if (e.nationalSignificantNumber, e.international, e.nationalPrefix, e.carrierCode, d(t)) {
     var a = Xt(e, t, {
@@ -2215,13 +2215,13 @@ function ht(e, t, r) {
       throw new Error("Unsupported instruction tree: ".concat(t));
   }
 }
-function B(e) {
+function j(e) {
   "@babel/helpers - typeof";
-  return B = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
+  return j = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
     return typeof t;
   } : function(t) {
     return t && typeof Symbol == "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
-  }, B(e);
+  }, j(e);
 }
 function Qt(e, t) {
   var r = typeof Symbol < "u" && e[Symbol.iterator] || e["@@iterator"];
@@ -2262,14 +2262,14 @@ function ud(e, t, r) {
 }
 function $d(e) {
   var t = ld(e, "string");
-  return B(t) == "symbol" ? t : t + "";
+  return j(t) == "symbol" ? t : t + "";
 }
 function ld(e, t) {
-  if (B(e) != "object" || !e) return e;
+  if (j(e) != "object" || !e) return e;
   var r = e[Symbol.toPrimitive];
   if (r !== void 0) {
     var n = r.call(e, t);
-    if (B(n) != "object") return n;
+    if (j(n) != "object") return n;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
   return String(e);
@@ -2304,7 +2304,7 @@ var gt = "9", sd = 15, fd = K(gt, sd), cd = /[- ]/, hd = function() {
     key: "format",
     value: function(r, n) {
       var d = this;
-      if (Bn(n.nationalSignificantNumber, n.country, this.metadata))
+      if (jn(n.nationalSignificantNumber, n.country, this.metadata))
         for (var i = Qt(this.matchingFormats), a; !(a = i()).done; ) {
           var o = a.value, u = Gn(n, o, {
             metadata: this.metadata,
@@ -2468,13 +2468,13 @@ var gt = "9", sd = 15, fd = K(gt, sd), cd = /[- ]/, hd = function() {
     }
   }]);
 }();
-function j(e) {
+function B(e) {
   "@babel/helpers - typeof";
-  return j = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
+  return B = typeof Symbol == "function" && typeof Symbol.iterator == "symbol" ? function(t) {
     return typeof t;
   } : function(t) {
     return t && typeof Symbol == "function" && t.constructor === Symbol && t !== Symbol.prototype ? "symbol" : typeof t;
-  }, j(e);
+  }, B(e);
 }
 function me(e, t) {
   return Cd(e) || bd(e, t) || vd(e, t) || pd();
@@ -2530,14 +2530,14 @@ function Ed(e, t, r) {
 }
 function Sd(e) {
   var t = xd(e, "string");
-  return j(t) == "symbol" ? t : t + "";
+  return B(t) == "symbol" ? t : t + "";
 }
 function xd(e, t) {
-  if (j(e) != "object" || !e) return e;
+  if (B(e) != "object" || !e) return e;
   var r = e[Symbol.toPrimitive];
   if (r !== void 0) {
     var n = r.call(e, t);
-    if (j(n) != "object") return n;
+    if (B(n) != "object") return n;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
   return String(e);
@@ -2732,7 +2732,7 @@ function U(e) {
   }, U(e);
 }
 function Md(e, t) {
-  return Bd(e) || Gd(e, t) || kd(e, t) || Ld();
+  return jd(e) || Gd(e, t) || kd(e, t) || Ld();
 }
 function Ld() {
   throw new TypeError(`Invalid attempt to destructure non-iterable instance.
@@ -2768,10 +2768,10 @@ function Gd(e, t) {
     return o;
   }
 }
-function Bd(e) {
+function jd(e) {
   if (Array.isArray(e)) return e;
 }
-function jd(e, t) {
+function Bd(e, t) {
   if (!(e instanceof t)) throw new TypeError("Cannot call a class as a function");
 }
 function Ud(e, t) {
@@ -2799,7 +2799,7 @@ function Wd(e, t) {
 }
 var pe = /* @__PURE__ */ function() {
   function e(t, r) {
-    jd(this, e), this.metadata = new c(r);
+    Bd(this, e), this.metadata = new c(r);
     var n = this.getCountryAndCallingCode(t), d = Md(n, 2), i = d[0], a = d[1];
     this.defaultCountry = i, this.defaultCallingCode = a, this.reset();
   }
@@ -3268,7 +3268,9 @@ class qd extends E {
     }), this.inputElement.addEventListener("focus", () => {
       this.containerElement.addClass("focused");
     }), this.inputElement.addEventListener("blur", (v) => {
-      this.containerElement.removeClass("focused"), this.validateInput(this.inputElement.getElement().value, !0), this.onBlur(v);
+      this.containerElement.removeClass("focused"), setTimeout(() => {
+        this.validateInput(this.inputElement.getElement().value, !0), this.onBlur(v);
+      }, 0);
     }), i && this.inputElement.addEventListener("keydown", (v) => {
       const rt = v;
       rt.key === "Tab" && !rt.shiftKey && (rt.preventDefault(), i());
@@ -3290,7 +3292,12 @@ class qd extends E {
       if (a?.countryCode && a.countryCode !== this.currentCountryCode) {
         this.currentCountryCode = a.countryCode, this.updateSelectAndFlag(a.countryCode), r.placeholder = T(a.countryCode);
         const o = this.countryCodeInput.getElement();
-        o.value = a.countryCode, o.dispatchEvent(new Event("input", { bubbles: !0 }));
+        o.value = a.countryCode;
+        const u = new Event("input", { bubbles: !0 });
+        Object.defineProperty(u, "target", {
+          writable: !1,
+          value: { name: "phoneCountryCode", value: a.countryCode }
+        }), this.onChange(u);
       }
     } else {
       const a = this.countrySelect.getElement().value;
@@ -3319,7 +3326,10 @@ class qd extends E {
     const d = this.countryCodeInput.getElement();
     d.value = t;
     const i = new Event("input", { bubbles: !0 });
-    if (d.dispatchEvent(i), this.onChange(i), n.startsWith("+")) {
+    if (Object.defineProperty(i, "target", {
+      writable: !1,
+      value: { name: "phoneCountryCode", value: t }
+    }), this.onChange(i), n.startsWith("+")) {
       const a = A(n);
       !a || a.countryCode !== t ? this.showValidationError() : this.clearValidationError();
       return;
@@ -3372,7 +3382,7 @@ class qd extends E {
   }
   setValue(t) {
     if (!t)
-      return this.inputElement.getElement().value = "", this.userSelectedCountry = !1, this;
+      return this.inputElement.getElement().value ? this : (this.inputElement.getElement().value = "", this.userSelectedCountry = !1, this);
     if (t.startsWith("+")) {
       const r = A(t);
       if (r) {