@myflags/react/dist/index.cjs.map

React bindings for MyFlags feature flag management

{"version":3,"sources":["../src/index.ts","../src/Provider.tsx","../src/hooks/useIndexedDB.ts","../src/hooks/useFlag.ts","../src/components/FeatureFlag.tsx","../src/hooks/useFlags.ts"],"sourcesContent":["export { type Flag, type MyFlagsConfig } from \"@myflags/core\";\nexport { FeatureFlag } from \"./components/FeatureFlag\";\nexport { default as useFlags } from \"./hooks/useFlags\";\nexport { default as useFlag } from \"./hooks/useFlag\";\nexport { MyFlagsProvider } from \"./Provider\";\n","import React, { createContext, useContext, useEffect, useState } from \"react\";\nimport { Flag, MyFlagsConfig, MyFlagsSDK } from \"@myflags/core\";\nimport { useIndexedDB } from \"./hooks/useIndexedDB\";\n\ninterface MyFlagsProviderProps {\n  config: MyFlagsConfig;\n  children: React.ReactNode;\n}\n\nexport const MyFlagsContext = createContext<Flag | null>(null);\n\nexport function MyFlagsProvider(props: MyFlagsProviderProps): JSX.Element {\n  const [flags, setFlags] = useIndexedDB<Flag>(\"flags\", {});\n  const [client] = useState(() => new MyFlagsSDK(props.config));\n\n  useEffect(() => {\n    const unsubscribe = client.subscribe(setFlags);\n    return () => unsubscribe();\n  }, [client]);\n\n  return (\n    <MyFlagsContext.Provider value={flags}>\n      {props.children}\n    </MyFlagsContext.Provider>\n  );\n}\n\nexport function useMyFlagsContext(): Flag {\n  const context = useContext(MyFlagsContext);\n  if (!context) throw new Error(\"MyFlagsContext not found\");\n\n  return context;\n}\n","import { useState, useCallback, useEffect, useRef } from \"react\";\n\nconst DB_NAME = \"myflags\";\nconst DB_VERSION = 1;\nconst STORE_NAME = \"flags\";\n\nexport function useIndexedDB<T>(\n  key: string,\n  initialValue: T\n): [T, (value: T) => void] {\n  const [storedValue, setStoredValue] = useState<T>(initialValue);\n  const [isDbReady, setIsDbReady] = useState<boolean>(false);\n  const pendingWrites = useRef<T[]>([]);\n\n  const openDB = useCallback(() => {\n    return new Promise<IDBDatabase>((resolve, reject) => {\n      if (typeof window === \"undefined\" || !window.indexedDB) {\n        reject(\"IndexedDB not supported\");\n        return;\n      }\n\n      const request = window.indexedDB.open(DB_NAME, DB_VERSION);\n\n      request.onerror = () => {\n        reject(\"Error opening IndexedDB\");\n      };\n\n      request.onsuccess = (event) => {\n        const db = (event.target as IDBOpenDBRequest).result;\n        resolve(db);\n      };\n\n      request.onupgradeneeded = (event) => {\n        const db = (event.target as IDBOpenDBRequest).result;\n        if (!db.objectStoreNames.contains(STORE_NAME)) {\n          db.createObjectStore(STORE_NAME, { keyPath: \"id\" });\n        }\n      };\n    });\n  }, []);\n\n  // Function to get value from IndexedDB\n  const getValueFromDB = useCallback(async () => {\n    if (typeof window === \"undefined\" || !window.indexedDB) {\n      return initialValue;\n    }\n\n    try {\n      const db = await openDB();\n      return new Promise<T>((resolve) => {\n        const transaction = db.transaction(STORE_NAME, \"readonly\");\n        const store = transaction.objectStore(STORE_NAME);\n        const request = store.get(key);\n\n        request.onerror = () => {\n          resolve(initialValue);\n        };\n\n        request.onsuccess = () => {\n          const result = request.result;\n          db.close();\n          if (result) {\n            resolve(result.value);\n          } else {\n            resolve(initialValue);\n          }\n        };\n      });\n    } catch {\n      return initialValue;\n    }\n  }, [key, initialValue, openDB]);\n\n  // Function to set value in IndexedDB\n  const setValueInDB = useCallback(\n    async (valueToStore: T) => {\n      if (typeof window === \"undefined\" || !window.indexedDB) {\n        console.warn(\"[MyFlags] IndexedDB not supported in this environment\");\n        return;\n      }\n\n      try {\n        const db = await openDB();\n        const transaction = db.transaction(STORE_NAME, \"readwrite\");\n        const store = transaction.objectStore(STORE_NAME);\n        store.put({ id: key, value: valueToStore });\n\n        transaction.oncomplete = () => {\n          db.close();\n        };\n\n        transaction.onerror = () => {\n          db.close();\n        };\n      } catch (error) {\n        console.error(\"[MyFlags] Error in setValueInDB:\", error);\n      }\n    },\n    [key, openDB]\n  );\n\n  useEffect(() => {\n    const initializeDB = async () => {\n      try {\n        const value = await getValueFromDB();\n        setStoredValue(value);\n        setIsDbReady(true);\n        \n        // Process any pending writes\n        if (pendingWrites.current.length > 0) {\n          for (const value of pendingWrites.current) {\n            await setValueInDB(value);\n          }\n          pendingWrites.current = [];\n        }\n      } catch {\n        setIsDbReady(true);\n      }\n    };\n\n    initializeDB();\n  }, [getValueFromDB, setValueInDB]);\n\n  const setValue = useCallback(\n    (value: T) => {\n      try {\n        const valueToStore =\n          value instanceof Function ? value(storedValue) : value;\n\n        setStoredValue(valueToStore);\n\n        if (isDbReady) {\n          setValueInDB(valueToStore);\n        } else {\n          pendingWrites.current.push(valueToStore);\n        }\n      } catch (error) {\n        console.error(\"[MyFlags] Error in setValue:\", error);\n      }\n    },\n    [storedValue, isDbReady, setValueInDB]\n  );\n\n  return [storedValue, setValue];\n}\n","import { useMyFlagsContext } from \"../Provider\";\n\nexport default function useFlag(\n  name: string,\n  defaultValue: boolean = false\n): boolean {\n  const context = useMyFlagsContext();\n  return context[name] || defaultValue;\n}\n","import React from 'react';\nimport useFlag from '../hooks/useFlag';\n\ninterface FeatureFlagProps {\n  name: string;\n  children: (enabled: boolean) => React.ReactNode;\n  defaultValue?: boolean;\n}\n\nexport const FeatureFlag: React.FC<FeatureFlagProps> = ({\n  name,\n  children,\n  defaultValue = false,\n}) => {\n  const isEnabled = useFlag(name, defaultValue);\n  return <>{children(isEnabled)}</>;\n}; ","import { Flag } from \"@myflags/core\";\nimport { useMyFlagsContext } from \"../Provider\";\n\nexport default function useFlags(): Flag {\n  const context = useMyFlagsContext();\n  return context;\n}\n"],"mappings":"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","names":["import_react","value","import_jsx_runtime"]}