react-event-tracking 1.0.2 → 1.0.3

package/README.md

@@ -1,4 +1,5 @@
-A convenient React context for tracking analytics events.
+# react-event-tracking [![NPM Version](https://img.shields.io/npm/v/react-event-tracking)](https://www.npmjs.com/package/react-event-tracking)
+A convenient React context for tracking analytics events. 
 
 ## Features
 
@@ -9,7 +10,7 @@ A convenient React context for tracking analytics events.
 ## Installation
 
 ```
-npm install treact-event-tracking
+npm install react-event-tracking
 ```
 ```
 yarn add react-event-tracking
@@ -55,18 +56,18 @@ const MyButton = () => {
 };
 ```
 
-## Example
+## Built-in Hooks   
 
-### Page View
+### useMountEvent   
+
+Sends an event when the component mounts.
 
 ```tsx
-export function PageView(props) {
-    const { sendEvent } = useTracker();
+import { useMountEvent } from 'react-event-tracking';
 
-    useEffect(() => {
-        sendEvent('page_view');
-    }, []);
+export function DashboardScreen(props) {
+    useMountEvent('page_view', { screen: 'dashboard' });
 
-    return <>{props.children}</>
+    return <div>Dashboard</div>;
 }
-```
+```

package/dist/index.cjs

@@ -47,6 +47,19 @@ const TrackProvider = ({
   return /* @__PURE__ */ React__default.createElement(TrackContext.Provider, { value }, children);
 };
 
+function useMountEvent(eventName, params) {
+  const { sendEvent } = useTracker();
+  const counterRef = React.useRef(0);
+  React.useEffect(() => {
+    if (counterRef.current > 0) {
+      return;
+    }
+    counterRef.current++;
+    sendEvent(eventName, params);
+  }, []);
+}
+
 exports.TrackProvider = TrackProvider;
 exports.TrackRoot = TrackRoot;
+exports.useMountEvent = useMountEvent;
 exports.useTracker = useTracker;

package/dist/index.d.cts

@@ -2,9 +2,10 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { PropsWithChildren } from 'react';
 
 type EventParams = Record<string, any>;
-interface TrackContextValue {
+type TrackContextValue = {
     sendEvent: (eventName: string, params?: EventParams) => void;
-}
+};
+
 declare const useTracker: () => TrackContextValue;
 declare const TrackRoot: ({ onEvent, children }: PropsWithChildren<{
     onEvent: (eventName: string, params?: EventParams) => void;
@@ -13,4 +14,6 @@ declare const TrackProvider: ({ params, children }: PropsWithChildren<{
     params: EventParams;
 }>) => react_jsx_runtime.JSX.Element;
 
-export { TrackProvider, TrackRoot, useTracker };
+declare function useMountEvent(eventName: string, params?: EventParams): void;
+
+export { TrackProvider, TrackRoot, useMountEvent, useTracker };

package/dist/index.d.mts

@@ -2,9 +2,10 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { PropsWithChildren } from 'react';
 
 type EventParams = Record<string, any>;
-interface TrackContextValue {
+type TrackContextValue = {
     sendEvent: (eventName: string, params?: EventParams) => void;
-}
+};
+
 declare const useTracker: () => TrackContextValue;
 declare const TrackRoot: ({ onEvent, children }: PropsWithChildren<{
     onEvent: (eventName: string, params?: EventParams) => void;
@@ -13,4 +14,6 @@ declare const TrackProvider: ({ params, children }: PropsWithChildren<{
     params: EventParams;
 }>) => react_jsx_runtime.JSX.Element;
 
-export { TrackProvider, TrackRoot, useTracker };
+declare function useMountEvent(eventName: string, params?: EventParams): void;
+
+export { TrackProvider, TrackRoot, useMountEvent, useTracker };

package/dist/index.d.ts

@@ -2,9 +2,10 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import { PropsWithChildren } from 'react';
 
 type EventParams = Record<string, any>;
-interface TrackContextValue {
+type TrackContextValue = {
     sendEvent: (eventName: string, params?: EventParams) => void;
-}
+};
+
 declare const useTracker: () => TrackContextValue;
 declare const TrackRoot: ({ onEvent, children }: PropsWithChildren<{
     onEvent: (eventName: string, params?: EventParams) => void;
@@ -13,4 +14,6 @@ declare const TrackProvider: ({ params, children }: PropsWithChildren<{
     params: EventParams;
 }>) => react_jsx_runtime.JSX.Element;
 
-export { TrackProvider, TrackRoot, useTracker };
+declare function useMountEvent(eventName: string, params?: EventParams): void;
+
+export { TrackProvider, TrackRoot, useMountEvent, useTracker };

package/dist/index.mjs

@@ -1,4 +1,4 @@
-import React, { useContext, useRef, useCallback, useMemo } from 'react';
+import React, { useContext, useRef, useCallback, useMemo, useEffect } from 'react';
 
 const TrackContext = React.createContext(null);
 const useTracker = () => {
@@ -41,4 +41,16 @@ const TrackProvider = ({
   return /* @__PURE__ */ React.createElement(TrackContext.Provider, { value }, children);
 };
 
-export { TrackProvider, TrackRoot, useTracker };
+function useMountEvent(eventName, params) {
+  const { sendEvent } = useTracker();
+  const counterRef = useRef(0);
+  useEffect(() => {
+    if (counterRef.current > 0) {
+      return;
+    }
+    counterRef.current++;
+    sendEvent(eventName, params);
+  }, []);
+}
+
+export { TrackProvider, TrackRoot, useMountEvent, useTracker };

package/package.json

@@ -1,9 +1,10 @@
 {
   "name": "react-event-tracking",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "files": [
     "dist"
   ],
+  "repository": "git@github.com:zeeeeby/react-event-tracking.git",
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
@@ -13,7 +14,8 @@
   },
   "scripts": {
     "build": "tsc --noEmit && unbuild",
-    "test": "vitest"
+    "test": "vitest",
+    "toc": "npx markdown-toc README.md -i"
   },
   "author": "",
   "license": "ISC",