Update Capsule modalProps type (#2194)

* Update modalProps Add new type that Omits `isOpen` and `capsule` keys from `CapsuleModalV2Props` inline with the wagmi v1 and v2 changes made to omit the same keys from `CapsuleModalProps`. * chore: Update wallet label and icon in capsule function Introduces new label type for the CapsuleInitOptions allowing for override of the default labe/icon for client customization. * chore: Update @web3-onboard/capsule dependency to version 2.0.3-alpha.2
blocknative · May 21, 2024 · 1566599 · 1566599
1 parent 13653b9
commit 1566599
Show file tree

Hide file tree

Showing 6 changed files with 12 additions and 7 deletions.
diff --git a/docs/package.json b/docs/package.json
@@ -55,7 +55,7 @@
     "@web3-onboard/arcana-auth": "^2.0.0",
     "@web3-onboard/bitget": "^2.0.0",
     "@web3-onboard/blocto": "^2.0.0",
-    "@web3-onboard/capsule": "^2.0.2",
+    "@web3-onboard/capsule": "^2.0.3-alpha.2",
     "@web3-onboard/cede-store": "^2.2.0",
     "@web3-onboard/coinbase": "^2.2.7",
     "@web3-onboard/core": "^2.21.6",

diff --git a/docs/src/routes/docs/[...4]wallets/[...5]capsule/+page.md b/docs/src/routes/docs/[...4]wallets/[...5]capsule/+page.md
@@ -45,7 +45,7 @@ type CapsuleInitOptions = {
   constructorOpts?: Partial<ConstructorOpts>
   appName: string
   /** @optional capsule modal props */
-  modalProps?: Partial<CapsuleModalV2Props>
+  modalProps?: Partial<CapsuleModalPropsForInit>
 }
 ```
 ## Usage

diff --git a/packages/capsule/package.json b/packages/capsule/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@web3-onboard/capsule",
-  "version": "2.0.3-alpha.1",
+  "version": "2.0.3-alpha.2",
   "description": "Capsule SDK wallet module for connecting to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardised spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
   "module": "dist/index.js",
   "browser": "dist/index.js",

diff --git a/packages/capsule/src/index.ts b/packages/capsule/src/index.ts
@@ -70,8 +70,8 @@ function validateOptions(
 function capsule(options: CapsuleInitOptions): WalletInit {
   return () => {
     return {
-      label: 'Capsule',
-      getIcon: async () => (await import('./icon')).default,
+      label: options.walletLabel || 'Capsule',
+      getIcon:options.walletIcon || (async () => (await import('./icon')).default),
       getInterface: async ({ chains, appMetadata }) => {
         const { default: Capsule } = await import(
           '@usecapsule/react-sdk'

diff --git a/packages/capsule/src/types.ts b/packages/capsule/src/types.ts
@@ -9,9 +9,14 @@ import type { ConstructorOpts, Environment, CapsuleModalV2Props } from '@usecaps
  * @property {string} [apiKey] - API key is necessary for performing transactions and wallet creation.
  *           This key needs to be obtained by completing a form available at https://7f4shq8oyfd.typeform.com/to/F86oVLhb.
  */
+
+export type CapsuleModalPropsForInit = Omit<CapsuleModalV2Props,'isOpen' | 'capsule'>;
+
 export type CapsuleInitOptions = {
   environment: Environment
   apiKey: string,
   constructorOpts?: Partial<ConstructorOpts>
-  modalProps?: Partial<CapsuleModalV2Props>
+  modalProps?: Partial<CapsuleModalPropsForInit>
+  walletIcon: () => Promise<string>
+  walletLabel?: string 
 }
diff --git a/packages/demo/package.json b/packages/demo/package.json
@@ -30,7 +30,7 @@
     "@web3-onboard/arcana-auth": "^2.0.0",
     "@web3-onboard/bitget": "2.0.1",
     "@web3-onboard/blocto": "^2.0.1",
-    "@web3-onboard/capsule": "2.0.3-alpha.1",
+    "@web3-onboard/capsule": "^2.0.3-alpha.2",
     "@web3-onboard/cede-store": "^2.2.0",
     "@web3-onboard/core": "^2.21.6",
     "@web3-onboard/coinbase": "^2.2.7",