From 26177b7c4fc705145591b54a7bbdb2c410b9c0c9 Mon Sep 17 00:00:00 2001 From: natxocc Date: Thu, 26 Mar 2026 14:15:32 +0100 Subject: [PATCH] Small changes in docs --- docs/404.html | 2 +- docs/api/html.html | 6 +++--- docs/api/mount.html | 2 +- docs/api/quick.html | 8 ++++---- docs/api/router.html | 2 +- docs/api/signal.html | 2 +- docs/api/tags.html | 10 +++++----- docs/api/watch.html | 6 +++--- ..._html.md.BPbZMZR1.js => api_html.md.DSCIaSlE.js} | 2 +- ...PbZMZR1.lean.js => api_html.md.DSCIaSlE.lean.js} | 0 docs/assets/api_quick.md.CVAmBRZF.js | 1 - docs/assets/api_quick.md.CVAmBRZF.lean.js | 1 - docs/assets/api_quick.md.QL5306xO.js | 1 + docs/assets/api_quick.md.QL5306xO.lean.js | 1 + ..._tags.md.CW_zjfl9.js => api_tags.md.DAemWpgh.js} | 6 +++--- ...W_zjfl9.lean.js => api_tags.md.DAemWpgh.lean.js} | 0 ...atch.md.D7sOEzCX.js => api_watch.md.B4pyArWy.js} | 2 +- ...sOEzCX.lean.js => api_watch.md.B4pyArWy.lean.js} | 0 ...nstall.md.D5NkNmWr.js => install.md.Cel7_1B6.js} | 4 ++-- ...D5NkNmWr.lean.js => install.md.Cel7_1B6.lean.js} | 0 docs/hashmap.json | 2 +- docs/index.html | 2 +- docs/install.html | 8 ++++---- docs/ui/quick.html | 2 +- docs/vite/plugin.html | 2 +- src/docs/api/html.md | 2 +- src/docs/api/quick.md | 13 +------------ src/docs/api/tags.md | 6 +++--- src/docs/api/watch.md | 2 +- 29 files changed, 42 insertions(+), 53 deletions(-) rename docs/assets/{api_html.md.BPbZMZR1.js => api_html.md.DSCIaSlE.js} (74%) rename docs/assets/{api_html.md.BPbZMZR1.lean.js => api_html.md.DSCIaSlE.lean.js} (100%) delete mode 100644 docs/assets/api_quick.md.CVAmBRZF.js delete mode 100644 docs/assets/api_quick.md.CVAmBRZF.lean.js create mode 100644 docs/assets/api_quick.md.QL5306xO.js create mode 100644 docs/assets/api_quick.md.QL5306xO.lean.js rename docs/assets/{api_tags.md.CW_zjfl9.js => api_tags.md.DAemWpgh.js} (69%) rename docs/assets/{api_tags.md.CW_zjfl9.lean.js => api_tags.md.DAemWpgh.lean.js} (100%) rename docs/assets/{api_watch.md.D7sOEzCX.js => api_watch.md.B4pyArWy.js} (95%) rename docs/assets/{api_watch.md.D7sOEzCX.lean.js => api_watch.md.B4pyArWy.lean.js} (100%) rename docs/assets/{install.md.D5NkNmWr.js => install.md.Cel7_1B6.js} (96%) rename docs/assets/{install.md.D5NkNmWr.lean.js => install.md.Cel7_1B6.lean.js} (100%) diff --git a/docs/404.html b/docs/404.html index 576b8c9..7ceb1d4 100644 --- a/docs/404.html +++ b/docs/404.html @@ -17,7 +17,7 @@
- + \ No newline at end of file diff --git a/docs/api/html.html b/docs/api/html.html index 5441540..cb92ba3 100644 --- a/docs/api/html.html +++ b/docs/api/html.html @@ -13,13 +13,13 @@ - + -
SigPro

Appearance

πŸ—οΈ The DOM Factory: $.html( ) ​

$.html is the internal engine that creates, attributes, and attaches reactivity to DOM elements. In V2, it uses $.watch to maintain a live, high-performance link between your Signals and the Document Object Model.

πŸ›  Function Signature ​

typescript
$.html(tagName: string, props?: Object, children?: any[] | any): HTMLElement
ParameterTypeRequiredDescription
tagNamestringYesValid HTML tag name (e.g., "div", "button").
propsObjectNoHTML attributes, event listeners, and reactive bindings.
childrenanyNoNested elements, text strings, or reactive functions.

πŸ“– Key Features ​

1. Attribute Handling ​

SigPro intelligently decides how to apply each property:

  • Standard Props: Applied via setAttribute or direct property assignment.
  • Boolean Props: Uses toggleAttribute (e.g., checked, disabled, hidden).
  • Class Names: Supports class or className interchangeably.

2. Event Listeners & Modifiers ​

Events are defined by the on prefix. SigPro supports Dot Notation for common event operations:

javascript
$.html("button", {
+    
SigPro
Appearance
πŸ—οΈ The DOM Factory: $.html( ) ​
$.html is the internal engine that creates, attributes, and attaches reactivity to DOM elements. It uses $.watch to maintain a live, high-performance link between your Signals and the Document Object Model.
πŸ›  Function Signature ​
typescript
$.html(tagName: string, props?: Object, children?: any[] | any): HTMLElement
ParameterTypeRequiredDescription
tagNamestringYesValid HTML tag name (e.g., "div", "button").
propsObjectNoHTML attributes, event listeners, and reactive bindings.
childrenanyNoNested elements, text strings, or reactive functions.
πŸ“– Key Features ​
1. Attribute Handling ​
SigPro intelligently decides how to apply each property:
  • Standard Props: Applied via setAttribute or direct property assignment.
  • Boolean Props: Uses toggleAttribute (e.g., checked, disabled, hidden).
  • Class Names: Supports class or className interchangeably.
2. Event Listeners & Modifiers ​
Events are defined by the on prefix. SigPro supports Dot Notation for common event operations:
javascript
$.html("button", {
   // e.preventDefault() is called automatically
   "onsubmit.prevent": (e) => save(e), 
   
@@ -43,7 +43,7 @@
 
 // Is exactly equivalent to:
 $.html("div", { class: "wrapper" }, [ $.html("span", {}, "Hello") ])

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/api/mount.html b/docs/api/mount.html
index f21dab9..8cb7395 100644
--- a/docs/api/mount.html
+++ b/docs/api/mount.html
@@ -35,7 +35,7 @@
 
 // Later, to remove the toast and kill its reactivity:
 instance.destroy();

πŸ’‘ Summary Cheat Sheet ​

GoalCode Pattern
Mount to body$.mount(App)
Mount to CSS Selector$.mount(App, '#root')
Mount to DOM Node$.mount(App, myElement)
Clean & Re-mountCalling $.mount again on the same target
Total Saneamientoconst app = $.mount(App); app.destroy();
- + \ No newline at end of file diff --git a/docs/api/quick.html b/docs/api/quick.html index 080f15c..2e7a023 100644 --- a/docs/api/quick.html +++ b/docs/api/quick.html @@ -3,7 +3,7 @@ - ⚑ Quick API Reference (V2) | SigPro + ⚑ Quick API Reference | SigPro @@ -13,14 +13,14 @@ - + -
SigPro

Appearance

⚑ Quick API Reference (V2) ​

SigPro is a high-performance micro-framework that updates the Real DOM surgically. No Virtual DOM, no unnecessary re-renders, and built-in Saneamiento (memory cleanup).

🟒 Core Functions ​

FunctionSignatureDescription
$(val, key?)(any, string?) => SignalCreates a Signal. If key is provided, it persists in localStorage.
$(fn)(function) => ComputedCreates a Computed Signal that auto-updates when its dependencies change.
$.watch(fn)(function) => stopFnAutomatic Mode: Tracks any signal touched inside. Returns a stop function.
$.watch(deps, fn)(Array, function) => stopFnExplicit Mode: Only runs when signals in deps change. Used for Saneamiento.
$.html(tag, props, kids)(string, obj, any) => ElementThe low-level DOM factory. Attaches ._cleanups to every element.
$.If(cond, then, else?)(Signal, fn, fn?) => NodeReactive conditional. Automatically destroys the "else" branch memory.
$.For(list, itemFn)(Signal, fn) => NodeOptimized list renderer. Manages individual item lifecycles.
$.router(routes)(Array) => ElementHash-based SPA router. Uses Explicit Watch to prevent memory leaks.
$.mount(node, target)(any, string|Node) => RuntimeEntry point. Creates a root instance with .destroy() capabilities.

πŸ—οΈ Element Constructors (Tags) ​

SigPro provides PascalCase wrappers for all standard HTML5 tags (e.g., Div, Span, Button).

Syntax Pattern ​

javascript
Tag({ attributes }, [children])

Attribute & Content Handling ​

PatternCode ExampleBehavior
Staticclass: "text-red"Standard HTML attribute string.
Reactivedisabled: isLoadingUpdates automatically via internal $.watch.
Two-way$value: usernameBinding Operator: Syncs input $\leftrightarrow$ signal both ways.
TextP({}, () => count())Updates text node surgically without re-rendering the P.
Booleanhidden: isHiddenToggles the attribute based on signal truthiness.

🧹 Saneamiento (Memory Management) ​

In SigPro V2, you rarely need to clean up manually, but the tools are there if you build custom components:

  • Automatic: Anything inside $.If, $.For, or $.router is "swept" when it disappears.
  • Manual: Use instance.destroy() for apps or $.cleanup(el) for manual DOM injections.
  • Internal: Every element carries a ._cleanups Set with its own reactive "kill-switches".
- +
SigPro

Appearance

⚑ Quick API Reference ​

SigPro is a high-performance micro-framework that updates the Real DOM surgically. No Virtual DOM, no unnecessary re-renders, and built-in Saneamiento (memory cleanup).

🟒 Core Functions ​

FunctionSignatureDescription
$(val, key?)(any, string?) => SignalCreates a Signal. If key is provided, it persists in localStorage.
$(fn)(function) => ComputedCreates a Computed Signal that auto-updates when its dependencies change.
$.watch(fn)(function) => stopFnAutomatic Mode: Tracks any signal touched inside. Returns a stop function.
$.watch(deps, fn)(Array, function) => stopFnExplicit Mode: Only runs when signals in deps change. Used for Saneamiento.
$.html(tag, props, kids)(string, obj, any) => ElementThe low-level DOM factory. Attaches ._cleanups to every element.
$.If(cond, then, else?)(Signal, fn, fn?) => NodeReactive conditional. Automatically destroys the "else" branch memory.
$.For(list, itemFn)(Signal, fn) => NodeOptimized list renderer. Manages individual item lifecycles.
$.router(routes)(Array) => ElementHash-based SPA router. Uses Explicit Watch to prevent memory leaks.
$.mount(node, target)(any, string|Node) => RuntimeEntry point. Creates a root instance with .destroy() capabilities.

πŸ—οΈ Element Constructors (Tags) ​

SigPro provides PascalCase wrappers for all standard HTML5 tags (e.g., Div, Span, Button).

Syntax Pattern ​

javascript
Tag({ attributes }, [children])

Attribute & Content Handling ​

PatternCode ExampleBehavior
Staticclass: "text-red"Standard HTML attribute string.
Reactivedisabled: isLoadingUpdates automatically via internal $.watch.
Two-way$value: usernameBinding Operator: Syncs input $\leftrightarrow$ signal both ways.
TextP({}, () => count())Updates text node surgically without re-rendering the P.
Booleanhidden: isHiddenToggles the attribute based on signal truthiness.
+ \ No newline at end of file diff --git a/docs/api/router.html b/docs/api/router.html index 9ae4239..ca850fe 100644 --- a/docs/api/router.html +++ b/docs/api/router.html @@ -41,7 +41,7 @@ padding: 2rem; animation: fadeIn 0.2s ease-in; } - + \ No newline at end of file diff --git a/docs/api/signal.html b/docs/api/signal.html index 0115ed2..6c51831 100644 --- a/docs/api/signal.html +++ b/docs/api/signal.html @@ -33,7 +33,7 @@ // Adds "C" using the previous state list(prev => [...prev, "C"]); - + \ No newline at end of file diff --git a/docs/api/tags.html b/docs/api/tags.html index d1cecda..6a9c4e5 100644 --- a/docs/api/tags.html +++ b/docs/api/tags.html @@ -13,20 +13,20 @@ - + -
SigPro

Appearance

🎨 Global Tag Helpers ​

In SigPro V2, you don't need to manually type $.html('div', ...) for every element. To keep your code declarative and readable, the engine automatically generates Global Helper Functions for all standard HTML5 tags upon initialization.

1. How it Works ​

SigPro iterates through a manifest of standard HTML tags and attaches a wrapper function for each one directly to the window object. This creates a specialized DSL (Domain Specific Language) that looks like a template engine but is 100% standard JavaScript.

  • Under the hood: $.html('button', { onclick: ... }, 'Click')
  • SigPro Style: Button({ onclick: ... }, 'Click')

2. The Complete Global Registry ​

The following functions are injected into the global scope (using PascalCase to prevent naming collisions with common JS variables) and are ready to use:

CategoryAvailable Global Functions
StructureDiv, Span, P, Section, Nav, Main, Header, Footer, Article, Aside
TypographyH1 to H6, Ul, Ol, Li, Dl, Dt, Dd, Strong, Em, Code, Pre, Small, B, U, Mark
InteractiveButton, A, Label, Br, Hr, Details, Summary, Dialog
FormsForm, Input, Select, Option, Textarea, Fieldset, Legend
TablesTable, Thead, Tbody, Tr, Th, Td, Tfoot, Caption
MediaImg, Canvas, Video, Audio, Svg, Iframe, Picture, Source

The SigPro Philosophy: Tags are not "magic strings" handled by a compiler. They are functional constructors. Every time you call Div(), you execute a pure JS function that returns a real, reactive DOM element.

3. Usage Patterns (Smart Arguments) ​

SigPro tag helpers are flexible. They automatically detect if you are passing attributes, children, or both.

A. Attributes + Children ​

The standard way to build structured UI.

javascript
Div({ class: 'container', id: 'main' }, [
+    
SigPro
Appearance
🎨 Global Tag Helpers ​
In SigPro, you don't need to manually type $.html('div', ...) for every element. To keep your code declarative and readable, the engine automatically generates Global Helper Functions for all standard HTML5 tags upon initialization.
1. How it Works ​
SigPro iterates through a manifest of standard HTML tags and attaches a wrapper function for each one directly to the window object. This creates a specialized DSL (Domain Specific Language) that looks like a template engine but is 100% standard JavaScript.
  • Under the hood: $.html('button', { onclick: ... }, 'Click')
  • SigPro Style: Button({ onclick: ... }, 'Click')
2. The Complete Global Registry ​
The following functions are injected into the global scope (using PascalCase to prevent naming collisions with common JS variables) and are ready to use:
CategoryAvailable Global Functions
StructureDiv, Span, P, Section, Nav, Main, Header, Footer, Article, Aside
TypographyH1 to H6, Ul, Ol, Li, Dl, Dt, Dd, Strong, Em, Code, Pre, Small, B, U, Mark
InteractiveButton, A, Label, Br, Hr, Details, Summary, Dialog
FormsForm, Input, Select, Option, Textarea, Fieldset, Legend
TablesTable, Thead, Tbody, Tr, Th, Td, Tfoot, Caption
MediaImg, Canvas, Video, Audio, Svg, Iframe, Picture, Source
The SigPro Philosophy: Tags are not "magic strings" handled by a compiler. They are functional constructors. Every time you call Div(), you execute a pure JS function that returns a real, reactive DOM element.
3. Usage Patterns (Smart Arguments) ​
SigPro tag helpers are flexible. They automatically detect if you are passing attributes, children, or both.
A. Attributes + Children ​
The standard way to build structured UI.
javascript
Div({ class: 'container', id: 'main' }, [
   H1("Welcome to SigPro"),
   P("The zero-VDOM framework.")
 ]);
B. Children Only (The "Skipper") ​
If you don't need attributes, you can skip the object and pass the content (string, array, or function) directly as the first argument.
javascript
Section([
   H2("Clean Syntax"),
   Button("I have no props!")
 ]);
C. Primitive Content ​
For simple tags, just pass a string or a number.
javascript
H1("Hello World"); 
-Span(42);
4. Reactive Power V2 ​
These helpers are natively wired into SigPro's $.watch engine. No manual effect management is needed; the lifecycle is tied to the DOM node.
Reactive Attributes ​
Simply pass a Signal (function) to any attribute. SigPro creates an internal $.watch to keep the DOM in sync.
javascript
const theme = $("light");
+Span(42);
4. Reactive Power ​
These helpers are natively wired into SigPro's $.watch engine. No manual effect management is needed; the lifecycle is tied to the DOM node.
Reactive Attributes ​
Simply pass a Signal (function) to any attribute. SigPro creates an internal $.watch to keep the DOM in sync.
javascript
const theme = $("light");
 
 Div({ 
   // Updates 'class' automatically via internal $.watch
@@ -41,7 +41,7 @@
 
 Ul({ class: "list-disc" }, [
   $.For(items, (item) => Li(item))
-]);
DANGER
⚠️ Important: Naming Conventions ​
Since SigPro injects these helpers into the global window object, follow these rules to avoid bugs:
  1. Avoid Shadowing: Don't name your local variables like the tags (e.g., const Div = ...). This will "hide" the SigPro helper.
  2. Custom Components: Always use PascalCase for your own component functions (e.g., UserCard, NavMenu) to distinguish them from the built-in Tag Helpers and maintain architectural clarity.
5. Logic to UI Comparison ​
Here is how a dynamic User Status component translates from SigPro logic to the final DOM structure, handled by the V2 "Saneamiento" engine.
javascript
// SigPro Component
+]);
DANGER
⚠️ Important: Naming Conventions ​
Since SigPro injects these helpers into the global window object, follow these rules to avoid bugs:
  1. Avoid Shadowing: Don't name your local variables like the tags (e.g., const Div = ...). This will "hide" the SigPro helper.
  2. Custom Components: Always use PascalCase for your own component functions (e.g., UserCard, NavMenu) to distinguish them from the built-in Tag Helpers and maintain architectural clarity.
5. Logic to UI Comparison ​
Here is how a dynamic User Status component translates from SigPro logic to the final DOM structure, handled by the engine.
javascript
// SigPro Component
 const UserStatus = (name, $online) => (
   Div({ class: 'flex items-center gap-2' }, [
     Span({ 
@@ -55,7 +55,7 @@
     }, name)
   ])
 );
State ($online)Rendered HTMLMemory Management
true<div class="flex..."><span class="w-3..."></span><p class="text-bold">John</p></div>Watcher active
false<div class="flex..."><span hidden class="w-3..."></span><p class="text-gray-400">John</p></div>Attribute synced

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/api/watch.html b/docs/api/watch.html
index 176a24b..14ff2d6 100644
--- a/docs/api/watch.html
+++ b/docs/api/watch.html
@@ -13,13 +13,13 @@
     
     
     
-    
+    
     
     
     
   
   
-    
SigPro
Appearance
⚑ Reactivity Control: $.watch( ) ​
The $.watch function is the reactive engine of SigPro. It allows you to execute code automatically when signals change. In V2, $.watch is polymorphic: it can track dependencies automatically or follow an explicit list.
πŸ›  Function Signature ​
typescript
// Automatic Mode (Magic Tracking)
+    
SigPro
Appearance
⚑ Reactivity Control: $.watch( ) ​
The $.watch function is the reactive engine of SigPro. It allows you to execute code automatically when signals change. $.watch is polymorphic: it can track dependencies automatically or follow an explicit list.
πŸ›  Function Signature ​
typescript
// Automatic Mode (Magic Tracking)
 $.watch(callback: Function): StopFunction
 
 // Explicit Mode (Isolated Dependencies)
@@ -52,7 +52,7 @@
 // This triggers only ONE re-run.
 a(1);
 b(2);

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/assets/api_html.md.BPbZMZR1.js b/docs/assets/api_html.md.DSCIaSlE.js
similarity index 74%
rename from docs/assets/api_html.md.BPbZMZR1.js
rename to docs/assets/api_html.md.DSCIaSlE.js
index 043f3ac..4ddabda 100644
--- a/docs/assets/api_html.md.BPbZMZR1.js
+++ b/docs/assets/api_html.md.DSCIaSlE.js
@@ -1,4 +1,4 @@
-import{_ as i,o as t,c as a,ae as e}from"./chunks/framework.C8AWLET_.js";const c=JSON.parse('{"title":"πŸ—οΈ The DOM Factory: $.html( )","description":"","frontmatter":{},"headers":[],"relativePath":"api/html.md","filePath":"api/html.md"}'),n={name:"api/html.md"};function l(h,s,p,r,o,k){return t(),a("div",null,[...s[0]||(s[0]=[e(`
πŸ—οΈ The DOM Factory: $.html( ) ​
$.html is the internal engine that creates, attributes, and attaches reactivity to DOM elements. In V2, it uses $.watch to maintain a live, high-performance link between your Signals and the Document Object Model.
πŸ›  Function Signature ​
typescript
$.html(tagName: string, props?: Object, children?: any[] | any): HTMLElement
ParameterTypeRequiredDescription
tagNamestringYesValid HTML tag name (e.g., "div", "button").
propsObjectNoHTML attributes, event listeners, and reactive bindings.
childrenanyNoNested elements, text strings, or reactive functions.
πŸ“– Key Features ​
1. Attribute Handling ​
SigPro intelligently decides how to apply each property:
  • Standard Props: Applied via setAttribute or direct property assignment.
  • Boolean Props: Uses toggleAttribute (e.g., checked, disabled, hidden).
  • Class Names: Supports class or className interchangeably.
2. Event Listeners & Modifiers ​
Events are defined by the on prefix. SigPro supports Dot Notation for common event operations:
javascript
$.html("button", {
+import{_ as i,o as t,c as a,ae as e}from"./chunks/framework.C8AWLET_.js";const c=JSON.parse('{"title":"πŸ—οΈ The DOM Factory: $.html( )","description":"","frontmatter":{},"headers":[],"relativePath":"api/html.md","filePath":"api/html.md"}'),n={name:"api/html.md"};function l(h,s,p,r,o,k){return t(),a("div",null,[...s[0]||(s[0]=[e(`
πŸ—οΈ The DOM Factory: $.html( ) ​
$.html is the internal engine that creates, attributes, and attaches reactivity to DOM elements. It uses $.watch to maintain a live, high-performance link between your Signals and the Document Object Model.
πŸ›  Function Signature ​
typescript
$.html(tagName: string, props?: Object, children?: any[] | any): HTMLElement
ParameterTypeRequiredDescription
tagNamestringYesValid HTML tag name (e.g., "div", "button").
propsObjectNoHTML attributes, event listeners, and reactive bindings.
childrenanyNoNested elements, text strings, or reactive functions.
πŸ“– Key Features ​
1. Attribute Handling ​
SigPro intelligently decides how to apply each property:
  • Standard Props: Applied via setAttribute or direct property assignment.
  • Boolean Props: Uses toggleAttribute (e.g., checked, disabled, hidden).
  • Class Names: Supports class or className interchangeably.
2. Event Listeners & Modifiers ​
Events are defined by the on prefix. SigPro supports Dot Notation for common event operations:
javascript
$.html("button", {
   // e.preventDefault() is called automatically
   "onsubmit.prevent": (e) => save(e), 
   
diff --git a/docs/assets/api_html.md.BPbZMZR1.lean.js b/docs/assets/api_html.md.DSCIaSlE.lean.js
similarity index 100%
rename from docs/assets/api_html.md.BPbZMZR1.lean.js
rename to docs/assets/api_html.md.DSCIaSlE.lean.js
diff --git a/docs/assets/api_quick.md.CVAmBRZF.js b/docs/assets/api_quick.md.CVAmBRZF.js
deleted file mode 100644
index bcf988c..0000000
--- a/docs/assets/api_quick.md.CVAmBRZF.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as e,o as a,c as n,ae as o}from"./chunks/framework.C8AWLET_.js";const h=JSON.parse('{"title":"⚑ Quick API Reference (V2)","description":"","frontmatter":{},"headers":[],"relativePath":"api/quick.md","filePath":"api/quick.md"}'),l={name:"api/quick.md"};function d(s,t,r,i,c,g){return a(),n("div",null,[...t[0]||(t[0]=[o('
⚑ Quick API Reference (V2) ​
SigPro is a high-performance micro-framework that updates the Real DOM surgically. No Virtual DOM, no unnecessary re-renders, and built-in Saneamiento (memory cleanup).
🟒 Core Functions ​
FunctionSignatureDescription
$(val, key?)(any, string?) => SignalCreates a Signal. If key is provided, it persists in localStorage.
$(fn)(function) => ComputedCreates a Computed Signal that auto-updates when its dependencies change.
$.watch(fn)(function) => stopFnAutomatic Mode: Tracks any signal touched inside. Returns a stop function.
$.watch(deps, fn)(Array, function) => stopFnExplicit Mode: Only runs when signals in deps change. Used for Saneamiento.
$.html(tag, props, kids)(string, obj, any) => ElementThe low-level DOM factory. Attaches ._cleanups to every element.
$.If(cond, then, else?)(Signal, fn, fn?) => NodeReactive conditional. Automatically destroys the "else" branch memory.
$.For(list, itemFn)(Signal, fn) => NodeOptimized list renderer. Manages individual item lifecycles.
$.router(routes)(Array) => ElementHash-based SPA router. Uses Explicit Watch to prevent memory leaks.
$.mount(node, target)(any, string|Node) => RuntimeEntry point. Creates a root instance with .destroy() capabilities.
πŸ—οΈ Element Constructors (Tags) ​
SigPro provides PascalCase wrappers for all standard HTML5 tags (e.g., Div, Span, Button).
Syntax Pattern ​
javascript
Tag({ attributes }, [children])
Attribute & Content Handling ​
PatternCode ExampleBehavior
Staticclass: "text-red"Standard HTML attribute string.
Reactivedisabled: isLoadingUpdates automatically via internal $.watch.
Two-way$value: usernameBinding Operator: Syncs input $\\leftrightarrow$ signal both ways.
TextP({}, () => count())Updates text node surgically without re-rendering the P.
Booleanhidden: isHiddenToggles the attribute based on signal truthiness.
🧹 Saneamiento (Memory Management) ​
In SigPro V2, you rarely need to clean up manually, but the tools are there if you build custom components:
  • Automatic: Anything inside $.If, $.For, or $.router is "swept" when it disappears.
  • Manual: Use instance.destroy() for apps or $.cleanup(el) for manual DOM injections.
  • Internal: Every element carries a ._cleanups Set with its own reactive "kill-switches".
',15)])])}const y=e(l,[["render",d]]);export{h as __pageData,y as default};
diff --git a/docs/assets/api_quick.md.CVAmBRZF.lean.js b/docs/assets/api_quick.md.CVAmBRZF.lean.js
deleted file mode 100644
index a0ae42e..0000000
--- a/docs/assets/api_quick.md.CVAmBRZF.lean.js
+++ /dev/null
@@ -1 +0,0 @@
-import{_ as e,o as a,c as n,ae as o}from"./chunks/framework.C8AWLET_.js";const h=JSON.parse('{"title":"⚑ Quick API Reference (V2)","description":"","frontmatter":{},"headers":[],"relativePath":"api/quick.md","filePath":"api/quick.md"}'),l={name:"api/quick.md"};function d(s,t,r,i,c,g){return a(),n("div",null,[...t[0]||(t[0]=[o("",15)])])}const y=e(l,[["render",d]]);export{h as __pageData,y as default};
diff --git a/docs/assets/api_quick.md.QL5306xO.js b/docs/assets/api_quick.md.QL5306xO.js
new file mode 100644
index 0000000..ede3496
--- /dev/null
+++ b/docs/assets/api_quick.md.QL5306xO.js
@@ -0,0 +1 @@
+import{_ as e,o as a,c as n,ae as l}from"./chunks/framework.C8AWLET_.js";const f=JSON.parse('{"title":"⚑ Quick API Reference","description":"","frontmatter":{},"headers":[],"relativePath":"api/quick.md","filePath":"api/quick.md"}'),o={name:"api/quick.md"};function d(s,t,r,i,c,g){return a(),n("div",null,[...t[0]||(t[0]=[l('
⚑ Quick API Reference ​
SigPro is a high-performance micro-framework that updates the Real DOM surgically. No Virtual DOM, no unnecessary re-renders, and built-in Saneamiento (memory cleanup).
🟒 Core Functions ​
FunctionSignatureDescription
$(val, key?)(any, string?) => SignalCreates a Signal. If key is provided, it persists in localStorage.
$(fn)(function) => ComputedCreates a Computed Signal that auto-updates when its dependencies change.
$.watch(fn)(function) => stopFnAutomatic Mode: Tracks any signal touched inside. Returns a stop function.
$.watch(deps, fn)(Array, function) => stopFnExplicit Mode: Only runs when signals in deps change. Used for Saneamiento.
$.html(tag, props, kids)(string, obj, any) => ElementThe low-level DOM factory. Attaches ._cleanups to every element.
$.If(cond, then, else?)(Signal, fn, fn?) => NodeReactive conditional. Automatically destroys the "else" branch memory.
$.For(list, itemFn)(Signal, fn) => NodeOptimized list renderer. Manages individual item lifecycles.
$.router(routes)(Array) => ElementHash-based SPA router. Uses Explicit Watch to prevent memory leaks.
$.mount(node, target)(any, string|Node) => RuntimeEntry point. Creates a root instance with .destroy() capabilities.
πŸ—οΈ Element Constructors (Tags) ​
SigPro provides PascalCase wrappers for all standard HTML5 tags (e.g., Div, Span, Button).
Syntax Pattern ​
javascript
Tag({ attributes }, [children])
Attribute & Content Handling ​
PatternCode ExampleBehavior
Staticclass: "text-red"Standard HTML attribute string.
Reactivedisabled: isLoadingUpdates automatically via internal $.watch.
Two-way$value: usernameBinding Operator: Syncs input $\\leftrightarrow$ signal both ways.
TextP({}, () => count())Updates text node surgically without re-rendering the P.
Booleanhidden: isHiddenToggles the attribute based on signal truthiness.
',11)])])}const y=e(o,[["render",d]]);export{f as __pageData,y as default};
diff --git a/docs/assets/api_quick.md.QL5306xO.lean.js b/docs/assets/api_quick.md.QL5306xO.lean.js
new file mode 100644
index 0000000..3602d44
--- /dev/null
+++ b/docs/assets/api_quick.md.QL5306xO.lean.js
@@ -0,0 +1 @@
+import{_ as e,o as a,c as n,ae as l}from"./chunks/framework.C8AWLET_.js";const f=JSON.parse('{"title":"⚑ Quick API Reference","description":"","frontmatter":{},"headers":[],"relativePath":"api/quick.md","filePath":"api/quick.md"}'),o={name:"api/quick.md"};function d(s,t,r,i,c,g){return a(),n("div",null,[...t[0]||(t[0]=[l("",11)])])}const y=e(o,[["render",d]]);export{f as __pageData,y as default};
diff --git a/docs/assets/api_tags.md.CW_zjfl9.js b/docs/assets/api_tags.md.DAemWpgh.js
similarity index 69%
rename from docs/assets/api_tags.md.CW_zjfl9.js
rename to docs/assets/api_tags.md.DAemWpgh.js
index 515b5ed..06c28f5 100644
--- a/docs/assets/api_tags.md.CW_zjfl9.js
+++ b/docs/assets/api_tags.md.DAemWpgh.js
@@ -1,11 +1,11 @@
-import{_ as i,o as a,c as t,ae as e}from"./chunks/framework.C8AWLET_.js";const c=JSON.parse('{"title":"🎨 Global Tag Helpers","description":"","frontmatter":{},"headers":[],"relativePath":"api/tags.md","filePath":"api/tags.md"}'),n={name:"api/tags.md"};function l(h,s,o,p,r,d){return a(),t("div",null,[...s[0]||(s[0]=[e(`
🎨 Global Tag Helpers ​
In SigPro V2, you don't need to manually type $.html('div', ...) for every element. To keep your code declarative and readable, the engine automatically generates Global Helper Functions for all standard HTML5 tags upon initialization.
1. How it Works ​
SigPro iterates through a manifest of standard HTML tags and attaches a wrapper function for each one directly to the window object. This creates a specialized DSL (Domain Specific Language) that looks like a template engine but is 100% standard JavaScript.
  • Under the hood: $.html('button', { onclick: ... }, 'Click')
  • SigPro Style: Button({ onclick: ... }, 'Click')
2. The Complete Global Registry ​
The following functions are injected into the global scope (using PascalCase to prevent naming collisions with common JS variables) and are ready to use:
CategoryAvailable Global Functions
StructureDiv, Span, P, Section, Nav, Main, Header, Footer, Article, Aside
TypographyH1 to H6, Ul, Ol, Li, Dl, Dt, Dd, Strong, Em, Code, Pre, Small, B, U, Mark
InteractiveButton, A, Label, Br, Hr, Details, Summary, Dialog
FormsForm, Input, Select, Option, Textarea, Fieldset, Legend
TablesTable, Thead, Tbody, Tr, Th, Td, Tfoot, Caption
MediaImg, Canvas, Video, Audio, Svg, Iframe, Picture, Source
The SigPro Philosophy: Tags are not "magic strings" handled by a compiler. They are functional constructors. Every time you call Div(), you execute a pure JS function that returns a real, reactive DOM element.
3. Usage Patterns (Smart Arguments) ​
SigPro tag helpers are flexible. They automatically detect if you are passing attributes, children, or both.
A. Attributes + Children ​
The standard way to build structured UI.
javascript
Div({ class: 'container', id: 'main' }, [
+import{_ as i,o as a,c as t,ae as e}from"./chunks/framework.C8AWLET_.js";const c=JSON.parse('{"title":"🎨 Global Tag Helpers","description":"","frontmatter":{},"headers":[],"relativePath":"api/tags.md","filePath":"api/tags.md"}'),n={name:"api/tags.md"};function l(h,s,o,p,r,d){return a(),t("div",null,[...s[0]||(s[0]=[e(`
🎨 Global Tag Helpers ​
In SigPro, you don't need to manually type $.html('div', ...) for every element. To keep your code declarative and readable, the engine automatically generates Global Helper Functions for all standard HTML5 tags upon initialization.
1. How it Works ​
SigPro iterates through a manifest of standard HTML tags and attaches a wrapper function for each one directly to the window object. This creates a specialized DSL (Domain Specific Language) that looks like a template engine but is 100% standard JavaScript.
  • Under the hood: $.html('button', { onclick: ... }, 'Click')
  • SigPro Style: Button({ onclick: ... }, 'Click')
2. The Complete Global Registry ​
The following functions are injected into the global scope (using PascalCase to prevent naming collisions with common JS variables) and are ready to use:
CategoryAvailable Global Functions
StructureDiv, Span, P, Section, Nav, Main, Header, Footer, Article, Aside
TypographyH1 to H6, Ul, Ol, Li, Dl, Dt, Dd, Strong, Em, Code, Pre, Small, B, U, Mark
InteractiveButton, A, Label, Br, Hr, Details, Summary, Dialog
FormsForm, Input, Select, Option, Textarea, Fieldset, Legend
TablesTable, Thead, Tbody, Tr, Th, Td, Tfoot, Caption
MediaImg, Canvas, Video, Audio, Svg, Iframe, Picture, Source
The SigPro Philosophy: Tags are not "magic strings" handled by a compiler. They are functional constructors. Every time you call Div(), you execute a pure JS function that returns a real, reactive DOM element.
3. Usage Patterns (Smart Arguments) ​
SigPro tag helpers are flexible. They automatically detect if you are passing attributes, children, or both.
A. Attributes + Children ​
The standard way to build structured UI.
javascript
Div({ class: 'container', id: 'main' }, [
   H1("Welcome to SigPro"),
   P("The zero-VDOM framework.")
 ]);
B. Children Only (The "Skipper") ​
If you don't need attributes, you can skip the object and pass the content (string, array, or function) directly as the first argument.
javascript
Section([
   H2("Clean Syntax"),
   Button("I have no props!")
 ]);
C. Primitive Content ​
For simple tags, just pass a string or a number.
javascript
H1("Hello World"); 
-Span(42);
4. Reactive Power V2 ​
These helpers are natively wired into SigPro's $.watch engine. No manual effect management is needed; the lifecycle is tied to the DOM node.
Reactive Attributes ​
Simply pass a Signal (function) to any attribute. SigPro creates an internal $.watch to keep the DOM in sync.
javascript
const theme = $("light");
+Span(42);
4. Reactive Power ​
These helpers are natively wired into SigPro's $.watch engine. No manual effect management is needed; the lifecycle is tied to the DOM node.
Reactive Attributes ​
Simply pass a Signal (function) to any attribute. SigPro creates an internal $.watch to keep the DOM in sync.
javascript
const theme = $("light");
 
 Div({ 
   // Updates 'class' automatically via internal $.watch
@@ -20,7 +20,7 @@ import{_ as i,o as a,c as t,ae as e}from"./chunks/framework.C8AWLET_.js";const c
 
 Ul({ class: "list-disc" }, [
   $.For(items, (item) => Li(item))
-]);
DANGER
⚠️ Important: Naming Conventions ​
Since SigPro injects these helpers into the global window object, follow these rules to avoid bugs:
  1. Avoid Shadowing: Don't name your local variables like the tags (e.g., const Div = ...). This will "hide" the SigPro helper.
  2. Custom Components: Always use PascalCase for your own component functions (e.g., UserCard, NavMenu) to distinguish them from the built-in Tag Helpers and maintain architectural clarity.
5. Logic to UI Comparison ​
Here is how a dynamic User Status component translates from SigPro logic to the final DOM structure, handled by the V2 "Saneamiento" engine.
javascript
// SigPro Component
+]);
DANGER
⚠️ Important: Naming Conventions ​
Since SigPro injects these helpers into the global window object, follow these rules to avoid bugs:
  1. Avoid Shadowing: Don't name your local variables like the tags (e.g., const Div = ...). This will "hide" the SigPro helper.
  2. Custom Components: Always use PascalCase for your own component functions (e.g., UserCard, NavMenu) to distinguish them from the built-in Tag Helpers and maintain architectural clarity.
5. Logic to UI Comparison ​
Here is how a dynamic User Status component translates from SigPro logic to the final DOM structure, handled by the engine.
javascript
// SigPro Component
 const UserStatus = (name, $online) => (
   Div({ class: 'flex items-center gap-2' }, [
     Span({ 
diff --git a/docs/assets/api_tags.md.CW_zjfl9.lean.js b/docs/assets/api_tags.md.DAemWpgh.lean.js
similarity index 100%
rename from docs/assets/api_tags.md.CW_zjfl9.lean.js
rename to docs/assets/api_tags.md.DAemWpgh.lean.js
diff --git a/docs/assets/api_watch.md.D7sOEzCX.js b/docs/assets/api_watch.md.B4pyArWy.js
similarity index 95%
rename from docs/assets/api_watch.md.D7sOEzCX.js
rename to docs/assets/api_watch.md.B4pyArWy.js
index 3f59a1e..dca927c 100644
--- a/docs/assets/api_watch.md.D7sOEzCX.js
+++ b/docs/assets/api_watch.md.B4pyArWy.js
@@ -1,4 +1,4 @@
-import{_ as i,o as a,c as t,ae as n}from"./chunks/framework.C8AWLET_.js";const o=JSON.parse('{"title":"⚑ Reactivity Control: $.watch( )","description":"","frontmatter":{},"headers":[],"relativePath":"api/watch.md","filePath":"api/watch.md"}'),e={name:"api/watch.md"};function h(l,s,p,k,r,d){return a(),t("div",null,[...s[0]||(s[0]=[n(`
⚑ Reactivity Control: $.watch( ) ​
The $.watch function is the reactive engine of SigPro. It allows you to execute code automatically when signals change. In V2, $.watch is polymorphic: it can track dependencies automatically or follow an explicit list.
πŸ›  Function Signature ​
typescript
// Automatic Mode (Magic Tracking)
+import{_ as i,o as a,c as t,ae as n}from"./chunks/framework.C8AWLET_.js";const o=JSON.parse('{"title":"⚑ Reactivity Control: $.watch( )","description":"","frontmatter":{},"headers":[],"relativePath":"api/watch.md","filePath":"api/watch.md"}'),e={name:"api/watch.md"};function h(l,s,p,k,r,d){return a(),t("div",null,[...s[0]||(s[0]=[n(`
⚑ Reactivity Control: $.watch( ) ​
The $.watch function is the reactive engine of SigPro. It allows you to execute code automatically when signals change. $.watch is polymorphic: it can track dependencies automatically or follow an explicit list.
πŸ›  Function Signature ​
typescript
// Automatic Mode (Magic Tracking)
 $.watch(callback: Function): StopFunction
 
 // Explicit Mode (Isolated Dependencies)
diff --git a/docs/assets/api_watch.md.D7sOEzCX.lean.js b/docs/assets/api_watch.md.B4pyArWy.lean.js
similarity index 100%
rename from docs/assets/api_watch.md.D7sOEzCX.lean.js
rename to docs/assets/api_watch.md.B4pyArWy.lean.js
diff --git a/docs/assets/install.md.D5NkNmWr.js b/docs/assets/install.md.Cel7_1B6.js
similarity index 96%
rename from docs/assets/install.md.D5NkNmWr.js
rename to docs/assets/install.md.Cel7_1B6.js
index 1dc949d..4c669c7 100644
--- a/docs/assets/install.md.D5NkNmWr.js
+++ b/docs/assets/install.md.Cel7_1B6.js
@@ -1,11 +1,11 @@
-import{_ as i,o as a,c as t,ae as n}from"./chunks/framework.C8AWLET_.js";const g=JSON.parse('{"title":"Installation & Setup","description":"","frontmatter":{},"headers":[],"relativePath":"install.md","filePath":"install.md"}'),l={name:"install.md"};function e(h,s,p,k,r,d){return a(),t("div",null,[...s[0]||(s[0]=[n(`
Installation & Setup ​
SigPro is designed to be drop-in ready. Whether you are building a complex application with a bundler or a simple reactive widget in a single HTML file, SigPro scales with your needs.
1. Installation ​
Choose the method that best fits your workflow:
bash
npm install sigpro
bash
pnpm add sigpro
bash
yarn add sigpro
bash
bun add sigpro
html
<script type="module">
+import{_ as i,o as a,c as t,ae as n}from"./chunks/framework.C8AWLET_.js";const g=JSON.parse('{"title":"Installation & Setup","description":"","frontmatter":{},"headers":[],"relativePath":"install.md","filePath":"install.md"}'),l={name:"install.md"};function e(h,s,p,k,r,d){return a(),t("div",null,[...s[0]||(s[0]=[n(`
Installation & Setup ​
SigPro is designed to be drop-in ready. Whether you are building a complex application with a bundler or a simple reactive widget in a single HTML file, SigPro scales with your needs.
1. Installation ​
Choose the method that best fits your workflow:
bash
npm install sigpro
bash
pnpm add sigpro
bash
yarn add sigpro
bash
bun add sigpro
html
<script type="module">
   // Import the core and UI components
   import { $ } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
   import { UI } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/ui/+esm';
   
   // Initialize UI components globally
   UI($);
-</script>
2. Quick Start Examples ​
SigPro uses PascalCase for Tag Helpers (e.g., Div, Button) to provide a clean, component-like syntax without needing JSX.
javascript
// File: App.js
+</script>
2. Quick Start Examples ​
SigPro uses PascalCase for Tag Helpers (e.g., Div, Button) to provide a clean, component-like syntax without needing JSX.
javascript
// File: App.js
 import { $ } from 'sigpro'; 
 
 export const App = () => {
diff --git a/docs/assets/install.md.D5NkNmWr.lean.js b/docs/assets/install.md.Cel7_1B6.lean.js
similarity index 100%
rename from docs/assets/install.md.D5NkNmWr.lean.js
rename to docs/assets/install.md.Cel7_1B6.lean.js
diff --git a/docs/hashmap.json b/docs/hashmap.json
index ea4463f..70c090f 100644
--- a/docs/hashmap.json
+++ b/docs/hashmap.json
@@ -1 +1 @@
-{"api_html.md":"BPbZMZR1","api_mount.md":"BiKjH18I","api_quick.md":"CVAmBRZF","api_router.md":"Cn98LjXO","api_signal.md":"BmorvARW","api_tags.md":"CW_zjfl9","api_watch.md":"D7sOEzCX","index.md":"By6smViD","install.md":"D5NkNmWr","ui_quick.md":"CsppjR8J","vite_plugin.md":"CTs8LDIL"}
+{"api_html.md":"DSCIaSlE","api_mount.md":"BiKjH18I","api_quick.md":"QL5306xO","api_router.md":"Cn98LjXO","api_signal.md":"BmorvARW","api_tags.md":"DAemWpgh","api_watch.md":"B4pyArWy","index.md":"By6smViD","install.md":"Cel7_1B6","ui_quick.md":"CsppjR8J","vite_plugin.md":"CTs8LDIL"}
diff --git a/docs/index.html b/docs/index.html
index 4f0dda8..c5cd6fb 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -20,7 +20,7 @@
   
   
     
SigPro
Appearance
SigProAtomic Unified Reactive Engine
High-precision atomic reactivity. No Virtual DOM. No compiler. No dependencies.
Get Started
View on GitHub
SigPro Logo
βš›οΈ Atomic Reactivity
Powered by fine-grained Signals. Forget about whole-component re-renders; SigPro updates only the specific text node or attribute that changed.
πŸš€ Zero Virtual DOM
By eliminating the V-DOM diffing layer, SigPro performs surgical, direct manipulations on the real DOM, removing memory and CPU overhead.
πŸ› οΈ No Compiler Required
Pure Vanilla JS. No Babel, no JSX, no complex build steps. Standard JavaScript that runs natively in the browser with maximum performance.
πŸ“¦ Ultra-Lightweight
The core engineβ€”including reactivity, DOM creation, persistence, and routingβ€”is under 2KB. Perfect for performance-critical applications.
Redefining Modern Reactivity ​
SigPro is not just another framework; it is a high-performance engine. While other libraries add layers of abstraction that slow down execution, SigPro returns to the essence of the web, leveraging the power of modern browser engines.
Why SigPro? ​
⚑️ Surgical DOM Efficiency ​
Unlike React or Vue, SigPro doesn't compare element trees. When a signal changes, SigPro knows exactly which DOM node depends on it and updates it instantly. It is reactive precision at its finest.
πŸ”Œ Modular Plugin System ​
The core is sacred. Any extra functionalityβ€”Routing, UI Helpers, or State Persistenceβ€”is integrated through a polymorphic plugin system. Load only what your application truly needs.
πŸ’Ύ Native Persistence ​
SigPro features first-class support for localStorage. Synchronizing your application state with persistent storage is as simple as providing a key when initializing your Signal.
🚦 Built-in Hash Routing ​
A robust routing system that supports Native Lazy Loading out of the box. Load your components only when the user navigates to them, keeping initial load times near zero.
The "No-Build" Philosophy ​
In an ecosystem obsessed with compilers, SigPro bets on standardization. Write code today that will still run 10 years from now, without depending on build tools that will eventually become obsolete.
"The best way to optimize code is to not have to process it at all."
Community & Vision ​
SigPro is an open-source project focused on simplicity and extreme speed. Designed for developers who love the web platform and hate unnecessary "bloatware".
text
Built with ❀️ by NatxoCC for the Modern Web.

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/install.html b/docs/install.html
index e26fd68..1bb4651 100644
--- a/docs/install.html
+++ b/docs/install.html
@@ -13,20 +13,20 @@
     
     
     
-    
+    
     
     
     
   
   
-    
SigPro
Appearance
Installation & Setup ​
SigPro is designed to be drop-in ready. Whether you are building a complex application with a bundler or a simple reactive widget in a single HTML file, SigPro scales with your needs.
1. Installation ​
Choose the method that best fits your workflow:
bash
npm install sigpro
bash
pnpm add sigpro
bash
yarn add sigpro
bash
bun add sigpro
html
<script type="module">
+    
SigPro
Appearance
Installation & Setup ​
SigPro is designed to be drop-in ready. Whether you are building a complex application with a bundler or a simple reactive widget in a single HTML file, SigPro scales with your needs.
1. Installation ​
Choose the method that best fits your workflow:
bash
npm install sigpro
bash
pnpm add sigpro
bash
yarn add sigpro
bash
bun add sigpro
html
<script type="module">
   // Import the core and UI components
   import { $ } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
   import { UI } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/ui/+esm';
   
   // Initialize UI components globally
   UI($);
-</script>
2. Quick Start Examples ​
SigPro uses PascalCase for Tag Helpers (e.g., Div, Button) to provide a clean, component-like syntax without needing JSX.
javascript
// File: App.js
+</script>
2. Quick Start Examples ​
SigPro uses PascalCase for Tag Helpers (e.g., Div, Button) to provide a clean, component-like syntax without needing JSX.
javascript
// File: App.js
 import { $ } from 'sigpro'; 
 
 export const App = () => {
@@ -71,7 +71,7 @@
   </script>
 </body>
 </html>
3. Global by Design ​
One of SigPro's core strengths is its Global API, which eliminates "Import Hell".
  • The $ Function: Once loaded, it attaches itself to window.$. It handles state, effects, and DOM mounting.
  • Tag Helpers (PascalCase): Common HTML tags (Div, Span, Button, Input, etc.) are automatically registered in the global scope.
  • Custom Components: We recommend using PascalCase (e.g., UserCard) or prefixes like _Input to keep your code organized and distinguish your logic from standard tags.
4. Why no build step? ​
Because SigPro uses native ES Modules and standard JavaScript functions to generate the DOM, you don't actually need a compiler like Babel or a transformer for JSX.
  • Development: Just save and refresh. Pure JS, no "transpilation" required.
  • Performance: Extremely lightweight. Use any modern bundler (Vite, esbuild) only when you are ready to minify and tree-shake for production.
5. Why SigPro? (The Competitive Edge) ​
SigPro stands out by removing the "Build Step" tax and the "Virtual DOM" overhead. It is the closest you can get to writing raw HTML/JS while maintaining modern reactivity.
FeatureSigProSolidJSSvelteReactVue
Bundle Size~2KB~7KB~4KB~40KB+~30KB
DOM StrategyDirect DOMDirect DOMCompiled DOMVirtual DOMVirtual DOM
ReactivityFine-grainedFine-grainedCompiledRe-rendersProxies
Build StepOptionalRequiredRequiredRequiredOptional
Learning CurveMinimalMediumLowHighMedium
InitializationUltra-FastVery FastFastSlowMedium
6. Key Advantages ​
  • Extreme Performance: No Virtual DOM reconciliation. SigPro updates the specific node or attribute instantly when a Signal changes.
  • Fine-Grained Reactivity: State changes only trigger updates where the data is actually used, not on the entire component.
  • Native Web Standards: Everything is a standard JS function. No custom template syntax to learn.
  • Zero Magic: No hidden compilers. What you write is what runs in the browser.
  • Global by Design: Tag Helpers and the $ function are available globally to eliminate "Import Hell" and keep your code clean.
7. Summary ​
SigPro isn't just another framework; it's a bridge to the native web. By using standard ES Modules and functional DOM generation, you gain the benefits of a modern library with the weight of a utility script.
Because, in the end... why fight the web when we can embrace it?

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/ui/quick.html b/docs/ui/quick.html
index 8ed4388..c3108c0 100644
--- a/docs/ui/quick.html
+++ b/docs/ui/quick.html
@@ -63,7 +63,7 @@
 
 // Access translated strings (Returns a signal that tracks the current locale)
 const t = tt("confirm");
5. Best Practices ​
  • Use $ for Reactivity: If a property starts with $, the component expects a Signal (e.g., $value: mySignal).
  • Automatic Cleaning: You don't need to manually destroy these components if they are inside a $.If or $.For. SigPro's core will "sweep" their internal watchers automatically.
  • Manual Cleanups: If you build custom components using setInterval or third-party observers, always add the stop functions to the element's ._cleanups Set.

-    
+    
     
   
 
\ No newline at end of file
diff --git a/docs/vite/plugin.html b/docs/vite/plugin.html
index c5dd728..ce6afa0 100644
--- a/docs/vite/plugin.html
+++ b/docs/vite/plugin.html
@@ -68,7 +68,7 @@
   { path: '/users/:id', component: () => import('/src/pages/users/[id].js') },
   // ...
 ];
Because it uses dynamic import(), Vite automatically performs Code Splitting, meaning each page is its own small JS file that only loads when the user navigates to it.

-    
+    
     
   
 
\ No newline at end of file
diff --git a/src/docs/api/html.md b/src/docs/api/html.md
index fa0c110..7f42b79 100644
--- a/src/docs/api/html.md
+++ b/src/docs/api/html.md
@@ -1,6 +1,6 @@
 # πŸ—οΈ The DOM Factory: `$.html( )`
 
-`$.html` is the internal engine that creates, attributes, and attaches reactivity to DOM elements. In V2, it uses `$.watch` to maintain a live, high-performance link between your Signals and the Document Object Model.
+`$.html` is the internal engine that creates, attributes, and attaches reactivity to DOM elements. It uses `$.watch` to maintain a live, high-performance link between your Signals and the Document Object Model.
 
 ## πŸ›  Function Signature
 
diff --git a/src/docs/api/quick.md b/src/docs/api/quick.md
index 9fedfa7..3718f85 100644
--- a/src/docs/api/quick.md
+++ b/src/docs/api/quick.md
@@ -1,4 +1,4 @@
-# ⚑ Quick API Reference (V2)
+# ⚑ Quick API Reference
 
 SigPro is a high-performance micro-framework that updates the **Real DOM** surgically. No Virtual DOM, no unnecessary re-renders, and built-in **Saneamiento** (memory cleanup).
 
@@ -36,14 +36,3 @@ Tag({ attributes }, [children])
 | **Two-way** | `$value: username` | **Binding Operator**: Syncs input $\leftrightarrow$ signal both ways. |
 | **Text** | `P({}, () => count())` | Updates text node surgically without re-rendering the `P`. |
 | **Boolean** | `hidden: isHidden` | Toggles the attribute based on signal truthiness. |
-
----
-
-## 🧹 Saneamiento (Memory Management)
-
-In SigPro V2, you rarely need to clean up manually, but the tools are there if you build custom components:
-
-* **Automatic**: Anything inside `$.If`, `$.For`, or `$.router` is "swept" when it disappears.
-* **Manual**: Use `instance.destroy()` for apps or `$.cleanup(el)` for manual DOM injections.
-* **Internal**: Every element carries a `._cleanups` Set with its own reactive "kill-switches".
-
diff --git a/src/docs/api/tags.md b/src/docs/api/tags.md
index aad20d3..1d98698 100644
--- a/src/docs/api/tags.md
+++ b/src/docs/api/tags.md
@@ -1,6 +1,6 @@
 # 🎨 Global Tag Helpers
 
-In **SigPro V2**, you don't need to manually type `$.html('div', ...)` for every element. To keep your code declarative and readable, the engine automatically generates **Global Helper Functions** for all standard HTML5 tags upon initialization.
+In **SigPro**, you don't need to manually type `$.html('div', ...)` for every element. To keep your code declarative and readable, the engine automatically generates **Global Helper Functions** for all standard HTML5 tags upon initialization.
 
 ## 1. How it Works
 
@@ -59,7 +59,7 @@ Span(42);
 
 ---
 
-## 4. Reactive Power V2
+## 4. Reactive Power
 
 These helpers are natively wired into SigPro's **`$.watch`** engine. No manual effect management is needed; the lifecycle is tied to the DOM node.
 
@@ -109,7 +109,7 @@ Since SigPro injects these helpers into the global `window` object, follow these
 
 ## 5. Logic to UI Comparison
 
-Here is how a dynamic **User Status** component translates from SigPro logic to the final DOM structure, handled by the V2 "Saneamiento" engine.
+Here is how a dynamic **User Status** component translates from SigPro logic to the final DOM structure, handled by the engine.
 
 ```javascript
 // SigPro Component
diff --git a/src/docs/api/watch.md b/src/docs/api/watch.md
index 62b4a8e..02fcc56 100644
--- a/src/docs/api/watch.md
+++ b/src/docs/api/watch.md
@@ -1,6 +1,6 @@
 # ⚑ Reactivity Control: `$.watch( )`
 
-The `$.watch` function is the reactive engine of SigPro. It allows you to execute code automatically when signals change. In V2, `$.watch` is **polymorphic**: it can track dependencies automatically or follow an explicit list.
+The `$.watch` function is the reactive engine of SigPro. It allows you to execute code automatically when signals change. `$.watch` is **polymorphic**: it can track dependencies automatically or follow an explicit list.
 
 ## πŸ›  Function Signature