{"_id":"@aiternate/solana-wallet-adapter-light","_rev":"6-953a11d6f960f82a8de58401c6de0138","name":"@aiternate/solana-wallet-adapter-light","dist-tags":{"latest":"1.3.1"},"versions":{"1.0.1":{"name":"@aiternate/solana-wallet-adapter-light","version":"1.0.1","description":"Solana wallet adapter to allow your application to easily connect the user","main":"index.js","scripts":{"test":"echo \"Error: no test specified\" && exit 1"},"keywords":["solana","wallet","adapter","wallet-adapter","walletadapter"],"author":{"name":"Olivier Haberzettel","email":"olivier.haberzettel@hotmail.fr","url":"https://www.aiternate.com/"},"license":"ISC","repository":{"type":"git","url":"git+https://github.com/Olive-fr/solana-wallet-adapter-light.git"},"bugs":{"url":"https://github.com/Olive-fr/solana-wallet-adapter-light/issues"},"homepage":"https://github.com/Olive-fr/solana-wallet-adapter-light#readme","_id":"@aiternate/solana-wallet-adapter-light@1.0.1","gitHead":"97697ae66901183c76f74b4c417788a8af38b166","_nodeVersion":"21.4.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-Vl0378U5dUK/Jj4fy19dC/32t3nuFbbU33YStCBz+Gt3vjebZ4ogGrGA6+LD/DD7i8iYJOc1JDdLklEdTIeH5g==","shasum":"202312a7da683c8b7317f1d9335cb01e593f2d7f","tarball":"https://registry.npmjs.org/@aiternate/solana-wallet-adapter-light/-/solana-wallet-adapter-light-1.0.1.tgz","fileCount":11,"unpackedSize":2171,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDk4G41qGfger7w30V33Qz201/wiLuuXJtbwueQV4NVogIhAJyrkbSahsdi0MaoH+ipccQ7N8rzqlogpol6DHSP2pMJ"}]},"_npmUser":{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"},"directories":{},"maintainers":[{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/solana-wallet-adapter-light_1.0.1_1705597761649_0.8727966238976896"},"_hasShrinkwrap":false},"1.1.0":{"name":"@aiternate/solana-wallet-adapter-light","version":"1.1.0","description":"Solana wallet adapter to allow your application to easily connect the user","main":"dist/index.js","types":"dist/index.d.ts","scripts":{"prepublish":"npm run build","build":"tsc","test":"echo \"Error: no test specified\" && exit 1","publish":"npm publish --access public"},"keywords":["solana","wallet","adapter","wallet-adapter","walletadapter"],"author":{"name":"Olivier Haberzettel","email":"olivier.haberzettel@hotmail.fr","url":"https://www.aiternate.com/"},"license":"ISC","repository":{"type":"git","url":"git+https://github.com/Olive-fr/solana-wallet-adapter-light.git"},"bugs":{"url":"https://github.com/Olive-fr/solana-wallet-adapter-light/issues"},"homepage":"https://github.com/Olive-fr/solana-wallet-adapter-light#readme","dependencies":{"@solana/wallet-adapter-base":"^0.9.23","@solana/wallet-standard-wallet-adapter-base":"^1.1.2","@wallet-standard/core":"^1.0.3"},"devDependencies":{"typescript":"^5.3.3"},"_id":"@aiternate/solana-wallet-adapter-light@1.1.0","gitHead":"63eb40b5908f9b70b6b599f4afcde35cddb889a5","_nodeVersion":"21.4.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-+QSFk+Aa86TDXu9D4bV/tgQQ1+KOgDTWSeqG0EETpvPBLG9Y0nf4U0mPGyOnmq4MTzfkIlN6FBzBMNSc67VyRw==","shasum":"b509da24f4c34919a044ec06925e9279aea2ba00","tarball":"https://registry.npmjs.org/@aiternate/solana-wallet-adapter-light/-/solana-wallet-adapter-light-1.1.0.tgz","fileCount":57,"unpackedSize":203333,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIDUwJgtKS7hUkpj+i7rt7n/5773/n35fVLK93ErP1m1lAiB3+8J6ePs0zqFamCeG6SX3fn3exZJR0x71WfWZxwQ66g=="}]},"_npmUser":{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"},"directories":{},"maintainers":[{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/solana-wallet-adapter-light_1.1.0_1705626987992_0.3670880416390474"},"_hasShrinkwrap":false},"1.1.1":{"name":"@aiternate/solana-wallet-adapter-light","version":"1.1.1","description":"Solana wallet adapter to allow your application to easily connect the user","main":"dist/index.js","types":"dist/index.d.ts","scripts":{"prepublish":"npm run build","build":"tsc","test":"echo \"Error: no test specified\" && exit 1","publish":"npm publish --access public"},"keywords":["solana","wallet","adapter","wallet-adapter","walletadapter"],"author":{"name":"Olivier Haberzettel","email":"olivier.haberzettel@hotmail.fr","url":"https://www.aiternate.com/"},"license":"ISC","repository":{"type":"git","url":"git+https://github.com/Olive-fr/solana-wallet-adapter-light.git"},"bugs":{"url":"https://github.com/Olive-fr/solana-wallet-adapter-light/issues"},"homepage":"https://github.com/Olive-fr/solana-wallet-adapter-light#readme","dependencies":{"@solana/wallet-adapter-base":"^0.9.23","@solana/wallet-standard-wallet-adapter-base":"^1.1.2","@wallet-standard/core":"^1.0.3"},"devDependencies":{"typescript":"^5.3.3"},"_id":"@aiternate/solana-wallet-adapter-light@1.1.1","gitHead":"2230edaa8c02b4a083cb9a5afab131b75f495e01","_nodeVersion":"21.4.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-QmU5dd5P+T9e4u9xWUN+tgaz0m919batWj9Gq0Qm5qHYPpEi9j2aJiRnzZYqVlKUcnLn4wQv+P0brHvjQU2xWg==","shasum":"36a8da50289dd411c001d9706d6a7034b8442410","tarball":"https://registry.npmjs.org/@aiternate/solana-wallet-adapter-light/-/solana-wallet-adapter-light-1.1.1.tgz","fileCount":59,"unpackedSize":208061,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAjpfRLtL1ONVk34PV7rd38LyyGMSP5Jlsp3SME82qDuAiBErpDMU8UQ9F7Hzm+hCGzBwDhKkrs47z65G+r++eAW5w=="}]},"_npmUser":{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"},"directories":{},"maintainers":[{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/solana-wallet-adapter-light_1.1.1_1705627330476_0.13754295565890384"},"_hasShrinkwrap":false},"1.1.2":{"name":"@aiternate/solana-wallet-adapter-light","version":"1.1.2","description":"Solana wallet adapter to allow your application to easily connect the user","main":"dist/index.js","types":"dist/index.d.ts","scripts":{"prepublish":"npm run build","build":"tsc","test":"echo \"Error: no test specified\" && exit 1","publish":"npm publish --access public"},"keywords":["solana","wallet","adapter","wallet-adapter","walletadapter"],"author":{"name":"Olivier Haberzettel","email":"olivier.haberzettel@hotmail.fr","url":"https://www.aiternate.com/"},"license":"ISC","repository":{"type":"git","url":"git+https://github.com/Olive-fr/solana-wallet-adapter-light.git"},"bugs":{"url":"https://github.com/Olive-fr/solana-wallet-adapter-light/issues"},"homepage":"https://github.com/Olive-fr/solana-wallet-adapter-light#readme","dependencies":{"@solana/wallet-adapter-base":"^0.9.23","@solana/wallet-standard-wallet-adapter-base":"^1.1.2","@wallet-standard/core":"^1.0.3"},"devDependencies":{"typescript":"^5.3.3"},"_id":"@aiternate/solana-wallet-adapter-light@1.1.2","gitHead":"35304f7ba53f7ffea82dd045d229a49523c2a0b9","_nodeVersion":"21.4.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-7TTEcD+cGfkN4UdoO7TtX0BkLHP/ift4UYyn1JqEl0qiTw5owc4Kk0c51wFMxwtbVVXOnaJzu6qvsh/ZFV3DYA==","shasum":"8956161ba843da054274b55da71081897f45ed77","tarball":"https://registry.npmjs.org/@aiternate/solana-wallet-adapter-light/-/solana-wallet-adapter-light-1.1.2.tgz","fileCount":61,"unpackedSize":233502,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIE7J0qAGjjxmAecTpcF8aqmwgdkq148GjEHK82vjdm4jAiBomcwkTOyNTpr43C4YOEoJmH4k5HiUzaxNVEPq0g18Kg=="}]},"_npmUser":{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"},"directories":{},"maintainers":[{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/solana-wallet-adapter-light_1.1.2_1705628261560_0.7432776340738854"},"_hasShrinkwrap":false},"1.2.0":{"name":"@aiternate/solana-wallet-adapter-light","version":"1.2.0","description":"Solana wallet adapter to allow your application to easily connect the user","main":"dist/index.js","types":"dist/index.d.ts","scripts":{"prepublish":"npm run build","build":"tsc","test":"echo \"Error: no test specified\" && exit 1"},"keywords":["solana","wallet","adapter","wallet-adapter","walletadapter"],"author":{"name":"Olivier Haberzettel","email":"olivier.haberzettel@hotmail.fr","url":"https://www.aiternate.com/"},"license":"ISC","repository":{"type":"git","url":"git+https://github.com/Olive-fr/solana-wallet-adapter-light.git"},"bugs":{"url":"https://github.com/Olive-fr/solana-wallet-adapter-light/issues"},"homepage":"https://github.com/Olive-fr/solana-wallet-adapter-light#readme","dependencies":{"@solana/wallet-adapter-base":"^0.9.23","@solana/wallet-standard-wallet-adapter-base":"^1.1.2","@wallet-standard/core":"^1.0.3"},"devDependencies":{"typescript":"^5.3.3"},"_id":"@aiternate/solana-wallet-adapter-light@1.2.0","gitHead":"2e9cfd5c9ee64c00c9aa9995b196170517c867ea","_nodeVersion":"21.4.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-8An+2JYm092iac+EI+fB0dDNG6sZoFFK38EI0WdyyFaVfOR0CYZxsT5tUyrJ6LtNjlmX8UfJLhjuV8TfNgOU2A==","shasum":"5faf1d09aa49c6519469c11bad9813d0e3ad3e53","tarball":"https://registry.npmjs.org/@aiternate/solana-wallet-adapter-light/-/solana-wallet-adapter-light-1.2.0.tgz","fileCount":63,"unpackedSize":246442,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDFxkYl0tt2h9v22+hfLw6glf/STAM7J2A21g6Cgdu1MwIgaka1VFFSkL5NIVdOeRxONK6s9hyOPa+QSK5Ly4oCW34="}]},"_npmUser":{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"},"directories":{},"maintainers":[{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/solana-wallet-adapter-light_1.2.0_1705628816810_0.14630159635047146"},"_hasShrinkwrap":false},"1.3.0":{"name":"@aiternate/solana-wallet-adapter-light","version":"1.3.0","description":"Solana wallet adapter to allow your application to easily connect the user","publishConfig":{"access":"public"},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"prepublish":"npm run build","build":"tsc","test":"echo \"Error: no test specified\" && exit 1"},"keywords":["solana","wallet","adapter","wallet-adapter","walletadapter"],"author":{"name":"Olivier Haberzettel","email":"olivier.haberzettel@hotmail.fr","url":"https://www.aiternate.com/"},"license":"ISC","repository":{"type":"git","url":"git+https://github.com/Olive-fr/solana-wallet-adapter-light.git"},"bugs":{"url":"https://github.com/Olive-fr/solana-wallet-adapter-light/issues"},"homepage":"https://github.com/Olive-fr/solana-wallet-adapter-light#readme","dependencies":{"@solana/wallet-adapter-base":"^0.9.23","@solana/wallet-standard-wallet-adapter-base":"^1.1.2","@wallet-standard/core":"^1.0.3","css-loader":"^6.9.1","style-loader":"^3.3.4"},"devDependencies":{"typescript":"^5.3.3"},"_id":"@aiternate/solana-wallet-adapter-light@1.3.0","gitHead":"ff187134dad250382cd60ff43c74b68e5bf952ba","_nodeVersion":"21.4.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-SYyUikBOMeWkYBVevJJViNMPCJ1j2lDWPA1kapon+YHbV6KrnnACIEmdsWK2Kos/gB5aHsKdIj4623F1aO7nSw==","shasum":"d98eb017606aa2f72be525bacad2348d3fb060ba","tarball":"https://registry.npmjs.org/@aiternate/solana-wallet-adapter-light/-/solana-wallet-adapter-light-1.3.0.tgz","fileCount":141,"unpackedSize":829276,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCoDyOK22xuCRjfk3llPcKUqNNv//nzLfaaUlbaaIysGAIhANG8CQodHIDKFJGQSN7EFzTczVa8W8XfdNfoy5IOm0zg"}]},"_npmUser":{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"},"directories":{},"maintainers":[{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/solana-wallet-adapter-light_1.3.0_1705704777726_0.9039170544360391"},"_hasShrinkwrap":false},"1.3.1":{"name":"@aiternate/solana-wallet-adapter-light","version":"1.3.1","description":"Solana wallet adapter to allow your application to easily connect the user","publishConfig":{"access":"public"},"main":"dist/index.js","types":"dist/index.d.ts","scripts":{"prepublish":"npm run build","build":"tsc","test":"echo \"Error: no test specified\" && exit 1"},"keywords":["solana","wallet","adapter","wallet-adapter","walletadapter"],"author":{"name":"Olivier Haberzettel","email":"olivier.haberzettel@hotmail.fr","url":"https://www.aiternate.com/"},"license":"ISC","repository":{"type":"git","url":"git+https://github.com/Olive-fr/solana-wallet-adapter-light.git"},"bugs":{"url":"https://github.com/Olive-fr/solana-wallet-adapter-light/issues"},"homepage":"https://github.com/Olive-fr/solana-wallet-adapter-light#readme","dependencies":{"@solana/wallet-adapter-base":"^0.9.23","@solana/wallet-standard-wallet-adapter-base":"^1.1.2","@wallet-standard/core":"^1.0.3","@web3auth/sign-in-with-solana":"^3.0.0","buffer":"^6.0.3","install":"^0.13.0","npm":"^10.4.0","tweetnacl-util":"^0.15.1"},"devDependencies":{"typescript":"^5.3.3"},"_id":"@aiternate/solana-wallet-adapter-light@1.3.1","gitHead":"9fd172d7a04a7023daf6c9e62a267ee1660d0df0","_nodeVersion":"21.4.0","_npmVersion":"10.2.4","dist":{"integrity":"sha512-TRLlBNmGLTeZRuA7xxlFWAJ0dv2nhaA0Zhle1iWY66m5cgmsjNIBbPbngW7BjOySWUCn3y7lc4oCP+MTlAo1eg==","shasum":"7a9aa910ce4bc3c7f5621e89a23a12b8303cae26","tarball":"https://registry.npmjs.org/@aiternate/solana-wallet-adapter-light/-/solana-wallet-adapter-light-1.3.1.tgz","fileCount":184,"unpackedSize":949007,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQCzPmU2ZwzKCNLF2zKtk1NgUw+Sx0+qLyKI4/FLvHnZ+AIhAMt3UMykSKHyRBQ7po8zc/TjVzTDRWtZ87FM1BpqUXaT"}]},"_npmUser":{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"},"directories":{},"maintainers":[{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/solana-wallet-adapter-light_1.3.1_1707129895343_0.24731382649194655"},"_hasShrinkwrap":false}},"time":{"created":"2024-01-18T17:09:21.533Z","1.0.1":"2024-01-18T17:09:21.820Z","modified":"2024-02-05T10:44:55.661Z","1.1.0":"2024-01-19T01:16:28.149Z","1.1.1":"2024-01-19T01:22:10.649Z","1.1.2":"2024-01-19T01:37:41.724Z","1.2.0":"2024-01-19T01:46:56.958Z","1.3.0":"2024-01-19T22:52:57.969Z","1.3.1":"2024-02-05T10:44:55.489Z"},"maintainers":[{"name":"darksamus1","email":"olivier.haberzettel@hotmail.fr"}],"description":"Solana wallet adapter to allow your application to easily connect the user","homepage":"https://github.com/Olive-fr/solana-wallet-adapter-light#readme","keywords":["solana","wallet","adapter","wallet-adapter","walletadapter"],"repository":{"type":"git","url":"git+https://github.com/Olive-fr/solana-wallet-adapter-light.git"},"author":{"name":"Olivier Haberzettel","email":"olivier.haberzettel@hotmail.fr","url":"https://www.aiternate.com/"},"bugs":{"url":"https://github.com/Olive-fr/solana-wallet-adapter-light/issues"},"license":"ISC","readme":"# Solana Wallet Connector\r\nSolana wallet connector for your typescript app or vanilla JS. You can change the design of the modal. \r\n\r\n\r\n[npm](https://www.npmjs.com/package/@aiternate/solana-wallet-adapter-light)\r\n\r\n![wallet menu](assets/preview.png)\r\n\r\n---\r\n\r\n## Usage:\r\n\r\n### If you use TypeScript\r\n\r\n#### Installation\r\n```batch\r\nnpm i @aiternate/solana-wallet-adapter-light\r\n```\r\n\r\n#### Usage\r\n\r\n<details>\r\n  <summary>Show code</summary>\r\n\r\n  ```typescript\r\nimport { SolanaConnectLight } from \"@aiternate/solana-wallet-adapter-light\";\r\nimport { Adapter } from \"@solana/wallet-adapter-base\";\r\n\r\nconst solConnect = new SolanaConnectLight();\r\n\r\nsolConnect.openMenu();\r\n\r\nsolConnect.onWalletChange((adapter: Adapter | null) =>\r\n  adapter\r\n    ? console.log(\"connected:\", adapter.name, adapter.publicKey.toString())\r\n    : console.log(\"disconnected\")\r\n);\r\n\r\nsolConnect.onVisibilityChange((isOpen: boolean) => {\r\n  console.log(\"menu visible:\", isOpen);\r\n});\r\n\r\nconst wallet: Adapter | null = solConnect.getWallet();\r\n  ```\r\n</details>\r\n\r\n### If you use vanilla javascript\r\nUse with [unpkg](https://www.unpkg.com/):\r\n\r\n<details>\r\n  <summary>Show code</summary>\r\n\r\n  ```html\r\n<!DOCTYPE html>\r\n<html lang=\"en\">\r\n  <head>\r\n    <script src=\"https://www.unpkg.com/@aiternate/solana-wallet-adapter-light\"></script>\r\n  </head>\r\n  <body>\r\n    <script>\r\n      const solConnect = new window.SolanaConnectLight();\r\n      solConnect.openMenu();\r\n    </script>\r\n  </body>\r\n</html>\r\n  ```\r\n</details>\r\n\r\n### Change automatic template\r\nIf you want to change the structure of the generated HTML, you must disable automatic HTML generation in the constructor of the `SolanaConnectLight`.\r\n\r\n```typescript\r\nnew SolanaConnectLight({\r\n    generateHtml: false\r\n})\r\n```\r\nThen, in your HTML page, you must add the following lines to start. *You can find this in the JSDoc of the `generateHtml` property (just hover the property in VSCode).*\r\n\r\n<details>\r\n  <summary>Show html</summary>\r\n\r\n  ```html\r\n<div id=\"swal-modal\" class=\"wallet-adapter-modal wallet-adapter-modal-fade-in \">\r\n    <div class=\"wallet-adapter-modal-container\">\r\n        <div class=\"wallet-adapter-modal-wrapper\">\r\n            <button id=\"swal-close-btn\" class=\"wallet-adapter-modal-button-close\">\r\n                <svg width=\"14\" height=\"14\">\r\n                    <path d=\"M14 12.461 8.3 6.772l5.234-5.233L12.006 0 6.772 5.234 1.54 0 0 1.539l5.234 5.233L0 12.006l1.539 1.528L6.772 8.3l5.69 5.7L14 12.461z\"></path>\r\n                </svg>\r\n            </button>\r\n            <h1 class=\"wallet-adapter-modal-title\">Connect a wallet on Solana to continue</h1>\r\n            <ul id=\"swal-adapter-list\" class=\"wallet-adapter-modal-list\">\r\n            </ul>\r\n        </div>\r\n    </div>\r\n    <div class=\"wallet-adapter-modal-overlay\"></div>\r\n</div>\r\n  ```\r\n</details>\r\n\r\nThe importants elements here are `id=\"swal-modal\"`, `id=\"swal-close-btn\"` and `id=\"swal-adapter-list\"`. You can change the structure as you want but theses ids must be used.\r\n\r\n - `id=\"swal-modal\"`: Used to Display/Hide modal\r\n - `id=\"swal-close-btn\"`: Used to bind the Hide action\r\n - `id=\"swal-adapter-list\"`: Used to append adapters\r\n\r\nTo change adapters buttons html, you need to add the `addAdapterCallback` property to the `SolanaConnectConfig` object passed through the constructor of `SolanaConnectLight`. You can see below the default implementation of this property.\r\n*You can find this in the JSDoc of the addAdapterCallback property (just hover the property in VSCode).*\r\n\r\n<details>\r\n  <summary>Show code</summary>\r\n\r\n  ```typescript\r\n    const solanaConnect = new SolanaConnectLight({\r\n        addAdapterCallback: (wl) => {\r\n            const liElement: HTMLElement = document.createElement('li');\r\n\r\n        const buttonElement = document.createElement('button');\r\n        buttonElement.classList.add('wallet-adapter-button');\r\n        buttonElement.tabIndex = 0;\r\n        buttonElement.type = 'button';\r\n\r\n        const iconElement = document.createElement('i');\r\n        iconElement.classList.add('wallet-adapter-button-start-icon');\r\n\r\n        const imgElement = document.createElement('img');\r\n        imgElement.src = wl.icon;\r\n        iconElement.appendChild(imgElement);\r\n\r\n        buttonElement.appendChild(iconElement);\r\n        buttonElement.appendChild(document.createTextNode(wl.name));\r\n        const spanElement = document.createElement('span');\r\n\r\n        if (wl.readyState == 'Installed')\r\n            spanElement.appendChild(document.createTextNode('Detected'));\r\n        buttonElement.appendChild(spanElement);\r\n\r\n        liElement.appendChild(buttonElement);\r\n\r\n        return {\r\n            elementToAppend: liElement,\r\n            elementToBindConnectAction: buttonElement\r\n        }\r\n        },\r\n    });\r\n  ```\r\n</details>\r\n\r\n### Style definition\r\nIf you want your own modal design, you must disable automatic style generation in the constructor of the `SolanaConnectLight`.\r\n```typescript\r\nnew SolanaConnectLight({\r\n    generateStyle: false\r\n})\r\n```\r\nThen, you can create your css file. It's advised to start with the following base.\r\n*You can find this in the JSDoc of the `generateStyle` property (just hover the property in VSCode).*\r\n    \r\n<details>\r\n  <summary>Show css</summary>\r\n  \r\n  ```css\r\n    @import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700&display=swap');\r\n\r\n    .wallet-adapter-button {\r\n        background-color: transparent;\r\n        border: none;\r\n        color: #fff;\r\n        cursor: pointer;\r\n        display: flex;\r\n        align-items: center;\r\n        font-family: 'DM Sans', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n        font-size: 16px;\r\n        font-weight: 600;\r\n        height: 48px;\r\n        line-height: 48px;\r\n        padding: 0 24px;\r\n        border-radius: 4px;\r\n    }\r\n\r\n    .wallet-adapter-button-trigger {\r\n        background-color: #512da8;\r\n    }\r\n\r\n    .wallet-adapter-button:not([disabled]):focus-visible {\r\n        outline-color: white;\r\n    }\r\n\r\n    .wallet-adapter-button:not([disabled]):hover {\r\n        background-color: #1a1f2e;\r\n    }\r\n\r\n    .wallet-adapter-button[disabled] {\r\n        background: #404144;\r\n        color: #999;\r\n        cursor: not-allowed;\r\n    }\r\n\r\n    .wallet-adapter-button-end-icon,\r\n    .wallet-adapter-button-start-icon,\r\n    .wallet-adapter-button-end-icon img,\r\n    .wallet-adapter-button-start-icon img {\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        width: 24px;\r\n        height: 24px;\r\n    }\r\n\r\n    .wallet-adapter-button-end-icon {\r\n        margin-left: 12px;\r\n    }\r\n\r\n    .wallet-adapter-button-start-icon {\r\n        margin-right: 12px;\r\n    }\r\n\r\n    .wallet-adapter-collapse {\r\n        width: 100%;\r\n    }\r\n\r\n    .wallet-adapter-dropdown {\r\n        position: relative;\r\n        display: inline-block;\r\n    }\r\n\r\n    .wallet-adapter-dropdown-list {\r\n        position: absolute;\r\n        z-index: 99;\r\n        display: grid;\r\n        grid-template-rows: 1fr;\r\n        grid-row-gap: 10px;\r\n        padding: 10px;\r\n        top: 100%;\r\n        right: 0;\r\n        margin: 0;\r\n        list-style: none;\r\n        background: #2c2d30;\r\n        border-radius: 10px;\r\n        box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.6);\r\n        opacity: 0;\r\n        visibility: hidden;\r\n        transition: opacity 200ms ease, transform 200ms ease, visibility 200ms;\r\n        font-family: 'DM Sans', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n    }\r\n\r\n    .wallet-adapter-dropdown-list-active {\r\n        opacity: 1;\r\n        visibility: visible;\r\n        transform: translateY(10px);\r\n    }\r\n\r\n    .wallet-adapter-dropdown-list-item {\r\n        display: flex;\r\n        flex-direction: row;\r\n        justify-content: center;\r\n        align-items: center;\r\n        border: none;\r\n        outline: none;\r\n        cursor: pointer;\r\n        white-space: nowrap;\r\n        box-sizing: border-box;\r\n        padding: 0 20px;\r\n        width: 100%;\r\n        border-radius: 6px;\r\n        font-size: 14px;\r\n        font-weight: 600;\r\n        height: 37px;\r\n        color: #fff;\r\n    }\r\n\r\n    .wallet-adapter-dropdown-list-item:not([disabled]):hover {\r\n        background-color: #1a1f2e;\r\n    }\r\n\r\n    .wallet-adapter-modal-collapse-button svg {\r\n        align-self: center;\r\n        fill: #999;\r\n    }\r\n\r\n    .wallet-adapter-modal-collapse-button.wallet-adapter-modal-collapse-button-active svg {\r\n        transform: rotate(180deg);\r\n        transition: transform ease-in 150ms;\r\n    }\r\n\r\n    .wallet-adapter-modal {\r\n        display: none;\r\n        position: fixed;\r\n        top: 0;\r\n        left: 0;\r\n        right: 0;\r\n        bottom: 0;\r\n        opacity: 0;\r\n        transition: opacity linear 150ms;\r\n        background: rgba(0, 0, 0, 0.5);\r\n        z-index: 1040;\r\n        overflow-y: auto;\r\n    }\r\n\r\n    .wallet-adapter-modal.wallet-adapter-modal-fade-in {\r\n        opacity: 1;\r\n    }\r\n\r\n    .wallet-adapter-modal-button-close {\r\n        display: flex;\r\n        align-items: center;\r\n        justify-content: center;\r\n        position: absolute;\r\n        top: 18px;\r\n        right: 18px;\r\n        padding: 12px;\r\n        cursor: pointer;\r\n        background: #1a1f2e;\r\n        border: none;\r\n        border-radius: 50%;\r\n    }\r\n\r\n    .wallet-adapter-modal-button-close:focus-visible {\r\n        outline-color: white;\r\n    }\r\n\r\n    .wallet-adapter-modal-button-close svg {\r\n        fill: #777;\r\n        transition: fill 200ms ease 0s;\r\n    }\r\n\r\n    .wallet-adapter-modal-button-close:hover svg {\r\n        fill: #fff;\r\n    }\r\n\r\n    .wallet-adapter-modal-overlay {\r\n        background: rgba(0, 0, 0, 0.5);\r\n        position: fixed;\r\n        top: 0;\r\n        left: 0;\r\n        bottom: 0;\r\n        right: 0;\r\n    }\r\n\r\n    .wallet-adapter-modal-container {\r\n        display: flex;\r\n        margin: 3rem;\r\n        min-height: calc(100vh - 6rem); /* 100vh - 2 * margin */\r\n        align-items: center;\r\n        justify-content: center;\r\n    }\r\n\r\n    @media (max-width: 480px) {\r\n        .wallet-adapter-modal-container {\r\n            margin: 1rem;\r\n            min-height: calc(100vh - 2rem); /* 100vh - 2 * margin */\r\n        }\r\n    }\r\n\r\n    .wallet-adapter-modal-wrapper {\r\n        box-sizing: border-box;\r\n        position: relative;\r\n        display: flex;\r\n        align-items: center;\r\n        flex-direction: column;\r\n        z-index: 1050;\r\n        max-width: 400px;\r\n        border-radius: 10px;\r\n        background: #10141f;\r\n        box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.6);\r\n        font-family: 'DM Sans', 'Roboto', 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n        flex: 1;\r\n    }\r\n\r\n    .wallet-adapter-modal-wrapper .wallet-adapter-button {\r\n        width: 100%;\r\n    }\r\n\r\n    .wallet-adapter-modal-title {\r\n        font-weight: 500;\r\n        font-size: 24px;\r\n        line-height: 36px;\r\n        margin: 0;\r\n        padding: 64px 48px 48px 48px;\r\n        text-align: center;\r\n        color: #fff;\r\n    }\r\n\r\n    @media (max-width: 374px) {\r\n        .wallet-adapter-modal-title {\r\n            font-size: 18px;\r\n        }\r\n    }\r\n\r\n    .wallet-adapter-modal-list {\r\n        margin: 0 0 12px 0;\r\n        padding: 0;\r\n        width: 100%;\r\n        list-style: none;\r\n    }\r\n\r\n    .wallet-adapter-modal-list .wallet-adapter-button {\r\n        font-weight: 400;\r\n        border-radius: 0;\r\n        font-size: 18px;\r\n    }\r\n\r\n    .wallet-adapter-modal-list .wallet-adapter-button-end-icon,\r\n    .wallet-adapter-modal-list .wallet-adapter-button-start-icon,\r\n    .wallet-adapter-modal-list .wallet-adapter-button-end-icon img,\r\n    .wallet-adapter-modal-list .wallet-adapter-button-start-icon img {\r\n        width: 28px;\r\n        height: 28px;\r\n    }\r\n\r\n    .wallet-adapter-modal-list .wallet-adapter-button span {\r\n        margin-left: auto;\r\n        font-size: 14px;\r\n        opacity: .6;\r\n    }\r\n\r\n    .wallet-adapter-modal-list-more {\r\n        cursor: pointer;\r\n        border: none;\r\n        padding: 12px 24px 24px 12px;\r\n        align-self: flex-end;\r\n        display: flex;\r\n        align-items: center;\r\n        background-color: transparent;\r\n        color: #fff;\r\n    }\r\n\r\n    .wallet-adapter-modal-list-more svg {\r\n        transition: all 0.1s ease;\r\n        fill: rgba(255, 255, 255, 1);\r\n        margin-left: 0.5rem;\r\n    }\r\n\r\n    .wallet-adapter-modal-list-more-icon-rotate {\r\n        transform: rotate(180deg);\r\n    }\r\n\r\n    .wallet-adapter-modal-middle {\r\n        width: 100%;\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n        padding: 0 24px 24px 24px;\r\n        box-sizing: border-box;\r\n    }\r\n\r\n    .wallet-adapter-modal-middle-button {\r\n        display: block;\r\n        cursor: pointer;\r\n        margin-top: 48px;\r\n        width: 100%;\r\n        background-color: #512da8;\r\n        padding: 12px;\r\n        font-size: 18px;\r\n        border: none;\r\n        border-radius: 8px;\r\n        color: #fff;\r\n    }\r\n  ```\r\n</details>\r\n\r\n##  Adding more adapters:\r\nBy default, only wallets that support the [Wallet Standard](https://github.com/wallet-standard/wallet-standard) will appear, but additional options can be provided.\r\n\r\n```typescript\r\nimport {\r\nSolanaMobileWalletAdapter,\r\ncreateDefaultAuthorizationResultCache,\r\ncreateDefaultAddressSelector,\r\ncreateDefaultWalletNotFoundHandler,\r\n} from \"@solana-mobile/wallet-adapter-mobile\";\r\nimport { SolflareWalletAdapter } from \"@solana/wallet-adapter-solflare\";\r\nimport { UnsafeBurnerWalletAdapter } from \"@solana/wallet-adapter-unsafe-burner\";\r\n\r\nconst solConnect = new SolanaConnectLight({\r\nadditionalAdapters: [\r\n    new SolflareWalletAdapter(),\r\n    new UnsafeBurnerWalletAdapter(),\r\n    new SolanaMobileWalletAdapter({\r\n    addressSelector: createDefaultAddressSelector(),\r\n    appIdentity: {\r\n        name: \"Supercorp\",\r\n        uri: \"https://supercorp.app/\",\r\n        icon: \"icon.png\",\r\n    },\r\n    authorizationResultCache: createDefaultAuthorizationResultCache(),\r\n    cluster: \"mainnet-beta\",\r\n    onWalletNotFound: createDefaultWalletNotFoundHandler(),\r\n    }),\r\n],\r\n});\r\n```","readmeFilename":"README.md"}