@hanzo/insights-react 1.8.1 → 1.9.1

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2020-2025 PostHog, Inc.
+Copyright (c) 2020-2025 Insights, Inc.
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -1,65 +1,65 @@
-# @posthog/react
+# @hanzo/react
 
-React components and hooks for PostHog analytics integration.
+React components and hooks for Insights analytics integration.
 
-[SEE FULL DOCS](https://posthog.com/docs/libraries/react)
+[SEE FULL DOCS](https://insights.hanzo.ai/docs/libraries/react)
 
 ## Installation
 
 ```bash
-npm install @posthog/react posthog-js
+npm install @hanzo/react @hanzo/insights
 ```
 
 ## Usage
 
 ### Setting up the Provider
 
-Wrap your application with `PostHogProvider` to make the PostHog client available throughout your app:
+Wrap your application with `InsightsProvider` to make the Insights client available throughout your app:
 
 ```tsx
-import { PostHogProvider } from '@posthog/react'
+import { InsightsProvider } from '@hanzo/react'
 
 function App() {
     return (
-        <PostHogProvider apiKey="<YOUR_PROJECT_API_KEY>" options={{ api_host: 'https://us.i.posthog.com' }}>
+        <InsightsProvider apiKey="<YOUR_PROJECT_API_KEY>" options={{ api_host: 'https://us.i.insights.hanzo.ai' }}>
             <YourApp />
-        </PostHogProvider>
+        </InsightsProvider>
     )
 }
 ```
 
-Or pass an existing PostHog client instance:
+Or pass an existing Insights client instance:
 
 ```tsx
-import posthog from 'posthog-js'
-import { PostHogProvider } from '@posthog/react'
+import insights from '@hanzo/insights'
+import { InsightsProvider } from '@hanzo/react'
 
 // Initialize your client
-posthog.init('<YOUR_PROJECT_API_KEY>', { api_host: 'https://us.i.posthog.com' })
+insights.init('<YOUR_PROJECT_API_KEY>', { api_host: 'https://us.i.insights.hanzo.ai' })
 
 function App() {
     return (
-        <PostHogProvider client={posthog}>
+        <InsightsProvider client={insights}>
             <YourApp />
-        </PostHogProvider>
+        </InsightsProvider>
     )
 }
 ```
 
 ### Hooks
 
-#### usePostHog
+#### useInsights
 
-Access the PostHog client instance to capture events, identify users, etc.
+Access the Insights client instance to capture events, identify users, etc.
 
 ```tsx
-import { usePostHog } from '@posthog/react'
+import { useInsights } from '@hanzo/react'
 
 function MyComponent() {
-    const posthog = usePostHog()
+    const insights = useInsights()
 
     const handleClick = () => {
-        posthog.capture('button_clicked', { button_name: 'signup' })
+        insights.capture('button_clicked', { button_name: 'signup' })
     }
 
     return <button onClick={handleClick}>Sign Up</button>
@@ -71,7 +71,7 @@ function MyComponent() {
 Check if a feature flag is enabled for the current user.
 
 ```tsx
-import { useFeatureFlagEnabled } from '@posthog/react'
+import { useFeatureFlagEnabled } from '@hanzo/react'
 
 function MyComponent() {
     const isEnabled = useFeatureFlagEnabled('new-feature')
@@ -88,7 +88,7 @@ function MyComponent() {
 Get the variant key for a multivariate feature flag.
 
 ```tsx
-import { useFeatureFlagVariantKey } from '@posthog/react'
+import { useFeatureFlagVariantKey } from '@hanzo/react'
 
 function MyComponent() {
     const variant = useFeatureFlagVariantKey('experiment-flag')
@@ -108,7 +108,7 @@ function MyComponent() {
 Get the payload associated with a feature flag.
 
 ```tsx
-import { useFeatureFlagPayload } from '@posthog/react'
+import { useFeatureFlagPayload } from '@hanzo/react'
 
 function MyComponent() {
     const payload = useFeatureFlagPayload('feature-with-payload')
@@ -122,7 +122,7 @@ function MyComponent() {
 Get all active feature flags for the current user.
 
 ```tsx
-import { useActiveFeatureFlags } from '@posthog/react'
+import { useActiveFeatureFlags } from '@hanzo/react'
 
 function MyComponent() {
     const activeFlags = useActiveFeatureFlags()
@@ -139,60 +139,60 @@ function MyComponent() {
 
 ### Components
 
-#### PostHogFeature
+#### InsightsFeature
 
 A component that renders content based on a feature flag's value. Automatically tracks feature views and interactions.
 
 ```tsx
-import { PostHogFeature } from '@posthog/react'
+import { InsightsFeature } from '@hanzo/react'
 
 function MyComponent() {
     return (
-        <PostHogFeature flag="new-cta" fallback={<OldButton />}>
+        <InsightsFeature flag="new-cta" fallback={<OldButton />}>
             <NewButton />
-        </PostHogFeature>
+        </InsightsFeature>
     )
 }
 
 // With variant matching
 function MyComponent() {
     return (
-        <PostHogFeature flag="experiment" match="test" fallback={<ControlVersion />}>
+        <InsightsFeature flag="experiment" match="test" fallback={<ControlVersion />}>
             <TestVersion />
-        </PostHogFeature>
+        </InsightsFeature>
     )
 }
 
 // With payload as render function
 function MyComponent() {
     return (
-        <PostHogFeature flag="banner-config">
+        <InsightsFeature flag="banner-config">
             {(payload) => <Banner title={payload.title} color={payload.color} />}
-        </PostHogFeature>
+        </InsightsFeature>
     )
 }
 ```
 
-#### PostHogErrorBoundary
+#### InsightsErrorBoundary
 
-An error boundary that captures React errors and reports them to PostHog.
+An error boundary that captures React errors and reports them to Insights.
 
 ```tsx
-import { PostHogErrorBoundary } from '@posthog/react'
+import { InsightsErrorBoundary } from '@hanzo/react'
 
 function App() {
     return (
-        <PostHogProvider apiKey="<YOUR_PROJECT_API_KEY>">
-            <PostHogErrorBoundary>
+        <InsightsProvider apiKey="<YOUR_PROJECT_API_KEY>">
+            <InsightsErrorBoundary>
                 <YourApp />
-            </PostHogErrorBoundary>
-        </PostHogProvider>
+            </InsightsErrorBoundary>
+        </InsightsProvider>
     )
 }
 ```
 
-Please see the main [PostHog docs](https://www.posthog.com/docs).
+Please see the main [Insights docs](https://www.insights.hanzo.ai/docs).
 
 ## Questions?
 
-### [Check out our community page.](https://posthog.com/posts)
+### [Check out our community page.](https://insights.hanzo.ai/posts)

package/dist/esm/index.js

@@ -1,8 +1,8 @@
-import posthogJs from '@hanzo/insights';
+import insightsJs from '@hanzo/insights';
 import React, { createContext, useRef, useMemo, useEffect, useContext, useState, useCallback, Children } from 'react';
 
-var PostHogContext = createContext({
-    client: posthogJs,
+var InsightsContext = createContext({
+    client: insightsJs,
     bootstrap: undefined,
 });
 
@@ -35,25 +35,25 @@ function isDeepEqual(obj1, obj2, visited) {
     return true;
 }
 
-function PostHogProvider(_a) {
+function InsightsProvider(_a) {
     var _b, _c;
     var children = _a.children, client = _a.client, apiKey = _a.apiKey, options = _a.options;
     var previousInitializationRef = useRef(null);
-    var posthog = useMemo(function () {
+    var insights = useMemo(function () {
         if (client) {
             if (apiKey) {
-                console.warn('[PostHog.js] You have provided both `client` and `apiKey` to `PostHogProvider`. `apiKey` will be ignored in favour of `client`.');
+                console.warn('[Insights] You have provided both `client` and `apiKey` to `InsightsProvider`. `apiKey` will be ignored in favour of `client`.');
             }
             if (options) {
-                console.warn('[PostHog.js] You have provided both `client` and `options` to `PostHogProvider`. `options` will be ignored in favour of `client`.');
+                console.warn('[Insights] You have provided both `client` and `options` to `InsightsProvider`. `options` will be ignored in favour of `client`.');
             }
             return client;
         }
         if (apiKey) {
-            return posthogJs;
+            return insightsJs;
         }
-        console.warn('[PostHog.js] No `apiKey` or `client` were provided to `PostHogProvider`. Using default global `window.posthog` instance. You must initialize it manually. This is not recommended behavior.');
-        return posthogJs;
+        console.warn('[Insights] No `apiKey` or `client` were provided to `InsightsProvider`. Using default global instance. You must initialize it manually. This is not recommended behavior.');
+        return insightsJs;
     }, [client, apiKey, JSON.stringify(options)]);
     useEffect(function () {
         if (client) {
@@ -61,10 +61,10 @@ function PostHogProvider(_a) {
         }
         var previousInitialization = previousInitializationRef.current;
         if (!previousInitialization) {
-            if (posthogJs.__loaded) {
-                console.warn('[PostHog.js] `posthog` was already loaded elsewhere. This may cause issues.');
+            if (insightsJs.__loaded) {
+                console.warn('[Insights] `insights` was already loaded elsewhere. This may cause issues.');
             }
-            posthogJs.init(apiKey, options);
+            insightsJs.init(apiKey, options);
             previousInitializationRef.current = {
                 apiKey: apiKey,
                 options: options !== null && options !== void 0 ? options : {},
@@ -72,10 +72,10 @@ function PostHogProvider(_a) {
         }
         else {
             if (apiKey !== previousInitialization.apiKey) {
-                console.warn("[PostHog.js] You have provided a different `apiKey` to `PostHogProvider` than the one that was already initialized. This is not supported by our provider and we'll keep using the previous key. If you need to toggle between API Keys you need to control the `client` yourself and pass it in as a prop rather than an `apiKey` prop.");
+                console.warn("[Insights] You have provided a different `apiKey` to `InsightsProvider` than the one that was already initialized. This is not supported by our provider and we'll keep using the previous key. If you need to toggle between API Keys you need to control the `client` yourself and pass it in as a prop rather than an `apiKey` prop.");
             }
             if (options && !isDeepEqual(options, previousInitialization.options)) {
-                posthogJs.set_config(options);
+                insightsJs.set_config(options);
             }
             previousInitializationRef.current = {
                 apiKey: apiKey,
@@ -83,7 +83,7 @@ function PostHogProvider(_a) {
             };
         }
     }, [client, apiKey, JSON.stringify(options)]);
-    return (React.createElement(PostHogContext.Provider, { value: { client: posthog, bootstrap: (_b = options === null || options === void 0 ? void 0 : options.bootstrap) !== null && _b !== void 0 ? _b : (_c = client === null || client === void 0 ? void 0 : client.config) === null || _c === void 0 ? void 0 : _c.bootstrap } }, children));
+    return (React.createElement(InsightsContext.Provider, { value: { client: insights, bootstrap: (_b = options === null || options === void 0 ? void 0 : options.bootstrap) !== null && _b !== void 0 ? _b : (_c = client === null || client === void 0 ? void 0 : client.config) === null || _c === void 0 ? void 0 : _c.bootstrap } }, children));
 }
 
 var isFunction = function (f) {
@@ -98,7 +98,7 @@ var isNull = function (x) {
 
 function useFeatureFlagEnabled(flag) {
     var _a, _b;
-    var _c = useContext(PostHogContext), client = _c.client, bootstrap = _c.bootstrap;
+    var _c = useContext(InsightsContext), client = _c.client, bootstrap = _c.bootstrap;
     var _d = useState(function () { return client.isFeatureEnabled(flag); }), featureEnabled = _d[0], setFeatureEnabled = _d[1];
     useEffect(function () {
         return client.onFeatureFlags(function () {
@@ -114,7 +114,7 @@ function useFeatureFlagEnabled(flag) {
 
 function useFeatureFlagPayload(flag) {
     var _a;
-    var _b = useContext(PostHogContext), client = _b.client, bootstrap = _b.bootstrap;
+    var _b = useContext(InsightsContext), client = _b.client, bootstrap = _b.bootstrap;
     var _c = useState(function () { return client.getFeatureFlagPayload(flag); }), featureFlagPayload = _c[0], setFeatureFlagPayload = _c[1];
     useEffect(function () {
         return client.onFeatureFlags(function () {
@@ -129,7 +129,7 @@ function useFeatureFlagPayload(flag) {
 
 function useFeatureFlagResult(flag) {
     var _a, _b;
-    var _c = useContext(PostHogContext), client = _c.client, bootstrap = _c.bootstrap;
+    var _c = useContext(InsightsContext), client = _c.client, bootstrap = _c.bootstrap;
     var _d = useState(function () { return client.getFeatureFlagResult(flag); }), result = _d[0], setResult = _d[1];
     useEffect(function () {
         return client.onFeatureFlags(function () {
@@ -153,7 +153,7 @@ function useFeatureFlagResult(flag) {
 
 function useActiveFeatureFlags() {
     var _a;
-    var _b = useContext(PostHogContext), client = _b.client, bootstrap = _b.bootstrap;
+    var _b = useContext(InsightsContext), client = _b.client, bootstrap = _b.bootstrap;
     var _c = useState(function () { return client.featureFlags.getFlags(); }), featureFlags = _c[0], setFeatureFlags = _c[1];
     useEffect(function () {
         return client.onFeatureFlags(function (flags) {
@@ -168,7 +168,7 @@ function useActiveFeatureFlags() {
 
 function useFeatureFlagVariantKey(flag) {
     var _a;
-    var _b = useContext(PostHogContext), client = _b.client, bootstrap = _b.bootstrap;
+    var _b = useContext(InsightsContext), client = _b.client, bootstrap = _b.bootstrap;
     var _c = useState(function () {
         return client.getFeatureFlag(flag);
     }), featureFlagVariantKey = _c[0], setFeatureFlagVariantKey = _c[1];
@@ -183,8 +183,8 @@ function useFeatureFlagVariantKey(flag) {
     return featureFlagVariantKey;
 }
 
-var usePostHog = function () {
-    var client = useContext(PostHogContext).client;
+var useInsights = function () {
+    var client = useContext(InsightsContext).client;
     return client;
 };
 
@@ -286,24 +286,24 @@ function VisibilityAndClickTrackers(_a) {
     return React.createElement(React.Fragment, null, trackedChildren);
 }
 
-function PostHogFeature(_a) {
+function InsightsFeature(_a) {
     var flag = _a.flag, match = _a.match, children = _a.children, fallback = _a.fallback, visibilityObserverOptions = _a.visibilityObserverOptions, trackInteraction = _a.trackInteraction, trackView = _a.trackView, props = __rest(_a, ["flag", "match", "children", "fallback", "visibilityObserverOptions", "trackInteraction", "trackView"]);
     var payload = useFeatureFlagPayload(flag);
     var variant = useFeatureFlagVariantKey(flag);
-    var posthog = usePostHog();
+    var insights = useInsights();
     var shouldTrackInteraction = trackInteraction !== null && trackInteraction !== void 0 ? trackInteraction : true;
     var shouldTrackView = trackView !== null && trackView !== void 0 ? trackView : true;
     if (!isUndefined(variant)) {
         if (isUndefined(match) || variant === match) {
             var childNode = isFunction(children) ? children(payload) : children;
-            return (React.createElement(VisibilityAndClickTrackers, __assign({ flag: flag, options: visibilityObserverOptions, trackInteraction: shouldTrackInteraction, trackView: shouldTrackView, onInteract: function () { return captureFeatureInteraction({ flag: flag, posthog: posthog, flagVariant: variant }); }, onView: function () { return captureFeatureView({ flag: flag, posthog: posthog, flagVariant: variant }); } }, props), childNode));
+            return (React.createElement(VisibilityAndClickTrackers, __assign({ flag: flag, options: visibilityObserverOptions, trackInteraction: shouldTrackInteraction, trackView: shouldTrackView, onInteract: function () { return captureFeatureInteraction({ flag: flag, insights: insights, flagVariant: variant }); }, onView: function () { return captureFeatureView({ flag: flag, insights: insights, flagVariant: variant }); } }, props), childNode));
         }
     }
     return React.createElement(React.Fragment, null, fallback);
 }
 function captureFeatureInteraction(_a) {
     var _b;
-    var flag = _a.flag, posthog = _a.posthog, flagVariant = _a.flagVariant;
+    var flag = _a.flag, insights = _a.insights, flagVariant = _a.flagVariant;
     var properties = {
         feature_flag: flag,
         $set: (_b = {}, _b["$feature_interaction/".concat(flag)] = flagVariant !== null && flagVariant !== void 0 ? flagVariant : true, _b),
@@ -311,11 +311,11 @@ function captureFeatureInteraction(_a) {
     if (typeof flagVariant === 'string') {
         properties.feature_flag_variant = flagVariant;
     }
-    posthog.capture('$feature_interaction', properties);
+    insights.capture('$feature_interaction', properties);
 }
 function captureFeatureView(_a) {
     var _b;
-    var flag = _a.flag, posthog = _a.posthog, flagVariant = _a.flagVariant;
+    var flag = _a.flag, insights = _a.insights, flagVariant = _a.flagVariant;
     var properties = {
         feature_flag: flag,
         $set: (_b = {}, _b["$feature_view/".concat(flag)] = flagVariant !== null && flagVariant !== void 0 ? flagVariant : true, _b),
@@ -323,31 +323,31 @@ function captureFeatureView(_a) {
     if (typeof flagVariant === 'string') {
         properties.feature_flag_variant = flagVariant;
     }
-    posthog.capture('$feature_view', properties);
+    insights.capture('$feature_view', properties);
 }
 
 function TrackedChild(_a) {
     var child = _a.child, index = _a.index, name = _a.name, properties = _a.properties, observerOptions = _a.observerOptions;
     var trackedRef = useRef(false);
-    var posthog = usePostHog();
+    var insights = useInsights();
     var onIntersect = useCallback(function (entry) {
         if (entry.isIntersecting && !trackedRef.current) {
-            posthog.capture('$element_viewed', __assign({ element_name: name, child_index: index }, properties));
+            insights.capture('$element_viewed', __assign({ element_name: name, child_index: index }, properties));
             trackedRef.current = true;
         }
-    }, [posthog, name, index, properties]);
+    }, [insights, name, index, properties]);
     return (React.createElement(VisibilityAndClickTracker, { onIntersect: onIntersect, trackView: true, options: observerOptions }, child));
 }
-function PostHogCaptureOnViewed(_a) {
+function InsightsCaptureOnViewed(_a) {
     var name = _a.name, properties = _a.properties, observerOptions = _a.observerOptions, trackAllChildren = _a.trackAllChildren, children = _a.children, props = __rest(_a, ["name", "properties", "observerOptions", "trackAllChildren", "children"]);
     var trackedRef = useRef(false);
-    var posthog = usePostHog();
+    var insights = useInsights();
     var onIntersect = useCallback(function (entry) {
         if (entry.isIntersecting && !trackedRef.current) {
-            posthog.capture('$element_viewed', __assign({ element_name: name }, properties));
+            insights.capture('$element_viewed', __assign({ element_name: name }, properties));
             trackedRef.current = true;
         }
-    }, [posthog, name, properties]);
+    }, [insights, name, properties]);
     if (trackAllChildren) {
         var trackedChildren = Children.map(children, function (child, index) {
             return (React.createElement(TrackedChild, { key: index, child: child, index: index, name: name, properties: properties, observerOptions: observerOptions }));
@@ -362,17 +362,17 @@ var INITIAL_STATE = {
     exceptionEvent: null,
     error: null,
 };
-var __POSTHOG_ERROR_MESSAGES = {
-    INVALID_FALLBACK: '[PostHog.js][PostHogErrorBoundary] Invalid fallback prop, provide a valid React element or a function that returns a valid React element.',
+var __INSIGHTS_ERROR_MESSAGES = {
+    INVALID_FALLBACK: '[Insights][InsightsErrorBoundary] Invalid fallback prop, provide a valid React element or a function that returns a valid React element.',
 };
-var PostHogErrorBoundary = (function (_super) {
-    __extends(PostHogErrorBoundary, _super);
-    function PostHogErrorBoundary(props) {
+var InsightsErrorBoundary = (function (_super) {
+    __extends(InsightsErrorBoundary, _super);
+    function InsightsErrorBoundary(props) {
         var _this = _super.call(this, props) || this;
         _this.state = INITIAL_STATE;
         return _this;
     }
-    PostHogErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {
+    InsightsErrorBoundary.prototype.componentDidCatch = function (error, errorInfo) {
         var additionalProperties = this.props.additionalProperties;
         var currentProperties;
         if (isFunction(additionalProperties)) {
@@ -390,7 +390,7 @@ var PostHogErrorBoundary = (function (_super) {
             exceptionEvent: exceptionEvent,
         });
     };
-    PostHogErrorBoundary.prototype.render = function () {
+    InsightsErrorBoundary.prototype.render = function () {
         var _a = this.props, children = _a.children, fallback = _a.fallback;
         var state = this.state;
         if (state.componentStack == null) {
@@ -406,11 +406,11 @@ var PostHogErrorBoundary = (function (_super) {
         if (React.isValidElement(element)) {
             return element;
         }
-        console.warn(__POSTHOG_ERROR_MESSAGES.INVALID_FALLBACK);
+        console.warn(__INSIGHTS_ERROR_MESSAGES.INVALID_FALLBACK);
         return React.createElement(React.Fragment, null);
     };
-    PostHogErrorBoundary.contextType = PostHogContext;
-    return PostHogErrorBoundary;
+    InsightsErrorBoundary.contextType = InsightsContext;
+    return InsightsErrorBoundary;
 }(React.Component));
 
 var setupReactErrorHandler = function (client, callback) {
@@ -422,5 +422,5 @@ var setupReactErrorHandler = function (client, callback) {
     };
 };
 
-export { PostHogCaptureOnViewed, PostHogContext, PostHogErrorBoundary, PostHogFeature, PostHogProvider, captureFeatureInteraction, captureFeatureView, setupReactErrorHandler, useActiveFeatureFlags, useFeatureFlagEnabled, useFeatureFlagPayload, useFeatureFlagResult, useFeatureFlagVariantKey, usePostHog };
+export { InsightsCaptureOnViewed, InsightsContext, InsightsErrorBoundary, InsightsFeature, InsightsProvider, captureFeatureInteraction, captureFeatureView, setupReactErrorHandler, useActiveFeatureFlags, useFeatureFlagEnabled, useFeatureFlagPayload, useFeatureFlagResult, useFeatureFlagVariantKey, useInsights };
 //# sourceMappingURL=index.js.map