@cimplify/sdk 0.44.34 → 0.45.0

package/templates/storefront-retail/.cursor/rules/cimplify-storefront.mdc

@@ -1,25 +0,0 @@
----
-description: Cimplify storefront — architectural rules and rebrand contract for a project scaffolded from `bunx @cimplify/sdk init`. Triggers when files like lib/brand.ts, app/globals.css, components/header.tsx, or .cimplify/project.json are in the workspace.
-globs: ["lib/brand.ts", "app/**", "components/**", ".env.local", "next.config.ts"]
-alwaysApply: true
----
-
-# Cimplify storefront
-
-This project was scaffolded from a Cimplify template. Read `AGENTS.md` at the project root for the file ↔ `brand.X` field map and `.claude/skills/cimplify-storefront/SKILL.md` for the full playbook.
-
-## The contract
-
-1. **`lib/brand.ts`** — every visible string. If something isn't there, add a field to the `Brand` interface; don't hardcode.
-2. **`app/globals.css` `@theme` block** — palette, radius, font references.
-3. **Server Components are cached** via `'use cache'` + `cacheTag(tags.X())` + `cacheLife("hours")`. Don't downgrade to client to silence a warning.
-4. **Client islands** behind `<Suspense>`.
-5. **`cacheComponents: true`** in `next.config.ts` is non-negotiable.
-6. Use **`bun run test:run`** (vitest), not `bun test`.
-
-## Don't
-
-- Hardcode visible strings in pages/components.
-- Use `unstable_cache` (Next 16 uses `'use cache'`).
-- Bypass `getServerClient()` (loses per-request memoization).
-- Mutate without calling the matching `revalidate*` helper from `@cimplify/sdk/server`.

package/templates/storefront-retail/.env.example

@@ -1,16 +0,0 @@
-# Cimplify API base URL.
-# Dev: leave empty so the SDK uses the current origin (localhost:3000),
-# which Next.js rewrites to the mock at 127.0.0.1:8787 (see next.config.ts).
-# Production: set to your Cimplify host (e.g. https://api.cimplify.io).
-NEXT_PUBLIC_CIMPLIFY_API_URL=
-
-# Tenant public key. The mock accepts any value.
-NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY=mock-dev
-
-# Business id used by the mock seed (retail: Currents Electronics).
-NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID=bus_currents_electronics
-
-# Canonical public site URL — used by sitemap.xml, robots.txt, llms.txt,
-# and OpenGraph metadata. Set this on production deploys (Vercel auto-injects
-# via VERCEL_URL but Next prefers an explicit value).
-NEXT_PUBLIC_SITE_URL=https://example.com

package/templates/storefront-retail/AGENTS.md

@@ -1,117 +0,0 @@
-# AGENTS.md — Retail / electronics storefront template
-
-If you are an AI agent (Claude, Cursor, Aider, devin, …) working on this storefront, **start here.**
-
-## TL;DR for rebranding
-
-1. **Edit `lib/brand.ts`** — every visible string lives here.
-2. **Edit `app/globals.css`** — `@theme { … }` block for palette + radius + font references.
-3. **Edit `.env.local`** — `NEXT_PUBLIC_CIMPLIFY_API_URL`, `NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY`, `NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID`, `NEXT_PUBLIC_SITE_URL`.
-
-## Aesthetic
-
-- **Inter + JetBrains Mono** — clean modern sans, mono-spaced labels for spec-feel.
-- **Cool navy + electric blue**: dark foreground, electric primary.
-- **Sharp corners**: `0.5rem` — modern retail.
-- **Section heroes** in dark with mono-spaced eyebrow labels.
-
-## Page surface
-
-```
-app/
-  page.tsx                       Multi-section home — split hero, trust bar, category tiles,
-                                  promo banner, "Just dropped" grid, brand strip, collections,
-                                  trade-in CTA, best sellers, newsletter
-  shop/page.tsx                  SDK <CataloguePage/> with custom hero
-  search/page.tsx                Search (SDK <SearchPage/>)
-  collections/[slug]/page.tsx    Collection landing
-  categories/[slug]/page.tsx     Category landing
-  products/[slug]/page.tsx       Full product detail page (Product JSON-LD)
-
-  cart/page.tsx                  SDK <CartPage/>
-  checkout/page.tsx              SDK <CheckoutPage/>
-  orders/[id]/page.tsx           Post-checkout confirmation
-
-  account/page.tsx               <CimplifyAccount /> (iframe)
-  account/orders/page.tsx        <CimplifyAccount section="orders" />
-  account/addresses/page.tsx     <CimplifyAccount section="addresses" />
-  account/settings/page.tsx      <CimplifyAccount section="settings" />
-  login/page.tsx, signup/page.tsx  redirects → /account
-
-  contact/page.tsx               Branded contact form
-  track-order/page.tsx           Guest lookup → /orders/[id]
-
-  about/page.tsx, faq/page.tsx   Brand pages
-  shipping/page.tsx, returns/page.tsx, accessibility/page.tsx  Standalone policies
-  terms/page.tsx, privacy/page.tsx
-
-  sitemap-page/page.tsx          HTML sitemap
-  sitemap.ts, robots.ts          XML sitemap, robots.txt
-  llms.txt/route.ts              LLM-friendly site index
-  opensearch.xml/route.ts        Browser search description
-  error.tsx, not-found.tsx       Global boundaries
-```
-
-## File ↔ brand-field map
-
-| File | Reads from `brand` |
-|---|---|
-| `app/layout.tsx` | identity, contact, socials, schemaType (Store JSON-LD) |
-| `app/page.tsx` | `brand.hero`, `brand.trustItems`, `brand.brandStrip`, `brand.promo`, `brand.tradeIn`, `brand.newsletter` |
-| `app/about/page.tsx` | `brand.about` |
-| `app/faq/page.tsx` | `brand.faq` |
-| `app/terms/page.tsx` | `brand.terms` |
-| `app/privacy/page.tsx` | `brand.privacy` |
-| `app/shipping/page.tsx` | `brand.shipping` (warranty + returns + same-day delivery copy) |
-| `app/returns/page.tsx` | `brand.returns` |
-| `app/accessibility/page.tsx` | `brand.accessibility` |
-| `app/contact/page.tsx` | `brand.contactPage`, `brand.contact` |
-| `app/track-order/page.tsx` | `brand.trackOrder` |
-| `app/account/*/page.tsx` | `brand.account` (Cimplify Link iframe owns the UI) |
-| `app/products/[slug]/page.tsx` | `brand.name`, `brand.currency` (Product JSON-LD: brand, offer, availability) |
-| `app/llms.txt/route.ts` | `brand.llms`, contact, currency |
-| `app/opensearch.xml/route.ts` | `brand.shortName`, `brand.name` |
-| `components/header.tsx` | `brand.shortName`, `brand.microTag`, `brand.header.nav` |
-| `components/footer.tsx` | `brand.footer`, `brand.contact`, `brand.socials` |
-| `components/promo-banner.tsx` | `brand.promo` (renders nothing if absent) |
-| `components/trade-in-cta.tsx` | `brand.tradeIn` (renders nothing if absent) |
-| `components/brand-marquee.tsx` | `brand.brandStrip` |
-| `components/trust-bar.tsx` | `brand.trustItems` |
-| `components/newsletter.tsx` | `brand.newsletter` |
-
-## Retail-specific notes
-
-- Product detail is a **full `/products/[slug]` page** with image gallery, customizer, related products rail, and Product JSON-LD. Consideration purchases (phones, laptops, headphones) need real estate. Don't replace with a modal.
-- Schema.org `@type` is `Store`.
-- Optional sections render conditionally: set `brand.promo`, `brand.tradeIn`, `brand.trustItems`, or `brand.brandStrip` to `undefined` to hide them.
-- `app/page.tsx` uses an Unsplash fallback hero (`HERO_FALLBACK_IMAGE`) — replace with the merchant's own product photography.
-
-## Known TODOs
-
-- Contact form + newsletter signup currently fake their submit. Wire `client.support.sendMessage(...)` for contact and a real list provider for newsletter.
-- Trust-bar / brand-marquee imagery / wordmarks are placeholders — swap for the merchant's real partners.
-
-## Mock seed
-
-Wired to `--seed retail` (Currents Electronics). Edit `dev:mock` in `package.json` to preview another seed.
-
-## Customizing SDK components
-
-For anything beyond `lib/brand.ts` + `app/globals.css`, lean on the SDK's prebuilt components rather than reinvent. **Especially for product customization** (variants, add-ons, bundles, composites, services with scheduling) — the SDK already gets price math, axis matching, and cart payload contracts right. Default to ejecting and restyling:
-
-```bash
-bunx @cimplify/sdk add cart-drawer
-bunx @cimplify/sdk add variant-selector
-bunx @cimplify/sdk add product-page
-```
-
-Then edit the local copy. **Don't change the cart payload shape** unless you're also touching the SDK mock + backend lens. Full ejection rules and the customizer contract are in the SDK-level [`AGENTS.md`](../../AGENTS.md) → "Don't reinvent product customization".
-
-## Quick start
-
-```bash
-bun install
-bun dev
-```
-
-Open <http://localhost:3000>.

package/templates/storefront-retail/CLAUDE.md

@@ -1,22 +0,0 @@
-# CLAUDE.md
-
-This project was scaffolded from a Cimplify storefront template (`bunx @cimplify/sdk init`).
-
-## Read these first
-
-- **`AGENTS.md`** at the project root — the file ↔ `brand.X` field map for *this template's* industry, plus the architectural rules.
-- **`.claude/skills/cimplify-storefront/SKILL.md`** — the playbook for common tasks (rebrand, add a section, wire a Server Action, deploy, eject a component). Invoke it whenever you're asked to change content, palette, copy, or routing.
-
-## The two-line summary
-
-1. **Edit `lib/brand.ts`** for any visible string.
-2. **Edit `app/globals.css` `@theme` block** for any palette / radius / font change.
-
-That covers ~95% of what merchants ask for. For anything else, follow the `cimplify-storefront` skill.
-
-## Don't do
-
-- Hardcode strings in pages or components.
-- Disable `cacheComponents: true` in `next.config.ts`.
-- Use `unstable_cache` — Next 16's canonical primitive is `'use cache'`.
-- Run `bun test` (Bun's `vi` shim is incomplete) — use `bun run test:run`.

package/templates/storefront-retail/README.md

@@ -1,77 +0,0 @@
-# __STOREFRONT_NAME__
-
-A Cimplify storefront scaffolded from the **retail** template — Next.js 16 (App Router), React 19, Tailwind v4. Cool navy + electric blue palette, Inter + JetBrains Mono typography, modern electronics-store aesthetic.
-
-## Run
-
-```bash
-bun install
-bun dev
-```
-
-Two things start in parallel:
-
-- `bunx @cimplify/sdk --seed retail` — the Cimplify mock API on `http://127.0.0.1:8787`, seeded with Currents Electronics.
-- `next dev` — this storefront on `http://localhost:3000`.
-
-Open the storefront in your browser. Edit `app/page.tsx` to start customising.
-
-## Structure
-
-```
-app/
-  layout.tsx              # root layout, fonts, providers, header/footer/modal
-  page.tsx                # home
-  shop/page.tsx           # full catalogue (SDK <CataloguePage/>)
-  collections/[slug]/     # collection landing
-  categories/[slug]/      # category landing
-  cart/page.tsx           # SDK <CartPage/>
-  checkout/page.tsx       # SDK <CheckoutPage/>
-  orders/[id]/page.tsx    # post-checkout thank-you
-  about, faq, terms, privacy
-  globals.css             # Tailwind import + theme tokens
-components/
-  providers.tsx           # CimplifyProvider client wrapper
-  header.tsx, footer.tsx, hero.tsx
-  store-product-card.tsx  # SDK <ProductCard/> wired to URL-driven modal
-  product-modal.tsx       # ?product=<slug> deep-linkable modal
-  collection-strip.tsx    # horizontal product strip
-  category-grid.tsx       # SDK <CategoryGrid/> with router navigation
-lib/
-  cart.ts                 # useCartCount() for the header pill
-```
-
-## Switch the seed
-
-This template is wired to the `retail` seed. To preview a different industry without re-scaffolding:
-
-```bash
-bunx @cimplify/sdk --seed restaurant   # Mama's Kitchen
-bunx @cimplify/sdk --seed services     # Serene Spa
-bunx @cimplify/sdk --seed grocery      # FreshMart
-```
-
-Update `NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID` in `.env.local` to match the seeded business.
-
-For a fresh scaffold with another design altogether:
-
-```bash
-bunx @cimplify/sdk init my-store --template bakery     # warm food/pastry
-bunx @cimplify/sdk init my-store --template restaurant # coming soon
-bunx @cimplify/sdk init my-store --template services   # coming soon
-bunx @cimplify/sdk init my-store --template grocery    # coming soon
-```
-
-## Go live
-
-```diff
-# .env.local
-- NEXT_PUBLIC_CIMPLIFY_API_URL=http://127.0.0.1:8787
-+ NEXT_PUBLIC_CIMPLIFY_API_URL=https://api.cimplify.io
-- NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY=mock-dev
-+ NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY=<your tenant key>
-- NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID=bus_currents_electronics
-+ NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID=<your business id>
-```
-
-Deploy to Vercel with one click — `next.config.ts` already whitelists the SDK image hosts under `images.remotePatterns`.

package/templates/storefront-retail/__tests__/brand.test.ts

@@ -1,4 +0,0 @@
-import { createBrandSuite } from "@cimplify/sdk/testing/suite";
-import { brand } from "../lib/brand";
-
-createBrandSuite({ brand });

package/templates/storefront-retail/__tests__/cart-flow.test.ts

@@ -1,4 +0,0 @@
-import { createCartFlowSuite } from "@cimplify/sdk/testing/suite";
-import { brand } from "../lib/brand";
-
-createCartFlowSuite({ seed: brand.mock.seed, businessId: brand.mock.businessId });

package/templates/storefront-retail/__tests__/contract.test.ts

@@ -1,4 +0,0 @@
-import { createContractSuite } from "@cimplify/sdk/testing/suite";
-import { brand } from "../lib/brand";
-
-createContractSuite({ seed: brand.mock.seed });

package/templates/storefront-retail/app/about/page.tsx

@@ -1,41 +0,0 @@
-import type { Metadata } from "next";
-import { brand } from "@/lib/brand";
-
-export const metadata: Metadata = {
-  title: `About — ${brand.name}`,
-  description: brand.description,
-};
-
-export default function AboutPage() {
-  const a = brand.about;
-  // Title supports a single \n for a hard line break.
-  const titleParts = a.title.split("\n");
-  return (
-    <article className="max-w-3xl mx-auto px-8 py-16">
-      <p className="text-[11px] font-mono uppercase tracking-[0.16em] text-primary mb-2">
-        {a.eyebrow}
-      </p>
-      <h1 className="text-[clamp(2.25rem,5vw,3.5rem)] font-bold mb-6 -tracking-[0.025em] leading-tight">
-        {titleParts.map((line, i) => (
-          <span key={i}>
-            {line}
-            {i < titleParts.length - 1 && <br />}
-          </span>
-        ))}
-      </h1>
-      <div className="prose prose-lg max-w-none space-y-5 text-foreground/90 leading-relaxed">
-        {a.paragraphs.map((p, i) => (
-          <p key={i}>{p}</p>
-        ))}
-        {a.sections.map((s) => (
-          <div key={s.heading}>
-            <h2 className="text-2xl font-semibold mt-10 mb-3 -tracking-[0.02em]">
-              {s.heading}
-            </h2>
-            <p>{s.body}</p>
-          </div>
-        ))}
-      </div>
-    </article>
-  );
-}

package/templates/storefront-retail/app/accessibility/page.tsx

@@ -1,11 +0,0 @@
-import type { Metadata } from "next";
-import { brand } from "@/lib/brand";
-import { PolicyPage } from "@/components/policy-page";
-
-export const metadata: Metadata = {
-  title: `${brand.accessibility.title} — ${brand.name}`,
-};
-
-export default function AccessibilityPage() {
-  return <PolicyPage policy={brand.accessibility} />;
-}

package/templates/storefront-retail/app/account/addresses/page.tsx

@@ -1,21 +0,0 @@
-import type { Metadata } from "next";
-import { AccountIframe } from "@/components/account-iframe";
-import { brand } from "@/lib/brand";
-
-export const metadata: Metadata = {
-  title: `Addresses — ${brand.name}`,
-};
-
-export default function AddressesPage() {
-  return (
-    <article className="max-w-5xl mx-auto px-6 sm:px-8 py-12">
-      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
-        Account
-      </p>
-      <h1 className="font-serif text-[clamp(2rem,4vw,2.75rem)] font-semibold mb-8 -tracking-[0.02em]">
-        Your addresses
-      </h1>
-      <AccountIframe section="addresses" />
-    </article>
-  );
-}

package/templates/storefront-retail/app/account/orders/page.tsx

@@ -1,21 +0,0 @@
-import type { Metadata } from "next";
-import { AccountIframe } from "@/components/account-iframe";
-import { brand } from "@/lib/brand";
-
-export const metadata: Metadata = {
-  title: `Orders — ${brand.name}`,
-};
-
-export default function OrdersPage() {
-  return (
-    <article className="max-w-5xl mx-auto px-6 sm:px-8 py-12">
-      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
-        Account
-      </p>
-      <h1 className="font-serif text-[clamp(2rem,4vw,2.75rem)] font-semibold mb-8 -tracking-[0.02em]">
-        Your orders
-      </h1>
-      <AccountIframe section="orders" />
-    </article>
-  );
-}

package/templates/storefront-retail/app/account/page.tsx

@@ -1,22 +0,0 @@
-import type { Metadata } from "next";
-import { AccountIframe } from "@/components/account-iframe";
-import { brand } from "@/lib/brand";
-
-export const metadata: Metadata = {
-  title: `Account — ${brand.name}`,
-  description: brand.account.signupSubtitle,
-};
-
-export default function AccountPage() {
-  return (
-    <article className="max-w-5xl mx-auto px-6 sm:px-8 py-12">
-      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
-        {brand.account.accountEyebrow}
-      </p>
-      <h1 className="font-serif text-[clamp(2rem,4vw,2.75rem)] font-semibold mb-8 -tracking-[0.02em]">
-        {brand.account.accountTitle}
-      </h1>
-      <AccountIframe />
-    </article>
-  );
-}

package/templates/storefront-retail/app/account/settings/page.tsx

@@ -1,21 +0,0 @@
-import type { Metadata } from "next";
-import { AccountIframe } from "@/components/account-iframe";
-import { brand } from "@/lib/brand";
-
-export const metadata: Metadata = {
-  title: `Settings — ${brand.name}`,
-};
-
-export default function SettingsPage() {
-  return (
-    <article className="max-w-5xl mx-auto px-6 sm:px-8 py-12">
-      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
-        Account
-      </p>
-      <h1 className="font-serif text-[clamp(2rem,4vw,2.75rem)] font-semibold mb-8 -tracking-[0.02em]">
-        Settings
-      </h1>
-      <AccountIframe section="settings" />
-    </article>
-  );
-}

package/templates/storefront-retail/app/cart/page.tsx

@@ -1,9 +0,0 @@
-"use client";
-
-import { useRouter } from "next/navigation";
-import { CartPage as SdkCartPage } from "@cimplify/sdk/react";
-
-export default function CartPage() {
-  const router = useRouter();
-  return <SdkCartPage onCheckout={() => router.push("/checkout")} />;
-}

package/templates/storefront-retail/app/categories/[slug]/listing-client.tsx

@@ -1,19 +0,0 @@
-"use client";
-
-import { ProductGrid } from "@cimplify/sdk/react";
-import type { Product } from "@cimplify/sdk";
-import { StoreProductCard } from "@/components/store-product-card";
-
-/**
- * Client island for the category listing. Receives server-fetched products
- * as props (serializable) and owns the `renderCard` function.
- */
-export function ListingClient({ products }: { products: Product[] }) {
-  return (
-    <ProductGrid
-      products={products}
-      emptyMessage="No products in this category yet."
-      renderCard={(p) => <StoreProductCard product={p} />}
-    />
-  );
-}

package/templates/storefront-retail/app/categories/[slug]/page.tsx

@@ -1,130 +0,0 @@
-import type { Metadata } from "next";
-import { Suspense } from "react";
-import Link from "next/link";
-import { notFound } from "next/navigation";
-import { cacheTag, cacheLife } from "next/cache";
-import {
-  getServerClient,
-  tags,
-  type Category,
-  type Product,
-} from "@cimplify/sdk/server";
-import { ListingClient } from "./listing-client";
-import { brand } from "@/lib/brand";
-
-interface CategoryData {
-  category: Category;
-  products: Product[];
-}
-
-async function getCategory(slug: string): Promise<CategoryData | null> {
-  "use cache";
-  cacheTag(tags.categories());
-  cacheLife("hours");
-
-  const client = getServerClient();
-  const catRes = await client.catalogue.getCategoryBySlug(slug);
-  if (!catRes.ok) return null;
-
-  cacheTag(tags.category(catRes.value.id), tags.categoryProducts(catRes.value.id));
-  const r = await client.catalogue.getCategoryProducts(catRes.value.id);
-  const products = r.ok
-    ? ((r.value as { items?: Product[] }).items ?? (r.value as Product[]))
-    : [];
-  return { category: catRes.value, products };
-}
-
-export async function generateMetadata({
-  params,
-}: {
-  params: Promise<{ slug: string }>;
-}): Promise<Metadata> {
-  const { slug } = await params;
-  const data = await getCategory(slug);
-  if (!data) return {};
-  return {
-    title: `${data.category.name} — ${brand.name}`,
-    description: data.category.description ?? undefined,
-  };
-}
-
-export default async function CategoryPage({
-  params,
-}: {
-  params: Promise<{ slug: string }>;
-}) {
-  return (
-    <Suspense fallback={<CategorySkeleton />}>
-      <CategoryContent params={params} />
-    </Suspense>
-  );
-}
-
-async function CategoryContent({
-  params,
-}: {
-  params: Promise<{ slug: string }>;
-}) {
-  const { slug } = await params;
-  const data = await getCategory(slug);
-  if (!data) notFound();
-
-  const { category, products } = data;
-  return (
-    <>
-      <section className="bg-foreground text-background relative overflow-hidden">
-        <div className="absolute inset-0 opacity-[0.04] pointer-events-none [background-image:radial-gradient(circle_at_2px_2px,white_1px,transparent_0)] [background-size:32px_32px]" />
-        <div className="relative max-w-7xl mx-auto px-6 sm:px-8 py-12 sm:py-14">
-          <nav className="text-[12px] font-mono text-background/60 mb-3 flex items-center gap-2">
-            <Link href="/" className="hover:text-background transition-colors">Home</Link>
-            <span>/</span>
-            <Link href="/shop" className="hover:text-background transition-colors">Shop</Link>
-            <span>/</span>
-            <span className="text-background/90">{category.name}</span>
-          </nav>
-          <h1 className="text-[clamp(2rem,4vw,3rem)] font-bold m-0 -tracking-[0.025em]">
-            {category.name}
-          </h1>
-          {category.description && (
-            <p className="mt-3 max-w-2xl text-base text-background/75">
-              {category.description}
-            </p>
-          )}
-          <p className="mt-4 text-[11px] font-mono uppercase tracking-[0.16em] text-background/60 tabular-nums">
-            {products.length} {products.length === 1 ? "product" : "products"}
-          </p>
-        </div>
-      </section>
-      <section className="max-w-7xl mx-auto px-6 sm:px-8 py-10 sm:py-12">
-        <ListingClient products={products} />
-        {products.length === 0 && (
-          <p className="text-center mt-8">
-            <Link href="/shop" className="text-primary font-semibold hover:underline">
-              ← Browse all products
-            </Link>
-          </p>
-        )}
-      </section>
-    </>
-  );
-}
-
-function CategorySkeleton() {
-  return (
-    <>
-      <section className="bg-foreground py-12 sm:py-14">
-        <div className="max-w-7xl mx-auto px-6 sm:px-8">
-          <div className="h-3 w-32 bg-background/20 rounded mb-3 animate-pulse" />
-          <div className="h-12 w-72 bg-background/20 rounded animate-pulse" />
-        </div>
-      </section>
-      <section className="max-w-7xl mx-auto px-6 sm:px-8 py-10 sm:py-12">
-        <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-3 sm:gap-4">
-          {Array.from({ length: 8 }).map((_, i) => (
-            <div key={i} className="aspect-[4/3] bg-muted rounded-2xl animate-pulse" />
-          ))}
-        </div>
-      </section>
-    </>
-  );
-}

package/templates/storefront-retail/app/checkout/page.tsx

@@ -1,17 +0,0 @@
-"use client";
-
-import { useRouter } from "next/navigation";
-import { CheckoutPage as SdkCheckoutPage } from "@cimplify/sdk/react";
-
-export default function CheckoutPage() {
-  const router = useRouter();
-  return (
-    <SdkCheckoutPage
-      onComplete={(result) => {
-        if (result.success && result.order) {
-          router.push(`/orders/${result.order.id}`);
-        }
-      }}
-    />
-  );
-}

package/templates/storefront-retail/app/collections/[slug]/listing-client.tsx

@@ -1,20 +0,0 @@
-"use client";
-
-import { ProductGrid } from "@cimplify/sdk/react";
-import type { Product } from "@cimplify/sdk";
-import { StoreProductCard } from "@/components/store-product-card";
-
-/**
- * Client island for the collection listing. Receives server-fetched
- * products as props (serializable) and owns the `renderCard` function
- * (which can't cross the server/client boundary).
- */
-export function ListingClient({ products }: { products: Product[] }) {
-  return (
-    <ProductGrid
-      products={products}
-      emptyMessage="No products in this collection yet."
-      renderCard={(p) => <StoreProductCard product={p} />}
-    />
-  );
-}