change utils location

src/components/Accordion.js

@@ -1,6 +1,6 @@
 // components/Accordion.js
 import { Tag } from "sigpro";
-import { ui, val } from "../core/utils.js";
+import { ui, val } from "../utils.js";
 
 /**
  * Accordion component

src/components/Alert.js

@@ -1,6 +1,6 @@
 // components/Alert.js
 import { Tag } from "sigpro";
-import { ui, getIcon } from "../core/utils.js";
+import { ui, getIcon } from "../utils.js";
 
 /**
  * Alert component

src/components/Autocomplete.js

@@ -1,6 +1,6 @@
 // components/Autocomplete.js
 import { $, Tag, For } from "sigpro";
-import { val } from "../core/utils.js";
+import { val } from "../utils.js";
 import { Input } from "./Input.js";
 
 /**

src/components/Badge.js

@@ -1,6 +1,6 @@
 // components/Badge.js
 import { Tag } from "sigpro";
-import { ui } from "../core/utils.js";
+import { ui } from "../utils.js";
 
 /**
  * Badge component

src/components/Button.js

@@ -1,6 +1,6 @@
 // components/Button.js
 import { Tag } from "sigpro";
-import { ui, val, getIcon } from "../core/utils.js";
+import { ui, val, getIcon } from "../utils.js";
 
 /**
  * Button component

src/components/Checkbox.js

@@ -1,6 +1,6 @@
 // components/Checkbox.js
 import { Tag } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Checkbox component

src/components/Colorpicker.js

@@ -1,6 +1,6 @@
 // components/Colorpicker.js
 import { $, Tag, If } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Colorpicker component

src/components/Datepicker.js

@@ -1,6 +1,6 @@
 // components/Datepicker.js
 import { $, Tag, If } from "sigpro";
-import { val, ui, getIcon } from "../core/utils.js";
+import { val, ui, getIcon } from "../utils.js";
 import { Input } from "./Input.js";
 
 /**
@@ -69,7 +69,6 @@ export const Datepicker = (props) => {
     }
   };
 
-  // FIX CRÍTICO: Señal manual y Watch para displayValue
   const displayValue = $("");
 
   Watch(() => {
@@ -110,7 +109,7 @@ export const Datepicker = (props) => {
           type: "range",
           min: 0,
           max: 23,
-          value: hVal, // Sincronizado con hVal
+          value: hVal,
           class: "range range-xs flex-1",
           oninput: (e) => {
             const newHour = parseInt(e.target.value);
@@ -128,7 +127,7 @@ export const Datepicker = (props) => {
     Input({
       label,
       placeholder: placeholder || (isRangeMode() ? "Seleccionar rango..." : "Seleccionar fecha..."),
-      value: displayValue, // Ahora es una señal que actualizamos manualmente
+      value: displayValue,
       readonly: true,
       icon: getIcon("icon-[lucide--calendar]"),
       onclick: (e) => {

src/components/Drawer.js

@@ -1,6 +1,6 @@
 // components/Drawer.js
 import { Tag } from "sigpro";
-import { ui } from "../core/utils.js";
+import { ui } from "../utils.js";
 
 /**
  * Drawer component

src/components/Dropdown.js

@@ -1,6 +1,6 @@
 // components/Dropdown.js
 import { Tag, For, Watch } from "sigpro";
-import { ui } from "../core/utils.js";
+import { ui } from "../utils.js";
 
 /**
  * Dropdown component - Solo soporta menús (items)

src/components/Fab.js

@@ -1,6 +1,6 @@
 // components/Fab.js
 import { Tag } from "sigpro";
-import { val, ui, getIcon } from "../core/utils.js";
+import { val, ui, getIcon } from "../utils.js";
 
 /**
  * Fab (Floating Action Button) component

src/components/Fieldset.js

@@ -1,6 +1,6 @@
 // components/Fieldset.js
 import { Tag } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Fieldset component

src/components/Fileinput.js

@@ -1,6 +1,6 @@
 // components/Fileinput.js
 import { $, Tag, If, For } from "sigpro";
-import { ui, getIcon } from "../core/utils.js";
+import { ui, getIcon } from "../utils.js";
 
 /**
  * Fileinput component

src/components/Icon.js

@@ -0,0 +1,7 @@
+// components/Icon.js
+import { Tag } from "sigpro";
+
+export const Icon = (iconClass) => {
+  if (!iconClass) return null;
+  return Tag("span", { class: iconClass });
+};

src/components/Indicator.js

@@ -1,6 +1,6 @@
 // components/Indicator.js
 import { Tag } from "sigpro";
-import { ui } from "../core/utils.js";
+import { ui } from "../utils.js";
 
 /**
  * Indicator component

src/components/Input.js

@@ -1,6 +1,6 @@
 // components/Input.js
 import { Tag } from "sigpro";
-import { val, ui, getIcon } from "../core/utils.js";
+import { val, ui, getIcon } from "../utils.js";
 
 /**
  * Input component - Input con ícono integrado, toggle password, validación y floating label opcional

src/components/Label.js

@@ -1,6 +1,6 @@
 // components/Label.js
 import { Tag } from "sigpro";
-import { ui, val } from "../core/utils.js";
+import { ui, val } from "../utils.js";
 
 export const Label = (props) => {
   const { children, value, floating = false, class: className, ...rest } = props;

src/components/List.js

@@ -1,6 +1,6 @@
 // components/List.js
 import { Tag, If, For } from "sigpro";
-import { ui, val } from "../core/utils.js";
+import { ui, val } from "../utils.js";
 
 /**
  * List component

src/components/Menu.js

@@ -1,6 +1,6 @@
 // components/Menu.js
 import { Tag, For } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Menu component

src/components/Modal.js

@@ -1,6 +1,6 @@
 // components/Modal.js
 import { Tag, Watch } from "sigpro";
-import { ui } from "../core/utils.js";
+import { ui } from "../utils.js";
 import { Button } from "./Button.js";
 
 /**

src/components/Navbar.js

@@ -1,6 +1,6 @@
 // components/Navbar.js
 import { Tag } from "sigpro";
-import { ui } from "../core/utils.js";
+import { ui } from "../utils.js";
 
 /**
  * Navbar component

src/components/Radio.js

@@ -1,6 +1,6 @@
 // components/Radio.js
 import { Tag } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Radio component

src/components/Range.js

@@ -1,6 +1,6 @@
 // components/Range.js
 import { Tag } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Range component

src/components/Rating.js

@@ -1,6 +1,6 @@
 // components/Rating.js
 import { Tag } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Rating component

src/components/Select.js

@@ -1,6 +1,6 @@
 // components/Select.js
 import { Tag, For } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Select component

src/components/Stack.js

@@ -1,6 +1,6 @@
 // components/Stack.js
 import { Tag } from "sigpro";
-import { ui } from "../core/utils.js";
+import { ui } from "../utils.js";
 
 /**
  * Stack component

src/components/Stat.js

@@ -1,6 +1,6 @@
 // components/Stat.js
 import { Tag } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Stat component

src/components/Swap.js

@@ -1,6 +1,6 @@
 // components/Swap.js
 import { Tag } from "sigpro";
-import { ui, val } from "../core/utils.js";
+import { ui, val } from "../utils.js";
 
 /**
  * Swap component
@@ -15,7 +15,7 @@ export const Swap = (props) => {
   return Tag("label", { ...rest, class: ui('swap', className) }, [
     Tag("input", {
       type: "checkbox",
-      checked: () => val(value),  // ← FUNCIÓN: se reevalúa cuando la señal cambia
+      checked: () => val(value),
       onclick: (e) => {
         if (typeof value === "function") {
           value(e.target.checked);

src/components/Table.js

@@ -1,6 +1,6 @@
 // components/Table.js
 import { Tag, For, If } from "sigpro";
-import { val, ui } from "../core/utils.js";
+import { val, ui } from "../utils.js";
 
 /**
  * Table component

src/components/Tabs.js

@@ -1,6 +1,6 @@
 // components/Tabs.js
 import { $, Tag, Watch } from "sigpro";
-import { val, ui, getIcon } from "..//core/utils.js";
+import { val, ui, getIcon } from "../utils.js";
 
 /**
  * Tabs component

src/components/Timeline.js

@@ -1,6 +1,6 @@
 // components/Timeline.js
 import { Tag } from "sigpro";
-import { val, ui, getIcon } from "../core/utils.js";
+import { val, ui, getIcon } from "../utils.js";
 
 /**
  * Timeline component

src/components/Toast.js

@@ -1,6 +1,6 @@
 // components/Toast.js
 import { Tag, Mount } from "sigpro";
-import { getIcon } from "../core/utils.js";
+import { getIcon } from "../utils.js";
 import { Button } from "./Button.js";
 
 /**

src/components/Tooltip.js

@@ -1,6 +1,6 @@
 // components/Tooltip.js
 import { Tag } from "sigpro";
-import { ui } from "../core/utils.js";
+import { ui } from "../utils.js";
 
 /**
  * Tooltip component