@neowhale/storefront 0.2.42 → 0.2.44

package/dist/landing.global.js

@@ -562,27 +562,62 @@ var WhaleStorefront = (function (exports) {
     return /* @__PURE__ */ jsx("div", { style: { width: "100%", overflow: "hidden", position: "relative" }, children: [
       /* @__PURE__ */ jsx("div", { style: {
         display: "grid",
-        gridTemplateColumns: count >= 4 ? "repeat(4, 1fr)" : "repeat(2, 1fr)",
-        gridTemplateRows: count >= 4 ? "minmax(0, 28vh) minmax(0, 28vh)" : "minmax(0, 50vh)",
+        gridTemplateColumns: "3fr 2fr",
+        gridTemplateRows: "auto",
         gap: "2px"
-      }, children: images.slice(0, count).map((img, i) => /* @__PURE__ */ jsx("div", { style: {
-        gridColumn: i === 0 && count >= 4 ? "span 2" : void 0,
-        gridRow: i === 0 && count >= 4 ? "span 2" : void 0,
-        overflow: "hidden",
-        background: theme.surface
-      }, children: /* @__PURE__ */ jsx(
-        "img",
-        {
-          src: img.url,
-          alt: img.alt || "",
-          loading: i < 3 ? "eager" : "lazy",
-          style: { width: "100%", height: "100%", objectFit: "cover", display: "block" }
-        }
-      ) }, i)) }),
+      }, children: [
+        count > 0 && /* @__PURE__ */ jsx("div", { style: { gridRow: count >= 3 ? "span 2" : void 0, overflow: "hidden", background: theme.surface, maxHeight: "70vh" }, children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: images[0].url,
+            alt: images[0].alt || "",
+            loading: "eager",
+            style: { width: "100%", height: "100%", objectFit: "cover", display: "block", minHeight: "40vh" }
+          }
+        ) }),
+        count >= 2 && /* @__PURE__ */ jsx("div", { style: { overflow: "hidden", background: theme.surface }, children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: images[1].url,
+            alt: images[1].alt || "",
+            loading: "eager",
+            style: { width: "100%", height: "100%", objectFit: "cover", display: "block", minHeight: "20vh", maxHeight: "35vh" }
+          }
+        ) }),
+        count >= 3 && /* @__PURE__ */ jsx("div", { style: { overflow: "hidden", background: theme.surface }, children: /* @__PURE__ */ jsx(
+          "img",
+          {
+            src: images[2].url,
+            alt: images[2].alt || "",
+            loading: "lazy",
+            style: { width: "100%", height: "100%", objectFit: "cover", display: "block", minHeight: "20vh", maxHeight: "35vh" }
+          }
+        ) }),
+        count >= 4 && /* @__PURE__ */ jsx("div", { style: { gridColumn: "1 / -1", display: "grid", gridTemplateColumns: count >= 5 ? "1fr 1fr" : "1fr", gap: "2px" }, children: [
+          /* @__PURE__ */ jsx("div", { style: { overflow: "hidden", background: theme.surface, maxHeight: "25vh" }, children: /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: images[3].url,
+              alt: images[3].alt || "",
+              loading: "lazy",
+              style: { width: "100%", height: "100%", objectFit: "cover", display: "block" }
+            }
+          ) }),
+          count >= 5 && /* @__PURE__ */ jsx("div", { style: { overflow: "hidden", background: theme.surface, maxHeight: "25vh" }, children: /* @__PURE__ */ jsx(
+            "img",
+            {
+              src: images[4].url,
+              alt: images[4].alt || "",
+              loading: "lazy",
+              style: { width: "100%", height: "100%", objectFit: "cover", display: "block" }
+            }
+          ) })
+        ] })
+      ] }),
       /* @__PURE__ */ jsx("div", { style: {
         position: "absolute",
         inset: 0,
-        background: "linear-gradient(to top, rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.2) 40%, transparent 60%)",
+        background: "linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.15) 35%, transparent 55%)",
         pointerEvents: "none"
       } }),
       /* @__PURE__ */ jsx("div", { style: {
@@ -1041,6 +1076,302 @@ var WhaleStorefront = (function (exports) {
     ] }) });
   }
 
+  // src/react/components/sections/conversion-sections.tsx
+  function TestimonialsSection({ section, theme }) {
+    const c = section.content;
+    const layout = section.config?.layout || "grid";
+    const reviews = c.reviews || [];
+    if (reviews.length === 0) return null;
+    const overallRating = c.rating ?? 5;
+    const reviewCount = c.review_count ?? reviews.length;
+    return /* @__PURE__ */ jsx("div", { style: { padding: "3rem 1.5rem", maxWidth: 640, margin: "0 auto" }, children: [
+      /* @__PURE__ */ jsx("div", { style: { textAlign: "center", marginBottom: "2rem" }, children: [
+        c.heading && /* @__PURE__ */ jsx("h2", { style: {
+          fontSize: "clamp(1.25rem, 4vw, 1.75rem)",
+          fontWeight: 300,
+          fontFamily: theme.fontDisplay || "inherit",
+          margin: "0 0 0.75rem",
+          lineHeight: 1.2,
+          letterSpacing: "-0.02em",
+          color: theme.fg
+        }, children: /* @__PURE__ */ jsx(AnimatedText, { text: c.heading }) }),
+        /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "center", justifyContent: "center", gap: "0.5rem", marginBottom: "0.25rem" }, children: [
+          /* @__PURE__ */ jsx(Stars, { rating: overallRating, color: theme.accent, size: 18 }),
+          /* @__PURE__ */ jsx("span", { style: { fontSize: "1.1rem", fontWeight: 500, color: theme.fg }, children: /* @__PURE__ */ jsx(AnimatedText, { text: overallRating.toFixed(1) }) })
+        ] }),
+        c.subtitle ? /* @__PURE__ */ jsx("p", { style: { fontSize: "0.8rem", color: theme.muted, margin: 0, letterSpacing: "0.1em", textTransform: "uppercase" }, children: c.subtitle }) : /* @__PURE__ */ jsx("p", { style: { fontSize: "0.8rem", color: theme.muted, margin: 0, letterSpacing: "0.1em", textTransform: "uppercase" }, children: [
+          "from ",
+          /* @__PURE__ */ jsx(AnimatedText, { text: String(reviewCount) }),
+          " reviews"
+        ] })
+      ] }),
+      /* @__PURE__ */ jsx("div", { style: {
+        display: "grid",
+        gridTemplateColumns: layout === "list" ? "1fr" : `repeat(${Math.min(reviews.length, 2)}, 1fr)`,
+        gap: "0.75rem"
+      }, children: reviews.map((review, i) => /* @__PURE__ */ jsx("div", { style: {
+        background: theme.surface,
+        border: `1px solid ${theme.fg}08`,
+        padding: "1.25rem"
+      }, children: [
+        /* @__PURE__ */ jsx(Stars, { rating: review.rating ?? 5, color: theme.accent, size: 14 }),
+        /* @__PURE__ */ jsx("p", { style: {
+          fontSize: "0.88rem",
+          color: `${theme.fg}CC`,
+          margin: "0.75rem 0",
+          lineHeight: 1.6,
+          fontWeight: 300,
+          fontStyle: "italic"
+        }, children: [
+          '"',
+          review.text,
+          '"'
+        ] }),
+        /* @__PURE__ */ jsx("div", { style: { display: "flex", alignItems: "baseline", gap: "0.375rem" }, children: [
+          /* @__PURE__ */ jsx("span", { style: { fontSize: "0.8rem", fontWeight: 500, color: theme.fg }, children: review.name }),
+          review.location && /* @__PURE__ */ jsx("span", { style: { fontSize: "0.7rem", color: theme.muted }, children: review.location })
+        ] })
+      ] }, i)) })
+    ] });
+  }
+  function Stars({ rating, color, size }) {
+    return /* @__PURE__ */ jsx("span", { style: { display: "inline-flex", gap: "1px" }, children: [1, 2, 3, 4, 5].map((n) => /* @__PURE__ */ jsx(
+      "svg",
+      {
+        width: size,
+        height: size,
+        viewBox: "0 0 20 20",
+        fill: n <= Math.round(rating) ? color : "none",
+        stroke: color,
+        strokeWidth: 1.5,
+        children: /* @__PURE__ */ jsx("path", { d: "M10 1.5l2.47 5.01 5.53.8-4 3.9.94 5.5L10 14.26 5.06 16.7l.94-5.5-4-3.9 5.53-.8z" })
+      },
+      n
+    )) });
+  }
+  function ValueStackSection({ section, theme }) {
+    const c = section.content;
+    const items = c.items || [];
+    if (items.length === 0) return null;
+    return /* @__PURE__ */ jsx("div", { style: { padding: "3rem 1.5rem", maxWidth: 520, margin: "0 auto" }, children: /* @__PURE__ */ jsx("div", { style: { background: theme.surface, border: `1px solid ${theme.fg}08`, padding: "clamp(1.5rem, 5vw, 2.5rem)" }, children: [
+      c.heading && /* @__PURE__ */ jsx("h2", { style: {
+        fontSize: "clamp(1.25rem, 4vw, 1.5rem)",
+        fontWeight: 300,
+        fontFamily: theme.fontDisplay || "inherit",
+        margin: "0 0 0.25rem",
+        lineHeight: 1.2,
+        letterSpacing: "-0.02em",
+        color: theme.fg,
+        textAlign: "center"
+      }, children: c.heading }),
+      c.subtitle && /* @__PURE__ */ jsx("p", { style: {
+        fontSize: "0.8rem",
+        color: theme.accent,
+        margin: "0 0 1.5rem",
+        letterSpacing: "0.15em",
+        textTransform: "uppercase",
+        textAlign: "center"
+      }, children: c.subtitle }),
+      /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: "0.625rem" }, children: items.map((item, i) => /* @__PURE__ */ jsx("div", { style: {
+        display: "flex",
+        alignItems: "flex-start",
+        gap: "0.75rem",
+        padding: "0.5rem 0",
+        borderBottom: i < items.length - 1 ? `1px solid ${theme.fg}08` : void 0
+      }, children: [
+        /* @__PURE__ */ jsx("span", { style: { color: theme.accent, fontSize: "1rem", lineHeight: 1, flexShrink: 0, marginTop: "0.1rem" }, children: "\u2713" }),
+        /* @__PURE__ */ jsx("span", { style: { flex: 1, fontSize: "0.9rem", color: `${theme.fg}CC`, fontWeight: 300, lineHeight: 1.5 }, children: item.text }),
+        item.value && /* @__PURE__ */ jsx("span", { style: {
+          fontSize: "0.8rem",
+          color: theme.muted,
+          fontWeight: 400,
+          textDecoration: "line-through",
+          flexShrink: 0
+        }, children: item.value })
+      ] }, i)) }),
+      (c.total_value || c.offer_label) && /* @__PURE__ */ jsx("div", { style: {
+        marginTop: "1.5rem",
+        padding: "1rem",
+        background: `${theme.accent}0A`,
+        border: `1px dashed ${theme.accent}30`,
+        textAlign: "center"
+      }, children: [
+        c.total_value && /* @__PURE__ */ jsx("div", { style: { fontSize: "0.75rem", color: theme.muted, marginBottom: "0.25rem", letterSpacing: "0.1em", textTransform: "uppercase" }, children: [
+          "Total value: ",
+          /* @__PURE__ */ jsx("span", { style: { textDecoration: "line-through" }, children: c.total_value })
+        ] }),
+        /* @__PURE__ */ jsx("div", { style: {
+          fontSize: "clamp(1.25rem, 4vw, 1.5rem)",
+          fontWeight: 500,
+          fontFamily: theme.fontDisplay || "inherit",
+          color: theme.accent
+        }, children: c.offer_label || "Free" })
+      ] })
+    ] }) });
+  }
+  function FAQSection({ section, theme }) {
+    const c = section.content;
+    const items = c.items || [];
+    if (items.length === 0) return null;
+    return /* @__PURE__ */ jsx("div", { style: { padding: "2.5rem 1.5rem", maxWidth: 580, margin: "0 auto" }, children: [
+      c.heading && /* @__PURE__ */ jsx("h2", { style: {
+        fontSize: 11,
+        fontWeight: 500,
+        textTransform: "uppercase",
+        letterSpacing: "0.25em",
+        color: `${theme.fg}40`,
+        margin: "0 0 1.25rem",
+        textAlign: "center"
+      }, children: c.heading }),
+      /* @__PURE__ */ jsx("div", { style: { display: "flex", flexDirection: "column", gap: 0 }, children: items.map((item, i) => /* @__PURE__ */ jsx(FAQItem, { question: item.question, answer: item.answer, theme }, i)) })
+    ] });
+  }
+  function FAQItem({ question, answer, theme }) {
+    const [open, setOpen] = useState(false);
+    return /* @__PURE__ */ jsx("div", { style: { borderBottom: `1px solid ${theme.fg}0A` }, children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          onClick: () => setOpen(!open),
+          style: {
+            width: "100%",
+            display: "flex",
+            justifyContent: "space-between",
+            alignItems: "center",
+            padding: "1rem 0",
+            background: "none",
+            border: "none",
+            cursor: "pointer",
+            color: theme.fg,
+            fontFamily: "inherit",
+            textAlign: "left"
+          },
+          children: [
+            /* @__PURE__ */ jsx("span", { style: { fontSize: "0.9rem", fontWeight: 400, lineHeight: 1.4 }, children: question }),
+            /* @__PURE__ */ jsx("span", { style: {
+              fontSize: "1.25rem",
+              fontWeight: 200,
+              color: theme.muted,
+              transition: "transform 0.2s",
+              transform: open ? "rotate(45deg)" : "none",
+              flexShrink: 0,
+              marginLeft: "1rem"
+            }, children: "+" })
+          ]
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { style: {
+        maxHeight: open ? "20rem" : 0,
+        overflow: "hidden",
+        transition: "max-height 0.3s ease"
+      }, children: /* @__PURE__ */ jsx("p", { style: {
+        fontSize: "0.85rem",
+        color: `${theme.fg}88`,
+        lineHeight: 1.7,
+        fontWeight: 300,
+        margin: 0,
+        padding: "0 0 1rem"
+      }, children: answer }) })
+    ] });
+  }
+  function TrustBadgesSection({ section, theme }) {
+    const c = section.content;
+    const badges = c.badges || [];
+    if (badges.length === 0) return null;
+    return /* @__PURE__ */ jsx("div", { style: {
+      padding: "1.25rem 1.5rem",
+      borderTop: `1px solid ${theme.fg}08`,
+      borderBottom: `1px solid ${theme.fg}08`
+    }, children: /* @__PURE__ */ jsx("div", { style: {
+      display: "flex",
+      justifyContent: "center",
+      alignItems: "center",
+      gap: "clamp(1rem, 4vw, 2.5rem)",
+      flexWrap: "wrap"
+    }, children: badges.map((badge, i) => /* @__PURE__ */ jsx("div", { style: {
+      display: "flex",
+      alignItems: "center",
+      gap: "0.375rem"
+    }, children: [
+      badge.icon && /* @__PURE__ */ jsx("span", { style: { fontSize: "0.9rem" }, children: badge.icon }),
+      /* @__PURE__ */ jsx("span", { style: {
+        fontSize: "0.7rem",
+        fontWeight: 500,
+        textTransform: "uppercase",
+        letterSpacing: "0.15em",
+        color: theme.muted
+      }, children: badge.label })
+    ] }, i)) }) });
+  }
+  function CountdownSection({ section, theme }) {
+    const c = section.content;
+    const endDate = c.end_date ? new Date(c.end_date) : null;
+    const [remaining, setRemaining] = useState(null);
+    const [expired, setExpired] = useState(false);
+    useEffect(() => {
+      if (!endDate) return;
+      function tick() {
+        const diff = endDate.getTime() - Date.now();
+        if (diff <= 0) {
+          setExpired(true);
+          return;
+        }
+        setRemaining({
+          d: Math.floor(diff / 864e5),
+          h: Math.floor(diff % 864e5 / 36e5),
+          m: Math.floor(diff % 36e5 / 6e4),
+          s: Math.floor(diff % 6e4 / 1e3)
+        });
+      }
+      tick();
+      const id = setInterval(tick, 1e3);
+      return () => clearInterval(id);
+    }, [endDate?.getTime()]);
+    if (!endDate) return null;
+    if (expired) {
+      return c.expired_text ? /* @__PURE__ */ jsx("div", { style: { padding: "1.5rem", textAlign: "center" }, children: /* @__PURE__ */ jsx("p", { style: { fontSize: "0.85rem", color: theme.muted, margin: 0 }, children: c.expired_text }) }) : null;
+    }
+    if (!remaining) return null;
+    const units = [
+      { label: "Days", value: remaining.d },
+      { label: "Hours", value: remaining.h },
+      { label: "Min", value: remaining.m },
+      { label: "Sec", value: remaining.s }
+    ];
+    return /* @__PURE__ */ jsx("div", { style: { padding: "2rem 1.5rem", maxWidth: 480, margin: "0 auto", textAlign: "center" }, children: [
+      c.heading && /* @__PURE__ */ jsx("p", { style: {
+        fontSize: "0.8rem",
+        color: theme.accent,
+        margin: "0 0 1rem",
+        letterSpacing: "0.15em",
+        textTransform: "uppercase"
+      }, children: c.heading }),
+      /* @__PURE__ */ jsx("div", { style: { display: "flex", justifyContent: "center", gap: "0.5rem" }, children: units.map((u) => /* @__PURE__ */ jsx("div", { style: {
+        minWidth: "clamp(3.5rem, 12vw, 4.5rem)",
+        padding: "0.75rem 0.25rem",
+        background: theme.surface,
+        border: `1px solid ${theme.fg}08`
+      }, children: [
+        /* @__PURE__ */ jsx("div", { style: {
+          fontFamily: theme.fontDisplay || "inherit",
+          fontSize: "clamp(1.5rem, 5vw, 2rem)",
+          fontWeight: 300,
+          lineHeight: 1,
+          color: theme.fg,
+          fontVariantNumeric: "tabular-nums"
+        }, children: String(u.value).padStart(2, "0") }),
+        /* @__PURE__ */ jsx("div", { style: {
+          fontSize: "0.6rem",
+          fontWeight: 500,
+          textTransform: "uppercase",
+          letterSpacing: "0.2em",
+          color: theme.muted,
+          marginTop: "0.375rem"
+        }, children: u.label })
+      ] }, u.label)) })
+    ] });
+  }
+
   // src/react/components/section-renderer.tsx
   function SectionRenderer({
     section,
@@ -1076,6 +1407,16 @@ var WhaleStorefront = (function (exports) {
           return /* @__PURE__ */ jsx(SocialLinksSection, { section, theme });
         case "lead_capture":
           return /* @__PURE__ */ jsx(LeadCaptureSection, { section, data, theme, onEvent });
+        case "testimonials":
+          return /* @__PURE__ */ jsx(TestimonialsSection, { section, theme });
+        case "value_stack":
+          return /* @__PURE__ */ jsx(ValueStackSection, { section, theme });
+        case "faq":
+          return /* @__PURE__ */ jsx(FAQSection, { section, theme });
+        case "trust_badges":
+          return /* @__PURE__ */ jsx(TrustBadgesSection, { section, theme });
+        case "countdown":
+          return /* @__PURE__ */ jsx(CountdownSection, { section, theme });
         case "divider":
           return /* @__PURE__ */ jsx(DividerSection, { theme });
         default:

package/dist/next/index.d.cts

@@ -0,0 +1,117 @@
+import { F as WhaleStorefrontConfig, W as WhaleClient, r as Product } from '../client-D7_7p7ja.cjs';
+import { NextRequest, NextResponse } from 'next/server';
+
+/**
+ * Security headers for Next.js storefronts.
+ */
+declare const securityHeaders: {
+    key: string;
+    value: string;
+}[];
+/**
+ * Returns a Next.js `headers()` config with security headers applied to all routes.
+ * Use in next.config.ts:
+ *
+ * ```ts
+ * import { withSecurityHeaders } from '@neowhale/storefront/next'
+ * export default { headers: withSecurityHeaders() }
+ * ```
+ */
+declare function withSecurityHeaders(extra?: {
+    key: string;
+    value: string;
+}[]): () => Promise<{
+    source: string;
+    headers: {
+        key: string;
+        value: string;
+    }[];
+}[]>;
+
+/**
+ * Gateway rewrite rule for Next.js.
+ * Proxies client-side /api/gw/* requests to whale-gateway to avoid CORS.
+ *
+ * Usage in next.config.ts:
+ * ```ts
+ * import { whaleGatewayRewrite } from '@neowhale/storefront/next'
+ * export default {
+ *   async rewrites() {
+ *     return [whaleGatewayRewrite()]
+ *   }
+ * }
+ * ```
+ */
+declare function whaleGatewayRewrite(gatewayUrl?: string, proxyPath?: string): {
+    source: string;
+    destination: string;
+};
+
+/**
+ * Creates a server-side WhaleClient.
+ * Reads from env vars by default — override with explicit config.
+ */
+declare function createServerClient(config?: Partial<WhaleStorefrontConfig>): WhaleClient;
+/**
+ * Server-side: fetch all published products with ISR caching.
+ * Drop-in replacement for Flora's `getAllProducts()`.
+ */
+declare function getAllProducts(options?: {
+    /** Revalidate interval in seconds. Defaults to 60. */
+    revalidate?: number;
+    /** Filter function to exclude products (e.g. hidden categories, out of stock) */
+    filter?: (product: Product) => boolean;
+    /** Override client config */
+    client?: WhaleClient;
+}): Promise<Product[]>;
+
+interface ImageLoaderParams {
+    src: string;
+    width: number;
+    quality?: number;
+}
+/**
+ * Creates a Next.js custom image loader that proxies Supabase images through gateway.
+ *
+ * Usage in a loader file (e.g. src/lib/image-loader.ts):
+ * ```ts
+ * import { createImageLoader } from '@neowhale/storefront/next'
+ * export default createImageLoader({
+ *   storeId: process.env.NEXT_PUBLIC_STORE_ID!,
+ *   gatewayUrl: 'https://whale-gateway.fly.dev',
+ *   supabaseHost: 'your-project.supabase.co',
+ *   signingSecret: process.env.NEXT_PUBLIC_MEDIA_SIGNING_SECRET!,
+ * })
+ * ```
+ */
+declare function createImageLoader(config: {
+    storeId: string;
+    gatewayUrl: string;
+    supabaseHost: string;
+    signingSecret: string;
+}): (params: ImageLoaderParams) => string;
+
+/**
+ * Creates a Next.js middleware that protects routes requiring authentication.
+ *
+ * Checks for a session token cookie or localStorage indicator.
+ * Since middleware runs on the edge and can't access localStorage,
+ * this checks for a cookie-based token instead.
+ *
+ * Usage in middleware.ts:
+ * ```ts
+ * import { createAuthMiddleware } from '@neowhale/storefront/next'
+ * export const middleware = createAuthMiddleware({
+ *   protectedPaths: ['/account'],
+ *   loginPath: '/account',
+ * })
+ * export const config = { matcher: ['/account/:path*'] }
+ * ```
+ */
+declare function createAuthMiddleware(options: {
+    protectedPaths: string[];
+    loginPath: string;
+    cookieName?: string;
+}): (request: NextRequest) => NextResponse<unknown>;
+
+export { createAuthMiddleware, createImageLoader, createServerClient, getAllProducts, securityHeaders, whaleGatewayRewrite, withSecurityHeaders };

package/dist/next/index.d.ts

@@ -0,0 +1,117 @@
+import { F as WhaleStorefrontConfig, W as WhaleClient, r as Product } from '../client-D7_7p7ja.js';
+import { NextRequest, NextResponse } from 'next/server';
+
+/**
+ * Security headers for Next.js storefronts.
+ */
+declare const securityHeaders: {
+    key: string;
+    value: string;
+}[];
+/**
+ * Returns a Next.js `headers()` config with security headers applied to all routes.
+ * Use in next.config.ts:
+ *
+ * ```ts
+ * import { withSecurityHeaders } from '@neowhale/storefront/next'
+ * export default { headers: withSecurityHeaders() }
+ * ```
+ */
+declare function withSecurityHeaders(extra?: {
+    key: string;
+    value: string;
+}[]): () => Promise<{
+    source: string;
+    headers: {
+        key: string;
+        value: string;
+    }[];
+}[]>;
+
+/**
+ * Gateway rewrite rule for Next.js.
+ * Proxies client-side /api/gw/* requests to whale-gateway to avoid CORS.
+ *
+ * Usage in next.config.ts:
+ * ```ts
+ * import { whaleGatewayRewrite } from '@neowhale/storefront/next'
+ * export default {
+ *   async rewrites() {
+ *     return [whaleGatewayRewrite()]
+ *   }
+ * }
+ * ```
+ */
+declare function whaleGatewayRewrite(gatewayUrl?: string, proxyPath?: string): {
+    source: string;
+    destination: string;
+};
+
+/**
+ * Creates a server-side WhaleClient.
+ * Reads from env vars by default — override with explicit config.
+ */
+declare function createServerClient(config?: Partial<WhaleStorefrontConfig>): WhaleClient;
+/**
+ * Server-side: fetch all published products with ISR caching.
+ * Drop-in replacement for Flora's `getAllProducts()`.
+ */
+declare function getAllProducts(options?: {
+    /** Revalidate interval in seconds. Defaults to 60. */
+    revalidate?: number;
+    /** Filter function to exclude products (e.g. hidden categories, out of stock) */
+    filter?: (product: Product) => boolean;
+    /** Override client config */
+    client?: WhaleClient;
+}): Promise<Product[]>;
+
+interface ImageLoaderParams {
+    src: string;
+    width: number;
+    quality?: number;
+}
+/**
+ * Creates a Next.js custom image loader that proxies Supabase images through gateway.
+ *
+ * Usage in a loader file (e.g. src/lib/image-loader.ts):
+ * ```ts
+ * import { createImageLoader } from '@neowhale/storefront/next'
+ * export default createImageLoader({
+ *   storeId: process.env.NEXT_PUBLIC_STORE_ID!,
+ *   gatewayUrl: 'https://whale-gateway.fly.dev',
+ *   supabaseHost: 'your-project.supabase.co',
+ *   signingSecret: process.env.NEXT_PUBLIC_MEDIA_SIGNING_SECRET!,
+ * })
+ * ```
+ */
+declare function createImageLoader(config: {
+    storeId: string;
+    gatewayUrl: string;
+    supabaseHost: string;
+    signingSecret: string;
+}): (params: ImageLoaderParams) => string;
+
+/**
+ * Creates a Next.js middleware that protects routes requiring authentication.
+ *
+ * Checks for a session token cookie or localStorage indicator.
+ * Since middleware runs on the edge and can't access localStorage,
+ * this checks for a cookie-based token instead.
+ *
+ * Usage in middleware.ts:
+ * ```ts
+ * import { createAuthMiddleware } from '@neowhale/storefront/next'
+ * export const middleware = createAuthMiddleware({
+ *   protectedPaths: ['/account'],
+ *   loginPath: '/account',
+ * })
+ * export const config = { matcher: ['/account/:path*'] }
+ * ```
+ */
+declare function createAuthMiddleware(options: {
+    protectedPaths: string[];
+    loginPath: string;
+    cookieName?: string;
+}): (request: NextRequest) => NextResponse<unknown>;
+
+export { createAuthMiddleware, createImageLoader, createServerClient, getAllProducts, securityHeaders, whaleGatewayRewrite, withSecurityHeaders };

package/dist/pixel-manager-Blj8hb-X.d.cts

@@ -0,0 +1,10 @@
+import { p as PixelConfig } from './client-D7_7p7ja.cjs';
+
+declare class PixelManager {
+    private providers;
+    constructor(configs: PixelConfig[]);
+    initialize(): Promise<void>;
+    track(event: string, params?: Record<string, unknown>): void;
+}
+
+export { PixelManager as P };

package/dist/pixel-manager-DB8LLw9V.d.ts

@@ -0,0 +1,10 @@
+import { p as PixelConfig } from './client-D7_7p7ja.js';
+
+declare class PixelManager {
+    private providers;
+    constructor(configs: PixelConfig[]);
+    initialize(): Promise<void>;
+    track(event: string, params?: Record<string, unknown>): void;
+}
+
+export { PixelManager as P };