- MarketingAceternity: animated gradient blobs (mix-blend-mode hard-light), meteor streaks, sparkle dots, CSS marquee testimonials, lamp cone, typewriter cursor, bento grid — all using namespaced CSS keyframes - MarketingDaisy: DaisyUI-style layouts (split hero with mockup, stats hero, step guide), testimonials, FAQ accordion, logo strip; full 18-theme palette - MarketingHeroUI: blur backdrop nav, gradient-mesh/glass/aurora backgrounds, metric cards with active-bg tint, avatar stack, glassmorphism cards - MarketingTailwind: editorial typography, dot-grid/lines backgrounds, terminal deploy mockup, checklist features, stats bar, high-contrast CTA - types.ts: expanded DAISY_THEMES to 18 themes (cyberpunk, halloween, valentine, aqua, luxury, night, coffee, nord, dim, sunset); added ACETERNITY_THEMES palette - index.ts: export ACETERNITY_THEMES, wire aceternity + tailwind-only into THEME_REGISTRY Made-with: Cursor
88 lines
2.9 KiB
TypeScript
88 lines
2.9 KiB
TypeScript
/**
|
|
* Design Scaffolds — modular UI previews for each design surface.
|
|
*
|
|
* Adding a new surface:
|
|
* 1. Create components/design-scaffolds/<surface>.tsx
|
|
* 2. Export your scaffold component(s) from it
|
|
* 3. Add the surface ID to SCAFFOLD_REGISTRY and THEME_REGISTRY below
|
|
* 4. Add it to ALL_SURFACES in the design page
|
|
*/
|
|
|
|
export type { ThemeColor, DesignConfig, StyleOption, LibraryStyleOptions } from "./types";
|
|
export {
|
|
SHADCN_THEMES, MANTINE_THEMES, HEROUI_THEMES, TREMOR_THEMES,
|
|
DAISY_THEMES, HEROUI_MARKETING_THEMES, ACETERNITY_THEMES,
|
|
} from "./types";
|
|
|
|
import { WebAppShadcn, WebAppMantine, WebAppHeroUI, WebAppTremor } from "./web-app";
|
|
import { MarketingDaisy, MarketingHeroUI, MarketingAceternity, MarketingTailwind } from "./marketing";
|
|
import { AdminMantine, AdminShadcn, AdminTremor } from "./admin";
|
|
import { MobileNativewind, MobileGluestack } from "./mobile";
|
|
import { EmailReactEmail } from "./email";
|
|
import { DocsNextra, DocsShadcnCustom } from "./docs";
|
|
|
|
import type { ThemeColor, DesignConfig } from "./types";
|
|
import {
|
|
SHADCN_THEMES, MANTINE_THEMES, HEROUI_THEMES, TREMOR_THEMES,
|
|
DAISY_THEMES, HEROUI_MARKETING_THEMES, ACETERNITY_THEMES,
|
|
} from "./types";
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// SCAFFOLD_REGISTRY — surface → library → preview component
|
|
// ---------------------------------------------------------------------------
|
|
|
|
export const SCAFFOLD_REGISTRY: Record<string, Record<string, React.ComponentType<{ themeColor?: ThemeColor; config?: DesignConfig }>>> = {
|
|
"web-app": {
|
|
shadcn: WebAppShadcn,
|
|
mantine: WebAppMantine,
|
|
"hero-ui": WebAppHeroUI,
|
|
tremor: WebAppTremor,
|
|
},
|
|
"marketing": {
|
|
"daisy-ui": MarketingDaisy,
|
|
"hero-ui": MarketingHeroUI,
|
|
aceternity: MarketingAceternity,
|
|
"tailwind-only": MarketingTailwind,
|
|
},
|
|
"admin": {
|
|
mantine: AdminMantine,
|
|
shadcn: AdminShadcn,
|
|
tremor: AdminTremor,
|
|
},
|
|
"mobile": {
|
|
nativewind: MobileNativewind,
|
|
gluestack: MobileGluestack,
|
|
},
|
|
"email": {
|
|
"react-email": EmailReactEmail,
|
|
},
|
|
"docs": {
|
|
nextra: DocsNextra,
|
|
shadcn: DocsShadcnCustom,
|
|
},
|
|
};
|
|
|
|
// ---------------------------------------------------------------------------
|
|
// THEME_REGISTRY — surface → library → available color themes
|
|
// ---------------------------------------------------------------------------
|
|
|
|
export const THEME_REGISTRY: Record<string, Record<string, ThemeColor[]>> = {
|
|
"web-app": {
|
|
shadcn: SHADCN_THEMES,
|
|
mantine: MANTINE_THEMES,
|
|
"hero-ui": HEROUI_THEMES,
|
|
tremor: TREMOR_THEMES,
|
|
},
|
|
"marketing": {
|
|
"daisy-ui": DAISY_THEMES,
|
|
"hero-ui": HEROUI_MARKETING_THEMES,
|
|
"aceternity": ACETERNITY_THEMES,
|
|
"tailwind-only": SHADCN_THEMES,
|
|
},
|
|
"admin": {
|
|
mantine: MANTINE_THEMES,
|
|
shadcn: SHADCN_THEMES,
|
|
tremor: TREMOR_THEMES,
|
|
},
|
|
};
|