feat: add visual page builder to God Mode
- ContentLibrary component with blocks/avatars/fragments tabs - EnhancedPageBuilder wrapper integrating visual editor - Template library with funnel templates - Avatar variable injection utility - Builder route at /admin/pages/builder/[id] Ready for page creation with visual editing.
This commit is contained in:
70
src/lib/templates/funnels.ts
Normal file
70
src/lib/templates/funnels.ts
Normal file
@@ -0,0 +1,70 @@
|
||||
// Funnel page templates with pre-configured blocks
|
||||
|
||||
export interface BlockConfig {
|
||||
type: string;
|
||||
config: Record<string, any>;
|
||||
}
|
||||
|
||||
export interface PageTemplate {
|
||||
id: string;
|
||||
name: string;
|
||||
description: string;
|
||||
category: 'funnel' | 'general' | 'ecommerce';
|
||||
blocks: BlockConfig[];
|
||||
}
|
||||
|
||||
export const FUNNEL_TEMPLATES: Record<string, PageTemplate> = {
|
||||
landing_page: {
|
||||
id: 'landing_page',
|
||||
name: 'Landing Page',
|
||||
description: 'Classic landing page with hero, features, and CTA',
|
||||
category: 'funnel',
|
||||
blocks: [
|
||||
{
|
||||
type: 'hero',
|
||||
config: {
|
||||
headline: 'Transform Your Business Today',
|
||||
subheadline: 'Join thousands of successful entrepreneurs',
|
||||
ctaText: 'Get Started Free',
|
||||
ctaUrl: '#signup',
|
||||
}
|
||||
},
|
||||
{
|
||||
type: 'features',
|
||||
config: {
|
||||
title: 'Why Choose Us',
|
||||
features: [
|
||||
{ title: 'Fast Results', description: 'See results in days, not months', icon: '⚡' },
|
||||
{ title: 'Expert Support', description: '24/7 dedicated support team', icon: '🎯' },
|
||||
{ title: 'Proven System', description: 'Tested with 10,000+ users', icon: '✅' },
|
||||
]
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
|
||||
squeeze_page: {
|
||||
id: 'squeeze_page',
|
||||
name: 'Squeeze Page',
|
||||
description: 'High-converting lead capture page',
|
||||
category: 'funnel',
|
||||
blocks: [
|
||||
{
|
||||
type: 'hero',
|
||||
config: {
|
||||
headline: 'Get Our Free Guide',
|
||||
subheadline: 'Download the complete blueprint to success',
|
||||
ctaText: 'Download Now',
|
||||
}
|
||||
},
|
||||
]
|
||||
},
|
||||
};
|
||||
|
||||
export function getTemplateById(id: string): PageTemplate | undefined {
|
||||
return FUNNEL_TEMPLATES[id];
|
||||
}
|
||||
|
||||
export function getAllTemplates(): PageTemplate[] {
|
||||
return Object.values(FUNNEL_TEMPLATES);
|
||||
}
|
||||
16
src/lib/utils/avatar-injector.ts
Normal file
16
src/lib/utils/avatar-injector.ts
Normal file
@@ -0,0 +1,16 @@
|
||||
// Avatar variable injection system
|
||||
|
||||
interface Avatar {
|
||||
id: string;
|
||||
persona_name: string;
|
||||
pain_points?: string;
|
||||
desires?: string;
|
||||
[key: string]: any;
|
||||
}
|
||||
|
||||
export function injectAvatarVariables(content: string, avatar: Avatar | null): string {
|
||||
if (!avatar || !content) return content;
|
||||
return content.replace(/\{\{avatar\.(\w+)\}\}/g, (match, fieldName) => {
|
||||
return avatar[fieldName] || match;
|
||||
});
|
||||
}
|
||||
Reference in New Issue
Block a user