@scaleway/use-growthbook 2.0.3 → 2.1.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @scaleway/use-growthbook
 
+## 2.1.0
+
+### Minor Changes
+
+- [#1960](https://github.com/scaleway/scaleway-lib/pull/1960) [`d034b3c`](https://github.com/scaleway/scaleway-lib/commit/d034b3cda1cac30ce2ed4e95be5a2c79642f8ca4) Thanks [@Slashgear](https://github.com/Slashgear)! - add legacy main attribut for CommonJS export usage
+
+## 2.0.4
+
+### Patch Changes
+
+- [#1953](https://github.com/scaleway/scaleway-lib/pull/1953) [`1fddf05`](https://github.com/scaleway/scaleway-lib/commit/1fddf0515851908b094f983b05b3d87af8eef433) Thanks [@philibea](https://github.com/philibea)! - add cjs build
+
 ## 2.0.3
 
 ### Patch Changes

package/__mocks__/@growthbook/growthbook-react.tsx

@@ -0,0 +1,21 @@
+import type { GrowthBook as GBType } from '@growthbook/growthbook-react'
+import type { ReactNode } from 'react'
+import { vi } from 'vitest'
+
+export const getAttributes = vi.fn<[], ReturnType<GBType['getAttributes']>>()
+export const setAttributes = vi.fn<[], ReturnType<GBType['setAttributes']>>(
+  () => Promise.resolve(),
+)
+
+export const GrowthBook = vi.fn(() => ({
+  loadFeatures: vi.fn<[], ReturnType<GBType['loadFeatures']>>(),
+  getAttributes,
+  setAttributes,
+}))
+export const GrowthBookProvider = ({ children }: { children: ReactNode }) =>
+  children
+
+export const useGrowthBook = vi.fn()
+
+console.debug('GrowthBook Mock', GrowthBookProvider)
+// export { GrowthBook, GrowthBookProvider, useGrowthBook }

package/dist/AbTestProvider.cjs

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const growthbookReact = require("@growthbook/growthbook-react");
+const react = require("react");
+const defaultLoadConfig = {
+  autoRefresh: false,
+  timeout: 500,
+  skipCache: false
+};
+const getGrowthBookInstance = ({
+  config: {
+    apiHost,
+    clientKey,
+    enableDevMode,
+    backgroundSync,
+    subscribeToChanges
+  },
+  trackingCallback
+}) => new growthbookReact.GrowthBook({
+  apiHost,
+  clientKey,
+  enableDevMode,
+  trackingCallback,
+  backgroundSync,
+  subscribeToChanges
+});
+const AbTestProvider = ({
+  children,
+  config,
+  trackingCallback,
+  errorCallback,
+  attributes,
+  loadConfig
+}) => {
+  const growthbook = react.useMemo(
+    () => getGrowthBookInstance({ config, trackingCallback }),
+    [trackingCallback, config]
+  );
+  const loadFeature = react.useCallback(async () => {
+    if (config.clientKey) {
+      await growthbook.loadFeatures(loadConfig ?? defaultLoadConfig);
+    }
+  }, [growthbook, config, loadConfig]);
+  react.useEffect(() => {
+    loadFeature().catch(errorCallback);
+  }, [loadFeature, errorCallback]);
+  react.useEffect(() => {
+    const currentAttributes = growthbook.getAttributes();
+    if (currentAttributes !== attributes) {
+      growthbook.setAttributes({
+        ...currentAttributes,
+        ...attributes
+      }).catch(errorCallback);
+    }
+  }, [attributes, growthbook, errorCallback]);
+  return /* @__PURE__ */ jsxRuntime.jsx(growthbookReact.GrowthBookProvider, { growthbook, children });
+};
+exports.AbTestProvider = AbTestProvider;

package/dist/AbTestProvider.js

@@ -1,50 +1,59 @@
-import { jsx as h } from "react/jsx-runtime";
-import { GrowthBookProvider as m, GrowthBook as a } from "@growthbook/growthbook-react";
-import { useMemo as w, useCallback as d, useEffect as i } from "react";
-const p = {
-  autoRefresh: !1,
+import { jsx } from "react/jsx-runtime";
+import { GrowthBookProvider, GrowthBook } from "@growthbook/growthbook-react";
+import { useMemo, useCallback, useEffect } from "react";
+const defaultLoadConfig = {
+  autoRefresh: false,
   timeout: 500,
-  skipCache: !1
-}, A = ({
+  skipCache: false
+};
+const getGrowthBookInstance = ({
   config: {
-    apiHost: c,
-    clientKey: t,
-    enableDevMode: r,
-    backgroundSync: e,
-    subscribeToChanges: s
+    apiHost,
+    clientKey,
+    enableDevMode,
+    backgroundSync,
+    subscribeToChanges
   },
-  trackingCallback: u
-}) => new a({
-  apiHost: c,
-  clientKey: t,
-  enableDevMode: r,
-  trackingCallback: u,
-  backgroundSync: e,
-  subscribeToChanges: s
-}), x = ({
-  children: c,
-  config: t,
-  trackingCallback: r,
-  errorCallback: e,
-  attributes: s,
-  loadConfig: u
+  trackingCallback
+}) => new GrowthBook({
+  apiHost,
+  clientKey,
+  enableDevMode,
+  trackingCallback,
+  backgroundSync,
+  subscribeToChanges
+});
+const AbTestProvider = ({
+  children,
+  config,
+  trackingCallback,
+  errorCallback,
+  attributes,
+  loadConfig
 }) => {
-  const o = w(
-    () => A({ config: t, trackingCallback: r }),
-    [r, t]
-  ), n = d(async () => {
-    t.clientKey && await o.loadFeatures(u ?? p);
-  }, [o, t, u]);
-  return i(() => {
-    n().catch(e);
-  }, [n, e]), i(() => {
-    const f = o.getAttributes();
-    f !== s && o.setAttributes({
-      ...f,
-      ...s
-    }).catch(e);
-  }, [s, o, e]), /* @__PURE__ */ h(m, { growthbook: o, children: c });
+  const growthbook = useMemo(
+    () => getGrowthBookInstance({ config, trackingCallback }),
+    [trackingCallback, config]
+  );
+  const loadFeature = useCallback(async () => {
+    if (config.clientKey) {
+      await growthbook.loadFeatures(loadConfig ?? defaultLoadConfig);
+    }
+  }, [growthbook, config, loadConfig]);
+  useEffect(() => {
+    loadFeature().catch(errorCallback);
+  }, [loadFeature, errorCallback]);
+  useEffect(() => {
+    const currentAttributes = growthbook.getAttributes();
+    if (currentAttributes !== attributes) {
+      growthbook.setAttributes({
+        ...currentAttributes,
+        ...attributes
+      }).catch(errorCallback);
+    }
+  }, [attributes, growthbook, errorCallback]);
+  return /* @__PURE__ */ jsx(GrowthBookProvider, { growthbook, children });
 };
 export {
-  x as AbTestProvider
+  AbTestProvider
 };

package/dist/index.cjs

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const growthbookReact = require("@growthbook/growthbook-react");
+const useAbTestAttributes = require("./useAbTestAttributes.cjs");
+const AbTestProvider = require("./AbTestProvider.cjs");
+Object.defineProperty(exports, "FeatureString", {
+  enumerable: true,
+  get: () => growthbookReact.FeatureString
+});
+Object.defineProperty(exports, "FeaturesReady", {
+  enumerable: true,
+  get: () => growthbookReact.FeaturesReady
+});
+Object.defineProperty(exports, "IfFeatureEnabled", {
+  enumerable: true,
+  get: () => growthbookReact.IfFeatureEnabled
+});
+Object.defineProperty(exports, "useExperiment", {
+  enumerable: true,
+  get: () => growthbookReact.useExperiment
+});
+Object.defineProperty(exports, "useFeature", {
+  enumerable: true,
+  get: () => growthbookReact.useFeature
+});
+Object.defineProperty(exports, "useFeatureIsOn", {
+  enumerable: true,
+  get: () => growthbookReact.useFeatureIsOn
+});
+Object.defineProperty(exports, "useFeatureValue", {
+  enumerable: true,
+  get: () => growthbookReact.useFeatureValue
+});
+Object.defineProperty(exports, "useGrowthBook", {
+  enumerable: true,
+  get: () => growthbookReact.useGrowthBook
+});
+Object.defineProperty(exports, "useGrowthBookSSR", {
+  enumerable: true,
+  get: () => growthbookReact.useGrowthBookSSR
+});
+Object.defineProperty(exports, "withRunExperiment", {
+  enumerable: true,
+  get: () => growthbookReact.withRunExperiment
+});
+exports.useAbTestAttributes = useAbTestAttributes.useAbTestAttributes;
+exports.AbTestProvider = AbTestProvider.AbTestProvider;

package/dist/index.js

@@ -1,17 +1,17 @@
-import { FeatureString as t, FeaturesReady as u, IfFeatureEnabled as o, useExperiment as s, useFeature as a, useFeatureIsOn as i, useFeatureValue as n, useGrowthBook as F, useGrowthBookSSR as m, withRunExperiment as p } from "@growthbook/growthbook-react";
-import { useAbTestAttributes as b } from "./useAbTestAttributes.js";
-import { AbTestProvider as d } from "./AbTestProvider.js";
+import { FeatureString, FeaturesReady, IfFeatureEnabled, useExperiment, useFeature, useFeatureIsOn, useFeatureValue, useGrowthBook, useGrowthBookSSR, withRunExperiment } from "@growthbook/growthbook-react";
+import { useAbTestAttributes } from "./useAbTestAttributes.js";
+import { AbTestProvider } from "./AbTestProvider.js";
 export {
-  d as AbTestProvider,
-  t as FeatureString,
-  u as FeaturesReady,
-  o as IfFeatureEnabled,
-  b as useAbTestAttributes,
-  s as useExperiment,
-  a as useFeature,
-  i as useFeatureIsOn,
-  n as useFeatureValue,
-  F as useGrowthBook,
-  m as useGrowthBookSSR,
-  p as withRunExperiment
+  AbTestProvider,
+  FeatureString,
+  FeaturesReady,
+  IfFeatureEnabled,
+  useAbTestAttributes,
+  useExperiment,
+  useFeature,
+  useFeatureIsOn,
+  useFeatureValue,
+  useGrowthBook,
+  useGrowthBookSSR,
+  withRunExperiment
 };

package/dist/useAbTestAttributes.cjs

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const growthbookReact = require("@growthbook/growthbook-react");
+const useAbTestAttributes = () => {
+  const growthBook = growthbookReact.useGrowthBook();
+  if (growthBook) {
+    const attributes = growthBook.getAttributes();
+    const setAttributes = (newAttributes) => growthBook.setAttributes({
+      ...attributes,
+      ...newAttributes
+    });
+    return [attributes, setAttributes];
+  }
+  return [{}, () => {
+  }];
+};
+exports.useAbTestAttributes = useAbTestAttributes;

package/dist/useAbTestAttributes.js

@@ -1,16 +1,17 @@
-import { useGrowthBook as r } from "@growthbook/growthbook-react";
-const i = () => {
-  const t = r();
-  if (t) {
-    const e = t.getAttributes();
-    return [e, (s) => t.setAttributes({
-      ...e,
-      ...s
-    })];
+import { useGrowthBook } from "@growthbook/growthbook-react";
+const useAbTestAttributes = () => {
+  const growthBook = useGrowthBook();
+  if (growthBook) {
+    const attributes = growthBook.getAttributes();
+    const setAttributes = (newAttributes) => growthBook.setAttributes({
+      ...attributes,
+      ...newAttributes
+    });
+    return [attributes, setAttributes];
   }
   return [{}, () => {
   }];
 };
 export {
-  i as useAbTestAttributes
+  useAbTestAttributes
 };

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "@scaleway/use-growthbook",
-  "version": "2.0.3",
+  "version": "2.1.0",
   "description": "Utility package to expose AB test tool",
   "engines": {
     "node": ">=20.x"
   },
+  "main": "./dist/index.cjs",
   "sideEffects": false,
   "type": "module",
   "module": "./dist/index.js",
@@ -12,6 +13,7 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
+      "require": "./dist/index.cjs",
       "default": "./dist/index.js"
     }
   },
@@ -32,7 +34,7 @@
     "@growthbook/growthbook-react": "0.26.0"
   },
   "devDependencies": {
-    "react": "18.2.0"
+    "react": "18.3.1"
   },
   "peerDependencies": {
     "react": "18.x"
@@ -42,6 +44,8 @@
     "type:generate": "tsc --declaration -p tsconfig.build.json",
     "build": "vite build --config vite.config.ts && pnpm run type:generate",
     "build:profile": "npx vite-bundle-visualizer -c vite.config.ts",
-    "lint": "eslint --report-unused-disable-directives --cache --cache-strategy content --ext ts,tsx ."
+    "lint": "eslint --report-unused-disable-directives --cache --cache-strategy content --ext ts,tsx .",
+    "test:unit": "vitest --run --config vite.config.ts",
+    "test:unit:coverage": "pnpm test:unit --coverage"
   }
 }

package/vite.config.ts

@@ -1,6 +1,14 @@
-/* eslint-disable eslint-comments/disable-enable-pair */
-/* eslint-disable import/no-relative-packages */
 import { defineConfig, mergeConfig } from 'vite'
 import { defaultConfig } from '../../vite.config'
 
-export default mergeConfig(defineConfig(defaultConfig), {})
+export default mergeConfig(defineConfig(defaultConfig), {
+  build: {
+    lib: {
+      formats: ['es', 'cjs'],
+    },
+  },
+  test: {
+    environment: 'jsdom',
+    setupFiles: ['./vitest.setup.ts'],
+  },
+})

package/vitest.setup.ts

@@ -0,0 +1,12 @@
+import * as matchers from '@testing-library/jest-dom/matchers'
+import '@testing-library/jest-dom/vitest'
+import { cleanup } from '@testing-library/react'
+import { afterEach, expect, vi } from 'vitest'
+
+expect.extend(matchers)
+
+afterEach(() => {
+  cleanup()
+})
+
+vi.mock('@growthbook/growthbook-react')