myio-js-library 0.1.189 → 0.1.190

package/dist/index.cjs

@@ -24307,6 +24307,9 @@ var ANNOTATIONS_STYLES = `
   transition: all 0.2s ease;
   font-weight: 600;
   font-size: 13px;
+  position: relative;
+  z-index: 10;
+  pointer-events: auto;
 }
 
 .annotations-create-btn:hover {
@@ -24314,15 +24317,22 @@ var ANNOTATIONS_STYLES = `
   box-shadow: 0 6px 20px rgba(108, 92, 231, 0.4);
 }
 
+.annotations-create-btn:active {
+  transform: translateY(0);
+  box-shadow: 0 2px 8px rgba(108, 92, 231, 0.3);
+}
+
 .annotations-create-btn__icon {
   font-size: 28px;
   line-height: 1;
+  pointer-events: none;
 }
 
 .annotations-create-btn__text {
   font-size: 11px;
   text-transform: uppercase;
   letter-spacing: 0.5px;
+  pointer-events: none;
 }
 
 /* New Annotation Modal Overlay */
@@ -25651,18 +25661,29 @@ var AnnotationsTab = class {
   }
   isOverdue(annotation) {
     if (!annotation.dueDate || annotation.status === "archived") return false;
-    return new Date(annotation.dueDate) < /* @__PURE__ */ new Date();
+    try {
+      const dueDate = new Date(annotation.dueDate);
+      if (isNaN(dueDate.getTime())) return false;
+      return dueDate < /* @__PURE__ */ new Date();
+    } catch (e) {
+      return false;
+    }
   }
   formatDate(isoString) {
     if (!isoString) return "-";
-    const date = new Date(isoString);
-    return date.toLocaleDateString("pt-BR", {
-      day: "2-digit",
-      month: "2-digit",
-      year: "numeric",
-      hour: "2-digit",
-      minute: "2-digit"
-    });
+    try {
+      const date = new Date(isoString);
+      if (isNaN(date.getTime())) return "-";
+      return date.toLocaleDateString("pt-BR", {
+        day: "2-digit",
+        month: "2-digit",
+        year: "numeric",
+        hour: "2-digit",
+        minute: "2-digit"
+      });
+    } catch (e) {
+      return "-";
+    }
   }
   renderCard(annotation) {
     const canModify = canModifyAnnotation(annotation, this.permissions);
@@ -25723,7 +25744,7 @@ var AnnotationsTab = class {
     const typeColor = ANNOTATION_TYPE_COLORS[annotation.type];
     const importanceColor = IMPORTANCE_COLORS[annotation.importance];
     const statusColor = STATUS_COLORS[annotation.status];
-    const date = new Date(annotation.createdAt).toLocaleString("pt-BR");
+    const date = this.formatDate(annotation.createdAt);
     const truncatedText = annotation.text.length > 50 ? annotation.text.substring(0, 50) + "..." : annotation.text;
     return `
       <div class="annotation-row ${annotation.status === "archived" ? "annotation-row--archived" : ""}" data-id="${annotation.id}">
@@ -25785,9 +25806,13 @@ var AnnotationsTab = class {
   // ============================================
   attachEventListeners() {
     const openModalBtn = this.container.querySelector("#open-new-annotation-modal");
-    openModalBtn?.addEventListener("click", () => {
-      this.showNewAnnotationModal();
-    });
+    if (openModalBtn) {
+      openModalBtn.onclick = () => {
+        this.showNewAnnotationModal();
+      };
+    } else {
+      console.warn("[AnnotationsTab] Create button not found");
+    }
     this.setupMultiselectDropdown("filter-status", (values) => {
       if (values.includes("all") || values.length === 0) {
         this.filters.statusList = void 0;
@@ -26025,16 +26050,14 @@ var AnnotationsTab = class {
             </div>
           </div>
 
-          <!-- Due Date Range -->
+          <!-- Due Date -->
           <div class="annotations-form__field" style="margin-bottom: 16px;">
             <label class="annotations-form__label">Data Limite (opcional)</label>
             <input
-              type="text"
+              type="datetime-local"
               class="annotations-form__input"
               id="new-annotation-due-date"
-              placeholder="Selecione a data limite..."
-              readonly
-              style="cursor: pointer;"
+              style="cursor: text;"
             >
           </div>
         </div>
@@ -26083,24 +26106,6 @@ var AnnotationsTab = class {
       });
     }
     const dueDateInput = overlay.querySelector("#new-annotation-due-date");
-    if (dueDateInput) {
-      try {
-        this.modalDateRangePicker = await createDateRangePicker2(dueDateInput, {
-          includeTime: true,
-          timePrecision: "minute",
-          locale: "pt-BR",
-          parentEl: overlay.querySelector(".annotations-modal"),
-          onApply: (result) => {
-            dueDateInput.setAttribute("data-due-date", result.startISO);
-          }
-        });
-      } catch (error) {
-        console.warn("[AnnotationsTab] Modal DateRangePicker initialization failed:", error);
-        dueDateInput.type = "datetime-local";
-        dueDateInput.removeAttribute("readonly");
-        dueDateInput.style.cursor = "text";
-      }
-    }
     const closeModal = () => {
       this.modalDateRangePicker?.destroy?.();
       this.modalDateRangePicker = null;
@@ -26118,11 +26123,15 @@ var AnnotationsTab = class {
       const selectedImportance = overlay.querySelector(".importance-option.selected");
       const importance = parseInt(selectedImportance?.dataset.importance || "3");
       let dueDate;
-      const storedDueDate = dueDateInput?.getAttribute("data-due-date");
-      if (storedDueDate) {
-        dueDate = storedDueDate;
-      } else if (dueDateInput?.value) {
-        dueDate = new Date(dueDateInput.value).toISOString();
+      if (dueDateInput?.value) {
+        try {
+          const dateValue = new Date(dueDateInput.value);
+          if (!isNaN(dateValue.getTime())) {
+            dueDate = dateValue.toISOString();
+          }
+        } catch (e) {
+          console.warn("[AnnotationsTab] Invalid due date value:", dueDateInput.value);
+        }
       }
       const text = textArea.value.trim();
       if (text) {
@@ -26369,12 +26378,12 @@ var AnnotationsTab = class {
           </div>
           <div class="annotation-detail__field">
             <div class="annotation-detail__label">Data de Cria\xE7\xE3o</div>
-            <div class="annotation-detail__value">${new Date(annotation.createdAt).toLocaleString("pt-BR")}</div>
+            <div class="annotation-detail__value">${this.formatDate(annotation.createdAt)}</div>
           </div>
           ${annotation.dueDate ? `
             <div class="annotation-detail__field">
               <div class="annotation-detail__label">Data Limite</div>
-              <div class="annotation-detail__value">${new Date(annotation.dueDate).toLocaleDateString("pt-BR")}</div>
+              <div class="annotation-detail__value">${this.formatDate(annotation.dueDate)}</div>
             </div>
           ` : ""}
           <div class="annotation-detail__field">
@@ -26385,7 +26394,7 @@ var AnnotationsTab = class {
             <div class="annotation-detail__field">
               <div class="annotation-detail__label">Reconhecido por</div>
               <div class="annotation-detail__value">
-                ${annotation.acknowledgedBy?.name} em ${new Date(annotation.acknowledgedAt || "").toLocaleString("pt-BR")}
+                ${annotation.acknowledgedBy?.name} em ${this.formatDate(annotation.acknowledgedAt || "")}
               </div>
             </div>
           ` : ""}
@@ -26393,7 +26402,7 @@ var AnnotationsTab = class {
             <div class="annotation-detail__history-title">Hist\xF3rico (${annotation.history.length} eventos)</div>
             ${annotation.history.map((h) => `
               <div class="annotation-detail__history-item">
-                <strong>${h.action}</strong> por ${h.userName} em ${new Date(h.timestamp).toLocaleString("pt-BR")}
+                <strong>${h.action}</strong> por ${h.userName} em ${this.formatDate(h.timestamp)}
               </div>
             `).join("")}
           </div>

package/dist/index.js

@@ -24138,6 +24138,9 @@ var ANNOTATIONS_STYLES = `
   transition: all 0.2s ease;
   font-weight: 600;
   font-size: 13px;
+  position: relative;
+  z-index: 10;
+  pointer-events: auto;
 }
 
 .annotations-create-btn:hover {
@@ -24145,15 +24148,22 @@ var ANNOTATIONS_STYLES = `
   box-shadow: 0 6px 20px rgba(108, 92, 231, 0.4);
 }
 
+.annotations-create-btn:active {
+  transform: translateY(0);
+  box-shadow: 0 2px 8px rgba(108, 92, 231, 0.3);
+}
+
 .annotations-create-btn__icon {
   font-size: 28px;
   line-height: 1;
+  pointer-events: none;
 }
 
 .annotations-create-btn__text {
   font-size: 11px;
   text-transform: uppercase;
   letter-spacing: 0.5px;
+  pointer-events: none;
 }
 
 /* New Annotation Modal Overlay */
@@ -25482,18 +25492,29 @@ var AnnotationsTab = class {
   }
   isOverdue(annotation) {
     if (!annotation.dueDate || annotation.status === "archived") return false;
-    return new Date(annotation.dueDate) < /* @__PURE__ */ new Date();
+    try {
+      const dueDate = new Date(annotation.dueDate);
+      if (isNaN(dueDate.getTime())) return false;
+      return dueDate < /* @__PURE__ */ new Date();
+    } catch (e) {
+      return false;
+    }
   }
   formatDate(isoString) {
     if (!isoString) return "-";
-    const date = new Date(isoString);
-    return date.toLocaleDateString("pt-BR", {
-      day: "2-digit",
-      month: "2-digit",
-      year: "numeric",
-      hour: "2-digit",
-      minute: "2-digit"
-    });
+    try {
+      const date = new Date(isoString);
+      if (isNaN(date.getTime())) return "-";
+      return date.toLocaleDateString("pt-BR", {
+        day: "2-digit",
+        month: "2-digit",
+        year: "numeric",
+        hour: "2-digit",
+        minute: "2-digit"
+      });
+    } catch (e) {
+      return "-";
+    }
   }
   renderCard(annotation) {
     const canModify = canModifyAnnotation(annotation, this.permissions);
@@ -25554,7 +25575,7 @@ var AnnotationsTab = class {
     const typeColor = ANNOTATION_TYPE_COLORS[annotation.type];
     const importanceColor = IMPORTANCE_COLORS[annotation.importance];
     const statusColor = STATUS_COLORS[annotation.status];
-    const date = new Date(annotation.createdAt).toLocaleString("pt-BR");
+    const date = this.formatDate(annotation.createdAt);
     const truncatedText = annotation.text.length > 50 ? annotation.text.substring(0, 50) + "..." : annotation.text;
     return `
       <div class="annotation-row ${annotation.status === "archived" ? "annotation-row--archived" : ""}" data-id="${annotation.id}">
@@ -25616,9 +25637,13 @@ var AnnotationsTab = class {
   // ============================================
   attachEventListeners() {
     const openModalBtn = this.container.querySelector("#open-new-annotation-modal");
-    openModalBtn?.addEventListener("click", () => {
-      this.showNewAnnotationModal();
-    });
+    if (openModalBtn) {
+      openModalBtn.onclick = () => {
+        this.showNewAnnotationModal();
+      };
+    } else {
+      console.warn("[AnnotationsTab] Create button not found");
+    }
     this.setupMultiselectDropdown("filter-status", (values) => {
       if (values.includes("all") || values.length === 0) {
         this.filters.statusList = void 0;
@@ -25856,16 +25881,14 @@ var AnnotationsTab = class {
             </div>
           </div>
 
-          <!-- Due Date Range -->
+          <!-- Due Date -->
           <div class="annotations-form__field" style="margin-bottom: 16px;">
             <label class="annotations-form__label">Data Limite (opcional)</label>
             <input
-              type="text"
+              type="datetime-local"
               class="annotations-form__input"
               id="new-annotation-due-date"
-              placeholder="Selecione a data limite..."
-              readonly
-              style="cursor: pointer;"
+              style="cursor: text;"
             >
           </div>
         </div>
@@ -25914,24 +25937,6 @@ var AnnotationsTab = class {
       });
     }
     const dueDateInput = overlay.querySelector("#new-annotation-due-date");
-    if (dueDateInput) {
-      try {
-        this.modalDateRangePicker = await createDateRangePicker2(dueDateInput, {
-          includeTime: true,
-          timePrecision: "minute",
-          locale: "pt-BR",
-          parentEl: overlay.querySelector(".annotations-modal"),
-          onApply: (result) => {
-            dueDateInput.setAttribute("data-due-date", result.startISO);
-          }
-        });
-      } catch (error) {
-        console.warn("[AnnotationsTab] Modal DateRangePicker initialization failed:", error);
-        dueDateInput.type = "datetime-local";
-        dueDateInput.removeAttribute("readonly");
-        dueDateInput.style.cursor = "text";
-      }
-    }
     const closeModal = () => {
       this.modalDateRangePicker?.destroy?.();
       this.modalDateRangePicker = null;
@@ -25949,11 +25954,15 @@ var AnnotationsTab = class {
       const selectedImportance = overlay.querySelector(".importance-option.selected");
       const importance = parseInt(selectedImportance?.dataset.importance || "3");
       let dueDate;
-      const storedDueDate = dueDateInput?.getAttribute("data-due-date");
-      if (storedDueDate) {
-        dueDate = storedDueDate;
-      } else if (dueDateInput?.value) {
-        dueDate = new Date(dueDateInput.value).toISOString();
+      if (dueDateInput?.value) {
+        try {
+          const dateValue = new Date(dueDateInput.value);
+          if (!isNaN(dateValue.getTime())) {
+            dueDate = dateValue.toISOString();
+          }
+        } catch (e) {
+          console.warn("[AnnotationsTab] Invalid due date value:", dueDateInput.value);
+        }
       }
       const text = textArea.value.trim();
       if (text) {
@@ -26200,12 +26209,12 @@ var AnnotationsTab = class {
           </div>
           <div class="annotation-detail__field">
             <div class="annotation-detail__label">Data de Cria\xE7\xE3o</div>
-            <div class="annotation-detail__value">${new Date(annotation.createdAt).toLocaleString("pt-BR")}</div>
+            <div class="annotation-detail__value">${this.formatDate(annotation.createdAt)}</div>
           </div>
           ${annotation.dueDate ? `
             <div class="annotation-detail__field">
               <div class="annotation-detail__label">Data Limite</div>
-              <div class="annotation-detail__value">${new Date(annotation.dueDate).toLocaleDateString("pt-BR")}</div>
+              <div class="annotation-detail__value">${this.formatDate(annotation.dueDate)}</div>
             </div>
           ` : ""}
           <div class="annotation-detail__field">
@@ -26216,7 +26225,7 @@ var AnnotationsTab = class {
             <div class="annotation-detail__field">
               <div class="annotation-detail__label">Reconhecido por</div>
               <div class="annotation-detail__value">
-                ${annotation.acknowledgedBy?.name} em ${new Date(annotation.acknowledgedAt || "").toLocaleString("pt-BR")}
+                ${annotation.acknowledgedBy?.name} em ${this.formatDate(annotation.acknowledgedAt || "")}
               </div>
             </div>
           ` : ""}
@@ -26224,7 +26233,7 @@ var AnnotationsTab = class {
             <div class="annotation-detail__history-title">Hist\xF3rico (${annotation.history.length} eventos)</div>
             ${annotation.history.map((h) => `
               <div class="annotation-detail__history-item">
-                <strong>${h.action}</strong> por ${h.userName} em ${new Date(h.timestamp).toLocaleString("pt-BR")}
+                <strong>${h.action}</strong> por ${h.userName} em ${this.formatDate(h.timestamp)}
               </div>
             `).join("")}
           </div>

package/dist/myio-js-library.umd.js

@@ -23952,6 +23952,9 @@
   transition: all 0.2s ease;
   font-weight: 600;
   font-size: 13px;
+  position: relative;
+  z-index: 10;
+  pointer-events: auto;
 }
 
 .annotations-create-btn:hover {
@@ -23959,15 +23962,22 @@
   box-shadow: 0 6px 20px rgba(108, 92, 231, 0.4);
 }
 
+.annotations-create-btn:active {
+  transform: translateY(0);
+  box-shadow: 0 2px 8px rgba(108, 92, 231, 0.3);
+}
+
 .annotations-create-btn__icon {
   font-size: 28px;
   line-height: 1;
+  pointer-events: none;
 }
 
 .annotations-create-btn__text {
   font-size: 11px;
   text-transform: uppercase;
   letter-spacing: 0.5px;
+  pointer-events: none;
 }
 
 /* New Annotation Modal Overlay */
@@ -25296,18 +25306,29 @@
     }
     isOverdue(annotation) {
       if (!annotation.dueDate || annotation.status === "archived") return false;
-      return new Date(annotation.dueDate) < /* @__PURE__ */ new Date();
+      try {
+        const dueDate = new Date(annotation.dueDate);
+        if (isNaN(dueDate.getTime())) return false;
+        return dueDate < /* @__PURE__ */ new Date();
+      } catch (e) {
+        return false;
+      }
     }
     formatDate(isoString) {
       if (!isoString) return "-";
-      const date = new Date(isoString);
-      return date.toLocaleDateString("pt-BR", {
-        day: "2-digit",
-        month: "2-digit",
-        year: "numeric",
-        hour: "2-digit",
-        minute: "2-digit"
-      });
+      try {
+        const date = new Date(isoString);
+        if (isNaN(date.getTime())) return "-";
+        return date.toLocaleDateString("pt-BR", {
+          day: "2-digit",
+          month: "2-digit",
+          year: "numeric",
+          hour: "2-digit",
+          minute: "2-digit"
+        });
+      } catch (e) {
+        return "-";
+      }
     }
     renderCard(annotation) {
       const canModify = canModifyAnnotation(annotation, this.permissions);
@@ -25368,7 +25389,7 @@
       const typeColor = ANNOTATION_TYPE_COLORS[annotation.type];
       const importanceColor = IMPORTANCE_COLORS[annotation.importance];
       const statusColor = STATUS_COLORS[annotation.status];
-      const date = new Date(annotation.createdAt).toLocaleString("pt-BR");
+      const date = this.formatDate(annotation.createdAt);
       const truncatedText = annotation.text.length > 50 ? annotation.text.substring(0, 50) + "..." : annotation.text;
       return `
       <div class="annotation-row ${annotation.status === "archived" ? "annotation-row--archived" : ""}" data-id="${annotation.id}">
@@ -25430,9 +25451,13 @@
     // ============================================
     attachEventListeners() {
       const openModalBtn = this.container.querySelector("#open-new-annotation-modal");
-      openModalBtn?.addEventListener("click", () => {
-        this.showNewAnnotationModal();
-      });
+      if (openModalBtn) {
+        openModalBtn.onclick = () => {
+          this.showNewAnnotationModal();
+        };
+      } else {
+        console.warn("[AnnotationsTab] Create button not found");
+      }
       this.setupMultiselectDropdown("filter-status", (values) => {
         if (values.includes("all") || values.length === 0) {
           this.filters.statusList = void 0;
@@ -25670,16 +25695,14 @@
             </div>
           </div>
 
-          <!-- Due Date Range -->
+          <!-- Due Date -->
           <div class="annotations-form__field" style="margin-bottom: 16px;">
             <label class="annotations-form__label">Data Limite (opcional)</label>
             <input
-              type="text"
+              type="datetime-local"
               class="annotations-form__input"
               id="new-annotation-due-date"
-              placeholder="Selecione a data limite..."
-              readonly
-              style="cursor: pointer;"
+              style="cursor: text;"
             >
           </div>
         </div>
@@ -25728,24 +25751,6 @@
         });
       }
       const dueDateInput = overlay.querySelector("#new-annotation-due-date");
-      if (dueDateInput) {
-        try {
-          this.modalDateRangePicker = await createDateRangePicker2(dueDateInput, {
-            includeTime: true,
-            timePrecision: "minute",
-            locale: "pt-BR",
-            parentEl: overlay.querySelector(".annotations-modal"),
-            onApply: (result) => {
-              dueDateInput.setAttribute("data-due-date", result.startISO);
-            }
-          });
-        } catch (error) {
-          console.warn("[AnnotationsTab] Modal DateRangePicker initialization failed:", error);
-          dueDateInput.type = "datetime-local";
-          dueDateInput.removeAttribute("readonly");
-          dueDateInput.style.cursor = "text";
-        }
-      }
       const closeModal = () => {
         this.modalDateRangePicker?.destroy?.();
         this.modalDateRangePicker = null;
@@ -25763,11 +25768,15 @@
         const selectedImportance = overlay.querySelector(".importance-option.selected");
         const importance = parseInt(selectedImportance?.dataset.importance || "3");
         let dueDate;
-        const storedDueDate = dueDateInput?.getAttribute("data-due-date");
-        if (storedDueDate) {
-          dueDate = storedDueDate;
-        } else if (dueDateInput?.value) {
-          dueDate = new Date(dueDateInput.value).toISOString();
+        if (dueDateInput?.value) {
+          try {
+            const dateValue = new Date(dueDateInput.value);
+            if (!isNaN(dateValue.getTime())) {
+              dueDate = dateValue.toISOString();
+            }
+          } catch (e) {
+            console.warn("[AnnotationsTab] Invalid due date value:", dueDateInput.value);
+          }
         }
         const text = textArea.value.trim();
         if (text) {
@@ -26014,12 +26023,12 @@
           </div>
           <div class="annotation-detail__field">
             <div class="annotation-detail__label">Data de Cria\xE7\xE3o</div>
-            <div class="annotation-detail__value">${new Date(annotation.createdAt).toLocaleString("pt-BR")}</div>
+            <div class="annotation-detail__value">${this.formatDate(annotation.createdAt)}</div>
           </div>
           ${annotation.dueDate ? `
             <div class="annotation-detail__field">
               <div class="annotation-detail__label">Data Limite</div>
-              <div class="annotation-detail__value">${new Date(annotation.dueDate).toLocaleDateString("pt-BR")}</div>
+              <div class="annotation-detail__value">${this.formatDate(annotation.dueDate)}</div>
             </div>
           ` : ""}
           <div class="annotation-detail__field">
@@ -26030,7 +26039,7 @@
             <div class="annotation-detail__field">
               <div class="annotation-detail__label">Reconhecido por</div>
               <div class="annotation-detail__value">
-                ${annotation.acknowledgedBy?.name} em ${new Date(annotation.acknowledgedAt || "").toLocaleString("pt-BR")}
+                ${annotation.acknowledgedBy?.name} em ${this.formatDate(annotation.acknowledgedAt || "")}
               </div>
             </div>
           ` : ""}
@@ -26038,7 +26047,7 @@
             <div class="annotation-detail__history-title">Hist\xF3rico (${annotation.history.length} eventos)</div>
             ${annotation.history.map((h) => `
               <div class="annotation-detail__history-item">
-                <strong>${h.action}</strong> por ${h.userName} em ${new Date(h.timestamp).toLocaleString("pt-BR")}
+                <strong>${h.action}</strong> por ${h.userName} em ${this.formatDate(h.timestamp)}
               </div>
             `).join("")}
           </div>