@opexa/portal-components 0.0.404 → 0.0.405

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -3,6 +3,12 @@ export interface ClassNameEntries {
3
3
  walletActions?: string;
4
4
  withdrawButton?: string;
5
5
  depositButton?: string;
6
+ navItemRoot?: string;
7
+ navItemLink?: string;
8
+ navItemIcon?: string;
9
+ navItemLabel?: string;
10
+ navItemBadge?: string;
11
+ navItemIndicator?: string;
6
12
  }
7
13
  export interface AccountProps {
8
14
  className?: string | ClassNameEntries;
@@ -68,14 +68,14 @@ export function Account(props) {
68
68
  }, lazyMount: true, unmountOnExit: true, children: _jsx(Portal, { children: _jsx(Drawer.Positioner, { children: _jsxs(Drawer.Content, { className: twMerge('relative', 'flex', 'flex-col', 'top-[var(--offset-top-mobile)]', 'h-[calc(100%-var(--offset-top-mobile))]', 'w-full', 'px-xl', 'py-6', 'lg:top-[var(--offset-top-desktop)]', 'lg:h-[calc(100%-var(--offset-top-desktop))]', 'overflow-auto', classNames.root), style: {
69
69
  ['--offset-top-mobile']: mobileOffsetTop,
70
70
  ['--offset-top-desktop']: desktopOffsetTop,
71
- }, children: [_jsx(Profile, {}), _jsx(Wallet, { classNames: classNames }), _jsx(Links, { router: router })] }) }) }) }), _jsx(Popover.Root, { open: globalStore.account.open, onOpenChange: (details) => {
71
+ }, children: [_jsx(Profile, {}), _jsx(Wallet, { classNames: classNames }), _jsx(Links, { router: router, classNames: classNames })] }) }) }) }), _jsx(Popover.Root, { open: globalStore.account.open, onOpenChange: (details) => {
72
72
  globalStore.account.setOpen(details.open);
73
73
  }, lazyMount: true, unmountOnExit: true, positioning: {
74
74
  placement: 'bottom',
75
75
  strategy: 'fixed',
76
76
  }, ids: {
77
77
  trigger: 'opexa-portal-components:account-trigger',
78
- }, children: _jsx(Portal, { children: _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "relative z-popover w-[23.438rem] ui-closed:animate-fade-out ui-open:animate-fade-in overflow-hidden rounded-xl border border-border-primary bg-bg-primary p-xl", children: [_jsx(Profile, {}), _jsx(Wallet, { classNames: classNames }), _jsx(Links, { router: router })] }) }) }) })] }));
78
+ }, children: _jsx(Portal, { children: _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "relative z-popover w-[23.438rem] ui-closed:animate-fade-out ui-open:animate-fade-in overflow-hidden rounded-xl border border-border-primary bg-bg-primary p-xl", children: [_jsx(Profile, {}), _jsx(Wallet, { classNames: classNames }), _jsx(Links, { router: router, classNames: classNames })] }) }) }) })] }));
79
79
  }
80
80
  function Profile() {
81
81
  const accountQuery = useAccountQuery();
@@ -116,7 +116,7 @@ function Wallet({ classNames }) {
116
116
  globalStore.mobileProfile.setOpen(false);
117
117
  }, children: "Deposit" })] })] }));
118
118
  }
119
- function Links({ router }) {
119
+ function Links({ router, classNames }) {
120
120
  const accountProps = useAccountPropsContext();
121
121
  const globalStore = useGlobalStore(useShallow((ctx) => ({
122
122
  account: ctx.account,
@@ -140,26 +140,26 @@ function Links({ router }) {
140
140
  const cashbackBonusesCountQuery = useCashbackBonusesCountQuery();
141
141
  const cashbackBonusesCount = cashbackBonusesCountQuery.data ?? 0;
142
142
  const rewardsCount = bonusesCount + cashbackBonusesCount;
143
- return (_jsxs("nav", { className: recipe.nav({ className: 'mt-xl' }), children: [_jsxs("ul", { hidden: !accountProps.notificationsEnabled && !accountProps.rewardsEnabled, children: [_jsx("li", { className: recipe.navItemRoot(), hidden: !accountProps.notificationsEnabled, children: _jsxs("button", { type: "button", className: recipe.navItemLink(), onClick: () => {
143
+ return (_jsxs("nav", { className: recipe.nav({ className: 'mt-xl' }), children: [_jsxs("ul", { hidden: !accountProps.notificationsEnabled && !accountProps.rewardsEnabled, children: [_jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.notificationsEnabled, children: _jsxs("button", { type: "button", className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
144
144
  globalStore.account.setOpen(false);
145
145
  globalStore.account__mobile.setOpen(false);
146
146
  globalStore.messages.setOpen(true);
147
- }, children: [_jsx(Bell01Icon, { className: recipe.navItemIcon() }), _jsx("span", { className: recipe.navItemLabel(), children: "Notifications" }), unreadMessagesCount > 0 && (_jsx("span", { className: recipe.navItemBadge(), "data-type": "warning", children: unreadMessagesCount })), _jsx(ChevronRightIcon, { className: recipe.navItemIndicator() })] }) }), _jsx("li", { className: recipe.navItemRoot(), hidden: !accountProps.rewardsEnabled, children: _jsxs(Link, { href: accountProps.rewardsUrl, className: recipe.navItemLink(), onClick: () => {
147
+ }, children: [_jsx(Bell01Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Notifications" }), unreadMessagesCount > 0 && (_jsx("span", { className: twMerge(recipe.navItemBadge(), classNames.navItemBadge), "data-type": "warning", children: unreadMessagesCount })), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) }), _jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.rewardsEnabled, children: _jsxs(Link, { href: accountProps.rewardsUrl, className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
148
148
  globalStore.account.setOpen(false);
149
149
  globalStore.account__mobile.setOpen(false);
150
- }, children: [_jsx(Gift01Icon, { className: recipe.navItemIcon() }), _jsx("span", { className: recipe.navItemLabel(), children: "Rewards" }), rewardsCount > 0 && (_jsx("span", { className: recipe.navItemBadge(), "data-type": "warning", children: rewardsCount })), _jsx(ChevronRightIcon, { className: recipe.navItemIndicator() })] }) })] }), _jsx("ul", { hidden: !accountProps.accountSettingsEnabled, children: _jsx("li", { className: recipe.navItemRoot(), hidden: !accountProps.accountSettingsEnabled, children: _jsxs(Link, { href: accountProps.accountSettingsUrl, className: recipe.navItemLink(), onClick: () => {
150
+ }, children: [_jsx(Gift01Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Rewards" }), rewardsCount > 0 && (_jsx("span", { className: twMerge(recipe.navItemBadge(), classNames.navItemBadge), "data-type": "warning", children: rewardsCount })), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) })] }), _jsx("ul", { hidden: !accountProps.accountSettingsEnabled, children: _jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.accountSettingsEnabled, children: _jsxs(Link, { href: accountProps.accountSettingsUrl, className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
151
151
  globalStore.account.setOpen(false);
152
152
  globalStore.account__mobile.setOpen(false);
153
- }, children: [_jsx(Settings02Icon, { className: recipe.navItemIcon() }), _jsx("span", { className: recipe.navItemLabel(), children: "Settings" }), profileCompletionPercentage < 100 && (_jsx("span", { className: recipe.navItemBadge(), "data-type": "error", children: _jsx(AlertCircleIcon, {}) })), _jsx(ChevronRightIcon, { className: recipe.navItemIndicator() })] }) }) }), _jsxs("ul", { hidden: !accountProps.betRecordsEnabled && !accountProps.transactionsEnabled, children: [_jsx("li", { className: recipe.navItemRoot(), hidden: !accountProps.betRecordsEnabled, children: _jsxs(Link, { href: accountProps.betRecordsUrl, className: recipe.navItemLink(), onClick: () => {
153
+ }, children: [_jsx(Settings02Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Settings" }), profileCompletionPercentage < 100 && (_jsx("span", { className: twMerge(recipe.navItemBadge(), classNames.navItemBadge), "data-type": "error", children: _jsx(AlertCircleIcon, {}) })), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) }) }), _jsxs("ul", { hidden: !accountProps.betRecordsEnabled && !accountProps.transactionsEnabled, children: [_jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.betRecordsEnabled, children: _jsxs(Link, { href: accountProps.betRecordsUrl, className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
154
154
  globalStore.account.setOpen(false);
155
155
  globalStore.account__mobile.setOpen(false);
156
- }, children: [_jsx(CoinsStacked02Icon, { className: recipe.navItemIcon() }), _jsx("span", { className: recipe.navItemLabel(), children: "Bet Records" }), _jsx(ChevronRightIcon, { className: recipe.navItemIndicator() })] }) }), _jsx("li", { className: recipe.navItemRoot(), hidden: !accountProps.transactionsEnabled, children: _jsxs(Link, { href: accountProps.transactionsUrl, className: recipe.navItemLink(), onClick: () => {
156
+ }, children: [_jsx(CoinsStacked02Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Bet Records" }), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) }), _jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), hidden: !accountProps.transactionsEnabled, children: _jsxs(Link, { href: accountProps.transactionsUrl, className: twMerge(recipe.navItemLink(), classNames.navItemLink), onClick: () => {
157
157
  globalStore.account.setOpen(false);
158
158
  globalStore.account__mobile.setOpen(false);
159
- }, children: [_jsx(CoinsSwap02Icon, { className: recipe.navItemIcon() }), _jsx("span", { className: recipe.navItemLabel(), children: "Transactions" }), _jsx(ChevronRightIcon, { className: recipe.navItemIndicator() })] }) })] }), _jsx("ul", { children: _jsx("li", { className: recipe.navItemRoot(), children: _jsxs("button", { type: "button", className: recipe.navItemLink(), disabled: signOutMutation.isPending, onClick: () => {
159
+ }, children: [_jsx(CoinsSwap02Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Transactions" }), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) })] }), _jsx("ul", { children: _jsx("li", { className: twMerge(recipe.navItemRoot(), classNames.navItemRoot), children: _jsxs("button", { type: "button", className: twMerge(recipe.navItemLink(), classNames.navItemLink), disabled: signOutMutation.isPending, onClick: () => {
160
160
  signOutMutation.mutate();
161
161
  globalStore.account.setOpen(false);
162
162
  globalStore.account__mobile.setOpen(false);
163
163
  router.push('/');
164
- }, children: [_jsx(Logout01Icon, { className: recipe.navItemIcon() }), _jsx("span", { className: recipe.navItemLabel(), children: "Log Out" }), _jsx(ChevronRightIcon, { className: recipe.navItemIndicator() })] }) }) })] }));
164
+ }, children: [_jsx(Logout01Icon, { className: twMerge(recipe.navItemIcon(), classNames.navItemIcon) }), _jsx("span", { className: twMerge(recipe.navItemLabel(), classNames.navItemLabel), children: "Log Out" }), _jsx(ChevronRightIcon, { className: twMerge(recipe.navItemIndicator(), classNames.navItemIndicator) })] }) }) })] }));
165
165
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@opexa/portal-components",
3
- "version": "0.0.404",
3
+ "version": "0.0.405",
4
4
  "exports": {
5
5
  "./ui/*": {
6
6
  "types": "./dist/ui/*/index.d.ts",