@1doc/1ds-react 2.7.2 → 2.9.0

package/dist/teste/AtributosRepassados.test.js

@@ -0,0 +1,52 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render } from "@testing-library/react";
+import Text from "../components/Text/Text";
+import Grid from "../components/Grid/Grid";
+import Logo from "../components/Logo/Logo";
+import Button from "../components/Button/Button";
+import DataTable from "../components/DataTable/DataTable";
+/**
+ * Paridade com o Vue: no Vue gerado, Text, Grid e Logo descartavam
+ * `title`, `style` e `aria-*`, o Button escrevia `autofocus="false"` e o
+ * DataTable a classe `--selected.value`. O React nunca teve o defeito; o teste
+ * garante que a correção do Vue não o introduza aqui (mesma fonte Mitosis).
+ */
+describe("atributos repassados ao elemento raiz", () => {
+    it("Text repassa title, style e aria-*", () => {
+        const { container } = render(_jsx(Text, { title: "Dica", style: { marginTop: 4 }, "aria-live": "polite", "data-x": "1", children: "Ol\u00E1" }));
+        const el = container.firstElementChild;
+        expect(el.getAttribute("title")).toBe("Dica");
+        expect(el.style.marginTop).toBe("4px");
+        expect(el.getAttribute("aria-live")).toBe("polite");
+        expect(el.getAttribute("data-x")).toBe("1");
+    });
+    it("Grid repassa title, style e aria-*", () => {
+        const { container } = render(_jsx(Grid, { container: true, spacing: "xxxs", title: "Dica", style: { marginTop: 4 }, "aria-label": "\u00C1rea", children: "x" }));
+        const el = container.firstElementChild;
+        expect(el.getAttribute("title")).toBe("Dica");
+        expect(el.style.marginTop).toBe("4px");
+        expect(el.getAttribute("aria-label")).toBe("Área");
+    });
+    it("Logo repassa title, style e aria-*", () => {
+        const { container } = render(_jsx(Logo, { title: "Dica", style: { width: 80 }, "aria-hidden": "true" }));
+        const el = container.firstElementChild;
+        expect(el.getAttribute("title")).toBe("Dica");
+        expect(el.style.width).toBe("80px");
+        expect(el.getAttribute("aria-hidden")).toBe("true");
+    });
+});
+describe("Button · autoFocus", () => {
+    it("não escreve autofocus quando falso ou ausente", () => {
+        const { container } = render(_jsx(Button, { children: "Salvar" }));
+        expect(container.querySelector("[autofocus]")).toBeNull();
+    });
+});
+describe("DataTable · linha selecionada", () => {
+    it("a classe --selected vai limpa, só na linha selecionada", () => {
+        const { container } = render(_jsx(DataTable, { columns: [{ key: "nome", label: "Nome" }], data: [{ nome: "Cris Lima" }, { nome: "Ana Paula" }], selectable: true, selectedRows: [0] }));
+        const marcadas = container.querySelectorAll(".umds-datatable__row--selected");
+        expect(marcadas).toHaveLength(1);
+        expect(container.innerHTML).not.toContain(".value");
+    });
+});

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

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

package/dist/teste/AttachmentCardIA.test.js

@@ -0,0 +1,89 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { beforeAll, describe, expect, it, vi } from "vitest";
+import { render, screen, waitFor } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import AttachmentCard from "../components/AttachmentCard/AttachmentCard";
+beforeAll(() => {
+    if (!globalThis.ResizeObserver) {
+        globalThis.ResizeObserver = class {
+            observe() { }
+            unobserve() { }
+            disconnect() { }
+        };
+    }
+});
+function cartaoDeIA(extra = {}) {
+    const aoAplicar = vi.fn();
+    const ui = (_jsx(AttachmentCard, { fileName: "protocolo.pdf", documentType: "Protocolo", status: "ai", statusLabel: "Recursos IA", onOpen: () => { }, panel: _jsxs("div", { children: [_jsx("p", { children: "A IA sugere um assunto." }), _jsx("button", { type: "button", onClick: aoAplicar, children: "Aplicar sugest\u00E3o" })] }), ...extra }));
+    return { aoAplicar, ...render(ui) };
+}
+describe("AttachmentCard · status ai", () => {
+    it("escreve a classe do selo de IA e usa a varinha por padrão", () => {
+        const { container } = render(_jsx(AttachmentCard, { fileName: "x.pdf", status: "ai", statusLabel: "Recursos IA" }));
+        const selo = container.querySelector(".umds-attachment-card__status");
+        expect(selo).toHaveClass("umds-attachment-card__status--ai");
+        expect(selo.querySelector("svg")).not.toBeNull();
+    });
+    it("só o selo de IA ganha ícone por padrão", () => {
+        const { container } = render(_jsx(AttachmentCard, { fileName: "x.pdf", status: "positive", statusLabel: "Ok" }));
+        expect(container.querySelector(".umds-attachment-card__status svg")).toBeNull();
+    });
+});
+describe("AttachmentCard · slot panel", () => {
+    it("o painel livre substitui o resultado da conferência, e o selo vira botão sem statusDetails", async () => {
+        const usuario = userEvent.setup();
+        cartaoDeIA();
+        const selo = screen.getByRole("button", { name: /^Recursos IA/ });
+        expect(selo).toHaveAttribute("aria-haspopup", "dialog");
+        await usuario.click(selo);
+        const painel = await screen.findByRole("dialog");
+        expect(painel).toHaveTextContent("A IA sugere um assunto.");
+        expect(screen.getByRole("button", { name: "Aplicar sugestão" })).toBeInTheDocument();
+        // sem título interno: o painel é nomeado pelo selo
+        expect(painel).not.toHaveAttribute("aria-labelledby");
+        expect(painel).toHaveAccessibleName(/Recursos IA/);
+    });
+    it("sem panel nem statusDetails o selo não é botão", () => {
+        render(_jsx(AttachmentCard, { fileName: "x.pdf", status: "ai", statusLabel: "Recursos IA" }));
+        expect(screen.queryByRole("button")).toBeNull();
+    });
+    it("panelWidth escreve a largura do painel; sem ela não há style", async () => {
+        const usuario = userEvent.setup();
+        cartaoDeIA({ panelWidth: 280 });
+        await usuario.click(screen.getByRole("button", { name: /^Recursos IA/ }));
+        expect((await screen.findByRole("dialog")).style.width).toBe("280px");
+    });
+    it("sem panelWidth o painel não leva style", async () => {
+        const usuario = userEvent.setup();
+        cartaoDeIA();
+        await usuario.click(screen.getByRole("button", { name: /^Recursos IA/ }));
+        expect((await screen.findByRole("dialog")).getAttribute("style")).toBeNull();
+    });
+});
+describe("AttachmentCard · closePanelOnAction", () => {
+    it("acionar um botão do painel fecha, devolve o foco ao selo e a ação chega ao app", async () => {
+        const usuario = userEvent.setup();
+        const { aoAplicar } = cartaoDeIA({ closePanelOnAction: true });
+        const selo = screen.getByRole("button", { name: /^Recursos IA/ });
+        await usuario.click(selo);
+        await usuario.click(await screen.findByRole("button", { name: "Aplicar sugestão" }));
+        expect(aoAplicar).toHaveBeenCalledTimes(1);
+        await waitFor(() => expect(screen.queryByRole("dialog")).toBeNull());
+        expect(selo).toHaveFocus();
+    });
+    it("sem a prop o painel continua aberto depois da ação", async () => {
+        const usuario = userEvent.setup();
+        const { aoAplicar } = cartaoDeIA();
+        await usuario.click(screen.getByRole("button", { name: /^Recursos IA/ }));
+        await usuario.click(await screen.findByRole("button", { name: "Aplicar sugestão" }));
+        expect(aoAplicar).toHaveBeenCalledTimes(1);
+        expect(screen.getByRole("dialog")).toBeInTheDocument();
+    });
+    it("o botão de copiar um campo não fecha o painel", async () => {
+        const usuario = userEvent.setup();
+        render(_jsx(AttachmentCard, { fileName: "cpf.pdf", status: "positive", statusLabel: "Pr\u00E9-aprovado", closePanelOnAction: true, statusDetails: { fields: [{ label: "CPF", value: "384.221.760-05", copyable: true }] } }));
+        await usuario.click(screen.getByRole("button", { name: /^Pré-aprovado/ }));
+        await usuario.click(await screen.findByRole("button", { name: "Copiar CPF" }));
+        expect(screen.getByRole("dialog")).toBeInTheDocument();
+    });
+});

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

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

package/dist/teste/AvatarGroupOverlap.test.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import AvatarGroup from "../components/Avatar/AvatarGroup";
+const PESSOAS = [
+    { name: "Ana Souza" },
+    { name: "Bruno Lima" },
+    { name: "Carla Dias" },
+    { name: "Diego Ferraz" },
+    { name: "Eduarda Neves" },
+];
+const grupo = (c) => c.firstElementChild;
+describe("AvatarGroup · overflowCount", () => {
+    it("sem a prop, o +N é o que passou de max (como antes)", () => {
+        render(_jsx(AvatarGroup, { avatars: PESSOAS, max: 3 }));
+        expect(screen.getByText("+2")).toBeInTheDocument();
+    });
+    it("overflowCount vira o +N sem itens-fantasma", () => {
+        render(_jsx(AvatarGroup, { avatars: PESSOAS.slice(0, 3), max: 3, overflowCount: 12 }));
+        expect(screen.getByText("+12")).toBeInTheDocument();
+    });
+    it("soma com o que passou de max dentro de avatars", () => {
+        render(_jsx(AvatarGroup, { avatars: PESSOAS, max: 3, overflowCount: 10 }));
+        expect(screen.getByText("+12")).toBeInTheDocument();
+    });
+    it("o rótulo traduzido recebe o total escondido", () => {
+        render(_jsx(AvatarGroup, { avatars: PESSOAS.slice(0, 2), max: 2, overflowCount: 7, overflowTitle: (n) => n + " others", overflowAriaLabel: (n) => n + " more avatars" }));
+        expect(screen.getByTitle("7 others")).toBeInTheDocument();
+    });
+    it("sem excedente nenhum, não há +N", () => {
+        render(_jsx(AvatarGroup, { avatars: PESSOAS.slice(0, 2), max: 4 }));
+        expect(screen.queryByText(/^\+/)).toBeNull();
+    });
+    it("overflowCount 0 não cria +0", () => {
+        render(_jsx(AvatarGroup, { avatars: PESSOAS.slice(0, 2), max: 4, overflowCount: 0 }));
+        expect(screen.queryByText(/^\+/)).toBeNull();
+    });
+});
+describe("AvatarGroup · overlap e ring", () => {
+    it("escrevem as variáveis do grupo em px", () => {
+        const { container } = render(_jsx(AvatarGroup, { avatars: PESSOAS, overlap: 6, ring: 1 }));
+        const el = grupo(container);
+        expect(el.style.getPropertyValue("--umds-avatar-group-overlap")).toBe("6px");
+        expect(el.style.getPropertyValue("--umds-avatar-group-ring")).toBe("1px");
+    });
+    it("só overlap não mexe no anel", () => {
+        const { container } = render(_jsx(AvatarGroup, { avatars: PESSOAS, overlap: 4 }));
+        const el = grupo(container);
+        expect(el.style.getPropertyValue("--umds-avatar-group-overlap")).toBe("4px");
+        expect(el.style.getPropertyValue("--umds-avatar-group-ring")).toBe("");
+    });
+    it("sem as props, nenhum style: valem os padrões do CSS", () => {
+        const { container } = render(_jsx(AvatarGroup, { avatars: PESSOAS }));
+        expect(grupo(container).getAttribute("style")).toBeNull();
+    });
+});

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

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

package/dist/teste/BadgeTag.test.js

@@ -0,0 +1,42 @@
+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 Tag from "../components/Tag/Tag";
+const raiz = (c) => c.firstElementChild;
+describe("Badge compacto, novidade e colado", () => {
+    it("size 2xs escreve a classe; sem size continua md", () => {
+        const { container } = render(_jsxs(_Fragment, { children: [_jsx(Badge, { size: "2xs", children: "A" }), _jsx(Badge, { children: "B" })] }));
+        expect(container.children[0]).toHaveClass("umds-badge--2xs");
+        expect(container.children[1]).toHaveClass("umds-badge--md");
+    });
+    it("variant new escreve a classe da variante", () => {
+        const { container } = render(_jsx(Badge, { variant: "new", children: "Novidade" }));
+        expect(raiz(container)).toHaveClass("umds-badge--new");
+    });
+    it("attached escreve o modificador; sem ele não há", () => {
+        const { container } = render(_jsxs(_Fragment, { children: [_jsx(Badge, { attached: true, children: "A" }), _jsx(Badge, { children: "B" })] }));
+        expect(container.children[0]).toHaveClass("umds-badge--attached");
+        expect(container.children[1]).not.toHaveClass("umds-badge--attached");
+    });
+});
+describe("Tag compacta, soft, pílula e novidade", () => {
+    it("size xs escreve a classe e sm continua", () => {
+        const { container } = render(_jsxs(_Fragment, { children: [_jsx(Tag, { label: "a", size: "xs" }), _jsx(Tag, { label: "b", size: "sm" })] }));
+        expect(container.children[0]).toHaveClass("umds-tag--xs");
+        expect(container.children[1]).toHaveClass("umds-tag--sm");
+    });
+    it("appearance soft e pill escrevem as classes", () => {
+        const { container } = render(_jsx(Tag, { label: "SOBR", appearance: "soft", variant: "primary", pill: true }));
+        expect(raiz(container)).toHaveClass("umds-tag--soft", "umds-tag--primary", "umds-tag--pill");
+    });
+    it("sem pill não há a classe; padrão segue outlined", () => {
+        const { container } = render(_jsx(Tag, { label: "x" }));
+        expect(raiz(container)).toHaveClass("umds-tag--outlined");
+        expect(raiz(container)).not.toHaveClass("umds-tag--pill");
+    });
+    it("variant new escreve a classe", () => {
+        const { container } = render(_jsx(Tag, { label: "Dado simulado", variant: "new", appearance: "soft" }));
+        expect(raiz(container)).toHaveClass("umds-tag--new", "umds-tag--soft");
+    });
+});

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

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

package/dist/teste/BottomSheet.test.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import BottomSheet from "../components/BottomSheet/BottomSheet";
+/**
+ * BottomSheet sem `title`, sem `ariaLabel` e sem `ariaLabelledby` saía com
+ * `role="dialog"` anônimo. Agora cai no genérico "Painel", como o Drawer.
+ */
+describe("BottomSheet · nome acessível", () => {
+    it("com title, é nomeado pelo título", () => {
+        render(_jsx(BottomSheet, { open: true, title: "Detalhes do processo" }));
+        const painel = screen.getByRole("dialog", { name: "Detalhes do processo" });
+        expect(painel).not.toHaveAttribute("aria-label");
+    });
+    it("sem title, usa ariaLabel", () => {
+        render(_jsx(BottomSheet, { open: true, ariaLabel: "Filtros" }));
+        expect(screen.getByRole("dialog", { name: "Filtros" })).toBeInTheDocument();
+    });
+    it("sem nome nenhum, nunca sai anônimo", () => {
+        render(_jsx(BottomSheet, { open: true }));
+        expect(screen.getByRole("dialog", { name: "Painel" })).toBeInTheDocument();
+    });
+});

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

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

package/dist/teste/BoxItemFlex.test.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { describe, expect, it, vi } from "vitest";
+import { fireEvent, render, screen } from "@testing-library/react";
+import Box from "../components/Box/Box";
+describe("Box como item flex e com `as`", () => {
+    it("sem `as` continua um div", () => {
+        const { container } = render(_jsx(Box, { padding: "md", children: "x" }));
+        expect(container.firstElementChild?.tagName).toBe("DIV");
+    });
+    for (const tag of ["div", "span", "ul", "ol", "li", "section", "nav", "header", "footer", "form"]) {
+        it(`as="${tag}" renderiza <${tag}> e só ele`, () => {
+            const { container } = render(_jsx(Box, { as: tag, children: "x" }));
+            expect(container.firstElementChild?.tagName).toBe(tag.toUpperCase());
+            expect(container.children).toHaveLength(1);
+        });
+    }
+    it("ul e ol mantêm a semântica de lista (role=list)", () => {
+        render(_jsxs(_Fragment, { children: [_jsx(Box, { as: "ul", "aria-label": "Itens", children: _jsx(Box, { as: "li", children: "a" }) }), _jsx(Box, { as: "ol", "aria-label": "Passos", children: _jsx(Box, { as: "li", children: "b" }) })] }));
+        expect(screen.getByRole("list", { name: "Itens" }).tagName).toBe("UL");
+        expect(screen.getByRole("list", { name: "Passos" }).tagName).toBe("OL");
+    });
+    it("nav com aria-label vira região de navegação nomeada", () => {
+        render(_jsx(Box, { as: "nav", "aria-label": "Atalhos", children: "x" }));
+        expect(screen.getByRole("navigation", { name: "Atalhos" })).toBeInTheDocument();
+    });
+    it("as=form chama onSubmit", () => {
+        const aoEnviar = vi.fn((e) => e.preventDefault());
+        const { container } = render(_jsx(Box, { as: "form", onSubmit: aoEnviar, children: _jsx("button", { type: "submit", children: "Enviar" }) }));
+        fireEvent.submit(container.querySelector("form"));
+        expect(aoEnviar).toHaveBeenCalledTimes(1);
+    });
+    it("escreve as classes de item flex", () => {
+        const { container } = render(_jsx(Box, { grow: true, shrink: "0", basis: "50", minWidth: "auto", overflow: "hidden", overflowX: "auto", overflowY: "scroll", fullHeight: true, fullWidth: true, children: "x" }));
+        const el = container.firstElementChild;
+        for (const c of [
+            "umds-box--grow",
+            "umds-box--shrink-0",
+            "umds-box--basis-50",
+            "umds-box--min-w-auto",
+            "umds-box--overflow-hidden",
+            "umds-box--overflow-x-auto",
+            "umds-box--overflow-y-scroll",
+            "umds-box--full-height",
+            "umds-box--full",
+        ]) {
+            expect(el).toHaveClass(c);
+        }
+    });
+    it("sem as props de item não escreve nenhuma classe delas", () => {
+        const { container } = render(_jsx(Box, { padding: "md", children: "x" }));
+        const classes = container.firstElementChild.className;
+        expect(classes).not.toMatch(/grow|shrink|basis|min-w|overflow|full-height/);
+    });
+});

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

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

package/dist/teste/BoxLayout.test.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it } from "vitest";
+import { render, screen } from "@testing-library/react";
+import Box from "../components/Box/Box";
+describe("Box de layout", () => {
+    it("sem props de layout não vira flex", () => {
+        const { container } = render(_jsx(Box, { padding: "md", bordered: true, children: "x" }));
+        expect(container.firstElementChild).not.toHaveClass("umds-box--flex");
+    });
+    it("com direction, gap, align, justify e wrap vira flex", () => {
+        const { container } = render(_jsx(Box, { direction: "horizontal", gap: "xxxs", align: "center", justify: "between", wrap: true, padding: "md", children: "x" }));
+        const el = container.firstElementChild;
+        for (const c of [
+            "umds-box--flex",
+            "umds-box--horizontal",
+            "umds-box--gap-xxxs",
+            "umds-box--align-center",
+            "umds-box--justify-between",
+            "umds-box--wrap",
+            "umds-box--p-md",
+        ]) {
+            expect(el).toHaveClass(c);
+        }
+    });
+    it("só com gap vira flex vertical", () => {
+        const { container } = render(_jsx(Box, { gap: "xs", children: "x" }));
+        expect(container.firstElementChild).toHaveClass("umds-box--flex", "umds-box--vertical");
+    });
+    it("repassa id, role, aria-label e style", () => {
+        render(_jsx(Box, { id: "r", role: "region", "aria-label": "Resumo", style: { marginTop: 4 }, children: "x" }));
+        const el = screen.getByRole("region", { name: "Resumo" });
+        expect(el.id).toBe("r");
+        expect(el.style.marginTop).toBe("4px");
+    });
+});

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

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

package/dist/teste/Button.test.js

@@ -0,0 +1,27 @@
+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 { faPlus } from "@fortawesome/free-solid-svg-icons";
+import Button from "../components/Button/Button";
+describe("Button: variante neutral-text e tamanho xs", () => {
+    it("neutral-text escreve a classe da variante", () => {
+        render(_jsx(Button, { variant: "neutral-text", children: "Simular" }));
+        expect(screen.getByRole("button", { name: "Simular" })).toHaveClass("umds-button--neutral-text");
+    });
+    it("neutral continua sendo o contornado cinza", () => {
+        render(_jsx(Button, { variant: "neutral", children: "Ordenar" }));
+        const botao = screen.getByRole("button", { name: "Ordenar" });
+        expect(botao).toHaveClass("umds-button--neutral");
+        expect(botao).not.toHaveClass("umds-button--neutral-text");
+    });
+    it("size xs escreve a classe e o botão sem size continua md", () => {
+        render(_jsxs(_Fragment, { children: [_jsx(Button, { size: "xs", children: "Resolver" }), _jsx(Button, { children: "Padr\u00E3o" })] }));
+        expect(screen.getByRole("button", { name: "Resolver" })).toHaveClass("umds-button--xs");
+        expect(screen.getByRole("button", { name: "Padrão" })).toHaveClass("umds-button--md");
+    });
+    it("no xs o ícone usa o tamanho sm do Icon (o CSS do botão o reduz)", () => {
+        const { container } = render(_jsx(Button, { size: "xs", startIcon: faPlus, children: "Novo" }));
+        expect(container.querySelector(".umds-icon")).toHaveClass("umds-icon--sm");
+        expect(container.querySelector(".umds-icon--xs")).toBeNull();
+    });
+});

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

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

package/dist/teste/Calendar.test.js

@@ -0,0 +1,221 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { describe, expect, it, vi } from "vitest";
+import { useState } from "react";
+import { render, screen, within } from "@testing-library/react";
+import userEvent from "@testing-library/user-event";
+import Calendar from "../components/Calendar/Calendar";
+const HOJE = "2026-05-15";
+const EVENTOS = [
+    { id: "a", date: "2026-05-04", title: "Proc. Administrativo 002/2020", color: "--umds-primitive-blue-pure" },
+    { id: "b", date: "2026-05-11", title: "Protocolo 005/2020", color: "--umds-primitive-green-pure", time: "09:00" },
+    { id: "c", date: "2026-05-11", title: "Ofício 001/2020", color: "--umds-primitive-red-pure", time: "08:00" },
+    { id: "d1", date: "2026-05-20", title: "Reunião 1" },
+    { id: "d2", date: "2026-05-20", title: "Reunião 2" },
+    { id: "d3", date: "2026-05-20", title: "Reunião 3" },
+    { id: "d4", date: "2026-05-20", title: "Reunião 4" },
+    { id: "d5", date: "2026-05-20", title: "Reunião 5" },
+];
+const celula = (container, iso) => container.querySelector(`[data-date="${iso}"]`);
+describe("Calendar", () => {
+    it("é uma grade nomeada pelo mês, com sete cabeçalhos de dia", () => {
+        render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE }));
+        expect(screen.getByRole("grid", { name: "Maio 2026" })).toBeInTheDocument();
+        const cabecalhos = screen.getAllByRole("columnheader");
+        expect(cabecalhos).toHaveLength(7);
+        expect(cabecalhos[0]).toHaveAccessibleName("Domingo");
+        expect(screen.getByText("Maio 2026")).toBeInTheDocument();
+    });
+    it("o mês de maio de 2026 ocupa seis semanas inteiras; dias de fora ganham a classe", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE }));
+        expect(container.querySelectorAll('[role="gridcell"]')).toHaveLength(42);
+        expect(celula(container, "2026-04-26")).toHaveClass("umds-calendar__cell--outside");
+        expect(celula(container, "2026-05-15")).not.toHaveClass("umds-calendar__cell--outside");
+    });
+    it("hoje é marcado com aria-current", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE }));
+        expect(celula(container, HOJE)).toHaveAttribute("aria-current", "date");
+        expect(celula(container, "2026-05-16")).not.toHaveAttribute("aria-current");
+    });
+    it("cada dia tem nome acessível com a data e a contagem de eventos", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, events: EVENTOS }));
+        expect(celula(container, "2026-05-11")).toHaveAttribute("aria-label", "segunda-feira, 11 de maio de 2026, 2 eventos");
+        expect(celula(container, "2026-05-04")).toHaveAttribute("aria-label", "segunda-feira, 4 de maio de 2026, 1 evento");
+        expect(celula(container, "2026-05-12")).toHaveAttribute("aria-label", "terça-feira, 12 de maio de 2026, sem eventos");
+    });
+    it("dayLabel troca o nome do dia", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, dayLabel: (iso, n) => `${iso}:${n}`, events: EVENTOS }));
+        expect(celula(container, "2026-05-11")).toHaveAttribute("aria-label", "2026-05-11:2");
+    });
+    it("os eventos caem no dia certo, em ordem de horário, com a cor do dado", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, events: EVENTOS }));
+        const dia = celula(container, "2026-05-11");
+        const chips = within(dia).getAllByRole("button");
+        expect(chips).toHaveLength(2);
+        expect(chips[0]).toHaveTextContent("08:00");
+        expect(chips[0]).toHaveTextContent("Ofício 001/2020");
+        expect(chips[0].style.borderLeftColor).toBe("var(--umds-primitive-red-pure)");
+    });
+    it("evento sem cor usa o primário", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, events: EVENTOS }));
+        const chip = within(celula(container, "2026-05-20")).getAllByRole("button")[0];
+        expect(chip.style.borderLeftColor).toBe("var(--umds-semantic-color-primary-pure)");
+    });
+    it("passou de maxVisible: mostra três e um +N, que avisa com os escondidos", async () => {
+        const usuario = userEvent.setup();
+        const aoVerMais = vi.fn();
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, events: EVENTOS, onMoreClick: aoVerMais }));
+        const dia = celula(container, "2026-05-20");
+        expect(within(dia).getAllByText(/Reunião/)).toHaveLength(3);
+        const mais = within(dia).getByRole("button", { name: "2 eventos a mais em 20 de maio" });
+        expect(mais).toHaveTextContent("+2");
+        await usuario.click(mais);
+        expect(aoVerMais).toHaveBeenCalledTimes(1);
+        expect(aoVerMais.mock.calls[0][0]).toBe("2026-05-20");
+        expect(aoVerMais.mock.calls[0][1].map((e) => e.id)).toEqual(["d4", "d5"]);
+    });
+    it("maxVisible muda o corte", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, events: EVENTOS, maxVisible: 1 }));
+        expect(within(celula(container, "2026-05-20")).getAllByText(/Reunião/)).toHaveLength(1);
+        expect(within(celula(container, "2026-05-20")).getByText("+4")).toBeInTheDocument();
+    });
+    it("clicar no evento avisa com o evento e não clica no dia", async () => {
+        const usuario = userEvent.setup();
+        const aoEvento = vi.fn();
+        const aoDia = vi.fn();
+        render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, events: EVENTOS, onEventClick: aoEvento, onDayClick: aoDia }));
+        await usuario.click(screen.getByRole("button", { name: /Proc\. Administrativo 002\/2020/ }));
+        expect(aoEvento).toHaveBeenCalledWith(expect.objectContaining({ id: "a" }));
+        expect(aoDia).not.toHaveBeenCalled();
+    });
+    it("clicar no dia avisa com o ISO", async () => {
+        const usuario = userEvent.setup();
+        const aoDia = vi.fn();
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, onDayClick: aoDia }));
+        await usuario.click(celula(container, "2026-05-12"));
+        expect(aoDia).toHaveBeenCalledWith("2026-05-12");
+    });
+    it("anterior, próximo e hoje navegam e avisam em onDateChange", async () => {
+        const usuario = userEvent.setup();
+        const aoMudar = vi.fn();
+        render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, onDateChange: aoMudar }));
+        await usuario.click(screen.getByRole("button", { name: "Próximo" }));
+        expect(screen.getByText("Junho 2026")).toBeInTheDocument();
+        expect(aoMudar).toHaveBeenLastCalledWith("2026-06-15");
+        await usuario.click(screen.getByRole("button", { name: "Anterior" }));
+        await usuario.click(screen.getByRole("button", { name: "Anterior" }));
+        expect(screen.getByText("Abril 2026")).toBeInTheDocument();
+        await usuario.click(screen.getByRole("button", { name: "Hoje" }));
+        expect(screen.getByText("Maio 2026")).toBeInTheDocument();
+        expect(aoMudar).toHaveBeenLastCalledWith(HOJE);
+    });
+    it("só um dia entra na ordem de Tab (hoje), com os eventos dele", () => {
+        const { container } = render(_jsx(Calendar, { today: "2026-05-11", defaultDate: "2026-05-11", events: EVENTOS }));
+        const comTab = [...container.querySelectorAll('[role="gridcell"]')].filter((c) => c.getAttribute("tabindex") === "0");
+        expect(comTab).toHaveLength(1);
+        expect(comTab[0]).toHaveAttribute("data-date", "2026-05-11");
+        const chipsComTab = [...container.querySelectorAll(".umds-calendar__event")].filter((c) => c.getAttribute("tabindex") === "0");
+        expect(chipsComTab).toHaveLength(2);
+    });
+    it("setas movem o foco entre os dias; Home, End e Enter", async () => {
+        const usuario = userEvent.setup();
+        const aoDia = vi.fn();
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, onDayClick: aoDia }));
+        celula(container, HOJE).focus();
+        await usuario.keyboard("{ArrowRight}");
+        expect(celula(container, "2026-05-16")).toHaveFocus();
+        await usuario.keyboard("{ArrowDown}");
+        expect(celula(container, "2026-05-23")).toHaveFocus();
+        await usuario.keyboard("{ArrowLeft}{ArrowUp}");
+        expect(celula(container, "2026-05-15")).toHaveFocus();
+        await usuario.keyboard("{Home}");
+        expect(celula(container, "2026-05-10")).toHaveFocus();
+        await usuario.keyboard("{End}");
+        expect(celula(container, "2026-05-16")).toHaveFocus();
+        await usuario.keyboard("{Enter}");
+        expect(aoDia).toHaveBeenCalledWith("2026-05-16");
+    });
+    it("a seta que sai do mês troca de mês e leva o foco", async () => {
+        const usuario = userEvent.setup();
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: "2026-05-30" }));
+        celula(container, "2026-05-30").focus();
+        await usuario.keyboard("{ArrowRight}{ArrowRight}");
+        expect(screen.getByText("Junho 2026")).toBeInTheDocument();
+        expect(celula(container, "2026-06-01")).toHaveFocus();
+    });
+    it("PageDown e PageUp trocam de mês", async () => {
+        const usuario = userEvent.setup();
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE }));
+        celula(container, HOJE).focus();
+        await usuario.keyboard("{PageDown}");
+        expect(screen.getByText("Junho 2026")).toBeInTheDocument();
+        expect(celula(container, "2026-06-15")).toHaveFocus();
+        await usuario.keyboard("{PageUp}{PageUp}");
+        expect(screen.getByText("Abril 2026")).toBeInTheDocument();
+    });
+    it("a visão de semana mostra sete dias, todos os eventos, e avisa em onViewChange", async () => {
+        const usuario = userEvent.setup();
+        const aoVisao = vi.fn();
+        const { container } = render(_jsx(Calendar, { today: "2026-05-20", defaultDate: "2026-05-20", events: EVENTOS, onViewChange: aoVisao }));
+        await usuario.click(screen.getByRole("radio", { name: "Semana" }));
+        expect(aoVisao).toHaveBeenCalledWith("week");
+        expect(container.querySelectorAll('[role="gridcell"]')).toHaveLength(7);
+        expect(within(celula(container, "2026-05-20")).getAllByText(/Reunião/)).toHaveLength(5);
+        expect(screen.queryByText("+2")).toBeNull();
+        expect(container.querySelector(".umds-calendar--week")).not.toBeNull();
+    });
+    it("na semana, anterior e próximo andam sete dias", async () => {
+        const usuario = userEvent.setup();
+        const aoMudar = vi.fn();
+        render(_jsx(Calendar, { today: "2026-05-20", defaultDate: "2026-05-20", defaultView: "week", onDateChange: aoMudar }));
+        await usuario.click(screen.getByRole("button", { name: "Próximo" }));
+        expect(aoMudar).toHaveBeenLastCalledWith("2026-05-27");
+        await usuario.click(screen.getByRole("button", { name: "Anterior" }));
+        await usuario.click(screen.getByRole("button", { name: "Anterior" }));
+        expect(aoMudar).toHaveBeenLastCalledWith("2026-05-13");
+    });
+    it("weekStartsOn=1 começa a semana na segunda", () => {
+        render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, weekStartsOn: 1 }));
+        expect(screen.getAllByRole("columnheader")[0]).toHaveAccessibleName("Segunda-feira");
+    });
+    it("controlado: date e view mandam", () => {
+        function Pai() {
+            const [data, setData] = useState("2026-08-10");
+            return _jsx(Calendar, { today: HOJE, date: data, onDateChange: setData, view: "month" });
+        }
+        render(_jsx(Pai, {}));
+        expect(screen.getByText("Agosto 2026")).toBeInTheDocument();
+    });
+    it("locale e textos por prop (inglês)", () => {
+        render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, locale: "en-US", previousLabel: "Previous", nextLabel: "Next", todayLabel: "Today", monthLabel: "Month", weekLabel: "Week", viewLabel: "View" }));
+        expect(screen.getByText("May 2026")).toBeInTheDocument();
+        expect(screen.getByRole("button", { name: "Previous" })).toBeInTheDocument();
+        expect(screen.getByRole("button", { name: "Next" })).toBeInTheDocument();
+        expect(screen.getByRole("button", { name: "Today" })).toBeInTheDocument();
+        expect(screen.getByRole("radio", { name: "Week" })).toBeInTheDocument();
+        expect(screen.getByRole("group", { name: "View" })).toBeInTheDocument();
+        expect(screen.getAllByRole("columnheader")[0]).toHaveAccessibleName("Sunday");
+    });
+    it("moreLabel e moreAriaLabel traduzem o +N", () => {
+        render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, events: EVENTOS, locale: "en-US", moreLabel: "{count} more", moreAriaLabel: "{count} more events on {date}" }));
+        expect(screen.getByRole("button", { name: "2 more events on May 20" })).toHaveTextContent("2 more");
+    });
+    it("hideViewSwitcher esconde o seletor; os slots do cabeçalho aparecem", () => {
+        render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, hideViewSwitcher: true, headerStart: _jsx("span", { "data-testid": "filtro", children: "Todos os documentos" }), headerEnd: _jsx("span", { "data-testid": "legenda", children: "Legenda" }) }));
+        expect(screen.queryByRole("radio")).toBeNull();
+        expect(screen.getByTestId("filtro")).toBeInTheDocument();
+        expect(screen.getByTestId("legenda")).toBeInTheDocument();
+    });
+    it("selectedDate marca o dia", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, selectedDate: "2026-05-12" }));
+        expect(celula(container, "2026-05-12")).toHaveAttribute("aria-selected", "true");
+        expect(celula(container, "2026-05-12")).toHaveClass("umds-calendar__cell--selected");
+    });
+    it("evento com Date e com data-hora entra no dia", () => {
+        const { container } = render(_jsx(Calendar, { today: HOJE, defaultDate: HOJE, events: [
+                { date: new Date(2026, 4, 12), title: "Com Date" },
+                { date: "2026-05-13T10:30:00", title: "Com hora" },
+            ] }));
+        expect(within(celula(container, "2026-05-12")).getByText("Com Date")).toBeInTheDocument();
+        expect(within(celula(container, "2026-05-13")).getByText("Com hora")).toBeInTheDocument();
+    });
+});

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

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