@xylabs/sdk-react 2.9.4 → 2.9.8

package/package.json

@@ -22,36 +22,36 @@
   },
   "description": "Common React library for all XY Labs projects that use React",
   "devDependencies": {
-    "@babel/core": "^7.16.7",
+    "@babel/core": "^7.16.12",
     "@emotion/react": "^11.7.1",
     "@emotion/styled": "^11.6.0",
     "@ethersproject/abstract-signer": "^5.5.0",
-    "@ethersproject/providers": "^5.5.2",
-    "@mui/icons-material": "^5.3.0",
-    "@mui/material": "^5.3.0",
+    "@ethersproject/providers": "^5.5.3",
+    "@mui/icons-material": "^5.3.1",
+    "@mui/material": "^5.4.0",
     "@mui/styles": "^5.3.0",
     "@rollup/plugin-image": "^2.1.1",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-replace": "^3.0.1",
     "@rollup/plugin-strip": "^2.1.0",
     "@rollup/plugin-typescript": "^8.3.0",
-    "@storybook/addon-actions": "^6.4.13",
-    "@storybook/addon-docs": "^6.4.13",
-    "@storybook/addon-essentials": "^6.4.13",
-    "@storybook/addon-links": "^6.4.13",
-    "@storybook/components": "^6.4.13",
-    "@storybook/core-events": "^6.4.13",
-    "@storybook/react": "^6.4.13",
+    "@storybook/addon-actions": "^6.4.17",
+    "@storybook/addon-docs": "^6.4.17",
+    "@storybook/addon-essentials": "^6.4.17",
+    "@storybook/addon-links": "^6.4.17",
+    "@storybook/components": "^6.4.17",
+    "@storybook/core-events": "^6.4.17",
+    "@storybook/react": "^6.4.17",
     "@types/bn.js": "^5.1.0",
     "@types/lodash": "^4.14.178",
     "@types/md5": "^2.3.1",
-    "@types/node": "^17.0.10",
+    "@types/node": "^17",
     "@types/numeral": "^2",
     "@types/react": "^17",
     "@xylabs/eslint-config-react": "^2",
-    "@xylabs/pixel": "^1.2.6",
-    "@xylabs/rollup-config": "^1.1.1",
-    "@xylabs/ts-scripts": "^1.0.24",
+    "@xylabs/pixel": "^1.3.3",
+    "@xylabs/rollup-config": "^1.1.5",
+    "@xylabs/ts-scripts": "^1.0.37",
     "@xylabs/tsconfig": "^1.0.9",
     "babel-loader": "^8.2.3",
     "copyfiles": "^2.4.1",
@@ -64,11 +64,11 @@
     "react-dom": "^17.0.2",
     "react-router-dom": "^6",
     "rollbar": "^2",
-    "rollup": "^2.64.0",
+    "rollup": "^2",
     "rollup-plugin-svg": "^2.0.0",
     "ts-node": "^10.4.0",
     "tslib": "^2.3.1",
-    "typescript": "^4.5.4",
+    "typescript": "^4.5.5",
     "webpack": "^5"
   },
   "esm5": "dist/esm5/index.js",
@@ -130,5 +130,5 @@
   },
   "sideEffects": false,
   "types": "dist/index.d.ts",
-  "version": "2.9.4"
+  "version": "2.9.8"
 }

package/src/components/Experiments/Experiments.tsx

@@ -1,7 +1,7 @@
 import { forget, Log } from '@xylabs/sdk-js'
-import React, { ReactElement, useContext } from 'react'
+import React, { ReactElement } from 'react'
 
-import { UserEventsContext } from '../../contexts'
+import { useUserEvents } from '../../hooks'
 import { getLocalStorageObject, setLocalStorageObject } from '../../lib'
 import { ExperimentProps } from './Experiment'
 import { ExperimentsProps } from './ExperimentsProps'
@@ -69,8 +69,7 @@ const saveExperimentDebugRanges = (name: string, totalWeight: number, childList:
 
 const Experiments: React.FC<ExperimentsProps> = (props) => {
   const { name, children, localStorageProp = true } = props
-  const userEventsContext = useContext(UserEventsContext)
-  const { userEvents } = userEventsContext
+  const userEvents = useUserEvents()
   loadOutcomes()
 
   const localStorageKey = buildLocalStorageKey(localStorageProp)

package/src/contexts/UserEvents/Loader.tsx

@@ -0,0 +1,12 @@
+import { UserEventHandler } from '@xylabs/pixel'
+import React from 'react'
+
+import { UserEventsContext } from './Context'
+
+interface Props<T> {
+  userEvents: UserEventHandler<T>
+}
+
+export const UserEventsLoader: React.FC<Props<unknown>> = ({ userEvents, children }) => {
+  return <UserEventsContext.Provider value={{ userEvents }}>{children}</UserEventsContext.Provider>
+}

package/src/contexts/UserEvents/index.ts

@@ -1,3 +1,3 @@
 import { UserEventsContext } from './Context'
-
+export * from './Loader'
 export { UserEventsContext }

package/src/hooks/index.ts

@@ -4,5 +4,6 @@ export * from './useMediaQuery'
 export * from './useMounted'
 export * from './useNavigateToEthAddress'
 export * from './useSpacing'
+export * from './useUserEvents'
 export * from './useWebP'
 export * from './useWindowSize'

package/src/hooks/useUserEvents.ts

@@ -0,0 +1,9 @@
+import { UserEventHandler } from '@xylabs/pixel'
+import { useContext } from 'react'
+
+import { UserEventsContext } from '../contexts'
+
+export const useUserEvents = <T>() => {
+  const { userEvents } = useContext(UserEventsContext)
+  return userEvents as UserEventHandler<T>
+}