diff --git a/pnpm/react-vite/package.json b/pnpm/react-vite/package.json
index ba6aa55..6b6e38e 100644
--- a/pnpm/react-vite/package.json
+++ b/pnpm/react-vite/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "before-storybook",
+  "name": "pnpm-react-vite",
   "private": true,
   "version": "0.0.0",
   "type": "module",
diff --git a/yarn-pnp/react-vite/package.json b/yarn-pnp/react-vite/package.json
index f3f2b8c..8a836cb 100644
--- a/yarn-pnp/react-vite/package.json
+++ b/yarn-pnp/react-vite/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "before-storybook",
+  "name": "yarn-pnp-react-vite",
   "private": true,
   "version": "0.0.0",
   "type": "module",
diff --git a/yarn-workspaces-monorepo/packages/react-vite/.eslintrc.cjs b/yarn-workspaces-monorepo/packages/react-vite-app/.eslintrc.cjs
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/.eslintrc.cjs
rename to yarn-workspaces-monorepo/packages/react-vite-app/.eslintrc.cjs
diff --git a/yarn-workspaces-monorepo/packages/react-vite/.gitignore b/yarn-workspaces-monorepo/packages/react-vite-app/.gitignore
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/.gitignore
rename to yarn-workspaces-monorepo/packages/react-vite-app/.gitignore
diff --git a/yarn-workspaces-monorepo/packages/react-vite/index.html b/yarn-workspaces-monorepo/packages/react-vite-app/index.html
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/index.html
rename to yarn-workspaces-monorepo/packages/react-vite-app/index.html
diff --git a/yarn-workspaces-monorepo/packages/react-vite/package.json b/yarn-workspaces-monorepo/packages/react-vite-app/package.json
similarity index 96%
rename from yarn-workspaces-monorepo/packages/react-vite/package.json
rename to yarn-workspaces-monorepo/packages/react-vite-app/package.json
index 43787f9..655ea58 100644
--- a/yarn-workspaces-monorepo/packages/react-vite/package.json
+++ b/yarn-workspaces-monorepo/packages/react-vite-app/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "react-vite",
+  "name": "react-vite-app",
   "private": true,
   "version": "0.0.0",
   "type": "module",
diff --git a/yarn-workspaces-monorepo/packages/react-vite/public/vite.svg b/yarn-workspaces-monorepo/packages/react-vite-app/public/vite.svg
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/public/vite.svg
rename to yarn-workspaces-monorepo/packages/react-vite-app/public/vite.svg
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/App.css b/yarn-workspaces-monorepo/packages/react-vite-app/src/App.css
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/App.css
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/App.css
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/App.tsx b/yarn-workspaces-monorepo/packages/react-vite-app/src/App.tsx
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/App.tsx
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/App.tsx
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/assets/react.svg b/yarn-workspaces-monorepo/packages/react-vite-app/src/assets/react.svg
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/assets/react.svg
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/assets/react.svg
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/index.css b/yarn-workspaces-monorepo/packages/react-vite-app/src/index.css
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/index.css
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/index.css
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/main.tsx b/yarn-workspaces-monorepo/packages/react-vite-app/src/main.tsx
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/main.tsx
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/main.tsx
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Button.stories.ts b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Button.stories.ts
similarity index 90%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/Button.stories.ts
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Button.stories.ts
index c2a874a..26d89ae 100644
--- a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Button.stories.ts
+++ b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Button.stories.ts
@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import { Button } from './Button';
+// a component which comes from a separate package
+import { Button } from '../../../react-vite-components/src/components/Button';
 
 // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 const meta = {
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Button.tsx b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Button.tsx
similarity index 80%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/Button.tsx
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Button.tsx
index c33be6e..d4bc3fd 100644
--- a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Button.tsx
+++ b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Button.tsx
@@ -34,11 +34,11 @@ export const Button = ({
   label,
   ...props
 }: ButtonProps) => {
-  const mode = primary ? 'storybook-button--primary' : 'storybook-button--secondary';
+  const mode = primary ? 'app-storybook-button--primary' : 'app-storybook-button--secondary';
   return (
     <button
       type="button"
-      className={['storybook-button', `storybook-button--${size}`, mode].join(' ')}
+      className={['app-storybook-button', `app-storybook-button--${size}`, mode].join(' ')}
       style={{ backgroundColor }}
       {...props}
     >
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Configure.mdx b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Configure.mdx
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/Configure.mdx
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Configure.mdx
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Header.stories.ts b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Header.stories.ts
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/Header.stories.ts
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Header.stories.ts
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Header.tsx b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Header.tsx
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/Header.tsx
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Header.tsx
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Page.stories.ts b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Page.stories.ts
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/Page.stories.ts
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Page.stories.ts
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/Page.tsx b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Page.tsx
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/Page.tsx
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/Page.tsx
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/accessibility.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/accessibility.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/accessibility.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/accessibility.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/accessibility.svg b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/accessibility.svg
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/accessibility.svg
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/accessibility.svg
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/addon-library.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/addon-library.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/addon-library.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/addon-library.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/assets.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/assets.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/assets.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/assets.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/context.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/context.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/context.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/context.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/discord.svg b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/discord.svg
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/discord.svg
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/discord.svg
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/docs.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/docs.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/docs.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/docs.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/figma-plugin.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/figma-plugin.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/figma-plugin.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/figma-plugin.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/github.svg b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/github.svg
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/github.svg
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/github.svg
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/share.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/share.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/share.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/share.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/styling.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/styling.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/styling.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/styling.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/testing.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/testing.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/testing.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/testing.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/theming.png b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/theming.png
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/theming.png
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/theming.png
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/tutorials.svg b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/tutorials.svg
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/tutorials.svg
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/tutorials.svg
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/youtube.svg b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/youtube.svg
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/assets/youtube.svg
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/assets/youtube.svg
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/button.css b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/button.css
similarity index 72%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/button.css
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/button.css
index dc91dc7..6e2e0b6 100644
--- a/yarn-workspaces-monorepo/packages/react-vite/src/stories/button.css
+++ b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/button.css
@@ -1,4 +1,4 @@
-.storybook-button {
+.app-storybook-button {
   font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   font-weight: 700;
   border: 0;
@@ -7,24 +7,24 @@
   display: inline-block;
   line-height: 1;
 }
-.storybook-button--primary {
+.app-storybook-button--primary {
   color: white;
   background-color: #1ea7fd;
 }
-.storybook-button--secondary {
+.app-storybook-button--secondary {
   color: #333;
   background-color: transparent;
   box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset;
 }
-.storybook-button--small {
+.app-storybook-button--small {
   font-size: 12px;
   padding: 10px 16px;
 }
-.storybook-button--medium {
+.app-storybook-button--medium {
   font-size: 14px;
   padding: 11px 20px;
 }
-.storybook-button--large {
+.app-storybook-button--large {
   font-size: 16px;
   padding: 12px 24px;
 }
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/header.css b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/header.css
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/header.css
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/header.css
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/stories/page.css b/yarn-workspaces-monorepo/packages/react-vite-app/src/stories/page.css
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/stories/page.css
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/stories/page.css
diff --git a/yarn-workspaces-monorepo/packages/react-vite/src/vite-env.d.ts b/yarn-workspaces-monorepo/packages/react-vite-app/src/vite-env.d.ts
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/src/vite-env.d.ts
rename to yarn-workspaces-monorepo/packages/react-vite-app/src/vite-env.d.ts
diff --git a/yarn-workspaces-monorepo/packages/react-vite/tsconfig.json b/yarn-workspaces-monorepo/packages/react-vite-app/tsconfig.json
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/tsconfig.json
rename to yarn-workspaces-monorepo/packages/react-vite-app/tsconfig.json
diff --git a/yarn-workspaces-monorepo/packages/react-vite/tsconfig.node.json b/yarn-workspaces-monorepo/packages/react-vite-app/tsconfig.node.json
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/tsconfig.node.json
rename to yarn-workspaces-monorepo/packages/react-vite-app/tsconfig.node.json
diff --git a/yarn-workspaces-monorepo/packages/react-vite/vite.config.ts b/yarn-workspaces-monorepo/packages/react-vite-app/vite.config.ts
similarity index 100%
rename from yarn-workspaces-monorepo/packages/react-vite/vite.config.ts
rename to yarn-workspaces-monorepo/packages/react-vite-app/vite.config.ts
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/.eslintrc.cjs b/yarn-workspaces-monorepo/packages/react-vite-components/.eslintrc.cjs
new file mode 100644
index 0000000..d6c9537
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/.eslintrc.cjs
@@ -0,0 +1,18 @@
+module.exports = {
+  root: true,
+  env: { browser: true, es2020: true },
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:react-hooks/recommended',
+  ],
+  ignorePatterns: ['dist', '.eslintrc.cjs'],
+  parser: '@typescript-eslint/parser',
+  plugins: ['react-refresh'],
+  rules: {
+    'react-refresh/only-export-components': [
+      'warn',
+      { allowConstantExport: true },
+    ],
+  },
+}
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/.gitignore b/yarn-workspaces-monorepo/packages/react-vite-components/.gitignore
new file mode 100644
index 0000000..a547bf3
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/index.html b/yarn-workspaces-monorepo/packages/react-vite-components/index.html
new file mode 100644
index 0000000..e4b78ea
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/index.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite + React + TS</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/package.json b/yarn-workspaces-monorepo/packages/react-vite-components/package.json
new file mode 100644
index 0000000..48cdb55
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/package.json
@@ -0,0 +1,28 @@
+{
+  "name": "react-vite-components",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
+  "devDependencies": {
+    "@types/react": "^18.2.15",
+    "@types/react-dom": "^18.2.7",
+    "@typescript-eslint/eslint-plugin": "^6.0.0",
+    "@typescript-eslint/parser": "^6.0.0",
+    "@vitejs/plugin-react": "^4.0.3",
+    "eslint": "^8.45.0",
+    "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-react-refresh": "^0.4.3",
+    "typescript": "^5.0.2",
+    "vite": "^4.4.5"
+  }
+}
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/src/components/Button.tsx b/yarn-workspaces-monorepo/packages/react-vite-components/src/components/Button.tsx
new file mode 100644
index 0000000..58074f0
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/src/components/Button.tsx
@@ -0,0 +1,48 @@
+import React from 'react';
+import './button.css';
+
+interface ButtonProps {
+  /**
+   * Is this the principal call to action on the page?
+   */
+  primary?: boolean;
+  /**
+   * What background color to use
+   */
+  backgroundColor?: string;
+  /**
+   * How large should the button be?
+   */
+  size?: 'small' | 'medium' | 'large';
+  /**
+   * Button contents
+   */
+  label: string;
+  /**
+   * Optional click handler
+   */
+  onClick?: () => void;
+}
+
+/**
+ * Primary UI component for user interaction
+ */
+export const Button = ({
+  primary = false,
+  size = 'medium',
+  backgroundColor,
+  label,
+  ...props
+}: ButtonProps) => {
+  const mode = primary ? 'component-storybook-button--primary' : 'component-storybook-button--secondary';
+  return (
+    <button
+      type="button"
+      className={['component-storybook-button', `component-storybook-button--${size}`, mode].join(' ')}
+      style={{ backgroundColor }}
+      {...props}
+    >
+      {label}
+    </button>
+  );
+};
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/src/components/button.css b/yarn-workspaces-monorepo/packages/react-vite-components/src/components/button.css
new file mode 100644
index 0000000..15cbc08
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/src/components/button.css
@@ -0,0 +1,30 @@
+.component-storybook-button {
+  font-family: 'Nunito Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-weight: 700;
+  border: 0;
+  border-radius: 3em;
+  cursor: pointer;
+  display: inline-block;
+  line-height: 1;
+}
+.component-storybook-button--primary {
+  color: white;
+  background-color: red;
+}
+.component-storybook-button--secondary {
+  color: #333;
+  background-color: transparent;
+  box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 0px 1px inset;
+}
+.component-storybook-button--small {
+  font-size: 12px;
+  padding: 10px 16px;
+}
+.component-storybook-button--medium {
+  font-size: 14px;
+  padding: 11px 20px;
+}
+.component-storybook-button--large {
+  font-size: 16px;
+  padding: 12px 24px;
+}
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/tsconfig.json b/yarn-workspaces-monorepo/packages/react-vite-components/tsconfig.json
new file mode 100644
index 0000000..a7fc6fb
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/tsconfig.json
@@ -0,0 +1,25 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "noEmit": true,
+    "jsx": "react-jsx",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true
+  },
+  "include": ["src"],
+  "references": [{ "path": "./tsconfig.node.json" }]
+}
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/tsconfig.node.json b/yarn-workspaces-monorepo/packages/react-vite-components/tsconfig.node.json
new file mode 100644
index 0000000..42872c5
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/tsconfig.node.json
@@ -0,0 +1,10 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": ["vite.config.ts"]
+}
diff --git a/yarn-workspaces-monorepo/packages/react-vite-components/vite.config.ts b/yarn-workspaces-monorepo/packages/react-vite-components/vite.config.ts
new file mode 100644
index 0000000..5a33944
--- /dev/null
+++ b/yarn-workspaces-monorepo/packages/react-vite-components/vite.config.ts
@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react()],
+})
diff --git a/yarn-workspaces-monorepo/packages/react-vite/README.md b/yarn-workspaces-monorepo/packages/react-vite/README.md
deleted file mode 100644
index 298465d..0000000
--- a/yarn-workspaces-monorepo/packages/react-vite/README.md
+++ /dev/null
@@ -1,23 +0,0 @@
-# React Vite (TS)
-
-This project was bootstrapped with [Storybook](https://storybook.js.org/).
-
-## Available Scripts
-
-In the project directory, you can run:
-
-### npm run storybook
-
-Runs the Storybook UI locally.
-
-Open [http://localhost:6006](http://localhost:6006) to view it in the browser.
-
-The page will reload if you make edits.
-
-### npm run build-storybook
-
-Builds the Storybook UI for production.
-
-## Learn More
-
-You can learn more in the [Storybook documentation](https://storybook.js.org/docs).
diff --git a/yarn-workspaces-monorepo/packages/storybook-app/.storybook/main.ts b/yarn-workspaces-monorepo/packages/storybook-app/.storybook/main.ts
index 71eeeb0..9721387 100644
--- a/yarn-workspaces-monorepo/packages/storybook-app/.storybook/main.ts
+++ b/yarn-workspaces-monorepo/packages/storybook-app/.storybook/main.ts
@@ -2,8 +2,8 @@ import type { StorybookConfig } from "@storybook/react-vite";
 
 const config: StorybookConfig = {
   stories: [
-    "../../react-vite/src/**/*.mdx",
-    "../../react-vite/src/**/*.stories.@(js|jsx|mjs|ts|tsx)",
+    "../../react-vite-app/src/**/*.mdx",
+    "../../react-vite-app/src/**/*.stories.@(js|jsx|mjs|ts|tsx)",
     {
       directory: "../src/stories",
     },
diff --git a/yarn-workspaces-monorepo/packages/storybook-app/README.md b/yarn-workspaces-monorepo/packages/storybook-app/README.md
deleted file mode 100644
index 298465d..0000000
--- a/yarn-workspaces-monorepo/packages/storybook-app/README.md
+++ /dev/null
@@ -1,23 +0,0 @@
-# React Vite (TS)
-
-This project was bootstrapped with [Storybook](https://storybook.js.org/).
-
-## Available Scripts
-
-In the project directory, you can run:
-
-### npm run storybook
-
-Runs the Storybook UI locally.
-
-Open [http://localhost:6006](http://localhost:6006) to view it in the browser.
-
-The page will reload if you make edits.
-
-### npm run build-storybook
-
-Builds the Storybook UI for production.
-
-## Learn More
-
-You can learn more in the [Storybook documentation](https://storybook.js.org/docs).
diff --git a/yarn-workspaces-monorepo/packages/storybook-app/package.json b/yarn-workspaces-monorepo/packages/storybook-app/package.json
index 171a6db..a8cb8de 100644
--- a/yarn-workspaces-monorepo/packages/storybook-app/package.json
+++ b/yarn-workspaces-monorepo/packages/storybook-app/package.json
@@ -24,7 +24,7 @@
     "@storybook/blocks": "^7.2.0",
     "@storybook/react": "^7.2.0",
     "@storybook/react-vite": "^7.2.0",
-    "@storybook/test-runner": "0.12.1--canary.339.848d743.0",
+    "@storybook/test-runner": "0.12.1--canary.339.90fb7b2.0",
     "@storybook/testing-library": "^0.2.0",
     "@types/react": "^18.2.15",
     "@types/react-dom": "^18.2.7",
diff --git a/yarn-workspaces-monorepo/yarn.lock b/yarn-workspaces-monorepo/yarn.lock
index cb63f31..c695bab 100644
--- a/yarn-workspaces-monorepo/yarn.lock
+++ b/yarn-workspaces-monorepo/yarn.lock
@@ -3728,9 +3728,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@storybook/test-runner@npm:0.12.1--canary.339.848d743.0":
-  version: 0.12.1--canary.339.848d743.0
-  resolution: "@storybook/test-runner@npm:0.12.1--canary.339.848d743.0"
+"@storybook/test-runner@npm:0.12.1--canary.339.90fb7b2.0":
+  version: 0.12.1--canary.339.90fb7b2.0
+  resolution: "@storybook/test-runner@npm:0.12.1--canary.339.90fb7b2.0"
   dependencies:
     "@babel/core": ^7.22.5
     "@babel/generator": ^7.22.5
@@ -3761,7 +3761,7 @@ __metadata:
     ts-dedent: ^2.0.0
   bin:
     test-storybook: dist/test-storybook.js
-  checksum: e78385afec609aa5117627d6e43b1487f696c7490f6492ec50be3dc1413b181b9a0efa6a1d9005bfe5caf323d08c309137fcdac3219b68b55ca32370d91b0f25
+  checksum: 1494203350cd99892baadfeb324bee3761e8a2a6d76f42100d7e76553726445a308a6f0b9280cf7fc9cbea31ce97c754261026bbd4a4225001f9b99cbb5d5030
   languageName: node
   linkType: hard
 
@@ -10501,9 +10501,28 @@ __metadata:
   languageName: node
   linkType: hard
 
-"react-vite@workspace:packages/react-vite":
+"react-vite-app@workspace:packages/react-vite-app":
   version: 0.0.0-use.local
-  resolution: "react-vite@workspace:packages/react-vite"
+  resolution: "react-vite-app@workspace:packages/react-vite-app"
+  dependencies:
+    "@types/react": ^18.2.15
+    "@types/react-dom": ^18.2.7
+    "@typescript-eslint/eslint-plugin": ^6.0.0
+    "@typescript-eslint/parser": ^6.0.0
+    "@vitejs/plugin-react": ^4.0.3
+    eslint: ^8.45.0
+    eslint-plugin-react-hooks: ^4.6.0
+    eslint-plugin-react-refresh: ^0.4.3
+    react: ^18.2.0
+    react-dom: ^18.2.0
+    typescript: ^5.0.2
+    vite: ^4.4.5
+  languageName: unknown
+  linkType: soft
+
+"react-vite-components@workspace:packages/react-vite-components":
+  version: 0.0.0-use.local
+  resolution: "react-vite-components@workspace:packages/react-vite-components"
   dependencies:
     "@types/react": ^18.2.15
     "@types/react-dom": ^18.2.7
@@ -11276,7 +11295,7 @@ __metadata:
     "@storybook/blocks": ^7.2.0
     "@storybook/react": ^7.2.0
     "@storybook/react-vite": ^7.2.0
-    "@storybook/test-runner": 0.12.1--canary.339.848d743.0
+    "@storybook/test-runner": 0.12.1--canary.339.90fb7b2.0
     "@storybook/testing-library": ^0.2.0
     "@types/react": ^18.2.15
     "@types/react-dom": ^18.2.7