changed to new functions

components/datepicker.js

@@ -1,5 +1,5 @@
 // components/Datepicker.js
-import { $, Tag, If, Watch } from "sigpro";
+import { $, h, when, watch } from "sigpro";
 import { Calendar } from "./calendar.js";
 
 export const Datepicker = (props) => {
@@ -11,7 +11,7 @@ export const Datepicker = (props) => {
   
   const displayValue = $("");
   
-  Watch(() => {
+  watch(() => {
     const v = typeof props.value === "function" ? props.value() : props.value;
     if (!v) {
       displayValue("");
@@ -49,10 +49,10 @@ export const Datepicker = (props) => {
     isOpen(!isOpen());
   };
   
-  return Tag("div", { class: `relative w-full ${props.class ?? ''}` }, [
-    Tag("label", { class: "input input-bordered w-full", onclick: toggleOpen }, [
-      Tag("span", { class: "icon-[lucide--calendar]" }),
-      Tag("input", {
+  return h("div", { class: `relative w-full ${props.class ?? ''}` }, [
+    h("label", { class: "input input-bordered w-full", onclick: toggleOpen }, [
+      h("span", { class: "icon-[lucide--calendar]" }),
+      h("input", {
         ...props,
         type: "text",
         class: "grow",
@@ -62,8 +62,8 @@ export const Datepicker = (props) => {
       })
     ]),
     
-    If(isOpen, () =>
-      Tag("div", {
+    when(isOpen, () =>
+      h("div", {
         class: "absolute left-0 mt-2 z-[100]",
         onclick: (e) => e.stopPropagation()
       }, [
@@ -76,8 +76,8 @@ 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) })
     )
   ]);
 };