Update to UMD

docs/components/button.md

@@ -26,17 +26,6 @@ Styled button with full DaisyUI support and reactive states.
 
 <div id="demo-basic"></div>
 
-<script type="module">
-  import { $mount } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
-  import { Button } from 'https://cdn.jsdelivr.net/npm/sigpro-ui@latest/+esm';
-
-  const Demo = () => {
-    return Button({ class: "btn-primary" }, "Click Me");
-  };
-
-  $mount(Demo, "#demo-basic");
-</script>
-
 ```javascript
 Button({ class: "btn-primary" }, "Click Me")
 ```
@@ -45,27 +34,6 @@ Button({ class: "btn-primary" }, "Click Me")
 
 <div id="demo-loading"></div>
 
-<script type="module">
-  import { $, $mount } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
-  import { Button } from '../../sigpro-ui/sigpro-ui.js';
-
-  const isSaving = $(false);
-
-  const Demo = () => {
-    return Button({
-      class: "btn-success",
-      loading: isSaving,
-      onclick: async () => {
-        isSaving(true);
-        await new Promise(resolve => setTimeout(resolve, 2000));
-        isSaving(false);
-      }
-    }, "Save Changes");
-  };
-
-  $mount(Demo, "#demo-loading");
-</script>
-
 ```javascript
 const isSaving = $(false);
 
@@ -84,21 +52,6 @@ Button({
 
 <div id="demo-badge"></div>
 
-<script type="module">
-  import { $mount } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
-  import { Button } from 'https://cdn.jsdelivr.net/npm/sigpro-ui@latest/+esm';
-
-  const Demo = () => {
-    return Button({
-      class: "btn-outline",
-      badge: "3",
-      badgeClass: "badge-accent"
-    }, "Notifications");
-  };
-
-  $mount(Demo, "#demo-badge");
-</script>
-
 ```javascript
 Button({
   class: "btn-outline",
@@ -111,20 +64,6 @@ Button({
 
 <div id="demo-tooltip"></div>
 
-<script type="module">
-  import { $mount } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
-  import { Button } from 'https://cdn.jsdelivr.net/npm/sigpro-ui@latest/+esm';
-
-  const Demo = () => {
-    return Button({
-      class: "btn-ghost",
-      tooltip: "Delete item"
-    }, "Delete");
-  };
-
-  $mount(Demo, "#demo-tooltip");
-</script>
-
 ```javascript
 Button({
   class: "btn-ghost",
@@ -136,22 +75,6 @@ Button({
 
 <div id="demo-disabled"></div>
 
-<script type="module">
-  import { $, $mount } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
-  import { Button } from 'https://cdn.jsdelivr.net/npm/sigpro-ui@latest/+esm';
-
-  const isDisabled = $(true);
-
-  const Demo = () => {
-    return Button({
-      class: "btn-primary",
-      disabled: isDisabled
-    }, "Submit");
-  };
-
-  $mount(Demo, "#demo-disabled");
-</script>
-
 ```javascript
 const isDisabled = $(true);
 
@@ -165,29 +88,6 @@ Button({
 
 <div id="demo-variants"></div>
 
-<script type="module">
-  import { $, $mount } from 'https://cdn.jsdelivr.net/npm/sigpro@latest/+esm';
-  import { Button, Div } from 'https://cdn.jsdelivr.net/npm/sigpro-ui@latest/+esm';
-
-  const isLoading = $(false);
-
-  const Demo = () => {
-    return Div({ class: "flex flex-wrap gap-2" }, [
-      Button({ class: "btn-primary" }, "Primary"),
-      Button({ class: "btn-secondary" }, "Secondary"),
-      Button({ class: "btn-accent" }, "Accent"),
-      Button({ class: "btn-ghost" }, "Ghost"),
-      Button({ class: "btn-outline" }, "Outline"),
-      Button({ class: "btn-success", loading: isLoading, onclick: () => {
-        isLoading(true);
-        setTimeout(() => isLoading(false), 1500);
-      } }, "Loading")
-    ]);
-  };
-
-  $mount(Demo, "#demo-variants");
-</script>
-
 ```javascript
 Div({ class: "flex flex-wrap gap-2" }, [
   Button({ class: "btn-primary" }, "Primary"),
@@ -198,24 +98,3 @@ Div({ class: "flex flex-wrap gap-2" }, [
 ])
 ```
 ```
-
-## Ventajas de este enfoque:
-
-1. **Ejecución real** - Los ejemplos son interactivos y funcionales
-2. **Código visible** - Debajo de cada ejemplo se muestra el código fuente
-3. **Aprendizaje visual** - Los usuarios pueden ver y probar los componentes
-4. **Reactivo** - Los ejemplos con signals demuestran la reactividad en acción
-
-## Consejos adicionales:
-
-Para mejorar la experiencia, podrías agregar estilos a los contenedores de los ejemplos:
-
-```css
-/* En tu HTML, dentro de <style> */
-.demo-container {
-  margin: 1rem 0;
-  padding: 1rem;
-  border: 1px solid #e2e8f0;
-  border-radius: 0.5rem;
-  background: #f8fafc;
-}