@llmnative/react 1.19.1 → 1.19.2

package/llms.txt

@@ -0,0 +1,82 @@
+# @llmnative/react
+
+> Framework React AI-first per generazione deterministica di UI da configurazione dichiarativa.
+> Data-driven di default, schema-driven opzionale. Ottimizzato per minimo consumo di token AI.
+> Apache-2.0 — versione 1.0.0
+
+## Install
+
+Requisito: **Node.js 24 LTS** (`>=24.18.0 <25`, `engines` del pacchetto).
+
+```bash
+npm install @llmnative/react
+npx @llmnative/react create        # scaffold progetto Vite completo
+npx @llmnative/react create --yes --provider=mock   # scaffold senza backend
+```
+
+```tsx
+import '@llmnative/react/dist/index.css'  // necessario una volta sola
+```
+
+## Cosa fa
+
+`Grid` genera tabelle e gallery CRUD complete (fetch real-time, modal add/edit/delete, sorting, pagination, groupBy) da una configurazione colonne. `Form` gestisce stato, validazione, oggetti annidati e lifecycle hooks verso qualsiasi provider. I provider (Firebase, Supabase, mock) si swappano in `<App>` senza toccare i componenti.
+
+## 5 pattern core — 90% dei casi d'uso
+
+```tsx
+// 1 — Lista CRUD con real-time
+<Grid path="/users" columns={[{ key: 'name', label: 'Nome', sortable: true }, { key: 'email', label: 'Email' }]} actions={['add','edit','delete']} pagination={{ limit: 20 }} />
+
+// 2 — Form standalone
+<Form path="/products" appearance="card" showBack>
+  <Input name="title" label="Titolo" required />
+  <Select name="status" label="Stato" options={['draft','published']} />
+</Form>
+
+// 3 — Oggetti annidati e array dinamici
+<Input name="address.city" label="Città" />
+<Repeat name="items" defaultLength={1}>{(i) => <Input name={`items.${i}.name`} />}</Repeat>
+
+// 4 — Colonne con renderer custom e Badge
+<Grid path="/orders" columns={[{ key: 'status', render: ({ value }) => <Badge variant="success">{value}</Badge> }, { key: 'amount', render: ({ value }) => `€ ${value.toFixed(2)}` }]} />
+
+// 5 — Form con lifecycle hooks
+<Form path="/posts" onLoad={d => ({...d, price: d.price/100})} onSave={async ({record}) => ({...record, price: record.price*100})} onComplete={async ({action}) => { if (action === 'save') navigate('/posts') }} />
+```
+
+## Provider matrix
+
+| Servizio | Driver disponibili | Obbligatorio |
+|---|---|---|
+| data | `mock`, `dbRealtime` (Firebase RTDB), `firestoreDb` (Firestore), `supabaseDb` | sì (fallback: mock) |
+| storage | `firestorage`, `supabaseStorage` | no |
+| auth | `googleAuth`, `firebaseAuth`, `supabaseAuth`, `dropboxAuth` | sì (fallback: googleAuth) |
+| email | `gmail` | no |
+| ai | `openai`, `gemini`, `anthropic`, `deepseek`, `mistral`, `openrouter`, `opencode`, `cloudflare`, `groq` | no |
+| credentials | `googleServiceAccount` | no |
+
+```tsx
+<App providers={{ firebase: { apiKey, authDomain, databaseURL }, services: { data: 'dbRealtime', storage: 'firestorage', auth: 'googleAuth' } }} />
+```
+
+## Struttura componenti
+
+```
+ui/        → primitivi stateless: Alert, Badge, Button, Card, DescriptionList, Image, Modal, Table, Gallery, Tab, Repeat, Icon, LocaleSwitcher, ThemeSwitcher, ProviderSwitcher, LayoutBuilder, ContextMenu
+ui/fields/ → campi form: Input, Select, UploadImage, UploadDocument, UploadCSV, CodeEditor, ImageField, RichText, Prompt, Crop, ContextMenu
+blocks/    → composizioni: Menu, Breadcrumbs, Notifications, Search, Carousel, Dropdown, Toolbar, SideNav, ListCard, AuthButton
+widgets/   → smart (hanno stato e provider): Grid, Form, MarkdownReader, ImageEditor, TabDynamic
+```
+
+Tutti gli import da `'@llmnative/react'` — mai da sottodirectory.
+
+## Non adatto per
+
+- Marketing sites, e-commerce, landing page con layout custom
+- UI pixel-perfect che non mappano a CRUD
+- Applicazioni senza dati strutturati
+
+## Riferimento completo
+
+→ [llms-full.txt](llms-full.txt) — API di ogni componente, ogni provider, ogni hook, tipi TypeScript

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llmnative/react",
-  "version": "1.19.1",
+  "version": "1.19.2",
   "description": "LLM-native React framework for deterministic UI generation. Data-driven by default, schema-driven optional. Ultra-low token consumption — built for AI agents, not just humans.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
@@ -27,6 +27,7 @@
     "test": "vitest run",
     "test:e2e": "npx playwright test",
     "test:e2e:proxy-scaffold": "node scripts/e2e/test-proxy-scaffold.js",
+    "test:e2e:scaffold": "node scripts/e2e/test-scaffold-templates.js",
     "test:e2e:proxy-runtime": "vitest run tests/e2e/proxy-runtime.test.ts --environment node",
     "test:integration": "npx firebase emulators:exec --only database,firestore,storage --project demo-test \"npx vitest run --config vitest.integration.config.mts\"",
     "test:watch": "vitest",
@@ -41,7 +42,10 @@
     "dist/**/*.map",
     "bin",
     "scripts/cli",
-    "themes"
+    "templates",
+    "themes",
+    "llms.txt",
+    "llms-full.txt"
   ],
   "repository": {
     "type": "git",

package/scripts/cli/setup-project.js

@@ -37,6 +37,8 @@ function resetProjectDirectory() {
         '.env.example',
         '.firebaserc',
         'database.rules.json',
+        'firestore.rules',
+        'firestore.indexes.json',
         'firebase.json',
         'storage.rules',
         'index.html',
@@ -167,17 +169,18 @@ function normalizeFirebaseProjectId(projectName) {
 
 function createPackageJson(params) {
     const packagePath = path.resolve(__dirname, '../../package.json');
-    const version = JSON.parse(fs.readFileSync(packagePath, 'utf8')).version;
+    const frameworkPackage = JSON.parse(fs.readFileSync(packagePath, 'utf8'));
+    const version = frameworkPackage.version;
 
     ensureFile(path.join(root, 'package.json'), JSON.stringify({
         name: normalizeFirebaseProjectId(params.projectname) || 'llmnative-app',
         version: '0.1.0',
-        private: true,
-        type: 'module',
-        engines: {
-            node: '>=24.18.0 <25',
-        },
-        packageManager: 'npm@11.11.0',
+        private: true,
+        type: 'module',
+        engines: {
+            node: '>=24.18.0 <25',
+        },
+        packageManager: 'npm@11.11.0',
         scripts: {
             dev: 'vite',
             build: 'vite build',
@@ -185,23 +188,24 @@ function createPackageJson(params) {
             typecheck: 'tsc --noEmit',
         },
         dependencies: {
-            '@phosphor-icons/react': '^2.1.10',
-            firebase: '^12.16.0',
-            'lucide-react': '^1.26.0',
-            react: '^19.2.8',
-            'react-dom': '^19.2.8',
-            '@llmnative/react': `^${version}`,
-            'react-router-dom': '^7.18.1',
-        },
-        devDependencies: {
-            '@tailwindcss/postcss': '^4.3.3',
-            '@types/react': '^19.2.17',
-            '@types/react-dom': '^19.2.3',
-            '@vitejs/plugin-react': '^6.0.4',
-            autoprefixer: '^10.5.4',
-            postcss: '^8.5.23',
-            typescript: '6.0.3',
-            vite: '^8.1.5',
+            '@phosphor-icons/react': '^2.1.10',
+            firebase: '^12.16.0',
+            'lucide-react': '^1.26.0',
+            react: '^19.2.8',
+            'react-dom': '^19.2.8',
+            '@llmnative/react': `^${version}`,
+            'react-router-dom': '^7.18.1',
+        },
+        devDependencies: {
+            '@tailwindcss/postcss': '^4.3.3',
+            '@types/react': '^19.2.17',
+            '@types/react-dom': '^19.2.3',
+            '@vitejs/plugin-react': '^6.0.4',
+            autoprefixer: '^10.5.4',
+            postcss: '^8.5.23',
+            // Same compiler the framework is built and type-checked with.
+            typescript: frameworkPackage.devDependencies.typescript,
+            vite: '^8.1.5',
         },
     }, null, 2));
 }
@@ -293,7 +297,8 @@ function createFirebaseConfig(params) {
     const hostingSite = params.hosting === '' ? params.projectname : params.hosting;
 
     ensureFile(path.join(root, 'firebase.json'), JSON.stringify({
-        database: { rules: 'database.rules.json' },
+        firestore: { rules: 'firestore.rules', indexes: 'firestore.indexes.json' },
+        storage: { rules: 'storage.rules' },
         ...(includeHosting && {
             hosting: {
                 site: normalizeFirebaseProjectId(hostingSite),
@@ -305,11 +310,21 @@ function createFirebaseConfig(params) {
         }),
     }, null, 2));
 
-    ensureFile(path.join(root, 'database.rules.json'), JSON.stringify({
-        rules: {
-            '.read': 'auth != null',
-            '.write': 'auth != null',
-        },
+    ensureFile(path.join(root, 'firestore.rules'), `
+rules_version = '2';
+
+service cloud.firestore {
+  match /databases/{database}/documents {
+    match /{document=**} {
+      allow read, write: if request.auth != null;
+    }
+  }
+}
+    `);
+
+    ensureFile(path.join(root, 'firestore.indexes.json'), JSON.stringify({
+        indexes: [],
+        fieldOverrides: [],
     }, null, 2));
 
     ensureFile(path.join(root, 'storage.rules'), `
@@ -352,6 +367,10 @@ function copyTemplateFiles(params) {
     const sharedSrc  = path.resolve(__dirname, '../../templates/_shared');
     const templateSrc = path.resolve(__dirname, `../../templates/${params.template}`);
 
+    if (!fs.existsSync(sharedSrc) || !fs.existsSync(templateSrc)) {
+        throw new Error(`Template "${params.template}" not found in ${path.dirname(templateSrc)}`);
+    }
+
     // Copy shared layouts and sections
     copyDir(path.join(sharedSrc, 'layouts'),  path.join(root, 'src/layouts'));
     copyDir(path.join(sharedSrc, 'sections'), path.join(root, 'src/sections'));
@@ -437,7 +456,7 @@ const selectedProvider = env.VITE_PROVIDER ?? '${params.provider}';
 const selectedAIProvider = env.VITE_AI_PROVIDER ?? '${params.aiProvider ?? 'none'}';
 
 const dataDriver =
-  selectedProvider === 'firebase' ? 'dbRealtime'
+  selectedProvider === 'firebase' ? 'firestoreDb'
     : selectedProvider === 'supabase' ? 'supabaseDb'
       : 'mock';
 
@@ -446,6 +465,11 @@ const storageDriver =
     : selectedProvider === 'supabase' ? 'supabaseStorage'
       : undefined;
 
+const authDriver =
+  selectedProvider === 'firebase' ? 'firebaseAuth'
+    : selectedProvider === 'supabase' ? 'supabaseAuth'
+      : 'googleAuth';
+
 const aiDriver = selectedAIProvider !== 'none'
   ? selectedAIProvider
   : undefined;
@@ -503,10 +527,11 @@ export const providers: AppProvidersConfig = {
     clientId: env.VITE_DROPBOX_CLIENT_ID ?? '',
     rootPath: env.VITE_DROPBOX_ROOT_PATH ?? '',
   },
+  ai: aiConfig,
   services: {
     data: dataDriver,
     ...(storageDriver ? { storage: storageDriver } : {}),
-    auth: 'googleAuth',
+    auth: authDriver,
     ...(aiDriver ? { ai: aiDriver } : {}),
   },
 };
@@ -518,18 +543,17 @@ import { createRoot } from 'react-dom/client';
 import { App } from '@llmnative/react';
 import './styles/globals.css';
 
-import { aiConfig, appConfig, providers } from './conf/app';
+import { appConfig, providers } from './conf/app';
 import { menu } from './conf/menu';
-
-const env = import.meta.env;
+import Default from './layouts/Default';
 
 createRoot(document.getElementById('root')!).render(
   <React.StrictMode>
     <App
       importPage={(pageSource) => import(/* @vite-ignore */ pageSource)}
       menuConfig={menu}
+      LayoutDefault={Default}
       providers={providers}
-      aiConfig={aiConfig}
       iconProvider={appConfig.iconProvider}
       themeProvider={{
         theme: appConfig.theme,

package/templates/_shared/layouts/Default.tsx

@@ -0,0 +1,23 @@
+import React, { useState } from 'react';
+import Header from '../sections/Header';
+import Sidebar from '../sections/Sidebar';
+import PageHeader from '../sections/PageHeader';
+import Footer from '../sections/Footer';
+
+export default function Default({ children }: { children?: React.ReactNode }) {
+    const [navOpen, setNavOpen] = useState(false);
+
+    return (
+        <div className="flex h-screen flex-col overflow-hidden">
+            <Header onMenuToggle={() => setNavOpen(open => !open)} />
+            <div className="flex min-h-0 flex-1 overflow-hidden">
+                <Sidebar open={navOpen} onClose={() => setNavOpen(false)} />
+                <main className="min-h-0 min-w-0 flex-1 overflow-auto p-4">
+                    <PageHeader />
+                    {children}
+                </main>
+            </div>
+            <Footer />
+        </div>
+    );
+}

package/templates/_shared/sections/Footer.tsx

@@ -0,0 +1,9 @@
+import React from 'react';
+
+export default function Footer() {
+    return (
+        <footer className="shrink-0 border-t bg-background px-4 py-2 text-end text-sm text-muted-foreground">
+            Powered by [projectname]
+        </footer>
+    );
+}

package/templates/_shared/sections/Header.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { ActionButton, AuthButton, Brand } from '@llmnative/react';
+
+type HeaderProps = {
+    onMenuToggle: () => void;
+};
+
+export default function Header({ onMenuToggle }: HeaderProps) {
+    return (
+        <header className="flex h-14 shrink-0 items-center gap-3 border-b bg-background px-4">
+            <ActionButton
+                icon="menu"
+                ariaLabel="Toggle navigation"
+                variant="link"
+                wrapperClassName="lg:hidden"
+                onClick={onMenuToggle}
+            />
+            <Brand url="/" label="[projectname]" />
+            <div className="ms-auto">
+                <AuthButton />
+            </div>
+        </header>
+    );
+}

package/templates/_shared/sections/PageHeader.tsx

@@ -0,0 +1,10 @@
+import React from 'react';
+import { Breadcrumbs } from '@llmnative/react';
+
+export default function PageHeader() {
+    return (
+        <div className="mb-4">
+            <Breadcrumbs />
+        </div>
+    );
+}

package/templates/_shared/sections/Sidebar.tsx

@@ -0,0 +1,22 @@
+import React from 'react';
+import { Modal, SideNav } from '@llmnative/react';
+
+type SidebarProps = {
+    open: boolean;
+    onClose: () => void;
+};
+
+export default function Sidebar({ open, onClose }: SidebarProps) {
+    return (
+        <>
+            <div className="hidden lg:flex">
+                <SideNav menuKey="main" />
+            </div>
+            {open && (
+                <Modal title="[projectname]" position="left" size="sm" footer={false} onClose={onClose}>
+                    <SideNav menuKey="main" embedded />
+                </Modal>
+            )}
+        </>
+    );
+}

package/templates/admin/conf/menu.ts

@@ -0,0 +1,14 @@
+import type { MenuConfig } from '@llmnative/react';
+import HomePage from '../pages/home/HomePage';
+import UsersPage from '../pages/users/UsersPage';
+import RolesPage from '../pages/roles/RolesPage';
+import SettingsPage from '../pages/settings/SettingsPage';
+
+export const menu: MenuConfig = {
+    main: [
+        { path: '/',         title: 'Overview',  icon: 'layout-dashboard', page: HomePage, end: true },
+        { path: '/users',    title: 'Users',     icon: 'users',            page: UsersPage, group: 'Management' },
+        { path: '/roles',    title: 'Roles',     icon: 'shield',           page: RolesPage, group: 'Management' },
+        { path: '/settings', title: 'Settings',  icon: 'settings',         page: SettingsPage, group: 'System' },
+    ],
+};

package/templates/admin/data/mockData.ts

@@ -0,0 +1,21 @@
+export const mockData = {
+    '/users': {
+        'u-1': { name: 'Alice Martin',  email: 'alice@example.com',  role: 'admin',  status: 'active',   createdAt: 1710000000000 },
+        'u-2': { name: 'Bob Chen',      email: 'bob@example.com',    role: 'editor', status: 'active',   createdAt: 1712000000000 },
+        'u-3': { name: 'Clara Rossi',   email: 'clara@example.com',  role: 'viewer', status: 'inactive', createdAt: 1714000000000 },
+        'u-4': { name: 'David Park',    email: 'david@example.com',  role: 'editor', status: 'active',   createdAt: 1716000000000 },
+    },
+    '/roles': {
+        'r-1': { name: 'admin',  label: 'Administrator', description: 'Full access to all resources' },
+        'r-2': { name: 'editor', label: 'Editor',        description: 'Can create and edit content' },
+        'r-3': { name: 'viewer', label: 'Viewer',        description: 'Read-only access' },
+    },
+    '/settings': {
+        'app': {
+            siteName: '[projectname]',
+            supportEmail: 'support@example.com',
+            timezone: 'UTC',
+            maintenanceMode: false,
+        },
+    },
+};

package/templates/admin/pages/home/HomePage.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+import { Card } from '@llmnative/react';
+import { mockData } from '../../data/mockData';
+
+function StatCard({ label, value, sub }: { label: string; value: number | string; sub?: string }) {
+    return (
+        <Card title={label}>
+            <p className="text-2xl font-semibold">{value}</p>
+            {sub && <p className="text-xs text-muted-foreground">{sub}</p>}
+        </Card>
+    );
+}
+
+export default function HomePage() {
+    const users = Object.values(mockData['/users']);
+    const roles = Object.values(mockData['/roles']);
+
+    return (
+        <div className="mx-auto max-w-5xl space-y-8 px-2 py-4">
+            <div className="space-y-1">
+                <h1 className="text-2xl font-semibold">Admin panel</h1>
+                <p className="text-sm text-muted-foreground">System overview and management.</p>
+            </div>
+
+            <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+                <StatCard label="Total users" value={users.length} />
+                <StatCard label="Active users" value={users.filter(u => u.status === 'active').length} />
+                <StatCard label="Roles defined" value={roles.length} />
+            </div>
+        </div>
+    );
+}

package/templates/admin/pages/roles/RolesPage.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+import { Grid, Input } from '@llmnative/react';
+
+export default function RolesPage() {
+    return (
+        <Grid
+            path="/roles"
+            columns={[
+                { key: 'name', label: 'Key', sortable: true },
+                { key: 'label', label: 'Display name' },
+                { key: 'description', label: 'Description' },
+            ]}
+            actions={['add', 'edit', 'delete']}
+            view="table"
+            sortable
+            form={
+                <>
+                    <Input name="name" label="Key (e.g. editor)" required />
+                    <Input name="label" label="Display name" required />
+                    <Input name="description" label="Description" />
+                </>
+            }
+        />
+    );
+}

package/templates/admin/pages/settings/SettingsPage.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+import { Form, Input, Select } from '@llmnative/react';
+
+const timezoneOptions = [
+    { label: 'UTC', value: 'UTC' },
+    { label: 'Europe/Rome', value: 'Europe/Rome' },
+    { label: 'America/New_York', value: 'America/New_York' },
+    { label: 'Asia/Tokyo', value: 'Asia/Tokyo' },
+];
+
+export default function SettingsPage() {
+    return (
+        <div className="mx-auto max-w-2xl px-2 py-4">
+            <Form
+                path="/settings/app"
+                appearance="card"
+            >
+                <Input name="siteName" label="Site name" required />
+                <Input name="supportEmail" label="Support email" type="email" />
+                <Select name="timezone" label="Timezone" options={timezoneOptions} />
+            </Form>
+        </div>
+    );
+}

package/templates/admin/pages/users/UsersPage.tsx

@@ -0,0 +1,54 @@
+import React from 'react';
+import { Grid, Badge, Input, Select, type BadgeType } from '@llmnative/react';
+
+const roleOptions = [
+    { label: 'Administrator', value: 'admin' },
+    { label: 'Editor',        value: 'editor' },
+    { label: 'Viewer',        value: 'viewer' },
+];
+
+const statusOptions = [
+    { label: 'Active',   value: 'active' },
+    { label: 'Inactive', value: 'inactive' },
+];
+
+const roleVariant: Record<string, BadgeType> = {
+    admin:  'danger',
+    editor: 'primary',
+    viewer: 'secondary',
+};
+
+export default function UsersPage() {
+    return (
+        <Grid
+            path="/users"
+            columns={[
+                { key: 'name',      label: 'Name',    sortable: true },
+                { key: 'email',     label: 'Email' },
+                { key: 'role',      label: 'Role',
+                    render: ({ value }) => (
+                        <Badge variant={roleVariant[String(value)] ?? 'secondary'}>{String(value)}</Badge>
+                    ),
+                },
+                { key: 'status',    label: 'Status',
+                    render: ({ value }) => (
+                        <Badge variant={value === 'active' ? 'success' : 'secondary'}>{String(value)}</Badge>
+                    ),
+                },
+                { key: 'createdAt', label: 'Created', render: 'date' },
+            ]}
+            actions={['add', 'edit', 'delete']}
+            view="table"
+            sortable
+            pagination={{ limit: 25 }}
+            form={
+                <>
+                    <Input  name="name"   label="Full name" required />
+                    <Input  name="email"  label="Email"     type="email" required />
+                    <Select name="role"   label="Role"      options={roleOptions} />
+                    <Select name="status" label="Status"    options={statusOptions} />
+                </>
+            }
+        />
+    );
+}

package/templates/blank/conf/menu.ts

@@ -0,0 +1,8 @@
+import type { MenuConfig } from '@llmnative/react';
+import HomePage from '../pages/home/HomePage';
+
+export const menu: MenuConfig = {
+    main: [
+        { path: '/', title: 'Home', icon: 'home', page: HomePage, end: true },
+    ],
+};

package/templates/blank/data/mockData.ts

@@ -0,0 +1,6 @@
+export const mockData = {
+    '/tasks': {
+        'task-1': { title: 'Review scaffold structure', status: 'done' },
+        'task-2': { title: 'Connect your first provider', status: 'next' },
+    },
+};

package/templates/blank/pages/home/HomePage.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+import { Grid } from '@llmnative/react';
+
+export default function HomePage() {
+    return (
+        <div className="mx-auto max-w-5xl space-y-8 px-2 py-4">
+            <div className="space-y-1">
+                <h1 className="text-2xl font-semibold">Welcome to [projectname]</h1>
+                <p className="text-sm text-muted-foreground">
+                    Scaffolded with LLM Native. Edit this page at <code>src/pages/home/HomePage.tsx</code>.
+                </p>
+            </div>
+
+            <Grid
+                path="/tasks"
+                columns={[
+                    { key: 'title', label: 'Task' },
+                    { key: 'status', label: 'Status' },
+                ]}
+                actions={['add', 'edit', 'delete']}
+                view="table"
+            />
+        </div>
+    );
+}

package/templates/crm/conf/menu.ts

@@ -0,0 +1,14 @@
+import type { MenuConfig } from '@llmnative/react';
+import HomePage from '../pages/home/HomePage';
+import ContactsPage from '../pages/contacts/ContactsPage';
+import CompaniesPage from '../pages/companies/CompaniesPage';
+import DealsPage from '../pages/deals/DealsPage';
+
+export const menu: MenuConfig = {
+    main: [
+        { path: '/',          title: 'Dashboard', icon: 'layout-dashboard', page: HomePage, end: true },
+        { path: '/contacts',  title: 'Contacts',  icon: 'users',            page: ContactsPage, group: 'Sales' },
+        { path: '/companies', title: 'Companies', icon: 'building-2',       page: CompaniesPage, group: 'Sales' },
+        { path: '/deals',     title: 'Deals',     icon: 'handshake',        page: DealsPage, group: 'Sales' },
+    ],
+};

package/templates/crm/data/mockData.ts

@@ -0,0 +1,24 @@
+export const mockData = {
+    '/contacts': {
+        'c-1': { name: 'Alice Martin',   email: 'alice@acme.com',   company: 'Acme Corp',   status: 'active',   phone: '+1 555 0101' },
+        'c-2': { name: 'Bob Chen',       email: 'bob@globex.com',   company: 'Globex',      status: 'active',   phone: '+1 555 0102' },
+        'c-3': { name: 'Clara Rossi',    email: 'clara@initech.it', company: 'Initech',     status: 'inactive', phone: '+39 02 0103' },
+        'c-4': { name: 'David Park',     email: 'd.park@umbrella.co', company: 'Umbrella',  status: 'active',   phone: '+1 555 0104' },
+        'c-5': { name: 'Eva Müller',     email: 'eva@hooli.de',     company: 'Hooli',       status: 'lead',     phone: '+49 89 0105' },
+    },
+    '/companies': {
+        'co-1': { name: 'Acme Corp',  industry: 'Manufacturing', website: 'acme.com',    employees: 320 },
+        'co-2': { name: 'Globex',     industry: 'Technology',    website: 'globex.com',  employees: 85  },
+        'co-3': { name: 'Initech',    industry: 'IT Services',   website: 'initech.it',  employees: 50  },
+        'co-4': { name: 'Umbrella',   industry: 'Pharma',        website: 'umbrella.co', employees: 1200 },
+        'co-5': { name: 'Hooli',      industry: 'Technology',    website: 'hooli.de',    employees: 600 },
+    },
+    '/deals': {
+        'd-1': { title: 'Enterprise license',  contact: 'Alice Martin',  value: 12000, stage: 'qualified',  closedAt: '' },
+        'd-2': { title: 'SaaS subscription',   contact: 'Bob Chen',      value: 4800,  stage: 'prospect',   closedAt: '' },
+        'd-3': { title: 'Consulting package',  contact: 'Clara Rossi',   value: 7500,  stage: 'proposal',   closedAt: '' },
+        'd-4': { title: 'Support renewal',     contact: 'David Park',    value: 2400,  stage: 'won',        closedAt: '2025-03-15' },
+        'd-5': { title: 'Migration project',   contact: 'Eva Müller',    value: 18000, stage: 'prospect',   closedAt: '' },
+        'd-6': { title: 'Hardware bundle',     contact: 'Alice Martin',  value: 5600,  stage: 'lost',       closedAt: '2025-02-28' },
+    },
+};