[Design] Modais e dialogs compartilhados — passe de consistência #178

Parent

Épico: revisão visual dark-mode / Apple-like do OpenCode Desktop. Depende da fundação de tokens (#164).

What to build

Auditar e ajustar apenas visual/tokens, sem alterar comportamento, os seguintes arquivos:

• components/dialog-command-palette-v2.tsx
• components/dialog-select-directory*.tsx, dialog-select-file.tsx, dialog-select-mcp.tsx, dialog-select-server.tsx
• components/dialog-fork.tsx, dialog-release-notes.tsx, dialog-usage-exceeded.tsx, dialog-edit-project*.tsx, dialog-custom-provider.tsx, dialog-connect-provider.tsx, dialog-connect-omniroute.tsx, dialog-settings.tsx, settings-dialog.tsx
• components/session/dialog-background-tasks.tsx
• pages/session/timeline/dialog-delete-session.tsx
• pages/session/usage-exceeded-dialogs.tsx
• pages/layout/dialog-workspace-actions.tsx
• components/settings-v2/dialog-settings-v2.tsx

Passos:

1. Revisar cada componente em light e dark mode usando os tokens --v2-* de packages/ui/src/v2/styles/theme.css (já corrigidos por [Design] Dark-mode token contrast pass — packages/ui/src/v2/styles/theme.css #164) — nenhum hex cru, apenas tokens semânticos.
2. Aplicar refinamento estilo Apple HIG: hierarquia por peso/tamanho (não só cor), 1 CTA primário por tela, transições 150-300ms (ease-out ao entrar / ease-in ao sair), cantos e sombras usando a escala --v2-elevation-* existente (sem valores de shadow ad-hoc), focus ring visível em todo elemento interativo, scrim de modal 40-60% preto reservado para contexto de dismissal.
3. Garantir que texto muted/faint, bordas e estados de hover/pressed permanecem legíveis nos dois temas (retestar após [Design] Dark-mode token contrast pass — packages/ui/src/v2/styles/theme.css #164).
4. Verificar botões só-ícone têm aria-label, e que nenhuma informação é passada só por cor.

Objetivo específico desta issue: garantir que todos os modais/dialogs do app compartilham a mesma escala de elevação (--v2-elevation-floating/-overlay), o mesmo scrim de fundo, o mesmo raio de canto e a mesma affordance de fechamento (X visível ou Esc), em vez de cada dialog reinventar esses valores individualmente.

Acceptance criteria

• Nenhuma mudança de comportamento/UX — apenas visual (cor, espaçamento, tipografia, elevação, motion)
• Sem hex cru — só tokens --v2-* semânticos
• Contraste de texto ≥4.5:1 (corpo) / ≥3:1 (grande, ícones, bordas) confirmado em light e dark
• Estados de foco visíveis via teclado em todos os elementos interativos da página
• Botões ícone-apenas têm aria-label
• Testado manualmente em light e dark antes de abrir o PR

Blocked by

• [Design] Dark-mode token contrast pass — packages/ui/src/v2/styles/theme.css #164

Verification

Screenshots antes/depois em light e dark mode desta página/superfície, anexados ao PR.