From 23cb57420d4e06eae674ff6582c9ebc9420179b6 Mon Sep 17 00:00:00 2001 From: Matthew L McPeak Date: Mon, 13 Jul 2026 15:23:13 -0400 Subject: [PATCH] fix: alert title contrast, and make Storybook dev serve live library source Two independent fixes: 1. Alert titles used text- directly on a bg-/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 --- packages/library/package.json | 1 + packages/library/src/components/ui/alert/index.ts | 12 ++++++------ packages/playground/vite.config.ts | 4 ++++ 3 files changed, 11 insertions(+), 6 deletions(-) diff --git a/packages/library/package.json b/packages/library/package.json index a527822..a081948 100644 --- a/packages/library/package.json +++ b/packages/library/package.json @@ -4,6 +4,7 @@ "type": "module", "exports": { ".": { + "development": "./src/index.ts", "import": "./dist/index.js", "types": "./dist/src/index.d.ts" }, diff --git a/packages/library/src/components/ui/alert/index.ts b/packages/library/src/components/ui/alert/index.ts index 88c8a32..35b06fb 100644 --- a/packages/library/src/components/ui/alert/index.ts +++ b/packages/library/src/components/ui/alert/index.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: { diff --git a/packages/playground/vite.config.ts b/packages/playground/vite.config.ts index 8139d0c..169658e 100644 --- a/packages/playground/vite.config.ts +++ b/packages/playground/vite.config.ts @@ -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)), }, }, })