@mohasinac/appkit 2.7.9 → 2.7.11

package/dist/_internal/shared/config/index.d.ts

@@ -1 +1 @@
-export type { AppkitConfig, AppkitSmokeRoute, AppkitThemeProbeRoute, AppkitAuthFixture } from "./schema";
+export type { AppkitConfig, AppkitSmokeRoute, AppkitThemeProbeRoute, AppkitAuthFixture, AppkitFirebaseConfig, AppkitFirebaseExtensions, AppkitVercelConfig, AppkitBrandConfig, AppkitSeoConfig, AppkitI18nConfig, AppkitImagePattern, FirestoreIndex, FirestoreIndexField, FirestoreFieldOverride, } from "./schema";

package/dist/_internal/shared/config/schema.d.ts

@@ -39,15 +39,99 @@ export interface AppkitAuthFixture {
     /** Cookie header value, e.g. "session=FIXTURE_TOKEN" */
     cookie: string;
 }
+export interface FirestoreIndexField {
+    fieldPath: string;
+    order?: "ASCENDING" | "DESCENDING";
+    arrayConfig?: "CONTAINS";
+}
+export interface FirestoreIndex {
+    collectionGroup: string;
+    queryScope: "COLLECTION" | "COLLECTION_GROUP";
+    fields: FirestoreIndexField[];
+}
+export interface FirestoreFieldOverride {
+    collectionGroup: string;
+    fieldPath: string;
+    indexes: Array<{
+        order?: "ASCENDING" | "DESCENDING";
+        arrayConfig?: "CONTAINS";
+        queryScope: "COLLECTION" | "COLLECTION_GROUP";
+    }>;
+}
+/** Consumer-specific Firebase extensions merged on top of the appkit base by firebase-merge.mjs. */
+export interface AppkitFirebaseExtensions {
+    /** Additional Firestore composite indexes merged on top of the appkit base (deduplicated). */
+    indexes?: FirestoreIndex[];
+    /** Additional Firestore field overrides appended to the base list. */
+    fieldOverrides?: FirestoreFieldOverride[];
+    /** Additional RTDB rule paths deep-merged into the base rules object. */
+    database?: Record<string, unknown>;
+    /** Raw Firestore security rules block injected inside the top-level match block. */
+    firestoreRules?: string;
+    /** Raw Storage security rules block injected inside the bucket match block. */
+    storageRules?: string;
+}
 export interface AppkitFirebaseConfig {
     /** Firebase project ID */
     projectId: string;
-    /** Path to firestore.indexes.json base file */
+    /** Path to firestore.indexes.json base file (default: appkit/firebase/base/firestore.indexes.json) */
     indexesPath?: string;
     /** Collections to include in reset (undefined = all) */
     resetCollections?: string[];
     /** Firebase Functions region */
     functionsRegion?: string;
+    /** Consumer-specific extensions merged on top of the appkit base by `npm run firebase:generate`. */
+    extensions?: AppkitFirebaseExtensions;
+}
+export interface AppkitBrandConfig {
+    /** Display name of the brand, e.g. "LetItRip" */
+    name: string;
+    /** Short / abbreviated name, e.g. "LT" */
+    shortName?: string;
+    /** One-line brand description used in meta tags and footers */
+    description?: string;
+    /** Tagline shown in footer / about sections */
+    madeInText?: string;
+    socialUrls?: {
+        instagram?: string;
+        twitter?: string;
+        whatsapp?: string;
+        youtube?: string;
+        facebook?: string;
+        linkedin?: string;
+    };
+}
+export interface AppkitSeoConfig {
+    /** Canonical site URL, e.g. "https://letitrip.in" */
+    siteUrl: string;
+    /** Default page <title> */
+    defaultTitle?: string;
+    /** Default meta description */
+    defaultDescription?: string;
+    /** Default OG image path (relative to public/) */
+    defaultImage?: string;
+    /** OG site name */
+    siteName?: string;
+    /** Twitter/X handle including @, e.g. "@letitrip" */
+    twitterHandle?: string;
+    /** BCP 47 locale tag for OG/schema.org, e.g. "en-IN" */
+    locale?: string;
+}
+export interface AppkitI18nConfig {
+    /** next-intl localePrefix strategy (default: "never") */
+    localePrefix?: "never" | "always" | "as-needed";
+    /**
+     * Set false to suppress the Set-Cookie: Next-Locale header, which forces
+     * cache-control: private and breaks Vercel ISR. Disable when running a single
+     * locale (default: false).
+     */
+    enableLocaleCookie?: boolean;
+}
+export interface AppkitImagePattern {
+    protocol?: "http" | "https";
+    hostname: string;
+    port?: string;
+    pathname?: string;
 }
 export interface AppkitVercelConfig {
     /** Vercel project ID */
@@ -56,12 +140,22 @@ export interface AppkitVercelConfig {
     team?: string;
     /** Path to .env file to sync */
     envFile?: string;
+    /** Deployment regions, e.g. ["bom1"] */
+    regions?: string[];
 }
 export interface AppkitConfig {
     /** Base URL for smoke tests and theme probes (default: http://localhost:3000) */
     baseUrl?: string;
     /** Supported locales (default: ["en"]) */
     locales?: string[];
+    /** Brand identity — name, social URLs, taglines */
+    brand?: AppkitBrandConfig;
+    /** SEO defaults — siteUrl, defaultTitle, OG image, Twitter handle */
+    seo?: AppkitSeoConfig;
+    /** i18n / next-intl routing options */
+    i18n?: AppkitI18nConfig;
+    /** next/image remotePatterns for external image hosts (demo / seed data) */
+    externalImagePatterns?: AppkitImagePattern[];
     /** Route configuration for smoke tests and theme probing */
     routes?: {
         /** Routes to SSR-verify: must return 200 + expected strings in initial HTML */

package/dist/client-entry.d.ts

@@ -18,6 +18,6 @@ export type { AppkitLabelSet } from "./_internal/client/i18n/LabelsProvider";
 export { AppShell, DashboardScaffold } from "./_internal/client/scaffolds/index";
 export type { AppShellProps, AppShellRenderContext, DashboardScaffoldProps, DashboardScaffoldRenderContext, } from "./_internal/client/scaffolds/index";
 export { toClient, clientInitial } from "./_internal/shared/serialization/index";
-export type { AppkitConfig } from "./_internal/shared/config/schema";
+export type { AppkitConfig, AppkitFirebaseConfig, AppkitFirebaseExtensions, AppkitVercelConfig, AppkitBrandConfig, AppkitSeoConfig, AppkitI18nConfig, AppkitImagePattern, FirestoreIndex, FirestoreIndexField, FirestoreFieldOverride, } from "./_internal/shared/config/schema";
 export { SEMANTIC_COLORS, SEMANTIC_COLORS_DARK, SEMANTIC_RADIUS, SEMANTIC_SHADOWS, SEMANTIC_Z_INDEX, MOTION_TOKENS, BREAKPOINTS, PLATFORM_LIMITS, } from "./_internal/shared/tokens/index";
 export type { Responsive, Breakpoint, SemanticColor } from "./_internal/shared/tokens/index";

package/dist/client.d.ts

@@ -8,6 +8,9 @@ export { Modal } from "./ui/components/Modal";
 export { SideDrawer } from "./ui/components/SideDrawer";
 export { SideModal } from "./ui/components/SideModal";
 export { UnsavedChangesModal } from "./ui/components/UnsavedChangesModal";
+export { LoginRequiredModal } from "./ui/components/LoginRequiredModal";
+export type { LoginRequiredModalProps } from "./ui/components/LoginRequiredModal";
+export { isAuthError } from "./utils/auth-error";
 export { useToast } from "./ui/components/Toast";
 export { useAuth } from "./react/contexts/SessionContext";
 export { useCamera } from "./react/hooks/useCamera";

package/dist/client.js

@@ -27,6 +27,11 @@ export { SideModal } from "./ui/components/SideModal";
 // [CLIENT-ONLY]-Cannot run in SSR mode â€" uses browser-only APIs (window, navigator, localStorage, matchMedia, DOM events) that do not exist in Node.js.
 // UnsavedChangesModal - Component for unsaved changes modal.
 export { UnsavedChangesModal } from "./ui/components/UnsavedChangesModal";
+// [CLIENT-ONLY]-Cannot run in SSR mode — uses browser-only APIs (window.location).
+// LoginRequiredModal - Modal prompting unauthenticated users to log in.
+export { LoginRequiredModal } from "./ui/components/LoginRequiredModal";
+// isAuthError - Detects auth/authorization errors from server actions or fetch responses.
+export { isAuthError } from "./utils/auth-error";
 // [CLIENT-ONLY]-Cannot run in SSR mode â€" uses browser-only APIs (window, navigator, localStorage, matchMedia, DOM events) that do not exist in Node.js.
 // useToast - React hook for use toast.
 export { useToast } from "./ui/components/Toast";

package/dist/configs/next.js

@@ -65,7 +65,7 @@ const FIREBASE_EXTERNAL_PACKAGES = [
  * ```
  */
 export function defineNextConfig(override = {}) {
-    const { serverExternalPackages: consumerExternal = [], experimental: consumerExperimental = {}, webpack: consumerWebpack, outputFileTracingIncludes: consumerOutputFileTracingIncludes = {}, ...rest } = override;
+    const { serverExternalPackages: consumerExternal = [], experimental: consumerExperimental = {}, webpack: consumerWebpack, outputFileTracingIncludes: consumerOutputFileTracingIncludes = {}, turbopack: consumerTurbopack = {}, ...rest } = override;
     const mergedExternal = [
         ...FIREBASE_EXTERNAL_PACKAGES,
         ...consumerExternal.filter((p) => !FIREBASE_EXTERNAL_PACKAGES.includes(p)),
@@ -177,6 +177,8 @@ export function defineNextConfig(override = {}) {
         // disagree on which apps exist, causing "No Firebase App '[DEFAULT]'" errors.
         // Pinning every firebase/* import to the root copy ensures the singleton
         // registry is shared regardless of which file imports firebase.
+        // NOTE: This fixes webpack (dev --webpack) only. Turbopack (next build) uses
+        // turbopack.resolveAlias in the returned config object — see below.
         const _firebaseRoot = path.resolve(process.cwd(), "node_modules", "firebase");
         config.resolve.alias = {
             ...(config.resolve.alias ?? {}),
@@ -265,6 +267,19 @@ export function defineNextConfig(override = {}) {
         ...consumerRemotePatterns.filter((p) => !defaultRemotePatterns.some((d) => d.hostname ===
             p.hostname)),
     ];
+    // Turbopack (used by `next build`) has its own alias system separate from
+    // webpack. Mirror the firebase deduplication alias so prod builds share the
+    // same Firebase app registry as dev builds.
+    const firebaseRoot = path.resolve(process.cwd(), "node_modules", "firebase");
+    const consumerTurbopackResolved = consumerTurbopack;
+    const consumerTurbopackAlias = (consumerTurbopackResolved.resolveAlias ?? {});
+    const mergedTurbopack = {
+        ...consumerTurbopackResolved,
+        resolveAlias: {
+            ...consumerTurbopackAlias,
+            firebase: firebaseRoot,
+        },
+    };
     return {
         images: {
             ...consumerImages,
@@ -275,5 +290,6 @@ export function defineNextConfig(override = {}) {
         experimental: mergedExperimental,
         outputFileTracingIncludes: mergedOutputFileTracingIncludes,
         webpack: mergedWebpack,
+        turbopack: mergedTurbopack,
     };
 }

package/dist/features/account/components/UserOffersPanel.js

@@ -1,7 +1,8 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useState, useTransition } from "react";
-import { Alert, Badge, Button, Div, Heading, Spinner, Text } from "../../../ui";
+import { Alert, Badge, Button, Div, Heading, LoginRequiredModal, Spinner, Text } from "../../../ui";
+import { isAuthError } from "../../../utils/auth-error";
 function formatRupees(amount) {
     if (amount === undefined || amount === null)
         return "—";
@@ -32,7 +33,7 @@ function statusVariant(status) {
         default: return "default";
     }
 }
-function BuyerOfferCard({ offer, onAcceptCounter, onWithdraw, onCheckout, onUpdate }) {
+function BuyerOfferCard({ offer, onAcceptCounter, onWithdraw, onCheckout, onUpdate, onNeedsLogin }) {
     const [error, setError] = useState("");
     const [isPending, startTransition] = useTransition();
     const [confirming, setConfirming] = useState(null);
@@ -45,7 +46,12 @@ function BuyerOfferCard({ offer, onAcceptCounter, onWithdraw, onCheckout, onUpda
                 setConfirming(null);
             }
             catch (err) {
-                setError(err instanceof Error ? err.message : "Something went wrong.");
+                if (isAuthError(err)) {
+                    onNeedsLogin();
+                }
+                else {
+                    setError(err instanceof Error ? err.message : "Something went wrong.");
+                }
             }
         });
     }
@@ -55,13 +61,19 @@ export function UserOffersPanel({ fetchEndpoint = "/api/user/offers", onAcceptCo
     const [offers, setOffers] = useState([]);
     const [loading, setLoading] = useState(true);
     const [fetchError, setFetchError] = useState("");
+    const [showLoginModal, setShowLoginModal] = useState(false);
     const loadOffers = useCallback(async () => {
         setLoading(true);
         setFetchError("");
         try {
             const res = await fetch(fetchEndpoint);
-            if (!res.ok)
+            if (!res.ok) {
+                if (res.status === 401 || res.status === 403) {
+                    setShowLoginModal(true);
+                    return;
+                }
                 throw new Error(`Error ${res.status}`);
+            }
             const json = (await res.json());
             const items = Array.isArray(json) ? json : (json.items ?? []);
             setOffers(items);
@@ -77,5 +89,5 @@ export function UserOffersPanel({ fetchEndpoint = "/api/user/offers", onAcceptCo
     function handleUpdate(id, patch) {
         setOffers((prev) => prev.map((o) => (o.id === id ? { ...o, ...patch } : o)));
     }
-    return (_jsxs(Div, { className: `space-y-4 ${className}`, children: [_jsxs(Div, { className: "flex items-center justify-between", children: [_jsx(Heading, { level: 2, className: "text-lg font-semibold text-zinc-900 dark:text-zinc-100", children: "My Offers" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: loadOffers, disabled: loading, className: "border border-zinc-300 dark:border-zinc-600 text-xs", children: loading ? "Refreshing…" : "Refresh" })] }), fetchError && _jsx(Alert, { variant: "error", children: _jsx(Text, { className: "text-sm", children: fetchError }) }), loading && (_jsx(Div, { className: "flex justify-center py-12", children: _jsx(Spinner, { size: "lg" }) })), !loading && offers.length === 0 && (_jsx(Div, { className: "text-center py-12", children: _jsx(Text, { className: "text-zinc-400 dark:text-zinc-500 text-sm", children: "No offers yet" }) })), !loading && offers.length > 0 && (_jsx(Div, { className: "space-y-3", children: offers.map((offer) => (_jsx(BuyerOfferCard, { offer: offer, onAcceptCounter: onAcceptCounter, onWithdraw: onWithdraw, onCheckout: onCheckout, onUpdate: handleUpdate }, offer.id))) }))] }));
+    return (_jsxs(Div, { className: `space-y-4 ${className}`, children: [_jsx(LoginRequiredModal, { isOpen: showLoginModal, onClose: () => setShowLoginModal(false), message: "You need to be signed in to manage your offers. Please log in or create an account to continue." }), _jsxs(Div, { className: "flex items-center justify-between", children: [_jsx(Heading, { level: 2, className: "text-lg font-semibold text-zinc-900 dark:text-zinc-100", children: "My Offers" }), _jsx(Button, { size: "sm", variant: "ghost", onClick: loadOffers, disabled: loading, className: "border border-zinc-300 dark:border-zinc-600 text-xs", children: loading ? "Refreshing…" : "Refresh" })] }), fetchError && _jsx(Alert, { variant: "error", children: _jsx(Text, { className: "text-sm", children: fetchError }) }), loading && (_jsx(Div, { className: "flex justify-center py-12", children: _jsx(Spinner, { size: "lg" }) })), !loading && offers.length === 0 && (_jsx(Div, { className: "text-center py-12", children: _jsx(Text, { className: "text-zinc-400 dark:text-zinc-500 text-sm", children: "No offers yet" }) })), !loading && offers.length > 0 && (_jsx(Div, { className: "space-y-3", children: offers.map((offer) => (_jsx(BuyerOfferCard, { offer: offer, onAcceptCounter: onAcceptCounter, onWithdraw: onWithdraw, onCheckout: onCheckout, onUpdate: handleUpdate, onNeedsLogin: () => setShowLoginModal(true) }, offer.id))) }))] }));
 }

package/dist/features/auctions/components/AuctionDetailPageView.js

@@ -137,8 +137,24 @@ export async function AuctionDetailPageView({ id, initialAuction, onPlaceBid, pr
                             }));
                             return _jsx(CollapsibleBidHistory, { bids: bids, currency: currency });
                         }, renderRelated: () => {
+                            const now = new Date();
                             const related = relatedDocs
-                                .filter((r) => r.id !== product.id && r.listingType === "auction")
+                                .filter((r) => {
+                                if (r.id === product.id || r.listingType !== "auction")
+                                    return false;
+                                const s = r.status;
+                                if (s && ["sold", "out_of_stock", "archived", "discontinued", "draft"].includes(s))
+                                    return false;
+                                if (r.isSold === true)
+                                    return false;
+                                const end = r.auctionEndDate;
+                                if (!end)
+                                    return true;
+                                const endDate = typeof end.toDate === "function"
+                                    ? end.toDate()
+                                    : end instanceof Date ? end : new Date(String(end));
+                                return endDate > now;
+                            })
                                 .slice(0, 4)
                                 .map((r) => ({
                                 id: String(r.id ?? ""),

package/dist/features/auctions/components/PlaceBidFormClient.js

@@ -2,13 +2,15 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState, useTransition } from "react";
 import { formatCurrency } from "../../../utils/number.formatter";
-import { Button, Div, Input, Row, Span, Stack, Text } from "../../../ui";
+import { isAuthError } from "../../../utils/auth-error";
+import { Button, Div, Input, LoginRequiredModal, Row, Span, Stack, Text } from "../../../ui";
 export function PlaceBidFormClient({ productId, currentBid, startingBid, minBidIncrement, currency, isEnded, buyNowPrice, bidCount, tags = [], onPlaceBid, }) {
     const minBid = currentBid + minBidIncrement;
     const [bidAmount, setBidAmount] = useState(String(minBid));
     const [isPending, startTransition] = useTransition();
     const [error, setError] = useState(null);
     const [success, setSuccess] = useState(false);
+    const [showLoginModal, setShowLoginModal] = useState(false);
     function handleSubmit(e) {
         e.preventDefault();
         const amount = Number(bidAmount);
@@ -33,11 +35,14 @@ export function PlaceBidFormClient({ productId, currentBid, startingBid, minBidI
                 setBidAmount(String(amount + minBidIncrement));
             }
             catch (err) {
-                setError(err instanceof Error && err.message
-                    ? err.message
-                    : "Failed to place bid. Please try again.");
+                if (isAuthError(err)) {
+                    setShowLoginModal(true);
+                }
+                else {
+                    setError(err instanceof Error ? err.message : "Failed to place bid. Please try again.");
+                }
             }
         });
     }
-    return (_jsxs(Div, { className: "rounded-xl border border-zinc-100 dark:border-zinc-800 bg-zinc-50 dark:bg-zinc-900/60 p-5 space-y-4", children: [_jsxs(Div, { className: "space-y-1", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsx(Text, { className: "text-xs text-zinc-500", children: "Current bid" }), _jsx(Text, { className: "text-xs text-zinc-500", children: "Starting bid" })] }), _jsxs(Row, { justify: "between", align: "baseline", children: [_jsx(Span, { className: "text-xl font-bold text-primary-600 dark:text-primary-400", children: formatCurrency(currentBid, currency) }), _jsx(Span, { className: "text-sm text-zinc-500", children: formatCurrency(startingBid, currency) })] }), _jsxs(Text, { className: "text-xs text-zinc-400 dark:text-zinc-500", children: [bidCount, " ", bidCount === 1 ? "bid" : "bids", " \u00B7 min increment", " ", formatCurrency(minBidIncrement, currency)] })] }), _jsx("form", { onSubmit: handleSubmit, children: _jsxs(Stack, { gap: "sm", children: [_jsx(Input, { type: "number", value: bidAmount, onChange: (e) => setBidAmount(e.target.value), placeholder: `At least ${formatCurrency(minBid, currency)}`, min: minBid, step: minBidIncrement, "aria-label": "Your bid amount", disabled: isEnded || isPending }), error && (_jsx(Text, { className: "text-xs text-red-600 dark:text-red-400", children: error })), success && (_jsx(Text, { className: "text-xs text-emerald-600 dark:text-emerald-400", children: "\u2713 Bid placed successfully!" })), _jsx(Button, { variant: "primary", size: "md", className: "w-full", disabled: isEnded || isPending, type: "submit", children: isPending ? "Placing Bid…" : isEnded ? "Auction Ended" : "Place Bid" }), buyNowPrice !== null && !isEnded && (_jsxs(Button, { variant: "secondary", size: "md", className: "w-full", type: "button", children: ["Buy Now \u2014 ", formatCurrency(buyNowPrice, currency)] }))] }) }), tags.length > 0 && (_jsx(Div, { className: "border-t border-zinc-200 dark:border-zinc-700 pt-4", children: _jsx(Row, { wrap: true, gap: "xs", children: tags.map((tag) => (_jsx(Span, { className: "rounded-full bg-zinc-100 dark:bg-zinc-800 px-2.5 py-1 text-xs text-zinc-600 dark:text-zinc-300", children: tag }, tag))) }) }))] }));
+    return (_jsxs(Div, { className: "rounded-xl border border-zinc-100 dark:border-zinc-800 bg-zinc-50 dark:bg-zinc-900/60 p-5 space-y-4", children: [_jsxs(Div, { className: "space-y-1", children: [_jsxs(Row, { justify: "between", align: "center", children: [_jsx(Text, { className: "text-xs text-zinc-500", children: "Current bid" }), _jsx(Text, { className: "text-xs text-zinc-500", children: "Starting bid" })] }), _jsxs(Row, { justify: "between", align: "baseline", children: [_jsx(Span, { className: "text-xl font-bold text-primary-600 dark:text-primary-400", children: formatCurrency(currentBid, currency) }), _jsx(Span, { className: "text-sm text-zinc-500", children: formatCurrency(startingBid, currency) })] }), _jsxs(Text, { className: "text-xs text-zinc-400 dark:text-zinc-500", children: [bidCount, " ", bidCount === 1 ? "bid" : "bids", " \u00B7 min increment", " ", formatCurrency(minBidIncrement, currency)] })] }), _jsx(LoginRequiredModal, { isOpen: showLoginModal, onClose: () => setShowLoginModal(false), message: "You need to be signed in to place a bid. Please log in or create an account to continue." }), _jsx("form", { onSubmit: handleSubmit, children: _jsxs(Stack, { gap: "sm", children: [_jsx(Input, { type: "number", value: bidAmount, onChange: (e) => setBidAmount(e.target.value), placeholder: `At least ${formatCurrency(minBid, currency)}`, min: minBid, step: minBidIncrement, "aria-label": "Your bid amount", disabled: isEnded || isPending }), error && (_jsx(Text, { className: "text-xs text-red-600 dark:text-red-400", children: error })), success && (_jsx(Text, { className: "text-xs text-emerald-600 dark:text-emerald-400", children: "\u2713 Bid placed successfully!" })), _jsx(Button, { variant: "primary", size: "md", className: "w-full", disabled: isEnded || isPending, type: "submit", children: isPending ? "Placing Bid…" : isEnded ? "Auction Ended" : "Place Bid" }), buyNowPrice !== null && !isEnded && (_jsxs(Button, { variant: "secondary", size: "md", className: "w-full", type: "button", children: ["Buy Now \u2014 ", formatCurrency(buyNowPrice, currency)] }))] }) }), tags.length > 0 && (_jsx(Div, { className: "border-t border-zinc-200 dark:border-zinc-700 pt-4", children: _jsx(Row, { wrap: true, gap: "xs", children: tags.map((tag) => (_jsx(Span, { className: "rounded-full bg-zinc-100 dark:bg-zinc-800 px-2.5 py-1 text-xs text-zinc-600 dark:text-zinc-300", children: tag }, tag))) }) }))] }));
 }

package/dist/features/blog/components/BlogIndexListing.js

@@ -14,6 +14,13 @@ export function BlogIndexListing({ initialData }) {
     const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: "-publishedAt" } });
     const [searchInput, setSearchInput] = useState(table.get("q") || "");
     const [filterOpen, setFilterOpen] = useState(false);
+    const [view, setView] = useState(table.get("view") || "grid");
+    const handleViewToggle = (next) => {
+        if (next === "table")
+            return;
+        setView(next);
+        table.set("view", next);
+    };
     // Pending filter state — buffered until "Apply Filters" clicked
     const [pendingFilters, setPendingFilters] = useState(() => Object.fromEntries(FILTER_KEYS.map((k) => [k, table.get(k)])));
     const pendingTable = useMemo(() => ({
@@ -78,5 +85,5 @@ export function BlogIndexListing({ initialData }) {
     const commitSearch = useCallback(() => {
         table.set("q", searchInput.trim());
     }, [searchInput, table]);
-    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search posts...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || "-publishedAt", sortOptions: BLOG_PUBLIC_SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); }, hideViewToggle: true, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx("div", { className: "py-6", children: isLoading ? (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-video bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-5 space-y-2", children: [_jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-1/4" }), _jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-full" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-2/3" })] })] }, i))) })) : posts.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: "No posts found." })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: posts.map((post) => (_jsx(BlogCard, { post: post, href: String(ROUTES.BLOG.ARTICLE(post.slug)) }, post.id))) })) }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(BlogFilters, { table: pendingTable, variant: "public" }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search posts...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || "-publishedAt", sortOptions: BLOG_PUBLIC_SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); }, view: view, onViewChange: handleViewToggle, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx("div", { className: "py-6", children: isLoading ? (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-video bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-5 space-y-2", children: [_jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-1/4" }), _jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-full" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-2/3" })] })] }, i))) })) : posts.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: "No posts found." })) : view === "list" ? (_jsx("div", { className: "flex flex-col divide-y divide-zinc-100 dark:divide-zinc-800 rounded-xl border border-zinc-100 dark:border-zinc-800", children: posts.map((post) => (_jsx(BlogCard, { post: post, href: String(ROUTES.BLOG.ARTICLE(post.slug)) }, post.id))) })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: posts.map((post) => (_jsx(BlogCard, { post: post, href: String(ROUTES.BLOG.ARTICLE(post.slug)) }, post.id))) })) }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(BlogFilters, { table: pendingTable, variant: "public" }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
 }

package/dist/features/categories/components/BundleBuyNowCta.js

@@ -1,5 +1,5 @@
 "use client";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 /**
  * BundleBuyNowCta — direct-checkout CTA for bundle detail pages.
  *
@@ -8,13 +8,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * No qty input — bundles are always qty=1 per checkout.
  */
 import { useState, useCallback } from "react";
-import { Button, Stack, Text } from "../../../ui";
+import { Button, LoginRequiredModal, Stack, Text } from "../../../ui";
 import { useToast } from "../../../ui";
+import { isAuthError } from "../../../utils/auth-error";
 import { BUNDLE_COPY } from "../../../_internal/shared/features/categories/bundle-copy";
 export function BundleBuyNowCta({ bundleSlug, outOfStock = false, onBuyNow, }) {
     const { showToast } = useToast();
     const [submitting, setSubmitting] = useState(false);
     const [error, setError] = useState(null);
+    const [showLoginModal, setShowLoginModal] = useState(false);
     const handleClick = useCallback(async () => {
         setError(null);
         setSubmitting(true);
@@ -22,9 +24,14 @@ export function BundleBuyNowCta({ bundleSlug, outOfStock = false, onBuyNow, }) {
             await onBuyNow({ bundleSlug });
         }
         catch (err) {
-            const message = err instanceof Error ? err.message : BUNDLE_COPY.detail.ctaErrorFallback;
-            setError(message);
-            showToast(message, "error");
+            if (isAuthError(err)) {
+                setShowLoginModal(true);
+            }
+            else {
+                const message = err instanceof Error ? err.message : BUNDLE_COPY.detail.ctaErrorFallback;
+                setError(message);
+                showToast(message, "error");
+            }
         }
         finally {
             setSubmitting(false);
@@ -33,5 +40,5 @@ export function BundleBuyNowCta({ bundleSlug, outOfStock = false, onBuyNow, }) {
     if (outOfStock) {
         return (_jsxs(Stack, { gap: "xs", "aria-live": "polite", children: [_jsx(Button, { variant: "primary", disabled: true, "aria-disabled": true, children: BUNDLE_COPY.detail.ctaOutOfStock }), _jsx(Text, { size: "xs", color: "muted", children: BUNDLE_COPY.detail.ctaHint })] }));
     }
-    return (_jsxs(Stack, { gap: "sm", children: [_jsx(Button, { variant: "primary", onClick: handleClick, disabled: submitting, "aria-busy": submitting, children: submitting ? BUNDLE_COPY.detail.ctaAdding : BUNDLE_COPY.detail.ctaBuyNow }), error && (_jsx(Text, { size: "sm", color: "danger", role: "alert", children: error }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(LoginRequiredModal, { isOpen: showLoginModal, onClose: () => setShowLoginModal(false), message: "You need to be signed in to purchase this bundle. Please log in or create an account to continue." }), _jsxs(Stack, { gap: "sm", children: [_jsx(Button, { variant: "primary", onClick: handleClick, disabled: submitting, "aria-busy": submitting, children: submitting ? BUNDLE_COPY.detail.ctaAdding : BUNDLE_COPY.detail.ctaBuyNow }), error && (_jsx(Text, { size: "sm", color: "danger", role: "alert", children: error }))] })] }));
 }

package/dist/features/categories/components/CategoriesIndexListing.js

@@ -19,6 +19,13 @@ export function CategoriesIndexListing({ initialData: _, brandsOnly = false }) {
     const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: "name" } });
     const [searchInput, setSearchInput] = useState(table.get("q") || "");
     const [filterOpen, setFilterOpen] = useState(false);
+    const [view, setView] = useState(table.get("view") || "grid");
+    const handleViewToggle = (next) => {
+        if (next === "table")
+            return;
+        setView(next);
+        table.set("view", next);
+    };
     const sort = table.get("sort") || "name";
     const page = table.getNumber("page", 1);
     // Pending filter state — buffered until "Apply Filters" clicked
@@ -112,9 +119,9 @@ export function CategoriesIndexListing({ initialData: _, brandsOnly = false }) {
                         activeTab === tab.key
                             ? "border-primary text-primary dark:text-primary-400 dark:border-primary-400"
                             : "border-transparent text-zinc-500 hover:text-zinc-800 dark:text-zinc-400 dark:hover:text-zinc-200",
-                    ].join(" "), children: tab.label }, tab.key))) })), _jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: activeTab === "brands" || brandsOnly ? "Search brands..." : "Search categories...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: sort, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); }, hideViewToggle: true, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: page, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx("div", { className: "py-6", children: isLoading ? (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4", children: Array.from({ length: 10 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-[4/3] bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-3.5 space-y-2", children: [_jsx("div", { className: "h-3.5 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-full" })] })] }, i))) })) : categories.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: activeSearch
+                    ].join(" "), children: tab.label }, tab.key))) })), _jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: activeTab === "brands" || brandsOnly ? "Search brands..." : "Search categories...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: sort, sortOptions: SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); }, view: view, onViewChange: handleViewToggle, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: page, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx("div", { className: "py-6", children: isLoading ? (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4", children: Array.from({ length: 10 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-[4/3] bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-3.5 space-y-2", children: [_jsx("div", { className: "h-3.5 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-full" })] })] }, i))) })) : categories.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: activeSearch
                         ? `No ${activeTab === "brands" || brandsOnly ? "brands" : "categories"} matching "${activeSearch}"`
                         : activeTab === "brands" || brandsOnly
                             ? "No brands found"
-                            : "No categories found" })) : (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4", children: categories.map((category) => (_jsx(CategoryCard, { category: category, href: String(ROUTES.PUBLIC.CATEGORY_DETAIL(category.slug)) }, category.id))) })) }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(CategoryFilters, { table: pendingTable, variant: "public" }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
+                            : "No categories found" })) : view === "list" ? (_jsx("div", { className: "flex flex-col divide-y divide-zinc-100 dark:divide-zinc-800 rounded-xl border border-zinc-100 dark:border-zinc-800", children: categories.map((category) => (_jsx(CategoryCard, { category: category, href: String(ROUTES.PUBLIC.CATEGORY_DETAIL(category.slug)) }, category.id))) })) : (_jsx("div", { className: "grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-4", children: categories.map((category) => (_jsx(CategoryCard, { category: category, href: String(ROUTES.PUBLIC.CATEGORY_DETAIL(category.slug)) }, category.id))) })) }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(CategoryFilters, { table: pendingTable, variant: "public" }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
 }

package/dist/features/events/components/EventPollWidget.js

@@ -3,6 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from "react";
 import { useAuth } from "../../../react/contexts/SessionContext";
 import { ROUTES } from "../../../next";
+import { LoginRequiredModal } from "../../../ui";
 export function EventPollWidget({ eventId, pollConfig, eventStatus, totalEntries, entriesEndpoint, className = "", }) {
     const { user } = useAuth();
     const endpoint = entriesEndpoint ?? `/api/events/${eventId}/entries`;
@@ -13,6 +14,7 @@ export function EventPollWidget({ eventId, pollConfig, eventStatus, totalEntries
     const [isLoading, setIsLoading] = useState(false);
     const [isSubmitted, setIsSubmitted] = useState(false);
     const [error, setError] = useState(null);
+    const [showLoginModal, setShowLoginModal] = useState(false);
     const toggleVote = (id) => {
         if (isMulti) {
             setSelectedVotes((prev) => prev.includes(id) ? prev.filter((v) => v !== id) : [...prev, id]);
@@ -37,6 +39,10 @@ export function EventPollWidget({ eventId, pollConfig, eventStatus, totalEntries
                 credentials: "include",
             });
             if (!res.ok) {
+                if (res.status === 401 || res.status === 403) {
+                    setShowLoginModal(true);
+                    return;
+                }
                 const data = (await res.json().catch(() => ({})));
                 throw new Error(data.error ?? "Failed to submit vote");
             }
@@ -58,5 +64,5 @@ export function EventPollWidget({ eventId, pollConfig, eventStatus, totalEntries
     if (isSubmitted) {
         return (_jsxs("div", { className: `rounded-xl border border-green-200 dark:border-green-800 bg-green-50 dark:bg-green-900/20 px-6 py-8 text-center space-y-2 ${className}`, "data-section": "eventpollwidget-div-5", children: [_jsx("p", { className: "font-semibold text-green-700 dark:text-green-300", children: "Vote recorded!" }), _jsx("p", { className: "text-sm text-zinc-500 dark:text-zinc-400", children: "Thanks for participating." })] }));
     }
-    return (_jsxs("div", { className: `space-y-4 ${className}`, "data-section": "eventpollwidget-div-6", children: [_jsx("p", { className: "text-sm font-medium text-zinc-700 dark:text-zinc-200", children: isMulti ? "Select all that apply:" : "Choose one:" }), _jsx("div", { className: "space-y-2", "data-section": "eventpollwidget-div-7", children: pollConfig.options.map((opt) => (_jsxs("label", { className: "flex items-center gap-3 cursor-pointer rounded-lg border border-zinc-200 dark:border-zinc-700 px-4 py-3 hover:bg-zinc-50 dark:hover:bg-zinc-800 transition-colors", children: [_jsx("input", { type: isMulti ? "checkbox" : "radio", name: `poll-${eventId}`, value: opt.id, checked: selectedVotes.includes(opt.id), onChange: () => toggleVote(opt.id), className: "accent-primary" }), _jsx("span", { className: "text-sm text-zinc-700 dark:text-zinc-300", children: opt.label })] }, opt.id))) }), pollConfig.allowComment && (_jsx("textarea", { value: comment, onChange: (e) => setComment(e.target.value), placeholder: "Add a comment (optional)", rows: 3, className: "w-full rounded-lg border border-zinc-200 dark:border-zinc-700 bg-white dark:bg-zinc-800 px-3 py-2 text-sm text-zinc-800 dark:text-zinc-200 placeholder:text-zinc-400 focus:outline-none focus:ring-2 focus:ring-primary" })), error && _jsx("p", { className: "text-sm text-red-500", children: error }), _jsx("button", { type: "button", onClick: handleSubmit, disabled: isLoading || selectedVotes.length === 0, className: "w-full rounded-xl bg-primary px-6 py-3 text-sm font-semibold text-white hover:bg-primary-600 disabled:opacity-60", children: isLoading ? "Submitting…" : "Submit Vote" })] }));
+    return (_jsxs("div", { className: `space-y-4 ${className}`, "data-section": "eventpollwidget-div-6", children: [_jsx(LoginRequiredModal, { isOpen: showLoginModal, onClose: () => setShowLoginModal(false), message: "You need to be signed in to vote in this poll. Please log in or create an account to continue." }), _jsx("p", { className: "text-sm font-medium text-zinc-700 dark:text-zinc-200", children: isMulti ? "Select all that apply:" : "Choose one:" }), _jsx("div", { className: "space-y-2", "data-section": "eventpollwidget-div-7", children: pollConfig.options.map((opt) => (_jsxs("label", { className: "flex items-center gap-3 cursor-pointer rounded-lg border border-zinc-200 dark:border-zinc-700 px-4 py-3 hover:bg-zinc-50 dark:hover:bg-zinc-800 transition-colors", children: [_jsx("input", { type: isMulti ? "checkbox" : "radio", name: `poll-${eventId}`, value: opt.id, checked: selectedVotes.includes(opt.id), onChange: () => toggleVote(opt.id), className: "accent-primary" }), _jsx("span", { className: "text-sm text-zinc-700 dark:text-zinc-300", children: opt.label })] }, opt.id))) }), pollConfig.allowComment && (_jsx("textarea", { value: comment, onChange: (e) => setComment(e.target.value), placeholder: "Add a comment (optional)", rows: 3, className: "w-full rounded-lg border border-zinc-200 dark:border-zinc-700 bg-white dark:bg-zinc-800 px-3 py-2 text-sm text-zinc-800 dark:text-zinc-200 placeholder:text-zinc-400 focus:outline-none focus:ring-2 focus:ring-primary" })), error && _jsx("p", { className: "text-sm text-red-500", children: error }), _jsx("button", { type: "button", onClick: handleSubmit, disabled: isLoading || selectedVotes.length === 0, className: "w-full rounded-xl bg-primary px-6 py-3 text-sm font-semibold text-white hover:bg-primary-600 disabled:opacity-60", children: isLoading ? "Submitting…" : "Submit Vote" })] }));
 }

package/dist/features/events/components/EventsIndexListing.js

@@ -13,6 +13,13 @@ export function EventsIndexListing({ initialData }) {
     const table = useUrlTable({ defaults: { pageSize: String(PAGE_SIZE), sort: "startsAt" } });
     const [searchInput, setSearchInput] = useState(table.get("q") || "");
     const [filterOpen, setFilterOpen] = useState(false);
+    const [view, setView] = useState(table.get("view") || "grid");
+    const handleViewToggle = (next) => {
+        if (next === "table")
+            return;
+        setView(next);
+        table.set("view", next);
+    };
     // Pending filter state — buffered until "Apply Filters" clicked
     const [pendingFilters, setPendingFilters] = useState(() => Object.fromEntries(FILTER_KEYS.map((k) => [k, table.get(k)])));
     const pendingTable = useMemo(() => ({
@@ -101,5 +108,5 @@ export function EventsIndexListing({ initialData }) {
     const commitSearch = useCallback(() => {
         table.set("q", searchInput.trim());
     }, [searchInput, table]);
-    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search events...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || "startsAt", sortOptions: EVENT_PUBLIC_SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); }, hideViewToggle: true, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx("div", { className: "py-6", children: isLoading ? (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-video bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-4 space-y-2", children: [_jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-full" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-2/3" }), _jsx("div", { className: "h-8 bg-zinc-200 dark:bg-slate-700 rounded mt-2" })] })] }, i))) })) : events.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: "No events found." })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: events.map((event) => (_jsx(EventCard, { event: event }, event.id))) })) }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(EventFilters, { table: pendingTable, variant: "public" }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
+    return (_jsxs("div", { className: "min-h-screen", children: [_jsx(ListingToolbar, { filterCount: activeFilterCount, onFiltersClick: openFilters, searchValue: searchInput, searchPlaceholder: "Search events...", onSearchChange: setSearchInput, onSearchCommit: commitSearch, sortValue: table.get("sort") || "startsAt", sortOptions: EVENT_PUBLIC_SORT_OPTIONS, onSortChange: (v) => { table.set("sort", v); }, view: view, onViewChange: handleViewToggle, onResetAll: resetAll, hasActiveState: hasActiveState }), totalPages > 1 && (_jsx("div", { className: "sticky top-[calc(var(--header-height,0px)+44px)] z-10 flex justify-center bg-white/95 dark:bg-slate-900/95 backdrop-blur-sm border-b border-zinc-200 dark:border-slate-700 px-3 py-1.5", children: _jsx(Pagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (p) => table.setPage(p) }) })), _jsx("div", { className: "py-6", children: isLoading ? (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: Array.from({ length: 6 }).map((_, i) => (_jsxs("div", { className: "rounded-xl border border-zinc-100 dark:border-slate-700 overflow-hidden animate-pulse", children: [_jsx("div", { className: "aspect-video bg-zinc-200 dark:bg-slate-700" }), _jsxs("div", { className: "p-4 space-y-2", children: [_jsx("div", { className: "h-4 bg-zinc-200 dark:bg-slate-700 rounded w-3/4" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-full" }), _jsx("div", { className: "h-3 bg-zinc-200 dark:bg-slate-700 rounded w-2/3" }), _jsx("div", { className: "h-8 bg-zinc-200 dark:bg-slate-700 rounded mt-2" })] })] }, i))) })) : events.length === 0 ? (_jsx("p", { className: "py-12 text-center text-sm text-zinc-500 dark:text-zinc-400", children: "No events found." })) : view === "list" ? (_jsx("div", { className: "flex flex-col divide-y divide-zinc-100 dark:divide-zinc-800 rounded-xl border border-zinc-100 dark:border-zinc-800", children: events.map((event) => (_jsx(EventCard, { event: event }, event.id))) })) : (_jsx("div", { className: "grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6", children: events.map((event) => (_jsx(EventCard, { event: event }, event.id))) })) }), filterOpen && (_jsxs(_Fragment, { children: [_jsx("div", { className: "fixed inset-0 z-40 bg-black/40", "aria-hidden": "true", onClick: () => setFilterOpen(false) }), _jsxs("div", { className: "fixed inset-y-0 left-0 z-50 flex w-80 flex-col bg-white dark:bg-slate-900 shadow-2xl", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: [_jsx("span", { className: "flex items-center gap-2 text-base font-semibold text-zinc-900 dark:text-zinc-100", children: "Filters" }), _jsxs("div", { className: "flex items-center gap-2", children: [activeFilterCount > 0 && (_jsx("button", { type: "button", onClick: clearFilters, className: "text-xs text-zinc-500 hover:text-rose-500 dark:text-zinc-400 transition-colors", children: "Clear all" })), _jsx("button", { type: "button", onClick: () => setFilterOpen(false), "aria-label": "Close filters", className: "rounded-lg p-1.5 text-zinc-500 hover:bg-zinc-100 dark:hover:bg-slate-800 transition-colors", children: _jsx(X, { className: "h-5 w-5" }) })] })] }), _jsx("div", { className: "flex-1 overflow-y-auto px-4 py-4", children: _jsx(EventFilters, { table: pendingTable, variant: "public" }) }), _jsx("div", { className: "border-t border-zinc-200 dark:border-slate-700 px-4 py-3.5", children: _jsxs("button", { type: "button", onClick: applyFilters, className: "w-full rounded-lg bg-primary py-2.5 text-sm font-semibold text-white hover:bg-primary-600 transition-colors active:scale-[0.98]", children: ["Apply Filters", activeFilterCount > 0 ? ` (${activeFilterCount})` : ""] }) })] })] }))] }));
 }

package/dist/features/events/components/SpinWheelView.js

@@ -1,7 +1,8 @@
 "use client";
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo, useState } from "react";
-import { Button, Div, Heading, Span, Text } from "../../../ui";
+import { Button, Div, Heading, LoginRequiredModal, Span, Text } from "../../../ui";
+import { isAuthError } from "../../../utils/auth-error";
 const DEFAULT_LABELS = {
     heading: "Spin the Wheel",
     spinButton: "Spin",
@@ -20,6 +21,7 @@ export function SpinWheelView({ eventId, prizes, alreadyUsed, initialPrizeId, in
     const [resultPrizeId, setResultPrizeId] = useState(initialPrizeId);
     const [resultCoupon, setResultCoupon] = useState(initialCouponCode);
     const [error, setError] = useState(null);
+    const [showLoginModal, setShowLoginModal] = useState(false);
     const now = Date.now();
     const startMs = windowStart ? new Date(windowStart).getTime() : null;
     const endMs = windowEnd ? new Date(windowEnd).getTime() : null;
@@ -43,15 +45,20 @@ export function SpinWheelView({ eventId, prizes, alreadyUsed, initialPrizeId, in
                 }
             }, ANIMATION_MS);
         }
-        catch {
+        catch (err) {
             setSpinning(false);
-            setError(l.errorFallback);
+            if (isAuthError(err)) {
+                setShowLoginModal(true);
+            }
+            else {
+                setError(l.errorFallback);
+            }
         }
     }, [disabled, eventId, l.errorFallback, onSpin]);
     const wonPrize = resultPrizeId
         ? activePrizes.find((p) => p.id === resultPrizeId)
         : undefined;
-    return (_jsxs(Div, { className: "space-y-4", children: [_jsxs(Heading, { level: 2, className: "text-xl font-semibold text-zinc-900 dark:text-zinc-100", children: ["\uD83C\uDFA1 ", l.heading] }), _jsxs(Div, { className: "relative mx-auto aspect-square w-64 overflow-hidden rounded-full border-4 border-amber-400 bg-gradient-to-br from-amber-100 via-rose-100 to-violet-100 dark:from-amber-900/40 dark:via-rose-900/40 dark:to-violet-900/40", "aria-label": "Spin wheel", children: [_jsx(Div, { className: "absolute inset-0 flex items-center justify-center", style: {
+    return (_jsxs(Div, { className: "space-y-4", children: [_jsx(LoginRequiredModal, { isOpen: showLoginModal, onClose: () => setShowLoginModal(false), message: "You need to be signed in to spin the wheel. Please log in or create an account to continue." }), _jsxs(Heading, { level: 2, className: "text-xl font-semibold text-zinc-900 dark:text-zinc-100", children: ["\uD83C\uDFA1 ", l.heading] }), _jsxs(Div, { className: "relative mx-auto aspect-square w-64 overflow-hidden rounded-full border-4 border-amber-400 bg-gradient-to-br from-amber-100 via-rose-100 to-violet-100 dark:from-amber-900/40 dark:via-rose-900/40 dark:to-violet-900/40", "aria-label": "Spin wheel", children: [_jsx(Div, { className: "absolute inset-0 flex items-center justify-center", style: {
                             animation: spinning
                                 ? `lir-spin ${ANIMATION_MS}ms cubic-bezier(0.2, 0.8, 0.2, 1)`
                                 : undefined,