test: add storybook to more easily test and show ui changes (#95)

* fix: display tx prefix while showing transaction

* chore: fix lint

* test: add storybook to more easily test and show ui changes

* Update vite.config.ts

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

* Update vite.config.ts

* chore: merge main and add story

* fix: update stories

* test: remove unnecessary textWithCopyToClipboard stories

* chore: fix lint

---------

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Author: SgtPooki

.gitignore

@@ -30,3 +30,6 @@ next-env.d.ts
 # Environment variables
 .env
 .env.local
+
+*storybook.log
+storybook-static

.storybook/main.ts

@@ -0,0 +1,17 @@
+import type { StorybookConfig } from '@storybook/react-vite'
+
+const config: StorybookConfig = {
+  stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|mjs|ts|tsx)'],
+  addons: [
+    '@chromatic-com/storybook',
+    '@storybook/addon-docs',
+    '@storybook/addon-onboarding',
+    '@storybook/addon-a11y',
+    '@storybook/addon-vitest',
+  ],
+  framework: {
+    name: '@storybook/react-vite',
+    options: {},
+  },
+}
+export default config

.storybook/preview.ts

@@ -0,0 +1,22 @@
+import type { Preview } from '@storybook/react-vite'
+import '../src/index.css'
+
+const preview: Preview = {
+  parameters: {
+    controls: {
+      matchers: {
+        color: /(background|color)$/i,
+        date: /Date$/i,
+      },
+    },
+
+    a11y: {
+      // 'todo' - show a11y violations in the test UI only
+      // 'error' - fail CI on a11y violations
+      // 'off' - skip a11y checks entirely
+      test: 'todo',
+    },
+  },
+}
+
+export default preview

.storybook/vitest.setup.ts

@@ -0,0 +1,7 @@
+import * as a11yAddonAnnotations from '@storybook/addon-a11y/preview'
+import { setProjectAnnotations } from '@storybook/react-vite'
+import * as projectAnnotations from './preview.ts'
+
+// This is an important step to apply the right configuration when testing your stories.
+// More info at: https://storybook.js.org/docs/api/portable-stories/portable-stories-vitest#setprojectannotations
+setProjectAnnotations([a11yAddonAnnotations, projectAnnotations])