@odus/checkout 1.2.0 → 1.2.1

package/dist/checkout.es.js

@@ -888,6 +888,8 @@ class ge {
   vgsHelperText = null;
   wrapperElement;
   _vgsFieldsReady = !1;
+  _fieldHeight = "38.5px";
+  _borderRadius = 0;
   constructor(e) {
     const {
       value: t,
@@ -910,7 +912,9 @@ class ge {
     );
   }
   buildVgsLayout(e, t) {
-    const s = e.styles.borderRadius, a = document.createElement("div");
+    const s = e.styles.borderRadius;
+    this._borderRadius = s;
+    const a = document.createElement("div");
     a.style.marginBottom = "4px";
     const i = document.createElement("label");
     i.className = "input-label", i.textContent = t("cardholderNameLabel"), i.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, i.style.fontSize = `${e.styles.fontSize}px`, a.appendChild(i), this.wrapperElement.appendChild(a), this.vgsWrapper = document.createElement("div"), this.vgsWrapper.className = "vgs-wrap", this.vgsWrapper.style.position = "relative", this.vgsWrapper.style.borderRadius = `${s}px`, this.vgsWrapper.style.height = "38.5px", this.vgsWrapper.style.width = "100%", this.vgsWrapper.style.overflow = "hidden";
@@ -950,11 +954,19 @@ class ge {
     const a = t[R.CARDHOLDER];
     a ? (this.vgsHelperText.setText(a), this.vgsHelperText.toggleVisibility(!0)) : this.vgsHelperText.toggleVisibility(!1);
   }
+  setFieldHeight(e) {
+    this._fieldHeight = e, this.vgsWrapper && (this.vgsWrapper.style.height = e);
+  }
+  setBorderRadius(e) {
+    this._borderRadius = e, this.vgsWrapper && (this.vgsWrapper.style.borderRadius = `${e}px`);
+  }
   hideFakePlaceholder() {
     if (!this.vgsWrapper) return;
     this._vgsFieldsReady = !0, this.vgsWrapper.style.overflow = "visible", this.vgsWrapper.style.transition = "box-shadow 0.1s ease-in", this.vgsWrapper.style.boxShadow = "0 0 0 1px #e0e0e0, 0 2px 4px 0 rgba(0,0,0,0.07), 0 1px 1.5px 0 rgba(0,0,0,0.05)";
     const e = this.vgsWrapper.querySelector(".vgs-field-skeleton");
-    e && e.remove(), this.vgsContainer?.querySelectorAll("iframe").forEach((t) => t.style.height = "38.5px");
+    e && e.remove(), this.vgsContainer?.querySelectorAll("iframe").forEach((t) => {
+      t.style.height = this._fieldHeight, t.style.borderRadius = `${this._borderRadius}px`;
+    });
   }
   getValue() {
     return this.isVgsMode ? "" : this.input?.getValue() ?? "";
@@ -1525,6 +1537,12 @@ class Ce {
       e,
       a
     );
+    if (this.cardholderSection && i.cardholderName) {
+      const n = i.cardholderName;
+      typeof n.height == "string" && this.cardholderSection.setFieldHeight(n.height);
+      const r = n["border-radius"];
+      typeof r == "string" && this.cardholderSection.setBorderRadius(parseFloat(r));
+    }
     this.vgsService.mountCardFields(
       {
         cardNumber: t.cardNumber ? `#${t.cardNumber}` : void 0,

package/dist/package.json

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

package/dist/shared.js

@@ -370,7 +370,7 @@ const ap = (r) => {
     url: e,
     app: {
       name: "odus-checkout",
-      version: "1.2.0",
+      version: "1.2.1",
       environment: r.environment === "test" ? "sandbox" : "production"
     },
     isolate: !0,

package/package.json

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