@opexa/portal-components 0.1.80 → 0.1.83

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opexa/portal-components",
-  "version": "0.1.80",
+  "version": "0.1.83",
   "exports": {
     "./ui/*": {
       "types": "./dist/ui/*/index.d.ts",
@@ -165,6 +165,9 @@
       "publish": false
     },
     "hooks": {
+      "before:init": [
+        "npm whoami"
+      ],
       "after:bump": [
         "pnpm build"
       ],

package/dist/components/BetDepositLimit/betDepositLimitStore.d.ts

@@ -1,24 +0,0 @@
-export type LimitType = 'bet' | 'deposit';
-export type LimitPeriod = 'daily' | 'monthly';
-export interface BetDepositLimitState {
-    isOpen: boolean;
-    type: LimitType;
-    period: LimitPeriod;
-    currentLimit: number;
-    requestedLimit: number;
-    setIsOpen: (isOpen: boolean) => void;
-    setType: (type: LimitType) => void;
-    setPeriod: (period: LimitPeriod) => void;
-    setCurrentLimit: (limit: number) => void;
-    setRequestedLimit: (limit: number) => void;
-    openModal: (type: LimitType, period: LimitPeriod, currentLimit: number, requestedLimit: number) => void;
-}
-export declare const useBetDepositLimitStore: import("zustand").UseBoundStore<import("zustand").StoreApi<BetDepositLimitState>>;
-export declare const betDepositLimitStore: {
-    isOpen: boolean;
-    type: LimitType;
-    period: LimitPeriod;
-    currentLimit: number;
-    requestedLimit: number;
-    openModal(newType: LimitType, newPeriod: LimitPeriod, currentLimit: number, requestedLimit: number): void;
-};

package/dist/components/BetDepositLimit/betDepositLimitStore.js

@@ -1,51 +0,0 @@
-import { create } from 'zustand';
-export const useBetDepositLimitStore = create((set) => ({
-    isOpen: false,
-    type: 'bet',
-    period: 'daily',
-    currentLimit: 0,
-    requestedLimit: 0,
-    setIsOpen: (isOpen) => set({ isOpen }),
-    setType: (type) => set({ type }),
-    setPeriod: (period) => set({ period }),
-    setCurrentLimit: (currentLimit) => set({ currentLimit }),
-    setRequestedLimit: (requestedLimit) => set({ requestedLimit }),
-    openModal: (type, period, currentLimit, requestedLimit) => set({ type, period, currentLimit, requestedLimit, isOpen: true }),
-}));
-export const betDepositLimitStore = {
-    get isOpen() {
-        return useBetDepositLimitStore.getState().isOpen;
-    },
-    set isOpen(value) {
-        useBetDepositLimitStore.setState({ isOpen: value });
-    },
-    get type() {
-        return useBetDepositLimitStore.getState().type;
-    },
-    set type(value) {
-        useBetDepositLimitStore.setState({ type: value });
-    },
-    get period() {
-        return useBetDepositLimitStore.getState().period;
-    },
-    set period(value) {
-        useBetDepositLimitStore.setState({ period: value });
-    },
-    get currentLimit() {
-        return useBetDepositLimitStore.getState().currentLimit;
-    },
-    set currentLimit(value) {
-        useBetDepositLimitStore.setState({ currentLimit: value });
-    },
-    get requestedLimit() {
-        return useBetDepositLimitStore.getState().requestedLimit;
-    },
-    set requestedLimit(value) {
-        useBetDepositLimitStore.setState({ requestedLimit: value });
-    },
-    openModal(newType, newPeriod, currentLimit, requestedLimit) {
-        useBetDepositLimitStore
-            .getState()
-            .openModal(newType, newPeriod, currentLimit, requestedLimit);
-    },
-};

package/dist/components/ResponsibleGamingLimits/ResponsibleGamingLimits.lazy.d.ts

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

package/dist/components/ResponsibleGamingLimits/ResponsibleGamingLimits.lazy.js

@@ -1,117 +0,0 @@
-'use client';
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Tabs } from '../../ui/Tabs/index.js';
-import Link from 'next/link';
-import { useCallback, useState } from 'react';
-import { useForm } from 'react-hook-form';
-import { twMerge } from 'tailwind-merge';
-import { useShallow } from 'zustand/shallow';
-import { BetDepositLimitModal } from '@opexa/portal-components/BetDepositLimit';
-import { RefreshCcw01Icon } from '../../icons/RefreshCcw01Icon.js';
-import { InfoCircleIcon } from '../../icons/InfoCircleIcon.js';
-import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
-import { Progress } from '../../ui/Progress/index.js';
-import { Tooltip } from '../../ui/Tooltip/index.js';
-import { Field } from '../../ui/Field/index.js';
-import { Button } from '../../ui/Button/index.js';
-const INITIAL_BET_LIMITS = [
-    {
-        period: 'daily',
-        label: 'Daily Bet Limit',
-        limit: 5000,
-        used: 3000,
-        resetsLabel: 'Resets daily',
-        active: true,
-    },
-    {
-        period: 'monthly',
-        label: 'Monthly Bet Limit',
-        limit: 50000,
-        used: 0,
-        resetsLabel: 'Resets May 30, 2026',
-        active: false,
-    },
-];
-const INITIAL_DEPOSIT_LIMITS = [
-    {
-        period: 'daily',
-        label: 'Daily Deposit Limit',
-        limit: 10000,
-        used: 0,
-        resetsLabel: 'Resets daily',
-        active: false,
-    },
-    {
-        period: 'monthly',
-        label: 'Monthly Deposit Limit',
-        limit: 100000,
-        used: 0,
-        resetsLabel: 'Resets May 30, 2026',
-        active: false,
-    },
-];
-function getNewLimitKey(tab, period) {
-    return `${tab}-${period}`;
-}
-function formatPeso(amount) {
-    return `₱${amount.toLocaleString('en-PH')}`;
-}
-function getUsedPercent(used, limit) {
-    if (limit === 0)
-        return 0;
-    return Math.min(Math.round((used / limit) * 100), 100);
-}
-function getProgressColor(pct) {
-    if (pct >= 80)
-        return 'bg-[#D92D20]';
-    if (pct >= 50)
-        return 'bg-[#F79009]';
-    return 'bg-[#FAC515]';
-}
-function tabToLimitType(tab) {
-    return tab === 'Bet' ? 'bet' : 'deposit';
-}
-export function ResponsibleGamingLimits() {
-    const openModal = useGlobalStore(useShallow((state) => state.betDepositLimit.openModal));
-    const form = useForm({
-        defaultValues: {},
-    });
-    const [activeTab, setActiveTab] = useState('Deposit');
-    const [betLimits, setBetLimits] = useState(INITIAL_BET_LIMITS);
-    const [depositLimits, setDepositLimits] = useState(INITIAL_DEPOSIT_LIMITS);
-    const limits = activeTab === 'Bet' ? betLimits : depositLimits;
-    const applyConfirmedLimit = useCallback(() => {
-        const { type, period, requestedLimit } = useGlobalStore.getState().betDepositLimit;
-        const updateLimits = (cards) => cards.map((card) => card.period === period ? { ...card, limit: requestedLimit } : card);
-        if (type === 'bet') {
-            setBetLimits(updateLimits);
-        }
-        else {
-            setDepositLimits(updateLimits);
-        }
-    }, []);
-    const saveLimit = useCallback((card, inputValue) => {
-        const key = getNewLimitKey(activeTab, card.period);
-        const parsed = parseFloat(String(inputValue).replace(/[^0-9.]/g, ''));
-        if (Number.isNaN(parsed) || parsed <= 0) {
-            return;
-        }
-        openModal(tabToLimitType(activeTab), card.period, card.limit, parsed);
-        form.setValue(key, '');
-    }, [activeTab, form, openModal]);
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "bg-bg-secondary m-5 mx-auto my-10 rounded-xl px-4 py-6 lg:px-8 lg:py-10", children: [_jsxs("div", { className: "mb-6", children: [_jsx("h1", { className: "text-text-primary-brand text-3xl font-bold lg:block", children: "Responsible Gaming" }), _jsxs("p", { className: "text-text-disabled mt-1 text-sm", children: ["Set limits for your gaming activity, including how much you can bet or deposit.", _jsx("br", { className: "hidden sm:inline" }), "These limits help you stay within the boundaries you choose."] })] }), _jsxs("div", { className: "bg-bg-primary border-border-dark mb-6 flex flex-col items-start justify-between gap-3 rounded-xl border px-4 py-4 shadow-xs sm:flex-row sm:items-center", children: [_jsxs("div", { children: [_jsx("p", { className: "text-text-primary-brand text-sm font-semibold", children: "Learn More About Responsible Gaming" }), _jsx("p", { className: "text-text-disabled mt-0.5 text-sm", children: "Find helpful tips, safety reminders, and support resources to help you stay informed and in control while playing." })] }), _jsx(Link, { href: "/responsible-gaming", className: twMerge('border-border-dark text-text-primary-brand inline-flex shrink-0 items-center justify-center gap-1.5 rounded-lg border px-4 py-2.5 text-sm font-semibold shadow-xs transition-colors'), children: "Visit Responsible Gaming" })] }), _jsx(Tabs.Root, { value: activeTab, onValueChange: (details) => setActiveTab(details.value), className: "mb-6 w-fit", children: _jsxs(Tabs.List, { children: [_jsx(Tabs.Trigger, { value: "Deposit", children: "Deposit" }), _jsx(Tabs.Trigger, { value: "Bet", children: "Bet" }), _jsx(Tabs.Indicator, {})] }) }), _jsx("div", { className: "grid grid-cols-1 gap-4 sm:grid-cols-2", children: limits.map((card) => {
-                            const pct = getUsedPercent(card.used, card.limit);
-                            const key = getNewLimitKey(activeTab, card.period);
-                            return (_jsxs("div", { className: "border-border-dark bg-bg-primary flex flex-col gap-4 rounded-xl border p-5 shadow-xs", children: [_jsxs("div", { className: "flex items-center justify-between gap-2", children: [_jsxs("span", { className: twMerge('inline-flex items-center gap-1.5 rounded-full px-2.5 py-1 text-xs font-medium', card.active
-                                                    ? 'border border-[#085D3A] bg-[#053321] text-[#75E0A7]'
-                                                    : 'border border-[#912018] bg-[#55160c] text-[#FDA29B]'), children: [_jsx("span", { className: twMerge('size-1.5 rounded-full', card.active ? 'bg-[#17B26A]' : 'bg-[#F04438]') }), card.active ? 'Active' : 'Inactive'] }), _jsxs("span", { className: "inline-flex items-center gap-1 rounded-full border border-[#b0841f] bg-[#191304] px-2.5 py-1 text-xs font-medium text-[#e2aa28]", children: [_jsx(RefreshCcw01Icon, { className: "size-3" }), card.resetsLabel] })] }), _jsxs("div", { children: [_jsx("p", { className: "text-sm font-semibold text-text-primary-brand", children: card.label }), _jsx("p", { className: "mt-1 text-2xl font-bold text-button-primary-bg", children: formatPeso(card.limit) })] }), _jsxs("div", { children: [_jsxs("div", { className: "text-text-disabled flex items-center justify-between text-xs", children: [_jsxs("span", { children: [formatPeso(card.used), " used"] }), _jsxs("span", { children: [pct, "%"] })] }), _jsx(Progress.Root, { value: pct, max: 100, variant: "unstyled", className: "relative mt-1.5 h-2 w-full", children: _jsx(Progress.Track, { className: "bg-bg-dark h-2 w-full rounded-full", children: _jsx(Progress.Range, { className: twMerge('h-full rounded-full transition-all duration-700 ease-in-out', getProgressColor(pct)) }) }) }), _jsxs("p", { className: "text-text-disabled mt-1.5 text-xs", children: ["Remaining: ", formatPeso(card.limit - card.used)] })] }), _jsxs("div", { children: [_jsxs("div", { className: "mb-2 flex items-center gap-1 text-sm font-medium text-text-primary-brand", children: [_jsx("span", { children: "Set new limit" }), _jsxs(Tooltip.Root, { openDelay: 0, closeDelay: 100, children: [_jsx(Tooltip.Trigger, { type: "button", className: "inline-flex", "aria-label": "Limit change information", children: _jsx(InfoCircleIcon, { className: "size-4 text-text-disabled" }) }), _jsx(Tooltip.Positioner, { children: _jsxs(Tooltip.Content, { className: "max-w-64 rounded-lg bg-[#0C111D] px-2.5 py-2 text-xs font-medium text-text-primary-brand", children: [_jsx(Tooltip.Arrow, {}), "Enter a new limit amount. Limits can only be lowered immediately. Limit increases take 24 hours to apply."] }) })] })] }), _jsxs("form", { className: "flex w-full items-center gap-2", onSubmit: form.handleSubmit((values) => {
-                                                    console.log({
-                                                        component: 'ResponsibleGamingLimits',
-                                                        activeTab,
-                                                        card,
-                                                        values,
-                                                    });
-                                                    saveLimit(card, values[key] ?? '');
-                                                }), children: [_jsxs(Field.Root, { className: "relative w-full", children: [_jsx("span", { className: "text-text-disabled absolute top-1/2 left-2 shrink-0 -translate-y-1/2 text-sm", children: "\u20B1" }), _jsx(Field.Input, { className: "pl-6", type: "number", min: 0, placeholder: "0", ...form.register(key) })] }), _jsx(Button, { size: "md", variant: "solid", colorScheme: "primary", type: "submit", className: "w-fit shrink-0", children: "Save" })] })] })] }, card.period));
-                        }) })] }), _jsx(BetDepositLimitModal, { onConfirm: applyConfirmedLimit })] }));
-}

package/dist/components/UpdateMobilePhoneNumber/hooks/useAutoOpenWhenUnverified.d.ts

@@ -1,6 +0,0 @@
-/**
- * Opens the UpdateMobilePhoneNumber dialog automatically (once per mount) if
- * the account has finished loading and the user's mobile number is not yet
- * verified. Closes it if it is verified.
- */
-export declare function useAutoOpenWhenUnverified(): void;

package/dist/components/UpdateMobilePhoneNumber/hooks/useAutoOpenWhenUnverified.js

@@ -1,31 +0,0 @@
-'use client';
-import { useEffect, useRef } from 'react';
-import { useShallow } from 'zustand/shallow';
-import { useAccountQuery } from '../../../client/hooks/useAccountQuery.js';
-import { useGlobalStore } from '../../../client/hooks/useGlobalStore.js';
-/**
- * Opens the UpdateMobilePhoneNumber dialog automatically (once per mount) if
- * the account has finished loading and the user's mobile number is not yet
- * verified. Closes it if it is verified.
- */
-export function useAutoOpenWhenUnverified() {
-    const { setOpen } = useGlobalStore(useShallow((ctx) => ({
-        setOpen: ctx.updateMobilePhoneNumber.setOpen,
-    })));
-    const accountQuery = useAccountQuery();
-    const account = accountQuery.data;
-    const isAccountLoading = accountQuery.isLoading;
-    const isMobileNumberVerified = account?.mobileNumberVerified === true;
-    const hasExecuted = useRef(false);
-    useEffect(() => {
-        if (!isAccountLoading && !!account && !hasExecuted.current) {
-            if (!isMobileNumberVerified) {
-                setOpen(true);
-            }
-            else {
-                setOpen(false);
-            }
-            hasExecuted.current = true;
-        }
-    }, [isAccountLoading, account, isMobileNumberVerified, setOpen]);
-}

package/dist/handlers/v4Cookies.d.ts

@@ -1,9 +0,0 @@
-import type { NextResponse } from 'next/server';
-/**
- * Proxies AUTH `Set-Cookie` headers (the v4 refresh cookie) onto the outgoing
- * Next.js response. In the proxy model the browser never talks to AUTH
- * directly, so the cookie is re-scoped to the app domain (the `Domain`
- * attribute from AUTH is dropped) and the route handler forwards it back to
- * AUTH on subsequent requests via the `Cookie` header.
- */
-export declare function applyV4SetCookie(response: NextResponse, setCookie: string[]): void;

package/dist/handlers/v4Cookies.js

@@ -1,49 +0,0 @@
-/**
- * Proxies AUTH `Set-Cookie` headers (the v4 refresh cookie) onto the outgoing
- * Next.js response. In the proxy model the browser never talks to AUTH
- * directly, so the cookie is re-scoped to the app domain (the `Domain`
- * attribute from AUTH is dropped) and the route handler forwards it back to
- * AUTH on subsequent requests via the `Cookie` header.
- */
-export function applyV4SetCookie(response, setCookie) {
-    for (const raw of setCookie) {
-        const parsed = parseSetCookie(raw);
-        if (!parsed)
-            continue;
-        response.cookies.set(parsed.name, parsed.value, parsed.options);
-    }
-}
-function parseSetCookie(raw) {
-    const [pair, ...attrs] = raw.split(';');
-    const eq = pair.indexOf('=');
-    if (eq < 0)
-        return null;
-    const name = pair.slice(0, eq).trim();
-    const value = pair.slice(eq + 1).trim();
-    const options = {};
-    for (const attr of attrs) {
-        const [k, v] = attr.split('=').map((s) => s.trim());
-        const key = k.toLowerCase();
-        if (key === 'path')
-            options.path = v;
-        else if (key === 'max-age')
-            options.maxAge = Number(v);
-        else if (key === 'expires') {
-            const d = new Date(v);
-            if (!Number.isNaN(d.getTime()))
-                options.expires = d;
-        }
-        else if (key === 'httponly')
-            options.httpOnly = true;
-        else if (key === 'secure')
-            options.secure = true;
-        else if (key === 'samesite') {
-            const lv = (v ?? '').toLowerCase();
-            if (lv === 'strict' || lv === 'lax' || lv === 'none') {
-                options.sameSite = lv;
-            }
-        }
-        // `Domain` is intentionally dropped so the cookie scopes to the app.
-    }
-    return { name, value, options };
-}

package/dist/utils/get-fingerprint.d.ts

@@ -1,8 +0,0 @@
-export declare function getFingerPrint(): Promise<string | null>;
-/**
- * Reads the session-version cookie (set by the `/api/sessions` route on
- * sign-in). Used by the client to decide whether v4-only headers (e.g.
- * `Fingerprint`) must accompany a request. The cookie is intentionally
- * non-HttpOnly so it can be read here.
- */
-export declare function getSessionVersion(): string | null;

package/dist/utils/get-fingerprint.js

@@ -1,37 +0,0 @@
-import { Thumbmark } from '@thumbmarkjs/thumbmarkjs';
-import { SESSION_VERSION_COOKIE_NAME } from '../constants/index.js';
-let thumbmark_instance;
-export async function getFingerPrint() {
-    if (typeof window === 'undefined')
-        return null;
-    if (!thumbmark_instance) {
-        thumbmark_instance = new Thumbmark({
-            logging: false,
-            timeout: 30000,
-            cache_lifetime_in_ms: 1 * 60 * 60 * 1000 /* 1h */,
-        });
-    }
-    try {
-        const cached = sessionStorage.getItem('fingerprint');
-        if (cached)
-            return cached;
-        const result = await thumbmark_instance.get();
-        sessionStorage.setItem('fingerprint', result.thumbmark);
-        return result.thumbmark;
-    }
-    catch {
-        return null;
-    }
-}
-/**
- * Reads the session-version cookie (set by the `/api/sessions` route on
- * sign-in). Used by the client to decide whether v4-only headers (e.g.
- * `Fingerprint`) must accompany a request. The cookie is intentionally
- * non-HttpOnly so it can be read here.
- */
-export function getSessionVersion() {
-    if (typeof document === 'undefined')
-        return null;
-    const match = document.cookie.match(`(?:^|; )${SESSION_VERSION_COOKIE_NAME}=([^;]*)`);
-    return match ? decodeURIComponent(match[1]) : null;
-}