@rakutenanalytics/rat-react 0.3.1-rc.716ed0a

package/dist/lib/TrackerProvider.d.ts

@@ -0,0 +1,49 @@
+import { ReactNode } from 'react';
+import { TrackerOptions } from '@rakutenanalytics/rat-ts';
+/**
+ * Configuration object for initializing trackers in TrackerProvider
+ * @public
+ */
+export interface TrackerProviderConfig {
+    /** Unique key to identify the tracker */
+    key: string;
+    /** Tracker configuration options */
+    options: TrackerOptions;
+}
+/**
+ * Props for the TrackerProvider component
+ */
+interface TrackerProviderProps {
+    /** React children components */
+    children: ReactNode;
+    /** Array of default trackers to initialize on mount */
+    defaultTrackers?: TrackerProviderConfig[];
+}
+/**
+ * React context provider that manages multiple Tracker instances.
+ * Provides access to trackers throughout the component tree via useTrackerContext hook.
+ *
+ * @example
+ * ```tsx
+ * import { TrackerProvider, ReceiverEndpoint } from '@rakutenanalytics/rat-react';
+ *
+ * const trackers = [
+ *   { key: 'default', options: { accountId: 999, serviceId: 1 } },
+ *   { key: 'uk', options: { accountId: 123, serviceId: 1, mainReceiver: ReceiverEndpoint.UK } }
+ * ];
+ *
+ * function App() {
+ *   return (
+ *     <TrackerProvider defaultTrackers={trackers}>
+ *       <YourAppComponents />
+ *     </TrackerProvider>
+ *   );
+ * }
+ * ```
+ *
+ * @param props - The component props
+ * @returns Provider component that wraps children with tracker context
+ * @public
+ */
+export declare const TrackerProvider: ({ children, defaultTrackers, }: TrackerProviderProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/lib/VisibilityTracker.d.ts

@@ -0,0 +1,48 @@
+import { default as React } from 'react';
+import { Tracker } from '@rakutenanalytics/rat-ts';
+/**
+ * Props for the VisibilityTracker component
+ * @public
+ */
+export interface VisibilityTrackerProps {
+    /** React children to be rendered inside the visibility tracker */
+    children: React.ReactNode;
+    /** Optional tracker instance to send visibility events */
+    tracker?: Tracker;
+    /** Unique identifier for the component, used in tracking events */
+    id: string;
+    /** Callback function called when visibility changes */
+    onChange?: (isVisible: boolean) => void;
+    /** Whether to track visibility only once (default: true) */
+    once?: boolean;
+    /** Optional CSS styles to apply to the container */
+    style?: React.CSSProperties;
+}
+/**
+ * A React component that tracks when it becomes visible in the viewport
+ * and automatically sends an "appear" event to the provided tracker.
+ *
+ * @example
+ * ```tsx
+ * import { VisibilityTracker, useTracker } from '@rakutenanalytics/rat-react';
+ *
+ * function ProductCard() {
+ *   const tracker = useTracker({ accountId: 999, serviceId: 1 });
+ *
+ *   return (
+ *     <VisibilityTracker
+ *       tracker={tracker}
+ *       id="product-card-123"
+ *       once={true}
+ *     >
+ *       <div>Product content here</div>
+ *     </VisibilityTracker>
+ *   );
+ * }
+ * ```
+ *
+ * @param props - The component props
+ * @returns A div element that wraps the children and tracks visibility
+ * @public
+ */
+export declare const VisibilityTracker: React.FC<VisibilityTrackerProps>;

package/dist/lib/constants.d.ts

@@ -0,0 +1,10 @@
+/**
+ * The SDK source identifier for rat-react
+ * @internal
+ */
+export declare const SDK_SOURCE = "rat-react";
+/**
+ * The current version of rat-react SDK
+ * @internal
+ */
+export declare const SDK_VERSION: string;

package/dist/lib/createTracker.d.ts

@@ -0,0 +1,10 @@
+import { Tracker, TrackerOptions } from '@rakutenanalytics/rat-ts';
+/**
+ * Creates a Tracker instance with rat-react SDK identity.
+ * This utility ensures all trackers created within rat-react report the correct SDK source and version.
+ *
+ * @param options - Configuration options for the tracker
+ * @returns A new Tracker instance configured with rat-react SDK identity
+ * @internal
+ */
+export declare function createTracker(options: TrackerOptions): Tracker;

package/dist/lib/hooks/useVisibility.d.ts

@@ -0,0 +1,9 @@
+interface UseVisibilityOptions {
+    onChange?: (isVisible: boolean) => void;
+    once?: boolean;
+}
+declare function useVisibility(options: UseVisibilityOptions): {
+    isVisible: boolean;
+    containerRef: import('react').MutableRefObject<HTMLDivElement | null>;
+};
+export default useVisibility;

package/dist/lib/index.d.ts

@@ -0,0 +1,7 @@
+export { useTracker } from './useTracker';
+export { useTrackerContext } from './useTrackerContext';
+export { TrackerProvider } from './TrackerProvider';
+export { VisibilityTracker } from './VisibilityTracker';
+export type { TrackerProviderConfig } from './TrackerProvider';
+export { TransportMethod, ReceiverEndpoint, AflgEnum, ChkoutEnum, IfrEnum, IsscEnum, MnetwEnum, MoriEnum, NavtypeEnum, OaEnum, PglEnum, PgtEnum, PowerstatusEnum, SrtEnum, } from '@rakutenanalytics/rat-ts';
+export type { TrackerOptions, PageviewParams, ClickEventParams, InputGenericParams, } from '@rakutenanalytics/rat-ts';

package/dist/lib/useTracker.d.ts

@@ -0,0 +1,32 @@
+import { Tracker, TrackerOptions } from '@rakutenanalytics/rat-ts';
+/**
+ * React hook that creates and manages a Tracker instance.
+ * The tracker is initialized when the component mounts and recreated when accountId or serviceId changes.
+ *
+ * @example
+ * ```tsx
+ * import { useTracker } from '@rakutenanalytics/rat-react';
+ *
+ * function ProductPage() {
+ *   const tracker = useTracker({
+ *     accountId: 999,
+ *     serviceId: 1
+ *   });
+ *
+ *   React.useEffect(() => {
+ *     if (tracker) {
+ *       tracker.sendPageviewEvent({
+ *         params: { pageName: 'product' }
+ *       });
+ *     }
+ *   }, [tracker]);
+ *
+ *   return <div>Product content</div>;
+ * }
+ * ```
+ *
+ * @param options - Configuration options for the tracker
+ * @returns Tracker instance or null if not yet initialized
+ * @public
+ */
+export declare const useTracker: (options: TrackerOptions) => Tracker | null;

package/dist/lib/useTrackerContext.d.ts

@@ -0,0 +1,42 @@
+import { Tracker, TrackerOptions } from '@rakutenanalytics/rat-ts';
+/**
+ * Type definition for the tracker context
+ * @public
+ */
+export interface TrackerContextType {
+    /** Function to retrieve a tracker by its key */
+    getTracker: (key: string) => Tracker | undefined;
+    /** Function to add a new tracker with the given key and options */
+    addTracker: (key: string, options: TrackerOptions) => void;
+}
+export declare const TrackerContext: import('react').Context<TrackerContextType | undefined>;
+/**
+ * Hook to access the tracker context provided by TrackerProvider.
+ * Must be used within a TrackerProvider component.
+ *
+ * @example
+ * ```tsx
+ * import { useTrackerContext } from '@rakutenanalytics/rat-react';
+ *
+ * function MyComponent() {
+ *   const { getTracker, addTracker } = useTrackerContext();
+ *
+ *   const defaultTracker = getTracker('default');
+ *
+ *   const handleClick = () => {
+ *     if (defaultTracker) {
+ *       defaultTracker.sendClickEvent({
+ *         params: { itemId: ['product-123'] }
+ *       });
+ *     }
+ *   };
+ *
+ *   return <button onClick={handleClick}>Track Click</button>;
+ * }
+ * ```
+ *
+ * @returns The tracker context containing getTracker and addTracker functions
+ * @throws Error if used outside of a TrackerProvider
+ * @public
+ */
+export declare const useTrackerContext: () => TrackerContextType;

package/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@rakutenanalytics/rat-react",
+  "private": false,
+  "version": "0.3.1-rc.716ed0a",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/lib/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/lib/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    }
+  },
+  "files": [
+    "dist",
+    "LICENSE"
+  ],
+  "license": "MIT",
+  "repository": "https://github.com/rakutenanalytics/rat-react",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org",
+    "access": "public"
+  },
+  "peerDependencies": {
+    "react": ">=18.3.1 <20.0.0",
+    "react-dom": ">=18.3.1 <20.0.0"
+  },
+  "dependencies": {
+    "@rakutenanalytics/rat-ts": "^0.6.2"
+  }
+}