@decido/shell 1.0.0 → 4.0.2

package/src/store/useUIComponentStore.ts

@@ -1,179 +0,0 @@
-import { create } from 'zustand';
-import { persist } from 'zustand/middleware';
-
-// ─── Server-Driven UI Types ───
-export interface ServerDrivenNode {
-    type: string;
-    props?: Record<string, any>;
-    children?: ServerDrivenNode[] | string;
-    onAction?: {
-        command: string;
-        payload?: any;
-    };
-}
-
-export interface UIComponentDefinition {
-    id: string;
-    name: string;
-    category: 'form' | 'card' | 'table' | 'chart' | 'layout' | 'alert' | 'custom';
-    schema: ServerDrivenNode;
-    dataContract: {
-        inputs: Record<string, { type: string; description: string }>;
-        outputs: Record<string, { type: string }>;
-    };
-    tags: string[];
-    source: 'built-in' | 'ai-generated' | 'server' | 'user';
-    preview?: string;
-    createdAt: number;
-    updatedAt: number;
-}
-
-interface UIComponentState {
-    components: Record<string, UIComponentDefinition>;
-    addComponent: (component: UIComponentDefinition) => void;
-    removeComponent: (id: string) => void;
-    updateComponent: (id: string, updates: Partial<UIComponentDefinition>) => void;
-    getByCategory: (category: string) => UIComponentDefinition[];
-    getBySource: (source: string) => UIComponentDefinition[];
-}
-
-// ─── Built-in UI Components (Seeds) ───
-const BUILT_IN_COMPONENTS: UIComponentDefinition[] = [
-    {
-        id: 'builtin_status_card',
-        name: 'Status Card',
-        category: 'card',
-        schema: {
-            type: 'div',
-            props: { className: 'bg-zinc-900/80 border border-border-default rounded-xl p-4 backdrop-blur-xs' },
-            children: [
-                { type: 'div', props: { className: 'flex items-center gap-2 mb-2' }, children: [
-                    { type: 'span', props: { className: 'w-2 h-2 rounded-full bg-emerald-400 animate-pulse' } },
-                    { type: 'span', props: { className: 'text-xs font-mono text-text-secondary uppercase tracking-wider' }, children: '{{title}}' }
-                ]},
-                { type: 'h3', props: { className: 'text-2xl font-bold text-white' }, children: '{{value}}' },
-                { type: 'p', props: { className: 'text-xs text-text-muted mt-1' }, children: '{{subtitle}}' }
-            ]
-        },
-        dataContract: {
-            inputs: { title: { type: 'string', description: 'Card title' }, value: { type: 'string', description: 'Main value' }, subtitle: { type: 'string', description: 'Description' } },
-            outputs: {}
-        },
-        tags: ['status', 'metric', 'dashboard'],
-        source: 'built-in',
-        createdAt: Date.now(),
-        updatedAt: Date.now()
-    },
-    {
-        id: 'builtin_alert_banner',
-        name: 'Alert Banner',
-        category: 'alert',
-        schema: {
-            type: 'div',
-            props: { className: 'flex items-center gap-3 p-3 rounded-lg border border-amber-500/20 bg-amber-500/5' },
-            children: [
-                { type: 'span', props: { className: 'text-amber-400 text-lg' }, children: '⚠️' },
-                { type: 'div', children: [
-                    { type: 'p', props: { className: 'text-sm font-semibold text-amber-200' }, children: '{{title}}' },
-                    { type: 'p', props: { className: 'text-xs text-amber-300/70' }, children: '{{message}}' }
-                ]}
-            ]
-        },
-        dataContract: {
-            inputs: { title: { type: 'string', description: 'Alert title' }, message: { type: 'string', description: 'Alert message' } },
-            outputs: {}
-        },
-        tags: ['alert', 'warning', 'notification'],
-        source: 'built-in',
-        createdAt: Date.now(),
-        updatedAt: Date.now()
-    },
-    {
-        id: 'builtin_input_form',
-        name: 'Text Input Form',
-        category: 'form',
-        schema: {
-            type: 'div',
-            props: { className: 'bg-zinc-900/80 border border-border-default rounded-xl p-4 space-y-3' },
-            children: [
-                { type: 'label', props: { className: 'text-sm text-text-primary font-medium' }, children: '{{label}}' },
-                { type: 'input', props: { className: 'w-full bg-zinc-800 border border-border-default rounded-lg px-3 py-2 text-white text-sm focus:border-purple-500/50 outline-hidden transition-colors', placeholder: '{{placeholder}}' }, onAction: { command: 'engine:setVariable', payload: { target: '{{variableKey}}' } } },
-                { type: 'button', props: { className: 'w-full py-2 bg-purple-500 hover:bg-purple-400 text-white text-sm font-medium rounded-lg transition-colors' }, children: '{{buttonText}}', onAction: { command: 'engine:completeNode', payload: { handle: 'success' } } }
-            ]
-        },
-        dataContract: {
-            inputs: { label: { type: 'string', description: 'Input label' }, placeholder: { type: 'string', description: 'Placeholder text' }, variableKey: { type: 'string', description: 'Target variable key' }, buttonText: { type: 'string', description: 'Submit button text' } },
-            outputs: { value: { type: 'string' } }
-        },
-        tags: ['form', 'input', 'interactive'],
-        source: 'built-in',
-        createdAt: Date.now(),
-        updatedAt: Date.now()
-    },
-    {
-        id: 'builtin_data_table',
-        name: 'Data Table',
-        category: 'table',
-        schema: {
-            type: 'div',
-            props: { className: 'bg-zinc-900/80 border border-border-default rounded-xl overflow-hidden' },
-            children: [
-                { type: 'div', props: { className: 'px-4 py-3 border-b border-border-subtle' }, children: [
-                    { type: 'h4', props: { className: 'text-sm font-semibold text-white' }, children: '{{title}}' }
-                ]},
-                { type: 'table', props: { className: 'w-full' }, children: [
-                    { type: 'thead', children: [
-                        { type: 'tr', props: { className: 'text-xs text-text-muted uppercase' }, children: '{{headers}}' }
-                    ]},
-                    { type: 'tbody', props: { className: 'text-sm text-text-primary' }, children: '{{rows}}' }
-                ]}
-            ]
-        },
-        dataContract: {
-            inputs: { title: { type: 'string', description: 'Table title' }, headers: { type: 'string', description: 'Column headers' }, rows: { type: 'string', description: 'Table rows data' } },
-            outputs: {}
-        },
-        tags: ['table', 'data', 'list'],
-        source: 'built-in',
-        createdAt: Date.now(),
-        updatedAt: Date.now()
-    }
-];
-
-// ─── Store ───
-export const useUIComponentStore = create<UIComponentState>()(
-    persist(
-        (set, get) => ({
-            components: Object.fromEntries(BUILT_IN_COMPONENTS.map(c => [c.id, c])),
-
-            addComponent: (component) => set((state) => ({
-                components: { ...state.components, [component.id]: component }
-            })),
-
-            removeComponent: (id) => set((state) => {
-                const { [id]: _, ...rest } = state.components;
-                return { components: rest };
-            }),
-
-            updateComponent: (id, updates) => set((state) => {
-                const existing = state.components[id];
-                if (!existing) return state;
-                return {
-                    components: {
-                        ...state.components,
-                        [id]: { ...existing, ...updates, updatedAt: Date.now() }
-                    }
-                };
-            }),
-
-            getByCategory: (category) => {
-                return Object.values(get().components).filter(c => c.category === category);
-            },
-
-            getBySource: (source) => {
-                return Object.values(get().components).filter(c => c.source === source);
-            }
-        }),
-        { name: 'decido-ui-components' }
-    )
-);

package/src/types/DecidoStoryDefinition.ts

@@ -1,43 +0,0 @@
-export interface DSDMeta {
-    version: string; // e.g., '1.0'
-    author: string;
-    createdAt: number;
-    updatedAt: number;
-    title: string;
-    description: string;
-    tags: string[];
-}
-
-export interface DSDConfig {
-    defaultVoice: string;
-    defaultBgm?: string;
-    brandTheme: string;
-    environment: 'light' | 'dark' | 'auto';
-}
-
-export interface DSDActor {
-    id: string; // e.g., 'zephyr_ai'
-    name: string;
-    role: string;
-    voiceId?: string;
-    avatarUrl?: string; // or 3D model ref
-}
-
-export interface DSDKeyframe {
-    id: string;
-    t: number; // Time in seconds
-    state: string; // The morph/action state string
-    actorId?: string; // Who performs the action
-    speech?: string; // Dialogue to say
-    delay?: number; // Delay before next block if auto-advancing
-    canvas?: boolean; // Should open 3D canvas?
-    uiConfig?: any; // Any extra JSON config for UI morphing
-}
-
-export interface DecidoStoryDefinition {
-    id: string; // UUID of the document
-    meta: DSDMeta;
-    config: DSDConfig;
-    actors: DSDActor[];
-    timeline: DSDKeyframe[];
-}

package/src/utils/ai/ai-architect.ts

@@ -1,92 +0,0 @@
-// ═══════════════════════════════════════════════════════
-//  AI Architect — System architecture analysis
-// ═══════════════════════════════════════════════════════
-
-import { Type, FunctionDeclaration } from "@google/genai";
-import { getClient, logger } from './ai-core';
-
-// Mock CodebaseContextService for shared package
-const codebaseContext = {
-    readRealFile: async (path: string): Promise<string> => {
-        return `[MOCK] Reading file ${path} is not supported in the standalone package environment yet.`;
-    }
-};
-
-const readSourceFileTool: FunctionDeclaration = {
-    name: 'readSourceFile',
-    description: 'LEE el contenido real de un archivo del proyecto. Úsalo SIEMPRE que te pregunten sobre código específico o arquitectura actual.',
-    parameters: {
-        type: Type.OBJECT,
-        properties: {
-            fileNameOrPath: {
-                type: Type.STRING,
-                description: 'El nombre del archivo (ej: "App.tsx") o su ruta relativa (ej: "src/utils/ai.ts").'
-            }
-        },
-        required: ['fileNameOrPath']
-    }
-};
-
-export const chatWithArchitect = async (
-    history: { role: 'user' | 'model' | 'function'; parts: { text?: string; functionCall?: any; functionResponse?: any }[] }[],
-    userMessage: string
-): Promise<string> => {
-    const client = getClient('text');
-    if (!client) return "API Key Config Missing";
-
-    const systemInstruction = `
-    ERES: Sentinel Architect, la IA residente que vive DENTRO del código fuente.
-    
-    PROTOCOLO ESPEJO ACTIVO:
-    1. Tienes acceso de LECTURA al disco duro mediante la herramienta 'readSourceFile'.
-    2. NO asumas cómo es el código. Si te preguntan "¿Cómo funciona el store?", LLAMA a 'readSourceFile("useSentinelStore.ts")' primero.
-    3. Cuando leas código, analízalo críticamente. Sugiere mejoras reales basadas en el contenido leído.
-    4. Sé conciso y técnico.
-    `;
-
-    const currentHistory = [...history];
-    currentHistory.push({ role: 'user', parts: [{ text: userMessage }] });
-
-    try {
-        const response = await client.models.generateContent({
-            model: "gemini-flash-lite-latest-exp",
-            contents: currentHistory,
-            config: {
-                systemInstruction: systemInstruction,
-                tools: [{ functionDeclarations: [readSourceFileTool] }],
-            }
-        });
-
-        const call = response.functionCalls?.[0];
-
-        if (call && call.name === 'readSourceFile') {
-            const args = call.args as any;
-            const filename = args.fileNameOrPath;
-
-            logger.log(`[ARCHITECT] Invocando lectura de disco para: ${filename}`);
-            const fileContent = await codebaseContext.readRealFile(filename);
-
-            const functionResponse = {
-                name: "readSourceFile",
-                response: { content: fileContent.substring(0, 30000) }
-            };
-
-            currentHistory.push({ role: 'model', parts: [{ functionCall: call }] });
-            currentHistory.push({ role: 'function', parts: [{ functionResponse: functionResponse }] });
-
-            const finalResponse = await client.models.generateContent({
-                model: "gemini-flash-lite-latest-exp",
-                contents: currentHistory,
-                config: { systemInstruction: systemInstruction }
-            });
-
-            return finalResponse.text || "No response generated.";
-        }
-
-        return response.text || "No response generated.";
-
-    } catch (error: any) {
-        logger.error("Architect Error:", error);
-        return `Error en Protocolo Espejo: ${error.message}`;
-    }
-};

package/src/utils/ai/ai-code.ts

@@ -1,187 +0,0 @@
-// ═══════════════════════════════════════════════════════
-//  AI Code — Code analysis, diagnostics, explanation
-// ═══════════════════════════════════════════════════════
-
-import { Type } from "@google/genai";
-import { getClient, getGlobalSettings, logger } from './ai-core';
-import { AIDiagnostic } from '@decido/canvas-core';
-
-export { type AIDiagnostic };
-
-export const analyzeCode = async (code: string, language: string): Promise<AIDiagnostic[]> => {
-    const client = getClient('text');
-    if (!client) return [];
-    const settings = getGlobalSettings();
-
-    try {
-        const response = await client.models.generateContent({
-            model: settings.text.model || 'gemini-3-flash-preview',
-            contents: `Analyze this ${language} code for Security Risks, Performance Issues, and Core Stability flaws.
-
-    CODE:
-            ${code}
-
-            Return a JSON array of diagnostics.
-    For 'godMode', provide a specific, high - level technical solution(HTML string allowed for bolding).
-            `,
-            config: {
-                responseMimeType: "application/json",
-                responseSchema: {
-                    type: Type.ARRAY,
-                    items: {
-                        type: Type.OBJECT,
-                        properties: {
-                            type: { type: Type.STRING, enum: ['risk', 'perf', 'core'] },
-                            lines: {
-                                type: Type.ARRAY,
-                                items: { type: Type.INTEGER },
-                                minItems: 2,
-                                maxItems: 2
-                            },
-                            title: { type: Type.STRING },
-                            description: { type: Type.STRING },
-                            godMode: { type: Type.STRING }
-                        },
-                        required: ['type', 'lines', 'title', 'description']
-                    }
-                }
-            }
-        });
-
-        return JSON.parse(response.text || '[]');
-    } catch (e) {
-        logger.error("Code Analysis Error", e);
-        return [];
-    }
-};
-
-export const explainCode = async (code: string, language: string): Promise<string> => {
-    const client = getClient('text');
-    if (!client) return "API Key Config Missing";
-    const settings = getGlobalSettings();
-
-    try {
-        const response = await client.models.generateContent({
-            model: settings.text.model || 'gemini-3-flash-preview',
-            contents: `Explain this ${language} code concisely.Focus on architecture, logic flow, and potential side effects.Use Markdown.
-
-    CODE:
-            ${code} `
-        });
-        return response.text || "No explanation generated.";
-    } catch (e) {
-        logger.error("Code Explanation Error", e);
-        return "Failed to generate explanation.";
-    }
-};
-
-export const generateCodeExplanation = async (codeSnippet: string, filename: string): Promise<string> => {
-    const client = getClient('text');
-    if (!client) return "<code>API Key Missing</code>";
-    const settings = getGlobalSettings();
-
-    try {
-        const response = await client.models.generateContent({
-            model: settings.text.model || 'gemini-3-flash-preview',
-            contents: `Explain this code file("${filename}") visually.
-
-    CODE: 
-            ${codeSnippet.slice(0, 2000)}... (truncated)
-
-GOAL:
-            Return a SINGLE HTML STRING that renders a beautiful, modern "Knowledge Card" explaining the code.
-            
-            DESIGN REQUIREMENTS:
-- Use TailwindCSS(via CDN or inline styles / classes if allowed, assume Tailwind is present or use inline styles for safety).
-            - Dark mode aesthetic(bg - slate - 900 text - slate - 200).
-            - Include a Title(Filename).
-            - Include a "Purpose" section(What does this code do?).
-- Include a "Key Components" list.
-            - Include a "Complexity Score"(1 - 10) with a visual progress bar.
-            - Make it look like a sci - fi / cyberpunk HUD element.
-            - NO Markdown.ONLY valid HTML.
-            `,
-            config: {
-                responseMimeType: "text/plain"
-            }
-        });
-
-        let html = response.text || "<div>No explanation generated.</div>";
-        html = html.replace(/```html/g, '').replace(/```/g, '');
-        return html;
-
-    } catch (error) {
-        logger.error("Explanation Error:", error);
-        return `<div style="color:red">Failed to generate explanation.</div>`;
-    }
-};
-
-export const generateHtmlAndMacros = async (history: { role: 'user' | 'model', parts: { text: string }[] }[], currentHtml: string): Promise<any> => {
-    const client = getClient('text');
-    if (!client) return null;
-    const settings = getGlobalSettings();
-
-    try {
-        const response = await client.models.generateContent({
-            model: settings.text.model || 'gemini-3-flash-preview',
-            contents: `
-            You are an expert Frontend Developer and QA Automation Engineer.
-            
-            CONTEXT:
-            Current HTML:
-            ${currentHtml}
-            
-            USER REQUEST HISTORY:
-            ${JSON.stringify(history)}
-            
-            GOAL:
-            1. Update HTML if requested.
-            2. Create automation workflows (macros) if requested (e.g., "click button", "type text").
-            
-            RETURN JSON:
-            {
-                "html": "Updated HTML string (optional)",
-                "workflow": [
-                    { "id": "step1", "type": "click", "selector": "#btn", "label": "Click Button" },
-                    { "type": "type", "selector": "#input", "value": "Hello", "label": "Type Hello" },
-                    { "type": "scroll", "scrollY": 500, "label": "Scroll Down" },
-                    { "type": "wait", "duration": 2000, "label": "Wait 2s" }
-                ],
-                "explanation": "Short summary of changes"
-            }
-            `,
-            config: {
-                responseMimeType: "application/json"
-            }
-        });
-
-        return JSON.parse(response.text || '{}');
-    } catch (e) {
-        logger.error("HTML/Macro Gen Error", e);
-        return null;
-    }
-};
-
-export const generateBrainstorm = async (context: string): Promise<string[]> => {
-    const client = getClient('text');
-    if (!client) return [];
-    const settings = getGlobalSettings();
-
-    try {
-        const response = await client.models.generateContent({
-            model: settings.text.model || 'gemini-3-flash-preview',
-            contents: `Brainstorm 5 creative ideas/expansions for this context: "${context}". Return JSON array of strings.`,
-            config: {
-                responseMimeType: "application/json",
-                responseSchema: {
-                    type: Type.ARRAY,
-                    items: { type: Type.STRING }
-                }
-            }
-        });
-        return JSON.parse(response.text || '[]');
-    } catch (e) {
-        logger.error("Brainstorm Error", e);
-        return [];
-    }
-};

package/src/utils/ai/ai-core.ts

@@ -1,50 +0,0 @@
-// ═══════════════════════════════════════════════════════
-//  AI Core — Shared infrastructure for all AI modules
-// ═══════════════════════════════════════════════════════
-
-import { GoogleGenAI } from "@google/genai";
-
-// Simple Logger Mock
-const logger = {
-    log: console.log,
-    warn: console.warn,
-    error: console.error
-};
-
-export interface AISettings {
-    text: { model: string; apiKey: string };
-    image: { model: string; apiKey: string };
-    video: { model: string; apiKey: string };
-    audio: { model: string; apiKey: string };
-}
-
-// Default configuration
-let globalSettings: AISettings = {
-    text: { model: 'gemini-3-flash-preview', apiKey: '' },
-    image: { model: 'gemini-3-pro-image-preview', apiKey: '' },
-    video: { model: 'veo-3.1-generate-preview', apiKey: '' },
-    audio: { model: 'gemini-2.5-flash-preview-tts', apiKey: '' }
-};
-
-export const updateGlobalAISettings = (settings: AISettings) => {
-    globalSettings = settings;
-};
-
-export const getGlobalSettings = () => globalSettings;
-
-// Helper to get client with specific config
-export const getClient = (category: keyof AISettings) => {
-    const config = globalSettings[category];
-    const key = config.apiKey || process.env.VITE_API_KEY || ''; // Copia de seguridad si no se setea
-
-    if (!key) return null;
-
-    try {
-        return new GoogleGenAI({ apiKey: key });
-    } catch (e) {
-        logger.error("Failed to initialize GoogleGenAI client", e);
-        return null;
-    }
-};
-
-export { logger };