Update and rename UIComponentsstart.md to index.md

main/.vitepress/config.mjs

@@ -161,7 +161,7 @@ export default defineConfig({
 
             {
               text: 'UI Component Library',
-              link: '/guides/UIComponentLibrary/UIComponentsstart',
+              link: '/guides/UIComponentLibrary/',
             },
             {
               text: 'Building Client Dapps',

main/.vitepress/themeConfig/nav.js

@@ -18,7 +18,7 @@ export const nav = [
       },
       {
         text: 'UI Component Library',
-        link: '/guides/UIComponentLibrary/UIComponentsstart',
+        link: '/guides/UIComponentLibrary/',
       },
       {
         text: 'Building Client Dapps',

main/guides/UIComponentLibrary/UIComponentsstart.md → main/guides/UIComponentLibrary/index.md

@@ -1,5 +1,6 @@
+# Welcome To Agoric's UI Component Library
 
-You'll find a collection of ready-to-use or pre-coded user interface elements that help accelerate your Agoric Dapp-building. These pre-designed elements include wallet connect buttons, chain selector, node selector, amount input and wallet provisioning.
+You'll find a collection of ready-to-use or pre-coded user interface elements that help accelerate your Agoric Dapp-building. These pre-designed elements include wallet connect buttons, chain selector, node selector, amount input, smart wallet provisioning and leap elements.
 Utilization of these building blocks ensures best practices in design and accessibility.
 
 ## Installation and Setup
@@ -14,13 +15,14 @@ yarn add @agoric/react-components
 
 ## UI Components List
 
-Before getting started, there are some resources you might want to keep handy in case you get stuck, have questions, or are curious about any of the components. Getting in contact with us is easy!
+These React UI components can be immediately used to streamline your Agoric Dapp UI
 
 - Connect Wallet
 - Wallet Provisioning
 - Amount Input
 - Chain Selector
 - Node Selector
+- Leap Elements
 
 ## Connect Wallet
 
@@ -38,19 +40,21 @@ Before getting started, there are some resources you might want to keep handy in
 
 - [Connecting with Wallet Connect Button](https://github.com/Agoric/ui-kit/tree/main/packages/react-components#integrating)
 - [Connecting without Wallet Connect Button](https://github.com/Agoric/ui-kit/tree/main/packages/react-components#connecting-without-connectwalletbutton) 
-- [Using a Custom Chain Provider](https://github.com/Agoric/ui-kit/tree/main/packages/react-components#connecting-without-connectwalletbutton)
+- [Using a Custom Chain Provider](https://github.com/Agoric/ui-kit/tree/main/packages/react-components#using-a-custom-chainprovider)
 
 Customizable Parameters
 | Parameter | Type | Description |
 |----------|----------|----------|
 | ClassName   | string   | CSS class name for the underlying `<button>` element   |
 
-## Wallet Provisioning
+## Smart Wallet Provisioning
 
 <img style="border: 2px solid grey"
   alt="Screenshot: Wallet provision"
   src="./assets/walletprovision.png" />
 
+- [Smart Wallet Provisioning](https://github.com/Agoric/ui-kit/tree/main/packages/react-components#smart-wallet-provisioning)
+
 See `AgoricProviderLite` component  -> `provisionNoticeContent` prop:  
 
 Customizable Parameters
@@ -64,6 +68,8 @@ Customizable Parameters
   alt="Screenshot: Amount Input"
   src="./assets/amountinput.png" />
 
+- [Amount Input](https://github.com/Agoric/ui-kit/tree/main/packages/react-components#amount-inputs)
+
 Customizable Parameters
 | Parameter | Type | Description |
 |----------|----------|----------|
@@ -107,3 +113,11 @@ Customizable Parameters
 |----------|----------|----------|
 | isOpen   | boolean | undefined   | Whether or not the modal is open   |
 | onClose   | () => void   | Triggered when the user tries to close the modal   |
+
+## Leap Elements
+
+<img style="border: 2px solid grey"
+  alt="Screenshot: node selector"
+  src="./assets/leapelements.png" />
+
+- [Leap Elements](https://github.com/Agoric/ui-kit/tree/main/packages/react-components#leap-elements)