@xylabs/sdk-react 2.10.5 → 2.11.2

package/package.json

@@ -9,13 +9,13 @@
     "url": "https://github.com/xylabs/sdk-react/issues"
   },
   "dependencies": {
-    "@emotion/react": "^11.8.2",
+    "@emotion/react": "^11.9.0",
     "@emotion/styled": "^11.8.1",
     "@ethersproject/abstract-signer": "^5.6.0",
     "@ethersproject/providers": "^5.6.2",
-    "@mui/icons-material": "^5.5.1",
-    "@mui/material": "^5.5.3",
-    "@mui/styles": "^5.5.3",
+    "@mui/icons-material": "^5.6.0",
+    "@mui/material": "^5.6.0",
+    "@mui/styles": "^5.6.0",
     "@xylabs/pixel": "^1.3.7",
     "@xylabs/sdk-js": "^2.4.3",
     "axios": "^0.26.1",
@@ -24,15 +24,13 @@
     "md5": "^2.3.0",
     "numeral": "^2.0.6",
     "query-string": "^7.1.1",
-    "react": "^17.0.2",
-    "react-dom": "^17.0.2",
     "react-helmet": "^6.1.0",
     "react-icons": "^4.3.1",
     "react-router-dom": "^6.3.0"
   },
   "description": "Common React library for all XY Labs projects that use React",
   "devDependencies": {
-    "@babel/core": "^7.17.8",
+    "@babel/core": "^7.17.9",
     "@rollup/plugin-image": "^2.1.1",
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-replace": "^4.0.0",
@@ -50,8 +48,7 @@
     "@types/md5": "^2.3.2",
     "@types/node": "^17.0.23",
     "@types/numeral": "^2.0.2",
-    "@types/react": "^17.0.43",
-    "@types/react-dom": "^17.0.14",
+    "@types/react-dom": "^18.0.0",
     "@types/react-helmet": "^6.1.5",
     "@xylabs/eslint-config-react": "^2.1.3",
     "@xylabs/rollup-config": "^1.1.15",
@@ -64,6 +61,8 @@
     "eslint-plugin-react": "^7.29.4",
     "eslint-plugin-react-hooks": "^4.4.0",
     "prettier": "^2.6.2",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
     "rimraf": "^3.0.2",
     "rollbar": "^2.24.1",
     "rollup": "^2.70.1",
@@ -71,7 +70,15 @@
     "ts-node": "^10.7.0",
     "tslib": "^2.3.1",
     "typescript": "^4.6.3",
-    "webpack": "^5.71.0"
+    "webpack": "^5.72.0"
+  },
+  "peerDependencies": {
+    "react": "^17",
+    "react-dom": "^17"
+  },
+  "resolutions": {
+    "react": "^18",
+    "react-dom": "^18"
   },
   "esm5": "dist/esm5/index.js",
   "exports": {
@@ -111,6 +118,6 @@
   },
   "sideEffects": false,
   "types": "dist/index.d.ts",
-  "version": "2.10.5",
+  "version": "2.11.2",
   "packageManager": "yarn@3.1.1"
 }

package/src/WithChildren.ts

@@ -0,0 +1,3 @@
+import { ReactNode } from 'react'
+
+export type WithChildren<T = unknown> = T & { children?: ReactNode }

package/src/components/InvertableThemeProvider/InvertableThemeProviderProps.ts

@@ -1,4 +1,5 @@
 import { ThemeOptions } from '@mui/material'
+import { ReactNode } from 'react'
 
 interface InvertableThemeProviderProps {
   dark?: boolean
@@ -13,6 +14,7 @@ interface InvertableThemeProviderProps {
   darkOptions?: ThemeOptions
   lightOptions?: ThemeOptions
   resolve?: boolean
+  children?: ReactNode
 }
 
 export type { InvertableThemeProviderProps }

package/src/components/Pixel/PixelDebuggerProvider.tsx

@@ -1,7 +1,8 @@
 import { DebugUserEventsContext } from '../../contexts'
 import { useLocalStorage } from '../../hooks'
+import { WithChildren } from '../../WithChildren'
 
-export const PixelDebuggerProvider: React.FC = ({ children }) => {
+export const PixelDebuggerProvider: React.FC<WithChildren> = ({ children }) => {
   const [isDebugging, setIsDebugging] = useLocalStorage<boolean>('isDebuggingPixel', false)
   return (
     <DebugUserEventsContext.Provider value={{ isDebugging, setIsDebugging }}>

package/src/contexts/CookieConsent/Loader.tsx

@@ -1,10 +1,11 @@
 import { useState } from 'react'
 
+import { WithChildren } from '../../WithChildren'
 import { CookieConsentContext } from './Context'
 
 const CookiesAcceptedLocalStorageName = 'CookiesAccepted'
 
-const CookieConsentLoader: React.FC = ({ children }) => {
+const CookieConsentLoader: React.FC<WithChildren> = ({ children }) => {
   const getAcceptedFromLocalStorage = () => {
     return localStorage.getItem(CookiesAcceptedLocalStorageName) === 'true'
   }

package/src/contexts/Ethers/Loader.tsx

@@ -1,14 +1,17 @@
+import { ReactNode } from 'react'
+
 import { InfuraEthersLoader } from './Infura'
 import { MetaMaskEthersLoader } from './MetaMask'
 import { MyEtherWalletEthersLoader } from './MyEtherWallet'
 import { OperaEthersLoader } from './Opera'
 import { TrustEthersLoader } from './Trust'
 
-interface Props {
+export interface EthersLoaderProps {
   enabled?: boolean
+  children?: ReactNode
 }
 
-export const EthersLoader: React.FC<Props> = (props) => {
+export const EthersLoader: React.FC<EthersLoaderProps> = (props) => {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const global = window as any
   const { children } = props

package/src/contexts/NetworkSettings/Loader.tsx

@@ -1,13 +1,13 @@
 import { EthAddress } from '@xylabs/sdk-js'
-import React from 'react'
 
+import { WithChildren } from '../../WithChildren'
 import { NetworkSettingsContext } from './Context'
 
-interface Props {
+export interface NetworkSettingsLoaderProps {
   enabled?: boolean
 }
 
-export const NetworkSettingsLoader: React.FC<Props> = (props) => {
+export const NetworkSettingsLoader: React.FC<WithChildren<NetworkSettingsLoaderProps>> = (props) => {
   const { children } = props
 
   return (

package/src/contexts/UserEvents/Provider.tsx

@@ -1,14 +1,17 @@
 import { UserEventHandler } from '@xylabs/pixel'
-import React from 'react'
 
 import { XyoUserEventHandler } from '../../lib'
+import { WithChildren } from '../../WithChildren'
 import { UserEventsContext } from './Context'
 
-interface Props<T> {
+export interface UserEventsProviderProps<T> {
   userEvents: UserEventHandler<T>
 }
 
-export const UserEventsProvider: React.FC<Props<unknown>> = ({ userEvents, children }) => {
+export const UserEventsProvider: React.FC<WithChildren<UserEventsProviderProps<unknown>>> = ({
+  userEvents,
+  children,
+}) => {
   return (
     <UserEventsContext.Provider value={{ userEvents: userEvents ?? XyoUserEventHandler.get() }}>
       {children}

package/src/index.ts

@@ -2,3 +2,4 @@ export * from './components'
 export * from './contexts'
 export * from './hooks'
 export * from './lib'
+export * from './WithChildren'

package/src/lib/Tracking/Drip/BaseEvent.ts

@@ -1,7 +1,5 @@
 import { delay } from '@xylabs/sdk-js'
 
-import { global } from '../../global'
-
 type DripEvent<T extends Record<string, unknown>> = (string | T)[]
 
 class DripBaseEvent<T extends Record<string, unknown>> {
@@ -27,6 +25,8 @@ class DripBaseEvent<T extends Record<string, unknown>> {
   }
 
   private getDcq() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     if (!global._dcq) {
       throw Error('DCQ not found')
     }
@@ -34,6 +34,8 @@ class DripBaseEvent<T extends Record<string, unknown>> {
   }
 
   private getDcs() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     if (!global._dcs) {
       throw Error('DCS not found')
     }

package/src/lib/Tracking/Facebook/Fbq.ts

@@ -1,11 +1,11 @@
-import { global } from '../../global'
-
 class Fbq {
   public pixelId?: string
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   public fbq?: any
 
   private constructor(pixelId: string) {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     this.pixelId = pixelId
 
     this.fbq = function () {

package/src/lib/Tracking/Google/Gtag.ts

@@ -1,8 +1,6 @@
 import { assertEx } from '@xylabs/sdk-js'
 import { parse, stringify } from 'query-string'
 
-import { global } from '../../global'
-
 class Gtag {
   public updatePagePath(page_path: string) {
     const ga4id = assertEx(this.ga4id, 'Missing GA4ID')
@@ -21,6 +19,8 @@ class Gtag {
     this.ga4id = ga4id
     this.awid = awid
     this.domains = domains
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     global.dataLayer = global.dataLayer ?? []
     this.gtag =
       global.gtag ??
@@ -59,6 +59,8 @@ class Gtag {
   }
 
   public static clearDataLayer() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     const dataLayer = global.dataLayer as []
     dataLayer.length = 0
   }

package/src/lib/Tracking/Reddit/Rdt.ts

@@ -1,5 +1,3 @@
-import { global } from '../../global'
-
 class Rdt {
   public static instance: Rdt
   public static init(pixelId: string) {
@@ -13,6 +11,8 @@ class Rdt {
   }
 
   private static getRdt() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     if (global.rdt) {
       return global.rdt
     }

package/src/lib/Tracking/Snapchat/Snaptr.ts

@@ -1,9 +1,9 @@
 import { delay } from '@xylabs/sdk-js'
 
-import { global } from '../../global'
-
 class SnapTr {
   public static getSnapTr() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     if (global.snaptr) {
       return global.snaptr
     }

package/src/lib/Tracking/Tapjoy/EF.ts

@@ -1,4 +1,3 @@
-import { global } from '../../global'
 class EF {
   public static instance: EF
   public static init() {
@@ -9,6 +8,8 @@ class EF {
     }
   }
   public static getEF() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     if (global.EF) {
       return global.EF
     }

package/src/lib/Tracking/Tiktok/Ttq.ts

@@ -1,5 +1,3 @@
-import { global } from '../../global'
-
 class Ttq {
   public static instance: Ttq
   public static init(pixelId: string) {
@@ -13,6 +11,8 @@ class Ttq {
   }
 
   public static getTtq() {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const global = window as any
     if (global.ttq) {
       return global.ttq
     }

package/dist/cjs5/lib/global.d.ts

@@ -1,2 +0,0 @@
-declare const global: any;
-export { global };

package/dist/esm2015/lib/global.d.ts

@@ -1,2 +0,0 @@
-declare const global: any;
-export { global };

package/dist/esm2017/lib/global.d.ts

@@ -1,2 +0,0 @@
-declare const global: any;
-export { global };

package/dist/esm5/lib/global.d.ts

@@ -1,2 +0,0 @@
-declare const global: any;
-export { global };

package/dist/lib/global.d.ts

@@ -1,2 +0,0 @@
-declare const global: any;
-export { global };

package/dist/lib/global.js

@@ -1,4 +0,0 @@
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const global = window;
-export { global };
-//# sourceMappingURL=global.js.map

package/dist/lib/global.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"global.js","sourceRoot":"","sources":["../../src/lib/global.ts"],"names":[],"mappings":"AAAA,8DAA8D;AAC9D,MAAM,MAAM,GAAG,MAAa,CAAA;AAE5B,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/dist/node/lib/global.d.ts

@@ -1,2 +0,0 @@
-declare const global: any;
-export { global };

package/dist/node-esm/lib/global.d.ts

@@ -1,2 +0,0 @@
-declare const global: any;
-export { global };

package/src/lib/global.ts

@@ -1,4 +0,0 @@
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-const global = window as any
-
-export { global }