@ckb-ccc/connector 0.0.4-alpha.10 → 0.0.4-alpha.11

package/dist/advancedBarrel.d.ts

@@ -1,3 +1,4 @@
 export * from "@ckb-ccc/ccc/advancedBarrel";
 export * from "./scenes";
+export * from "./types";
 //# sourceMappingURL=advancedBarrel.d.ts.map

package/dist/advancedBarrel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"advancedBarrel.d.ts","sourceRoot":"","sources":["../src/advancedBarrel.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAC5C,cAAc,UAAU,CAAC"}
+{"version":3,"file":"advancedBarrel.d.ts","sourceRoot":"","sources":["../src/advancedBarrel.ts"],"names":[],"mappings":"AAAA,cAAc,6BAA6B,CAAC;AAC5C,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC"}

package/dist/advancedBarrel.js

@@ -1,2 +1,3 @@
 export * from "@ckb-ccc/ccc/advancedBarrel";
 export * from "./scenes";
+export * from "./types";

package/dist/connector/index.d.ts

@@ -16,6 +16,7 @@ export declare class WebComponentConnector extends LitElement {
     addSigner(name: string, icon: string, type: ccc.SignerType, signer: ccc.Signer): void;
     render(): import("lit").TemplateResult<1>;
     private onClose;
+    private onReset;
     private onWalletSelected;
     private onSignerSelected;
     static styles: import("lit").CSSResult;

package/dist/connector/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/connector/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,UAAU,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAW5D,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAE5C,qBACa,qBAAsB,SAAQ,UAAU;IAEnD,OAAO,CAAC,OAAO,CAAoB;IAEnC,OAAO,CAAC,cAAc,CAAsB;IAGrC,MAAM,EAAE,OAAO,CAAS;IAGxB,MAAM,EAAE,GAAG,CAAC,MAAM,CAAiC;IAEnD,MAAM,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC;IAEpB,MAAM,CAAC,EAAE,GAAG,CAAC,UAAU,CAAC;IAExB,MAAM,EAAE,eAAe,CAAmC;IAEjE,iBAAiB,IAAI,IAAI;IAKzB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAOzD,cAAc;IA6Bd,KAAK;IAWL,SAAS,CACP,IAAI,EAAE,MAAM,EACZ,IAAI,EAAE,MAAM,EACZ,IAAI,EAAE,GAAG,CAAC,UAAU,EACpB,MAAM,EAAE,GAAG,CAAC,MAAM;IAkBpB,MAAM;IAmDN,OAAO,CAAC,OAAO,CAGb;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,gBAAgB,CAStB;IAEF,MAAM,CAAC,MAAM,0BAqIX;CACH"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/connector/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,UAAU,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAW5D,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAG5C,qBACa,qBAAsB,SAAQ,UAAU;IAEnD,OAAO,CAAC,OAAO,CAA2B;IAE1C,OAAO,CAAC,cAAc,CAAsB;IAGrC,MAAM,EAAE,OAAO,CAAS;IAGxB,MAAM,EAAE,GAAG,CAAC,MAAM,CAAiC;IAEnD,MAAM,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC;IAEpB,MAAM,CAAC,EAAE,GAAG,CAAC,UAAU,CAAC;IAExB,MAAM,EAAE,eAAe,CAAmC;IAEjE,iBAAiB,IAAI,IAAI;IAKzB,UAAU,CAAC,iBAAiB,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI;IAOzD,cAAc;IA6Bd,KAAK;IAwBL,SAAS,CACP,IAAI,EAAE,MAAM,EACZ,IAAI,EAAE,MAAM,EACZ,IAAI,EAAE,GAAG,CAAC,UAAU,EACpB,MAAM,EAAE,GAAG,CAAC,MAAM;IAkBpB,MAAM;IAyDN,OAAO,CAAC,OAAO,CAKb;IAEF,OAAO,CAAC,OAAO,CAGb;IAEF,OAAO,CAAC,gBAAgB,CAEtB;IAEF,OAAO,CAAC,gBAAgB,CAetB;IAEF,MAAM,CAAC,MAAM,0BAqIX;CACH"}

package/dist/connector/index.js

@@ -22,17 +22,25 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
         this.client = new ccc.ClientPublicTestnet();
         this.status = ConnectorStatus.SelectingSigner;
         this.onClose = () => {
-            this.dispatchEvent(new SignerChangedEvent());
+            if (this.status === ConnectorStatus.SelectingSigner) {
+                this.onReset();
+            }
             this.dispatchEvent(new CloseEvent());
         };
+        this.onReset = () => {
+            this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.SelectingSigner));
+            this.dispatchEvent(new SignerChangedEvent());
+        };
         this.onWalletSelected = (wallet) => {
             this.dispatchEvent(new SignerChangedEvent(wallet, this.signer));
         };
         this.onSignerSelected = (wallet, signer) => {
-            this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.Connecting));
-            this.dispatchEvent(new SignerChangedEvent(wallet, signer));
             (async () => {
-                await signer.signer.connect();
+                this.dispatchEvent(new SignerChangedEvent(wallet, signer));
+                if (!(await signer.signer.isConnected())) {
+                    this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.Connecting));
+                    await signer.signer.connect();
+                }
                 this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.Idle));
                 this.dispatchEvent(new CloseEvent());
             })();
@@ -64,8 +72,21 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
     }
     reset() {
         this.wallets = [];
-        this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.SelectingSigner));
-        this.dispatchEvent(new SignerChangedEvent(undefined, undefined));
+        (async () => {
+            if (!this.signer) {
+                return;
+            }
+            const newSigner = await this.signer.signer.replaceClient(this.client);
+            if (newSigner) {
+                this.onSignerSelected(this.wallet, {
+                    ...this.signer,
+                    signer: newSigner,
+                });
+            }
+            else {
+                this.onReset();
+            }
+        })();
         const resetListeners = this.resetListeners;
         this.resetListeners = [];
         resetListeners.forEach((listener) => listener());
@@ -89,13 +110,14 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
     }
     render() {
         const [title, body] = (() => {
-            if (!this.wallet) {
+            const wallet = ccc.apply((wallet) => this.wallets.find((w) => w.name === wallet.name), this.wallet);
+            if (!wallet) {
                 return generateWalletsScene(this.wallets, this.onWalletSelected, this.onSignerSelected);
             }
             if (!this.signer) {
-                return generateSignersScene(this.wallet, this.onSignerSelected);
+                return generateSignersScene(wallet, this.onSignerSelected);
             }
-            return generateConnectingScene(this.wallet, this.signer, this.onSignerSelected);
+            return generateConnectingScene(wallet, this.signer, this.onSignerSelected);
         })();
         return html `<style>
         :host {

package/dist/scenes/connecting.d.ts

@@ -1,3 +1,3 @@
 import { ccc } from "@ckb-ccc/ccc";
-export declare function generateConnectingScene(wallet: ccc.Wallet, signer: ccc.SignerInfo, onSignerSelected: (wallet: ccc.Wallet, signer: ccc.SignerInfo) => unknown): (string | import("lit").TemplateResult<1>)[];
+export declare function generateConnectingScene(wallet: ccc.Wallet, signer: ccc.SignerInfo, onSignerSelected: (wallet: ccc.Wallet | undefined, signer: ccc.SignerInfo) => unknown): (string | import("lit").TemplateResult<1>)[];
 //# sourceMappingURL=connecting.d.ts.map

package/dist/scenes/connecting.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"connecting.d.ts","sourceRoot":"","sources":["../../src/scenes/connecting.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAInC,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,GAAG,CAAC,MAAM,EAClB,MAAM,EAAE,GAAG,CAAC,UAAU,EACtB,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,UAAU,KAAK,OAAO,gDAqB1E"}
+{"version":3,"file":"connecting.d.ts","sourceRoot":"","sources":["../../src/scenes/connecting.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAInC,wBAAgB,uBAAuB,CACrC,MAAM,EAAE,GAAG,CAAC,MAAM,EAClB,MAAM,EAAE,GAAG,CAAC,UAAU,EACtB,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,GAAG,CAAC,UAAU,KAAK,OAAO,gDAqBtF"}

package/dist/scenes/signers.d.ts

@@ -1,4 +1,5 @@
 import { ccc } from "@ckb-ccc/ccc";
+import { WalletWithSigners } from "../types";
 export declare function signerTypeToIcon(type: ccc.SignerType): string;
-export declare function generateSignersScene(wallet: ccc.Wallet, onSignerSelected: (wallet: ccc.Wallet, signer: ccc.SignerInfo) => unknown): (string | import("lit").TemplateResult<1>)[];
+export declare function generateSignersScene(wallet: WalletWithSigners, onSignerSelected: (wallet: ccc.Wallet | undefined, signer: ccc.SignerInfo) => unknown): (string | import("lit").TemplateResult<1>)[];
 //# sourceMappingURL=signers.d.ts.map

package/dist/scenes/signers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"signers.d.ts","sourceRoot":"","sources":["../../src/scenes/signers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAKnC,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,GAAG,CAAC,UAAU,GAAG,MAAM,CAK7D;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,GAAG,CAAC,MAAM,EAClB,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,UAAU,KAAK,OAAO,gDAyB1E"}
+{"version":3,"file":"signers.d.ts","sourceRoot":"","sources":["../../src/scenes/signers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAInC,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,GAAG,CAAC,UAAU,GAAG,MAAM,CAK7D;AAED,wBAAgB,oBAAoB,CAClC,MAAM,EAAE,iBAAiB,EACzB,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,GAAG,CAAC,UAAU,KAAK,OAAO,gDAyBtF"}

package/dist/scenes/wallets.d.ts

@@ -1,3 +1,4 @@
 import { ccc } from "@ckb-ccc/ccc";
-export declare function generateWalletsScene(wallets: ccc.Wallet[], onWalletSelected: (wallet: ccc.Wallet) => unknown, onSignerSelected: (wallet: ccc.Wallet, signer: ccc.SignerInfo) => unknown): unknown[];
+import { WalletWithSigners } from "../types";
+export declare function generateWalletsScene(wallets: WalletWithSigners[], onWalletSelected: (wallet: ccc.Wallet) => unknown, onSignerSelected: (wallet: ccc.Wallet | undefined, signer: ccc.SignerInfo) => unknown): unknown[];
 //# sourceMappingURL=wallets.d.ts.map

package/dist/scenes/wallets.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/scenes/wallets.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAInC,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,GAAG,CAAC,MAAM,EAAE,EACrB,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,KAAK,OAAO,EACjD,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,CAAC,UAAU,KAAK,OAAO,aAwB1E"}
+{"version":3,"file":"wallets.d.ts","sourceRoot":"","sources":["../../src/scenes/wallets.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAGnC,OAAO,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAE7C,wBAAgB,oBAAoB,CAClC,OAAO,EAAE,iBAAiB,EAAE,EAC5B,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,KAAK,OAAO,EACjD,gBAAgB,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,GAAG,SAAS,EAAE,MAAM,EAAE,GAAG,CAAC,UAAU,KAAK,OAAO,aAwBtF"}

package/dist/types/index.d.ts

@@ -0,0 +1,5 @@
+import { ccc } from "@ckb-ccc/ccc";
+export type WalletWithSigners = ccc.Wallet & {
+    signers: ccc.SignerInfo[];
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/types/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAEnC,MAAM,MAAM,iBAAiB,GAAG,GAAG,CAAC,MAAM,GAAG;IAC3C,OAAO,EAAE,GAAG,CAAC,UAAU,EAAE,CAAC;CAC3B,CAAC"}

package/dist/types/index.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckb-ccc/connector",
-  "version": "0.0.4-alpha.10",
+  "version": "0.0.4-alpha.11",
   "description": "Common Chains Connector UI",
   "author": "Hanssen0 <hanssen0@hanssen0.com>",
   "license": "MIT",
@@ -37,8 +37,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@ckb-ccc/ccc": "0.0.4-alpha.10",
+    "@ckb-ccc/ccc": "0.0.4-alpha.11",
     "lit": "^3.1.3"
   },
-  "gitHead": "dec13b260f57a1b244c69af5566e316a4c329e35"
+  "gitHead": "db0297c0753349e2650d2845f42f546316078d5d"
 }

package/src/advancedBarrel.ts

@@ -1,2 +1,3 @@
 export * from "@ckb-ccc/ccc/advancedBarrel";
 export * from "./scenes";
+export * from "./types";

package/src/connector/index.ts

@@ -11,11 +11,12 @@ import {
   generateWalletsScene,
 } from "../scenes";
 import { ConnectorStatus } from "../status";
+import { WalletWithSigners } from "../types";
 
 @customElement("ccc-connector")
 export class WebComponentConnector extends LitElement {
   @state()
-  private wallets: ccc.Wallet[] = [];
+  private wallets: WalletWithSigners[] = [];
 
   private resetListeners: (() => void)[] = [];
 
@@ -75,8 +76,21 @@ export class WebComponentConnector extends LitElement {
   reset() {
     this.wallets = [];
 
-    this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.SelectingSigner));
-    this.dispatchEvent(new SignerChangedEvent(undefined, undefined));
+    (async () => {
+      if (!this.signer) {
+        return;
+      }
+
+      const newSigner = await this.signer.signer.replaceClient(this.client);
+      if (newSigner) {
+        this.onSignerSelected(this.wallet, {
+          ...this.signer,
+          signer: newSigner,
+        });
+      } else {
+        this.onReset();
+      }
+    })();
 
     const resetListeners = this.resetListeners;
     this.resetListeners = [];
@@ -107,7 +121,13 @@ export class WebComponentConnector extends LitElement {
 
   render() {
     const [title, body] = (() => {
-      if (!this.wallet) {
+      const wallet = ccc.apply(
+        (wallet: ccc.Wallet) =>
+          this.wallets.find((w) => w.name === wallet.name),
+        this.wallet,
+      );
+
+      if (!wallet) {
         return generateWalletsScene(
           this.wallets,
           this.onWalletSelected,
@@ -115,10 +135,10 @@ export class WebComponentConnector extends LitElement {
         );
       }
       if (!this.signer) {
-        return generateSignersScene(this.wallet, this.onSignerSelected);
+        return generateSignersScene(wallet, this.onSignerSelected);
       }
       return generateConnectingScene(
-        this.wallet,
+        wallet,
         this.signer,
         this.onSignerSelected,
       );
@@ -157,20 +177,33 @@ export class WebComponentConnector extends LitElement {
   }
 
   private onClose = () => {
-    this.dispatchEvent(new SignerChangedEvent());
+    if (this.status === ConnectorStatus.SelectingSigner) {
+      this.onReset();
+    }
     this.dispatchEvent(new CloseEvent());
   };
 
+  private onReset = () => {
+    this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.SelectingSigner));
+    this.dispatchEvent(new SignerChangedEvent());
+  };
+
   private onWalletSelected = (wallet: ccc.Wallet) => {
     this.dispatchEvent(new SignerChangedEvent(wallet, this.signer));
   };
 
-  private onSignerSelected = (wallet: ccc.Wallet, signer: ccc.SignerInfo) => {
-    this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.Connecting));
-    this.dispatchEvent(new SignerChangedEvent(wallet, signer));
-
+  private onSignerSelected = (
+    wallet: ccc.Wallet | undefined,
+    signer: ccc.SignerInfo,
+  ) => {
     (async () => {
-      await signer.signer.connect();
+      this.dispatchEvent(new SignerChangedEvent(wallet, signer));
+
+      if (!(await signer.signer.isConnected())) {
+        this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.Connecting));
+        await signer.signer.connect();
+      }
+
       this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.Idle));
       this.dispatchEvent(new CloseEvent());
     })();

package/src/scenes/connecting.ts

@@ -5,7 +5,7 @@ import { RETRY_SVG } from "../assets/retry.svg";
 export function generateConnectingScene(
   wallet: ccc.Wallet,
   signer: ccc.SignerInfo,
-  onSignerSelected: (wallet: ccc.Wallet, signer: ccc.SignerInfo) => unknown,
+  onSignerSelected: (wallet: ccc.Wallet | undefined, signer: ccc.SignerInfo) => unknown,
 ) {
   return [
     wallet.name,

package/src/scenes/signers.ts

@@ -2,6 +2,7 @@ import { ccc } from "@ckb-ccc/ccc";
 import { html } from "lit";
 import { repeat } from "lit/directives/repeat.js";
 import { BTC_SVG, ETH_SVG } from "../assets/chains";
+import { WalletWithSigners } from "../types";
 
 export function signerTypeToIcon(type: ccc.SignerType): string {
   return {
@@ -11,8 +12,8 @@ export function signerTypeToIcon(type: ccc.SignerType): string {
 }
 
 export function generateSignersScene(
-  wallet: ccc.Wallet,
-  onSignerSelected: (wallet: ccc.Wallet, signer: ccc.SignerInfo) => unknown,
+  wallet: WalletWithSigners,
+  onSignerSelected: (wallet: ccc.Wallet | undefined, signer: ccc.SignerInfo) => unknown,
 ) {
   return [
     "Select a Chain",

package/src/scenes/wallets.ts

@@ -1,11 +1,12 @@
 import { ccc } from "@ckb-ccc/ccc";
 import { html } from "lit";
 import { repeat } from "lit/directives/repeat.js";
+import { WalletWithSigners } from "../types";
 
 export function generateWalletsScene(
-  wallets: ccc.Wallet[],
+  wallets: WalletWithSigners[],
   onWalletSelected: (wallet: ccc.Wallet) => unknown,
-  onSignerSelected: (wallet: ccc.Wallet, signer: ccc.SignerInfo) => unknown,
+  onSignerSelected: (wallet: ccc.Wallet | undefined, signer: ccc.SignerInfo) => unknown,
 ) {
   return [
     "Connect Wallet",

package/src/types/index.ts

@@ -0,0 +1,5 @@
+import { ccc } from "@ckb-ccc/ccc";
+
+export type WalletWithSigners = ccc.Wallet & {
+  signers: ccc.SignerInfo[];
+};