froglet-ui · jryanconklin · Feb 15, 2025 · Feb 15, 2025 · Feb 15, 2025 · Feb 15, 2025
diff --git a/.github/workflows/deploy-github-pages.yaml b/.github/workflows/deploy-github-pages.yaml
@@ -0,0 +1,29 @@
+# Workflow
+name: Storybook to GitHub Pages
+
+on:
+  push:
+    branches:
+      - "main"
+
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+jobs:
+  deploy:
+    name: Deploy Storybook
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22.13.1
+      - name: Push to GitHub Pages
+        uses: bitovi/github-actions-storybook-to-github-pages@v1.0.3
+        with:
+          checkout: false
+          path: apps/storybook/storybook-static
diff --git a/apps/storybook/.storybook/froglet-theme.ts b/apps/storybook/.storybook/froglet-theme.ts
@@ -0,0 +1,9 @@
+import { create } from "@storybook/theming";
+
+export default create({
+  base: "light",
+  brandTitle: "Froglet UI",
+  brandUrl: "https://froglet.io",
+  brandImage: "/froglet.png",
+  brandTarget: "_self",
+});
diff --git a/apps/storybook/.storybook/main.ts b/apps/storybook/.storybook/main.ts
@@ -14,9 +14,7 @@ function getAbsolutePath(value: string): any {
 const config: StorybookConfig = {
   stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
   addons: [
-    getAbsolutePath("@storybook/addon-onboarding"),
     getAbsolutePath("@storybook/addon-essentials"),
-    getAbsolutePath("@chromatic-com/storybook"),
     getAbsolutePath("@storybook/addon-interactions"),
   ],
   framework: {

diff --git a/apps/storybook/.storybook/manager.ts b/apps/storybook/.storybook/manager.ts
@@ -0,0 +1,6 @@
+import { addons } from "@storybook/manager-api";
+import froglet from "./froglet-theme.ts";
+
+addons.setConfig({
+  theme: froglet,
+});
diff --git a/apps/storybook/index.html b/apps/storybook/index.html
@@ -7,6 +7,5 @@
   </head>
   <body>
     <div id="root"></div>
-    <script type="module" src="/src/main.tsx"></script>
   </body>
 </html>
diff --git a/apps/storybook/package.json b/apps/storybook/package.json
@@ -17,15 +17,15 @@
     "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@chromatic-com/storybook": "^3.2.4",
     "@eslint/js": "^9.19.0",
     "@storybook/addon-essentials": "^8.5.3",
     "@storybook/addon-interactions": "^8.5.3",
-    "@storybook/addon-onboarding": "^8.5.3",
     "@storybook/blocks": "^8.5.3",
+    "@storybook/manager-api": "^8.5.6",
     "@storybook/react": "^8.5.3",
     "@storybook/react-vite": "^8.5.3",
     "@storybook/test": "^8.5.3",
+    "@storybook/theming": "^8.5.6",
     "@types/react": "^19.0.8",
     "@types/react-dom": "^19.0.3",
     "@vitejs/plugin-react": "^4.3.4",

diff --git a/apps/storybook/public/froglet.png b/apps/storybook/public/froglet.png
diff --git a/apps/storybook/public/vite.svg b/apps/storybook/public/vite.svg
-Original file line number
+Diff line change
@@ Expand Up / @@ -7,6 +7,5 @@ @@
       </head>
       <body>
         <div id="root"></div>
-        <script type="module" src="/src/main.tsx"></script>
       </body>
     </html>