@featurevisor/react 1.35.4 → 2.0.0

package/README.md

@@ -4,12 +4,6 @@ React components and hooks for Featurevisor.
 
 Visit [https://featurevisor.com/docs/react/](https://featurevisor.com/docs/react/) for more information
 
-## Installation
-
-```
-$ npm install --save @featurevisor/react
-```
-
 ## License <!-- omit in toc -->
 
 MIT © [Fahad Heylaal](https://fahad19.com)

package/dist/index.js

@@ -1,2 +1,2 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.FeaturevisorReact=t(require("react")):e.FeaturevisorReact=t(e.React)}(this,(e=>(()=>{"use strict";var t={253:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.FeaturevisorContext=void 0;var o=r(12);t.FeaturevisorContext=o.createContext(void 0)},567:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.FeaturevisorProvider=function(e){return o.createElement(n.FeaturevisorContext.Provider,{value:e.instance},e.children)};var o=r(12),n=r(253)},728:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.activateFeature=function(e,t){return void 0===t&&(t={}),(0,o.useSdk)().activate(e,t)};var o=r(316)},869:function(e,t,r){var o=this&&this.__createBinding||(Object.create?function(e,t,r,o){void 0===o&&(o=r);var n=Object.getOwnPropertyDescriptor(t,r);n&&!("get"in n?!t.__esModule:n.writable||n.configurable)||(n={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,o,n)}:function(e,t,r,o){void 0===o&&(o=r),e[o]=t[r]}),n=this&&this.__exportStar||function(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||o(t,e,r)};Object.defineProperty(t,"__esModule",{value:!0}),n(r(253),t),n(r(567),t),n(r(728),t),n(r(316),t),n(r(700),t),n(r(926),t),n(r(929),t),n(r(940),t)},940:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useFlag=function(e,t){return void 0===t&&(t={}),(0,o.useSdk)().isEnabled(e,t)};var o=r(316)},316:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useSdk=function(){return o.useContext(n.FeaturevisorContext)};var o=r(12),n=r(253)},700:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useStatus=function(){var e=(0,n.useSdk)(),t=e.isReady(),r=o.useState(t),u=r[0],i=r[1];return o.useEffect((function(){function t(){i(!0)}return e.on("ready",t),function(){e.off("ready",t)}}),[]),{isReady:u}};var o=r(12),n=r(316)},926:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useVariable=function(e,t,r){return void 0===r&&(r={}),(0,o.useSdk)().getVariable(e,t,r)};var o=r(316)},929:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useVariation=function(e,t){return void 0===t&&(t={}),(0,o.useSdk)().getVariation(e,t)};var o=r(316)},12:t=>{t.exports=e}},r={};return function e(o){var n=r[o];if(void 0!==n)return n.exports;var u=r[o]={exports:{}};return t[o].call(u.exports,u,u.exports,e),u.exports}(869)})()));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t(require("react")):"function"==typeof define&&define.amd?define(["react"],t):"object"==typeof exports?exports.FeaturevisorReact=t(require("react")):e.FeaturevisorReact=t(e.React)}(this,(e=>(()=>{"use strict";var t={253:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.FeaturevisorContext=void 0;var n=r(12);t.FeaturevisorContext=n.createContext(void 0)},567:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.FeaturevisorProvider=function(e){return n.createElement(o.FeaturevisorContext.Provider,{value:e.instance},e.children)};var n=r(12),o=r(253)},869:function(e,t,r){var n=this&&this.__createBinding||(Object.create?function(e,t,r,n){void 0===n&&(n=r);var o=Object.getOwnPropertyDescriptor(t,r);o&&!("get"in o?!t.__esModule:o.writable||o.configurable)||(o={enumerable:!0,get:function(){return t[r]}}),Object.defineProperty(e,n,o)}:function(e,t,r,n){void 0===n&&(n=r),e[n]=t[r]}),o=this&&this.__exportStar||function(e,t){for(var r in e)"default"===r||Object.prototype.hasOwnProperty.call(t,r)||n(t,e,r)};Object.defineProperty(t,"__esModule",{value:!0}),o(r(253),t),o(r(567),t),o(r(316),t),o(r(926),t),o(r(929),t),o(r(940),t),o(r(576),t)},576:(e,t)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.onFeatureChange=function(e,t,r){var n=e.on("datafile_set",(function(e){var n=e.features;Array.isArray(n)&&n.indexOf(t)>-1&&r()})),o=e.on("context_set",(function(){r()})),a=e.on("sticky_set",(function(e){var n=e.features;Array.isArray(n)&&n.indexOf(t)>-1&&r()}));return function(){n(),o(),a()}}},940:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useFlag=function(e,t){void 0===t&&(t={});var r=(0,o.useSdk)(),u=r.isEnabled(e,t),i=(0,n.useState)(u),c=i[0],s=i[1];return(0,n.useEffect)((function(){var n=(0,a.onFeatureChange)(r,e,(function(){var n=r.isEnabled(e,t);n!==c&&s(n)}));return function(){n()}}),[e,t]),c};var n=r(12),o=r(316),a=r(576)},316:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useSdk=function(){return n.useContext(o.FeaturevisorContext)};var n=r(12),o=r(253)},926:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useVariable=function(e,t,r){void 0===r&&(r={});var u=(0,o.useSdk)(),i=u.getVariable(e,t,r),c=(0,n.useState)(i),s=c[0],f=c[1];return(0,n.useEffect)((function(){var n=(0,a.onFeatureChange)(u,e,(function(){var n=u.getVariable(e,t,r);n!==s&&f(n)}));return function(){n()}}),[e,t,r]),s};var n=r(12),o=r(316),a=r(576)},929:(e,t,r)=>{Object.defineProperty(t,"__esModule",{value:!0}),t.useVariation=function(e,t){void 0===t&&(t={});var r=(0,o.useSdk)(),u=r.getVariation(e,t),i=(0,n.useState)(u),c=i[0],s=i[1];return(0,n.useEffect)((function(){var n=(0,a.onFeatureChange)(r,e,(function(){var n=r.getVariation(e,t);n!==c&&s(n)}));return function(){n()}}),[e,t]),c};var n=r(12),o=r(316),a=r(576)},12:t=>{t.exports=e}},r={};return function e(n){var o=r[n];if(void 0!==o)return o.exports;var a=r[n]={exports:{}};return t[n].call(a.exports,a,a.exports,e),a.exports}(869)})()));
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","mappings":"CAAA,SAA2CA,EAAMC,GAC1B,iBAAZC,SAA0C,iBAAXC,OACxCA,OAAOD,QAAUD,EAAQG,QAAQ,UACR,mBAAXC,QAAyBA,OAAOC,IAC9CD,OAAO,CAAC,SAAUJ,GACQ,iBAAZC,QACdA,QAA2B,kBAAID,EAAQG,QAAQ,UAE/CJ,EAAwB,kBAAIC,EAAQD,EAAY,MACjD,CATD,CASGO,MAAOC,G,sHCTV,YAGa,EAAAC,oBAAsBC,EAAMC,mBAAgDC,E,iECOzF,gCAAqCC,GACnC,OACE,gBAAC,EAAAJ,oBAAoBK,SAAQ,CAACC,MAAOF,EAAMG,UACxCH,EAAMI,SAGb,EAhBA,YAGA,Q,iECCA,2BACEC,EACAC,GAIA,YAJA,IAAAA,IAAAA,EAAA,KAEY,IAAAC,UAEDC,SAASH,EAAYC,EAClC,EATA,Y,2fCDA,YAGA,YAGA,YACA,YACA,YACA,YACA,YACA,W,iECRA,mBAAwBD,EAAwBC,GAG9C,YAH8C,IAAAA,IAAAA,EAAA,KAClC,IAAAC,UAEDE,UAAUJ,EAAYC,EACnC,EANA,Y,iECGA,oBAGE,OAFYT,EAAMa,WAAW,EAAAd,oBAG/B,EATA,YAGA,Q,iECKA,uBACE,IAAMe,GAAM,IAAAJ,UACNK,EAAgBD,EAAIE,UAEpB,EAAwBhB,EAAMiB,SAASF,GAAtCC,EAAO,KAAEE,EAAU,KAc1B,OAZAlB,EAAMmB,WAAU,WACd,SAASC,IACPF,GAAW,EACb,CAIA,OAFAJ,EAAIO,GAAG,QAASD,GAET,WACLN,EAAIQ,IAAI,QAASF,EACnB,CACF,GAAG,IAEI,CAAEJ,QAAO,EAClB,EA3BA,YAEA,Q,iECEA,uBACER,EACAe,EACAd,GAIA,YAJA,IAAAA,IAAAA,EAAA,KAEY,IAAAC,UAEDc,YAAYhB,EAAYe,EAAad,EAClD,EAVA,Y,iECEA,wBACED,EACAC,GAIA,YAJA,IAAAA,IAAAA,EAAA,KAEY,IAAAC,UAEDe,aAAajB,EAAYC,EACtC,EATA,Y,SCFAhB,EAAOD,QAAUM,C,GCCb4B,EAA2B,CAAC,E,OAGhC,SAASC,EAAoBC,GAE5B,IAAIC,EAAeH,EAAyBE,GAC5C,QAAqB1B,IAAjB2B,EACH,OAAOA,EAAarC,QAGrB,IAAIC,EAASiC,EAAyBE,GAAY,CAGjDpC,QAAS,CAAC,GAOX,OAHAsC,EAAoBF,GAAUG,KAAKtC,EAAOD,QAASC,EAAQA,EAAOD,QAASmC,GAGpElC,EAAOD,OACf,CCnB0BmC,CAAoB,I","sources":["webpack://FeaturevisorReact/webpack/universalModuleDefinition","webpack://FeaturevisorReact/./src/FeaturevisorContext.ts","webpack://FeaturevisorReact/./src/FeaturevisorProvider.tsx","webpack://FeaturevisorReact/./src/activateFeature.ts","webpack://FeaturevisorReact/./src/index.ts","webpack://FeaturevisorReact/./src/useFlag.ts","webpack://FeaturevisorReact/./src/useSdk.ts","webpack://FeaturevisorReact/./src/useStatus.ts","webpack://FeaturevisorReact/./src/useVariable.ts","webpack://FeaturevisorReact/./src/useVariation.ts","webpack://FeaturevisorReact/external umd {\"commonjs\":\"react\",\"commonjs2\":\"react\",\"amd\":\"react\",\"root\":\"React\"}","webpack://FeaturevisorReact/webpack/bootstrap","webpack://FeaturevisorReact/webpack/startup"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"FeaturevisorReact\"] = factory(require(\"react\"));\n\telse\n\t\troot[\"FeaturevisorReact\"] = factory(root[\"React\"]);\n})(this, (__WEBPACK_EXTERNAL_MODULE__12__) => {\nreturn ","import * as React from \"react\";\nimport { FeaturevisorInstance } from \"@featurevisor/sdk\";\n\nexport const FeaturevisorContext = React.createContext<FeaturevisorInstance | undefined>(undefined);\n","import * as React from \"react\";\nimport { FeaturevisorInstance } from \"@featurevisor/sdk\";\n\nimport { FeaturevisorContext } from \"./FeaturevisorContext\";\n\nexport interface FeaturevisorProviderProps {\n  instance: FeaturevisorInstance;\n  children: React.ReactNode;\n}\n\nexport function FeaturevisorProvider(props: FeaturevisorProviderProps) {\n  return (\n    <FeaturevisorContext.Provider value={props.instance}>\n      {props.children}\n    </FeaturevisorContext.Provider>\n  );\n}\n","import { Context, FeatureKey, VariationValue } from \"@featurevisor/types\";\n\nimport { useSdk } from \"./useSdk\";\n\nexport function activateFeature(\n  featureKey: FeatureKey,\n  context: Context = {},\n): VariationValue | undefined {\n  const sdk = useSdk();\n\n  return sdk.activate(featureKey, context);\n}\n","// contexts\nexport * from \"./FeaturevisorContext\";\n\n// components\nexport * from \"./FeaturevisorProvider\";\n\n// hooks\nexport * from \"./activateFeature\";\nexport * from \"./useSdk\";\nexport * from \"./useStatus\";\nexport * from \"./useVariable\";\nexport * from \"./useVariation\";\nexport * from \"./useFlag\";\n","import { Context, FeatureKey } from \"@featurevisor/types\";\n\nimport { useSdk } from \"./useSdk\";\n\nexport function useFlag(featureKey: FeatureKey, context: Context = {}): boolean {\n  const sdk = useSdk();\n\n  return sdk.isEnabled(featureKey, context);\n}\n","import * as React from \"react\";\nimport { FeaturevisorInstance } from \"@featurevisor/sdk\";\n\nimport { FeaturevisorContext } from \"./FeaturevisorContext\";\n\nexport function useSdk(): FeaturevisorInstance {\n  const sdk = React.useContext(FeaturevisorContext);\n\n  return sdk as FeaturevisorInstance;\n}\n","import * as React from \"react\";\n\nimport { useSdk } from \"./useSdk\";\n\nexport interface Status {\n  isReady: boolean;\n}\n\nexport function useStatus(): Status {\n  const sdk = useSdk();\n  const initialStatus = sdk.isReady();\n\n  const [isReady, setIsReady] = React.useState(initialStatus);\n\n  React.useEffect(function () {\n    function handleReady() {\n      setIsReady(true);\n    }\n\n    sdk.on(\"ready\", handleReady);\n\n    return function () {\n      sdk.off(\"ready\", handleReady);\n    };\n  }, []);\n\n  return { isReady };\n}\n","import { Context, FeatureKey, VariableKey, VariableValue } from \"@featurevisor/types\";\n\nimport { useSdk } from \"./useSdk\";\n\nexport function useVariable(\n  featureKey: FeatureKey,\n  variableKey: VariableKey,\n  context: Context = {},\n): VariableValue | undefined {\n  const sdk = useSdk();\n\n  return sdk.getVariable(featureKey, variableKey, context);\n}\n","import { Context, FeatureKey, VariationValue } from \"@featurevisor/types\";\n\nimport { useSdk } from \"./useSdk\";\n\nexport function useVariation(\n  featureKey: FeatureKey,\n  context: Context = {},\n): VariationValue | undefined {\n  const sdk = useSdk();\n\n  return sdk.getVariation(featureKey, context);\n}\n","module.exports = __WEBPACK_EXTERNAL_MODULE__12__;","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// startup\n// Load entry module and return exports\n// This entry module is referenced by other modules so it can't be inlined\nvar __webpack_exports__ = __webpack_require__(869);\n"],"names":["root","factory","exports","module","require","define","amd","this","__WEBPACK_EXTERNAL_MODULE__12__","FeaturevisorContext","React","createContext","undefined","props","Provider","value","instance","children","featureKey","context","useSdk","activate","isEnabled","useContext","sdk","initialStatus","isReady","useState","setIsReady","useEffect","handleReady","on","off","variableKey","getVariable","getVariation","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","__webpack_modules__","call"],"sourceRoot":""}
+{"version":3,"file":"index.js","mappings":"CAAA,SAA2CA,EAAMC,GAC1B,iBAAZC,SAA0C,iBAAXC,OACxCA,OAAOD,QAAUD,EAAQG,QAAQ,UACR,mBAAXC,QAAyBA,OAAOC,IAC9CD,OAAO,CAAC,SAAUJ,GACQ,iBAAZC,QACdA,QAA2B,kBAAID,EAAQG,QAAQ,UAE/CJ,EAAwB,kBAAIC,EAAQD,EAAY,MACjD,CATD,CASGO,MAAOC,G,sHCTV,YAGa,EAAAC,oBAAsBC,EAAMC,mBAAgDC,E,iECOzF,gCAAqCC,GACnC,OACE,gBAAC,EAAAJ,oBAAoBK,SAAQ,CAACC,MAAOF,EAAMG,UACxCH,EAAMI,SAGb,EAhBA,YAGA,Q,2fCFA,YAGA,YAGA,YACA,YACA,YACA,YAGA,W,+DCVA,2BAAgCC,EAA2BC,EAAwBC,GAEjF,IAAMC,EAAyBH,EAAII,GAAG,gBAAgB,SAAC,G,IAAEC,EAAQ,WAC3DC,MAAMC,QAAQF,IAAaA,EAASG,QAAQP,IAAe,GAC7DC,GAEJ,IAGMO,EAAwBT,EAAII,GAAG,eAAe,WAClDF,GACF,IAGMQ,EAAuBV,EAAII,GAAG,cAAc,SAAC,G,IAAEC,EAAQ,WACvDC,MAAMC,QAAQF,IAAaA,EAASG,QAAQP,IAAe,GAC7DC,GAEJ,IAEA,OAAO,WACLC,IACAM,IACAC,GACF,CACF,C,iECrBA,mBAAwBT,EAAwBU,QAAA,IAAAA,IAAAA,EAAA,IAC9C,IAAMX,GAAM,IAAAY,UACNC,EAAeb,EAAIc,UAAUb,EAAYU,GACzC,GAA4B,IAAAI,UAASF,GAApCC,EAAS,KAAEE,EAAY,KAgB9B,OAdA,IAAAC,YAAU,WACR,IAAMC,GAAc,IAAAC,iBAAgBnB,EAAKC,GAAY,WACnD,IAAMmB,EAAWpB,EAAIc,UAAUb,EAAYU,GAEvCS,IAAaN,GACfE,EAAaI,EAEjB,IAEA,OAAO,WACLF,GACF,CACF,GAAG,CAACjB,EAAYU,IAETG,CACT,EA3BA,YAIA,SACA,Q,iECAA,oBAGE,OAFYtB,EAAM6B,WAAW,EAAA9B,oBAG/B,EATA,YAGA,Q,iECIA,uBACEU,EACAqB,EACAX,QAAA,IAAAA,IAAAA,EAAA,IAEA,IAAMX,GAAM,IAAAY,UACNC,EAAeb,EAAIuB,YAAYtB,EAAYqB,EAAaX,GACxD,GAAoC,IAAAI,UAA+BF,GAAlEW,EAAa,KAAEC,EAAgB,KAgBtC,OAdA,IAAAR,YAAU,WACR,IAAMC,GAAc,IAAAC,iBAAgBnB,EAAKC,GAAY,WACnD,IAAMmB,EAAWpB,EAAIuB,YAAYtB,EAAYqB,EAAaX,GAEtDS,IAAaI,GACfC,EAAiBL,EAErB,IAEA,OAAO,WACLF,GACF,CACF,GAAG,CAACjB,EAAYqB,EAAaX,IAEtBa,CACT,EA/BA,YAIA,SACA,Q,iECEA,wBAA6BvB,EAAwBU,QAAA,IAAAA,IAAAA,EAAA,IACnD,IAAMX,GAAM,IAAAY,UACNC,EAAeb,EAAI0B,aAAazB,EAAYU,GAC5C,GAAsC,IAAAI,UAAgCF,GAArEc,EAAc,KAAEC,EAAiB,KAgBxC,OAdA,IAAAX,YAAU,WACR,IAAMC,GAAc,IAAAC,iBAAgBnB,EAAKC,GAAY,WACnD,IAAMmB,EAAWpB,EAAI0B,aAAazB,EAAYU,GAE1CS,IAAaO,GACfC,EAAkBR,EAEtB,IAEA,OAAO,WACLF,GACF,CACF,GAAG,CAACjB,EAAYU,IAETgB,CACT,EA3BA,YAIA,SACA,Q,SCLA1C,EAAOD,QAAUM,C,GCCbuC,EAA2B,CAAC,E,OAGhC,SAASC,EAAoBC,GAE5B,IAAIC,EAAeH,EAAyBE,GAC5C,QAAqBrC,IAAjBsC,EACH,OAAOA,EAAahD,QAGrB,IAAIC,EAAS4C,EAAyBE,GAAY,CAGjD/C,QAAS,CAAC,GAOX,OAHAiD,EAAoBF,GAAUG,KAAKjD,EAAOD,QAASC,EAAQA,EAAOD,QAAS8C,GAGpE7C,EAAOD,OACf,CCnB0B8C,CAAoB,I","sources":["webpack://FeaturevisorReact/webpack/universalModuleDefinition","webpack://FeaturevisorReact/./src/FeaturevisorContext.ts","webpack://FeaturevisorReact/./src/FeaturevisorProvider.tsx","webpack://FeaturevisorReact/./src/index.ts","webpack://FeaturevisorReact/./src/onFeatureChange.ts","webpack://FeaturevisorReact/./src/useFlag.ts","webpack://FeaturevisorReact/./src/useSdk.ts","webpack://FeaturevisorReact/./src/useVariable.ts","webpack://FeaturevisorReact/./src/useVariation.ts","webpack://FeaturevisorReact/external umd {\"commonjs\":\"react\",\"commonjs2\":\"react\",\"amd\":\"react\",\"root\":\"React\"}","webpack://FeaturevisorReact/webpack/bootstrap","webpack://FeaturevisorReact/webpack/startup"],"sourcesContent":["(function webpackUniversalModuleDefinition(root, factory) {\n\tif(typeof exports === 'object' && typeof module === 'object')\n\t\tmodule.exports = factory(require(\"react\"));\n\telse if(typeof define === 'function' && define.amd)\n\t\tdefine([\"react\"], factory);\n\telse if(typeof exports === 'object')\n\t\texports[\"FeaturevisorReact\"] = factory(require(\"react\"));\n\telse\n\t\troot[\"FeaturevisorReact\"] = factory(root[\"React\"]);\n})(this, (__WEBPACK_EXTERNAL_MODULE__12__) => {\nreturn ","import * as React from \"react\";\nimport { FeaturevisorInstance } from \"@featurevisor/sdk\";\n\nexport const FeaturevisorContext = React.createContext<FeaturevisorInstance | undefined>(undefined);\n","import * as React from \"react\";\nimport { FeaturevisorInstance } from \"@featurevisor/sdk\";\n\nimport { FeaturevisorContext } from \"./FeaturevisorContext\";\n\nexport interface FeaturevisorProviderProps {\n  instance: FeaturevisorInstance;\n  children: React.ReactNode;\n}\n\nexport function FeaturevisorProvider(props: FeaturevisorProviderProps) {\n  return (\n    <FeaturevisorContext.Provider value={props.instance}>\n      {props.children}\n    </FeaturevisorContext.Provider>\n  );\n}\n","// contexts\nexport * from \"./FeaturevisorContext\";\n\n// components\nexport * from \"./FeaturevisorProvider\";\n\n// hooks\nexport * from \"./useSdk\";\nexport * from \"./useVariable\";\nexport * from \"./useVariation\";\nexport * from \"./useFlag\";\n\n// utils\nexport * from \"./onFeatureChange\";\n","import { FeaturevisorInstance } from \"@featurevisor/sdk\";\nimport type { FeatureKey } from \"@featurevisor/types\";\n\nexport function onFeatureChange(sdk: FeaturevisorInstance, featureKey: FeatureKey, fn) {\n  // datafile_set\n  const unsubscribeDatafileSet = sdk.on(\"datafile_set\", ({ features }) => {\n    if (Array.isArray(features) && features.indexOf(featureKey) > -1) {\n      fn();\n    }\n  });\n\n  // context_set\n  const unsubscribeContextSet = sdk.on(\"context_set\", () => {\n    fn();\n  });\n\n  // sticky_set\n  const unsubscribeStickySet = sdk.on(\"sticky_set\", ({ features }) => {\n    if (Array.isArray(features) && features.indexOf(featureKey) > -1) {\n      fn();\n    }\n  });\n\n  return function () {\n    unsubscribeDatafileSet();\n    unsubscribeContextSet();\n    unsubscribeStickySet();\n  };\n}\n","import { useEffect, useState } from \"react\";\n\nimport type { Context, FeatureKey } from \"@featurevisor/types\";\n\nimport { useSdk } from \"./useSdk\";\nimport { onFeatureChange } from \"./onFeatureChange\";\n\nexport function useFlag(featureKey: FeatureKey, context: Context = {}): boolean {\n  const sdk = useSdk();\n  const initialValue = sdk.isEnabled(featureKey, context);\n  const [isEnabled, setIsEnabled] = useState(initialValue);\n\n  useEffect(() => {\n    const unsubscribe = onFeatureChange(sdk, featureKey, () => {\n      const newValue = sdk.isEnabled(featureKey, context);\n\n      if (newValue !== isEnabled) {\n        setIsEnabled(newValue);\n      }\n    });\n\n    return () => {\n      unsubscribe();\n    };\n  }, [featureKey, context]);\n\n  return isEnabled;\n}\n","import * as React from \"react\";\nimport { FeaturevisorInstance } from \"@featurevisor/sdk\";\n\nimport { FeaturevisorContext } from \"./FeaturevisorContext\";\n\nexport function useSdk(): FeaturevisorInstance {\n  const sdk = React.useContext(FeaturevisorContext);\n\n  return sdk as FeaturevisorInstance;\n}\n","import { useEffect, useState } from \"react\";\n\nimport type { Context, FeatureKey, VariableKey, VariableValue } from \"@featurevisor/types\";\n\nimport { useSdk } from \"./useSdk\";\nimport { onFeatureChange } from \"./onFeatureChange\";\n\nexport function useVariable(\n  featureKey: FeatureKey,\n  variableKey: VariableKey,\n  context: Context = {},\n): VariableValue | null {\n  const sdk = useSdk();\n  const initialValue = sdk.getVariable(featureKey, variableKey, context);\n  const [variableValue, setVariableValue] = useState<VariableValue | null>(initialValue);\n\n  useEffect(() => {\n    const unsubscribe = onFeatureChange(sdk, featureKey, () => {\n      const newValue = sdk.getVariable(featureKey, variableKey, context);\n\n      if (newValue !== variableValue) {\n        setVariableValue(newValue);\n      }\n    });\n\n    return () => {\n      unsubscribe();\n    };\n  }, [featureKey, variableKey, context]);\n\n  return variableValue;\n}\n","import { useEffect, useState } from \"react\";\n\nimport { Context, FeatureKey, VariationValue } from \"@featurevisor/types\";\n\nimport { useSdk } from \"./useSdk\";\nimport { onFeatureChange } from \"./onFeatureChange\";\n\nexport function useVariation(featureKey: FeatureKey, context: Context = {}): VariationValue | null {\n  const sdk = useSdk();\n  const initialValue = sdk.getVariation(featureKey, context);\n  const [variationValue, setVariationValue] = useState<VariationValue | null>(initialValue);\n\n  useEffect(() => {\n    const unsubscribe = onFeatureChange(sdk, featureKey, () => {\n      const newValue = sdk.getVariation(featureKey, context);\n\n      if (newValue !== variationValue) {\n        setVariationValue(newValue);\n      }\n    });\n\n    return () => {\n      unsubscribe();\n    };\n  }, [featureKey, context]);\n\n  return variationValue;\n}\n","module.exports = __WEBPACK_EXTERNAL_MODULE__12__;","// The module cache\nvar __webpack_module_cache__ = {};\n\n// The require function\nfunction __webpack_require__(moduleId) {\n\t// Check if module is in cache\n\tvar cachedModule = __webpack_module_cache__[moduleId];\n\tif (cachedModule !== undefined) {\n\t\treturn cachedModule.exports;\n\t}\n\t// Create a new module (and put it into the cache)\n\tvar module = __webpack_module_cache__[moduleId] = {\n\t\t// no module.id needed\n\t\t// no module.loaded needed\n\t\texports: {}\n\t};\n\n\t// Execute the module function\n\t__webpack_modules__[moduleId].call(module.exports, module, module.exports, __webpack_require__);\n\n\t// Return the exports of the module\n\treturn module.exports;\n}\n\n","// startup\n// Load entry module and return exports\n// This entry module is referenced by other modules so it can't be inlined\nvar __webpack_exports__ = __webpack_require__(869);\n"],"names":["root","factory","exports","module","require","define","amd","this","__WEBPACK_EXTERNAL_MODULE__12__","FeaturevisorContext","React","createContext","undefined","props","Provider","value","instance","children","sdk","featureKey","fn","unsubscribeDatafileSet","on","features","Array","isArray","indexOf","unsubscribeContextSet","unsubscribeStickySet","context","useSdk","initialValue","isEnabled","useState","setIsEnabled","useEffect","unsubscribe","onFeatureChange","newValue","useContext","variableKey","getVariable","variableValue","setVariableValue","getVariation","variationValue","setVariationValue","__webpack_module_cache__","__webpack_require__","moduleId","cachedModule","__webpack_modules__","call"],"sourceRoot":""}

package/lib/index.d.ts

@@ -1,8 +1,7 @@
 export * from "./FeaturevisorContext";
 export * from "./FeaturevisorProvider";
-export * from "./activateFeature";
 export * from "./useSdk";
-export * from "./useStatus";
 export * from "./useVariable";
 export * from "./useVariation";
 export * from "./useFlag";
+export * from "./onFeatureChange";

package/lib/index.js

@@ -3,10 +3,10 @@ export * from "./FeaturevisorContext";
 // components
 export * from "./FeaturevisorProvider";
 // hooks
-export * from "./activateFeature";
 export * from "./useSdk";
-export * from "./useStatus";
 export * from "./useVariable";
 export * from "./useVariation";
 export * from "./useFlag";
+// utils
+export * from "./onFeatureChange";
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,WAAW;AACX,cAAc,uBAAuB,CAAC;AAEtC,aAAa;AACb,cAAc,wBAAwB,CAAC;AAEvC,QAAQ;AACR,cAAc,mBAAmB,CAAC;AAClC,cAAc,UAAU,CAAC;AACzB,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,WAAW;AACX,cAAc,uBAAuB,CAAC;AAEtC,aAAa;AACb,cAAc,wBAAwB,CAAC;AAEvC,QAAQ;AACR,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAE1B,QAAQ;AACR,cAAc,mBAAmB,CAAC"}

package/lib/onFeatureChange.d.ts

@@ -0,0 +1,3 @@
+import { FeaturevisorInstance } from "@featurevisor/sdk";
+import type { FeatureKey } from "@featurevisor/types";
+export declare function onFeatureChange(sdk: FeaturevisorInstance, featureKey: FeatureKey, fn: any): () => void;

package/lib/onFeatureChange.js

@@ -0,0 +1,24 @@
+export function onFeatureChange(sdk, featureKey, fn) {
+    // datafile_set
+    const unsubscribeDatafileSet = sdk.on("datafile_set", ({ features }) => {
+        if (Array.isArray(features) && features.indexOf(featureKey) > -1) {
+            fn();
+        }
+    });
+    // context_set
+    const unsubscribeContextSet = sdk.on("context_set", () => {
+        fn();
+    });
+    // sticky_set
+    const unsubscribeStickySet = sdk.on("sticky_set", ({ features }) => {
+        if (Array.isArray(features) && features.indexOf(featureKey) > -1) {
+            fn();
+        }
+    });
+    return function () {
+        unsubscribeDatafileSet();
+        unsubscribeContextSet();
+        unsubscribeStickySet();
+    };
+}
+//# sourceMappingURL=onFeatureChange.js.map

package/lib/onFeatureChange.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"onFeatureChange.js","sourceRoot":"","sources":["../src/onFeatureChange.ts"],"names":[],"mappings":"AAGA,MAAM,UAAU,eAAe,CAAC,GAAyB,EAAE,UAAsB,EAAE,EAAE;IACnF,eAAe;IACf,MAAM,sBAAsB,GAAG,GAAG,CAAC,EAAE,CAAC,cAAc,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;QACrE,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;YACjE,EAAE,EAAE,CAAC;QACP,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,cAAc;IACd,MAAM,qBAAqB,GAAG,GAAG,CAAC,EAAE,CAAC,aAAa,EAAE,GAAG,EAAE;QACvD,EAAE,EAAE,CAAC;IACP,CAAC,CAAC,CAAC;IAEH,aAAa;IACb,MAAM,oBAAoB,GAAG,GAAG,CAAC,EAAE,CAAC,YAAY,EAAE,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;QACjE,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC,OAAO,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;YACjE,EAAE,EAAE,CAAC;QACP,CAAC;IACH,CAAC,CAAC,CAAC;IAEH,OAAO;QACL,sBAAsB,EAAE,CAAC;QACzB,qBAAqB,EAAE,CAAC;QACxB,oBAAoB,EAAE,CAAC;IACzB,CAAC,CAAC;AACJ,CAAC"}

package/lib/useFlag.d.ts

@@ -1,2 +1,2 @@
-import { Context, FeatureKey } from "@featurevisor/types";
+import type { Context, FeatureKey } from "@featurevisor/types";
 export declare function useFlag(featureKey: FeatureKey, context?: Context): boolean;

package/lib/useFlag.js

@@ -1,6 +1,21 @@
+import { useEffect, useState } from "react";
 import { useSdk } from "./useSdk";
+import { onFeatureChange } from "./onFeatureChange";
 export function useFlag(featureKey, context = {}) {
     const sdk = useSdk();
-    return sdk.isEnabled(featureKey, context);
+    const initialValue = sdk.isEnabled(featureKey, context);
+    const [isEnabled, setIsEnabled] = useState(initialValue);
+    useEffect(() => {
+        const unsubscribe = onFeatureChange(sdk, featureKey, () => {
+            const newValue = sdk.isEnabled(featureKey, context);
+            if (newValue !== isEnabled) {
+                setIsEnabled(newValue);
+            }
+        });
+        return () => {
+            unsubscribe();
+        };
+    }, [featureKey, context]);
+    return isEnabled;
 }
 //# sourceMappingURL=useFlag.js.map

package/lib/useFlag.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFlag.js","sourceRoot":"","sources":["../src/useFlag.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,MAAM,UAAU,OAAO,CAAC,UAAsB,EAAE,UAAmB,EAAE;IACnE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IAErB,OAAO,GAAG,CAAC,SAAS,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;AAC5C,CAAC"}
+{"version":3,"file":"useFlag.js","sourceRoot":"","sources":["../src/useFlag.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAI5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,MAAM,UAAU,OAAO,CAAC,UAAsB,EAAE,UAAmB,EAAE;IACnE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,YAAY,GAAG,GAAG,CAAC,SAAS,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;IACxD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IAEzD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,WAAW,GAAG,eAAe,CAAC,GAAG,EAAE,UAAU,EAAE,GAAG,EAAE;YACxD,MAAM,QAAQ,GAAG,GAAG,CAAC,SAAS,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;YAEpD,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;gBAC3B,YAAY,CAAC,QAAQ,CAAC,CAAC;YACzB,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACV,WAAW,EAAE,CAAC;QAChB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAE1B,OAAO,SAAS,CAAC;AACnB,CAAC"}

package/lib/useVariable.d.ts

@@ -1,2 +1,2 @@
-import { Context, FeatureKey, VariableKey, VariableValue } from "@featurevisor/types";
-export declare function useVariable(featureKey: FeatureKey, variableKey: VariableKey, context?: Context): VariableValue | undefined;
+import type { Context, FeatureKey, VariableKey, VariableValue } from "@featurevisor/types";
+export declare function useVariable(featureKey: FeatureKey, variableKey: VariableKey, context?: Context): VariableValue | null;

package/lib/useVariable.js

@@ -1,6 +1,21 @@
+import { useEffect, useState } from "react";
 import { useSdk } from "./useSdk";
+import { onFeatureChange } from "./onFeatureChange";
 export function useVariable(featureKey, variableKey, context = {}) {
     const sdk = useSdk();
-    return sdk.getVariable(featureKey, variableKey, context);
+    const initialValue = sdk.getVariable(featureKey, variableKey, context);
+    const [variableValue, setVariableValue] = useState(initialValue);
+    useEffect(() => {
+        const unsubscribe = onFeatureChange(sdk, featureKey, () => {
+            const newValue = sdk.getVariable(featureKey, variableKey, context);
+            if (newValue !== variableValue) {
+                setVariableValue(newValue);
+            }
+        });
+        return () => {
+            unsubscribe();
+        };
+    }, [featureKey, variableKey, context]);
+    return variableValue;
 }
 //# sourceMappingURL=useVariable.js.map

package/lib/useVariable.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVariable.js","sourceRoot":"","sources":["../src/useVariable.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,MAAM,UAAU,WAAW,CACzB,UAAsB,EACtB,WAAwB,EACxB,UAAmB,EAAE;IAErB,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IAErB,OAAO,GAAG,CAAC,WAAW,CAAC,UAAU,EAAE,WAAW,EAAE,OAAO,CAAC,CAAC;AAC3D,CAAC"}
+{"version":3,"file":"useVariable.js","sourceRoot":"","sources":["../src/useVariable.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAI5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,MAAM,UAAU,WAAW,CACzB,UAAsB,EACtB,WAAwB,EACxB,UAAmB,EAAE;IAErB,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,YAAY,GAAG,GAAG,CAAC,WAAW,CAAC,UAAU,EAAE,WAAW,EAAE,OAAO,CAAC,CAAC;IACvE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAuB,YAAY,CAAC,CAAC;IAEvF,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,WAAW,GAAG,eAAe,CAAC,GAAG,EAAE,UAAU,EAAE,GAAG,EAAE;YACxD,MAAM,QAAQ,GAAG,GAAG,CAAC,WAAW,CAAC,UAAU,EAAE,WAAW,EAAE,OAAO,CAAC,CAAC;YAEnE,IAAI,QAAQ,KAAK,aAAa,EAAE,CAAC;gBAC/B,gBAAgB,CAAC,QAAQ,CAAC,CAAC;YAC7B,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACV,WAAW,EAAE,CAAC;QAChB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,EAAE,OAAO,CAAC,CAAC,CAAC;IAEvC,OAAO,aAAa,CAAC;AACvB,CAAC"}

package/lib/useVariation.d.ts

@@ -1,2 +1,2 @@
 import { Context, FeatureKey, VariationValue } from "@featurevisor/types";
-export declare function useVariation(featureKey: FeatureKey, context?: Context): VariationValue | undefined;
+export declare function useVariation(featureKey: FeatureKey, context?: Context): VariationValue | null;

package/lib/useVariation.js

@@ -1,6 +1,21 @@
+import { useEffect, useState } from "react";
 import { useSdk } from "./useSdk";
+import { onFeatureChange } from "./onFeatureChange";
 export function useVariation(featureKey, context = {}) {
     const sdk = useSdk();
-    return sdk.getVariation(featureKey, context);
+    const initialValue = sdk.getVariation(featureKey, context);
+    const [variationValue, setVariationValue] = useState(initialValue);
+    useEffect(() => {
+        const unsubscribe = onFeatureChange(sdk, featureKey, () => {
+            const newValue = sdk.getVariation(featureKey, context);
+            if (newValue !== variationValue) {
+                setVariationValue(newValue);
+            }
+        });
+        return () => {
+            unsubscribe();
+        };
+    }, [featureKey, context]);
+    return variationValue;
 }
 //# sourceMappingURL=useVariation.js.map

package/lib/useVariation.js.map

@@ -1 +1 @@
-{"version":3,"file":"useVariation.js","sourceRoot":"","sources":["../src/useVariation.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,MAAM,UAAU,YAAY,CAC1B,UAAsB,EACtB,UAAmB,EAAE;IAErB,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IAErB,OAAO,GAAG,CAAC,YAAY,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;AAC/C,CAAC"}
+{"version":3,"file":"useVariation.js","sourceRoot":"","sources":["../src/useVariation.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAI5C,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAEpD,MAAM,UAAU,YAAY,CAAC,UAAsB,EAAE,UAAmB,EAAE;IACxE,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,YAAY,GAAG,GAAG,CAAC,YAAY,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;IAC3D,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAwB,YAAY,CAAC,CAAC;IAE1F,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,WAAW,GAAG,eAAe,CAAC,GAAG,EAAE,UAAU,EAAE,GAAG,EAAE;YACxD,MAAM,QAAQ,GAAG,GAAG,CAAC,YAAY,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;YAEvD,IAAI,QAAQ,KAAK,cAAc,EAAE,CAAC;gBAChC,iBAAiB,CAAC,QAAQ,CAAC,CAAC;YAC9B,CAAC;QACH,CAAC,CAAC,CAAC;QAEH,OAAO,GAAG,EAAE;YACV,WAAW,EAAE,CAAC;QAChB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC,CAAC;IAE1B,OAAO,cAAc,CAAC;AACxB,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@featurevisor/react",
-  "version": "1.35.4",
+  "version": "2.0.0",
   "description": "React package for Featurevisor",
   "main": "dist/index.js",
   "module": "lib/index.js",
@@ -8,7 +8,8 @@
   "scripts": {
     "transpile": "rimraf lib && tsc --project tsconfig.esm.json",
     "dist": "webpack --config ./webpack.config.js",
-    "build": "npm run transpile && npm run dist"
+    "build": "npm run transpile && npm run dist",
+    "test": "jest --config jest.config.js"
   },
   "author": {
     "name": "Fahad Heylaal",
@@ -40,8 +41,8 @@
     "url": "https://github.com/featurevisor/featurevisor/issues"
   },
   "dependencies": {
-    "@featurevisor/sdk": "1.35.3",
-    "@featurevisor/types": "1.35.3"
+    "@featurevisor/sdk": "2.0.0",
+    "@featurevisor/types": "2.0.0"
   },
   "license": "MIT",
   "devDependencies": {
@@ -49,5 +50,5 @@
     "@testing-library/react": "^14.0.0",
     "jest-environment-jsdom": "^29.5.0"
   },
-  "gitHead": "6d83c98799d129a45b35e1cf257c960c8d24db6b"
+  "gitHead": "9817e05a07735294c750ee921991509b67015afd"
 }

package/src/index.ts

@@ -5,9 +5,10 @@ export * from "./FeaturevisorContext";
 export * from "./FeaturevisorProvider";
 
 // hooks
-export * from "./activateFeature";
 export * from "./useSdk";
-export * from "./useStatus";
 export * from "./useVariable";
 export * from "./useVariation";
 export * from "./useFlag";
+
+// utils
+export * from "./onFeatureChange";

package/src/onFeatureChange.ts

@@ -0,0 +1,29 @@
+import { FeaturevisorInstance } from "@featurevisor/sdk";
+import type { FeatureKey } from "@featurevisor/types";
+
+export function onFeatureChange(sdk: FeaturevisorInstance, featureKey: FeatureKey, fn) {
+  // datafile_set
+  const unsubscribeDatafileSet = sdk.on("datafile_set", ({ features }) => {
+    if (Array.isArray(features) && features.indexOf(featureKey) > -1) {
+      fn();
+    }
+  });
+
+  // context_set
+  const unsubscribeContextSet = sdk.on("context_set", () => {
+    fn();
+  });
+
+  // sticky_set
+  const unsubscribeStickySet = sdk.on("sticky_set", ({ features }) => {
+    if (Array.isArray(features) && features.indexOf(featureKey) > -1) {
+      fn();
+    }
+  });
+
+  return function () {
+    unsubscribeDatafileSet();
+    unsubscribeContextSet();
+    unsubscribeStickySet();
+  };
+}

package/src/useFlag.spec.tsx

@@ -1,33 +1,37 @@
 import * as React from "react";
-import { render, screen } from "@testing-library/react";
+import { render, screen, waitFor, act } from "@testing-library/react";
 import "@testing-library/jest-dom";
 
 import { FeaturevisorProvider } from "./FeaturevisorProvider";
 import { useFlag } from "./useFlag";
 import { createInstance } from "@featurevisor/sdk";
 
+function getNewDatafile(enabled = true) {
+  return {
+    schemaVersion: "2",
+    revision: "1.0",
+    features: {
+      test: {
+        key: "test",
+        bucketBy: "userId",
+        traffic: [
+          {
+            key: "1",
+            segments: "*",
+            percentage: enabled ? 100000 : 0,
+            allocation: [],
+          },
+        ],
+        hash: Math.random().toString(10).substring(2, 15),
+      },
+    },
+    segments: {},
+  };
+}
+
 function getNewInstance(enabled = true) {
   const sdk = createInstance({
-    datafile: {
-      schemaVersion: "1",
-      revision: "1.0",
-      features: [
-        {
-          key: "test",
-          bucketBy: "userId",
-          traffic: [
-            {
-              key: "1",
-              segments: "*",
-              percentage: enabled ? 100000 : 0,
-              allocation: [],
-            },
-          ],
-        },
-      ],
-      attributes: [],
-      segments: [],
-    },
+    datafile: getNewDatafile(enabled),
   });
 
   return sdk;
@@ -52,6 +56,7 @@ describe("react: useFlag", function () {
     );
 
     expect(screen.getByText("True")).toBeInTheDocument();
+    expect(screen.queryByText("False")).not.toBeInTheDocument();
   });
 
   test("should check if feature is disabled", function () {
@@ -68,5 +73,36 @@ describe("react: useFlag", function () {
     );
 
     expect(screen.getByText("False")).toBeInTheDocument();
+    expect(screen.queryByText("True")).not.toBeInTheDocument();
+  });
+
+  test("should check if feature evaluation is reactive", async function () {
+    function TestComponent() {
+      const isEnabled = useFlag("test", { userId: "1" });
+
+      return isEnabled ? <p>True</p> : <p>False</p>;
+    }
+
+    const f = getNewInstance(true);
+
+    render(
+      <FeaturevisorProvider instance={f}>
+        <TestComponent />
+      </FeaturevisorProvider>,
+    );
+
+    expect(screen.getByText("True")).toBeInTheDocument();
+    expect(screen.queryByText("False")).not.toBeInTheDocument();
+
+    // set new datafile
+    await act(async () => {
+      const newDatafile = getNewDatafile(false); // true => false
+      f.setDatafile(newDatafile);
+    });
+
+    await waitFor(() => {
+      expect(screen.getByText("False")).toBeInTheDocument();
+      expect(screen.queryByText("True")).not.toBeInTheDocument();
+    });
   });
 });

package/src/useFlag.ts

@@ -1,9 +1,28 @@
-import { Context, FeatureKey } from "@featurevisor/types";
+import { useEffect, useState } from "react";
+
+import type { Context, FeatureKey } from "@featurevisor/types";
 
 import { useSdk } from "./useSdk";
+import { onFeatureChange } from "./onFeatureChange";
 
 export function useFlag(featureKey: FeatureKey, context: Context = {}): boolean {
   const sdk = useSdk();
+  const initialValue = sdk.isEnabled(featureKey, context);
+  const [isEnabled, setIsEnabled] = useState(initialValue);
+
+  useEffect(() => {
+    const unsubscribe = onFeatureChange(sdk, featureKey, () => {
+      const newValue = sdk.isEnabled(featureKey, context);
+
+      if (newValue !== isEnabled) {
+        setIsEnabled(newValue);
+      }
+    });
+
+    return () => {
+      unsubscribe();
+    };
+  }, [featureKey, context]);
 
-  return sdk.isEnabled(featureKey, context);
+  return isEnabled;
 }

package/src/useSdk.spec.tsx

@@ -9,10 +9,10 @@ import { createInstance } from "@featurevisor/sdk";
 function getNewInstance() {
   const sdk = createInstance({
     datafile: {
-      schemaVersion: "1",
+      schemaVersion: "2",
       revision: "1.0",
-      features: [
-        {
+      features: {
+        test: {
           key: "test",
           bucketBy: "userId",
           variations: [{ value: "control" }, { value: "treatment" }],
@@ -28,9 +28,8 @@ function getNewInstance() {
             },
           ],
         },
-      ],
-      attributes: [],
-      segments: [],
+      },
+      segments: {},
     },
   });
 
@@ -43,10 +42,10 @@ describe("react: useSdk", function () {
   });
 
   test("should return the sdk", function () {
-    function TestComponent() {
-      const sdk = useSdk();
+    let sdk;
 
-      expect(typeof sdk.isReady).toEqual("function");
+    function TestComponent() {
+      sdk = useSdk();
 
       return <p>Test</p>;
     }
@@ -58,5 +57,7 @@ describe("react: useSdk", function () {
     );
 
     expect(screen.getByText("Test")).toBeInTheDocument();
+
+    expect(sdk).toBeDefined();
   });
 });

package/src/useVariable.spec.tsx

@@ -1,50 +1,49 @@
 import * as React from "react";
-import { render, screen } from "@testing-library/react";
+import { render, screen, waitFor, act } from "@testing-library/react";
 import "@testing-library/jest-dom";
 
+import { createInstance } from "@featurevisor/sdk";
+import { DatafileContent } from "@featurevisor/types";
+
 import { FeaturevisorProvider } from "./FeaturevisorProvider";
 import { useVariable } from "./useVariable";
-import { createInstance } from "@featurevisor/sdk";
 
-function getNewInstance() {
-  const sdk = createInstance({
-    datafile: {
-      schemaVersion: "1",
-      revision: "1.0",
-      features: [
-        {
-          key: "test",
-          bucketBy: "userId",
-          variations: [{ value: "control" }, { value: "b" }, { value: "c" }],
-          traffic: [
-            {
-              key: "1",
-              segments: "*",
-              percentage: 100000,
-              allocation: [
-                { variation: "control", range: [0, 33000] },
-                { variation: "b", range: [33000, 66000] },
-                { variation: "c", range: [66000, 100000] },
-              ],
-            },
-          ],
-          variablesSchema: [
-            { key: "color", type: "string", defaultValue: "red" },
-            {
-              key: "hero",
-              type: "object",
-              defaultValue: {
-                title: "Hero Title",
-                subtitle: "Hero Subtitle",
-                alignment: "center",
-              },
+function getNewDatafile(colorValue = "red"): DatafileContent {
+  return {
+    schemaVersion: "2",
+    revision: "1.0",
+    features: {
+      test: {
+        key: "test",
+        bucketBy: "userId",
+        traffic: [
+          {
+            key: "1",
+            segments: "*",
+            percentage: 100000,
+          },
+        ],
+        variablesSchema: {
+          color: { type: "string", defaultValue: colorValue },
+          hero: {
+            type: "object",
+            defaultValue: {
+              title: "Hero Title",
+              subtitle: "Hero Subtitle",
+              alignment: "center",
             },
-          ],
+          },
         },
-      ],
-      attributes: [],
-      segments: [],
+        hash: Math.random().toString(10).substring(2, 15),
+      },
     },
+    segments: {},
+  };
+}
+
+function getNewInstance() {
+  const sdk = createInstance({
+    datafile: getNewDatafile(),
   });
 
   return sdk;
@@ -70,4 +69,32 @@ describe("react: useVariable", function () {
 
     expect(screen.getByText("Red")).toBeInTheDocument();
   });
+
+  test("should return the variable reactively", function () {
+    function TestComponent() {
+      const variable = useVariable("test", "color", { userId: "1" });
+
+      return variable === "red" ? <p>Red</p> : <p>Some other colour</p>;
+    }
+
+    const f = getNewInstance();
+
+    render(
+      <FeaturevisorProvider instance={f}>
+        <TestComponent />
+      </FeaturevisorProvider>,
+    );
+
+    expect(screen.getByText("Red")).toBeInTheDocument();
+
+    // set new datafile
+    act(() => {
+      const newDatafile = getNewDatafile("blue"); // red => blue
+      f.setDatafile(newDatafile);
+    });
+
+    waitFor(() => {
+      expect(screen.getByText("Some other colour")).toBeInTheDocument();
+    });
+  });
 });

package/src/useVariable.ts

@@ -1,13 +1,32 @@
-import { Context, FeatureKey, VariableKey, VariableValue } from "@featurevisor/types";
+import { useEffect, useState } from "react";
+
+import type { Context, FeatureKey, VariableKey, VariableValue } from "@featurevisor/types";
 
 import { useSdk } from "./useSdk";
+import { onFeatureChange } from "./onFeatureChange";
 
 export function useVariable(
   featureKey: FeatureKey,
   variableKey: VariableKey,
   context: Context = {},
-): VariableValue | undefined {
+): VariableValue | null {
   const sdk = useSdk();
+  const initialValue = sdk.getVariable(featureKey, variableKey, context);
+  const [variableValue, setVariableValue] = useState<VariableValue | null>(initialValue);
+
+  useEffect(() => {
+    const unsubscribe = onFeatureChange(sdk, featureKey, () => {
+      const newValue = sdk.getVariable(featureKey, variableKey, context);
+
+      if (newValue !== variableValue) {
+        setVariableValue(newValue);
+      }
+    });
+
+    return () => {
+      unsubscribe();
+    };
+  }, [featureKey, variableKey, context]);
 
-  return sdk.getVariable(featureKey, variableKey, context);
+  return variableValue;
 }

package/src/useVariation.spec.tsx

@@ -1,37 +1,51 @@
 import * as React from "react";
-import { render, screen } from "@testing-library/react";
+import { render, screen, waitFor, act } from "@testing-library/react";
 import "@testing-library/jest-dom";
 
 import { FeaturevisorProvider } from "./FeaturevisorProvider";
 import { useVariation } from "./useVariation";
 import { createInstance } from "@featurevisor/sdk";
+import type { DatafileContent } from "@featurevisor/types";
+
+function getNewDatafile(variationValue = "control") {
+  return {
+    schemaVersion: "2",
+    revision: "1.0",
+    features: {
+      test: {
+        key: "test",
+        bucketBy: "userId",
+        variations: [
+          { value: "control", weight: variationValue === "control" ? 100 : 0 },
+          { value: "treatment", weight: variationValue === "treatment" ? 100 : 0 },
+        ],
+        traffic: [
+          {
+            key: "1",
+            segments: "*",
+            percentage: 100000,
+            allocation: [
+              {
+                variation: "control",
+                range: [0, variationValue === "control" ? 100000 : 0] as [number, number],
+              },
+              {
+                variation: "treatment",
+                range: [variationValue === "control" ? 100000 : 0, 100000] as [number, number],
+              },
+            ],
+          },
+        ],
+        hash: Math.random().toString(10).substring(2, 15),
+      },
+    },
+    segments: {},
+  };
+}
 
 function getNewInstance() {
   const sdk = createInstance({
-    datafile: {
-      schemaVersion: "1",
-      revision: "1.0",
-      features: [
-        {
-          key: "test",
-          bucketBy: "userId",
-          variations: [{ value: "control" }, { value: "treatment" }],
-          traffic: [
-            {
-              key: "1",
-              segments: "*",
-              percentage: 100000,
-              allocation: [
-                { variation: "control", range: [0, 100000] },
-                { variation: "treatment", range: [0, 0] },
-              ],
-            },
-          ],
-        },
-      ],
-      attributes: [],
-      segments: [],
-    },
+    datafile: getNewDatafile(),
   });
 
   return sdk;
@@ -57,4 +71,33 @@ describe("react: useVariation", function () {
 
     expect(screen.getByText("True")).toBeInTheDocument();
   });
+
+  test("should return the variation reactively", function () {
+    function TestComponent() {
+      const variation = useVariation("test", { userId: "1" });
+
+      return variation === "control" ? <p>True</p> : <p>False</p>;
+    }
+
+    const f = getNewInstance();
+
+    render(
+      <FeaturevisorProvider instance={f}>
+        <TestComponent />
+      </FeaturevisorProvider>,
+    );
+
+    expect(screen.getByText("True")).toBeInTheDocument();
+
+    // set new datafile
+    act(() => {
+      const newDatafile: DatafileContent = getNewDatafile("treatment"); // control => treatment
+      f.setDatafile(newDatafile);
+    });
+
+    waitFor(() => {
+      expect(screen.getByText("False")).toBeInTheDocument();
+      expect(screen.queryByText("True")).not.toBeInTheDocument();
+    });
+  });
 });

package/src/useVariation.ts

@@ -1,12 +1,28 @@
+import { useEffect, useState } from "react";
+
 import { Context, FeatureKey, VariationValue } from "@featurevisor/types";
 
 import { useSdk } from "./useSdk";
+import { onFeatureChange } from "./onFeatureChange";
 
-export function useVariation(
-  featureKey: FeatureKey,
-  context: Context = {},
-): VariationValue | undefined {
+export function useVariation(featureKey: FeatureKey, context: Context = {}): VariationValue | null {
   const sdk = useSdk();
+  const initialValue = sdk.getVariation(featureKey, context);
+  const [variationValue, setVariationValue] = useState<VariationValue | null>(initialValue);
+
+  useEffect(() => {
+    const unsubscribe = onFeatureChange(sdk, featureKey, () => {
+      const newValue = sdk.getVariation(featureKey, context);
+
+      if (newValue !== variationValue) {
+        setVariationValue(newValue);
+      }
+    });
+
+    return () => {
+      unsubscribe();
+    };
+  }, [featureKey, context]);
 
-  return sdk.getVariation(featureKey, context);
+  return variationValue;
 }

package/lib/activateFeature.d.ts

@@ -1,2 +0,0 @@
-import { Context, FeatureKey, VariationValue } from "@featurevisor/types";
-export declare function activateFeature(featureKey: FeatureKey, context?: Context): VariationValue | undefined;

package/lib/activateFeature.js

@@ -1,6 +0,0 @@
-import { useSdk } from "./useSdk";
-export function activateFeature(featureKey, context = {}) {
-    const sdk = useSdk();
-    return sdk.activate(featureKey, context);
-}
-//# sourceMappingURL=activateFeature.js.map

package/lib/activateFeature.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"activateFeature.js","sourceRoot":"","sources":["../src/activateFeature.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAElC,MAAM,UAAU,eAAe,CAC7B,UAAsB,EACtB,UAAmB,EAAE;IAErB,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IAErB,OAAO,GAAG,CAAC,QAAQ,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;AAC3C,CAAC"}

package/lib/activateFeature.spec.d.ts

@@ -1 +0,0 @@
-import "@testing-library/jest-dom";

package/lib/useStatus.d.ts

@@ -1,4 +0,0 @@
-export interface Status {
-    isReady: boolean;
-}
-export declare function useStatus(): Status;

package/lib/useStatus.js

@@ -1,18 +0,0 @@
-import * as React from "react";
-import { useSdk } from "./useSdk";
-export function useStatus() {
-    const sdk = useSdk();
-    const initialStatus = sdk.isReady();
-    const [isReady, setIsReady] = React.useState(initialStatus);
-    React.useEffect(function () {
-        function handleReady() {
-            setIsReady(true);
-        }
-        sdk.on("ready", handleReady);
-        return function () {
-            sdk.off("ready", handleReady);
-        };
-    }, []);
-    return { isReady };
-}
-//# sourceMappingURL=useStatus.js.map

package/lib/useStatus.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useStatus.js","sourceRoot":"","sources":["../src/useStatus.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAMlC,MAAM,UAAU,SAAS;IACvB,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IACrB,MAAM,aAAa,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC;IAEpC,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC;IAE5D,KAAK,CAAC,SAAS,CAAC;QACd,SAAS,WAAW;YAClB,UAAU,CAAC,IAAI,CAAC,CAAC;QACnB,CAAC;QAED,GAAG,CAAC,EAAE,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAE7B,OAAO;YACL,GAAG,CAAC,GAAG,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAChC,CAAC,CAAC;IACJ,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,EAAE,OAAO,EAAE,CAAC;AACrB,CAAC"}

package/lib/useStatus.spec.d.ts

@@ -1 +0,0 @@
-import "@testing-library/jest-dom";

package/src/activateFeature.spec.tsx

@@ -1,60 +0,0 @@
-import * as React from "react";
-import { render, screen } from "@testing-library/react";
-import "@testing-library/jest-dom";
-
-import { FeaturevisorProvider } from "./FeaturevisorProvider";
-import { activateFeature } from "./activateFeature";
-import { createInstance } from "@featurevisor/sdk";
-
-function getNewInstance() {
-  const sdk = createInstance({
-    datafile: {
-      schemaVersion: "1",
-      revision: "1.0",
-      features: [
-        {
-          key: "test",
-          bucketBy: "userId",
-          variations: [{ value: "control" }, { value: "treatment" }],
-          traffic: [
-            {
-              key: "1",
-              segments: "*",
-              percentage: 100000,
-              allocation: [
-                { variation: "control", range: [0, 100000] },
-                { variation: "treatment", range: [0, 0] },
-              ],
-            },
-          ],
-        },
-      ],
-      attributes: [],
-      segments: [],
-    },
-  });
-
-  return sdk;
-}
-
-describe("react: activateFeature", function () {
-  test("should be a function", function () {
-    expect(activateFeature).toBeInstanceOf(Function);
-  });
-
-  test("should return the variation", function () {
-    function TestComponent() {
-      const variation = activateFeature("test", { userId: "1" });
-
-      return variation === "control" ? <p>True</p> : <p>False</p>;
-    }
-
-    render(
-      <FeaturevisorProvider instance={getNewInstance()}>
-        <TestComponent />
-      </FeaturevisorProvider>,
-    );
-
-    expect(screen.getByText("True")).toBeInTheDocument();
-  });
-});

package/src/activateFeature.ts

@@ -1,12 +0,0 @@
-import { Context, FeatureKey, VariationValue } from "@featurevisor/types";
-
-import { useSdk } from "./useSdk";
-
-export function activateFeature(
-  featureKey: FeatureKey,
-  context: Context = {},
-): VariationValue | undefined {
-  const sdk = useSdk();
-
-  return sdk.activate(featureKey, context);
-}

package/src/useStatus.spec.tsx

@@ -1,60 +0,0 @@
-import * as React from "react";
-import { render, screen } from "@testing-library/react";
-import "@testing-library/jest-dom";
-
-import { FeaturevisorProvider } from "./FeaturevisorProvider";
-import { useStatus } from "./useStatus";
-import { createInstance } from "@featurevisor/sdk";
-
-function getNewInstance() {
-  const sdk = createInstance({
-    datafile: {
-      schemaVersion: "1",
-      revision: "1.0",
-      features: [
-        {
-          key: "test",
-          bucketBy: "userId",
-          variations: [{ value: "control" }, { value: "treatment" }],
-          traffic: [
-            {
-              key: "1",
-              segments: "*",
-              percentage: 100000,
-              allocation: [
-                { variation: "control", range: [0, 100000] },
-                { variation: "treatment", range: [0, 0] },
-              ],
-            },
-          ],
-        },
-      ],
-      attributes: [],
-      segments: [],
-    },
-  });
-
-  return sdk;
-}
-
-describe("react: useStatus", function () {
-  test("should be a function", function () {
-    expect(useStatus).toBeInstanceOf(Function);
-  });
-
-  test("should return the variation", function () {
-    function TestComponent() {
-      const { isReady } = useStatus();
-
-      return isReady ? <p>Ready</p> : <p>Loading...</p>;
-    }
-
-    render(
-      <FeaturevisorProvider instance={getNewInstance()}>
-        <TestComponent />
-      </FeaturevisorProvider>,
-    );
-
-    expect(screen.getByText("Ready")).toBeInTheDocument();
-  });
-});

package/src/useStatus.ts

@@ -1,28 +0,0 @@
-import * as React from "react";
-
-import { useSdk } from "./useSdk";
-
-export interface Status {
-  isReady: boolean;
-}
-
-export function useStatus(): Status {
-  const sdk = useSdk();
-  const initialStatus = sdk.isReady();
-
-  const [isReady, setIsReady] = React.useState(initialStatus);
-
-  React.useEffect(function () {
-    function handleReady() {
-      setIsReady(true);
-    }
-
-    sdk.on("ready", handleReady);
-
-    return function () {
-      sdk.off("ready", handleReady);
-    };
-  }, []);
-
-  return { isReady };
-}