@opexa/portal-components 0.0.8 → 0.0.10

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositQrCode.mjs

@@ -1,17 +1,18 @@
-import { QrCode as t, Portal as a } from "@ark-ui/react";
-import o from "../../../../_virtual/image.mjs";
+import { j as e } from "../../../../_virtual/jsx-runtime.mjs";
+import { QrCode as r, Portal as s } from "@ark-ui/react";
+import i from "../../../../_virtual/image.mjs";
 import { QrCode02Icon as l } from "../../../../icons/QrCode02Icon.mjs";
 import { SpinnerIcon as m } from "../../../../icons/SpinnerIcon.mjs";
-import { XIcon as c } from "../../../../icons/XIcon.mjs";
+import { XIcon as a } from "../../../../icons/XIcon.mjs";
 import n from "../../../../images/qrph-icon.png.mjs";
 import "../../../../ui/AlertDialog/AlertDialog.mjs";
 import "../../../../ui/Avatar/Avatar.mjs";
 import "../../../../ui/Badge/Badge.mjs";
-import { Button as r } from "../../../../ui/Button/Button.mjs";
+import { Button as o } from "../../../../ui/Button/Button.mjs";
 import "../../../../ui/Checkbox/Checkbox.mjs";
 import "../../../../ui/Clipboard/Clipboard.mjs";
 import "../../../../ui/DatePicker/DatePicker.mjs";
-import { Root as i, Trigger as s, Backdrop as p, Positioner as d, Content as g, CloseTrigger as u, Body as R, Title as x, Description as E } from "../../../../ui/Dialog/Dialog.mjs";
+import { Root as c, Trigger as d, Backdrop as p, Positioner as x, Content as g, CloseTrigger as h, Body as u, Title as j, Description as f } from "../../../../ui/Dialog/Dialog.mjs";
 import "../../../../ui/Drawer/Drawer.mjs";
 import "../../../../ui/Field/Field.mjs";
 import "../../../../utils/capitalize.mjs";
@@ -31,59 +32,106 @@ import "../../../../ui/SegmentGroup/SegmentGroup.mjs";
 import "../../../../ui/Select/Select.mjs";
 import "../../../../ui/Table/Table.mjs";
 import "../../../../ui/Tabs/Tabs.mjs";
-import { useQRPHDepositContext as f } from "./QRPHDepositContext.mjs";
-function ee() {
-  const e = f();
-  return /* @__PURE__ */ React.createElement("div", { className: "bg-gray-50 rounded-lg px-10 py-12 lg:p-16" }, /* @__PURE__ */ React.createElement("p", { className: "mt-5 text-center text-lg font-semibold lg:text-xl" }, "QR Code"), /* @__PURE__ */ React.createElement("p", { className: "text-gray-700 mt-3 text-center text-sm lg:text-base" }, "Scan the QR code below with your banking app, or upload it to complete your deposit."), /* @__PURE__ */ React.createElement(
-    t.Root,
-    {
-      value: e.qrCode ?? "",
-      className: "border-gray-200 mx-auto mt-6 w-[12.5rem] rounded-lg border bg-white p-5 lg:w-[13rem] lg:p-6"
-    },
-    /* @__PURE__ */ React.createElement("div", { className: "relative" }, /* @__PURE__ */ React.createElement(t.Frame, { className: "border-gray-200 mx-auto size-[10rem] rounded-[0.25rem] border" }, /* @__PURE__ */ React.createElement(t.Pattern, null)), /* @__PURE__ */ React.createElement(t.Overlay, { className: "bg-white p-0.5" }, /* @__PURE__ */ React.createElement(
-      o,
+import { useQRPHDepositContext as y } from "./QRPHDepositContext.mjs";
+function re() {
+  const t = y();
+  return /* @__PURE__ */ e.jsxs("div", { className: "bg-gray-50 rounded-lg px-10 py-12 lg:p-16", children: [
+    /* @__PURE__ */ e.jsx("p", { className: "mt-5 text-center text-lg font-semibold lg:text-xl", children: "QR Code" }),
+    /* @__PURE__ */ e.jsx("p", { className: "text-gray-700 mt-3 text-center text-sm lg:text-base", children: "Scan the QR code below with your banking app, or upload it to complete your deposit." }),
+    /* @__PURE__ */ e.jsxs(
+      r.Root,
       {
-        src: n,
-        alt: "",
-        className: "size-8",
-        width: 40,
-        height: 40
+        value: t.qrCode ?? "",
+        className: "border-gray-200 mx-auto mt-6 w-[12.5rem] rounded-lg border bg-white p-5 lg:w-[13rem] lg:p-6",
+        children: [
+          /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+            /* @__PURE__ */ e.jsx(r.Frame, { className: "border-gray-200 mx-auto size-[10rem] rounded-[0.25rem] border", children: /* @__PURE__ */ e.jsx(r.Pattern, {}) }),
+            /* @__PURE__ */ e.jsx(r.Overlay, { className: "bg-white p-0.5", children: /* @__PURE__ */ e.jsx(
+              i,
+              {
+                src: n,
+                alt: "",
+                className: "size-8",
+                width: 40,
+                height: 40
+              }
+            ) })
+          ] }),
+          /* @__PURE__ */ e.jsx(
+            r.DownloadTrigger,
+            {
+              fileName: `qrcode-${(/* @__PURE__ */ new Date()).getTime()}`,
+              mimeType: "image/png",
+              className: "text-gray-900 mt-5 block w-full text-center text-sm font-semibold",
+              children: "Download QR Code"
+            }
+          )
+        ]
       }
-    ))),
-    /* @__PURE__ */ React.createElement(
-      t.DownloadTrigger,
-      {
-        fileName: `qrcode-${(/* @__PURE__ */ new Date()).getTime()}`,
-        mimeType: "image/png",
-        className: "text-gray-900 mt-5 block w-full text-center text-sm font-semibold"
-      },
-      "Download QR Code"
-    )
-  ), e.view === "QR_CODE" && /* @__PURE__ */ React.createElement("div", { className: "mt-6 flex flex-col gap-4 lg:flex-row" }, /* @__PURE__ */ React.createElement(
-    r,
-    {
-      size: "sm",
-      variant: "outline",
-      colorScheme: "gray",
-      onClick: () => {
-        e.reset();
-      }
-    },
-    "Generate New QR Code"
-  ), /* @__PURE__ */ React.createElement(
-    r,
-    {
-      size: "sm",
-      onClick: () => {
-        e.verify();
-      }
-    },
-    "Confirm Deposit"
-  )), e.view === "VERIFYING" && /* @__PURE__ */ React.createElement("div", { className: "border-gray-200 mt-6 rounded-lg border bg-white p-4 lg:p-6" }, /* @__PURE__ */ React.createElement(m, { className: "mx-auto size-6 lg:size-8" }), /* @__PURE__ */ React.createElement("p", { className: "mt-5 text-center font-semibold lg:text-lg" }, "Processing your deposit"), /* @__PURE__ */ React.createElement("p", { className: "text-gray-700 mx-auto mt-2 text-center text-xs lg:text-sm" }, "Your deposit is being processed. ", /* @__PURE__ */ React.createElement("br", null), "Please hold tight as we verify the account details and amount.")), /* @__PURE__ */ React.createElement(y, null));
+    ),
+    t.view === "QR_CODE" && /* @__PURE__ */ e.jsxs("div", { className: "mt-6 flex flex-col gap-4 lg:flex-row", children: [
+      /* @__PURE__ */ e.jsx(
+        o,
+        {
+          size: "sm",
+          variant: "outline",
+          colorScheme: "gray",
+          onClick: () => {
+            t.reset();
+          },
+          children: "Generate New QR Code"
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        o,
+        {
+          size: "sm",
+          onClick: () => {
+            t.verify();
+          },
+          children: "Confirm Deposit"
+        }
+      )
+    ] }),
+    t.view === "VERIFYING" && /* @__PURE__ */ e.jsxs("div", { className: "border-gray-200 mt-6 rounded-lg border bg-white p-4 lg:p-6", children: [
+      /* @__PURE__ */ e.jsx(m, { className: "mx-auto size-6 lg:size-8" }),
+      /* @__PURE__ */ e.jsx("p", { className: "mt-5 text-center font-semibold lg:text-lg", children: "Processing your deposit" }),
+      /* @__PURE__ */ e.jsxs("p", { className: "text-gray-700 mx-auto mt-2 text-center text-xs lg:text-sm", children: [
+        "Your deposit is being processed. ",
+        /* @__PURE__ */ e.jsx("br", {}),
+        "Please hold tight as we verify the account details and amount."
+      ] })
+    ] }),
+    /* @__PURE__ */ e.jsx(N, {})
+  ] });
 }
-function y() {
-  return /* @__PURE__ */ React.createElement("p", { className: "text-gray-500 mt-6 text-center text-xs" }, "Need help using the QR Code?", " ", /* @__PURE__ */ React.createElement(i, { lazyMount: !0, unmountOnExit: !0 }, /* @__PURE__ */ React.createElement(s, { className: "text-blue-500" }, "See instructions"), /* @__PURE__ */ React.createElement(a, null, /* @__PURE__ */ React.createElement(p, { className: "!z-[calc(var(--z-dialog)+2)]" }), /* @__PURE__ */ React.createElement(d, { className: "!z-[calc(var(--z-dialog)+3)] flex items-center justify-center" }, /* @__PURE__ */ React.createElement(g, { className: "mx-auto w-[calc(100%-2rem)] rounded-lg bg-white p-4xl lg:w-[33.625rem]" }, /* @__PURE__ */ React.createElement(u, null, /* @__PURE__ */ React.createElement(c, null)), /* @__PURE__ */ React.createElement(R, null, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-xl" }, /* @__PURE__ */ React.createElement("div", { className: "border-gray-200 flex size-11 items-center justify-center rounded-lg border" }, /* @__PURE__ */ React.createElement(l, { className: "text-gray-600 size-6" })), /* @__PURE__ */ React.createElement(x, { className: "text-lg font-semibold" }, "How to Use the QR Code for Payment")), /* @__PURE__ */ React.createElement(E, { className: "mt-5" }, "Follow these simple steps to complete your transaction:"), /* @__PURE__ */ React.createElement("ol", { className: "mt-3 list-inside list-decimal space-y-3" }, /* @__PURE__ */ React.createElement("li", null, "Open your preferred banking or EMI mobile app and select 'Transfer Money' or 'Pay via QR'"), /* @__PURE__ */ React.createElement("li", null, "Scan or upload the generated QR Ph code. If prompted by the app, enter the amount to be sent."), /* @__PURE__ */ React.createElement("li", null, "Proceed with the transfer or payment."))))))));
+function N() {
+  return /* @__PURE__ */ e.jsxs("p", { className: "text-gray-500 mt-6 text-center text-xs", children: [
+    "Need help using the QR Code?",
+    " ",
+    /* @__PURE__ */ e.jsxs(c, { lazyMount: !0, unmountOnExit: !0, children: [
+      /* @__PURE__ */ e.jsx(d, { className: "text-blue-500", children: "See instructions" }),
+      /* @__PURE__ */ e.jsxs(s, { children: [
+        /* @__PURE__ */ e.jsx(p, { className: "!z-[calc(var(--z-dialog)+2)]" }),
+        /* @__PURE__ */ e.jsx(x, { className: "!z-[calc(var(--z-dialog)+3)] flex items-center justify-center", children: /* @__PURE__ */ e.jsxs(g, { className: "mx-auto w-[calc(100%-2rem)] rounded-lg bg-white p-4xl lg:w-[33.625rem]", children: [
+          /* @__PURE__ */ e.jsx(h, { children: /* @__PURE__ */ e.jsx(a, {}) }),
+          /* @__PURE__ */ e.jsxs(u, { children: [
+            /* @__PURE__ */ e.jsxs("div", { className: "flex items-center gap-xl", children: [
+              /* @__PURE__ */ e.jsx("div", { className: "border-gray-200 flex size-11 items-center justify-center rounded-lg border", children: /* @__PURE__ */ e.jsx(l, { className: "text-gray-600 size-6" }) }),
+              /* @__PURE__ */ e.jsx(j, { className: "text-lg font-semibold", children: "How to Use the QR Code for Payment" })
+            ] }),
+            /* @__PURE__ */ e.jsx(f, { className: "mt-5", children: "Follow these simple steps to complete your transaction:" }),
+            /* @__PURE__ */ e.jsxs("ol", { className: "mt-3 list-inside list-decimal space-y-3", children: [
+              /* @__PURE__ */ e.jsx("li", { children: "Open your preferred banking or EMI mobile app and select 'Transfer Money' or 'Pay via QR'" }),
+              /* @__PURE__ */ e.jsx("li", { children: "Scan or upload the generated QR Ph code. If prompted by the app, enter the amount to be sent." }),
+              /* @__PURE__ */ e.jsx("li", { children: "Proceed with the transfer or payment." })
+            ] })
+          ] })
+        ] }) })
+      ] })
+    ] })
+  ] });
 }
 export {
-  ee as QRPHDepositQrCode
+  re as QRPHDepositQrCode
 };

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositSuccess.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../../../icons/CheckCircleBrokenIcon.js");require("../../../../ui/AlertDialog/AlertDialog.js");require("../../../../ui/Avatar/Avatar.js");require("../../../../ui/Badge/Badge.js");const t=require("../../../../ui/Button/Button.js");require("../../../../ui/Checkbox/Checkbox.js");require("../../../../ui/Clipboard/Clipboard.js");require("../../../../ui/DatePicker/DatePicker.js");require("../../../../ui/Dialog/Dialog.js");require("../../../../ui/Drawer/Drawer.js");require("../../../../ui/Field/Field.js");require("@ark-ui/react");require("../../../../utils/capitalize.js");require("react");require("../../../../utils/parseDecimal.js");require("../../../../constants/index.js");require("../../../../utils/getLocaleInfo.js");require("../../../../utils/getQueryClient.js");require("../../../../utils/isMobile.js");require("../../../../utils/toaster.js");require("../../../../ui/IconButton/iconButton.recipe.js");require("../../../../ui/NumberInput/NumberInput.js");require("../../../../ui/PinInput/PinInput.js");require("../../../../ui/Popover/Popover.js");require("tailwind-merge");require("../../../../ui/SegmentGroup/SegmentGroup.js");require("../../../../ui/Select/Select.js");require("../../../../ui/Table/Table.js");require("../../../../ui/Tabs/Tabs.js");const u=require("./QRPHDepositContext.js");function i(){const e=u.useQRPHDepositContext();return React.createElement("div",{className:"bg-gray-50 rounded-lg px-10 py-12 lg:p-16"},React.createElement(r.CheckCircleBrokenIcon,{className:"text-green-600 mx-auto size-8 lg:size-10"}),React.createElement("p",{className:"mt-5 text-center text-lg font-semibold lg:text-xl"},"Deposit Successful!"),React.createElement("p",{className:"text-gray-700 mt-3 text-center text-sm lg:text-base"},"Your funds have been successfully added and are now ready to use in your account."),React.createElement(t.Button,{size:"sm",variant:"outline",colorScheme:"gray",className:"mx-auto mt-6 w-fit",onClick:()=>e.reset()},"Generate New QR Code"))}exports.QRPHDepositSuccess=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../_virtual/jsx-runtime.js"),t=require("../../../../icons/CheckCircleBrokenIcon.js");require("../../../../ui/AlertDialog/AlertDialog.js");require("../../../../ui/Avatar/Avatar.js");require("../../../../ui/Badge/Badge.js");const i=require("../../../../ui/Button/Button.js");require("../../../../ui/Checkbox/Checkbox.js");require("../../../../ui/Clipboard/Clipboard.js");require("../../../../ui/DatePicker/DatePicker.js");require("../../../../ui/Dialog/Dialog.js");require("../../../../ui/Drawer/Drawer.js");require("../../../../ui/Field/Field.js");require("@ark-ui/react");require("../../../../utils/capitalize.js");require("react");require("../../../../utils/parseDecimal.js");require("../../../../constants/index.js");require("../../../../utils/getLocaleInfo.js");require("../../../../utils/getQueryClient.js");require("../../../../utils/isMobile.js");require("../../../../utils/toaster.js");require("../../../../ui/IconButton/iconButton.recipe.js");require("../../../../ui/NumberInput/NumberInput.js");require("../../../../ui/PinInput/PinInput.js");require("../../../../ui/Popover/Popover.js");require("tailwind-merge");require("../../../../ui/SegmentGroup/SegmentGroup.js");require("../../../../ui/Select/Select.js");require("../../../../ui/Table/Table.js");require("../../../../ui/Tabs/Tabs.js");const u=require("./QRPHDepositContext.js");function s(){const r=u.useQRPHDepositContext();return e.jsxRuntimeExports.jsxs("div",{className:"bg-gray-50 rounded-lg px-10 py-12 lg:p-16",children:[e.jsxRuntimeExports.jsx(t.CheckCircleBrokenIcon,{className:"text-green-600 mx-auto size-8 lg:size-10"}),e.jsxRuntimeExports.jsx("p",{className:"mt-5 text-center text-lg font-semibold lg:text-xl",children:"Deposit Successful!"}),e.jsxRuntimeExports.jsx("p",{className:"text-gray-700 mt-3 text-center text-sm lg:text-base",children:"Your funds have been successfully added and are now ready to use in your account."}),e.jsxRuntimeExports.jsx(i.Button,{size:"sm",variant:"outline",colorScheme:"gray",className:"mx-auto mt-6 w-fit",onClick:()=>r.reset(),children:"Generate New QR Code"})]})}exports.QRPHDepositSuccess=s;

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositSuccess.mjs

@@ -1,8 +1,9 @@
+import { j as t } from "../../../../_virtual/jsx-runtime.mjs";
 import { CheckCircleBrokenIcon as e } from "../../../../icons/CheckCircleBrokenIcon.mjs";
 import "../../../../ui/AlertDialog/AlertDialog.mjs";
 import "../../../../ui/Avatar/Avatar.mjs";
 import "../../../../ui/Badge/Badge.mjs";
-import { Button as o } from "../../../../ui/Button/Button.mjs";
+import { Button as r } from "../../../../ui/Button/Button.mjs";
 import "../../../../ui/Checkbox/Checkbox.mjs";
 import "../../../../ui/Clipboard/Clipboard.mjs";
 import "../../../../ui/DatePicker/DatePicker.mjs";
@@ -27,21 +28,26 @@ import "../../../../ui/SegmentGroup/SegmentGroup.mjs";
 import "../../../../ui/Select/Select.mjs";
 import "../../../../ui/Table/Table.mjs";
 import "../../../../ui/Tabs/Tabs.mjs";
-import { useQRPHDepositContext as r } from "./QRPHDepositContext.mjs";
-function G() {
-  const t = r();
-  return /* @__PURE__ */ React.createElement("div", { className: "bg-gray-50 rounded-lg px-10 py-12 lg:p-16" }, /* @__PURE__ */ React.createElement(e, { className: "text-green-600 mx-auto size-8 lg:size-10" }), /* @__PURE__ */ React.createElement("p", { className: "mt-5 text-center text-lg font-semibold lg:text-xl" }, "Deposit Successful!"), /* @__PURE__ */ React.createElement("p", { className: "text-gray-700 mt-3 text-center text-sm lg:text-base" }, "Your funds have been successfully added and are now ready to use in your account."), /* @__PURE__ */ React.createElement(
-    o,
-    {
-      size: "sm",
-      variant: "outline",
-      colorScheme: "gray",
-      className: "mx-auto mt-6 w-fit",
-      onClick: () => t.reset()
-    },
-    "Generate New QR Code"
-  ));
+import { useQRPHDepositContext as i } from "./QRPHDepositContext.mjs";
+function I() {
+  const o = i();
+  return /* @__PURE__ */ t.jsxs("div", { className: "bg-gray-50 rounded-lg px-10 py-12 lg:p-16", children: [
+    /* @__PURE__ */ t.jsx(e, { className: "text-green-600 mx-auto size-8 lg:size-10" }),
+    /* @__PURE__ */ t.jsx("p", { className: "mt-5 text-center text-lg font-semibold lg:text-xl", children: "Deposit Successful!" }),
+    /* @__PURE__ */ t.jsx("p", { className: "text-gray-700 mt-3 text-center text-sm lg:text-base", children: "Your funds have been successfully added and are now ready to use in your account." }),
+    /* @__PURE__ */ t.jsx(
+      r,
+      {
+        size: "sm",
+        variant: "outline",
+        colorScheme: "gray",
+        className: "mx-auto mt-6 w-fit",
+        onClick: () => o.reset(),
+        children: "Generate New QR Code"
+      }
+    )
+  ] });
 }
 export {
-  G as QRPHDepositSuccess
+  I as QRPHDepositSuccess
 };

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/useQRPHDeposit.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react"),m=require("tiny-invariant");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("../../../../constants/index.js");require("../../../../utils/capitalize.js");require("../../../../utils/parseDecimal.js");require("../../../../utils/getLocaleInfo.js");require("../../../../utils/getQueryClient.js");require("../../../../utils/isMobile.js");const E=require("../../../../utils/toaster.js");require("lodash-es");require("../../../../_virtual/index.cjs.js");const M=require("../../../../hooks/useCreateQRPHDepositMutation.js"),O=require("../../../../hooks/useDepositQuery.js");require("../../../../hooks/useGlobalStore.js");require("../../../../hooks/useInfiniteQueryHelper.js");require("usehooks-ts");function I(){var d;const[l,t]=r.useState("FORM"),[a,u]=r.useState(null),[C,s]=r.useState(null),[c,n]=r.useState(null),[S,o]=r.useState(null),q=M.useCreateQRPHDepositMutation({onSuccess(e){m(e.qrCode),u(e.id),o(e.qrCode),t("QR_CODE")},onError(e){t("FORM"),E.toaster.error({description:e.message})},onMutate(e){u(null),s(e.promo??null),n(e.amount),o(null),t("LOADING")}}),i=O.useDepositQuery(a??void 0,{enabled:!!a,refetchInterval:l==="VERIFYING"?2500:5e3});r.useEffect(()=>{var e,R;(((e=i.data)==null?void 0:e.status)==="CONFIRMED"||((R=i.data)==null?void 0:R.status)==="APPROVED")&&t("SUCCESS")},[(d=i.data)==null?void 0:d.status]);const p=q.mutate,D=()=>{m(c),q.mutate({amount:c.toString(),promo:C??void 0})},Q=()=>{t("VERIFYING")},f=()=>{u(null),s(null),n(null),o(null),t("FORM")};return r.useEffect(()=>()=>{u(null),s(null),n(null),o(null),t("FORM")},[]),{view:l,qrCode:S,verify:Q,generateQrCode:p,regenerateQrCode:D,reset:f}}exports.useQRPHDeposit=I;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react"),m=require("tiny-invariant");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("../../../../constants/index.js");require("../../../../utils/capitalize.js");require("../../../../_virtual/jsx-runtime.js");require("../../../../utils/parseDecimal.js");require("../../../../utils/getLocaleInfo.js");require("../../../../utils/getQueryClient.js");require("../../../../utils/isMobile.js");const E=require("../../../../utils/toaster.js");require("lodash-es");require("../../../../node_modules/.pnpm/@opexa_portal-sdk-core@0.0.22/node_modules/@opexa/portal-sdk-core/dist/object-id.js");const M=require("../../../../hooks/useCreateQRPHDepositMutation.js"),O=require("../../../../hooks/useDepositQuery.js");require("../../../../hooks/useGlobalStore.js");require("../../../../hooks/useInfiniteQueryHelper.js");require("usehooks-ts");function I(){var d;const[l,t]=r.useState("FORM"),[a,u]=r.useState(null),[C,s]=r.useState(null),[c,n]=r.useState(null),[S,o]=r.useState(null),q=M.useCreateQRPHDepositMutation({onSuccess(e){m(e.qrCode),u(e.id),o(e.qrCode),t("QR_CODE")},onError(e){t("FORM"),E.toaster.error({description:e.message})},onMutate(e){u(null),s(e.promo??null),n(e.amount),o(null),t("LOADING")}}),i=O.useDepositQuery(a??void 0,{enabled:!!a,refetchInterval:l==="VERIFYING"?2500:5e3});r.useEffect(()=>{var e,R;(((e=i.data)==null?void 0:e.status)==="CONFIRMED"||((R=i.data)==null?void 0:R.status)==="APPROVED")&&t("SUCCESS")},[(d=i.data)==null?void 0:d.status]);const p=q.mutate,D=()=>{m(c),q.mutate({amount:c.toString(),promo:C??void 0})},Q=()=>{t("VERIFYING")},f=()=>{u(null),s(null),n(null),o(null),t("FORM")};return r.useEffect(()=>()=>{u(null),s(null),n(null),o(null),t("FORM")},[]),{view:l,qrCode:S,verify:Q,generateQrCode:p,regenerateQrCode:D,reset:f}}exports.useQRPHDeposit=I;

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/useQRPHDeposit.mjs

@@ -4,21 +4,22 @@ import "@opexa/portal-sdk-core";
 import "@tanstack/react-query";
 import "../../../../constants/index.mjs";
 import "../../../../utils/capitalize.mjs";
+import "../../../../_virtual/jsx-runtime.mjs";
 import "../../../../utils/parseDecimal.mjs";
 import "../../../../utils/getLocaleInfo.mjs";
 import "../../../../utils/getQueryClient.mjs";
 import "../../../../utils/isMobile.mjs";
 import { toaster as M } from "../../../../utils/toaster.mjs";
 import "lodash-es";
-import "../../../../_virtual/index.cjs.mjs";
+import "../../../../node_modules/.pnpm/@opexa_portal-sdk-core@0.0.22/node_modules/@opexa/portal-sdk-core/dist/object-id.mjs";
 import { useCreateQRPHDepositMutation as Q } from "../../../../hooks/useCreateQRPHDepositMutation.mjs";
 import { useDepositQuery as v } from "../../../../hooks/useDepositQuery.mjs";
 import "../../../../hooks/useGlobalStore.mjs";
 import "../../../../hooks/useInfiniteQueryHelper.mjs";
 import "usehooks-ts";
-function j() {
+function k() {
   var c;
-  const [m, o] = r("FORM"), [l, e] = r(null), [R, u] = r(null), [p, i] = r(null), [E, n] = r(null), a = Q({
+  const [m, o] = r("FORM"), [l, e] = r(null), [R, i] = r(null), [p, u] = r(null), [E, n] = r(null), a = Q({
     onSuccess(t) {
       C(t.qrCode), e(t.id), n(t.qrCode), o("QR_CODE");
     },
@@ -28,7 +29,7 @@ function j() {
       });
     },
     onMutate(t) {
-      e(null), u(t.promo ?? null), i(t.amount), n(null), o("LOADING");
+      e(null), i(t.promo ?? null), u(t.amount), n(null), o("LOADING");
     }
   }), s = v(l ?? void 0, {
     enabled: !!l,
@@ -46,10 +47,10 @@ function j() {
   }, D = () => {
     o("VERIFYING");
   }, F = () => {
-    e(null), u(null), i(null), n(null), o("FORM");
+    e(null), i(null), u(null), n(null), o("FORM");
   };
   return f(() => () => {
-    e(null), u(null), i(null), n(null), o("FORM");
+    e(null), i(null), u(null), n(null), o("FORM");
   }, []), {
     view: m,
     qrCode: E,
@@ -60,5 +61,5 @@ function j() {
   };
 }
 export {
-  j as useQRPHDeposit
+  k as useQRPHDeposit
 };

package/dist/components/DepositWithdrawal/DepositWithdrawal.js

@@ -1 +1 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("@ark-ui/react"),g=require("tailwind-merge"),q=require("zod");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../constants/index.js");require("../../utils/capitalize.js");require("react");const o=require("../../utils/formatNumber.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../utils/parseDecimal.js");require("../../utils/toaster.js");require("lodash-es");require("../../_virtual/index.cjs.js");const E=require("../../hooks/useGlobalStore.js");require("../../hooks/useInfiniteQueryHelper.js");const u=require("../../hooks/useLocaleInfo.js");require("usehooks-ts");const s=require("../../hooks/useWalletQuery.js"),m=require("../../icons/Wallet02Icon.js"),R=require("../../icons/XIcon.js");require("../../ui/AlertDialog/AlertDialog.js");require("../../ui/Avatar/Avatar.js");require("../../ui/Badge/Badge.js");require("../../ui/Button/button.recipe.js");require("../../ui/Checkbox/Checkbox.js");require("../../ui/Clipboard/Clipboard.js");require("../../ui/DatePicker/DatePicker.js");const e=require("../../ui/Dialog/Dialog.js");require("../../ui/Drawer/Drawer.js");require("../../ui/Field/Field.js");require("../../ui/IconButton/iconButton.recipe.js");require("../../ui/NumberInput/NumberInput.js");require("../../ui/PinInput/PinInput.js");require("../../ui/Popover/Popover.js");require("../../ui/SegmentGroup/SegmentGroup.js");require("../../ui/Select/Select.js");require("../../ui/Table/Table.js");const t=require("../../ui/Tabs/Tabs.js"),p=require("./Deposit/Deposit.js"),f=require("./Withdrawal/Withdrawal.js"),h=require("../../node_modules/.pnpm/zustand@5.0.5_@types_react@19.0.8_react@19.1.0_use-sync-external-store@1.4.0_react@19.1.0_/node_modules/zustand/esm/react/shallow.js");function x(l){var i;const r=E.useGlobalStore(h.useShallow(a=>({depositWithdrawal:a.depositWithdrawal}))),n=u.useLocaleInfo(),c=s.useWalletQuery({refetchInterval:5e3});return React.createElement(e.Root,{lazyMount:!0,unmountOnExit:!0,open:r.depositWithdrawal.open,onOpenChange:a=>{r.depositWithdrawal.setOpen(a.open)},closeOnEscape:!1,closeOnInteractOutside:!1},React.createElement(e.Trigger,{asChild:!0},l.children??React.createElement(w,null)),React.createElement(d.Portal,null,React.createElement(e.Backdrop,{className:"!z-[calc(var(--z-dialog)+1)]"}),React.createElement(e.Positioner,{className:"!z-[calc(var(--z-dialog)+2)]"},React.createElement(e.Content,{className:"lg:min-h-auto mx-auto min-h-full w-full bg-white p-2xl shadow-xl lg:w-[640px] lg:rounded-xl lg:p-3xl"},React.createElement(e.CloseTrigger,null,React.createElement(R.XIcon,null)),React.createElement(e.Header,{className:"flex items-center gap-xl"},React.createElement("div",{className:"border-gray-200 shadow-xs text-gray-700 flex size-12 items-center justify-center rounded-lg border"},React.createElement(m.Wallet02Icon,null)),React.createElement(e.Title,{className:"grow text-lg font-semibold"},"Wallet")),React.createElement(e.Body,{className:"mt-5"},React.createElement("p",{className:"text-gray-500 text-center text-sm font-medium leading-tight"},"Available Balance"),React.createElement("p",{className:"mt-lg text-center text-4xl font-semibold leading-tight tracking-tight"},o.formatNumber((i=c.data)==null?void 0:i.balance,{currency:n.currency.code,minDecimalPlaces:2})),React.createElement(t.Root,{value:r.depositWithdrawal.tab,onValueChange:a=>{r.depositWithdrawal.setTab(q.z.enum(["DEPOSIT","WITHDRAWAL"]).parse(a.value))},lazyMount:!0,unmountOnExit:!0,className:"mt-4xl space-y-4xl"},React.createElement(t.List,{className:"w-full"},React.createElement(t.Trigger,{value:"DEPOSIT",className:"grow"},"Deposit"),React.createElement(t.Trigger,{value:"WITHDRAWAL",className:"grow"},"Withdrawal"),React.createElement(t.Indicator,null)),React.createElement(t.Content,{value:"DEPOSIT",className:"space-y-4xl"},React.createElement(p.Deposit,null)),React.createElement(t.Content,{value:"WITHDRAWAL",className:"space-y-4xl"},React.createElement(f.Withdrawal,null))))))))}function w(l){var c;const r=u.useLocaleInfo(),n=s.useWalletQuery({refetchInterval:5e3});return React.createElement("button",{type:"button",...l,className:g.twMerge("flex",l.className)},React.createElement("div",{className:"border-gray-200 flex h-11 items-center rounded-l-md border border-r-0 px-3.5 font-medium"},o.formatNumber((c=n.data)==null?void 0:c.balance,{currency:r.currency.code,minDecimalPlaces:2})),React.createElement("div",{className:"bg-gray-900 flex h-11 items-center gap-1.5 rounded-r-md px-3.5 font-semibold text-white"},React.createElement(m.Wallet02Icon,{className:"size-5"}),"Wallet"))}exports.DepositWithdrawal=x;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),d=require("@ark-ui/react"),j=require("tailwind-merge"),p=require("zod");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../constants/index.js");require("../../utils/capitalize.js");require("react");const u=require("../../utils/formatNumber.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../utils/parseDecimal.js");require("../../utils/toaster.js");require("lodash-es");require("../../node_modules/.pnpm/@opexa_portal-sdk-core@0.0.22/node_modules/@opexa/portal-sdk-core/dist/object-id.js");const h=require("../../hooks/useGlobalStore.js");require("../../hooks/useInfiniteQueryHelper.js");const c=require("../../hooks/useLocaleInfo.js");require("usehooks-ts");const x=require("../../hooks/useWalletQuery.js"),m=require("../../icons/Wallet02Icon.js"),q=require("../../icons/XIcon.js");require("../../ui/AlertDialog/AlertDialog.js");require("../../ui/Avatar/Avatar.js");require("../../ui/Badge/Badge.js");require("../../ui/Button/button.recipe.js");require("../../ui/Checkbox/Checkbox.js");require("../../ui/Clipboard/Clipboard.js");require("../../ui/DatePicker/DatePicker.js");const r=require("../../ui/Dialog/Dialog.js");require("../../ui/Drawer/Drawer.js");require("../../ui/Field/Field.js");require("../../ui/IconButton/iconButton.recipe.js");require("../../ui/NumberInput/NumberInput.js");require("../../ui/PinInput/PinInput.js");require("../../ui/Popover/Popover.js");require("../../ui/SegmentGroup/SegmentGroup.js");require("../../ui/Select/Select.js");require("../../ui/Table/Table.js");const t=require("../../ui/Tabs/Tabs.js"),g=require("./Deposit/Deposit.js"),E=require("./Withdrawal/Withdrawal.js"),R=require("../../node_modules/.pnpm/zustand@5.0.5_@types_react@19.0.8_react@19.1.0_use-sync-external-store@1.4.0_react@19.1.0_/node_modules/zustand/esm/react/shallow.js");function f(l){var o;const s=h.useGlobalStore(R.useShallow(i=>({depositWithdrawal:i.depositWithdrawal}))),n=c.useLocaleInfo(),a=x.useWalletQuery({refetchInterval:5e3});return e.jsxRuntimeExports.jsxs(r.Root,{lazyMount:!0,unmountOnExit:!0,open:s.depositWithdrawal.open,onOpenChange:i=>{s.depositWithdrawal.setOpen(i.open)},closeOnEscape:!1,closeOnInteractOutside:!1,children:[e.jsxRuntimeExports.jsx(r.Trigger,{asChild:!0,children:l.children??e.jsxRuntimeExports.jsx(w,{})}),e.jsxRuntimeExports.jsxs(d.Portal,{children:[e.jsxRuntimeExports.jsx(r.Backdrop,{className:"!z-[calc(var(--z-dialog)+1)]"}),e.jsxRuntimeExports.jsx(r.Positioner,{className:"!z-[calc(var(--z-dialog)+2)]",children:e.jsxRuntimeExports.jsxs(r.Content,{className:"lg:min-h-auto mx-auto min-h-full w-full bg-white p-2xl shadow-xl lg:w-[640px] lg:rounded-xl lg:p-3xl",children:[e.jsxRuntimeExports.jsx(r.CloseTrigger,{children:e.jsxRuntimeExports.jsx(q.XIcon,{})}),e.jsxRuntimeExports.jsxs(r.Header,{className:"flex items-center gap-xl",children:[e.jsxRuntimeExports.jsx("div",{className:"border-gray-200 shadow-xs text-gray-700 flex size-12 items-center justify-center rounded-lg border",children:e.jsxRuntimeExports.jsx(m.Wallet02Icon,{})}),e.jsxRuntimeExports.jsx(r.Title,{className:"grow text-lg font-semibold",children:"Wallet"})]}),e.jsxRuntimeExports.jsxs(r.Body,{className:"mt-5",children:[e.jsxRuntimeExports.jsx("p",{className:"text-gray-500 text-center text-sm font-medium leading-tight",children:"Available Balance"}),e.jsxRuntimeExports.jsx("p",{className:"mt-lg text-center text-4xl font-semibold leading-tight tracking-tight",children:u.formatNumber((o=a.data)==null?void 0:o.balance,{currency:n.currency.code,minDecimalPlaces:2})}),e.jsxRuntimeExports.jsxs(t.Root,{value:s.depositWithdrawal.tab,onValueChange:i=>{s.depositWithdrawal.setTab(p.z.enum(["DEPOSIT","WITHDRAWAL"]).parse(i.value))},lazyMount:!0,unmountOnExit:!0,className:"mt-4xl space-y-4xl",children:[e.jsxRuntimeExports.jsxs(t.List,{className:"w-full",children:[e.jsxRuntimeExports.jsx(t.Trigger,{value:"DEPOSIT",className:"grow",children:"Deposit"}),e.jsxRuntimeExports.jsx(t.Trigger,{value:"WITHDRAWAL",className:"grow",children:"Withdrawal"}),e.jsxRuntimeExports.jsx(t.Indicator,{})]}),e.jsxRuntimeExports.jsx(t.Content,{value:"DEPOSIT",className:"space-y-4xl",children:e.jsxRuntimeExports.jsx(g.Deposit,{})}),e.jsxRuntimeExports.jsx(t.Content,{value:"WITHDRAWAL",className:"space-y-4xl",children:e.jsxRuntimeExports.jsx(E.Withdrawal,{})})]})]})]})})]})]})}function w(l){var a;const s=c.useLocaleInfo(),n=x.useWalletQuery({refetchInterval:5e3});return e.jsxRuntimeExports.jsxs("button",{type:"button",...l,className:j.twMerge("flex",l.className),children:[e.jsxRuntimeExports.jsx("div",{className:"border-gray-200 flex h-11 items-center rounded-l-md border border-r-0 px-3.5 font-medium",children:u.formatNumber((a=n.data)==null?void 0:a.balance,{currency:s.currency.code,minDecimalPlaces:2})}),e.jsxRuntimeExports.jsxs("div",{className:"bg-gray-900 flex h-11 items-center gap-1.5 rounded-r-md px-3.5 font-semibold text-white",children:[e.jsxRuntimeExports.jsx(m.Wallet02Icon,{className:"size-5"}),"Wallet"]})]})}exports.DepositWithdrawal=f;

package/dist/components/DepositWithdrawal/DepositWithdrawal.mjs

@@ -1,7 +1,8 @@
 "use client";
-import { Portal as u } from "@ark-ui/react";
-import { twMerge as d } from "tailwind-merge";
-import { z as g } from "zod";
+import { j as e } from "../../_virtual/jsx-runtime.mjs";
+import { Portal as x } from "@ark-ui/react";
+import { twMerge as u } from "tailwind-merge";
+import { z as h } from "zod";
 import "@opexa/portal-sdk-core";
 import "@tanstack/react-query";
 import "tiny-invariant";
@@ -15,14 +16,14 @@ import "../../utils/isMobile.mjs";
 import "../../utils/parseDecimal.mjs";
 import "../../utils/toaster.mjs";
 import "lodash-es";
-import "../../_virtual/index.cjs.mjs";
-import { useGlobalStore as f } from "../../hooks/useGlobalStore.mjs";
+import "../../node_modules/.pnpm/@opexa_portal-sdk-core@0.0.22/node_modules/@opexa/portal-sdk-core/dist/object-id.mjs";
+import { useGlobalStore as g } from "../../hooks/useGlobalStore.mjs";
 import "../../hooks/useInfiniteQueryHelper.mjs";
-import { useLocaleInfo as i } from "../../hooks/useLocaleInfo.mjs";
+import { useLocaleInfo as c } from "../../hooks/useLocaleInfo.mjs";
 import "usehooks-ts";
-import { useWalletQuery as s } from "../../hooks/useWalletQuery.mjs";
+import { useWalletQuery as d } from "../../hooks/useWalletQuery.mjs";
 import { Wallet02Icon as p } from "../../icons/Wallet02Icon.mjs";
-import { XIcon as E } from "../../icons/XIcon.mjs";
+import { XIcon as f } from "../../icons/XIcon.mjs";
 import "../../ui/AlertDialog/AlertDialog.mjs";
 import "../../ui/Avatar/Avatar.mjs";
 import "../../ui/Badge/Badge.mjs";
@@ -30,7 +31,7 @@ import "../../ui/Button/button.recipe.mjs";
 import "../../ui/Checkbox/Checkbox.mjs";
 import "../../ui/Clipboard/Clipboard.mjs";
 import "../../ui/DatePicker/DatePicker.mjs";
-import { Root as R, Trigger as x, Backdrop as h, Positioner as w, Content as N, CloseTrigger as b, Header as y, Title as W, Body as I } from "../../ui/Dialog/Dialog.mjs";
+import { Root as j, Trigger as w, Backdrop as N, Positioner as b, Content as y, CloseTrigger as W, Header as I, Title as v, Body as T } from "../../ui/Dialog/Dialog.mjs";
 import "../../ui/Drawer/Drawer.mjs";
 import "../../ui/Field/Field.mjs";
 import "../../ui/IconButton/iconButton.recipe.mjs";
@@ -40,73 +41,100 @@ import "../../ui/Popover/Popover.mjs";
 import "../../ui/SegmentGroup/SegmentGroup.mjs";
 import "../../ui/Select/Select.mjs";
 import "../../ui/Table/Table.mjs";
-import { Root as v, List as T, Trigger as m, Indicator as D, Content as c } from "../../ui/Tabs/Tabs.mjs";
-import { Deposit as O } from "./Deposit/Deposit.mjs";
-import { Withdrawal as z } from "./Withdrawal/Withdrawal.mjs";
-import { useShallow as A } from "../../node_modules/.pnpm/zustand@5.0.5_@types_react@19.0.8_react@19.1.0_use-sync-external-store@1.4.0_react@19.1.0_/node_modules/zustand/esm/react/shallow.mjs";
-function We(a) {
-  var o;
-  const e = f(
-    A((t) => ({
-      depositWithdrawal: t.depositWithdrawal
+import { Root as D, List as O, Trigger as s, Indicator as z, Content as m } from "../../ui/Tabs/Tabs.mjs";
+import { Deposit as A } from "./Deposit/Deposit.mjs";
+import { Withdrawal as C } from "./Withdrawal/Withdrawal.mjs";
+import { useShallow as E } from "../../node_modules/.pnpm/zustand@5.0.5_@types_react@19.0.8_react@19.1.0_use-sync-external-store@1.4.0_react@19.1.0_/node_modules/zustand/esm/react/shallow.mjs";
+function Te(o) {
+  var i;
+  const t = g(
+    E((r) => ({
+      depositWithdrawal: r.depositWithdrawal
     }))
-  ), l = i(), r = s({
+  ), a = c(), l = d({
     refetchInterval: 5e3
   });
-  return /* @__PURE__ */ React.createElement(
-    R,
+  return /* @__PURE__ */ e.jsxs(
+    j,
     {
       lazyMount: !0,
       unmountOnExit: !0,
-      open: e.depositWithdrawal.open,
-      onOpenChange: (t) => {
-        e.depositWithdrawal.setOpen(t.open);
+      open: t.depositWithdrawal.open,
+      onOpenChange: (r) => {
+        t.depositWithdrawal.setOpen(r.open);
       },
       closeOnEscape: !1,
-      closeOnInteractOutside: !1
-    },
-    /* @__PURE__ */ React.createElement(x, { asChild: !0 }, a.children ?? /* @__PURE__ */ React.createElement(C, null)),
-    /* @__PURE__ */ React.createElement(u, null, /* @__PURE__ */ React.createElement(h, { className: "!z-[calc(var(--z-dialog)+1)]" }), /* @__PURE__ */ React.createElement(w, { className: "!z-[calc(var(--z-dialog)+2)]" }, /* @__PURE__ */ React.createElement(N, { className: "lg:min-h-auto mx-auto min-h-full w-full bg-white p-2xl shadow-xl lg:w-[640px] lg:rounded-xl lg:p-3xl" }, /* @__PURE__ */ React.createElement(b, null, /* @__PURE__ */ React.createElement(E, null)), /* @__PURE__ */ React.createElement(y, { className: "flex items-center gap-xl" }, /* @__PURE__ */ React.createElement("div", { className: "border-gray-200 shadow-xs text-gray-700 flex size-12 items-center justify-center rounded-lg border" }, /* @__PURE__ */ React.createElement(p, null)), /* @__PURE__ */ React.createElement(W, { className: "grow text-lg font-semibold" }, "Wallet")), /* @__PURE__ */ React.createElement(I, { className: "mt-5" }, /* @__PURE__ */ React.createElement("p", { className: "text-gray-500 text-center text-sm font-medium leading-tight" }, "Available Balance"), /* @__PURE__ */ React.createElement("p", { className: "mt-lg text-center text-4xl font-semibold leading-tight tracking-tight" }, n((o = r.data) == null ? void 0 : o.balance, {
-      currency: l.currency.code,
-      minDecimalPlaces: 2
-    })), /* @__PURE__ */ React.createElement(
-      v,
-      {
-        value: e.depositWithdrawal.tab,
-        onValueChange: (t) => {
-          e.depositWithdrawal.setTab(
-            g.enum(["DEPOSIT", "WITHDRAWAL"]).parse(t.value)
-          );
-        },
-        lazyMount: !0,
-        unmountOnExit: !0,
-        className: "mt-4xl space-y-4xl"
-      },
-      /* @__PURE__ */ React.createElement(T, { className: "w-full" }, /* @__PURE__ */ React.createElement(m, { value: "DEPOSIT", className: "grow" }, "Deposit"), /* @__PURE__ */ React.createElement(m, { value: "WITHDRAWAL", className: "grow" }, "Withdrawal"), /* @__PURE__ */ React.createElement(D, null)),
-      /* @__PURE__ */ React.createElement(c, { value: "DEPOSIT", className: "space-y-4xl" }, /* @__PURE__ */ React.createElement(O, null)),
-      /* @__PURE__ */ React.createElement(c, { value: "WITHDRAWAL", className: "space-y-4xl" }, /* @__PURE__ */ React.createElement(z, null))
-    )))))
+      closeOnInteractOutside: !1,
+      children: [
+        /* @__PURE__ */ e.jsx(w, { asChild: !0, children: o.children ?? /* @__PURE__ */ e.jsx(P, {}) }),
+        /* @__PURE__ */ e.jsxs(x, { children: [
+          /* @__PURE__ */ e.jsx(N, { className: "!z-[calc(var(--z-dialog)+1)]" }),
+          /* @__PURE__ */ e.jsx(b, { className: "!z-[calc(var(--z-dialog)+2)]", children: /* @__PURE__ */ e.jsxs(y, { className: "lg:min-h-auto mx-auto min-h-full w-full bg-white p-2xl shadow-xl lg:w-[640px] lg:rounded-xl lg:p-3xl", children: [
+            /* @__PURE__ */ e.jsx(W, { children: /* @__PURE__ */ e.jsx(f, {}) }),
+            /* @__PURE__ */ e.jsxs(I, { className: "flex items-center gap-xl", children: [
+              /* @__PURE__ */ e.jsx("div", { className: "border-gray-200 shadow-xs text-gray-700 flex size-12 items-center justify-center rounded-lg border", children: /* @__PURE__ */ e.jsx(p, {}) }),
+              /* @__PURE__ */ e.jsx(v, { className: "grow text-lg font-semibold", children: "Wallet" })
+            ] }),
+            /* @__PURE__ */ e.jsxs(T, { className: "mt-5", children: [
+              /* @__PURE__ */ e.jsx("p", { className: "text-gray-500 text-center text-sm font-medium leading-tight", children: "Available Balance" }),
+              /* @__PURE__ */ e.jsx("p", { className: "mt-lg text-center text-4xl font-semibold leading-tight tracking-tight", children: n((i = l.data) == null ? void 0 : i.balance, {
+                currency: a.currency.code,
+                minDecimalPlaces: 2
+              }) }),
+              /* @__PURE__ */ e.jsxs(
+                D,
+                {
+                  value: t.depositWithdrawal.tab,
+                  onValueChange: (r) => {
+                    t.depositWithdrawal.setTab(
+                      h.enum(["DEPOSIT", "WITHDRAWAL"]).parse(r.value)
+                    );
+                  },
+                  lazyMount: !0,
+                  unmountOnExit: !0,
+                  className: "mt-4xl space-y-4xl",
+                  children: [
+                    /* @__PURE__ */ e.jsxs(O, { className: "w-full", children: [
+                      /* @__PURE__ */ e.jsx(s, { value: "DEPOSIT", className: "grow", children: "Deposit" }),
+                      /* @__PURE__ */ e.jsx(s, { value: "WITHDRAWAL", className: "grow", children: "Withdrawal" }),
+                      /* @__PURE__ */ e.jsx(z, {})
+                    ] }),
+                    /* @__PURE__ */ e.jsx(m, { value: "DEPOSIT", className: "space-y-4xl", children: /* @__PURE__ */ e.jsx(A, {}) }),
+                    /* @__PURE__ */ e.jsx(m, { value: "WITHDRAWAL", className: "space-y-4xl", children: /* @__PURE__ */ e.jsx(C, {}) })
+                  ]
+                }
+              )
+            ] })
+          ] }) })
+        ] })
+      ]
+    }
   );
 }
-function C(a) {
-  var r;
-  const e = i(), l = s({
+function P(o) {
+  var l;
+  const t = c(), a = d({
     refetchInterval: 5e3
   });
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ e.jsxs(
     "button",
     {
       type: "button",
-      ...a,
-      className: d("flex", a.className)
-    },
-    /* @__PURE__ */ React.createElement("div", { className: "border-gray-200 flex h-11 items-center rounded-l-md border border-r-0 px-3.5 font-medium" }, n((r = l.data) == null ? void 0 : r.balance, {
-      currency: e.currency.code,
-      minDecimalPlaces: 2
-    })),
-    /* @__PURE__ */ React.createElement("div", { className: "bg-gray-900 flex h-11 items-center gap-1.5 rounded-r-md px-3.5 font-semibold text-white" }, /* @__PURE__ */ React.createElement(p, { className: "size-5" }), "Wallet")
+      ...o,
+      className: u("flex", o.className),
+      children: [
+        /* @__PURE__ */ e.jsx("div", { className: "border-gray-200 flex h-11 items-center rounded-l-md border border-r-0 px-3.5 font-medium", children: n((l = a.data) == null ? void 0 : l.balance, {
+          currency: t.currency.code,
+          minDecimalPlaces: 2
+        }) }),
+        /* @__PURE__ */ e.jsxs("div", { className: "bg-gray-900 flex h-11 items-center gap-1.5 rounded-r-md px-3.5 font-semibold text-white", children: [
+          /* @__PURE__ */ e.jsx(p, { className: "size-5" }),
+          "Wallet"
+        ] })
+      ]
+    }
   );
 }
 export {
-  We as DepositWithdrawal
+  Te as DepositWithdrawal
 };

package/dist/components/DepositWithdrawal/PaymentMethods.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../../_virtual/image.js");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../constants/index.js");require("../../utils/capitalize.js");require("react");require("../../utils/parseDecimal.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../utils/toaster.js");const q=require("../../hooks/useControllableState.js");require("lodash-es");require("../../_virtual/index.cjs.js");require("../../hooks/useGlobalStore.js");require("../../hooks/useInfiniteQueryHelper.js");require("usehooks-ts");const m=require("../../icons/CheckIcon.js"),d=require("../../images/QRPh.png.js"),g=require("../../images/gcash.png.js"),i=require("../../images/maya.png.js"),h=require("../../images/online-bank.png.js");require("../../ui/AlertDialog/AlertDialog.js");require("../../ui/Avatar/Avatar.js");require("../../ui/Badge/Badge.js");require("@ark-ui/react");require("../../ui/Button/button.recipe.js");const t=require("../../ui/Checkbox/Checkbox.js");require("../../ui/Clipboard/Clipboard.js");require("../../ui/DatePicker/DatePicker.js");require("../../ui/Dialog/Dialog.js");require("../../ui/Drawer/Drawer.js");const v=require("../../ui/Field/Field.js");require("../../ui/IconButton/iconButton.recipe.js");require("../../ui/NumberInput/NumberInput.js");require("../../ui/PinInput/PinInput.js");require("../../ui/Popover/Popover.js");require("tailwind-merge");require("../../ui/SegmentGroup/SegmentGroup.js");require("../../ui/Select/Select.js");require("../../ui/Table/Table.js");require("../../ui/Tabs/Tabs.js");const b=require("./utils.js"),n=[{value:"GCASH",label:"GCash",image:g},{value:"MAYA_APP",label:"Maya App",image:i},{value:"MAYA",label:"Maya",image:i},{value:"QRPH",label:"QRPH",image:d},{value:"ONLINE_BANK",label:"Online Bank",image:h}];function y(r){var l;const u=(l=r.options)!=null&&l.length?n.filter(e=>{var a;return(a=r.options)==null?void 0:a.includes(e.value)}):n,[c,o]=q.useControllableState({value:r.value,defaultValue:r.defaultValue??u[0].value,onChange:r.onChange});return React.createElement("div",{className:r.className},React.createElement(v.Label,{asChild:!0},React.createElement("div",null,"Select your payment method")),React.createElement(t.Group,{value:[c],onValueChange:e=>{const a=e.at(-1);a&&o(b.PaymentMethodDefinition.parse(a))},className:"grid grid-cols-2 gap-x-4 gap-y-3"},u.map(e=>React.createElement(t.Root,{key:e.value,value:e.value,className:"border-gray-200 ui-checked:border-gray-900 ui-checked:outline-solid ui-checked:outline-gray-900 flex cursor-pointer rounded-xl border p-xl ui-checked:outline"},React.createElement("div",{className:"grow"},React.createElement(s,{src:e.image,alt:"",width:200,height:40,className:"h-5 w-auto lg:h-8",draggable:!1})),React.createElement(t.Control,{className:"shrink-0"},React.createElement(t.Indicator,{asChild:!0},React.createElement(m.CheckIcon,null))),React.createElement(t.HiddenInput,null)))))}exports.PaymentMethods=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../_virtual/jsx-runtime.js"),q=require("../../_virtual/image.js");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../constants/index.js");require("../../utils/capitalize.js");require("react");require("../../utils/parseDecimal.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../utils/toaster.js");const d=require("../../hooks/useControllableState.js");require("lodash-es");require("../../node_modules/.pnpm/@opexa_portal-sdk-core@0.0.22/node_modules/@opexa/portal-sdk-core/dist/object-id.js");require("../../hooks/useGlobalStore.js");require("../../hooks/useInfiniteQueryHelper.js");require("usehooks-ts");const x=require("../../icons/CheckIcon.js"),h=require("../../images/QRPh.png.js"),m=require("../../images/gcash.png.js"),l=require("../../images/maya.png.js"),g=require("../../images/online-bank.png.js");require("../../ui/AlertDialog/AlertDialog.js");require("../../ui/Avatar/Avatar.js");require("../../ui/Badge/Badge.js");require("@ark-ui/react");require("../../ui/Button/button.recipe.js");const a=require("../../ui/Checkbox/Checkbox.js");require("../../ui/Clipboard/Clipboard.js");require("../../ui/DatePicker/DatePicker.js");require("../../ui/Dialog/Dialog.js");require("../../ui/Drawer/Drawer.js");const j=require("../../ui/Field/Field.js");require("../../ui/IconButton/iconButton.recipe.js");require("../../ui/NumberInput/NumberInput.js");require("../../ui/PinInput/PinInput.js");require("../../ui/Popover/Popover.js");require("tailwind-merge");require("../../ui/SegmentGroup/SegmentGroup.js");require("../../ui/Select/Select.js");require("../../ui/Table/Table.js");require("../../ui/Tabs/Tabs.js");const v=require("./utils.js"),n=[{value:"GCASH",label:"GCash",image:m},{value:"MAYA_APP",label:"Maya App",image:l},{value:"MAYA",label:"Maya",image:l},{value:"QRPH",label:"QRPH",image:h},{value:"ONLINE_BANK",label:"Online Bank",image:g}];function R(i){var s;const t=(s=i.options)!=null&&s.length?n.filter(r=>{var u;return(u=i.options)==null?void 0:u.includes(r.value)}):n,[o,c]=d.useControllableState({value:i.value,defaultValue:i.defaultValue??t[0].value,onChange:i.onChange});return e.jsxRuntimeExports.jsxs("div",{className:i.className,children:[e.jsxRuntimeExports.jsx(j.Label,{asChild:!0,children:e.jsxRuntimeExports.jsx("div",{children:"Select your payment method"})}),e.jsxRuntimeExports.jsx(a.Group,{value:[o],onValueChange:r=>{const u=r.at(-1);u&&c(v.PaymentMethodDefinition.parse(u))},className:"grid grid-cols-2 gap-x-4 gap-y-3",children:t.map(r=>e.jsxRuntimeExports.jsxs(a.Root,{value:r.value,className:"border-gray-200 ui-checked:border-gray-900 ui-checked:outline-solid ui-checked:outline-gray-900 flex cursor-pointer rounded-xl border p-xl ui-checked:outline",children:[e.jsxRuntimeExports.jsx("div",{className:"grow",children:e.jsxRuntimeExports.jsx(q,{src:r.image,alt:"",width:200,height:40,className:"h-5 w-auto lg:h-8",draggable:!1})}),e.jsxRuntimeExports.jsx(a.Control,{className:"shrink-0",children:e.jsxRuntimeExports.jsx(a.Indicator,{asChild:!0,children:e.jsxRuntimeExports.jsx(x.CheckIcon,{})})}),e.jsxRuntimeExports.jsx(a.HiddenInput,{})]},r.value))})]})}exports.PaymentMethods=R;