@ckb-ccc/connector 0.0.8-alpha.3 → 0.0.9-alpha.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/connector/index.d.ts +1 -0
- package/dist/connector/index.d.ts.map +1 -1
- package/dist/connector/index.js +27 -30
- package/dist/scenes/connected.d.ts +1 -1
- package/dist/scenes/connected.d.ts.map +1 -1
- package/dist/scenes/connected.js +2 -4
- package/package.json +4 -4
- package/src/connector/index.ts +40 -32
- package/src/scenes/connected.ts +1 -4
- package/dist/assets/swap.svg.d.ts +0 -2
- package/dist/assets/swap.svg.d.ts.map +0 -1
- package/dist/assets/swap.svg.js +0 -2
- package/dist/scenes/networks.d.ts +0 -3
- package/dist/scenes/networks.d.ts.map +0 -1
- package/dist/scenes/networks.js +0 -38
- package/src/assets/swap.svg.ts +0 -5
- package/src/scenes/networks.ts +0 -47
|
@@ -5,6 +5,7 @@ export declare class WebComponentConnector extends LitElement {
|
|
|
5
5
|
private wallets;
|
|
6
6
|
signerFilter?: (signerInfo: ccc.SignerInfo, wallet: ccc.Wallet) => Promise<boolean>;
|
|
7
7
|
private resetListeners;
|
|
8
|
+
preferredNetworks?: ccc.NetworkPreference[];
|
|
8
9
|
name?: string;
|
|
9
10
|
icon?: string;
|
|
10
11
|
client: ccc.Client;
|
|
@@ -1 +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;AAE5D,OAAO,EAAE,GAAG,EAAkB,MAAM,uBAAuB,CAAC;
|
|
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;AAE5D,OAAO,EAAE,GAAG,EAAkB,MAAM,uBAAuB,CAAC;AAwB5D,qBACa,qBAAsB,SAAQ,UAAU;IAEnD,OAAO,CAAC,OAAO,CAA2B;IAEnC,YAAY,CAAC,EAAE,CACpB,UAAU,EAAE,GAAG,CAAC,UAAU,EAC1B,MAAM,EAAE,GAAG,CAAC,MAAM,KACf,OAAO,CAAC,OAAO,CAAC,CAAC;IAEtB,OAAO,CAAC,cAAc,CAAsB;IAGrC,iBAAiB,CAAC,EAAE,GAAG,CAAC,iBAAiB,EAAE,CAAC;IAG5C,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,IAAI,CAAC,EAAE,MAAM,CAAC;IAGd,MAAM,EAAE,GAAG,CAAC,MAAM,CAAiC;IACnD,SAAS,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM;IAKnC,OAAO,CAAC,KAAK,CAAiC;IAE9C,OAAO,CAAC,cAAc,CAAC,CAAoB;IAE3C,OAAO,CAAC,cAAc,CAAC,CAAiB;IAExC,OAAO,CAAC,eAAe,CAAC,CAAS;IAGjC,OAAO,CAAC,UAAU,CAAC,CAAS;IAE5B,OAAO,CAAC,UAAU,CAAC,CAAS;IAErB,MAAM,CAAC,EAAE,GAAG,CAAC,MAAM,CAAC;IAEpB,MAAM,CAAC,EAAE,GAAG,CAAC,UAAU,CAAC;IAG/B,OAAO,CAAC,gBAAgB,CAAC,CAAS;IAElC,OAAO,CAAC,eAAe,CAAC,CAAS;IAEjC,OAAO,CAAC,OAAO,CAAC,CAAU;YAEZ,gBAAgB;YAUhB,aAAa;IAYpB,UAAU;IAQjB,OAAO,CAAC,cAAc;IAYtB,OAAO,CAAC,cAAc;IAUtB,iBAAiB,IAAI,IAAI;IAQzB,UAAU,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAqCnD,OAAO,CAAC,aAAa;YAwHP,SAAS;IAyCvB,OAAO,EAAE,GAAG,CAAC,cAAc,CAAC,CAAe;IAC3C,SAAS,EAAE,GAAG,CAAC,cAAc,CAAC,CAAe;IAC7C,OAAO,EAAE,GAAG,CAAC,cAAc,CAAC,CAAe;IAE3C,MAAM;IAkFN,OAAO;IAUP,OAAO,CAAC,aAAa,CAcnB;IAEF,OAAO,CAAC,qBAAqB,CAqC3B;IAEF,MAAM,CAAC,MAAM,0BAsPX;CACH"}
|
package/dist/connector/index.js
CHANGED
|
@@ -18,14 +18,12 @@ import { UNI_SAT_SVG } from "../assets/uni-sat.svg";
|
|
|
18
18
|
import { ClosedEvent, WillUpdateEvent } from "../events";
|
|
19
19
|
import { generateConnectingScene, generateSignersScene, generateWalletsScene, } from "../scenes";
|
|
20
20
|
import { generateConnectedScene } from "../scenes/connected";
|
|
21
|
-
import { generateNetworksScene } from "../scenes/networks";
|
|
22
21
|
var Scene;
|
|
23
22
|
(function (Scene) {
|
|
24
23
|
Scene["SelectingWallets"] = "SelectingWallets";
|
|
25
24
|
Scene["SelectingSigners"] = "SelectingSigners";
|
|
26
25
|
Scene["Connecting"] = "Connecting";
|
|
27
26
|
Scene["Connected"] = "Connected";
|
|
28
|
-
Scene["SwitchingNetworks"] = "SwitchingNetworks";
|
|
29
27
|
})(Scene || (Scene = {}));
|
|
30
28
|
let WebComponentConnector = class WebComponentConnector extends LitElement {
|
|
31
29
|
constructor() {
|
|
@@ -47,9 +45,6 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
|
|
|
47
45
|
this.selectedSigner = undefined;
|
|
48
46
|
this.selectedWallet = undefined;
|
|
49
47
|
}
|
|
50
|
-
else if ([Scene.SwitchingNetworks].includes(this.scene)) {
|
|
51
|
-
this.scene = Scene.Connected;
|
|
52
|
-
}
|
|
53
48
|
this.dispatchEvent(new ClosedEvent());
|
|
54
49
|
};
|
|
55
50
|
this.signerSelectedHandler = (wallet, signerInfo) => {
|
|
@@ -116,6 +111,7 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
|
|
|
116
111
|
this.signerName = undefined;
|
|
117
112
|
this.saveConnection();
|
|
118
113
|
this.closedHandler();
|
|
114
|
+
this.signer?.signer.disconnect();
|
|
119
115
|
}
|
|
120
116
|
loadConnection() {
|
|
121
117
|
const { signerName, walletName, } = JSON.parse(window.localStorage.getItem("ccc-connection-info") ?? "{}");
|
|
@@ -137,7 +133,8 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
|
|
|
137
133
|
}
|
|
138
134
|
willUpdate(changedProperties) {
|
|
139
135
|
if (changedProperties.has("client") ||
|
|
140
|
-
changedProperties.has("signerFilter")
|
|
136
|
+
changedProperties.has("signerFilter") ||
|
|
137
|
+
changedProperties.has("preferredNetworks")) {
|
|
141
138
|
this.reloadSigners();
|
|
142
139
|
}
|
|
143
140
|
if ((changedProperties.has("scene") && this.scene === Scene.Connected) ||
|
|
@@ -184,17 +181,29 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
|
|
|
184
181
|
document.querySelector("head title").text;
|
|
185
182
|
const icon = this.icon ??
|
|
186
183
|
document.querySelector('link[rel="icon"]').href;
|
|
187
|
-
|
|
184
|
+
const preferredNetworks = [
|
|
185
|
+
...(this.preferredNetworks ?? []),
|
|
186
|
+
{
|
|
187
|
+
addressPrefix: "ckb",
|
|
188
|
+
signerType: ccc.SignerType.BTC,
|
|
189
|
+
network: "btc",
|
|
190
|
+
},
|
|
191
|
+
{
|
|
192
|
+
addressPrefix: "ckt",
|
|
193
|
+
signerType: ccc.SignerType.BTC,
|
|
194
|
+
network: "btcTestnet",
|
|
195
|
+
},
|
|
196
|
+
];
|
|
197
|
+
ccc.JoyId.getJoyIdSigners(this.client, name, icon, preferredNetworks).forEach(({ signer, name }) => {
|
|
188
198
|
this.addSigner("JoyID", name, JOY_ID_SVG, signer);
|
|
189
199
|
});
|
|
190
|
-
const uniSatSigner = ccc.UniSat.getUniSatSigner(this.client);
|
|
200
|
+
const uniSatSigner = ccc.UniSat.getUniSatSigner(this.client, preferredNetworks);
|
|
191
201
|
if (uniSatSigner) {
|
|
192
202
|
this.addSigner("UniSat", "BTC", UNI_SAT_SVG, uniSatSigner);
|
|
193
203
|
}
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
}
|
|
204
|
+
ccc.Okx.getOKXBitcoinSigner(this.client, preferredNetworks).forEach((signer) => {
|
|
205
|
+
this.addSigner("OKX Wallet", signer.type, OKX_SVG, signer);
|
|
206
|
+
});
|
|
198
207
|
const nip07Signer = ccc.Nip07.getNip07Signer(this.client);
|
|
199
208
|
if (nip07Signer) {
|
|
200
209
|
this.addSigner("Nostr", "Nostr", NOSTR_SVG, nip07Signer);
|
|
@@ -244,15 +253,7 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
|
|
|
244
253
|
render() {
|
|
245
254
|
const [title, body] = (() => {
|
|
246
255
|
if (this.scene === Scene.Connected && this.wallet && this.signer) {
|
|
247
|
-
return generateConnectedScene(this.wallet, this.signer, this.recommendAddress, this.internalAddress, this.balance, this.disconnect.bind(this)
|
|
248
|
-
this.scene = Scene.SwitchingNetworks;
|
|
249
|
-
});
|
|
250
|
-
}
|
|
251
|
-
if (this.scene === Scene.SwitchingNetworks) {
|
|
252
|
-
return generateNetworksScene(this.client, (client) => {
|
|
253
|
-
this.setClient(client);
|
|
254
|
-
this.closedHandler();
|
|
255
|
-
});
|
|
256
|
+
return generateConnectedScene(this.wallet, this.signer, this.recommendAddress, this.internalAddress, this.balance, this.disconnect.bind(this));
|
|
256
257
|
}
|
|
257
258
|
if (this.scene === Scene.SelectingWallets || !this.selectedWallet) {
|
|
258
259
|
return generateWalletsScene(this.wallets, (wallet) => {
|
|
@@ -265,11 +266,7 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
|
|
|
265
266
|
}
|
|
266
267
|
return generateConnectingScene(this.selectedWallet, this.selectedSigner, this.connectingError, this.signerSelectedHandler);
|
|
267
268
|
})();
|
|
268
|
-
const canBack = [
|
|
269
|
-
Scene.SelectingSigners,
|
|
270
|
-
Scene.Connecting,
|
|
271
|
-
Scene.SwitchingNetworks,
|
|
272
|
-
].includes(this.scene);
|
|
269
|
+
const canBack = [Scene.SelectingSigners, Scene.Connecting].includes(this.scene);
|
|
273
270
|
return html ` <div
|
|
274
271
|
class="background"
|
|
275
272
|
@click=${(event) => {
|
|
@@ -300,9 +297,6 @@ let WebComponentConnector = class WebComponentConnector extends LitElement {
|
|
|
300
297
|
else if (this.scene === Scene.SelectingSigners) {
|
|
301
298
|
this.scene = Scene.SelectingWallets;
|
|
302
299
|
}
|
|
303
|
-
else if (this.scene === Scene.SwitchingNetworks) {
|
|
304
|
-
this.scene = Scene.Connected;
|
|
305
|
-
}
|
|
306
300
|
}}
|
|
307
301
|
/>
|
|
308
302
|
${title}
|
|
@@ -577,6 +571,9 @@ __decorate([
|
|
|
577
571
|
__decorate([
|
|
578
572
|
property()
|
|
579
573
|
], WebComponentConnector.prototype, "signerFilter", void 0);
|
|
574
|
+
__decorate([
|
|
575
|
+
property()
|
|
576
|
+
], WebComponentConnector.prototype, "preferredNetworks", void 0);
|
|
580
577
|
__decorate([
|
|
581
578
|
property()
|
|
582
579
|
], WebComponentConnector.prototype, "name", void 0);
|
|
@@ -584,7 +581,7 @@ __decorate([
|
|
|
584
581
|
property()
|
|
585
582
|
], WebComponentConnector.prototype, "icon", void 0);
|
|
586
583
|
__decorate([
|
|
587
|
-
|
|
584
|
+
state()
|
|
588
585
|
], WebComponentConnector.prototype, "client", void 0);
|
|
589
586
|
__decorate([
|
|
590
587
|
state()
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { ccc } from "@ckb-ccc/ccc";
|
|
2
2
|
export declare function formatString(str: string | undefined, l?: number, r?: number): string | undefined;
|
|
3
|
-
export declare function generateConnectedScene(wallet: ccc.Wallet, signer: ccc.SignerInfo, recommendedAddress: string | undefined, internalAddress: string | undefined, balance: ccc.Num | undefined, disconnect: () => void
|
|
3
|
+
export declare function generateConnectedScene(wallet: ccc.Wallet, signer: ccc.SignerInfo, recommendedAddress: string | undefined, internalAddress: string | undefined, balance: ccc.Num | undefined, disconnect: () => void): (import("lit").TemplateResult<1> | undefined)[];
|
|
4
4
|
//# sourceMappingURL=connected.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"connected.d.ts","sourceRoot":"","sources":["../../src/scenes/connected.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"connected.d.ts","sourceRoot":"","sources":["../../src/scenes/connected.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AAenC,wBAAgB,YAAY,CAC1B,GAAG,EAAE,MAAM,GAAG,SAAS,EACvB,CAAC,SAAI,EACL,CAAC,SAAI,GACJ,MAAM,GAAG,SAAS,CAKpB;AAED,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,GAAG,CAAC,MAAM,EAClB,MAAM,EAAE,GAAG,CAAC,UAAU,EACtB,kBAAkB,EAAE,MAAM,GAAG,SAAS,EACtC,eAAe,EAAE,MAAM,GAAG,SAAS,EACnC,OAAO,EAAE,GAAG,CAAC,GAAG,GAAG,SAAS,EAC5B,UAAU,EAAE,MAAM,IAAI,mDAmDvB"}
|
package/dist/scenes/connected.js
CHANGED
|
@@ -3,7 +3,6 @@ import { html } from "lit";
|
|
|
3
3
|
import { CKB_SVG } from "../assets/chains";
|
|
4
4
|
import { COPY_SVG } from "../assets/copy.svg";
|
|
5
5
|
import { DISCONNECT_SVG } from "../assets/diconnect.svg";
|
|
6
|
-
import { SWAP_SVG } from "../assets/swap.svg";
|
|
7
6
|
import { signerTypeToIcon } from "./signers";
|
|
8
7
|
function copyAddress(address) {
|
|
9
8
|
if (!address) {
|
|
@@ -17,7 +16,7 @@ export function formatString(str, l = 7, r = 5) {
|
|
|
17
16
|
}
|
|
18
17
|
return str;
|
|
19
18
|
}
|
|
20
|
-
export function generateConnectedScene(wallet, signer, recommendedAddress, internalAddress, balance, disconnect
|
|
19
|
+
export function generateConnectedScene(wallet, signer, recommendedAddress, internalAddress, balance, disconnect) {
|
|
21
20
|
return [
|
|
22
21
|
undefined,
|
|
23
22
|
html `
|
|
@@ -58,11 +57,10 @@ export function generateConnectedScene(wallet, signer, recommendedAddress, inter
|
|
|
58
57
|
|
|
59
58
|
<div class="switch-btn-container align-center flex justify-center mt-1">
|
|
60
59
|
<div class="switch-line"></div>
|
|
61
|
-
<div class="switch-content flex align-center
|
|
60
|
+
<div class="switch-content flex align-center ml-2 mr-2 fs-sm">
|
|
62
61
|
<img class="mr-1 sm-chain-logo" src=${CKB_SVG} alt="Nervos Network">
|
|
63
62
|
${signer.signer.client.addressPrefix === "ckb" ? "Mainnet" : "Testnet"}
|
|
64
63
|
${["ckb", "ckt"].includes(signer.signer.client.addressPrefix) ? "" : ` ${signer.signer.client.addressPrefix}`}
|
|
65
|
-
<img class="ml-1" src=${SWAP_SVG} alt="Nervos Network">
|
|
66
64
|
</div>
|
|
67
65
|
<div class="switch-line"></div>
|
|
68
66
|
</div>
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ckb-ccc/connector",
|
|
3
|
-
"version": "0.0.
|
|
4
|
-
"description": "Common Chains Connector UI",
|
|
3
|
+
"version": "0.0.9-alpha.0",
|
|
4
|
+
"description": "CCC - CKBer's Codebase. Common Chains Connector UI",
|
|
5
5
|
"author": "Hanssen0 <hanssen0@hanssen0.com>",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"private": false,
|
|
@@ -37,8 +37,8 @@
|
|
|
37
37
|
"access": "public"
|
|
38
38
|
},
|
|
39
39
|
"dependencies": {
|
|
40
|
-
"@ckb-ccc/ccc": "0.0.
|
|
40
|
+
"@ckb-ccc/ccc": "0.0.9-alpha.0",
|
|
41
41
|
"lit": "^3.1.3"
|
|
42
42
|
},
|
|
43
|
-
"gitHead": "
|
|
43
|
+
"gitHead": "ac4435006da9c9e48b3b66fc329e6f539156b252"
|
|
44
44
|
}
|
package/src/connector/index.ts
CHANGED
|
@@ -16,7 +16,6 @@ import {
|
|
|
16
16
|
generateWalletsScene,
|
|
17
17
|
} from "../scenes";
|
|
18
18
|
import { generateConnectedScene } from "../scenes/connected";
|
|
19
|
-
import { generateNetworksScene } from "../scenes/networks";
|
|
20
19
|
import { WalletWithSigners } from "../types";
|
|
21
20
|
|
|
22
21
|
enum Scene {
|
|
@@ -24,7 +23,6 @@ enum Scene {
|
|
|
24
23
|
SelectingSigners = "SelectingSigners",
|
|
25
24
|
Connecting = "Connecting",
|
|
26
25
|
Connected = "Connected",
|
|
27
|
-
SwitchingNetworks = "SwitchingNetworks",
|
|
28
26
|
}
|
|
29
27
|
|
|
30
28
|
@customElement("ccc-connector")
|
|
@@ -39,12 +37,15 @@ export class WebComponentConnector extends LitElement {
|
|
|
39
37
|
|
|
40
38
|
private resetListeners: (() => void)[] = [];
|
|
41
39
|
|
|
40
|
+
@property()
|
|
41
|
+
public preferredNetworks?: ccc.NetworkPreference[];
|
|
42
|
+
|
|
42
43
|
@property()
|
|
43
44
|
public name?: string;
|
|
44
45
|
@property()
|
|
45
46
|
public icon?: string;
|
|
46
47
|
|
|
47
|
-
@
|
|
48
|
+
@state()
|
|
48
49
|
public client: ccc.Client = new ccc.ClientPublicTestnet();
|
|
49
50
|
public setClient(client: ccc.Client) {
|
|
50
51
|
this.client = client;
|
|
@@ -102,6 +103,7 @@ export class WebComponentConnector extends LitElement {
|
|
|
102
103
|
this.signerName = undefined;
|
|
103
104
|
this.saveConnection();
|
|
104
105
|
this.closedHandler();
|
|
106
|
+
this.signer?.signer.disconnect();
|
|
105
107
|
}
|
|
106
108
|
|
|
107
109
|
private loadConnection() {
|
|
@@ -137,7 +139,8 @@ export class WebComponentConnector extends LitElement {
|
|
|
137
139
|
willUpdate(changedProperties: PropertyValues): void {
|
|
138
140
|
if (
|
|
139
141
|
changedProperties.has("client") ||
|
|
140
|
-
changedProperties.has("signerFilter")
|
|
142
|
+
changedProperties.has("signerFilter") ||
|
|
143
|
+
changedProperties.has("preferredNetworks")
|
|
141
144
|
) {
|
|
142
145
|
this.reloadSigners();
|
|
143
146
|
}
|
|
@@ -196,22 +199,42 @@ export class WebComponentConnector extends LitElement {
|
|
|
196
199
|
const icon =
|
|
197
200
|
this.icon ??
|
|
198
201
|
(document.querySelector('link[rel="icon"]') as HTMLLinkElement).href;
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
202
|
+
const preferredNetworks = [
|
|
203
|
+
...(this.preferredNetworks ?? []),
|
|
204
|
+
{
|
|
205
|
+
addressPrefix: "ckb",
|
|
206
|
+
signerType: ccc.SignerType.BTC,
|
|
207
|
+
network: "btc",
|
|
203
208
|
},
|
|
204
|
-
|
|
209
|
+
{
|
|
210
|
+
addressPrefix: "ckt",
|
|
211
|
+
signerType: ccc.SignerType.BTC,
|
|
212
|
+
network: "btcTestnet",
|
|
213
|
+
},
|
|
214
|
+
];
|
|
215
|
+
|
|
216
|
+
ccc.JoyId.getJoyIdSigners(
|
|
217
|
+
this.client,
|
|
218
|
+
name,
|
|
219
|
+
icon,
|
|
220
|
+
preferredNetworks,
|
|
221
|
+
).forEach(({ signer, name }) => {
|
|
222
|
+
this.addSigner("JoyID", name, JOY_ID_SVG, signer);
|
|
223
|
+
});
|
|
205
224
|
|
|
206
|
-
const uniSatSigner = ccc.UniSat.getUniSatSigner(
|
|
225
|
+
const uniSatSigner = ccc.UniSat.getUniSatSigner(
|
|
226
|
+
this.client,
|
|
227
|
+
preferredNetworks,
|
|
228
|
+
);
|
|
207
229
|
if (uniSatSigner) {
|
|
208
230
|
this.addSigner("UniSat", "BTC", UNI_SAT_SVG, uniSatSigner);
|
|
209
231
|
}
|
|
210
232
|
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
233
|
+
ccc.Okx.getOKXBitcoinSigner(this.client, preferredNetworks).forEach(
|
|
234
|
+
(signer) => {
|
|
235
|
+
this.addSigner("OKX Wallet", signer.type, OKX_SVG, signer);
|
|
236
|
+
},
|
|
237
|
+
);
|
|
215
238
|
|
|
216
239
|
const nip07Signer = ccc.Nip07.getNip07Signer(this.client);
|
|
217
240
|
if (nip07Signer) {
|
|
@@ -325,17 +348,8 @@ export class WebComponentConnector extends LitElement {
|
|
|
325
348
|
this.internalAddress,
|
|
326
349
|
this.balance,
|
|
327
350
|
this.disconnect.bind(this),
|
|
328
|
-
() => {
|
|
329
|
-
this.scene = Scene.SwitchingNetworks;
|
|
330
|
-
},
|
|
331
351
|
);
|
|
332
352
|
}
|
|
333
|
-
if (this.scene === Scene.SwitchingNetworks) {
|
|
334
|
-
return generateNetworksScene(this.client, (client) => {
|
|
335
|
-
this.setClient(client);
|
|
336
|
-
this.closedHandler();
|
|
337
|
-
});
|
|
338
|
-
}
|
|
339
353
|
if (this.scene === Scene.SelectingWallets || !this.selectedWallet) {
|
|
340
354
|
return generateWalletsScene(
|
|
341
355
|
this.wallets,
|
|
@@ -360,11 +374,9 @@ export class WebComponentConnector extends LitElement {
|
|
|
360
374
|
);
|
|
361
375
|
})();
|
|
362
376
|
|
|
363
|
-
const canBack = [
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
Scene.SwitchingNetworks,
|
|
367
|
-
].includes(this.scene);
|
|
377
|
+
const canBack = [Scene.SelectingSigners, Scene.Connecting].includes(
|
|
378
|
+
this.scene,
|
|
379
|
+
);
|
|
368
380
|
|
|
369
381
|
return html` <div
|
|
370
382
|
class="background"
|
|
@@ -393,8 +405,6 @@ export class WebComponentConnector extends LitElement {
|
|
|
393
405
|
}
|
|
394
406
|
} else if (this.scene === Scene.SelectingSigners) {
|
|
395
407
|
this.scene = Scene.SelectingWallets;
|
|
396
|
-
} else if (this.scene === Scene.SwitchingNetworks) {
|
|
397
|
-
this.scene = Scene.Connected;
|
|
398
408
|
}
|
|
399
409
|
}}
|
|
400
410
|
/>
|
|
@@ -431,8 +441,6 @@ export class WebComponentConnector extends LitElement {
|
|
|
431
441
|
this.scene = Scene.SelectingWallets;
|
|
432
442
|
this.selectedSigner = undefined;
|
|
433
443
|
this.selectedWallet = undefined;
|
|
434
|
-
} else if ([Scene.SwitchingNetworks].includes(this.scene)) {
|
|
435
|
-
this.scene = Scene.Connected;
|
|
436
444
|
}
|
|
437
445
|
|
|
438
446
|
this.dispatchEvent(new ClosedEvent());
|
package/src/scenes/connected.ts
CHANGED
|
@@ -3,7 +3,6 @@ import { html } from "lit";
|
|
|
3
3
|
import { CKB_SVG } from "../assets/chains";
|
|
4
4
|
import { COPY_SVG } from "../assets/copy.svg";
|
|
5
5
|
import { DISCONNECT_SVG } from "../assets/diconnect.svg";
|
|
6
|
-
import { SWAP_SVG } from "../assets/swap.svg";
|
|
7
6
|
import { signerTypeToIcon } from "./signers";
|
|
8
7
|
|
|
9
8
|
function copyAddress(address?: string) {
|
|
@@ -32,7 +31,6 @@ export function generateConnectedScene(
|
|
|
32
31
|
internalAddress: string | undefined,
|
|
33
32
|
balance: ccc.Num | undefined,
|
|
34
33
|
disconnect: () => void,
|
|
35
|
-
handleSwitchClick: () => void,
|
|
36
34
|
) {
|
|
37
35
|
return [
|
|
38
36
|
undefined,
|
|
@@ -74,11 +72,10 @@ export function generateConnectedScene(
|
|
|
74
72
|
|
|
75
73
|
<div class="switch-btn-container align-center flex justify-center mt-1">
|
|
76
74
|
<div class="switch-line"></div>
|
|
77
|
-
<div class="switch-content flex align-center
|
|
75
|
+
<div class="switch-content flex align-center ml-2 mr-2 fs-sm">
|
|
78
76
|
<img class="mr-1 sm-chain-logo" src=${CKB_SVG} alt="Nervos Network">
|
|
79
77
|
${signer.signer.client.addressPrefix === "ckb" ? "Mainnet" : "Testnet"}
|
|
80
78
|
${["ckb", "ckt"].includes(signer.signer.client.addressPrefix) ? "" : ` ${signer.signer.client.addressPrefix}`}
|
|
81
|
-
<img class="ml-1" src=${SWAP_SVG} alt="Nervos Network">
|
|
82
79
|
</div>
|
|
83
80
|
<div class="switch-line"></div>
|
|
84
81
|
</div>
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"swap.svg.d.ts","sourceRoot":"","sources":["../../src/assets/swap.svg.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,QAAQ,QAEpB,CAAC"}
|
package/dist/assets/swap.svg.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import { encodeSvgToImgSrc } from "./utils";
|
|
2
|
-
export const SWAP_SVG = encodeSvgToImgSrc('<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.30688 5.22537L11.1669 3.36536L9.30688 1.50537" stroke="#666666" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.16699 3.36523H11.167" stroke="#666666" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/><path d="M4.02698 6.77539L2.16699 8.63541L4.02698 10.4954" stroke="#666666" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.167 8.63525H2.16699" stroke="#666666" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/></svg>');
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"networks.d.ts","sourceRoot":"","sources":["../../src/scenes/networks.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,GAAG,EAAE,MAAM,IAAI,CAAC;AAGzB,wBAAgB,qBAAqB,CACnC,MAAM,EAAE,GAAG,CAAC,MAAM,EAClB,eAAe,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,MAAM,KAAK,OAAO,aAuCjD"}
|
package/dist/scenes/networks.js
DELETED
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import { html } from "lit";
|
|
2
|
-
import { repeat } from "lit/directives/repeat.js";
|
|
3
|
-
import { ccc } from "..";
|
|
4
|
-
import { CKB_SVG } from "../assets/chains";
|
|
5
|
-
export function generateNetworksScene(client, handleSwapClick) {
|
|
6
|
-
const isMainnet = client.addressPrefix === "ckb";
|
|
7
|
-
return [
|
|
8
|
-
"Switch Network",
|
|
9
|
-
repeat([
|
|
10
|
-
{
|
|
11
|
-
activated: isMainnet,
|
|
12
|
-
name: "Mainnet",
|
|
13
|
-
onClick: () => handleSwapClick(new ccc.ClientPublicMainnet()),
|
|
14
|
-
},
|
|
15
|
-
{
|
|
16
|
-
activated: !isMainnet,
|
|
17
|
-
name: "Testnet",
|
|
18
|
-
onClick: () => handleSwapClick(new ccc.ClientPublicTestnet()),
|
|
19
|
-
},
|
|
20
|
-
], ({ name }) => name, ({ activated, name, onClick }) => html `
|
|
21
|
-
<button
|
|
22
|
-
class="btn-primary flex justify-between mb-1 ${activated
|
|
23
|
-
? "switching-active"
|
|
24
|
-
: ""}"
|
|
25
|
-
?disabled=${activated}
|
|
26
|
-
@click=${onClick}
|
|
27
|
-
>
|
|
28
|
-
<div class="flex align-center">
|
|
29
|
-
<img src=${CKB_SVG} alt="Nervos Network" />
|
|
30
|
-
<span>${name}</span>
|
|
31
|
-
</div>
|
|
32
|
-
<div class="flex align-center">
|
|
33
|
-
${activated ? html `<div class="switching-status-dot"></div>` : ""}
|
|
34
|
-
</div>
|
|
35
|
-
</button>
|
|
36
|
-
`),
|
|
37
|
-
];
|
|
38
|
-
}
|
package/src/assets/swap.svg.ts
DELETED
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { encodeSvgToImgSrc } from "./utils";
|
|
2
|
-
|
|
3
|
-
export const SWAP_SVG = encodeSvgToImgSrc(
|
|
4
|
-
'<svg width="13" height="12" viewBox="0 0 13 12" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.30688 5.22537L11.1669 3.36536L9.30688 1.50537" stroke="#666666" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/><path d="M2.16699 3.36523H11.167" stroke="#666666" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/><path d="M4.02698 6.77539L2.16699 8.63541L4.02698 10.4954" stroke="#666666" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/><path d="M11.167 8.63525H2.16699" stroke="#666666" stroke-width="1.33333" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
|
5
|
-
);
|
package/src/scenes/networks.ts
DELETED
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
import { html } from "lit";
|
|
2
|
-
import { repeat } from "lit/directives/repeat.js";
|
|
3
|
-
import { ccc } from "..";
|
|
4
|
-
import { CKB_SVG } from "../assets/chains";
|
|
5
|
-
|
|
6
|
-
export function generateNetworksScene(
|
|
7
|
-
client: ccc.Client,
|
|
8
|
-
handleSwapClick: (client: ccc.Client) => unknown,
|
|
9
|
-
) {
|
|
10
|
-
const isMainnet = client.addressPrefix === "ckb";
|
|
11
|
-
|
|
12
|
-
return [
|
|
13
|
-
"Switch Network",
|
|
14
|
-
repeat(
|
|
15
|
-
[
|
|
16
|
-
{
|
|
17
|
-
activated: isMainnet,
|
|
18
|
-
name: "Mainnet",
|
|
19
|
-
onClick: () => handleSwapClick(new ccc.ClientPublicMainnet()),
|
|
20
|
-
},
|
|
21
|
-
{
|
|
22
|
-
activated: !isMainnet,
|
|
23
|
-
name: "Testnet",
|
|
24
|
-
onClick: () => handleSwapClick(new ccc.ClientPublicTestnet()),
|
|
25
|
-
},
|
|
26
|
-
],
|
|
27
|
-
({ name }) => name,
|
|
28
|
-
({ activated, name, onClick }) => html`
|
|
29
|
-
<button
|
|
30
|
-
class="btn-primary flex justify-between mb-1 ${activated
|
|
31
|
-
? "switching-active"
|
|
32
|
-
: ""}"
|
|
33
|
-
?disabled=${activated}
|
|
34
|
-
@click=${onClick}
|
|
35
|
-
>
|
|
36
|
-
<div class="flex align-center">
|
|
37
|
-
<img src=${CKB_SVG} alt="Nervos Network" />
|
|
38
|
-
<span>${name}</span>
|
|
39
|
-
</div>
|
|
40
|
-
<div class="flex align-center">
|
|
41
|
-
${activated ? html`<div class="switching-status-dot"></div>` : ""}
|
|
42
|
-
</div>
|
|
43
|
-
</button>
|
|
44
|
-
`,
|
|
45
|
-
),
|
|
46
|
-
];
|
|
47
|
-
}
|