Peter Meier
03e84c1f28
Storybook (SvelteKit-Framework, Tailwind v4, MSW, Translation-Decorator): Stories für Atoms/Molecules/Organisms + alle CMS-Blocks. Button-Atom: 5 .btn-*-Varianten (primary/secondary/tertiary/outline/warning), class-Merge-Prop, href→<a>, Loading-Spinner neben Label, rounded-md/font-medium. Alle rohen .btn-*- und Hand-Style-Buttons app-weit aufs Atom migriert. SectionHeader-Molecule (kicker/number/title/subtitle/action) + Integration in 7 CMS-Blocks (post_overview, organisations, organisations_map, searchable_text, image_gallery, youtube_video_gallery, files) via neuem section_header-Schema. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
41 lines
1.8 KiB
TypeScript
41 lines
1.8 KiB
TypeScript
import type { StorybookConfig } from '@storybook/sveltekit';
|
|
import tailwindcss from '@tailwindcss/vite';
|
|
|
|
const config: StorybookConfig = {
|
|
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|ts|svelte)'],
|
|
addons: [
|
|
'@storybook/addon-svelte-csf',
|
|
'@storybook/addon-a11y',
|
|
'@storybook/addon-docs',
|
|
],
|
|
framework: '@storybook/sveltekit',
|
|
// MSW-Service-Worker liegt in static/ (via `npx msw init static/`). Storybook
|
|
// muss static/ ausliefern, damit /mockServiceWorker.js erreichbar ist.
|
|
staticDirs: ['../static'],
|
|
// Tailwind v4 läuft als Vite-Plugin. Das sveltekit-Framework bringt nur die
|
|
// Svelte/SvelteKit-Integration mit ($app/$env/$lib-Mocks), nicht Tailwind —
|
|
// darum hier explizit dazuhängen, sonst greifen keine Utility-Klassen/Tokens.
|
|
viteFinal: async (viteConfig) => {
|
|
viteConfig.plugins = viteConfig.plugins ?? [];
|
|
viteConfig.plugins.push(tailwindcss());
|
|
|
|
// Same-origin-Routen, die im echten Frontend SvelteKit-Server-Endpoints
|
|
// sind (in Storybook nicht existieren), auf die Live-Site proxien. Damit
|
|
// rendern RustyImage-Bilder (/cms-images, /cms-files) und die Live-Daten-
|
|
// Blocks (/api/strommix, /api/stellungnahme) mit echten Daten — ohne
|
|
// Fixtures. Deterministische Offline-Mocks stattdessen via MSW (siehe
|
|
// .storybook/README oder Kommentar unten).
|
|
const PROXY_TARGET = 'https://windwiderstand.de';
|
|
viteConfig.server = viteConfig.server ?? {};
|
|
viteConfig.server.proxy = {
|
|
...(viteConfig.server.proxy ?? {}),
|
|
'/cms-images': { target: PROXY_TARGET, changeOrigin: true },
|
|
'/cms-files': { target: PROXY_TARGET, changeOrigin: true },
|
|
'/api/strommix': { target: PROXY_TARGET, changeOrigin: true },
|
|
'/api/stellungnahme': { target: PROXY_TARGET, changeOrigin: true },
|
|
};
|
|
return viteConfig;
|
|
},
|
|
};
|
|
export default config;
|