Mark Henderson
9c8e1a5f34
Users can now compose their marketing site by selecting: - Mode (dark/light), Background style (gradient/beams/meteors/etc.), Nav style, Hero header layout, which Sections appear, and Font. All 4 marketing scaffolds (DaisyUI, HeroUI, Aceternity, Tailwind) respond live to config changes. Library capability cards + style options data defined per library. Aceternity shows actual background effects (beams, meteors, sparkles, wavy, dot-grid). Made-with: Cursor
86 lines
2.7 KiB
TypeScript
86 lines
2.7 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,
|
|
} 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,
|
|
} 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,
|
|
},
|
|
"admin": {
|
|
mantine: MANTINE_THEMES,
|
|
shadcn: SHADCN_THEMES,
|
|
tremor: TREMOR_THEMES,
|
|
},
|
|
};
|