@enigmax/primitives 0.21.0 → 0.23.0

package/src/react/toast/assets.tsx

@@ -0,0 +1,85 @@
+"use client";
+
+import React from "react";
+import type { ToastTypes } from "./types";
+
+export const getAsset = (type: ToastTypes): React.JSX.Element | null => {
+    switch (type) {
+        case "success": return SuccessIcon;
+        case "info": return InfoIcon;
+        case "warning": return WarningIcon;
+        case "error": return ErrorIcon;
+        default: return null;
+    }
+};
+
+const bars = Array(12).fill(0);
+
+export const Loader = ({ visible, className }: { visible: boolean, className?: string }) => {
+    return (
+        <div className={["toastcmp-loading-wrapper", className].filter(Boolean).join(" ")} data-visible={visible}>
+            <div className="toastcmp-spinner">
+                {bars.map((_, i) => (
+                    <div className="toastcmp-loading-bar" key={`spinner-bar-${i}`} />
+                ))}
+            </div>
+        </div>
+    );
+};
+
+const SuccessIcon = (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" height="20" width="20">
+        <path
+            fillRule="evenodd"
+            d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.857-9.809a.75.75 0 00-1.214-.882l-3.483 4.79-1.88-1.88a.75.75 0 10-1.06 1.061l2.5 2.5a.75.75 0 001.137-.089l4-5.5z"
+            clipRule="evenodd"
+        />
+    </svg>
+);
+
+const WarningIcon = (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" height="20" width="20">
+        <path
+            fillRule="evenodd"
+            d="M9.401 3.003c1.155-2 4.043-2 5.197 0l7.355 12.748c1.154 2-.29 4.5-2.599 4.5H4.645c-2.309 0-3.752-2.5-2.598-4.5L9.4 3.003zM12 8.25a.75.75 0 01.75.75v3.75a.75.75 0 01-1.5 0V9a.75.75 0 01.75-.75zm0 8.25a.75.75 0 100-1.5.75.75 0 000 1.5z"
+            clipRule="evenodd"
+        />
+    </svg>
+);
+
+const InfoIcon = (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" height="20" width="20">
+        <path
+            fillRule="evenodd"
+            d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z"
+            clipRule="evenodd"
+        />
+    </svg>
+);
+
+const ErrorIcon = (
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" height="20" width="20">
+        <path
+            fillRule="evenodd"
+            d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-5a.75.75 0 01.75.75v4.5a.75.75 0 01-1.5 0v-4.5A.75.75 0 0110 5zm0 10a1 1 0 100-2 1 1 0 000 2z"
+            clipRule="evenodd"
+        />
+    </svg>
+);
+
+export const CloseIcon = (
+    <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="12"
+        height="12"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        strokeWidth="1.5"
+        strokeLinecap="round"
+        strokeLinejoin="round"
+    >
+        <line x1="18" y1="6" x2="6" y2="18"></line>
+        <line x1="6" y1="6" x2="18" y2="18"></line>
+    </svg>
+);

package/src/react/toast/cn.ts

@@ -0,0 +1,10 @@
+/**
+ * The class-name joiner the vendored component imports.
+ *
+ * Its own file, and two lines, because the alternative is editing the component: everything
+ * in this directory is upstream's, kept as close to verbatim as a library can keep it, and
+ * one helper is a cheaper thing to supply than a diff to maintain.
+ */
+export function cn(...classes: (string | undefined | null | false)[]): string {
+    return classes.filter(Boolean).join(" ");
+}

package/src/react/toast/hooks.ts

@@ -0,0 +1,13 @@
+import React from "react";
+
+export const useIsDocumentHidden = () => {
+    const [isDocumentHidden, setIsDocumentHidden] = React.useState(document.hidden);
+
+    React.useEffect(() => {
+        const callback = () => setIsDocumentHidden(document.hidden);
+        document.addEventListener("visibilitychange", callback);
+        return () => window.removeEventListener("visibilitychange", callback);
+    }, []);
+
+    return isDocumentHidden;
+};