@opexa/portal-components 0.0.27 → 0.0.28

package/dist/components/Account/Account.mjs

@@ -1,480 +0,0 @@
-"use client";
-import { jsxs as o, Fragment as k, jsx as e } from "react/jsx-runtime";
-import { Portal as g } from "@ark-ui/react";
-import h from "next/image";
-import l from "next/link";
-import { useShallow as m } from "zustand/shallow";
-import { useAccountQuery as L } from "../../client/hooks/useAccountQuery.mjs";
-import "@tanstack/react-query";
-import "../../utils/capitalize.mjs";
-import { formatNumber as p } from "../../utils/formatNumber.mjs";
-import "../../constants/index.mjs";
-import "../../utils/getLocaleInfo.mjs";
-import "../../utils/getQueryClient.mjs";
-import "../../utils/isMobile.mjs";
-import { parseDecimal as b } from "../../utils/parseDecimal.mjs";
-import "../../client/services/getSession.mjs";
-import "@opexa/portal-sdk-core";
-import "tiny-invariant";
-import "react";
-import "lodash-es";
-import "@opexa/portal-sdk-core/object-id";
-import { useGlobalStore as d } from "../../client/hooks/useGlobalStore.mjs";
-import "../../client/hooks/useInfiniteQueryHelper.mjs";
-import { useLocaleInfo as w } from "../../client/hooks/useLocaleInfo.mjs";
-import "usehooks-ts";
-import { useSignOutMutation as R } from "../../client/hooks/useSignOutMutation.mjs";
-import { useUnreadMessagesCountQuery as P } from "../../client/hooks/useUnreadMessagesCountQuery.mjs";
-import { useWalletQuery as M } from "../../client/hooks/useWalletQuery.mjs";
-import { AlertCircleIcon as z } from "../../icons/AlertCircleIcon.mjs";
-import { ChevronLeftIcon as B } from "../../icons/ChevronLeftIcon.mjs";
-import { ChevronRightIcon as r } from "../../icons/ChevronRightIcon.mjs";
-import { CoinsStacked02Icon as W } from "../../icons/CoinsStacked02Icon.mjs";
-import { CoinsSwap02Icon as T } from "../../icons/CoinsSwap02Icon.mjs";
-import { CreditCard02Icon as A } from "../../icons/CreditCard02Icon.mjs";
-import { FileCheck02Icon as D } from "../../icons/FileCheck02Icon.mjs";
-import { Gift01Icon as Q } from "../../icons/Gift01Icon.mjs";
-import { Lock01Icon as V } from "../../icons/Lock01Icon.mjs";
-import { Logout01Icon as y } from "../../icons/Logout01Icon.mjs";
-import { Settings02Icon as $ } from "../../icons/Settings02Icon.mjs";
-import { User01Icon as E } from "../../icons/User01Icon.mjs";
-import { XIcon as j } from "../../icons/XIcon.mjs";
-import f from "../../images/placeholder-avatar.png.mjs";
-import "../../ui/AlertDialog/AlertDialog.mjs";
-import "../../ui/Avatar/Avatar.mjs";
-import { Root as F, Indicator as G, Label as H } from "../../ui/Badge/Badge.mjs";
-import { Button as x } from "../../ui/Button/Button.mjs";
-import "../../ui/Checkbox/Checkbox.mjs";
-import "../../ui/Clipboard/Clipboard.mjs";
-import "../../ui/Collapsible/Collapsible.mjs";
-import "../../ui/Combobox/Combobox.mjs";
-import "../../ui/DatePicker/DatePicker.mjs";
-import "../../ui/Dialog/Dialog.mjs";
-import { Root as X, Trigger as q, Positioner as J, Content as K } from "../../ui/Drawer/Drawer.mjs";
-import "../../ui/Field/Field.mjs";
-import { IconButton as I } from "../../ui/IconButton/IconButton.mjs";
-import "../../ui/NumberInput/NumberInput.mjs";
-import "../../ui/PasswordInput/PasswordInput.mjs";
-import "../../ui/PinInput/PinInput.mjs";
-import { Root as Y, Trigger as Z, Positioner as ee, Content as te } from "../../ui/Popover/Popover.mjs";
-import { Presence as ae } from "../../ui/Presence.mjs";
-import "../../ui/Progress/Progress.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 { accountRecipe as ne } from "./account.recipe.mjs";
-const t = ne();
-function It(n) {
-  const a = d(
-    m((c) => ({
-      account: c.account,
-      account__mobile: c.account__mobile,
-      accountSettings: c.accountSettings
-    }))
-  );
-  return /* @__PURE__ */ o(k, { children: [
-    /* @__PURE__ */ o(
-      X,
-      {
-        open: a.account__mobile.open,
-        onOpenChange: (c) => {
-          a.account__mobile.setOpen(c.open), a.accountSettings.setCollapsed(!0);
-        },
-        lazyMount: !0,
-        unmountOnExit: !0,
-        children: [
-          /* @__PURE__ */ e(q, { asChild: !0, className: "lg:hidden", children: n.children ?? /* @__PURE__ */ e(I, { size: "sm", colorScheme: "gray", children: a.account__mobile.open ? /* @__PURE__ */ e(j, {}) : /* @__PURE__ */ e(
-            h,
-            {
-              src: f,
-              alt: "",
-              width: 100,
-              height: 100,
-              className: "size-10"
-            }
-          ) }) }),
-          /* @__PURE__ */ e(g, { children: /* @__PURE__ */ e(J, { children: /* @__PURE__ */ o(
-            K,
-            {
-              className: "relative top-[var(--top,0px)] flex h-[calc(100%-var(--top,0px))] w-full flex-col px-xl py-6",
-              style: {
-                "--top": n.offsetTop ?? "0px"
-              },
-              children: [
-                /* @__PURE__ */ e(S, {}),
-                /* @__PURE__ */ e(C, {}),
-                /* @__PURE__ */ e(
-                  U,
-                  {
-                    rewardsUrl: n.rewardsUrl,
-                    betRecordsUrl: n.betRecordsUrl,
-                    transactionsUrl: n.transactionsUrl
-                  }
-                ),
-                /* @__PURE__ */ e(
-                  _,
-                  {
-                    accountInfoUrl: n.accountInfoUrl,
-                    accountSecurityUrl: n.accountSecurityUrl,
-                    accountVerificationUrl: n.accountVerificationUrl,
-                    accountPaymentMethodsUrl: n.accountPaymentMethodsUrl
-                  }
-                )
-              ]
-            }
-          ) }) })
-        ]
-      }
-    ),
-    /* @__PURE__ */ o(
-      Y,
-      {
-        open: a.account.open,
-        onOpenChange: (c) => {
-          a.account.setOpen(c.open), a.accountSettings.setCollapsed(!0);
-        },
-        lazyMount: !0,
-        unmountOnExit: !0,
-        positioning: {
-          placement: "bottom",
-          strategy: "fixed"
-        },
-        children: [
-          /* @__PURE__ */ e(Z, { className: "hidden lg:flex", asChild: !0, children: n.children ?? /* @__PURE__ */ e(I, { size: "sm", colorScheme: "gray", children: /* @__PURE__ */ e(
-            h,
-            {
-              src: f,
-              alt: "",
-              width: 48,
-              height: 48,
-              className: "size-10"
-            }
-          ) }) }),
-          /* @__PURE__ */ e(g, { children: /* @__PURE__ */ e(ee, { children: /* @__PURE__ */ o(te, { className: "border-border-primary bg-bg-primary relative z-popover w-[23.438rem] overflow-hidden rounded-xl border p-xl ui-open:animate-fade-in ui-closed:animate-fade-out", children: [
-            /* @__PURE__ */ e(S, {}),
-            /* @__PURE__ */ e(C, {}),
-            /* @__PURE__ */ e(
-              U,
-              {
-                rewardsUrl: n.rewardsUrl,
-                betRecordsUrl: n.betRecordsUrl,
-                transactionsUrl: n.transactionsUrl
-              }
-            ),
-            /* @__PURE__ */ e(
-              _,
-              {
-                accountInfoUrl: n.accountInfoUrl,
-                accountSecurityUrl: n.accountSecurityUrl,
-                accountVerificationUrl: n.accountVerificationUrl,
-                accountPaymentMethodsUrl: n.accountPaymentMethodsUrl
-              }
-            )
-          ] }) }) })
-        ]
-      }
-    )
-  ] });
-}
-function S() {
-  const a = L().data;
-  return /* @__PURE__ */ o("div", { className: "flex shrink-0 items-center gap-lg", children: [
-    /* @__PURE__ */ e(
-      h,
-      {
-        src: f,
-        alt: "",
-        width: 48,
-        height: 48,
-        className: "size-12"
-      }
-    ),
-    /* @__PURE__ */ o("div", { className: "grow", children: [
-      /* @__PURE__ */ e("p", { className: "text-text-secondary-700 font-semibold leading-tight", children: a == null ? void 0 : a.name }),
-      /* @__PURE__ */ e("p", { className: "text-text-tertiary-600 leading-tight", children: (a == null ? void 0 : a.nickName) ?? (a == null ? void 0 : a.emailAddress) ?? (a == null ? void 0 : a.realName) })
-    ] }),
-    /* @__PURE__ */ o(
-      F,
-      {
-        colorScheme: a != null && a.verified ? "success" : "danger",
-        className: "self-start",
-        children: [
-          /* @__PURE__ */ e(G, {}),
-          /* @__PURE__ */ e(H, { children: a != null && a.verified ? "Verified" : "Unverified" })
-        ]
-      }
-    )
-  ] });
-}
-function C() {
-  var v, N;
-  const n = w(), a = M({
-    refetchInterval: 1e3
-  }), c = d(
-    m((u) => ({
-      profile: u.account,
-      mobileProfile: u.account__mobile,
-      depositWithdrawal: u.depositWithdrawal
-    }))
-  ), s = b((v = a.data) == null ? void 0 : v.balance, 0), i = b((N = a.data) == null ? void 0 : N.bonus, 0), O = s + i;
-  return /* @__PURE__ */ o("div", { className: "border-border-primary bg-bg-tertiary mt-3 rounded-xl border p-xl", children: [
-    /* @__PURE__ */ e("div", { className: "text-text-secondary-700 text-sm", children: "Total Balance" }),
-    /* @__PURE__ */ e("div", { className: "text-3xl font-bold", children: p(O, {
-      currency: n == null ? void 0 : n.currency.code,
-      minDecimalPlaces: 2
-    }) }),
-    /* @__PURE__ */ o("div", { className: "mt-1.5 flex gap-7xl", children: [
-      /* @__PURE__ */ o("div", { children: [
-        /* @__PURE__ */ e("p", { className: "text-text-secondary-700 text-2xs", children: "Deposit Balance" }),
-        /* @__PURE__ */ e("p", { className: "text-medium text-text-primary-brand", children: p(s, {
-          currency: n == null ? void 0 : n.currency.code,
-          minDecimalPlaces: 2
-        }) })
-      ] }),
-      /* @__PURE__ */ o("div", { children: [
-        /* @__PURE__ */ e("p", { className: "text-text-secondary-700 text-2xs", children: "Bonus Balance" }),
-        /* @__PURE__ */ e("p", { className: "text-medium text-text-primary-brand", children: p(i, {
-          currency: n == null ? void 0 : n.currency.code,
-          minDecimalPlaces: 2
-        }) })
-      ] })
-    ] }),
-    /* @__PURE__ */ o("div", { className: "mt-3 flex gap-lg", children: [
-      /* @__PURE__ */ e(
-        x,
-        {
-          size: "xs",
-          variant: "outline",
-          onClick: () => {
-            c.depositWithdrawal.setOpen(!0), c.depositWithdrawal.setTab("WITHDRAWAL"), c.profile.setOpen(!1), c.mobileProfile.setOpen(!1);
-          },
-          children: "Withdraw"
-        }
-      ),
-      /* @__PURE__ */ e(
-        x,
-        {
-          size: "xs",
-          onClick: () => {
-            c.depositWithdrawal.setOpen(!0), c.depositWithdrawal.setTab("DEPOSIT"), c.profile.setOpen(!1), c.mobileProfile.setOpen(!1);
-          },
-          children: "Deposit"
-        }
-      )
-    ] })
-  ] });
-}
-function U(n) {
-  const a = R(), c = d(
-    m((i) => ({
-      account: i.account,
-      account__mobile: i.account__mobile,
-      accountSettings: i.accountSettings,
-      messages: i.messages
-    }))
-  ), s = P(
-    {},
-    { refetchInterval: 5e3 }
-  );
-  return /* @__PURE__ */ o("nav", { className: t.nav({ className: "mt-xl" }), children: [
-    /* @__PURE__ */ o("ul", { children: [
-      /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-        "button",
-        {
-          type: "button",
-          className: t.navItemLink(),
-          onClick: () => {
-            c.account.setOpen(!1), c.account__mobile.setOpen(!1), c.messages.setOpen(!0);
-          },
-          children: [
-            /* @__PURE__ */ e(y, { className: t.navItemIcon() }),
-            /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Notifications" }),
-            /* @__PURE__ */ e("span", { className: t.navItemBadge(), "data-type": "warning", children: s.data ?? 0 }),
-            /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-        l,
-        {
-          href: n.rewardsUrl ?? "/rewards",
-          className: t.navItemLink(),
-          onClick: () => {
-            c.account.setOpen(!1), c.account__mobile.setOpen(!1);
-          },
-          children: [
-            /* @__PURE__ */ e(Q, { className: t.navItemIcon() }),
-            /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Rewards" }),
-            /* @__PURE__ */ e("span", { className: t.navItemBadge(), "data-type": "warning", children: "0" }),
-            /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-          ]
-        }
-      ) })
-    ] }),
-    /* @__PURE__ */ e("ul", { children: /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-      "button",
-      {
-        type: "button",
-        className: t.navItemLink(),
-        onClick: () => {
-          c.accountSettings.setCollapsed(!1);
-        },
-        children: [
-          /* @__PURE__ */ e($, { className: t.navItemIcon() }),
-          /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Settings" }),
-          /* @__PURE__ */ e("span", { className: t.navItemBadge(), "data-type": "error", children: /* @__PURE__ */ e(z, {}) }),
-          /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-        ]
-      }
-    ) }) }),
-    /* @__PURE__ */ o("ul", { children: [
-      /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-        l,
-        {
-          href: n.betRecordsUrl ?? "/bet-records",
-          className: t.navItemLink(),
-          onClick: () => {
-            c.account.setOpen(!1), c.account__mobile.setOpen(!1);
-          },
-          children: [
-            /* @__PURE__ */ e(W, { className: t.navItemIcon() }),
-            /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Bet Records" }),
-            /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-          ]
-        }
-      ) }),
-      /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-        l,
-        {
-          href: n.transactionsUrl ?? "/transactions",
-          className: t.navItemLink(),
-          onClick: () => {
-            c.account.setOpen(!1), c.account__mobile.setOpen(!1);
-          },
-          children: [
-            /* @__PURE__ */ e(T, { className: t.navItemIcon() }),
-            /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Transactions" }),
-            /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-          ]
-        }
-      ) })
-    ] }),
-    /* @__PURE__ */ e("ul", { children: /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-      "button",
-      {
-        type: "button",
-        className: t.navItemLink(),
-        disabled: a.isPending,
-        onClick: () => {
-          a.mutate(), c.account.setOpen(!1), c.account__mobile.setOpen(!1);
-        },
-        children: [
-          /* @__PURE__ */ e(y, { className: t.navItemIcon() }),
-          /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Log Out" }),
-          /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-        ]
-      }
-    ) }) })
-  ] });
-}
-function _(n) {
-  const a = d(
-    m((c) => ({
-      account: c.account,
-      account__mobile: c.account__mobile,
-      accountSettings: c.accountSettings
-    }))
-  );
-  return /* @__PURE__ */ o(
-    ae,
-    {
-      present: !a.accountSettings.collapsed,
-      lazyMount: !0,
-      className: "bg-bg-primary ui-open:animate-slide-in-right ui-closed:animate-slide-out-right absolute left-0 top-0 size-full overflow-y-auto",
-      children: [
-        /* @__PURE__ */ o("div", { className: "bg-bg-primary-alt flex items-center gap-xl px-xl py-md", children: [
-          /* @__PURE__ */ e(
-            I,
-            {
-              size: "2xs",
-              variant: "outline",
-              colorScheme: "gray",
-              onClick: () => {
-                a.accountSettings.setCollapsed(!0);
-              },
-              children: /* @__PURE__ */ e(B, {})
-            }
-          ),
-          /* @__PURE__ */ e("h2", { className: "text-text-primary-900 text-lg font-semibold", children: "Settings" })
-        ] }),
-        /* @__PURE__ */ e("nav", { className: t.nav({ className: "p-4" }), children: /* @__PURE__ */ o("ul", { children: [
-          /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-            l,
-            {
-              href: n.accountInfoUrl ?? "/account",
-              className: t.navItemLink(),
-              onClick: () => {
-                a.account.setOpen(!1), a.account__mobile.setOpen(!1), a.accountSettings.setCollapsed(!0);
-              },
-              children: [
-                /* @__PURE__ */ e(E, { className: t.navItemIcon() }),
-                /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Account Info" }),
-                /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-              ]
-            }
-          ) }),
-          /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-            l,
-            {
-              href: n.accountSecurityUrl ?? "/account/security",
-              className: t.navItemLink(),
-              onClick: () => {
-                a.account.setOpen(!1), a.account__mobile.setOpen(!1), a.accountSettings.setCollapsed(!0);
-              },
-              children: [
-                /* @__PURE__ */ e(V, { className: t.navItemIcon() }),
-                /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Security" }),
-                /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-              ]
-            }
-          ) }),
-          /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-            l,
-            {
-              href: n.accountVerificationUrl ?? "/account/verification",
-              className: t.navItemLink(),
-              onClick: () => {
-                a.account.setOpen(!1), a.account__mobile.setOpen(!1), a.accountSettings.setCollapsed(!0);
-              },
-              children: [
-                /* @__PURE__ */ e(D, { className: t.navItemIcon() }),
-                /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Personal Verification" }),
-                /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-              ]
-            }
-          ) }),
-          /* @__PURE__ */ e("li", { className: t.navItemRoot(), children: /* @__PURE__ */ o(
-            l,
-            {
-              href: n.accountPaymentMethodsUrl ?? "/account/payment-methods",
-              className: t.navItemLink(),
-              onClick: () => {
-                a.account.setOpen(!1), a.account__mobile.setOpen(!1), a.accountSettings.setCollapsed(!0);
-              },
-              children: [
-                /* @__PURE__ */ e(A, { className: t.navItemIcon() }),
-                /* @__PURE__ */ e("span", { className: t.navItemLabel(), children: "Payment Methods" }),
-                /* @__PURE__ */ e(r, { className: t.navItemIndicator() })
-              ]
-            }
-          ) })
-        ] }) })
-      ]
-    }
-  );
-}
-export {
-  It as Account
-};

package/dist/components/Account/account.recipe.mjs

@@ -1,35 +0,0 @@
-import { tv as t } from "tailwind-variants";
-const i = t({
-  slots: {
-    nav: "space-y-xl",
-    navItemRoot: "bg-bg-primary-alt block first:rounded-t-xl last:rounded-b-xl",
-    navItemLink: "flex w-full items-center px-xl py-xl text-left text-sm font-semibold",
-    navItemIcon: "text-text-nav-item-button-icon size-5",
-    navItemLabel: "ml-lg grow",
-    navItemIndicator: "text-gray-400 text-text-quarterary-500 size-5",
-    navItemBadge: [
-      "mr-md",
-      "flex",
-      "items-center",
-      "justify-center",
-      "border",
-      "rounded-full",
-      "h-5.5",
-      "ui-type-[warning]:min-w-6",
-      "ui-type-[warning]:text-xs",
-      "ui-type-[warning]:font-medium",
-      "ui-type-[warning]:leading-tight",
-      "ui-type-[warning]:border-utility-brand-200",
-      "ui-type-[warning]:bg-utility-brand-50",
-      "ui-type-[warning]:text-utility-brand-700",
-      "ui-type-[error]:w-5.5",
-      "ui-type-[error]:icon:size-3",
-      "ui-type-[error]:border-utility-warning-200",
-      "ui-type-[error]:bg-utility-warning-50",
-      "ui-type-[error]:text-utility-warning-500"
-    ]
-  }
-});
-export {
-  i as accountRecipe
-};

package/dist/components/AccountInfo/AccountInfo.js

@@ -1 +0,0 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),d=require("date-fns"),t=require("lodash-es"),c=require("next/image"),u=require("../../client/hooks/useAccountQuery.js");require("@tanstack/react-query");require("../../utils/capitalize.js");require("../../utils/parseDecimal.js");require("../../constants/index.js");require("../../utils/getLocaleInfo.js");require("../../utils/getQueryClient.js");require("../../utils/isMobile.js");require("../../client/services/getSession.js");require("@opexa/portal-sdk-core");require("tiny-invariant");require("react");require("@opexa/portal-sdk-core/object-id");require("../../client/hooks/useGlobalStore.js");require("../../client/hooks/useInfiniteQueryHelper.js");const x=require("../../client/hooks/useLocaleInfo.js"),m=require("../../client/hooks/useMobileNumberParser.js");require("usehooks-ts");const h=require("../../icons/FacebookIcon.js"),b=require("../../icons/GoogleIcon.js"),j=require("../../images/placeholder-avatar.png.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/Collapsible/Collapsible.js");require("../../ui/Combobox/Combobox.js");require("../../ui/DatePicker/DatePicker.js");require("../../ui/Dialog/Dialog.js");require("../../ui/Drawer/Drawer.js");const s=require("../../ui/Field/Field.js"),l=require("../../ui/IconButton/IconButton.js");require("../../ui/NumberInput/NumberInput.js");require("../../ui/PasswordInput/PasswordInput.js");require("../../ui/PinInput/PinInput.js");require("../../ui/Popover/Popover.js");require("@ark-ui/react");require("tailwind-merge");require("../../ui/Progress/Progress.js");require("../../ui/SegmentGroup/SegmentGroup.js");require("../../ui/Select/Select.js");require("../../ui/Table/Table.js");require("../../ui/Tabs/Tabs.js");function q(a){const n=x.useLocaleInfo(),r=u.useAccountQuery().data,o=m.useMobileNumberParser();return e.jsxs("div",{className:a.className,children:[e.jsx("h2",{className:"text-text-secondary-700 text-sm font-semibold",children:"Profile Info"}),e.jsxs("div",{className:"bg-bg-primary-alt border-border-secondary mt-5 rounded-xl border",children:[e.jsx("div",{className:"border-border-secondary border-b px-4 py-5",children:e.jsxs("div",{className:"flex items-center gap-xl",children:[e.jsx(c,{src:j,alt:"",width:80,height:80,className:"size-14 shrink-0 rounded-md object-cover"}),e.jsxs("div",{children:[e.jsx("h3",{className:"text-text-secondary-700 text-lg font-semibold leading-tight",children:r==null?void 0:r.name}),e.jsx("p",{className:"text-text-tertiary-600 leading-tight",children:(r==null?void 0:r.emailAddress)??(r==null?void 0:r.nickName)})]})]})}),e.jsx("div",{className:"flex justify-end px-xl py-lg",children:e.jsx(i.Button,{size:"sm",variant:"outline",fullWidth:!1,children:"Upload New Avatar"})})]}),e.jsx("h2",{className:"text-text-secondary-700 mt-6 text-sm font-semibold",children:"Contact Info"}),e.jsxs("div",{className:"shadow-xs bg-bg-primary-alt border-border-secondary mt-5 rounded-xl border px-4 py-5",children:[e.jsxs(s.Root,{children:[e.jsx(s.Label,{children:"Mobile Number"}),e.jsxs("div",{className:"relative",children:[e.jsx(n.country.flag,{className:"pointer-events-none absolute left-3.5 top-1/2 size-5 -translate-y-1/2"}),e.jsx(s.Input,{className:"pl-10.5",value:r!=null&&r.mobileNumber?o.format(r==null?void 0:r.mobileNumber):"",readOnly:!0,onChange:t.noop})]})]}),e.jsxs(s.Root,{className:"mt-6",children:[e.jsx(s.Label,{children:"Email address"}),e.jsx(s.Input,{defaultValue:(r==null?void 0:r.emailAddress)??""})]})]}),e.jsx("h2",{className:"text-text-secondary-700 mt-6 text-sm font-semibold",children:"Personal Data"}),e.jsxs("div",{className:"shadow-xs bg-bg-primary-alt border-border-secondary mt-5 rounded-xl border px-4 py-5",children:[e.jsxs(s.Root,{children:[e.jsx(s.Label,{children:"Real name"}),e.jsx(s.Input,{value:(r==null?void 0:r.realName)??"",onChange:t.noop,readOnly:!0})]}),e.jsxs(s.Root,{className:"mt-6",children:[e.jsx(s.Label,{children:"Date of birth"}),e.jsx(s.Input,{type:"date",value:r!=null&&r.birthDay?d.format(r.birthDay,"yyyy-MM-dd"):"",readOnly:!0})]})]}),e.jsx("h2",{className:"text-text-secondary-700 mt-6 text-sm font-semibold",children:"Account Connections"}),e.jsxs("div",{className:"shadow-xs bg-bg-primary-alt border-border-secondary mt-5 rounded-xl border px-4 py-5",children:[e.jsxs("div",{className:"flex items-center",children:[e.jsxs("div",{className:"flex grow items-center gap-sm",children:[e.jsx(l.IconButton,{variant:"outline",colorScheme:"gray",children:e.jsx(b.GoogleIcon,{className:"size-6"})}),e.jsxs("div",{children:[e.jsx("p",{className:"text-sm font-medium leading-tight",children:"Google"}),e.jsx("p",{className:"text-text-secondary-700 mt-xs text-xs leading-tight",children:"Not Connected"})]})]}),e.jsx(i.Button,{fullWidth:!1,children:"Connect"})]}),e.jsxs("div",{className:"mt-6 flex items-center",children:[e.jsxs("div",{className:"flex grow items-center gap-sm",children:[e.jsx(l.IconButton,{variant:"outline",colorScheme:"gray",children:e.jsx(h.FacebookIcon,{className:"size-6"})}),e.jsxs("div",{children:[e.jsx("p",{className:"text-sm font-medium leading-tight",children:"Facebook"}),e.jsx("p",{className:"text-text-success-primary-600 mt-xs text-xs leading-tight",children:"Connected"})]})]}),e.jsx("button",{className:"text-button-tertiary-error-fg text-sm font-semibold",children:"Disconnect"})]})]})]})}exports.AccountInfo=q;