@test-glide/glide-payment 0.0.2 → 0.0.3

package/dist/react/react.es.js

@@ -1,23 +1,23 @@
 import { jsx as Q } from "react/jsx-runtime";
 import { useRef as X, useEffect as ee } from "react";
 function p(n, e = {}) {
-  const t = document.createElement(n), { className: o, id: s, innerHTML: m, textContent: r, attributes: c, styles: d, dataset: i, children: l, events: h } = e;
-  if (o) {
-    const u = Array.isArray(o) ? o : o.split(" ");
+  const t = document.createElement(n), { className: a, id: r, innerHTML: m, textContent: i, attributes: c, styles: d, dataset: s, children: o, events: h } = e;
+  if (a) {
+    const u = Array.isArray(a) ? a : a.split(" ");
     t.classList.add(...u.filter(Boolean));
   }
-  if (s && (t.id = s), m && (t.innerHTML = m), r && (t.textContent = r), c)
-    for (const [u, a] of Object.entries(c))
-      a && t.setAttribute(u, a);
+  if (r && (t.id = r), m && (t.innerHTML = m), i && (t.textContent = i), c)
+    for (const [u, l] of Object.entries(c))
+      l && t.setAttribute(u, l);
   if (d)
-    for (const [u, a] of Object.entries(d))
-      t.style[u] = a;
-  if (i)
-    for (const [u, a] of Object.entries(i))
-      t.dataset[u] = a;
-  if (l && t.append(...l.filter(Boolean)), h)
-    for (const [u, a] of Object.entries(h))
-      t.addEventListener(u, a);
+    for (const [u, l] of Object.entries(d))
+      t.style[u] = l;
+  if (s)
+    for (const [u, l] of Object.entries(s))
+      t.dataset[u] = l;
+  if (o && t.append(...o.filter(Boolean)), h)
+    for (const [u, l] of Object.entries(h))
+      t.addEventListener(u, l);
   return t;
 }
 function x(n, e) {
@@ -26,26 +26,26 @@ function x(n, e) {
     console.warn("updateElements: no elements found for", n);
     return;
   }
-  for (const o of t) {
-    const { styles: s, attributes: m, dataset: r, innerHTML: c, textContent: d, className: i } = e;
-    if (s)
-      for (const [l, h] of Object.entries(s))
-        o.style[l] = h;
-    if (m)
-      for (const [l, h] of Object.entries(m))
-        o.setAttribute(l, h);
+  for (const a of t) {
+    const { styles: r, attributes: m, dataset: i, innerHTML: c, textContent: d, className: s } = e;
     if (r)
-      for (const [l, h] of Object.entries(r))
-        o.dataset[l] = h;
-    if (c !== void 0 && (o.innerHTML = c), d !== void 0 && (o.textContent = d), i?.add) {
-      const l = Array.isArray(i.add) ? i.add : [i.add];
-      o.classList.add(...l);
+      for (const [o, h] of Object.entries(r))
+        a.style[o] = h;
+    if (m)
+      for (const [o, h] of Object.entries(m))
+        a.setAttribute(o, h);
+    if (i)
+      for (const [o, h] of Object.entries(i))
+        a.dataset[o] = h;
+    if (c !== void 0 && (a.innerHTML = c), d !== void 0 && (a.textContent = d), s?.add) {
+      const o = Array.isArray(s.add) ? s.add : [s.add];
+      a.classList.add(...o);
     }
-    if (i?.remove) {
-      const l = Array.isArray(i.remove) ? i.remove : [i.remove];
-      o.classList.remove(...l);
+    if (s?.remove) {
+      const o = Array.isArray(s.remove) ? s.remove : [s.remove];
+      a.classList.remove(...o);
     }
-    i?.toggle && (Array.isArray(i.toggle) ? i.toggle : [i.toggle]).forEach((h) => o.classList.toggle(h));
+    s?.toggle && (Array.isArray(s.toggle) ? s.toggle : [s.toggle]).forEach((h) => a.classList.toggle(h));
   }
 }
 const te = `
@@ -95,7 +95,7 @@ const te = `
   ></path>
 </svg>`, k = `
 <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor" viewBox="0 0 256 256"><path d="M128,24A104,104,0,1,0,232,128,104.11,104.11,0,0,0,128,24Zm0,192a88,88,0,1,1,88-88A88.1,88.1,0,0,1,128,216Zm16-40a8,8,0,0,1-8,8,16,16,0,0,1-16-16V128a8,8,0,0,1,0-16,16,16,0,0,1,16,16v40A8,8,0,0,1,144,176ZM112,84a12,12,0,1,1,12,12A12,12,0,0,1,112,84Z"></path></svg>  
-`, se = ({ children: n, onClick: e, disabled: t = !1, size: o = "medium", type: s = "button", className: m = "", variant: r = "primary" }) => {
+`, se = ({ children: n, onClick: e, disabled: t = !1, size: a = "medium", type: r = "button", className: m = "", variant: i = "primary" }) => {
   const c = p("span", {
     className: "button-spinner",
     innerHTML: ne,
@@ -106,10 +106,10 @@ const te = `
       null
     ],
     textContent: n
-  }), i = p("button", {
-    className: `custom-button ${r} ${o} ${m}`,
+  }), s = p("button", {
+    className: `custom-button ${i} ${a} ${m}`,
     attributes: {
-      type: s,
+      type: r,
       ...t ? { disabled: "true" } : {}
     },
     events: {
@@ -119,25 +119,25 @@ const te = `
       c,
       d
     ]
-  }), l = (u = !1) => {
+  }), o = (u = !1) => {
     x({ element: c }, {
       dataset: { show: String(u) }
     }), h(u);
   }, h = (u = !1) => {
-    u ? i.setAttribute("disabled", "true") : i.removeAttribute("disabled");
+    u ? s.setAttribute("disabled", "true") : s.removeAttribute("disabled");
   };
   return {
-    element: i,
-    setLoading: l,
+    element: s,
+    setLoading: o,
     setDisabled: h
   };
-}, oe = ({ content: n, position: e = "top", delay: t = 200, maxWidth: o = 250, className: s = "", id: m = "" }) => {
-  var r = p("div", {
-    className: `tooltip ${e} ${s}`,
+}, oe = ({ content: n, position: e = "top", delay: t = 200, maxWidth: a = 250, className: r = "", id: m = "" }) => {
+  var i = p("div", {
+    className: `tooltip ${e} ${r}`,
     styles: {
       // top: `${tooltipPosition.top}px`,
       // left: `${tooltipPosition.left}px`,
-      maxWidth: `${o}px`
+      maxWidth: `${a}px`
     },
     attributes: {
       role: "tooltip"
@@ -149,71 +149,71 @@ const te = `
     `
   });
   let c = null;
-  var l = p("span", {
+  var o = p("span", {
     className: "tooltip-trigger",
     innerHTML: k,
     events: {
       mouseenter: () => {
         t > 0 ? c = window.setTimeout(() => {
-          r.dataset.show = "true", h();
-        }, t) : (r.dataset.show = "true", h());
+          i.dataset.show = "true", h();
+        }, t) : (i.dataset.show = "true", h());
       },
       mouseleave: () => {
-        c && clearTimeout(c), r.dataset.show = "false";
+        c && clearTimeout(c), i.dataset.show = "false";
       }
     }
   });
   function h() {
-    if (!l || !r) return;
-    const a = l.getBoundingClientRect(), v = r.getBoundingClientRect(), y = 8;
+    if (!o || !i) return;
+    const l = o.getBoundingClientRect(), v = i.getBoundingClientRect(), y = 8;
     let w, g;
     switch (e) {
       case "top":
-        w = a.top - v.height - y, g = a.left + a.width / 2 - v.width / 2;
+        w = l.top - v.height - y, g = l.left + l.width / 2 - v.width / 2;
         break;
       case "bottom":
-        w = a.bottom + y, g = a.left + a.width / 2 - v.width / 2;
+        w = l.bottom + y, g = l.left + l.width / 2 - v.width / 2;
         break;
       case "left":
-        w = a.top + a.height / 2 - v.height / 2, g = a.left - v.width - y;
+        w = l.top + l.height / 2 - v.height / 2, g = l.left - v.width - y;
         break;
       case "right":
-        w = a.top + a.height / 2 - v.height / 2, g = a.right + y;
+        w = l.top + l.height / 2 - v.height / 2, g = l.right + y;
         break;
       default:
-        w = a.top - v.height - y, g = a.left + a.width / 2 - v.width / 2;
+        w = l.top - v.height - y, g = l.left + l.width / 2 - v.width / 2;
     }
     const N = window.innerWidth, M = window.innerHeight;
-    g < 0 && (g = y), g + v.width > N && (g = N - v.width - y), w < 0 && (w = y), w + v.height > M && (w = M - v.height - y), r.style.top = `${w}px`, r.style.left = `${g}px`;
+    g < 0 && (g = y), g + v.width > N && (g = N - v.width - y), w < 0 && (w = y), w + v.height > M && (w = M - v.height - y), i.style.top = `${w}px`, i.style.left = `${g}px`;
   }
   return p("div", {
     className: "tooltip-wrapper",
     id: `tooltip-${m}`,
     children: [
-      l,
-      r
+      o,
+      i
     ]
   });
 }, ae = (n) => {
   const e = {}, t = Object.values(n).every(
-    (s) => !s || s.trim() === ""
-  ), o = n.cardNumber?.replace(/\s/g, "");
-  if (o ? /^\d{13,19}$/.test(o) || (e.cardNumber = "Card number must be 13-19 digits") : e.cardNumber = "Card number is required", !n.expiryDate)
+    (r) => !r || r.trim() === ""
+  ), a = n.cardNumber?.replace(/\s/g, "");
+  if (a ? /^\d{13,19}$/.test(a) || (e.cardNumber = "Card number must be 13-19 digits") : e.cardNumber = "Card number is required", !n.expiryDate)
     e.expiryDate = "Expiry date is required";
   else {
-    const s = n.expiryDate.replace(/\D/g, "");
-    if (s.length < 4)
+    const r = n.expiryDate.replace(/\D/g, "");
+    if (r.length < 4)
       e.expiryDate = "Enter complete expiry date (MM/YY)";
     else {
-      const m = parseInt(s.substring(0, 2), 10), r = parseInt(s.substring(2, 4), 10);
+      const m = parseInt(r.substring(0, 2), 10), i = parseInt(r.substring(2, 4), 10);
       if (isNaN(m) || m < 1 || m > 12)
         e.expiryDate = "Invalid month (must be 01-12)";
-      else if (isNaN(r) || r < 0 || r > 99)
+      else if (isNaN(i) || i < 0 || i > 99)
         e.expiryDate = "Invalid year";
       else {
-        const c = /* @__PURE__ */ new Date(), d = c.getFullYear(), i = c.getMonth() + 1, l = Math.floor(d / 100) * 100, h = l + r, u = l + 100 + r;
-        let a;
-        h >= d && h <= d + 20 ? a = h : (u >= d && u <= d + 20, a = u), a < d || a === d && m < i ? e.expiryDate = "Card has expired" : a > d + 20 && (e.expiryDate = "Expiry year is too far in the future");
+        const c = /* @__PURE__ */ new Date(), d = c.getFullYear(), s = c.getMonth() + 1, o = Math.floor(d / 100) * 100, h = o + i, u = o + 100 + i;
+        let l;
+        h >= d && h <= d + 20 ? l = h : (u >= d && u <= d + 20, l = u), l < d || l === d && m < s ? e.expiryDate = "Card has expired" : l > d + 20 && (e.expiryDate = "Expiry year is too far in the future");
       }
     }
   }
@@ -226,9 +226,9 @@ const te = `
 function ie(n) {
   const e = parseInt(n, 10);
   if (isNaN(e) || e < 0 || e > 99) return null;
-  const t = (/* @__PURE__ */ new Date()).getFullYear(), o = Math.floor(t / 100) * 100;
-  let s = o + e;
-  return s >= t && s <= t + 20 || (s = o + 100 + e, s >= t && s <= t + 20) ? s : o + 100 + e;
+  const t = (/* @__PURE__ */ new Date()).getFullYear(), a = Math.floor(t / 100) * 100;
+  let r = a + e;
+  return r >= t && r <= t + 20 || (r = a + 100 + e, r >= t && r <= t + 20) ? r : a + 100 + e;
 }
 function V(n = "") {
   return n.trim().replaceAll(/\s/g, "").replaceAll("-", "");
@@ -252,47 +252,47 @@ const le = {
 function ce(n, e) {
   return e === "none" ? n : le[e](n);
 }
-const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholder: m = "Enter value", tooltip: r = "", onChange: c }) => {
-  const d = ["card", "expiry", "phone", "cvv", "zip"].includes(e) ? "numeric" : "", i = p("label", {
+const $ = ({ label: n, maskType: e, id: t, name: a, type: r = "text", placeholder: m = "Enter value", tooltip: i = "", onChange: c }) => {
+  const d = ["card", "expiry", "phone", "cvv", "zip"].includes(e) ? "numeric" : "", s = p("label", {
     className: "input-label",
     innerHTML: n,
     attributes: {
       for: t
     }
   });
-  let l = !1;
+  let o = !1;
   const u = p("input", {
     id: t || "input-id",
     className: "styled-input",
     attributes: {
       placeholder: m,
-      type: s,
+      type: r,
       inputMode: d,
-      name: o
+      name: a
     },
     events: {
-      input: a,
+      input: l,
       blur: v,
       keydown: (b) => {
-        b.key === "Enter" && (l = !0);
+        b.key === "Enter" && (o = !0);
       }
     }
   });
-  function a(b) {
+  function l(b) {
     const D = e !== "none" ? ce(b?.target?.value, e) : b?.target?.value;
     u.value = D, c?.(D);
   }
   function v() {
-    l = !0, c?.(u?.value || "");
+    o = !0, c?.(u?.value || "");
   }
   const y = p("div", {
     className: "input-loader",
     innerHTML: '<div class="loader"></div>',
     dataset: { show: "false" }
-  }), w = r ? p("div", {
+  }), w = i ? p("div", {
     className: "input-right-element",
     children: [
-      oe({ content: r, id: t })
+      oe({ content: i, id: t })
     ]
   }) : null, g = p("div", {
     className: "input-wrapper",
@@ -313,7 +313,7 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
     element: p("div", {
       className: "custom-input-group",
       children: [
-        i,
+        s,
         g,
         N
       ]
@@ -329,9 +329,9 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
     },
     setError: (b = "") => {
       x({ element: g }, {
-        className: b && l ? { add: "input-error" } : { remove: "input-error" }
+        className: b && o ? { add: "input-error" } : { remove: "input-error" }
       }), x({ element: N }, {
-        dataset: { show: b && l ? "true" : "false" },
+        dataset: { show: b && o ? "true" : "false" },
         innerHTML: `
       ${k}
       <span>${b || ""}</span>
@@ -340,75 +340,75 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
     }
   };
 }, de = async (n, e = {}) => {
-  const { method: t = "GET", headers: o = {}, body: s = null, ...m } = e;
+  const { method: t = "GET", headers: a = {}, body: r = null, ...m } = e;
   try {
-    const r = {
+    const i = {
       method: t,
       headers: {
         Accept: "*/*",
         "Content-Type": "application/json",
-        ...o
+        ...a
       },
       ...m
     };
-    s && ["POST", "PUT", "PATCH", "DELETE"].includes(t.toUpperCase()) && (r.body = typeof s == "string" ? s : JSON.stringify(s));
-    const c = await fetch(n, r), d = c.headers.get("content-type");
-    let i;
-    if (d?.includes("application/json") ? i = await c.json() : i = await c.text(), !c.ok) {
-      const l = i;
+    r && ["POST", "PUT", "PATCH", "DELETE"].includes(t.toUpperCase()) && (i.body = typeof r == "string" ? r : JSON.stringify(r));
+    const c = await fetch(n, i), d = c.headers.get("content-type");
+    let s;
+    if (d?.includes("application/json") ? s = await c.json() : s = await c.text(), !c.ok) {
+      const o = s;
       throw new Error(
-        l?.message || `HTTP error! status: ${c.status}`
+        o?.message || `HTTP error! status: ${c.status}`
       );
     }
-    return { data: i, error: null };
-  } catch (r) {
-    return { data: null, error: r instanceof Error ? r.message : "An error occurred" };
+    return { data: s, error: null };
+  } catch (i) {
+    return { data: null, error: i instanceof Error ? i.message : "An error occurred" };
   }
 }, ue = ({
   title: n = "",
   children: e,
   onClose: t,
-  showBackBtn: o = !1,
-  showCloseBtn: s = !0
+  showBackBtn: a = !1,
+  showCloseBtn: r = !0
 }) => {
   const m = p("button", {
     className: "back-btn",
     innerHTML: re,
-    dataset: { show: String(o) },
+    dataset: { show: String(a) },
     events: { click: () => h() }
-  }), r = p("h3", {
+  }), i = p("h3", {
     textContent: n
   }), c = p("button", {
     className: "close-btn",
     innerHTML: "&times;",
-    dataset: { show: String(s) },
+    dataset: { show: String(r) },
     attributes: { "aria-label": "Close modal" },
     events: { click: () => h() }
   }), d = p("div", {
     className: "modal-header",
-    children: [m, r, c]
-  }), i = p("div", {
+    children: [m, i, c]
+  }), s = p("div", {
     className: "modal-content",
     children: [e]
-  }), l = p("dialog", {
+  }), o = p("dialog", {
     className: "custom-modal",
-    children: [d, i],
+    children: [d, s],
     events: {
-      cancel: (a) => {
-        a.preventDefault(), h();
+      cancel: (l) => {
+        l.preventDefault(), h();
       }
     }
   }), h = () => {
-    l.close(), t?.();
+    o.close(), t?.();
   };
   return {
-    element: l,
-    setModalVisibility: (a) => {
-      a ? l.showModal() : l.close();
+    element: o,
+    setModalVisibility: (l) => {
+      l ? o.showModal() : o.close();
     }
   };
-}, pe = ({ token: n, endpoint: e, beneficiaryCard: t = !1, isModal: o = !1, onCallback: s = () => null }) => {
-  const m = t ? "Enter Recipient Debit Card Details" : "Enter Your Debit Card Details", r = t ? "Enter the debit card details of the recipient you're sending funds to." : "Linking an external account allows you to send and receive money to your account.", c = t ? "Debit Card Number" : "Your Debit Card Number", d = t ? "Enter recipient's card number" : "Enter your card number", i = `add-card-form-wrapper${t ? " recipient-form" : ""}`, l = {
+}, pe = ({ token: n, endpoint: e, beneficiaryCard: t = !1, isModal: a = !1, onCallback: r = () => null }) => {
+  const m = t ? "Enter Recipient Debit Card Details" : "Enter Your Debit Card Details", i = t ? "Enter the debit card details of the recipient you're sending funds to." : "Linking an external account allows you to send and receive money to your account.", c = t ? "Debit Card Number" : "Your Debit Card Number", d = t ? "Enter recipient's card number" : "Enter your card number", s = `add-card-form-wrapper${t ? " recipient-form" : ""}`, o = {
     cardNumber: "",
     expiryDate: "",
     cvv: "",
@@ -422,7 +422,7 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
     onChange(f) {
       L("cardNumber", f, u);
     }
-  }), { element: a, setError: v } = $({
+  }), { element: l, setError: v } = $({
     label: "Expiration Date",
     placeholder: "MM/YY",
     id: "expiry-input",
@@ -453,7 +453,7 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
     }
   }), M = p("div", {
     className: t ? "input-sections" : "inputs",
-    children: [h, a, y, g]
+    children: [h, l, y, g]
   }), A = p("p", {
     className: "submit-error",
     dataset: { show: "false" }
@@ -474,8 +474,8 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
     b(f), D(f);
   };
   function L(f, H, E) {
-    l[f] = H;
-    const { isValid: I, errors: T } = ae(l);
+    o[f] = H;
+    const { isValid: I, errors: T } = ae(o);
     T[f] ? E(T[f]) : E(""), b(!I);
   }
   const O = p("div", {
@@ -501,7 +501,7 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
         }
       }
     });
-    C.error ? (console.error("Request failed:", C.error), B(!1), z(C.error), s?.({ success: !1, error: C.error })) : (console.log("Request success:", C.data), B(!1), s?.({ success: !0, data: C.data }));
+    C.error ? (console.error("Request failed:", C.error), B(!1), z(C.error), r?.({ success: !1, error: C.error })) : (console.log("Request success:", C.data), B(!1), r?.({ success: !0, data: C.data }));
   }
   const Z = () => p("form", {
     events: {
@@ -514,7 +514,7 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
   }), W = () => p("div", {
     className: "form-title",
     innerHTML: `
-    <p>${r}</p>
+    <p>${i}</p>
 
     <div>
       ${te}
@@ -523,10 +523,10 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
     </div>
     `
   }), Y = () => p("div", {
-    className: o ? "" : "non-modal-content",
+    className: a ? "" : "non-modal-content",
     children: [W(), Z()]
-  }), R = o ? null : p("div", {
-    className: `${i} non-modal`,
+  }), R = a ? null : p("div", {
+    className: `${s} non-modal`,
     children: [
       p("div", {
         className: "non-modal-header",
@@ -538,12 +538,12 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
       }),
       Y()
     ]
-  }), { element: F, setModalVisibility: S } = o ? ue({ title: m, children: Y() }) : { element: null, setModalVisibility: () => {
+  }), { element: F, setModalVisibility: S } = a ? ue({ title: m, children: Y() }) : { element: null, setModalVisibility: () => {
   } };
   function q() {
     F && (document.body.appendChild(
       p("div", {
-        className: i,
+        className: s,
         children: [F]
       })
     ), S(!0));
@@ -554,24 +554,24 @@ const $ = ({ label: n, maskType: e, id: t, name: o, type: s = "text", placeholde
     closeModal: () => S(!1)
   };
 };
-function me({ token: n, endpoint: e, beneficiaryCard: t, isModal: o, onCallback: s }) {
-  const { renderFormWithModal: m, nonModalForm: r, closeModal: c } = pe({
+function me({ token: n, endpoint: e, beneficiaryCard: t, isModal: a, onCallback: r, onModalClose: m }) {
+  const { renderFormWithModal: i, nonModalForm: c, closeModal: d } = pe({
     token: n,
     endpoint: e,
     beneficiaryCard: t,
-    isModal: o,
-    onCallback: s
+    isModal: a,
+    onCallback: r
   });
   return {
-    mount(d) {
-      const i = "className" in d ? document.querySelector(d.className) : "id" in d ? document.getElementById(d.id) : d.element;
-      i && r && i.appendChild(r);
+    mount(s) {
+      const o = "className" in s ? document.querySelector(s.className) : "id" in s ? document.getElementById(s.id) : s.element;
+      o && c && o.appendChild(c);
     },
     open() {
-      m();
+      i();
     },
     destroy() {
-      c();
+      d(), m?.();
     }
   };
 }
@@ -579,29 +579,31 @@ function ve({
   token: n,
   endpoint: e,
   isModal: t = !1,
-  beneficiaryCard: o = !1,
-  isOpen: s = !1,
-  onCallback: m = () => null
+  beneficiaryCard: a = !1,
+  isOpen: r = !1,
+  onCallback: m = () => null,
+  onClose: i = () => null
 }) {
-  const r = X(null);
+  const c = X(null);
   return ee(() => {
-    let c = me({
+    let d = me({
       token: n,
       endpoint: e,
-      beneficiaryCard: o,
+      beneficiaryCard: a,
       isModal: t,
-      onCallback: m
+      onCallback: m,
+      onModalClose: i
     });
     if (t)
-      s ? c.open() : c.destroy();
+      r ? d.open() : d.destroy();
     else {
-      if (!r?.current) return;
-      c.mount({ element: r.current });
+      if (!c?.current) return;
+      d.mount({ element: c.current });
     }
     return () => {
-      c.destroy();
+      d.destroy();
     };
-  }, [t, n, e, o, s]), t ? null : /* @__PURE__ */ Q("div", { ref: r });
+  }, [t, n, e, a, r]), t ? null : /* @__PURE__ */ Q("div", { ref: c });
 }
 export {
   ve as AddCard

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@test-glide/glide-payment",  
-  "version": "0.0.2",
+  "version": "0.0.3",
   "type": "module",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.es.js",