@aurea-uds/core 0.29.0 → 0.30.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.
- package/dist/aurea.css +74 -2
- package/package.json +1 -1
package/dist/aurea.css
CHANGED
|
@@ -3214,7 +3214,16 @@ th[aria-sort] .datagrid-sort-icon { color:var(--primary); }
|
|
|
3214
3214
|
--xy-edge-label-color:var(--muted-foreground);
|
|
3215
3215
|
--xy-edge-label-background-color:var(--card);
|
|
3216
3216
|
--xy-connectionline-stroke:var(--primary);
|
|
3217
|
-
--xy-attribution-background-color:transparent;
|
|
3217
|
+
--xy-attribution-background-color:transparent;
|
|
3218
|
+
/* O minimapa (ADR-0064) se veste pelas variáveis dele, como o resto do motor. */
|
|
3219
|
+
--xy-minimap-background-color:var(--card);
|
|
3220
|
+
--xy-minimap-mask-background-color:color-mix(in oklab,var(--background) 70%,transparent);
|
|
3221
|
+
--xy-minimap-mask-stroke-color:var(--border-strong);
|
|
3222
|
+
--xy-minimap-node-background-color:var(--muted-foreground);
|
|
3223
|
+
--xy-minimap-node-stroke-color:transparent;
|
|
3224
|
+
/* A espessura de base da linha: a do sistema (1). O alto contraste dobra a base, e os pesos e
|
|
3225
|
+
traços são múltiplos dela — por isso nada aqui é número solto. */
|
|
3226
|
+
--graph-edge-base:var(--border-width); }
|
|
3218
3227
|
/* A atribuição do motor (que a licença dele manda manter, e mantemos) traz `color:#999`
|
|
3219
3228
|
CRAVADO no `init.css` — o único ponto em que a folha "estrutural" carrega cor. Reprovou
|
|
3220
3229
|
contraste no axe, tema claro. A regra é de ELEMENTO e vem ESCOPADA à nossa classe, que é a
|
|
@@ -3226,7 +3235,7 @@ th[aria-sort] .datagrid-sort-icon { color:var(--primary); }
|
|
|
3226
3235
|
.dependency-graph a[href] { color:var(--muted-foreground); }
|
|
3227
3236
|
/* O nó é uma superfície flutuante como qualquer outra da Aurea — mesmo raio de cartão, mesma
|
|
3228
3237
|
borda, mesmo fundo. É aqui que ele deixa de parecer React Flow. */
|
|
3229
|
-
.graph-node { position:relative; inline-size:180px; }
|
|
3238
|
+
.graph-node { position:relative; inline-size:var(--graph-node-w,180px); }
|
|
3230
3239
|
.graph-node-body { display:grid; gap:var(--space-05); inline-size:100%; padding:var(--space-2) var(--space-3); border:1px solid var(--border); border-radius:var(--radius-card); background:var(--card); color:var(--foreground); font-family:inherit; font-size:var(--text-sm); text-align:start; }
|
|
3231
3240
|
button.graph-node-body { cursor:pointer; }
|
|
3232
3241
|
.graph-node[data-selected] .graph-node-body { border-color:var(--primary); }
|
|
@@ -3235,6 +3244,69 @@ button.graph-node-body { cursor:pointer; }
|
|
|
3235
3244
|
que esta parte recusa a mesma coisa. */
|
|
3236
3245
|
.graph-node-kind { color:var(--subtle-foreground); font-size:var(--text-xs); letter-spacing:var(--tracking-wider); text-transform:uppercase; }
|
|
3237
3246
|
.graph-handle { inline-size:var(--space-2); block-size:var(--space-2); border:1px solid var(--border); background:var(--surface-2); }
|
|
3247
|
+
/* ── RODADA 1 DA REDE (ADR-0064, 10/10/2026) ───────────────────────────────────────────────
|
|
3248
|
+
O ÍCONE vai ao lado do texto, e o texto continua inteiro (o tipo é PALAVRA — a recusa das cores
|
|
3249
|
+
continua de pé). Os SELOS sentam na borda, nos cantos: a quantidade em cima, à direita; o estado
|
|
3250
|
+
embaixo, à esquerda — longe um do outro, e fora do nome. */
|
|
3251
|
+
/* A alça do grafo de LEITURA existe só para o motor medir a borda: invisível e surda ao ponteiro. */
|
|
3252
|
+
.graph-handle-oculta { visibility:hidden; pointer-events:none; }
|
|
3253
|
+
.graph-node-text { display:grid; gap:var(--space-05); min-inline-size:0; }
|
|
3254
|
+
.graph-node-has-icon { grid-template-columns:auto minmax(0,1fr); align-items:center; column-gap:var(--space-2); }
|
|
3255
|
+
.graph-node-icon { color:var(--muted-foreground); }
|
|
3256
|
+
.graph-node-count { position:absolute; inset-block-start:0; inset-inline-end:0; transform:translate(25%,-50%); }
|
|
3257
|
+
.graph-node-status { position:absolute; inset-block-end:0; inset-inline-start:var(--space-3); max-inline-size:calc(100% - var(--space-6)); transform:translateY(50%); }
|
|
3258
|
+
.graph-node-status .badge { max-inline-size:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
|
|
3259
|
+
/* "Ir até" (focusId): a marca de achado é a borda da marca com uma linha por dentro, como o
|
|
3260
|
+
cartão escolhido — e não o anel de foco, que é do teclado. */
|
|
3261
|
+
.graph-node[data-focused] .graph-node-body { border-color:var(--primary); box-shadow:inset 0 0 0 var(--border-width) var(--primary); }
|
|
3262
|
+
/* O resto apaga quando há caminho ou vizinhos acesos (MNT-18.3 e 18.6). */
|
|
3263
|
+
.graph-node[data-dimmed] { opacity:.3; }
|
|
3264
|
+
.dependency-graph .is-dimmed { opacity:.25; }
|
|
3265
|
+
/* AS LINHAS: o desenho diz o que ela é, sem depender de cor (MNT-08 e MNT-15).
|
|
3266
|
+
⚠ A ESPESSURA VAI PELA VARIÁVEL DO MOTOR (`--xy-edge-stroke-width`), e não por `stroke-width`:
|
|
3267
|
+
esta folha mora numa camada (`@layer aurea`) e a do motor não — e regra sem camada ganha de regra
|
|
3268
|
+
com camada, qualquer que seja a força do seletor. Medido na bancada da rodada 1: a fibra saía com
|
|
3269
|
+
1 de espessura em vez de 6. A variável não tem rival na linha, então a nossa vale. O `stroke-width`
|
|
3270
|
+
fica para os desenhos que são nossos (a amostra da legenda e o miolo do traço duplo). */
|
|
3271
|
+
.dependency-graph .graph-edge { --graph-edge-w:var(--graph-edge-base); --xy-edge-stroke-width:var(--graph-edge-w); stroke-width:var(--graph-edge-w); }
|
|
3272
|
+
.dependency-graph .graph-edge-thick { --graph-edge-w:calc(var(--graph-edge-base) * 2); }
|
|
3273
|
+
.dependency-graph .graph-edge-heavy { --graph-edge-w:calc(var(--graph-edge-base) * 3); }
|
|
3274
|
+
.dependency-graph .graph-edge-dashed { stroke-dasharray:var(--space-2) var(--space-1); }
|
|
3275
|
+
.dependency-graph .graph-edge-dotted { --xy-edge-stroke-width:calc(var(--graph-edge-w) * 2); stroke-width:calc(var(--graph-edge-w) * 2); stroke-dasharray:0 calc(var(--graph-edge-w) * 5); stroke-linecap:round; }
|
|
3276
|
+
.dependency-graph .graph-edge-double { --xy-edge-stroke-width:calc(var(--graph-edge-w) * 3); stroke-width:calc(var(--graph-edge-w) * 3); }
|
|
3277
|
+
.graph-edge-double-core { --graph-edge-w:var(--graph-edge-base); fill:none; stroke:var(--xy-edge-label-background-color); stroke-width:var(--graph-edge-w); pointer-events:none; }
|
|
3278
|
+
.graph-edge-double-core.graph-edge-thick { --graph-edge-w:calc(var(--graph-edge-base) * 2); }
|
|
3279
|
+
.graph-edge-double-core.graph-edge-heavy { --graph-edge-w:calc(var(--graph-edge-base) * 3); }
|
|
3280
|
+
/* A pastilha do meio (marca, número, grupo) e o nome da porta na ponta são HTML sobre o desenho. */
|
|
3281
|
+
.graph-edge-chip { position:absolute; display:inline-flex; align-items:center; gap:var(--space-1); padding:var(--space-05) var(--space-2); border-radius:var(--radius-control); background:var(--xy-edge-label-background-color); color:var(--xy-edge-label-color); font-size:var(--graph-edge-label-size,var(--text-xs)); line-height:var(--leading-tight); white-space:nowrap; pointer-events:all; }
|
|
3282
|
+
.graph-edge-end { position:absolute; padding:0 var(--space-1); border-radius:var(--radius-xs); background:var(--xy-edge-label-background-color); color:var(--xy-edge-label-color); font-size:var(--graph-edge-label-size,var(--text-xs)); line-height:var(--leading-tight); white-space:nowrap; pointer-events:none; }
|
|
3283
|
+
/* `nodrag`/`nopan`: a pastilha é HTML sobre o mapa, e as duas classes dizem ao motor para não arrastar
|
|
3284
|
+
nem rolar a tela por ela (o botão do grupo precisa do clique). Fora do botão, o cursor é o comum. */
|
|
3285
|
+
.graph-edge-chip.nodrag.nopan { cursor:default; }
|
|
3286
|
+
.graph-edge-count { font-variant-numeric:tabular-nums; font-weight:var(--weight-medium); }
|
|
3287
|
+
.graph-edge-group { display:inline-flex; align-items:center; min-block-size:var(--space-5); padding:0 var(--space-2); border:var(--border-width) solid var(--border-strong); border-radius:var(--radius-control); background:var(--secondary); color:var(--foreground); font:inherit; font-variant-numeric:tabular-nums; font-weight:var(--weight-medium); cursor:pointer; }
|
|
3288
|
+
.graph-edge-group[aria-expanded="true"] { border-color:var(--primary-outline); }
|
|
3289
|
+
.graph-edge-mark { display:inline-grid; place-items:center; color:var(--foreground); }
|
|
3290
|
+
.graph-edge-mark-cross:before { content:"\2715"; font-weight:var(--weight-bold); }
|
|
3291
|
+
.graph-edge-mark-dot { inline-size:var(--space-2); block-size:var(--space-2); border-radius:var(--radius-full); background:currentColor; }
|
|
3292
|
+
/* Os botões de zoom, o minimapa e a legenda flutuam sobre o mapa, com a pele de cartão. */
|
|
3293
|
+
.graph-controls { display:flex; gap:var(--space-1); padding:var(--space-1); border:var(--border-width) solid var(--border); border-radius:var(--radius-control); background:var(--card); }
|
|
3294
|
+
.graph-minimap { border:var(--border-width) solid var(--border); border-radius:var(--radius-md); overflow:hidden; }
|
|
3295
|
+
.graph-legend { display:grid; gap:var(--space-1); margin:0; padding:var(--space-2) var(--space-3); list-style:none; border:var(--border-width) solid var(--border); border-radius:var(--radius-md); background:var(--card); color:var(--foreground); font-size:var(--graph-edge-label-size,var(--text-xs)); }
|
|
3296
|
+
.graph-legend li { display:flex; align-items:center; gap:var(--space-2); }
|
|
3297
|
+
.graph-legend-sample { inline-size:var(--space-8); block-size:var(--space-2); overflow:visible; }
|
|
3298
|
+
.graph-legend-sample .graph-edge,.graph-legend-sample .graph-edge-double-core { fill:none; }
|
|
3299
|
+
.graph-legend-sample .graph-edge { stroke:var(--xy-edge-stroke); }
|
|
3300
|
+
/* TEXTO MAIOR, independente do zoom (MNT-19.3): o rótulo do nó vai a `--text-base`, o resto a
|
|
3301
|
+
`--text-sm`, e a caixa cresce na mesma razão (a conta mora no graph.tsx). */
|
|
3302
|
+
.dependency-graph[data-text="lg"] { --graph-edge-label-size:var(--text-sm); }
|
|
3303
|
+
.dependency-graph[data-text="lg"] .graph-node-body { font-size:var(--text-base); }
|
|
3304
|
+
.dependency-graph[data-text="lg"] .graph-node-kind,.dependency-graph[data-text="lg"] .graph-node-body .hint { font-size:var(--text-sm); }
|
|
3305
|
+
/* ALTO CONTRASTE (MNT-19.3): linha e letra no tom da letra, a base da linha dobra, e a borda do nó
|
|
3306
|
+
também. Tudo o mais (pesos, pontilhado, duplo) é múltiplo da base e acompanha sozinho. */
|
|
3307
|
+
.dependency-graph[data-contrast="high"] { --xy-edge-stroke:var(--foreground); --xy-edge-label-color:var(--foreground); --graph-edge-base:calc(var(--border-width) * 2); }
|
|
3308
|
+
.dependency-graph[data-contrast="high"] .graph-node-body { border-color:var(--foreground); border-width:calc(var(--border-width) * 2); }
|
|
3309
|
+
.dependency-graph[data-contrast="high"] .graph-node-kind,.dependency-graph[data-contrast="high"] .graph-node-icon { color:var(--foreground); }
|
|
3238
3310
|
.datagrid tbody tr[data-selected] { background:color-mix(in srgb,var(--primary) 14%,transparent); }
|
|
3239
3311
|
.datagrid-empty { padding:var(--space-6); color:var(--muted-foreground); text-align:center; }
|
|
3240
3312
|
|