From df9a2cd232d125b82caf992faebab643c87d0e36 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 16:51:25 -0700 Subject: [PATCH 01/14] chore: Update disconnect SVG --- src/internal/svg/disconnectSvg.tsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/internal/svg/disconnectSvg.tsx b/src/internal/svg/disconnectSvg.tsx index 1cdc389b2e..1ad96525e0 100644 --- a/src/internal/svg/disconnectSvg.tsx +++ b/src/internal/svg/disconnectSvg.tsx @@ -1,4 +1,4 @@ -import { fill } from '../../styles/theme'; +import { fill } from "../../styles/theme"; export const disconnectSvg = ( From 7ddabb80a334cfe7b7aaa077766f7340d1a8de22 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 16:54:04 -0700 Subject: [PATCH 02/14] format --- src/internal/svg/disconnectSvg.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/internal/svg/disconnectSvg.tsx b/src/internal/svg/disconnectSvg.tsx index 1ad96525e0..4acc12a07d 100644 --- a/src/internal/svg/disconnectSvg.tsx +++ b/src/internal/svg/disconnectSvg.tsx @@ -1,4 +1,4 @@ -import { fill } from "../../styles/theme"; +import { fill } from '../../styles/theme'; export const disconnectSvg = ( Date: Mon, 19 Aug 2024 16:56:23 -0700 Subject: [PATCH 03/14] Add chagneset --- .changeset/many-ways-divide.md | 5 +++++ 1 file changed, 5 insertions(+) create mode 100644 .changeset/many-ways-divide.md diff --git a/.changeset/many-ways-divide.md b/.changeset/many-ways-divide.md new file mode 100644 index 0000000000..7b158bcc82 --- /dev/null +++ b/.changeset/many-ways-divide.md @@ -0,0 +1,5 @@ +--- +"@coinbase/onchainkit": patch +--- + +chore: Update disconnect SVG image. By @cpcramer #1103 From c08d5209ffed57515cdda193315e0e8a025debff Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 21:21:26 -0700 Subject: [PATCH 04/14] Add storybook --- src/internal/svg/disconnectSvg.stories.ts | 17 +++++++++ src/internal/svg/disconnectSvg.tsx | 42 ++++++++++++----------- 2 files changed, 39 insertions(+), 20 deletions(-) create mode 100644 src/internal/svg/disconnectSvg.stories.ts diff --git a/src/internal/svg/disconnectSvg.stories.ts b/src/internal/svg/disconnectSvg.stories.ts new file mode 100644 index 0000000000..50394b3cbb --- /dev/null +++ b/src/internal/svg/disconnectSvg.stories.ts @@ -0,0 +1,17 @@ +import type { Meta, StoryObj } from '@storybook/react'; +import { fn } from '@storybook/test'; +import { disconnectSvg } from './disconnectSvg'; + +const meta = { + title: 'Wallet/disconnectSvg', + component: disconnectSvg, + tags: ['autodocs'], + argTypes: {}, + args: { onClick: fn() }, +} satisfies Meta; + +export default meta; + +type Story = StoryObj; + +export const Basic: Story = {}; diff --git a/src/internal/svg/disconnectSvg.tsx b/src/internal/svg/disconnectSvg.tsx index 4acc12a07d..4cc35e8d3f 100644 --- a/src/internal/svg/disconnectSvg.tsx +++ b/src/internal/svg/disconnectSvg.tsx @@ -1,22 +1,24 @@ import { fill } from '../../styles/theme'; -export const disconnectSvg = ( - - - - -); +export function disconnectSvg() { + return ( + + + + + ); +} From d2a0268a9b869b9452be6ebaf82e4ce403e01390 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 21:30:04 -0700 Subject: [PATCH 05/14] Update storybook --- src/internal/svg/disconnectSvg.stories.ts | 18 +++++----- src/internal/svg/disconnectSvg.tsx | 42 +++++++++++------------ 2 files changed, 30 insertions(+), 30 deletions(-) diff --git a/src/internal/svg/disconnectSvg.stories.ts b/src/internal/svg/disconnectSvg.stories.ts index 50394b3cbb..84ce8f916b 100644 --- a/src/internal/svg/disconnectSvg.stories.ts +++ b/src/internal/svg/disconnectSvg.stories.ts @@ -1,17 +1,19 @@ +import React from 'react'; import type { Meta, StoryObj } from '@storybook/react'; -import { fn } from '@storybook/test'; import { disconnectSvg } from './disconnectSvg'; +// Wrapper component to display the SVG +const SvgWrapper: React.FC = () => React.createElement('div', { + style: { width: '100px', height: '100px' } +}, disconnectSvg); + const meta = { - title: 'Wallet/disconnectSvg', - component: disconnectSvg, + title: 'Wallet/DisconnectSvg', + component: SvgWrapper, tags: ['autodocs'], - argTypes: {}, - args: { onClick: fn() }, -} satisfies Meta; +} satisfies Meta; export default meta; - type Story = StoryObj; -export const Basic: Story = {}; +export const Basic: Story = {}; \ No newline at end of file diff --git a/src/internal/svg/disconnectSvg.tsx b/src/internal/svg/disconnectSvg.tsx index 4cc35e8d3f..c3b927923b 100644 --- a/src/internal/svg/disconnectSvg.tsx +++ b/src/internal/svg/disconnectSvg.tsx @@ -1,24 +1,22 @@ import { fill } from '../../styles/theme'; -export function disconnectSvg() { - return ( - - - - - ); -} +export const disconnectSvg = ( + + + + +); From 008e9bd3ae402e38ac79d43fc5d70e7e7cce3e54 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 21:30:18 -0700 Subject: [PATCH 06/14] formatting --- src/internal/svg/disconnectSvg.stories.ts | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/src/internal/svg/disconnectSvg.stories.ts b/src/internal/svg/disconnectSvg.stories.ts index 84ce8f916b..2f46386a24 100644 --- a/src/internal/svg/disconnectSvg.stories.ts +++ b/src/internal/svg/disconnectSvg.stories.ts @@ -3,9 +3,14 @@ import type { Meta, StoryObj } from '@storybook/react'; import { disconnectSvg } from './disconnectSvg'; // Wrapper component to display the SVG -const SvgWrapper: React.FC = () => React.createElement('div', { - style: { width: '100px', height: '100px' } -}, disconnectSvg); +const SvgWrapper: React.FC = () => + React.createElement( + 'div', + { + style: { width: '100px', height: '100px' }, + }, + disconnectSvg, + ); const meta = { title: 'Wallet/DisconnectSvg', @@ -16,4 +21,4 @@ const meta = { export default meta; type Story = StoryObj; -export const Basic: Story = {}; \ No newline at end of file +export const Basic: Story = {}; From 2f19b5044704e19ec421f8013d734ba4cc9ba0c3 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 21:32:29 -0700 Subject: [PATCH 07/14] update style --- src/internal/svg/disconnectSvg.stories.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/internal/svg/disconnectSvg.stories.ts b/src/internal/svg/disconnectSvg.stories.ts index 2f46386a24..5df7d7e831 100644 --- a/src/internal/svg/disconnectSvg.stories.ts +++ b/src/internal/svg/disconnectSvg.stories.ts @@ -2,12 +2,11 @@ import React from 'react'; import type { Meta, StoryObj } from '@storybook/react'; import { disconnectSvg } from './disconnectSvg'; -// Wrapper component to display the SVG const SvgWrapper: React.FC = () => React.createElement( 'div', { - style: { width: '100px', height: '100px' }, + style: { width: '100px', height: '100px', viewBox: '0 0 24 24' }, }, disconnectSvg, ); From 80e313755116f32be297840ef857046b8f54c7d4 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 21:33:00 -0700 Subject: [PATCH 08/14] update styles --- src/internal/svg/disconnectSvg.stories.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/internal/svg/disconnectSvg.stories.ts b/src/internal/svg/disconnectSvg.stories.ts index 5df7d7e831..c60bf6ddf4 100644 --- a/src/internal/svg/disconnectSvg.stories.ts +++ b/src/internal/svg/disconnectSvg.stories.ts @@ -6,7 +6,7 @@ const SvgWrapper: React.FC = () => React.createElement( 'div', { - style: { width: '100px', height: '100px', viewBox: '0 0 24 24' }, + style: { width: '100%', height: '100%', viewBox: '0 0 24 24' }, }, disconnectSvg, ); From 7f834e96037a12207faa26c561afcc21294bb76c Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 21:33:59 -0700 Subject: [PATCH 09/14] asdf --- src/internal/svg/disconnectSvg.stories.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/internal/svg/disconnectSvg.stories.ts b/src/internal/svg/disconnectSvg.stories.ts index c60bf6ddf4..5ce77db81f 100644 --- a/src/internal/svg/disconnectSvg.stories.ts +++ b/src/internal/svg/disconnectSvg.stories.ts @@ -6,7 +6,7 @@ const SvgWrapper: React.FC = () => React.createElement( 'div', { - style: { width: '100%', height: '100%', viewBox: '0 0 24 24' }, + style: { width: '100%', height: '100%', viewBox: '0 0 16 20' }, }, disconnectSvg, ); From 44350c5fb0da756f9d36110018241b9404796ce3 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Mon, 19 Aug 2024 21:36:19 -0700 Subject: [PATCH 10/14] formatting --- src/internal/svg/disconnectSvg.stories.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/internal/svg/disconnectSvg.stories.ts b/src/internal/svg/disconnectSvg.stories.ts index 5ce77db81f..6250cc373a 100644 --- a/src/internal/svg/disconnectSvg.stories.ts +++ b/src/internal/svg/disconnectSvg.stories.ts @@ -1,5 +1,5 @@ -import React from 'react'; import type { Meta, StoryObj } from '@storybook/react'; +import React from 'react'; import { disconnectSvg } from './disconnectSvg'; const SvgWrapper: React.FC = () => From b33b31d85985ad9b57ee41896bf54a9c7a3aa5c3 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Tue, 20 Aug 2024 21:12:30 -0700 Subject: [PATCH 11/14] Add story --- .../WalletDropdownDisconnect.stories.tsx | 15 +++++++++++++++ 1 file changed, 15 insertions(+) create mode 100644 src/wallet/components/WalletDropdownDisconnect.stories.tsx diff --git a/src/wallet/components/WalletDropdownDisconnect.stories.tsx b/src/wallet/components/WalletDropdownDisconnect.stories.tsx new file mode 100644 index 0000000000..f2d61dc8f9 --- /dev/null +++ b/src/wallet/components/WalletDropdownDisconnect.stories.tsx @@ -0,0 +1,15 @@ +import React from 'react'; +import { WalletDropdownDisconnect } from './WalletDropdownDisconnect'; + +export default { + title: 'Wallet/WalletDropdownDisconnect', + component: WalletDropdownDisconnect, +}; + +export const Default = () => ; + +export const CustomText = () => ; + +export const CustomClass = () => ( + +); \ No newline at end of file From 71c5687124e29ed07bfad38405e452d5c6b78522 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Tue, 20 Aug 2024 21:21:02 -0700 Subject: [PATCH 12/14] Story finally working --- .../WalletDropdownDisconnect.stories.tsx | 30 +++++++++++++++---- 1 file changed, 25 insertions(+), 5 deletions(-) diff --git a/src/wallet/components/WalletDropdownDisconnect.stories.tsx b/src/wallet/components/WalletDropdownDisconnect.stories.tsx index f2d61dc8f9..45a04c6a0c 100644 --- a/src/wallet/components/WalletDropdownDisconnect.stories.tsx +++ b/src/wallet/components/WalletDropdownDisconnect.stories.tsx @@ -1,9 +1,29 @@ -import React from 'react'; -import { WalletDropdownDisconnect } from './WalletDropdownDisconnect'; +import React from "react"; +import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; + +import { WalletDropdownDisconnect } from "./WalletDropdownDisconnect"; +import { http, WagmiProvider, createConfig } from "wagmi"; +import { baseSepolia } from "viem/chains"; + +const wagmiConfig = createConfig({ + chains: [baseSepolia], + transports: { + [baseSepolia.id]: http(), + }, +}); export default { - title: 'Wallet/WalletDropdownDisconnect', + title: "Wallet/WalletDropdownDisconnect", component: WalletDropdownDisconnect, + decorators: [ + (Story) => ( + + + + + + ), + ], }; export const Default = () => ; @@ -11,5 +31,5 @@ export const Default = () => ; export const CustomText = () => ; export const CustomClass = () => ( - -); \ No newline at end of file + +); From 692fa5da8531c9907a3edced8f4e990b49467d47 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Tue, 20 Aug 2024 21:21:23 -0700 Subject: [PATCH 13/14] formati --- .../components/WalletDropdownDisconnect.stories.tsx | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/src/wallet/components/WalletDropdownDisconnect.stories.tsx b/src/wallet/components/WalletDropdownDisconnect.stories.tsx index 45a04c6a0c..1b808e214c 100644 --- a/src/wallet/components/WalletDropdownDisconnect.stories.tsx +++ b/src/wallet/components/WalletDropdownDisconnect.stories.tsx @@ -1,9 +1,8 @@ -import React from "react"; -import { QueryClient, QueryClientProvider } from "@tanstack/react-query"; +import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; -import { WalletDropdownDisconnect } from "./WalletDropdownDisconnect"; -import { http, WagmiProvider, createConfig } from "wagmi"; -import { baseSepolia } from "viem/chains"; +import { baseSepolia } from 'viem/chains'; +import { http, WagmiProvider, createConfig } from 'wagmi'; +import { WalletDropdownDisconnect } from './WalletDropdownDisconnect'; const wagmiConfig = createConfig({ chains: [baseSepolia], @@ -13,7 +12,7 @@ const wagmiConfig = createConfig({ }); export default { - title: "Wallet/WalletDropdownDisconnect", + title: 'Wallet/WalletDropdownDisconnect', component: WalletDropdownDisconnect, decorators: [ (Story) => ( From b5dc81a719b9062a1a64b3935a1f5bbfb93d7b65 Mon Sep 17 00:00:00 2001 From: Paul Cramer Date: Tue, 20 Aug 2024 21:21:46 -0700 Subject: [PATCH 14/14] format --- src/wallet/components/WalletDropdownDisconnect.stories.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/wallet/components/WalletDropdownDisconnect.stories.tsx b/src/wallet/components/WalletDropdownDisconnect.stories.tsx index 1b808e214c..f84d172f0c 100644 --- a/src/wallet/components/WalletDropdownDisconnect.stories.tsx +++ b/src/wallet/components/WalletDropdownDisconnect.stories.tsx @@ -1,5 +1,4 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; - import { baseSepolia } from 'viem/chains'; import { http, WagmiProvider, createConfig } from 'wagmi'; import { WalletDropdownDisconnect } from './WalletDropdownDisconnect';