@decido/shell 1.0.0 → 4.0.1

package/src/store/useShellRegistry.ts

@@ -1,123 +0,0 @@
-/**
- * useShellRegistry — Centralized registry for shell types.
- * 
- * Replaces the scattered `registerMorphComponent` / `getMorphComponent` pattern
- * with a unified ShellType → Component mapping.
- * 
- * Built-in shells: markdown, iframe, shell-vscode, shell-canvas
- * Plugins register custom shells via `registerShell('my-shell', MyComponent)`
- */
-import React from 'react';
-
-// ── Shell Types ──
-
-export type BuiltInShellType = 'markdown' | 'iframe' | 'shell-vscode' | 'shell-canvas';
-export type ShellType = BuiltInShellType | (string & {});
-
-/** Props that every shell component receives */
-export interface ShellProps {
-    /** Unique instance ID */
-    instanceId: string;
-    /** Data payload from the morph instance */
-    data: Record<string, any>;
-    /** Current artifacts for this instance */
-    artifacts: MorphArtifact[];
-    /** Index of the active artifact */
-    activeArtifactIndex: number;
-    /** Callback to update artifact data */
-    onArtifactUpdate?: (artifactId: string, data: Record<string, any>) => void;
-}
-
-/** Artifact within a morph instance (file/version) */
-export interface MorphArtifact {
-    id: string;
-    name: string;
-    version: number;
-    shellType: ShellType;
-    data: Record<string, any>;
-    updatedAt: number;
-}
-
-// ── Shell Metadata ──
-
-export interface ShellMeta {
-    icon: string;
-    color: string;
-    label: string;
-}
-
-const shellMetaRegistry = new Map<string, ShellMeta>();
-
-const DEFAULT_SHELL_META: Record<string, ShellMeta> = {
-    'markdown':           { icon: '📝', color: '#10b981', label: 'Markdown' },
-    'iframe':             { icon: '🖥️', color: '#6b7280', label: 'iFrame' },
-    'nexusai-preview':    { icon: '🌐', color: '#3b82f6', label: 'Web Preview' },
-    'shell-vscode':       { icon: '💻', color: '#007acc', label: 'VS Code' },
-    'shell-canvas':       { icon: '🖼️', color: '#f59e0b', label: 'Canvas' },
-    'shell-theme-editor': { icon: '🎨', color: '#a855f7', label: 'Theme Editor' },
-};
-
-// ── Registry ──
-
-const shellRegistry = new Map<string, React.ComponentType<ShellProps>>();
-
-/**
- * Register a shell type with optional metadata.
- * Built-in shells are registered at boot. Plugins call this for custom shells.
- * @example registerShell('my-plugin-viewer', MyViewerComponent, { icon: '🔧', color: '#f00', label: 'My Viewer' })
- */
-export function registerShell(type: ShellType, component: React.ComponentType<ShellProps>, meta?: ShellMeta) {
-    shellRegistry.set(type, component);
-    if (meta) shellMetaRegistry.set(type, meta);
-    else if (DEFAULT_SHELL_META[type]) shellMetaRegistry.set(type, DEFAULT_SHELL_META[type]);
-}
-
-/**
- * Resolve a shell type to its React component.
- * Returns undefined if the shell type is not registered.
- */
-export function resolveShell(type: ShellType): React.ComponentType<ShellProps> | undefined {
-    return shellRegistry.get(type);
-}
-
-/**
- * Check if a shell type is registered.
- */
-export function isShellRegistered(type: ShellType): boolean {
-    return shellRegistry.has(type);
-}
-
-/**
- * Get all registered shell type IDs (for UI dropdowns).
- */
-export function getRegisteredShellTypes(): string[] {
-    return Array.from(shellRegistry.keys());
-}
-
-/**
- * Get metadata for a shell type.
- */
-export function getShellMeta(type: string): ShellMeta {
-    return shellMetaRegistry.get(type) || { icon: '📦', color: '#71717a', label: type };
-}
-
-// ── Legacy compatibility ──
-// Bridge to the old registerMorphComponent API during migration
-
-/**
- * @deprecated Use registerShell() instead
- */
-export function registerMorphComponentCompat(id: string, component: React.ComponentType<any>) {
-    // Wrap legacy components to match ShellProps interface
-    const WrappedComponent: React.ComponentType<ShellProps> = (props) => {
-        return React.createElement(component, { ...(props.data || {}), ...props });
-    };
-    shellRegistry.set(id, WrappedComponent);
-}
-
-/**
- * @deprecated Use resolveShell() instead
- */
-export function getMorphComponentCompat(id: string): React.ComponentType<any> | undefined {
-    return shellRegistry.get(id) as React.ComponentType<any> | undefined;
-}

package/src/store/useSuggestionsStore.ts

@@ -1,57 +0,0 @@
-/**
- * useSuggestionsStore — Zustand store for managing chat suggestions.
- * 
- * Supports: seed phrases (user CRUD), AI-generated suggestions,
- * and plugin-registered suggestions via SDK.
- */
-import { create } from 'zustand';
-import { persist } from 'zustand/middleware';
-
-export interface SuggestionsState {
-    seeds: string[];
-    generated: string[];
-    pluginSuggestions: Record<string, string[]>;
-
-    addSeed: (seed: string) => void;
-    removeSeed: (index: number) => void;
-    updateSeed: (index: number, value: string) => void;
-    setGenerated: (suggestions: string[]) => void;
-    registerPluginSuggestions: (pluginId: string, items: string[]) => void;
-    unregisterPluginSuggestions: (pluginId: string) => void;
-    getAllSuggestions: () => string[];
-}
-
-export const useSuggestionsStore = create<SuggestionsState>()(
-    persist(
-        (set, get) => ({
-            seeds: [
-                'Explícame cómo funciona este flujo',
-                'Crea un grafo de onboarding',
-                'Analiza el rendimiento del sistema',
-            ],
-            generated: [],
-            pluginSuggestions: {},
-
-            addSeed: (seed) => set(s => ({ seeds: [...s.seeds, seed] })),
-            removeSeed: (index) => set(s => ({ seeds: s.seeds.filter((_, i) => i !== index) })),
-            updateSeed: (index, value) => set(s => ({
-                seeds: s.seeds.map((seed, i) => i === index ? value : seed)
-            })),
-            setGenerated: (suggestions) => set({ generated: suggestions }),
-            registerPluginSuggestions: (pluginId, items) => set(s => ({
-                pluginSuggestions: { ...s.pluginSuggestions, [pluginId]: items }
-            })),
-            unregisterPluginSuggestions: (pluginId) => set(s => {
-                const next = { ...s.pluginSuggestions };
-                delete next[pluginId];
-                return { pluginSuggestions: next };
-            }),
-            getAllSuggestions: () => {
-                const s = get();
-                const plugin = Object.values(s.pluginSuggestions).flat();
-                return [...s.generated, ...s.seeds, ...plugin];
-            },
-        }),
-        { name: 'decido-suggestions-store' }
-    )
-);

package/src/store/useThemeStore.ts

@@ -1,399 +0,0 @@
-/**
- * Decido Aura — Theme Store
- *
- * Consolidated Zustand store for runtime theme management.
- * Sets `--ds-*` CSS custom properties on `:root` which are
- * read by the TW4 `@theme` contract in tokens.css.
- *
- * Usage:
- *   const { setTheme, currentTheme } = useTheme();
- *   setTheme('midnight-blue');
- */
-import { create } from 'zustand';
-import { persist } from 'zustand/middleware';
-
-// ── Types ──
-
-export interface ThemeTokens {
-  /* Surface */
-  'surface-primary': string;
-  'surface-secondary': string;
-  'surface-tertiary': string;
-  'surface-elevated': string;
-  'surface-glass': string;
-  'surface-overlay': string;
-  /* Text */
-  'text-primary': string;
-  'text-secondary': string;
-  'text-muted': string;
-  'text-inverse': string;
-  /* Accent */
-  'accent-blue': string;
-  'accent-purple': string;
-  'accent-green': string;
-  'accent-red': string;
-  'accent-amber': string;
-  'accent-cyan': string;
-  /* Border */
-  'border-subtle': string;
-  'border-default': string;
-  'border-strong': string;
-  'border-glow': string;
-  /* Status */
-  'status-ok': string;
-  'status-warn': string;
-  'status-error': string;
-  'status-info': string;
-}
-
-export interface ThemeMeta {
-  'radius-xs': string;
-  'radius-sm': string;
-  'radius-md': string;
-  'radius-lg': string;
-  'radius-xl': string;
-  'blur-xs': string;
-  'blur-sm': string;
-  'blur-md': string;
-  'blur-lg': string;
-  'blur-xl': string;
-  'font-sans': string;
-  'font-mono': string;
-}
-
-export interface ThemePreset {
-  id: string;
-  name: string;
-  description: string;
-  preview: { bg: string; accent: string; text: string };
-  tokens: ThemeTokens;
-  meta: ThemeMeta;
-}
-
-// ── Default Meta ──
-
-const DEFAULT_META: ThemeMeta = {
-  'radius-xs': '4px',
-  'radius-sm': '6px',
-  'radius-md': '10px',
-  'radius-lg': '16px',
-  'radius-xl': '24px',
-  'blur-xs': '4px',
-  'blur-sm': '8px',
-  'blur-md': '16px',
-  'blur-lg': '24px',
-  'blur-xl': '40px',
-  'font-sans': "'Inter', 'system-ui', sans-serif",
-  'font-mono': "'JetBrains Mono', 'Fira Code', monospace",
-};
-
-// ── Presets ──
-
-export const THEME_DECIDO_DARK: ThemePreset = {
-  id: 'decido-dark',
-  name: 'Decido Dark',
-  description: 'Tema por defecto — oscuro con acentos púrpura y cyan',
-  preview: { bg: '#0a0a0f', accent: '#a855f7', text: '#e8e8f0' },
-  tokens: {
-    'surface-primary': '#0a0a0f',
-    'surface-secondary': '#12121a',
-    'surface-tertiary': '#1a1a26',
-    'surface-elevated': '#22222e',
-    'surface-glass': 'rgba(255, 255, 255, 0.03)',
-    'surface-overlay': 'rgba(0, 0, 0, 0.6)',
-    'text-primary': '#e8e8f0',
-    'text-secondary': '#9898b0',
-    'text-muted': '#5a5a72',
-    'text-inverse': '#0a0a0f',
-    'accent-blue': '#4a9eff',
-    'accent-purple': '#a855f7',
-    'accent-green': '#34d399',
-    'accent-red': '#f87171',
-    'accent-amber': '#fbbf24',
-    'accent-cyan': '#22d3ee',
-    'border-subtle': 'rgba(255, 255, 255, 0.06)',
-    'border-default': 'rgba(255, 255, 255, 0.1)',
-    'border-strong': 'rgba(255, 255, 255, 0.2)',
-    'border-glow': 'rgba(168, 85, 247, 0.5)',
-    'status-ok': '#34d399',
-    'status-warn': '#fbbf24',
-    'status-error': '#f87171',
-    'status-info': '#4a9eff',
-  },
-  meta: DEFAULT_META,
-};
-
-export const THEME_MIDNIGHT_BLUE: ThemePreset = {
-  id: 'midnight-blue',
-  name: 'Midnight Blue',
-  description: 'Azul profundo con tonos slate',
-  preview: { bg: '#0b1120', accent: '#3b82f6', text: '#f1f5f9' },
-  tokens: {
-    'surface-primary': '#0b1120',
-    'surface-secondary': '#111827',
-    'surface-tertiary': '#1e293b',
-    'surface-elevated': '#273548',
-    'surface-glass': 'rgba(30, 41, 59, 0.5)',
-    'surface-overlay': 'rgba(11, 17, 32, 0.7)',
-    'text-primary': '#f1f5f9',
-    'text-secondary': '#94a3b8',
-    'text-muted': '#64748b',
-    'text-inverse': '#0b1120',
-    'accent-blue': '#3b82f6',
-    'accent-purple': '#8b5cf6',
-    'accent-green': '#22c55e',
-    'accent-red': '#ef4444',
-    'accent-amber': '#f59e0b',
-    'accent-cyan': '#06b6d4',
-    'border-subtle': 'rgba(148, 163, 184, 0.06)',
-    'border-default': 'rgba(148, 163, 184, 0.12)',
-    'border-strong': 'rgba(148, 163, 184, 0.25)',
-    'border-glow': 'rgba(59, 130, 246, 0.5)',
-    'status-ok': '#22c55e',
-    'status-warn': '#f59e0b',
-    'status-error': '#ef4444',
-    'status-info': '#3b82f6',
-  },
-  meta: DEFAULT_META,
-};
-
-export const THEME_EMERALD_NOIR: ThemePreset = {
-  id: 'emerald-noir',
-  name: 'Emerald Noir',
-  description: 'Oscuro con acentos esmeralda',
-  preview: { bg: '#0a0f0d', accent: '#34d399', text: '#ecfdf5' },
-  tokens: {
-    'surface-primary': '#0a0f0d',
-    'surface-secondary': '#0f1a15',
-    'surface-tertiary': '#162620',
-    'surface-elevated': '#1e332b',
-    'surface-glass': 'rgba(22, 38, 32, 0.5)',
-    'surface-overlay': 'rgba(10, 15, 13, 0.7)',
-    'text-primary': '#ecfdf5',
-    'text-secondary': '#a7f3d0',
-    'text-muted': '#6ee7b7',
-    'text-inverse': '#0a0f0d',
-    'accent-blue': '#2dd4bf',
-    'accent-purple': '#a78bfa',
-    'accent-green': '#34d399',
-    'accent-red': '#fb7185',
-    'accent-amber': '#fbbf24',
-    'accent-cyan': '#2dd4bf',
-    'border-subtle': 'rgba(167, 243, 208, 0.06)',
-    'border-default': 'rgba(167, 243, 208, 0.12)',
-    'border-strong': 'rgba(167, 243, 208, 0.25)',
-    'border-glow': 'rgba(52, 211, 153, 0.5)',
-    'status-ok': '#34d399',
-    'status-warn': '#fbbf24',
-    'status-error': '#fb7185',
-    'status-info': '#2dd4bf',
-  },
-  meta: DEFAULT_META,
-};
-
-export const THEME_ROSE_GOLD: ThemePreset = {
-  id: 'rose-gold',
-  name: 'Rose Gold',
-  description: 'Elegante con tonos rosa y dorado',
-  preview: { bg: '#120a0d', accent: '#f472b6', text: '#fdf2f8' },
-  tokens: {
-    'surface-primary': '#120a0d',
-    'surface-secondary': '#1a1015',
-    'surface-tertiary': '#26161e',
-    'surface-elevated': '#331c28',
-    'surface-glass': 'rgba(38, 22, 30, 0.5)',
-    'surface-overlay': 'rgba(18, 10, 13, 0.7)',
-    'text-primary': '#fdf2f8',
-    'text-secondary': '#f9a8d4',
-    'text-muted': '#f472b6',
-    'text-inverse': '#120a0d',
-    'accent-blue': '#e879f9',
-    'accent-purple': '#f472b6',
-    'accent-green': '#34d399',
-    'accent-red': '#fb7185',
-    'accent-amber': '#fcd34d',
-    'accent-cyan': '#e879f9',
-    'border-subtle': 'rgba(249, 168, 212, 0.06)',
-    'border-default': 'rgba(249, 168, 212, 0.12)',
-    'border-strong': 'rgba(249, 168, 212, 0.25)',
-    'border-glow': 'rgba(244, 114, 182, 0.5)',
-    'status-ok': '#34d399',
-    'status-warn': '#fcd34d',
-    'status-error': '#fb7185',
-    'status-info': '#e879f9',
-  },
-  meta: DEFAULT_META,
-};
-
-export const THEME_OLED_PURE: ThemePreset = {
-  id: 'oled-pure',
-  name: 'OLED Pure',
-  description: 'Negro absoluto para pantallas OLED',
-  preview: { bg: '#000000', accent: '#a855f7', text: '#ffffff' },
-  tokens: {
-    'surface-primary': '#000000',
-    'surface-secondary': '#0a0a0a',
-    'surface-tertiary': '#141414',
-    'surface-elevated': '#1e1e1e',
-    'surface-glass': 'rgba(255, 255, 255, 0.02)',
-    'surface-overlay': 'rgba(0, 0, 0, 0.8)',
-    'text-primary': '#ffffff',
-    'text-secondary': '#a0a0a0',
-    'text-muted': '#666666',
-    'text-inverse': '#000000',
-    'accent-blue': '#4a9eff',
-    'accent-purple': '#a855f7',
-    'accent-green': '#34d399',
-    'accent-red': '#f87171',
-    'accent-amber': '#fbbf24',
-    'accent-cyan': '#22d3ee',
-    'border-subtle': 'rgba(255, 255, 255, 0.04)',
-    'border-default': 'rgba(255, 255, 255, 0.08)',
-    'border-strong': 'rgba(255, 255, 255, 0.15)',
-    'border-glow': 'rgba(168, 85, 247, 0.5)',
-    'status-ok': '#4ade80',
-    'status-warn': '#fbbf24',
-    'status-error': '#f87171',
-    'status-info': '#4a9eff',
-  },
-  meta: DEFAULT_META,
-};
-
-// ── Light Theme ──
-
-export const THEME_DECIDO_LIGHT: ThemePreset = {
-  id: 'decido-light',
-  name: 'Decido Light',
-  description: 'Tema claro premium — ideal para trabajo diurno',
-  preview: { bg: '#f8f9fb', accent: '#6366f1', text: '#1a1a2e' },
-  tokens: {
-    'surface-primary': '#f8f9fb',
-    'surface-secondary': '#ffffff',
-    'surface-tertiary': '#eef0f4',
-    'surface-elevated': '#ffffff',
-    'surface-glass': 'rgba(0, 0, 0, 0.03)',
-    'surface-overlay': 'rgba(0, 0, 0, 0.4)',
-    'text-primary': '#1a1a2e',
-    'text-secondary': '#64648c',
-    'text-muted': '#9898b0',
-    'text-inverse': '#ffffff',
-    'accent-blue': '#3b82f6',
-    'accent-purple': '#6366f1',
-    'accent-green': '#10b981',
-    'accent-red': '#ef4444',
-    'accent-amber': '#f59e0b',
-    'accent-cyan': '#06b6d4',
-    'border-subtle': 'rgba(0, 0, 0, 0.06)',
-    'border-default': 'rgba(0, 0, 0, 0.12)',
-    'border-strong': 'rgba(0, 0, 0, 0.2)',
-    'border-glow': 'rgba(99, 102, 241, 0.4)',
-    'status-ok': '#10b981',
-    'status-warn': '#f59e0b',
-    'status-error': '#ef4444',
-    'status-info': '#3b82f6',
-  },
-  meta: DEFAULT_META,
-};
-
-// ── All presets ──
-
-export const THEME_PRESETS: ThemePreset[] = [
-  THEME_DECIDO_DARK,
-  THEME_DECIDO_LIGHT,
-  THEME_MIDNIGHT_BLUE,
-  THEME_EMERALD_NOIR,
-  THEME_ROSE_GOLD,
-  THEME_OLED_PURE,
-];
-
-// ── Inject helper ──
-
-function injectTokens(tokens: ThemeTokens, meta: ThemeMeta) {
-  const root = document.documentElement;
-  Object.entries(tokens).forEach(([key, value]) => {
-    root.style.setProperty(`--ds-${key}`, value);
-  });
-  Object.entries(meta).forEach(([key, value]) => {
-    root.style.setProperty(`--ds-${key}`, value);
-  });
-}
-
-// ── Store ──
-
-interface ThemeState {
-  currentThemeId: string;
-  customPresets: ThemePreset[];
-  /* Actions */
-  setTheme: (themeId: string) => void;
-  setToken: (name: keyof ThemeTokens, value: string) => void;
-  addPreset: (preset: ThemePreset) => void;
-  inject: () => void;
-  exportCSS: () => string;
-  /* Getters */
-  getCurrentPreset: () => ThemePreset;
-  getAllPresets: () => ThemePreset[];
-}
-
-export const useTheme = create<ThemeState>()(
-  persist(
-    (set, get) => ({
-      currentThemeId: 'decido-dark',
-      customPresets: [],
-
-      setTheme: (themeId) => {
-        set({ currentThemeId: themeId });
-        const preset = get().getCurrentPreset();
-        injectTokens(preset.tokens, preset.meta);
-      },
-
-      setToken: (name, value) => {
-        document.documentElement.style.setProperty(`--ds-${name}`, value);
-      },
-
-      addPreset: (preset) => {
-        set((s) => ({
-          customPresets: [...s.customPresets.filter((p) => p.id !== preset.id), preset],
-        }));
-      },
-
-      inject: () => {
-        const preset = get().getCurrentPreset();
-        injectTokens(preset.tokens, preset.meta);
-      },
-
-      exportCSS: () => {
-        const preset = get().getCurrentPreset();
-        const lines = [`:root {`];
-        Object.entries(preset.tokens).forEach(([k, v]) => {
-          lines.push(`  --ds-${k}: ${v};`);
-        });
-        Object.entries(preset.meta).forEach(([k, v]) => {
-          lines.push(`  --ds-${k}: ${v};`);
-        });
-        lines.push(`}`);
-        return lines.join('\n');
-      },
-
-      getCurrentPreset: () => {
-        const { currentThemeId, customPresets } = get();
-        return (
-          [...THEME_PRESETS, ...customPresets].find((p) => p.id === currentThemeId) ??
-          THEME_DECIDO_DARK
-        );
-      },
-
-      getAllPresets: () => {
-        return [...THEME_PRESETS, ...get().customPresets];
-      },
-    }),
-    {
-      name: 'decido-aura-theme',
-      onRehydrateStorage: () => (state) => {
-        if (state) {
-          // Re-inject theme on page load
-          setTimeout(() => state.inject(), 0);
-        }
-      },
-    }
-  )
-);