@aurea-uds/core 0.8.14 → 0.9.0

package/dist/aurea.css

@@ -470,6 +470,11 @@ img,svg { display:block; }
    de um piso: sem `min-height` ele mede ZERO num pai que não define altura, e desaparece. */
 .separator { flex:none; width:100%; height:1px; margin:0; border:0; background:var(--border); }
 .separator-vertical { align-self:stretch; width:1px; height:auto; min-height:var(--space-2); }
+/* spacing (C-04): os três degraus da ADR-0051. Na vertical a folga vai para os lados. */
+.separator-space-tight { margin-block:var(--space-2); } .separator-space-normal { margin-block:var(--space-4); } .separator-space-loose { margin-block:var(--space-6); }
+.separator-vertical.separator-space-tight { margin-block:0; margin-inline:var(--space-2); }
+.separator-vertical.separator-space-normal { margin-block:0; margin-inline:var(--space-4); }
+.separator-vertical.separator-space-loose { margin-block:0; margin-inline:var(--space-6); }
 /* Grid: o terceiro primitivo de layout, com o mesmo gap do .stack. A pele nasceu na Fase 11
    (achado A13): o componente existia desde sempre e saía `display:block` — empilhava. Ninguém
    via porque o chrome do catálogo REDEFINIA .grid, então ele parecia pronto na nossa
@@ -477,6 +482,15 @@ img,svg { display:block; }
    estoura o contêiner quando o texto vai a 200% e a coluna fica maior que a caixa (lição do
    M12); --grid-min é o botão de ajuste, no idioma de --qr-module e --demo-height. */
 .grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(var(--grid-min,15rem),100%),1fr)); gap:var(--space-4); }
+/* B-01 (24/09/2026): as props de layout. `gap` tem três degraus — ADR-0051. Os nomes de alinhamento
+   são os mesmos do `Cluster` nativo (R-09). Sem prop, nenhuma destas classes sai. */
+.stack-gap-tight,.cluster-gap-tight,.grid-gap-tight { gap:var(--space-2); }
+.stack-gap-loose,.cluster-gap-loose,.grid-gap-loose { gap:var(--space-6); }
+.stack-align-start { align-items:flex-start; } .stack-align-center { align-items:center; } .stack-align-end { align-items:flex-end; }
+.cluster-align-start { align-items:flex-start; } .cluster-align-end { align-items:flex-end; } .cluster-align-baseline { align-items:baseline; }
+.cluster-justify-center { justify-content:center; } .cluster-justify-end { justify-content:flex-end; } .cluster-justify-between { justify-content:space-between; }
+.cluster-nowrap { flex-wrap:nowrap; }
+.grid-fixed { grid-template-columns:repeat(var(--grid-cols,1),minmax(0,1fr)); }
 
 /* ========================================================================== */
 /* 03. APP SHELL E DOCUMENTAÇÃO                                                */
@@ -939,6 +953,8 @@ img,svg { display:block; }
 .btn-xl { --step-h:var(--control-h-xl); --step-px:26px; --step-gap:10px; --step-fs:var(--text-base); border-radius:var(--radius-control); }
 /* Largura total: para rodapé de formulário e tela estreita. Só a largura muda. */
 .btn-block { width:100%; }
+/* grow (C-03): parte igual de uma fila. `min-width:0` deixa o rótulo encolher em vez de estourar. */
+.btn-grow { flex:1 1 0%; min-width:0; }
 /* SKIP LINK — WCAG 2.2 SC 2.4.1 (Bypass Blocks), nível A.
    Medido em 21/08/2026: existia só no `apps/docs/index.html`, escrito à mão. O core não tinha,
    o `AppShell` não tinha, e as 200 páginas do catálogo não tinham — ou seja, a página de
@@ -1517,6 +1533,8 @@ img,svg { display:block; }
 .status-offline .status-dot { background:transparent; box-shadow:inset 0 0 0 2px currentColor,0 0 0 3px color-mix(in srgb,currentColor 14%,transparent); }
 
 .card { min-width:0; padding:var(--card-pad); border:1px solid var(--border); border-radius:var(--radius-card); background:var(--card); color:var(--card-foreground); box-shadow:none; }
+/* padding="none" (C-05): sem respiro, e a mídia recortada no raio 22 do próprio cartão. */
+.card-flush { padding:0; overflow:hidden; }
 .card-raised { box-shadow:none; } .card-inset { background:var(--secondary); }
 /* A variante interativa é o ALVO, e desde o G-A11Y-11 ela exige `render` — o elemento vem de
    quem consome, e é `<button>` ou `<a href>` conforme a promessa seja ação ou navegação.
@@ -2038,11 +2056,20 @@ img,svg { display:block; }
 .icon-tile { min-height:86px; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; gap:12px; padding:13px; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--secondary); color:var(--muted-foreground); cursor:pointer; text-align:start; transition:transform var(--duration-fast) var(--ease-standard),border-color var(--duration-fast),color var(--duration-fast); }
 @media (hover:hover) and (pointer:fine) { .icon-tile:hover { color:var(--foreground); border-color:var(--primary); transform:translateY(-1px); } } .icon-tile:focus-visible { color:var(--foreground); border-color:var(--primary); } .icon-tile span { overflow:hidden; max-width:100%; text-overflow:ellipsis; white-space:nowrap; font:11px var(--font-code); }
 .dialog-backdrop { position:fixed; inset:0; z-index:var(--z-modal); background:var(--overlay); backdrop-filter:blur(5px); }
-.dialog { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); z-index:var(--z-modal); width:min(560px,calc(100vw - 40px)); max-height:calc(100vh - 40px); overflow:auto; padding:24px; border:1px solid var(--border); border-radius:var(--radius-card); background:var(--popover); color:var(--popover-foreground); box-shadow:var(--shadow-lg); }
+.dialog { position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); z-index:var(--z-modal); width:min(28rem,calc(100vw - 40px)); max-height:calc(100vh - 40px); overflow:auto; padding:24px; border:1px solid var(--border); border-radius:var(--radius-card); background:var(--popover); color:var(--popover-foreground); box-shadow:var(--shadow-lg); }
+/* size (B-03), decisão do Victor em 24/09/2026: as quatro larguras do HeroUI — `max-w-xs` a
+   `max-w-lg` do @heroui/styles 3.2.6, 20/24/28/32rem = 320/384/448/512 — mais 1024 (o token
+   --breakpoint-lg) e a tela cheia. O padrão passou a ser o `md` do HeroUI, 448; até a 0.8.14
+   era 560. */
+.dialog-xs { width:min(20rem,calc(100vw - 40px)); }
+.dialog-sm { width:min(24rem,calc(100vw - 40px)); }
+.dialog-lg { width:min(32rem,calc(100vw - 40px)); }
+.dialog-xl { width:min(var(--breakpoint-lg),calc(100vw - 40px)); }
+.dialog-full { width:calc(100vw - 40px); height:calc(100vh - 40px); }
 .dialog>header,.drawer>header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:16px; } .dialog-body { display:grid; gap:14px; }
 /* O ConfirmDialog é o MESMO `.dialog` — não nasce uma segunda superfície flutuante, que seria a
    pele divergindo como divergiu entre `.table-wrap` e `.table-region`. O que muda é a caixa mais
-   estreita (uma frase e dois botões não precisam de 560px) e o rodapé alinhado ao fim, com o
+   estreita (uma frase e dois botões não precisam da largura do Dialog) e o rodapé alinhado ao fim, com o
    destrutivo por último: a ordem visual é cancelar → agir, e é onde as quatro referências batem. */
 .dialog-confirm { width:min(420px,calc(100vw - 40px)); }
 .dialog-confirm>footer { display:flex; justify-content:flex-end; gap:var(--space-2); margin-block-start:var(--space-5); }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aurea-uds/core",
-  "version": "0.8.14",
+  "version": "0.9.0",
   "description": "The Aurea UDS stylesheet and its vanilla behaviour. Import @aurea-uds/fonts/css before this.",
   "keywords": [
     "aurea",