@playbasis-ai/qwikcard-sdk 2.3.4

package/dist/QwikCardApp.js

@@ -0,0 +1,210 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useMemo, useRef, useState } from 'react';
+import { View, ActivityIndicator, Platform, Alert, TouchableOpacity, Text } from 'react-native';
+import { WebView } from 'react-native-webview';
+import { PlaybasisProvider, usePlaybasis } from './PlaybasisProvider';
+import { useTheme } from './theme/context';
+import { getWidgetHtml } from './web/widgetHtml';
+function AppContent({ leaderboardId }) {
+    const theme = useTheme();
+    const { client, tenantId, playerId, baseUrl } = usePlaybasis();
+    const webViewRef = useRef(null);
+    const [activeGame, setActiveGame] = useState(null);
+    const isQwikDark = theme.colors.background.toLowerCase() === '#0f1419';
+    const gameHeaderStyle = {
+        flexDirection: 'row',
+        alignItems: 'center',
+        paddingHorizontal: 16,
+        paddingVertical: 12,
+        borderBottomWidth: 1,
+        borderBottomColor: isQwikDark ? '#e2e8f0' : theme.colors.surface,
+        backgroundColor: isQwikDark ? '#ffffff' : theme.colors.background,
+    };
+    const gameHeaderTextColor = isQwikDark ? '#0f172a' : theme.colors.text.primary;
+    const closeGame = () => {
+        setActiveGame(null);
+        webViewRef.current?.injectJavaScript("window.PlaybasisWidget?.useWidgetStore?.getState?.()?.setActiveTab?.('play'); true;");
+    };
+    const html = useMemo(() => getWidgetHtml(), []);
+    const buildBootstrapPayload = useCallback(async () => {
+        if (!playerId) {
+            throw new Error('Missing playerId for widget bootstrap');
+        }
+        const [player, balances, quests, allBadges, playerBadges, rewards] = await Promise.all([
+            client.getPlayer(playerId),
+            client.getBalances(playerId),
+            client.getPlayerQuests(playerId),
+            client.getBadges(),
+            client.getPlayerBadges(playerId),
+            client.getRewards().catch(() => []), // Gracefully handle if rewards endpoint doesn't exist
+        ]);
+        const xp = balances.find((b) => b.currency === 'xp')?.balance ?? 0;
+        const qwikCoins = balances.find((b) => b.currency === 'qwik-coins')?.balance ?? 0;
+        const leaderboardEntries = leaderboardId
+            ? await (async () => {
+                try {
+                    const res = await client.getLeaderboard(leaderboardId, { limit: 50 });
+                    return res.entries.map((e) => ({
+                        userId: e.playerId,
+                        rank: e.rank,
+                        displayName: e.displayName,
+                        score: e.score,
+                        isCurrentUser: e.playerId === player.id,
+                    }));
+                }
+                catch {
+                    return [];
+                }
+            })()
+            : [];
+        return {
+            user: {
+                userId: player.id,
+                level: Math.max(1, Math.floor(xp / 1000) + 1),
+                exp: xp,
+                compositeScore: xp,
+                positiveChangePct: 0,
+            },
+            wallet: {
+                currency: 'XP',
+                balance: xp,
+                earnedDelta: 0,
+                qwikCoins,
+            },
+            goals: quests.map((q) => ({
+                goalId: q.id,
+                type: 'financial',
+                target: q.target,
+                current: q.progress,
+                progressPct: q.target > 0 ? Math.round((q.progress / q.target) * 100) : 0,
+                startDate: new Date().toISOString().slice(0, 10),
+                endDate: q.expiresAt ?? new Date(Date.now() + 7 * 24 * 60 * 60 * 1000).toISOString(),
+                status: q.status === 'completed' ? 'completed' : q.status === 'expired' ? 'at_risk' : 'on_track',
+                rewards: {
+                    xp: q.rewards?.find((r) => r.type === 'points')?.amount || 100,
+                    badges: (q.rewards
+                        ?.filter((r) => r.type === 'badge')
+                        .map((r) => r.badgeId)
+                        .filter(Boolean) || []),
+                },
+            })),
+            badges: allBadges.map((b) => ({
+                id: b.id,
+                name: b.name,
+                rarity: 'common',
+                unlocked: playerBadges.some((pb) => pb.id === b.id && pb.isEarned),
+                imageUrl: b.imageUrl,
+            })),
+            rewards: rewards.map((r) => ({
+                id: r.id,
+                name: r.name,
+                description: r.description || '',
+                cost: r.cost || 0,
+                imageUrl: r.imageUrl,
+            })),
+            activities: [],
+            leaderboardEntries,
+            tenantId,
+        };
+    }, [client, leaderboardId, playerId, tenantId]);
+    const handleMessage = useCallback(async (event) => {
+        let message;
+        try {
+            message = JSON.parse(event.nativeEvent.data);
+        }
+        catch {
+            return;
+        }
+        if (message.type === 'ERROR') {
+            // Handle errors from WebView
+            console.error('[QwikCardApp] WebView Error:', message.error);
+            Alert.alert('Widget Error', message.error || 'An unknown error occurred in the widget.');
+            return;
+        }
+        if (message.type === 'OPEN_GAME') {
+            setActiveGame({ url: message.url, title: message.title });
+            return;
+        }
+        if (message.type !== 'REQUEST')
+            return;
+        const sendResponse = (payload) => {
+            const js = `window.__PB_HANDLE_NATIVE_MESSAGE__ && window.__PB_HANDLE_NATIVE_MESSAGE__(${JSON.stringify(payload)}); true;`;
+            webViewRef.current?.injectJavaScript(js);
+        };
+        const requestId = message.requestId;
+        if (!playerId) {
+            sendResponse({
+                type: 'RESPONSE',
+                requestId,
+                ok: false,
+                error: 'PlayerId is required for widget data requests',
+            });
+            return;
+        }
+        try {
+            switch (message.resource) {
+                case 'bootstrap': {
+                    const data = await buildBootstrapPayload();
+                    sendResponse({ type: 'RESPONSE', requestId, ok: true, data });
+                    return;
+                }
+                default: {
+                    sendResponse({
+                        type: 'RESPONSE',
+                        requestId,
+                        ok: false,
+                        error: `Unsupported resource: ${String(message.resource)}`,
+                    });
+                    return;
+                }
+            }
+        }
+        catch (error) {
+            sendResponse({
+                type: 'RESPONSE',
+                requestId,
+                ok: false,
+                error: error instanceof Error ? error.message : 'Failed to process widget request',
+            });
+        }
+    }, [buildBootstrapPayload, playerId]);
+    const injectedJavaScript = useMemo(() => {
+        // Seed initial config for the widget and establish a stable native->web message handler.
+        // The web layer will immediately request `bootstrap` from native.
+        const initPayload = {
+            type: 'INIT',
+            config: {
+                tenantId,
+                playerId: playerId ?? '',
+                baseUrl,
+            },
+            platform: Platform.OS,
+        };
+        return `window.__PB_INIT__ = ${JSON.stringify(initPayload)}; true;`;
+    }, [tenantId, playerId, baseUrl]);
+    if (!playerId) {
+        return (_jsx(View, { style: {
+                flex: 1,
+                alignItems: 'center',
+                justifyContent: 'center',
+                backgroundColor: theme.colors.background,
+            }, children: _jsx(ActivityIndicator, { size: "large", color: theme.colors.primary }) }));
+    }
+    return (_jsxs(View, { style: { flex: 1, backgroundColor: theme.colors.background }, children: [_jsx(View, { style: { flex: 1, display: activeGame ? 'none' : 'flex' }, children: _jsx(WebView, { ref: webViewRef, originWhitelist: ['*'], source: { html }, onMessage: handleMessage, injectedJavaScript: injectedJavaScript, javaScriptEnabled: true, domStorageEnabled: true, allowsInlineMediaPlayback: true, startInLoadingState: true, renderLoading: () => (_jsx(View, { style: {
+                            flex: 1,
+                            alignItems: 'center',
+                            justifyContent: 'center',
+                            backgroundColor: theme.colors.background,
+                        }, children: _jsx(ActivityIndicator, { size: "large", color: theme.colors.primary }) })), 
+                    // Reduce common RN/WebView UX papercuts.
+                    keyboardDisplayRequiresUserAction: false, setSupportMultipleWindows: false, 
+                    // Avoid white flashes on iOS.
+                    style: { backgroundColor: theme.colors.background } }) }), activeGame && (_jsxs(View, { style: { flex: 1 }, children: [_jsxs(View, { style: gameHeaderStyle, children: [_jsx(TouchableOpacity, { onPress: closeGame, style: { paddingVertical: 4, paddingRight: 8 }, children: _jsx(Text, { style: { color: theme.colors.primary, fontWeight: '700' }, children: "\u2190 Arcade" }) }), _jsx(Text, { style: {
+                                    marginLeft: 4,
+                                    color: gameHeaderTextColor,
+                                    fontWeight: '700',
+                                }, children: activeGame.title || 'Play' })] }), _jsx(WebView, { originWhitelist: ['*'], source: { uri: activeGame.url }, javaScriptEnabled: true, domStorageEnabled: true, allowsInlineMediaPlayback: true, startInLoadingState: true })] }))] }));
+}
+export function QwikCardApp(props) {
+    return (_jsx(PlaybasisProvider, { ...props, children: _jsx(AppContent, { leaderboardId: props.leaderboardId }) }));
+}

package/dist/api/client.d.ts

@@ -0,0 +1,66 @@
+import type { Badge, LeaderboardEntry, Player, PlayerRank, PointBalance, Quest, RedemptionResult, Reward, TrackEventInput } from '../types';
+interface ClientConfig {
+    apiKey: string;
+    tenantId: string;
+    baseUrl?: string;
+    fetchImpl?: typeof fetch;
+}
+export declare class PlaybasisClient {
+    private readonly baseUrl;
+    private readonly fetchImpl;
+    private readonly apiKey;
+    private readonly tenantId;
+    constructor(config: ClientConfig);
+    /**
+     * Generate a unique ID for idempotency keys.
+     * Uses crypto.randomUUID when available, falls back to timestamp + random.
+     */
+    private generateId;
+    private request;
+    createPlayer(input: {
+        displayName: string;
+        email?: string;
+        metadata?: Record<string, unknown>;
+    }): Promise<Player>;
+    getPlayer(playerId: string): Promise<Player>;
+    updatePlayer(playerId: string, updates: Partial<{
+        displayName: string;
+        metadata: Record<string, unknown>;
+    }>): Promise<Player>;
+    getBalances(playerId: string): Promise<PointBalance[]>;
+    earnPoints(input: {
+        playerId: string;
+        currency: string;
+        amount: number;
+        reason?: string;
+    }): Promise<PointBalance>;
+    redeemPoints(input: {
+        playerId: string;
+        currency: string;
+        amount: number;
+        reason?: string;
+    }): Promise<PointBalance>;
+    trackEvent(input: TrackEventInput): Promise<{
+        eventId: string;
+    }>;
+    getQuests(): Promise<Quest[]>;
+    getPlayerQuests(playerId: string): Promise<Quest[]>;
+    getQuestProgress(playerId: string, questId: string): Promise<Quest>;
+    getBadges(): Promise<Badge[]>;
+    getPlayerBadges(playerId: string): Promise<Badge[]>;
+    getRewards(): Promise<Reward[]>;
+    redeemReward(playerId: string, rewardId: string): Promise<RedemptionResult>;
+    getLeaderboard(leaderboardId: string, options?: {
+        limit?: number;
+        cursor?: string;
+    }): Promise<{
+        entries: LeaderboardEntry[];
+        total: number;
+    }>;
+    getPlayerRank(leaderboardId: string, playerId: string): Promise<PlayerRank>;
+    health(): Promise<{
+        status: string;
+    }>;
+}
+export default PlaybasisClient;
+//# sourceMappingURL=client.d.ts.map

package/dist/api/client.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../../src/api/client.ts"],"names":[],"mappings":"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"}

package/dist/api/client.js

@@ -0,0 +1,196 @@
+const DEFAULT_BASE_URL = 'https://apim-pb-staging.azure-api.net/playbasis/v1';
+// ─────────────────────────────────────────────────────────────────────────────
+// Client
+// ─────────────────────────────────────────────────────────────────────────────
+export class PlaybasisClient {
+    constructor(config) {
+        this.tenantId = config.tenantId;
+        this.baseUrl = (config.baseUrl || DEFAULT_BASE_URL).replace(/\/+$/, '');
+        this.fetchImpl = config.fetchImpl ?? fetch;
+        this.apiKey = config.apiKey;
+    }
+    /**
+     * Generate a unique ID for idempotency keys.
+     * Uses crypto.randomUUID when available, falls back to timestamp + random.
+     */
+    generateId() {
+        if (typeof crypto !== 'undefined' && typeof crypto.randomUUID === 'function') {
+            return crypto.randomUUID();
+        }
+        // Fallback for environments without crypto.randomUUID
+        return `${Date.now()}-${Math.random().toString(36).slice(2, 11)}`;
+    }
+    async request(method, path, options) {
+        const url = `${this.baseUrl}${path.startsWith('/') ? '' : '/'}${path}`;
+        // Build headers with Content-Type set before creating init
+        const headers = {
+            'Ocp-Apim-Subscription-Key': this.apiKey,
+            'X-Tenant-ID': this.tenantId,
+            ...options?.headers,
+        };
+        // Set Content-Type before assigning to init to avoid mutation after reference
+        if (options?.body !== undefined) {
+            headers['Content-Type'] = headers['Content-Type'] ?? 'application/json';
+        }
+        const init = {
+            method,
+            headers,
+            body: options?.body !== undefined ? JSON.stringify(options.body) : undefined,
+        };
+        const response = await this.fetchImpl(url, init);
+        const text = await response.text();
+        // Safely parse JSON - server may return non-JSON (e.g., HTML error page)
+        let json;
+        if (text) {
+            try {
+                json = JSON.parse(text);
+            }
+            catch {
+                // Response is not valid JSON - leave as undefined
+                json = undefined;
+            }
+        }
+        const getErrorMessage = (value) => {
+            if (!value || typeof value !== 'object')
+                return undefined;
+            if (!('message' in value))
+                return undefined;
+            const messageValue = value.message;
+            return typeof messageValue === 'string' ? messageValue : undefined;
+        };
+        if (!response.ok) {
+            const errorMessage = getErrorMessage(json) ||
+                (text && !json ? text.slice(0, 200) : null) ||
+                `Request failed: ${response.status} ${response.statusText}`;
+            throw new Error(String(errorMessage));
+        }
+        return json;
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+    // Players
+    // ─────────────────────────────────────────────────────────────────────────
+    async createPlayer(input) {
+        const data = await this.request('POST', '/players', { body: input });
+        return data.player;
+    }
+    async getPlayer(playerId) {
+        const data = await this.request('GET', `/players/${encodeURIComponent(playerId)}`);
+        return data.player;
+    }
+    async updatePlayer(playerId, updates) {
+        const data = await this.request('PATCH', `/players/${encodeURIComponent(playerId)}`, {
+            body: updates,
+        });
+        return data.player;
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+    // Points
+    // ─────────────────────────────────────────────────────────────────────────
+    async getBalances(playerId) {
+        const data = await this.request('GET', `/players/${encodeURIComponent(playerId)}/points`);
+        return data.balances;
+    }
+    async earnPoints(input) {
+        const idempotencyKey = `earn-${input.playerId}-${this.generateId()}`;
+        const data = await this.request('POST', '/points/earn', {
+            body: input,
+            headers: { 'Idempotency-Key': idempotencyKey },
+        });
+        return data.balance;
+    }
+    async redeemPoints(input) {
+        const idempotencyKey = `redeem-${input.playerId}-${this.generateId()}`;
+        const data = await this.request('POST', '/points/redeem', {
+            body: input,
+            headers: { 'Idempotency-Key': idempotencyKey },
+        });
+        return data.balance;
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+    // Events
+    // ─────────────────────────────────────────────────────────────────────────
+    async trackEvent(input) {
+        const idempotencyKey = input.referenceId || `evt-${input.playerId}-${this.generateId()}`;
+        const event = {
+            id: idempotencyKey,
+            source: 'qwikcard-app',
+            type: input.type,
+            specversion: '1.0',
+            time: new Date().toISOString(),
+            subject: input.playerId,
+            data: input.data || {},
+        };
+        const data = await this.request('POST', '/events', {
+            body: event,
+            headers: { 'Idempotency-Key': idempotencyKey },
+        });
+        return { eventId: data.event?.id || idempotencyKey };
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+    // Quests
+    // ─────────────────────────────────────────────────────────────────────────
+    async getQuests() {
+        const data = await this.request('GET', '/quests');
+        return data.quests || [];
+    }
+    async getPlayerQuests(playerId) {
+        const data = await this.request('GET', `/players/${encodeURIComponent(playerId)}/quests`);
+        return data.quests || [];
+    }
+    async getQuestProgress(playerId, questId) {
+        const data = await this.request('GET', `/players/${encodeURIComponent(playerId)}/quests/${encodeURIComponent(questId)}`);
+        return data.quest;
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+    // Badges
+    // ─────────────────────────────────────────────────────────────────────────
+    async getBadges() {
+        const data = await this.request('GET', '/badges');
+        return data.badges || [];
+    }
+    async getPlayerBadges(playerId) {
+        const data = await this.request('GET', `/players/${encodeURIComponent(playerId)}/badges`);
+        return data.badges || [];
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+    // Rewards
+    // ─────────────────────────────────────────────────────────────────────────
+    async getRewards() {
+        const data = await this.request('GET', '/rewards');
+        return data.rewards || [];
+    }
+    async redeemReward(playerId, rewardId) {
+        const idempotencyKey = `reward-${playerId}-${rewardId}-${this.generateId()}`;
+        const data = await this.request('POST', '/rewards/redeem', {
+            body: { playerId, rewardId },
+            headers: { 'Idempotency-Key': idempotencyKey },
+        });
+        return data;
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+    // Leaderboards
+    // ─────────────────────────────────────────────────────────────────────────
+    async getLeaderboard(leaderboardId, options) {
+        const params = new URLSearchParams();
+        if (options?.limit)
+            params.set('limit', String(options.limit));
+        if (options?.cursor)
+            params.set('cursor', options.cursor);
+        const data = await this.request('GET', `/leaderboards/${encodeURIComponent(leaderboardId)}?${params}`);
+        return {
+            entries: data.leaderboard?.entries || [],
+            total: data.leaderboard?.total || 0,
+        };
+    }
+    async getPlayerRank(leaderboardId, playerId) {
+        const data = await this.request('GET', `/leaderboards/${encodeURIComponent(leaderboardId)}/players/${encodeURIComponent(playerId)}`);
+        return data.player;
+    }
+    // ─────────────────────────────────────────────────────────────────────────
+    // Health Check
+    // ─────────────────────────────────────────────────────────────────────────
+    async health() {
+        return this.request('GET', '/health');
+    }
+}
+export default PlaybasisClient;

package/dist/components/Badge.d.ts

@@ -0,0 +1,8 @@
+interface BadgeProps {
+    label: string;
+    value?: string;
+    color?: string;
+}
+export declare function StatBadge({ label, value, color }: BadgeProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Badge.d.ts.map

package/dist/components/Badge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../src/components/Badge.tsx"],"names":[],"mappings":"AAKA,UAAU,UAAU;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,UAAU,2CAmB5D"}

package/dist/components/Badge.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { View, Text, StyleSheet } from 'react-native';
+import { useTheme } from '../theme/context';
+export function StatBadge({ label, value, color }) {
+    const theme = useTheme();
+    const accentColor = color || theme.colors.primary;
+    return (_jsxs(View, { style: [
+            styles.container,
+            {
+                backgroundColor: `${accentColor}1A`, // 10% opacity
+                borderColor: `${accentColor}33`, // 20% opacity
+                borderRadius: theme.borderRadius.m,
+            },
+        ], children: [_jsx(Text, { style: [styles.label, { color: theme.colors.text.secondary }], children: label }), value && _jsx(Text, { style: [styles.value, { color: accentColor }], children: value })] }));
+}
+const styles = StyleSheet.create({
+    container: {
+        paddingVertical: 6,
+        paddingHorizontal: 10,
+        borderWidth: 1,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    label: {
+        fontSize: 10,
+        textTransform: 'uppercase',
+        letterSpacing: 0.5,
+        marginBottom: 2,
+    },
+    value: {
+        fontSize: 14,
+        fontWeight: '700',
+    },
+});

package/dist/components/BadgeIcon.d.ts

@@ -0,0 +1,10 @@
+import type { Badge } from '../types';
+interface BadgeIconProps {
+    badge: Badge;
+    size?: 'small' | 'medium' | 'large';
+    showName?: boolean;
+    style?: object;
+}
+export declare function BadgeIcon({ badge, size, showName, style }: BadgeIconProps): import("react/jsx-runtime").JSX.Element;
+export default BadgeIcon;
+//# sourceMappingURL=BadgeIcon.d.ts.map

package/dist/components/BadgeIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BadgeIcon.d.ts","sourceRoot":"","sources":["../../src/components/BadgeIcon.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AAMtC,UAAU,cAAc;IACtB,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAMD,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,IAAe,EAAE,QAAe,EAAE,KAAK,EAAE,EAAE,cAAc,2CA6C3F;AA+BD,eAAe,SAAS,CAAC"}

package/dist/components/BadgeIcon.js

@@ -0,0 +1,51 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { View, Text, Image, StyleSheet } from 'react-native';
+// ─────────────────────────────────────────────────────────────────────────────
+// Component
+// ─────────────────────────────────────────────────────────────────────────────
+export function BadgeIcon({ badge, size = 'medium', showName = true, style }) {
+    const dimensions = {
+        small: 40,
+        medium: 60,
+        large: 80,
+    };
+    const iconSize = dimensions[size];
+    const isEarned = badge.isEarned;
+    return (_jsxs(View, { style: [styles.container, style], children: [_jsx(View, { style: [
+                    styles.iconContainer,
+                    {
+                        width: iconSize,
+                        height: iconSize,
+                        borderRadius: iconSize / 2,
+                        opacity: isEarned ? 1 : 0.4,
+                    },
+                ], children: badge.imageUrl ? (_jsx(Image, { source: { uri: badge.imageUrl }, style: { width: iconSize - 8, height: iconSize - 8, borderRadius: (iconSize - 8) / 2 }, resizeMode: "cover" })) : (_jsx(Text, { style: { fontSize: iconSize / 2 }, children: "\uD83C\uDFC5" })) }), showName && (_jsx(Text, { style: [styles.name, { color: isEarned ? '#1F2937' : '#9CA3AF' }], numberOfLines: 2, children: badge.name })), isEarned && badge.earnedAt && (_jsx(Text, { style: styles.earnedDate, children: new Date(badge.earnedAt).toLocaleDateString() }))] }));
+}
+// ─────────────────────────────────────────────────────────────────────────────
+// Styles
+// ─────────────────────────────────────────────────────────────────────────────
+const styles = StyleSheet.create({
+    container: {
+        alignItems: 'center',
+        padding: 8,
+        width: 80,
+    },
+    iconContainer: {
+        backgroundColor: '#F3F4F6',
+        justifyContent: 'center',
+        alignItems: 'center',
+        marginBottom: 4,
+    },
+    name: {
+        fontSize: 11,
+        fontWeight: '500',
+        textAlign: 'center',
+        marginTop: 4,
+    },
+    earnedDate: {
+        fontSize: 9,
+        color: '#9CA3AF',
+        marginTop: 2,
+    },
+});
+export default BadgeIcon;

package/dist/components/Button.d.ts

@@ -0,0 +1,10 @@
+import { ViewStyle } from 'react-native';
+interface ButtonProps {
+    title: string;
+    onPress: () => void;
+    variant?: 'primary' | 'secondary';
+    style?: ViewStyle;
+}
+export declare function Button({ title, onPress, variant, style }: ButtonProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=Button.d.ts.map

package/dist/components/Button.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../src/components/Button.tsx"],"names":[],"mappings":"AACA,OAAO,EAAsC,SAAS,EAAE,MAAM,cAAc,CAAC;AAK7E,UAAU,WAAW;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB;AAED,wBAAgB,MAAM,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,OAAmB,EAAE,KAAK,EAAE,EAAE,WAAW,2CAoCjF"}

package/dist/components/Button.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TouchableOpacity, Text, StyleSheet } from 'react-native';
+import LinearGradient from 'react-native-linear-gradient';
+import { useTheme } from '../theme/context';
+export function Button({ title, onPress, variant = 'primary', style }) {
+    const theme = useTheme();
+    if (variant === 'secondary') {
+        return (_jsx(TouchableOpacity, { onPress: onPress, style: [
+                styles.container,
+                {
+                    backgroundColor: 'rgba(255, 255, 255, 0.1)',
+                    borderColor: theme.colors.surface,
+                    borderWidth: 1,
+                    borderRadius: theme.borderRadius.m,
+                },
+                style,
+            ], children: _jsx(Text, { style: [styles.text, { color: theme.colors.text.primary }], children: title }) }));
+    }
+    // Primary variant with gradient
+    return (_jsx(TouchableOpacity, { onPress: onPress, style: [styles.touchable, style], children: _jsx(LinearGradient, { colors: theme.colors.gradients.button, start: { x: 0, y: 0 }, end: { x: 1, y: 0 }, style: [styles.container, { borderRadius: theme.borderRadius.m }], children: _jsx(Text, { style: [styles.text, { color: theme.colors.text.onPrimary }], children: title }) }) }));
+}
+const styles = StyleSheet.create({
+    touchable: {
+        shadowColor: '#FF4500',
+        shadowOffset: { width: 0, height: 4 },
+        shadowOpacity: 0.3,
+        shadowRadius: 8,
+        elevation: 4,
+    },
+    container: {
+        paddingVertical: 12,
+        paddingHorizontal: 20,
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+    text: {
+        fontSize: 14,
+        fontWeight: '700',
+    },
+});

package/dist/components/GradientCard.d.ts

@@ -0,0 +1,9 @@
+import { ReactNode } from 'react';
+import { ViewStyle, StyleProp } from 'react-native';
+interface GradientCardProps {
+    children: ReactNode;
+    style?: StyleProp<ViewStyle>;
+}
+export declare function GradientCard({ children, style }: GradientCardProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=GradientCard.d.ts.map