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

package/README.md

@@ -0,0 +1,37 @@
+<h1 align="center" style="font-size: 48px;">
+  CCC Connector
+</h1>
+
+<p align="center">
+  <a href="https://www.npmjs.com/package/@ckb-ccc/connector"><img
+    alt="NPM Version" src="https://img.shields.io/npm/v/%40ckb-ccc%2Fconnector"
+  /></a>
+  <img alt="GitHub commit activity" src="https://img.shields.io/github/commit-activity/m/ckb-ecofund/ccc" />
+  <img alt="GitHub last commit" src="https://img.shields.io/github/last-commit/ckb-ecofund/ccc/master" />
+  <img alt="GitHub deployments" src="https://img.shields.io/github/deployments/ckb-ecofund/ccc/production" />
+  <a href="https://ckbccc-demo.vercel.app/"><img
+    alt="Demo" src="https://img.shields.io/website?url=https%3A%2F%2Fckbccc-demo.vercel.app%2F&label=Demo"
+  /></a>
+</p>
+
+<p align="center">
+  "Common Chains Connector" is where CCC begins.
+  <br />
+  CCC helps you to interoperate wallets from different chain ecosystems with CKB,
+  <br />
+  fully enabling CKB's cryptographic freedom power.
+</p>
+
+## Preview
+
+<p align="center">
+  <a href="https://ckbccc-demo.vercel.app/">
+    <img src="https://raw.githubusercontent.com/ckb-ecofund/ccc/master/assets/preview.png" width="30%" />
+  </a>
+</p>
+
+This project is still under active development, and we are looking forward to your feedback. [Try its demo now here](https://ckbccc-demo.vercel.app/).
+
+<h3 align="center">
+  Read more about CCC on its <a href="https://github.com/ckb-ecofund/ccc">GitHub Repo</a>.
+</h3>

package/dist/connector/index.d.ts

@@ -1,14 +1,18 @@
 import { ccc } from "@ckb-ccc/ccc";
-import { LitElement } from "lit";
+import { LitElement, PropertyValues } from "lit";
 import { ConnectorStatus } from "../status";
 export declare class WebComponentConnector extends LitElement {
     private wallets;
-    private existedEip6963;
+    private resetListeners;
     isOpen: boolean;
+    client: ccc.Client;
     wallet?: ccc.Wallet;
     signer?: ccc.SignerInfo;
     status: ConnectorStatus;
     connectedCallback(): void;
+    willUpdate(changedProperties: PropertyValues<this>): void;
+    refreshSigners(): void;
+    reset(): void;
     addSigner(name: string, icon: string, type: ccc.SignerType, signer: ccc.Signer): void;
     render(): import("lit").TemplateResult<1>;
     private onClose;

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,EAAa,MAAM,KAAK,CAAC;AAW5C,OAAO,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAE5C,qBACa,qBAAsB,SAAQ,UAAU;IAEnD,OAAO,CAAC,OAAO,CAAoB;IACnC,OAAO,CAAC,cAAc,CAAgB;IAG/B,MAAM,EAAE,OAAO,CAAS;IAGxB,MAAM,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC;IAEpB,MAAM,CAAC,EAAE,GAAG,CAAC,UAAU,CAAC;IAExB,MAAM,EAAE,eAAe,CAAmC;IAEjE,iBAAiB,IAAI,IAAI;IAkCzB,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;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"}

package/dist/connector/index.js

@@ -17,8 +17,9 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
     constructor() {
         super(...arguments);
         this.wallets = [];
-        this.existedEip6963 = [];
+        this.resetListeners = [];
         this.isOpen = false;
+        this.client = new ccc.ClientPublicTestnet();
         this.status = ConnectorStatus.SelectingSigner;
         this.onClose = () => {
             this.dispatchEvent(new SignerChangedEvent());
@@ -39,23 +40,35 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
     }
     connectedCallback() {
         super.connectedCallback();
-        const client = new ccc.ClientPublicTestnet();
-        const uniSatSigner = ccc.UniSat.getUniSatSigner(client);
+        this.refreshSigners();
+    }
+    willUpdate(changedProperties) {
+        if (changedProperties.get("client")) {
+            this.reset();
+            this.refreshSigners();
+        }
+    }
+    refreshSigners() {
+        const uniSatSigner = ccc.UniSat.getUniSatSigner(this.client);
         if (uniSatSigner) {
             this.addSigner("UniSat", UNI_SAT_SVG, ccc.SignerType.BTC, uniSatSigner);
         }
-        const okxBitcoinSigner = ccc.Okx.getOKXBitcoinSigner(client);
+        const okxBitcoinSigner = ccc.Okx.getOKXBitcoinSigner(this.client);
         if (okxBitcoinSigner) {
             this.addSigner("OKX Wallet", OKX_SVG, ccc.SignerType.BTC, okxBitcoinSigner);
         }
-        const eip6963Manager = new ccc.Eip6963.SignerFactory(client);
-        eip6963Manager.subscribeSigners((signer) => {
-            if (this.existedEip6963.indexOf(signer.detail.info.uuid) !== -1) {
-                return;
-            }
-            this.existedEip6963.push(signer.detail.info.uuid);
+        const eip6963Manager = new ccc.Eip6963.SignerFactory(this.client);
+        this.resetListeners.push(eip6963Manager.subscribeSigners((signer) => {
             this.addSigner(`${signer.detail.info.name}`, signer.detail.info.icon, ccc.SignerType.EVM, signer);
-        });
+        }));
+    }
+    reset() {
+        this.wallets = [];
+        this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.SelectingSigner));
+        this.dispatchEvent(new SignerChangedEvent(undefined, undefined));
+        const resetListeners = this.resetListeners;
+        this.resetListeners = [];
+        resetListeners.forEach((listener) => listener());
     }
     addSigner(name, icon, type, signer) {
         const wallet = this.wallets.find((wallet) => wallet.name === name);
@@ -256,6 +269,9 @@ __decorate([
 __decorate([
     property()
 ], WebComponentConnector.prototype, "isOpen", void 0);
+__decorate([
+    property()
+], WebComponentConnector.prototype, "client", void 0);
 __decorate([
     property()
 ], WebComponentConnector.prototype, "wallet", void 0);

package/package.json

@@ -1,14 +1,14 @@
 {
   "name": "@ckb-ccc/connector",
-  "version": "0.0.4-alpha.0",
+  "version": "0.0.4-alpha.10",
   "description": "Common Chains Connector UI",
   "author": "Hanssen0 <hanssen0@hanssen0.com>",
   "license": "MIT",
   "private": false,
-  "homepage": "https://github.com/Hanssen0/ccc",
+  "homepage": "https://github.com/ckb-ecofund/ccc",
   "repository": {
     "type": "git",
-    "url": "git://github.com/Hanssen0/ccc.git"
+    "url": "git://github.com/ckb-ecofund/ccc.git"
   },
   "main": "dist/index.js",
   "exports": {
@@ -37,8 +37,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@ckb-ccc/ccc": "0.0.4-alpha.0",
+    "@ckb-ccc/ccc": "0.0.4-alpha.10",
     "lit": "^3.1.3"
   },
-  "gitHead": "e49045ed4b2778c92d6f49b79c17125245141a21"
+  "gitHead": "dec13b260f57a1b244c69af5566e316a4c329e35"
 }

package/src/connector/index.ts

@@ -1,5 +1,5 @@
 import { ccc } from "@ckb-ccc/ccc";
-import { LitElement, css, html } from "lit";
+import { LitElement, PropertyValues, css, html } from "lit";
 import { customElement, property, state } from "lit/decorators.js";
 import { CLOSE_SVG } from "../assets/close.svg";
 import { OKX_SVG } from "../assets/okx.svg";
@@ -16,11 +16,14 @@ import { ConnectorStatus } from "../status";
 export class WebComponentConnector extends LitElement {
   @state()
   private wallets: ccc.Wallet[] = [];
-  private existedEip6963: string[] = [];
+
+  private resetListeners: (() => void)[] = [];
 
   @property()
   public isOpen: boolean = false;
 
+  @property()
+  public client: ccc.Client = new ccc.ClientPublicTestnet();
   @property()
   public wallet?: ccc.Wallet;
   @property()
@@ -30,14 +33,23 @@ export class WebComponentConnector extends LitElement {
 
   connectedCallback(): void {
     super.connectedCallback();
+    this.refreshSigners();
+  }
 
-    const client = new ccc.ClientPublicTestnet();
-    const uniSatSigner = ccc.UniSat.getUniSatSigner(client);
+  willUpdate(changedProperties: PropertyValues<this>): void {
+    if (changedProperties.get("client")) {
+      this.reset();
+      this.refreshSigners();
+    }
+  }
+
+  refreshSigners() {
+    const uniSatSigner = ccc.UniSat.getUniSatSigner(this.client);
     if (uniSatSigner) {
       this.addSigner("UniSat", UNI_SAT_SVG, ccc.SignerType.BTC, uniSatSigner);
     }
 
-    const okxBitcoinSigner = ccc.Okx.getOKXBitcoinSigner(client);
+    const okxBitcoinSigner = ccc.Okx.getOKXBitcoinSigner(this.client);
     if (okxBitcoinSigner) {
       this.addSigner(
         "OKX Wallet",
@@ -47,19 +59,28 @@ export class WebComponentConnector extends LitElement {
       );
     }
 
-    const eip6963Manager = new ccc.Eip6963.SignerFactory(client);
-    eip6963Manager.subscribeSigners((signer) => {
-      if (this.existedEip6963.indexOf(signer.detail.info.uuid) !== -1) {
-        return;
-      }
-      this.existedEip6963.push(signer.detail.info.uuid);
-      this.addSigner(
-        `${signer.detail.info.name}`,
-        signer.detail.info.icon,
-        ccc.SignerType.EVM,
-        signer,
-      );
-    });
+    const eip6963Manager = new ccc.Eip6963.SignerFactory(this.client);
+    this.resetListeners.push(
+      eip6963Manager.subscribeSigners((signer) => {
+        this.addSigner(
+          `${signer.detail.info.name}`,
+          signer.detail.info.icon,
+          ccc.SignerType.EVM,
+          signer,
+        );
+      }),
+    );
+  }
+
+  reset() {
+    this.wallets = [];
+
+    this.dispatchEvent(new StatusChangedEvent(ConnectorStatus.SelectingSigner));
+    this.dispatchEvent(new SignerChangedEvent(undefined, undefined));
+
+    const resetListeners = this.resetListeners;
+    this.resetListeners = [];
+    resetListeners.forEach((listener) => listener());
   }
 
   addSigner(