@1doc/1ds-react 2.9.0 → 2.11.0

package/dist/components/Tag/Tag.css

@@ -194,7 +194,9 @@
 
 .umds-tag--outlined.umds-tag--positive {
     border-color: var(--umds-semantic-color-feedback-positive-pure);
-    color: var(--umds-semantic-color-feedback-positive-pure);
+    /* O contorno transparente deixa o texto sobre o fundo de quem está atrás (um card tingido de azul-claro).
+       positive-pure sobre primary-light dá 3,6:1; positive-dark dá 7,9:1 e é o par de texto do `soft`. */
+    color: var(--umds-semantic-color-feedback-positive-dark);
 }
 
 .umds-tag--outlined.umds-tag--negative {

package/dist/components/Toast/Toast.css

@@ -123,6 +123,38 @@
   line-height: 1.5;
 }
 
+/* ── Detalhes (details) e ação (actionLabel) ── */
+.umds-toast__details {
+  margin: 0;
+  padding-left: var(--umds-primitive-spacing-xxxs); /* 16px */
+  font-size: var(--umds-primitive-font-size-xxxs); /* 12px */
+  line-height: 1.5;
+}
+
+.umds-toast__action {
+  align-self: flex-start;
+  display: inline-flex;
+  align-items: center;
+  /* Alvo mínimo de 24px (WCAG 2.5.8). */
+  min-height: var(--umds-primitive-spacing-xxs);
+  margin: 0;
+  padding: 0;
+  border: none;
+  background: none;
+  color: inherit;
+  font-family: inherit;
+  font-size: var(--umds-primitive-font-size-xxxs); /* 12px */
+  font-weight: var(--umds-primitive-font-weight-bold);
+  text-decoration: underline;
+  cursor: pointer;
+}
+
+.umds-toast__action:focus-visible {
+  outline: 2px solid currentColor;
+  outline-offset: 2px;
+  border-radius: var(--umds-primitive-border-radius-xs);
+}
+
 /* ── Fechar ── */
 .umds-toast__close {
   display: flex;

package/dist/components/Toast/Toast.d.ts

@@ -4,6 +4,12 @@ import './Toast.css';
  * na raiz do documento (não fica presa ao overflow do elemento pai).
  * Comunica o resultado de uma ação (sucesso, erro, aviso ou informação) e pode
  * fechar automaticamente após um tempo.
+ *
+ * Com `actionLabel` e `onAction`, o toast ganha uma ação ("Desfazer", "Ver * processo"): um botão depois do texto. Acioná-la chama `onAction` e fecha o
+ * toast. Toast com ação não deve sumir sozinho antes de dar tempo de agir
+ * (WCAG 2.2.1): no `toast()` imperativo o padrão passa a ser `duration: 0`, e no
+ * declarativo vale o que você passar. `details` é uma lista de linhas
+ * curtas abaixo da descrição (o que deu errado, item a item).
  * @quandoUsar Retorno TRANSITÓRIO e não-bloqueante de uma ação recém-executada: "Processo salvo", "Link copiado". Aparece sobreposto e some sozinho.
  * @quandoNaoUsar Para mensagem que precisa continuar visível ou ser relida — use `Alert`. Para erro que impede o usuário de prosseguir, use `Alert` junto ao campo.
  */
@@ -28,6 +34,18 @@ export interface ToastProps {
      * Descrição adicional exibida abaixo da mensagem.
      */
     description?: string;
+    /**
+     * Lista de detalhes, uma linha por item, abaixo da descrição ("Anexo 3 acima   * de 10 MB", "Despacho sem assunto").
+     */
+    details?: string[];
+    /**
+     * Rótulo do botão de ação ("Desfazer"). O botão só aparece com `onAction`.
+     */
+    actionLabel?: string;
+    /**
+     * Chamado ao acionar o botão de ação. Depois dele o toast fecha (`onClose`).
+     */
+    onAction?: (event?: any) => void;
     /**
      * Posição na tela onde o toast é fixado.
      * @default 'top-right'

package/dist/components/Toast/Toast.js

@@ -31,6 +31,19 @@ function Toast(props) {
             return faCircleXmark;
         return faCircleInfo;
     }
+    function detailList() {
+        return props.details || [];
+    }
+    function hasAction() {
+        return !!(props.actionLabel && props.onAction);
+    }
+    function handleAction(event) {
+        if (event)
+            event.stopPropagation();
+        if (props.onAction)
+            props.onAction(event);
+        handleClose(event);
+    }
     function handleClose(event) {
         if (event)
             event.stopPropagation();
@@ -58,6 +71,6 @@ function Toast(props) {
             }
         };
     }, []);
-    return (_jsx(Portal, { container: props.portalContainer, children: _jsx("div", { role: liveRole(), "aria-live": ariaLive(), children: props.open ? (_jsxs("div", { className: toastClasses(), children: [_jsx("div", { className: "umds-toast__icon-wrap", children: _jsx("span", { "aria-hidden": "true", className: "umds-toast__icon", children: _jsx(Icon, { variant: "inherit", customSize: "14px", icon: iconName() }) }) }), _jsxs("div", { className: "umds-toast__body", children: [_jsx("span", { className: "umds-toast__message", children: props.message }), props.description ? (_jsx("span", { className: "umds-toast__description", children: props.description })) : null] }), props.closable !== false ? (_jsx("button", { type: "button", className: "umds-toast__close", onClick: (event) => handleClose(event), "aria-label": props.closeLabel || "Fechar notificação", children: _jsx(Icon, { variant: "inherit", customSize: "18px", icon: faXmark }) })) : null] })) : null }) }));
+    return (_jsx(Portal, { container: props.portalContainer, children: _jsx("div", { role: liveRole(), "aria-live": ariaLive(), children: props.open ? (_jsxs("div", { className: toastClasses(), children: [_jsx("div", { className: "umds-toast__icon-wrap", children: _jsx("span", { "aria-hidden": "true", className: "umds-toast__icon", children: _jsx(Icon, { variant: "inherit", customSize: "14px", icon: iconName() }) }) }), _jsxs("div", { className: "umds-toast__body", children: [_jsx("span", { className: "umds-toast__message", children: props.message }), props.description ? (_jsx("span", { className: "umds-toast__description", children: props.description })) : null, detailList().length > 0 ? (_jsx("ul", { className: "umds-toast__details", children: detailList()?.map((detalhe) => (_jsx("li", { children: detalhe }, detalhe))) })) : null, hasAction() ? (_jsx("button", { type: "button", className: "umds-toast__action", onClick: (event) => handleAction(event), children: props.actionLabel })) : null] }), props.closable !== false ? (_jsx("button", { type: "button", className: "umds-toast__close", onClick: (event) => handleClose(event), "aria-label": props.closeLabel || "Fechar notificação", children: _jsx(Icon, { variant: "inherit", customSize: "18px", icon: faXmark }) })) : null] })) : null }) }));
 }
 export default Toast;

package/dist/components/Toast/ToastStack.js

@@ -17,6 +17,13 @@ function ToastStack(props) {
             .filter(Boolean)
             .join(" ");
     }
+    function actionLabelOf(item) {
+        return item.onAction ? item.actionLabel : undefined;
+    }
+    function handleItemAction(item) {
+        if (item.onAction)
+            item.onAction();
+    }
     function handleItemClose(id) {
         dismissToast(id);
     }
@@ -33,6 +40,6 @@ function ToastStack(props) {
             }
         };
     }, []);
-    return (_jsx("div", { ref: stackRef, className: stackClasses(), children: items?.map((item) => (_jsx(Toast, { open: true, message: item.message, description: item.description, variant: item.variant, duration: item.duration, closable: item.closable, portalContainer: stackRef.current, onClose: (event) => handleItemClose(item.id) }, item.id))) }));
+    return (_jsx("div", { ref: stackRef, className: stackClasses(), children: items?.map((item) => (_jsx(Toast, { open: true, message: item.message, description: item.description, details: item.details, actionLabel: actionLabelOf(item), onAction: (event) => handleItemAction(item), variant: item.variant, duration: item.duration, closable: item.closable, portalContainer: stackRef.current, onClose: (event) => handleItemClose(item.id) }, item.id))) }));
 }
 export default ToastStack;

package/dist/teste/AccordionControlado.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/AccordionControlado.test.js

@@ -0,0 +1,73 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it, vi } from "vitest";
+import { useState } from "react";
+import { fireEvent, render, screen } from "@testing-library/react";
+import Accordion from "../components/Accordion/Accordion";
+const ITENS = [
+    { id: "prazos", title: "Prazos", content: "Dez dias úteis.", defaultOpen: true },
+    { id: "anexos", title: "Anexos", content: "Até 10 MB." },
+    { id: "sigilo", title: "Sigilo", content: "Só o setor." },
+];
+const aberto = (nome) => screen.getByRole("button", { name: nome }).getAttribute("aria-expanded") === "true";
+describe("Accordion · não controlado (como antes)", () => {
+    it("começa pelos defaultOpen e o clique abre e fecha; onOpenChange avisa a nova lista", () => {
+        const aoMudar = vi.fn();
+        render(_jsx(Accordion, { items: ITENS, multiple: true, onOpenChange: aoMudar }));
+        expect(aberto("Prazos")).toBe(true);
+        fireEvent.click(screen.getByRole("button", { name: "Anexos" }));
+        expect(aberto("Anexos")).toBe(true);
+        expect(aoMudar).toHaveBeenLastCalledWith(["prazos", "anexos"]);
+        fireEvent.click(screen.getByRole("button", { name: "Prazos" }));
+        expect(aberto("Prazos")).toBe(false);
+        expect(aoMudar).toHaveBeenLastCalledWith(["anexos"]);
+    });
+    it("sem multiple, abrir um fecha o outro", () => {
+        render(_jsx(Accordion, { items: ITENS }));
+        fireEvent.click(screen.getByRole("button", { name: "Anexos" }));
+        expect(aberto("Anexos")).toBe(true);
+        expect(aberto("Prazos")).toBe(false);
+    });
+});
+describe("Accordion · controlado (open e onOpenChange)", () => {
+    it("open manda: o que está em open está aberto, ignorando defaultOpen", () => {
+        render(_jsx(Accordion, { items: ITENS, open: ["sigilo"] }));
+        expect(aberto("Sigilo")).toBe(true);
+        expect(aberto("Prazos")).toBe(false);
+    });
+    it("o clique só pede (onOpenChange); sem o app mudar open, nada abre", () => {
+        const aoMudar = vi.fn();
+        render(_jsx(Accordion, { items: ITENS, multiple: true, open: ["prazos"], onOpenChange: aoMudar }));
+        fireEvent.click(screen.getByRole("button", { name: "Anexos" }));
+        expect(aoMudar).toHaveBeenCalledWith(["prazos", "anexos"]);
+        expect(aberto("Anexos")).toBe(false);
+    });
+    it("o app guarda a escolha: com o estado dele, abre, fecha e a lista chega em ordem", () => {
+        let ultima = [];
+        function App() {
+            const [abertos, setAbertos] = useState([]);
+            return (_jsx(Accordion, { items: ITENS, multiple: true, open: abertos, onOpenChange: (ids) => {
+                    ultima = ids;
+                    setAbertos(ids);
+                } }));
+        }
+        render(_jsx(App, {}));
+        expect(aberto("Prazos")).toBe(false);
+        fireEvent.click(screen.getByRole("button", { name: "Sigilo" }));
+        fireEvent.click(screen.getByRole("button", { name: "Anexos" }));
+        expect(ultima).toEqual(["sigilo", "anexos"]);
+        expect(aberto("Sigilo") && aberto("Anexos")).toBe(true);
+        fireEvent.click(screen.getByRole("button", { name: "Sigilo" }));
+        expect(ultima).toEqual(["anexos"]);
+        expect(aberto("Sigilo")).toBe(false);
+    });
+    it("open vazio é controlado (tudo fechado), não ausência", () => {
+        render(_jsx(Accordion, { items: ITENS, open: [] }));
+        expect(aberto("Prazos")).toBe(false);
+    });
+    it("item desabilitado não pede nada", () => {
+        const aoMudar = vi.fn();
+        render(_jsx(Accordion, { items: [{ id: "x", title: "Bloqueado", content: "...", disabled: true }], open: [], onOpenChange: aoMudar }));
+        fireEvent.click(screen.getByRole("button", { name: "Bloqueado" }));
+        expect(aoMudar).not.toHaveBeenCalled();
+    });
+});

package/dist/teste/AccordionTituloNeutro.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/AccordionTituloNeutro.test.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render } from "@testing-library/react";
+import Accordion from "../components/Accordion/Accordion";
+const ITENS = [
+    { id: "a", title: "Prazos", content: "Dez dias úteis." },
+    { id: "b", title: "Anexos", content: "Até 10 MB." },
+];
+describe("Accordion · titleVariant", () => {
+    it("neutral liga a classe do título neutro; o padrão e default não", () => {
+        const { container, rerender } = render(_jsx(Accordion, { items: ITENS, titleVariant: "neutral" }));
+        const raiz = () => container.firstElementChild;
+        expect(raiz()).toHaveClass("umds-accordion--title-neutral");
+        rerender(_jsx(Accordion, { items: ITENS, titleVariant: "default" }));
+        expect(raiz()).not.toHaveClass("umds-accordion--title-neutral");
+        rerender(_jsx(Accordion, { items: ITENS }));
+        expect(raiz()).not.toHaveClass("umds-accordion--title-neutral");
+    });
+    it("combina com a variant do accordion", () => {
+        const { container } = render(_jsx(Accordion, { items: ITENS, variant: "separated", titleVariant: "neutral" }));
+        expect(container.firstElementChild).toHaveClass("umds-accordion--separated", "umds-accordion--title-neutral");
+    });
+});

package/dist/teste/AppSubheaderRegiao.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/AppSubheaderRegiao.test.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render } from "@testing-library/react";
+import AppSubheader from "../components/AppSubheader/AppSubheader";
+import Breadcrumb from "../components/Breadcrumb/Breadcrumb";
+/** O jsdom não tem layout: a geometria real é conferida pela story "Só a página atual" (play, no navegador); a regra de CSS, pelo teste do Vue. */
+describe("AppSubheader · região do contexto", () => {
+    it("a trilha só com a página atual não tem nada focável dentro da região", () => {
+        const { container } = render(_jsx(AppSubheader, { children: _jsx(Breadcrumb, { items: [{ label: "Painel" }] }) }));
+        const contexto = container.querySelector(".umds-app-subheader__contexto");
+        expect(contexto.querySelector("a, button, [tabindex]")).toBeNull();
+    });
+});

package/dist/teste/AttachmentCardLista.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/AttachmentCardLista.test.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import AttachmentCard from "../components/AttachmentCard/AttachmentCard";
+const DETALHES = {
+    description: "Documento legível.",
+    fields: [
+        { label: "Nome completo", value: "Marcos Vinícius Tavares", copyable: true },
+        { label: "CPF", value: "123.456.789-09" },
+    ],
+};
+async function abrirPainel() {
+    const usuario = userEvent.setup();
+    render(_jsx(AttachmentCard, { fileName: "cnh.pdf", documentType: "CNH", status: "positive", statusLabel: "Pr\u00E9-aprovado", statusDetails: DETALHES }));
+    await usuario.click(screen.getByRole("button", { name: /Pré-aprovado/ }));
+    return usuario;
+}
+describe("AttachmentCard · o <dl> do painel é válido (axe definition-list)", () => {
+    it("o dl só tem div filhos, e cada div só tem dt e dd, nessa ordem", async () => {
+        await abrirPainel();
+        const dl = document.querySelector(".umds-attachment-card__campos");
+        expect(dl.tagName).toBe("DL");
+        const grupos = [...dl.children];
+        expect(grupos).toHaveLength(2);
+        for (const grupo of grupos) {
+            expect(grupo.tagName).toBe("DIV");
+            expect([...grupo.children].map((f) => f.tagName)).toEqual(["DT", "DD"]);
+        }
+    });
+    it("o botão de copiar mora dentro do dd, ao lado do valor, e continua com nome", async () => {
+        await abrirPainel();
+        const dd = document.querySelector(".umds-attachment-card__campo-valor");
+        expect(dd.tagName).toBe("DD");
+        expect(dd.querySelector(".umds-attachment-card__campo-valor-texto")).toHaveTextContent("Marcos Vinícius Tavares");
+        const botao = dd.querySelector("button");
+        expect(botao).toHaveAttribute("aria-label", "Copiar Nome completo");
+        // nenhum botão solto direto num div do dl
+        for (const grupo of document.querySelectorAll(".umds-attachment-card__campo")) {
+            expect(grupo.querySelector(":scope > button")).toBeNull();
+        }
+    });
+    it("o campo sem copyable não tem botão e o valor segue no dd", async () => {
+        await abrirPainel();
+        const campos = document.querySelectorAll(".umds-attachment-card__campo");
+        expect(campos[1].querySelector("button")).toBeNull();
+        expect(campos[1].querySelector("dd")).toHaveTextContent("123.456.789-09");
+    });
+});

package/dist/teste/AttachmentCardSm.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/AttachmentCardSm.test.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render } from "@testing-library/react";
+import AttachmentCard from "../components/AttachmentCard/AttachmentCard";
+const tamanho = (el) => el.style.width;
+describe("AttachmentCard · size", () => {
+    it("md (padrão): ícone do preview de 48px e o do rodapé no sm do Icon", () => {
+        const { container } = render(_jsx(AttachmentCard, { fileName: "Protocolo 104-2026.pdf" }));
+        expect(container.firstElementChild).not.toHaveClass("umds-attachment-card--sm");
+        expect(tamanho(container.querySelector(".umds-attachment-card__preview .umds-icon"))).toBe("48px");
+        const rodape = container.querySelector(".umds-attachment-card__rodape-icone .umds-icon");
+        expect(rodape).toHaveClass("umds-icon--sm");
+        expect(rodape.style.width).toBe("");
+    });
+    it("sm: ícone do preview de 40px e o do rodapé de 12px", () => {
+        const { container } = render(_jsx(AttachmentCard, { fileName: "Protocolo 104-2026.pdf", size: "sm" }));
+        expect(container.firstElementChild).toHaveClass("umds-attachment-card--sm");
+        expect(tamanho(container.querySelector(".umds-attachment-card__preview .umds-icon"))).toBe("40px");
+        expect(tamanho(container.querySelector(".umds-attachment-card__rodape-icone .umds-icon"))).toBe("12px");
+    });
+    it("o ícone central escolhido continua valendo no sm", () => {
+        const { container } = render(_jsx(AttachmentCard, { fileName: "a.pdf", size: "sm", documentType: "CNH", status: "positive", statusLabel: "Pr\u00E9-aprovado" }));
+        expect(container.querySelector(".umds-attachment-card__tipo-texto")).toHaveTextContent("CNH");
+        expect(container.querySelector(".umds-attachment-card__status-texto")).toHaveTextContent("Pré-aprovado");
+    });
+});

package/dist/teste/BadgeAttachedTomEPadding.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/BadgeAttachedTomEPadding.test.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render } from "@testing-library/react";
+import Badge from "../components/Badge/Badge";
+import { lerArquivo } from "./lerArquivo";
+const cssBadge = await lerArquivo("../core/src/components/Badge/Badge.css");
+const css = cssBadge.replace(/\r\n/g, "\n");
+const bloco = (seletor) => {
+    const inicio = css.indexOf(seletor + " {");
+    return css.slice(inicio, css.indexOf("}", inicio));
+};
+describe("Badge 2xs · padding lateral de 8px", () => {
+    it("a regra do 2xs usa o degrau nano (8px) dos lados e o micro (2px) em cima e embaixo", () => {
+        expect(bloco(".umds-badge--2xs")).toMatch(/padding:\s*var\(--umds-primitive-spacing-micro\)\s+var\(--umds-primitive-spacing-nano\)/);
+    });
+    it("os outros tamanhos não mudam de padding", () => {
+        expect(bloco(".umds-badge--xs")).toMatch(/padding:\s*var\(--umds-primitive-spacing-micro\)\s+var\(--umds-primitive-spacing-quarck\)/);
+        expect(bloco(".umds-badge--md")).toMatch(/padding:\s*var\(--umds-primitive-spacing-quarck\)\s+var\(--umds-primitive-spacing-nano\)/);
+    });
+});
+describe("Badge attached · 22px e tom escuro", () => {
+    it("o rótulo colado tem altura mínima de 22px (24 - 2), de qualquer tamanho", () => {
+        expect(bloco(".umds-badge--attached")).toMatch(/min-height:\s*calc\(var\(--umds-primitive-spacing-xxs\)\s*-\s*var\(--umds-primitive-spacing-micro\)\)/);
+        const { container } = render(_jsx(Badge, { attached: true, size: "xs", variant: "neutral", appearance: "solid", children: "Tarefa manual" }));
+        expect(container.firstElementChild).toHaveClass("umds-badge--attached", "umds-badge--xs");
+    });
+    it("attachedTone dark escreve a classe; sem ela e com light, não", () => {
+        const { container } = render(_jsxs(_Fragment, { children: [_jsx(Badge, { attached: true, attachedTone: "dark", variant: "neutral", appearance: "solid", children: "A" }), _jsx(Badge, { attached: true, variant: "neutral", appearance: "solid", children: "B" }), _jsx(Badge, { attached: true, attachedTone: "light", variant: "neutral", appearance: "solid", children: "C" })] }));
+        expect(container.children[0]).toHaveClass("umds-badge--attached-dark");
+        expect(container.children[1]).not.toHaveClass("umds-badge--attached-dark");
+        expect(container.children[2]).not.toHaveClass("umds-badge--attached-dark");
+    });
+    it("sem attached o tom é ignorado", () => {
+        const { container } = render(_jsx(Badge, { attachedTone: "dark", variant: "neutral", appearance: "solid", children: "A" }));
+        expect(container.firstElementChild).not.toHaveClass("umds-badge--attached-dark");
+    });
+    it("CSS: o escuro é neutral-dark-down com texto branco, só no neutro sólido colado", () => {
+        const regra = bloco(".umds-badge--attached.umds-badge--neutral.umds-badge--solid.umds-badge--attached-dark");
+        expect(regra).toMatch(/background-color:\s*var\(--umds-semantic-color-neutral-dark-down\)/);
+        expect(regra).toMatch(/color:\s*var\(--umds-semantic-color-neutral-light-pure\)/);
+        expect(bloco(".umds-badge--attached.umds-badge--neutral.umds-badge--solid")).toMatch(/neutral-light-medium/);
+    });
+});

package/dist/teste/BadgeNeutroColado.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/BadgeNeutroColado.test.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render } from "@testing-library/react";
+import Badge from "../components/Badge/Badge";
+/** A cascata de CSS de arquivo não existe no jsdom: a regra é conferida na fonte pelo teste do Vue; aqui, as classes no DOM. */
+describe("Badge attached neutral", () => {
+    it("o neutro colado e sólido leva as três classes que a regra de CSS escolhe", () => {
+        const { container } = render(_jsx(Badge, { attached: true, variant: "neutral", appearance: "solid", children: "Tarefa manual" }));
+        expect(container.firstElementChild).toHaveClass("umds-badge--attached", "umds-badge--neutral", "umds-badge--solid");
+    });
+});

package/dist/teste/BadgeTag.test.js

@@ -40,3 +40,16 @@ describe("Tag compacta, soft, pílula e novidade", () => {
         expect(raiz(container)).toHaveClass("umds-tag--new", "umds-tag--soft");
     });
 });
+describe("Badge attachedSide", () => {
+    it("right escreve o modificador do canto direito; left e o padrão não", () => {
+        const { container } = render(_jsxs(_Fragment, { children: [_jsx(Badge, { attached: true, attachedSide: "right", children: "A" }), _jsx(Badge, { attached: true, attachedSide: "left", children: "B" }), _jsx(Badge, { attached: true, children: "C" })] }));
+        expect(container.children[0]).toHaveClass("umds-badge--attached", "umds-badge--attached-right");
+        expect(container.children[1]).not.toHaveClass("umds-badge--attached-right");
+        expect(container.children[2]).not.toHaveClass("umds-badge--attached-right");
+    });
+    it("attachedSide sem attached não faz nada", () => {
+        const { container } = render(_jsx(Badge, { attachedSide: "right", children: "A" }));
+        expect(raiz(container)).not.toHaveClass("umds-badge--attached-right");
+        expect(raiz(container)).not.toHaveClass("umds-badge--attached");
+    });
+});

package/dist/teste/ButtonDensidade.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/ButtonDensidade.test.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import Button from "../components/Button/Button";
+import { lerArquivo } from "./lerArquivo";
+const cssButton = await lerArquivo("../core/src/components/Button/Button.css");
+const css = cssButton.replace(/\r\n/g, "\n");
+const bloco = (seletor) => {
+    const inicio = css.indexOf(seletor + " {");
+    return css.slice(inicio, css.indexOf("}", inicio));
+};
+describe("Button · density", () => {
+    it("comfortable escreve a classe; sem a prop e com default o botão é o de antes", () => {
+        render(_jsxs(_Fragment, { children: [_jsx(Button, { size: "sm", density: "comfortable", children: "A" }), _jsx(Button, { size: "sm", children: "B" }), _jsx(Button, { size: "sm", density: "default", children: "C" })] }));
+        expect(screen.getByRole("button", { name: "A" })).toHaveClass("umds-button--sm", "umds-button--comfortable");
+        expect(screen.getByRole("button", { name: "B" })).not.toHaveClass("umds-button--comfortable");
+        expect(screen.getByRole("button", { name: "C" })).not.toHaveClass("umds-button--comfortable");
+    });
+    it("CSS: o sm confortável tem 12px de padding lateral; o sm de antes segue em 8px; o só-ícone fica de fora", () => {
+        expect(bloco(".umds-button--sm.umds-button--comfortable:not(.umds-button--icon)")).toMatch(/padding:\s*0\s+var\(--umds-primitive-spacing-mini\)/);
+        expect(bloco(".umds-button--sm")).toMatch(/padding:\s*0\s+var\(--umds-primitive-spacing-nano\)/);
+    });
+    it("os outros tamanhos mantêm o padding (a densidade só mexe no sm)", () => {
+        expect(bloco(".umds-button--xs")).toMatch(/padding:\s*0\s+var\(--umds-primitive-spacing-mini\)/);
+        expect(bloco(".umds-button--md")).toMatch(/padding:\s*0\s+var\(--umds-primitive-spacing-xxxs\)/);
+        expect(bloco(".umds-button--lg")).toMatch(/padding:\s*0\s+var\(--umds-primitive-spacing-xxs\)/);
+    });
+});

package/dist/teste/CalendarCabecalho.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/CalendarCabecalho.test.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import Calendar from "../components/Calendar/Calendar";
+describe("Calendar · cabeçalho", () => {
+    it("headerStart e headerEnd (React: props com nó) chegam ao cabeçalho", () => {
+        render(_jsx(Calendar, { events: [], defaultDate: "2026-10-08", headerStart: _jsx("span", { children: "Todos os documentos" }), headerEnd: _jsx("span", { children: "Legenda" }) }));
+        expect(screen.getByText("Todos os documentos")).toBeInTheDocument();
+        expect(screen.getByText("Legenda")).toBeInTheDocument();
+    });
+});

package/dist/teste/CalendarCompacto.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/CalendarCompacto.test.js

@@ -0,0 +1,29 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import Calendar from "../components/Calendar/Calendar";
+import { render } from "@testing-library/react";
+import { lerArquivo } from "./lerArquivo";
+const cssCalendar = await lerArquivo("../core/src/components/Calendar/Calendar.css");
+const CSS = { Calendar: cssCalendar };
+const css = (componente) => CSS[componente].replace(/\r\n/g, "\n");
+const bloco = (texto, seletor) => {
+    const inicio = texto.indexOf(seletor + " {");
+    expect(inicio, seletor).toBeGreaterThanOrEqual(0);
+    return texto.slice(inicio, texto.indexOf("}", inicio));
+};
+describe("Calendar · density compact", () => {
+    it("compact escreve a classe na raiz; sem a prop, não", () => {
+        const { container } = render(_jsxs(_Fragment, { children: [_jsx(Calendar, { today: "2026-05-15", defaultDate: "2026-05-15", density: "compact" }), _jsx(Calendar, { today: "2026-05-15", defaultDate: "2026-05-15" })] }));
+        expect(container.children[0]).toHaveClass("umds-calendar--compact", "umds-calendar--month");
+        expect(container.children[1]).not.toHaveClass("umds-calendar--compact");
+    });
+    it("CSS: evento de 20px (16 + 4), 4px de padding lateral e linha de 16px; o título só é cortado quando passa da largura", () => {
+        const t = css("Calendar");
+        const compacto = bloco(t, ".umds-calendar--compact .umds-calendar__event");
+        expect(compacto).toMatch(/min-height:\s*calc\(var\(--umds-primitive-spacing-xxxs\)\s*\+\s*var\(--umds-primitive-spacing-quarck\)\)/);
+        expect(compacto).toMatch(/padding:\s*var\(--umds-primitive-spacing-micro\)\s+var\(--umds-primitive-spacing-quarck\)/);
+        expect(compacto).toMatch(/line-height:\s*var\(--umds-primitive-spacing-xxxs\)/);
+        const titulo = bloco(t, ".umds-calendar__event-title");
+        expect(titulo).toMatch(/text-overflow:\s*ellipsis/);
+    });
+});

package/dist/teste/CoachmarkSemVeu.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/teste/CoachmarkSemVeu.test.js

@@ -0,0 +1,85 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { describe, expect, it, vi } from "vitest";
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import Coachmark from "../components/Coachmark/Coachmark";
+const PASSOS = [{ target: "#alvo-a", title: "Novo: arrastar", content: "Arraste a linha para trocar a ordem." }];
+function Pagina(props) {
+    return (_jsxs("div", { children: [_jsx("button", { id: "alvo-a", children: "A" }), _jsx("button", { id: "fora", children: "Fora" }), _jsx(Coachmark, { steps: PASSOS, open: true, ...props })] }));
+}
+describe("Coachmark · modal={false}", () => {
+    it("sem véu nem recorte; o cartão é um diálogo não modal e a raiz deixa o ponteiro passar", () => {
+        const { baseElement } = render(_jsx(Pagina, { modal: false }));
+        expect(baseElement.querySelector(".umds-coachmark__veil")).toBeNull();
+        expect(baseElement.querySelector(".umds-coachmark__cutout")).toBeNull();
+        expect(baseElement.querySelector(".umds-coachmark")).toHaveClass("umds-coachmark--modeless");
+        expect(screen.getByRole("dialog", { name: "Novo: arrastar" })).toHaveAttribute("aria-modal", "false");
+    });
+    it("o padrão continua modal: véu, recorte e aria-modal verdadeiro", () => {
+        const { baseElement } = render(_jsx(Pagina, {}));
+        expect(baseElement.querySelector(".umds-coachmark__veil")).not.toBeNull();
+        expect(baseElement.querySelector(".umds-coachmark__cutout")).not.toBeNull();
+        expect(baseElement.querySelector(".umds-coachmark")).not.toHaveClass("umds-coachmark--modeless");
+        expect(screen.getByRole("dialog")).toHaveAttribute("aria-modal", "true");
+        const { unmount } = render(_jsx(Pagina, { modal: true }));
+        unmount();
+    });
+    it("o foco entra no cartão, mas o Tab não fica preso", async () => {
+        render(_jsx(Pagina, { modal: false }));
+        const cartao = screen.getByRole("dialog");
+        await waitFor(() => expect(cartao).toHaveFocus());
+        const concluir = screen.getByRole("button", { name: "Concluir" });
+        concluir.focus();
+        const evento = new KeyboardEvent("keydown", { key: "Tab", bubbles: true, cancelable: true });
+        concluir.dispatchEvent(evento);
+        expect(evento.defaultPrevented).toBe(false);
+    });
+    it("no modal o Tab continua preso (o último volta ao primeiro)", () => {
+        render(_jsx(Pagina, {}));
+        const concluir = screen.getByRole("button", { name: "Concluir" });
+        concluir.focus();
+        const evento = new KeyboardEvent("keydown", { key: "Tab", bubbles: true, cancelable: true });
+        concluir.dispatchEvent(evento);
+        expect(evento.defaultPrevented).toBe(true);
+    });
+    it("a página segue clicável: o clique fora não é capturado e o tour não fecha sozinho", () => {
+        const aoFechar = vi.fn();
+        render(_jsx(Pagina, { modal: false, onClose: aoFechar }));
+        fireEvent.click(screen.getByRole("button", { name: "Fora" }));
+        expect(aoFechar).not.toHaveBeenCalled();
+        expect(screen.getByRole("dialog")).toBeInTheDocument();
+    });
+    it("o Esc fecha de qualquer lugar da página, uma vez só", () => {
+        const aoFechar = vi.fn();
+        render(_jsx(Pagina, { modal: false, onClose: aoFechar }));
+        const fora = screen.getByRole("button", { name: "Fora" });
+        fora.focus();
+        fireEvent.keyDown(fora, { key: "Escape" });
+        expect(aoFechar).toHaveBeenCalledTimes(1);
+        expect(aoFechar).toHaveBeenCalledWith("escape");
+    });
+    it("o Esc dentro do cartão também fecha uma vez só", async () => {
+        const aoFechar = vi.fn();
+        render(_jsx(Pagina, { modal: false, onClose: aoFechar }));
+        await waitFor(() => expect(screen.getByRole("dialog")).toHaveFocus());
+        fireEvent.keyDown(screen.getByRole("dialog"), { key: "Escape" });
+        expect(aoFechar).toHaveBeenCalledTimes(1);
+    });
+    it("depois de fechar, o ouvinte do Esc sai do documento", () => {
+        const aoFechar = vi.fn();
+        const { rerender } = render(_jsx(Pagina, { modal: false, onClose: aoFechar }));
+        rerender(_jsx(Pagina, { modal: false, open: false, onClose: aoFechar }));
+        fireEvent.keyDown(document, { key: "Escape" });
+        expect(aoFechar).not.toHaveBeenCalled();
+    });
+    it("ao fechar, o foco volta ao elemento de antes, se a pessoa não foi a outro lugar", async () => {
+        const { rerender } = render(_jsx(Pagina, { modal: false, open: false }));
+        const gatilho = screen.getByRole("button", { name: "Fora" });
+        gatilho.focus();
+        expect(gatilho).toHaveFocus();
+        rerender(_jsx(Pagina, { modal: false, open: true }));
+        // O foco entra no cartão depois da montagem (um quadro de animação).
+        await waitFor(() => expect(screen.getByRole("dialog")).toHaveFocus());
+        rerender(_jsx(Pagina, { modal: false, open: false }));
+        await waitFor(() => expect(gatilho).toHaveFocus());
+    });
+});

package/dist/teste/CoachmarkUmPasso.test.d.ts

@@ -0,0 +1 @@
+export {};