Category Preview

import { CategoryPreview } from "@/components/email/category-preview";
import { defaultTheme } from "@/components/email/theme-default";

export function CategoryPreviewDemo() {
  return (
    <CategoryPreview
      layout="cards"
      detailLevel="name"
      theme={{ ...defaultTheme, containerWidth: "640px" }}
    />
  );
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutCardsDetailLevelNameExampleDemo() {
  return <CategoryPreview layout="cards" detailLevel="name" />;
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutCardsDetailLevelNameHeaderExampleDemo() {
  return (
    <CategoryPreview
      layout="cards"
      detailLevel="name"
      header={{ heading: "Our products" }}
    />
  );
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutCardsDetailLevelDescriptionExampleDemo() {
  return <CategoryPreview layout="cards" detailLevel="description" />;
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutCardsDetailLevelPriceExampleDemo() {
  return <CategoryPreview layout="cards" detailLevel="price" />;
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutCardsDetailLevelFullExampleDemo() {
  return <CategoryPreview layout="cards" detailLevel="full" />;
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutCardsDetailLevelDescriptionHeaderExampleDemo() {
  return (
    <CategoryPreview
      layout="cards"
      detailLevel="description"
      header={{ heading: "Our products" }}
    />
  );
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutCardsDetailLevelPriceHeaderExampleDemo() {
  return (
    <CategoryPreview
      layout="cards"
      detailLevel="price"
      header={{ heading: "Our products" }}
    />
  );
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutCardsDetailLevelFullHeaderExampleDemo() {
  return (
    <CategoryPreview
      layout="cards"
      detailLevel="full"
      header={{ heading: "Our products" }}
    />
  );
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutRowsDetailLevelNameExampleDemo() {
  return <CategoryPreview layout="rows" detailLevel="name" />;
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutRowsDetailLevelNameHeaderExampleDemo() {
  return (
    <CategoryPreview
      layout="rows"
      detailLevel="name"
      header={{ heading: "Our products" }}
    />
  );
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutRowsDetailLevelDescriptionExampleDemo() {
  return <CategoryPreview layout="rows" detailLevel="description" />;
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutRowsDetailLevelPriceExampleDemo() {
  return <CategoryPreview layout="rows" detailLevel="price" />;
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutRowsDetailLevelFullExampleDemo() {
  return <CategoryPreview layout="rows" detailLevel="full" />;
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutRowsDetailLevelDescriptionHeaderExampleDemo() {
  return (
    <CategoryPreview
      layout="rows"
      detailLevel="description"
      header={{ heading: "Our products" }}
    />
  );
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutRowsDetailLevelPriceHeaderExampleDemo() {
  return (
    <CategoryPreview
      layout="rows"
      detailLevel="price"
      header={{ heading: "Our products" }}
    />
  );
}

import { CategoryPreview } from "@/components/email/category-preview";

export function CategoryPreviewLayoutRowsDetailLevelFullHeaderExampleDemo() {
  return (
    <CategoryPreview
      layout="rows"
      detailLevel="full"
      header={{ heading: "Our products" }}
    />
  );
}