@aurea-uds/native 0.31.0 → 0.33.0

package/dist/overlays.js

@@ -55,11 +55,15 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // E o comentário do `.dialog-confirm` (aurea.css:1577-1579) decidiu uma coisa por nós: **o
 // ConfirmDialog é o MESMO `.dialog`**, não uma segunda superfície. Aqui isso vira literalmente a
 // mesma função interna com uma largura diferente.
+//
+// ⚠ 0.32.0 (ADR-0066): o recheio de 24, o cabeçalho em linha com o X e o título em seminegrito, da
+// lista acima, valem hoje só para o `Drawer`. O `Dialog`, o `ConfirmDialog` e o `BottomSheet` seguem
+// as medidas do pacote NATIVO da referência — ver a folha, logo abaixo.
 import * as React from "react";
 import { Animated, Easing, Modal, PanResponder, Pressable, ScrollView, View, } from "react-native";
 import { Button } from "./actions.js";
 import { canto, cantosDeCima, criarFolha } from "./estilos.js";
-import { IconButton } from "./actions.js";
+import { CloseButton } from "./actions.js";
 import { RecuoDaFolha } from "./screen.js";
 import { Text } from "./text.js";
 import { useAureaStrings, useTokensDoApp, ForaDaMarca } from "./theme.js";
@@ -71,8 +75,10 @@ const folha = criarFolha((t) => ({
     // contêiner; este só recebe o toque de fora do painel.
     fundoDeToque: { position: "absolute", top: 0, right: 0, bottom: 0, left: 0 },
     centro: { flex: 1, alignItems: "center", justifyContent: "center", padding: 20 },
+    // 0.32.0 (ADR-0066): a janela do pacote NATIVO da referência — recheio de 20 (era 24, o da web),
+    // título 18 em peso médio e descrição 16 (no componente).
     superficie: {
-        width: "100%", maxWidth: 560, padding: 24,
+        width: "100%", maxWidth: 560, padding: t.size.space5,
         borderWidth: t.size.borderWidth, borderColor: t.color.border,
         ...canto(t.size.radiusCard),
         backgroundColor: t.color.popover,
@@ -84,13 +90,30 @@ const folha = criarFolha((t) => ({
         gap: 16, marginBottom: 16,
     },
     titulo: { flex: 1 },
+    // O título do `Dialog` e do `ConfirmDialog` (0.32.0): sozinho no alto, e não mais em linha com o
+    // X; 8 até o corpo — o `.dialog-header + .dialog-body` da web desta versão (era 16).
+    tituloDaJanela: { marginBottom: t.size.space2 },
+    // O X fica no CANTO, solto do fluxo, como o `.dialog-close` da web: a 16 da borda de FORA em cima e
+    // no fim (o absoluto conta de dentro da borda de 1). É o `CloseButton`, o círculo de 40 da escala
+    // de toque (`touchControlHSm`).
+    fechar: {
+        position: "absolute",
+        top: t.size.space4 - t.size.borderWidth, right: t.size.space4 - t.size.borderWidth,
+    },
+    // E o título não passa por baixo dele: reserva no fim a largura do X. Da borda de fora, o título
+    // acaba em 20 + 1 + 40 = 61 e o X começa em 16 + 40 = 56 — sobram 5 (a diferença entre o recheio
+    // e o canto do X, mais a borda).
+    tituloComFechar: { paddingRight: t.size.touchControlHSm },
+    // Na gaveta não há borda em cima nem do lado da tela (só a de dentro): o X fica a 16 cheios.
+    fecharDaGaveta: { top: t.size.space4, right: t.size.space4 },
     corpo: { gap: 14 },
     rodape: {
         flexDirection: "row", justifyContent: "flex-end", gap: t.size.space2,
         marginTop: t.size.space5,
     },
     gaveta: {
-        position: "absolute", top: 0, bottom: 0, width: "92%", maxWidth: 480, padding: 24,
+        // 0.32.0: o recheio de 20 do `Dialog` nativo da referência (era 24 cru).
+        position: "absolute", top: 0, bottom: 0, width: "92%", maxWidth: 480, padding: t.size.space5,
         backgroundColor: t.color.surface1,
         ...(t.shadow.shadowLg ? { boxShadow: [t.shadow.shadowLg] } : null),
     },
@@ -99,7 +122,10 @@ const folha = criarFolha((t) => ({
     folhaBaixo: {
         position: "absolute", left: 0, right: 0, bottom: 0,
         maxHeight: "90%",
-        paddingHorizontal: 24, paddingTop: t.size.space2, paddingBottom: 24,
+        // 0.32.0 (ADR-0066): recheio de 20, o da folha do pacote nativo da referência (era 24). Em cima,
+        // com o puxador, ficam estes 8 e a faixa dele (8 + o puxador de 4 + 8); sem o puxador, vale o
+        // `folhaSemPuxador`, 20 (eram estes 8 sozinhos).
+        paddingHorizontal: t.size.space5, paddingTop: t.size.space2, paddingBottom: t.size.space5,
         backgroundColor: t.color.popover,
         // HER-03 (06/10/2026, ADR-0058): 32 e não o 22 de painel — a folha acompanha o canto da tela
         // do telefone. Decisão do Victor, olhando as duas na bancada. A lista do `Select` e a folha do
@@ -108,6 +134,7 @@ const folha = criarFolha((t) => ({
         borderTopWidth: t.size.borderWidth, borderTopColor: t.color.border,
         ...(t.shadow.shadowLg ? { boxShadow: [t.shadow.shadowLg] } : null),
     },
+    folhaSemPuxador: { paddingTop: t.size.space5 },
     puxadorArea: { alignItems: "center", paddingVertical: t.size.space2 },
     puxador: { width: 40, height: 4, ...canto(999), backgroundColor: t.color.borderStrong },
 }));
@@ -165,9 +192,8 @@ const naoAtravessa = { onStartShouldSetResponder: () => true };
 export function Dialog({ open, title, children, footer, onClose, scroll = true, style, testID, }) {
     const t = useTokensDoApp();
     const s = folha(t);
-    const strings = useAureaStrings();
     const Corpo = scroll ? ScrollView : View;
-    return (_jsx(ForaDaMarca, { children: _jsx(Modal, { visible: open, transparent: true, animationType: "fade", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: onClose, testID: testID, children: _jsxs(View, { style: [s.fundo, s.centro], children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: onClose, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(View, { style: [s.superficie, style], children: [_jsxs(View, { style: s.cabecalho, children: [_jsx(Text, { size: "lg", weight: 600, accessibilityRole: "header", style: s.titulo, children: title }), _jsx(IconButton, { name: "x", label: strings.close, appearance: "ghost", size: "sm", onPress: onClose })] }), _jsx(Corpo, { ...(scroll ? { contentContainerStyle: s.corpo } : { style: s.corpo }), children: children }), footer ? _jsx(View, { style: s.rodape, children: footer }) : null] })] }) }) }));
+    return (_jsx(ForaDaMarca, { children: _jsx(Modal, { visible: open, transparent: true, animationType: "fade", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: onClose, testID: testID, children: _jsxs(View, { style: [s.fundo, s.centro], children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: onClose, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(View, { style: [s.superficie, style], children: [_jsx(Text, { size: "lg", weight: 500, accessibilityRole: "header", style: [s.tituloDaJanela, s.tituloComFechar], children: title }), _jsx(View, { style: s.fechar, children: _jsx(CloseButton, { onPress: onClose }) }), _jsx(Corpo, { ...(scroll ? { contentContainerStyle: s.corpo } : { style: s.corpo }), children: children }), footer ? _jsx(View, { style: s.rodape, children: footer }) : null] })] }) }) }));
 }
 /**
  * A decisão que não se desfaz.
@@ -195,7 +221,7 @@ export function ConfirmDialog({ open, title, description, confirmLabel, cancelLa
     const t = useTokensDoApp();
     const s = folha(t);
     const strings = useAureaStrings();
-    return (_jsx(ForaDaMarca, { children: _jsx(Modal, { visible: open, transparent: true, animationType: "fade", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: onCancel, testID: testID, children: _jsx(View, { style: [s.fundo, s.centro], children: _jsxs(View, { ...naoAtravessa, style: [s.superficie, s.confirmar], children: [_jsx(View, { style: s.cabecalho, children: _jsx(Text, { size: "lg", weight: 600, accessibilityRole: "header", style: s.titulo, children: title }) }), _jsx(View, { style: s.corpo, children: typeof description === "string"
+    return (_jsx(ForaDaMarca, { children: _jsx(Modal, { visible: open, transparent: true, animationType: "fade", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: onCancel, testID: testID, children: _jsx(View, { style: [s.fundo, s.centro], children: _jsxs(View, { ...naoAtravessa, style: [s.superficie, s.confirmar], children: [_jsx(Text, { size: "lg", weight: 500, accessibilityRole: "header", style: s.tituloDaJanela, children: title }), _jsx(View, { style: s.corpo, children: typeof description === "string"
                                 ? _jsx(Text, { size: "md", tone: "muted", children: description })
                                 : description }), _jsxs(View, { style: s.rodape, children: [_jsx(Button, { appearance: "outline", onPress: onCancel, testID: testID ? `${testID}-cancelar` : undefined, children: cancelLabel ?? strings.confirmCancel }), _jsx(Button, { appearance: "solid", tone: destructive ? "danger" : "brand", onPress: onConfirm, testID: testID ? `${testID}-confirmar` : undefined, children: confirmLabel ?? strings.confirmProceed })] })] }) }) }) }));
 }
@@ -242,7 +268,7 @@ export function Drawer({ open, title, children, onClose, side = "right", scroll
     return (_jsx(ForaDaMarca, { children: _jsx(Modal, { visible: open, transparent: true, animationType: "none", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: onClose, testID: testID, children: _jsxs(View, { style: s.fundo, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: onClose, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(Animated.View, { style: [
                             s.gaveta, side === "right" ? s.gavetaDireita : s.gavetaEsquerda,
                             { transform: [{ translateX: desloca }] }, style,
-                        ], children: [_jsxs(View, { style: s.cabecalho, children: [_jsx(Text, { size: "lg", weight: 600, accessibilityRole: "header", style: s.titulo, children: title }), _jsx(IconButton, { name: "x", label: strings.close, appearance: "ghost", size: "sm", onPress: onClose })] }), _jsx(Corpo, { ...(scroll ? { contentContainerStyle: s.corpo } : { style: s.corpo }), children: children })] })] }) }) }));
+                        ], children: [_jsx(Text, { size: "lg", weight: 500, accessibilityRole: "header", style: [s.tituloDaJanela, s.tituloComFechar], children: title }), _jsx(View, { style: [s.fechar, s.fecharDaGaveta], children: _jsx(CloseButton, { label: strings.close, onPress: onClose }) }), _jsx(Corpo, { ...(scroll ? { contentContainerStyle: s.corpo } : { style: s.corpo }), children: children })] })] }) }) }));
 }
 /**
  * A folha que sobe de baixo. **NÃO existe na web** — é o único componente deste lote sem ficha.
@@ -297,5 +323,5 @@ export function BottomSheet({ open, title, children, onClose, grabber = true, dr
             }).start();
         },
     }), [draggable, onClose, arrasto, reduzir, t.easing.easeEmphasized]);
-    return (_jsx(ForaDaMarca, { children: _jsx(Modal, { visible: open, transparent: true, animationType: reduzir !== false ? "none" : "slide", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: onClose, testID: testID, children: _jsxs(View, { style: s.fundo, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: onClose, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(Animated.View, { ...naoAtravessa, ...gestos.panHandlers, onLayout: (e) => { altura.current = e.nativeEvent.layout.height; }, style: [s.folhaBaixo, { transform: [{ translateY: arrasto }] }, style], children: [grabber ? (_jsx(View, { style: s.puxadorArea, accessible: false, importantForAccessibility: "no-hide-descendants", children: _jsx(View, { style: s.puxador }) })) : null, title ? (_jsx(View, { style: s.cabecalho, children: _jsx(Text, { size: "lg", weight: 600, accessibilityRole: "header", style: s.titulo, children: title }) })) : null, _jsx(Corpo, { ...(scroll ? { contentContainerStyle: s.corpo } : { style: s.corpo }), children: children }), _jsx(RecuoDaFolha, {})] })] }) }) }));
+    return (_jsx(ForaDaMarca, { children: _jsx(Modal, { visible: open, transparent: true, animationType: reduzir !== false ? "none" : "slide", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: onClose, testID: testID, children: _jsxs(View, { style: s.fundo, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: onClose, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(Animated.View, { ...naoAtravessa, ...gestos.panHandlers, onLayout: (e) => { altura.current = e.nativeEvent.layout.height; }, style: [s.folhaBaixo, !grabber && s.folhaSemPuxador, { transform: [{ translateY: arrasto }] }, style], children: [grabber ? (_jsx(View, { style: s.puxadorArea, accessible: false, importantForAccessibility: "no-hide-descendants", children: _jsx(View, { style: s.puxador }) })) : null, title ? (_jsx(View, { style: s.cabecalho, children: _jsx(Text, { size: "lg", weight: 500, accessibilityRole: "header", style: s.titulo, children: title }) })) : null, _jsx(Corpo, { ...(scroll ? { contentContainerStyle: s.corpo } : { style: s.corpo }), children: children }), _jsx(RecuoDaFolha, {})] })] }) }) }));
 }

package/dist/sistema.js

@@ -38,7 +38,7 @@ import { IconButton } from "./actions.js";
 import { canto, criarFolha, estadoAcessivel } from "./estilos.js";
 import { Alert } from "./feedback.js";
 import { Icon } from "./icon.js";
-import { useCampo } from "./inputs.js";
+import { alturaDoTamanho, respiroDoTamanho, useCampo } from "./inputs.js";
 import { FotoAmpliada, Image } from "./midia.js";
 import { Text } from "./text.js";
 import { useAureaStrings, useAureaTokens } from "./theme.js";
@@ -55,10 +55,11 @@ const folha = criarFolha((t) => ({
     desabilitado: { opacity: t.size.opacityDisabled },
     // R-22 (02/10/2026), a "B" da prancha: miniatura QUADRADA de 64 — o `Avatar` `lg` da
     // referência, e a medida que o botão de pôr foto passou a ter também (era 72, número à mão) — e o X
-    // TODO FORA da foto. O X é o `IconButton` `sm` (30) com fundo; a área de toque dele é de 44
-    // (`targetMin`), com o desenho no centro, então o deslocamento que põe o canto do DESENHO no
-    // canto da foto é (30 + 44) / 2. A grade deixa esse espaço em cima, à direita e entre as linhas,
-    // porque no Android o toque fora da caixa do pai não chega.
+    // TODO FORA da foto. O X é o `IconButton` `sm` (40 desde a 0.32.0) com fundo; a área de toque
+    // dele é a maior entre o desenho e o `targetMin` (44), com o desenho no centro, então o
+    // deslocamento que põe o canto do DESENHO no canto da foto é (40 + 44) / 2. A grade deixa esse
+    // espaço em cima, à direita e entre as linhas, porque no Android o toque fora da caixa do pai
+    // não chega.
     galeria: {
         flexDirection: "row", flexWrap: "wrap", columnGap: t.size.space4,
         rowGap: foraDoX(t) + t.size.space2,
@@ -73,9 +74,12 @@ const folha = criarFolha((t) => ({
         borderStyle: "dashed", backgroundColor: t.color.fieldBg,
     },
 }));
-/** Quanto o X do `PhotoInput` sai da foto: metade do desenho (30) mais metade do alvo (44). */
-const foraDoX = (t) => (t.size.controlHSm + Math.max(t.size.controlHSm, t.size.targetMin)) / 2;
-const alturaDoTamanho = (t, s) => s === "sm" ? t.size.controlHSm : s === "lg" ? t.size.controlHLg : t.size.controlHMd;
+/**
+ * Quanto o X do `PhotoInput` sai da foto: metade do desenho mais metade do alvo (44). 0.32.0: o
+ * `IconButton` `sm` passou à escala de toque (`touchControlHSm`, 40; era o `controlHSm`, 32), e a
+ * conta segue o desenho — com a antiga, o X voltava a cobrir 4 da foto.
+ */
+const foraDoX = (t) => (t.size.touchControlHSm + Math.max(t.size.touchControlHSm, t.size.targetMin)) / 2;
 // E16 (09/10/2026) · NO NAVEGADOR, o calendário "deles" é o do NAVEGADOR. A biblioteca de data não
 // tem versão web: o arquivo genérico dela devolve `null` e só avisa no console — tocar no campo não
 // abria nada (achado do app rodando no `react-native-web`). A saída é o `<input type="date">` do
@@ -163,10 +167,11 @@ export function DatePicker({ value, onChange, mode = "date", minimumDate, maximu
     }, [value, mode, minimumDate, maximumDate, receber]);
     const mostrarSeletorIOS = abertoNoIOS && Platform.OS !== "android";
     const conteudo = (_jsxs(_Fragment, { children: [_jsx(Text, { size: tam === "sm" ? "xs" : tam === "lg" ? "base" : "md", tone: value ? "default" : "subtle", numberOfLines: 1, children: texto }), icon && _jsx(Icon, { name: icon, size: "sm", color: t.color.subtleForeground })] }));
+    // 0.32.0: a medida do campo vem do `inputs.tsx` — a altura de toque (48 no `md`; era 36) e 12
+    // dos lados (era 13). Era uma cópia das contas de lá.
     const pele = [
         s.gatilho,
-        { height: alturaDoTamanho(t, tam),
-            paddingHorizontal: tam === "sm" ? t.size.space3 : tam === "lg" ? t.size.space4 : 13 },
+        { height: alturaDoTamanho(t, tam), paddingHorizontal: respiroDoTamanho(t, tam) },
         campo?.invalido && s.invalido,
         inativo && s.desabilitado,
         style,

package/dist/strings.d.ts

@@ -18,6 +18,10 @@ export interface AureaStrings {
     loading: string;
     /** O que o `DataState` mostra em `error` sem `message`. */
     dataError: string;
+    /** O que o `DataState catchErrors` mostra quando o conteúdo quebra (MNT-25, 0.32.0). */
+    dataCrashed: string;
+    /** O botão que desenha de novo o conteúdo que quebrou. */
+    dataRetry: string;
     /** O título que o `EmptyState` e o `DataState` usam sem `title`. */
     dataEmpty: string;
     /** O nome da barra inferior para o leitor de tela. */

package/dist/strings.js

@@ -30,6 +30,8 @@ export const gravidadeDoEstado = (estado) => estado.startsWith("waiting_") ? "in
 export const defaultStrings = {
     loading: "Loading",
     dataError: "This could not be loaded.",
+    dataCrashed: "Something went wrong here.",
+    dataRetry: "Try again",
     dataEmpty: "Nothing here yet",
     bottomNavLabel: "Main",
     tabsLabel: "Tabs",
@@ -80,6 +82,8 @@ export const defaultStrings = {
 export const ptBR = {
     loading: "Carregando",
     dataError: "Não foi possível carregar.",
+    dataCrashed: "Algo deu errado aqui.",
+    dataRetry: "Tentar de novo",
     dataEmpty: "Ainda não há nada aqui",
     bottomNavLabel: "Principal",
     tabsLabel: "Abas",

package/dist/text.js

@@ -67,7 +67,13 @@ const ENTRELINHA = {
     none: "leadingNone", tight: "leadingTight", normal: "leadingNormal", relaxed: "leadingRelaxed",
 };
 // O título usa o papel `heading` (GAR-16, 0.28.0) — hoje a mesma fonte do texto, no mesmo peso 600.
-const titulo = (tamanho) => ({ tamanho, peso: 600, entrelinha: "leadingTight", fonte: "heading", junto: true });
+// 0.32.0: a entrelinha é a de CADA tamanho (40 · 36 · 32 · 28 · 28 · 24), como na escala publicada
+// da referência e na web; até aqui era `leadingTight` (1,2) em todos.
+const ENTRELINHA_DO_TITULO = {
+    text4xl: "text4xlLeading", text3xl: "text3xlLeading", text2xl: "text2xlLeading",
+    textXl: "textXlLeading", textLg: "textLgLeading", textBase: "leadingNormal",
+};
+const titulo = (tamanho) => ({ tamanho, peso: 600, entrelinha: ENTRELINHA_DO_TITULO[tamanho] ?? "leadingTight", fonte: "heading", junto: true });
 const PAPEL = {
     h1: titulo("text4xl"), h2: titulo("text3xl"), h3: titulo("text2xl"),
     h4: titulo("textXl"), h5: titulo("textLg"), h6: titulo("textBase"),

package/dist/toast.js

@@ -56,7 +56,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Animated, Easing, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-import { IconButton } from "./actions.js";
+import { CloseButton } from "./actions.js";
 import { canto, criarFolha } from "./estilos.js";
 import { Icon } from "./icon.js";
 import { ICONE_DA_VARIANTE } from "./feedback.js";
@@ -71,7 +71,8 @@ const folha = criarFolha((t) => ({
         zIndex: t.size.zToast,
     },
     aviso: {
-        flexDirection: "row", alignItems: "center", gap: 11, padding: 14,
+        // 0.32.0: 16 de recheio, o do aviso do nativo da referência (era 14, o da web antiga).
+        flexDirection: "row", alignItems: "center", gap: 11, padding: t.size.space4,
         maxWidth: 360, width: "100%", alignSelf: "flex-end",
         borderWidth: t.size.borderWidth, borderColor: t.color.border,
         // HER-02 (06/10/2026): era `radiusLg` (16). O aviso é superfície flutuante, e superfície
@@ -81,13 +82,9 @@ const folha = criarFolha((t) => ({
         ...(t.shadow.shadowMd ? { boxShadow: [t.shadow.shadowMd] } : null),
     },
     texto: { flex: 1, minWidth: 0, gap: 2 },
-    aviso_info: { backgroundColor: t.color.infoBg, borderColor: t.color.info400 ?? t.color.info },
-    aviso_success: { backgroundColor: t.color.successBg, borderColor: t.color.success400 ?? t.color.success },
-    aviso_warning: { backgroundColor: t.color.warningBg, borderColor: t.color.warning400 ?? t.color.warning },
-    aviso_danger: {
-        backgroundColor: t.color.dangerBg,
-        borderColor: t.color.danger400 ?? t.color.destructive,
-    },
+    // 0.32.0: o tipo deixou de tingir o fundo e a borda (eram `aviso_info`…`aviso_danger`). Como o aviso
+    // da web desta versão e o da referência: o fundo é o da janela, e a cor do tipo vai no ícone e no
+    // TÍTULO.
 }));
 /** Quanto um aviso fica na tela sem `duration`. */
 const DURACAO_PADRAO = 5000;
@@ -201,14 +198,14 @@ export function Toast({ toast, onClose }) {
                 : (t.color.info400 ?? t.color.info);
     const glifo = toast.icon === false ? null : (toast.icon ?? ICONE_DA_VARIANTE[tipo]);
     return (_jsxs(Animated.View, { accessible: true, ...(tipo === "danger" ? { accessibilityRole: "alert" } : null), accessibilityLiveRegion: tipo === "danger" ? "assertive" : "polite", style: [
-            s.aviso, s[`aviso_${tipo}`],
+            s.aviso,
             // Os mesmos 12dp de baixo que o `.toast[data-starting-style]` da web usa.
             { opacity: entrada, transform: [{ translateY: entrada.interpolate({
                             inputRange: [0, 1], outputRange: [12, 0],
                         }) }] },
-        ], testID: `toast-${toast.id}`, children: [glifo ? _jsx(Icon, { name: glifo, size: "md", color: corDoIcone, weight: toast.icon ? undefined : "fill" }) : null, _jsxs(View, { style: s.texto, children: [_jsx(Text, { size: "sm", weight: 600, children: toast.title }), toast.description != null
+        ], testID: `toast-${toast.id}`, children: [glifo ? _jsx(Icon, { name: glifo, size: "md", color: corDoIcone, weight: toast.icon ? undefined : "fill" }) : null, _jsxs(View, { style: s.texto, children: [_jsx(Text, { size: "base", weight: 500, style: { color: corDoIcone }, children: toast.title }), toast.description != null
                         ? (typeof toast.description === "string"
                             ? _jsx(Text, { size: "sm", tone: "muted", children: toast.description })
                             : toast.description)
-                        : null] }), toast.action, _jsx(IconButton, { name: "x", label: strings.dismissNotification, appearance: "ghost", size: "sm", onPress: onClose })] }));
+                        : null] }), toast.action, _jsx(CloseButton, { label: strings.dismissNotification, onPress: onClose })] }));
 }

package/icons/index.d.ts

@@ -2858,6 +2858,7 @@ export {default as Wrench} from "./wrench.js";
 export {default as WrenchFill} from "./wrench-fill.js";
 export {default as X} from "./x.js";
 export {default as XFill} from "./x-fill.js";
+export {default as XBold} from "./x-bold.js";
 export {default as XCircle} from "./x-circle.js";
 export {default as XCircleFill} from "./x-circle-fill.js";
 export {default as XSquare} from "./x-square.js";

package/icons/index.js

@@ -1,7 +1,7 @@
 // GERADO por packages/native/build-icons-native.mjs. NÃO EDITAR.
 // Glifo do @phosphor-icons/core (Phosphor Icons, MIT) — ver NOTICE. Desenho copiado sem alteração.
 //
-// ⚠ ESTE BARRIL NÃO É A FORMA DOCUMENTADA. Ele traz os 2866 ícones ao grafo do bundler
+// ⚠ ESTE BARRIL NÃO É A FORMA DOCUMENTADA. Ele traz os 2867 ícones ao grafo do bundler
 // a menos que o tree-shaking do Metro (experimental, três flags, só em produção) esteja
 // ligado. A forma que não depende de configuração alheia é o caminho profundo:
 //
@@ -2865,6 +2865,7 @@ export {default as Wrench} from "./wrench.js";
 export {default as WrenchFill} from "./wrench-fill.js";
 export {default as X} from "./x.js";
 export {default as XFill} from "./x-fill.js";
+export {default as XBold} from "./x-bold.js";
 export {default as XCircle} from "./x-circle.js";
 export {default as XCircleFill} from "./x-circle-fill.js";
 export {default as XSquare} from "./x-square.js";

package/icons/x-bold.d.ts

@@ -0,0 +1,6 @@
+// GERADO por packages/native/build-icons-native.mjs. NÃO EDITAR.
+// Glifo do @phosphor-icons/core (Phosphor Icons, MIT) — ver NOTICE. Desenho copiado sem alteração.
+import type * as React from "react";
+import type {AureaIconProps} from "./props.js";
+declare const XBold: (props: AureaIconProps) => React.ReactElement;
+export default XBold;

package/icons/x-bold.js

@@ -0,0 +1,10 @@
+// GERADO por packages/native/build-icons-native.mjs. NÃO EDITAR.
+// Glifo do @phosphor-icons/core (Phosphor Icons, MIT) — ver NOTICE. Desenho copiado sem alteração.
+import * as React from "react";
+import Svg, {Path} from "react-native-svg";
+
+export default function XBold({size = 32, color = "#000000", ...rest}) {
+  return React.createElement(Svg, {width: size, height: size, viewBox: "0 0 256 256", ...rest},
+    React.createElement(Path, {d: "M208.49,191.51a12,12,0,0,1-17,17L128,145,64.49,208.49a12,12,0,0,1-17-17L111,128,47.51,64.49a12,12,0,0,1,17-17L128,111l63.51-63.52a12,12,0,0,1,17,17L145,128Z", fill: color})
+  );
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@aurea-uds/native",
-  "version": "0.31.0",
+  "version": "0.33.0",
   "description": "A Aurea UDS para React Native: o provider de tema e densidade, os componentes e os ícones do Phosphor sobre react-native-svg.",
   "keywords": [
     "aurea",
@@ -55,7 +55,7 @@
     "NOTICE"
   ],
   "dependencies": {
-    "@aurea-uds/tokens": "^0.31.0"
+    "@aurea-uds/tokens": "^0.33.0"
   },
   "peerDependencies": {
     "@react-native-community/datetimepicker": ">=8",