From eb4a140f933a1c572bea4e2d99760b1338fbe526 Mon Sep 17 00:00:00 2001
From: Adam Carpenter <adamcarpenter86@gmail.com>
Date: Mon, 28 Nov 2022 16:12:58 -0700
Subject: [PATCH 1/2] Add conatinerEl docs and update quickstart to remove
 deprecated chains and add new hot chains

---
 docs/src/routes/docs/[...4]packages/core.md | 49 ++++++++++++++-------
 1 file changed, 34 insertions(+), 15 deletions(-)

diff --git a/docs/src/routes/docs/[...4]packages/core.md b/docs/src/routes/docs/[...4]packages/core.md
index b7c0f7991..46d5e110b 100644
--- a/docs/src/routes/docs/[...4]packages/core.md
+++ b/docs/src/routes/docs/[...4]packages/core.md
@@ -63,6 +63,11 @@ type InitOptions {
   accountCenter?: AccountCenterOptions
   apiKey?: string
   notify?: Partial<NotifyOptions>
+  gas?: typeof gas
+  /**
+   * Object mapping for W3O components with the key being the component and the value the DOM element to mount the component to. This element must be available at time of package script execution.
+   */
+  containerElements?: Partial<ContainerElements>
 }
 ```
 
@@ -147,6 +152,20 @@ export type AccountCenterOptions = {
 type AccountCenterPosition = 'topRight' | 'bottomRight' | 'bottomLeft' | 'topLeft'
 ```
 
+**`containerElements`**
+An object mapping for W3O components with the key being the DOM element to mount the specified component to.
+This defines the DOM container element for svelte to attach the component.
+
+**NOTE**: containerElement must be a DOM element with a styleSheet property attached and the element must be available on the DOM at the time of component mounting. 
+For an example please see containerElement usage [here](https://github.com/blocknative/web3-onboard/blob/8531a73d69365f7d584320f1c4b97a5d90f1c34e/packages/demo/src/App.svelte#L227)
+
+```typescript
+type ContainerElements = {
+  // when using the accountCenter with a container el the accountCenter position properties are ignored
+  accountCenter?: string
+}
+```
+
 **`notify`**
 Notify provides by default transaction notifications for all connected wallets on the current blockchain. When switching chains the previous chain listeners remain active for 60 seconds to allow capture and report of an remaining transactions that may be in flight.
 By default transaction notifications are captured if a DAppID is provided in the Onboard config along with the Account Center being enabled.
@@ -252,19 +271,13 @@ const onboard = Onboard({
       id: '0x1',
       token: 'ETH',
       label: 'Ethereum Mainnet',
-      rpcUrl: 'https://mainnet.infura.io/v3/{INFURA_ID}'
-    },
-    {
-      id: '0x3',
-      token: 'tROP',
-      label: 'Ethereum Ropsten Testnet',
-      rpcUrl: 'https://ropsten.infura.io/v3/{INFURA_ID}'
+      rpcUrl: `https://mainnet.infura.io/v3/${INFURA_ID}`
     },
     {
-      id: '0x4',
-      token: 'rETH',
-      label: 'Ethereum Rinkeby Testnet',
-      rpcUrl: 'https://rinkeby.infura.io/v3/{INFURA_ID}'
+      id: '0x5',
+      token: 'ETH',
+      label: 'Goerli',
+      rpcUrl: `https://goerli.infura.io/v3/${INFURA_ID}`
     },
     {
       id: '0x38',
@@ -279,10 +292,16 @@ const onboard = Onboard({
       rpcUrl: 'https://matic-mainnet.chainstacklabs.com'
     },
     {
-      id: '0xfa',
-      token: 'FTM',
-      label: 'Fantom Mainnet',
-      rpcUrl: 'https://rpc.ftm.tools/'
+      id: 10,
+      token: 'OETH',
+      label: 'Optimism',
+      rpcUrl: 'https://mainnet.optimism.io'
+    },
+    {
+      id: 42161,
+      token: 'ARB-ETH',
+      label: 'Arbitrum',
+      rpcUrl: 'https://rpc.ankr.com/arbitrum'
     }
   ],
   appMetadata: {

From 8c7539e5d8174ed174fe6bebb3076bd72c61d36b Mon Sep 17 00:00:00 2001
From: Adam Carpenter <adamcarpenter86@gmail.com>
Date: Mon, 28 Nov 2022 16:16:18 -0700
Subject: [PATCH 2/2] Mark AC containerEl props as deprecated

---
 docs/src/routes/docs/[...4]packages/core.md | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/docs/src/routes/docs/[...4]packages/core.md b/docs/src/routes/docs/[...4]packages/core.md
index 46d5e110b..53366ac83 100644
--- a/docs/src/routes/docs/[...4]packages/core.md
+++ b/docs/src/routes/docs/[...4]packages/core.md
@@ -141,6 +141,11 @@ export type AccountCenter = {
   position?: AccountCenterPosition // default: 'topRight'
   expanded?: boolean // default: true
   minimal?: boolean // enabled by default for mobile
+
+  /**
+   * @deprecated Use top level containerElements property
+   * with the accountCenter prop set to the desired container El. See documentation below
+   */
   containerElement?: string // defines the DOM container element for svelte to attach
 }