@rolloutly/react 0.1.0 → 0.1.2

package/README.md

@@ -15,12 +15,12 @@ yarn add @rolloutly/react
 ## Quick Start
 
 ```tsx
-import { RolloutlyProvider, useFlag, useFlagEnabled } from '@rolloutly/react';
+import { RolloutlyProvider, useFlags, useFlagEnabled } from '@rolloutly/react';
 
 // 1. Wrap your app with the provider
 function App() {
   return (
-    <RolloutlyProvider token="rly_your_project_production_xxx">
+    <RolloutlyProvider token="rly_projectId_production_xxx">
       <MyApp />
     </RolloutlyProvider>
   );
@@ -28,15 +28,27 @@ function App() {
 
 // 2. Use hooks in your components
 function MyFeature() {
-  const isNewCheckout = useFlagEnabled('new-checkout');
-  const rateLimit = useFlag<number>('api-rate-limit');
-
-  if (isNewCheckout) {
-    return <NewCheckout rateLimit={rateLimit} />;
+  // Get all flags as an object (recommended)
+  const flags = useFlags();
+  
+  // Access flags by key
+  if (flags['new-checkout']) {
+    return <NewCheckout rateLimit={flags['rate-limit']} />;
   }
 
   return <OldCheckout />;
 }
+
+// Or check boolean flags with useFlagEnabled
+function Banner() {
+  const showBanner = useFlagEnabled('show-banner');
+  
+  if (showBanner) {
+    return <PromoBanner />;
+  }
+  
+  return null;
+}
 ```
 
 ## Provider Configuration
@@ -91,13 +103,21 @@ if (showBanner) {
 }
 ```
 
-### `useFlags(): Record<string, FlagValue>`
+### `useFlags(): Record<string, FlagValue | undefined>`
 
-Get all flags as a key-value object.
+Get all flag values as a key-value object. This is the recommended way to access multiple flags.
 
 ```tsx
 const flags = useFlags();
-console.log(flags['my-feature']); // true
+
+// Access by key
+const myFeature = flags['my-feature'];
+
+// Or destructure (use bracket notation for keys with dashes)
+const { 'new-checkout': newCheckout, 'show-banner': showBanner } = useFlags();
+
+// For keys without dashes, simple destructuring works
+const { myFeature, anotherFlag } = useFlags();
 ```
 
 ### `useRolloutly(): RolloutlyContextValue`

package/dist/index.cjs

@@ -125,14 +125,7 @@ function useFlagEnabled(key) {
 function useFlags() {
   const client = useRolloutlyClient();
   const getSnapshot = react.useCallback(() => {
-    const flags = client.getFlags();
-    return Object.entries(flags).reduce(
-      (acc, [key, flag]) => {
-        acc[key] = flag.enabled ? flag.value : void 0;
-        return acc;
-      },
-      {}
-    );
+    return client.getFlagValues();
   }, [client]);
   const subscribe = react.useCallback(
     (onStoreChange) => {

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;AAKO,SAAS,QAAA,GAAsC;AACpD,EAAA,MAAM,SAAS,kBAAA,EAAmB;AAElC,EAAA,MAAM,WAAA,GAAcD,kBAAY,MAAiC;AAC/D,IAAA,MAAM,KAAA,GAAQ,OAAO,QAAA,EAAS;AAE9B,IAAA,OAAO,MAAA,CAAO,OAAA,CAAQ,KAAK,CAAA,CAAE,MAAA;AAAA,MAC3B,CAAC,GAAA,EAAK,CAAC,GAAA,EAAK,IAAI,CAAA,KAAM;AACpB,QAAA,GAAA,CAAI,GAAG,CAAA,GAAI,IAAA,CAAK,OAAA,GAAU,KAAK,KAAA,GAAQ,MAAA;AAEvC,QAAA,OAAO,GAAA;AAAA,MACT,CAAA;AAAA,MACA;AAAC,KACH;AAAA,EACF,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 flags with real-time updates\n */\nexport function useFlags(): Record<string, FlagValue> {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): Record<string, FlagValue> => {\n    const flags = client.getFlags();\n\n    return Object.entries(flags).reduce<Record<string, FlagValue>>(\n      (acc, [key, flag]) => {\n        acc[key] = flag.enabled ? flag.value : undefined!;\n\n        return acc;\n      },\n      {},\n    );\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","useMemo","RolloutlyClient","useEffect","useContext","useCallback","useSyncExternalStore"],"mappings":"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","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"]}

package/dist/index.d.cts

@@ -58,8 +58,16 @@ declare function useFlag<T extends FlagValue = FlagValue>(key: string): T | unde
  */
 declare function useFlagEnabled(key: string): boolean;
 /**
- * Hook to get all flags with real-time updates
+ * Hook to get all flag values with real-time updates
+ * Returns an object keyed by flag key with the flag values
+ *
+ * @example
+ * const flags = useFlags();
+ * const value = flags['my-flag'];
+ *
+ * // Or with destructuring:
+ * const { 'my-flag': myFlag } = useFlags();
  */
-declare function useFlags(): Record<string, FlagValue>;
+declare function useFlags(): Record<string, FlagValue | undefined>;
 
 export { type RolloutlyContextValue, RolloutlyProvider, type RolloutlyProviderProps, useFlag, useFlagEnabled, useFlags, useRolloutly, useRolloutlyClient };

package/dist/index.d.ts

@@ -58,8 +58,16 @@ declare function useFlag<T extends FlagValue = FlagValue>(key: string): T | unde
  */
 declare function useFlagEnabled(key: string): boolean;
 /**
- * Hook to get all flags with real-time updates
+ * Hook to get all flag values with real-time updates
+ * Returns an object keyed by flag key with the flag values
+ *
+ * @example
+ * const flags = useFlags();
+ * const value = flags['my-flag'];
+ *
+ * // Or with destructuring:
+ * const { 'my-flag': myFlag } = useFlags();
  */
-declare function useFlags(): Record<string, FlagValue>;
+declare function useFlags(): Record<string, FlagValue | undefined>;
 
 export { type RolloutlyContextValue, RolloutlyProvider, type RolloutlyProviderProps, useFlag, useFlagEnabled, useFlags, useRolloutly, useRolloutlyClient };

package/dist/index.js

@@ -123,14 +123,7 @@ function useFlagEnabled(key) {
 function useFlags() {
   const client = useRolloutlyClient();
   const getSnapshot = useCallback(() => {
-    const flags = client.getFlags();
-    return Object.entries(flags).reduce(
-      (acc, [key, flag]) => {
-        acc[key] = flag.enabled ? flag.value : void 0;
-        return acc;
-      },
-      {}
-    );
+    return client.getFlagValues();
   }, [client]);
   const subscribe = useCallback(
     (onStoreChange) => {

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 flags with real-time updates\n */\nexport function useFlags(): Record<string, FlagValue> {\n  const client = useRolloutlyClient();\n\n  const getSnapshot = useCallback((): Record<string, FlagValue> => {\n    const flags = client.getFlags();\n\n    return Object.entries(flags).reduce<Record<string, FlagValue>>(\n      (acc, [key, flag]) => {\n        acc[key] = flag.enabled ? flag.value : undefined!;\n\n        return acc;\n      },\n      {},\n    );\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 } 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"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rolloutly/react",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "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.0"
+    "@rolloutly/core": "^0.1.2"
   },
   "peerDependencies": {
     "react": ">=18.0.0"