@opexa/portal-components 0.0.5 → 0.0.7

package/dist/components/DepositWithdrawal/Deposit/MayaDeposit/MayaDeposit.mjs

@@ -0,0 +1,220 @@
+import { Portal as S } from "@ark-ui/react";
+import { zodResolver as I } from "../../../../node_modules/.pnpm/@hookform_resolvers@5.0.1_react-hook-form@7.56.4_react@19.1.0_/node_modules/@hookform/resolvers/zod/dist/zod.mjs";
+import { useEffect as A } from "react";
+import { useForm as w, Controller as C } from "react-hook-form";
+import M from "tiny-invariant";
+import { z as a } from "zod";
+import "@opexa/portal-sdk-core";
+import "@tanstack/react-query";
+import "../../../../constants/index.mjs";
+import "../../../../utils/capitalize.mjs";
+import { parseDecimal as n } from "../../../../utils/parseDecimal.mjs";
+import "../../../../utils/getLocaleInfo.mjs";
+import "../../../../utils/getQueryClient.mjs";
+import "../../../../utils/isMobile.mjs";
+import { toaster as O } from "../../../../utils/toaster.mjs";
+import { useAvailablePromosQuery as P } from "../../../../hooks/useAvailablePromosQuery.mjs";
+import "lodash-es";
+import "../../../../_virtual/index.cjs.mjs";
+import { useCreateMayaDepositMutation as k } from "../../../../hooks/useCreateMayaDepositMutation.mjs";
+import { useDepositsCountQuery as z } from "../../../../hooks/useDepositsCountQuery.mjs";
+import { useDisclosure as N } from "../../../../hooks/useDisclosure.mjs";
+import { useGlobalStore as Q } from "../../../../hooks/useGlobalStore.mjs";
+import "../../../../hooks/useInfiniteQueryHelper.mjs";
+import "usehooks-ts";
+import { usePaymentSettingsQuery as F } from "../../../../hooks/usePaymentSettingsQuery.mjs";
+import { AlertCircleIcon as T } from "../../../../icons/AlertCircleIcon.mjs";
+import { ChevronDownIcon as V } from "../../../../icons/ChevronDownIcon.mjs";
+import { ChevronUpIcon as $ } from "../../../../icons/ChevronUpIcon.mjs";
+import { SpinnerIcon as U } from "../../../../icons/SpinnerIcon.mjs";
+import { XIcon as L } from "../../../../icons/XIcon.mjs";
+import { Root as W, Backdrop as Z, Positioner as B, Content as _, Header as j, CloseTrigger as G, Body as q, Title as H, Description as X, Footer as Y } from "../../../../ui/AlertDialog/AlertDialog.mjs";
+import "../../../../ui/Avatar/Avatar.mjs";
+import "../../../../ui/Badge/Badge.mjs";
+import { Button as p } from "../../../../ui/Button/Button.mjs";
+import "../../../../ui/Checkbox/Checkbox.mjs";
+import "../../../../ui/Clipboard/Clipboard.mjs";
+import "../../../../ui/DatePicker/DatePicker.mjs";
+import "../../../../ui/Dialog/Dialog.mjs";
+import "../../../../ui/Drawer/Drawer.mjs";
+import { Root as J, ErrorText as K } from "../../../../ui/Field/Field.mjs";
+import "../../../../ui/IconButton/iconButton.recipe.mjs";
+import { Root as ee, Label as te, Control as oe, Input as re, IncrementTrigger as ne, DecrementTrigger as me } from "../../../../ui/NumberInput/NumberInput.mjs";
+import "../../../../ui/PinInput/PinInput.mjs";
+import "../../../../ui/Popover/Popover.mjs";
+import "tailwind-merge";
+import "../../../../ui/SegmentGroup/SegmentGroup.mjs";
+import "../../../../ui/Select/Select.mjs";
+import "../../../../ui/Table/Table.mjs";
+import "../../../../ui/Tabs/Tabs.mjs";
+import { AmountChoices as ae } from "../../AmountChoices.mjs";
+import { AvailablePromos as ie } from "../../AvailablePromos.mjs";
+import { useShallow as le } 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 st() {
+  var R;
+  const l = N(), v = Q(
+    le((e) => ({
+      depositWithdrawal: e.depositWithdrawal
+    }))
+  ), u = k({
+    onSuccess(e) {
+      M(e.checkoutUrl), window.open(e.checkoutUrl, "_blank", "noopener,noreferrer"), o.reset(), v.depositWithdrawal.setOpen(!1);
+    },
+    onError(e) {
+      O.error({
+        description: e.message
+      });
+    }
+  }), b = z().data ?? 0, d = F(), c = d.data, i = c == null ? void 0 : c.mayaDepositGatewaySettings, s = n(i == null ? void 0 : i.maximumAmount, 0), m = b <= 0 ? n((R = d.data) == null ? void 0 : R.minimumFirstDepositAmount, 0) : n(i == null ? void 0 : i.minimumAmount, 0), f = P().data ?? [], D = a.object({
+    amount: a.string().superRefine((e, r) => {
+      const t = n(e, 0);
+      t < m && r.addIssue({
+        type: "number",
+        code: a.ZodIssueCode.too_small,
+        inclusive: !0,
+        minimum: m,
+        message: `Minimum amount is ${m.toLocaleString()}`
+      }), t > s && r.addIssue({
+        type: "number",
+        code: a.ZodIssueCode.too_big,
+        inclusive: !0,
+        maximum: s,
+        message: `Maximum amount is ${s.toLocaleString()}`
+      });
+    }),
+    promo: a.string().optional().nullable()
+  }).superRefine((e, r) => {
+    const t = f.find((x) => x.id === e.promo), g = n(t == null ? void 0 : t.minimumDepositAmount, 0), h = n(t == null ? void 0 : t.maximumDepositAmount, 0), y = n(e.amount, 0);
+    t && y < g && r.addIssue({
+      path: ["amount"],
+      code: a.ZodIssueCode.custom,
+      message: `Minimum amount for this promo is ${g.toLocaleString()}`
+    }), t && y > h && r.addIssue({
+      path: ["amount"],
+      code: a.ZodIssueCode.custom,
+      message: `Maximum amount for this promo is ${h}`
+    });
+  }), o = w({
+    mode: "all",
+    resolver: I(D),
+    defaultValues: {
+      amount: "0",
+      promo: null
+    }
+  });
+  A(() => {
+    m && o.reset({
+      amount: m.toString(),
+      promo: null
+    });
+  }, [o, m]);
+  const E = o.handleSubmit(async (e) => {
+    u.mutate({
+      amount: e.amount.toString(),
+      promo: e.promo ?? void 0
+    });
+  });
+  return /* @__PURE__ */ React.createElement("form", { onSubmit: E, noValidate: !0 }, /* @__PURE__ */ React.createElement(
+    C,
+    {
+      control: o.control,
+      name: "amount",
+      render: (e) => {
+        var r;
+        return /* @__PURE__ */ React.createElement(J, { invalid: !!o.formState.errors.amount }, /* @__PURE__ */ React.createElement(
+          ee,
+          {
+            min: 0,
+            step: 1,
+            value: e.field.value,
+            onValueChange: (t) => {
+              e.field.onChange(t.value);
+            },
+            formatOptions: {
+              maximumFractionDigits: 2,
+              minimumFractionDigits: 0
+            },
+            allowMouseWheel: !0
+          },
+          /* @__PURE__ */ React.createElement(te, null, "Enter amount you want to deposit"),
+          /* @__PURE__ */ React.createElement(oe, null, /* @__PURE__ */ React.createElement(re, null), /* @__PURE__ */ React.createElement(ne, null, /* @__PURE__ */ React.createElement($, null)), /* @__PURE__ */ React.createElement(me, null, /* @__PURE__ */ React.createElement(V, null)))
+        ), /* @__PURE__ */ React.createElement(K, null, (r = o.formState.errors.amount) == null ? void 0 : r.message));
+      }
+    }
+  ), /* @__PURE__ */ React.createElement(
+    ae,
+    {
+      value: n(o.watch("amount"), 0),
+      onChange: (e) => {
+        o.setValue("amount", e.toString(), {
+          shouldTouch: !0,
+          shouldDirty: !0,
+          shouldValidate: !0
+        });
+      },
+      min: m,
+      max: s,
+      className: "mt-xl"
+    }
+  ), /* @__PURE__ */ React.createElement(
+    C,
+    {
+      control: o.control,
+      name: "promo",
+      render: (e) => /* @__PURE__ */ React.createElement(
+        ie,
+        {
+          className: "mt-4xl",
+          value: e.field.value,
+          onChange: e.field.onChange
+        }
+      )
+    }
+  ), /* @__PURE__ */ React.createElement("p", { className: "mt-4xl text-xs" }, "Upon clicking the deposit button, you agree to the", " ", /* @__PURE__ */ React.createElement("button", { type: "button", className: "underline underline-offset-2" }, "Terms of Use and Privacy Policy"), "."), /* @__PURE__ */ React.createElement(
+    p,
+    {
+      type: "submit",
+      className: "mt-4.5",
+      disabled: u.isPending,
+      onClick: async (e) => {
+        await o.trigger("amount") && (f.length <= 0 || o.getValues("promo") || (e.preventDefault(), l.setOpen(!0)));
+      }
+    },
+    u.isPending ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(U, null), "Processing...") : "Deposit"
+  ), /* @__PURE__ */ React.createElement(
+    W,
+    {
+      role: "alertdialog",
+      open: l.open,
+      onOpenChange: (e) => {
+        l.setOpen(e.open);
+      },
+      lazyMount: !0,
+      unmountOnExit: !0,
+      closeOnEscape: !1,
+      closeOnInteractOutside: !1
+    },
+    /* @__PURE__ */ React.createElement(S, null, /* @__PURE__ */ React.createElement(Z, { className: "!z-[calc(var(--z-dialog)+10)]" }), /* @__PURE__ */ React.createElement(B, { className: "!z-[calc(var(--z-dialog)+25)]" }, /* @__PURE__ */ React.createElement(_, null, /* @__PURE__ */ React.createElement(j, null, /* @__PURE__ */ React.createElement("div", { className: "flex size-12 items-center justify-center rounded-full bg-[#FEE4E2] text-[#D92D20]" }, /* @__PURE__ */ React.createElement(T, null)), /* @__PURE__ */ React.createElement(G, null, /* @__PURE__ */ React.createElement(L, null))), /* @__PURE__ */ React.createElement(q, null, /* @__PURE__ */ React.createElement(H, null, "Submit deposit request without promo?"), /* @__PURE__ */ React.createElement(X, null, "You haven’t selected a promo. Are you sure you want to proceed without one?")), /* @__PURE__ */ React.createElement(Y, null, /* @__PURE__ */ React.createElement(
+      p,
+      {
+        variant: "outline",
+        colorScheme: "gray",
+        onClick: () => {
+          l.setOpen(!1);
+        }
+      },
+      "Cancel"
+    ), /* @__PURE__ */ React.createElement(
+      p,
+      {
+        onClick: () => {
+          E(), l.setOpen(!1);
+        }
+      },
+      "Proceed"
+    )))))
+  ));
+}
+export {
+  st as MayaDeposit
+};

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDeposit.d.ts

@@ -1 +1 @@
-export declare function OnlineBankDeposit(): import("react").JSX.Element;
+export declare function OnlineBankDeposit(): import("react/jsx-runtime").JSX.Element;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDeposit.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./OnlineBankDepositContext.js"),t=require("./OnlineBankDepositForm.js"),i=require("./OnlineBankDepositLoading.js"),o=require("./OnlineBankDepositSuccess.js"),l=require("./OnlineBankDepositVCA.js"),a=require("./useOnlineBankDeposit.js");function s(){const e=a.useOnlineBankDeposit();return React.createElement(n.OnlineBankDepositContext,{value:e},e.view==="FORM"&&React.createElement(t.OnlineBankDepositForm,null),e.view==="LOADING"&&React.createElement(i.OnlineBankDepositLoading,null),e.view==="SUCCESS"&&React.createElement(o.OnlineBankDepositSuccess,null),e.view==="VCA"&&React.createElement(l.OnlineBankDepositVCA,null))}exports.OnlineBankDeposit=s;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDeposit.mjs

@@ -0,0 +1,13 @@
+import { OnlineBankDepositContext as n } from "./OnlineBankDepositContext.mjs";
+import { OnlineBankDepositForm as t } from "./OnlineBankDepositForm.mjs";
+import { OnlineBankDepositLoading as i } from "./OnlineBankDepositLoading.mjs";
+import { OnlineBankDepositSuccess as o } from "./OnlineBankDepositSuccess.mjs";
+import { OnlineBankDepositVCA as l } from "./OnlineBankDepositVCA.mjs";
+import { useOnlineBankDeposit as r } from "./useOnlineBankDeposit.mjs";
+function O() {
+  const e = r();
+  return /* @__PURE__ */ React.createElement(n, { value: e }, e.view === "FORM" && /* @__PURE__ */ React.createElement(t, null), e.view === "LOADING" && /* @__PURE__ */ React.createElement(i, null), e.view === "SUCCESS" && /* @__PURE__ */ React.createElement(o, null), e.view === "VCA" && /* @__PURE__ */ React.createElement(l, null));
+}
+export {
+  O as OnlineBankDeposit
+};

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositContext.d.ts

@@ -1,7 +1,7 @@
-export declare const OnlineBankDepositContext: import("react").Context<{
+export declare const OnlineBankDepositContext: import('react').Context<{
     vca: string | null;
     view: "LOADING" | "FORM" | "SUCCESS" | "VCA";
-    generateVca: import("@tanstack/react-query").UseMutateFunction<import("@opexa/portal-sdk-core").Deposit, Error, {
+    generateVca: import('@tanstack/react-query').UseMutateFunction<import('@opexa/portal-sdk-core').Deposit, Error, {
         amount: string;
         promo?: string | undefined;
         id?: string | undefined;
@@ -12,7 +12,7 @@ export declare const OnlineBankDepositContext: import("react").Context<{
 export declare const useOnlineBankDepositContext: () => {
     vca: string | null;
     view: "LOADING" | "FORM" | "SUCCESS" | "VCA";
-    generateVca: import("@tanstack/react-query").UseMutateFunction<import("@opexa/portal-sdk-core").Deposit, Error, {
+    generateVca: import('@tanstack/react-query').UseMutateFunction<import('@opexa/portal-sdk-core').Deposit, Error, {
         amount: string;
         promo?: string | undefined;
         id?: string | undefined;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositContext.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react"),o=require("tiny-invariant"),n=t.createContext(null),i=()=>{const e=t.useContext(n);return o(e),e};exports.OnlineBankDepositContext=n;exports.useOnlineBankDepositContext=i;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositContext.mjs

@@ -0,0 +1,10 @@
+import { createContext as n, useContext as e } from "react";
+import o from "tiny-invariant";
+const r = n(null), x = () => {
+  const t = e(r);
+  return o(t), t;
+};
+export {
+  r as OnlineBankDepositContext,
+  x as useOnlineBankDepositContext
+};

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositForm.d.ts

@@ -1 +1 @@
-export declare function OnlineBankDepositForm(): import("react").JSX.Element;
+export declare function OnlineBankDepositForm(): import("react/jsx-runtime").JSX.Element;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositForm.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const k=require("@ark-ui/react"),Q=require("../../../../node_modules/.pnpm/@hookform_resolvers@5.0.1_react-hook-form@7.56.4_react@19.1.0_/node_modules/@hookform/resolvers/zod/dist/zod.js"),P=require("lodash-es"),T=require("react"),E=require("react-hook-form"),c=require("zod");require("@opexa/portal-sdk-core");require("@tanstack/react-query");require("tiny-invariant");require("../../../../constants/index.js");require("../../../../utils/capitalize.js");const u=require("../../../../utils/parseDecimal.js");require("../../../../utils/getLocaleInfo.js");require("../../../../utils/getQueryClient.js");require("../../../../utils/isMobile.js");require("../../../../utils/toaster.js");const L=require("../../../../hooks/useAvailablePromosQuery.js");require("../../../../_virtual/index.cjs.js");const F=require("../../../../hooks/useDepositsCountQuery.js"),M=require("../../../../hooks/useDisclosure.js");require("../../../../hooks/useGlobalStore.js");require("../../../../hooks/useInfiniteQueryHelper.js");const N=require("../../../../hooks/useInstapayBankListQuery.js");require("usehooks-ts");const V=require("../../../../hooks/usePaymentSettingsQuery.js"),w=require("../../../../icons/AlertCircleIcon.js"),$=require("../../../../icons/CheckIcon.js"),x=require("../../../../icons/ChevronDownIcon.js"),U=require("../../../../icons/ChevronUpIcon.js"),Z=require("../../../../icons/XIcon.js"),o=require("../../../../ui/AlertDialog/AlertDialog.js");require("../../../../ui/Avatar/Avatar.js");require("../../../../ui/Badge/Badge.js");const R=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");const A=require("../../../../ui/Field/Field.js");require("../../../../ui/IconButton/iconButton.recipe.js");const s=require("../../../../ui/NumberInput/NumberInput.js");require("../../../../ui/PinInput/PinInput.js");require("../../../../ui/Popover/Popover.js");require("tailwind-merge");require("../../../../ui/SegmentGroup/SegmentGroup.js");const r=require("../../../../ui/Select/Select.js");require("../../../../ui/Table/Table.js");require("../../../../ui/Tabs/Tabs.js");const j=require("../../AmountChoices.js"),H=require("../../AvailablePromos.js"),W=require("./OnlineBankDepositContext.js");function X(){var h,D;const S=W.useOnlineBankDepositContext(),m=M.useDisclosure(),z=F.useDepositsCountQuery().data??0,q=V.usePaymentSettingsQuery(),p=q.data,i=p==null?void 0:p.onlineBankDepositGatewaySettings,d=u.parseDecimal(i==null?void 0:i.maximumAmount,0),l=z<=0?u.parseDecimal((h=q.data)==null?void 0:h.minimumFirstDepositAmount,0):u.parseDecimal(i==null?void 0:i.minimumAmount,0),g=N.useInstapayBankListQuery().data??[],C=L.useAvailablePromosQuery().data??[],B=c.z.object({amount:c.z.string().superRefine((e,a)=>{const t=u.parseDecimal(e,0);t<l&&a.addIssue({type:"number",code:c.z.ZodIssueCode.too_small,inclusive:!0,minimum:l,message:`Minimum amount is ${l.toLocaleString()}`}),t>d&&a.addIssue({type:"number",code:c.z.ZodIssueCode.too_big,inclusive:!0,maximum:d,message:`Maximum amount is ${d.toLocaleString()}`})}),promo:c.z.string().optional().nullable()}).superRefine((e,a)=>{const t=C.find(O=>O.id===e.promo),I=u.parseDecimal(t==null?void 0:t.minimumDepositAmount,0),v=u.parseDecimal(t==null?void 0:t.maximumDepositAmount,0),b=u.parseDecimal(e.amount,0);t&&b<I&&a.addIssue({path:["amount"],code:c.z.ZodIssueCode.custom,message:`Minimum amount for this promo is ${I.toLocaleString()}`}),t&&b>v&&a.addIssue({path:["amount"],code:c.z.ZodIssueCode.custom,message:`Maximum amount for this promo is ${v}`})}),n=E.useForm({mode:"all",resolver:Q.zodResolver(B),defaultValues:{amount:"0",promo:null}});T.useEffect(()=>{l&&n.reset({amount:l.toString(),promo:null})},[n,l]);const y=n.handleSubmit(async e=>{S.generateVca({amount:e.amount.toString(),promo:e.promo??void 0},{onSuccess(){n.reset()}})}),f=k.createListCollection({items:g,itemToValue:e=>e.code,itemToString:e=>e.name});return React.createElement("form",{onSubmit:y,noValidate:!0},React.createElement(r.Root,{lazyMount:!0,collection:f,positioning:{sameWidth:!0},value:[((D=g.at(0))==null?void 0:D.code)??""],onValueChange:P.noop},React.createElement(r.Label,null,"Select bank"),React.createElement(r.Trigger,null,React.createElement(r.ValueText,null),React.createElement(r.Indicator,{asChild:!0},React.createElement(x.ChevronDownIcon,null))),React.createElement(r.Positioner,null,React.createElement(r.Content,null,f.items.map(e=>React.createElement(r.Item,{key:e.id,item:e},React.createElement(r.ItemText,null,e.name),React.createElement(r.ItemIndicator,{asChild:!0},React.createElement($.CheckIcon,null))))))),React.createElement(E.Controller,{control:n.control,name:"amount",render:e=>{var a;return React.createElement(A.Root,{invalid:!!n.formState.errors.amount,className:"mt-4"},React.createElement(s.Root,{min:0,step:1,value:e.field.value,onValueChange:t=>{e.field.onChange(t.value)},formatOptions:{maximumFractionDigits:2,minimumFractionDigits:0},allowMouseWheel:!0},React.createElement(s.Label,null,"Enter amount you want to deposit"),React.createElement(s.Control,null,React.createElement(s.Input,null),React.createElement(s.IncrementTrigger,null,React.createElement(U.ChevronUpIcon,null)),React.createElement(s.DecrementTrigger,null,React.createElement(x.ChevronDownIcon,null)))),React.createElement(A.ErrorText,null,(a=n.formState.errors.amount)==null?void 0:a.message))}}),React.createElement(j.AmountChoices,{value:u.parseDecimal(n.watch("amount"),0),onChange:e=>{n.setValue("amount",e.toString(),{shouldTouch:!0,shouldDirty:!0,shouldValidate:!0})},min:l,max:d,className:"mt-xl"}),React.createElement(E.Controller,{control:n.control,name:"promo",render:e=>React.createElement(H.AvailablePromos,{className:"mt-4xl",value:e.field.value,onChange:e.field.onChange})}),React.createElement("p",{className:"mt-4xl text-xs"},"Upon clicking the deposit button, you agree to the"," ",React.createElement("button",{type:"button",className:"underline underline-offset-2"},"Terms of Use and Privacy Policy"),"."),React.createElement(R.Button,{type:"submit",className:"mt-4.5",onClick:async e=>{await n.trigger("amount")&&(C.length<=0||n.getValues("promo")||(e.preventDefault(),m.setOpen(!0)))}},"Deposit"),React.createElement(o.Root,{role:"alertdialog",open:m.open,onOpenChange:e=>{m.setOpen(e.open)},lazyMount:!0,unmountOnExit:!0,closeOnEscape:!1,closeOnInteractOutside:!1},React.createElement(k.Portal,null,React.createElement(o.Backdrop,{className:"!z-[calc(var(--z-dialog)+10)]"}),React.createElement(o.Positioner,{className:"!z-[calc(var(--z-dialog)+25)]"},React.createElement(o.Content,null,React.createElement(o.Header,null,React.createElement("div",{className:"flex size-12 items-center justify-center rounded-full bg-[#FEE4E2] text-[#D92D20]"},React.createElement(w.AlertCircleIcon,null)),React.createElement(o.CloseTrigger,null,React.createElement(Z.XIcon,null))),React.createElement(o.Body,null,React.createElement(o.Title,null,"Submit deposit request without promo?"),React.createElement(o.Description,null,"You haven’t selected a promo. Are you sure you want to proceed without one?")),React.createElement(o.Footer,null,React.createElement(R.Button,{variant:"outline",colorScheme:"gray",onClick:()=>{m.setOpen(!1)}},"Cancel"),React.createElement(R.Button,{onClick:()=>{y(),m.setOpen(!1)}},"Proceed")))))))}exports.OnlineBankDepositForm=X;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositForm.mjs

@@ -0,0 +1,229 @@
+import { createListCollection as A, Portal as O } from "@ark-ui/react";
+import { zodResolver as T } from "../../../../node_modules/.pnpm/@hookform_resolvers@5.0.1_react-hook-form@7.56.4_react@19.1.0_/node_modules/@hookform/resolvers/zod/dist/zod.mjs";
+import { noop as L } from "lodash-es";
+import { useEffect as Q } from "react";
+import { useForm as B, Controller as I } from "react-hook-form";
+import { z as m } from "zod";
+import "@opexa/portal-sdk-core";
+import "@tanstack/react-query";
+import "tiny-invariant";
+import "../../../../constants/index.mjs";
+import "../../../../utils/capitalize.mjs";
+import { parseDecimal as r } from "../../../../utils/parseDecimal.mjs";
+import "../../../../utils/getLocaleInfo.mjs";
+import "../../../../utils/getQueryClient.mjs";
+import "../../../../utils/isMobile.mjs";
+import "../../../../utils/toaster.mjs";
+import { useAvailablePromosQuery as P } from "../../../../hooks/useAvailablePromosQuery.mjs";
+import "../../../../_virtual/index.cjs.mjs";
+import { useDepositsCountQuery as V } from "../../../../hooks/useDepositsCountQuery.mjs";
+import { useDisclosure as $ } from "../../../../hooks/useDisclosure.mjs";
+import "../../../../hooks/useGlobalStore.mjs";
+import "../../../../hooks/useInfiniteQueryHelper.mjs";
+import { useInstapayBankListQuery as z } from "../../../../hooks/useInstapayBankListQuery.mjs";
+import "usehooks-ts";
+import { usePaymentSettingsQuery as M } from "../../../../hooks/usePaymentSettingsQuery.mjs";
+import { AlertCircleIcon as N } from "../../../../icons/AlertCircleIcon.mjs";
+import { CheckIcon as F } from "../../../../icons/CheckIcon.mjs";
+import { ChevronDownIcon as x } from "../../../../icons/ChevronDownIcon.mjs";
+import { ChevronUpIcon as w } from "../../../../icons/ChevronUpIcon.mjs";
+import { XIcon as Z } from "../../../../icons/XIcon.mjs";
+import { Root as U, Backdrop as j, Positioner as W, Content as _, Header as q, CloseTrigger as G, Body as H, Title as X, Description as Y, Footer as J } from "../../../../ui/AlertDialog/AlertDialog.mjs";
+import "../../../../ui/Avatar/Avatar.mjs";
+import "../../../../ui/Badge/Badge.mjs";
+import { Button as u } from "../../../../ui/Button/Button.mjs";
+import "../../../../ui/Checkbox/Checkbox.mjs";
+import "../../../../ui/Clipboard/Clipboard.mjs";
+import "../../../../ui/DatePicker/DatePicker.mjs";
+import "../../../../ui/Dialog/Dialog.mjs";
+import "../../../../ui/Drawer/Drawer.mjs";
+import { Root as K, ErrorText as ee } from "../../../../ui/Field/Field.mjs";
+import "../../../../ui/IconButton/iconButton.recipe.mjs";
+import { Root as te, Label as oe, Control as ne, Input as re, IncrementTrigger as ae, DecrementTrigger as me } from "../../../../ui/NumberInput/NumberInput.mjs";
+import "../../../../ui/PinInput/PinInput.mjs";
+import "../../../../ui/Popover/Popover.mjs";
+import "tailwind-merge";
+import "../../../../ui/SegmentGroup/SegmentGroup.mjs";
+import { Root as ie, Label as le, Trigger as ce, ValueText as se, Indicator as ue, Positioner as pe, Content as de, Item as fe, ItemText as Re, ItemIndicator as Ee } from "../../../../ui/Select/Select.mjs";
+import "../../../../ui/Table/Table.mjs";
+import "../../../../ui/Tabs/Tabs.mjs";
+import { AmountChoices as ge } from "../../AmountChoices.mjs";
+import { AvailablePromos as Ce } from "../../AvailablePromos.mjs";
+import { useOnlineBankDepositContext as he } from "./OnlineBankDepositContext.mjs";
+function vt() {
+  var g, C;
+  const b = he(), l = $(), D = V().data ?? 0, p = M(), s = p.data, i = s == null ? void 0 : s.onlineBankDepositGatewaySettings, c = r(i == null ? void 0 : i.maximumAmount, 0), a = D <= 0 ? r((g = p.data) == null ? void 0 : g.minimumFirstDepositAmount, 0) : r(i == null ? void 0 : i.minimumAmount, 0), d = z().data ?? [], f = P().data ?? [], k = m.object({
+    amount: m.string().superRefine((e, n) => {
+      const t = r(e, 0);
+      t < a && n.addIssue({
+        type: "number",
+        code: m.ZodIssueCode.too_small,
+        inclusive: !0,
+        minimum: a,
+        message: `Minimum amount is ${a.toLocaleString()}`
+      }), t > c && n.addIssue({
+        type: "number",
+        code: m.ZodIssueCode.too_big,
+        inclusive: !0,
+        maximum: c,
+        message: `Maximum amount is ${c.toLocaleString()}`
+      });
+    }),
+    promo: m.string().optional().nullable()
+  }).superRefine((e, n) => {
+    const t = f.find((S) => S.id === e.promo), h = r(t == null ? void 0 : t.minimumDepositAmount, 0), y = r(t == null ? void 0 : t.maximumDepositAmount, 0), v = r(e.amount, 0);
+    t && v < h && n.addIssue({
+      path: ["amount"],
+      code: m.ZodIssueCode.custom,
+      message: `Minimum amount for this promo is ${h.toLocaleString()}`
+    }), t && v > y && n.addIssue({
+      path: ["amount"],
+      code: m.ZodIssueCode.custom,
+      message: `Maximum amount for this promo is ${y}`
+    });
+  }), o = B({
+    mode: "all",
+    resolver: T(k),
+    defaultValues: {
+      amount: "0",
+      promo: null
+    }
+  });
+  Q(() => {
+    a && o.reset({
+      amount: a.toString(),
+      promo: null
+    });
+  }, [o, a]);
+  const R = o.handleSubmit(async (e) => {
+    b.generateVca(
+      {
+        amount: e.amount.toString(),
+        promo: e.promo ?? void 0
+      },
+      {
+        onSuccess() {
+          o.reset();
+        }
+      }
+    );
+  }), E = A({
+    items: d,
+    itemToValue: (e) => e.code,
+    itemToString: (e) => e.name
+  });
+  return /* @__PURE__ */ React.createElement("form", { onSubmit: R, noValidate: !0 }, /* @__PURE__ */ React.createElement(
+    ie,
+    {
+      lazyMount: !0,
+      collection: E,
+      positioning: { sameWidth: !0 },
+      value: [((C = d.at(0)) == null ? void 0 : C.code) ?? ""],
+      onValueChange: L
+    },
+    /* @__PURE__ */ React.createElement(le, null, "Select bank"),
+    /* @__PURE__ */ React.createElement(ce, null, /* @__PURE__ */ React.createElement(se, null), /* @__PURE__ */ React.createElement(ue, { asChild: !0 }, /* @__PURE__ */ React.createElement(x, null))),
+    /* @__PURE__ */ React.createElement(pe, null, /* @__PURE__ */ React.createElement(de, null, E.items.map((e) => /* @__PURE__ */ React.createElement(fe, { key: e.id, item: e }, /* @__PURE__ */ React.createElement(Re, null, e.name), /* @__PURE__ */ React.createElement(Ee, { asChild: !0 }, /* @__PURE__ */ React.createElement(F, null))))))
+  ), /* @__PURE__ */ React.createElement(
+    I,
+    {
+      control: o.control,
+      name: "amount",
+      render: (e) => {
+        var n;
+        return /* @__PURE__ */ React.createElement(K, { invalid: !!o.formState.errors.amount, className: "mt-4" }, /* @__PURE__ */ React.createElement(
+          te,
+          {
+            min: 0,
+            step: 1,
+            value: e.field.value,
+            onValueChange: (t) => {
+              e.field.onChange(t.value);
+            },
+            formatOptions: {
+              maximumFractionDigits: 2,
+              minimumFractionDigits: 0
+            },
+            allowMouseWheel: !0
+          },
+          /* @__PURE__ */ React.createElement(oe, null, "Enter amount you want to deposit"),
+          /* @__PURE__ */ React.createElement(ne, null, /* @__PURE__ */ React.createElement(re, null), /* @__PURE__ */ React.createElement(ae, null, /* @__PURE__ */ React.createElement(w, null)), /* @__PURE__ */ React.createElement(me, null, /* @__PURE__ */ React.createElement(x, null)))
+        ), /* @__PURE__ */ React.createElement(ee, null, (n = o.formState.errors.amount) == null ? void 0 : n.message));
+      }
+    }
+  ), /* @__PURE__ */ React.createElement(
+    ge,
+    {
+      value: r(o.watch("amount"), 0),
+      onChange: (e) => {
+        o.setValue("amount", e.toString(), {
+          shouldTouch: !0,
+          shouldDirty: !0,
+          shouldValidate: !0
+        });
+      },
+      min: a,
+      max: c,
+      className: "mt-xl"
+    }
+  ), /* @__PURE__ */ React.createElement(
+    I,
+    {
+      control: o.control,
+      name: "promo",
+      render: (e) => /* @__PURE__ */ React.createElement(
+        Ce,
+        {
+          className: "mt-4xl",
+          value: e.field.value,
+          onChange: e.field.onChange
+        }
+      )
+    }
+  ), /* @__PURE__ */ React.createElement("p", { className: "mt-4xl text-xs" }, "Upon clicking the deposit button, you agree to the", " ", /* @__PURE__ */ React.createElement("button", { type: "button", className: "underline underline-offset-2" }, "Terms of Use and Privacy Policy"), "."), /* @__PURE__ */ React.createElement(
+    u,
+    {
+      type: "submit",
+      className: "mt-4.5",
+      onClick: async (e) => {
+        await o.trigger("amount") && (f.length <= 0 || o.getValues("promo") || (e.preventDefault(), l.setOpen(!0)));
+      }
+    },
+    "Deposit"
+  ), /* @__PURE__ */ React.createElement(
+    U,
+    {
+      role: "alertdialog",
+      open: l.open,
+      onOpenChange: (e) => {
+        l.setOpen(e.open);
+      },
+      lazyMount: !0,
+      unmountOnExit: !0,
+      closeOnEscape: !1,
+      closeOnInteractOutside: !1
+    },
+    /* @__PURE__ */ React.createElement(O, null, /* @__PURE__ */ React.createElement(j, { className: "!z-[calc(var(--z-dialog)+10)]" }), /* @__PURE__ */ React.createElement(W, { className: "!z-[calc(var(--z-dialog)+25)]" }, /* @__PURE__ */ React.createElement(_, null, /* @__PURE__ */ React.createElement(q, null, /* @__PURE__ */ React.createElement("div", { className: "flex size-12 items-center justify-center rounded-full bg-[#FEE4E2] text-[#D92D20]" }, /* @__PURE__ */ React.createElement(N, null)), /* @__PURE__ */ React.createElement(G, null, /* @__PURE__ */ React.createElement(Z, null))), /* @__PURE__ */ React.createElement(H, null, /* @__PURE__ */ React.createElement(X, null, "Submit deposit request without promo?"), /* @__PURE__ */ React.createElement(Y, null, "You haven’t selected a promo. Are you sure you want to proceed without one?")), /* @__PURE__ */ React.createElement(J, null, /* @__PURE__ */ React.createElement(
+      u,
+      {
+        variant: "outline",
+        colorScheme: "gray",
+        onClick: () => {
+          l.setOpen(!1);
+        }
+      },
+      "Cancel"
+    ), /* @__PURE__ */ React.createElement(
+      u,
+      {
+        onClick: () => {
+          R(), l.setOpen(!1);
+        }
+      },
+      "Proceed"
+    )))))
+  ));
+}
+export {
+  vt as OnlineBankDepositForm
+};

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositLoading.d.ts

@@ -1 +1 @@
-export declare function OnlineBankDepositLoading(): import("react").JSX.Element;
+export declare function OnlineBankDepositLoading(): import("react/jsx-runtime").JSX.Element;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositLoading.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../icons/SpinnerIcon.js");function t(){return React.createElement("div",{className:"bg-gray-50 rounded-lg px-10 py-12 lg:py-16"},React.createElement(e.SpinnerIcon,{className:"mx-auto size-8 lg:size-10"}),React.createElement("p",{className:"mt-5 text-center text-lg font-semibold lg:text-xl"},"Processing Your Deposit"),React.createElement("p",{className:"text-gray-700 mt-3 text-center text-sm lg:text-base"},"Your deposit is being processed. Please hold tight as we verify the account details and amount. Once verified, a Virtual Collection Account (VCA) will be displayed for you to copy and paste in a designated field and complete the transaction."))}exports.OnlineBankDepositLoading=t;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositLoading.mjs

@@ -0,0 +1,7 @@
+import { SpinnerIcon as e } from "../../../../icons/SpinnerIcon.mjs";
+function a() {
+  return /* @__PURE__ */ React.createElement("div", { className: "bg-gray-50 rounded-lg px-10 py-12 lg:py-16" }, /* @__PURE__ */ React.createElement(e, { className: "mx-auto size-8 lg:size-10" }), /* @__PURE__ */ React.createElement("p", { className: "mt-5 text-center text-lg font-semibold lg:text-xl" }, "Processing Your Deposit"), /* @__PURE__ */ React.createElement("p", { className: "text-gray-700 mt-3 text-center text-sm lg:text-base" }, "Your deposit is being processed. Please hold tight as we verify the account details and amount. Once verified, a Virtual Collection Account (VCA) will be displayed for you to copy and paste in a designated field and complete the transaction."));
+}
+export {
+  a as OnlineBankDepositLoading
+};

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositSuccess.d.ts

@@ -1 +1 @@
-export declare function OnlineBankDepositSuccess(): import("react").JSX.Element;
+export declare function OnlineBankDepositSuccess(): import("react/jsx-runtime").JSX.Element;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositSuccess.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../icons/CheckCircleBrokenIcon.js");function t(){return React.createElement("div",{className:"bg-gray-50 rounded-lg px-10 py-12 lg:p-16"},React.createElement(e.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."))}exports.OnlineBankDepositSuccess=t;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositSuccess.mjs

@@ -0,0 +1,7 @@
+import { CheckCircleBrokenIcon as e } from "../../../../icons/CheckCircleBrokenIcon.mjs";
+function a() {
+  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."));
+}
+export {
+  a as OnlineBankDepositSuccess
+};

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositVCA.d.ts

@@ -1 +1 @@
-export declare function OnlineBankDepositVCA(): import("react").JSX.Element;
+export declare function OnlineBankDepositVCA(): import("react/jsx-runtime").JSX.Element;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositVCA.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("@ark-ui/react"),l=require("../../../../_virtual/image.js"),c=require("../../../../icons/BankIcon.js"),i=require("../../../../icons/XIcon.js"),o=require("../../../../images/bank-icon.png.js");require("../../../../ui/AlertDialog/AlertDialog.js");require("../../../../ui/Avatar/Avatar.js");require("../../../../ui/Badge/Badge.js");const s=require("../../../../ui/Button/Button.js");require("../../../../ui/Checkbox/Checkbox.js");const t=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("../../../../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("./OnlineBankDepositContext.js");function m(){const a=u.useOnlineBankDepositContext();return React.createElement("div",{className:"bg-gray-50 rounded-lg px-10 py-12 lg:p-16"},React.createElement(l,{src:o,alt:"",width:52,height:44.2,className:"mx-auto h-auto w-[3.25rem]"}),React.createElement("p",{className:"mt-8 text-center font-semibold"},"Your unique Virtual Collection Account (VCA) is:"),React.createElement(t.Root,{value:a.vca??"",className:"mx-auto mt-6 max-w-[22.5rem]"},React.createElement(t.Control,{className:"flex flex-col gap-4 lg:flex-row"},React.createElement(t.Input,{className:"lg:grow"}),React.createElement(t.Context,null,r=>React.createElement(t.Trigger,{asChild:!0},React.createElement(s.Button,{fullWidth:!1,className:"w-full shrink-0 lg:w-28"},r.copied?"Copied":"Copy VCA"))))),React.createElement(p,null))}function p(){return React.createElement("p",{className:"text-gray-500 mt-6 text-center text-xs"},"Need help using the online bank for payment?"," ",React.createElement(e.Root,{lazyMount:!0,unmountOnExit:!0},React.createElement(e.Trigger,{className:"text-blue-500"},"See instructions"),React.createElement(n.Portal,null,React.createElement(e.Backdrop,{className:"!z-[calc(var(--z-dialog)+2)]"}),React.createElement(e.Positioner,{className:"!z-[calc(var(--z-dialog)+3)] flex items-center justify-center"},React.createElement(e.Content,{className:"mx-auto w-[calc(100%-2rem)] rounded-lg bg-white p-4xl lg:w-[33.625rem]"},React.createElement(e.CloseTrigger,null,React.createElement(i.XIcon,null)),React.createElement(e.Body,null,React.createElement("div",{className:"flex items-center gap-xl"},React.createElement("div",{className:"border-gray-200 flex size-11 items-center justify-center rounded-lg border"},React.createElement(c.BankIcon,{className:"text-gray-600 size-6"})),React.createElement(e.Title,{className:"text-lg font-semibold"},"How to Use Online Bank for Payment")),React.createElement(e.Description,{className:"mt-5"},"Follow these simple steps to complete your transaction:"),React.createElement("ol",{className:"mt-3 list-inside list-decimal space-y-3"},React.createElement("li",null,"Click the 'Copy VCA' button to save your unique account number."),React.createElement("li",null,"Log in to your Online Banking: Open your bank's app or website."),React.createElement("li",null,"Initiate a Deposit: Choose the option to make a deposit."),React.createElement("li",null,"Enter VCA: Paste your VCA in the designated field."),React.createElement("li",null,"Complete Transaction: Follow your bank's prompts to finalize the deposit.")),React.createElement("p",{className:"mt-3"},"Note: Please ensure that the deposit amount you enter matches exactly.")))))))}exports.OnlineBankDepositVCA=m;