@gradual-so/sdk-react 0.0.1

package/dist/index.cjs

@@ -0,0 +1,2 @@
+'use strict';var react=require('react'),sdk=require('@gradual-so/sdk'),jsxRuntime=require('react/jsx-runtime');var l=react.createContext({gradual:null,isReady:false});function d(){let e=react.useContext(l);if(!e.gradual)throw new Error("useFlag must be used within a <GradualProvider>");return {gradual:e.gradual,isReady:e.isReady}}function g(){let{gradual:e,isReady:a}=d();return react.useMemo(()=>({identify:t=>e.identify(t),reset:()=>e.reset(),refresh:()=>e.refresh(),isReady:a}),[e,a])}function y(e,a){let{gradual:t,isReady:r}=d(),o=react.useMemo(()=>r?t.sync.get(e,{fallback:a.fallback,context:a.context}):a.fallback,[t,r,e,a.fallback,a.context]);return a.detail?{value:o,isLoading:!r,isReady:r}:o}function v({apiKey:e,environment:a,baseUrl:t,children:r}){let[o,f]=react.useState(false),n=react.useMemo(()=>sdk.createGradual({apiKey:e,environment:a,baseUrl:t}),[e,a,t]);react.useEffect(()=>{let u=true;return n.ready().then(()=>{u&&f(true);}),()=>{u=false;}},[n]);let p=react.useMemo(()=>({gradual:n,isReady:o}),[n,o]);return jsxRuntime.jsx(l,{value:p,children:r})}exports.GradualContext=l;exports.GradualProvider=v;exports.useFlag=y;exports.useGradual=g;//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/context.ts","../src/hooks.ts","../src/provider.tsx"],"names":["GradualContext","createContext","useGradualContext","context","useContext","useGradual","gradual","isReady","useMemo","ctx","useFlag","key","options","value","GradualProvider","apiKey","environment","baseUrl","children","setIsReady","useState","createGradual","useEffect","mounted","jsx"],"mappings":"+GAQO,IAAMA,CAAAA,CAAiBC,mBAAAA,CAAmC,CAC/D,OAAA,CAAS,IAAA,CACT,OAAA,CAAS,KACX,CAAC,ECKD,SAASC,CAAAA,EAA4D,CACnE,IAAMC,CAAAA,CAAUC,gBAAAA,CAAWJ,CAAc,CAAA,CACzC,GAAI,CAACG,CAAAA,CAAQ,OAAA,CACX,MAAM,IAAI,KAAA,CAAM,iDAAiD,CAAA,CAEnE,OAAO,CAAE,OAAA,CAASA,CAAAA,CAAQ,OAAA,CAAS,OAAA,CAASA,CAAAA,CAAQ,OAAQ,CAC9D,CAkBO,SAASE,CAAAA,EAKd,CACA,GAAM,CAAE,OAAA,CAAAC,CAAAA,CAAS,OAAA,CAAAC,CAAQ,CAAA,CAAIL,CAAAA,EAAkB,CAE/C,OAAOM,aAAAA,CACL,KAAO,CACL,QAAA,CAAWC,CAAAA,EAA2BH,CAAAA,CAAQ,QAAA,CAASG,CAAG,CAAA,CAC1D,KAAA,CAAO,IAAMH,CAAAA,CAAQ,KAAA,EAAM,CAC3B,OAAA,CAAS,IAAMA,CAAAA,CAAQ,OAAA,EAAQ,CAC/B,OAAA,CAAAC,CACF,CAAA,CAAA,CACA,CAACD,CAAAA,CAASC,CAAO,CACnB,CACF,CAoCO,SAASG,CAAAA,CACdC,CAAAA,CACAC,CAAAA,CACmB,CACnB,GAAM,CAAE,OAAA,CAAAN,CAAAA,CAAS,OAAA,CAAAC,CAAQ,CAAA,CAAIL,CAAAA,EAAkB,CAEzCW,CAAAA,CAAQL,aAAAA,CAAQ,IACfD,CAAAA,CAGED,CAAAA,CAAQ,IAAA,CAAK,GAAA,CAAIK,CAAAA,CAAK,CAC3B,QAAA,CAAUC,CAAAA,CAAQ,QAAA,CAClB,OAAA,CAASA,CAAAA,CAAQ,OACnB,CAAC,CAAA,CALQA,CAAAA,CAAQ,QAAA,CAMhB,CAACN,CAAAA,CAASC,CAAAA,CAASI,CAAAA,CAAKC,CAAAA,CAAQ,QAAA,CAAUA,CAAAA,CAAQ,OAAO,CAAC,CAAA,CAE7D,OAAIA,CAAAA,CAAQ,MAAA,CACH,CACL,KAAA,CAAAC,CAAAA,CACA,SAAA,CAAW,CAACN,CAAAA,CACZ,OAAA,CAAAA,CACF,CAAA,CAGKM,CACT,CC9GO,SAASC,CAAAA,CAAgB,CAC9B,MAAA,CAAAC,CAAAA,CACA,WAAA,CAAAC,CAAAA,CACA,OAAA,CAAAC,CAAAA,CACA,QAAA,CAAAC,CACF,CAAA,CAAyB,CACvB,GAAM,CAACX,CAAAA,CAASY,CAAU,CAAA,CAAIC,cAAAA,CAAS,KAAK,CAAA,CAEtCd,CAAAA,CAAUE,aAAAA,CACd,IAAMa,iBAAAA,CAAc,CAAE,MAAA,CAAAN,CAAAA,CAAQ,WAAA,CAAAC,CAAAA,CAAa,OAAA,CAAAC,CAAQ,CAAC,CAAA,CACpD,CAACF,CAAAA,CAAQC,CAAAA,CAAaC,CAAO,CAC/B,CAAA,CAEAK,eAAAA,CAAU,IAAM,CACd,IAAIC,CAAAA,CAAU,IAAA,CACd,OAAAjB,CAAAA,CAAQ,KAAA,EAAM,CAAE,IAAA,CAAK,IAAM,CACrBiB,CAAAA,EACFJ,CAAAA,CAAW,IAAI,EAEnB,CAAC,CAAA,CACM,IAAM,CACXI,CAAAA,CAAU,MACZ,CACF,CAAA,CAAG,CAACjB,CAAO,CAAC,CAAA,CAEZ,IAAMO,CAAAA,CAAQL,aAAAA,CAAQ,KAAO,CAAE,OAAA,CAAAF,CAAAA,CAAS,OAAA,CAAAC,CAAQ,CAAA,CAAA,CAAI,CAACD,CAAAA,CAASC,CAAO,CAAC,CAAA,CAEtE,OAAOiB,cAAAA,CAACxB,CAAAA,CAAA,CAAe,KAAA,CAAOa,CAAAA,CAAQ,QAAA,CAAAK,CAAAA,CAAS,CACjD","file":"index.cjs","sourcesContent":["import type { Gradual } from \"@gradual-so/sdk\";\nimport { createContext } from \"react\";\n\nexport interface GradualContextValue {\n  gradual: Gradual | null;\n  isReady: boolean;\n}\n\nexport const GradualContext = createContext<GradualContextValue>({\n  gradual: null,\n  isReady: false,\n});\n","import type { EvaluationContext, Gradual } from \"@gradual-so/sdk\";\nimport { useContext, useMemo } from \"react\";\nimport { GradualContext } from \"./context\";\n\nexport interface UseFlagOptions<T> {\n  fallback: T;\n  context?: EvaluationContext;\n  detail?: boolean;\n}\n\nexport interface FlagDetail<T> {\n  value: T;\n  isLoading: boolean;\n  isReady: boolean;\n}\n\nfunction useGradualContext(): { gradual: Gradual; isReady: boolean } {\n  const context = useContext(GradualContext);\n  if (!context.gradual) {\n    throw new Error(\"useFlag must be used within a <GradualProvider>\");\n  }\n  return { gradual: context.gradual, isReady: context.isReady };\n}\n\n/**\n * Access the Gradual client for identity management\n *\n * @example\n * ```tsx\n * const { identify, reset, isReady } = useGradual()\n *\n * useEffect(() => {\n *   if (user) {\n *     identify({ userId: user.id, plan: user.plan })\n *   } else {\n *     reset()\n *   }\n * }, [user])\n * ```\n */\nexport function useGradual(): {\n  identify: (context: EvaluationContext) => void;\n  reset: () => void;\n  isReady: boolean;\n  refresh: () => Promise<void>;\n} {\n  const { gradual, isReady } = useGradualContext();\n\n  return useMemo(\n    () => ({\n      identify: (ctx: EvaluationContext) => gradual.identify(ctx),\n      reset: () => gradual.reset(),\n      refresh: () => gradual.refresh(),\n      isReady,\n    }),\n    [gradual, isReady]\n  );\n}\n\n/**\n * Get a feature flag value with type inference\n *\n * @example\n * ```tsx\n * // Simple usage - returns value directly\n * const showBanner = useFlag('show-banner', { fallback: false })\n * const theme = useFlag('theme', { fallback: 'light' })\n *\n * // With loading state\n * const { value, isLoading } = useFlag('experiment', {\n *   fallback: 'control',\n *   detail: true\n * })\n *\n * // With context override\n * const enabled = useFlag('feature', {\n *   fallback: false,\n *   context: { itemId: item.id }\n * })\n * ```\n */\nexport function useFlag<T>(\n  key: string,\n  options: UseFlagOptions<T> & { detail: true }\n): FlagDetail<T>;\nexport function useFlag<T>(\n  key: string,\n  options: UseFlagOptions<T> & { detail?: false }\n): T;\nexport function useFlag<T>(\n  key: string,\n  options: UseFlagOptions<T>\n): T | FlagDetail<T>;\nexport function useFlag<T>(\n  key: string,\n  options: UseFlagOptions<T>\n): T | FlagDetail<T> {\n  const { gradual, isReady } = useGradualContext();\n\n  const value = useMemo(() => {\n    if (!isReady) {\n      return options.fallback;\n    }\n    return gradual.sync.get(key, {\n      fallback: options.fallback,\n      context: options.context,\n    });\n  }, [gradual, isReady, key, options.fallback, options.context]);\n\n  if (options.detail) {\n    return {\n      value,\n      isLoading: !isReady,\n      isReady,\n    };\n  }\n\n  return value;\n}\n","import { createGradual, type GradualOptions } from \"@gradual-so/sdk\";\nimport { type ReactNode, useEffect, useMemo, useState } from \"react\";\nimport { GradualContext } from \"./context\";\n\nexport interface GradualProviderProps extends GradualOptions {\n  children: ReactNode;\n}\n\nexport function GradualProvider({\n  apiKey,\n  environment,\n  baseUrl,\n  children,\n}: GradualProviderProps) {\n  const [isReady, setIsReady] = useState(false);\n\n  const gradual = useMemo(\n    () => createGradual({ apiKey, environment, baseUrl }),\n    [apiKey, environment, baseUrl]\n  );\n\n  useEffect(() => {\n    let mounted = true;\n    gradual.ready().then(() => {\n      if (mounted) {\n        setIsReady(true);\n      }\n    });\n    return () => {\n      mounted = false;\n    };\n  }, [gradual]);\n\n  const value = useMemo(() => ({ gradual, isReady }), [gradual, isReady]);\n\n  return <GradualContext value={value}>{children}</GradualContext>;\n}\n"]}

package/dist/index.d.cts

@@ -0,0 +1,80 @@
+import { Gradual, EvaluationContext, GradualOptions } from '@gradual-so/sdk';
+export { EvaluationContext, GradualOptions } from '@gradual-so/sdk';
+import * as react from 'react';
+import { ReactNode } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface GradualContextValue {
+    gradual: Gradual | null;
+    isReady: boolean;
+}
+declare const GradualContext: react.Context<GradualContextValue>;
+
+interface UseFlagOptions<T> {
+    fallback: T;
+    context?: EvaluationContext;
+    detail?: boolean;
+}
+interface FlagDetail<T> {
+    value: T;
+    isLoading: boolean;
+    isReady: boolean;
+}
+/**
+ * Access the Gradual client for identity management
+ *
+ * @example
+ * ```tsx
+ * const { identify, reset, isReady } = useGradual()
+ *
+ * useEffect(() => {
+ *   if (user) {
+ *     identify({ userId: user.id, plan: user.plan })
+ *   } else {
+ *     reset()
+ *   }
+ * }, [user])
+ * ```
+ */
+declare function useGradual(): {
+    identify: (context: EvaluationContext) => void;
+    reset: () => void;
+    isReady: boolean;
+    refresh: () => Promise<void>;
+};
+/**
+ * Get a feature flag value with type inference
+ *
+ * @example
+ * ```tsx
+ * // Simple usage - returns value directly
+ * const showBanner = useFlag('show-banner', { fallback: false })
+ * const theme = useFlag('theme', { fallback: 'light' })
+ *
+ * // With loading state
+ * const { value, isLoading } = useFlag('experiment', {
+ *   fallback: 'control',
+ *   detail: true
+ * })
+ *
+ * // With context override
+ * const enabled = useFlag('feature', {
+ *   fallback: false,
+ *   context: { itemId: item.id }
+ * })
+ * ```
+ */
+declare function useFlag<T>(key: string, options: UseFlagOptions<T> & {
+    detail: true;
+}): FlagDetail<T>;
+declare function useFlag<T>(key: string, options: UseFlagOptions<T> & {
+    detail?: false;
+}): T;
+declare function useFlag<T>(key: string, options: UseFlagOptions<T>): T | FlagDetail<T>;
+
+interface GradualProviderProps extends GradualOptions {
+    children: ReactNode;
+}
+declare function GradualProvider({ apiKey, environment, baseUrl, children, }: GradualProviderProps): react_jsx_runtime.JSX.Element;
+
+export { type FlagDetail, GradualContext, type GradualContextValue, GradualProvider, type GradualProviderProps, type UseFlagOptions, useFlag, useGradual };

package/dist/index.d.ts

@@ -0,0 +1,80 @@
+import { Gradual, EvaluationContext, GradualOptions } from '@gradual-so/sdk';
+export { EvaluationContext, GradualOptions } from '@gradual-so/sdk';
+import * as react from 'react';
+import { ReactNode } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface GradualContextValue {
+    gradual: Gradual | null;
+    isReady: boolean;
+}
+declare const GradualContext: react.Context<GradualContextValue>;
+
+interface UseFlagOptions<T> {
+    fallback: T;
+    context?: EvaluationContext;
+    detail?: boolean;
+}
+interface FlagDetail<T> {
+    value: T;
+    isLoading: boolean;
+    isReady: boolean;
+}
+/**
+ * Access the Gradual client for identity management
+ *
+ * @example
+ * ```tsx
+ * const { identify, reset, isReady } = useGradual()
+ *
+ * useEffect(() => {
+ *   if (user) {
+ *     identify({ userId: user.id, plan: user.plan })
+ *   } else {
+ *     reset()
+ *   }
+ * }, [user])
+ * ```
+ */
+declare function useGradual(): {
+    identify: (context: EvaluationContext) => void;
+    reset: () => void;
+    isReady: boolean;
+    refresh: () => Promise<void>;
+};
+/**
+ * Get a feature flag value with type inference
+ *
+ * @example
+ * ```tsx
+ * // Simple usage - returns value directly
+ * const showBanner = useFlag('show-banner', { fallback: false })
+ * const theme = useFlag('theme', { fallback: 'light' })
+ *
+ * // With loading state
+ * const { value, isLoading } = useFlag('experiment', {
+ *   fallback: 'control',
+ *   detail: true
+ * })
+ *
+ * // With context override
+ * const enabled = useFlag('feature', {
+ *   fallback: false,
+ *   context: { itemId: item.id }
+ * })
+ * ```
+ */
+declare function useFlag<T>(key: string, options: UseFlagOptions<T> & {
+    detail: true;
+}): FlagDetail<T>;
+declare function useFlag<T>(key: string, options: UseFlagOptions<T> & {
+    detail?: false;
+}): T;
+declare function useFlag<T>(key: string, options: UseFlagOptions<T>): T | FlagDetail<T>;
+
+interface GradualProviderProps extends GradualOptions {
+    children: ReactNode;
+}
+declare function GradualProvider({ apiKey, environment, baseUrl, children, }: GradualProviderProps): react_jsx_runtime.JSX.Element;
+
+export { type FlagDetail, GradualContext, type GradualContextValue, GradualProvider, type GradualProviderProps, type UseFlagOptions, useFlag, useGradual };

package/dist/index.js

@@ -0,0 +1,2 @@
+import {createContext,useMemo,useState,useEffect,useContext}from'react';import {createGradual}from'@gradual-so/sdk';import {jsx}from'react/jsx-runtime';var l=createContext({gradual:null,isReady:false});function d(){let e=useContext(l);if(!e.gradual)throw new Error("useFlag must be used within a <GradualProvider>");return {gradual:e.gradual,isReady:e.isReady}}function g(){let{gradual:e,isReady:a}=d();return useMemo(()=>({identify:t=>e.identify(t),reset:()=>e.reset(),refresh:()=>e.refresh(),isReady:a}),[e,a])}function y(e,a){let{gradual:t,isReady:r}=d(),o=useMemo(()=>r?t.sync.get(e,{fallback:a.fallback,context:a.context}):a.fallback,[t,r,e,a.fallback,a.context]);return a.detail?{value:o,isLoading:!r,isReady:r}:o}function v({apiKey:e,environment:a,baseUrl:t,children:r}){let[o,f]=useState(false),n=useMemo(()=>createGradual({apiKey:e,environment:a,baseUrl:t}),[e,a,t]);useEffect(()=>{let u=true;return n.ready().then(()=>{u&&f(true);}),()=>{u=false;}},[n]);let p=useMemo(()=>({gradual:n,isReady:o}),[n,o]);return jsx(l,{value:p,children:r})}export{l as GradualContext,v as GradualProvider,y as useFlag,g as useGradual};//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/context.ts","../src/hooks.ts","../src/provider.tsx"],"names":["GradualContext","createContext","useGradualContext","context","useContext","useGradual","gradual","isReady","useMemo","ctx","useFlag","key","options","value","GradualProvider","apiKey","environment","baseUrl","children","setIsReady","useState","createGradual","useEffect","mounted","jsx"],"mappings":"wJAQO,IAAMA,CAAAA,CAAiBC,aAAAA,CAAmC,CAC/D,OAAA,CAAS,IAAA,CACT,OAAA,CAAS,KACX,CAAC,ECKD,SAASC,CAAAA,EAA4D,CACnE,IAAMC,CAAAA,CAAUC,UAAAA,CAAWJ,CAAc,CAAA,CACzC,GAAI,CAACG,CAAAA,CAAQ,OAAA,CACX,MAAM,IAAI,KAAA,CAAM,iDAAiD,CAAA,CAEnE,OAAO,CAAE,OAAA,CAASA,CAAAA,CAAQ,OAAA,CAAS,OAAA,CAASA,CAAAA,CAAQ,OAAQ,CAC9D,CAkBO,SAASE,CAAAA,EAKd,CACA,GAAM,CAAE,OAAA,CAAAC,CAAAA,CAAS,OAAA,CAAAC,CAAQ,CAAA,CAAIL,CAAAA,EAAkB,CAE/C,OAAOM,OAAAA,CACL,KAAO,CACL,QAAA,CAAWC,CAAAA,EAA2BH,CAAAA,CAAQ,QAAA,CAASG,CAAG,CAAA,CAC1D,KAAA,CAAO,IAAMH,CAAAA,CAAQ,KAAA,EAAM,CAC3B,OAAA,CAAS,IAAMA,CAAAA,CAAQ,OAAA,EAAQ,CAC/B,OAAA,CAAAC,CACF,CAAA,CAAA,CACA,CAACD,CAAAA,CAASC,CAAO,CACnB,CACF,CAoCO,SAASG,CAAAA,CACdC,CAAAA,CACAC,CAAAA,CACmB,CACnB,GAAM,CAAE,OAAA,CAAAN,CAAAA,CAAS,OAAA,CAAAC,CAAQ,CAAA,CAAIL,CAAAA,EAAkB,CAEzCW,CAAAA,CAAQL,OAAAA,CAAQ,IACfD,CAAAA,CAGED,CAAAA,CAAQ,IAAA,CAAK,GAAA,CAAIK,CAAAA,CAAK,CAC3B,QAAA,CAAUC,CAAAA,CAAQ,QAAA,CAClB,OAAA,CAASA,CAAAA,CAAQ,OACnB,CAAC,CAAA,CALQA,CAAAA,CAAQ,QAAA,CAMhB,CAACN,CAAAA,CAASC,CAAAA,CAASI,CAAAA,CAAKC,CAAAA,CAAQ,QAAA,CAAUA,CAAAA,CAAQ,OAAO,CAAC,CAAA,CAE7D,OAAIA,CAAAA,CAAQ,MAAA,CACH,CACL,KAAA,CAAAC,CAAAA,CACA,SAAA,CAAW,CAACN,CAAAA,CACZ,OAAA,CAAAA,CACF,CAAA,CAGKM,CACT,CC9GO,SAASC,CAAAA,CAAgB,CAC9B,MAAA,CAAAC,CAAAA,CACA,WAAA,CAAAC,CAAAA,CACA,OAAA,CAAAC,CAAAA,CACA,QAAA,CAAAC,CACF,CAAA,CAAyB,CACvB,GAAM,CAACX,CAAAA,CAASY,CAAU,CAAA,CAAIC,QAAAA,CAAS,KAAK,CAAA,CAEtCd,CAAAA,CAAUE,OAAAA,CACd,IAAMa,aAAAA,CAAc,CAAE,MAAA,CAAAN,CAAAA,CAAQ,WAAA,CAAAC,CAAAA,CAAa,OAAA,CAAAC,CAAQ,CAAC,CAAA,CACpD,CAACF,CAAAA,CAAQC,CAAAA,CAAaC,CAAO,CAC/B,CAAA,CAEAK,SAAAA,CAAU,IAAM,CACd,IAAIC,CAAAA,CAAU,IAAA,CACd,OAAAjB,CAAAA,CAAQ,KAAA,EAAM,CAAE,IAAA,CAAK,IAAM,CACrBiB,CAAAA,EACFJ,CAAAA,CAAW,IAAI,EAEnB,CAAC,CAAA,CACM,IAAM,CACXI,CAAAA,CAAU,MACZ,CACF,CAAA,CAAG,CAACjB,CAAO,CAAC,CAAA,CAEZ,IAAMO,CAAAA,CAAQL,OAAAA,CAAQ,KAAO,CAAE,OAAA,CAAAF,CAAAA,CAAS,OAAA,CAAAC,CAAQ,CAAA,CAAA,CAAI,CAACD,CAAAA,CAASC,CAAO,CAAC,CAAA,CAEtE,OAAOiB,GAAAA,CAACxB,CAAAA,CAAA,CAAe,KAAA,CAAOa,CAAAA,CAAQ,QAAA,CAAAK,CAAAA,CAAS,CACjD","file":"index.js","sourcesContent":["import type { Gradual } from \"@gradual-so/sdk\";\nimport { createContext } from \"react\";\n\nexport interface GradualContextValue {\n  gradual: Gradual | null;\n  isReady: boolean;\n}\n\nexport const GradualContext = createContext<GradualContextValue>({\n  gradual: null,\n  isReady: false,\n});\n","import type { EvaluationContext, Gradual } from \"@gradual-so/sdk\";\nimport { useContext, useMemo } from \"react\";\nimport { GradualContext } from \"./context\";\n\nexport interface UseFlagOptions<T> {\n  fallback: T;\n  context?: EvaluationContext;\n  detail?: boolean;\n}\n\nexport interface FlagDetail<T> {\n  value: T;\n  isLoading: boolean;\n  isReady: boolean;\n}\n\nfunction useGradualContext(): { gradual: Gradual; isReady: boolean } {\n  const context = useContext(GradualContext);\n  if (!context.gradual) {\n    throw new Error(\"useFlag must be used within a <GradualProvider>\");\n  }\n  return { gradual: context.gradual, isReady: context.isReady };\n}\n\n/**\n * Access the Gradual client for identity management\n *\n * @example\n * ```tsx\n * const { identify, reset, isReady } = useGradual()\n *\n * useEffect(() => {\n *   if (user) {\n *     identify({ userId: user.id, plan: user.plan })\n *   } else {\n *     reset()\n *   }\n * }, [user])\n * ```\n */\nexport function useGradual(): {\n  identify: (context: EvaluationContext) => void;\n  reset: () => void;\n  isReady: boolean;\n  refresh: () => Promise<void>;\n} {\n  const { gradual, isReady } = useGradualContext();\n\n  return useMemo(\n    () => ({\n      identify: (ctx: EvaluationContext) => gradual.identify(ctx),\n      reset: () => gradual.reset(),\n      refresh: () => gradual.refresh(),\n      isReady,\n    }),\n    [gradual, isReady]\n  );\n}\n\n/**\n * Get a feature flag value with type inference\n *\n * @example\n * ```tsx\n * // Simple usage - returns value directly\n * const showBanner = useFlag('show-banner', { fallback: false })\n * const theme = useFlag('theme', { fallback: 'light' })\n *\n * // With loading state\n * const { value, isLoading } = useFlag('experiment', {\n *   fallback: 'control',\n *   detail: true\n * })\n *\n * // With context override\n * const enabled = useFlag('feature', {\n *   fallback: false,\n *   context: { itemId: item.id }\n * })\n * ```\n */\nexport function useFlag<T>(\n  key: string,\n  options: UseFlagOptions<T> & { detail: true }\n): FlagDetail<T>;\nexport function useFlag<T>(\n  key: string,\n  options: UseFlagOptions<T> & { detail?: false }\n): T;\nexport function useFlag<T>(\n  key: string,\n  options: UseFlagOptions<T>\n): T | FlagDetail<T>;\nexport function useFlag<T>(\n  key: string,\n  options: UseFlagOptions<T>\n): T | FlagDetail<T> {\n  const { gradual, isReady } = useGradualContext();\n\n  const value = useMemo(() => {\n    if (!isReady) {\n      return options.fallback;\n    }\n    return gradual.sync.get(key, {\n      fallback: options.fallback,\n      context: options.context,\n    });\n  }, [gradual, isReady, key, options.fallback, options.context]);\n\n  if (options.detail) {\n    return {\n      value,\n      isLoading: !isReady,\n      isReady,\n    };\n  }\n\n  return value;\n}\n","import { createGradual, type GradualOptions } from \"@gradual-so/sdk\";\nimport { type ReactNode, useEffect, useMemo, useState } from \"react\";\nimport { GradualContext } from \"./context\";\n\nexport interface GradualProviderProps extends GradualOptions {\n  children: ReactNode;\n}\n\nexport function GradualProvider({\n  apiKey,\n  environment,\n  baseUrl,\n  children,\n}: GradualProviderProps) {\n  const [isReady, setIsReady] = useState(false);\n\n  const gradual = useMemo(\n    () => createGradual({ apiKey, environment, baseUrl }),\n    [apiKey, environment, baseUrl]\n  );\n\n  useEffect(() => {\n    let mounted = true;\n    gradual.ready().then(() => {\n      if (mounted) {\n        setIsReady(true);\n      }\n    });\n    return () => {\n      mounted = false;\n    };\n  }, [gradual]);\n\n  const value = useMemo(() => ({ gradual, isReady }), [gradual, isReady]);\n\n  return <GradualContext value={value}>{children}</GradualContext>;\n}\n"]}

package/package.json

@@ -0,0 +1,58 @@
+{
+  "name": "@gradual-so/sdk-react",
+  "version": "0.0.1",
+  "description": "Gradual feature flag SDK for React",
+  "type": "module",
+  "main": "./dist/index.cjs",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "license": "MIT",
+  "keywords": [
+    "feature-flags",
+    "feature-toggles",
+    "gradual",
+    "react",
+    "hooks",
+    "sdk"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/gradual-io/gradual",
+    "directory": "packages/sdk-react"
+  },
+  "scripts": {
+    "build": "tsup",
+    "clean": "git clean -xdf .cache .turbo dist node_modules",
+    "dev": "tsup --watch",
+    "typecheck": "tsc --noEmit --emitDeclarationOnly false"
+  },
+  "dependencies": {
+    "@gradual-so/sdk": "workspace:*"
+  },
+  "peerDependencies": {
+    "react": ">=18.0.0"
+  },
+  "devDependencies": {
+    "@gradual/tsconfig": "workspace:*",
+    "@types/react": "catalog:react",
+    "react": "catalog:react",
+    "tsup": "^8.5.1",
+    "typescript": "catalog:"
+  }
+}