improve docs

plugins/index.d.ts

@@ -0,0 +1,106 @@
+/**
+ * SigPro Plugins
+ * Official plugins for SigPro reactive framework
+ * 
+ * @module sigpro/plugins
+ */
+
+import type { SigPro } from '../sigpro/sigpro';
+
+/**
+ * Plugin context passed to all plugins
+ */
+export interface PluginContext {
+  $: SigPro;
+}
+
+/**
+ * Base plugin interface
+ */
+export interface SigProPlugin {
+  /** Plugin name for debugging */
+  name: string;
+  /** Plugin version */
+  version?: string;
+  /** Initialize plugin with SigPro instance */
+  install: (context: PluginContext) => void | Promise<void>;
+}
+
+/**
+ * UI Plugin - Creates reactive UI components
+ * 
+ * @example
+ * ```javascript
+ * import { UI } from 'sigpro/plugins';
+ * 
+ * $.plugin(UI);
+ * 
+ * // Now you can use UI components
+ * const modal = UI.modal({
+ *   title: 'Hello',
+ *   content: 'This is a modal'
+ * });
+ * ```
+ */
+export const UI: SigProPlugin;
+
+/**
+ * Fetch Plugin - Reactive data fetching
+ * 
+ * @example
+ * ```javascript
+ * import { Fetch } from 'sigpro/plugins';
+ * 
+ * $.plugin(Fetch);
+ * 
+ * // Reactive data fetching
+ * const users = $.fetch('/api/users');
+ * const user = $.fetch(() => `/api/users/${userId()}`);
+ * ```
+ */
+export const Fetch: SigProPlugin;
+
+/**
+ * Debug Plugin - Development tools and logging
+ * 
+ * @example
+ * ```javascript
+ * import { Debug } from 'sigpro/plugins';
+ * 
+ * $.plugin(Debug);
+ * 
+ * // Debug signals in console
+ * $.debug(count); // Logs changes to console
+ * ```
+ */
+export const Debug: SigProPlugin;
+
+/**
+ * Plugin options for each plugin
+ */
+export namespace PluginOptions {
+  interface UIOptions {
+    /** Prefix for CSS classes */
+    classPrefix?: string;
+    /** Default animation duration */
+    animationDuration?: number;
+  }
+
+  interface FetchOptions {
+    /** Base URL for all requests */
+    baseURL?: string;
+    /** Default headers */
+    headers?: Record<string, string>;
+    /** Timeout in milliseconds */
+    timeout?: number;
+  }
+
+  interface DebugOptions {
+    /** Enable verbose logging */
+    verbose?: boolean;
+    /** Log to console */
+    logToConsole?: boolean;
+    /** Enable time travel debugging */
+    timeTravel?: boolean;
+  }
+}

plugins/index.js

@@ -1,6 +1,4 @@
 // /plugins/index.js
 export { UI } from './ui.js';
 export { Fetch } from './fetch.js';
-export { Storage } from './storage.js';
 export { Debug } from './debug.js';
-export { Router } from './router.js';

plugins/router.js

@@ -1,44 +0,0 @@
-// plugins/router.js
-export const Router = ($) => {
-  
-  $.router = (routes) => {
-    const sPath = $(window.location.hash.replace(/^#/, "") || "/");
-    window.addEventListener("hashchange", () => sPath(window.location.hash.replace(/^#/, "") || "/"));
-
-    return div([
-      () => {
-        const current = sPath();
-        const route = routes.find(r => {
-          const rP = r.path.split('/').filter(Boolean);
-          const cP = current.split('/').filter(Boolean);
-          if (rP.length !== cP.length) return false;
-          return rP.every((part, i) => part.startsWith(':') || part === cP[i]);
-        }) || routes.find(r => r.path === "*");
-
-        if (!route) return h1("404 - Not Found");
-
-        // --- LA MEJORA AQUÍ ---
-        const result = typeof route.component === 'function' ? route.component() : route.component;
-
-        // Si el componente es una Promesa (Lazy Loading de Vite), esperamos
-        if (result instanceof Promise) {
-          const $lazyNode = $(span("Cargando página..."));
-          result.then(m => {
-            // Si el módulo tiene un .default (export default), lo usamos
-            const comp = typeof m === 'function' ? m() : (m.default ? m.default() : m);
-            $lazyNode(comp);
-          });
-          return () => $lazyNode();
-        }
-
-        return result instanceof Node ? result : span(String(result));
-      }
-    ]);
-  };
-
-  $.router.go = (path) => {
-    window.location.hash = path.startsWith('/') ? path : `/${path}`;
-  };
-
-  window._router = $.router;
-};

plugins/storage.js

@@ -1,31 +0,0 @@
-/**
- * SigPro Storage Plugin
- * Automatically synchronizes signals with localStorage.
- */
-export const Storage = ($) => {
-  /**
-   * Persists a signal's value in localStorage.
-   * @param {Function} $sig - The signal to persist.
-   * @param {string} key - The localStorage key name.
-   * @returns {Function} The same signal for chaining.
-   */
-  _storage = ($sig, key) => {
-    // 1. Initial Load: If there's data in storage, update the signal immediately
-    const saved = localStorage.getItem(key);
-    if (saved !== null) {
-      try {
-        $sig(JSON.parse(saved));
-      } catch (e) {
-        console.error(`[SigPro Storage] Error parsing key "${key}":`, e);
-      }
-    }
-
-    // 2. Auto-Save: Every time the signal changes, update localStorage
-    $(() => {
-      const val = $sig();
-      localStorage.setItem(key, JSON.stringify(val));
-    });
-
-    return $sig;
-  };
-};