react-notify-sdk 1.0.21 → 1.0.22

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -13,7 +13,7 @@ const NotificationMessage = ({ message }) => {
13
13
  width: '100%',
14
14
  display: 'flex',
15
15
  flexDirection: 'row'
16
- }, children: [message?.type === 'Information' && _jsx("p", { className: 'text-lg', style: { fontSize: '1.125rem' }, children: "\u2139" }), message?.type === 'Warning' && _jsx("p", { className: 'text-lg', style: { fontSize: '1.125rem' }, children: "\u26A0\uFE0F" }), message?.type === 'Error' && _jsx("p", { className: 'text-lg', style: { fontSize: '1.125rem' }, children: "\u203C\uFE0F" }), _jsx("p", { className: `text-lg font-semibold text-[${message?.textColor}] ml-3`, style: {
16
+ }, children: [message?.type === 'Information' && _jsx("p", { className: 'text-lg', style: { fontSize: '1.125rem' }, children: "\uD83D\uDCA1" }), message?.type === 'Warning' && _jsx("p", { className: 'text-lg', style: { fontSize: '1.125rem' }, children: "\u26A0\uFE0F" }), message?.type === 'Error' && _jsx("p", { className: 'text-lg', style: { fontSize: '1.125rem' }, children: "\u203C\uFE0F" }), _jsx("p", { className: `text-lg font-semibold text-[${message?.textColor}] ml-3`, style: {
17
17
  fontSize: '1.125rem', // text-lg = 18px = 1.125rem
18
18
  fontWeight: 600, // font-semibold = 600
19
19
  color: `${message?.textColor}`,
@@ -1,2 +1,2 @@
1
1
  import { NotifyMessageProviderProps } from './types';
2
- export declare const NotifyProvider: ({ projectId, }: NotifyMessageProviderProps) => import("react/jsx-runtime").JSX.Element | null;
2
+ export declare const NotifyProvider: ({ projectKey, onClear, }: NotifyMessageProviderProps) => import("react/jsx-runtime").JSX.Element | null;
@@ -19,7 +19,7 @@ const routeMatches = (pattern, path) => {
19
19
  return false;
20
20
  }
21
21
  };
22
- export const NotifyProvider = ({ projectId,
22
+ export const NotifyProvider = ({ projectKey, onClear,
23
23
  //className,
24
24
  //style,
25
25
  //disableDefaultStyles = true,
@@ -28,6 +28,10 @@ export const NotifyProvider = ({ projectId,
28
28
  const [visible, setVisible] = useState(false);
29
29
  const location = useLocation();
30
30
  const device = useDeviceDetection();
31
+ const clearMessage = () => {
32
+ setVisible(false);
33
+ setMessage(null);
34
+ };
31
35
  useEffect(() => {
32
36
  if (typeof window === 'undefined')
33
37
  return; // Skip on server
@@ -35,7 +39,7 @@ export const NotifyProvider = ({ projectId,
35
39
  const { data } = await supabase
36
40
  .from('feature_messages')
37
41
  .select('*')
38
- .eq('project_key', projectId)
42
+ .eq('project_key', projectKey)
39
43
  .eq('route', location.pathname)
40
44
  .eq('is_active', true)
41
45
  .order('created_at', { ascending: false });
@@ -61,7 +65,7 @@ export const NotifyProvider = ({ projectId,
61
65
  table: 'feature_messages',
62
66
  }, (payload) => {
63
67
  const msg = payload.new;
64
- if (msg.project_key === projectId && msg.is_active && routeMatches(msg.route, location.pathname)) {
68
+ if (msg.project_key === projectKey && msg.is_active && routeMatches(msg.route, location.pathname)) {
65
69
  setMessage(msg);
66
70
  setVisible(true);
67
71
  }
@@ -71,10 +75,13 @@ export const NotifyProvider = ({ projectId,
71
75
  }
72
76
  })
73
77
  .subscribe();
78
+ if (onClear) {
79
+ clearMessage;
80
+ }
74
81
  return () => {
75
82
  supabase.removeChannel(subscription);
76
83
  };
77
- }, [location.pathname, projectId]);
84
+ }, [location.pathname, projectKey, onClear]);
78
85
  if (!message)
79
86
  return null;
80
87
  //const defaultClasses = `absolute ${message?.position}-6 left-1/2 transform -translate-x-1/2 z-20 w-full md:w-[${message?.width}%] px-3 py-1 bg-[${message?.backgroundColor}] border border-[${message?.borderColor}] text-[${message?.textColor}] rounded-lg shadow`;
package/dist/types.d.ts CHANGED
@@ -16,7 +16,6 @@ export type NotifyMessage = {
16
16
  type: string;
17
17
  };
18
18
  export type NotifyMessageProviderProps = {
19
- projectId: string;
20
- className?: string;
21
- disableDefaultStyles?: boolean;
19
+ projectKey: string;
20
+ onClear: boolean;
22
21
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-notify-sdk",
3
- "version": "1.0.21",
3
+ "version": "1.0.22",
4
4
  "description": "SDK for displaying real-time route-specific messages in React apps",
5
5
  "main": "dist/index.js",
6
6
  "types": "dist/index.d.ts",