create-brainerce-store 1.61.0 → 1.63.0

package/templates/nextjs/base/src/components/ui/tabs.tsx

@@ -1,55 +1,55 @@
-'use client';
-
-import * as React from 'react';
-import * as TabsPrimitive from '@radix-ui/react-tabs';
-
-import { cn } from '@/core/lib/utils';
-
-const Tabs = TabsPrimitive.Root;
-
-const TabsList = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.List>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.List
-    ref={ref}
-    className={cn(
-      'inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground',
-      className
-    )}
-    {...props}
-  />
-));
-TabsList.displayName = TabsPrimitive.List.displayName;
-
-const TabsTrigger = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Trigger>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.Trigger
-    ref={ref}
-    className={cn(
-      'inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm',
-      className
-    )}
-    {...props}
-  />
-));
-TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
-
-const TabsContent = React.forwardRef<
-  React.ElementRef<typeof TabsPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
->(({ className, ...props }, ref) => (
-  <TabsPrimitive.Content
-    ref={ref}
-    className={cn(
-      'mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
-      className
-    )}
-    {...props}
-  />
-));
-TabsContent.displayName = TabsPrimitive.Content.displayName;
-
-export { Tabs, TabsList, TabsTrigger, TabsContent };
+'use client';
+
+import * as React from 'react';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+
+import { cn } from '@/core/lib/utils';
+
+const Tabs = TabsPrimitive.Root;
+
+const TabsList = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.List>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.List
+    ref={ref}
+    className={cn(
+      'inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground',
+      className
+    )}
+    {...props}
+  />
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
+
+const TabsTrigger = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.Trigger
+    ref={ref}
+    className={cn(
+      'inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm',
+      className
+    )}
+    {...props}
+  />
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+
+const TabsContent = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.Content
+    ref={ref}
+    className={cn(
+      'mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',
+      className
+    )}
+    {...props}
+  />
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+export { Tabs, TabsList, TabsTrigger, TabsContent };

package/templates/nextjs/base/src/components/ui/textarea.tsx

@@ -1,21 +1,21 @@
-import * as React from 'react';
-
-import { cn } from '@/core/lib/utils';
-
-const Textarea = React.forwardRef<HTMLTextAreaElement, React.ComponentProps<'textarea'>>(
-  ({ className, ...props }, ref) => {
-    return (
-      <textarea
-        className={cn(
-          'flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
-          className
-        )}
-        ref={ref}
-        {...props}
-      />
-    );
-  }
-);
-Textarea.displayName = 'Textarea';
-
-export { Textarea };
+import * as React from 'react';
+
+import { cn } from '@/core/lib/utils';
+
+const Textarea = React.forwardRef<HTMLTextAreaElement, React.ComponentProps<'textarea'>>(
+  ({ className, ...props }, ref) => {
+    return (
+      <textarea
+        className={cn(
+          'flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
+          className
+        )}
+        ref={ref}
+        {...props}
+      />
+    );
+  }
+);
+Textarea.displayName = 'Textarea';
+
+export { Textarea };

package/templates/nextjs/base/src/components/ui/tooltip.tsx

@@ -1,32 +1,32 @@
-'use client';
-
-import * as React from 'react';
-import * as TooltipPrimitive from '@radix-ui/react-tooltip';
-
-import { cn } from '@/core/lib/utils';
-
-const TooltipProvider = TooltipPrimitive.Provider;
-
-const Tooltip = TooltipPrimitive.Root;
-
-const TooltipTrigger = TooltipPrimitive.Trigger;
-
-const TooltipContent = React.forwardRef<
-  React.ElementRef<typeof TooltipPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
->(({ className, sideOffset = 4, ...props }, ref) => (
-  <TooltipPrimitive.Portal>
-    <TooltipPrimitive.Content
-      ref={ref}
-      sideOffset={sideOffset}
-      className={cn(
-        'z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-        className
-      )}
-      {...props}
-    />
-  </TooltipPrimitive.Portal>
-));
-TooltipContent.displayName = TooltipPrimitive.Content.displayName;
-
-export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };
+'use client';
+
+import * as React from 'react';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+
+import { cn } from '@/core/lib/utils';
+
+const TooltipProvider = TooltipPrimitive.Provider;
+
+const Tooltip = TooltipPrimitive.Root;
+
+const TooltipTrigger = TooltipPrimitive.Trigger;
+
+const TooltipContent = React.forwardRef<
+  React.ElementRef<typeof TooltipPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
+>(({ className, sideOffset = 4, ...props }, ref) => (
+  <TooltipPrimitive.Portal>
+    <TooltipPrimitive.Content
+      ref={ref}
+      sideOffset={sideOffset}
+      className={cn(
+        'z-50 overflow-hidden rounded-md border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
+        className
+      )}
+      {...props}
+    />
+  </TooltipPrimitive.Portal>
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/templates/nextjs/base/src/core/hooks/use-cart-page.ts

@@ -1,58 +1,58 @@
-'use client';
-
-import { useEffect, useState } from 'react';
-import type {
-  Cart,
-  CartRecommendationsResponse,
-  CartUpgradesResponse,
-  CartBundlesResponse,
-} from 'brainerce';
-import { getClient } from '@/core/lib/brainerce';
-import { useCart } from '@/core/providers/store-provider';
-
-export interface UseCartPageResult {
-  cart: Cart | null;
-  cartLoading: boolean;
-  refreshCart: () => Promise<void>;
-  itemCount: number;
-  /** Cross-sell recommendations for the current cart contents. */
-  cartRecs: CartRecommendationsResponse | null;
-  /** Per-item upgrade suggestions keyed by productId. */
-  upgrades: CartUpgradesResponse | null;
-  /** Bundle offers matching the current cart. */
-  bundles: CartBundlesResponse | null;
-}
-
-/**
- * Cart-page behavior: the shared cart state (from StoreProvider) plus the
- * enrichment fetch (recommendations / upgrades / bundles) that runs whenever
- * the cart contents change. Pure data/behavior — rendering lives in
- * `ui/cart/cart-view.tsx`.
- */
-export function useCartPage(): UseCartPageResult {
-  const { cart, cartLoading, refreshCart, itemCount } = useCart();
-  const [cartRecs, setCartRecs] = useState<CartRecommendationsResponse | null>(null);
-  const [upgrades, setUpgrades] = useState<CartUpgradesResponse | null>(null);
-  const [bundles, setBundles] = useState<CartBundlesResponse | null>(null);
-
-  // Load recommendations, upgrades, and bundles in a single request
-  useEffect(() => {
-    if (!cart?.id || cart.items.length === 0) {
-      setCartRecs(null);
-      setUpgrades(null);
-      setBundles(null);
-      return;
-    }
-    const client = getClient();
-    client
-      .getCart(cart.id, { include: ['recommendations', 'upgrades', 'bundles'] })
-      .then((enriched) => {
-        setCartRecs(enriched.recommendations ?? null);
-        setUpgrades(enriched.upgrades ?? null);
-        setBundles(enriched.bundles ?? null);
-      })
-      .catch(() => {});
-  }, [cart?.id, cart?.items.length]);
-
-  return { cart, cartLoading, refreshCart, itemCount, cartRecs, upgrades, bundles };
-}
+'use client';
+
+import { useEffect, useState } from 'react';
+import type {
+  Cart,
+  CartRecommendationsResponse,
+  CartUpgradesResponse,
+  CartBundlesResponse,
+} from 'brainerce';
+import { getClient } from '@/core/lib/brainerce';
+import { useCart } from '@/core/providers/store-provider';
+
+export interface UseCartPageResult {
+  cart: Cart | null;
+  cartLoading: boolean;
+  refreshCart: () => Promise<void>;
+  itemCount: number;
+  /** Cross-sell recommendations for the current cart contents. */
+  cartRecs: CartRecommendationsResponse | null;
+  /** Per-item upgrade suggestions keyed by productId. */
+  upgrades: CartUpgradesResponse | null;
+  /** Bundle offers matching the current cart. */
+  bundles: CartBundlesResponse | null;
+}
+
+/**
+ * Cart-page behavior: the shared cart state (from StoreProvider) plus the
+ * enrichment fetch (recommendations / upgrades / bundles) that runs whenever
+ * the cart contents change. Pure data/behavior — rendering lives in
+ * `ui/cart/cart-view.tsx`.
+ */
+export function useCartPage(): UseCartPageResult {
+  const { cart, cartLoading, refreshCart, itemCount } = useCart();
+  const [cartRecs, setCartRecs] = useState<CartRecommendationsResponse | null>(null);
+  const [upgrades, setUpgrades] = useState<CartUpgradesResponse | null>(null);
+  const [bundles, setBundles] = useState<CartBundlesResponse | null>(null);
+
+  // Load recommendations, upgrades, and bundles in a single request
+  useEffect(() => {
+    if (!cart?.id || cart.items.length === 0) {
+      setCartRecs(null);
+      setUpgrades(null);
+      setBundles(null);
+      return;
+    }
+    const client = getClient();
+    client
+      .getCart(cart.id, { include: ['recommendations', 'upgrades', 'bundles'] })
+      .then((enriched) => {
+        setCartRecs(enriched.recommendations ?? null);
+        setUpgrades(enriched.upgrades ?? null);
+        setBundles(enriched.bundles ?? null);
+      })
+      .catch(() => {});
+  }, [cart?.id, cart?.items.length]);
+
+  return { cart, cartLoading, refreshCart, itemCount, cartRecs, upgrades, bundles };
+}

package/templates/nextjs/base/src/core/hooks/use-home-data.ts

@@ -1,51 +1,51 @@
-'use client';
-
-import { useEffect, useState } from 'react';
-import type { Product, DiscountBanner } from 'brainerce';
-import { getClient } from '@/core/lib/brainerce';
-
-export interface UseHomeDataResult {
-  /** Newest products for the featured grid (max 8). */
-  products: Product[];
-  /** Active store-wide discount banners. */
-  banners: DiscountBanner[];
-  /** True while the initial fetch is in flight. */
-  loading: boolean;
-}
-
-/**
- * Homepage data: featured products + discount banners.
- * Pure data/behavior — rendering lives in `ui/home/`.
- */
-export function useHomeData(): UseHomeDataResult {
-  const [products, setProducts] = useState<Product[]>([]);
-  const [banners, setBanners] = useState<DiscountBanner[]>([]);
-  const [loading, setLoading] = useState(true);
-
-  useEffect(() => {
-    async function load() {
-      try {
-        const client = getClient();
-        const [productsRes, bannersRes] = await Promise.allSettled([
-          client.getProducts({ limit: 8, sortBy: 'createdAt', sortOrder: 'desc' }),
-          client.getDiscountBanners(),
-        ]);
-
-        if (productsRes.status === 'fulfilled') {
-          setProducts(productsRes.value.data);
-        }
-        if (bannersRes.status === 'fulfilled') {
-          setBanners(bannersRes.value);
-        }
-      } catch (err) {
-        console.error('Failed to load home page data:', err);
-      } finally {
-        setLoading(false);
-      }
-    }
-
-    load();
-  }, []);
-
-  return { products, banners, loading };
-}
+'use client';
+
+import { useEffect, useState } from 'react';
+import type { Product, DiscountBanner } from 'brainerce';
+import { getClient } from '@/core/lib/brainerce';
+
+export interface UseHomeDataResult {
+  /** Newest products for the featured grid (max 8). */
+  products: Product[];
+  /** Active store-wide discount banners. */
+  banners: DiscountBanner[];
+  /** True while the initial fetch is in flight. */
+  loading: boolean;
+}
+
+/**
+ * Homepage data: featured products + discount banners.
+ * Pure data/behavior — rendering lives in `ui/home/`.
+ */
+export function useHomeData(): UseHomeDataResult {
+  const [products, setProducts] = useState<Product[]>([]);
+  const [banners, setBanners] = useState<DiscountBanner[]>([]);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    async function load() {
+      try {
+        const client = getClient();
+        const [productsRes, bannersRes] = await Promise.allSettled([
+          client.getProducts({ limit: 8, sortBy: 'createdAt', sortOrder: 'desc' }),
+          client.getDiscountBanners(),
+        ]);
+
+        if (productsRes.status === 'fulfilled') {
+          setProducts(productsRes.value.data);
+        }
+        if (bannersRes.status === 'fulfilled') {
+          setBanners(bannersRes.value);
+        }
+      } catch (err) {
+        console.error('Failed to load home page data:', err);
+      } finally {
+        setLoading(false);
+      }
+    }
+
+    load();
+  }, []);
+
+  return { products, banners, loading };
+}