@onekeyfe/inpage-providers-hub 1.0.5 → 1.0.7

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.
Files changed (16) hide show
  1. package/dist/cjs/connectButtonHack/hackConnectButton.js +98 -7
  2. package/dist/cjs/connectButtonHack/hackConnectButtonTest.js +9 -0
  3. package/dist/cjs/connectButtonHack/index.js +4 -1
  4. package/dist/cjs/connectButtonHack/sites/pancake.js +40 -0
  5. package/dist/cjs/connectButtonHack/sites/walletconnect.js +160 -2
  6. package/dist/connectButtonHack/hackConnectButton.d.ts +10 -1
  7. package/dist/connectButtonHack/hackConnectButton.js +95 -6
  8. package/dist/connectButtonHack/hackConnectButtonTest.d.ts +3 -0
  9. package/dist/connectButtonHack/hackConnectButtonTest.js +6 -0
  10. package/dist/connectButtonHack/index.d.ts +2 -1
  11. package/dist/connectButtonHack/index.js +4 -1
  12. package/dist/connectButtonHack/sites/pancake.d.ts +1 -0
  13. package/dist/connectButtonHack/sites/pancake.js +38 -0
  14. package/dist/connectButtonHack/sites/walletconnect.js +161 -3
  15. package/dist/injectWeb3Provider.d.ts +12 -1
  16. package/package.json +9 -9
package/dist/cjs/connectButtonHack/hackConnectButton.js CHANGED
@@ -1,6 +1,15 @@
1
1
  "use strict";
2
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
3
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
4
+ return new (P || (P = Promise))(function (resolve, reject) {
5
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
6
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
7
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
8
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
9
+ });
10
+ };
2
11
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.hackConnectButton = exports.createNewImageToContainer = void 0;
12
+ exports.hackConnectButton = exports.createNewImageToContainer = exports.createWalletConnectToButton = exports.detectQrcodeFromSvg = void 0;
4
13
  const lodash_1 = require("lodash");
5
14
  const cross_inpage_provider_types_1 = require("@onekeyfe/cross-inpage-provider-types");
6
15
  function checkIfWalletConnected({ providerName }) {
@@ -17,20 +26,88 @@ function checkIfWalletConnected({ providerName }) {
17
26
  }
18
27
  return false;
19
28
  }
20
- function createNewImageToContainer({ container, icon, removeSvg = true, onCreated, }) {
29
+ function detectQrcodeFromSvg({ img, }) {
30
+ return __awaiter(this, void 0, void 0, function* () {
31
+ // https://unpkg.com/qr-scanner@1.4.1/qr-scanner.umd.min.js
32
+ // @ts-ignore
33
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-call
34
+ const barcodeDetector = new BarcodeDetector({ formats: ['qr_code'] });
35
+ const serialized = new XMLSerializer().serializeToString(img);
36
+ const encodedData = window.btoa(serialized);
37
+ const base64 = `data:image/svg+xml;base64,${encodedData}`;
38
+ return new Promise((resolve, reject) => {
39
+ const imgTemp = document.createElement('img');
40
+ imgTemp.src = base64;
41
+ imgTemp.style.width = '100px';
42
+ imgTemp.style.height = '100px';
43
+ imgTemp.onload = () => {
44
+ barcodeDetector
45
+ .detect(imgTemp)
46
+ .then((result) => {
47
+ var _a;
48
+ resolve((_a = result === null || result === void 0 ? void 0 : result[0]) === null || _a === void 0 ? void 0 : _a.rawValue);
49
+ })
50
+ .catch(reject)
51
+ .finally(() => {
52
+ imgTemp.remove();
53
+ });
54
+ };
55
+ document.body.appendChild(imgTemp);
56
+ });
57
+ // const res = await fetch(base64);
58
+ // const blob = await res.blob();
59
+ // const result = await barcodeDetector.detect(blob);
60
+ // return result?.[0]?.rawValue;
61
+ });
62
+ }
63
+ exports.detectQrcodeFromSvg = detectQrcodeFromSvg;
64
+ function createWalletConnectToButton({ container, onCreated, }) {
65
+ const datasetKey = 'onekey_auto_created_wallet_connect_btn'; // can not include `-`
66
+ if (!container.querySelector(`[data-${datasetKey}]`)) {
67
+ const btn = document.createElement('div');
68
+ btn.dataset[datasetKey] = 'true';
69
+ btn.style.cssText = `
70
+ border-radius: 12px;
71
+ padding-top: 8px;
72
+ padding-bottom: 8px;
73
+ padding-left: 16px;
74
+ padding-right: 16px;
75
+ background-color: #00B812;
76
+ color: white;
77
+ font-size: 14px;
78
+ line-height: 20px;
79
+ font-weight: 500;
80
+ cursor: pointer;
81
+ `;
82
+ // i18n key:
83
+ // action__connect_onekey_extension
84
+ // action__connect_onekey
85
+ btn.innerHTML = 'Connect OneKey';
86
+ onCreated === null || onCreated === void 0 ? void 0 : onCreated(btn);
87
+ container.append(btn);
88
+ }
89
+ }
90
+ exports.createWalletConnectToButton = createWalletConnectToButton;
91
+ function createNewImageToContainer({ container, icon, removeSvg = true, onCreated, width, height, }) {
21
92
  if (removeSvg) {
22
93
  const svg = container.querySelector('svg');
23
94
  if (svg) {
24
95
  svg.remove();
25
96
  }
26
97
  }
27
- const datasetKey = 'onekey_auto_created'; // can not include `-`
98
+ const datasetKey = 'onekey_auto_created_icon_img'; // can not include `-`
28
99
  if (!container.querySelector(`[data-${datasetKey}]`)) {
29
100
  const newImg = document.createElement('img');
30
101
  newImg.src = icon;
31
102
  newImg.dataset[datasetKey] = 'true';
32
103
  newImg.style.maxHeight = '100%';
33
104
  newImg.style.maxWidth = '100%';
105
+ if (width) {
106
+ newImg.style.width = width;
107
+ }
108
+ if (height) {
109
+ newImg.style.height = height;
110
+ }
34
111
  onCreated === null || onCreated === void 0 ? void 0 : onCreated(newImg);
35
112
  container.prepend(newImg);
36
113
  }
@@ -47,6 +124,10 @@ function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOpt
47
124
  }, callbackDelay = 10, }) {
48
125
  const isUrlMatched = () => Boolean(urls.includes(window.location.hostname) || urls.includes('*'));
49
126
  const run = () => {
127
+ // ignore web site run in iframe
128
+ if (window.top !== window) {
129
+ return;
130
+ }
50
131
  if (!isUrlMatched()) {
51
132
  return;
52
133
  }
@@ -65,7 +146,7 @@ function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOpt
65
146
  return;
66
147
  }
67
148
  if (process.env.NODE_ENV !== 'production') {
68
- console.log('mutation triggered: hackConnectButton');
149
+ console.log('mutation triggered: hackConnectButton (DEV only log)');
69
150
  }
70
151
  try {
71
152
  (_a = observer === null || observer === void 0 ? void 0 : observer.disconnect) === null || _a === void 0 ? void 0 : _a.call(observer);
@@ -73,7 +154,7 @@ function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOpt
73
154
  }
74
155
  catch (error) {
75
156
  if (process.env.NODE_ENV !== 'production') {
76
- console.error('hackConnectButton mutation ERROR:', error);
157
+ console.error('hackConnectButton mutation ERROR (DEV only log): ', error);
77
158
  }
78
159
  }
79
160
  finally {
@@ -86,15 +167,25 @@ function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOpt
86
167
  // Start observing the target node for configured mutations
87
168
  observer.observe(targetNode, config);
88
169
  };
170
+ let isRun = false;
171
+ const runOnce = () => {
172
+ if (isRun) {
173
+ return;
174
+ }
175
+ isRun = true;
176
+ setTimeout(() => {
177
+ run();
178
+ }, 1000);
179
+ };
89
180
  if (document.readyState === 'complete' ||
90
181
  // @ts-ignore
91
182
  document.readyState === 'loaded' ||
92
183
  document.readyState === 'interactive') {
93
- run();
184
+ runOnce();
94
185
  }
95
186
  else {
96
187
  window.addEventListener('DOMContentLoaded', function () {
97
- run();
188
+ runOnce();
98
189
  }, false);
99
190
  }
100
191
  }
package/dist/cjs/connectButtonHack/hackConnectButtonTest.js ADDED
@@ -0,0 +1,9 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.hackConnectButton = void 0;
4
+ const lodash_1 = require("lodash"); // cause jira crash
5
+ function hackConnectButton() {
6
+ console.log('throttle >>>>> ', lodash_1.throttle);
7
+ return { leading: false, trailing: true };
8
+ }
9
+ exports.hackConnectButton = hackConnectButton;
package/dist/cjs/connectButtonHack/index.js CHANGED
@@ -1,7 +1,8 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- require("./sites/opensea");
4
3
  require("./sites/walletconnect");
4
+ // ---------
5
+ require("./sites/opensea");
5
6
  require("./sites/magiceden");
6
7
  require("./sites/gem");
7
8
  require("./sites/rarible");
@@ -17,3 +18,5 @@ require("./sites/yearn");
17
18
  require("./sites/zapper");
18
19
  require("./sites/zerion");
19
20
  require("./sites/aave");
21
+ require("./sites/pancake");
22
+ // TODO list ----------------------------------------------
package/dist/cjs/connectButtonHack/sites/pancake.js ADDED
@@ -0,0 +1,40 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ const hackConnectButton_1 = require("../hackConnectButton");
4
+ const cross_inpage_provider_types_1 = require("@onekeyfe/cross-inpage-provider-types");
5
+ const consts_1 = require("../consts");
6
+ (0, hackConnectButton_1.hackConnectButton)({
7
+ urls: ['pancakeswap.finance', 'app.pancakeswap.finance', 'www.pancakeswap.finance'],
8
+ providers: [cross_inpage_provider_types_1.IInjectedProviderNames.ethereum],
9
+ replaceMethod() {
10
+ const replaceFunc = ({ findName, icon, text, }) => {
11
+ const btn = document.getElementById('wallet-connect-metamask');
12
+ if (!btn) {
13
+ return;
14
+ }
15
+ const svg = btn.querySelector('svg');
16
+ if (!svg) {
17
+ return;
18
+ }
19
+ const span = btn.querySelector('div');
20
+ if (span && span.innerText.includes(findName)) {
21
+ span.innerText = text;
22
+ (0, hackConnectButton_1.createNewImageToContainer)({
23
+ container: btn,
24
+ removeSvg: true,
25
+ icon,
26
+ width: '40px',
27
+ height: '40px',
28
+ onCreated(img) {
29
+ img.style.marginBottom = '8px';
30
+ },
31
+ });
32
+ }
33
+ };
34
+ replaceFunc({
35
+ findName: 'Metamask',
36
+ icon: consts_1.WALLET_CONNECT_INFO.metamask.icon,
37
+ text: consts_1.WALLET_CONNECT_INFO.metamask.text,
38
+ });
39
+ },
40
+ });
package/dist/cjs/connectButtonHack/sites/walletconnect.js CHANGED
@@ -1,19 +1,149 @@
1
1
  "use strict";
2
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
3
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
4
+ return new (P || (P = Promise))(function (resolve, reject) {
5
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
6
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
7
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
8
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
9
+ });
10
+ };
2
11
  Object.defineProperty(exports, "__esModule", { value: true });
3
12
  const hackConnectButton_1 = require("../hackConnectButton");
4
13
  const cross_inpage_provider_types_1 = require("@onekeyfe/cross-inpage-provider-types");
5
14
  const consts_1 = require("../consts");
15
+ const onekeyBtnBg = 'rgb(0, 184, 18)';
16
+ function setOnClickToConnectWallet({ element, uri }) {
17
+ element.onclick = (e) => {
18
+ var _a, _b;
19
+ e.preventDefault();
20
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
21
+ void ((_b = (_a = window.$onekey) === null || _a === void 0 ? void 0 : _a.$private) === null || _b === void 0 ? void 0 : _b.request({
22
+ method: 'wallet_connectToWalletConnect',
23
+ params: { uri },
24
+ }));
25
+ return false;
26
+ };
27
+ }
6
28
  (0, hackConnectButton_1.hackConnectButton)({
7
29
  urls: ['*'],
8
30
  providers: [cross_inpage_provider_types_1.IInjectedProviderNames.ethereum],
9
31
  replaceMethod() {
32
+ // $onekey.$walletInfo.platformEnv.isExtension
33
+ const onekeyHub = window.$onekey;
34
+ if (!onekeyHub || !onekeyHub.$walletInfo || !onekeyHub.$private) {
35
+ return;
36
+ }
37
+ const { isExtension, isDesktop, isNative } = onekeyHub.$walletInfo.platformEnv;
10
38
  const replaceFunc = ({ findName, icon, text, }) => {
39
+ var _a, _b, _c, _d, _e;
11
40
  const headerText = document.getElementById('walletconnect-qrcode-text');
41
+ if (!headerText) {
42
+ return;
43
+ }
12
44
  const qrcodeContainer = headerText === null || headerText === void 0 ? void 0 : headerText.nextSibling;
13
- const svg = qrcodeContainer === null || qrcodeContainer === void 0 ? void 0 : qrcodeContainer.querySelector('svg.walletconnect-qrcode__image');
14
- if (svg && qrcodeContainer) {
45
+ if (!qrcodeContainer) {
46
+ return;
47
+ }
48
+ // **** android single connect button replacement
49
+ if ((_b = (_a = qrcodeContainer === null || qrcodeContainer === void 0 ? void 0 : qrcodeContainer.classList) === null || _a === void 0 ? void 0 : _a.contains) === null || _b === void 0 ? void 0 : _b.call(_a, 'walletconnect-connect__buttons__wrapper__android')) {
50
+ const btn = qrcodeContainer.querySelector('.walletconnect-connect__button');
51
+ if (!btn) {
52
+ return;
53
+ }
54
+ if (btn.dataset['isOneKeyReplaced']) {
55
+ return;
56
+ }
57
+ btn.dataset['isOneKeyReplaced'] = 'true';
58
+ btn.innerText = `${btn.innerText} ${text}`;
59
+ btn.style.backgroundColor = onekeyBtnBg;
60
+ setOnClickToConnectWallet({
61
+ element: btn,
62
+ uri: btn.href,
63
+ });
64
+ }
65
+ // **** deeplink buttons replacement
66
+ else if ((_d = (_c = qrcodeContainer === null || qrcodeContainer === void 0 ? void 0 : qrcodeContainer.classList) === null || _c === void 0 ? void 0 : _c.contains) === null || _d === void 0 ? void 0 : _d.call(_c, 'walletconnect-search__input')) {
67
+ const shouldHideOtherWallets = isDesktop || isNative;
68
+ const inputEle = qrcodeContainer;
69
+ const parent = headerText.parentNode;
70
+ if (!parent) {
71
+ return;
72
+ }
73
+ const iconsContainer = parent.querySelector('.walletconnect-connect__buttons__wrapper__wrap');
74
+ const firstItem = iconsContainer === null || iconsContainer === void 0 ? void 0 : iconsContainer.querySelector('.walletconnect-connect__button__icon_anchor');
75
+ if (!firstItem || !iconsContainer) {
76
+ return;
77
+ }
78
+ const newItemAdded = parent.querySelector('.isOneKeyReplaced.walletconnect-connect__button__icon_anchor');
79
+ if (newItemAdded) {
80
+ return;
81
+ }
82
+ const img = firstItem.querySelector('.walletconnect-connect__button__icon');
83
+ if (!img) {
84
+ return;
85
+ }
86
+ const span = firstItem.querySelector('.walletconnect-connect__button__text');
87
+ if (!span) {
88
+ return;
89
+ }
90
+ const uri = new URL(firstItem === null || firstItem === void 0 ? void 0 : firstItem.href).searchParams.get('uri');
91
+ if (uri && uri.startsWith('wc:')) {
92
+ const newItem = firstItem.cloneNode(true);
93
+ const newItemImg = newItem.querySelector('.walletconnect-connect__button__icon');
94
+ const newItemSpan = newItem.querySelector('.walletconnect-connect__button__text');
95
+ if (newItemSpan) {
96
+ newItemSpan.innerText = text;
97
+ }
98
+ if (newItemImg) {
99
+ newItemImg.style.backgroundImage = `url(${icon || ''})`;
100
+ newItemImg.style.backgroundColor = onekeyBtnBg;
101
+ }
102
+ newItem.classList.add('isOneKeyReplaced');
103
+ // TODO use universal link
104
+ newItem.href = `onekey-wallet:///wc?uri=${encodeURIComponent(uri)}`;
105
+ if (shouldHideOtherWallets) {
106
+ setOnClickToConnectWallet({
107
+ element: newItem,
108
+ uri,
109
+ });
110
+ }
111
+ // hide all other wallets
112
+ if (shouldHideOtherWallets) {
113
+ for (const item of Array.from((iconsContainer === null || iconsContainer === void 0 ? void 0 : iconsContainer.children) || [])) {
114
+ const itemEl = item;
115
+ if (itemEl && itemEl.style) {
116
+ itemEl.style.display = 'none';
117
+ }
118
+ }
119
+ iconsContainer.style.display = 'flex';
120
+ iconsContainer.style.justifyContent = 'center';
121
+ iconsContainer.style.alignItems = 'center';
122
+ }
123
+ iconsContainer.style.minHeight = '150px';
124
+ iconsContainer.prepend(newItem);
125
+ // remove input and footer pagination
126
+ if (shouldHideOtherWallets) {
127
+ inputEle.remove();
128
+ const footerContainer = (_e = iconsContainer === null || iconsContainer === void 0 ? void 0 : iconsContainer.parentNode) === null || _e === void 0 ? void 0 : _e.querySelector('.walletconnect-modal__footer');
129
+ footerContainer === null || footerContainer === void 0 ? void 0 : footerContainer.remove();
130
+ }
131
+ }
132
+ }
133
+ // **** qrcode replacement
134
+ else {
135
+ const svg = qrcodeContainer === null || qrcodeContainer === void 0 ? void 0 : qrcodeContainer.querySelector('svg.walletconnect-qrcode__image');
136
+ if (!svg) {
137
+ return;
138
+ }
139
+ if (qrcodeContainer.dataset['isOneKeyReplaced']) {
140
+ return;
141
+ }
142
+ // starting hack
143
+ qrcodeContainer.dataset['isOneKeyReplaced'] = 'true';
15
144
  qrcodeContainer.style.position = 'relative';
16
145
  qrcodeContainer.style.display = 'flex';
146
+ qrcodeContainer.style.flexDirection = 'column';
17
147
  qrcodeContainer.style.alignItems = 'center';
18
148
  qrcodeContainer.style.justifyContent = 'center';
19
149
  (0, hackConnectButton_1.createNewImageToContainer)({
@@ -32,6 +162,34 @@ const consts_1 = require("../consts");
32
162
  // img.style.transform = 'translate(-50%, -50%)';
33
163
  },
34
164
  });
165
+ const footerContainer = qrcodeContainer.nextElementSibling;
166
+ if (!footerContainer) {
167
+ return;
168
+ }
169
+ footerContainer.style.flexDirection = 'column';
170
+ // @ts-ignore
171
+ if (typeof window.BarcodeDetector !== 'undefined') {
172
+ (0, hackConnectButton_1.createWalletConnectToButton)({
173
+ container: footerContainer,
174
+ onCreated(btn) {
175
+ btn.style.marginTop = '16px';
176
+ btn.style.alignSelf = 'center';
177
+ btn.onclick = () => __awaiter(this, void 0, void 0, function* () {
178
+ var _a;
179
+ const uri = yield (0, hackConnectButton_1.detectQrcodeFromSvg)({ img: svg });
180
+ if (btn.dataset['isClicked']) {
181
+ return;
182
+ }
183
+ btn.dataset['isClicked'] = 'true';
184
+ btn.style.backgroundColor = '#bbb';
185
+ void ((_a = onekeyHub === null || onekeyHub === void 0 ? void 0 : onekeyHub.$private) === null || _a === void 0 ? void 0 : _a.request({
186
+ method: 'wallet_connectToWalletConnect',
187
+ params: { uri },
188
+ }));
189
+ });
190
+ },
191
+ });
192
+ }
35
193
  }
36
194
  };
37
195
  replaceFunc({
package/dist/connectButtonHack/hackConnectButton.d.ts CHANGED
@@ -1,10 +1,19 @@
1
1
  import { ThrottleSettings } from 'lodash';
2
2
  import { IInjectedProviderNames } from '@onekeyfe/cross-inpage-provider-types';
3
- export declare function createNewImageToContainer({ container, icon, removeSvg, onCreated, }: {
3
+ export declare function detectQrcodeFromSvg({ img, }: {
4
+ img: HTMLImageElement | Element;
5
+ }): Promise<string>;
6
+ export declare function createWalletConnectToButton({ container, onCreated, }: {
7
+ container: HTMLElement;
8
+ onCreated?: (btn: HTMLElement) => void;
9
+ }): void;
10
+ export declare function createNewImageToContainer({ container, icon, removeSvg, onCreated, width, height, }: {
4
11
  container: HTMLElement;
5
12
  icon: string;
6
13
  removeSvg: boolean;
7
14
  onCreated?: (img: HTMLImageElement) => void;
15
+ width?: string;
16
+ height?: string;
8
17
  }): void;
9
18
  declare function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOptions, throttleDelay, throttleSettings, callbackDelay, }: {
10
19
  urls: string[];
package/dist/connectButtonHack/hackConnectButton.js CHANGED
@@ -1,3 +1,12 @@
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
1
10
  import { throttle } from 'lodash';
2
11
  import { IInjectedProviderNames } from '@onekeyfe/cross-inpage-provider-types';
3
12
  function checkIfWalletConnected({ providerName }) {
@@ -14,20 +23,86 @@ function checkIfWalletConnected({ providerName }) {
14
23
  }
15
24
  return false;
16
25
  }
17
- export function createNewImageToContainer({ container, icon, removeSvg = true, onCreated, }) {
26
+ export function detectQrcodeFromSvg({ img, }) {
27
+ return __awaiter(this, void 0, void 0, function* () {
28
+ // https://unpkg.com/qr-scanner@1.4.1/qr-scanner.umd.min.js
29
+ // @ts-ignore
30
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-call
31
+ const barcodeDetector = new BarcodeDetector({ formats: ['qr_code'] });
32
+ const serialized = new XMLSerializer().serializeToString(img);
33
+ const encodedData = window.btoa(serialized);
34
+ const base64 = `data:image/svg+xml;base64,${encodedData}`;
35
+ return new Promise((resolve, reject) => {
36
+ const imgTemp = document.createElement('img');
37
+ imgTemp.src = base64;
38
+ imgTemp.style.width = '100px';
39
+ imgTemp.style.height = '100px';
40
+ imgTemp.onload = () => {
41
+ barcodeDetector
42
+ .detect(imgTemp)
43
+ .then((result) => {
44
+ var _a;
45
+ resolve((_a = result === null || result === void 0 ? void 0 : result[0]) === null || _a === void 0 ? void 0 : _a.rawValue);
46
+ })
47
+ .catch(reject)
48
+ .finally(() => {
49
+ imgTemp.remove();
50
+ });
51
+ };
52
+ document.body.appendChild(imgTemp);
53
+ });
54
+ // const res = await fetch(base64);
55
+ // const blob = await res.blob();
56
+ // const result = await barcodeDetector.detect(blob);
57
+ // return result?.[0]?.rawValue;
58
+ });
59
+ }
60
+ export function createWalletConnectToButton({ container, onCreated, }) {
61
+ const datasetKey = 'onekey_auto_created_wallet_connect_btn'; // can not include `-`
62
+ if (!container.querySelector(`[data-${datasetKey}]`)) {
63
+ const btn = document.createElement('div');
64
+ btn.dataset[datasetKey] = 'true';
65
+ btn.style.cssText = `
66
+ border-radius: 12px;
67
+ padding-top: 8px;
68
+ padding-bottom: 8px;
69
+ padding-left: 16px;
70
+ padding-right: 16px;
71
+ background-color: #00B812;
72
+ color: white;
73
+ font-size: 14px;
74
+ line-height: 20px;
75
+ font-weight: 500;
76
+ cursor: pointer;
77
+ `;
78
+ // i18n key:
79
+ // action__connect_onekey_extension
80
+ // action__connect_onekey
81
+ btn.innerHTML = 'Connect OneKey';
82
+ onCreated === null || onCreated === void 0 ? void 0 : onCreated(btn);
83
+ container.append(btn);
84
+ }
85
+ }
86
+ export function createNewImageToContainer({ container, icon, removeSvg = true, onCreated, width, height, }) {
18
87
  if (removeSvg) {
19
88
  const svg = container.querySelector('svg');
20
89
  if (svg) {
21
90
  svg.remove();
22
91
  }
23
92
  }
24
- const datasetKey = 'onekey_auto_created'; // can not include `-`
93
+ const datasetKey = 'onekey_auto_created_icon_img'; // can not include `-`
25
94
  if (!container.querySelector(`[data-${datasetKey}]`)) {
26
95
  const newImg = document.createElement('img');
27
96
  newImg.src = icon;
28
97
  newImg.dataset[datasetKey] = 'true';
29
98
  newImg.style.maxHeight = '100%';
30
99
  newImg.style.maxWidth = '100%';
100
+ if (width) {
101
+ newImg.style.width = width;
102
+ }
103
+ if (height) {
104
+ newImg.style.height = height;
105
+ }
31
106
  onCreated === null || onCreated === void 0 ? void 0 : onCreated(newImg);
32
107
  container.prepend(newImg);
33
108
  }
@@ -43,6 +118,10 @@ function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOpt
43
118
  }, callbackDelay = 10, }) {
44
119
  const isUrlMatched = () => Boolean(urls.includes(window.location.hostname) || urls.includes('*'));
45
120
  const run = () => {
121
+ // ignore web site run in iframe
122
+ if (window.top !== window) {
123
+ return;
124
+ }
46
125
  if (!isUrlMatched()) {
47
126
  return;
48
127
  }
@@ -61,7 +140,7 @@ function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOpt
61
140
  return;
62
141
  }
63
142
  if (process.env.NODE_ENV !== 'production') {
64
- console.log('mutation triggered: hackConnectButton');
143
+ console.log('mutation triggered: hackConnectButton (DEV only log)');
65
144
  }
66
145
  try {
67
146
  (_a = observer === null || observer === void 0 ? void 0 : observer.disconnect) === null || _a === void 0 ? void 0 : _a.call(observer);
@@ -69,7 +148,7 @@ function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOpt
69
148
  }
70
149
  catch (error) {
71
150
  if (process.env.NODE_ENV !== 'production') {
72
- console.error('hackConnectButton mutation ERROR:', error);
151
+ console.error('hackConnectButton mutation ERROR (DEV only log): ', error);
73
152
  }
74
153
  }
75
154
  finally {
@@ -82,15 +161,25 @@ function hackConnectButton({ urls, replaceMethod, providers, mutationObserverOpt
82
161
  // Start observing the target node for configured mutations
83
162
  observer.observe(targetNode, config);
84
163
  };
164
+ let isRun = false;
165
+ const runOnce = () => {
166
+ if (isRun) {
167
+ return;
168
+ }
169
+ isRun = true;
170
+ setTimeout(() => {
171
+ run();
172
+ }, 1000);
173
+ };
85
174
  if (document.readyState === 'complete' ||
86
175
  // @ts-ignore
87
176
  document.readyState === 'loaded' ||
88
177
  document.readyState === 'interactive') {
89
- run();
178
+ runOnce();
90
179
  }
91
180
  else {
92
181
  window.addEventListener('DOMContentLoaded', function () {
93
- run();
182
+ runOnce();
94
183
  }, false);
95
184
  }
96
185
  }
package/dist/connectButtonHack/hackConnectButtonTest.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { ThrottleSettings } from 'lodash';
2
+ declare function hackConnectButton(): ThrottleSettings;
3
+ export { hackConnectButton };
package/dist/connectButtonHack/hackConnectButtonTest.js ADDED
@@ -0,0 +1,6 @@
1
+ import { throttle } from 'lodash'; // cause jira crash
2
+ function hackConnectButton() {
3
+ console.log('throttle >>>>> ', throttle);
4
+ return { leading: false, trailing: true };
5
+ }
6
+ export { hackConnectButton };
package/dist/connectButtonHack/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import './sites/opensea';
2
1
  import './sites/walletconnect';
2
+ import './sites/opensea';
3
3
  import './sites/magiceden';
4
4
  import './sites/gem';
5
5
  import './sites/rarible';
@@ -15,3 +15,4 @@ import './sites/yearn';
15
15
  import './sites/zapper';
16
16
  import './sites/zerion';
17
17
  import './sites/aave';
18
+ import './sites/pancake';
package/dist/connectButtonHack/index.js CHANGED
@@ -1,5 +1,6 @@
1
- import './sites/opensea';
2
1
  import './sites/walletconnect';
2
+ // ---------
3
+ import './sites/opensea';
3
4
  import './sites/magiceden';
4
5
  import './sites/gem';
5
6
  import './sites/rarible';
@@ -15,3 +16,5 @@ import './sites/yearn';
15
16
  import './sites/zapper';
16
17
  import './sites/zerion';
17
18
  import './sites/aave';
19
+ import './sites/pancake';
20
+ // TODO list ----------------------------------------------
package/dist/connectButtonHack/sites/pancake.d.ts ADDED
@@ -0,0 +1 @@
1
+ export {};
package/dist/connectButtonHack/sites/pancake.js ADDED
@@ -0,0 +1,38 @@
1
+ import { createNewImageToContainer, hackConnectButton } from '../hackConnectButton';
2
+ import { IInjectedProviderNames } from '@onekeyfe/cross-inpage-provider-types';
3
+ import { WALLET_CONNECT_INFO } from '../consts';
4
+ hackConnectButton({
5
+ urls: ['pancakeswap.finance', 'app.pancakeswap.finance', 'www.pancakeswap.finance'],
6
+ providers: [IInjectedProviderNames.ethereum],
7
+ replaceMethod() {
8
+ const replaceFunc = ({ findName, icon, text, }) => {
9
+ const btn = document.getElementById('wallet-connect-metamask');
10
+ if (!btn) {
11
+ return;
12
+ }
13
+ const svg = btn.querySelector('svg');
14
+ if (!svg) {
15
+ return;
16
+ }
17
+ const span = btn.querySelector('div');
18
+ if (span && span.innerText.includes(findName)) {
19
+ span.innerText = text;
20
+ createNewImageToContainer({
21
+ container: btn,
22
+ removeSvg: true,
23
+ icon,
24
+ width: '40px',
25
+ height: '40px',
26
+ onCreated(img) {
27
+ img.style.marginBottom = '8px';
28
+ },
29
+ });
30
+ }
31
+ };
32
+ replaceFunc({
33
+ findName: 'Metamask',
34
+ icon: WALLET_CONNECT_INFO.metamask.icon,
35
+ text: WALLET_CONNECT_INFO.metamask.text,
36
+ });
37
+ },
38
+ });
package/dist/connectButtonHack/sites/walletconnect.js CHANGED
@@ -1,17 +1,147 @@
1
- import { createNewImageToContainer, hackConnectButton } from '../hackConnectButton';
1
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
2
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
3
+ return new (P || (P = Promise))(function (resolve, reject) {
4
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
5
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
6
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
7
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
8
+ });
9
+ };
10
+ import { createNewImageToContainer, createWalletConnectToButton, detectQrcodeFromSvg, hackConnectButton, } from '../hackConnectButton';
2
11
  import { IInjectedProviderNames } from '@onekeyfe/cross-inpage-provider-types';
3
12
  import { WALLET_CONNECT_INFO } from '../consts';
13
+ const onekeyBtnBg = 'rgb(0, 184, 18)';
14
+ function setOnClickToConnectWallet({ element, uri }) {
15
+ element.onclick = (e) => {
16
+ var _a, _b;
17
+ e.preventDefault();
18
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-call,@typescript-eslint/no-unsafe-member-access
19
+ void ((_b = (_a = window.$onekey) === null || _a === void 0 ? void 0 : _a.$private) === null || _b === void 0 ? void 0 : _b.request({
20
+ method: 'wallet_connectToWalletConnect',
21
+ params: { uri },
22
+ }));
23
+ return false;
24
+ };
25
+ }
4
26
  hackConnectButton({
5
27
  urls: ['*'],
6
28
  providers: [IInjectedProviderNames.ethereum],
7
29
  replaceMethod() {
30
+ // $onekey.$walletInfo.platformEnv.isExtension
31
+ const onekeyHub = window.$onekey;
32
+ if (!onekeyHub || !onekeyHub.$walletInfo || !onekeyHub.$private) {
33
+ return;
34
+ }
35
+ const { isExtension, isDesktop, isNative } = onekeyHub.$walletInfo.platformEnv;
8
36
  const replaceFunc = ({ findName, icon, text, }) => {
37
+ var _a, _b, _c, _d, _e;
9
38
  const headerText = document.getElementById('walletconnect-qrcode-text');
39
+ if (!headerText) {
40
+ return;
41
+ }
10
42
  const qrcodeContainer = headerText === null || headerText === void 0 ? void 0 : headerText.nextSibling;
11
- const svg = qrcodeContainer === null || qrcodeContainer === void 0 ? void 0 : qrcodeContainer.querySelector('svg.walletconnect-qrcode__image');
12
- if (svg && qrcodeContainer) {
43
+ if (!qrcodeContainer) {
44
+ return;
45
+ }
46
+ // **** android single connect button replacement
47
+ if ((_b = (_a = qrcodeContainer === null || qrcodeContainer === void 0 ? void 0 : qrcodeContainer.classList) === null || _a === void 0 ? void 0 : _a.contains) === null || _b === void 0 ? void 0 : _b.call(_a, 'walletconnect-connect__buttons__wrapper__android')) {
48
+ const btn = qrcodeContainer.querySelector('.walletconnect-connect__button');
49
+ if (!btn) {
50
+ return;
51
+ }
52
+ if (btn.dataset['isOneKeyReplaced']) {
53
+ return;
54
+ }
55
+ btn.dataset['isOneKeyReplaced'] = 'true';
56
+ btn.innerText = `${btn.innerText} ${text}`;
57
+ btn.style.backgroundColor = onekeyBtnBg;
58
+ setOnClickToConnectWallet({
59
+ element: btn,
60
+ uri: btn.href,
61
+ });
62
+ }
63
+ // **** deeplink buttons replacement
64
+ else if ((_d = (_c = qrcodeContainer === null || qrcodeContainer === void 0 ? void 0 : qrcodeContainer.classList) === null || _c === void 0 ? void 0 : _c.contains) === null || _d === void 0 ? void 0 : _d.call(_c, 'walletconnect-search__input')) {
65
+ const shouldHideOtherWallets = isDesktop || isNative;
66
+ const inputEle = qrcodeContainer;
67
+ const parent = headerText.parentNode;
68
+ if (!parent) {
69
+ return;
70
+ }
71
+ const iconsContainer = parent.querySelector('.walletconnect-connect__buttons__wrapper__wrap');
72
+ const firstItem = iconsContainer === null || iconsContainer === void 0 ? void 0 : iconsContainer.querySelector('.walletconnect-connect__button__icon_anchor');
73
+ if (!firstItem || !iconsContainer) {
74
+ return;
75
+ }
76
+ const newItemAdded = parent.querySelector('.isOneKeyReplaced.walletconnect-connect__button__icon_anchor');
77
+ if (newItemAdded) {
78
+ return;
79
+ }
80
+ const img = firstItem.querySelector('.walletconnect-connect__button__icon');
81
+ if (!img) {
82
+ return;
83
+ }
84
+ const span = firstItem.querySelector('.walletconnect-connect__button__text');
85
+ if (!span) {
86
+ return;
87
+ }
88
+ const uri = new URL(firstItem === null || firstItem === void 0 ? void 0 : firstItem.href).searchParams.get('uri');
89
+ if (uri && uri.startsWith('wc:')) {
90
+ const newItem = firstItem.cloneNode(true);
91
+ const newItemImg = newItem.querySelector('.walletconnect-connect__button__icon');
92
+ const newItemSpan = newItem.querySelector('.walletconnect-connect__button__text');
93
+ if (newItemSpan) {
94
+ newItemSpan.innerText = text;
95
+ }
96
+ if (newItemImg) {
97
+ newItemImg.style.backgroundImage = `url(${icon || ''})`;
98
+ newItemImg.style.backgroundColor = onekeyBtnBg;
99
+ }
100
+ newItem.classList.add('isOneKeyReplaced');
101
+ // TODO use universal link
102
+ newItem.href = `onekey-wallet:///wc?uri=${encodeURIComponent(uri)}`;
103
+ if (shouldHideOtherWallets) {
104
+ setOnClickToConnectWallet({
105
+ element: newItem,
106
+ uri,
107
+ });
108
+ }
109
+ // hide all other wallets
110
+ if (shouldHideOtherWallets) {
111
+ for (const item of Array.from((iconsContainer === null || iconsContainer === void 0 ? void 0 : iconsContainer.children) || [])) {
112
+ const itemEl = item;
113
+ if (itemEl && itemEl.style) {
114
+ itemEl.style.display = 'none';
115
+ }
116
+ }
117
+ iconsContainer.style.display = 'flex';
118
+ iconsContainer.style.justifyContent = 'center';
119
+ iconsContainer.style.alignItems = 'center';
120
+ }
121
+ iconsContainer.style.minHeight = '150px';
122
+ iconsContainer.prepend(newItem);
123
+ // remove input and footer pagination
124
+ if (shouldHideOtherWallets) {
125
+ inputEle.remove();
126
+ const footerContainer = (_e = iconsContainer === null || iconsContainer === void 0 ? void 0 : iconsContainer.parentNode) === null || _e === void 0 ? void 0 : _e.querySelector('.walletconnect-modal__footer');
127
+ footerContainer === null || footerContainer === void 0 ? void 0 : footerContainer.remove();
128
+ }
129
+ }
130
+ }
131
+ // **** qrcode replacement
132
+ else {
133
+ const svg = qrcodeContainer === null || qrcodeContainer === void 0 ? void 0 : qrcodeContainer.querySelector('svg.walletconnect-qrcode__image');
134
+ if (!svg) {
135
+ return;
136
+ }
137
+ if (qrcodeContainer.dataset['isOneKeyReplaced']) {
138
+ return;
139
+ }
140
+ // starting hack
141
+ qrcodeContainer.dataset['isOneKeyReplaced'] = 'true';
13
142
  qrcodeContainer.style.position = 'relative';
14
143
  qrcodeContainer.style.display = 'flex';
144
+ qrcodeContainer.style.flexDirection = 'column';
15
145
  qrcodeContainer.style.alignItems = 'center';
16
146
  qrcodeContainer.style.justifyContent = 'center';
17
147
  createNewImageToContainer({
@@ -30,6 +160,34 @@ hackConnectButton({
30
160
  // img.style.transform = 'translate(-50%, -50%)';
31
161
  },
32
162
  });
163
+ const footerContainer = qrcodeContainer.nextElementSibling;
164
+ if (!footerContainer) {
165
+ return;
166
+ }
167
+ footerContainer.style.flexDirection = 'column';
168
+ // @ts-ignore
169
+ if (typeof window.BarcodeDetector !== 'undefined') {
170
+ createWalletConnectToButton({
171
+ container: footerContainer,
172
+ onCreated(btn) {
173
+ btn.style.marginTop = '16px';
174
+ btn.style.alignSelf = 'center';
175
+ btn.onclick = () => __awaiter(this, void 0, void 0, function* () {
176
+ var _a;
177
+ const uri = yield detectQrcodeFromSvg({ img: svg });
178
+ if (btn.dataset['isClicked']) {
179
+ return;
180
+ }
181
+ btn.dataset['isClicked'] = 'true';
182
+ btn.style.backgroundColor = '#bbb';
183
+ void ((_a = onekeyHub === null || onekeyHub === void 0 ? void 0 : onekeyHub.$private) === null || _a === void 0 ? void 0 : _a.request({
184
+ method: 'wallet_connectToWalletConnect',
185
+ params: { uri },
186
+ }));
187
+ });
188
+ },
189
+ });
190
+ }
33
191
  }
34
192
  };
35
193
  replaceFunc({
package/dist/injectWeb3Provider.d.ts CHANGED
@@ -4,7 +4,7 @@ import { ProviderPrivate } from '@onekeyfe/onekey-private-provider';
4
4
  import { ProviderSolana } from '@onekeyfe/onekey-solana-provider';
5
5
  import { ProviderAptos, ProviderAptosMartian } from '@onekeyfe/onekey-aptos-provider';
6
6
  import './connectButtonHack';
7
- export declare type WindowOneKeyHub = {
7
+ export declare type IWindowOneKeyHub = {
8
8
  debugLogger?: any;
9
9
  jsBridge?: JsBridgeBase;
10
10
  ethereum?: ProviderEthereum;
@@ -16,6 +16,17 @@ export declare type WindowOneKeyHub = {
16
16
  aptos?: ProviderAptos;
17
17
  martian?: ProviderAptosMartian;
18
18
  $private?: ProviderPrivate;
19
+ $walletInfo?: {
20
+ buildNumber: string;
21
+ isLegacy: boolean;
22
+ platform: string;
23
+ version: string;
24
+ platformEnv: {
25
+ isExtension: boolean;
26
+ isDesktop: boolean;
27
+ isNative: boolean;
28
+ };
29
+ };
19
30
  };
20
31
  declare function injectWeb3Provider(): unknown;
21
32
  export { injectWeb3Provider };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@onekeyfe/inpage-providers-hub",
3
- "version": "1.0.5",
3
+ "version": "1.0.7",
4
4
  "keywords": [
5
5
  "cross-inpage-provider"
6
6
  ],
@@ -28,14 +28,14 @@
28
28
  "start": "tsc --watch"
29
29
  },
30
30
  "dependencies": {
31
- "@onekeyfe/cross-inpage-provider-core": "1.0.5",
32
- "@onekeyfe/cross-inpage-provider-types": "1.0.5",
33
- "@onekeyfe/onekey-aptos-provider": "1.0.5",
34
- "@onekeyfe/onekey-eth-provider": "1.0.5",
35
- "@onekeyfe/onekey-private-provider": "1.0.5",
36
- "@onekeyfe/onekey-solana-provider": "1.0.5",
37
- "@onekeyfe/onekey-starcoin-provider": "1.0.5",
31
+ "@onekeyfe/cross-inpage-provider-core": "1.0.7",
32
+ "@onekeyfe/cross-inpage-provider-types": "1.0.7",
33
+ "@onekeyfe/onekey-aptos-provider": "1.0.7",
34
+ "@onekeyfe/onekey-eth-provider": "1.0.7",
35
+ "@onekeyfe/onekey-private-provider": "1.0.7",
36
+ "@onekeyfe/onekey-solana-provider": "1.0.7",
37
+ "@onekeyfe/onekey-starcoin-provider": "1.0.7",
38
38
  "web3": "^1.7.3"
39
39
  },
40
- "gitHead": "1d0fdfded1ef34e5ba6c283d24ef455a5da8b423"
40
+ "gitHead": "c712a3c8e4a53095e9cf2406b3801ae673a67e00"
41
41
  }