From 231aaf24d167a828f1fa7cdd018520fc7ad66581 Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 21 Jul 2026 00:34:32 +0000 Subject: [PATCH] fix(ui): correct file:disabled variant order so Turbopack can compile globals.css MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The file input in DocumentManagerPanel used `file:disabled:opacity-50`, which Tailwind expands to `::file-selector-button:disabled` — a pseudo-class after a pseudo-element. Only user-action pseudo-classes (:hover/:active/:focus) are valid there, so Next 16's Turbopack CSS parser rejects the generated rule and fails to compile globals.css, 500-ing every route in `npm run dev` / `npm run ensure` / `verify:ui` (the production Lightning CSS build tolerated it, so deploys were unaffected). Reorder to `disabled:file:opacity-50`, which generates the valid `:disabled::file-selector-button` (pseudo-class before pseudo-element) and keeps the intent: dim the file-picker button while the input is disabled. Verified: `npm run dev` now compiles (Ready in 2.6s); `/`, the documents/upload surface, and other routes return 200 with no CSS parse error. Co-Authored-By: Claude Opus 4.8 Claude-Session: https://claude.ai/code/session_019g9m5emoPKCmDDPeGrchYd --- src/components/clinical-dashboard/DocumentManagerPanel.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/clinical-dashboard/DocumentManagerPanel.tsx b/src/components/clinical-dashboard/DocumentManagerPanel.tsx index 030e5e9aa..5d8046cc6 100644 --- a/src/components/clinical-dashboard/DocumentManagerPanel.tsx +++ b/src/components/clinical-dashboard/DocumentManagerPanel.tsx @@ -401,7 +401,7 @@ export function UploadPanel({ multiple disabled={demoMode || !canUpload || uploading} onChange={() => changeStatus(null)} - className="mt-2 block w-full text-xs font-medium text-[color:var(--text-muted)] file:mr-3 file:min-h-9 file:cursor-pointer file:rounded-md file:border file:border-[color:var(--border)] file:bg-[color:var(--surface)] file:px-3 file:text-xs file:font-semibold file:text-[color:var(--text)] file:shadow-[var(--shadow-inset)] file:transition file:hover:bg-[color:var(--surface-subtle)] file:disabled:opacity-50" + className="mt-2 block w-full text-xs font-medium text-[color:var(--text-muted)] file:mr-3 file:min-h-9 file:cursor-pointer file:rounded-md file:border file:border-[color:var(--border)] file:bg-[color:var(--surface)] file:px-3 file:text-xs file:font-semibold file:text-[color:var(--text)] file:shadow-[var(--shadow-inset)] file:transition file:hover:bg-[color:var(--surface-subtle)] disabled:file:opacity-50" />