npm - @jsonpages/cli - Versions diffs - 3.0.6 → 3.0.7 - Mend

@jsonpages/cli 3.0.6 → 3.0.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/package.json +24 -29
package/src/index.js +5 -6
package/tsconfig.json +13 -0
package/assets/src_tenant_alpha.sh +0 -3267
package/src/projection.js +0 -76

package/assets/src_tenant_alpha.sh DELETED Viewed

@@ -1,3267 +0,0 @@
-#!/bin/bash
-set -e # Termina se c'è un errore
-echo "Inizio ricostruzione progetto..."
-echo "Creating index.html..."
-cat << 'END_OF_FILE_CONTENT' > "index.html"
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <meta name="description" content="JsonPages - Global Authoring. Global Governance." />
-    <link rel="preconnect" href="https://fonts.googleapis.com" />
-    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
-    <link href="https://fonts.googleapis.com/css2?family=Instrument+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Playfair+Display:wght@700;800;900&display=swap" rel="stylesheet" />
-    <title>JsonPages</title>
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
-  </body>
-</html>
-END_OF_FILE_CONTENT
-mkdir -p "src"
-echo "Creating src/App.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/App.tsx"
-/**
- * Thin Entry Point (Tenant).
- */
-import { JsonPagesEngine } from '@jsonpages/core';
-import { ComponentRegistry } from '@/lib/ComponentRegistry';
-import { SECTION_SCHEMAS } from '@/lib/schemas';
-import { addSectionConfig } from '@/lib/addSectionConfig';
-import type { JsonPagesConfig } from '@jsonpages/core';
-import type { PageConfig, SiteConfig, ThemeConfig, MenuConfig } from '@/types';
-// Tenant data
-import siteData from '@/data/config/site.json';
-import themeData from '@/data/config/theme.json';
-import menuData from '@/data/config/menu.json';
-import homeData from '@/data/pages/home.json';
-// Tenant CSS
-import tenantCss from './index.css?inline';
-const siteConfig = siteData as unknown as SiteConfig;
-const themeConfig = themeData as unknown as ThemeConfig;
-const menuConfig = menuData as unknown as MenuConfig;
-const pages: Record<string, PageConfig> = {
-  home: homeData as unknown as PageConfig,
-};
-const config: JsonPagesConfig = {
-  tenantId: 'alpha', // 🛡️ Identificativo per asset resolution
-  registry: ComponentRegistry as JsonPagesConfig['registry'],
-  schemas: SECTION_SCHEMAS as unknown as JsonPagesConfig['schemas'],
-  pages,
-  siteConfig,
-  themeConfig,
-  menuConfig,
-  themeCss: { tenant: tenantCss },
-  addSection: addSectionConfig,
-};
-function App() {
-  return <JsonPagesEngine config={config} />;
-}
-export default App;
-END_OF_FILE_CONTENT
-mkdir -p "src/components"
-echo "Creating src/components/NotFound.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/NotFound.tsx"
-import React from 'react';
-import { Icon } from '@/lib/IconResolver';
-export const NotFound: React.FC = () => {
-  return (
-    <div
-      style={{
-        '--local-bg': 'var(--color-background)',
-        '--local-text': 'var(--color-text)',
-        '--local-text-muted': 'var(--color-text-muted)',
-        '--local-primary': 'var(--color-primary)',
-        '--local-radius-md': 'var(--radius-md)',
-      } as React.CSSProperties}
-      className="min-h-screen flex flex-col items-center justify-center bg-[var(--local-bg)] px-6"
-    >
-      <h1 className="text-6xl font-bold text-[var(--local-text)] mb-4">404</h1>
-      <p className="text-xl text-[var(--local-text-muted)] mb-8">Page not found</p>
-      <a
-        href="/"
-        className="inline-flex items-center gap-2 px-6 py-3 rounded-[var(--local-radius-md)] bg-[var(--local-primary)] text-[var(--local-bg)] font-semibold text-sm hover:opacity-90 transition-opacity"
-      >
-        <span>Back to Home</span>
-        <Icon name="arrow-right" size={16} />
-      </a>
-    </div>
-  );
-};
-END_OF_FILE_CONTENT
-mkdir -p "src/components/arch-layers"
-echo "Creating src/components/arch-layers/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/arch-layers/View.tsx"
-import React from 'react';
-import { cn } from '@/lib/utils';
-import type { ArchLayersData, ArchLayersSettings, ArchLayerLevel, SyntaxTokenType } from './types';
-const layerBgStyles: Record<ArchLayerLevel, string> = {
-  l0: 'bg-[#3b82f6]',
-  l1: 'bg-[rgba(59,130,246,0.6)]',
-  l2: 'bg-[rgba(59,130,246,0.35)]',
-};
-const tokenStyles: Record<SyntaxTokenType, string> = {
-  plain: 'text-[#cbd5e1]',
-  keyword: 'text-[#60a5fa]',
-  type: 'text-[#22d3ee]',
-  string: 'text-[#4ade80]',
-  comment: 'text-[#64748b] italic',
-  operator: 'text-[#f472b6]',
-};
-export const ArchLayers: React.FC<{ data: ArchLayersData; settings?: ArchLayersSettings }> = ({ data }) => {
-  return (
-    <section
-      style={{
-        '--local-bg': 'var(--card)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-primary': 'var(--primary)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-        '--local-border': 'var(--border)',
-        '--local-deep': 'var(--background)',
-      } as React.CSSProperties}
-      className="relative z-0 py-28 bg-[var(--local-bg)]"
-    >
-      <div className="absolute top-0 left-0 right-0 h-px bg-gradient-to-r from-transparent via-[rgba(59,130,246,0.1)] to-transparent" />
-      <div className="absolute bottom-0 left-0 right-0 h-px bg-gradient-to-r from-transparent via-[rgba(59,130,246,0.1)] to-transparent" />
-      <div className="max-w-[1200px] mx-auto px-8">
-        <div className="text-center">
-          {data.label && (
-            <div className="jp-section-label inline-flex items-center gap-2 text-[0.72rem] font-bold uppercase tracking-[0.12em] text-[var(--local-accent)] mb-4" data-jp-field="label">
-              <span className="w-5 h-px bg-[var(--local-primary)]" />
-              {data.label}
-            </div>
-          )}
-          <h2 className="font-display text-[clamp(2rem,4vw,3.2rem)] font-extrabold text-[var(--local-text)] leading-[1.15] tracking-tight mb-4" data-jp-field="title">
-            {data.title}
-          </h2>
-          {data.description && (
-            <p className="text-lg text-[var(--local-text-muted)] max-w-[600px] mx-auto leading-relaxed" data-jp-field="description">
-              {data.description}
-            </p>
-          )}
-        </div>
-        <div className="mt-14 max-w-[740px] mx-auto">
-          {data.layers.map((layer, idx) => (
-            <div
-              key={layer.id ?? idx}
-              className="group border border-[rgba(255,255,255,0.06)] rounded-[7px] p-8 mb-4 bg-[rgba(255,255,255,0.015)] flex items-start gap-6 transition-all duration-300 hover:border-[rgba(59,130,246,0.2)] hover:translate-x-1.5"
-              data-jp-item-id={layer.id ?? `legacy-${idx}`}
-              data-jp-item-field="layers"
-            >
-              <div className={cn(
-                'shrink-0 w-9 h-9 rounded-lg flex items-center justify-center font-mono text-[0.85rem] font-bold text-white',
-                layerBgStyles[layer.layerLevel]
-              )}>
-                {layer.number}
-              </div>
-              <div>
-                <h4 className="text-[1.05rem] font-bold text-[var(--local-text)] mb-1.5">
-                  {layer.title}
-                </h4>
-                <p className="text-[0.92rem] text-[var(--local-text-muted)] leading-relaxed">
-                  {layer.description}
-                </p>
-              </div>
-            </div>
-          ))}
-        </div>
-        {data.codeLines && data.codeLines.length > 0 && (
-          <div className="mt-12 max-w-[740px] mx-auto">
-            <div className="border border-[rgba(255,255,255,0.08)] rounded-[7px] overflow-hidden bg-[var(--local-deep)]">
-              <div className="flex items-center gap-2 px-5 py-3 bg-[rgba(255,255,255,0.03)] border-b border-[rgba(255,255,255,0.06)]">
-                <span className="w-2.5 h-2.5 rounded-full bg-[#ef4444]" />
-                <span className="w-2.5 h-2.5 rounded-full bg-[#f59e0b]" />
-                <span className="w-2.5 h-2.5 rounded-full bg-[#22c55e]" />
-                {data.codeFilename && (
-                  <span className="ml-3 font-mono text-[0.75rem] text-[var(--local-text-muted)] opacity-60" data-jp-field="codeFilename">
-                    {data.codeFilename}
-                  </span>
-                )}
-              </div>
-              <div className="p-6 font-mono text-[0.82rem] leading-[1.7] overflow-x-auto">
-                {data.codeLines.map((line, idx) => (
-                  <div key={idx} data-jp-item-id={(line as { id?: string }).id ?? `legacy-${idx}`} data-jp-item-field="codeLines">
-                    <span className={tokenStyles[line.tokenType]}>
-                      {line.content}
-                    </span>
-                  </div>
-                ))}
-              </div>
-            </div>
-          </div>
-        )}
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/arch-layers/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/arch-layers/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/arch-layers/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/arch-layers/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData, BaseArrayItem } from '@/lib/base-schemas';
-export const ArchLayerLevelSchema = z.enum(['l0', 'l1', 'l2']);
-export const SyntaxTokenTypeSchema = z.enum(['plain', 'keyword', 'type', 'string', 'comment', 'operator']);
-const ArchLayerItemSchema = BaseArrayItem.extend({
-  number: z.string().describe('ui:text'),
-  layerLevel: ArchLayerLevelSchema.describe('ui:select'),
-  title: z.string().describe('ui:text'),
-  description: z.string().describe('ui:textarea'),
-});
-const SyntaxLineSchema = z.object({
-  content: z.string().describe('ui:text'),
-  tokenType: SyntaxTokenTypeSchema.default('plain').describe('ui:select'),
-});
-export const ArchLayersSchema = BaseSectionData.extend({
-  label: z.string().optional().describe('ui:text'),
-  title: z.string().describe('ui:text'),
-  description: z.string().optional().describe('ui:textarea'),
-  layers: z.array(ArchLayerItemSchema).describe('ui:list'),
-  codeFilename: z.string().optional().describe('ui:text'),
-  codeLines: z.array(SyntaxLineSchema).optional().describe('ui:list'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/arch-layers/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/arch-layers/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { ArchLayersSchema, ArchLayerLevelSchema, SyntaxTokenTypeSchema } from './schema';
-export type ArchLayersData = z.infer<typeof ArchLayersSchema>;
-export type ArchLayersSettings = z.infer<typeof BaseSectionSettingsSchema>;
-export type ArchLayerLevel = z.infer<typeof ArchLayerLevelSchema>;
-export type SyntaxTokenType = z.infer<typeof SyntaxTokenTypeSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/code-block"
-echo "Creating src/components/code-block/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/code-block/View.tsx"
-import React from 'react';
-import { cn } from '@/lib/utils';
-import { Icon } from '@/lib/IconResolver';
-import type { CodeBlockData, CodeBlockSettings } from './types';
-export const CodeBlock: React.FC<{ data: CodeBlockData; settings?: CodeBlockSettings }> = ({ data, settings }) => {
-  const showLineNumbers = settings?.showLineNumbers ?? true;
-  return (
-    <section
-      style={{
-        '--local-surface': 'var(--card)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-bg': 'var(--background)',
-        '--local-border': 'var(--border)',
-        '--local-text': 'var(--foreground)',
-        '--local-accent': 'var(--primary)',
-        '--local-radius-lg': 'var(--radius)',
-      } as React.CSSProperties}
-      className="py-16 bg-[var(--local-surface)]"
-    >
-      <div className="container mx-auto px-6 max-w-4xl">
-        {data.label && (
-          <div className="flex items-center gap-2 text-xs font-semibold uppercase tracking-wider text-[var(--local-text-muted)] mb-4" data-jp-field="label">
-            <Icon name="terminal" size={14} />
-            <span>{data.label}</span>
-          </div>
-        )}
-        <div className="rounded-[var(--local-radius-lg)] bg-[var(--local-bg)] border border-[var(--local-border)] overflow-hidden">
-          <div className="p-6 font-mono text-sm overflow-x-auto">
-            {data.lines.map((line, idx) => (
-              <div key={idx} className="flex items-start gap-4 py-1" data-jp-item-id={(line as { id?: string }).id ?? `legacy-${idx}`} data-jp-item-field="lines">
-                {showLineNumbers && (
-                  <span className="select-none w-6 text-right text-[var(--local-text-muted)]/50">
-                    {idx + 1}
-                  </span>
-                )}
-                <span
-                  className={cn(
-                    line.isComment
-                      ? 'text-[var(--local-text-muted)]/60'
-                      : 'text-[var(--local-text)]'
-                  )}
-                >
-                  {!line.isComment && (
-                    <span className="text-[var(--local-accent)] mr-2">$</span>
-                  )}
-                  {line.content}
-                </span>
-              </div>
-            ))}
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/code-block/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/code-block/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/code-block/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/code-block/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData } from '@/lib/base-schemas';
-export const LegacyCodeLineSchema = z.object({
-  content: z.string().describe('ui:text'),
-  isComment: z.boolean().default(false).describe('ui:checkbox'),
-});
-export const CodeBlockSchema = BaseSectionData.extend({
-  label: z.string().optional().describe('ui:text'),
-  lines: z.array(LegacyCodeLineSchema).describe('ui:list'),
-});
-export const CodeBlockSettingsSchema = z.object({
-  showLineNumbers: z.boolean().optional().describe('ui:checkbox'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/code-block/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/code-block/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { CodeBlockSchema, CodeBlockSettingsSchema } from './schema';
-export type CodeBlockData = z.infer<typeof CodeBlockSchema>;
-export type CodeBlockSettings = z.infer<typeof BaseSectionSettingsSchema> & z.infer<typeof CodeBlockSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/cta-banner"
-echo "Creating src/components/cta-banner/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/cta-banner/View.tsx"
-import React from 'react';
-import { cn } from '@/lib/utils';
-import type { CtaBannerData, CtaBannerSettings } from './types';
-export const CtaBanner: React.FC<{ data: CtaBannerData; settings?: CtaBannerSettings }> = ({ data }) => {
-  return (
-    <section
-      style={{
-        '--local-bg': 'var(--background)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-primary': 'var(--primary)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-      } as React.CSSProperties}
-      className="relative py-28 bg-[var(--local-bg)] overflow-hidden text-center"
-    >
-      <div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[60vw] h-[60vw] bg-[radial-gradient(circle,rgba(59,130,246,0.08)_0%,transparent_60%)] pointer-events-none" />
-      <div className="relative max-w-[1200px] mx-auto px-8">
-        {data.label && (
-          <div className="jp-section-label inline-flex items-center gap-2 text-[0.72rem] font-bold uppercase tracking-[0.12em] text-[var(--local-accent)] mb-4" data-jp-field="label">
-            <span className="w-5 h-px bg-[var(--local-primary)]" />
-            {data.label}
-          </div>
-        )}
-        <h2
-          className="font-display text-[clamp(2rem,4vw,3.2rem)] font-extrabold text-[var(--local-text)] leading-[1.15] tracking-tight mb-6"
-          data-jp-field="title"
-        >
-          {data.title}
-        </h2>
-        {data.description && (
-          <p className="text-lg text-[var(--local-text-muted)] max-w-[600px] mx-auto leading-relaxed mb-10" data-jp-field="description">
-            {data.description}
-          </p>
-        )}
-        {data.ctas && data.ctas.length > 0 && (
-          <div className="flex gap-4 justify-center flex-wrap">
-            {data.ctas.map((cta, idx) => (
-              <a
-                key={cta.id ?? idx}
-                href={cta.href}
-                data-jp-item-id={cta.id ?? `legacy-${idx}`}
-                data-jp-item-field="ctas"
-                className={cn(
-                  'inline-flex items-center gap-2 px-8 py-3.5 rounded-[5px] font-semibold text-base transition-all duration-200 no-underline',
-                  cta.variant === 'primary'
-                    ? 'bg-[var(--local-primary)] text-white hover:brightness-110 hover:-translate-y-0.5 hover:shadow-[0_8px_30px_rgba(59,130,246,0.3)]'
-                    : 'bg-transparent text-[var(--local-text)] border border-[rgba(255,255,255,0.12)] hover:border-[rgba(255,255,255,0.3)] hover:bg-[rgba(255,255,255,0.04)]'
-                )}
-              >
-                {cta.label}
-              </a>
-            ))}
-          </div>
-        )}
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/cta-banner/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/cta-banner/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/cta-banner/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/cta-banner/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData, CtaSchema } from '@/lib/base-schemas';
-export const CtaBannerSchema = BaseSectionData.extend({
-  label: z.string().optional().describe('ui:text'),
-  title: z.string().describe('ui:text'),
-  description: z.string().optional().describe('ui:textarea'),
-  ctas: z.array(CtaSchema).optional().describe('ui:list'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/cta-banner/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/cta-banner/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { CtaBannerSchema } from './schema';
-export type CtaBannerData = z.infer<typeof CtaBannerSchema>;
-export type CtaBannerSettings = z.infer<typeof BaseSectionSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/feature-grid"
-echo "Creating src/components/feature-grid/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/feature-grid/View.tsx"
-import React from 'react';
-import { cn } from '@/lib/utils';
-import { Icon } from '@/lib/IconResolver';
-import type { FeatureGridData, FeatureGridSettings } from './types';
-const columnsMap: Record<2 | 3 | 4, string> = {
-  2: 'md:grid-cols-2',
-  3: 'md:grid-cols-3',
-  4: 'md:grid-cols-4',
-};
-export const FeatureGrid: React.FC<{ data: FeatureGridData; settings?: FeatureGridSettings }> = ({ data, settings }) => {
-  const colKey = settings?.columns ?? 3;
-  const cols = (colKey === 2 || colKey === 3 || colKey === 4) ? columnsMap[colKey] : columnsMap[3];
-  const isBordered = settings?.cardStyle === 'bordered';
-  const localStyles = {
-    '--local-bg': 'var(--background)',
-    '--local-text': 'var(--foreground)',
-    '--local-text-muted': 'var(--muted-foreground)',
-    '--local-surface': 'var(--card)',
-    '--local-surface-alt': 'var(--muted)',
-    '--local-border': 'var(--border)',
-    '--local-radius-lg': 'var(--radius)',
-    '--local-radius-md': 'calc(var(--radius) - 2px)',
-  } as React.CSSProperties;
-  return (
-    <section style={localStyles} className="py-20 bg-[var(--local-bg)] relative z-0">
-      <div className="container mx-auto px-6">
-        <h2 className="text-3xl md:text-4xl font-bold text-center text-[var(--local-text)] mb-16" data-jp-field="sectionTitle">
-          {data.sectionTitle}
-        </h2>
-        <div className={cn('grid grid-cols-1 gap-6', cols)}>
-          {data.cards.map((card, idx) => (
-            <div
-              key={card.id ?? idx}
-              className={cn(
-                'p-6 rounded-[var(--local-radius-lg)] bg-[var(--local-surface)]',
-                isBordered && 'border border-[var(--local-border)]'
-              )}
-              data-jp-item-id={card.id ?? `legacy-${idx}`}
-              data-jp-item-field="cards"
-            >
-              {card.icon && (
-                <div className="w-10 h-10 rounded-[var(--local-radius-md)] bg-[var(--local-surface-alt)] flex items-center justify-center mb-4">
-                  <Icon name={card.icon} size={20} className="text-[var(--local-text-muted)]" />
-                </div>
-              )}
-              <h3 className="text-lg font-semibold text-[var(--local-text)] mb-2">
-                {card.emoji && <span className="mr-2">{card.emoji}</span>}
-                {card.title}
-              </h3>
-              <p className="text-sm text-[var(--local-text-muted)] leading-relaxed">
-                {card.description}
-              </p>
-            </div>
-          ))}
-        </div>
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/feature-grid/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/feature-grid/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/feature-grid/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/feature-grid/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData, BaseArrayItem } from '@/lib/base-schemas';
-export const FeatureCardSchema = BaseArrayItem.extend({
-  icon: z.string().optional().describe('ui:icon-picker'),
-  emoji: z.string().optional().describe('ui:text'),
-  title: z.string().describe('ui:text'),
-  description: z.string().describe('ui:textarea'),
-});
-export const FeatureGridSchema = BaseSectionData.extend({
-  sectionTitle: z.string().describe('ui:text'),
-  cards: z.array(FeatureCardSchema).describe('ui:list'),
-});
-export const FeatureGridSettingsSchema = z.object({
-  columns: z.union([z.literal(2), z.literal(3), z.literal(4)]).optional().describe('ui:number'),
-  cardStyle: z.enum(['plain', 'bordered']).optional().describe('ui:select'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/feature-grid/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/feature-grid/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { FeatureGridSchema, FeatureGridSettingsSchema } from './schema';
-export type FeatureGridData = z.infer<typeof FeatureGridSchema>;
-export type FeatureGridSettings = z.infer<typeof BaseSectionSettingsSchema> & z.infer<typeof FeatureGridSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/footer"
-echo "Creating src/components/footer/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/footer/View.tsx"
-import React from 'react';
-import type { FooterData, FooterSettings } from './types';
-export const Footer: React.FC<{ data: FooterData; settings?: FooterSettings }> = ({ data }) => {
-  return (
-    <footer
-      style={{
-        '--local-bg': 'var(--background)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-        '--local-border': 'rgba(255,255,255,0.05)',
-      } as React.CSSProperties}
-      className="py-12 border-t border-[var(--local-border)] bg-[var(--local-bg)] relative z-0"
-    >
-      <div className="max-w-[1200px] mx-auto px-8">
-        <div className="flex flex-col md:flex-row items-center justify-between gap-4">
-          <div className="flex items-center gap-2 font-bold text-[0.9rem] text-[var(--local-text-muted)]" data-jp-field="brandText">
-            {data.brandText}
-            {data.brandHighlight && (
-              <span className="text-[var(--local-accent)]" data-jp-field="brandHighlight">{data.brandHighlight}</span>
-            )}
-          </div>
-          {data.links && data.links.length > 0 && (
-            <nav className="flex gap-6">
-              {data.links.map((link, idx) => (
-                <a
-                  key={idx}
-                  href={link.href}
-                  className="text-[0.82rem] text-[var(--local-text-muted)] hover:text-[var(--local-accent)] transition-colors no-underline"
-                  data-jp-item-id={(link as { id?: string }).id ?? `legacy-${idx}`}
-                  data-jp-item-field="links"
-                >
-                  {link.label}
-                </a>
-              ))}
-            </nav>
-          )}
-          <div className="text-[0.8rem] text-[var(--local-text-muted)] opacity-60" data-jp-field="copyright">
-            {data.copyright}
-          </div>
-        </div>
-      </div>
-    </footer>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/footer/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/footer/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/footer/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/footer/schema.ts"
-import { z } from 'zod';
-export const FooterSchema = z.object({
-  brandText: z.string().describe('ui:text'),
-  brandHighlight: z.string().optional().describe('ui:text'),
-  copyright: z.string().describe('ui:text'),
-  links: z.array(z.object({
-    label: z.string().describe('ui:text'),
-    href: z.string().describe('ui:text'),
-  })).optional().describe('ui:list'),
-});
-export const FooterSettingsSchema = z.object({
-  showLogo: z.boolean().optional().describe('ui:checkbox'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/footer/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/footer/types.ts"
-import { z } from 'zod';
-import { FooterSchema, FooterSettingsSchema } from './schema';
-export type FooterData = z.infer<typeof FooterSchema>;
-export type FooterSettings = z.infer<typeof FooterSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/header"
-echo "Creating src/components/header/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/header/View.tsx"
-import React, { useState, useEffect } from 'react';
-import { cn } from '@/lib/utils';
-import type { MenuItem } from '@jsonpages/core';
-import type { HeaderData, HeaderSettings } from './types';
-export const Header: React.FC<{
-  data: HeaderData;
-  settings?: HeaderSettings;
-  menu: MenuItem[];
-}> = ({ data, menu }) => {
-  const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
-  const [scrolled, setScrolled] = useState(false);
-  useEffect(() => {
-    const handleScroll = () => setScrolled(window.scrollY > 40);
-    window.addEventListener('scroll', handleScroll, { passive: true });
-    return () => window.removeEventListener('scroll', handleScroll);
-  }, []);
-  return (
-    <header
-      style={{
-        '--local-bg': 'rgba(6,13,27,0.92)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-primary': 'var(--primary)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-        '--local-border': 'rgba(59,130,246,0.08)',
-      } as React.CSSProperties}
-      className={cn(
-        'w-full py-4 transition-all duration-300 z-0',
-        scrolled
-          ? 'bg-[var(--local-bg)] backdrop-blur-[20px] border-b border-[var(--local-border)]'
-          : 'bg-transparent border-b border-transparent'
-      )}
-    >
-      <div className="max-w-[1200px] mx-auto px-8 flex justify-between items-center">
-        <a
-          href="/"
-          className="flex items-center gap-2.5 no-underline font-bold text-xl tracking-tight text-[var(--local-text)]"
-        >
-          {data.logoIconText && (
-            <div className="w-8 h-8 rounded-md bg-gradient-to-br from-[var(--local-primary)] to-[var(--local-accent)] flex items-center justify-center font-mono text-[0.8rem] font-bold text-[var(--background)]" data-jp-field="logoIconText">
-              {data.logoIconText}
-            </div>
-          )}
-          <span data-jp-field="logoText">
-            {data.logoText}
-            {data.logoHighlight && (
-              <span className="text-[var(--local-accent)]" data-jp-field="logoHighlight">{data.logoHighlight}</span>
-            )}
-          </span>
-        </a>
-        <nav className="hidden md:flex items-center gap-10">
-          {menu.map((item, idx) => (
-            <a
-              key={(item as { id?: string }).id ?? idx}
-              href={item.href}
-              data-jp-item-id={(item as { id?: string }).id ?? `legacy-${idx}`}
-              data-jp-item-field="links"
-              target={item.external ? '_blank' : undefined}
-              rel={item.external ? 'noopener noreferrer' : undefined}
-              className={cn(
-                'no-underline text-sm font-medium transition-colors',
-                item.isCta
-                  ? 'bg-[var(--local-primary)] text-white px-5 py-2 rounded-lg font-semibold hover:brightness-110 hover:-translate-y-px'
-                  : 'text-[var(--local-text-muted)] hover:text-[var(--local-text)]'
-              )}
-            >
-              {item.label}
-            </a>
-          ))}
-        </nav>
-        <button
-          type="button"
-          className="md:hidden p-2 text-[var(--local-text-muted)] hover:text-[var(--local-text)]"
-          onClick={() => setMobileMenuOpen(!mobileMenuOpen)}
-          aria-label={mobileMenuOpen ? 'Close menu' : 'Open menu'}
-        >
-          <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
-            {mobileMenuOpen ? (
-              <><line x1="18" y1="6" x2="6" y2="18" /><line x1="6" y1="6" x2="18" y2="18" /></>
-            ) : (
-              <><line x1="3" y1="12" x2="21" y2="12" /><line x1="3" y1="6" x2="21" y2="6" /><line x1="3" y1="18" x2="21" y2="18" /></>
-            )}
-          </svg>
-        </button>
-      </div>
-      {mobileMenuOpen && (
-        <nav className="md:hidden border-t border-[var(--local-border)] bg-[var(--local-bg)] backdrop-blur-[20px]">
-          <div className="max-w-[1200px] mx-auto px-8 py-4 flex flex-col gap-4">
-            {menu.map((item, idx) => (
-              <a
-                key={(item as { id?: string }).id ?? idx}
-                href={item.href}
-                className="text-base font-medium text-[var(--local-text-muted)] hover:text-[var(--local-text)] transition-colors py-2 no-underline"
-                onClick={() => setMobileMenuOpen(false)}
-                data-jp-item-id={(item as { id?: string }).id ?? `legacy-${idx}`}
-                data-jp-item-field="links"
-              >
-                {item.label}
-              </a>
-            ))}
-          </div>
-        </nav>
-      )}
-    </header>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/header/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/header/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/header/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/header/schema.ts"
-import { z } from 'zod';
-/**
- * 📝 HEADER SCHEMA (Contract)
- * Definisce la struttura dati che l'Admin userà per generare la form.
- */
-export const HeaderSchema = z.object({
-  logoText: z.string().describe('ui:text'),
-  logoHighlight: z.string().optional().describe('ui:text'),
-  logoIconText: z.string().optional().describe('ui:text'),
-  links: z.array(z.object({
-    label: z.string().describe('ui:text'),
-    href: z.string().describe('ui:text'),
-    isCta: z.boolean().default(false).describe('ui:checkbox'),
-  })).describe('ui:list'),
-});
-/**
- * ⚙️ HEADER SETTINGS
- * Definisce i parametri tecnici (non di contenuto).
- */
-export const HeaderSettingsSchema = z.object({
-  sticky: z.boolean().default(true).describe('ui:checkbox'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/header/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/header/types.ts"
-import { z } from 'zod';
-import { HeaderSchema, HeaderSettingsSchema } from './schema';
-/**
- * 🧩 HEADER DATA
- * Tipo inferito dallo schema Zod del contenuto.
- * Utilizzato dalla View per renderizzare logo e links.
- */
-export type HeaderData = z.infer<typeof HeaderSchema>;
-/**
- * ⚙️ HEADER SETTINGS
- * Tipo inferito dallo schema Zod dei settings.
- * Gestisce comportamenti tecnici come lo 'sticky'.
- */
-export type HeaderSettings = z.infer<typeof HeaderSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/hero"
-echo "Creating src/components/hero/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/hero/View.tsx"
-import React from 'react';
-import { cn } from '@/lib/utils';
-import type { HeroData, HeroSettings } from './types';
-export const Hero: React.FC<{ data: HeroData; settings?: HeroSettings }> = ({ data }) => {
-  return (
-    <section
-      style={{
-        '--local-bg': 'var(--background)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-primary': 'var(--primary)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-        '--local-cyan': 'var(--color-secondary, #22d3ee)',
-        '--local-border': 'var(--border)',
-      } as React.CSSProperties}
-      className="jp-hero relative min-h-screen flex items-center overflow-hidden pt-24 bg-[var(--local-bg)]"
-    >
-      <div className="absolute -top-[40%] -right-[20%] w-[70vw] h-[70vw] rounded-full bg-[radial-gradient(circle,rgba(59,130,246,0.06)_0%,transparent_70%)] pointer-events-none" />
-      <div className="absolute -bottom-[10%] -left-[10%] w-[50vw] h-[50vw] rounded-full bg-[radial-gradient(circle,rgba(34,211,238,0.03)_0%,transparent_60%)] pointer-events-none" />
-      <div className="relative max-w-[1200px] mx-auto px-8 w-full">
-        <div className="max-w-[820px]">
-          {data.badge && (
-            <div className="inline-flex items-center gap-2 bg-[rgba(59,130,246,0.08)] border border-[rgba(59,130,246,0.2)] px-4 py-1.5 rounded-full text-[0.78rem] font-semibold text-[var(--local-accent)] mb-8 tracking-wide jp-animate-in" data-jp-field="badge">
-              <span className="w-1.5 h-1.5 rounded-full bg-[var(--local-accent)] jp-pulse-dot" />
-              {data.badge}
-            </div>
-          )}
-          <h1
-            className="font-display text-[clamp(2.8rem,6vw,4.8rem)] font-black text-[var(--local-text)] leading-[1.08] tracking-tight mb-6 jp-animate-in jp-d1"
-            data-jp-field="title"
-          >
-            {data.title}
-            {data.titleHighlight && (
-              <>
-                <br />
-                <em className="not-italic bg-gradient-to-br from-[var(--local-accent)] to-[var(--local-cyan)] bg-clip-text text-transparent" data-jp-field="titleHighlight">
-                  {data.titleHighlight}
-                </em>
-              </>
-            )}
-          </h1>
-          {data.description && (
-            <p className="text-xl text-[var(--local-text-muted)] max-w-[600px] leading-relaxed mb-10 jp-animate-in jp-d2" data-jp-field="description">
-              {data.description}
-            </p>
-          )}
-          {data.ctas && data.ctas.length > 0 && (
-            <div className="flex gap-4 flex-wrap jp-animate-in jp-d3">
-              {data.ctas.map((cta, idx) => (
-                <a
-                  key={cta.id ?? idx}
-                  href={cta.href}
-                  data-jp-item-id={cta.id ?? `legacy-${idx}`}
-                  data-jp-item-field="ctas"
-                  className={cn(
-                    'inline-flex items-center gap-2 px-8 py-3.5 rounded-[5px] font-semibold text-base transition-all duration-200 no-underline',
-                    cta.variant === 'primary'
-                      ? 'bg-[var(--local-primary)] text-white hover:brightness-110 hover:-translate-y-0.5 hover:shadow-[0_8px_30px_rgba(59,130,246,0.3)]'
-                      : 'bg-transparent text-[var(--local-text)] border border-[rgba(255,255,255,0.12)] hover:border-[rgba(255,255,255,0.3)] hover:bg-[rgba(255,255,255,0.04)]'
-                  )}
-                >
-                  {cta.label}
-                </a>
-              ))}
-            </div>
-          )}
-          {data.metrics && data.metrics.length > 0 && (
-            <div className="flex gap-12 mt-16 pt-12 border-t border-[rgba(255,255,255,0.06)] flex-wrap jp-animate-in jp-d4">
-              {data.metrics.map((metric, idx) => (
-                <div
-                  key={(metric as { id?: string }).id ?? idx}
-                  data-jp-item-id={(metric as { id?: string }).id ?? `legacy-${idx}`}
-                  data-jp-item-field="metrics"
-                >
-                  <div className="text-[2rem] font-bold text-[var(--local-text)] font-display">
-                    {metric.val}
-                  </div>
-                  <div className="text-[0.82rem] text-[var(--muted-foreground)] mt-0.5 opacity-70">
-                    {metric.label}
-                  </div>
-                </div>
-              ))}
-            </div>
-          )}
-        </div>
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/hero/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/hero/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/hero/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/hero/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData, CtaSchema } from '@/lib/base-schemas';
-const HeroMetricSchema = z.object({
-  val: z.string().describe('ui:text'),
-  label: z.string().describe('ui:text'),
-});
-export const HeroSchema = BaseSectionData.extend({
-  badge: z.string().optional().describe('ui:text'),
-  title: z.string().describe('ui:text'),
-  titleHighlight: z.string().optional().describe('ui:text'),
-  description: z.string().optional().describe('ui:textarea'),
-  ctas: z.array(CtaSchema).optional().describe('ui:list'),
-  metrics: z.array(HeroMetricSchema).optional().describe('ui:list'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/hero/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/hero/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { HeroSchema } from './schema';
-export type HeroData = z.infer<typeof HeroSchema>;
-export type HeroSettings = z.infer<typeof BaseSectionSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/image-test"
-mkdir -p "src/components/pa-section"
-echo "Creating src/components/pa-section/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/pa-section/View.tsx"
-import React from 'react';
-import type { PaSectionData, PaSectionSettings } from './types';
-export const PaSection: React.FC<{ data: PaSectionData; settings?: PaSectionSettings }> = ({ data }) => {
-  return (
-    <section
-      style={{
-        '--local-bg': 'var(--card)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-primary': 'var(--primary)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-        '--local-deep': 'var(--background)',
-      } as React.CSSProperties}
-      className="relative z-0 py-28 bg-[var(--local-bg)]"
-    >
-      <div className="absolute top-0 left-0 right-0 h-px bg-gradient-to-r from-transparent via-[rgba(59,130,246,0.1)] to-transparent" />
-      <div className="absolute bottom-0 left-0 right-0 h-px bg-gradient-to-r from-transparent via-[rgba(59,130,246,0.1)] to-transparent" />
-      <div className="max-w-[1200px] mx-auto px-8">
-        {data.label && (
-          <div className="jp-section-label inline-flex items-center gap-2 text-[0.72rem] font-bold uppercase tracking-[0.12em] text-[var(--local-accent)] mb-4" data-jp-field="label">
-            <span className="w-5 h-px bg-[var(--local-primary)]" />
-            {data.label}
-          </div>
-        )}
-        <h2 className="font-display text-[clamp(2rem,4vw,3.2rem)] font-extrabold text-[var(--local-text)] leading-[1.15] tracking-tight mb-4" data-jp-field="title">
-          {data.title}
-        </h2>
-        <div className="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center mt-12">
-          <div>
-            <h3 className="text-2xl font-bold text-[var(--local-text)] mb-4" data-jp-field="subtitle">
-              {data.subtitle}
-            </h3>
-            {data.paragraphs.map((p, idx) => (
-              <p key={idx} className="text-[var(--local-text-muted)] mb-5 text-[1.05rem] leading-relaxed" data-jp-item-id={(p as { id?: string }).id ?? `legacy-${idx}`} data-jp-item-field="paragraphs">
-                {p.text}
-              </p>
-            ))}
-            {data.badges && data.badges.length > 0 && (
-              <div className="flex gap-2.5 flex-wrap mt-4">
-                {data.badges.map((badge, idx) => (
-                  <span
-                    key={idx}
-                    className="inline-flex items-center gap-1.5 bg-[rgba(34,197,94,0.08)] border border-[rgba(34,197,94,0.2)] text-[#4ade80] px-3 py-1.5 rounded-md text-[0.78rem] font-semibold"
-                    data-jp-item-id={(badge as { id?: string }).id ?? `legacy-${idx}`}
-                    data-jp-item-field="badges"
-                  >
-                    {badge.label}
-                  </span>
-                ))}
-              </div>
-            )}
-          </div>
-          <div className="border border-[rgba(255,255,255,0.06)] rounded-lg p-12 bg-[rgba(255,255,255,0.02)] text-center">
-            {data.engines && data.engines.length >= 2 && (
-              <div className="flex items-center justify-center gap-6 mb-8">
-                {data.engines.map((engine, idx) => (
-                  <React.Fragment key={idx}>
-                    {idx > 0 && (
-                      <span className="text-[var(--local-text-muted)] text-2xl opacity-50">⇄</span>
-                    )}
-                    <div
-                      className={
-                        engine.variant === 'tailwind'
-                          ? 'px-6 py-4 rounded-xl font-bold text-[0.95rem] border bg-[rgba(59,130,246,0.08)] border-[rgba(59,130,246,0.2)] text-[#60a5fa]'
-                          : 'px-6 py-4 rounded-xl font-bold text-[0.95rem] border bg-[rgba(34,197,94,0.08)] border-[rgba(34,197,94,0.2)] text-[#4ade80]'
-                      }
-                      data-jp-item-id={(engine as { id?: string }).id ?? `legacy-${idx}`}
-                      data-jp-item-field="engines"
-                    >
-                      {engine.label}
-                    </div>
-                  </React.Fragment>
-                ))}
-              </div>
-            )}
-            {data.codeSnippet && (
-              <div className="font-mono text-[0.85rem] text-[var(--local-text-muted)] bg-[var(--local-deep)] p-4 rounded-lg text-left border border-[rgba(255,255,255,0.04)]" data-jp-field="codeSnippet">
-                <pre className="whitespace-pre-wrap m-0">{data.codeSnippet}</pre>
-                <div className="mt-4 text-[0.75rem] text-center opacity-50">
-                  Same JSON. Different Render Engine.
-                </div>
-              </div>
-            )}
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/pa-section/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/pa-section/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/pa-section/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/pa-section/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData } from '@/lib/base-schemas';
-const PaBadgeSchema = z.object({
-  label: z.string().describe('ui:text'),
-});
-const PaEngineSchema = z.object({
-  label: z.string().describe('ui:text'),
-  variant: z.enum(['tailwind', 'bootstrap']).describe('ui:select'),
-});
-export const PaSectionSchema = BaseSectionData.extend({
-  label: z.string().optional().describe('ui:text'),
-  title: z.string().describe('ui:text'),
-  subtitle: z.string().describe('ui:text'),
-  paragraphs: z.array(z.object({ text: z.string().describe('ui:textarea') })).describe('ui:list'),
-  badges: z.array(PaBadgeSchema).optional().describe('ui:list'),
-  engines: z.array(PaEngineSchema).optional().describe('ui:list'),
-  codeSnippet: z.string().optional().describe('ui:textarea'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/pa-section/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/pa-section/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { PaSectionSchema } from './schema';
-export type PaSectionData = z.infer<typeof PaSectionSchema>;
-export type PaSectionSettings = z.infer<typeof BaseSectionSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/philosophy"
-echo "Creating src/components/philosophy/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/philosophy/View.tsx"
-import React from 'react';
-import type { PhilosophyData, PhilosophySettings } from './types';
-export const Philosophy: React.FC<{ data: PhilosophyData; settings?: PhilosophySettings }> = ({ data }) => {
-  const renderQuote = () => {
-    if (!data.quoteHighlightWord) {
-      return <>{data.quote}</>;
-    }
-    const parts = data.quote.split(data.quoteHighlightWord);
-    return (
-      <>
-        {parts.map((part, idx) => (
-          <React.Fragment key={idx}>
-            {part}
-            {idx < parts.length - 1 && (
-              <em className="not-italic text-[var(--local-accent)]">
-                {data.quoteHighlightWord}
-              </em>
-            )}
-          </React.Fragment>
-        ))}
-      </>
-    );
-  };
-  return (
-    <section
-      style={{
-        '--local-bg': 'var(--background)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-        '--local-primary': 'var(--primary)',
-      } as React.CSSProperties}
-      className="relative z-0 py-28 bg-[var(--local-bg)]"
-    >
-      <div className="max-w-[1200px] mx-auto px-8">
-        <div className="max-w-[760px] mx-auto text-center">
-          {data.label && (
-            <div className="jp-section-label inline-flex items-center gap-2 text-[0.72rem] font-bold uppercase tracking-[0.12em] text-[var(--local-accent)] mb-4" data-jp-field="label">
-              <span className="w-5 h-px bg-[var(--local-primary)]" />
-              {data.label}
-            </div>
-          )}
-          <h2 className="font-display text-[clamp(2rem,4vw,3.2rem)] font-extrabold text-[var(--local-text)] leading-[1.15] tracking-tight mb-4" data-jp-field="title">
-            {data.title}
-          </h2>
-          <blockquote className="font-display text-[clamp(1.6rem,3vw,2.4rem)] text-[var(--local-text)] font-bold leading-[1.35] my-8" data-jp-field="quote">
-            &ldquo;{renderQuote()}&rdquo;
-          </blockquote>
-          {data.description && (
-            <p className="text-[1.05rem] text-[var(--local-text-muted)] max-w-[560px] mx-auto leading-relaxed" data-jp-field="description">
-              {data.description}
-            </p>
-          )}
-        </div>
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/philosophy/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/philosophy/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/philosophy/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/philosophy/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData } from '@/lib/base-schemas';
-export const PhilosophySchema = BaseSectionData.extend({
-  label: z.string().optional().describe('ui:text'),
-  title: z.string().describe('ui:text'),
-  quote: z.string().describe('ui:textarea'),
-  quoteHighlightWord: z.string().optional().describe('ui:text'),
-  description: z.string().optional().describe('ui:textarea'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/philosophy/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/philosophy/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { PhilosophySchema } from './schema';
-export type PhilosophyData = z.infer<typeof PhilosophySchema>;
-export type PhilosophySettings = z.infer<typeof BaseSectionSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/pillars-grid"
-echo "Creating src/components/pillars-grid/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/pillars-grid/View.tsx"
-import React from 'react';
-import { cn } from '@/lib/utils';
-import { Icon, isIconName } from '@/lib/IconResolver';
-import type { PillarsGridData, PillarsGridSettings, PillarIconVariant, PillarTagVariant } from './types';
-const iconVariantStyles: Record<PillarIconVariant, string> = {
-  split: 'bg-[rgba(59,130,246,0.1)] text-[#60a5fa]',
-  registry: 'bg-[rgba(34,211,238,0.1)] text-[#22d3ee]',
-  federation: 'bg-[rgba(168,85,247,0.1)] text-[#c084fc]',
-};
-const tagVariantStyles: Record<PillarTagVariant, string> = {
-  core: 'bg-[rgba(59,130,246,0.1)] text-[#60a5fa]',
-  pattern: 'bg-[rgba(34,211,238,0.1)] text-[#22d3ee]',
-  enterprise: 'bg-[rgba(168,85,247,0.1)] text-[#c084fc]',
-};
-export const PillarsGrid: React.FC<{ data: PillarsGridData; settings?: PillarsGridSettings }> = ({ data }) => {
-  return (
-    <section
-      style={{
-        '--local-bg': 'var(--background)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-primary': 'var(--primary)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-        '--local-border': 'var(--border)',
-      } as React.CSSProperties}
-      className="relative z-0 py-28 bg-[var(--local-bg)]"
-    >
-      <div className="absolute top-0 left-1/2 -translate-x-1/2 w-[80%] h-px bg-gradient-to-r from-transparent via-[rgba(59,130,246,0.15)] to-transparent" />
-      <div className="max-w-[1200px] mx-auto px-8">
-        {data.label && (
-          <div className="jp-section-label inline-flex items-center gap-2 text-[0.72rem] font-bold uppercase tracking-[0.12em] text-[var(--local-accent)] mb-4" data-jp-field="label">
-            <span className="w-5 h-px bg-[var(--local-primary)]" />
-            {data.label}
-          </div>
-        )}
-        <h2 className="font-display text-[clamp(2rem,4vw,3.2rem)] font-extrabold text-[var(--local-text)] leading-[1.15] tracking-tight mb-4" data-jp-field="title">
-          {data.title}
-        </h2>
-        {data.description && (
-          <p className="text-lg text-[var(--local-text-muted)] max-w-[600px] leading-relaxed" data-jp-field="description">
-            {data.description}
-          </p>
-        )}
-        <div className="grid grid-cols-1 lg:grid-cols-3 gap-6 mt-14">
-          {data.pillars.map((pillar, idx) => (
-            <div
-              key={pillar.id ?? idx}
-              className="jp-pillar-card group relative border border-[rgba(255,255,255,0.06)] rounded-lg p-10 bg-[rgba(255,255,255,0.015)] transition-all duration-300 overflow-hidden hover:border-[rgba(59,130,246,0.2)] hover:-translate-y-1 hover:bg-[rgba(59,130,246,0.03)]"
-              data-jp-item-id={pillar.id ?? `legacy-${idx}`}
-              data-jp-item-field="pillars"
-            >
-              <div className="absolute top-0 left-0 right-0 h-[3px] bg-gradient-to-r from-[var(--local-primary)] to-[#22d3ee] opacity-0 group-hover:opacity-100 transition-opacity duration-300" />
-              <div className={cn(
-                'w-12 h-12 rounded-xl flex items-center justify-center mb-6 text-xl font-bold',
-                iconVariantStyles[pillar.iconVariant]
-              )}>
-                {pillar.icon && isIconName(pillar.icon) ? (
-                  <Icon name={pillar.icon} size={24} className="shrink-0" />
-                ) : pillar.icon ? (
-                  <span>{pillar.icon}</span>
-                ) : null}
-              </div>
-              <h3 className="text-xl font-bold text-[var(--local-text)] mb-3">
-                {pillar.title}
-              </h3>
-              <p className="text-[0.95rem] text-[var(--local-text-muted)] leading-relaxed">
-                {pillar.description}
-              </p>
-              <span className={cn(
-                'inline-block text-[0.7rem] font-semibold uppercase tracking-wide px-3 py-1 rounded mt-4',
-                tagVariantStyles[pillar.tagVariant]
-              )}>
-                {pillar.tag}
-              </span>
-            </div>
-          ))}
-        </div>
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/pillars-grid/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/pillars-grid/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/pillars-grid/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/pillars-grid/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData, BaseArrayItem } from '@/lib/base-schemas';
-export const PillarIconVariantSchema = z.enum(['split', 'registry', 'federation']);
-export const PillarTagVariantSchema = z.enum(['core', 'pattern', 'enterprise']);
-const PillarCardSchema = BaseArrayItem.extend({
-  icon: z.string().describe('ui:icon-picker'),
-  iconVariant: PillarIconVariantSchema.describe('ui:select'),
-  title: z.string().describe('ui:text'),
-  description: z.string().describe('ui:textarea'),
-  tag: z.string().describe('ui:text'),
-  tagVariant: PillarTagVariantSchema.describe('ui:select'),
-});
-export const PillarsGridSchema = BaseSectionData.extend({
-  label: z.string().optional().describe('ui:text'),
-  title: z.string().describe('ui:text'),
-  description: z.string().optional().describe('ui:textarea'),
-  pillars: z.array(PillarCardSchema).describe('ui:list'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/pillars-grid/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/pillars-grid/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { PillarsGridSchema, PillarIconVariantSchema, PillarTagVariantSchema } from './schema';
-export type PillarsGridData = z.infer<typeof PillarsGridSchema>;
-export type PillarsGridSettings = z.infer<typeof BaseSectionSettingsSchema>;
-export type PillarIconVariant = z.infer<typeof PillarIconVariantSchema>;
-export type PillarTagVariant = z.infer<typeof PillarTagVariantSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/problem-statement"
-echo "Creating src/components/problem-statement/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/problem-statement/View.tsx"
-import React from 'react';
-import { cn } from '@/lib/utils';
-import type { ProblemStatementData, ProblemStatementSettings, SiloBlockVariant } from './types';
-const variantStyles: Record<SiloBlockVariant, string> = {
-  red: 'bg-[rgba(239,68,68,0.08)] border-[rgba(239,68,68,0.3)] text-[#f87171]',
-  amber: 'bg-[rgba(245,158,11,0.08)] border-[rgba(245,158,11,0.3)] text-[#fbbf24]',
-  green: 'bg-[rgba(34,197,94,0.08)] border-[rgba(34,197,94,0.3)] text-[#4ade80]',
-  blue: 'bg-[rgba(59,130,246,0.08)] border-[rgba(59,130,246,0.3)] text-[#60a5fa]',
-};
-export const ProblemStatement: React.FC<{ data: ProblemStatementData; settings?: ProblemStatementSettings }> = ({ data }) => {
-  return (
-    <section
-      style={{
-        '--local-bg': 'var(--background)',
-        '--local-surface': 'var(--card)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-border': 'var(--border)',
-      } as React.CSSProperties}
-      className="jp-problem relative z-0 py-28 bg-gradient-to-b from-[var(--local-bg)] to-[var(--local-surface)]"
-    >
-      <div className="max-w-[1200px] mx-auto px-8">
-        <div className="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
-          <div className="relative h-[360px] border border-[rgba(255,255,255,0.06)] rounded-lg bg-[rgba(255,255,255,0.02)] overflow-hidden flex items-center justify-center">
-            <div className="text-center p-8">
-              {data.siloGroups.map((group, gIdx) => (
-                <div
-                  key={gIdx}
-                  className="mb-4"
-                  data-jp-item-id={(group as { id?: string }).id ?? `legacy-${gIdx}`}
-                  data-jp-item-field="siloGroups"
-                >
-                  <div className="flex flex-wrap justify-center gap-1.5">
-                    {group.blocks.map((block, bIdx) => (
-                      <span
-                        key={(block as { id?: string }).id ?? bIdx}
-                        className={cn(
-                          'inline-block px-4 py-2 rounded-lg text-[0.8rem] font-semibold border',
-                          variantStyles[block.variant]
-                        )}
-                        data-jp-item-id={(block as { id?: string }).id ?? `legacy-${bIdx}`}
-                        data-jp-item-field="blocks"
-                      >
-                        {block.label}
-                      </span>
-                    ))}
-                  </div>
-                  <span className="text-[0.7rem] text-[var(--local-text-muted)] uppercase tracking-widest mt-2 block opacity-60">
-                    {group.label}
-                  </span>
-                </div>
-              ))}
-            </div>
-          </div>
-          <div>
-            <h3 className="text-2xl font-bold text-[var(--local-text)] mb-4" data-jp-field="title">
-              {data.title}
-            </h3>
-            {data.paragraphs.map((p, idx) => (
-              <p
-                key={idx}
-                className="text-[var(--local-text-muted)] mb-5 text-[1.05rem] leading-relaxed"
-                data-jp-item-id={(p as { id?: string }).id ?? `legacy-${idx}`}
-                data-jp-item-field="paragraphs"
-              >
-                {p.isBold ? <strong className="text-[var(--local-text)]">{p.text}</strong> : p.text}
-              </p>
-            ))}
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/problem-statement/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/problem-statement/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/problem-statement/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/problem-statement/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData, BaseArrayItem } from '@/lib/base-schemas';
-export const SiloBlockVariantSchema = z.enum(['red', 'amber', 'green', 'blue']);
-const SiloBlockSchema = BaseArrayItem.extend({
-  label: z.string().describe('ui:text'),
-  variant: SiloBlockVariantSchema.describe('ui:select'),
-});
-const SiloGroupSchema = BaseArrayItem.extend({
-  blocks: z.array(SiloBlockSchema).describe('ui:list'),
-  label: z.string().describe('ui:text'),
-});
-const ProblemParagraphSchema = BaseArrayItem.extend({
-  text: z.string().describe('ui:textarea'),
-  isBold: z.boolean().default(false).describe('ui:checkbox'),
-});
-export const ProblemStatementSchema = BaseSectionData.extend({
-  siloGroups: z.array(SiloGroupSchema).describe('ui:list'),
-  title: z.string().describe('ui:text'),
-  paragraphs: z.array(ProblemParagraphSchema).describe('ui:list'),
-  highlight: z.string().optional().describe('ui:text'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/problem-statement/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/problem-statement/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { ProblemStatementSchema, SiloBlockVariantSchema } from './schema';
-export type ProblemStatementData = z.infer<typeof ProblemStatementSchema>;
-export type ProblemStatementSettings = z.infer<typeof BaseSectionSettingsSchema>;
-export type SiloBlockVariant = z.infer<typeof SiloBlockVariantSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/product-triad"
-echo "Creating src/components/product-triad/View.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/product-triad/View.tsx"
-import React from 'react';
-import { cn } from '@/lib/utils';
-import type { ProductTriadData, ProductTriadSettings } from './types';
-export const ProductTriad: React.FC<{ data: ProductTriadData; settings?: ProductTriadSettings }> = ({ data }) => {
-  return (
-    <section
-      style={{
-        '--local-bg': 'var(--background)',
-        '--local-text': 'var(--foreground)',
-        '--local-text-muted': 'var(--muted-foreground)',
-        '--local-primary': 'var(--primary)',
-        '--local-accent': 'var(--color-accent, #60a5fa)',
-        '--local-border': 'var(--border)',
-      } as React.CSSProperties}
-      className="relative z-0 py-28 bg-[var(--local-bg)]"
-    >
-      <div className="max-w-[1200px] mx-auto px-8">
-        <div className="text-center">
-          {data.label && (
-            <div className="jp-section-label inline-flex items-center gap-2 text-[0.72rem] font-bold uppercase tracking-[0.12em] text-[var(--local-accent)] mb-4" data-jp-field="label">
-              <span className="w-5 h-px bg-[var(--local-primary)]" />
-              {data.label}
-            </div>
-          )}
-          <h2 className="font-display text-[clamp(2rem,4vw,3.2rem)] font-extrabold text-[var(--local-text)] leading-[1.15] tracking-tight mb-4" data-jp-field="title">
-            {data.title}
-          </h2>
-          {data.description && (
-            <p className="text-lg text-[var(--local-text-muted)] max-w-[600px] mx-auto leading-relaxed" data-jp-field="description">
-              {data.description}
-            </p>
-          )}
-        </div>
-        <div className="grid grid-cols-1 lg:grid-cols-3 gap-6 mt-14">
-          {data.products.map((product, idx) => (
-            <div
-              key={product.id ?? idx}
-              className={cn(
-                'relative border rounded-lg p-10 transition-all duration-300 hover:-translate-y-1',
-                product.featured
-                  ? 'border-[rgba(59,130,246,0.3)] bg-gradient-to-b from-[rgba(59,130,246,0.06)] to-[rgba(59,130,246,0.01)] hover:border-[rgba(59,130,246,0.4)]'
-                  : 'border-[rgba(255,255,255,0.06)] bg-[rgba(255,255,255,0.015)] hover:border-[rgba(59,130,246,0.2)]'
-              )}
-              data-jp-item-id={product.id ?? `legacy-${idx}`}
-              data-jp-item-field="products"
-            >
-              {product.featured && (
-                <div className="absolute -top-3 left-1/2 -translate-x-1/2 bg-[var(--local-primary)] text-white text-[0.7rem] font-bold px-4 py-1 rounded-full uppercase tracking-wide">
-                  Most Popular
-                </div>
-              )}
-              <div className="text-[0.75rem] font-bold uppercase tracking-[0.1em] text-[var(--local-accent)] mb-2">
-                {product.tier}
-              </div>
-              <div className="text-2xl font-extrabold text-[var(--local-text)] mb-2">
-                {product.name}
-              </div>
-              <div className="font-display text-[2.2rem] font-extrabold text-[var(--local-text)] mb-1">
-                {product.price}
-                {product.priceSuffix && (
-                  <span className="text-[0.9rem] font-normal text-[var(--local-text-muted)]">
-                    {product.priceSuffix}
-                  </span>
-                )}
-              </div>
-              <div className="text-[0.85rem] text-[var(--local-text-muted)] mb-6 pb-6 border-b border-[rgba(255,255,255,0.06)]">
-                {product.delivery}
-              </div>
-              <ul className="mb-8 space-y-0">
-                {product.features.map((feature, fIdx) => (
-                  <li
-                    key={fIdx}
-                    className="text-[0.9rem] text-[#cbd5e1] py-1.5 pl-6 relative before:content-['✓'] before:absolute before:left-0 before:text-[var(--local-accent)] before:font-bold before:text-[0.8rem]"
-                  >
-                    {feature.text}
-                  </li>
-                ))}
-              </ul>
-              {product.ctaLabel && product.ctaHref && (
-                <a
-                  href={product.ctaHref}
-                  className={cn(
-                    'block text-center py-3 rounded-[5px] no-underline font-semibold text-[0.95rem] transition-all duration-200',
-                    product.ctaVariant === 'primary'
-                      ? 'bg-[var(--local-primary)] text-white hover:brightness-110 hover:-translate-y-px'
-                      : 'bg-[rgba(255,255,255,0.05)] text-[#e2e8f0] border border-[rgba(255,255,255,0.1)] hover:bg-[rgba(255,255,255,0.08)] hover:border-[rgba(255,255,255,0.2)]'
-                  )}
-                >
-                  {product.ctaLabel}
-                </a>
-              )}
-            </div>
-          ))}
-        </div>
-      </div>
-    </section>
-  );
-};
-END_OF_FILE_CONTENT
-echo "Creating src/components/product-triad/index.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/product-triad/index.ts"
-export * from './View';
-export * from './schema';
-export * from './types';
-END_OF_FILE_CONTENT
-echo "Creating src/components/product-triad/schema.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/product-triad/schema.ts"
-import { z } from 'zod';
-import { BaseSectionData, BaseArrayItem } from '@/lib/base-schemas';
-const ProductFeatureSchema = z.object({
-  text: z.string().describe('ui:text'),
-});
-const ProductCardSchema = BaseArrayItem.extend({
-  tier: z.string().describe('ui:text'),
-  name: z.string().describe('ui:text'),
-  price: z.string().describe('ui:text'),
-  priceSuffix: z.string().optional().describe('ui:text'),
-  delivery: z.string().describe('ui:text'),
-  features: z.array(ProductFeatureSchema).describe('ui:list'),
-  featured: z.boolean().default(false).describe('ui:checkbox'),
-  ctaLabel: z.string().optional().describe('ui:text'),
-  ctaHref: z.string().optional().describe('ui:text'),
-  ctaVariant: z.enum(['primary', 'secondary']).default('secondary').describe('ui:select'),
-});
-export const ProductTriadSchema = BaseSectionData.extend({
-  label: z.string().optional().describe('ui:text'),
-  title: z.string().describe('ui:text'),
-  description: z.string().optional().describe('ui:textarea'),
-  products: z.array(ProductCardSchema).describe('ui:list'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/components/product-triad/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/product-triad/types.ts"
-import { z } from 'zod';
-import { BaseSectionSettingsSchema } from '@/lib/base-schemas';
-import { ProductTriadSchema } from './schema';
-export type ProductTriadData = z.infer<typeof ProductTriadSchema>;
-export type ProductTriadSettings = z.infer<typeof BaseSectionSettingsSchema>;
-END_OF_FILE_CONTENT
-mkdir -p "src/components/ui"
-echo "Creating src/components/ui/checkbox.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/ui/checkbox.tsx"
-"use client"
-import * as React from "react"
-import { Checkbox as CheckboxPrimitive } from "radix-ui"
-import { cn } from "@/lib/utils"
-import { CheckIcon } from "lucide-react"
-function Checkbox({
-  className,
-  ...props
-}: React.ComponentProps<typeof CheckboxPrimitive.Root>) {
-  return (
-    <CheckboxPrimitive.Root
-      data-slot="checkbox"
-      className={cn(
-        "border-input dark:bg-input/30 data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary data-checked:border-primary aria-invalid:aria-checked:border-primary aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 flex size-4 items-center justify-center rounded-[4px] border transition-colors group-has-disabled/field:opacity-50 focus-visible:ring-3 aria-invalid:ring-3 peer relative shrink-0 outline-none after:absolute after:-inset-x-3 after:-inset-y-2 disabled:cursor-not-allowed disabled:opacity-50",
-        className
-      )}
-      {...props}
-    >
-      <CheckboxPrimitive.Indicator
-        data-slot="checkbox-indicator"
-        className="[&>svg]:size-3.5 grid place-content-center text-current transition-none"
-      >
-        <CheckIcon
-        />
-      </CheckboxPrimitive.Indicator>
-    </CheckboxPrimitive.Root>
-  )
-}
-export { Checkbox }
-END_OF_FILE_CONTENT
-echo "Creating src/components/ui/input.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/ui/input.tsx"
-import * as React from "react"
-import { cn } from "@/lib/utils"
-function Input({ className, type, ...props }: React.ComponentProps<"input">) {
-  return (
-    <input
-      type={type}
-      data-slot="input"
-      className={cn(
-        "dark:bg-input/30 border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 disabled:bg-input/50 dark:disabled:bg-input/80 h-8 rounded-lg border bg-transparent px-2.5 py-1 text-base transition-colors file:h-6 file:text-sm file:font-medium focus-visible:ring-3 aria-invalid:ring-3 md:text-sm file:text-foreground placeholder:text-muted-foreground w-full min-w-0 outline-none file:inline-flex file:border-0 file:bg-transparent disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-export { Input }
-END_OF_FILE_CONTENT
-echo "Creating src/components/ui/label.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/ui/label.tsx"
-import * as React from "react"
-import { Label as LabelPrimitive } from "radix-ui"
-import { cn } from "@/lib/utils"
-function Label({
-  className,
-  ...props
-}: React.ComponentProps<typeof LabelPrimitive.Root>) {
-  return (
-    <LabelPrimitive.Root
-      data-slot="label"
-      className={cn(
-        "gap-2 text-sm leading-none font-medium group-data-[disabled=true]:opacity-50 peer-disabled:opacity-50 flex items-center select-none group-data-[disabled=true]:pointer-events-none peer-disabled:cursor-not-allowed",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-export { Label }
-END_OF_FILE_CONTENT
-echo "Creating src/components/ui/select.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/ui/select.tsx"
-import * as React from "react"
-import { Select as SelectPrimitive } from "radix-ui"
-import { cn } from "@/lib/utils"
-import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react"
-function Select({
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Root>) {
-  return <SelectPrimitive.Root data-slot="select" {...props} />
-}
-function SelectGroup({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Group>) {
-  return (
-    <SelectPrimitive.Group
-      data-slot="select-group"
-      className={cn("scroll-my-1 p-1", className)}
-      {...props}
-    />
-  )
-}
-function SelectValue({
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Value>) {
-  return <SelectPrimitive.Value data-slot="select-value" {...props} />
-}
-function SelectTrigger({
-  className,
-  size = "default",
-  children,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
-  size?: "sm" | "default"
-}) {
-  return (
-    <SelectPrimitive.Trigger
-      data-slot="select-trigger"
-      data-size={size}
-      className={cn(
-        "border-input data-placeholder:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 gap-1.5 rounded-lg border bg-transparent py-2 pr-2 pl-2.5 text-sm transition-colors select-none focus-visible:ring-3 aria-invalid:ring-3 data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:gap-1.5 [&_svg:not([class*='size-'])]:size-4 flex w-full items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
-        className
-      )}
-      {...props}
-    >
-      {children}
-      <SelectPrimitive.Icon asChild>
-        <ChevronDownIcon className="text-muted-foreground size-4 pointer-events-none" />
-      </SelectPrimitive.Icon>
-    </SelectPrimitive.Trigger>
-  )
-}
-function SelectContent({
-  className,
-  children,
-  position = "popper",
-  align = "center",
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Content>) {
-  return (
-    <SelectPrimitive.Portal>
-      <SelectPrimitive.Content
-        data-slot="select-content"
-        data-align-trigger={position === "item-aligned"}
-        className={cn(
-          "bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 min-w-36 rounded-lg shadow-md ring-1 duration-100 relative z-[110] max-h-(--radix-select-content-available-height) origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto data-[align-trigger=true]:animate-none",
-          position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-          className
-        )}
-        position={position}
-        align={align}
-        {...props}
-      >
-        <SelectScrollUpButton />
-        <SelectPrimitive.Viewport
-          data-position={position}
-          className={cn(
-            "p-1",
-            position === "popper" && "h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)"
-          )}
-        >
-          {children}
-        </SelectPrimitive.Viewport>
-        <SelectScrollDownButton />
-      </SelectPrimitive.Content>
-    </SelectPrimitive.Portal>
-  )
-}
-function SelectLabel({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Label>) {
-  return (
-    <SelectPrimitive.Label
-      data-slot="select-label"
-      className={cn("text-muted-foreground px-1.5 py-1 text-xs", className)}
-      {...props}
-    />
-  )
-}
-function SelectItem({
-  className,
-  children,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Item>) {
-  return (
-    <SelectPrimitive.Item
-      data-slot="select-item"
-      className={cn(
-        "focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2 relative flex w-full cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
-        className
-      )}
-      {...props}
-    >
-      <span className="pointer-events-none absolute right-2 flex size-4 items-center justify-center">
-        <SelectPrimitive.ItemIndicator>
-          <CheckIcon className="pointer-events-none" />
-        </SelectPrimitive.ItemIndicator>
-      </span>
-      <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
-    </SelectPrimitive.Item>
-  )
-}
-function SelectSeparator({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
-  return (
-    <SelectPrimitive.Separator
-      data-slot="select-separator"
-      className={cn("bg-border -mx-1 my-1 h-px pointer-events-none", className)}
-      {...props}
-    />
-  )
-}
-function SelectScrollUpButton({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
-  return (
-    <SelectPrimitive.ScrollUpButton
-      data-slot="select-scroll-up-button"
-      className={cn("bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4", className)}
-      {...props}
-    >
-      <ChevronUpIcon />
-    </SelectPrimitive.ScrollUpButton>
-  )
-}
-function SelectScrollDownButton({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
-  return (
-    <SelectPrimitive.ScrollDownButton
-      data-slot="select-scroll-down-button"
-      className={cn("bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4", className)}
-      {...props}
-    >
-      <ChevronDownIcon />
-    </SelectPrimitive.ScrollDownButton>
-  )
-}
-export {
-  Select,
-  SelectContent,
-  SelectGroup,
-  SelectItem,
-  SelectLabel,
-  SelectScrollDownButton,
-  SelectScrollUpButton,
-  SelectSeparator,
-  SelectTrigger,
-  SelectValue,
-}
-END_OF_FILE_CONTENT
-echo "Creating src/components/ui/select.txt..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/ui/select.txt"
-import * as React from "react"
-import { Select as SelectPrimitive } from "radix-ui"
-import { cn } from "@/lib/utils"
-import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react"
-function Select({
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Root>) {
-  return <SelectPrimitive.Root data-slot="select" {...props} />
-}
-function SelectGroup({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Group>) {
-  return (
-    <SelectPrimitive.Group
-      data-slot="select-group"
-      className={cn("scroll-my-1 p-1", className)}
-      {...props}
-    />
-  )
-}
-function SelectValue({
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Value>) {
-  return <SelectPrimitive.Value data-slot="select-value" {...props} />
-}
-function SelectTrigger({
-  className,
-  size = "default",
-  children,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Trigger> & {
-  size?: "sm" | "default"
-}) {
-  return (
-    <SelectPrimitive.Trigger
-      data-slot="select-trigger"
-      data-size={size}
-      className={cn(
-        "border-input data-placeholder:text-muted-foreground dark:bg-input/30 dark:hover:bg-input/50 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 gap-1.5 rounded-lg border bg-transparent py-2 pr-2 pl-2.5 text-sm transition-colors select-none focus-visible:ring-3 aria-invalid:ring-3 data-[size=default]:h-8 data-[size=sm]:h-7 data-[size=sm]:rounded-[min(var(--radius-md),10px)] *:data-[slot=select-value]:gap-1.5 [&_svg:not([class*='size-'])]:size-4 flex w-full items-center justify-between whitespace-nowrap outline-none disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
-        className
-      )}
-      {...props}
-    >
-      {children}
-      <SelectPrimitive.Icon asChild>
-        <ChevronDownIcon className="text-muted-foreground size-4 pointer-events-none" />
-      </SelectPrimitive.Icon>
-    </SelectPrimitive.Trigger>
-  )
-}
-function SelectContent({
-  className,
-  children,
-  position = "popper",
-  align = "center",
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Content>) {
-  return (
-    <SelectPrimitive.Portal>
-      <SelectPrimitive.Content
-        data-slot="select-content"
-        data-align-trigger={position === "item-aligned"}
-        className={cn(
-          "bg-popover text-popover-foreground data-open:animate-in data-closed:animate-out data-closed:fade-out-0 data-open:fade-in-0 data-closed:zoom-out-95 data-open:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 ring-foreground/10 min-w-36 rounded-lg shadow-md ring-1 duration-100 relative z-[110] max-h-(--radix-select-content-available-height) origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto data-[align-trigger=true]:animate-none",
-          position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-          className
-        )}
-        position={position}
-        align={align}
-        {...props}
-      >
-        <SelectScrollUpButton />
-        <SelectPrimitive.Viewport
-          data-position={position}
-          className={cn(
-            "p-1",
-            position === "popper" && "h-(--radix-select-trigger-height) w-full min-w-(--radix-select-trigger-width)"
-          )}
-        >
-          {children}
-        </SelectPrimitive.Viewport>
-        <SelectScrollDownButton />
-      </SelectPrimitive.Content>
-    </SelectPrimitive.Portal>
-  )
-}
-function SelectLabel({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Label>) {
-  return (
-    <SelectPrimitive.Label
-      data-slot="select-label"
-      className={cn("text-muted-foreground px-1.5 py-1 text-xs", className)}
-      {...props}
-    />
-  )
-}
-function SelectItem({
-  className,
-  children,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Item>) {
-  return (
-    <SelectPrimitive.Item
-      data-slot="select-item"
-      className={cn(
-        "focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2 relative flex w-full cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
-        className
-      )}
-      {...props}
-    >
-      <span className="pointer-events-none absolute right-2 flex size-4 items-center justify-center">
-        <SelectPrimitive.ItemIndicator>
-          <CheckIcon className="pointer-events-none" />
-        </SelectPrimitive.ItemIndicator>
-      </span>
-      <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
-    </SelectPrimitive.Item>
-  )
-}
-function SelectSeparator({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.Separator>) {
-  return (
-    <SelectPrimitive.Separator
-      data-slot="select-separator"
-      className={cn("bg-border -mx-1 my-1 h-px pointer-events-none", className)}
-      {...props}
-    />
-  )
-}
-function SelectScrollUpButton({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
-  return (
-    <SelectPrimitive.ScrollUpButton
-      data-slot="select-scroll-up-button"
-      className={cn("bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4", className)}
-      {...props}
-    >
-      <ChevronUpIcon />
-    </SelectPrimitive.ScrollUpButton>
-  )
-}
-function SelectScrollDownButton({
-  className,
-  ...props
-}: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
-  return (
-    <SelectPrimitive.ScrollDownButton
-      data-slot="select-scroll-down-button"
-      className={cn("bg-popover z-10 flex cursor-default items-center justify-center py-1 [&_svg:not([class*='size-'])]:size-4", className)}
-      {...props}
-    >
-      <ChevronDownIcon />
-    </SelectPrimitive.ScrollDownButton>
-  )
-}
-export {
-  Select,
-  SelectContent,
-  SelectGroup,
-  SelectItem,
-  SelectLabel,
-  SelectScrollDownButton,
-  SelectScrollUpButton,
-  SelectSeparator,
-  SelectTrigger,
-  SelectValue,
-}
-END_OF_FILE_CONTENT
-echo "Creating src/components/ui/separator.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/ui/separator.tsx"
-"use client"
-import * as React from "react"
-import { Separator as SeparatorPrimitive } from "radix-ui"
-import { cn } from "@/lib/utils"
-function Separator({
-  className,
-  orientation = "horizontal",
-  decorative = true,
-  ...props
-}: React.ComponentProps<typeof SeparatorPrimitive.Root>) {
-  return (
-    <SeparatorPrimitive.Root
-      data-slot="separator"
-      decorative={decorative}
-      orientation={orientation}
-      className={cn(
-        "bg-border shrink-0 data-horizontal:h-px data-horizontal:w-full data-vertical:w-px data-vertical:self-stretch",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-export { Separator }
-END_OF_FILE_CONTENT
-echo "Creating src/components/ui/textarea.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/components/ui/textarea.tsx"
-import * as React from "react"
-import { cn } from "@/lib/utils"
-function Textarea({ className, ...props }: React.ComponentProps<"textarea">) {
-  return (
-    <textarea
-      data-slot="textarea"
-      className={cn(
-        "border-input dark:bg-input/30 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 disabled:bg-input/50 dark:disabled:bg-input/80 rounded-lg border bg-transparent px-2.5 py-2 text-base transition-colors focus-visible:ring-3 aria-invalid:ring-3 md:text-sm placeholder:text-muted-foreground flex field-sizing-content min-h-16 w-full outline-none disabled:cursor-not-allowed disabled:opacity-50",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-export { Textarea }
-END_OF_FILE_CONTENT
-mkdir -p "src/data"
-mkdir -p "src/data/config"
-echo "Creating src/data/config/menu.json..."
-cat << 'END_OF_FILE_CONTENT' > "src/data/config/menu.json"
-{
-  "main": [
-    {
-      "label": "Architecture",
-      "href": "#architecture"
-    },
-    {
-      "label": "Products",
-      "href": "#products"
-    },
-    {
-      "label": "PA Ready",
-      "href": "#pa-ready"
-    },
-    {
-      "label": "Philosophy",
-      "href": "#philosophy"
-    }
-  ]
-}
-END_OF_FILE_CONTENT
-# SKIP: src/data/config/menu.json:Zone.Identifier è un file binario e non può essere convertito in testo.
-echo "Creating src/data/config/site.json..."
-cat << 'END_OF_FILE_CONTENT' > "src/data/config/site.json"
-{
-  "identity": {
-    "title": "JsonPages",
-    "logoUrl": "/logo.svg"
-  },
-  "pages": [
-    {
-      "slug": "home",
-      "label": "Home"
-    },
-    {
-      "slug": "architecture",
-      "label": "Architecture"
-    },
-    {
-      "slug": "usage",
-      "label": "Usage"
-    }
-  ],
-  "header": {
-    "id": "global-header",
-    "type": "header",
-    "data": {
-      "logoText": "Json",
-      "logoHighlight": "Pages",
-      "logoIconText": "{ }",
-      "links": [
-        {
-          "label": "Architecture",
-          "href": "#architecture"
-        },
-        {
-          "label": "Products",
-          "href": "#products"
-        },
-        {
-          "label": "PA Ready",
-          "href": "#pa-ready"
-        },
-        {
-          "label": "Philosophy",
-          "href": "#philosophy"
-        }
-      ]
-    },
-    "settings": {
-      "sticky": true
-    }
-  },
-  "footer": {
-    "id": "global-footer",
-    "type": "footer",
-    "data": {
-      "brandText": "Json",
-      "brandHighlight": "Pages",
-      "copyright": "© 2026 JsonPages Ecosystem. Architected by Guido Filippo Serio.",
-      "links": [
-        {
-          "label": "Documentation",
-          "href": "#"
-        },
-        {
-          "label": "API Reference",
-          "href": "#"
-        },
-        {
-          "label": "Changelog",
-          "href": "#"
-        },
-        {
-          "label": "Privacy",
-          "href": "#"
-        }
-      ]
-    },
-    "settings": {
-      "showLogo": true
-    }
-  }
-}
-END_OF_FILE_CONTENT
-# SKIP: src/data/config/site.json:Zone.Identifier è un file binario e non può essere convertito in testo.
-echo "Creating src/data/config/theme.json..."
-cat << 'END_OF_FILE_CONTENT' > "src/data/config/theme.json"
-{
-  "name": "JsonPages Landing",
-  "tokens": {
-    "colors": {
-      "primary": "#3b82f6",
-      "secondary": "#22d3ee",
-      "accent": "#60a5fa",
-      "background": "#060d1b",
-      "surface": "#0b1529",
-      "surfaceAlt": "#101e38",
-      "text": "#e2e8f0",
-      "textMuted": "#94a3b8",
-      "border": "#162a4d"
-    },
-    "typography": {
-      "fontFamily": {
-        "primary": "'Instrument Sans', system-ui, sans-serif",
-        "mono": "'JetBrains Mono', monospace",
-        "display": "'Playfair Display', Georgia, serif"
-      }
-    },
-    "borderRadius": {
-      "sm": "5px",
-      "md": "7px",
-      "lg": "8px"
-    }
-  }
-}
-END_OF_FILE_CONTENT
-# SKIP: src/data/config/theme.json:Zone.Identifier è un file binario e non può essere convertito in testo.
-mkdir -p "src/data/pages"
-echo "Creating src/data/pages/home.json..."
-cat << 'END_OF_FILE_CONTENT' > "src/data/pages/home.json"
-{
-  "id": "home-page",
-  "slug": "home",
-  "meta": {
-    "title": "JsonPages — Global Authoring. Global Governance.",
-    "description": "A high-fidelity Site Factory that solves the scalability bottleneck of traditional CMS systems."
-  },
-  "sections": [
-    {
-      "id": "hero-main",
-      "type": "hero",
-      "data": {
-        "badge": "Composable UI Engine ·  v1.0",
-        "title": "Local Authoring.",
-        "titleHighlight": "Global Governance.",
-        "description": "JsonPages is a high-fidelity Site Factory that solves the scalability bottleneck of traditional CMS systems. Distribute, govern, and render UI components across hundreds of independent sites — without technical drift.",
-        "ctas": [
-          {
-            "label": "Explore Products →",
-            "href": "#products",
-            "variant": "primary"
-          },
-          {
-            "label": "Read the Spec",
-            "href": "#architecture",
-            "variant": "secondary"
-          }
-        ],
-        "metrics": [
-          {
-            "val": "100+",
-            "label": "Pages per tenant"
-          },
-          {
-            "val": "0ms",
-            "label": "Runtime overhead"
-          },
-          {
-            "val": "∞",
-            "label": "Scalable blocks"
-          }
-        ]
-      },
-      "settings": {}
-    },
-    {
-      "id": "problem-statement",
-      "type": "problem-statement",
-      "data": {
-        "siloGroups": [
-          {
-            "blocks": [
-              {
-                "label": "Agency A Stack",
-                "variant": "red"
-              },
-              {
-                "label": "Custom CMS",
-                "variant": "red"
-              },
-              {
-                "label": "PHP Backend",
-                "variant": "red"
-              }
-            ],
-            "label": "Silo #1"
-          },
-          {
-            "blocks": [
-              {
-                "label": "Agency B Tools",
-                "variant": "amber"
-              },
-              {
-                "label": "WordPress",
-                "variant": "amber"
-              },
-              {
-                "label": "LAMP Stack",
-                "variant": "amber"
-              }
-            ],
-            "label": "Silo #2"
-          },
-          {
-            "blocks": [
-              {
-                "label": "Agency C Kit",
-                "variant": "green"
-              },
-              {
-                "label": "React App",
-                "variant": "green"
-              },
-              {
-                "label": "Node.js",
-                "variant": "green"
-              }
-            ],
-            "label": "Silo #3"
-          }
-        ],
-        "title": "Traditional CMS systems create closed silos.",
-        "paragraphs": [
-          {
-            "text": "When global brands delegate web projects to multiple agencies, each agency picks its own stack, its own conventions, its own deployment pipeline. The result is a portfolio of ungovernable sites with inconsistent quality and unpredictable maintenance costs.",
-            "isBold": false
-          },
-          {
-            "text": "JsonPages eliminates this by providing a centralized protocol to distribute, govern, and render UI components — ensuring every site, regardless of who builds it, conforms to a single typed ontology.",
-            "isBold": true
-          }
-        ],
-        "anchorId": "aa"
-      },
-      "settings": {}
-    },
-    {
-      "id": "architecture-pillars",
-      "type": "pillars-grid",
-      "data": {
-        "anchorId": "architecture",
-        "label": "Core Architecture",
-        "title": "Three Pillars of Composability",
-        "description": "A contract-first architecture designed to scale without core refactoring.",
-        "pillars": [
-          {
-            "icon": "box",
-            "iconVariant": "split",
-            "title": "The Machine-Readable Blueprint. 📐",
-            "description": "We enforce a strict file-system ontology that physically separates Global Governance from Local Content. By utilizing \"Dumb Components\" (CIP), we create a deterministic environment where the UI is a predictable function of data. This protocol allows AI agents to understand your site structure instantly, eliminating the \"guessing game\" of traditional web development.",
-            "tag": "The Foundation",
-            "tagVariant": "core"
-          },
-          {
-            "icon": "sparkles",
-            "iconVariant": "registry",
-            "title": "The Semantic Brain. 🧠",
-            "description": "We reject hardcoded Union Types. The Kernel defines an open registry where independent modules inject their DNA via Zod schemas. This provides the AI with a precise, type-safe vocabulary to build brand-compliant interfaces. Because the registry is the Single Source of Truth, the AI knows exactly which components exist and how to configure them without ever touching the core code.",
-            "tag": "The Vocabulary",
-            "tagVariant": "pattern"
-          },
-          {
-            "icon": "zap",
-            "iconVariant": "federation",
-            "title": "The 5-Minute Tenant. 🤖",
-            "description": "AI doesn't guess; it follows the Protocol. Because our ecosystem is governed by 5 deterministic standards, agents like Claude can project a complex, multi-page, brand-compliant tenant in under 5 minutes. The result is 100% Type-Safe JSON that perfectly matches your schemas, delivering a production-ready site with zero technical drift and an instant polymorphic CMS.",
-            "tag": "The Multiplier",
-            "tagVariant": "enterprise"
-          }
-        ]
-      },
-      "settings": {}
-    },
-    {
-      "id": "layered-architecture",
-      "type": "arch-layers",
-      "data": {
-        "anchorId": "layers",
-        "label": "Engineering Layers",
-        "title": "Strict Boundaries. Clean Contracts.",
-        "description": "Three architectural layers maintain the separation between engine and implementation.",
-        "layers": [
-          {
-            "number": "0",
-            "layerLevel": "l0",
-            "title": "The Immutable Kernel",
-            "description": "Defines the base structure of a Section — ID, Type, Payload, Settings — and exports the computed union. Zero knowledge of UI implementation or business logic."
-          },
-          {
-            "number": "1",
-            "layerLevel": "l1",
-            "title": "The Standard Library",
-            "description": "Fundamental components (Hero, Text, Grid) used across 90% of projects. Augments the Kernel's registry while remaining part of the internal ecosystem."
-          },
-          {
-            "number": "2",
-            "layerLevel": "l2",
-            "title": "User-Land Extensions",
-            "description": "The enabling layer. Third-party developers define specialized blocks — StockTickers, CRM Forms — in their own repositories. These extensions plug into the Kernel at compile-time."
-          }
-        ],
-        "codeFilename": "libs/shared-data/src/lib/core.ts",
-        "codeLines": [
-          {
-            "content": "// 🛡️ KERNEL — Single Source of Truth",
-            "tokenType": "comment"
-          },
-          {
-            "content": "",
-            "tokenType": "plain"
-          },
-          {
-            "content": "export interface SectionDataRegistry {",
-            "tokenType": "keyword"
-          },
-          {
-            "content": "  // Open Registry: modules inject here",
-            "tokenType": "comment"
-          },
-          {
-            "content": "}",
-            "tokenType": "plain"
-          },
-          {
-            "content": "",
-            "tokenType": "plain"
-          },
-          {
-            "content": "export interface BaseSection<K extends keyof SectionDataRegistry> {",
-            "tokenType": "keyword"
-          },
-          {
-            "content": "  id: string;",
-            "tokenType": "type"
-          },
-          {
-            "content": "  type: K;",
-            "tokenType": "type"
-          },
-          {
-            "content": "  data: SectionDataRegistry[K];",
-            "tokenType": "type"
-          },
-          {
-            "content": "  settings?: SectionSettings;",
-            "tokenType": "type"
-          },
-          {
-            "content": "}",
-            "tokenType": "plain"
-          },
-          {
-            "content": "",
-            "tokenType": "plain"
-          },
-          {
-            "content": "// Computed Union — built automatically from registry",
-            "tokenType": "comment"
-          },
-          {
-            "content": "export type Section =",
-            "tokenType": "keyword"
-          },
-          {
-            "content": "  { [K in keyof SectionDataRegistry]: BaseSection<K> }",
-            "tokenType": "type"
-          },
-          {
-            "content": "  [keyof SectionDataRegistry];",
-            "tokenType": "operator"
-          }
-        ]
-      },
-      "settings": {}
-    },
-    {
-      "id": "product-triad",
-      "type": "product-triad",
-      "data": {
-        "anchorId": "products",
-        "label": "Product Triad",
-        "title": "One Protocol. Three Products.",
-        "description": "From solo developers to global enterprises — the same underlying ontology powers every tier.",
-        "products": [
-          {
-            "tier": "Starter",
-            "name": "JsonPage",
-            "price": "NPM",
-            "priceSuffix": "Local Install",
-            "delivery": "Static Export · Zero Runtime",
-            "features": [
-              {
-                "text": "Local Authoring SDK"
-              },
-              {
-                "text": "Zero-Runtime HTML Bake"
-              },
-              {
-                "text": "Pure HTML/CSS Export"
-              },
-              {
-                "text": "CDN-Ready Delivery"
-              },
-              {
-                "text": "Full Code Ownership"
-              }
-            ],
-            "featured": false
-          },
-          {
-            "tier": "Professional",
-            "name": "JsonPages",
-            "price": "SaaS",
-            "priceSuffix": "/month",
-            "delivery": "Managed Cloud · Multi-Tenant",
-            "features": [
-              {
-                "text": "Multi-Tenant Hosting"
-              },
-              {
-                "text": "Premium Block Library"
-              },
-              {
-                "text": "SchemaUI Components"
-              },
-              {
-                "text": "In-Context Editing"
-              },
-              {
-                "text": "AI-Native Protocol"
-              },
-              {
-                "text": "Tailwind v4 & BI Engine"
-              }
-            ],
-            "featured": false
-          },
-          {
-            "tier": "Enterprise",
-            "name": "The Platform",
-            "price": "Custom",
-            "delivery": "Private Cloud · Enterprise Governance",
-            "features": [
-              {
-                "text": "Private Federated Registry"
-              },
-              {
-                "text": "Module Federation"
-              },
-              {
-                "text": "Runtime Component Injection"
-              },
-              {
-                "text": "Custom Brand Guidelines"
-              },
-              {
-                "text": "Dedicated SLA & Support"
-              },
-              {
-                "text": "SSO & RBAC"
-              }
-            ],
-            "featured": false
-          }
-        ]
-      },
-      "settings": {}
-    },
-    {
-      "id": "pa-ready",
-      "type": "pa-section",
-      "data": {
-        "anchorId": "pa-ready",
-        "label": "Public Sector",
-        "title": "PA Ready — One Platform, Two Markets",
-        "subtitle": "The Only Builder with Native Bootstrap Italia.",
-        "paragraphs": [
-          {
-            "text": "By switching the rendering engine to Bootstrap Italia, System Integrators use the same high-efficiency workflow to deliver WCAG-compliant sites for Municipalities and Government bodies — without rewriting backend logic."
-          },
-          {
-            "text": "The same JSON ontology drives both the Tailwind-powered private sector and the Bootstrap Italia public sector pipeline. This is not flexibility — this is Business Continuity."
-          }
-        ],
-        "badges": [
-          {
-            "label": "PNRR Ready"
-          },
-          {
-            "label": "WCAG 2.1 AA"
-          },
-          {
-            "label": "AgID Compliant"
-          }
-        ],
-        "engines": [
-          {
-            "label": "Tailwind v4",
-            "variant": "tailwind"
-          },
-          {
-            "label": "Bootstrap Italia",
-            "variant": "bootstrap"
-          }
-        ],
-        "codeSnippet": "{\n  \"type\": \"hero\",\n  \"data\": { \"title\": \"...\" },\n  \"settings\": { \"engine\": \"auto\" }\n}"
-      },
-      "settings": {}
-    },
-    {
-      "id": "philosophy",
-      "type": "philosophy",
-      "data": {
-        "anchorId": "philosophy",
-        "label": "Our Philosophy",
-        "title": "Governance Over Captivity",
-        "quote": "We sell the infrastructure to manage UI — not the right to access the code.",
-        "quoteHighlightWord": "manage",
-        "description": "Unlike closed-garden platforms, JsonPages provides an Eject Button by design. The Bake Engine exports your site as pure HTML/CSS with zero backend requirements. If you leave the SaaS, the shared ontology and SDK ensure you remain fully operational and independent. We earn your loyalty through value — not lock-in."
-      },
-      "settings": {}
-    },
-    {
-      "id": "cta-final",
-      "type": "cta-banner",
-      "data": {
-        "anchorId": "start",
-        "label": "Local Authoring Global Governance",
-        "title": "Ready to Govern at Scale?",
-        "description": "Whether you're building a single site or managing a portfolio of hundreds — JsonPages scales with your ambition."
-      },
-      "settings": {}
-    }
-  ]
-}
-END_OF_FILE_CONTENT
-# SKIP: src/data/pages/home.json:Zone.Identifier è un file binario e non può essere convertito in testo.
-mkdir -p "src/hooks"
-echo "Creating src/hooks/useDocumentMeta.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/hooks/useDocumentMeta.ts"
-import { useEffect } from 'react';
-import type { PageMeta } from '@/types';
-export const useDocumentMeta = (meta: PageMeta): void => {
-  useEffect(() => {
-    // Set document title
-    document.title = meta.title;
-    // Set or update meta description
-    let metaDescription = document.querySelector('meta[name="description"]');
-    if (!metaDescription) {
-      metaDescription = document.createElement('meta');
-      metaDescription.setAttribute('name', 'description');
-      document.head.appendChild(metaDescription);
-    }
-    metaDescription.setAttribute('content', meta.description);
-  }, [meta.title, meta.description]);
-};
-END_OF_FILE_CONTENT
-echo "Creating src/index.css..."
-cat << 'END_OF_FILE_CONTENT' > "src/index.css"
-@import "tailwindcss";
-@source "./**/*.tsx";
-@theme {
-  /*
-     🎯 MASTER MAPPING (V2.7 Landing)
-  */
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-border: var(--border);
-  --radius-lg: var(--radius);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-sm: calc(var(--radius) - 4px);
-  --font-primary: var(--theme-font-primary);
-  --font-mono: var(--theme-font-mono);
-  /*
-     🔧 DISPLAY FONT — Forward-compatible workaround
-     theme-manager.ts does NOT inject --theme-font-display (Skeleton v2.7 gap).
-     The var() falls through to the hardcoded fallback today.
-     When Skeleton v2.8 wires display into theme-manager, the var() will resolve
-     automatically and the fallback becomes dead code.
-  */
-  --font-display: var(--theme-font-display, 'Playfair Display', Georgia, serif);
-}
-/*
-   🌍 TENANT BRAND TOKENS (JSP 1.5)
-*/
-:root {
-  --background: var(--theme-background);
-  --foreground: var(--theme-text);
-  --card: var(--theme-surface);
-  --card-foreground: var(--theme-text);
-  --primary: var(--theme-primary);
-  --primary-foreground: oklch(0.98 0 0);
-  --secondary: var(--theme-secondary);
-  --secondary-foreground: var(--theme-text);
-  --muted: var(--theme-surface-alt);
-  --muted-foreground: var(--theme-text-muted);
-  --border: var(--theme-border);
-  --radius: 0.45rem;
-  /*
-     🔧 ACCENT CHAIN — Forward-compatible workaround
-     theme-manager.ts already injects --theme-accent on :root,
-     but the original index.css never bridged it into the semantic layer.
-     This closes the gap: --theme-accent → --accent → --color-accent.
-     Falls back to --theme-primary if accent is undefined.
-  */
-  --accent: var(--theme-accent, var(--theme-primary));
-}
-@layer base {
-  * { border-color: var(--border); }
-  body {
-    background-color: var(--background);
-    color: var(--foreground);
-    font-family: var(--font-primary);
-    line-height: 1.7;
-    overflow-x: hidden;
-    @apply antialiased;
-  }
-}
-/* ==========================================================================
-   FONT DISPLAY UTILITY
-   Maps .font-display class to the display font family (Playfair Display)
-   ========================================================================== */
-.font-display {
-  font-family: var(--font-display, var(--font-primary));
-}
-/* ==========================================================================
-   LANDING ANIMATIONS
-   ========================================================================== */
-@keyframes jp-fadeUp {
-  from { opacity: 0; transform: translateY(30px); }
-  to { opacity: 1; transform: translateY(0); }
-}
-@keyframes jp-pulseDot {
-  0%, 100% { opacity: 1; }
-  50% { opacity: 0.3; }
-}
-.jp-animate-in {
-  opacity: 0;
-  animation: jp-fadeUp 0.7s ease forwards;
-}
-.jp-d1 { animation-delay: 0.1s; }
-.jp-d2 { animation-delay: 0.2s; }
-.jp-d3 { animation-delay: 0.3s; }
-.jp-d4 { animation-delay: 0.4s; }
-.jp-d5 { animation-delay: 0.5s; }
-.jp-pulse-dot {
-  animation: jp-pulseDot 2s ease infinite;
-}
-/* ==========================================================================
-   SMOOTH SCROLL
-   ========================================================================== */
-html {
-  scroll-behavior: smooth;
-}
-/* ==========================================================================
-   ICE ADMIN — Section highlight in preview iframe
-   The preview iframe only receives tenant CSS; core's overlay classes
-   (z-[50], absolute, etc.) are not in this build. Define them here so
-   the section highlight is always visible in /admin.
-   ========================================================================== */
-[data-jp-section-overlay] {
-  position: absolute;
-  inset: 0;
-  z-index: 9999;
-  pointer-events: none;
-  transition: border-color 0.2s, background-color 0.2s;
-  border: 2px solid transparent;
-}
-[data-section-id]:hover [data-jp-section-overlay] {
-  border-color: rgba(96, 165, 250, 0.5);
-  border-style: dashed;
-}
-[data-section-id][data-jp-selected] [data-jp-section-overlay] {
-  border-color: rgb(37, 99, 235);
-  border-style: solid;
-  background-color: rgba(59, 130, 246, 0.05);
-}
-[data-jp-section-overlay] > div {
-  position: absolute;
-  top: 0;
-  right: 0;
-  padding: 0.25rem 0.5rem;
-  font-size: 9px;
-  font-weight: 800;
-  text-transform: uppercase;
-  letter-spacing: 0.1em;
-  background: rgb(37, 99, 235);
-  color: white;
-  transition: opacity 0.2s;
-}
-[data-section-id]:hover [data-jp-section-overlay] > div,
-[data-section-id][data-jp-selected] [data-jp-section-overlay] > div {
-  opacity: 1;
-}
-[data-section-id] [data-jp-section-overlay] > div {
-  opacity: 0;
-}
-END_OF_FILE_CONTENT
-mkdir -p "src/lib"
-echo "Creating src/lib/ComponentRegistry.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/lib/ComponentRegistry.tsx"
-import React from 'react';
-import { Header } from '@/components/header';
-import { Footer } from '@/components/footer';
-import { Hero } from '@/components/hero';
-import { FeatureGrid } from '@/components/feature-grid';
-import { CodeBlock } from '@/components/code-block';
-import { ProblemStatement } from '@/components/problem-statement';
-import { PillarsGrid } from '@/components/pillars-grid';
-import { ArchLayers } from '@/components/arch-layers';
-import { ProductTriad } from '@/components/product-triad';
-import { PaSection } from '@/components/pa-section';
-import { Philosophy } from '@/components/philosophy';
-import { CtaBanner } from '@/components/cta-banner';
-import type { SectionType } from '@jsonpages/core';
-import type { SectionComponentPropsMap } from '@/types';
-export const ComponentRegistry: {
-  [K in SectionType]: React.FC<SectionComponentPropsMap[K]>;
-} = {
-  'header': Header,
-  'footer': Footer,
-  'hero': Hero,
-  'feature-grid': FeatureGrid,
-  'code-block': CodeBlock,
-  'problem-statement': ProblemStatement,
-  'pillars-grid': PillarsGrid,
-  'arch-layers': ArchLayers,
-  'product-triad': ProductTriad,
-  'pa-section': PaSection,
-  'philosophy': Philosophy,
-  'cta-banner': CtaBanner,
-};
-END_OF_FILE_CONTENT
-echo "Creating src/lib/IconResolver.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/lib/IconResolver.tsx"
-import React from 'react';
-import {
-  Layers,
-  Github,
-  ArrowRight,
-  Box,
-  Terminal,
-  ChevronRight,
-  Menu,
-  X,
-  Sparkles,
-  Zap,
-  type LucideIcon
-} from 'lucide-react';
-const iconMap = {
-  'layers': Layers,
-  'github': Github,
-  'arrow-right': ArrowRight,
-  'box': Box,
-  'terminal': Terminal,
-  'chevron-right': ChevronRight,
-  'menu': Menu,
-  'x': X,
-  'sparkles': Sparkles,
-  'zap': Zap,
-} as const satisfies Record<string, LucideIcon>;
-export type IconName = keyof typeof iconMap;
-export function isIconName(s: string): s is IconName {
-  return s in iconMap;
-}
-interface IconProps {
-  name: string;
-  size?: number;
-  className?: string;
-}
-export const Icon: React.FC<IconProps> = ({ name, size = 20, className }) => {
-  const IconComponent = isIconName(name) ? iconMap[name] : undefined;
-  if (!IconComponent) {
-    if (import.meta.env.DEV) {
-      console.warn(`[IconResolver] Unknown icon: "${name}". Add it to iconMap.`);
-    }
-    return null;
-  }
-  return <IconComponent size={size} className={className} />;
-};
-END_OF_FILE_CONTENT
-echo "Creating src/lib/addSectionConfig.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/lib/addSectionConfig.ts"
-/**
- * Add-section config for the ICE admin (tenant-alpha).
- * Provides default data and labels for each addable section type.
- * Core remains agnostic; this file is tenant-specific.
- */
-import type { AddSectionConfig } from '@jsonpages/core';
-const addableSectionTypes = [
-  'hero',
-  'feature-grid',
-  'code-block',
-  'problem-statement',
-  'pillars-grid',
-  'arch-layers',
-  'product-triad',
-  'pa-section',
-  'philosophy',
-  'cta-banner',
-] as const;
-const sectionTypeLabels: Record<string, string> = {
-  'hero': 'Hero',
-  'feature-grid': 'Feature Grid',
-  'code-block': 'Code Block',
-  'problem-statement': 'Problem Statement',
-  'pillars-grid': 'Pillars Grid',
-  'arch-layers': 'Architecture Layers',
-  'product-triad': 'Product Triad',
-  'pa-section': 'PA Section',
-  'philosophy': 'Philosophy',
-  'cta-banner': 'CTA Banner',
-};
-function getDefaultSectionData(sectionType: string): Record<string, unknown> {
-  switch (sectionType) {
-    case 'hero':
-      return { title: 'New Hero', description: '' };
-    case 'feature-grid':
-      return { sectionTitle: 'Features', cards: [] };
-    case 'code-block':
-      return { lines: [] };
-    case 'problem-statement':
-      return { title: 'Problem Statement', siloGroups: [], paragraphs: [] };
-    case 'pillars-grid':
-      return { title: 'Pillars', pillars: [] };
-    case 'arch-layers':
-      return { title: 'Architecture', layers: [] };
-    case 'product-triad':
-      return { title: 'Products', products: [] };
-    case 'pa-section':
-      return { title: 'Section', subtitle: 'Subtitle', paragraphs: [{ text: '' }] };
-    case 'philosophy':
-      return { title: 'Philosophy', quote: 'Your quote here.' };
-    case 'cta-banner':
-      return { title: 'Call to Action', description: '' };
-    default:
-      return {};
-  }
-}
-export const addSectionConfig: AddSectionConfig = {
-  addableSectionTypes: [...addableSectionTypes],
-  sectionTypeLabels,
-  getDefaultSectionData,
-};
-END_OF_FILE_CONTENT
-echo "Creating src/lib/base-schemas.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/lib/base-schemas.ts"
-import { z } from 'zod';
-/**
- * Base schemas shared by section capsules (CIP governance).
- * Capsules extend these for consistent anchorId, array items, and settings.
- */
-export const BaseSectionData = z.object({
-  anchorId: z.string().optional().describe('ui:text'),
-});
-export const BaseArrayItem = z.object({
-  id: z.string().optional(),
-});
-export const BaseSectionSettingsSchema = z.object({
-  paddingTop: z.enum(['none', 'sm', 'md', 'lg', 'xl', '2xl']).default('md').describe('ui:select'),
-  paddingBottom: z.enum(['none', 'sm', 'md', 'lg', 'xl', '2xl']).default('md').describe('ui:select'),
-  theme: z.enum(['dark', 'light', 'accent']).default('dark').describe('ui:select'),
-  container: z.enum(['boxed', 'fluid']).default('boxed').describe('ui:select'),
-});
-export const CtaSchema = z.object({
-  id: z.string().optional(),
-  label: z.string().describe('ui:text'),
-  href: z.string().describe('ui:text'),
-  variant: z.enum(['primary', 'secondary']).default('primary').describe('ui:select'),
-});
-END_OF_FILE_CONTENT
-echo "Creating src/lib/schemas.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/lib/schemas.ts"
-/**
- * SECTION_SCHEMAS registry — SSOT for FormFactory.
- * Re-exports base schemas and aggregates all section schemas from TBP capsules.
- */
-export {
-  BaseSectionData,
-  BaseArrayItem,
-  BaseSectionSettingsSchema,
-  CtaSchema,
-} from './base-schemas';
-import { HeaderSchema } from '@/components/header';
-import { FooterSchema } from '@/components/footer';
-import { HeroSchema } from '@/components/hero';
-import { FeatureGridSchema } from '@/components/feature-grid';
-import { CodeBlockSchema } from '@/components/code-block';
-import { ProblemStatementSchema } from '@/components/problem-statement';
-import { PillarsGridSchema } from '@/components/pillars-grid';
-import { ArchLayersSchema } from '@/components/arch-layers';
-import { ProductTriadSchema } from '@/components/product-triad';
-import { PaSectionSchema } from '@/components/pa-section';
-import { PhilosophySchema } from '@/components/philosophy';
-import { CtaBannerSchema } from '@/components/cta-banner';
-export const SECTION_SCHEMAS = {
-  'header': HeaderSchema,
-  'footer': FooterSchema,
-  'hero': HeroSchema,
-  'feature-grid': FeatureGridSchema,
-  'code-block': CodeBlockSchema,
-  'problem-statement': ProblemStatementSchema,
-  'pillars-grid': PillarsGridSchema,
-  'arch-layers': ArchLayersSchema,
-  'product-triad': ProductTriadSchema,
-  'pa-section': PaSectionSchema,
-  'philosophy': PhilosophySchema,
-  'cta-banner': CtaBannerSchema,
-} as const;
-export type SectionType = keyof typeof SECTION_SCHEMAS;
-END_OF_FILE_CONTENT
-echo "Creating src/lib/utils.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/lib/utils.ts"
-import { clsx, type ClassValue } from 'clsx';
-import { twMerge } from 'tailwind-merge';
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs));
-}
-END_OF_FILE_CONTENT
-echo "Creating src/main.tsx..."
-cat << 'END_OF_FILE_CONTENT' > "src/main.tsx"
-import '@/types'; // TBP: load type augmentation from capsule-driven types
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import App from './App';
-// ... resto del file
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <App />
-  </React.StrictMode>
-);
-END_OF_FILE_CONTENT
-# SKIP: src/registry-types.ts è un file binario e non può essere convertito in testo.
-echo "Creating src/types.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/types.ts"
-import type { MenuItem } from '@jsonpages/core';
-import type { HeaderData, HeaderSettings } from '@/components/header';
-import type { FooterData, FooterSettings } from '@/components/footer';
-import type { HeroData, HeroSettings } from '@/components/hero';
-import type { FeatureGridData, FeatureGridSettings } from '@/components/feature-grid';
-import type { CodeBlockData, CodeBlockSettings } from '@/components/code-block';
-import type { ProblemStatementData, ProblemStatementSettings } from '@/components/problem-statement';
-import type { PillarsGridData, PillarsGridSettings } from '@/components/pillars-grid';
-import type { ArchLayersData, ArchLayersSettings } from '@/components/arch-layers';
-import type { ProductTriadData, ProductTriadSettings } from '@/components/product-triad';
-import type { PaSectionData, PaSectionSettings } from '@/components/pa-section';
-import type { PhilosophyData, PhilosophySettings } from '@/components/philosophy';
-import type { CtaBannerData, CtaBannerSettings } from '@/components/cta-banner';
-export type SectionComponentPropsMap = {
-  'header': { data: HeaderData; settings?: HeaderSettings; menu: MenuItem[] };
-  'footer': { data: FooterData; settings?: FooterSettings };
-  'hero': { data: HeroData; settings?: HeroSettings };
-  'feature-grid': { data: FeatureGridData; settings?: FeatureGridSettings };
-  'code-block': { data: CodeBlockData; settings?: CodeBlockSettings };
-  'problem-statement': { data: ProblemStatementData; settings?: ProblemStatementSettings };
-  'pillars-grid': { data: PillarsGridData; settings?: PillarsGridSettings };
-  'arch-layers': { data: ArchLayersData; settings?: ArchLayersSettings };
-  'product-triad': { data: ProductTriadData; settings?: ProductTriadSettings };
-  'pa-section': { data: PaSectionData; settings?: PaSectionSettings };
-  'philosophy': { data: PhilosophyData; settings?: PhilosophySettings };
-  'cta-banner': { data: CtaBannerData; settings?: CtaBannerSettings };
-};
-declare module '@jsonpages/core' {
-  export interface SectionDataRegistry {
-    'header': HeaderData;
-    'footer': FooterData;
-    'hero': HeroData;
-    'feature-grid': FeatureGridData;
-    'code-block': CodeBlockData;
-    'problem-statement': ProblemStatementData;
-    'pillars-grid': PillarsGridData;
-    'arch-layers': ArchLayersData;
-    'product-triad': ProductTriadData;
-    'pa-section': PaSectionData;
-    'philosophy': PhilosophyData;
-    'cta-banner': CtaBannerData;
-  }
-  export interface SectionSettingsRegistry {
-    'header': HeaderSettings;
-    'footer': FooterSettings;
-    'hero': HeroSettings;
-    'feature-grid': FeatureGridSettings;
-    'code-block': CodeBlockSettings;
-    'problem-statement': ProblemStatementSettings;
-    'pillars-grid': PillarsGridSettings;
-    'arch-layers': ArchLayersSettings;
-    'product-triad': ProductTriadSettings;
-    'pa-section': PaSectionSettings;
-    'philosophy': PhilosophySettings;
-    'cta-banner': CtaBannerSettings;
-  }
-}
-export * from '@jsonpages/core';
-END_OF_FILE_CONTENT
-echo "Creating src/vite-env.d.ts..."
-cat << 'END_OF_FILE_CONTENT' > "src/vite-env.d.ts"
-/// <reference types="vite/client" />
-declare module '*?inline' {
-  const content: string;
-  export default content;
-}
-END_OF_FILE_CONTENT