@aurea-uds/native 0.12.2 → 0.12.4

package/dist/actions.js

@@ -22,7 +22,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 //                 do Lote 3. Aparência sem consumidor é a ADR-0034 ("ter a variante não é usar").
 import * as React from "react";
 import { Pressable, View } from "react-native";
-import { criarFolha, REACAO_AO_TOQUE } from "./estilos.js";
+import { criarFolha, REACAO_AO_TOQUE, estadoAcessivel } from "./estilos.js";
 import { Icon } from "./icon.js";
 import { Text } from "./text.js";
 import { useAureaStrings, useAureaTheme, useAureaTokens, useSobreAMarca } from "./theme.js";
@@ -166,7 +166,7 @@ function CorpoDoBotao({ children, appearance = "solid", tone = "neutral", size =
         ...(semRecuo ? { height: undefined, paddingHorizontal: 0, borderWidth: 0 } : null),
     }), [t, size, appearance, cor.solido, cor.contorno, corDaBorda, fullWidth, semRecuo]);
     const corDoTexto = appearance === "solid" ? cor.texto : cor.sobre;
-    return (_jsx(Pressable, { disabled: disabled, accessibilityRole: "button", accessibilityLabel: accessibilityLabel, accessibilityState: { disabled: !!disabled, ...(pressed === undefined ? null : { checked: pressed }) }, style: ({ pressed: tocando }) => [
+    return (_jsx(Pressable, { disabled: disabled, accessibilityRole: "button", accessibilityLabel: accessibilityLabel, ...estadoAcessivel({ disabled: !!disabled, pressed }), style: ({ pressed: tocando }) => [
             s.alvo, fullWidth && s.alvoLargura,
             tocando && s.pressionado, disabled && s.inerte,
         ], ...rest, children: _jsxs(View, { style: [s.caixa, caixa], children: [leading ?? null, leadingIcon ? _jsx(Icon, { name: leadingIcon, size: ICONE[size], color: corDoTexto, icons: icons }) : null, typeof children === "string"
@@ -211,7 +211,7 @@ function BotaoDeIcone({ name, label, appearance = "ghost", tone = "neutral", siz
         backgroundColor: appearance === "solid" ? cor.solido : "transparent",
         borderColor: cor.contorno ?? (appearance === "outline" ? corDaBorda : "transparent"),
     }), [t, lado, size, appearance, cor.solido, cor.contorno, corDaBorda]);
-    return (_jsx(Pressable, { disabled: disabled, accessibilityRole: "button", accessibilityLabel: label, accessibilityState: { disabled: !!disabled, ...(pressed === undefined ? null : { checked: pressed }) }, style: ({ pressed: tocando }) => [
+    return (_jsx(Pressable, { disabled: disabled, accessibilityRole: "button", accessibilityLabel: label, ...estadoAcessivel({ disabled: !!disabled, pressed }), style: ({ pressed: tocando }) => [
             // Largura FIXA, como o só-ícone do HeroUI (`.button--icon-only`: `w-10`): ele nunca estica,
             // nem numa coluna sem alinhamento. O alvo é o maior entre o desenho e o `targetMin`.
             s.alvo, { width: Math.max(lado, t.size.targetMin), alignItems: "center" },

package/dist/busca.js

@@ -69,7 +69,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import * as React from "react";
 import { Animated, Easing, FlatList, Modal, PanResponder, Pressable, TextInput, View, } from "react-native";
 import { IconButton } from "./actions.js";
-import { criarFolha } from "./estilos.js";
+import { criarFolha, estadoAcessivel } from "./estilos.js";
 import { Spinner } from "./feedback.js";
 import { Icon } from "./icon.js";
 import { KeyboardAvoiding, useCampo } from "./inputs.js";
@@ -306,7 +306,7 @@ export function Combobox({ items, value, onValueChange, onSearchChange, searchDe
                     peleDaMarca,
                     inativo && s.desabilitado,
                     style,
-                ], children: [_jsx(Pressable, { testID: testID, onPress: inativo ? undefined : () => setAberto(true), disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityValue: { text: value?.label }, accessibilityState: { disabled: !!inativo, expanded: aberto }, style: s.gatilho, children: _jsx(Text, { size: tam === "sm" ? "xs" : tam === "lg" ? "base" : "md", tone: value ? "default" : "subtle", numberOfLines: 1, style: { flex: 1, minWidth: 0 }, children: value?.label ?? placeholder ?? "" }) }), _jsxs(View, { style: s.acoes, children: [clearable && value != null && !inativo && (_jsx(IconButton, { name: "close", label: strings.comboboxClear, appearance: "ghost", size: "sm", onPress: () => onValueChange?.(null), testID: testID ? `${testID}-limpar` : undefined })), chevron && (_jsx(Pressable, { accessible: false, disabled: inativo, style: s.setaToque, onPress: inativo ? undefined : () => setAberto(true), testID: testID ? `${testID}-seta` : undefined, children: _jsx(Icon, { name: chevron, size: "sm", color: t.color.subtleForeground }) }))] })] }), _jsx(ForaDaMarca, { children: _jsx(Modal, { visible: aberto, transparent: true, animationType: reduzir !== false ? "none" : "slide", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: fechar, children: _jsxs(KeyboardAvoiding, { style: s.fundoDaLista, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: fechar, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(Animated.View, { style: [s.lista, { transform: [{ translateY: arrasto }] }], onLayout: (e) => { altura.current = e.nativeEvent.layout.height; }, children: [_jsx(View, { style: s.puxadorArea, ...(draggable ? gestos.panHandlers : null), accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: _jsx(View, { style: s.puxador }) }), _jsxs(View, { style: [s.grupo, { height: alturaDoTamanho(t, tam) }], ...(draggable ? gestos.panHandlers : null), children: [searchIcon && _jsx(Icon, { name: searchIcon, size: "sm", color: t.color.subtleForeground }), _jsx(TextInput, { testID: testID ? `${testID}-busca` : undefined, value: texto, onChangeText: digitar, placeholder: searchPlaceholder ?? strings.comboboxSearch, placeholderTextColor: t.color.subtleForeground, 
+                ], children: [_jsx(Pressable, { testID: testID, onPress: inativo ? undefined : () => setAberto(true), disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityValue: { text: value?.label }, ...estadoAcessivel({ disabled: !!inativo, expanded: aberto }), style: s.gatilho, children: _jsx(Text, { size: tam === "sm" ? "xs" : tam === "lg" ? "base" : "md", tone: value ? "default" : "subtle", numberOfLines: 1, style: { flex: 1, minWidth: 0 }, children: value?.label ?? placeholder ?? "" }) }), _jsxs(View, { style: s.acoes, children: [clearable && value != null && !inativo && (_jsx(IconButton, { name: "close", label: strings.comboboxClear, appearance: "ghost", size: "sm", onPress: () => onValueChange?.(null), testID: testID ? `${testID}-limpar` : undefined })), chevron && (_jsx(Pressable, { accessible: false, disabled: inativo, style: s.setaToque, onPress: inativo ? undefined : () => setAberto(true), testID: testID ? `${testID}-seta` : undefined, children: _jsx(Icon, { name: chevron, size: "sm", color: t.color.subtleForeground }) }))] })] }), _jsx(ForaDaMarca, { children: _jsx(Modal, { visible: aberto, transparent: true, animationType: reduzir !== false ? "none" : "slide", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: fechar, children: _jsxs(KeyboardAvoiding, { style: s.fundoDaLista, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: fechar, accessible: false, testID: testID ? `${testID}-fundo` : undefined }), _jsxs(Animated.View, { style: [s.lista, { transform: [{ translateY: arrasto }] }], onLayout: (e) => { altura.current = e.nativeEvent.layout.height; }, children: [_jsx(View, { style: s.puxadorArea, ...(draggable ? gestos.panHandlers : null), accessibilityElementsHidden: true, importantForAccessibility: "no-hide-descendants", children: _jsx(View, { style: s.puxador }) }), _jsxs(View, { style: [s.grupo, { height: alturaDoTamanho(t, tam) }], ...(draggable ? gestos.panHandlers : null), children: [searchIcon && _jsx(Icon, { name: searchIcon, size: "sm", color: t.color.subtleForeground }), _jsx(TextInput, { testID: testID ? `${testID}-busca` : undefined, value: texto, onChangeText: digitar, placeholder: searchPlaceholder ?? strings.comboboxSearch, placeholderTextColor: t.color.subtleForeground, 
                                                 // ⚠ `autoFocus` é o que faz a folha valer a pena: abrir um campo de busca e
                                                 // exigir um segundo toque para o teclado subir é um toque a mais em cada
                                                 // cadastro. O foco entra com a folha; o teclado vem junto.
@@ -322,9 +322,9 @@ export function Combobox({ items, value, onValueChange, onSearchChange, searchDe
                                                         color: t.color.foreground },
                                                 ] }), texto.length > 0 && (_jsx(IconButton, { name: "close", label: strings.searchClear, appearance: "ghost", size: "sm", onPress: () => digitar(""), testID: testID ? `${testID}-busca-limpar` : undefined }))] }), loading && (_jsx(View, { style: s.carregando, children: _jsx(Spinner, { label: strings.comboboxLoading }) })), nada && (_jsx(View, { style: s.vazio, children: typeof empty === "string" || empty == null
                                             ? _jsx(Text, { size: "sm", tone: "muted", children: empty ?? strings.comboboxEmpty })
-                                            : empty })), _jsx(FlatList, { data: filtrados, keyExtractor: (i) => i.value, keyboardShouldPersistTaps: "handled", onEndReached: onEndReached, onEndReachedThreshold: ANTECEDENCIA_DE_PAGINA, renderItem: ({ item }) => (_jsx(Pressable, { disabled: item.disabled, onPress: () => { onValueChange?.(item); fechar(); }, accessibilityRole: "menuitem", accessibilityState: {
+                                            : empty })), _jsx(FlatList, { data: filtrados, keyExtractor: (i) => i.value, keyboardShouldPersistTaps: "handled", onEndReached: onEndReached, onEndReachedThreshold: ANTECEDENCIA_DE_PAGINA, renderItem: ({ item }) => (_jsx(Pressable, { disabled: item.disabled, onPress: () => { onValueChange?.(item); fechar(); }, accessibilityRole: "menuitem", ...estadoAcessivel({
                                                 selected: item.value === value?.value, disabled: !!item.disabled,
-                                            }, style: [
+                                            }), style: [
                                                 s.opcao,
                                                 item.value === value?.value && s.opcaoEscolhida,
                                                 item.disabled && s.desabilitado,
@@ -418,7 +418,7 @@ export function SearchField({ value, onChangeText, onSearchChange, searchDelay =
             peleDaMarca && focado && { borderWidth: t.size.borderWidth * 2 },
             inativo && s.desabilitado,
             style,
-        ], children: [icon && _jsx(Icon, { name: icon, size: "sm", color: peleDaMarca?.color ?? t.color.subtleForeground }), _jsx(TextInput, { testID: testID ? `${testID}-campo` : undefined, value: value, onChangeText: digitar, placeholder: placeholder, placeholderTextColor: peleDaMarca?.color ?? t.color.subtleForeground, editable: !inativo, autoCorrect: false, autoCapitalize: "none", returnKeyType: "search", onSubmitEditing: onSubmit, onFocus: () => setFocado(true), onBlur: () => setFocado(false), accessibilityRole: "search", accessibilityLabel: campo?.label ?? placeholder, accessibilityHint: campo?.hint, accessibilityState: { disabled: !!inativo }, style: [
+        ], children: [icon && _jsx(Icon, { name: icon, size: "sm", color: peleDaMarca?.color ?? t.color.subtleForeground }), _jsx(TextInput, { testID: testID ? `${testID}-campo` : undefined, value: value, onChangeText: digitar, placeholder: placeholder, placeholderTextColor: peleDaMarca?.color ?? t.color.subtleForeground, editable: !inativo, autoCorrect: false, autoCapitalize: "none", returnKeyType: "search", onSubmitEditing: onSubmit, onFocus: () => setFocado(true), onBlur: () => setFocado(false), accessibilityRole: "search", accessibilityLabel: campo?.label ?? placeholder, accessibilityHint: campo?.hint, ...estadoAcessivel({ disabled: !!inativo }), style: [
                     s.campoDeTexto,
                     { fontSize: fonteDoTamanho(t, tam), fontFamily: t.font.ui[400],
                         color: t.color.foreground },

package/dist/chart.js

@@ -54,7 +54,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Pressable, View } from "react-native";
 import Svg, { Circle, G, Line, Path, Rect, Text as SvgText } from "react-native-svg";
-import { criarFolha } from "./estilos.js";
+import { criarFolha, estadoAcessivel } from "./estilos.js";
 import { Text } from "./text.js";
 import { useAureaStrings, useAureaTokens } from "./theme.js";
 /** A altura padrão, igual ao `--chart-h,220px` do `aurea.css:1329`. */
@@ -187,7 +187,7 @@ export function Chart({ labels, series, label, mark = "line", height = ALTURA, y
                                             const v = serie.data[selecionado];
                                             return v == null ? null : (_jsx(Circle, { cx: x(selecionado), cy: y(v), r: 4, fill: cores[n], stroke: t.color.card, strokeWidth: 2 }, n));
                                         })] })) : null] }) })) : null, largura > 0 ? (_jsx(View, { style: { position: "absolute", left: CALHA.esquerda, top: CALHA.topo,
-                            width: areaL, height: areaA, flexDirection: "row" }, children: labels.map((rotulo, i) => (_jsx(Pressable, { onPress: () => tocar(i), accessibilityRole: "button", accessibilityState: { selected: selecionado === i }, accessibilityLabel: [
+                            width: areaL, height: areaA, flexDirection: "row" }, children: labels.map((rotulo, i) => (_jsx(Pressable, { onPress: () => tocar(i), accessibilityRole: "button", ...estadoAcessivel({ selected: selecionado === i }), accessibilityLabel: [
                                 rotulo,
                                 ...series.map((serie) => {
                                     const v = serie.data[i];

package/dist/estilos.d.ts

@@ -58,4 +58,57 @@ export declare const REACAO_AO_TOQUE: {
         readonly opacity: 0.45;
     };
 };
+/** O estado que o leitor de tela anuncia. Mesmas chaves do `accessibilityState` do React Native. */
+export type EstadoAcessivel = {
+    checked?: boolean | "mixed";
+    selected?: boolean;
+    disabled?: boolean;
+    expanded?: boolean;
+    busy?: boolean;
+    /** O botão que liga e desliga. No aparelho vira `checked`; na web vira `aria-pressed`. */
+    pressed?: boolean;
+};
+/**
+ * O estado para o leitor de tela, dito **duas vezes**: em `accessibilityState` (o aparelho) e em
+ * `aria-*` (a web).
+ *
+ * EXISTE POR UMA MEDIÇÃO (R-20, 01/10/2026). O `react-native-web` 0.21.3 **não lê**
+ * `accessibilityState`: o `createDOMProps` dele só conhece `aria-checked`, `aria-selected`,
+ * `aria-disabled`, `aria-expanded` e `aria-busy` (e os `accessibilityChecked` e afins, que estão
+ * para sair). Com só o `accessibilityState`, o `RadioGroup` aberto no navegador saía sem
+ * `aria-checked`, e o leitor de tela não dizia qual opção estava marcada.
+ *
+ * O React Native 0.87 aceita as mesmas `aria-*` e as junta ao `accessibilityState` com o mesmo
+ * valor, então o aparelho não muda.
+ *
+ * ⚠ `pressed` (o botão de ligar e desligar) é a exceção: no aparelho continua `checked`, como
+ * sempre foi; na web vira `aria-pressed`, porque `aria-checked` num `button` o leitor ignora. Os
+ * tipos do React Native não têm `aria-pressed`; o aparelho descarta a propriedade que não conhece.
+ *
+ * Uso: `<Pressable {...estadoAcessivel({checked, disabled})} />`. Ferramenta de dentro: **não
+ * sai pela porta da frente do pacote.**
+ */
+export declare function estadoAcessivel(estado: EstadoAcessivel | undefined): {
+    accessibilityState: undefined;
+    "aria-checked"?: undefined;
+    "aria-selected"?: undefined;
+    "aria-disabled"?: undefined;
+    "aria-expanded"?: undefined;
+    "aria-busy"?: undefined;
+    "aria-pressed"?: undefined;
+} | {
+    accessibilityState: {
+        checked?: boolean | "mixed";
+        selected?: boolean;
+        disabled?: boolean;
+        expanded?: boolean;
+        busy?: boolean;
+    };
+    "aria-checked": "mixed" | boolean | undefined;
+    "aria-selected": boolean | undefined;
+    "aria-disabled": boolean | undefined;
+    "aria-expanded": boolean | undefined;
+    "aria-busy": boolean | undefined;
+    "aria-pressed": boolean | undefined;
+};
 export {};

package/dist/estilos.js

@@ -67,3 +67,38 @@ export const REACAO_AO_TOQUE = {
     pressionado: { opacity: 0.9, transform: [{ scale: 0.97 }] },
     inerte: { opacity: 0.45 },
 };
+/**
+ * O estado para o leitor de tela, dito **duas vezes**: em `accessibilityState` (o aparelho) e em
+ * `aria-*` (a web).
+ *
+ * EXISTE POR UMA MEDIÇÃO (R-20, 01/10/2026). O `react-native-web` 0.21.3 **não lê**
+ * `accessibilityState`: o `createDOMProps` dele só conhece `aria-checked`, `aria-selected`,
+ * `aria-disabled`, `aria-expanded` e `aria-busy` (e os `accessibilityChecked` e afins, que estão
+ * para sair). Com só o `accessibilityState`, o `RadioGroup` aberto no navegador saía sem
+ * `aria-checked`, e o leitor de tela não dizia qual opção estava marcada.
+ *
+ * O React Native 0.87 aceita as mesmas `aria-*` e as junta ao `accessibilityState` com o mesmo
+ * valor, então o aparelho não muda.
+ *
+ * ⚠ `pressed` (o botão de ligar e desligar) é a exceção: no aparelho continua `checked`, como
+ * sempre foi; na web vira `aria-pressed`, porque `aria-checked` num `button` o leitor ignora. Os
+ * tipos do React Native não têm `aria-pressed`; o aparelho descarta a propriedade que não conhece.
+ *
+ * Uso: `<Pressable {...estadoAcessivel({checked, disabled})} />`. Ferramenta de dentro: **não
+ * sai pela porta da frente do pacote.**
+ */
+export function estadoAcessivel(estado) {
+    if (!estado)
+        return { accessibilityState: undefined };
+    const { pressed, ...resto } = estado;
+    const doAparelho = pressed === undefined ? resto : { ...resto, checked: pressed };
+    return {
+        accessibilityState: doAparelho,
+        "aria-checked": resto.checked,
+        "aria-selected": resto.selected,
+        "aria-disabled": resto.disabled,
+        "aria-expanded": resto.expanded,
+        "aria-busy": resto.busy,
+        "aria-pressed": pressed,
+    };
+}

package/dist/feedback.js

@@ -22,7 +22,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import * as React from "react";
 import { Animated, Easing, View } from "react-native";
 import { IconButton } from "./actions.js";
-import { criarFolha } from "./estilos.js";
+import { criarFolha, estadoAcessivel } from "./estilos.js";
 import { Icon } from "./icon.js";
 import { useReduceMotion } from "./movimento.js";
 import { gravidadeDoEstado } from "./strings.js";
@@ -239,7 +239,7 @@ export function DataState({ state, message, skeleton, emptyTitle, emptyIcon, act
     const s = folha(t);
     const strings = useAureaStrings();
     const conteudo = () => (typeof children === "function" ? children() : children);
-    const caixa = (dentro, ocupado) => (_jsx(View, { accessibilityState: ocupado ? { busy: true } : undefined, style: [s.regiao, style], ...rest, children: dentro }));
+    const caixa = (dentro, ocupado) => (_jsx(View, { ...estadoAcessivel(ocupado ? { busy: true } : undefined), style: [s.regiao, style], ...rest, children: dentro }));
     if (state === "loading")
         return caixa(skeleton ?? _jsx(Skeleton, { height: t.size.space8 }), true);
     if (state === "error") {

package/dist/index.d.ts

@@ -24,8 +24,8 @@ export type { AureaStrings, AureaUniversalState } from "./strings.js";
 export { useReduceMotion } from "./movimento.js";
 export { BottomNav, Topbar, NavList, Stepper, Tabs } from "./navigation.js";
 export type { BottomNavProps, TopbarProps, NavListProps, StepperProps, AureaNavItem, AureaNavListItem, AureaStepItem, AureaStepState, AureaBottomNavVariant, AureaBottomNavIndicator, AureaBottomNavWidth, AureaTopbarVariant, AureaTopbarInset, TabsProps, AureaTabItem, } from "./navigation.js";
-export { Field, Label, Input, Textarea, Select, Switch, Checkbox, Radio, SegmentedControl, Form, KeyboardAvoiding, useCampo, } from "./inputs.js";
-export type { FieldProps, LabelProps, InputProps, TextareaProps, SelectProps, SwitchProps, CheckboxProps, RadioProps, SegmentedControlProps, FormProps, KeyboardAvoidingProps, AureaFieldSize, } from "./inputs.js";
+export { Field, Label, Input, Textarea, Select, Switch, Checkbox, Radio, RadioGroup, SegmentedControl, Form, KeyboardAvoiding, useCampo, } from "./inputs.js";
+export type { FieldProps, LabelProps, InputProps, TextareaProps, SelectProps, SwitchProps, CheckboxProps, RadioProps, RadioGroupProps, RadioGroupItemProps, AureaRadioIndicatorPlacement, SegmentedControlProps, FormProps, KeyboardAvoidingProps, AureaFieldSize, } from "./inputs.js";
 export { InputGroup, InputGroupAddon, PasswordField, useGrupoDeCampo } from "./inputs.js";
 export type { InputGroupProps, InputGroupAddonProps, PasswordFieldProps } from "./inputs.js";
 export { Dialog, ConfirmDialog, Drawer, BottomSheet } from "./overlays.js";

package/dist/index.js

@@ -59,7 +59,7 @@ export { BottomNav, Topbar, NavList, Stepper, Tabs } from "./navigation.js";
 // ⚠ O `Field` NÃO nomeia o controle por referência, como o `<label for>` da web: ele empurra o
 // nome, a dica e o estado de inválido para o controle por CONTEXTO. É a tradução que decidiu o
 // lote — o RN não tem `id` nem `htmlFor`.
-export { Field, Label, Input, Textarea, Select, Switch, Checkbox, Radio, SegmentedControl, Form, KeyboardAvoiding, useCampo, } from "./inputs.js";
+export { Field, Label, Input, Textarea, Select, Switch, Checkbox, Radio, RadioGroup, SegmentedControl, Form, KeyboardAvoiding, useCampo, } from "./inputs.js";
 // ⚠ O GRUPO e o campo de SENHA entraram depois do Lote 4, medidos pelo app na tela de entrar
 // (15/09/2026): o campo não tinha onde encaixar glifo, e `secureTextEntry` esconde a senha sem
 // dar botão para mostrá-la. **Os dois já existiam na web desde 29/08/2026** — a falta era só

package/dist/inputs.d.ts

@@ -1,5 +1,5 @@
 import * as React from "react";
-import { TextInput, type KeyboardTypeOptions, type StyleProp, type TextInputProps, type TextStyle, type ViewProps, type ViewStyle } from "react-native";
+import { TextInput, type KeyboardTypeOptions, type PressableProps, type StyleProp, type TextInputProps, type TextStyle, type ViewProps, type ViewStyle } from "react-native";
 import { type AureaFilaJustify } from "./rolagem.js";
 import { type AureaIconRegistry, type IconName } from "./icon.js";
 export type AureaFieldSize = "sm" | "md" | "lg";
@@ -249,6 +249,59 @@ export declare function Checkbox(p: CheckboxProps): React.JSX.Element;
  * estado do app — quem sabe qual está escolhido é o `useState` da tela, e `checked` sai dele.
  */
 export declare function Radio(p: RadioProps): React.JSX.Element;
+/** De que lado da linha a marca fica: `end` (padrão, como o exemplo do HeroUI) ou `start`. */
+export type AureaRadioIndicatorPlacement = "start" | "end";
+export interface RadioGroupProps extends ViewProps {
+    /** O valor do item escolhido. Controlado: quem guarda é a tela. */
+    value?: string;
+    onValueChange?: (value: string) => void;
+    /** Desliga o grupo inteiro. */
+    disabled?: boolean;
+    /** Pinta o grupo de erro (marca e rótulo na cor de perigo), como o `isInvalid` do HeroUI. */
+    invalid?: boolean;
+    /** O nome do grupo para quem usa leitor de tela ("Forma de entrega"). */
+    label?: string;
+    /** `vertical` (padrão) ou `horizontal`, como o HeroUI. */
+    orientation?: "vertical" | "horizontal";
+    /**
+     * De que lado fica a marca, em todos os itens: `end` (padrão) ou `start`. O HeroUI decide isso
+     * pela ORDEM dos filhos do item (`<Radio />` antes ou depois do texto); aqui o texto é prop, então
+     * o lado vira uma lista fechada de duas opções, com o nome que o HeroUI usa para posição.
+     */
+    indicatorPlacement?: AureaRadioIndicatorPlacement;
+    children?: React.ReactNode;
+}
+export interface RadioGroupItemProps extends Omit<PressableProps, "children" | "style" | "disabled"> {
+    /** O valor que este item escreve no grupo quando é tocado. */
+    value: string;
+    label?: React.ReactNode;
+    description?: React.ReactNode;
+    /** Desliga só este item. */
+    disabled?: boolean;
+    /** Erro só neste item. */
+    invalid?: boolean;
+    /** O lado da marca só neste item; sem ele, vale o do grupo. */
+    indicatorPlacement?: AureaRadioIndicatorPlacement;
+    style?: StyleProp<ViewStyle>;
+}
+declare function RaizDoGrupoDeRadio({ value, onValueChange, disabled, invalid, label, orientation, indicatorPlacement, style, children, ...rest }: RadioGroupProps): React.JSX.Element;
+declare function ItemDoGrupoDeRadio({ value, label, description, disabled, invalid, indicatorPlacement, style, accessibilityLabel, ...rest }: RadioGroupItemProps): React.JSX.Element;
+/**
+ * Um conjunto de opções em que só uma fica escolhida — o `RadioGroup` do HeroUI Native.
+ *
+ *     <RadioGroup label="Forma de entrega" value={entrega} onValueChange={setEntrega}>
+ *       <RadioGroup.Item value="normal" label="Normal" description="Em 5 a 7 dias úteis" />
+ *       <Separator />
+ *       <RadioGroup.Item value="expressa" label="Expressa" description="Em 2 a 3 dias úteis" />
+ *     </RadioGroup>
+ *
+ * Os filhos são livres: entre os itens cabe um `Separator`, e o grupo inteiro cabe num `Card`,
+ * como no exemplo do HeroUI. Tocar no item já escolhido não muda nada. Com
+ * `indicatorPlacement="start"` a marca vai para o início da linha.
+ */
+export declare const RadioGroup: typeof RaizDoGrupoDeRadio & {
+    Item: typeof ItemDoGrupoDeRadio;
+};
 /**
  * ⚠ **Ele TIRAVA a `description`, e passou a aceitá-la em 17/09/2026** — pedido do consumidor
  * (uma linha de explicação embaixo de "Desbloqueio por digital", no Perfil).

package/dist/inputs.js

@@ -39,7 +39,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 //   .segmented     :922            linha, gap 3, padding 3, minH controlHMd, fundo muted
 import * as React from "react";
 import { Animated, KeyboardAvoidingView as KeyboardAvoidingViewRN, Modal, Platform, Pressable, ScrollView, TextInput, View, } from "react-native";
-import { comOpacidade, criarFolha } from "./estilos.js";
+import { comOpacidade, criarFolha, estadoAcessivel } from "./estilos.js";
 import { FilaRolante } from "./rolagem.js";
 import { IconButton } from "./actions.js";
 import { Icon } from "./icon.js";
@@ -219,7 +219,7 @@ export function Input({ value, defaultValue, onChangeText, placeholder, disabled
         }, 
         // O nome e a dica vêm do `Field` — ver o bloco acima sobre por que a ligação da web não
         // atravessa. Sem isto, o campo é um nó anônimo para o leitor de tela.
-        accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityState: { disabled: !!inativo }, "aria-invalid": campo?.invalido, style: [
+        accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, ...estadoAcessivel({ disabled: !!inativo }), "aria-invalid": campo?.invalido, style: [
             // DENTRO DE UM GRUPO o campo não desenha caixa nenhuma: borda, fundo, altura, respiro,
             // inválido, foco e desabilitado passam a ser do grupo. Manter qualquer um dos dois
             // desenhando daria borda dentro de borda — que é exatamente o defeito que o `.input-group
@@ -347,7 +347,7 @@ function ControleMarcado({ papel, label, description, checked, onChange, disable
     // do rótulo (entrelinha normal), então a conta sai dos mesmos tokens que desenham o texto.
     const linha = t.size.textBase * t.size.leadingNormal;
     const noTopo = align === "start" ? { marginTop: Math.max(0, (linha - lado) / 2) } : null;
-    return (_jsxs(Pressable, { testID: testID, onPress: inativo ? undefined : () => onChange?.(!checked), disabled: inativo, accessibilityRole: papel, accessibilityState: { checked: !!checked, disabled: !!inativo }, 
+    return (_jsxs(Pressable, { testID: testID, onPress: inativo ? undefined : () => onChange?.(!checked), disabled: inativo, accessibilityRole: papel, ...estadoAcessivel({ checked: !!checked, disabled: !!inativo }), 
         // ⚠ O `accessibilityLabel` de fora vence o `label` escrito, e existe para o caso em que o
         // nome JÁ está na tela ao lado — uma linha de `NavList`, por exemplo. Sem ele, ou o nome
         // aparece escrito duas vezes, ou o controle sobe MUDO para quem usa leitor de tela.
@@ -382,6 +382,56 @@ export function Checkbox(p) { return _jsx(ControleMarcado, { ...p, papel: "check
  * estado do app — quem sabe qual está escolhido é o `useState` da tela, e `checked` sai dele.
  */
 export function Radio(p) { return _jsx(ControleMarcado, { ...p, papel: "radio" }); }
+const GrupoDeRadio = React.createContext(null);
+function RaizDoGrupoDeRadio({ value, onValueChange, disabled, invalid, label, orientation = "vertical", indicatorPlacement, style, children, ...rest }) {
+    const t = useAureaTokens();
+    const contexto = React.useMemo(() => ({ value, onValueChange, disabled, invalid, indicatorPlacement }), [value, onValueChange, disabled, invalid, indicatorPlacement]);
+    return (_jsx(GrupoDeRadio.Provider, { value: contexto, children: _jsx(View, { accessibilityRole: "radiogroup", accessibilityLabel: label, ...estadoAcessivel({ disabled: !!disabled }), style: [{ gap: t.size.space3, flexDirection: orientation === "horizontal" ? "row" : "column" }, style], ...rest, children: children }) }));
+}
+function ItemDoGrupoDeRadio({ value, label, description, disabled, invalid, indicatorPlacement, style, accessibilityLabel, ...rest }) {
+    const t = useAureaTokens();
+    const s = folha(t);
+    const grupo = React.useContext(GrupoDeRadio);
+    if (__DEV__ && !grupo)
+        console.warn("Aurea: RadioGroup.Item fora de um RadioGroup não escolhe nada.");
+    const escolhido = grupo?.value === value;
+    const inativo = disabled ?? grupo?.disabled;
+    const erro = invalid ?? grupo?.invalid;
+    const perigo = t.color.danger400 ?? t.color.destructive;
+    const marca = t.size.space6;
+    const ponto = t.size.space2 + t.size.space05;
+    const noInicio = (indicatorPlacement ?? grupo?.indicatorPlacement ?? "end") === "start";
+    const texto = (label != null || description != null) && (_jsxs(View, { style: { flex: 1, minWidth: 0 }, children: [typeof label === "string"
+                ? _jsx(Text, { size: "base", weight: 500, tone: erro ? "danger" : "default", children: label }) : label, description != null && (typeof description === "string"
+                ? _jsx(Text, { size: "sm", tone: "muted", children: description }) : description)] }, "texto"));
+    const marcaDesenhada = (_jsx(View, { style: [
+            s.marcaBase,
+            { width: marca, height: marca, borderRadius: t.size.radiusFull },
+            erro && { borderColor: perigo, backgroundColor: "transparent" },
+            escolhido && { backgroundColor: erro ? perigo : t.color.controlSelected,
+                borderColor: erro ? perigo : t.color.controlSelected },
+        ], children: escolhido && _jsx(View, { style: { width: ponto, height: ponto, borderRadius: t.size.radiusFull,
+                backgroundColor: t.color.controlSelectedForeground } }) }, "marca"));
+    return (_jsx(Pressable, { onPress: inativo || escolhido ? undefined : () => grupo?.onValueChange?.(value), disabled: inativo, accessibilityRole: "radio", ...estadoAcessivel({ checked: escolhido, disabled: !!inativo }), accessibilityLabel: accessibilityLabel ?? (typeof label === "string" ? label : undefined), accessibilityHint: typeof description === "string" ? description : undefined, style: [
+            { flexDirection: "row", alignItems: "center", justifyContent: "space-between",
+                gap: t.size.space3, minHeight: t.size.targetMin },
+            inativo && s.desabilitado, style,
+        ], ...rest, children: noInicio ? [marcaDesenhada, texto] : [texto, marcaDesenhada] }));
+}
+/**
+ * Um conjunto de opções em que só uma fica escolhida — o `RadioGroup` do HeroUI Native.
+ *
+ *     <RadioGroup label="Forma de entrega" value={entrega} onValueChange={setEntrega}>
+ *       <RadioGroup.Item value="normal" label="Normal" description="Em 5 a 7 dias úteis" />
+ *       <Separator />
+ *       <RadioGroup.Item value="expressa" label="Expressa" description="Em 2 a 3 dias úteis" />
+ *     </RadioGroup>
+ *
+ * Os filhos são livres: entre os itens cabe um `Separator`, e o grupo inteiro cabe num `Card`,
+ * como no exemplo do HeroUI. Tocar no item já escolhido não muda nada. Com
+ * `indicatorPlacement="start"` a marca vai para o início da linha.
+ */
+export const RadioGroup = Object.assign(RaizDoGrupoDeRadio, { Item: ItemDoGrupoDeRadio });
 /**
  * O interruptor.
  *
@@ -419,7 +469,7 @@ export function Switch({ label, description, checked, onChange, disabled, size,
         a.start();
         return () => a.stop();
     }, [checked, pos, reduzir]);
-    return (_jsxs(Pressable, { testID: testID, onPress: inativo ? undefined : () => onChange?.(!checked), disabled: inativo, accessibilityRole: "switch", accessibilityState: { checked: !!checked, disabled: !!inativo }, 
+    return (_jsxs(Pressable, { testID: testID, onPress: inativo ? undefined : () => onChange?.(!checked), disabled: inativo, accessibilityRole: "switch", ...estadoAcessivel({ checked: !!checked, disabled: !!inativo }), 
         // O `accessibilityLabel` de fora vence o `label` escrito — ver a prop, em `ControleProps`.
         accessibilityLabel: accessibilityLabel ?? (typeof label === "string" ? label : campo?.label), 
         // Mesma regra do `ControleMarcado`: a descrição vira DICA quando é texto. Sem isto ela
@@ -467,7 +517,7 @@ export function SegmentedControl({ items, value, onChange, label, disabled, just
     const inativo = disabled ?? campo?.disabled;
     return (_jsx(FilaRolante, { justify: justify, children: _jsx(View, { accessibilityRole: "radiogroup", accessibilityLabel: label ?? campo?.label, style: [s.segmentada, inativo && s.desabilitado, style], ...rest, children: items.map((it) => {
                 const ativo = it.value === value;
-                return (_jsxs(Pressable, { onPress: inativo ? undefined : () => onChange?.(it.value), disabled: inativo, accessibilityRole: "radio", accessibilityState: { checked: ativo, disabled: !!inativo }, accessibilityLabel: typeof it.label === "string" ? it.label : undefined, style: [s.segmento, ativo && s.segmentoAtivo], children: [typeof it.label === "string"
+                return (_jsxs(Pressable, { onPress: inativo ? undefined : () => onChange?.(it.value), disabled: inativo, accessibilityRole: "radio", ...estadoAcessivel({ checked: ativo, disabled: !!inativo }), accessibilityLabel: typeof it.label === "string" ? it.label : undefined, style: [s.segmento, ativo && s.segmentoAtivo], children: [typeof it.label === "string"
                             ? _jsx(Text, { size: "sm", weight: ativo ? 600 : 400, 
                                 // 🔴 ERA `foreground`, E ISSO QUEBRAVA A LINGUAGEM DE SELECIONADO.
                                 // Achado pelo consumidor em 17/09/2026. A web pinta o escolhido com a
@@ -518,7 +568,7 @@ export function Select({ items, value, onChange, placeholder, disabled, size, ch
     const inativo = disabled ?? campo?.disabled;
     const [aberto, setAberto] = React.useState(false);
     const escolhido = items.find((i) => i.value === value);
-    return (_jsxs(_Fragment, { children: [_jsxs(Pressable, { testID: testID, onPress: inativo ? undefined : () => setAberto(true), disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityValue: { text: escolhido?.label }, accessibilityState: { disabled: !!inativo, expanded: aberto }, style: [
+    return (_jsxs(_Fragment, { children: [_jsxs(Pressable, { testID: testID, onPress: inativo ? undefined : () => setAberto(true), disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityValue: { text: escolhido?.label }, ...estadoAcessivel({ disabled: !!inativo, expanded: aberto }), style: [
                     s.caixa,
                     { flexDirection: "row", alignItems: "center", justifyContent: "space-between",
                         height: alturaDoTamanho(t, tam), paddingHorizontal: respiroDoTamanho(t, tam) },
@@ -527,7 +577,7 @@ export function Select({ items, value, onChange, placeholder, disabled, size, ch
                     peleDaMarca,
                     inativo && s.desabilitado,
                     style,
-                ], children: [_jsx(Text, { size: tam === "sm" ? "xs" : tam === "lg" ? "base" : "md", tone: escolhido ? "default" : "subtle", numberOfLines: 1, children: escolhido?.label ?? placeholder ?? "" }), chevron && _jsx(Icon, { name: chevron, size: "sm", color: peleDaMarca?.color ?? t.color.subtleForeground })] }), _jsx(ForaDaMarca, { children: _jsx(Modal, { visible: aberto, transparent: true, animationType: "slide", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: () => setAberto(false), children: _jsxs(View, { style: s.fundoDaLista, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: () => setAberto(false), accessible: false }), _jsxs(View, { style: s.lista, children: [_jsx(ScrollView, { children: items.map((it) => (_jsx(Pressable, { disabled: it.disabled, onPress: () => { onChange?.(it.value); setAberto(false); }, accessibilityRole: "menuitem", accessibilityState: { selected: it.value === value, disabled: !!it.disabled }, style: [s.opcao, it.disabled && s.desabilitado], children: _jsx(Text, { size: "md", weight: it.value === value ? 600 : 400, children: it.label }) }, it.value))) }), _jsx(RecuoDaFolha, {})] })] }) }) })] }));
+                ], children: [_jsx(Text, { size: tam === "sm" ? "xs" : tam === "lg" ? "base" : "md", tone: escolhido ? "default" : "subtle", numberOfLines: 1, children: escolhido?.label ?? placeholder ?? "" }), chevron && _jsx(Icon, { name: chevron, size: "sm", color: peleDaMarca?.color ?? t.color.subtleForeground })] }), _jsx(ForaDaMarca, { children: _jsx(Modal, { visible: aberto, transparent: true, animationType: "slide", statusBarTranslucent: true, navigationBarTranslucent: true, onRequestClose: () => setAberto(false), children: _jsxs(View, { style: s.fundoDaLista, children: [_jsx(Pressable, { style: s.fundoDeToque, onPress: () => setAberto(false), accessible: false }), _jsxs(View, { style: s.lista, children: [_jsx(ScrollView, { children: items.map((it) => (_jsx(Pressable, { disabled: it.disabled, onPress: () => { onChange?.(it.value); setAberto(false); }, accessibilityRole: "menuitem", ...estadoAcessivel({ selected: it.value === value, disabled: !!it.disabled }), style: [s.opcao, it.disabled && s.desabilitado], children: _jsx(Text, { size: "md", weight: it.value === value ? 600 : 400, children: it.label }) }, it.value))) }), _jsx(RecuoDaFolha, {})] })] }) }) })] }));
 }
 /**
  * A pilha de campos, com o respiro do `--space-5`.

package/dist/layout.js

@@ -17,7 +17,7 @@ import { Pressable, StyleSheet, View } from "react-native";
 // `@aurea-uds/react` ja' faz (o `Stack` da web e' `HTMLAttributes & RefAttributes`, sem
 // envelope). O `ViewProps`/`TextProps` do RN 0.87 ja' declaram `ref`, entao ele viaja no
 // `...rest` sem nada a mais.
-import { criarFolha, REACAO_AO_TOQUE } from "./estilos.js";
+import { criarFolha, REACAO_AO_TOQUE, estadoAcessivel } from "./estilos.js";
 import { Text } from "./text.js";
 import { useAureaTokens, SobreAMarca } from "./theme.js";
 const folha = criarFolha((t) => ({
@@ -203,7 +203,7 @@ export function Card({ variant, style, ...rest }) {
     const { action, children, onPress, disabled, ...resto } = rest;
     if (onPress != null) {
         const pele = variant ?? "interactive";
-        return (_jsx(Pressable, { onPress: onPress, disabled: disabled, accessibilityRole: "button", accessibilityState: { disabled: !!disabled }, style: ({ pressed: tocando }) => [
+        return (_jsx(Pressable, { onPress: onPress, disabled: disabled, accessibilityRole: "button", ...estadoAcessivel({ disabled: !!disabled }), style: ({ pressed: tocando }) => [
                 s.cardBase, s[`card_${pele}`],
                 tocando && REACAO_AO_TOQUE.pressionado, disabled && REACAO_AO_TOQUE.inerte,
                 style,

package/dist/midia.js

@@ -38,7 +38,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 //                     e serve ao mesmo caso real: o consumidor que já usa `expo-image`.
 import * as React from "react";
 import { Image as ImageRN, Pressable, View, } from "react-native";
-import { criarFolha } from "./estilos.js";
+import { criarFolha, estadoAcessivel } from "./estilos.js";
 import { Icon } from "./icon.js";
 import { Grid } from "./layout.js";
 import { Dialog } from "./overlays.js";
@@ -176,6 +176,6 @@ export function Gallery({ items, label, selected, onSelect, zoom, ratio = 1, min
                         // Com legenda, o nome do ladrilho é a legenda e a imagem já saiu da árvore (o
                         // `alt=""` acima). Sem legenda, o nome é o `alt`.
                         accessibilityLabel: temLegenda && typeof item.caption === "string"
-                            ? item.caption : item.alt, accessibilityState: { selected: item.id === selected }, style: [s.ladrilho, item.id === selected && s.ladrilhoEscolhido], children: miolo }, item.id));
+                            ? item.caption : item.alt, ...estadoAcessivel({ selected: item.id === selected }), style: [s.ladrilho, item.id === selected && s.ladrilhoEscolhido], children: miolo }, item.id));
                 }) }), zoom && (_jsx(Dialog, { open: aberto != null, title: aberto ? (typeof aberto.caption === "string" ? aberto.caption : aberto.alt) : "", onClose: () => setAmpliado(null), testID: testID ? `${testID}-ampliada` : undefined, children: aberto && _jsx(Image, { source: aberto.source, alt: aberto.alt, fit: "contain", ratio: ratio }) }))] }));
 }

package/dist/navigation.js

@@ -3,7 +3,7 @@ import { Pressable, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { useAnotarBottomNav } from "./barranav.js";
 import { Badge } from "./display.js";
-import { comOpacidade, criarFolha } from "./estilos.js";
+import { comOpacidade, criarFolha, estadoAcessivel } from "./estilos.js";
 import { Icon } from "./icon.js";
 import { Card } from "./layout.js";
 import { FilaRolante } from "./rolagem.js";
@@ -258,7 +258,7 @@ export function BottomNav({ items, current, variant = "floating", indicator = "n
                                 : t.color.foreground;
             return (_jsxs(Pressable, { onPress: it.onPress, disabled: it.disabled, 
                 // `link` e não `tab`: uma aba troca um painel DESTA tela; isto troca de tela.
-                accessibilityRole: "link", accessibilityState: { selected: ativo, disabled: !!it.disabled }, style: [
+                accessibilityRole: "link", ...estadoAcessivel({ selected: ativo, disabled: !!it.disabled }), style: [
                     s.aba, justa && s.aba_content,
                     indicator === "subtle" && { borderRadius: t.size.radiusCard - t.size.space1 },
                     ativo && (indicator === "subtle" || indicator === "pill")
@@ -350,7 +350,7 @@ export function NavList({ items, chevron = "chevron--right", style, ...rest }) {
                                 ? _jsx(Text, { size: "xs", tone: "muted", numberOfLines: 1, children: it.description })
                                 : it.description)] }), valorEhTexto && _jsx(Text, { size: "sm", tone: "muted", children: it.value }), temAcao && chevron
                         && _jsx(Icon, { name: chevron, size: "sm", color: t.color.mutedForeground })] }));
-            return (_jsxs(View, { style: [s.linha, it.disabled && { opacity: t.size.opacityDisabled }], children: [temAcao ? (_jsx(Pressable, { onPress: it.onPress, disabled: it.disabled, accessibilityRole: "link", accessibilityState: { disabled: !!it.disabled }, style: s.linhaMiolo, children: miolo })) : (_jsx(View, { accessible: true, accessibilityState: { disabled: !!it.disabled }, style: s.linhaMiolo, children: miolo })), !valorEhTexto && it.value != null ? it.value : null] }, it.id));
+            return (_jsxs(View, { style: [s.linha, it.disabled && { opacity: t.size.opacityDisabled }], children: [temAcao ? (_jsx(Pressable, { onPress: it.onPress, disabled: it.disabled, accessibilityRole: "link", ...estadoAcessivel({ disabled: !!it.disabled }), style: s.linhaMiolo, children: miolo })) : (_jsx(View, { accessible: true, ...estadoAcessivel({ disabled: !!it.disabled }), style: s.linhaMiolo, children: miolo })), !valorEhTexto && it.value != null ? it.value : null] }, it.id));
         }) }));
 }
 /**
@@ -382,7 +382,7 @@ export function Stepper({ items, label, doneIcon = "checkmark", errorIcon = "err
                         : it.label, it.optional != null && (typeof it.optional === "string"
                         ? _jsx(Text, { size: "xs", tone: "muted", align: "center", children: it.optional })
                         : it.optional)] }));
-            return it.onPress ? (_jsx(Pressable, { onPress: it.onPress, accessibilityRole: "button", accessibilityState: { selected: st === "active" }, style: s.passo, children: miolo }, n)) : (_jsx(View, { accessible: true, accessibilityState: { selected: st === "active" }, style: s.passo, children: miolo }, n));
+            return it.onPress ? (_jsx(Pressable, { onPress: it.onPress, accessibilityRole: "button", ...estadoAcessivel({ selected: st === "active" }), style: s.passo, children: miolo }, n)) : (_jsx(View, { accessible: true, ...estadoAcessivel({ selected: st === "active" }), style: s.passo, children: miolo }, n));
         }) }));
 }
 /**
@@ -425,7 +425,7 @@ export function Tabs({ tabs, value, onChange, label, justify, style, ...rest })
     const aberta = tabs.find((it) => it.id === value);
     return (_jsxs(View, { style: style, ...rest, children: [_jsx(FilaRolante, { justify: justify, children: _jsx(View, { accessibilityRole: "tablist", accessibilityLabel: label ?? strings.tabsLabel, style: s.abas, children: tabs.map((it) => {
                         const ativa = it.id === value;
-                        return (_jsx(Pressable, { onPress: it.disabled ? undefined : () => onChange?.(it.id), disabled: it.disabled, accessibilityRole: "tab", accessibilityState: { selected: ativa, disabled: !!it.disabled }, accessibilityLabel: typeof it.label === "string" ? it.label : undefined, style: [s.abaDeTab, ativa && s.abaDeTabAtiva, it.disabled && { opacity: t.size.opacityDisabled }], children: typeof it.label === "string"
+                        return (_jsx(Pressable, { onPress: it.disabled ? undefined : () => onChange?.(it.id), disabled: it.disabled, accessibilityRole: "tab", ...estadoAcessivel({ selected: ativa, disabled: !!it.disabled }), accessibilityLabel: typeof it.label === "string" ? it.label : undefined, style: [s.abaDeTab, ativa && s.abaDeTabAtiva, it.disabled && { opacity: t.size.opacityDisabled }], children: typeof it.label === "string"
                                 ? _jsx(Text, { size: "sm", weight: ativa ? 600 : 400, style: { color: ativa ? t.color.foreground : t.color.mutedForeground }, children: it.label })
                                 : it.label }, it.id));
                     }) }) }), aberta

package/dist/numero.js

@@ -47,7 +47,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as React from "react";
 import { Platform, TextInput, View } from "react-native";
 import { IconButton } from "./actions.js";
-import { criarFolha } from "./estilos.js";
+import { criarFolha, estadoAcessivel } from "./estilos.js";
 import { useCampo } from "./inputs.js";
 import { useAureaStrings, useAureaTokens, usePeleSobreAMarca } from "./theme.js";
 const alturaDoTamanho = (t, s) => s === "sm" ? t.size.controlHSm : s === "lg" ? t.size.controlHLg : t.size.controlHMd;
@@ -358,7 +358,7 @@ export function NumberField({ value, defaultValue, onValueChange, min, max, step
     return (_jsxs(View, { testID: testID, style: [s.grupo, fullWidth && s.grupoLargo, inativo && s.desabilitado, style], children: [mostrarBotoes && (_jsx(IconButton, { name: icons.decrement, label: strings.decrement, appearance: "ghost", size: tam, disabled: inativo || noLimite(-1), onPress: () => empurrar(-1), testID: testID ? `${testID}-menos` : undefined })), _jsx(TextInput, { testID: testID ? `${testID}-campo` : undefined, value: mostrar, onChangeText: digitar, onFocus: () => { setFocado(true); setEmEdicao(paraEdicao(numero, locale)); }, onBlur: () => { setFocado(false); confirmar(); }, editable: !inativo && !readOnly, placeholder: placeholder, placeholderTextColor: peleDaMarca?.color ?? t.color.subtleForeground, keyboardType: keyboardType ?? tecladoPadrao, 
                 // O nome vem do `Field`, como em todo controle deste pacote — e `label` cobre quem usa o
                 // campo solto. Sem um dos dois, é um nó anônimo para o leitor de tela.
-                accessibilityLabel: label ?? campo?.label, accessibilityHint: campo?.hint, accessibilityState: { disabled: !!inativo }, "aria-invalid": campo?.invalido, style: [
+                accessibilityLabel: label ?? campo?.label, accessibilityHint: campo?.hint, ...estadoAcessivel({ disabled: !!inativo }), "aria-invalid": campo?.invalido, style: [
                     s.campo,
                     fullWidth && s.campoLargo,
                     { height: alturaDoTamanho(t, tam), fontSize: fonteDoTamanho(t, tam),

package/dist/sistema.js

@@ -36,7 +36,7 @@ import RNDateTimePicker, { DateTimePickerAndroid } from "@react-native-community
 import * as ImagePicker from "expo-image-picker";
 import { IconButton } from "./actions.js";
 import { Avatar } from "./display.js";
-import { criarFolha } from "./estilos.js";
+import { criarFolha, estadoAcessivel } from "./estilos.js";
 import { Alert } from "./feedback.js";
 import { Icon } from "./icon.js";
 import { useCampo } from "./inputs.js";
@@ -107,7 +107,7 @@ export function DatePicker({ value, onChange, mode = "date", minimumDate, maximu
         setAbertoNoIOS(true);
     }, [value, mode, minimumDate, maximumDate, receber]);
     const mostrarSeletorIOS = abertoNoIOS && Platform.OS !== "android";
-    return (_jsxs(_Fragment, { children: [_jsxs(Pressable, { testID: testID, onPress: inativo ? undefined : abrir, disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityValue: { text: value ? texto : undefined }, accessibilityState: { disabled: !!inativo }, style: [
+    return (_jsxs(_Fragment, { children: [_jsxs(Pressable, { testID: testID, onPress: inativo ? undefined : abrir, disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityHint: campo?.hint, accessibilityValue: { text: value ? texto : undefined }, ...estadoAcessivel({ disabled: !!inativo }), style: [
                     s.gatilho,
                     { height: alturaDoTamanho(t, tam),
                         paddingHorizontal: tam === "sm" ? t.size.space3 : tam === "lg" ? t.size.space4 : 13 },
@@ -166,5 +166,5 @@ export function PhotoInput({ value = [], onChange, max = 1, source = "camera", d
             .map((a) => ({ uri: a.uri, width: a.width, height: a.height }));
         onChange?.([...value, ...novas]);
     }, [source, max, value, onChange, onPermissionDenied]);
-    return (_jsxs(View, { testID: testID, style: style, children: [negadoDeVez && (_jsx(Alert, { variant: "warning", children: _jsxs(View, { style: { gap: t.size.space2 }, children: [_jsx(Text, { size: "sm", tone: "muted", children: strings.cameraDenied }), offerSettings && (_jsx(Pressable, { onPress: () => Linking.openSettings(), accessibilityRole: "button", accessibilityLabel: strings.openSettings, children: _jsx(Text, { size: "sm", weight: 600, tone: "primary", children: strings.openSettings }) }))] }) })), _jsxs(View, { style: s.galeria, children: [value.map((foto, n) => (_jsxs(View, { style: s.miniatura, children: [_jsx(Avatar, { source: foto.uri, size: "lg", alt: "" }), _jsx(View, { style: s.remover, children: _jsx(IconButton, { appearance: "ghost", size: "sm", name: removeIcon, label: strings.photoRemove, onPress: () => onChange?.(value.filter((_, i) => i !== n)) }) })] }, foto.uri))), !cheio && (_jsx(Pressable, { onPress: inativo ? undefined : escolher, disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, accessibilityState: { disabled: !!inativo }, style: [s.adicionar, inativo && s.desabilitado], children: addIcon && _jsx(Icon, { name: addIcon, size: "lg", color: t.color.subtleForeground }) }))] })] }));
+    return (_jsxs(View, { testID: testID, style: style, children: [negadoDeVez && (_jsx(Alert, { variant: "warning", children: _jsxs(View, { style: { gap: t.size.space2 }, children: [_jsx(Text, { size: "sm", tone: "muted", children: strings.cameraDenied }), offerSettings && (_jsx(Pressable, { onPress: () => Linking.openSettings(), accessibilityRole: "button", accessibilityLabel: strings.openSettings, children: _jsx(Text, { size: "sm", weight: 600, tone: "primary", children: strings.openSettings }) }))] }) })), _jsxs(View, { style: s.galeria, children: [value.map((foto, n) => (_jsxs(View, { style: s.miniatura, children: [_jsx(Avatar, { source: foto.uri, size: "lg", alt: "" }), _jsx(View, { style: s.remover, children: _jsx(IconButton, { appearance: "ghost", size: "sm", name: removeIcon, label: strings.photoRemove, onPress: () => onChange?.(value.filter((_, i) => i !== n)) }) })] }, foto.uri))), !cheio && (_jsx(Pressable, { onPress: inativo ? undefined : escolher, disabled: inativo, accessibilityRole: "button", accessibilityLabel: campo?.label, ...estadoAcessivel({ disabled: !!inativo }), style: [s.adicionar, inativo && s.desabilitado], children: addIcon && _jsx(Icon, { name: addIcon, size: "lg", color: t.color.subtleForeground }) }))] })] }));
 }

package/package.json

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