diff --git a/docs/components/button.md b/docs/components/button.md
index 84df933..0b9b17a 100644
--- a/docs/components/button.md
+++ b/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;
-}
diff --git a/docs/index.html b/docs/index.html
index 9e13b11..b48366e 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -39,13 +39,8 @@
       };
     </script>
 
-    <script type="module">
-      import * as sigpro from "https://cdn.jsdelivr.net/npm/sigpro@latest/+esm";
-      import { UI } from "https://cdn.jsdelivr.net/npm/sigpro-ui@latest/+esm";
-      window.sigpro = sigpro;
-      // const ui = UI("en");
-      // window.sigproui = ui;
-    </script>
+    <script src="https://unpkg.com/sigpro"> </script>
+    <script src="https://unpkg.com/sigpro-ui"> </script>
     <script src="//cdn.jsdelivr.net/npm/docsify/lib/docsify.min.js"></script>
     <script src="//cdn.jsdelivr.net/npm/docsify-copy-code/dist/docsify-copy-code.min.js"></script>
   </body>
diff --git a/package.json b/package.json
index 36d8f1e..048d2cd 100644
--- a/package.json
+++ b/package.json
@@ -27,7 +27,7 @@
   },
   "scripts": {
     "docs": "bun x serve docs",
-    "build": "bun build ./index.js --bundle --external sigpro --outfile=./dist/sigpro-ui.js --format=iife --global-name=SigProUI && bun build ./index.js --bundle --external sigpro --outfile=./dist/sigpro-ui.min.js --format=iife --global-name=SigProUI --minify",
+    "build": "bun build ./index.js --bundle --external sigpro --outfile=./dist/sigpro-ui.js --format=umd --global-name=SigProUI --globals=sigpro=SigProCore && bun build ./index.js --bundle --external sigpro --outfile=./dist/sigpro-ui.min.js --format=umd --global-name=SigProUI --globals=sigpro=SigProCore --minify",
     "prepublishOnly": "npm run build"
   },
   "peerDependencies": {