Merge 2b7ff7b into 277deee

build-addons.mjs

@@ -20,9 +20,9 @@ try {
     let entryPoint = path.join(BASE_DIR, dir, 'index.ts');
     const exportKey = `./addons/${dir}`;
     const exportValues = {
+      types: `./addons/${dir}/index.d.ts`,
       require: '',
-      import: '',
-      types: `./addons/${dir}/index.d.ts`
+      import: ''
     };
 
     if (!existsSync(entryPoint)) {

package.json

@@ -35,6 +35,7 @@
     "build": "npm run clean && npm run build:core && npm run pack-and-extract && npm run build:addons && npm run style && husky install",
     "build:core": "microbundle --jsx React.createElement --jsxFragment React.Fragment",
     "build:addons": "node build-addons.mjs",
+    "postbuild": "./prepend-use-client.sh",
     "setup": "npm run clean && npm run build && npm run pack-and-extract",
     "pack-and-extract": "yarn pack -f react-toastify.tgz && npm run rm-pkg && npm run extract-pkg",
     "rm-pkg": "rimraf node_modules/react-toastify && mkdir -p node_modules/react-toastify",
@@ -96,15 +97,15 @@
   "devDependencies": {
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^14.0.0",
-    "@types/jest": "^29.4.0",
-    "@types/react": "^18.0.28",
-    "@types/react-dom": "^18.0.11",
-    "@typescript-eslint/eslint-plugin": "^5.54.1",
-    "@typescript-eslint/parser": "^5.54.1",
+    "@types/jest": "^29.5.1",
+    "@types/react": "^18.2.6",
+    "@types/react-dom": "^18.2.4",
+    "@typescript-eslint/eslint-plugin": "^5.59.5",
+    "@typescript-eslint/parser": "^5.59.5",
     "coveralls": "^3.0.9",
-    "cssnano": "^5.1.15",
+    "cssnano": "^6.0.1",
     "cssnano-cli": "^1.0.5",
-    "eslint": "^8.35.0",
+    "eslint": "^8.40.0",
     "eslint-plugin-import": "^2.27.5",
     "eslint-plugin-jsx-a11y": "^6.7.1",
     "eslint-plugin-react": "^7.32.2",
@@ -114,17 +115,17 @@
     "jest-environment-jsdom": "^29.5.0",
     "jest-jasmine2": "^29.5.0",
     "microbundle": "^0.15.1",
-    "postcss": "^8.4.21",
+    "postcss": "^8.4.23",
     "postcss-cli": "^10.1.0",
-    "prettier": "2.8.4",
+    "prettier": "2.8.8",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
-    "rimraf": "^4.4.0",
-    "sass": "^1.58.3",
+    "rimraf": "^5.0.0",
+    "sass": "^1.62.1",
     "style2js": "^1.0.1",
-    "ts-jest": "^29.0.5",
+    "ts-jest": "^29.1.0",
     "tslib": "^2.5.0",
-    "typescript": "^4.9.5"
+    "typescript": "^5.0.4"
   },
   "dependencies": {
     "clsx": "^1.1.1"
@@ -165,4 +166,4 @@
       "import": "./addons/use-notification-center/index.esm.mjs"
     }
   }
-}
+}

prepend-use-client.sh

@@ -0,0 +1,8 @@
+#!/usr/bin/env bash
+
+# TODO yeah maybe let's make something more robust and futur proof
+files=("react-toastify.js" "react-toastify.esm.mjs" "inject-style.js" "inject-style.esm.mjs")
+
+for f in ${files[*]}; do
+ echo -e "'use client';\n$(cat ./dist/${f})" > ./dist/${f}
+done

src/components/ProgressBar.tsx

@@ -112,10 +112,10 @@ export function ProgressBar({
   // so if controlledProgress is set
   // it means that this is also the case for progress
   const animationEvent = {
-    [controlledProgress && progress! >= 1
+    [controlledProgress && (progress as number)! >= 1
       ? 'onTransitionEnd'
       : 'onAnimationEnd']:
-      controlledProgress && progress! < 1
+      controlledProgress && (progress as number)! < 1
         ? null
         : () => {
             isIn && closeToast();

src/utils/mapper.ts

@@ -1,15 +1,18 @@
 import { Toast, ToastItem, ToastItemStatus } from '../types';
 
 export function toToastItem(toast: Toast, status: ToastItemStatus): ToastItem {
-  return {
-    content: toast.content,
-    containerId: toast.props.containerId,
-    id: toast.props.toastId,
-    theme: toast.props.theme,
-    type: toast.props.type,
-    data: toast.props.data || {},
-    isLoading: toast.props.isLoading,
-    icon: toast.props.icon,
-    status
-  };
+  return toast != null
+    ? {
+        content: toast.content,
+        containerId: toast.props.containerId,
+        id: toast.props.toastId,
+        theme: toast.props.theme,
+        type: toast.props.type,
+        data: toast.props.data || {},
+        isLoading: toast.props.isLoading,
+        icon: toast.props.icon,
+        status
+      }
+    : // monkey patch for now
+      ({} as ToastItem);
 }