@aurea-uds/core 0.36.0 → 0.37.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (2) hide show
  1. package/dist/aurea.css +56 -11
  2. package/package.json +1 -1
package/dist/aurea.css CHANGED
@@ -5,6 +5,7 @@
5
5
  --brand-yellow-foreground:oklch(0.421 0.095 57.708);
6
6
  --brand-yellow-text:oklch(0.516 0.105 86.047);
7
7
  --brand-yellow-ink:#242424;
8
+ --brand-blue:#0246f1;
8
9
  --white:oklch(1 0 0);
9
10
  --black:oklch(0 0 0);
10
11
  --font-ui:"Atkinson Hyperlegible Next","Segoe UI",sans-serif;
@@ -248,8 +249,8 @@
248
249
  --popover-foreground:#242424;
249
250
  --primary:var(--brand-yellow);
250
251
  --primary-foreground:var(--brand-yellow-ink);
251
- --link:var(--brand-yellow);
252
- --link-hover:var(--brand-yellow);
252
+ --link:var(--brand-blue);
253
+ --link-hover:var(--brand-blue);
253
254
  --secondary:#ebebeb;
254
255
  --secondary-foreground:#242424;
255
256
  --muted:var(--secondary);
@@ -290,8 +291,8 @@
290
291
  --segment:oklch(1 0 0);
291
292
  --focus:var(--primary);
292
293
  --focus-strong:var(--foreground);
293
- --primary-emphasis:var(--brand-yellow);
294
- --primary-outline:var(--brand-yellow);
294
+ --primary-emphasis:var(--brand-blue);
295
+ --primary-outline:var(--brand-blue);
295
296
  --control-selected:var(--brand-yellow);
296
297
  --control-selected-foreground:var(--brand-yellow-ink);
297
298
  --control-selected-dot:oklch(0.985 0 0);
@@ -1977,6 +1978,11 @@ img,svg { display:block; }
1977
1978
  linha passa a ser só o adorno de 100%, que é o que se quer. */
1978
1979
  .input-group>.input,.input-group>.select,.input-group>.textarea { flex:1 1 0; min-inline-size:0; background:transparent; border:0; border-radius:0; }
1979
1980
  .input-group>.input:focus-visible,.input-group>.select:focus-visible,.input-group>.textarea:focus-visible { outline:none; }
1981
+ /* Desativado (lote 1, 20/10/2026): no grupo, quem pinta o estado é a moldura, como no inválido — só o texto recuava, e o
1982
+ fundo e o ícone ficavam iguais. O campo de dentro não recua de novo (seriam 0,25). Só o CAMPO conta: um botão
1983
+ desativado no adorno (o de limpar, sem texto) não desativa o grupo. */
1984
+ .input-group:has(> :is(.input,.select,.textarea):disabled) { opacity:var(--opacity-disabled); cursor:not-allowed; }
1985
+ .input-group>.input:disabled,.input-group>.select:disabled,.input-group>.textarea:disabled { opacity:1; }
1980
1986
  /* O adorno não estica nem encolhe, e nunca rouba o clique do campo — a menos que ele PRÓPRIO
1981
1987
  seja clicável, e aí quem devolve o ponteiro é o botão de dentro. */
1982
1988
  .input-group-addon { display:inline-flex; flex:none; align-items:center; gap:var(--space-1); color:var(--subtle-foreground); }
@@ -2082,7 +2088,9 @@ img,svg { display:block; }
2082
2088
  de virar a seta seriam dois idiomas para "isto está aberto". */
2083
2089
  .collapsible { display:grid; }
2084
2090
  .collapsible-trigger { display:flex; align-items:center; gap:var(--space-2); inline-size:100%; min-block-size:var(--control-h-sm); padding:0; border:0; background:transparent; color:var(--foreground); font:inherit; font-weight:var(--weight-medium); text-align:start; cursor:pointer; }
2085
- .collapsible-trigger:hover { color:var(--primary); }
2091
+ .collapsible-trigger:hover:not([data-disabled]) { color:var(--primary); }
2092
+ /* Desativado (lote 1, 20/10/2026): o motor marca o gatilho com `data-disabled`; ele recua e não acende no hover. */
2093
+ .collapsible-trigger[data-disabled] { opacity:var(--opacity-disabled); cursor:not-allowed; }
2086
2094
  .collapsible-chevron { flex:none; transition:transform var(--duration-fast) var(--ease-standard); }
2087
2095
  .collapsible-trigger[data-panel-open] .collapsible-chevron { transform:rotate(180deg); }
2088
2096
  .collapsible-panel { overflow:hidden; }
@@ -2203,6 +2211,10 @@ img,svg { display:block; }
2203
2211
  .switch-track:after { --thumb-h:calc(var(--switch-h) - 2 * var(--space-05)); --thumb-w:calc(var(--thumb-h) * 11 / 8); content:""; position:absolute; inset-inline-start:calc(var(--space-05) - var(--border-width)); top:calc(var(--space-05) - var(--border-width)); block-size:var(--thumb-h); inline-size:var(--thumb-w); border-radius:var(--radius-full); background:var(--muted-foreground); transition:transform var(--duration-base) var(--ease-standard),background var(--duration-base) var(--ease-standard); }
2204
2212
  .switch-track { --switch-x:calc(var(--switch-h) * 2 - (var(--switch-h) - 2 * var(--space-05)) * 11 / 8 - 2 * var(--space-05)); }
2205
2213
  .switch input:checked + .switch-track { background:var(--control-selected); border-color:transparent; } .switch input:checked + .switch-track:after { transform:translateX(var(--switch-x)); background:var(--primary-mark); }
2214
+ /* DESATIVADO (lote 1, as travas, 20/10/2026 — o check 49 achou): o `<input>` é invisível e quem desenha é a marca,
2215
+ então o `disabled` chegava ao campo e nada mudava na tela. A peça inteira recua, marca e nome, como na referência
2216
+ (o estado de desativado dela vai na raiz do controle, a 0,5). Vale também para as opções de um grupo desativado. */
2217
+ .checkbox:has(> input:disabled),.radio:has(> input:disabled),.switch:has(> input:disabled) { opacity:var(--opacity-disabled); cursor:not-allowed; }
2206
2218
  .range { width:100%; accent-color:var(--primary); }
2207
2219
  /* Slider VERTICAL, no `<input type=range>` NATIVO — sem trocar de motor.
2208
2220
 
@@ -2369,7 +2381,14 @@ img,svg { display:block; }
2369
2381
  .btn[aria-pressed="true"]:not(.btn-icon)::after,.segmented button.active::after,.tabs-secondary .tab[data-active]::after,
2370
2382
  .doc-nav a.active::after,.sidebar-item[aria-current]::after { content:""; position:absolute; inset-inline:15px; bottom:0; height:2px; border-radius:var(--radius-full); background:color-mix(in oklab, var(--primary) 75%, transparent); }
2371
2383
  /* e o fio do ativo da lateral segue a marca DELA, pelo mesmo motivo da regra de cor acima. */
2372
- .doc-nav a.active::after,.sidebar-item[aria-current]::after { background:color-mix(in oklab, var(--sidebar-primary) 75%, transparent); }
2384
+ .doc-nav a.active::after,.sidebar-item[aria-current]::after { background:var(--sidebar-current-line, color-mix(in oklab, var(--sidebar-primary) 75%, transparent)); }
2385
+ /* ADR-0076 (20/10/2026), o Victor olhando a bancada: "não quero ele azul, não pode ser na cor do botão?". No claro da Aurea
2386
+ padrão, o item atual da lateral é o botão primário: o fundo amarelo e a letra cinza-escura dele (8,13:1). O fundo já
2387
+ marca o estado, e o fio de baixo some (`--sidebar-current-line` transparente: regra no `::after` não aceitaria a guarda
2388
+ de tema no fim). Só sem `data-brand` (a `lory` tem a lateral dela) e só no claro (no escuro, a letra amarela continua).
2389
+ Sobre o amarelo, a letra de destaque de DENTRO do item (o selo primário de contagem, um ícone de destaque) é a tinta do
2390
+ botão: o azul sobre o amarelo mede 3,49:1 — o axe da varredura achou, no "12" do exemplo da `Sidebar`. */
2391
+ [data-theme="light"] :is(.sidebar-item[aria-current],.doc-nav a.active):not(:where([data-brand],[data-brand] *)):where(:not([data-theme="dark"] *),[data-theme="dark"] [data-theme="light"] *) { --sidebar-current-line:transparent; --primary-emphasis:var(--primary-foreground); --sidebar-primary:var(--primary-foreground); background:var(--primary); color:var(--primary-foreground); }
2373
2392
  [data-theme="light"] .is-selected:where(:not([data-theme="dark"] *),[data-theme="dark"] [data-theme="light"] *),[data-theme="light"] .btn-nav[aria-current]:not([aria-current="false"]):where(:not([data-theme="dark"] *),[data-theme="dark"] [data-theme="light"] *),
2374
2393
  [data-theme="light"] .btn[aria-pressed="true"]:where(:not([data-theme="dark"] *),[data-theme="dark"] [data-theme="light"] *),[data-theme="light"] .segmented button.active:where(:not([data-theme="dark"] *),[data-theme="dark"] [data-theme="light"] *)
2375
2394
  { --btn-fg:color-mix(in oklab, var(--primary) 45%, var(--foreground)); color:color-mix(in oklab, var(--primary) 45%, var(--foreground)); }
@@ -2397,9 +2416,14 @@ img,svg { display:block; }
2397
2416
  numa fila, `align-self:flex-start` tiraria o selo do meio; o tamanho definido só desliga o
2398
2417
  esticar, que é o que a coluna faz com um item sem tamanho. */
2399
2418
  .badge-fit { inline-size:fit-content; }
2400
- /* O cheio da marca enche com o acento e escreve com a letra do botão amarelo (`--primary-foreground`): desde a ADR-0073
2401
- o acento do claro é o próprio amarelo, e a letra de antes (`--background`, clara) media 1,75:1 em cima dele. */
2419
+ /* O cheio da marca escreve com a letra do botão amarelo (`--primary-foreground`): na ADR-0073 o acento do claro virou o
2420
+ próprio amarelo, e a letra de antes (`--background`, clara) media 1,75:1 em cima dele. O fundo, na Aurea padrão, é o
2421
+ primário desde a ADR-0076 (a regra logo abaixo). */
2402
2422
  .badge-primary { --badge-accent:var(--primary-emphasis); --badge-on:var(--primary-foreground); color:var(--primary-emphasis); border-color:transparent; background:color-mix(in srgb,var(--primary) 10%,transparent); }
2423
+ /* ADR-0076 (20/10/2026): na Aurea padrão a letra de destaque do claro é o AZUL, e o cheio continua o AMARELO — o fundo do
2424
+ selo cheio é o primário, e não o acento (com o acento, sairia a letra cinza no azul, 1,99:1). Só sem `data-brand`, como o
2425
+ contorno lá embaixo: na `lory` do claro o primário com a letra dela mede 3,08:1, e o acento dela já é o fundo certo. */
2426
+ .badge-primary:not(:where([data-brand],[data-brand] *)) { --badge-fill:var(--primary); }
2403
2427
  /* TAMANHOS. O md é a base (24px), que não muda — é o que as 103 fichas já usam. */
2404
2428
  .badge-xs { min-height:var(--space-4); padding:0 var(--space-1); border-width:0; }
2405
2429
  .badge-sm { min-height:var(--space-5); padding:0 calc(var(--space-1) + var(--space-05) - var(--border-width)); }
@@ -2485,7 +2509,7 @@ img,svg { display:block; }
2485
2509
  tema: `--success-400` é verde CLARO no escuro e verde ESCURO no claro. */
2486
2510
  /* O selo CHEIO de estado é o botão cheio do mesmo tom (ADR-0061): a mesma cor funda e a mesma letra
2487
2511
  (`--badge-fill`/`--badge-on`). Quem não declara o par (as categorias, o neutro) segue enchendo com o
2488
- acento, como antes; a marca enche com o acento e declara só a letra (ADR-0073). */
2512
+ acento, como antes; a marca declara a letra (ADR-0073) e, na Aurea padrão, o fundo é o primário (ADR-0076). */
2489
2513
  .badge-solid { background:var(--badge-fill, var(--badge-accent)); color:var(--badge-on, var(--background)); border-color:transparent; }
2490
2514
  .badge-outline { background:transparent; color:var(--badge-accent); border-color:transparent; }
2491
2515
  /* flat (15/10/2026): o tom de sempre sem a linha em volta — o selo da referência não tem borda em forma nenhuma. A
@@ -3068,6 +3092,26 @@ button.tag-main { cursor:pointer; }
3068
3092
  é inalcançável por teclado (axe scrollable-region-focusable). Quem escreve esta marcação à
3069
3093
  mão precisa de `tabindex="0"` no <pre> — o componente React já o emite. */
3070
3094
  .code-block { overflow:auto; padding:16px; border:1px solid transparent; border-radius:var(--radius-lg); background:var(--surface-inset); color:var(--muted-foreground); font:12px/1.7 var(--font-code); }
3095
+ /* Lote V (20/10/2026): o número da linha e as cores do código (`CodeBlock lineNumbers` e `highlight`). O número é o da
3096
+ referência, medido na página dela: uma coluna de 16 (--space-4), alinhada à direita, a 24 do código (--space-6); ela
3097
+ cresce com os algarismos da última linha (`--code-line-digits`, que o componente escreve), para a coluna não pular
3098
+ na linha 100. A cor é a apagada da Aurea, que se lê (a da referência apaga até ~2:1). O número é DESENHO: não entra
3099
+ no texto copiado (`user-select:none`) nem no leitor de tela (o texto alternativo vazio depois da barra; quem não
3100
+ entende a barra fica com a linha de cima).
3101
+ As cores são as do `CodeEditor` (o `aureaHighlightStyle`), pelos mesmos tokens. Com cor, o texto sem cor é o do
3102
+ tema (`--foreground`), e não o apagado: o apagado fica para o comentário. */
3103
+ .code-block-numbered { counter-reset:aurea-linha; }
3104
+ .code-block-numbered .code-line::before { counter-increment:aurea-linha; content:counter(aurea-linha); content:counter(aurea-linha) / ""; display:inline-block; min-inline-size:max(var(--space-4), calc(var(--code-line-digits, 2) * 1ch)); margin-inline-end:var(--space-6); color:var(--muted-foreground); text-align:end; -webkit-user-select:none; user-select:none; }
3105
+ .code-block-highlighted { color:var(--foreground); }
3106
+ .code-block .tok-comment { color:var(--muted-foreground); font-style:italic; }
3107
+ /* As cores levam 20% do texto, como o nível do registro, que mora no mesmo fundo (`.log-stream`, ADR-0072): puras, o azul
3108
+ caía a 4,08:1 no claro e o verde a 4,44:1 no escuro (medido no site, 20/10/2026). */
3109
+ .code-block .tok-keyword { color:color-mix(in oklab,var(--info-400) 80%,var(--foreground)); }
3110
+ .code-block .tok-string { color:color-mix(in oklab,var(--success-400) 80%,var(--foreground)); }
3111
+ .code-block .tok-number { color:color-mix(in oklab,var(--warning-400) 80%,var(--foreground)); }
3112
+ .code-block .tok-property { color:var(--foreground); }
3113
+ .code-block .tok-function { color:var(--foreground); font-weight:var(--weight-semibold); }
3114
+ .code-block .tok-invalid { color:color-mix(in oklab,var(--danger-400) 80%,var(--foreground)); }
3071
3115
  /* Bloco de código COM copiar: a moldura não rola, o <pre> rola por dentro e o gatilho fica
3072
3116
  parado no canto. O comportamento é do core (aurea.js, [data-aurea-copy]); aqui só a pele.
3073
3117
  O check em amarelo é confirmação instantânea — dura 1,5s e volta ao ícone de copiar. */
@@ -4653,8 +4697,9 @@ button.graph-node-body { cursor:pointer; }
4653
4697
  da "C" dos botões): com a letra de sempre, o verde caía a 3,79:1 no claro e o `success` a 4,15:1 no escuro, dentro do
4654
4698
  cartão. Medido em 16/10/2026: o pior caso passa a 4,79:1. Os outros selos (suave, plano) têm fundo próprio e não mudam. */
4655
4699
  .badge-outline { background-color:color-mix(in oklab,var(--badge-accent) 16%,transparent); color:color-mix(in oklab,var(--badge-accent) 80%,var(--foreground)); }
4656
- /* Menos o primário da Aurea (ADR-0073, decisão do Victor de 18/10/2026, "A"): a letra é o próprio amarelo, a mesma
4657
- do selo suave e do botão de contorno da marca — misturado ao texto, ele virava mostarda (2,36:1) só nesta peça. A
4700
+ /* Menos o primário da Aurea (ADR-0073, decisão do Victor de 18/10/2026, "A"): a letra é o próprio acento (o amarelo no
4701
+ escuro; o azul no claro, desde a ADR-0076), a mesma do selo suave e do botão de contorno da marca — misturado ao texto,
4702
+ o amarelo virava mostarda (2,36:1) só nesta peça. A
4658
4703
  referência principal usa a mesma letra no suave e no contorno. Só sem `data-brand`: na `lory` do claro, sem a
4659
4704
  mistura, a letra cairia de 5,56 para 4,42:1. */
4660
4705
  .badge-primary.badge-outline:not(:where([data-brand],[data-brand] *)) { color:var(--badge-accent); }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aurea-uds/core",
3
- "version": "0.36.0",
3
+ "version": "0.37.0",
4
4
  "description": "O CSS da Aurea UDS e o comportamento em JavaScript puro. Importe @aurea-uds/fonts/css antes deste.",
5
5
  "keywords": [
6
6
  "aurea",