@softize/opus 18.0.1 → 18.1.0

package/CHANGELOG.md

@@ -7,6 +7,53 @@ Depois de qualquer bump, rode os gates (`typecheck` · `test` · `opus check` ·
 `opus copy --check` · `base copy check` · `manifest:check`) — eles apontam o que a
 mudança cobra do seu código.
 
+## 18.1.0 — 2026-09-15
+
+A UI passa a assumir layout desktop fixo com largura mínima suportada de `64rem`. Breakpoints de
+viewport e container queries isoladas saem dos componentes; grids, dialogs, drawers e campos
+preservam o estado correspondente a essa largura. Consultas de acessibilidade e capacidade, limites
+contra a viewport e overflow continuam ativos. `ActionFormDialog` e Presentations modais passam a
+dimensionar o footer pelo conteúdo, com `Cancelar` em `ghost`; `footerDistribution="equal"`
+permanece disponível como escolha explícita e usa cancelamento `outline`.
+
+Filtros de list actions passam a declarar `placement: 'inline' | 'advanced' | 'external'`.
+Filtros `external` continuam no estado navegável e no input, mas deixam a apresentação para o
+consumidor; filtros avançados podem ser agrupados por `section`, distribuídos em até três colunas
+com `advancedFilters.columns` e usam calendário nos campos de data. A propriedade `advanced`
+continua aceita durante a migração e equivale a `placement: 'advanced'`.
+
+Tools de IA e MCP passam a projetar também as labels dos Produtos de Dados relacionados, mantendo
+os identificadores técnicos existentes. Hosts podem apresentar nomes legíveis sem perder a
+rastreabilidade usada na execução e na auditoria.
+
+Alert, Toast e Item passam a compartilhar a densidade compacta das superfícies horizontais:
+`0.75rem` de padding no tamanho padrão e corpo produtivo de `0.875rem`. Cada componente declara o
+corpo produtivo na própria raiz, sem alterar a tipografia de `html` ou `body`; folhas internas de
+Alert e Item deixam de repetir a classe já estabelecida pela raiz do componente. `Item size="sm"`
+reduz somente o padding vertical para `0.5rem`. Rótulos de formulário também usam explicitamente
+o corpo produtivo; `text-xs` permanece reservado a metadados compactos, como rótulos de detalhes.
+
+`ToggleGroupItem` preserva seu estado selecionado quando compõe um `TooltipTrigger` com `asChild`.
+O tooltip continua disponível sem substituir os atributos que identificam e marcam visualmente o
+item ativo.
+
+`TabsList variant="line"` passa a desenhar uma linha-base por toda a largura disponível na
+orientação horizontal, mantendo as abas compactas e o indicador ativo sobre a borda. Dentro de
+`DrawerBody` ou `DialogBody`, a linha atravessa os gutters até as bordas sem deslocar os rótulos. Os itens usam
+padding horizontal zero, padding vertical de `0.75rem` e gap de `1.25rem`.
+A altura do `line` horizontal passa a acompanhar o conteúdo, permitindo que esse padding defina
+a área interativa em vez de ficar contido pela altura da escala de controles. A orientação vertical
+preserva seu padding anterior. `Field orientation="responsive"` continua aceito como alias do layout
+desktop horizontal, sem reintroduzir breakpoints.
+
+Campos de entrada passam a usar `bg-muted/30` no tema claro, preservando no escuro o contraste de
+`bg-input/30`. O cabeçalho da `Table framed` compartilha essa superfície. O footer de `Dialog`
+usa uma versão mais suave desse mesmo fundo. A moldura do modal fica transparente no light e sutil
+no dark; o backdrop volta a escurecer a página sem aplicar blur.
+
+`Button variant="outline"` passa a ter fundo transparente em repouso nos contextos neutral,
+primary e danger. A borda, o texto semântico e o preenchimento de hover permanecem inalterados.
+
 ## 18.0.1 — 2026-09-13
 
 Controles somente com ícone que pertencem ao chrome da superfície, como voltar e fechar, usam o

package/docs/adr/0016-productive-surfaces-use-compact-density.md

@@ -0,0 +1,62 @@
+# ADR 0016 — Superfícies produtivas usam densidade compacta
+
+- **Status:** aceita.
+- **Data:** 2026-09-14.
+
+## Contexto
+
+Alert, Toast e Item compartilham uma composição horizontal de mídia, texto e ações, mas nasceram
+com medidas internas diferentes ou herdadas de dependências. Alert e Item usavam `1rem` de padding;
+o Toast preservava `1rem` e corpo de `0.8125rem` do Sonner. Consumidores já reconstruíam mensagens
+parecidas com `0.75rem`, sinal de que a densidade da família não estava definida pela biblioteca.
+
+A tipografia também repetia `text-sm` em raiz e folhas do mesmo componente. Essa repetição não
+distinguia uma fronteira tipográfica de um detalhe interno e tornava difícil saber quando uma classe
+era contrato ou apenas redundância.
+
+## Decisão
+
+O tema não redefine a tipografia de `html`, `:root` ou `body`. Componentes que constituem uma
+fronteira reutilizável declaram `text-sm`; folhas internas herdam essa medida, salvo quando
+restauram o corpo produtivo dentro de um contexto tipográfico diferente.
+
+Superfícies horizontais produtivas usam `0.75rem` de padding no tamanho padrão:
+
+- Alert usa `p-3` e mantém mídia, texto e ações na mesma anatomia;
+- Toast sobrescreve o padding e o corpo nativos do Sonner para repetir a medida do Alert;
+- Item usa `p-3` e `gap-3`; `size="sm"` conserva `0.75rem` na horizontal e reduz a vertical para
+  `0.5rem`.
+
+Mais espaço permanece deliberado quando o componente representa outra tarefa: Empty cria uma
+pausa de estado na região disponível; Dialog e Drawer estruturam faixas e corpo; Card deixa o
+padding sob responsabilidade dos seus slots ou do consumidor; conteúdo editorial usa `text-base`
+para leitura prolongada.
+
+## Consequências
+
+- Alert, Toast e Item passam a parecer membros da mesma família sem virar o mesmo componente.
+- Texto solto preserva o tamanho do documento; uma fronteira reutilizável não depende
+  acidentalmente do tamanho escolhido pelo consumidor.
+- `p-4` deixa de ser o default de mensagens e linhas, mas continua válido em contêineres
+  estruturais cujo papel exige mais respiro.
+- A integração com Sonner precisa de teste de contrato porque seus defaults deixam de governar a
+  tipografia e o padding do Toast.
+
+## Alternativas descartadas
+
+- **Reduzir a fonte raiz:** compactaria também espaços, dimensões, radius e elevação, misturando
+  densidade global com o papel do texto.
+- **Criar aliases como `text-body` ou `surface-padding`:** esconderia os mesmos degraus sem
+  esclarecer onde a decisão pertence.
+- **Remover toda ocorrência de `text-sm`:** faria componentes reutilizáveis dependerem do contexto
+  externo e impediria a restauração explícita do corpo produtivo.
+- **Aplicar `p-3` a toda superfície:** reduziria modais, estados vazios e conteúdo editorial sem
+  relação com a composição horizontal que motivou a decisão.
+
+## Verificação
+
+- testes estruturais conferem padding e herança em Alert e Item;
+- o teste da integração com Sonner fixa padding, corpo e entrelinha do Toast;
+- o contrato de unidades relativas confirma a ausência de tipografia global em `html`, `:root`
+  e `body`;
+- documentação de Alert, Toast, Item e tokens classifica os defaults e as exceções.

package/docs/adr/0017-ui-assumes-a-fixed-desktop-layout.md

@@ -0,0 +1,54 @@
+# ADR 0017 — A UI assume layout desktop fixo
+
+- **Status:** aceita.
+- **Data:** 2026-09-15.
+
+## Contexto
+
+A UI acumulou adaptações isoladas por viewport em dialogs, drawers, campos, detalhes, paginação e
+grids. O shell, as sidebars e os splits continuaram desktop-only. Essa combinação não formava um
+contrato responsivo: abaixo da largura de trabalho, algumas partes mudavam de forma enquanto a
+estrutura principal permanecia fixa.
+
+## Decisão
+
+O Opus assume uma largura mínima suportada de `64rem`. Componentes usam um layout fixo equivalente
+ao estado que os breakpoints `sm`, `md` e `lg` produziam nessa largura. Estados exclusivos de
+`xl` e `2xl` não alteram mais a composição.
+
+A UI viva não usa media queries de largura, variantes responsivas do Tailwind nem container queries.
+Uma futura responsividade baseada no espaço do container exige uma decisão própria e uma aplicação
+sistêmica; não permanece ativa de forma incidental em componentes isolados.
+
+Consultas de preferência ou capacidade, como `prefers-reduced-motion`, `forced-colors` e
+`hover`, continuam válidas. Overflow, limites de altura e posicionamento contra a viewport também
+continuam protegendo conteúdo; essas medidas não prometem uma composição alternativa.
+
+Footers de formulário modal dimensionam as ações pelo conteúdo e usam `Cancelar` em `ghost`.
+`distribution="equal"` permanece uma escolha explícita para decisões de peso equivalente e,
+nesse caso, o cancelamento usa `outline`.
+
+## Consequências
+
+- O mesmo componente preserva a composição a partir de `64rem`, inclusive dentro de panes,
+  drawers e splits.
+- Abaixo da largura suportada, compressão ou rolagem não constitui regressão do contrato atual.
+- Dialogs mantêm limites fixos de largura; tabelas preservam rolagem horizontal.
+- A remoção de breakpoints não remove adaptações de acessibilidade nem contenção contra overflow.
+- Uma iniciativa responsiva futura começa pelo shell e define containers, navegação, tabelas e
+  testes de largura antes de adaptar componentes.
+
+## Alternativas descartadas
+
+- **Manter adaptações pontuais:** conserva algum conforto em telas estreitas, mas continua sugerindo
+  um suporte que o shell não oferece.
+- **Completar responsividade por viewport agora:** amplia a mudança para navegação, splits, tabelas
+  e fluxos que ainda não possuem requisitos de produto.
+- **Preservar container queries isoladas:** usa uma técnica adequada para o futuro, mas mantém hoje
+  um contrato parcial sem cobertura sistêmica.
+
+## Verificação
+
+- Um teste de inventário reprova variantes de largura e container queries na UI viva.
+- Testes estruturais fixam layouts, larguras de modal e distribuição dos footers.
+- Documentação pública declara a largura mínima, o default por conteúdo e a exceção `equal`.

package/docs/relative-unit-scale.md

@@ -15,12 +15,17 @@ compacto deixavam de acompanhar a raiz mesmo quando a aplicação assumia essa r
 
 ## Decisão
 
-- O tema do Opus não declara `font-size` em `html` nem em `:root`. O navegador e a aplicação
-  definem a fonte raiz.
+- O tema do Opus não declara `font-size` em `html`, `:root` nem `body`. O navegador e a aplicação
+  definem a fonte raiz e o texto geral do documento.
 - Medidas que pertencem à identidade e à escala da interface usam `rem`, diretamente ou pela
   escala do Tailwind, que também é relativa à raiz.
 - Aplicações ajustam a densidade no próprio CSS. Para conservar a proporção que antes resultava
   de uma raiz de 15 sobre a base usual de 16, podem usar `html { font-size: 93.75%; }`.
+- Ajustar a raiz é uma decisão de escala da interface inteira, não uma forma de renomear papéis
+  tipográficos. Na escala produtiva recomendada, `text-sm` (`0.875rem`) é o corpo comum da
+  interface e deve ser declarado na raiz controlada do componente ou da região. `text-base`
+  (`1rem`) fica reservado à leitura mais confortável; a documentação de tokens apresenta a regra
+  de composição e herança.
 - `px` fica restrito a encaixes técnicos que não devem crescer com a tipografia: espessura de
   hairline, compensação exata de uma borda, ajuste óptico preso a esse traço e o raio efetivamente
   infinito do scrollbar nativo. Cada ocorrência integra a allowlist do teste de contrato.
@@ -31,6 +36,8 @@ compacto deixavam de acompanhar a raiz mesmo quando a aplicação assumia essa r
 
 - Sem uma regra da aplicação, `1rem` segue a configuração do navegador. A UI pode ficar maior
   para consumidores que recebiam os antigos 15px; essa mudança é visual e intencional.
+- Texto solto, fora de uma raiz que declare seu papel tipográfico, permanece no tamanho geral do
+  documento; componentes produtivos não dependem de uma redução global para chegar a `0.875rem`.
 - Preferências de acessibilidade e identidades próprias deixam de disputar com um override da
   biblioteca.
 - Alterar a raiz na aplicação escala texto, espaçamento, radius, foco, elevação e limites

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@softize/opus",
-  "version": "18.0.1",
+  "version": "18.1.0",
   "description": "End-to-end action protocol for TypeScript. Single package with subpath exports (core + adapters).",
   "license": "MIT",
   "type": "module",

package/registry/skills/build-opus-ui/references/evaluations.md

@@ -12,7 +12,9 @@
   `ActionFilterBar` separado do renderer, `ItemGroup` para
   uma coleção secundária e um `ActionFormDialog`; provar teto padrão de `80rem`, hierarquia por
   `level`, vazio estrutural sólido, `Empty` apenas para criação ou vínculo, números sem alinhamento
-  inferido e cancelamento `outline` no footer 50/50 do modal.
+  inferido e footer modal com largura natural, alinhado à direita e cancelamento `ghost`; incluir
+  separadamente um caso deliberadamente equivalente com distribuição 50/50 e cancelamento
+  `outline` explícitos.
 - Execução roteável: declarar Page, criação e edição com `Presentation.route`; provar deep link,
   hidratação do registro, fechamento para a lista e projeção integral no manifest.
 - Execução abreviada: montar outra página com `<Page title actions>` e uma seção com

package/registry/skills/build-opus-ui/references/ui-patterns.md

@@ -56,8 +56,11 @@ ContentDescription, ContentMeta, ContentActions) + ContentBody`. `ContentHeader`
   `*Content` permanece reservado a raízes técnicas ou painéis cujo papel não é o corpo de uma
   estrutura, como `DialogContent`, `PopoverContent` e `TabsContent`.
 - Componentes compartilhados não impõem margem externa; páginas e shells compõem layout.
-- A fonte raiz pertence ao navegador e à aplicação. Medidas escaláveis usam `rem` ou a escala
-  relativa do Tailwind; `px` fica restrito a hairlines e compensações ligadas a essas bordas.
+- A UI assume layout desktop fixo e largura mínima suportada de `64rem`. Não introduzir
+  breakpoints de viewport ou container queries isoladas; uma futura responsividade precisa começar
+  pelo shell e formar um contrato sistêmico. A fonte raiz pertence ao navegador e à aplicação.
+  Medidas escaláveis usam `rem` ou a escala relativa do Tailwind; `px` fica restrito a hairlines
+  e compensações ligadas a essas bordas.
 - Superfície semântica e foreground são um par local (`bg-card text-card-foreground`,
   `bg-popover text-popover-foreground`); herança do foreground global não substitui o par.
 - Forma usa a escala `rounded-*`; nome de componente não cria uma segunda escala de radius.
@@ -90,7 +93,10 @@ ContentDescription, ContentMeta, ContentActions) + ContentBody`. `ContentHeader`
   ou views nomeadas. Usar `ActionFilterBar` isoladamente só quando outra superfície assumir a
   renderização dos resultados. Colunas numéricas não recebem alinhamento ou tipografia por
   inferência do tipo: declarar `className` no header e na célula quando o produto exigir, de
-  modo que números preservem o alinhamento natural por padrão.
+  modo que números preservem o alinhamento natural por padrão. O valor principal de uma célula
+  preserva `text-sm` e o foreground da superfície; `text-xs text-muted-foreground` fica restrito
+  a metadado subordinado a outro valor na mesma célula. Cabeçalhos e `EmptyValue` continuam muted;
+  não reduzir nem atenuar uma coluna inteira por ela ser técnica, temporal ou menos destacada.
 - `ItemGroup` representa uma coleção e pode oferecer moldura explícita; `Item` já carrega
   semântica de item de lista. Preferir essa composição a uma sequência visual sem estrutura.
 - `Empty` com moldura tracejada comunica uma região disponível para criar ou vincular algo.

package/src/core/runtime.ts

@@ -815,6 +815,7 @@ export class Runtime {
     for (const action of this.actions.values()) {
       const cfg = normalizeAiConfig(action.ai)
       if (cfg === null) continue
+      const dataProducts = [...(this.actionDataProducts.get(action.name) ?? [])].sort()
       tools.push({
         name: action.name,
         ...(action.label !== undefined
@@ -822,7 +823,12 @@ export class Runtime {
           : {}),
         description: cfg.description ?? action.description ?? action.name,
         inputSchema: action.input,
-        metadata: { dataProducts: [...(this.actionDataProducts.get(action.name) ?? [])].sort() },
+        metadata: {
+          dataProducts,
+          dataProductLabels: Object.fromEntries(
+            dataProducts.map((id) => [id, this.dataProducts.get(id)?.label ?? id]),
+          ),
+        },
       })
     }
     this.aiToolsCache = tools

package/src/core/types.ts

@@ -602,8 +602,12 @@ export interface FilterSpec {
   operators?: FilterOp[]
   path?: string
 
-  /** Filtro AVANÇADO: sai da barra inline e vai pro modal "Filtros" (com contador de
-   *  ativos no botão). Os não-avançados rendem inline na toolbar da listagem. */
+  /** Onde o filtro é controlado na interface. `external` mantém o filtro no contrato,
+   *  no estado navegável e no input efetivo, mas deixa sua apresentação para outra
+   *  superfície — por exemplo, cards de status acima da lista. */
+  placement?: 'inline' | 'advanced' | 'external'
+
+  /** @deprecated Use `placement: 'advanced'`. Mantido durante a migração dos contratos. */
   advanced?: boolean
 
   section?: string
@@ -1264,7 +1268,12 @@ export interface AiTool {
   description: string
   inputSchema: unknown
   /** Metadados de governança para o host; não fazem parte do prompt nem concedem acesso. */
-  metadata?: { dataProducts?: string[] }
+  metadata?: {
+    /** Identificadores técnicos dos Produtos de Dados relacionados. */
+    dataProducts?: string[]
+    /** Labels humanas por identificador; ausente para runtimes legados. */
+    dataProductLabels?: Record<string, string>
+  }
 }
 
 /** Turno de conversa (histórico multi-turn do chat). */

package/src/mcp/index.ts

@@ -47,7 +47,10 @@ export function createOpusMcpServer(runtime: Runtime, opts: OpusMcpOptions = {})
       ...(t.title !== undefined ? { title: t.title } : {}),
       description: t.description,
       inputSchema: toJsonSchema(t.inputSchema) as { type: 'object' },
-      _meta: { 'com.softize.opus/data-products': t.metadata?.dataProducts ?? [] },
+      _meta: {
+        'com.softize.opus/data-products': t.metadata?.dataProducts ?? [],
+        'com.softize.opus/data-product-labels': t.metadata?.dataProductLabels ?? {},
+      },
     })),
   }))
 

package/src/ui/components/patterns/action-list-dialog.tsx

@@ -48,7 +48,7 @@ export interface ActionListDialogProps<
   empty?: (items: TItem[]) => boolean
   /** Carga EXTRA agregada à do fetch (ex.: a query irmã que os children precisam). */
   loading?: boolean
-  /** Classes do DialogContent (largura). Default: sm:max-w-3xl (lista pede espaço). */
+  /** Classes do DialogContent (largura). Default: max-w-3xl (lista pede espaço). */
   className?: string
   /** O layout dos itens (cards/linhas) — os estados já saíram daqui. */
   children: (items: TItem[], refetch: () => Promise<void>) => ReactNode
@@ -78,7 +78,7 @@ export function ActionListDialog<
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent
-        className={cn('sm:max-w-3xl', className)}
+        className={cn('max-w-3xl', className)}
         aria-describedby={intro === undefined ? undefined : introId}
       >
         <DialogHeader>

package/src/ui/components/patterns/content-header.tsx

@@ -171,7 +171,7 @@ export function ContentHeader({
         }}
         className={cn(
           content.variant === "page" &&
-            "flex-row items-center justify-start gap-3 sm:flex-row sm:items-center sm:justify-start",
+            "flex-row items-center justify-start gap-3",
           className,
         )}
         {...props}

package/src/ui/components/patterns/form-dialog.tsx

@@ -29,6 +29,8 @@ export interface ActionFormDialogProps<
   title: string;
   /** Conteúdo relevante apresentado antes dos campos, como texto ou Alert. */
   intro?: ReactNode;
+  /** Distribui as ações pela largura disponível somente quando as decisões pedem peso equivalente. */
+  footerDistribution?: "content" | "equal";
 }
 
 export function ActionFormDialog<
@@ -42,6 +44,7 @@ export function ActionFormDialog<
   onSuccess,
   onCancel,
   cancelVariant,
+  footerDistribution = "content",
   ...rest
 }: ActionFormDialogProps<TInput, TData>) {
   const introId = useId();
@@ -72,7 +75,7 @@ export function ActionFormDialog<
           )}
           footer={(actions) => (
             <DialogFooter>
-              <ButtonGroup mode="spaced" distribution="equal">
+              <ButtonGroup mode="spaced" distribution={footerDistribution}>
                 {actions}
               </ButtonGroup>
             </DialogFooter>
@@ -82,7 +85,9 @@ export function ActionFormDialog<
             onOpenChange(false);
           }}
           onCancel={onCancel ?? (() => onOpenChange(false))}
-          cancelVariant={cancelVariant ?? "outline"}
+          cancelVariant={
+            cancelVariant ?? (footerDistribution === "equal" ? "outline" : "ghost")
+          }
         />
       </DialogContent>
     </Dialog>