update prop names

coinbase · Aug 9, 2024 · b08825e · b08825e
1 parent 83e8da3
commit b08825e
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 12 deletions.
diff --git a/site/docs/pages/wallet/wallet-dropdown-fund-link.mdx b/site/docs/pages/wallet/wallet-dropdown-fund-link.mdx
@@ -122,7 +122,7 @@ You can override component text using the `text` prop.
 
 ### Open in window
 
-You can override default link behavior to open the funding flow in a popup window by using the `type` prop.
+You can override default link behavior to open the funding flow in a popup window by using the `openIn` prop.
 
 ```tsx
 // omitted for brevity
@@ -133,7 +133,7 @@ You can override default link behavior to open the funding flow in a popup windo
   </ConnectWallet>
   <WalletDropdown>
     ...
-    <WalletDropdownFundLink type="window" /> // [!code focus]
+    <WalletDropdownFundLink openIn="window" /> // [!code focus]
   </WalletDropdown>
 </Wallet>
 ```
@@ -145,15 +145,15 @@ You can override default link behavior to open the funding flow in a popup windo
       <Name />
     </ConnectWallet>
     <WalletDropdown>
-      <WalletDropdownFundLink type="window" />
+      <WalletDropdownFundLink openIn="window" />
       <WalletDropdownDisconnect />
     </WalletDropdown>
   </Wallet>
 </WalletComponents>
 
 ### Customizing the window size
 
-When using popup mode, you're able to customize the size of the popup window using the `size` prop. Valid values are `s`, `m`, and `l`.
+When using popup mode, you're able to customize the size of the popup window using the `windowSize` prop. Valid values are `s`, `m`, and `l`.
 
 ```tsx
 // omitted for brevity
@@ -164,7 +164,7 @@ When using popup mode, you're able to customize the size of the popup window usi
   </ConnectWallet>
   <WalletDropdown>
     ...
-    <WalletDropdownFundLink type="window" size="s" /> // [!code focus]
+    <WalletDropdownFundLink openIn="window" windowSize="s" /> // [!code focus]
   </WalletDropdown>
 </Wallet>
 ```
@@ -176,7 +176,7 @@ When using popup mode, you're able to customize the size of the popup window usi
       <Name />
     </ConnectWallet>
     <WalletDropdown>
-      <WalletDropdownFundLink type="window" size="s" />
+      <WalletDropdownFundLink openIn="window" windowSize="s" />
       <WalletDropdownDisconnect />
     </WalletDropdown>
   </Wallet>

diff --git a/src/wallet/components/WalletDropdownFundLink.tsx b/src/wallet/components/WalletDropdownFundLink.tsx
@@ -7,10 +7,10 @@ export function WalletDropdownFundLink({
   className,
   icon,
   rel,
+  openIn = 'tab',
   target,
   text = 'Deposit Funds',
-  type = 'tab',
-  size = 'm',
+  windowSize = 'm',
 }: WalletDropdownFundLinkReact) {
   const iconSvg = useMemo(() => {
     if (icon === undefined) {
@@ -38,7 +38,7 @@ export function WalletDropdownFundLink({
   const handleClick = (e: React.MouseEvent) => {
     e.preventDefault();
     const url = `http://keys.coinbase.com/funding?dappName=${tabName}&dappUrl=${currentURL}`;
-    const { width, height } = windowSizes[size];
+    const { width, height } = windowSizes[windowSize];
     const left = (window.screen.width - width) / 2;
     const top = (window.screen.height - height) / 2;
     const windowFeatures = `width=${width},height=${height},resizable,scrollbars=yes,status=1,left=${left},top=${top}`;
@@ -54,7 +54,7 @@ export function WalletDropdownFundLink({
   };
 
   const linkProps =
-    type === 'tab'
+    openIn === 'tab'
       ? {
           ...commonProps,
           href: `http://keys.coinbase.com/funding?dappName=${tabName}&dappUrl=${currentURL}`,

diff --git a/src/wallet/types.ts b/src/wallet/types.ts
@@ -104,10 +104,10 @@ export type WalletDropdownFundLinkReact = {
   href: string;
   icon?: ReactNode;
   rel?: string;
+  openIn?: 'window' | 'tab';
   target?: string;
   text?: string;
-  type?: 'window' | 'tab';
-  size?: 's' | 'm' | 'l';
+  windowSize?: 's' | 'm' | 'l';
 };
 
 /**