react-notify-sdk 1.0.23 → 1.0.24

package/dist/FadeWrapper.js

@@ -10,6 +10,6 @@ top: ${(props) => props.message?.position === 'top' ? '24px' : ''};
 bottom: ${(props) => props.message?.position === 'bottom' ? '24px' : ''};
 left: 50%;
 transform: translateX(-50%);
-z-index: 5;
+z-index: 5000;
 `;
 export default FadeWrapper;

package/dist/NotifyMessage.js

@@ -1,5 +1,19 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 const NotificationMessage = ({ message }) => {
+    function hexToRgba(hex, alpha) {
+        // Remove leading #
+        hex = hex.replace(/^#/, "");
+        // Expand shorthand form (#03F → #0033FF)
+        if (hex.length === 3) {
+            hex = hex.split("").map(x => x + x).join("");
+        }
+        // Parse into r, g, b
+        const bigint = parseInt(hex, 16);
+        const r = (bigint >> 16) & 255;
+        const g = (bigint >> 8) & 255;
+        const b = bigint & 255;
+        return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+    }
     return (_jsxs("div", { style: {
             width: '100%',
             paddingTop: '4px', // p-4 = 1rem
@@ -7,8 +21,10 @@ const NotificationMessage = ({ message }) => {
             paddingLeft: '12px',
             paddingRight: '12px',
             backgroundColor: message?.backgroundColor,
-            border: `1px solid ${message?.textColor}`, // Completed border style
-            borderRadius: "8px"
+            borderRadius: "8px",
+            borderWidth: "1px",
+            borderColor: `${hexToRgba(message.borderColor, 0.3)}`,
+            boxShadow: `0 10px 15px -3px ${hexToRgba(message.borderColor, 0.4)}, 0 4px 6px -4px ${hexToRgba(message.borderColor, 0.4)}`
         }, children: [_jsxs("div", { className: 'w-full flex flex-row', style: {
                     width: '100%',
                     display: 'flex',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-notify-sdk",
-  "version": "1.0.23",
+  "version": "1.0.24",
   "description": "SDK for displaying real-time route-specific messages in React apps",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -17,7 +17,8 @@
   "dependencies": {
     "@supabase/supabase-js": "^2.50.0",
     "clsx": "^2.1.1",
-    "goober": "^2.1.16"
+    "goober": "^2.1.16",
+    "lucide-react": "^0.541.0"
   },
   "devDependencies": {
     "@types/react": "^19.1.8",