@cimplify/sdk 0.41.0 → 0.42.1

package/templates/storefront-restaurant/app/signup/page.tsx

@@ -0,0 +1,17 @@
+import type { Metadata } from "next";
+import { redirect } from "next/navigation";
+import { brand } from "@/lib/brand";
+
+export const metadata: Metadata = {
+  title: `Create an account — ${brand.name}`,
+  description: brand.account.signupSubtitle,
+};
+
+/**
+ * Cimplify Link handles sign-up inside the `<CimplifyAccount>` iframe.
+ * We bounce /signup to /account; the iframe shows the create-account UI
+ * for visitors with no session.
+ */
+export default function SignupPage(): never {
+  redirect("/account");
+}

package/templates/storefront-restaurant/app/sitemap-page/page.tsx

@@ -0,0 +1,167 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import { cacheTag, cacheLife } from "next/cache";
+import { getServerClient, tags, type Product } from "@cimplify/sdk/server";
+import { brand } from "@/lib/brand";
+
+export const metadata: Metadata = {
+  title: `Sitemap — ${brand.name}`,
+  description: "A human-readable index of every page on this site.",
+};
+
+interface SitemapData {
+  products: { slug: string; name: string }[];
+  categories: { slug: string; name: string }[];
+  collections: { slug: string; name: string }[];
+}
+
+async function getSitemap(): Promise<SitemapData> {
+  "use cache";
+  cacheTag(tags.products(), tags.categories(), tags.collections());
+  cacheLife("hours");
+
+  const client = getServerClient();
+  const [pRes, cRes, colRes] = await Promise.all([
+    client.catalogue.getProducts({ limit: 500 }),
+    client.catalogue.getCategories(),
+    client.catalogue.getCollections(),
+  ]);
+  return {
+    products: (pRes.ok ? pRes.value.items : []).map((p: Product) => ({
+      slug: p.slug ?? p.id,
+      name: p.name,
+    })),
+    categories: (cRes.ok ? cRes.value : []).map((c) => ({ slug: c.slug, name: c.name })),
+    collections: (colRes.ok ? colRes.value : []).map((c) => ({ slug: c.slug, name: c.name })),
+  };
+}
+
+const STATIC_LINKS: { title: string; links: { href: string; label: string }[] }[] = [
+  {
+    title: "Browse",
+    links: [
+      { href: "/", label: "Home" },
+      { href: "/shop", label: "Shop" },
+      { href: "/search", label: "Search" },
+    ],
+  },
+  {
+    title: "Account",
+    links: [
+      { href: "/account", label: "Account" },
+      { href: "/account/orders", label: "Orders" },
+      { href: "/account/addresses", label: "Addresses" },
+      { href: "/account/settings", label: "Settings" },
+      { href: "/login", label: "Sign in" },
+      { href: "/signup", label: "Create account" },
+      { href: "/track-order", label: "Track an order" },
+      { href: "/cart", label: "Cart" },
+      { href: "/checkout", label: "Checkout" },
+    ],
+  },
+  {
+    title: "About",
+    links: [
+      { href: "/about", label: "About" },
+      { href: "/faq", label: "FAQ" },
+      { href: "/contact", label: "Contact" },
+    ],
+  },
+  {
+    title: "Policies",
+    links: [
+      { href: "/shipping", label: "Shipping" },
+      { href: "/returns", label: "Returns" },
+      { href: "/accessibility", label: "Accessibility" },
+      { href: "/terms", label: "Terms of Service" },
+      { href: "/privacy", label: "Privacy Policy" },
+    ],
+  },
+  {
+    title: "Machine-readable",
+    links: [
+      { href: "/sitemap.xml", label: "sitemap.xml (search engines)" },
+      { href: "/llms.txt", label: "llms.txt (LLM agents)" },
+      { href: "/robots.txt", label: "robots.txt" },
+      { href: "/opensearch.xml", label: "opensearch.xml (browser search)" },
+    ],
+  },
+];
+
+export default async function SitemapHtmlPage() {
+  const { products, categories, collections } = await getSitemap();
+
+  return (
+    <article className="max-w-5xl mx-auto px-6 sm:px-8 py-16">
+      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
+        Sitemap
+      </p>
+      <h1 className="text-[clamp(2rem,4vw,2.75rem)] font-semibold mb-2 -tracking-[0.02em]">
+        Every page, in one place.
+      </h1>
+      <p className="text-muted-foreground mb-12">
+        For search engines, see <Link href="/sitemap.xml" className="text-primary hover:underline">/sitemap.xml</Link>.
+        For LLM agents, see <Link href="/llms.txt" className="text-primary hover:underline">/llms.txt</Link>.
+      </p>
+      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-10">
+        {STATIC_LINKS.map((s) => (
+          <Section key={s.title} title={s.title}>
+            {s.links.map((l) => (
+              <li key={l.href}>
+                <Link href={l.href} className="hover:text-primary transition-colors">
+                  {l.label}
+                </Link>
+              </li>
+            ))}
+          </Section>
+        ))}
+        {categories.length > 0 && (
+          <Section title="Categories">
+            {categories.map((c) => (
+              <li key={c.slug}>
+                <Link href={`/categories/${c.slug}`} className="hover:text-primary transition-colors">
+                  {c.name}
+                </Link>
+              </li>
+            ))}
+          </Section>
+        )}
+        {collections.length > 0 && (
+          <Section title="Collections">
+            {collections.map((c) => (
+              <li key={c.slug}>
+                <Link href={`/collections/${c.slug}`} className="hover:text-primary transition-colors">
+                  {c.name}
+                </Link>
+              </li>
+            ))}
+          </Section>
+        )}
+        {products.length > 0 && (
+          <Section title={`Products (${products.length})`}>
+            {products.map((p) => (
+              <li key={p.slug}>
+                <Link href={`/shop?product=${encodeURIComponent(p.slug)}`} className="hover:text-primary transition-colors">
+                  {p.name}
+                </Link>
+              </li>
+            ))}
+          </Section>
+        )}
+      </div>
+    </article>
+  );
+}
+
+function Section({ title, children }: { title: string; children: React.ReactNode }) {
+  return (
+    <div>
+      <p className="font-semibold text-[12px] uppercase tracking-[0.12em] text-foreground mb-3">
+        {title}
+      </p>
+      <ul className="space-y-2 m-0 p-0 list-none text-sm text-muted-foreground">
+        {children}
+      </ul>
+    </div>
+  );
+}

package/templates/storefront-restaurant/app/track-order/page.tsx

@@ -0,0 +1,24 @@
+import type { Metadata } from "next";
+import { TrackOrderForm } from "./track-order-form";
+import { brand } from "@/lib/brand";
+
+export const metadata: Metadata = {
+  title: `Track an order — ${brand.name}`,
+  description: brand.trackOrder.body,
+};
+
+export default function TrackOrderPage() {
+  const t = brand.trackOrder;
+  return (
+    <article className="max-w-2xl mx-auto px-6 sm:px-8 py-16">
+      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2">
+        {t.eyebrow}
+      </p>
+      <h1 className="font-serif text-[clamp(2rem,5vw,3rem)] font-semibold mb-4 -tracking-[0.02em]">
+        {t.title}
+      </h1>
+      <p className="text-muted-foreground leading-relaxed mb-8">{t.body}</p>
+      <TrackOrderForm />
+    </article>
+  );
+}

package/templates/storefront-restaurant/app/track-order/track-order-form.tsx

@@ -0,0 +1,69 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+
+/**
+ * Guest order tracker. Routes /orders/<id> with the entered id; the
+ * post-checkout confirmation page already lives at /orders/[id] so this
+ * just sends the visitor there. Replace the redirect with a real lookup
+ * (e.g. Cimplify orders API + email-match guard) for production.
+ */
+export function TrackOrderForm() {
+  const router = useRouter();
+  const [orderId, setOrderId] = useState("");
+  const [email, setEmail] = useState("");
+
+  return (
+    <form
+      onSubmit={(e) => {
+        e.preventDefault();
+        if (!orderId.trim()) return;
+        router.push(`/orders/${encodeURIComponent(orderId.trim())}`);
+      }}
+      className="space-y-4 rounded-2xl border border-border bg-card p-6"
+    >
+      <div>
+        <label
+          htmlFor="orderId"
+          className="text-xs font-semibold uppercase tracking-wider text-muted-foreground block mb-1.5"
+        >
+          Order number
+        </label>
+        <input
+          id="orderId"
+          name="orderId"
+          required
+          value={orderId}
+          onChange={(e) => setOrderId(e.target.value)}
+          placeholder="ord_abc123…"
+          className="w-full px-4 py-3 rounded-md bg-background border border-border focus:border-primary focus:ring-2 focus:ring-primary/20 outline-none text-sm"
+        />
+      </div>
+      <div>
+        <label
+          htmlFor="email"
+          className="text-xs font-semibold uppercase tracking-wider text-muted-foreground block mb-1.5"
+        >
+          Order email
+        </label>
+        <input
+          id="email"
+          name="email"
+          type="email"
+          required
+          value={email}
+          onChange={(e) => setEmail(e.target.value)}
+          placeholder="you@email.com"
+          className="w-full px-4 py-3 rounded-md bg-background border border-border focus:border-primary focus:ring-2 focus:ring-primary/20 outline-none text-sm"
+        />
+      </div>
+      <button
+        type="submit"
+        className="w-full inline-flex items-center justify-center px-5 py-3 rounded-md bg-primary text-primary-foreground font-semibold text-sm hover:bg-primary/90 transition-colors"
+      >
+        Track order
+      </button>
+    </form>
+  );
+}

package/templates/storefront-restaurant/components/account-iframe.tsx

@@ -0,0 +1,13 @@
+"use client";
+
+import { CimplifyAccount } from "@cimplify/sdk/react";
+
+/**
+ * Cimplify Account portal — iframe-mounted UI hosted by Cimplify Link.
+ * Handles sign-in, sign-up, OTP, addresses, payment methods, sessions,
+ * and order history. The iframe owns auth state; we just choose which
+ * `section` to land on.
+ */
+export function AccountIframe({ section }: { section?: string }) {
+  return <CimplifyAccount section={section} />;
+}

package/templates/storefront-restaurant/components/policy-page.tsx

@@ -0,0 +1,49 @@
+import type { BrandPolicySection } from "@/lib/brand";
+
+interface PolicyShape {
+  eyebrow: string;
+  title: string;
+  lastUpdated?: string;
+  sections: BrandPolicySection[];
+}
+
+/**
+ * Shared layout for shipping / returns / accessibility / terms / privacy.
+ * Reads a `{ eyebrow, title, lastUpdated, sections[] }` block from brand.
+ */
+export function PolicyPage({ policy }: { policy: PolicyShape }) {
+  return (
+    <article className="max-w-3xl mx-auto px-8 py-16 prose prose-lg max-w-none">
+      <p className="text-[11px] font-semibold uppercase tracking-[0.16em] text-primary mb-2 not-prose">
+        {policy.eyebrow}
+      </p>
+      <h1 className="text-[clamp(2.25rem,5vw,3.5rem)] font-semibold mb-2 -tracking-[0.02em]">
+        {policy.title}
+      </h1>
+      {policy.lastUpdated && (
+        <p className="text-sm text-muted-foreground not-prose mb-10">
+          Last updated: {policy.lastUpdated}
+        </p>
+      )}
+      <section className="space-y-5 leading-relaxed text-foreground/90">
+        {policy.sections.map((s) => (
+          <div key={s.heading}>
+            <h2 className="text-2xl font-semibold mt-0">{s.heading}</h2>
+            {typeof s.body === "string" ? (
+              <p>{s.body}</p>
+            ) : (
+              <>
+                <p>{s.body.intro}</p>
+                <ul className="list-disc pl-6 space-y-2">
+                  {s.body.bullets.map((b) => (
+                    <li key={b}>{b}</li>
+                  ))}
+                </ul>
+              </>
+            )}
+          </div>
+        ))}
+      </section>
+    </article>
+  );
+}

package/templates/storefront-restaurant/lib/brand.ts

@@ -58,6 +58,20 @@ export interface Brand {
   };
   terms: { eyebrow: string; title: string; lastUpdated: string; sections: BrandPolicySection[] };
   privacy: { eyebrow: string; title: string; lastUpdated: string; sections: BrandPolicySection[] };
+  shipping: { eyebrow: string; title: string; lastUpdated: string; sections: BrandPolicySection[] };
+  returns: { eyebrow: string; title: string; lastUpdated: string; sections: BrandPolicySection[] };
+  accessibility: { eyebrow: string; title: string; lastUpdated: string; sections: BrandPolicySection[] };
+  account: {
+    loginEyebrow: string; loginTitle: string; loginSubtitle: string;
+    signupEyebrow: string; signupTitle: string; signupSubtitle: string;
+    accountEyebrow: string; accountTitle: string;
+  };
+  contactPage: {
+    eyebrow: string; title: string; body: string;
+    reasons: string[];
+    directLines: { label: string; value: string; href: string }[];
+  };
+  trackOrder: { eyebrow: string; title: string; body: string };
   footer: {
     blurb: string; sitemap: BrandSitemapSection[];
     poweredBy?: { label: string; href: string };
@@ -232,6 +246,68 @@ export const brand: Brand = {
     ],
   },
 
+  shipping: {
+    eyebrow: "Delivery",
+    title: "Delivery & Pickup",
+    lastUpdated: "1 May 2026",
+    sections: [
+      { heading: "Greater Accra", body: "Same-day, 12pm–9pm Tue–Sun. Free over GH₵250; GH₵35 below. Typical 60-minute window from order." },
+      { heading: "Pickup", body: "Skip the queue: order ahead, pick a window, walk in. Free." },
+      { heading: "Catering & private events", body: "Off-site catering (12+ people) requires 5 days' notice. Email events@mamaskitchen.test." },
+    ],
+  },
+
+  returns: {
+    eyebrow: "Refunds",
+    title: "Refunds & Quality",
+    lastUpdated: "1 May 2026",
+    sections: [
+      { heading: "Quality guarantee", body: "If anything is wrong with your order — wrong dish, cold, off — message us within 2 hours and we'll replace, refund, or credit." },
+      { heading: "Reservation cancellations", body: "Free up to 4 hours before. Within 4 hours, parties of 6+ are charged GH₵60/cover for no-shows." },
+      { heading: "Custom event deposits", body: "Refundable up to 7 days before the event. Within 7 days, deposits are non-refundable." },
+    ],
+  },
+
+  accessibility: {
+    eyebrow: "Accessibility",
+    title: "Accessibility Statement",
+    lastUpdated: "1 May 2026",
+    sections: [
+      { heading: "In the dining room", body: "Step-free entrance, accessible bathroom, and a flat path from the curb. Service dogs welcome. We can move tables in advance — let us know at booking." },
+      { heading: "Online", body: "We aim for WCAG 2.1 AA on the website and test it on every release." },
+      { heading: "Reporting issues", body: "Email accessibility@mamaskitchen.test or call ahead — we respond within a business day." },
+    ],
+  },
+
+  account: {
+    loginEyebrow: "Welcome back",
+    loginTitle: "Sign in to Mama's",
+    loginSubtitle: "Pick up where you left off — orders, reservations, and your favourites.",
+    signupEyebrow: "Welcome",
+    signupTitle: "Create an account",
+    signupSubtitle: "Reorder in one tap, hold tables faster, and get first-look at the long-table evenings.",
+    accountEyebrow: "Your account",
+    accountTitle: "Welcome back",
+  },
+
+  contactPage: {
+    eyebrow: "Contact",
+    title: "Talk to the kitchen.",
+    body: "Reservation question, dietary need, private event — message us and we'll reply within a business day.",
+    reasons: ["Reservation question", "An order issue", "Dietary / allergens", "Private event", "Press / partnerships", "Something else"],
+    directLines: [
+      { label: "Email", value: "hello@mamaskitchen.test", href: "mailto:hello@mamaskitchen.test" },
+      { label: "Phone", value: "+233 244 200 100", href: "tel:+233244200100" },
+      { label: "WhatsApp", value: "+233 244 200 100", href: "https://wa.me/233244200100" },
+    ],
+  },
+
+  trackOrder: {
+    eyebrow: "Track an order",
+    title: "Where's my order?",
+    body: "Enter your order number and the email used at checkout. We'll show the kitchen status, the rider, and the live ETA.",
+  },
+
   footer: {
     blurb:
       "West African plates, prepared by our matriarchs, served family-style in East Legon. Dine in, take out, deliver.",
@@ -258,10 +334,20 @@ export const brand: Brand = {
       {
         title: "Help",
         links: [
-          { label: "Contact", href: "mailto:hello@mamaskitchen.test" },
+          { label: "Contact", href: "/contact" },
+          { label: "Track an order", href: "/track-order" },
+          { label: "Delivery", href: "/shipping" },
+          { label: "Refunds", href: "/returns" },
           { label: "FAQ", href: "/faq" },
-          { label: "Allergens", href: "/faq" },
-          { label: "Delivery", href: "/faq" },
+        ],
+      },
+      {
+        title: "Account",
+        links: [
+          { label: "Sign in", href: "/login" },
+          { label: "Create account", href: "/signup" },
+          { label: "Your orders", href: "/account/orders" },
+          { label: "Settings", href: "/account/settings" },
         ],
       },
       {
@@ -269,6 +355,8 @@ export const brand: Brand = {
         links: [
           { label: "Terms of Service", href: "/terms" },
           { label: "Privacy Policy", href: "/privacy" },
+          { label: "Accessibility", href: "/accessibility" },
+          { label: "Sitemap", href: "/sitemap-page" },
         ],
       },
     ],

package/templates/storefront-retail/AGENTS.md

@@ -4,39 +4,75 @@ If you are an AI agent (Claude, Cursor, Aider, devin, …) working on this store
 
 ## TL;DR for rebranding
 
-To rebrand this storefront end-to-end as a different merchant:
+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`.
 
-1. **Edit `lib/brand.ts`.** Every visible string reads from this file. Replace each field with the merchant's actual content.
-2. **Edit `app/globals.css`** — the `@theme { … }` block holds the design tokens (palette, radius, font references). Tweak to match the merchant's brand.
-3. **Edit `.env.local`** — set `NEXT_PUBLIC_CIMPLIFY_API_URL`, `NEXT_PUBLIC_CIMPLIFY_PUBLIC_KEY`, `NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID`, `NEXT_PUBLIC_SITE_URL`.
+## Aesthetic
 
-That is the entire rebrand. Do not modify any `.tsx` file in `app/` or `components/` for content changes — they are design-only and read from `brand`.
+- **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.
 
-## Rules
+## Page surface
 
-- ✅ All content edits → `lib/brand.ts`
-- ✅ All design-token edits → `app/globals.css` `@theme` block
-- ✅ Server Components stay cached via `'use cache'` + `cacheTag(tags.X())` + `cacheLife("hours")`
-- ✅ Client islands (header active link, cart pill, product card link) live behind `<Suspense>`
-- ❌ Don't hardcode strings. If a string isn't in `brand`, add a new field to the `Brand` interface.
-- ❌ Don't disable `cacheComponents: true` in `next.config.ts`.
-- ❌ Don't use `unstable_cache` — Next 16 uses the `'use cache'` directive.
+```
+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 map (what reads from where)
+## File ↔ brand-field map
 
 | File | Reads from `brand` |
 |---|---|
-| `app/layout.tsx` | metadata, OpenGraph, Organization JSON-LD |
+| `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/products/[slug]/page.tsx` | `brand.name`, `brand.currency` (Product JSON-LD) |
+| `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/not-found.tsx` | `brand.name` (page title) |
+| `app/opensearch.xml/route.ts` | `brand.shortName`, `brand.name` |
 | `components/header.tsx` | `brand.shortName`, `brand.microTag`, `brand.header.nav` |
-| `components/footer.tsx` | `brand.footer`, contact, socials |
+| `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` |
@@ -45,20 +81,25 @@ That is the entire rebrand. Do not modify any `.tsx` file in `app/` or `componen
 
 ## Retail-specific notes
 
-- Product detail is a **full `/products/[slug]` page** with image gallery, customizer, related products rail, and Product JSON-LD. This fits consideration-purchase electronics UX (specs, reviews, warranty). Do not replace with a modal.
-- Schema.org type is `Store`. Change in `lib/brand.ts` (`schemaType`) for a different industry.
-- Optional sections render conditionally: `brand.promo`, `brand.tradeIn`, `brand.trustItems`, `brand.brandStrip` — set to `undefined` to hide.
-- `app/page.tsx` uses Unsplash fallback hero image (`HERO_FALLBACK_IMAGE`) — replace with your own asset URL.
+- 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) via `package.json` `dev:mock`. To preview another seed, change the flag or run `bunx @cimplify/sdk --seed services` directly and update `NEXT_PUBLIC_CIMPLIFY_BUSINESS_ID` in `.env.local`.
+Wired to `--seed retail` (Currents Electronics). Edit `dev:mock` in `package.json` to preview another seed.
 
 ## Quick start
 
 ```bash
 bun install
-bun dev                 # boots mock + Next dev server
+bun dev
 ```
 
 Open <http://localhost:3000>.

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

@@ -0,0 +1,11 @@
+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

@@ -0,0 +1,21 @@
+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

@@ -0,0 +1,21 @@
+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>
+  );
+}