added new theme field

0xsequence · Nov 21, 2023 · 0b84fab · 0b84fab
1 parent f2e919c
commit 0b84fab
Show file tree

Hide file tree

Showing 8 changed files with 1,643 additions and 1,127 deletions.
diff --git a/examples/react/package.json b/examples/react/package.json
@@ -5,7 +5,7 @@
   "homepage": "kit",
   "dependencies": {
     "0xsequence": "^1.4.5",
-    "@0xsequence/design-system": "^1.0.20",
+    "@0xsequence/design-system": "^1.1.0",
     "@0xsequence/kit": "workspace:*",
     "@0xsequence/kit-checkout": "workspace:*",
     "@0xsequence/kit-connectors": "workspace:*",

diff --git a/examples/react/src/App.tsx b/examples/react/src/App.tsx
@@ -54,7 +54,7 @@ function App() {
   })
 
   const kitConfig: KitConfig = {
-    // projectAccessKey: '80DNYhTnQl6TEXyrvX6MEFHAAAAAAAAA',
+    projectAccessKey: 'iK0DPkHRt0IFo8o4M3fZIIOAAAAAAAAAA',
     defaultTheme: THEMES.dark,
     signIn: {
       projectName: 'Skyweaver',

diff --git a/packages/checkout/package.json b/packages/checkout/package.json
@@ -23,7 +23,7 @@
     "@paperxyz/react-client-sdk": "^1.1.3"
   },
   "peerDependencies": {
-    "@0xsequence/design-system": ">=1.0.20",
+    "@0xsequence/design-system": ">=1.1.0",
     "@vanilla-extract/css": ">=1.9.3",
     "@vanilla-extract/recipes": ">=0.3.0",
     "ethers": ">=5.7.2",
@@ -34,7 +34,7 @@
     "@0xsequence/kit": "workspace:*"
   },
   "devDependencies": {
-    "@0xsequence/design-system": "^1.0.20",
+    "@0xsequence/design-system": "^1.1.0",
     "@types/react-copy-to-clipboard": "^5.0.4",
     "@vanilla-extract/css": "^1.9.3",
     "@vanilla-extract/recipes": "^0.3.0",

diff --git a/packages/connectors/package.json b/packages/connectors/package.json
@@ -17,13 +17,13 @@
     "@0xsequence/wagmi-connector": "^2.1.4"
   },
   "devDependencies": {
-    "@0xsequence/design-system": "^1.0.20",
+    "@0xsequence/design-system": "^1.1.0",
     "@0xsequence/kit": "workspace:*"
   },
   "peerDependencies": {
     "0xsequence": ">=1.4.5",
     "ethers": ">=5.7.2",
-    "@0xsequence/design-system": ">=1.0.20",
+    "@0xsequence/design-system": ">=1.1.0",
     "react": ">=17",
     "react-dom": ">=17",
     "viem": ">=1.4.1",

diff --git a/packages/kit/package.json b/packages/kit/package.json
@@ -23,7 +23,7 @@
     "@0xsequence/indexer": "^1.4.5",
     "@0xsequence/metadata": "^1.4.5",
     "@0xsequence/network": "^1.4.5",
-    "@0xsequence/design-system": "^1.0.20",
+    "@0xsequence/design-system": "^1.1.0",
     "@0xsequence/ethauth": "^0.8.1",
     "@0xsequence/kit-connectors": "workspace:*",
     "@0xsequence/utils": "1.4.5",

diff --git a/packages/kit/src/components/KitProvider/index.tsx b/packages/kit/src/components/KitProvider/index.tsx
@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from 'react'
+import type { ComponentProps } from "react";
 
 import {
   Box,
@@ -23,7 +24,7 @@ import '@0xsequence/design-system/styles.css'
 import * as sharedStyles from '../styles.css'
 
 export declare const THEME: readonly ["dark", "light"];
-export declare type Theme = typeof THEME[number];
+export declare type Theme = ComponentProps<typeof ThemeProvider>['theme'];
 export const THEMES = {
   dark: 'dark' as Theme,
   light: 'light' as Theme
@@ -83,7 +84,7 @@ export const KitProvider = (props: KitConnectProviderProps) => {
 
   const { projectName } = signIn
   const [openConnectModal, setOpenConnectModal] = useState<boolean>(false)
-  const [theme, setTheme] = useState<Theme>(defaultTheme || THEMES.dark)
+  const [theme, setTheme] = useState<Exclude<Theme, undefined>>(defaultTheme || THEMES.dark)
   const [modalPosition, setModalPosition] = useState<ModalPosition>(position)
   const [displayedAssets, setDisplayedAssets] = useState<DisplayedAsset[]>(displayedAssetsSetting)
 
@@ -114,7 +115,12 @@ export const KitProvider = (props: KitConnectProviderProps) => {
   // Write data in local storage for retrieval in connectors
   useEffect(() => {
     // Theme
-    localStorage.setItem(LocalStorageKey.Theme, theme)
+    // TODO: set the sequence theme once it is added to connect options
+    if (typeof theme === 'object') {
+      // localStorage.setItem(LocalStorageKey.Theme, JSON.stringify(theme))
+    } else {
+      localStorage.setItem(LocalStorageKey.Theme, theme)
+    }
     // EthAuth
     // note: keep an eye out for potential race-conditions, though they shouldn't occur.
     // If there are race conditions, the settings could be a function executed prior to being passed to wagmi

diff --git a/packages/wallet/package.json b/packages/wallet/package.json
@@ -28,7 +28,7 @@
     "react-copy-to-clipboard": "^5.1.0"
   },
   "peerDependencies": {
-    "@0xsequence/design-system": ">=1.0.20",
+    "@0xsequence/design-system": ">=1.1.0",
     "@0xsequence/kit": "workspace:*",
     "@vanilla-extract/css": ">=1.9.3",
     "@vanilla-extract/recipes": ">=0.3.0",
@@ -39,7 +39,7 @@
     "wagmi": ">=1.3.9"
   },
   "devDependencies": {
-    "@0xsequence/design-system": "^1.0.20",
+    "@0xsequence/design-system": "^1.1.0",
     "@0xsequence/kit": "workspace:*",
     "@types/lodash": "^4.14.196",
     "@types/react-copy-to-clipboard": "^5.0.4",