@thisbefine/analytics 0.1.0

package/dist/react/hooks.js

@@ -0,0 +1,186 @@
+"use client";
+import { useCallback } from "react";
+import { getAnalytics } from "../core/analytics";
+/**
+ * Get the analytics instance, throwing if not initialized
+ */
+const getAnalyticsOrThrow = () => {
+    const analytics = getAnalytics();
+    if (!analytics) {
+        throw new Error("Analytics not initialized. Make sure you have added <Analytics /> to your app.");
+    }
+    return analytics;
+};
+/**
+ * Hook to access the Analytics instance
+ *
+ * @throws Error if Analytics component has not been mounted
+ *
+ * @example
+ * ```tsx
+ * const analytics = useAnalytics();
+ *
+ * const handleClick = () => {
+ *   analytics.track('button_clicked', { buttonId: 'signup' });
+ * };
+ * ```
+ */
+export const useAnalytics = () => {
+    return getAnalyticsOrThrow();
+};
+/**
+ * Hook to get a memoized track function for a specific event
+ *
+ * This is useful for event handlers where you want to avoid
+ * creating new function references on each render.
+ *
+ * @param eventName - The name of the event to track
+ *
+ * @example
+ * ```tsx
+ * const trackSignup = useTrack('signup_clicked');
+ *
+ * return (
+ *   <button onClick={() => trackSignup({ location: 'header' })}>
+ *     Sign Up
+ *   </button>
+ * );
+ * ```
+ */
+export const useTrack = (eventName) => {
+    return useCallback((properties) => {
+        getAnalytics()?.track(eventName, properties);
+    }, [eventName]);
+};
+/**
+ * Hook to identify the current user
+ *
+ * Returns a memoized identify function.
+ *
+ * @example
+ * ```tsx
+ * const identify = useIdentify();
+ *
+ * // After login
+ * identify(user.id, {
+ *   email: user.email,
+ *   name: user.name,
+ *   plan: user.plan,
+ * });
+ * ```
+ */
+export const useIdentify = () => {
+    return useCallback((userId, traits) => {
+        getAnalytics()?.identify(userId, traits);
+    }, []);
+};
+/**
+ * Hook to associate the current user with an account/company
+ *
+ * Returns a memoized group function.
+ *
+ * @example
+ * ```tsx
+ * const group = useGroup();
+ *
+ * // After user selects workspace/company
+ * group(workspace.id, {
+ *   name: workspace.name,
+ *   plan: workspace.plan,
+ *   mrr: workspace.mrr,
+ * });
+ * ```
+ */
+export const useGroup = () => {
+    return useCallback((accountId, traits) => {
+        getAnalytics()?.group(accountId, traits);
+    }, []);
+};
+/**
+ * Hook to track page views
+ *
+ * Returns a memoized page function.
+ *
+ * @example
+ * ```tsx
+ * const trackPage = usePage();
+ *
+ * useEffect(() => {
+ *   trackPage('/dashboard', { section: 'overview' });
+ * }, [trackPage]);
+ * ```
+ */
+export const usePage = () => {
+    return useCallback((name, properties) => {
+        getAnalytics()?.page(name, properties);
+    }, []);
+};
+/**
+ * Hook to reset the analytics session (call on logout)
+ *
+ * @example
+ * ```tsx
+ * const resetAnalytics = useReset();
+ *
+ * const handleLogout = () => {
+ *   resetAnalytics();
+ *   // ... other logout logic
+ * };
+ * ```
+ */
+export const useReset = () => {
+    return useCallback(() => {
+        getAnalytics()?.reset();
+    }, []);
+};
+/**
+ * Hook to get the current user state
+ *
+ * @example
+ * ```tsx
+ * const getUser = useGetUser();
+ *
+ * const handleDebug = () => {
+ *   console.log(getUser());
+ *   // { anonymousId: '...', userId: '...', traits: { ... } }
+ * };
+ * ```
+ */
+export const useGetUser = () => {
+    return useCallback(() => {
+        return getAnalytics()?.getUser();
+    }, []);
+};
+/**
+ * Hook to capture exceptions
+ *
+ * @example
+ * ```tsx
+ * const captureException = useCaptureException();
+ *
+ * try { ... } catch (error) {
+ *   captureException(error as Error, { component: 'Checkout' });
+ * }
+ * ```
+ */
+export const useCaptureException = () => {
+    return useCallback((error, context) => {
+        getAnalytics()?.captureException(error, context);
+    }, []);
+};
+/**
+ * Hook to send structured log events
+ *
+ * @example
+ * ```tsx
+ * const log = useLog();
+ *
+ * log('User completed onboarding', 'info', { step: 3 });
+ * ```
+ */
+export const useLog = () => {
+    return useCallback((message, level, metadata) => {
+        getAnalytics()?.log(message, level, metadata);
+    }, []);
+};
+//# sourceMappingURL=hooks.js.map

package/dist/react/hooks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.js","sourceRoot":"","sources":["../../src/react/hooks.ts"],"names":[],"mappings":"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"}

package/dist/react.d.ts

@@ -0,0 +1,42 @@
+/**
+ * @thisbefine/analytics/react
+ *
+ * React integration for Thisbefine Analytics.
+ *
+ * @example
+ * ```tsx
+ * import { Analytics, useTrack } from '@thisbefine/analytics/react';
+ *
+ * // Add to your root layout (reads from NEXT_PUBLIC_TBF_API_KEY)
+ * function RootLayout({ children }) {
+ *   return (
+ *     <html>
+ *       <body>
+ *         {children}
+ *         <Analytics />
+ *       </body>
+ *     </html>
+ *   );
+ * }
+ *
+ * // Use in components
+ * function SignupButton() {
+ *   const trackSignup = useTrack('signup_clicked');
+ *
+ *   return (
+ *     <button onClick={() => trackSignup({ location: 'header' })}>
+ *       Sign Up
+ *     </button>
+ *   );
+ * }
+ * ```
+ *
+ * @packageDocumentation
+ */
+export type { AccountTraits, Analytics as AnalyticsInstance, AnalyticsConfig, UserState, UserTraits, } from "./core/types";
+export type { AnalyticsProps } from "./react/analytics";
+export { Analytics } from "./react/analytics";
+export type { BugReportFABProps } from "./react/bug-report-widget";
+export { BugReportFAB } from "./react/bug-report-widget";
+export { useAnalytics, useCaptureException, useGetUser, useGroup, useIdentify, useLog, usePage, useReset, useTrack, } from "./react/hooks";
+//# sourceMappingURL=react.d.ts.map

package/dist/react.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.d.ts","sourceRoot":"","sources":["../src/react.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAEH,YAAY,EACX,aAAa,EACb,SAAS,IAAI,iBAAiB,EAC9B,eAAe,EACf,SAAS,EACT,UAAU,GACV,MAAM,cAAc,CAAC;AAEtB,YAAY,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAE9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AACnE,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEzD,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,UAAU,EACV,QAAQ,EACR,WAAW,EACX,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,GACR,MAAM,eAAe,CAAC"}

package/dist/react.js

@@ -0,0 +1,39 @@
+/**
+ * @thisbefine/analytics/react
+ *
+ * React integration for Thisbefine Analytics.
+ *
+ * @example
+ * ```tsx
+ * import { Analytics, useTrack } from '@thisbefine/analytics/react';
+ *
+ * // Add to your root layout (reads from NEXT_PUBLIC_TBF_API_KEY)
+ * function RootLayout({ children }) {
+ *   return (
+ *     <html>
+ *       <body>
+ *         {children}
+ *         <Analytics />
+ *       </body>
+ *     </html>
+ *   );
+ * }
+ *
+ * // Use in components
+ * function SignupButton() {
+ *   const trackSignup = useTrack('signup_clicked');
+ *
+ *   return (
+ *     <button onClick={() => trackSignup({ location: 'header' })}>
+ *       Sign Up
+ *     </button>
+ *   );
+ * }
+ * ```
+ *
+ * @packageDocumentation
+ */
+export { Analytics } from "./react/analytics";
+export { BugReportFAB } from "./react/bug-report-widget";
+export { useAnalytics, useCaptureException, useGetUser, useGroup, useIdentify, useLog, usePage, useReset, useTrack, } from "./react/hooks";
+//# sourceMappingURL=react.js.map

package/dist/react.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react.js","sourceRoot":"","sources":["../src/react.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AAWH,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAG9C,OAAO,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAEzD,OAAO,EACN,YAAY,EACZ,mBAAmB,EACnB,UAAU,EACV,QAAQ,EACR,WAAW,EACX,MAAM,EACN,OAAO,EACP,QAAQ,EACR,QAAQ,GACR,MAAM,eAAe,CAAC"}

package/dist/widget/bug-report.d.ts

@@ -0,0 +1,16 @@
+import type { Analytics } from "../core/types";
+export interface BugReportWidgetOptions {
+    /** FAB position. Default: "bottom-right" */
+    position?: "bottom-right" | "bottom-left";
+    /** FAB button color. Default: "#ef4444" (red) */
+    buttonColor?: string;
+    /** FAB button text. Default: "Report Bug" */
+    buttonText?: string;
+}
+/**
+ * Create and mount the bug report widget
+ */
+export declare const createBugReportWidget: (analytics: Analytics, options?: BugReportWidgetOptions) => {
+    destroy: () => void;
+};
+//# sourceMappingURL=bug-report.d.ts.map

package/dist/widget/bug-report.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bug-report.d.ts","sourceRoot":"","sources":["../../src/widget/bug-report.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE/C,MAAM,WAAW,sBAAsB;IACtC,4CAA4C;IAC5C,QAAQ,CAAC,EAAE,cAAc,GAAG,aAAa,CAAC;IAC1C,iDAAiD;IACjD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;CACpB;AAuND;;GAEG;AACH,eAAO,MAAM,qBAAqB,GACjC,WAAW,SAAS,EACpB,UAAU,sBAAsB,KAC9B;IAAE,OAAO,EAAE,MAAM,IAAI,CAAA;CAgPvB,CAAC"}