@aurea-uds/react 0.1.0 → 0.3.0

package/dist/pure.js

@@ -0,0 +1,111 @@
+// A METADE SEM ESTADO do internal.tsx — Parte A do PLANO-1.0 (06/08/2026).
+//
+// Existe por uma razão só, e ela é a mesma da Parte A vista uma camada abaixo: o `internal.tsx`
+// precisa de `"use client"` (ele chama `createContext`), e num empacotador de RSC TODO export de
+// um módulo com a diretiva vira REFERÊNCIA de cliente. O `cx` continuaria importável de um
+// componente de servidor e quebraria ao ser CHAMADO — no consumidor, não aqui.
+//
+// Então o que não tem estado mora neste arquivo, SEM diretiva. O `internal.tsx` reexporta para os
+// módulos de cliente não precisarem saber da diferença; o barril (`index.tsx`, que também é de
+// servidor) importa DAQUI.
+//
+// Mesmo desenho da referência: no shadcn/ui o `cn` mora em `lib/utils.ts` sem diretiva, enquanto
+// 43 dos 57 componentes de `registry/bases/aria/ui` a declaram — medido em 06/08/2026.
+//
+// `.tsx` sem JSX de propósito: os checks 11, 19 e 26 varrem `packages/react/src/*.tsx`, e um
+// `.ts` aqui seria um arquivo que gate nenhum enxerga.
+export const cx = (...v) => v.filter(Boolean).join(" ");
+export const universalStates = ["waiting_user", "waiting_approval", "waiting_dependency", "offline", "stale", "partial", "degraded"];
+// Nenhum dos sete é FALHA: nos sete a tela AINDA SERVE, e é isso que os separa de `error`. Por
+// isso o teto de gravidade é `warning` e `danger` não aparece — quem espera é informado, quem
+// perdeu qualidade é avisado. Um `role="alert"` aqui interromperia o leitor de tela por uma
+// condição que não pede ação imediata, que é o oposto do que o papel serve.
+export const stateSeverity = (state) => state.startsWith("waiting_") ? "info" : "warning";
+export const defaultStrings = { close: "Close", confirmCancel: "Cancel", dataError: "This could not be loaded.", dataEmpty: "Nothing here yet", confirmProceed: "Continue", paginationLabel: "Pagination", previous: "Previous", next: "Next", breadcrumbLabel: "Breadcrumb", tabsLabel: "Tabs", optionsLabel: "Options", tableLabel: "Table", commandLabel: "Command palette", commandPlaceholder: "Type a command…", dismissNotification: "Dismiss notification", toolbarLabel: "Toolbar", loading: "Loading", otpDigit: "Digit", stepperLabel: "Steps", increment: "Increase", decrement: "Decrease", comboboxEmpty: "No results", comboboxClear: "Clear selection", comboboxOpen: "Open list", comboboxRemove: "Remove", comboboxLoading: "Loading…", fileDropPrompt: "Drag files here or click to select", fileAdded: "File added", fileRemoved: "File removed", fileRemove: "Remove", fileTooLarge: "File exceeds the size limit", fileWrongType: "File type not allowed", treeLabel: "Tree", notificationsLabel: "Notifications", notificationMarkAll: "Mark all as read", notificationEmpty: "No notifications", notificationUnread: "Unread", notificationNew: "new notifications", dataGridFilter: "Filter", dataGridEmpty: "No results", dataGridSelectAll: "Select all rows", dataGridSelectRow: "Select row", dataGridSelected: "selected", dataGridClearSelection: "Clear selection", dataGridBulkLabel: "Bulk actions", dataGridColumns: "Columns", dataGridResize: "Resize column", dataGridStale: "Showing data that may be out of date.", dataGridPartial: "Some rows could not be loaded. What you see is incomplete.", dataGridError: "The rows could not be loaded.", dataGridDetails: "Details", dataGridDetailPanel: "Row detail", dataGridExport: "Export", dataGridExportRows: "rows", dataGridExportFiltered: "filtered rows", dataGridExportSelected: "selected rows", mediaPlayer: "Media player", mediaPlay: "Play", mediaPause: "Pause", mediaMute: "Mute", mediaUnmute: "Unmute", mediaSeek: "Seek", mediaVolume: "Volume", mediaCaptionsShow: "Show captions", mediaCaptionsHide: "Hide captions", mediaSkipBack: "Skip back 10 seconds", mediaSkipForward: "Skip forward 10 seconds", mediaFullscreenEnter: "Enter full screen", mediaFullscreenExit: "Exit full screen", carouselLabel: "Carousel", carouselSlide: "Slide", positionOf: "of", carouselPrev: "Previous slide", carouselNext: "Next slide", galleryLabel: "Gallery", sortableLabel: "Sortable list", sortableHandle: "Reorder", sortableHelp: "Press Space to pick this up, then Arrow Up and Arrow Down to move it. Space drops it, Escape puts it back.", sortableGrabbed: "Picked up", sortableDropped: "Dropped", sortableMoved: "Moved", sortableCanceled: "Put back", blockEditorLabel: "Content blocks", blockLabel: "Block", blockRemove: "Remove block", uploadSending: "Uploading", uploadCancel: "Cancel upload", uploadRetry: "Retry upload", uploadError: "Upload failed", uploadCanceled: "Upload canceled", uploadComplete: "Upload complete", uploadPause: "Pause upload", uploadResume: "Resume upload", uploadPaused: "Paused", uploadPending: "Waiting", uploadChecksum: "Checksum", uploadChecksumBad: "The server received different bytes than the ones sent.", fileConflict: "A file with this name is already in the queue", fileReplace: "Replace", fileKeepBoth: "Keep both", fileSkip: "Skip", uploadReceipt: "Receipt", uploadReceiptCopy: "Copy receipt", agentInspector: "Agent inspector", invocationLabel: "Invocation", invocationInput: "Input", invocationOutput: "Output", taskQueueLabel: "Task queue", taskState: { queued: "Queued", running: "Running", completed: "Completed", failed: "Failed", blocked: "Blocked", paused: "Paused" }, taskPriority: { low: "Low", medium: "Medium", high: "High" }, approvalLabel: "Approval", approvalApprove: "Approve", approvalDeny: "Deny", approvalApproved: "Approved", approvalDenied: "Denied", approvalDeadline: "Decide by", approvalRisk: { low: "Low risk", medium: "Medium risk", high: "High risk" }, permissionLabel: "Tool permissions", permissionAsk: "Ask", permissionAlways: "Always", permissionNever: "Never", eventStreamLabel: "Events", traceLabel: "Trace", healthLabel: "Health", healthState: { operational: "Operational", degraded: "Degraded", down: "Down", maintenance: "Maintenance", unknown: "Unknown" }, modelUsageLabel: "Model usage", usageMetric: { tokens: "Tokens", cost: "Cost", requests: "Requests" }, costMeterLabel: "Cost", costMeterSpent: "Spent", costMeterRemaining: "left", costMeterExceeded: "Over the limit", costMeterNear: "Spending is past the soft limit.", costMeterOver: "The limit has been reached. Further calls are blocked.", memoryLabel: "Memory ledger", memoryProvenance: "Where this came from", memoryOperation: { added: "Added", updated: "Updated", recalled: "Recalled", forgotten: "Forgotten" }, memoryScope: { episodic: "Episodic", semantic: "Semantic", procedural: "Procedural" }, agentMessageLabel: "Agent messages", agentMessageTo: "to", agentMessageBroadcast: "all agents", agentMessageReason: "Why it went this way", agentMessageKind: { request: "Request", response: "Response", handoff: "Handoff", broadcast: "Broadcast", error: "Error" }, automationWhen: "When", automationThen: "Then", automationEnabled: "Enabled", automationLastRun: "Last run", automationResult: { success: "Succeeded", failure: "Failed" }, graphLabel: "Dependency graph", agentState: { idle: "Idle", thinking: "Thinking", running: "Running", paused: "Paused", error: "Error", completed: "Completed" }, codeEditor: "Code editor", chatLabel: "Conversation", chatMessage: "Message", chatSend: "Send", qrCode: "QR code", chartLabel: "Chart", copyCode: "Copy code", tocLabel: "On this page", navigationToggle: "Navigation", sidebarLabel: "Sidebar", universalState: { waiting_user: "Waiting for someone to act.", waiting_approval: "Waiting for approval.", waiting_dependency: "Waiting for something else to finish.", offline: "No connection. This was loaded earlier.", stale: "This may be out of date.", partial: "Some of this could not be loaded.", degraded: "Working with reduced capability." } };
+// pt-BR preservado como locale (mesmos valores que já eram o default): passe
+// <AureaProvider strings={ptBR}> para restaurar português.
+export const ptBR = { close: "Fechar", confirmCancel: "Cancelar", dataError: "Não foi possível carregar.", dataEmpty: "Ainda não há nada aqui", confirmProceed: "Continuar", paginationLabel: "Paginação", previous: "Anterior", next: "Próxima", breadcrumbLabel: "Breadcrumb", tabsLabel: "Abas", optionsLabel: "Opções", tableLabel: "Tabela", commandLabel: "Paleta de comandos", commandPlaceholder: "Digite um comando…", dismissNotification: "Dispensar notificação", toolbarLabel: "Barra de ferramentas", loading: "Carregando", otpDigit: "Dígito", stepperLabel: "Etapas", increment: "Aumentar", decrement: "Diminuir", comboboxEmpty: "Nenhum resultado", comboboxClear: "Limpar seleção", comboboxOpen: "Abrir lista", comboboxRemove: "Remover", comboboxLoading: "Carregando…", fileDropPrompt: "Arraste arquivos aqui ou clique para selecionar", fileAdded: "Arquivo adicionado", fileRemoved: "Arquivo removido", fileRemove: "Remover", fileTooLarge: "Arquivo maior que o limite", fileWrongType: "Tipo de arquivo não aceito", treeLabel: "Árvore", notificationsLabel: "Notificações", notificationMarkAll: "Marcar todas como lidas", notificationEmpty: "Nenhuma notificação", notificationUnread: "Não lida", notificationNew: "novas notificações", dataGridFilter: "Filtrar", dataGridEmpty: "Nenhum resultado", dataGridSelectAll: "Selecionar todas as linhas", dataGridSelectRow: "Selecionar linha", dataGridSelected: "selecionadas", dataGridClearSelection: "Limpar seleção", dataGridBulkLabel: "Ações em lote", dataGridColumns: "Colunas", dataGridResize: "Redimensionar coluna", dataGridStale: "Mostrando dados que podem estar desatualizados.", dataGridPartial: "Algumas linhas não puderam ser carregadas. O que aparece está incompleto.", dataGridError: "Não foi possível carregar as linhas.", dataGridDetails: "Detalhes", dataGridDetailPanel: "Detalhe da linha", dataGridExport: "Exportar", dataGridExportRows: "linhas", dataGridExportFiltered: "linhas filtradas", dataGridExportSelected: "linhas selecionadas", mediaPlayer: "Reprodutor de mídia", mediaPlay: "Reproduzir", mediaPause: "Pausar", mediaMute: "Silenciar", mediaUnmute: "Ativar som", mediaSeek: "Posição da reprodução", mediaVolume: "Volume", mediaCaptionsShow: "Ativar legendas", mediaCaptionsHide: "Desativar legendas", mediaSkipBack: "Voltar 10 segundos", mediaSkipForward: "Avançar 10 segundos", mediaFullscreenEnter: "Tela cheia", mediaFullscreenExit: "Sair da tela cheia", carouselLabel: "Carrossel", carouselSlide: "Slide", positionOf: "de", carouselPrev: "Slide anterior", carouselNext: "Próximo slide", galleryLabel: "Galeria", sortableLabel: "Lista ordenável", sortableHandle: "Reordenar", sortableHelp: "Aperte Espaço para pegar, e as setas para cima e para baixo para mover. Espaço solta, Esc devolve ao lugar.", sortableGrabbed: "Pego", sortableDropped: "Solto", sortableMoved: "Movido", sortableCanceled: "Devolvido", blockEditorLabel: "Blocos de conteúdo", blockLabel: "Bloco", blockRemove: "Remover bloco", uploadSending: "Enviando", uploadCancel: "Cancelar envio", uploadRetry: "Tentar envio novamente", uploadError: "Falha no envio", uploadCanceled: "Envio cancelado", uploadComplete: "Envio concluído", uploadPause: "Pausar envio", uploadResume: "Retomar envio", uploadPaused: "Pausado", uploadPending: "Aguardando", uploadChecksum: "Soma de verificação", uploadChecksumBad: "O servidor recebeu bytes diferentes dos enviados.", fileConflict: "Já existe um arquivo com este nome na fila", fileReplace: "Substituir", fileKeepBoth: "Manter os dois", fileSkip: "Pular", uploadReceipt: "Recibo", uploadReceiptCopy: "Copiar recibo", agentInspector: "Inspetor do agente", invocationLabel: "Invocação", invocationInput: "Entrada", invocationOutput: "Saída", taskQueueLabel: "Fila de tarefas", taskState: { queued: "Na fila", running: "Executando", completed: "Concluída", failed: "Falhou", blocked: "Bloqueada", paused: "Pausada" }, taskPriority: { low: "Baixa", medium: "Média", high: "Alta" }, approvalLabel: "Aprovação", approvalApprove: "Aprovar", approvalDeny: "Negar", approvalApproved: "Aprovado", approvalDenied: "Negado", approvalDeadline: "Decidir até", approvalRisk: { low: "Risco baixo", medium: "Risco médio", high: "Risco alto" }, permissionLabel: "Permissões de ferramenta", permissionAsk: "Perguntar", permissionAlways: "Sempre", permissionNever: "Nunca", eventStreamLabel: "Eventos", traceLabel: "Rastro", healthLabel: "Saúde", healthState: { operational: "Operando", degraded: "Degradado", down: "Fora do ar", maintenance: "Em manutenção", unknown: "Desconhecido" }, modelUsageLabel: "Consumo por modelo", usageMetric: { tokens: "Tokens", cost: "Custo", requests: "Chamadas" }, costMeterLabel: "Custo", costMeterSpent: "Gasto", costMeterRemaining: "restantes", costMeterExceeded: "Acima do limite", costMeterNear: "O gasto passou do limite brando.", costMeterOver: "O limite foi atingido. As próximas chamadas estão bloqueadas.", memoryLabel: "Livro-razão de memória", memoryProvenance: "De onde isto veio", memoryOperation: { added: "Guardada", updated: "Atualizada", recalled: "Lembrada", forgotten: "Esquecida" }, memoryScope: { episodic: "Episódica", semantic: "Semântica", procedural: "Procedural" }, agentMessageLabel: "Recados entre agentes", agentMessageTo: "para", agentMessageBroadcast: "todos os agentes", agentMessageReason: "Por que foi por aqui", agentMessageKind: { request: "Pedido", response: "Resposta", handoff: "Passagem", broadcast: "Difusão", error: "Erro" }, automationWhen: "Quando", automationThen: "Então", automationEnabled: "Ativa", automationLastRun: "Última execução", automationResult: { success: "Concluiu", failure: "Falhou" }, graphLabel: "Grafo de dependências", agentState: { idle: "Ocioso", thinking: "Pensando", running: "Executando", paused: "Pausado", error: "Erro", completed: "Concluído" }, codeEditor: "Editor de código", chatLabel: "Conversa", chatMessage: "Mensagem", chatSend: "Enviar", qrCode: "Código QR", chartLabel: "Gráfico", copyCode: "Copiar código", tocLabel: "Nesta página", navigationToggle: "Navegação", sidebarLabel: "Lateral", universalState: { waiting_user: "Esperando alguém agir.", waiting_approval: "Esperando aprovação.", waiting_dependency: "Esperando outra coisa terminar.", offline: "Sem conexão. Isto foi carregado antes.", stale: "Isto pode estar desatualizado.", partial: "Parte disto não pôde ser carregada.", degraded: "Funcionando com capacidade reduzida." } };
+// Sprite de ícones: CONFIGURAÇÃO DE APLICAÇÃO, então entra pelo provider, uma vez.
+// Antes o default absoluto "/aurea-icons.svg" vivia no Icon e 15 componentes declaravam
+// e repassavam `spriteUrl` à mão — 52 sítios de código. Consequência: aplicação servida
+// em subcaminho perdia TODOS os ícones, e para consertar tinha de passar a prop em cada
+// componente (auditoria 26/07/2026, achado A4 — causa raiz do A3 daquela auditoria, que
+// foi corrigido nos fallbacks do catálogo e não aqui). O default segue o mesmo para quem
+// não configura nada; `Icon` aceita a prop como override local.
+export const defaultSpriteUrl = "/aurea-icons.svg";
+// Formato: `sort=-nome,execucoes` (o `-` é descendente) · `q=texto` · `page=2` ·
+// `f.<coluna>=valor`, repetido quando a coluna é faceta. Só entra o que está
+// ativo, então grade sem filtro nenhum deixa a URL limpa.
+//
+// `into` preserva o que já estava na busca: uma aplicação real tem `tab=`, `ref=`
+// e companhia na mesma URL, e serializar a grade não pode apagá-los.
+export function gridStateToParams(state, into) {
+    const p = new URLSearchParams(into);
+    for (const k of [...p.keys()])
+        if (k === "sort" || k === "q" || k === "page" || k.startsWith("f."))
+            p.delete(k);
+    if (state.sorting?.length)
+        p.set("sort", state.sorting.map(s => (s.desc ? "-" : "") + s.id).join(","));
+    if (state.globalFilter)
+        p.set("q", state.globalFilter);
+    // página 1 não vai para a URL: é o default, e escrevê-lo só suja o link.
+    if (state.page && state.page > 1)
+        p.set("page", String(state.page));
+    for (const f of state.columnFilters ?? []) {
+        if (Array.isArray(f.value)) {
+            for (const v of f.value)
+                p.append("f." + f.id, String(v));
+        }
+        else if (f.value != null && f.value !== "")
+            p.set("f." + f.id, String(f.value));
+    }
+    return p;
+}
+// `filters` é o MESMO array que a grade recebe, e serve para uma coisa só: saber
+// se `f.estado=feito` volta como `"feito"` ou como `["feito"]`. Sem ele a decisão
+// cai num palpite — repetido é lista, sozinho é texto —, e uma faceta com UM valor
+// escolhido volta como texto e para de filtrar. Passe-o sempre que houver faceta.
+export function gridStateFromParams(params, filters) {
+    const state = {};
+    const sort = params.get("sort");
+    if (sort)
+        state.sorting = sort.split(",").filter(Boolean).map(t => t.startsWith("-") ? { id: t.slice(1), desc: true } : { id: t, desc: false });
+    const q = params.get("q");
+    if (q)
+        state.globalFilter = q;
+    const page = Number(params.get("page"));
+    if (Number.isFinite(page) && page > 1)
+        state.page = Math.floor(page);
+    const colunas = [];
+    for (const k of new Set([...params.keys()].filter(k => k.startsWith("f.")))) {
+        const id = k.slice(2), vals = params.getAll(k);
+        colunas.push({ id, value: (filters ? filters.some(f => f.column === id && f.facet) : vals.length > 1) ? vals : vals[0] });
+    }
+    if (colunas.length)
+        state.columnFilters = colunas;
+    return state;
+}
+const CHAVES_TELA = ["tab", "view", "detail"];
+// `into` preserva o que já estava, pelo mesmo motivo do `gridStateToParams`: uma aplicação real
+// tem `ref=`, `utm_*` e companhia na mesma URL, e serializar a tela não pode apagá-los. O que se
+// apaga é só o que ESTE formato escreve — senão um estado que saiu continuaria na URL.
+export function screenStateToParams(state, into) {
+    const p = gridStateToParams(state, into);
+    for (const k of CHAVES_TELA)
+        p.delete(k);
+    for (const k of CHAVES_TELA) {
+        const v = state[k];
+        if (v)
+            p.set(k, v);
+    }
+    return p;
+}
+export function screenStateFromParams(params, filters) {
+    const state = gridStateFromParams(params, filters);
+    for (const k of CHAVES_TELA) {
+        const v = params.get(k);
+        if (v)
+            state[k] = v;
+    }
+    return state;
+}

package/dist/qrcode.d.ts

@@ -1,8 +1,9 @@
 import React from "react";
 import { type ErrorCorrection } from "qr";
+export type QRCodeSize = "sm" | "md" | "lg";
 export interface QRCodeProps extends Omit<React.SVGAttributes<SVGSVGElement>, "children"> {
     value: string;
-    size?: number;
+    size?: QRCodeSize;
     ecc?: ErrorCorrection;
     quietZone?: number;
     label?: string;

package/dist/qrcode.js

@@ -1,3 +1,4 @@
+"use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Fase 9 (achado A5): este arquivo saiu do index.tsx de 970 linhas. Um módulo por categoria
 // do registry — a taxonomia já existia e é gateada. A ordem de import entre eles é um DAG:
@@ -14,7 +15,7 @@ import { cx, useAureaStrings } from "./internal.js";
 // --qr-quiet no CSS. Matriz da lib `qr` (0-dep, Apache-2.0, Paul Miller); o desenho é
 // nosso. ecc default "quartile": dots cobrem menos área que quadrados, então mais
 // correção de erro preserva a escaneabilidade. ponytail: um estilo (dots) só.
-export function QRCode({ value, size = 160, ecc = "quartile", quietZone = 4, label, className, ...props }) {
+export function QRCode({ value, size = "md", ecc = "quartile", quietZone = 4, label, className, ...props }) {
     const s = useAureaStrings();
     const name = label ?? `${s.qrCode}: ${value}`;
     const m = encodeQR(value, "raw", { ecc, border: quietZone });
@@ -30,5 +31,5 @@ export function QRCode({ value, size = 160, ecc = "quartile", quietZone = 4, lab
     // olho redondo: anel externo (raio 3.5) → furo (2.5, cor do fundo) → centro (1.5).
     // os raios preservam a proporção 7:5:3 do finder, então o leitor ainda o reconhece.
     const eyeShapes = eyes.map(([ex, ey], i) => { const cx = ex + 3.5, cy = ey + 3.5; return _jsxs(React.Fragment, { children: [_jsx("circle", { className: "qr-mod", cx: cx, cy: cy, r: 3.5 }), _jsx("circle", { className: "qr-eye-gap", cx: cx, cy: cy, r: 2.5 }), _jsx("circle", { className: "qr-mod", cx: cx, cy: cy, r: 1.5 })] }, `eye${i}`); });
-    return _jsxs("svg", { className: cx("qrcode", className), role: "img", "aria-label": name, viewBox: `0 0 ${n} ${n}`, width: size, height: size, ...props, children: [_jsx("title", { children: name }), eyeShapes, dots] });
+    return _jsxs("svg", { className: cx("qrcode", size !== "md" && `qrcode-${size}`, className), role: "img", "aria-label": name, viewBox: `0 0 ${n} ${n}`, ...props, children: [_jsx("title", { children: name }), eyeShapes, dots] });
 }

package/dist/system.d.ts

@@ -1,13 +1,23 @@
 import React, { type ReactNode } from "react";
 import { type AureaStrings } from "./internal.js";
-export declare function AureaProvider({ children, strings, direction, spriteUrl }: {
+export declare function AureaProvider({ children, strings, direction, spriteUrl, portalContainer }: {
     children: ReactNode;
     strings?: Partial<AureaStrings>;
     direction?: "ltr" | "rtl";
     spriteUrl?: string;
+    portalContainer?: HTMLElement | null;
 }): React.JSX.Element;
 export type AureaToastType = "info" | "success" | "warning" | "danger";
 export declare const useToast: () => import("@base-ui/react").UseToastManagerReturnValue<any>;
+export type AureaThemeName = "dark" | "light";
+export type AureaDensity = "compact" | "comfortable" | "spacious";
+export declare function useAureaTheme(): {
+    theme: AureaThemeName | null;
+    density: AureaDensity | null;
+    setTheme: (t: AureaThemeName) => void;
+    setDensity: (d: AureaDensity) => void;
+    toggleTheme: () => void;
+};
 export type IconName = string;
 export interface IconProps extends React.SVGAttributes<SVGSVGElement> {
     name: IconName;

package/dist/system.js

@@ -1,3 +1,4 @@
+"use client";
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Fase 9 (achado A5): este arquivo saiu do index.tsx de 970 linhas. Um módulo por categoria
 // do registry — a taxonomia já existia e é gateada. A ordem de import entre eles é um DAG:
@@ -6,19 +7,73 @@ import React from "react";
 import { Toast as BaseToast } from "@base-ui/react/toast";
 import { Tooltip as BaseTooltip } from "@base-ui/react/tooltip";
 import { DirectionProvider } from "@base-ui/react/direction-provider";
-import { cx, StringsContext, SpriteContext, defaultStrings, defaultSpriteUrl, useSpriteUrl, useAureaStrings } from "./internal.js";
-export function AureaProvider({ children, strings, direction = "ltr", spriteUrl = defaultSpriteUrl }) {
+import { cx, StringsContext, SpriteContext, PortalContext, defaultStrings, defaultSpriteUrl, useSpriteUrl, useAureaStrings, usePortalContainer } from "./internal.js";
+// `portalContainer` (achado B7, Parte C do PLANO-1.0): onde TODO popup da biblioteca é montado.
+// Configuração de aplicação, então entra aqui uma vez — o mesmo raciocínio do `spriteUrl`, e
+// pela mesma razão medida: com prop por componente seriam nove sítios repassando a mesma coisa
+// à mão, que é o achado A4 de novo.
+// Sem ela nada muda: o Base UI monta no `document.body`, que é o que permite empilhar e
+// posicionar sem herdar `overflow` nem `transform`. Com ela, o consumidor aponta para um nó
+// dentro do landmark dele e o conteúdo do popup deixa de ficar fora de qualquer marco.
+export function AureaProvider({ children, strings, direction = "ltr", spriteUrl = defaultSpriteUrl, portalContainer }) {
     const value = React.useMemo(() => strings ? { ...defaultStrings, ...strings } : defaultStrings, [strings]);
-    return _jsx(StringsContext.Provider, { value: value, children: _jsx(SpriteContext.Provider, { value: spriteUrl, children: _jsx(DirectionProvider, { direction: direction, children: _jsx(BaseToast.Provider, { children: _jsxs(BaseTooltip.Provider, { children: [children, _jsx(AureaToastViewport, {})] }) }) }) }) });
+    return _jsx(StringsContext.Provider, { value: value, children: _jsx(SpriteContext.Provider, { value: spriteUrl, children: _jsx(PortalContext.Provider, { value: portalContainer, children: _jsx(DirectionProvider, { direction: direction, children: _jsx(BaseToast.Provider, { children: _jsxs(BaseTooltip.Provider, { children: [children, _jsx(AureaToastViewport, {})] }) }) }) }) }) });
 }
 export const useToast = () => BaseToast.useToastManager();
+// useAureaTheme (M7): ler e trocar os DOIS eixos que a Aurea põe no <html> — `data-theme` e
+// `data-density`. Até aqui só existia `window.Aurea.setTheme` no `aurea.js`, que é vanilla: em
+// React não havia como saber o tema atual sem enfiar a mão no DOM, e um botão de tema não sabia
+// que ícone desenhar.
+//
+// O QUE ESTE HOOK NÃO FAZ, e é a parte mais importante dele — pesquisado em 13/08/2026, não
+// suposto. O `next-themes` já resolve persistência, preferência do sistema, sincronia entre abas
+// e o script embutido que evita o flash, e ele escreve **`data-theme` no <html>**, que é
+// exatamente o atributo que a Aurea lê. Ou seja: os dois já se encaixam sem código nosso.
+// Reescrever isso aqui seria trocar uma biblioteca mantida por uma cópia pior — e guardar
+// preferência de usuário é decisão da APLICAÇÃO, não da biblioteca de interface (é o mesmo
+// motivo pelo qual a persistência de tema do catálogo mora no catálogo).
+// O que ele faz é o que biblioteca nenhuma faz: **densidade**, que é eixo da Aurea e não existe
+// no `next-themes` nem em ninguém.
+//
+// `useSyncExternalStore` e não `useState`: o valor mora no DOM, e quem o troca pode ser outro —
+// o `next-themes`, um script no <head>, ou o `window.Aurea` de sempre. Assinar a mutação do
+// atributo é o que mantém o React em dia com quem manda de verdade.
+//
+// E `getServerSnapshot` devolve `null` de propósito. A armadilha está documentada no próprio
+// `next-themes`: no servidor o tema é **desconhecido**, e fingir um valor produz erro de
+// hidratação. Por isso o retorno é `theme: string|null` — enquanto for `null`, não desenhe UI que
+// dependa do tema. É a mesma regra do "delay rendering until mounted", só que sem um `mounted`
+// solto para o consumidor esquecer de checar.
+const assinaHtml = (cb) => {
+    if (typeof MutationObserver === "undefined")
+        return () => { };
+    const obs = new MutationObserver(cb);
+    obs.observe(document.documentElement, { attributes: true, attributeFilter: ["data-theme", "data-density"] });
+    return () => obs.disconnect();
+};
+const leAtributo = (nome) => () => typeof document === "undefined" ? null : document.documentElement.getAttribute(nome);
+const semServidor = () => null;
+export function useAureaTheme() {
+    const theme = React.useSyncExternalStore(assinaHtml, leAtributo("data-theme"), semServidor);
+    const density = React.useSyncExternalStore(assinaHtml, leAtributo("data-density"), semServidor);
+    return React.useMemo(() => ({
+        theme, density,
+        setTheme: (t) => { document.documentElement.dataset.theme = t; },
+        setDensity: (d) => { document.documentElement.dataset.density = d; },
+        // Alternar é sobre o que está NA TELA, então `null` (servidor, ou ninguém escolheu ainda)
+        // resolve para claro e vira escuro — e não o contrário, que deixaria o primeiro clique sem
+        // efeito visível em quem estava no claro do sistema.
+        toggleTheme: () => { document.documentElement.dataset.theme = theme === "dark" ? "light" : "dark"; },
+    }), [theme, density]);
+}
 function AureaToastList() {
     const { toasts } = BaseToast.useToastManager();
     const s = useAureaStrings();
     return _jsx(_Fragment, { children: toasts.map(t => (_jsxs(BaseToast.Root, { toast: t, className: cx("toast", t.type && `toast-${t.type}`), children: [_jsxs("div", { className: "toast-text", children: [_jsx(BaseToast.Title, { render: _jsx("strong", {}) }), t.description ? _jsx(BaseToast.Description, { className: "muted" }) : null] }), _jsx(BaseToast.Close, { className: "btn btn-ghost btn-icon btn-sm", "aria-label": s.dismissNotification, children: "\u00D7" })] }, t.id))) });
 }
 function AureaToastViewport() {
-    return _jsx(BaseToast.Portal, { children: _jsx(BaseToast.Viewport, { className: "toast-stack", children: _jsx(AureaToastList, {}) }) });
+    const portal = usePortalContainer();
+    return _jsx(BaseToast.Portal, { container: portal, children: _jsx(BaseToast.Viewport, { className: "toast-stack", children: _jsx(AureaToastList, {}) }) });
 }
 // spriteUrl aqui é OVERRIDE local (dois sprites na mesma página, por exemplo). O normal é
 // não passar nada e deixar o AureaProvider dizer de onde vêm os glifos.

package/package.json

@@ -1,8 +1,14 @@
 {
   "name": "@aurea-uds/react",
-  "version": "0.1.0",
+  "version": "0.3.0",
   "description": "React components for Aurea UDS. Import @aurea-uds/fonts/css and @aurea-uds/core/css alongside.",
-  "keywords": ["aurea", "design-system", "react", "components", "ui"],
+  "keywords": [
+    "aurea",
+    "design-system",
+    "react",
+    "components",
+    "ui"
+  ],
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -85,6 +91,22 @@
     "./qrcode": {
       "types": "./dist/qrcode.d.ts",
       "import": "./dist/qrcode.js"
+    },
+    "./chart": {
+      "types": "./dist/chart.d.ts",
+      "import": "./dist/chart.js"
+    },
+    "./calendar": {
+      "types": "./dist/calendar.d.ts",
+      "import": "./dist/calendar.js"
+    },
+    "./graph": {
+      "types": "./dist/graph.d.ts",
+      "import": "./dist/graph.js"
+    },
+    "./agents": {
+      "types": "./dist/agents.d.ts",
+      "import": "./dist/agents.js"
     }
   },
   "files": [
@@ -102,10 +124,13 @@
     "@codemirror/view": "^6.43.6",
     "@lezer/highlight": "^1.2.3",
     "@tanstack/react-table": "^8.21.3",
+    "@xyflow/react": "^12.11.2",
     "codemirror": "^6.0.2",
     "qr": "^0.6.0",
     "react": ">=19",
-    "react-dom": ">=19"
+    "react-day-picker": "^10.0.1",
+    "react-dom": ">=19",
+    "recharts": "^3.10.1"
   },
   "peerDependenciesMeta": {
     "@codemirror/language": {
@@ -123,11 +148,20 @@
     "@tanstack/react-table": {
       "optional": true
     },
+    "react-day-picker": {
+      "optional": true
+    },
+    "recharts": {
+      "optional": true
+    },
     "codemirror": {
       "optional": true
     },
     "qr": {
       "optional": true
+    },
+    "@xyflow/react": {
+      "optional": true
     }
   },
   "devDependencies": {
@@ -139,6 +173,8 @@
     "codemirror": "^6.0.2",
     "qr": "^0.6.0",
     "react": "^19.2.0",
-    "react-dom": "^19.2.0"
+    "react-day-picker": "^10.0.1",
+    "react-dom": "^19.2.0",
+    "recharts": "^3.10.1"
   }
 }