@rolloutly/react 0.1.2 → 0.1.4

package/README.md

@@ -70,6 +70,14 @@ function Banner() {
     'api-rate-limit': 100,
   }}
   
+  // Optional: User context for targeting rules
+  user={{
+    userId: 'user-123',
+    email: 'alice@example.com',
+    orgId: 'acme-corp',
+    plan: 'pro',
+  }}
+  
   // Optional: Enable debug logging
   debug={false}
   
@@ -80,6 +88,73 @@ function Banner() {
 </RolloutlyProvider>
 ```
 
+## User Targeting
+
+Pass user context to enable personalized flag values based on targeting rules.
+
+### Static User Context
+
+```tsx
+function App() {
+  const user = {
+    userId: 'user-123',
+    email: 'alice@example.com',
+    orgId: 'acme-corp',
+    plan: 'pro',
+    role: 'admin',
+    // Custom attributes
+    betaUser: true,
+  };
+
+  return (
+    <RolloutlyProvider token="rly_xxx" user={user}>
+      <MyApp />
+    </RolloutlyProvider>
+  );
+}
+```
+
+### Dynamic User Identification
+
+Use `identify()` and `reset()` to manage user context dynamically:
+
+```tsx
+function AuthComponent() {
+  const { identify, reset } = useRolloutly();
+
+  const handleLogin = async (user) => {
+    await identify({
+      userId: user.id,
+      email: user.email,
+      orgId: user.organizationId,
+      plan: user.subscription.plan,
+    });
+  };
+
+  const handleLogout = async () => {
+    await reset();
+  };
+
+  return (
+    <>
+      <button onClick={() => handleLogin(currentUser)}>Login</button>
+      <button onClick={handleLogout}>Logout</button>
+    </>
+  );
+}
+```
+
+### User Context Properties
+
+| Property | Type | Description |
+|----------|------|-------------|
+| `userId` | `string` | Unique user identifier |
+| `email` | `string` | User's email address |
+| `orgId` | `string` | Organization/company ID |
+| `plan` | `string` | Subscription plan |
+| `role` | `string` | User's role |
+| `[key]` | `string \| number \| boolean \| string[]` | Custom attributes |
+
 ## Hooks
 
 ### `useFlag<T>(key: string): T | undefined`
@@ -107,28 +182,48 @@ if (showBanner) {
 
 Get all flag values as a key-value object. This is the recommended way to access multiple flags.
 
+**CamelCase Support:** Flag keys with hyphens or underscores are automatically available in camelCase for easy destructuring!
+
 ```tsx
 const flags = useFlags();
 
-// Access by key
-const myFeature = flags['my-feature'];
+// Access by original key
+const myFeature = flags['instagram-integration'];
 
-// Or destructure (use bracket notation for keys with dashes)
-const { 'new-checkout': newCheckout, 'show-banner': showBanner } = useFlags();
+// Or use camelCase version (automatically available!)
+const myFeature = flags.instagramIntegration;
 
-// For keys without dashes, simple destructuring works
-const { myFeature, anotherFlag } = useFlags();
+// Clean destructuring with camelCase
+const { instagramIntegration, newCheckout, showBanner } = useFlags();
+
+// Both formats work:
+// 'instagram-integration' -> instagramIntegration
+// 'my_feature_flag' -> myFeatureFlag
 ```
 
 ### `useRolloutly(): RolloutlyContextValue`
 
-Get the Rolloutly context including loading and error states.
+Get the Rolloutly context including loading states, error handling, and user management.
 
 ```tsx
-const { isLoading, isError, error, getFlag, isEnabled } = useRolloutly();
+const { 
+  isLoading, 
+  isError, 
+  error, 
+  getFlag, 
+  isEnabled,
+  identify,  // Update user context
+  reset,     // Clear user context
+} = useRolloutly();
 
 if (isLoading) return <Spinner />;
 if (isError) return <Error message={error?.message} />;
+
+// Identify user (e.g., after login)
+await identify({ userId: 'user-123', email: 'alice@example.com' });
+
+// Reset user context (e.g., on logout)
+await reset();
 ```
 
 ### `useRolloutlyClient(): RolloutlyClient`

package/dist/index.cjs

@@ -17,21 +17,34 @@ function RolloutlyProvider({
   baseUrl,
   realtimeEnabled = true,
   defaultFlags,
+  user,
   debug = false,
   loadingComponent
 }) {
   const [isLoading, setIsLoading] = react.useState(true);
   const [isError, setIsError] = react.useState(false);
   const [error, setError] = react.useState(null);
+  const prevUserRef = react.useRef(user);
   const client = react.useMemo(() => {
     return new core.RolloutlyClient({
       token,
       baseUrl,
       realtimeEnabled,
       defaultFlags,
+      user,
       debug
     });
   }, [token, baseUrl, realtimeEnabled, defaultFlags, debug]);
+  react.useEffect(() => {
+    if (prevUserRef.current !== user && client) {
+      prevUserRef.current = user;
+      if (user) {
+        void client.identify(user);
+      } else {
+        void client.reset();
+      }
+    }
+  }, [user, client]);
   react.useEffect(() => {
     let mounted = true;
     client.waitForInit().then(() => {
@@ -88,12 +101,23 @@ function useRolloutly() {
     },
     [client]
   );
+  const identify = react.useCallback(
+    async (user) => {
+      return client.identify(user);
+    },
+    [client]
+  );
+  const reset = react.useCallback(async () => {
+    return client.reset();
+  }, [client]);
   return {
     isLoading,
     isError,
     error,
     getFlag,
-    isEnabled
+    isEnabled,
+    identify,
+    reset
   };
 }
 function useFlag(key) {

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/provider.tsx"],"names":["createContext","useState","useMemo","RolloutlyClient","useEffect","useContext","useCallback","useSyncExternalStore"],"mappings":";;;;;;;AAeA,IAAM,mBAAmBA,mBAAA,CAKtB;AAAA,EACD,MAAA,EAAQ,IAAA;AAAA,EACR,SAAA,EAAW,IAAA;AAAA,EACX,OAAA,EAAS,KAAA;AAAA,EACT,KAAA,EAAO;AACT,CAAC,CAAA;AAKM,SAAS,iBAAA,CAAkB;AAAA,EAChC,KAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,eAAA,GAAkB,IAAA;AAAA,EAClB,YAAA;AAAA,EACA,KAAA,GAAQ,KAAA;AAAA,EACR;AACF,CAAA,EAAwC;AACtC,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAIC,eAAS,IAAI,CAAA;AAC/C,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAIA,eAAS,KAAK,CAAA;AAC5C,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAIA,eAAuB,IAAI,CAAA;AAErD,EAAA,MAAM,MAAA,GAASC,cAAQ,MAAM;AAC3B,IAAA,OAAO,IAAIC,oBAAA,CAAgB;AAAA,MACzB,KAAA;AAAA,MACA,OAAA;AAAA,MACA,eAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA,KACD,CAAA;AAAA,EACH,GAAG,CAAC,KAAA,EAAO,SAAS,eAAA,EAAiB,YAAA,EAAc,KAAK,CAAC,CAAA;AAEzD,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,OAAA,GAAU,IAAA;AAEd,IAAA,MAAA,CACG,WAAA,EAAY,CACZ,IAAA,CAAK,MAAM;AACV,MAAA,IAAI,OAAA,EAAS;AACX,QAAA,YAAA,CAAa,KAAK,CAAA;AAAA,MACpB;AAAA,IACF,CAAC,CAAA,CACA,KAAA,CAAM,CAAC,GAAA,KAAQ;AACd,MAAA,IAAI,OAAA,EAAS;AACX,QAAA,UAAA,CAAW,IAAI,CAAA;AACf,QAAA,QAAA,CAAS,GAAA,YAAe,QAAQ,GAAA,GAAM,IAAI,MAAM,MAAA,CAAO,GAAG,CAAC,CAAC,CAAA;AAC5D,QAAA,YAAA,CAAa,KAAK,CAAA;AAAA,MACpB;AAAA,IACF,CAAC,CAAA;AAEH,IAAA,OAAO,MAAM;AACX,MAAA,OAAA,GAAU,KAAA;AACV,MAAA,MAAA,CAAO,KAAA,EAAM;AAAA,IACf,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,MAAM,YAAA,GAAeF,aAAA;AAAA,IACnB,OAAO;AAAA,MACL,MAAA;AAAA,MACA,SAAA;AAAA,MACA,OAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA,CAAC,MAAA,EAAQ,SAAA,EAAW,OAAA,EAAS,KAAK;AAAA,GACpC;AAEA,EAAA,IAAI,aAAa,gBAAA,EAAkB;AACjC,IAAA,6DAAU,QAAA,EAAA,gBAAA,EAAiB,CAAA;AAAA,EAC7B;AAEA,EAAA,sCACG,gBAAA,CAAiB,QAAA,EAAjB,EAA0B,KAAA,EAAO,cAC/B,QAAA,EACH,CAAA;AAEJ;AAKO,SAAS,kBAAA,GAAsC;AACpD,EAAA,MAAM,EAAE,MAAA,EAAO,GAAIG,gBAAA,CAAW,gBAAgB,CAAA;AAE9C,EAAA,IAAI,CAAC,MAAA,EAAQ;AACX,IAAA,MAAM,IAAI,MAAM,0DAA0D,CAAA;AAAA,EAC5E;AAEA,EAAA,OAAO,MAAA;AACT;AAKO,SAAS,YAAA,GAAsC;AACpD,EAAA,MAAM,EAAE,MAAA,EAAQ,SAAA,EAAW,SAAS,KAAA,EAAM,GAAIA,iBAAW,gBAAgB,CAAA;AAEzE,EAAA,IAAI,CAAC,MAAA,EAAQ;AACX,IAAA,MAAM,IAAI,MAAM,oDAAoD,CAAA;AAAA,EACtE;AAEA,EAAA,MAAM,OAAA,GAAUC,iBAAA;AAAA,IACd,CAAkC,GAAA,KAA+B;AAC/D,MAAA,OAAO,MAAA,CAAO,QAAW,GAAG,CAAA;AAAA,IAC9B,CAAA;AAAA,IACA,CAAC,MAAM;AAAA,GACT;AAEA,EAAA,MAAM,SAAA,GAAYA,iBAAA;AAAA,IAChB,CAAC,GAAA,KAAyB;AACxB,MAAA,OAAO,MAAA,CAAO,UAAU,GAAG,CAAA;AAAA,IAC7B,CAAA;AAAA,IACA,CAAC,MAAM;AAAA,GACT;AAEA,EAAA,OAAO;AAAA,IACL,SAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,OAAA;AAAA,IACA;AAAA,GACF;AACF;AAKO,SAAS,QACd,GAAA,EACe;AACf,EAAA,MAAM,SAAS,kBAAA,EAAmB;AAElC,EAAA,MAAM,WAAA,GAAcA,kBAAY,MAAqB;AACnD,IAAA,OAAO,MAAA,CAAO,QAAW,GAAG,CAAA;AAAA,EAC9B,CAAA,EAAG,CAAC,MAAA,EAAQ,GAAG,CAAC,CAAA;AAEhB,EAAA,MAAM,SAAA,GAAYA,iBAAA;AAAA,IAChB,CAAC,aAAA,KAA4C;AAC3C,MAAA,OAAO,MAAA,CAAO,UAAU,aAAa,CAAA;AAAA,IACvC,CAAA;AAAA,IACA,CAAC,MAAM;AAAA,GACT;AAEA,EAAA,OAAOC,0BAAA,CAAqB,SAAA,EAAW,WAAA,EAAa,WAAW,CAAA;AACjE;AAKO,SAAS,eAAe,GAAA,EAAsB;AACnD,EAAA,MAAM,SAAS,kBAAA,EAAmB;AAElC,EAAA,MAAM,WAAA,GAAcD,kBAAY,MAAe;AAC7C,IAAA,OAAO,MAAA,CAAO,UAAU,GAAG,CAAA;AAAA,EAC7B,CAAA,EAAG,CAAC,MAAA,EAAQ,GAAG,CAAC,CAAA;AAEhB,EAAA,MAAM,SAAA,GAAYA,iBAAA;AAAA,IAChB,CAAC,aAAA,KAA4C;AAC3C,MAAA,OAAO,MAAA,CAAO,UAAU,aAAa,CAAA;AAAA,IACvC,CAAA;AAAA,IACA,CAAC,MAAM;AAAA,GACT;AAEA,EAAA,OAAOC,0BAAA,CAAqB,SAAA,EAAW,WAAA,EAAa,WAAW,CAAA;AACjE;AAaO,SAAS,QAAA,GAAkD;AAChE,EAAA,MAAM,SAAS,kBAAA,EAAmB;AAGlC,EAAA,MAAM,WAAA,GAAcD,kBAAY,MAA6C;AAC3E,IAAA,OAAO,OAAO,aAAA,EAAc;AAAA,EAC9B,CAAA,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,MAAM,SAAA,GAAYA,iBAAA;AAAA,IAChB,CAAC,aAAA,KAA4C;AAC3C,MAAA,OAAO,MAAA,CAAO,UAAU,aAAa,CAAA;AAAA,IACvC,CAAA;AAAA,IACA,CAAC,MAAM;AAAA,GACT;AAEA,EAAA,OAAOC,0BAAA,CAAqB,SAAA,EAAW,WAAA,EAAa,WAAW,CAAA;AACjE","file":"index.cjs","sourcesContent":["'use client';\n\nimport { RolloutlyClient, type FlagValue } from '@rolloutly/core';\nimport {\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useState,\n    useSyncExternalStore,\n} from 'react';\n\nimport type { RolloutlyContextValue, RolloutlyProviderProps } from './types';\n\nconst RolloutlyContext = createContext<{\n  client: RolloutlyClient | null;\n  isLoading: boolean;\n  isError: boolean;\n  error: Error | null;\n}>({\n  client: null,\n  isLoading: true,\n  isError: false,\n  error: null,\n});\n\n/**\n * Provider component that initializes Rolloutly and provides context\n */\nexport function RolloutlyProvider({\n  token,\n  children,\n  baseUrl,\n  realtimeEnabled = true,\n  defaultFlags,\n  debug = false,\n  loadingComponent,\n}: RolloutlyProviderProps): JSX.Element {\n  const [isLoading, setIsLoading] = useState(true);\n  const [isError, setIsError] = useState(false);\n  const [error, setError] = useState<Error | null>(null);\n\n  const client = useMemo(() => {\n    return new RolloutlyClient({\n      token,\n      baseUrl,\n      realtimeEnabled,\n      defaultFlags,\n      debug,\n    });\n  }, [token, baseUrl, realtimeEnabled, defaultFlags, debug]);\n\n  useEffect(() => {\n    let mounted = true;\n\n    client\n      .waitForInit()\n      .then(() => {\n        if (mounted) {\n          setIsLoading(false);\n        }\n      })\n      .catch((err) => {\n        if (mounted) {\n          setIsError(true);\n          setError(err instanceof Error ? err : new Error(String(err)));\n          setIsLoading(false);\n        }\n      });\n\n    return () => {\n      mounted = false;\n      client.close();\n    };\n  }, [client]);\n\n  const contextValue = useMemo(\n    () => ({\n      client,\n      isLoading,\n      isError,\n      error,\n    }),\n    [client, isLoading, isError, error],\n  );\n\n  if (isLoading && loadingComponent) {\n    return <>{loadingComponent}</>;\n  }\n\n  return (\n    <RolloutlyContext.Provider value={contextValue}>\n      {children}\n    </RolloutlyContext.Provider>\n  );\n}\n\n/**\n * Hook to access the Rolloutly client directly\n */\nexport function useRolloutlyClient(): RolloutlyClient {\n  const { client } = useContext(RolloutlyContext);\n\n  if (!client) {\n    throw new Error('useRolloutlyClient must be used within RolloutlyProvider');\n  }\n\n  return client;\n}\n\n/**\n * Hook to get Rolloutly status\n */\nexport function useRolloutly(): RolloutlyContextValue {\n  const { client, isLoading, isError, error } = useContext(RolloutlyContext);\n\n  if (!client) {\n    throw new Error('useRolloutly must be used within RolloutlyProvider');\n  }\n\n  const getFlag = useCallback(\n    <T extends FlagValue = FlagValue>(key: string): T | undefined => {\n      return client.getFlag<T>(key);\n    },\n    [client],\n  );\n\n  const isEnabled = useCallback(\n    (key: string): boolean => {\n      return client.isEnabled(key);\n    },\n    [client],\n  );\n\n  return {\n    isLoading,\n    isError,\n    error,\n    getFlag,\n    isEnabled,\n  };\n}\n\n/**\n * Hook to get a single flag value with real-time updates\n */\nexport function useFlag<T extends FlagValue = FlagValue>(\n  key: string,\n): T | undefined {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): T | undefined => {\n    return client.getFlag<T>(key);\n  }, [client, key]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Hook to check if a boolean flag is enabled with real-time updates\n */\nexport function useFlagEnabled(key: string): boolean {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): boolean => {\n    return client.isEnabled(key);\n  }, [client, key]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Hook to get all flag values with real-time updates\n * Returns an object keyed by flag key with the flag values\n *\n * @example\n * const flags = useFlags();\n * const value = flags['my-flag'];\n *\n * // Or with destructuring:\n * const { 'my-flag': myFlag } = useFlags();\n */\nexport function useFlags(): Record<string, FlagValue | undefined> {\n  const client = useRolloutlyClient();\n\n  // Use the client's cached flag values to avoid creating new objects\n  const getSnapshot = useCallback((): Record<string, FlagValue | undefined> => {\n    return client.getFlagValues();\n  }, [client]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"]}
+{"version":3,"sources":["../src/provider.tsx"],"names":["createContext","useState","useRef","useMemo","RolloutlyClient","useEffect","useContext","useCallback","useSyncExternalStore"],"mappings":"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","file":"index.cjs","sourcesContent":["'use client';\n\nimport { RolloutlyClient, type FlagValue, type UserContext } from '@rolloutly/core';\nimport {\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    useSyncExternalStore,\n} from 'react';\n\nimport type { RolloutlyContextValue, RolloutlyProviderProps } from './types';\n\nconst RolloutlyContext = createContext<{\n  client: RolloutlyClient | null;\n  isLoading: boolean;\n  isError: boolean;\n  error: Error | null;\n}>({\n  client: null,\n  isLoading: true,\n  isError: false,\n  error: null,\n});\n\n/**\n * Provider component that initializes Rolloutly and provides context\n */\nexport function RolloutlyProvider({\n  token,\n  children,\n  baseUrl,\n  realtimeEnabled = true,\n  defaultFlags,\n  user,\n  debug = false,\n  loadingComponent,\n}: RolloutlyProviderProps): JSX.Element {\n  const [isLoading, setIsLoading] = useState(true);\n  const [isError, setIsError] = useState(false);\n  const [error, setError] = useState<Error | null>(null);\n\n  // Track if user changed to re-identify\n  const prevUserRef = useRef<UserContext | undefined>(user);\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps -- user changes handled via identify() in useEffect\n  const client = useMemo(() => {\n    return new RolloutlyClient({\n      token,\n      baseUrl,\n      realtimeEnabled,\n      defaultFlags,\n      user,\n      debug,\n    });\n  }, [token, baseUrl, realtimeEnabled, defaultFlags, debug]);\n\n  // Handle user context changes\n  useEffect(() => {\n    if (prevUserRef.current !== user && client) {\n      prevUserRef.current = user;\n\n      if (user) {\n        void client.identify(user);\n      } else {\n        void client.reset();\n      }\n    }\n  }, [user, client]);\n\n  useEffect(() => {\n    let mounted = true;\n\n    client\n      .waitForInit()\n      .then(() => {\n        if (mounted) {\n          setIsLoading(false);\n        }\n      })\n      .catch((err) => {\n        if (mounted) {\n          setIsError(true);\n          setError(err instanceof Error ? err : new Error(String(err)));\n          setIsLoading(false);\n        }\n      });\n\n    return () => {\n      mounted = false;\n      client.close();\n    };\n  }, [client]);\n\n  const contextValue = useMemo(\n    () => ({\n      client,\n      isLoading,\n      isError,\n      error,\n    }),\n    [client, isLoading, isError, error],\n  );\n\n  if (isLoading && loadingComponent) {\n    return <>{loadingComponent}</>;\n  }\n\n  return (\n    <RolloutlyContext.Provider value={contextValue}>\n      {children}\n    </RolloutlyContext.Provider>\n  );\n}\n\n/**\n * Hook to access the Rolloutly client directly\n */\nexport function useRolloutlyClient(): RolloutlyClient {\n  const { client } = useContext(RolloutlyContext);\n\n  if (!client) {\n    throw new Error('useRolloutlyClient must be used within RolloutlyProvider');\n  }\n\n  return client;\n}\n\n/**\n * Hook to get Rolloutly status and utilities\n */\nexport function useRolloutly(): RolloutlyContextValue {\n  const { client, isLoading, isError, error } = useContext(RolloutlyContext);\n\n  if (!client) {\n    throw new Error('useRolloutly must be used within RolloutlyProvider');\n  }\n\n  const getFlag = useCallback(\n    <T extends FlagValue = FlagValue>(key: string): T | undefined => {\n      return client.getFlag<T>(key);\n    },\n    [client],\n  );\n\n  const isEnabled = useCallback(\n    (key: string): boolean => {\n      return client.isEnabled(key);\n    },\n    [client],\n  );\n\n  const identify = useCallback(\n    async (user: UserContext): Promise<void> => {\n      return client.identify(user);\n    },\n    [client],\n  );\n\n  const reset = useCallback(async (): Promise<void> => {\n    return client.reset();\n  }, [client]);\n\n  return {\n    isLoading,\n    isError,\n    error,\n    getFlag,\n    isEnabled,\n    identify,\n    reset,\n  };\n}\n\n/**\n * Hook to get a single flag value with real-time updates\n */\nexport function useFlag<T extends FlagValue = FlagValue>(\n  key: string,\n): T | undefined {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): T | undefined => {\n    return client.getFlag<T>(key);\n  }, [client, key]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Hook to check if a boolean flag is enabled with real-time updates\n */\nexport function useFlagEnabled(key: string): boolean {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): boolean => {\n    return client.isEnabled(key);\n  }, [client, key]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Hook to get all flag values with real-time updates\n * Returns an object keyed by flag key with the flag values\n *\n * @example\n * const flags = useFlags();\n * const value = flags['my-flag'];\n *\n * // Or with destructuring:\n * const { 'my-flag': myFlag } = useFlags();\n */\nexport function useFlags(): Record<string, FlagValue | undefined> {\n  const client = useRolloutlyClient();\n\n  // Use the client's cached flag values to avoid creating new objects\n  const getSnapshot = useCallback((): Record<string, FlagValue | undefined> => {\n    return client.getFlagValues();\n  }, [client]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"]}

package/dist/index.d.cts

@@ -1,4 +1,4 @@
-import { FlagValue, RolloutlyClient } from '@rolloutly/core';
+import { FlagValue, UserContext, RolloutlyClient } from '@rolloutly/core';
 export { Flag, FlagMap, FlagValue } from '@rolloutly/core';
 import { ReactNode } from 'react';
 
@@ -16,6 +16,8 @@ type RolloutlyProviderProps = {
     realtimeEnabled?: boolean;
     /** Default flag values */
     defaultFlags?: Record<string, FlagValue>;
+    /** User context for targeting rules evaluation */
+    user?: UserContext;
     /** Enable debug logging */
     debug?: boolean;
     /** Component to show while loading */
@@ -35,18 +37,22 @@ type RolloutlyContextValue = {
     getFlag: <T extends FlagValue = FlagValue>(key: string) => T | undefined;
     /** Check if a boolean flag is enabled */
     isEnabled: (key: string) => boolean;
+    /** Identify the user (update user context) */
+    identify: (user: UserContext) => Promise<void>;
+    /** Reset user context (e.g., on logout) */
+    reset: () => Promise<void>;
 };
 
 /**
  * Provider component that initializes Rolloutly and provides context
  */
-declare function RolloutlyProvider({ token, children, baseUrl, realtimeEnabled, defaultFlags, debug, loadingComponent, }: RolloutlyProviderProps): JSX.Element;
+declare function RolloutlyProvider({ token, children, baseUrl, realtimeEnabled, defaultFlags, user, debug, loadingComponent, }: RolloutlyProviderProps): JSX.Element;
 /**
  * Hook to access the Rolloutly client directly
  */
 declare function useRolloutlyClient(): RolloutlyClient;
 /**
- * Hook to get Rolloutly status
+ * Hook to get Rolloutly status and utilities
  */
 declare function useRolloutly(): RolloutlyContextValue;
 /**

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { FlagValue, RolloutlyClient } from '@rolloutly/core';
+import { FlagValue, UserContext, RolloutlyClient } from '@rolloutly/core';
 export { Flag, FlagMap, FlagValue } from '@rolloutly/core';
 import { ReactNode } from 'react';
 
@@ -16,6 +16,8 @@ type RolloutlyProviderProps = {
     realtimeEnabled?: boolean;
     /** Default flag values */
     defaultFlags?: Record<string, FlagValue>;
+    /** User context for targeting rules evaluation */
+    user?: UserContext;
     /** Enable debug logging */
     debug?: boolean;
     /** Component to show while loading */
@@ -35,18 +37,22 @@ type RolloutlyContextValue = {
     getFlag: <T extends FlagValue = FlagValue>(key: string) => T | undefined;
     /** Check if a boolean flag is enabled */
     isEnabled: (key: string) => boolean;
+    /** Identify the user (update user context) */
+    identify: (user: UserContext) => Promise<void>;
+    /** Reset user context (e.g., on logout) */
+    reset: () => Promise<void>;
 };
 
 /**
  * Provider component that initializes Rolloutly and provides context
  */
-declare function RolloutlyProvider({ token, children, baseUrl, realtimeEnabled, defaultFlags, debug, loadingComponent, }: RolloutlyProviderProps): JSX.Element;
+declare function RolloutlyProvider({ token, children, baseUrl, realtimeEnabled, defaultFlags, user, debug, loadingComponent, }: RolloutlyProviderProps): JSX.Element;
 /**
  * Hook to access the Rolloutly client directly
  */
 declare function useRolloutlyClient(): RolloutlyClient;
 /**
- * Hook to get Rolloutly status
+ * Hook to get Rolloutly status and utilities
  */
 declare function useRolloutly(): RolloutlyContextValue;
 /**

package/dist/index.js

@@ -1,5 +1,5 @@
 import { RolloutlyClient } from '@rolloutly/core';
-import { createContext, useState, useMemo, useEffect, useContext, useCallback, useSyncExternalStore } from 'react';
+import { createContext, useState, useRef, useMemo, useEffect, useContext, useCallback, useSyncExternalStore } from 'react';
 import { jsx, Fragment } from 'react/jsx-runtime';
 
 // src/provider.tsx
@@ -15,21 +15,34 @@ function RolloutlyProvider({
   baseUrl,
   realtimeEnabled = true,
   defaultFlags,
+  user,
   debug = false,
   loadingComponent
 }) {
   const [isLoading, setIsLoading] = useState(true);
   const [isError, setIsError] = useState(false);
   const [error, setError] = useState(null);
+  const prevUserRef = useRef(user);
   const client = useMemo(() => {
     return new RolloutlyClient({
       token,
       baseUrl,
       realtimeEnabled,
       defaultFlags,
+      user,
       debug
     });
   }, [token, baseUrl, realtimeEnabled, defaultFlags, debug]);
+  useEffect(() => {
+    if (prevUserRef.current !== user && client) {
+      prevUserRef.current = user;
+      if (user) {
+        void client.identify(user);
+      } else {
+        void client.reset();
+      }
+    }
+  }, [user, client]);
   useEffect(() => {
     let mounted = true;
     client.waitForInit().then(() => {
@@ -86,12 +99,23 @@ function useRolloutly() {
     },
     [client]
   );
+  const identify = useCallback(
+    async (user) => {
+      return client.identify(user);
+    },
+    [client]
+  );
+  const reset = useCallback(async () => {
+    return client.reset();
+  }, [client]);
   return {
     isLoading,
     isError,
     error,
     getFlag,
-    isEnabled
+    isEnabled,
+    identify,
+    reset
   };
 }
 function useFlag(key) {

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/provider.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["'use client';\n\nimport { RolloutlyClient, type FlagValue } from '@rolloutly/core';\nimport {\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useState,\n    useSyncExternalStore,\n} from 'react';\n\nimport type { RolloutlyContextValue, RolloutlyProviderProps } from './types';\n\nconst RolloutlyContext = createContext<{\n  client: RolloutlyClient | null;\n  isLoading: boolean;\n  isError: boolean;\n  error: Error | null;\n}>({\n  client: null,\n  isLoading: true,\n  isError: false,\n  error: null,\n});\n\n/**\n * Provider component that initializes Rolloutly and provides context\n */\nexport function RolloutlyProvider({\n  token,\n  children,\n  baseUrl,\n  realtimeEnabled = true,\n  defaultFlags,\n  debug = false,\n  loadingComponent,\n}: RolloutlyProviderProps): JSX.Element {\n  const [isLoading, setIsLoading] = useState(true);\n  const [isError, setIsError] = useState(false);\n  const [error, setError] = useState<Error | null>(null);\n\n  const client = useMemo(() => {\n    return new RolloutlyClient({\n      token,\n      baseUrl,\n      realtimeEnabled,\n      defaultFlags,\n      debug,\n    });\n  }, [token, baseUrl, realtimeEnabled, defaultFlags, debug]);\n\n  useEffect(() => {\n    let mounted = true;\n\n    client\n      .waitForInit()\n      .then(() => {\n        if (mounted) {\n          setIsLoading(false);\n        }\n      })\n      .catch((err) => {\n        if (mounted) {\n          setIsError(true);\n          setError(err instanceof Error ? err : new Error(String(err)));\n          setIsLoading(false);\n        }\n      });\n\n    return () => {\n      mounted = false;\n      client.close();\n    };\n  }, [client]);\n\n  const contextValue = useMemo(\n    () => ({\n      client,\n      isLoading,\n      isError,\n      error,\n    }),\n    [client, isLoading, isError, error],\n  );\n\n  if (isLoading && loadingComponent) {\n    return <>{loadingComponent}</>;\n  }\n\n  return (\n    <RolloutlyContext.Provider value={contextValue}>\n      {children}\n    </RolloutlyContext.Provider>\n  );\n}\n\n/**\n * Hook to access the Rolloutly client directly\n */\nexport function useRolloutlyClient(): RolloutlyClient {\n  const { client } = useContext(RolloutlyContext);\n\n  if (!client) {\n    throw new Error('useRolloutlyClient must be used within RolloutlyProvider');\n  }\n\n  return client;\n}\n\n/**\n * Hook to get Rolloutly status\n */\nexport function useRolloutly(): RolloutlyContextValue {\n  const { client, isLoading, isError, error } = useContext(RolloutlyContext);\n\n  if (!client) {\n    throw new Error('useRolloutly must be used within RolloutlyProvider');\n  }\n\n  const getFlag = useCallback(\n    <T extends FlagValue = FlagValue>(key: string): T | undefined => {\n      return client.getFlag<T>(key);\n    },\n    [client],\n  );\n\n  const isEnabled = useCallback(\n    (key: string): boolean => {\n      return client.isEnabled(key);\n    },\n    [client],\n  );\n\n  return {\n    isLoading,\n    isError,\n    error,\n    getFlag,\n    isEnabled,\n  };\n}\n\n/**\n * Hook to get a single flag value with real-time updates\n */\nexport function useFlag<T extends FlagValue = FlagValue>(\n  key: string,\n): T | undefined {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): T | undefined => {\n    return client.getFlag<T>(key);\n  }, [client, key]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Hook to check if a boolean flag is enabled with real-time updates\n */\nexport function useFlagEnabled(key: string): boolean {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): boolean => {\n    return client.isEnabled(key);\n  }, [client, key]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Hook to get all flag values with real-time updates\n * Returns an object keyed by flag key with the flag values\n *\n * @example\n * const flags = useFlags();\n * const value = flags['my-flag'];\n *\n * // Or with destructuring:\n * const { 'my-flag': myFlag } = useFlags();\n */\nexport function useFlags(): Record<string, FlagValue | undefined> {\n  const client = useRolloutlyClient();\n\n  // Use the client's cached flag values to avoid creating new objects\n  const getSnapshot = useCallback((): Record<string, FlagValue | undefined> => {\n    return client.getFlagValues();\n  }, [client]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"]}
+{"version":3,"sources":["../src/provider.tsx"],"names":[],"mappings":"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","file":"index.js","sourcesContent":["'use client';\n\nimport { RolloutlyClient, type FlagValue, type UserContext } from '@rolloutly/core';\nimport {\n    createContext,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n    useSyncExternalStore,\n} from 'react';\n\nimport type { RolloutlyContextValue, RolloutlyProviderProps } from './types';\n\nconst RolloutlyContext = createContext<{\n  client: RolloutlyClient | null;\n  isLoading: boolean;\n  isError: boolean;\n  error: Error | null;\n}>({\n  client: null,\n  isLoading: true,\n  isError: false,\n  error: null,\n});\n\n/**\n * Provider component that initializes Rolloutly and provides context\n */\nexport function RolloutlyProvider({\n  token,\n  children,\n  baseUrl,\n  realtimeEnabled = true,\n  defaultFlags,\n  user,\n  debug = false,\n  loadingComponent,\n}: RolloutlyProviderProps): JSX.Element {\n  const [isLoading, setIsLoading] = useState(true);\n  const [isError, setIsError] = useState(false);\n  const [error, setError] = useState<Error | null>(null);\n\n  // Track if user changed to re-identify\n  const prevUserRef = useRef<UserContext | undefined>(user);\n\n  // eslint-disable-next-line react-hooks/exhaustive-deps -- user changes handled via identify() in useEffect\n  const client = useMemo(() => {\n    return new RolloutlyClient({\n      token,\n      baseUrl,\n      realtimeEnabled,\n      defaultFlags,\n      user,\n      debug,\n    });\n  }, [token, baseUrl, realtimeEnabled, defaultFlags, debug]);\n\n  // Handle user context changes\n  useEffect(() => {\n    if (prevUserRef.current !== user && client) {\n      prevUserRef.current = user;\n\n      if (user) {\n        void client.identify(user);\n      } else {\n        void client.reset();\n      }\n    }\n  }, [user, client]);\n\n  useEffect(() => {\n    let mounted = true;\n\n    client\n      .waitForInit()\n      .then(() => {\n        if (mounted) {\n          setIsLoading(false);\n        }\n      })\n      .catch((err) => {\n        if (mounted) {\n          setIsError(true);\n          setError(err instanceof Error ? err : new Error(String(err)));\n          setIsLoading(false);\n        }\n      });\n\n    return () => {\n      mounted = false;\n      client.close();\n    };\n  }, [client]);\n\n  const contextValue = useMemo(\n    () => ({\n      client,\n      isLoading,\n      isError,\n      error,\n    }),\n    [client, isLoading, isError, error],\n  );\n\n  if (isLoading && loadingComponent) {\n    return <>{loadingComponent}</>;\n  }\n\n  return (\n    <RolloutlyContext.Provider value={contextValue}>\n      {children}\n    </RolloutlyContext.Provider>\n  );\n}\n\n/**\n * Hook to access the Rolloutly client directly\n */\nexport function useRolloutlyClient(): RolloutlyClient {\n  const { client } = useContext(RolloutlyContext);\n\n  if (!client) {\n    throw new Error('useRolloutlyClient must be used within RolloutlyProvider');\n  }\n\n  return client;\n}\n\n/**\n * Hook to get Rolloutly status and utilities\n */\nexport function useRolloutly(): RolloutlyContextValue {\n  const { client, isLoading, isError, error } = useContext(RolloutlyContext);\n\n  if (!client) {\n    throw new Error('useRolloutly must be used within RolloutlyProvider');\n  }\n\n  const getFlag = useCallback(\n    <T extends FlagValue = FlagValue>(key: string): T | undefined => {\n      return client.getFlag<T>(key);\n    },\n    [client],\n  );\n\n  const isEnabled = useCallback(\n    (key: string): boolean => {\n      return client.isEnabled(key);\n    },\n    [client],\n  );\n\n  const identify = useCallback(\n    async (user: UserContext): Promise<void> => {\n      return client.identify(user);\n    },\n    [client],\n  );\n\n  const reset = useCallback(async (): Promise<void> => {\n    return client.reset();\n  }, [client]);\n\n  return {\n    isLoading,\n    isError,\n    error,\n    getFlag,\n    isEnabled,\n    identify,\n    reset,\n  };\n}\n\n/**\n * Hook to get a single flag value with real-time updates\n */\nexport function useFlag<T extends FlagValue = FlagValue>(\n  key: string,\n): T | undefined {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): T | undefined => {\n    return client.getFlag<T>(key);\n  }, [client, key]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Hook to check if a boolean flag is enabled with real-time updates\n */\nexport function useFlagEnabled(key: string): boolean {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): boolean => {\n    return client.isEnabled(key);\n  }, [client, key]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n\n/**\n * Hook to get all flag values with real-time updates\n * Returns an object keyed by flag key with the flag values\n *\n * @example\n * const flags = useFlags();\n * const value = flags['my-flag'];\n *\n * // Or with destructuring:\n * const { 'my-flag': myFlag } = useFlags();\n */\nexport function useFlags(): Record<string, FlagValue | undefined> {\n  const client = useRolloutlyClient();\n\n  // Use the client's cached flag values to avoid creating new objects\n  const getSnapshot = useCallback((): Record<string, FlagValue | undefined> => {\n    return client.getFlagValues();\n  }, [client]);\n\n  const subscribe = useCallback(\n    (onStoreChange: () => void): (() => void) => {\n      return client.subscribe(onStoreChange);\n    },\n    [client],\n  );\n\n  return useSyncExternalStore(subscribe, getSnapshot, getSnapshot);\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rolloutly/react",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "Rolloutly feature flags SDK - React hooks and provider",
   "author": "Kevin Beltrão",
   "license": "MIT",
@@ -44,7 +44,7 @@
     "clean": "rm -rf dist"
   },
   "dependencies": {
-    "@rolloutly/core": "^0.1.2"
+    "@rolloutly/core": "workspace:*"
   },
   "peerDependencies": {
     "react": ">=18.0.0"