@opexa/portal-components 0.0.64 → 0.0.66

package/dist/components/Bonuses/Bonuses.client.js

@@ -9,11 +9,11 @@ import { useInterval } from 'usehooks-ts';
 import { z } from 'zod';
 import { useBonusesQuery, useCashbackBonusesQuery, useClaimCashbackBonusMutation, useLocaleInfo, } from '../../client/hooks/index.js';
 import { Gift01Icon, StopWatchIcon } from '../../icons/index.js';
+import moneyOnHand from '../../images/money-on-hand.png';
+import piggyBank from '../../images/piggy-bank.png';
 import { Badge, Button, Progress, SegmentGroup } from '../../ui/index.js';
 import { capitalize, formatNumber, parseDecimal } from '../../utils/index.js';
 import { Empty } from '../Empty.js';
-import moneyOnHand from './money-on-hand.png';
-import piggyBank from './piggy-bank.png';
 const TABS = ['ALL', 'ACTIVE', 'CASHBACKS'];
 export function Bonuses__client(props) {
     const [tab, setTab] = useState(TABS[0]);
@@ -83,5 +83,5 @@ function CashbackBonus(props) {
 function DefaultImage({ type }) {
     return (_jsxs("div", { style: {
             background: 'radial-gradient(75.21% 75.21% at 50% 50%, rgba(249, 163, 8, 0.3) 0%, rgba(0, 0, 0, 0) 100%), var(--color-bg-primary-alt)',
-        }, children: [type === 'bonus' && (_jsx(Image, { src: piggyBank, alt: "", className: "mx-auto h-auto w-[50%] shrink-0", draggable: false, width: 600 })), type === 'cashback' && (_jsx(Image, { src: moneyOnHand, alt: "", className: "mx-auto h-auto w-[50%] shrink-0", draggable: false, width: 600 }))] }));
+        }, children: [type === 'bonus' && (_jsx(Image, { src: piggyBank, alt: "", className: "mx-auto h-auto w-[50%] shrink-0", draggable: false, width: 600, height: 600 })), type === 'cashback' && (_jsx(Image, { src: moneyOnHand, alt: "", className: "mx-auto h-auto w-[50%] shrink-0", draggable: false, width: 600, height: 600 }))] }));
 }

package/dist/components/Bonuses/BonusesTrigger.d.ts

@@ -0,0 +1,5 @@
+import type { ComponentPropsWithRef } from 'react';
+interface BonusesTriggerProps extends ComponentPropsWithRef<'a'> {
+}
+export declare function BonusesTrigger(props: BonusesTriggerProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/components/Bonuses/BonusesTrigger.js

@@ -0,0 +1,19 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import Link from 'next/link';
+import { twMerge } from 'tailwind-merge';
+import { useBonusesQuery, useCashbackBonusesQuery } from '../../client/hooks/index.js';
+import { Gift01Icon } from '../../icons/index.js';
+import { iconButtonRecipe } from '../../ui/IconButton/iconButton.recipe.js';
+export function BonusesTrigger(props) {
+    const bonusesQuery = useBonusesQuery();
+    const bonusesCount = bonusesQuery.data?.length ?? 0;
+    const cashbackBonusesQuery = useCashbackBonusesQuery();
+    const cashbackBonusesCount = cashbackBonusesQuery.data?.length ?? 0;
+    const totalCount = bonusesCount + cashbackBonusesCount;
+    return (_jsx(Link, { "aria-label": "View Rewards", "data-count": totalCount, ...props, href: props.href ?? '/rewards', className: iconButtonRecipe({
+            size: 'sm',
+            colorScheme: 'gray',
+            className: twMerge('relative', props.className),
+        }), children: props.children ?? (_jsxs(_Fragment, { children: [totalCount > 0 && (_jsx("div", { className: "bg-brand-500 leading-4.5 text-button-primary-fg absolute -right-1.5 -top-1.5 min-w-5 rounded-full border px-1.5 text-2xs font-semibold", children: totalCount })), _jsx(Gift01Icon, {})] })) }));
+}

package/dist/components/Bonuses/index.d.ts

@@ -1 +1,2 @@
 export * from './Bonuses';
+export * from './BonusesTrigger';

package/dist/components/Bonuses/index.js

@@ -1 +1,2 @@
 export * from './Bonuses.js';
+export * from './BonusesTrigger.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opexa/portal-components",
-  "version": "0.0.64",
+  "version": "0.0.66",
   "exports": {
     ".": {
       "types": "./dist/components/index.d.ts",