- Delete packages/library/src/engine/ and engine.spec.ts; LoadingIcon is now exported directly instead of routed through a generic theming engine. - Remove primevue from every package.json (root devDependencies, library peerDependencies, playground dependencies) and from vite.config.ts's externalized/global Rollup config; add reka-ui as the library's peer dep. - Delete the hand-written nychthemeron.css/theme.css, now fully superseded by the Tailwind entry CSS; both library exports (./style, ./theme) point at it. - Drop the PrimeVue plugin install from Storybook's preview.ts. - Add a `@source "../../";` directive to tailwind.css: Tailwind's automatic content detection is scoped to whichever Vite project runs it, so when the playground consumes this CSS file it never scanned the sibling packages/library/src tree for class usage -- every component rendered with zero utility classes applied until this was added (verified via the compiled Storybook CSS output going from ~2KB/no .bg-primary rule to ~40KB with the full utility set, and the pre-fix screenshot that surfaced it: buttons and other components with a real background color showing as bare, near-invisible text on white). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
52 lines
1.2 KiB
TypeScript
52 lines
1.2 KiB
TypeScript
import type { Preview } from '@storybook/vue3-vite'
|
|
import '@nychthemeron/library/theme'
|
|
|
|
const preview: Preview = {
|
|
parameters: {
|
|
layout: 'centered',
|
|
toolbar: {
|
|
theme: {
|
|
items: [
|
|
{ value: 'hades', title: 'Dark (Hades)', left: '🌙' },
|
|
{ value: 'apollo', title: 'Light (Apollo)', left: '☀️' },
|
|
],
|
|
dynamicTitle: true,
|
|
},
|
|
},
|
|
docs: {
|
|
description: {
|
|
component: 'Component documentation',
|
|
},
|
|
},
|
|
},
|
|
decorators: [
|
|
(story, context) => {
|
|
const theme = context.globals.theme || 'hades'
|
|
|
|
return {
|
|
setup() {
|
|
document.documentElement.setAttribute('data-theme', theme)
|
|
},
|
|
components: { story },
|
|
template: '<story />',
|
|
}
|
|
},
|
|
],
|
|
globalTypes: {
|
|
theme: {
|
|
name: 'Theme',
|
|
description: 'Global theme for all components',
|
|
defaultValue: 'hades',
|
|
toolbar: {
|
|
icon: 'paintbrush',
|
|
items: [
|
|
{ value: 'hades', title: 'Dark (Hades)' },
|
|
{ value: 'apollo', title: 'Light (Apollo)' },
|
|
],
|
|
dynamicTitle: true,
|
|
},
|
|
},
|
|
},
|
|
}
|
|
|
|
export default preview
|