@mohasinac/appkit 3.6.2 → 3.6.4

package/dist/configs/tailwind.d.ts

@@ -3,10 +3,20 @@
  *
  * appkit ships pre-compiled dist/tailwind-utilities.css covering every class
  * appkit components emit. The consumer's Tailwind config does NOT need to scan
- * node_modules/@mohasinac/appkit/** and does NOT need a safelist.
+ * node_modules/@mohasinac/appkit/**.
  *
  * Consumer must provide `content` globs for their own source files.
  *
+ * Loaded via a Tailwind v4 `@config "./tailwind.config.js";` directive in the
+ * consumer's CSS entry point — v4's config-compat bridge still honors
+ * `content`/`theme`/`plugins`/`darkMode` from a JS config exactly like v3 did.
+ *
+ * NOTE (Tailwind v4 migration, 2026-08-16): `safelist` is NOT supported by the
+ * v4 `@config` compat bridge. Any safelist classes must live in the consumer's
+ * CSS entry point via `@source inline("...")` instead — see src/app/globals.css.
+ * Do not add a `safelist` key back to this factory's override shape; it would
+ * silently no-op under v4.
+ *
  * @example
  * ```js
  * // tailwind.config.js
@@ -20,13 +30,11 @@ export interface TailwindConfigOverride {
     content?: string[];
     theme?: Record<string, unknown>;
     plugins?: unknown[];
-    safelist?: unknown[];
     [key: string]: unknown;
 }
 export declare function defineTailwindConfig(override?: TailwindConfigOverride): {
     darkMode: "class";
     content: string[];
-    safelist: unknown[];
     theme: {
         extend: {
             colors: {

package/dist/configs/tailwind.js

@@ -3,10 +3,20 @@
  *
  * appkit ships pre-compiled dist/tailwind-utilities.css covering every class
  * appkit components emit. The consumer's Tailwind config does NOT need to scan
- * node_modules/@mohasinac/appkit/** and does NOT need a safelist.
+ * node_modules/@mohasinac/appkit/**.
  *
  * Consumer must provide `content` globs for their own source files.
  *
+ * Loaded via a Tailwind v4 `@config "./tailwind.config.js";` directive in the
+ * consumer's CSS entry point — v4's config-compat bridge still honors
+ * `content`/`theme`/`plugins`/`darkMode` from a JS config exactly like v3 did.
+ *
+ * NOTE (Tailwind v4 migration, 2026-08-16): `safelist` is NOT supported by the
+ * v4 `@config` compat bridge. Any safelist classes must live in the consumer's
+ * CSS entry point via `@source inline("...")` instead — see src/app/globals.css.
+ * Do not add a `safelist` key back to this factory's override shape; it would
+ * silently no-op under v4.
+ *
  * @example
  * ```js
  * // tailwind.config.js
@@ -17,11 +27,10 @@
  * ```
  */
 export function defineTailwindConfig(override = {}) {
-    const { content: consumerContent = [], theme: consumerTheme = {}, plugins: consumerPlugins = [], safelist: consumerSafelist = [], ...rest } = override;
+    const { content: consumerContent = [], theme: consumerTheme = {}, plugins: consumerPlugins = [], ...rest } = override;
     return {
         darkMode: "class",
         content: [...consumerContent],
-        safelist: [...consumerSafelist],
         theme: {
             extend: {
                 colors: {

package/dist/features/homepage/components/HeroCarousel.js

@@ -185,7 +185,7 @@ export function HeroCarousel({ initialSlides, push } = {}) {
     return (_jsxs(Section, { ref: sectionRef, className: `relative w-full ${heightClass} overflow-hidden`, "aria-roledescription": "carousel", "aria-label": "Hero carousel", onKeyDown: handleKeyDown, onMouseEnter: () => setIsPaused(true), onMouseLeave: () => setIsPaused(false), onFocus: () => setIsPaused(true), onBlur: () => setIsPaused(false), tabIndex: 0, children: [_jsx(Div, { "aria-live": "polite", "aria-atomic": "true", className: "sr-only", children: `Slide ${currentSlide + 1} of ${slides.length}` }), _jsx(Div, { className: POSITION_FILL, children: _jsx(Div, { layout: "flex", ref: slidesRef, onScroll: handleSlidesScroll, className: "h-full overflow-x-auto scroll-smooth snap-x snap-mandatory [scrollbar-width:none] [&::-webkit-scrollbar]:hidden", style: { gap: 0 }, children: slides.map((slide, slideIndex) => {
                         const slideHeightClass = getSlideHeightClass(slide.settings?.height);
                         const hasCards = slide.cards && slide.cards.length > 0;
-                        return (_jsxs(Div, { className: `snap-start flex-none w-full relative self-stretch bg-neutral-900 ${slideHeightClass}`, children: [_jsx(Div, { className: POSITION_FILL, children: _jsx(SlideBackground, { bg: slide.background, legacy: slide.media, mobileLegacy: slide.mobileMedia, isMobile: isMobile, priority: slideIndex === 0 }) }), slide.overlay && (_jsxs(Div, { layout: "flex-col", align: "start", justify: "center", className: `${POSITION_FILL} text-left md:px-[4rem] lg:px-[8rem]`, padding: "x-lg", children: [slide.overlay.subtitle && (_jsx(Text, { color: "inverse", shadow: "sm", className: "stagger-1 !/80 mb-1 md:mb-2 tracking-widest", mdSize: "sm", size: "xs", transform: "uppercase", children: slide.overlay.subtitle })), slide.overlay.title && (_jsx(Heading, { color: "inverse", level: 1, className: "stagger-2 font-display ! mb-2 md:mb-4", size: "4xl", shadow: "2xl", mdSize: "6xl", lgSize: "8xl", children: slide.overlay.title })), slide.overlay.description && (_jsx(Text, { color: "inverse", shadow: "sm", className: "stagger-3 !/90 mb-4 md:mb-8 max-w-2xl", mdSize: "lg", lgSize: "xl", size: "sm", children: slide.overlay.description })), slide.overlay.button && (_jsx(Div, { className: "stagger-4", children: _jsx(Button, { variant: slide.overlay.button.variant, size: "sm", onClick: makeButtonClickHandler(slide.overlay.button.link, slide.overlay.button.openInNewTab, push), children: slide.overlay.button.text }) }))] })), hasCards && (_jsx(Div, { className: `${POSITION_FILL} grid gap-[var(--appkit-space-2)] md:gap-[var(--appkit-space-4)] md:p-[var(--appkit-space-8)]`, padding: "md", style: {
+                        return (_jsxs(Div, { className: `snap-start flex-none w-full relative self-stretch bg-neutral-900 ${slideHeightClass}`, children: [_jsx(Div, { className: POSITION_FILL, children: _jsx(SlideBackground, { bg: slide.background, legacy: slide.media, mobileLegacy: slide.mobileMedia, isMobile: isMobile, priority: slideIndex === 0 }) }), slide.overlay && (_jsxs(Div, { layout: "flex-col", align: "start", justify: "center", className: `${POSITION_FILL} text-left md:px-[4rem] lg:px-[8rem]`, padding: "x-lg", children: [slide.overlay.subtitle && (_jsx(Text, { color: "inverse", shadow: "sm", className: "stagger-1 !/80 mb-1 md:mb-2 tracking-widest", mdSize: "sm", size: "xs", transform: "uppercase", children: slide.overlay.subtitle })), slide.overlay.title && (_jsx(Heading, { color: "inverse", level: 1, className: "stagger-2 font-display ! mb-2 md:mb-4 break-words", size: "4xl", shadow: "2xl", mdSize: "6xl", lgSize: "8xl", children: slide.overlay.title })), slide.overlay.description && (_jsx(Text, { color: "inverse", shadow: "sm", className: "stagger-3 !/90 mb-4 md:mb-8 max-w-2xl", mdSize: "lg", lgSize: "xl", size: "sm", children: slide.overlay.description })), slide.overlay.button && (_jsx(Div, { className: "stagger-4", children: _jsx(Button, { variant: slide.overlay.button.variant, size: "sm", onClick: makeButtonClickHandler(slide.overlay.button.link, slide.overlay.button.openInNewTab, push), children: slide.overlay.button.text }) }))] })), hasCards && (_jsx(Div, { className: `${POSITION_FILL} grid gap-[var(--appkit-space-2)] md:gap-[var(--appkit-space-4)] md:p-[var(--appkit-space-8)]`, padding: "md", style: {
                                         gridTemplateRows: "repeat(2, 1fr)",
                                         gridTemplateColumns: isMobile ? "1fr" : "repeat(3, 1fr)",
                                         alignContent: "center",

package/dist/features/homepage/components/WelcomeSection.js

@@ -9,5 +9,5 @@ export function WelcomeSection({ title, subtitle, pillLabel, showCTA = true, cta
     if (isLoading) {
         return (_jsx(Section, { className: `relative overflow-hidden md:py-[6rem] ${className}`, paddingY: "y-4xl", paddingX: "x-md", children: _jsxs(Div, { className: "animate-pulse max-w-4xl mx-auto text-left", children: [_jsx(Div, { className: "h-6 w-52 mb-6", surface: "subtle", rounded: "full" }), _jsx(Div, { className: "h-20 mb-4 max-w-2xl", surface: "subtle", rounded: "lg" }), _jsx(Div, { className: "h-6 mb-8 max-w-lg", surface: "subtle", rounded: "lg" }), _jsxs(Row, { justify: "start", gap: "md", children: [_jsx(Div, { className: "h-12 w-36", surface: "subtle", rounded: "xl" }), _jsx(Div, { className: "h-12 w-36", surface: "subtle", rounded: "xl" })] })] }) }));
     }
-    return (_jsxs(Section, { className: `relative overflow-hidden md:py-[7rem] ${className}`, paddingY: "y-5xl", paddingX: "x-md", children: [_jsx(Div, { className: "pointer-events-none absolute -top-32 -left-32 w-[28rem] h-[28rem] bg-primary/10 blur-3xl", rounded: "full", "aria-hidden": "true" }), _jsx(Div, { className: "pointer-events-none absolute -bottom-40 -right-40 w-[36rem] h-[36rem] bg-secondary/10 dark:bg-secondary/15 blur-3xl", rounded: "full", "aria-hidden": "true" }), _jsx(Div, { className: "relative z-10 max-w-7xl mx-auto", children: _jsxs(Grid, { align: "center", gap: "2xl", className: "grid-cols-1 lg:grid-cols-2 xl:grid-cols-2 2xl:grid-cols-2", children: [_jsxs(Div, { className: "text-left", children: [pillLabel && (_jsx(Div, { children: _jsxs(Span, { layout: "inline-flex", gap: "md", size: "xs", weight: "medium", className: "border border-primary-[500]/30 bg-primary-500/10 px-[1.25rem] py-[0.375rem] tracking-[0.2em] text-primary-700 dark:text-primary-400 backdrop-blur-sm", rounded: "full", transform: "uppercase", children: [_jsx(Span, { className: "w-1.5 h-1.5 bg-primary-500 inline-block", rounded: "full", "aria-hidden": "true" }), pillLabel, _jsx(Span, { className: "w-1.5 h-1.5 bg-primary-500 inline-block", rounded: "full", "aria-hidden": "true" })] }) })), _jsx(Heading, { level: 1, variant: "none", gradient: "brand-tri", className: "mt-4 font-display leading-[1.1] tracking-tight", size: "5xl", mdSize: "6xl", lgSize: "7xl", xlSize: "8xl", children: title }), subtitle && (_jsx(Text, { className: `mt-4 ${themed.textSecondary} max-w-xl leading-relaxed`, size: "xl", children: subtitle })), showCTA && (_jsxs(Row, { wrap: true, gap: "md", className: "mt-8", justify: "start", children: [ctaHref ? (_jsx(TextLink, { rounded: "xl", href: ctaHref, className: "inline-flex items-[center] justify-[center] px-[2rem] py-[0.875rem] !bg-primary hover:!bg-primary-600 text-white dark:!bg-primary dark:hover:!bg-primary-600 dark:text-white btn-glow transition-all hover:scale-[1.02]", size: "base", weight: "bold", children: ctaLabel })) : (_jsx(Button, { variant: "primary", size: "lg", onClick: onCtaClick, children: ctaLabel })), secondaryCtaHref ? (_jsx(TextLink, { rounded: "xl", href: secondaryCtaHref, className: "inline-flex items-[center] justify-[center] border-2 border-cobalt/40 dark:border-cobalt-400/40 px-[2rem] py-[0.875rem] text-cobalt-700 dark:text-cobalt-300 hover:bg-cobalt-50 dark:hover:bg-cobalt-900/20 transition-all hover:scale-[1.02]", size: "base", weight: "semibold", children: secondaryCtaLabel })) : (_jsx(Button, { variant: "outline", size: "lg", onClick: onSecondaryCtaClick, children: secondaryCtaLabel }))] })), trustChips.length > 0 && (_jsx(Row, { wrap: true, gap: "sm", className: "mt-6", justify: "start", children: trustChips.map((chip) => (_jsxs(Span, { layout: "inline-flex", gap: "xs", size: "xs", weight: "medium", className: "border border-zinc-[200] dark:border-slate-[700] px-[0.875rem] py-[0.375rem]", rounded: "full", surface: "subtle", color: "muted", children: [chip.emoji, " ", chip.label] }, chip.key))) }))] }), _jsx(Div, { className: "hidden lg:block", children: _jsxs(Div, { className: `relative overflow-hidden aspect-[4/3] bg-[image:var(--appkit-gradient-section-mesh)]`, shadow: "2xl", border: "default", rounded: "3xl", children: [_jsx(Div, { className: "absolute inset-0 bg-[image:var(--appkit-gradient-glass)]" }), _jsx(Row, { centered: true, className: `absolute inset-0 ${flex.center} px-[2.5rem]`, children: _jsx(SiteLogo, { title: brandLogoText || "LetItRip.in", size: "hero" }) })] }) })] }) })] }));
+    return (_jsxs(Section, { className: `relative overflow-hidden md:py-[7rem] ${className}`, paddingY: "y-5xl", paddingX: "x-md", children: [_jsx(Div, { className: "pointer-events-none absolute -top-32 -left-32 w-[28rem] h-[28rem] bg-primary/10 blur-3xl", rounded: "full", "aria-hidden": "true" }), _jsx(Div, { className: "pointer-events-none absolute -bottom-40 -right-40 w-[36rem] h-[36rem] bg-secondary/10 dark:bg-secondary/15 blur-3xl", rounded: "full", "aria-hidden": "true" }), _jsx(Div, { className: "relative z-10 max-w-7xl mx-auto", children: _jsxs(Grid, { align: "center", gap: "2xl", className: "grid-cols-1 lg:grid-cols-2 xl:grid-cols-2 2xl:grid-cols-2", children: [_jsxs(Div, { className: "text-left", children: [pillLabel && (_jsx(Div, { children: _jsxs(Span, { layout: "inline-flex", gap: "md", size: "xs", weight: "medium", className: "border border-primary-[500]/30 bg-primary-500/10 px-[1.25rem] py-[0.375rem] tracking-[0.2em] text-primary-700 dark:text-primary-400 backdrop-blur-sm", rounded: "full", transform: "uppercase", children: [_jsx(Span, { className: "w-1.5 h-1.5 bg-primary-500 inline-block", rounded: "full", "aria-hidden": "true" }), pillLabel, _jsx(Span, { className: "w-1.5 h-1.5 bg-primary-500 inline-block", rounded: "full", "aria-hidden": "true" })] }) })), _jsx(Heading, { level: 1, variant: "none", gradient: "brand-tri", className: "mt-4 font-display leading-[1.1] tracking-tight break-words", size: "5xl", mdSize: "6xl", lgSize: "7xl", xlSize: "7xl", children: title }), subtitle && (_jsx(Text, { className: `mt-4 ${themed.textSecondary} max-w-xl leading-relaxed`, size: "xl", children: subtitle })), showCTA && (_jsxs(Row, { wrap: true, gap: "md", className: "mt-8", justify: "start", children: [ctaHref ? (_jsx(TextLink, { rounded: "xl", href: ctaHref, className: "inline-flex items-[center] justify-[center] px-[2rem] py-[0.875rem] !bg-primary hover:!bg-primary-600 text-white dark:!bg-primary dark:hover:!bg-primary-600 dark:text-white btn-glow transition-all hover:scale-[1.02]", size: "base", weight: "bold", children: ctaLabel })) : (_jsx(Button, { variant: "primary", size: "lg", onClick: onCtaClick, children: ctaLabel })), secondaryCtaHref ? (_jsx(TextLink, { rounded: "xl", href: secondaryCtaHref, className: "inline-flex items-[center] justify-[center] border-2 border-cobalt/40 dark:border-cobalt-400/40 px-[2rem] py-[0.875rem] text-cobalt-700 dark:text-cobalt-300 hover:bg-cobalt-50 dark:hover:bg-cobalt-900/20 transition-all hover:scale-[1.02]", size: "base", weight: "semibold", children: secondaryCtaLabel })) : (_jsx(Button, { variant: "outline", size: "lg", onClick: onSecondaryCtaClick, children: secondaryCtaLabel }))] })), trustChips.length > 0 && (_jsx(Row, { wrap: true, gap: "sm", className: "mt-6", justify: "start", children: trustChips.map((chip) => (_jsxs(Span, { layout: "inline-flex", gap: "xs", size: "xs", weight: "medium", className: "border border-zinc-[200] dark:border-slate-[700] px-[0.875rem] py-[0.375rem]", rounded: "full", surface: "subtle", color: "muted", children: [chip.emoji, " ", chip.label] }, chip.key))) }))] }), _jsx(Div, { className: "hidden lg:block", children: _jsxs(Div, { className: `relative overflow-hidden aspect-[4/3] bg-[image:var(--appkit-gradient-section-mesh)]`, shadow: "2xl", border: "default", rounded: "3xl", children: [_jsx(Div, { className: "absolute inset-0 bg-[image:var(--appkit-gradient-glass)]" }), _jsx(Row, { centered: true, className: `absolute inset-0 ${flex.center} px-[2.5rem]`, children: _jsx(SiteLogo, { title: brandLogoText || "LetItRip.in", size: "hero" }) })] }) })] }) })] }));
 }

package/dist/react/hooks/realtime-event-constants.d.ts

@@ -0,0 +1,50 @@
+import type { JsonValue } from "../../schemas/types";
+/**
+ * Plain constants + types shared between client hooks (useRealtimeEvent) and
+ * server-side RTDB writers (e.g. src/app/api/auth/event/init/route.ts).
+ *
+ * Deliberately NOT in a "use client" file. useRealtimeEvent.ts is "use
+ * client" (it uses React hooks), and Next.js's server bundler replaces every
+ * export of a "use client" module with an opaque client-reference when a
+ * server module imports it directly — including plain, non-React constants
+ * like RTDBPayloadStatus. A server route importing RTDBPayloadStatus.PENDING
+ * from the old location got `undefined` at runtime, which Firebase RTDB's
+ * `.set()` rejects outright ("value argument contains undefined in property
+ * ...status"), silently breaking every RTDB-backed realtime event (Google
+ * OAuth popup flow, payment event bridge, chat) in production. Confirmed via
+ * live Vercel logs 2026-08-17.
+ */
+export declare const RealtimeEventType: {
+    readonly AUTH: "auth";
+    readonly PAYMENT: "payment";
+    readonly CHAT: "chat";
+    readonly BID: "bid";
+    readonly BULK: "bulk";
+};
+export type RealtimeEventType = (typeof RealtimeEventType)[keyof typeof RealtimeEventType];
+export declare const RealtimeEventStatus: {
+    readonly IDLE: "idle";
+    readonly SUBSCRIBING: "subscribing";
+    readonly PENDING: "pending";
+    readonly SUCCESS: "success";
+    readonly FAILED: "failed";
+    readonly TIMEOUT: "timeout";
+};
+export type RealtimeEventStatus = (typeof RealtimeEventStatus)[keyof typeof RealtimeEventStatus];
+export declare const RTDBPayloadStatus: {
+    readonly PENDING: "pending";
+    readonly SUCCESS: "success";
+    readonly FAILED: "failed";
+    readonly ERROR: "error";
+};
+export interface RTDBEventPayload {
+    status: (typeof RTDBPayloadStatus)[keyof typeof RTDBPayloadStatus];
+    error?: string;
+    [key: string]: JsonValue | undefined;
+}
+export interface RealtimeEventMessages {
+    tokenFailure?: string;
+    connectionLost?: string;
+    timedOut?: string;
+    failure?: string;
+}

package/dist/react/hooks/realtime-event-constants.js

@@ -0,0 +1,36 @@
+/**
+ * Plain constants + types shared between client hooks (useRealtimeEvent) and
+ * server-side RTDB writers (e.g. src/app/api/auth/event/init/route.ts).
+ *
+ * Deliberately NOT in a "use client" file. useRealtimeEvent.ts is "use
+ * client" (it uses React hooks), and Next.js's server bundler replaces every
+ * export of a "use client" module with an opaque client-reference when a
+ * server module imports it directly — including plain, non-React constants
+ * like RTDBPayloadStatus. A server route importing RTDBPayloadStatus.PENDING
+ * from the old location got `undefined` at runtime, which Firebase RTDB's
+ * `.set()` rejects outright ("value argument contains undefined in property
+ * ...status"), silently breaking every RTDB-backed realtime event (Google
+ * OAuth popup flow, payment event bridge, chat) in production. Confirmed via
+ * live Vercel logs 2026-08-17.
+ */
+export const RealtimeEventType = {
+    AUTH: "auth",
+    PAYMENT: "payment",
+    CHAT: "chat",
+    BID: "bid",
+    BULK: "bulk",
+};
+export const RealtimeEventStatus = {
+    IDLE: "idle",
+    SUBSCRIBING: "subscribing",
+    PENDING: "pending",
+    SUCCESS: "success",
+    FAILED: "failed",
+    TIMEOUT: "timeout",
+};
+export const RTDBPayloadStatus = {
+    PENDING: "pending",
+    SUCCESS: "success",
+    FAILED: "failed",
+    ERROR: "error",
+};

package/dist/react/hooks/useRealtimeEvent.d.ts

@@ -1,39 +1,6 @@
-import type { JsonValue } from "../../schemas/types";
 import { type IClientRealtimeProvider } from "../../contracts/client-realtime";
-export declare const RealtimeEventType: {
-    readonly AUTH: "auth";
-    readonly PAYMENT: "payment";
-    readonly CHAT: "chat";
-    readonly BID: "bid";
-    readonly BULK: "bulk";
-};
-export type RealtimeEventType = (typeof RealtimeEventType)[keyof typeof RealtimeEventType];
-export declare const RealtimeEventStatus: {
-    readonly IDLE: "idle";
-    readonly SUBSCRIBING: "subscribing";
-    readonly PENDING: "pending";
-    readonly SUCCESS: "success";
-    readonly FAILED: "failed";
-    readonly TIMEOUT: "timeout";
-};
-export type RealtimeEventStatus = (typeof RealtimeEventStatus)[keyof typeof RealtimeEventStatus];
-export declare const RTDBPayloadStatus: {
-    readonly PENDING: "pending";
-    readonly SUCCESS: "success";
-    readonly FAILED: "failed";
-    readonly ERROR: "error";
-};
-export interface RTDBEventPayload {
-    status: (typeof RTDBPayloadStatus)[keyof typeof RTDBPayloadStatus];
-    error?: string;
-    [key: string]: JsonValue | undefined;
-}
-export interface RealtimeEventMessages {
-    tokenFailure?: string;
-    connectionLost?: string;
-    timedOut?: string;
-    failure?: string;
-}
+import { RealtimeEventType, RealtimeEventStatus, RTDBPayloadStatus, type RTDBEventPayload, type RealtimeEventMessages } from "./realtime-event-constants";
+export { RealtimeEventType, RealtimeEventStatus, RTDBPayloadStatus, type RTDBEventPayload, type RealtimeEventMessages, };
 export interface UseRealtimeEventConfig<TData = undefined> {
     type: RealtimeEventType;
     rtdbPath: string;

package/dist/react/hooks/useRealtimeEvent.js

@@ -2,27 +2,13 @@
 import { normalizeError } from "../../errors/normalize";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { getClientRealtimeProvider, } from "../../contracts/client-realtime";
-export const RealtimeEventType = {
-    AUTH: "auth",
-    PAYMENT: "payment",
-    CHAT: "chat",
-    BID: "bid",
-    BULK: "bulk",
-};
-export const RealtimeEventStatus = {
-    IDLE: "idle",
-    SUBSCRIBING: "subscribing",
-    PENDING: "pending",
-    SUCCESS: "success",
-    FAILED: "failed",
-    TIMEOUT: "timeout",
-};
-export const RTDBPayloadStatus = {
-    PENDING: "pending",
-    SUCCESS: "success",
-    FAILED: "failed",
-    ERROR: "error",
-};
+import { RealtimeEventType, RealtimeEventStatus, RTDBPayloadStatus, } from "./realtime-event-constants";
+// Re-exported for existing client import paths — the canonical definitions
+// now live in realtime-event-constants.ts (a plain, non-"use client" module)
+// so server code can import them without hitting the client-reference
+// substitution Next.js applies to "use client" module exports. See that
+// file's comment for the full story.
+export { RealtimeEventType, RealtimeEventStatus, RTDBPayloadStatus, };
 const DEFAULT_TIMEOUT_MS = 3 * 60 * 1000;
 const DEFAULT_MESSAGES = {
     tokenFailure: "Failed to initialize realtime tracking.",

package/dist/react/index.d.ts

@@ -52,5 +52,7 @@ export { useModalStack } from "./useModalStack";
 export type { ModalEntry } from "./useModalStack";
 export { ErrorBoundary } from "./ErrorBoundary";
 export type { ErrorBoundaryProps } from "./ErrorBoundary";
-export { useRealtimeEvent, RealtimeEventType, RealtimeEventStatus, RTDBPayloadStatus, } from "./hooks/useRealtimeEvent";
-export type { RTDBEventPayload, RealtimeEventMessages, RealtimeEventType as RealtimeEventTypeValue, RealtimeEventStatus as RealtimeEventStatusValue, UseRealtimeEventConfig, UseRealtimeEventReturn, } from "./hooks/useRealtimeEvent";
+export { useRealtimeEvent } from "./hooks/useRealtimeEvent";
+export type { UseRealtimeEventConfig, UseRealtimeEventReturn, } from "./hooks/useRealtimeEvent";
+export { RealtimeEventType, RealtimeEventStatus, RTDBPayloadStatus, } from "./hooks/realtime-event-constants";
+export type { RTDBEventPayload, RealtimeEventMessages, RealtimeEventType as RealtimeEventTypeValue, RealtimeEventStatus as RealtimeEventStatusValue, } from "./hooks/realtime-event-constants";

package/dist/react/index.js

@@ -53,4 +53,11 @@ export { useModalStack } from "./useModalStack";
 // Error boundary
 export { ErrorBoundary } from "./ErrorBoundary";
 // Realtime event bridge
-export { useRealtimeEvent, RealtimeEventType, RealtimeEventStatus, RTDBPayloadStatus, } from "./hooks/useRealtimeEvent";
+// RealtimeEventType/RealtimeEventStatus/RTDBPayloadStatus/RTDBEventPayload/
+// RealtimeEventMessages come from realtime-event-constants.ts (plain module,
+// no "use client") rather than useRealtimeEvent.ts directly — server code
+// importing these via the main @mohasinac/appkit barrel needs the real
+// values, not the client-reference placeholder Next.js substitutes for
+// "use client" module exports.
+export { useRealtimeEvent } from "./hooks/useRealtimeEvent";
+export { RealtimeEventType, RealtimeEventStatus, RTDBPayloadStatus, } from "./hooks/realtime-event-constants";