changed to new functions

src/components/Datepicker.js

@@ -1,4 +1,4 @@
-import { $, Tag, If, Watch } from "sigpro";
+import { $, h, when, watch } from "sigpro";
 import { val, ui, getIcon } from "../utils.js";
 import { Input } from "./Input.js";
 import { Calendar } from "./Calendar.js";
@@ -12,7 +12,7 @@ export const Datepicker = (props) => {
   // Formatear el valor para mostrarlo en el input
   const displayValue = $("");
   
-  Watch(() => {
+  watch(() => {
     const v = val(value);
     if (!v) {
       displayValue("");
@@ -42,7 +42,7 @@ export const Datepicker = (props) => {
     }
   };
   
-  return Tag("div", { class: ui('relative w-full', className) }, [
+  return h("div", { class: ui('relative w-full', className) }, [
     Input({
       label,
       placeholder: placeholder || (isRangeMode() ? "Seleccionar rango..." : "Seleccionar fecha..."),
@@ -56,8 +56,8 @@ export const Datepicker = (props) => {
       ...rest,
     }),
     
-    If(isOpen, () =>
-      Tag("div", {
+    when(isOpen, () =>
+      h("div", {
         class: "absolute left-0 mt-2 z-[100]",
         onclick: (e) => e.stopPropagation(),
       }, [
@@ -70,6 +70,6 @@ export const Datepicker = (props) => {
       ])
     ),
     
-    If(isOpen, () => Tag("div", { class: "fixed inset-0 z-[90]", onclick: () => isOpen(false) })),
+    when(isOpen, () => h("div", { class: "fixed inset-0 z-[90]", onclick: () => isOpen(false) })),
   ]);
 };