Before repair nav components

components/discarted/Toast.js

@@ -0,0 +1,55 @@
+// components/Toast.js
+import { h, mount } from "sigpro";
+
+export const Toast = (message, type = "alert-success", duration = 3500) => {
+  let container = document.getElementById("sigpro-toast-container");
+  if (!container) {
+    container = h("div", {
+      id: "sigpro-toast-container",
+      class: "fixed top-0 right-0 z-[9999] p-4 flex flex-col gap-2 pointer-events-none"
+    });
+    document.body.appendChild(container);
+  }
+
+  const toastHost = h("div", { style: "display: contents" });
+  container.appendChild(toastHost);
+
+  let timeoutId;
+  const close = () => {
+    clearTimeout(timeoutId);
+    const el = toastHost.firstElementChild;
+    if (el && !el.classList.contains("opacity-0")) {
+      el.classList.add("translate-x-full", "opacity-0");
+      setTimeout(() => {
+        instance.destroy();
+        toastHost.remove();
+        if (!container.hasChildNodes()) container.remove();
+      }, 300);
+    } else {
+      instance.destroy();
+      toastHost.remove();
+    }
+  };
+
+  const ToastComponent = () => {
+    const closeIcon = h("span", { class: "icon-[lucide--x]" });
+    const closeBtn = h("button", {
+      class: "btn btn-xs btn-circle btn-ghost",
+      onclick: close
+    }, closeIcon);
+
+    const alertDiv = h("div", {
+      class: `alert alert-soft ${type} shadow-lg transition-all duration-300 translate-x-10 opacity-0 pointer-events-auto`
+    }, [
+      h("span", {}, typeof message === "function" ? message() : message),
+      closeBtn
+    ]);
+
+    requestAnimationFrame(() => alertDiv.classList.remove("translate-x-10", "opacity-0"));
+    return alertDiv;
+  };
+
+  const instance = mount(ToastComponent, toastHost);
+  if (duration > 0) timeoutId = setTimeout(close, duration);
+  return close;
+};