@william-callao/antonella-ui 1.0.0

package/dist/index.d.ts

@@ -0,0 +1,1067 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { StyleProp, ViewStyle, PressableProps, ViewProps, TextStyle, TextInputProps, KeyboardTypeOptions, TextProps as TextProps$1, ScrollViewProps } from 'react-native';
+import React, { ComponentType, ReactNode, ReactElement } from 'react';
+import { DashboardShellTokens, LayoutRowSize, LayoutColumnSize, TextType } from '@william-callao/antonella-theme';
+export { LayoutColumnSize, LayoutRowSize } from '@william-callao/antonella-theme';
+import { SharedValue } from 'react-native-reanimated';
+
+type AvatarSize = "sm" | "md" | "lg";
+type AvatarProps = {
+    name: string;
+    email?: string;
+    size?: AvatarSize;
+    style?: StyleProp<ViewStyle>;
+};
+declare function Avatar({ name, email, size, style }: AvatarProps): react_jsx_runtime.JSX.Element;
+
+type ButtonVariant = "primary" | "secondary" | "ghost" | "danger";
+type ButtonSize = "sm" | "md" | "lg";
+interface ButtonProps extends Omit<PressableProps, "style"> {
+    label: string;
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    style?: StyleProp<ViewStyle>;
+}
+declare function Button({ label, variant, size, style, disabled, android_ripple, ...rest }: ButtonProps): react_jsx_runtime.JSX.Element;
+
+interface CalendarProps extends ViewProps {
+    date?: Date;
+}
+declare function Calendar({ date, style, ...rest }: CalendarProps): react_jsx_runtime.JSX.Element;
+
+type CardVariant = "default" | "line";
+interface CardProps extends ViewProps {
+    /** Fondo custom que tiene prioridad sobre la variante. */
+    background?: string;
+    /** `default` pinta `card.background`; `line` deja el fondo transparente y dibuja el borde gris. */
+    variant?: CardVariant;
+    loading?: boolean;
+    skeletonHeight?: number;
+}
+declare function Card({ background: bgOverride, loading, skeletonHeight, variant, style, children, ...rest }: CardProps): react_jsx_runtime.JSX.Element;
+
+interface CardTitleProps {
+    title: string;
+    subtitle?: string;
+    style?: ViewStyle;
+}
+declare function CardTitle({ title, subtitle, style }: CardTitleProps): react_jsx_runtime.JSX.Element;
+
+type IconName = "home" | "home-filled" | "mail" | "mail-filled" | "calendar" | "calendar-filled" | "bar-chart" | "bar-chart-filled" | "settings" | "settings-filled" | "user" | "user-filled" | "search" | "clipboard" | "clipboard-filled" | "checklist" | "checklist-filled" | "menu" | "close" | "chevron-down" | "chevron-forward" | "chevron-back" | "arrow-back" | "arrow-forward" | "arrow-down" | "arrow-up" | "arrow-up-filled" | "add" | "checkmark" | "pencil" | "trash" | "chevron-up" | "alert-circle" | "checkmark-circle" | "information-circle" | "notifications" | "notifications-filled" | "more-horizontal" | "more-vertical" | "log-in" | "log-out" | "git-network" | "construct" | "chatbubble" | "camera" | "time" | "analytics" | "barn" | "barn-filled" | "farm" | "farm-filled" | "people" | "people-filled" | "document-text" | "document-text-filled" | "backspace" | "palette" | "folder" | "folder-open" | "file" | "loader" | "inbox" | "triangle-alert";
+declare const iconMap: Record<IconName, ComponentType<{
+    size?: number;
+    color?: string;
+    strokeWidth?: number;
+}>>;
+type IconProps = {
+    name: IconName;
+    size?: number;
+    color?: string;
+    style?: object;
+    testID?: string;
+};
+declare function Icon({ name, size, color, style, testID }: IconProps): react_jsx_runtime.JSX.Element;
+
+type ChipVariant = "subtle" | "solid" | "outlined";
+type ChipSize = "sm" | "md";
+type ChipProps = {
+    label: string;
+    color?: string;
+    backgroundColor?: string;
+    variant?: ChipVariant;
+    size?: ChipSize;
+    icon?: IconName;
+    uppercase?: boolean;
+    style?: StyleProp<ViewStyle>;
+    textStyle?: StyleProp<TextStyle>;
+    onPress?: () => void;
+};
+declare function Chip({ label, color, backgroundColor, variant, size, icon, uppercase, style, textStyle, onPress, }: ChipProps): react_jsx_runtime.JSX.Element;
+
+declare enum ItemStyle {
+    DEFAULT = "DEFAULT",
+    LIGHT = "LIGHT",
+    DARKNESS = "DARKNESS"
+}
+type ItemProps = {
+    icon?: IconName;
+    label: string;
+    onPress: () => void;
+    selected?: boolean;
+    style?: ItemStyle;
+    colors?: {
+        rowBg: string;
+        rowPressedBg: string;
+        iconCircleBg: string;
+        iconColor: string;
+        iconSelectedColor: string;
+        textColor: string;
+        textSelectedColor: string;
+        selectedBg: string;
+    };
+};
+declare function Item({ icon, label, onPress, selected, style, colors: overrideColors, }: ItemProps): react_jsx_runtime.JSX.Element;
+
+type ChipRowOption = {
+    icon: IconName;
+    label: string;
+    value: string;
+};
+type ChipRowProps = {
+    options: ChipRowOption[];
+    selected?: string;
+    onSelect?: (value: string) => void;
+    style?: ItemStyle;
+    /** Cuando es true, los items se reparten el ancho completo (flex: 1) sin scroll horizontal. */
+    fullWidth?: boolean;
+};
+declare function ChipRow({ options, selected: controlledSelected, onSelect, style, fullWidth, }: ChipRowProps): react_jsx_runtime.JSX.Element;
+
+declare enum SearchBarStyle {
+    DEFAULT = "DEFAULT",
+    LIGHT = "LIGHT",
+    DARKNESS = "DARKNESS"
+}
+type SearchBarProps = {
+    placeholder?: string;
+    value?: string;
+    onChangeText?: (text: string) => void;
+    style?: SearchBarStyle;
+    icon?: IconName;
+    bgColor?: string;
+    onFocus?: () => void;
+    onBlur?: () => void;
+};
+declare function SearchBar({ placeholder, value, onChangeText, style, icon, bgColor, onFocus, onBlur, }: SearchBarProps): react_jsx_runtime.JSX.Element;
+
+declare enum HeaderBarStyle {
+    DEFAULT = "DEFAULT",
+    DARKNESS = "DARKNESS"
+}
+type HeaderBarProps = {
+    title: string;
+    /** Texto secundario debajo del título (opcional). */
+    description?: string;
+    style?: HeaderBarStyle;
+    /** Acción del botón de menú (hamburguesa, lado izquierdo). */
+    onMenuPress?: () => void;
+    menuIcon?: IconName;
+};
+declare function HeaderBar({ title, description, style, onMenuPress, menuIcon, }: HeaderBarProps): react_jsx_runtime.JSX.Element;
+
+declare enum StateMessageType {
+    LOADING = "LOADING",
+    EMPTY = "EMPTY",
+    ERROR = "ERROR"
+}
+declare enum StateMessageStyle {
+    DEFAULT = "DEFAULT",
+    DARKNESS = "DARKNESS"
+}
+type StateMessageProps = {
+    /** Qué estado representa el mensaje. */
+    state: StateMessageType;
+    /** Icono del mensaje (AppIcon). Default por estado: loader / inbox / alerta. */
+    icon?: IconName;
+    /** Texto principal. Default por estado si se omite. */
+    title?: string;
+    /** Texto secundario bajo el título (opcional). */
+    message?: string;
+    /** Label del botón de acción (ej. "Reintentar"). Si se omite, no hay botón. */
+    actionLabel?: string;
+    onAction?: () => void;
+    style?: StateMessageStyle;
+};
+declare function StateMessage({ state, icon, title, message, actionLabel, onAction, style, }: StateMessageProps): react_jsx_runtime.JSX.Element;
+
+declare enum DrawerMenuItemStyle {
+    DEFAULT = "DEFAULT",
+    DARKNESS = "DARKNESS"
+}
+type DrawerMenuItemProps = {
+    icon?: IconName;
+    label: string;
+    onPress?: () => void;
+    selected?: boolean;
+    style?: DrawerMenuItemStyle;
+};
+declare function DrawerMenuItem({ icon, label, onPress, selected, style, }: DrawerMenuItemProps): react_jsx_runtime.JSX.Element;
+
+declare enum CategoryTextStyle {
+    DEFAULT = "DEFAULT",
+    LIGHT = "LIGHT",
+    DARKNESS = "DARKNESS"
+}
+type CategoryTextProps = {
+    title: string;
+    action?: string;
+    onAction?: () => void;
+    style?: CategoryTextStyle;
+};
+declare function CategoryText({ title, action, onAction, style, }: CategoryTextProps): react_jsx_runtime.JSX.Element;
+
+type BottomSheetProps = {
+    visible: boolean;
+    onClose: () => void;
+    dismissible?: boolean;
+    showCloseButton?: boolean;
+    icon?: IconName;
+    title?: string;
+    caption?: string;
+    children: React.ReactNode;
+    contentStyle?: StyleProp<ViewStyle>;
+    snapPoints?: Array<string | number>;
+};
+declare function BottomSheet({ visible, onClose, dismissible, showCloseButton, icon, title, caption, children, contentStyle, snapPoints, }: BottomSheetProps): react_jsx_runtime.JSX.Element;
+
+type CardStackSheetProps = {
+    visible: boolean;
+    onClose: () => void;
+    dismissible?: boolean;
+    children: React.ReactNode;
+    contentStyle?: StyleProp<ViewStyle>;
+    snapPoints?: Array<string | number>;
+};
+declare function CardStackSheet({ visible, onClose, dismissible, children, contentStyle, snapPoints, }: CardStackSheetProps): react_jsx_runtime.JSX.Element;
+
+declare enum OptionListItemVariant {
+    Default = "default",
+    Destructive = "destructive"
+}
+type OptionListItemProps = {
+    icon: IconName;
+    title: string;
+    description?: string;
+    onPress: () => void;
+    variant?: OptionListItemVariant;
+    trailing?: IconName;
+    /** Color del ícono. Por defecto el color de texto; en Destructive rojo. */
+    iconColor?: string;
+    showSeparator?: boolean;
+    style?: StyleProp<ViewStyle>;
+};
+declare function OptionListItem({ icon, title, description, onPress, variant, trailing, iconColor, showSeparator, style, }: OptionListItemProps): react_jsx_runtime.JSX.Element;
+
+declare enum ToastTone {
+    Success = "success",
+    Error = "error",
+    Warning = "warning",
+    Info = "info"
+}
+declare enum ToastStyle {
+    DEFAULT = "DEFAULT",
+    DARKNESS = "DARKNESS"
+}
+type ToastProps = {
+    message: string;
+    tone?: ToastTone;
+    style?: ToastStyle;
+    /** Si se define, muestra botón de cerrar (toast manual). */
+    onClose?: () => void;
+    containerStyle?: StyleProp<ViewStyle>;
+    /** Padding superior (p. ej. insets.top) para que el fondo se extienda por detrás de la status bar. */
+    topInset?: number;
+};
+declare function Toast({ message, tone, style, onClose, containerStyle, topInset, }: ToastProps): react_jsx_runtime.JSX.Element;
+
+declare const TOAST_DEFAULT_DURATION_MS = 3000;
+type ToastOptions = {
+    message: string;
+    tone?: ToastTone;
+    /** Milisegundos hasta el auto-cierre. Default: 3000. Con 0 no se autocierra y muestra botón de cerrar. */
+    duration?: number;
+};
+type ToastContextValue = {
+    showToast: (options: ToastOptions) => void;
+};
+declare function useToast(): ToastContextValue;
+declare function ToastProvider({ children }: {
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
+type ModalProps = {
+    visible: boolean;
+    onClose: () => void;
+    dismissible?: boolean;
+    showCloseButton?: boolean;
+    icon?: IconName;
+    title?: string;
+    caption?: string;
+    children: React.ReactNode;
+    contentStyle?: StyleProp<ViewStyle>;
+};
+declare function Modal({ visible, onClose, dismissible, showCloseButton, icon, title, caption, children, contentStyle, }: ModalProps): react_jsx_runtime.JSX.Element;
+
+declare enum AppDialogMode {
+    Dismissable = "dismissable",
+    Required = "required"
+}
+type AppResponsiveDialogProps = {
+    visible: boolean;
+    onClose: () => void;
+    mode?: AppDialogMode;
+    icon?: IconName;
+    title?: string;
+    caption?: string;
+    children: React.ReactNode;
+    contentStyle?: React.ComponentProps<typeof BottomSheet>["contentStyle"];
+    snapPoints?: React.ComponentProps<typeof BottomSheet>["snapPoints"];
+};
+declare function AppResponsiveDialog({ visible, onClose, mode, icon, title, caption, children, contentStyle, snapPoints, }: AppResponsiveDialogProps): react_jsx_runtime.JSX.Element;
+
+type AppFilterChipOption = {
+    label: string;
+    value: string;
+};
+type AppFilterChipsProps = {
+    options: AppFilterChipOption[];
+    value?: string;
+    onChange?: (value: string) => void;
+    style?: StyleProp<ViewStyle>;
+};
+declare function AppFilterChips({ options, value, onChange, style }: AppFilterChipsProps): react_jsx_runtime.JSX.Element;
+
+type PinKeypadProps = {
+    value: string;
+    onChange: (value: string) => void;
+    onComplete?: (pin: string) => void;
+    pinLength?: number;
+    style?: StyleProp<ViewStyle>;
+};
+declare function PinKeypad({ value, onChange, onComplete, pinLength, style }: PinKeypadProps): react_jsx_runtime.JSX.Element;
+
+type AppCheckItemStatus = "pending" | "ok" | "not-ok";
+type AppCheckItemProps = {
+    label: string;
+    description?: string;
+    value?: AppCheckItemStatus;
+    comment?: string;
+    hasMessages?: boolean;
+    noActions?: boolean;
+    readOnly?: boolean;
+    onOpenMessages?: () => void;
+    onPress?: () => void;
+    onChange?: (status: AppCheckItemStatus) => void;
+    onCommentChange?: (comment: string) => void;
+    style?: StyleProp<ViewStyle>;
+};
+declare function AppCheckItem({ label, description, value, comment, hasMessages, noActions, readOnly, onOpenMessages, onPress, onChange, onCommentChange, style, }: AppCheckItemProps): react_jsx_runtime.JSX.Element;
+
+type DonutSegment = {
+    /** Fracción del anillo (0-1) que ocupa el segmento. */
+    value: number;
+    color: string;
+};
+interface DonutChartProps extends ViewProps {
+    size?: number;
+    thickness?: number;
+    segments: DonutSegment[];
+    trackColor?: string;
+    startAngle?: number;
+    children?: React.ReactNode;
+}
+declare function DonutChart({ size, thickness, segments, trackColor, startAngle, style, children, ...rest }: DonutChartProps): react_jsx_runtime.JSX.Element;
+
+type SidebarItem = {
+    id: string;
+    label: string;
+    icon?: IconName;
+    badge?: string | number;
+    active?: boolean;
+    disabled?: boolean;
+    onPress?: () => void;
+    accessibilityLabel?: string;
+    testID?: string;
+};
+type SidebarSection = {
+    id: string;
+    title?: string;
+    items: SidebarItem[];
+};
+type SidebarType = "responsive" | "full" | "icon";
+type DashboardShellProps = {
+    sections: SidebarSection[];
+    sidebarHeader?: React.ReactNode;
+    sidebarFooter?: React.ReactNode;
+    topBar?: React.ReactNode;
+    title?: string;
+    brand?: string;
+    logoutLabel?: string;
+    onLogout?: () => void;
+    type?: SidebarType;
+    themeMode?: "light" | "dark";
+    tokens?: Partial<DashboardShellTokens>;
+    selectedItemId?: string;
+    children: React.ReactNode;
+};
+
+declare function DashboardShell({ sections, sidebarHeader, sidebarFooter, topBar, title, brand, logoutLabel, onLogout, type, themeMode, tokens, selectedItemId, children, }: DashboardShellProps): react_jsx_runtime.JSX.Element;
+
+type DockItem = {
+    icon: IconName;
+    label: string;
+};
+type DockProps = {
+    items: DockItem[];
+    selectedIndex: number;
+    onSelect: (index: number) => void;
+    visible: boolean;
+    /**
+     * Activa el "modo agente": muestra el orb de composición a la derecha de
+     * la barra. Se pausa solo cuando el dock no es visible.
+     * El componente se provee desde afuera via `renderAgentOrb`.
+     */
+    agentMode?: boolean;
+    renderAgentOrb?: React.ComponentType<{
+        size: number;
+        paused: boolean;
+    }>;
+    style?: StyleProp<ViewStyle>;
+};
+declare function Dock({ items, selectedIndex, onSelect, visible, agentMode, renderAgentOrb, style }: DockProps): react_jsx_runtime.JSX.Element;
+
+type DrawerMenuItemType = {
+    icon?: IconName;
+    label: string;
+    onPress: () => void;
+    selected?: boolean;
+};
+type DrawerMenuProps = {
+    visible: boolean;
+    onClose: () => void;
+    side?: "left" | "right";
+    width?: number;
+    items?: DrawerMenuItemType[];
+    header?: React.ReactNode;
+    footer?: React.ReactNode;
+    dismissible?: boolean;
+    customizable?: boolean;
+    itemStyle?: DrawerMenuItemStyle;
+};
+declare function DrawerMenu({ visible, onClose, side, width: widthProp, items, header, footer, dismissible, customizable, itemStyle, }: DrawerMenuProps): react_jsx_runtime.JSX.Element;
+
+type ColorWheelProps = {
+    onPress: () => void;
+    size?: number;
+};
+declare function ColorWheel({ onPress, size }: ColorWheelProps): react_jsx_runtime.JSX.Element;
+
+type ColorToken = {
+    /** Nombre legible del token (ej: "Fondo panel") */
+    name: string;
+    /** Token key interno (ej: "panelBg") */
+    key: string;
+    /** Valor hex actual (ej: "#020617") */
+    value: string;
+    /** Nombre del token de paleta si coincide (ej: "N950", "M600") */
+    tokenName?: string;
+};
+
+type ColorCustomizerDialogProps = {
+    visible: boolean;
+    onClose: () => void;
+    componentName: string;
+    tokens: ColorToken[];
+    onTokenChange: (key: string, value: string) => void;
+};
+declare function ColorCustomizerDialog({ visible, onClose, componentName, tokens, onTokenChange, }: ColorCustomizerDialogProps): react_jsx_runtime.JSX.Element;
+
+interface ComposingOrbProps {
+    /** Rendered size in points. Default 64. */
+    size?: number;
+    /** Freeze the animation (stops the frame callback). */
+    paused?: boolean;
+    /** Multiplier over the tuned clock speed. Default 1. */
+    speed?: number;
+    /**
+     * Dot color as any RN/Skia color string (e.g. `"#000000"`). Defaults to
+     * white — ideal on dark surfaces; use black on light ones.
+     */
+    color?: string;
+    /** Extra rotation in radians, added to the mode's own motion. */
+    tilt?: {
+        yaw?: number;
+        pitch?: number;
+        roll?: number;
+    };
+    style?: StyleProp<ViewStyle>;
+    accessibilityLabel?: string;
+    /** Optional out-slot that receives the per-frame build cost (ms). */
+    debugFrameMs?: {
+        set(value: number): void;
+    };
+}
+declare function ComposingOrb({ size, style, accessibilityLabel, ...rest }: ComposingOrbProps): react_jsx_runtime.JSX.Element;
+
+type DropdownOption = {
+    label: string;
+    value: string;
+    icon?: IconName;
+    disabled?: boolean;
+};
+type DropdownState = {
+    value: string;
+    open: boolean;
+};
+type DropdownProps = {
+    value?: string;
+    placeholder?: string;
+    options: DropdownOption[];
+    onChange: (option: DropdownOption) => void;
+    style?: ViewStyle;
+    maxHeight?: number;
+    disabled?: boolean;
+};
+declare function Dropdown({ value, placeholder, options, onChange, style, maxHeight, disabled, }: DropdownProps): react_jsx_runtime.JSX.Element;
+
+type FloatingActionButtonPosition = "bottom-right" | "bottom-left";
+interface FloatingActionButtonProps {
+    icon?: IconName;
+    onPress: () => void;
+    /** Esquina donde se ancla el FAB. Default `bottom-right`. */
+    position?: FloatingActionButtonPosition;
+    style?: StyleProp<ViewStyle>;
+}
+declare function FloatingActionButton({ icon, onPress, position, style, }: FloatingActionButtonProps): react_jsx_runtime.JSX.Element;
+
+type HeaderCardLayoutProps = {
+    headerBackgroundColor?: string;
+    bodyBackgroundColor?: string;
+    header: React.ReactNode;
+    children: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+};
+declare function HeaderCardLayout({ headerBackgroundColor, bodyBackgroundColor, header, children, style, }: HeaderCardLayoutProps): react_jsx_runtime.JSX.Element;
+
+type ReverseHeaderCardLayoutProps = {
+    headerBackgroundColor?: string;
+    bodyBackgroundColor?: string;
+    header: React.ReactNode;
+    children: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+};
+declare function ReverseHeaderCardLayout({ headerBackgroundColor, bodyBackgroundColor, header, children, style, }: ReverseHeaderCardLayoutProps): react_jsx_runtime.JSX.Element;
+
+interface InputProps extends TextInputProps {
+    icon?: IconName;
+}
+declare function Input({ style, placeholderTextColor, icon, ...rest }: InputProps): react_jsx_runtime.JSX.Element;
+
+type LayoutRowChildProps = {
+    size?: LayoutRowSize;
+    scroll?: boolean;
+    children: ReactNode;
+};
+type LayoutRowProps = {
+    debug?: boolean;
+    fill?: boolean;
+    gap?: number;
+    padding?: number;
+} & ViewProps;
+declare function LayoutRowFirst({ size, scroll, children }: LayoutRowChildProps): react_jsx_runtime.JSX.Element;
+declare function LayoutRowSecond({ size, scroll, children }: LayoutRowChildProps): react_jsx_runtime.JSX.Element;
+declare function LayoutRow({ debug, fill, gap, padding, style, children, ...rest }: LayoutRowProps): react_jsx_runtime.JSX.Element;
+declare namespace LayoutRow {
+    var First: typeof LayoutRowFirst;
+    var Second: typeof LayoutRowSecond;
+}
+
+type LayoutColumnChildProps = {
+    size?: LayoutColumnSize;
+    scroll?: boolean;
+    children: ReactNode;
+};
+type LayoutColumnProps = {
+    debug?: boolean;
+    fill?: boolean;
+    gap?: number;
+    padding?: number;
+} & ViewProps;
+declare function LayoutColumnFirst({ size, scroll, children }: LayoutColumnChildProps): react_jsx_runtime.JSX.Element;
+declare function LayoutColumnSecond({ size, scroll, children }: LayoutColumnChildProps): react_jsx_runtime.JSX.Element;
+declare function LayoutColumn({ debug, fill, gap, padding, style, children, ...rest }: LayoutColumnProps): react_jsx_runtime.JSX.Element;
+declare namespace LayoutColumn {
+    var First: typeof LayoutColumnFirst;
+    var Second: typeof LayoutColumnSecond;
+}
+
+type SkeletonShape = "rect" | "circle";
+interface SkeletonProps {
+    /** Ancho del bloque: número (px) o string (ej. "100%", "60%"). */
+    width?: number | string;
+    /** Alto del bloque en px. Para `shape="circle"` debe ser numérico. */
+    height?: number | string;
+    /** Radio de esquinas (solo para `shape="rect"`). Default `radius.sm`. */
+    borderRadius?: number;
+    /** `rect` por defecto; `circle` dibuja un círculo perfecto. */
+    shape?: SkeletonShape;
+    style?: StyleProp<ViewStyle>;
+}
+declare function Skeleton({ width, height, borderRadius, shape, style, }: SkeletonProps): react_jsx_runtime.JSX.Element;
+
+interface SkeletonTextProps {
+    /** Ancho de la línea: número (px) o string (ej. "100%", "60%"). */
+    width?: number | string;
+    /** Alto de la línea en px (default 14, imita un `Caption`/`Body`). */
+    height?: number;
+    style?: StyleProp<ViewStyle>;
+}
+declare function SkeletonText({ width, height, style, }: SkeletonTextProps): react_jsx_runtime.JSX.Element;
+
+interface SkeletonCircleProps {
+    /** Diámetro del círculo en px (default 32, imita iconos/avatares). */
+    size?: number;
+    style?: StyleProp<ViewStyle>;
+}
+declare function SkeletonCircle({ size, style }: SkeletonCircleProps): react_jsx_runtime.JSX.Element;
+
+interface SkeletonCardProps extends ViewProps {
+    /** Altura mínima del frame (útil cuando el esqueleto aún no define contenido). */
+    height?: number | string;
+}
+/**
+ * Frame que imita el layout de una `Card` para alojar bloques de esqueleto
+ * (`SkeletonText`, `SkeletonCircle`) como hijos. El frame NO anima: los
+ * bloques internos son los que pulsan.
+ */
+declare function SkeletonCard({ height, style, children, ...rest }: SkeletonCardProps): react_jsx_runtime.JSX.Element;
+
+interface ToolItem {
+    id: string;
+    icon: IconName;
+    label: string;
+    onPress?: () => void;
+}
+interface ToolsCardProps {
+    tools: ToolItem[];
+    style?: ViewStyle;
+}
+declare function ToolsCard({ tools, style }: ToolsCardProps): react_jsx_runtime.JSX.Element;
+
+type TreeNode = {
+    id: string;
+    code: string;
+    name: string;
+    children: TreeNode[];
+};
+type TreeEditorMode = "view" | "edit";
+type TreeEditorVariant = "default" | "darkness";
+type TreeEditorProps = {
+    value: TreeNode[];
+    onChange: (value: TreeNode[]) => void;
+    /** Default: "view" (solo visualización). Con "edit" se muestran las acciones. */
+    mode?: TreeEditorMode;
+    /** Variant visual del árbol. Default: "default". "darkness" usa cards oscuras individuales. */
+    variant?: TreeEditorVariant;
+    /** Estado controlado de nodos colapsados. Si se provee, sobreescribe el estado interno. */
+    collapsed?: Record<string, boolean>;
+    /** Callback cuando cambia el estado de colapso de un nodo. Requiere `collapsed` controlado. */
+    onCollapsedChange?: (collapsed: Record<string, boolean>) => void;
+    /** Etiqueta del botón de agregar raíz (solo modo edición). Default: "Agregar raíz". */
+    rootLabel?: string;
+    /** Render custom para el contenido de cada nodo. Recibe el nodo y el render por defecto. */
+    renderNode?: (node: TreeNode, defaultContent: React.ReactNode) => React.ReactNode;
+    /** Called when user taps any add button/row. When provided, the built-in add dialog is bypassed. */
+    onRequestAdd?: (parentId: string | null) => void;
+    /** Called when user taps "Editar" from the node menu. When provided, the built-in edit dialog is bypassed. */
+    onRequestEdit?: (node: TreeNode) => void;
+    /** Called when the user confirms deletion of a node. When provided, the built-in removal is bypassed (the node is NOT deleted). */
+    onRequestDelete?: (node: TreeNode) => void;
+    style?: StyleProp<ViewStyle>;
+};
+declare function createNode(code: string, name: string, children?: TreeNode[]): TreeNode;
+declare function addChild(nodes: TreeNode[], parentId: string, node: TreeNode): TreeNode[];
+declare function addSibling(nodes: TreeNode[], nodeId: string, node: TreeNode): TreeNode[];
+declare function updateNode(nodes: TreeNode[], nodeId: string, patch: Partial<Pick<TreeNode, "code" | "name">>): TreeNode[];
+declare function removeNode(nodes: TreeNode[], nodeId: string): TreeNode[];
+declare function findNode(nodes: TreeNode[], nodeId: string): TreeNode | undefined;
+declare function hasCode(nodes: TreeNode[], code: string, excludeId?: string): boolean;
+declare function countNodes(nodes: TreeNode[]): number;
+/**
+ * Estado colapso inicial: todo contraído salvo la primera raíz, que se muestra
+ * expandida con su primer nivel visible.
+ */
+declare function buildInitialCollapsed(nodes: TreeNode[]): Record<string, boolean>;
+declare function TreeEditor({ value, onChange, mode, variant, collapsed: collapsedProp, onCollapsedChange, rootLabel, renderNode, onRequestAdd, onRequestEdit, onRequestDelete, style }: TreeEditorProps): react_jsx_runtime.JSX.Element;
+
+interface TextFieldProps {
+    label: string;
+    value: string;
+    onChangeText: (value: string) => void;
+    placeholder?: string;
+    /** Default `true`. */
+    editable?: boolean;
+    /** Default `false`. */
+    secureTextEntry?: boolean;
+    keyboardType?: KeyboardTypeOptions;
+    autoCapitalize?: "none" | "sentences" | "words" | "characters";
+    maxLength?: number;
+    /** Default `false`. */
+    multiline?: boolean;
+    /** Texto de error opcional, se muestra debajo del campo en rojo. */
+    error?: string;
+    /** Estilo del contenedor (label + campo). */
+    style?: StyleProp<ViewStyle>;
+}
+declare function TextField({ label, value, onChangeText, placeholder, editable, secureTextEntry, keyboardType, autoCapitalize, maxLength, multiline, error, style, }: TextFieldProps): react_jsx_runtime.JSX.Element;
+
+type SplitColorCardProps = {
+    label: string;
+    lightHex: string;
+    darkHex: string;
+    lightTokenName: string;
+    darkTokenName: string;
+    onPress?: () => void;
+};
+declare function SplitColorCard({ label, lightHex, darkHex, lightTokenName, darkTokenName, onPress, }: SplitColorCardProps): react_jsx_runtime.JSX.Element;
+type SplitTextCardProps = {
+    label: string;
+    lightHex: string;
+    darkHex: string;
+    lightBgHex: string;
+    darkBgHex: string;
+    lightTokenName: string;
+    darkTokenName: string;
+    textContent?: string;
+    onPress?: () => void;
+};
+declare function SplitTextCard({ label, lightHex, darkHex, lightBgHex, darkBgHex, lightTokenName, darkTokenName, textContent, onPress, }: SplitTextCardProps): react_jsx_runtime.JSX.Element;
+type SplitDarknessCardProps = {
+    label: string;
+    lightHex: string;
+    darkHex: string;
+    lightTokenName: string;
+    darkTokenName: string;
+    lightKey: string;
+    darkKey: string;
+    onPress?: () => void;
+};
+declare function SplitDarknessCard({ label, lightHex, darkHex, lightTokenName, darkTokenName, lightKey, darkKey, onPress, }: SplitDarknessCardProps): react_jsx_runtime.JSX.Element;
+
+type TextVariant = TextType;
+interface TextProps extends TextProps$1 {
+    variant?: TextVariant;
+    color?: string;
+}
+declare function Text({ variant, color, style, ...rest }: TextProps): react_jsx_runtime.JSX.Element;
+
+interface AppTextHeaderProps {
+    heading: string;
+    caption?: string;
+    style?: ViewStyle;
+}
+declare function AppTextHeader({ heading, caption, style }: AppTextHeaderProps): react_jsx_runtime.JSX.Element;
+
+interface EmptyStateProps {
+    icon?: IconName;
+    iconSize?: number;
+    title: string;
+    caption?: string;
+    style?: ViewStyle;
+}
+declare function EmptyState({ icon, iconSize, title, caption, style }: EmptyStateProps): react_jsx_runtime.JSX.Element;
+
+type AppInputProps = {
+    label: string;
+    labelWidth?: number;
+};
+type AppInputElement = ReactElement<AppInputProps>;
+
+type AppFormCardProps = {
+    children: AppInputElement | AppInputElement[];
+    labelWidth?: number;
+    style?: ViewStyle;
+};
+declare function AppFormCard({ children, labelWidth, style }: AppFormCardProps): react_jsx_runtime.JSX.Element;
+
+type AppTextInputProps = AppInputProps & {
+    type?: "text";
+    value: string;
+    onChangeText: (value: string) => void;
+    placeholder?: string;
+    autoCapitalize?: "none" | "sentences" | "words" | "characters";
+    keyboardType?: KeyboardTypeOptions;
+    maxLength?: number;
+    editable?: boolean;
+};
+declare function AppTextInput({ label, labelWidth, value, onChangeText, placeholder, autoCapitalize, keyboardType, maxLength, editable, }: AppTextInputProps): react_jsx_runtime.JSX.Element;
+
+type AppTextAreaProps = AppInputProps & {
+    value: string;
+    onChangeText: (value: string) => void;
+    placeholder?: string;
+    autoCapitalize?: "none" | "sentences" | "words" | "characters";
+    keyboardType?: KeyboardTypeOptions;
+    maxLength?: number;
+    editable?: boolean;
+};
+declare function AppTextArea({ label, value, onChangeText, placeholder, autoCapitalize, keyboardType, maxLength, editable, }: AppTextAreaProps): react_jsx_runtime.JSX.Element;
+
+type AppSelectorOption = {
+    label: string;
+    value: string;
+};
+type AppSelectorProps = AppInputProps & {
+    type?: "select";
+    value: string;
+    onChange: (value: string) => void;
+    options: AppSelectorOption[];
+    placeholder?: string;
+    disabled?: boolean;
+};
+declare function AppSelector({ label, labelWidth, value, onChange, options, placeholder, disabled, }: AppSelectorProps): react_jsx_runtime.JSX.Element;
+
+type AppToggleProps = AppInputProps & {
+    value: boolean;
+    onValueChange: (value: boolean) => void;
+    disabled?: boolean;
+};
+declare function AppToggle({ label, labelWidth, value, onValueChange, disabled, }: AppToggleProps): react_jsx_runtime.JSX.Element;
+
+type AppButtonVariant = "solid" | "outline" | "ghost";
+type AppButtonProps = {
+    label: string;
+    onPress?: () => void;
+    disabled?: boolean;
+    variant?: AppButtonVariant;
+    backgroundColor?: string;
+    textColor?: string;
+    borderColor?: string;
+    style?: ViewStyle;
+};
+declare function AppButton({ label, onPress, disabled, variant, backgroundColor, textColor, borderColor, style, }: AppButtonProps): react_jsx_runtime.JSX.Element;
+
+type KeyboardSafeScreenProps = {
+    children: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+    contentContainerStyle?: StyleProp<ViewStyle>;
+    scrollViewProps?: ScrollViewProps;
+};
+/**
+ * Pantalla scrollable que mantiene el contenido siempre por encima del
+ * teclado. Usa la misma técnica que Modal/BottomSheet (shared value de
+ * react-native-keyboard-controller, negativa con teclado visible) para
+ * empujar el contenido sin re-renders de JS. En web mide el visualViewport.
+ */
+declare function KeyboardSafeScreen({ children, style, contentContainerStyle, scrollViewProps, }: KeyboardSafeScreenProps): react_jsx_runtime.JSX.Element;
+
+type SheetKind = "topSheet" | "bottomSheet" | "fullHeader" | "fullBody";
+interface RouteOptions {
+    /** Para bottomSheet: colapsa el header al hacer scroll. Default true. */
+    collapseOnScroll?: boolean;
+    /** Radio de la hoja (esquinas). Default 32. */
+    radius?: number;
+    /** Ignora el alto medido del header y fija este alto (px). */
+    fixedHeaderHeight?: number;
+}
+interface Route {
+    key: string;
+    kind: SheetKind;
+    header?: ReactNode;
+    body?: ReactNode;
+    headerBackgroundColor?: string;
+    bodyBackgroundColor?: string;
+    options?: RouteOptions;
+}
+interface SheetLayoutProps {
+    routes: Route[];
+    activeKey: string;
+    /** Se dispara cuando una capa interna pide cambiar de ruta. */
+    onRequestChange?: (key: string) => void;
+    style?: StyleProp<ViewStyle>;
+}
+type LayerRole = "active" | "entering" | "exiting";
+
+type SheetLayoutContextValue = {
+    change: (key: string) => void;
+};
+/** Permite que el contenido de una capa pida cambiar de ruta sin navigator. */
+declare function useSheetLayout(): SheetLayoutContextValue;
+declare function SheetLayout({ routes, activeKey, onRequestChange, style, }: SheetLayoutProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Cada "kind" de ruta se resuelve en una composición de capas (hosts):
+ *   - host: qué capa porta el contenido de la ruta (base / top / bottom)
+ *   - baseColor: color del fondo persistente ("header" | "body")
+ *
+ * Es la pieza extensible: para agregar un nuevo SheetKind solo se añade
+ * un caso acá. El SheetLayout mantiene SIEMPRE las 3 capas montadas y solo
+ * anima cuál está visible y el color del fondo.
+ */
+type HostKey = "base" | "top" | "bottom";
+type BaseColorKey = "header" | "body";
+interface Composition {
+    host: HostKey;
+    baseColor: BaseColorKey;
+}
+declare function resolveComposition(kind: SheetKind): Composition;
+/** Dirección de entrada/salida de cada host al animar su visibilidad. */
+declare function hostDirection(side: HostKey): "fromTop" | "fromBottom" | "fade";
+
+type SheetSlotProps = {
+    side: HostKey;
+    /** 0 = oculto (fuera de pantalla), 1 = totalmente visible. */
+    visible: SharedValue<number>;
+    /** Contenido a mostrar. null = este host no se usa nunca. */
+    route: Route | null;
+    /** Si la capa debe capturar toques (solo la activa). */
+    interactive: boolean;
+    baseColor: "header" | "body";
+};
+declare function SheetSlot({ side, visible, route, interactive, baseColor, }: SheetSlotProps): react_jsx_runtime.JSX.Element | null;
+
+type MainLayoutProps = {
+    children?: React.ReactNode;
+    backgroundColor?: string;
+    /** Si el body debe poder scrollear. Default true. */
+    scroll?: boolean;
+    contentContainerStyle?: StyleProp<ViewStyle>;
+    style?: StyleProp<ViewStyle>;
+};
+/**
+ * Pantalla simple y normal: ocupa toda la altura, respeta el safe area y
+ * muestra un body (scrolleable por defecto). Punto de partida mínimo para
+ * ir construyendo encima según se necesite.
+ */
+declare function MainLayout({ children, backgroundColor, scroll, contentContainerStyle, style, }: MainLayoutProps): react_jsx_runtime.JSX.Element;
+
+type SectionKey = "top" | "mid" | "bottom";
+type HeightSpec = "content" | "fill" | "fillRest" | "third" | number;
+type SlotName = "header" | "body" | "footer";
+type SectionBehavior = {
+    /** Si la sección se renderiza. Default true. */
+    visible?: boolean;
+    /** Cómo se determina su alto: contenido medido, llenar (H), rellenar resto, un tercio, o px fijos. Default "content". */
+    height?: HeightSpec;
+    /** La sección scrollea internamente (ScrollView propio). */
+    scroll?: boolean;
+    /** Se mantiene fija (no participa del scroll de página). */
+    sticky?: boolean;
+    /** Se desvanece al hacer scroll de página (requiere pageScroll). */
+    fadeOnScroll?: boolean;
+    /** A qué slot de contenido está asociada (header/body/footer). */
+    slot?: SlotName;
+    /** Para height "fillRest": de qué sección (su alto natural) se descuenta H. */
+    restsOn?: SectionKey;
+    /** Color de fondo de la sección. */
+    backgroundColor?: string;
+};
+type LayoutState = {
+    /** La página scrollea (scroll externo) en vez de secciones internas. */
+    pageScroll?: boolean;
+    sections: Record<SectionKey, SectionBehavior>;
+};
+type LayoutStateName = "stacked" | "bottom" | "fullBottom" | "onlyCenter" | "top";
+type AppRoute = {
+    /** Identificador único de la pantalla (usado como clave de navegación). */
+    name: string;
+    /** Estado del layout: preset por nombre o configuración custom. */
+    state: LayoutState | LayoutStateName;
+    /** Contenido por slot. Cada slot se renderiza en su sección mapeada. */
+    slots?: Partial<Record<SlotName, ReactNode>>;
+};
+type AppNavigation = {
+    navigate: (route: AppRoute) => void;
+    back: () => void;
+    canGoBack: boolean;
+    currentRoute: AppRoute;
+    stack: AppRoute[];
+    replace: (route: AppRoute) => void;
+};
+/** Presets = las 5 variantes del motor, reutilizables por nombre. */
+declare const layoutStates: Record<LayoutStateName, LayoutState>;
+declare function useAppNavigation(): AppNavigation;
+type AppLayoutProps = {
+    initialRoute: AppRoute;
+    /** Muestra un botón de volver global cuando canGoBack. Default true. */
+    showBackButton?: boolean;
+    /** Logs de debug en consola. Default false. */
+    debug?: boolean;
+};
+declare function AppLayout({ initialRoute, showBackButton, debug, }: AppLayoutProps): react_jsx_runtime.JSX.Element;
+
+type DivisorPosition = "top" | "bottom";
+type DivisorProps = {
+    /** "top": esquinas inferiores redondeadas (debajo de una sección). "bottom": esquinas superiores redondeadas (encima de una sección). */
+    position: DivisorPosition;
+    /** Color del rectángulo superior redondeado (la hoja). Default: bg.darkness.default. */
+    color?: string;
+    /** Color del rectángulo base (detrás del redondeado). Default: bg.default.default. */
+    baseColor?: string;
+    /** Alto del divisor en px. Default 20. */
+    height?: number;
+    /** Muestra el "grabber" (pill) estilo iOS centrado en el borde de la hoja. */
+    handle?: boolean;
+    /** Color del grabber. Default: blanco translúcido. */
+    handleColor?: string;
+    style?: ViewStyle;
+};
+declare function Divisor({ position, color, baseColor, height, handle, handleColor, style, }: DivisorProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Dirección de entrada/salida de una capa durante una transición.
+ * Es la pieza extensible del sistema: agregar un nuevo SheetKind solo
+ * requiere registrar su dirección en ENTER_DIR / EXIT_DIR.
+ */
+type LayerDirection = "fromTop" | "fromBottom" | "fade" | "toTop" | "toBottom" | "stay";
+interface TransitionSpec {
+    /** De dónde entra la capa nueva. */
+    enter: LayerDirection;
+    /** Hacia dónde sale la capa vieja. */
+    exit: LayerDirection;
+    /** true cuando from===to: no se translada la capa, se hace cross-fade de contenido. */
+    crossFadeContent: boolean;
+}
+declare function resolveTransition(from: SheetKind, to: SheetKind): TransitionSpec;
+/** Signo del desplazamiento vertical para una dirección de translate. */
+declare function directionSign(dir: LayerDirection): number;
+
+declare const AppIcon: {
+    readonly Home: IconName;
+    readonly HomeFilled: IconName;
+    readonly Procesos: IconName;
+    readonly ProcesosFilled: IconName;
+    readonly Ot: IconName;
+    readonly OtFilled: IconName;
+    readonly Calendario: IconName;
+    readonly CalendarioFilled: IconName;
+    readonly Reportes: IconName;
+    readonly ReportesFilled: IconName;
+    readonly Configuracion: IconName;
+    readonly ConfiguracionFilled: IconName;
+    readonly Inspeccion: IconName;
+    readonly InspeccionFilled: IconName;
+    readonly Checklist: IconName;
+    readonly ChecklistFilled: IconName;
+    readonly Farm: IconName;
+    readonly Barn: IconName;
+    readonly Users: IconName;
+    readonly UsersFilled: IconName;
+    readonly Templates: IconName;
+    readonly TemplatesFilled: IconName;
+    readonly Logout: IconName;
+    readonly Add: IconName;
+    readonly Pencil: IconName;
+    readonly Trash: IconName;
+    readonly Search: IconName;
+    readonly Menu: IconName;
+    readonly Close: IconName;
+    readonly Check: IconName;
+    readonly Bell: IconName;
+    readonly Info: IconName;
+    readonly Alert: IconName;
+    readonly Warning: IconName;
+    readonly Chat: IconName;
+    readonly Camera: IconName;
+    readonly Time: IconName;
+    readonly Analytics: IconName;
+    readonly Palette: IconName;
+    readonly ChevronForward: IconName;
+    readonly Folder: IconName;
+    readonly FolderOpen: IconName;
+    readonly File: IconName;
+    readonly Loader: IconName;
+    readonly Inbox: IconName;
+};
+
+export { AppButton, type AppButtonProps, type AppButtonVariant, AppCheckItem, type AppCheckItemProps, type AppCheckItemStatus, AppDialogMode, type AppFilterChipOption, AppFilterChips, type AppFilterChipsProps, AppFormCard, type AppFormCardProps, AppIcon, type AppInputElement, type AppInputProps, AppLayout, type AppLayoutProps, type AppNavigation, AppResponsiveDialog, type AppResponsiveDialogProps, type AppRoute, AppSelector, type AppSelectorOption, type AppSelectorProps, AppTextArea, type AppTextAreaProps, AppTextHeader, type AppTextHeaderProps, AppTextInput, type AppTextInputProps, AppToggle, type AppToggleProps, Avatar, type AvatarProps, type AvatarSize, type BaseColorKey, BottomSheet, type BottomSheetProps, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Calendar, type CalendarProps, Card, type CardProps, CardStackSheet, type CardStackSheetProps, CardTitle, type CardTitleProps, type CardVariant, CategoryText, type CategoryTextProps, CategoryTextStyle, Chip, type ChipProps, ChipRow, type ChipRowOption, type ChipRowProps, type ChipSize, type ChipVariant, ColorCustomizerDialog, type ColorToken, ColorWheel, ComposingOrb, type Composition, DashboardShell, type DashboardShellProps, Divisor, type DivisorPosition, type DivisorProps, Dock, type DockItem, type DockProps, DonutChart, type DonutChartProps, type DonutSegment, DrawerMenu, DrawerMenuItem, type DrawerMenuItemProps, DrawerMenuItemStyle, type DrawerMenuItemType, type DrawerMenuProps, Dropdown, type DropdownOption, type DropdownProps, type DropdownState, EmptyState, type EmptyStateProps, FloatingActionButton, type FloatingActionButtonPosition, type FloatingActionButtonProps, HeaderBar, type HeaderBarProps, HeaderBarStyle, HeaderCardLayout, type HeaderCardLayoutProps, type HeightSpec, type HostKey, Icon, type IconName, type IconProps, Input, type InputProps, Item, type ItemProps, ItemStyle, KeyboardSafeScreen, type KeyboardSafeScreenProps, type LayerDirection, type LayerRole, LayoutColumn, LayoutRow, type LayoutState, type LayoutStateName, MainLayout, type MainLayoutProps, Modal, type ModalProps, OptionListItem, type OptionListItemProps, OptionListItemVariant, PinKeypad, type PinKeypadProps, ReverseHeaderCardLayout, type ReverseHeaderCardLayoutProps, type Route, type RouteOptions, SearchBar, type SearchBarProps, SearchBarStyle, type SectionBehavior, type SectionKey, type SheetKind, SheetLayout, type SheetLayoutProps, SheetSlot, type SheetSlotProps, type SidebarItem, type SidebarSection, type SidebarType, Skeleton, SkeletonCard, type SkeletonCardProps, SkeletonCircle, type SkeletonCircleProps, type SkeletonProps, type SkeletonShape, SkeletonText, type SkeletonTextProps, type SlotName, SplitColorCard, SplitDarknessCard, SplitTextCard, StateMessage, type StateMessageProps, StateMessageStyle, StateMessageType, TOAST_DEFAULT_DURATION_MS, Text, TextField, type TextFieldProps, type TextProps, type TextVariant, Toast, type ToastOptions, type ToastProps, ToastProvider, ToastStyle, ToastTone, type ToolItem, ToolsCard, type ToolsCardProps, type TransitionSpec, TreeEditor, type TreeEditorMode, type TreeEditorProps, type TreeEditorVariant, type TreeNode, addChild, addSibling, buildInitialCollapsed, countNodes, createNode, directionSign, findNode, hasCode, hostDirection, iconMap, layoutStates, removeNode, resolveComposition, resolveTransition, updateNode, useAppNavigation, useSheetLayout, useToast };