@aurea-uds/core 0.56.0 → 0.59.0

package/dist/aurea.css

@@ -3161,8 +3161,8 @@ img,svg { display:block; }
 .slider-color .slider-thumb { box-sizing:border-box; inline-size:var(--space-4); block-size:var(--space-4); align-self:center; border:0; background:var(--color-checker) center/var(--space-2) var(--space-2); box-shadow:inset 0 0 0 var(--space-4) var(--slider-thumb-color,var(--primary)), var(--shadow-md); forced-color-adjust:none; }
 .slider-color .slider-thumb::after { content:none; }
 .slider-color[data-orientation="vertical"] .slider-thumb { inline-size:var(--space-4); block-size:var(--space-4); }
-/* COLORAREA (0.32.0, ADR-0069) — a área de cor. A pintura (o gradiente, a ÚNICA exceção à ADR-0007) chega pela
-   variável que o componente põe (`--color-area-fill`): esta folha não escreve gradiente nenhum (check 4).
+/* COLORAREA (0.32.0, ADR-0069) — a área de cor. A pintura (o gradiente) chega pela
+   variável que o componente põe (`--color-area-fill`).
    Medidas da referência, lidas no CSS publicado dela (3.2.6): quadrada, até 224 de largura, canto 16; o pino de
    16 que cresce para 20 ao arrastar, com o anel de 3. 224 não tem token: sai de dois `--space-24` e um `--space-8`.
    O anel é BRANCO nos dois temas, e não um token de tema: ele fica sobre a cor escolhida, e não sobre a página.
@@ -3662,6 +3662,17 @@ img,svg { display:block; }
 .tabs-secondary .tab { border-radius:0; }
 .tabs-secondary .tab.active,.tabs-secondary .tab[data-active] { background:transparent; box-shadow:none; color:var(--foreground); }
 .tabs-secondary .tab[data-active]::after { display:block; }
+/* O ESCOLHIDO DESLIZA (S-04, 05/11/2026): no `SegmentedControl` e no `Tabs` ele PULAVA, porque o fundo do escolhido é
+   pintado no próprio item. A referência tem uma peça separada atrás dos itens, que anda. Aqui o desenho do escolhido NÃO
+   muda (as sete cores do segmento, as treze marcas e os dois temas continuam nas regras de sempre): quando a escolha
+   troca, o gancho `useDeslize` copia a pintura do NOVO escolhido para uma peça de passagem (`.selection-indicator`, atrás
+   dos itens), esconde a do item e a leva da posição de antes até a nova — a cápsula, a sombra, o aro e o fio de baixo,
+   que na aba secundária é o próprio indicador. No fim, a peça sai e o item volta a se pintar. Quem pede "reduzir
+   movimento" vê a troca de uma vez, como antes. A letra troca de cor no mesmo passo, em vez de saltar. */
+.segmented :is(button,a),.tab { transition:color var(--duration-base) var(--ease-standard); }
+.selection-indicator { position:absolute; z-index:-1; pointer-events:none; }
+.selection-indicator > span { position:absolute; }
+:is(.segmented :is(button,a),.tab)[data-sliding]::after { visibility:hidden; }
 /* `panel="plain"` (MNT-05 e C9, 06/10/2026): o painel sem caixa, como o painel de abas da
    referência. Sem recheio dos lados — o conteúdo começa na linha do que está fora do `Tabs` —, e o
    espaço de cima é o mesmo `space-3` do painel do nativo. Na vertical, quem separa é o `gap` da
@@ -3801,6 +3812,13 @@ img,svg { display:block; }
 .table tbody tr:last-child > :last-child,.table-wrap tbody tr:last-child > :last-child { border-end-end-radius:var(--table-cell-r); }
 .table tr:last-child td,.table-wrap tr:last-child td { border-bottom:0; }
 @media (hover:hover) { .table tbody tr:hover > :is(td,th),.table-wrap tbody tr:hover > :is(td,th) { background:color-mix(in oklab,var(--card) 40%,var(--surface-2)); } }
+/* A LINHA ENTRE AS FILEIRAS (MNT-38, `dividers` na `Table` e na `DataGrid` — a forma "A", aprovada pela bancada em 05/11/2026,
+   *"Pode, sem a Ember"*): a moldura de sempre e uma linha clara entre as fileiras do corpo, menos depois da última, como a
+   referência (a linha de baixo da célula, a 50% do separador). A borda de baixo da célula já existe, transparente (ADR-0072);
+   a variação só lhe dá cor — o texto a 10%, a mesma linha clara do cartão de contorno —, e nenhuma medida muda. É uma exceção
+   NOMEADA ao sem linha: só com a escolha do app, e só esta regra (`tests/unit/sem-linha.test.tsx`). A Ember fica sem ela. Sem
+   efeito no arranjo `rows`, onde cada fileira já é uma cápsula solta. */
+:is(.table.table-dividers:not(.table-rows),.datagrid-dividers .table-wrap table) tbody tr:not(:last-child) > :is(td,th):where(:not([data-brand="ember"] *)) { border-bottom-color:color-mix(in oklab,var(--foreground) 10%,transparent); }
 /* AS LINHAS EM CÁPSULA (`Table variant="rows"`, o site B — a lista de membros da página inicial, aprovada pela bancada em
    01/11/2026, o D-7.6): sem a caixa em volta; cada linha é uma cápsula de 54 (`--target-min` + 10), 4 entre elas; com o
    mouse o `--fill-1`; a linha com `data-selected` (a que o app marcou), o amarelo a 14% (18% com o mouse). O cabeçalho em
@@ -3848,6 +3866,9 @@ img,svg { display:block; }
 .table td[data-best],.table-wrap td[data-best] { font-weight:var(--weight-semibold); }
 /* `fit`: sem o mínimo de 720 — a comparação de dois itens cabe num celular de 360. */
 .table.table-fit { min-width:0; }
+/* E na `DataGrid` (S-02, *"Pode, com fit"*, 05/11/2026): o mesmo `fit` — as tabelas do site, numa coluna de texto de ~680,
+   passavam do mínimo de 720 e saíam cortadas, rolando de lado. */
+.datagrid-fit .table-wrap table { min-width:0; }
 /* `differencesOnly`: o "Só diferenças" esconde as linhas que o site marcou como iguais. */
 .table-differences-only tr[data-same] { display:none; }
 /* `stickyHeader`: o mesmo mecanismo do `DataGrid` (F6, mais abaixo). A caixa é o contêiner de
@@ -4255,8 +4276,7 @@ button.tag-main { cursor:pointer; }
 /* A CAIXA EMPILHADA (`CodeBlock previewLayout="stacked"`, o site B, 02/11/2026 — o Victor: "preciso que seja fiel a
    referencia", e "Com degradê"; ADR-0089): a peça em cima e o código embaixo, sem a chave Prévia | Código, nas medidas da
    referência — a peça em 350 (3 x 96 + 48 + 12 + 2) com recheio de 40, no fundo da página; o código no cartão, 16 em cima,
-   12 dos lados e 14 embaixo. Mais de 5 linhas: recolhido em 150 (96 + 48 + 4 + 2), sumindo num DEGRADÊ (a 3ª exceção à
-   regra sem gradiente, só nesta regra — o check 4 cobra), com o "Expand code" (32, letra 12) a 8 do fundo; aberto, o código
+   12 dos lados e 14 embaixo. Mais de 5 linhas: recolhido em 150 (96 + 48 + 4 + 2), sumindo num DEGRADÊ, com o "Expand code" (32, letra 12) a 8 do fundo; aberto, o código
    inteiro e o "Collapse code" embaixo dele. Sem linha: a peça e o código se separam pelo fundo. */
 .demo.demo-stacked { display:flex; flex-direction:column; min-block-size:0; padding:0; overflow:hidden; }
 .demo.demo-stacked > .demo-panel { flex:none; }
@@ -4696,6 +4716,14 @@ button.tag-main { cursor:pointer; }
 .sortable-item[data-grabbed] { border-color:transparent; box-shadow:var(--shadow-lg); }
 .sortable-handle { display:grid; place-items:center; min-width:var(--space-6); min-height:var(--space-6); padding:0; border:0; border-radius:var(--radius-sm); background:transparent; color:var(--muted-foreground); cursor:grab; touch-action:none; }
 .sortable-handle[aria-pressed="true"] { cursor:grabbing; color:var(--primary); }
+/* O ARRASTO QUE ANDA (S-05, 05/11/2026): era "meio estático" — a linha pulava de casa em casa e os vizinhos pulavam junto.
+   Agora a linha pega SEGUE o ponteiro (o `useReorder` a desloca com `translate`, sem transição: é a mão que move) e os
+   vizinhos deslizam para abrir o lugar (o mesmo gancho, pela animação do navegador). A linha pega fica POR CIMA das outras
+   (`z-index`) — e o fundo dela é o do cartão, opaco, então o texto de baixo não aparece através. A sombra de erguer entra
+   e sai em vez de aparecer de uma vez. Quem pede "reduzir movimento": a linha continua seguindo o ponteiro (é
+   manipulação direta, não animação), e os vizinhos trocam de lugar sem deslizar. */
+:is(.sortable-item,.block-item) { transition:box-shadow var(--duration-base) var(--ease-standard); }
+:is(.sortable-item,.block-item)[data-dragging] { position:relative; z-index:1; cursor:grabbing; }
 .sortable-label { min-width:0; }
 
 /* EDITOR POR BLOCOS (PLANO-1.0, item N1). A Aurea é dona da MOLDURA; o texto rico de dentro é do
@@ -4916,6 +4944,14 @@ button.tag-main { cursor:pointer; }
    fica preso, então não declaramos modalidade que não entregamos. */
 .command-overlay { position:fixed; inset:0; z-index:var(--z-modal); display:grid; place-items:start center; padding:var(--space-16) var(--space-5) var(--space-5); background:var(--overlay); backdrop-filter:blur(5px); }
 .command-palette { display:grid; gap:var(--space-2); width:min(680px,100%); max-height:100%; overflow:auto; padding:var(--space-4); border:1px solid transparent; border-radius:var(--radius-card); background:var(--popover); color:var(--popover-foreground); box-shadow:var(--shadow-lg); }
+/* A PALETA ENTRA E SAI (S-04, 05/11/2026), como o `Dialog`: o fundo esmaece e a caixa cresce um pouco, pelos estados
+   de abrir e fechar que o motor marca na moldura (`Viewport`) e na caixa (`Popup`). Fechar é mais rápido que abrir. */
+.command-overlay { transition:opacity var(--duration-slow) var(--ease-standard); }
+.command-overlay[data-starting-style],.command-overlay[data-ending-style] { opacity:0; }
+.command-overlay[data-ending-style] { transition-duration:var(--duration-fast); }
+.command-palette { transition:scale var(--duration-slow) var(--ease-emphasized); }
+.command-palette[data-starting-style],.command-palette[data-ending-style] { scale:.95; }
+.command-palette[data-ending-style] { transition-duration:var(--duration-fast); }
 /* Camadas flutuantes (Base UI): tooltip, popover, menu. z-modal para funcionarem sobre diálogos; empilhamento mútuo pela ordem do portal no DOM. */
 /* 0.32.0, a dica da referência: recheio de 8, letra de 12/16, até 320 de largura, o fundo das janelas
    (era o fundo afundado), e a palavra longa quebra onde precisar. O canto continua o 10 da Aurea (o
@@ -4949,6 +4985,15 @@ button.tag-main { cursor:pointer; }
    e `--space-1` de respiro. Vale para toda lista que usa `.menu`: Combobox, MultiCombobox,
    DropdownMenu, ContextMenu, Menubar e a lista da CommandPalette. */
 .menu { --menu-px:10px; z-index:var(--z-modal); min-width:200px; max-width:min(320px,calc(100vw - 32px)); padding:var(--space-1); border:1px solid transparent; border-radius:var(--radius-card); background:var(--popover); color:var(--popover-foreground); box-shadow:var(--shadow-lg); }
+/* O MENU ENTRA E SAI (S-04, 05/11/2026): aparecia de uma vez. Como o `Popover` e a dica daqui, e como a lista da
+   referência: esmaece e cresce um pouco a partir do lado do gatilho (`--transform-origin`, que o motor publica), pelos
+   estados de abrir e fechar que o motor marca (`data-starting-style`/`data-ending-style`). Vale para toda lista `.menu`
+   que o motor abre: `DropdownMenu`, `ContextMenu`, `Menubar`, o submenu, o `Select`, o `Combobox`. A lista de DENTRO da
+   `CommandPalette` (`.command-list`) não abre sozinha — quem entra é a janela, abaixo. Quem pede "reduzir movimento" não
+   vê movimento: a regra global do fim da folha zera a duração. */
+.menu { transform-origin:var(--transform-origin,center); transition:opacity var(--duration-base) var(--ease-standard),scale var(--duration-base) var(--ease-standard); }
+.menu[data-starting-style],.menu[data-ending-style] { opacity:0; scale:.95; }
+.menu[data-ending-style] { transition-duration:var(--duration-fast); }
 .menu-item { display:flex; align-items:center; gap:10px; width:100%; min-height:var(--control-h-md); padding:0 var(--menu-px,10px); border:0; border-radius:calc(var(--radius-card) - var(--space-1)); background:transparent; color:var(--foreground); font:inherit; text-align:start; text-decoration:none; cursor:pointer; }
 /* O ITEM COM EXPLICAÇÃO e o ÍCONE NA PONTA (0.55.0, o Victor, 04/11/2026: "pegue o código" da referência): a anatomia do
    item dela — o nome e, embaixo, a explicação na letra pequena e na cor de apoio; o recheio de 6 em cima e embaixo; o ícone
@@ -5339,6 +5384,10 @@ th[aria-sort] .datagrid-sort-icon { color:var(--primary); }
    provadas. */
 .datagrid-sticky thead th { position:sticky; inset-block-start:0; z-index:1; }
 .datagrid-sticky .datagrid-filters th { inset-block-start:var(--table-head-h); }
+/* S-10 (o MNT-40), `stickyHeader="page"`: o cabeçalho preso ao topo da PÁGINA, sem caixa de rolagem própria — a caixa
+   continua sem teto (uma rolagem só, a da página) e o `DataGrid` move as células do cabeçalho com `translate` enquanto a
+   página rola. Aqui só a camada: as fileiras passam POR BAIXO do cabeçalho, que já tem o fundo da moldura. */
+.datagrid-sticky-page thead th { z-index:1; }
 
 /* F7: a alça de redimensionar. Fina, colada no fim da célula e da altura toda —
    alvo estreito de propósito, porque largo demais rouba o clique do cabeçalho
@@ -6097,8 +6146,7 @@ button.graph-node-body { cursor:pointer; }
    variações saíam todas iguais: "Sim, como as outras"). O padrão dela, sem estilo escolhido, continua congelado — as
    regras do passo A continuam sem alcançá-la. Por isso o botão ligado dela, com um estilo escolhido, ganha aqui a
    pintura que o passo A dá às outras marcas (logo abaixo do 2.8).
-   As duas exceções desta seção, registradas na ADR-0084: o DEGRADÊ do `brand-gradient` (a segunda exceção à ADR-0007,
-   depois da escolha de cor da ADR-0069) e os AROS dos estilos de aro (o desenho que dá nome ao estilo — exceção nomeada à
+   A exceção desta seção, registrada na ADR-0084: os AROS dos estilos de aro (o desenho que dá nome ao estilo — exceção nomeada à
    ADR-0072, só quando o app escolhe o estilo). */
 
 /* 2.8 · O BOTÃO LIGADO (Toggle, ToggleGroup, ToolbarButton): o C, amarelo, é o padrão desde a 0.45.0 (a regra do passo A

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aurea-uds/core",
-  "version": "0.56.0",
+  "version": "0.59.0",
   "description": "O CSS da Aurea UDS e o comportamento em JavaScript puro. Importe @aurea-uds/fonts/css antes deste.",
   "keywords": [
     "aurea",