Solucionados AutoComplete y DatePicker con la nueva SigPro

dist/sigpro-ui.esm.js

@@ -821,10 +821,12 @@ var Autocomplete = (props) => {
   const query = $(val(value) || "");
   const isOpen = $(false);
   const cursor = $(-1);
-  const list = $(() => {
-    const q = query().toLowerCase();
+  const list = $([]);
+  Watch(() => {
+    const q = String(query()).toLowerCase();
     const data = val(items) || [];
-    return q ? data.filter((o) => (typeof o === "string" ? o : o.label).toLowerCase().includes(q)) : data;
+    const filtered = q ? data.filter((o) => (typeof o === "string" ? o : o.label).toLowerCase().includes(q)) : data;
+    list(filtered);
   });
   const pick = (opt) => {
     const valStr = typeof opt === "string" ? opt : opt.value;
@@ -837,17 +839,17 @@ var Autocomplete = (props) => {
     cursor(-1);
   };
   const nav = (e) => {
-    const items2 = list();
+    const currentItems = list();
     if (e.key === "ArrowDown") {
       e.preventDefault();
       isOpen(true);
-      cursor(Math.min(cursor() + 1, items2.length - 1));
+      cursor(Math.min(cursor() + 1, currentItems.length - 1));
     } else if (e.key === "ArrowUp") {
       e.preventDefault();
       cursor(Math.max(cursor() - 1, 0));
     } else if (e.key === "Enter" && cursor() >= 0) {
       e.preventDefault();
-      pick(items2[cursor()]);
+      pick(currentItems[cursor()]);
     } else if (e.key === "Escape") {
       isOpen(false);
     }
@@ -1051,25 +1053,25 @@ var Datepicker = (props) => {
       isOpen(false);
     }
   };
-  const displayValue = $(() => {
+  const displayValue = $("");
+  Watch(() => {
     const v = val(value);
-    if (!v)
-      return "";
+    if (!v) {
+      displayValue("");
+      return;
+    }
+    let text = "";
     if (typeof v === "string") {
-      if (hour && v.includes("T"))
-        return v.replace("T", " ");
-      return v;
+      text = hour && v.includes("T") ? v.replace("T", " ") : v;
+    } else if (v.start && v.end) {
+      const startStr = hour && v.startHour !== undefined ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start;
+      const endStr = hour && v.endHour !== undefined ? `${v.end} ${String(v.endHour).padStart(2, "0")}:00` : v.end;
+      text = `${startStr} - ${endStr}`;
+    } else if (v.start) {
+      const startStr = hour && v.startHour !== undefined ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start;
+      text = `${startStr}...`;
     }
-    if (v.start && v.end) {
-      const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start;
-      const endStr = hour && v.endHour ? `${v.end} ${String(v.endHour).padStart(2, "0")}:00` : v.end;
-      return `${startStr} - ${endStr}`;
-    }
-    if (v.start) {
-      const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start;
-      return `${startStr}...`;
-    }
-    return "";
+    displayValue(text);
   });
   const move = (m) => {
     const d = internalDate();
@@ -1198,7 +1200,7 @@ var Datepicker = (props) => {
           onChange: (newHour) => {
             startHour(newHour);
             const currentVal = val(value);
-            if (currentVal && typeof currentVal === "string" && currentVal.includes("-")) {
+            if (currentVal && typeof currentVal === "string") {
               value(currentVal.split("T")[0] + "T" + String(newHour).padStart(2, "0") + ":00:00");
             }
           }

dist/sigpro-ui.js

@@ -887,10 +887,12 @@
     const query = $(val(value) || "");
     const isOpen = $(false);
     const cursor = $(-1);
-    const list = $(() => {
-      const q = query().toLowerCase();
+    const list = $([]);
+    Watch(() => {
+      const q = String(query()).toLowerCase();
       const data = val(items) || [];
-      return q ? data.filter((o) => (typeof o === "string" ? o : o.label).toLowerCase().includes(q)) : data;
+      const filtered = q ? data.filter((o) => (typeof o === "string" ? o : o.label).toLowerCase().includes(q)) : data;
+      list(filtered);
     });
     const pick = (opt) => {
       const valStr = typeof opt === "string" ? opt : opt.value;
@@ -903,17 +905,17 @@
       cursor(-1);
     };
     const nav = (e) => {
-      const items2 = list();
+      const currentItems = list();
       if (e.key === "ArrowDown") {
         e.preventDefault();
         isOpen(true);
-        cursor(Math.min(cursor() + 1, items2.length - 1));
+        cursor(Math.min(cursor() + 1, currentItems.length - 1));
       } else if (e.key === "ArrowUp") {
         e.preventDefault();
         cursor(Math.max(cursor() - 1, 0));
       } else if (e.key === "Enter" && cursor() >= 0) {
         e.preventDefault();
-        pick(items2[cursor()]);
+        pick(currentItems[cursor()]);
       } else if (e.key === "Escape") {
         isOpen(false);
       }
@@ -1117,25 +1119,25 @@
         isOpen(false);
       }
     };
-    const displayValue = $(() => {
+    const displayValue = $("");
+    Watch(() => {
       const v = val(value);
-      if (!v)
-        return "";
+      if (!v) {
+        displayValue("");
+        return;
+      }
+      let text = "";
       if (typeof v === "string") {
-        if (hour && v.includes("T"))
-          return v.replace("T", " ");
-        return v;
+        text = hour && v.includes("T") ? v.replace("T", " ") : v;
+      } else if (v.start && v.end) {
+        const startStr = hour && v.startHour !== undefined ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start;
+        const endStr = hour && v.endHour !== undefined ? `${v.end} ${String(v.endHour).padStart(2, "0")}:00` : v.end;
+        text = `${startStr} - ${endStr}`;
+      } else if (v.start) {
+        const startStr = hour && v.startHour !== undefined ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start;
+        text = `${startStr}...`;
       }
-      if (v.start && v.end) {
-        const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start;
-        const endStr = hour && v.endHour ? `${v.end} ${String(v.endHour).padStart(2, "0")}:00` : v.end;
-        return `${startStr} - ${endStr}`;
-      }
-      if (v.start) {
-        const startStr = hour && v.startHour ? `${v.start} ${String(v.startHour).padStart(2, "0")}:00` : v.start;
-        return `${startStr}...`;
-      }
-      return "";
+      displayValue(text);
     });
     const move = (m) => {
       const d = internalDate();
@@ -1264,7 +1266,7 @@
             onChange: (newHour) => {
               startHour(newHour);
               const currentVal = val(value);
-              if (currentVal && typeof currentVal === "string" && currentVal.includes("-")) {
+              if (currentVal && typeof currentVal === "string") {
                 value(currentVal.split("T")[0] + "T" + String(newHour).padStart(2, "0") + ":00:00");
               }
             }