@hexdspace/react 0.0.10 → 0.0.12

package/dist/index.js

@@ -103,52 +103,11 @@ var notifierController = new NotifierController(sendNotification, subscribe);
 
 // src/feature/notifier/infra/web/react/NotificationHost.tsx
 import { useCallback, useEffect, useMemo as useMemo2 } from "react";
-import { toast as toast2, ToastContainer } from "react-toastify";
+import { cssTransition, Slide, toast as toast2, ToastContainer } from "react-toastify";
 
 // src/feature/notifier/entity/notification.ts
 var DEFAULT_NOTIFICATION_CHANNEL = "app.notifications";
 
-// src/feature/notifier/infra/web/react/CustomToastTransition.tsx
-import { cssTransition } from "react-toastify";
-var CUSTOM_TRANSITION_STYLE_ID = "hexd-toast-transition-styles";
-var CUSTOM_TRANSITION_STYLES = `
-@keyframes slideIn {
-    from { transform: translateY(-20px); opacity: 0; }
-    to   { transform: translateY(0);     opacity: 1; }
-}
-
-@keyframes slideOut {
-    from { transform: translateY(0);     opacity: 1; }
-    to   { transform: translateY(-20px); opacity: 0; }
-}
-
-.slideIn  {
-    animation: slideIn 0.35s forwards;
-}
-
-.slideOut {
-    animation: slideOut 0.25s forwards;
-}
-`;
-var ensureCustomToastTransitionStyles = () => {
-  if (typeof document === "undefined") return;
-  if (document.getElementById(CUSTOM_TRANSITION_STYLE_ID)) return;
-  const style = document.createElement("style");
-  style.id = CUSTOM_TRANSITION_STYLE_ID;
-  style.textContent = CUSTOM_TRANSITION_STYLES;
-  document.head.appendChild(style);
-};
-var SlideUp = cssTransition({
-  enter: "slideIn",
-  exit: "slideOut",
-  collapseDuration: 300
-});
-var buildToastTransition = (transition) => {
-  ensureCustomToastTransitionStyles();
-  if (!transition) return SlideUp;
-  return cssTransition(transition);
-};
-
 // src/feature/notifier/infra/web/react/ToastContent.tsx
 import { useMemo, useState } from "react";
 import { toast } from "react-toastify";
@@ -327,12 +286,7 @@ var DEFAULT_THEME_BASE = {
   width: "min(24rem, calc(100vw - 2rem))",
   contentPadding: "0.5rem 0.75rem 1rem 0.5rem",
   bodyColumnGap: "0.75rem",
-  bodyRowGap: "0.25rem",
-  transition: {
-    enter: "slideIn",
-    exit: "slideOut",
-    collapseDuration: 300
-  }
+  bodyRowGap: "0.25rem"
 };
 function resolveToastTheme(theme) {
   return {
@@ -350,7 +304,7 @@ function resolveToastTheme(theme) {
     contentPadding: theme?.contentPadding ?? DEFAULT_THEME_BASE.contentPadding,
     bodyColumnGap: theme?.bodyColumnGap ?? DEFAULT_THEME_BASE.bodyColumnGap,
     bodyRowGap: theme?.bodyRowGap ?? DEFAULT_THEME_BASE.bodyRowGap,
-    transition: theme?.transition ?? DEFAULT_THEME_BASE.transition,
+    transition: theme?.transition,
     action: {
       ...DEFAULT_ACTION_THEME,
       ...theme?.action ?? {}
@@ -372,6 +326,10 @@ var NotificationHost = ({ channel = DEFAULT_NOTIFICATION_CHANNEL, isDark, theme
     }
     return isDark() ? "dark" : "light";
   }, [isDark]);
+  const transition = useMemo2(() => {
+    const config = resolvedTheme.transition;
+    return config ? cssTransition(config) : Slide;
+  }, [resolvedTheme.transition]);
   const style = useMemo2(() => ({
     "--toastify-color-light": resolvedTheme.lightBg,
     "--toastify-text-color-light": resolvedTheme.lightText,
@@ -386,12 +344,13 @@ var NotificationHost = ({ channel = DEFAULT_NOTIFICATION_CHANNEL, isDark, theme
     "--toastify-toast-width": resolvedTheme.width
   }), [resolvedTheme]);
   const renderToast = useCallback((notification) => {
+    const variant = notification.variant ?? "info";
     toast2(/* @__PURE__ */ jsx2(ToastContent, { notification, theme: resolvedTheme, mode }), {
       toastId: notification.id,
-      icon: false
+      icon: false,
+      type: variant
     });
   }, [mode, resolvedTheme]);
-  const transition = useMemo2(() => buildToastTransition(resolvedTheme.transition), [resolvedTheme.transition]);
   useEffect(() => {
     let unsub;
     let disposed = false;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hexdspace/react",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -21,9 +21,10 @@
   "dependencies": {
     "@tanstack/react-query": "^5.90.11",
     "lucide-react": "^0.555.0",
+    "react-router-dom": "^7.10.1",
     "react-toastify": "^11.0.5",
     "uuid": "^13.0.0",
-    "@hexdspace/util": "0.0.1"
+    "@hexdspace/util": "0.0.24"
   },
   "peerDependencies": {
     "@tanstack/react-query": "^5.90.11",
@@ -31,8 +32,8 @@
   },
   "devDependencies": {
     "@tanstack/react-query": "^5.90.11",
-    "react": "^19.2.0",
-    "@types/react": "^19.2.7"
+    "@types/react": "^19.2.7",
+    "react": "^19.2.0"
   },
   "scripts": {
     "build": "tsup src/index.ts --dts --format esm --clean",