diff --git a/.changeset/spotty-wasps-warn.md b/.changeset/spotty-wasps-warn.md
new file mode 100644
index 0000000000..623bcfc24d
--- /dev/null
+++ b/.changeset/spotty-wasps-warn.md
@@ -0,0 +1,5 @@
+---
+'@coinbase/onchainkit': patch
+---
+
+-**docs**: Updated `Identity` component preview. By @cpcramer #1717
diff --git a/site/docs/components/landing/ComponentPreview.tsx b/site/docs/components/landing/ComponentPreview.tsx
index f0246eee20..376d640b69 100644
--- a/site/docs/components/landing/ComponentPreview.tsx
+++ b/site/docs/components/landing/ComponentPreview.tsx
@@ -8,7 +8,7 @@ import { getHighlightedCode } from './getHighlightedCode.tsx';
// Demo components and code snippets
import CheckoutDemo, { checkoutDemoCode } from './CheckoutDemo.tsx';
import FundDemo, { fundDemoCode } from './FundDemo.tsx';
-import IdentityDemo, { identityDemoCode } from './IdentityDemo.tsx';
+import IdentityCardDemo, { identityCardDemoCode } from './IdentityCardDemo.tsx';
import NftMintCardDemo, { nftMintCardDemoCode } from './NftMintCardDemo.tsx';
import SwapDemo, { swapDemoCode } from './SwapDemo.tsx';
import TransactionDemo, { transactionDemoCode } from './TransactionDemo.tsx';
@@ -60,11 +60,11 @@ const components: Component[] = [
description: 'Fund wallets with a debit card or a coinbase account.',
},
{
- name: 'Identity',
- component: IdentityDemo,
- code: identityDemoCode,
+ name: 'Identity Card',
+ component: IdentityCardDemo,
+ code: identityCardDemoCode,
description:
- 'Display the Basename, avatar, and address associated with a wallet.',
+ 'Display the Basename, avatar, address, and social media links associated with a wallet.',
},
];
diff --git a/site/docs/components/landing/IdentityCardDemo.tsx b/site/docs/components/landing/IdentityCardDemo.tsx
new file mode 100644
index 0000000000..db70757c52
--- /dev/null
+++ b/site/docs/components/landing/IdentityCardDemo.tsx
@@ -0,0 +1,32 @@
+import { IdentityCard } from '@coinbase/onchainkit/identity';
+import { base } from 'viem/chains';
+import App from '../App.tsx';
+
+export const identityCardDemoCode = `
+ import { IdentityCard } from '@coinbase/onchainkit/identity';
+ import { base } from 'viem/chains';
+
+ function IdentityCardDemo() {
+ return (
+
+ )
+ }
+`;
+
+function IdentityCardDemo() {
+ return (
+
+
+
+ );
+}
+
+export default IdentityCardDemo;
diff --git a/site/docs/components/landing/IdentityDemo.tsx b/site/docs/components/landing/IdentityDemo.tsx
deleted file mode 100644
index bb7d3a341f..0000000000
--- a/site/docs/components/landing/IdentityDemo.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-import {
- Address,
- Avatar,
- Badge,
- Identity,
- Name,
-} from '@coinbase/onchainkit/identity';
-import App from '../App.tsx';
-
-export const identityDemoCode = `
- import {
- Avatar,
- Identity,
- Name,
- Badge,
- Address
- } from '@coinbase/onchainkit/identity';
-
- function IdentityDemo() {
- return (
-
-
-
-
-
-
-
- )
- }
- `;
-
-function IdentityDemo() {
- return (
-
-
-
-
-
-
-
-
-
- );
-}
-
-export default IdentityDemo;