Adds Particle Network (Wallet-as-a-Service) (blocknative#1962)

* Add files via upload * Update README.md * Create +page.md * Update package.json * Rename +page.md to +page.md * Update apple.ts * Demo addition * Update packages/demo/package.json Co-authored-by: Kat Leight <[email protected]> * Update packages/particle-network/package.json Co-authored-by: Kat Leight <[email protected]> * Fixes * Correction * Update index.ts * Update index.ts * Update index.ts * Update index.ts * Small type fix and format * async fix --------- Co-authored-by: Kat Leight <[email protected]>
Koniverse · Feb 20, 2024 · 2e51cfe · 2e51cfe
1 parent df16fc4
commit 2e51cfe
Show file tree

Hide file tree

Showing 21 changed files with 711 additions and 1 deletion.
diff --git a/README.md b/README.md
@@ -125,6 +125,7 @@ For full documentation, check out the README.md for each package or the [docs pa
 - [Infinity Wallet](packages/infinity-wallet/README.md)
 - [Frame](packages/frame/README.md)
 - [Blocto](packages/blocto/README.md)
+- [Particle Network](packages/particle-network/README.md)
 
 **Hardware Wallets**
 

diff --git a/docs/package.json b/docs/package.json
@@ -88,6 +88,7 @@
     "@web3-onboard/web3auth": "^2.2.3",
     "@web3-onboard/xdefi": "^2.0.4",
     "@web3-onboard/zeal": "^2.0.4",
+    "@web3-onboard/particle-network": "^2.2.3",
     "animejs": "^3.2.1",
     "bnc-sdk": "^4.6.6",
     "ethers": "^5.7.0",

diff --git a/docs/src/routes/docs/[...4]wallets/[...33]particlenetwork/+page.md b/docs/src/routes/docs/[...4]wallets/[...33]particlenetwork/+page.md
@@ -0,0 +1,94 @@
+---
+title: Particle Network
+---
+
+# {$frontmatter.title}
+
+Wallet module for connecting Particle Network to web3-onboard
+
+## Install
+
+<Tabs values={['yarn', 'npm']}>
+<TabPanel value="yarn">
+
+```sh copy
+yarn add @web3-onboard/particle-network
+```
+
+  </TabPanel>
+  <TabPanel value="npm">
+
+```sh copy
+npm install @web3-onboard/particle-network
+```
+
+  </TabPanel>
+</Tabs>
+
+## Options
+
+See the [Particle Network Docs](https://docs.particle.network/developers/auth-service/sdks/web) for the extensive list of options.
+
+## Usage
+
+```typescript
+import Onboard from '@web3-onboard/core'
+import particleModule from '@web3-onboard/particle-network'
+
+const particle = particleModule({
+  projectId: 'YOUR PROJECT ID',
+  clientKey: 'YOUR CLIENT KEY',
+  appId: 'YOUR APP ID'
+  // Can also add wallet object + preferredAuthType for further customization
+})
+
+const onboard = Onboard({
+  // ... other Onboard options
+  wallets: [
+    particle
+    //... other wallets
+  ]
+})
+
+const connectedWallets = await onboard.connectWallet()
+console.log(connectedWallets)
+```
+
+## Types
+
+```typescript
+/**
+ * Enumerates the supported authentication types.
+ */
+type AuthTypes = 'email' | 'phone' | 'google' | 'apple' | 'twitter' | 'facebook' | 'microsoft' | 'linkedin' | 'github' | 'twitch' | 'discord';
+
+/**
+ * Interface that describes the preferred authentication type.
+ * @property {AuthTypes} type - The preferred type of authentication.
+ * @property {boolean} setAsDisplay - Indicates whether the type should be displayed within the UI.
+ */
+interface PreferredAuthType {
+  type: AuthTypes;
+  setAsDisplay: boolean;
+}
+
+/**
+ * Options for initializing the Particle Auth module.
+ * @property {string} projectId - Particle Network project ID.
+ * @property {string} clientKey - Particle Network client key.
+ * @property {string} appId - Particle Network application ID.
+ * @property {string} [chainName] - (Optional) Specifies the name of the blockchain. Handled automatically if left blank.
+ * @property {number} [chainId] - (Optional) Specifies the blockchain's numeric ID. Handled automatically if left blank.
+ * @property {object} [wallet] - (Optional) Configuration for the wallet.
+ * @property {AuthTypes | PreferredAuthType} [preferredAuthType] - (Optional) Specifies the preferred type of authentication.
+ */
+interface ParticleAuthModuleOptions {
+  projectId: string;
+  clientKey: string;
+  appId: string;
+  chainName?: string;
+  chainId?: number;
+  wallet?: object;
+  preferredAuthType?: AuthTypes | PreferredAuthType;
+}
+```
diff --git a/packages/demo/package.json b/packages/demo/package.json
@@ -63,6 +63,7 @@
     "@web3-onboard/web3auth": "^2.2.2",
     "@web3-onboard/xdefi": "^2.0.5",
     "@web3-onboard/zeal": "^2.0.3",
+    "@web3-onboard/particle-network": "^2.0.0-alpha.1",
     "vconsole": "^3.15.1"
   },
   "license": "MIT",

diff --git a/packages/demo/src/App.svelte b/packages/demo/src/App.svelte
@@ -34,6 +34,7 @@
   import arcanaAuthModule from '@web3-onboard/arcana-auth'
   import venlyModule from '@web3-onboard/venly'
   import bitgetModule from '@web3-onboard/bitget'
+  import particleAuthModule from '@web3-onboard/particle-network'
   import capsuleModule, { Environment } from '@web3-onboard/capsule'
   import {
     recoverAddress,
@@ -195,6 +196,12 @@
     // for more info see the @web3-onboard/magic docs
   })
 
+  const particle = particleAuthModule({
+    projectId: 'b385ccf0-73c3-485a-9941-159b7855b806',
+    clientKey: 'cSTLqhvONB5j588Wz6E5WJLMPrHeUlGbymf1DFhO',
+    appId: 'b1f0239a-edb0-41f9-b0f5-ab780bb02a9e'
+  })
+
   const dcent = dcentModule()
   const bitget = bitgetModule()
   const frameWallet = frameModule()
@@ -247,7 +254,8 @@
       cedeStore,
       arcanaAuth,
       blocto,
-      venly
+      venly,
+      particle
     ],
     // transactionPreview,
     gas,

diff --git a/packages/particle-network/README.md b/packages/particle-network/README.md
@@ -0,0 +1,75 @@
+# @web3-onboard/particle-network
+
+## Wallet module for connecting Particle Network to web3-onboard
+
+### Install
+
+`npm i @web3-onboard/core @web3-onboard/particle-network`
+
+## Options
+
+See the [Particle Network Docs](https://docs.particle.network/developers/auth-service/sdks/web) for the extensive list of options.
+
+## Usage
+
+```typescript
+import Onboard from '@web3-onboard/core'
+import particleModule from '@web3-onboard/particle-network'
+
+const particle = particleModule({
+  projectId: 'YOUR PROJECT ID',
+  clientKey: 'YOUR CLIENT KEY',
+  appId: 'YOUR APP ID'
+  // Can also add wallet object + preferredAuthType for further customization
+})
+
+const onboard = Onboard({
+  // ... other Onboard options
+  wallets: [
+    particle
+    //... other wallets
+  ]
+})
+
+const connectedWallets = await onboard.connectWallet()
+console.log(connectedWallets)
+```
+
+## Types
+
+```typescript
+/**
+ * Enumerates the supported authentication types.
+ */
+type AuthTypes = 'email' | 'phone' | 'google' | 'apple' | 'twitter' | 'facebook' | 'microsoft' | 'linkedin' | 'github' | 'twitch' | 'discord';
+
+/**
+ * Interface that describes the preferred authentication type.
+ * @property {AuthTypes} type - The preferred type of authentication.
+ * @property {boolean} setAsDisplay - Indicates whether the type should be displayed within the UI.
+ */
+interface PreferredAuthType {
+  type: AuthTypes;
+  setAsDisplay: boolean;
+}
+
+/**
+ * Options for initializing the Particle Auth module.
+ * @property {string} projectId - Particle Network project ID.
+ * @property {string} clientKey - Particle Network client key.
+ * @property {string} appId - Particle Network application ID.
+ * @property {string} [chainName] - (Optional) Specifies the name of the blockchain. Handled automatically if left blank.
+ * @property {number} [chainId] - (Optional) Specifies the blockchain's numeric ID. Handled automatically if left blank.
+ * @property {object} [wallet] - (Optional) Configuration for the wallet.
+ * @property {AuthTypes | PreferredAuthType} [preferredAuthType] - (Optional) Specifies the preferred type of authentication.
+ */
+interface ParticleAuthModuleOptions {
+  projectId: string;
+  clientKey: string;
+  appId: string;
+  chainName?: string;
+  chainId?: number;
+  wallet?: object;
+  preferredAuthType?: AuthTypes | PreferredAuthType;
+}
+```
diff --git a/packages/particle-network/package.json b/packages/particle-network/package.json
@@ -0,0 +1,68 @@
+{
+  "name": "@web3-onboard/particle-network",
+  "version": "2.0.0-alpha.1",
+  "description": "Particle Network SDK wallet module for connecting to Web3-Onboard. Web3-Onboard makes it simple to connect Ethereum hardware and software wallets to your dapp. Features standardised spec compliant web3 providers for all supported wallets, framework agnostic modern javascript UI with code splitting, CSS customization, multi-chain and multi-account support, reactive wallet state subscriptions and real-time transaction state change notifications.",
+  "keywords": [
+    "Ethereum",
+    "Web3",
+    "EVM",
+    "dapp",
+    "Multichain",
+    "Wallet",
+    "Transaction",
+    "Provider",
+    "Hardware Wallet",
+    "Notifications",
+    "React",
+    "Svelte",
+    "Vue",
+    "Next",
+    "Nuxt",
+    "MetaMask",
+    "Coinbase",
+    "WalletConnect",
+    "Ledger",
+    "Trezor",
+    "Connect Wallet",
+    "Ethereum Hooks",
+    "Blocknative",
+    "Mempool",
+    "pending",
+    "confirmed",
+    "Injected Wallet"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/blocknative/web3-onboard.git",
+    "directory": "packages/particle-network"
+  },
+  "homepage": "https://onboard.blocknative.com",
+  "bugs": "https://github.com/blocknative/web3-onboard/issues",
+  "module": "dist/index.js",
+  "browser": "dist/index.js",
+  "main": "dist/index.js",
+  "type": "module",
+  "typings": "dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "scripts": {
+    "build": "tsc",
+    "dev": "tsc -w",
+    "type-check": "tsc --noEmit"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "react": "^18.2.0",
+    "typescript": "^4.5.5"
+  },
+  "dependencies": {
+    "@web3-onboard/common": "^2.3.3",
+    "@particle-network/auth": "^1.2.1",
+    "@particle-network/provider": "^1.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "peerDependencies": {
+    "react": ">=18.2"
+  }
+}
diff --git a/packages/particle-network/src/apple.svg.ts b/packages/particle-network/src/apple.svg.ts
@@ -0,0 +1,7 @@
+export default `
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200px" height="246px" viewBox="0 0 200 245" version="1.1">
+  <g id="surface1">
+    <path style=" stroke:none;fill-rule:nonzero;fill:rgb(0%,0%,0%);fill-opacity:1;" d="M 193.636719 83.519531 C 192.210938 84.621094 167.050781 98.757812 167.050781 130.191406 C 167.050781 166.550781 199.066406 179.414062 200.023438 179.730469 C 199.878906 180.515625 194.9375 197.347656 183.144531 214.496094 C 172.628906 229.589844 161.644531 244.65625 144.9375 244.65625 C 128.230469 244.65625 123.929688 234.980469 104.644531 234.980469 C 85.847656 234.980469 79.164062 244.976562 63.882812 244.976562 C 48.597656 244.976562 37.9375 231.011719 25.675781 213.859375 C 11.472656 193.722656 0 162.433594 0 132.742188 C 0 85.113281 31.054688 59.851562 61.621094 59.851562 C 77.863281 59.851562 91.402344 70.488281 101.597656 70.488281 C 111.300781 70.488281 126.4375 59.214844 144.914062 59.214844 C 151.917969 59.214844 177.074219 59.851562 193.636719 83.519531 Z M 136.140625 39.054688 C 143.785156 30.011719 149.1875 17.46875 149.1875 4.925781 C 149.1875 3.183594 149.042969 1.421875 148.722656 0 C 136.289062 0.464844 121.5 8.257812 112.578125 18.570312 C 105.578125 26.507812 99.042969 39.054688 99.042969 51.769531 C 99.042969 53.679688 99.359375 55.589844 99.507812 56.203125 C 100.292969 56.351562 101.574219 56.523438 102.851562 56.523438 C 114.003906 56.523438 128.035156 49.074219 136.140625 39.054688 Z M 136.140625 39.054688 " />
+  </g>
+</svg>
+`
diff --git a/packages/particle-network/src/discord.svg.ts b/packages/particle-network/src/discord.svg.ts
@@ -0,0 +1,7 @@
+export default `
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="200px" height="152px" viewBox="0 0 200 152" version="1.1">
+  <g id="surface1">
+    <path style=" stroke:none;fill-rule:nonzero;fill:rgb(34.509804%,39.607843%,94.901961%);fill-opacity:1;" d="M 72.375 0.324219 C 72.789062 0.9375 72.789062 0.9375 73.203125 1.738281 C 73.351562 2.03125 73.503906 2.324219 73.660156 2.625 C 73.816406 2.933594 73.972656 3.238281 74.132812 3.558594 C 74.363281 4.003906 74.363281 4.003906 74.597656 4.460938 C 77.222656 9.566406 77.222656 9.566406 77.222656 10.671875 C 77.40625 10.644531 77.589844 10.621094 77.78125 10.59375 C 91.480469 8.691406 105.375 8.40625 119.113281 10.152344 C 120.34375 10.308594 121.535156 10.359375 122.777344 10.347656 C 122.890625 10.117188 123 9.882812 123.113281 9.644531 C 123.621094 8.578125 124.128906 7.511719 124.636719 6.449219 C 124.8125 6.082031 124.984375 5.714844 125.164062 5.335938 C 126.03125 3.515625 126.914062 1.730469 127.949219 0 C 141.242188 1.972656 154.246094 5.9375 166.558594 11.304688 C 167.335938 11.644531 167.335938 11.644531 168.03125 11.851562 C 169.953125 12.484375 170.695312 13.960938 171.6875 15.605469 C 171.871094 15.894531 172.054688 16.1875 172.242188 16.488281 C 172.777344 17.347656 173.304688 18.214844 173.828125 19.082031 C 174.089844 19.503906 174.347656 19.925781 174.609375 20.347656 C 175.203125 21.316406 175.78125 22.296875 176.355469 23.277344 C 176.625 23.738281 176.894531 24.195312 177.164062 24.652344 C 188.265625 43.449219 195.585938 64.207031 198.648438 85.824219 C 198.695312 86.160156 198.695312 86.160156 198.746094 86.5 C 199.757812 93.648438 200.109375 100.835938 200.085938 108.050781 C 200.082031 109.171875 200.085938 110.289062 200.089844 111.40625 C 200.09375 115.167969 200.007812 118.925781 199.785156 122.679688 C 199.769531 123.03125 199.753906 123.382812 199.738281 123.742188 C 199.546875 126.441406 199.546875 126.441406 198.5 127.605469 C 197.183594 128.671875 197.183594 128.671875 196.40625 129.039062 C 195.28125 129.605469 194.261719 130.261719 193.222656 130.96875 C 180.523438 139.515625 166.675781 146.015625 152.242188 151.007812 C 151.921875 151.121094 151.605469 151.234375 151.277344 151.351562 C 150.988281 151.449219 150.695312 151.546875 150.398438 151.644531 C 150.148438 151.730469 149.898438 151.816406 149.640625 151.902344 C 148.734375 152.03125 148.402344 151.878906 147.65625 151.351562 C 147.09375 150.664062 147.09375 150.664062 146.527344 149.808594 C 146.3125 149.492188 146.101562 149.175781 145.886719 148.847656 C 145.664062 148.507812 145.441406 148.167969 145.214844 147.816406 C 144.984375 147.46875 144.757812 147.121094 144.519531 146.761719 C 142.671875 143.929688 140.929688 141.039062 139.289062 138.078125 C 139.050781 137.65625 138.804688 137.234375 138.550781 136.820312 C 137.882812 135.71875 137.640625 135.214844 137.640625 133.890625 C 138.011719 133.75 138.378906 133.613281 138.757812 133.472656 C 143.207031 131.769531 147.425781 129.703125 151.652344 127.515625 C 152.460938 127.117188 153.277344 126.773438 154.121094 126.449219 C 152.609375 124.871094 152.609375 124.871094 150.886719 123.539062 C 149.671875 123.648438 148.644531 124.113281 147.539062 124.613281 C 132.691406 131.304688 116.523438 134.367188 100.304688 134.3125 C 99.917969 134.3125 99.53125 134.3125 99.132812 134.3125 C 93.601562 134.296875 88.175781 134.195312 82.714844 133.242188 C 82.136719 133.144531 82.136719 133.144531 81.546875 133.046875 C 71.371094 131.324219 60.910156 128.820312 51.648438 124.140625 C 50.714844 123.691406 50.222656 123.507812 49.199219 123.753906 C 48.542969 124.140625 47.996094 124.519531 47.433594 125.035156 C 46.527344 125.804688 46.527344 125.804688 45.878906 125.804688 C 45.878906 126.019531 45.878906 126.230469 45.878906 126.449219 C 46.253906 126.554688 46.253906 126.554688 46.636719 126.660156 C 48.246094 127.257812 49.703125 128.078125 51.210938 128.898438 C 54.132812 130.460938 57.085938 131.804688 60.179688 132.996094 C 60.460938 133.105469 60.742188 133.214844 61.035156 133.324219 C 61.28125 133.417969 61.53125 133.511719 61.789062 133.609375 C 62.359375 133.890625 62.359375 133.890625 62.683594 134.535156 C 62.429688 135.160156 62.429688 135.160156 62.011719 135.929688 C 61.859375 136.214844 61.703125 136.5 61.542969 136.792969 C 61.375 137.101562 61.203125 137.410156 61.027344 137.730469 C 60.851562 138.046875 60.675781 138.363281 60.496094 138.691406 C 58.6875 141.933594 56.695312 145.050781 54.605469 148.121094 C 54.464844 148.324219 54.328125 148.527344 54.183594 148.738281 C 52.222656 151.609375 52.222656 151.609375 51.050781 152 C 50.140625 151.773438 50.140625 151.773438 49.023438 151.390625 C 48.820312 151.320312 48.617188 151.253906 48.410156 151.179688 C 47.738281 150.953125 47.074219 150.71875 46.40625 150.484375 C 46.175781 150.402344 45.945312 150.324219 45.707031 150.242188 C 32.503906 145.628906 19.992188 139.582031 8.3125 131.871094 C 7.410156 131.289062 6.496094 130.738281 5.570312 130.191406 C 1.039062 127.410156 1.039062 127.410156 0.433594 125.554688 C 0.285156 124.449219 0.28125 123.441406 0.3125 122.328125 C 0.328125 121.136719 0.246094 119.949219 0.167969 118.761719 C -0.015625 115.523438 -0.0664062 112.292969 -0.0625 109.046875 C -0.0585938 108.761719 -0.0585938 108.476562 -0.0585938 108.179688 C -0.0117188 82.277344 6.207031 57.375 17.769531 34.28125 C 17.9375 33.949219 18.101562 33.617188 18.269531 33.277344 C 20.878906 28.070312 23.75 23.058594 26.816406 18.109375 C 27.058594 17.714844 27.058594 17.714844 27.304688 17.3125 C 27.722656 16.632812 28.144531 15.957031 28.574219 15.28125 C 28.800781 14.921875 29.027344 14.5625 29.257812 14.195312 C 31.25 11.832031 34.230469 10.90625 37.035156 9.804688 C 37.246094 9.71875 37.457031 9.636719 37.675781 9.550781 C 47.230469 5.769531 57.035156 2.835938 67.105469 0.789062 C 67.730469 0.660156 67.730469 0.660156 68.367188 0.53125 C 68.75 0.453125 69.136719 0.378906 69.53125 0.300781 C 69.871094 0.234375 70.210938 0.167969 70.558594 0.101562 C 71.40625 0 71.40625 0 72.375 0.324219 Z M 56.542969 67.269531 C 56.203125 67.507812 55.863281 67.75 55.511719 67.996094 C 51.277344 72.140625 49.019531 77.726562 48.949219 83.621094 C 49.019531 89.117188 51.148438 94.324219 54.925781 98.316406 C 58.359375 101.519531 62.253906 103.382812 67 103.519531 C 71.871094 103.28125 76.1875 101.300781 79.535156 97.738281 C 83.703125 92.707031 85.183594 86.9375 84.652344 80.527344 C 83.953125 75.269531 81.488281 70.6875 77.421875 67.269531 C 70.863281 62.375 63.082031 62.53125 56.542969 67.269531 Z M 120.308594 69.578125 C 117.453125 73.046875 115.636719 77.320312 115.347656 81.820312 C 115.332031 82.078125 115.3125 82.335938 115.296875 82.597656 C 115.109375 87.964844 116.8125 93.152344 120.355469 97.203125 C 120.832031 97.6875 121.316406 98.167969 121.808594 98.636719 C 122.011719 98.847656 122.210938 99.054688 122.421875 99.269531 C 125.324219 102.082031 129.238281 103.433594 133.226562 103.507812 C 138.316406 103.328125 142.570312 101.121094 146.058594 97.457031 C 150.453125 92.144531 151.214844 86.519531 150.886719 79.878906 C 150.316406 74.996094 147.671875 70.835938 144.101562 67.589844 C 136.4375 61.671875 126.949219 62.601562 120.308594 69.578125 Z M 120.308594 69.578125 " />
+  </g>
+</svg>
+`
diff --git a/packages/particle-network/src/email.svg.ts b/packages/particle-network/src/email.svg.ts
@@ -0,0 +1,6 @@
+export default `
+<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512" version="1.1">
+  <path d="" stroke="none" fill="#080404" fill-rule="evenodd" />
+  <path d="M 30.072 82.088 C 27.636 82.566, 25.295 83.305, 24.868 83.732 C 24.154 84.446, 208.788 259.413, 221.766 270.319 C 232.134 279.034, 242.842 283, 256 283 C 269.158 283, 279.866 279.034, 290.234 270.319 C 302.801 259.758, 487.858 84.458, 487.168 83.768 C 486.762 83.362, 484.022 82.573, 481.078 82.015 C 474.391 80.747, 36.548 80.817, 30.072 82.088 M 1.094 109.250 C 0.225 112.418, 0.001 150.413, 0.214 258.500 L 0.500 403.500 3 408.187 L 5.500 412.875 95.642 345.687 C 145.220 308.734, 185.795 278.050, 185.808 277.500 C 185.835 276.396, 4.203 105, 3.006 105 C 2.596 105, 1.735 106.912, 1.094 109.250 M 416.874 191.064 C 366.618 238.400, 325.661 277.437, 325.858 277.814 C 326.055 278.191, 366.780 308.734, 416.358 345.687 L 506.500 412.875 509 408.187 L 511.500 403.500 511.786 258.500 C 512.068 115.500, 511.877 105, 508.994 105 C 508.583 105, 467.129 143.729, 416.874 191.064 M 112.861 359.609 C 63.712 396.244, 23.364 426.577, 23.198 427.015 C 23.032 427.452, 24.607 428.416, 26.698 429.155 C 29.839 430.266, 69.687 430.500, 256 430.500 C 442.313 430.500, 482.161 430.266, 485.302 429.155 C 487.393 428.416, 488.968 427.453, 488.802 427.016 C 488.535 426.315, 316.971 298.033, 311.228 294.241 C 309.096 292.833, 308.593 292.996, 303.042 296.889 C 295.559 302.138, 284.379 307.437, 276 309.707 C 267.024 312.138, 245.066 312.152, 236 309.733 C 228.179 307.645, 212.918 300.306, 207.583 296.066 C 205.461 294.380, 203.387 293, 202.973 293 C 202.560 293, 162.009 322.974, 112.861 359.609" stroke="none" fill="#040404" fill-rule="evenodd" />
+</svg>
+`
diff --git a/packages/particle-network/src/facebook.svg.ts b/packages/particle-network/src/facebook.svg.ts
@@ -0,0 +1,6 @@
+export default `
+<svg xmlns="http://www.w3.org/2000/svg" width="512" height="512" viewBox="0 0 512 512" version="1.1">
+  <path d="" stroke="none" fill="#1c7ce4" fill-rule="evenodd" />
+  <path d="M 274.810 17.043 C 242.899 20.764, 213.878 43.585, 201.931 74.352 C 196.641 87.975, 196 95.089, 196 140.131 L 196 181 166 181 L 136 181 136 218.500 L 136 256 166 256 L 196 256 196 376 L 196 496 241 496 L 286 496 286 376.015 L 286 256.029 316.041 255.765 L 346.082 255.500 360.927 218.250 L 375.773 181 330.825 181 L 285.878 181 286.189 147.750 C 286.482 116.413, 286.621 114.238, 288.606 109.949 C 291.560 103.565, 296.458 98.326, 302.410 95.186 C 307.342 92.584, 308.099 92.490, 326.750 92.174 L 346 91.847 346 53.924 L 346 16 313.750 16.131 C 296.012 16.204, 278.490 16.614, 274.810 17.043" stroke="none" fill="#1c84e4" fill-rule="evenodd" />
+</svg>
+`