fix: alert title contrast, and make Storybook dev serve live library source
Two independent fixes: 1. Alert titles used text-<severity> directly on a bg-<severity>/15 tinted background. For danger (a very dark base hue) this reads as near-invisible text-on-tinted-background. The original PrimeVue-era Message design kept body/title text neutral and only accented the icon/left-border with the severity color -- restore that: alert text stays text-foreground, severity shows via a border-l-4 accent stripe instead of tinted text. 2. Root-caused why none of the last several fixes were showing up without a full `bun run build`: @nychthemeron/library's package.json exports its "." entry as ./dist/index.js unconditionally, and every story imports from the bare package specifier. So Storybook's dev server was always resolving to whatever the dist bundle looked like at last build time, never live source -- editing packages/library/src and restarting `bun run dev` (even with caches cleared) never picked up changes. Vite auto-injects a "development" resolution condition during `vite dev`/serve (and "production" during build), which is the standard fix for exactly this monorepo dev-vs-published split: added a "development" condition to the "." export pointing at src/index.ts, matching the pattern the "./components" sub-export already used. Also added the matching "@" alias to packages/playground/vite.config.ts, since resolving straight to library source pulls in its "@/lib/utils"-style internal imports, which playground's own Vite instance didn't previously know how to resolve. Verified both paths: dev server now reflects source edits without a library rebuild, and `bun run build` still produces a correct dist bundle with the same fix baked in. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
parent
e1ee3c739d
commit
23cb57420d
3 changed files with 11 additions and 6 deletions
|
|
@ -4,6 +4,7 @@
|
|||
"type": "module",
|
||||
"exports": {
|
||||
".": {
|
||||
"development": "./src/index.ts",
|
||||
"import": "./dist/index.js",
|
||||
"types": "./dist/src/index.d.ts"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -7,15 +7,15 @@ export { default as AlertDescription } from './AlertDescription.vue'
|
|||
export { default as AlertTitle } from './AlertTitle.vue'
|
||||
|
||||
export const alertVariants = cva(
|
||||
'relative grid w-full gap-1 rounded-lg border px-3 py-2.5 text-sm has-data-[slot=alert-action]:pr-10',
|
||||
'relative grid w-full gap-1 rounded-lg border border-l-4 px-3 py-2.5 text-sm text-foreground has-data-[slot=alert-action]:pr-10',
|
||||
{
|
||||
variants: {
|
||||
variant: {
|
||||
info: 'bg-info/15 border-info/30 text-foreground [&_[data-slot=alert-title]]:text-info',
|
||||
success: 'bg-success/15 border-success/30 text-foreground [&_[data-slot=alert-title]]:text-success',
|
||||
warning: 'bg-warning/15 border-warning/30 text-foreground [&_[data-slot=alert-title]]:text-warning',
|
||||
danger: 'bg-destructive/15 border-destructive/30 text-foreground [&_[data-slot=alert-title]]:text-destructive',
|
||||
secondary: 'bg-secondary/40 border-border text-foreground',
|
||||
info: 'bg-info/15 border-info/30 border-l-info',
|
||||
success: 'bg-success/15 border-success/30 border-l-success',
|
||||
warning: 'bg-warning/15 border-warning/30 border-l-warning',
|
||||
danger: 'bg-destructive/15 border-destructive/30 border-l-destructive',
|
||||
secondary: 'bg-secondary/40 border-border',
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
|
|
|
|||
|
|
@ -8,6 +8,10 @@ export default defineConfig({
|
|||
resolve: {
|
||||
alias: {
|
||||
'~': fileURLToPath(new URL('./src', import.meta.url)),
|
||||
// Matches packages/library's own alias -- needed because the "development"
|
||||
// export condition on @nychthemeron/library resolves straight to that
|
||||
// package's source (see its package.json), which itself imports via "@/...".
|
||||
'@': fileURLToPath(new URL('../library/src', import.meta.url)),
|
||||
},
|
||||
},
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in a new issue