@retray-dev/ui-kit 12.2.0 → 13.2.0

package/dist/{chunk-LPV4NJJK.mjs → chunk-PGQ6FMXS.mjs}

@@ -1,8 +1,9 @@
-import { PagerDots } from './chunk-OLVJFKXS.mjs';
-import { IconButton } from './chunk-LOBLCFMN.mjs';
+import { PagerDots } from './chunk-S44XWTTC.mjs';
+import { IconButton } from './chunk-ZTPYUU5C.mjs';
 import { s, vs } from './chunk-2CE3TQVY.mjs';
 import React, { useState, useCallback } from 'react';
-import { StyleSheet, useWindowDimensions, Dimensions, Modal, View, ScrollView, Image } from 'react-native';
+import { Image } from 'expo-image';
+import { StyleSheet, useWindowDimensions, Dimensions, Modal, View, ScrollView } from 'react-native';
 import { Gesture, GestureHandlerRootView, GestureDetector } from 'react-native-gesture-handler';
 import Animated, { useSharedValue, runOnJS, withTiming, useAnimatedStyle } from 'react-native-reanimated';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
@@ -62,7 +63,7 @@ function ZoomableImage({ source, width, height, onZoomChange }) {
       { scale: scale.value }
     ]
   }));
-  return /* @__PURE__ */ React.createElement(GestureDetector, { gesture: composed }, /* @__PURE__ */ React.createElement(View, { style: [{ width, height }, styles.imageWrap], collapsable: false }, /* @__PURE__ */ React.createElement(Animated.View, { style: [{ width, height }, animatedStyle] }, /* @__PURE__ */ React.createElement(Image, { source, style: { width, height }, resizeMode: "contain" }))));
+  return /* @__PURE__ */ React.createElement(GestureDetector, { gesture: composed }, /* @__PURE__ */ React.createElement(View, { style: [{ width, height }, styles.imageWrap], collapsable: false }, /* @__PURE__ */ React.createElement(Animated.View, { style: [{ width, height }, animatedStyle] }, /* @__PURE__ */ React.createElement(Image, { source, style: { width, height }, contentFit: "contain" }))));
 }
 function ImageViewer({ images, visible, onClose, initialIndex = 0 }) {
   const window = useWindowDimensions();
@@ -140,7 +141,7 @@ function ImageViewer({ images, visible, onClose, initialIndex = 0 }) {
       style: { backgroundColor: "rgba(255,255,255,0.18)" },
       iconColor: "#fff",
       onPress: onClose,
-      accessibilityLabel: "Close"
+      accessibilityLabel: "Cerrar"
     }
   )), images.length > 1 ? /* @__PURE__ */ React.createElement(View, { style: [styles.dots, { bottom: insets.bottom + vs(16) }], pointerEvents: "box-none" }, /* @__PURE__ */ React.createElement(
     PagerDots,

package/dist/{chunk-MEPSKGBO.mjs → chunk-PI6RULJX.mjs}

@@ -1,4 +1,4 @@
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { ms } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, Text } from 'react-native';

package/dist/{chunk-F3YTWO3T.mjs → chunk-RA6SAAFE.mjs}

@@ -1,8 +1,9 @@
-import { PressableChip } from './chunk-3DKJ2GIC.mjs';
-import { selectionAsync } from './chunk-EJ7ZPXOH.mjs';
-import { COLOR_TRANSITION } from './chunk-DVK4G2GT.mjs';
-import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { COLOR_TRANSITION } from './chunk-M53LC4Q7.mjs';
+import { PressableChip } from './chunk-IFYMBOEN.mjs';
+import { selectionAsync } from './chunk-ARONDO7M.mjs';
+import { RADIUS } from './chunk-QY3X2UYR.mjs';
+import { Icon } from './chunk-MZ6WRTD2.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { s, mvs, ms, vs } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, Text } from 'react-native';
@@ -14,7 +15,7 @@ function ChipBase({ label, selected = false, onPress, icon, iconName, style, acc
     selectionAsync();
     onPress?.();
   };
-  const resolvedIcon = iconName ? renderIcon(iconName, ms(13), selected ? colors.primaryForeground : colors.foreground) : icon;
+  const resolvedIcon = iconName ? /* @__PURE__ */ React.createElement(Icon, { name: iconName, size: ms(13), color: selected ? colors.primaryForeground : colors.foreground }) : icon;
   return /* @__PURE__ */ React.createElement(View, { style: [styles.wrapper, style] }, /* @__PURE__ */ React.createElement(
     PressableChip,
     {
@@ -72,14 +73,14 @@ function ChipGroup({ options, value, onValueChange, multiSelect = false, style }
       onPress: opt.disabled ? void 0 : () => handlePress(opt.value),
       iconName: opt.iconName,
       style: opt.disabled ? styles.chipDisabled : void 0,
-      accessibilityLabel: opt.disabled ? `${opt.label}, unavailable` : opt.label
+      accessibilityLabel: opt.disabled ? `${opt.label}, no disponible` : opt.label
     }
   )));
 }
 var styles = StyleSheet.create({
   wrapper: {},
   chip: {
-    borderRadius: 999,
+    borderRadius: RADIUS.full,
     paddingHorizontal: s(14),
     // AUDIT FIX: was vs(5) → ~28px total height — below WCAG 44px tap target.
     // vs(10) → ~44px total height meets WCAG 2.5.5 (AAA) minimum.

package/dist/{chunk-UNNRUJTM.mjs → chunk-RRKM4MKB.mjs}

@@ -1,8 +1,8 @@
-import { PressableButton } from './chunk-3DKJ2GIC.mjs';
-import { selectionAsync } from './chunk-EJ7ZPXOH.mjs';
-import { COLOR_TRANSITION } from './chunk-DVK4G2GT.mjs';
-import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { COLOR_TRANSITION } from './chunk-M53LC4Q7.mjs';
+import { PressableButton } from './chunk-IFYMBOEN.mjs';
+import { selectionAsync } from './chunk-ARONDO7M.mjs';
+import { Icon } from './chunk-MZ6WRTD2.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { vs, s, ms } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, Text } from 'react-native';
@@ -16,12 +16,12 @@ function ToggleIcon({ pressed, iconName, activeIconName, icon, activeIcon, iconC
     return prop;
   };
   if (pressed) {
-    if (activeIconName) return /* @__PURE__ */ React.createElement(React.Fragment, null, renderIcon(activeIconName, iconSize, activeIconColor ?? primaryColor));
+    if (activeIconName) return /* @__PURE__ */ React.createElement(Icon, { name: activeIconName, size: iconSize, color: activeIconColor ?? primaryColor });
     const active = renderProp(activeIcon);
     if (active) return /* @__PURE__ */ React.createElement(React.Fragment, null, active);
     return /* @__PURE__ */ React.createElement(FontAwesome5, { name: "check-circle", size: iconSize, color: primaryColor });
   }
-  if (iconName) return /* @__PURE__ */ React.createElement(React.Fragment, null, renderIcon(iconName, iconSize, iconColor ?? mutedColor));
+  if (iconName) return /* @__PURE__ */ React.createElement(Icon, { name: iconName, size: iconSize, color: iconColor ?? mutedColor });
   const custom = renderProp(icon);
   if (custom) return /* @__PURE__ */ React.createElement(React.Fragment, null, custom);
   return /* @__PURE__ */ React.createElement(FontAwesome5, { name: "circle", size: iconSize, color: mutedColor });

package/dist/{chunk-ULGNQPNE.mjs → chunk-S2VGME7X.mjs}

@@ -1,5 +1,5 @@
 import { RADIUS } from './chunk-QY3X2UYR.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { vs, s } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, Text } from 'react-native';

package/dist/{chunk-OLVJFKXS.mjs → chunk-S44XWTTC.mjs}

@@ -1,10 +1,11 @@
-import { selectionAsync } from './chunk-EJ7ZPXOH.mjs';
-import { SPRINGS } from './chunk-DVK4G2GT.mjs';
-import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { SPRINGS } from './chunk-M53LC4Q7.mjs';
+import { PressableButton } from './chunk-IFYMBOEN.mjs';
+import { selectionAsync } from './chunk-ARONDO7M.mjs';
+import { Icon } from './chunk-MZ6WRTD2.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { s } from './chunk-2CE3TQVY.mjs';
 import React, { useEffect } from 'react';
-import { StyleSheet, View, TouchableOpacity } from 'react-native';
+import { StyleSheet, View } from 'react-native';
 import Animated, { useSharedValue, withSpring, useAnimatedStyle, interpolateColor } from 'react-native-reanimated';
 
 function Dot({ active, size, activeColor, inactiveColor, onPress, index, total }) {
@@ -13,7 +14,7 @@ function Dot({ active, size, activeColor, inactiveColor, onPress, index, total }
     progress.value = withSpring(active ? 1 : 0, SPRINGS.glide);
   }, [active, progress]);
   const animatedStyle = useAnimatedStyle(() => ({
-    width: size + progress.value * size * 1.5,
+    width: size + progress.value * size,
     backgroundColor: interpolateColor(progress.value, [0, 1], [inactiveColor, activeColor])
   }));
   const dot = /* @__PURE__ */ React.createElement(Animated.View, { style: [{ height: size, borderRadius: size / 2 }, animatedStyle] });
@@ -23,14 +24,15 @@ function Dot({ active, size, activeColor, inactiveColor, onPress, index, total }
     onPress();
   };
   return /* @__PURE__ */ React.createElement(
-    TouchableOpacity,
+    PressableButton,
     {
       onPress: handlePress,
-      activeOpacity: 0.7,
+      rippleColor: "transparent",
       touchSoundDisabled: true,
       accessibilityRole: "button",
-      accessibilityLabel: `Page ${index + 1} of ${total}${active ? ", current page" : ""}`,
-      hitSlop: { top: 8, bottom: 8, left: 4, right: 4 }
+      accessibilityLabel: `P\xE1gina ${index + 1} de ${total}${active ? ", p\xE1gina actual" : ""}`,
+      hitSlop: { top: 10, bottom: 10, left: 18, right: 18 },
+      style: styles.dotTouchable
     },
     dot
   );
@@ -41,7 +43,7 @@ function PagerDots({
   onDotPress,
   showControls = false,
   dotSize = 8,
-  spacing = 8,
+  spacing = 4,
   activeColor,
   inactiveColor,
   style
@@ -76,21 +78,21 @@ function PagerDots({
     {
       style: [styles.container, { gap: s(spacing) }, style],
       accessibilityRole: "adjustable",
-      accessibilityLabel: `Page ${activeIndex + 1} of ${count}`
+      accessibilityLabel: `P\xE1gina ${activeIndex + 1} de ${count}`
     },
     hasControls && /* @__PURE__ */ React.createElement(
-      TouchableOpacity,
+      PressableButton,
       {
         onPress: handlePrevious,
-        disabled: !canGoPrev,
-        activeOpacity: 0.7,
+        enabled: canGoPrev,
+        rippleColor: "transparent",
         touchSoundDisabled: true,
         accessibilityRole: "button",
-        accessibilityLabel: "Previous page",
-        hitSlop: { top: 8, bottom: 8, left: 8, right: 8 },
+        accessibilityLabel: "P\xE1gina anterior",
+        hitSlop: { top: 10, bottom: 10, left: 10, right: 10 },
         style: [styles.controlBtn, !canGoPrev && styles.controlBtnDisabled]
       },
-      renderIcon("chevron-left", s(18), canGoPrev ? colors.foreground : colors.foregroundMuted)
+      /* @__PURE__ */ React.createElement(Icon, { name: "chevron-left", size: s(18), color: canGoPrev ? colors.foreground : colors.foregroundMuted })
     ),
     /* @__PURE__ */ React.createElement(View, { style: [styles.dotsRow, { gap: s(spacing) }] }, Array.from({ length: count }).map((_, i) => /* @__PURE__ */ React.createElement(
       Dot,
@@ -106,18 +108,18 @@ function PagerDots({
       }
     ))),
     hasControls && /* @__PURE__ */ React.createElement(
-      TouchableOpacity,
+      PressableButton,
       {
         onPress: handleNext,
-        disabled: !canGoNext,
-        activeOpacity: 0.7,
+        enabled: canGoNext,
+        rippleColor: "transparent",
         touchSoundDisabled: true,
         accessibilityRole: "button",
-        accessibilityLabel: "Next page",
-        hitSlop: { top: 8, bottom: 8, left: 8, right: 8 },
+        accessibilityLabel: "P\xE1gina siguiente",
+        hitSlop: { top: 10, bottom: 10, left: 10, right: 10 },
         style: [styles.controlBtn, !canGoNext && styles.controlBtnDisabled]
       },
-      renderIcon("chevron-right", s(18), canGoNext ? colors.foreground : colors.foregroundMuted)
+      /* @__PURE__ */ React.createElement(Icon, { name: "chevron-right", size: s(18), color: canGoNext ? colors.foreground : colors.foregroundMuted })
     )
   );
 }
@@ -132,7 +134,15 @@ var styles = StyleSheet.create({
     alignItems: "center"
   },
   controlBtn: {
-    padding: s(4)
+    padding: s(4),
+    minHeight: 44,
+    justifyContent: "center"
+  },
+  dotTouchable: {
+    minHeight: 44,
+    paddingHorizontal: s(14),
+    justifyContent: "center",
+    alignItems: "center"
   },
   controlBtnDisabled: {
     opacity: 0.3

package/dist/{chunk-YMYIEVZP.mjs → chunk-SZEKQAOY.mjs}

@@ -1,4 +1,4 @@
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { ms, vs, s } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { toast, Toaster } from 'sonner-native';

package/dist/{chunk-BXF4AMHY.mjs → chunk-TMH263OK.mjs}

@@ -1,7 +1,7 @@
-import { PressableCard } from './chunk-3DKJ2GIC.mjs';
-import { impactLight } from './chunk-EJ7ZPXOH.mjs';
+import { PressableCard } from './chunk-IFYMBOEN.mjs';
+import { impactLight } from './chunk-ARONDO7M.mjs';
 import { RADIUS } from './chunk-QY3X2UYR.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { vs, s, mvs, ms } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, Text } from 'react-native';
@@ -49,7 +49,8 @@ function Card({ children, variant = "elevated", onPress, style, accessibilityLab
         touchSoundDisabled: true,
         activateOnHover: true,
         accessibilityRole: "button",
-        accessibilityLabel
+        accessibilityLabel,
+        accessibilityState: { disabled: false }
       },
       cardContent
     );

package/dist/{chunk-NJG7DHVF.mjs → chunk-U6DEBYU5.mjs}

@@ -1,9 +1,10 @@
-import { selectionAsync } from './chunk-EJ7ZPXOH.mjs';
-import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { PressableTab } from './chunk-IFYMBOEN.mjs';
+import { selectionAsync } from './chunk-ARONDO7M.mjs';
+import { Icon } from './chunk-MZ6WRTD2.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { ms, s, vs, mvs } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
-import { StyleSheet, View, TouchableOpacity, Text } from 'react-native';
+import { StyleSheet, View, Text } from 'react-native';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 
 function TabBar({
@@ -36,23 +37,23 @@ function TabBar({
     items.map((item) => {
       const active = item.key === activeKey;
       const tint = active ? resolvedActive : resolvedInactive;
-      const iconNode = item.icon ?? (item.iconName ? renderIcon(item.iconName, ms(24), tint) : null);
+      const iconNode = item.icon ?? (item.iconName ? /* @__PURE__ */ React.createElement(Icon, { name: item.iconName, size: ms(24), color: tint }) : null);
       const showBadge = item.badge !== void 0 && item.badge !== false;
       const badgeCount = typeof item.badge === "number" ? item.badge : void 0;
       return /* @__PURE__ */ React.createElement(
-        TouchableOpacity,
+        PressableTab,
         {
           key: item.key,
-          style: styles.tab,
           onPress: () => {
             if (!active) selectionAsync();
             onTabPress(item.key);
           },
-          activeOpacity: 0.7,
+          rippleColor: "transparent",
           touchSoundDisabled: true,
           accessibilityRole: "tab",
           accessibilityState: { selected: active },
-          accessibilityLabel: item.label ?? item.key
+          accessibilityLabel: item.label ?? item.key,
+          style: styles.tab
         },
         /* @__PURE__ */ React.createElement(View, null, iconNode, showBadge ? /* @__PURE__ */ React.createElement(
           View,

package/dist/{chunk-QXDGGOLC.mjs → chunk-UMZTPUB3.mjs}

@@ -1,8 +1,8 @@
-import { Button } from './chunk-4J2PXL36.mjs';
-import { impactMedium, notificationSuccess, selectionAsync } from './chunk-EJ7ZPXOH.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { Button } from './chunk-Y6YS33GM.mjs';
+import { impactMedium, notificationSuccess, selectionAsync } from './chunk-ARONDO7M.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { vs, mvs, ms, s } from './chunk-2CE3TQVY.mjs';
-import React, { useRef, useId, useCallback, useEffect } from 'react';
+import React, { useRef, useId, useState, useEffect, useCallback } from 'react';
 import { StyleSheet, View, Text, TouchableOpacity } from 'react-native';
 import { BottomSheetBackdrop, BottomSheetModal, BottomSheetView } from '@gorhom/bottom-sheet';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
@@ -12,34 +12,45 @@ function ConfirmDialog({
   visible,
   title,
   subtitle,
-  confirmLabel = "Confirm",
-  cancelLabel = "Cancel",
+  confirmLabel = "Confirmar",
+  cancelLabel = "Cancelar",
   confirmVariant = "primary",
   loading = false,
   showCloseButton = false,
   onConfirm,
-  onCancel
+  onCancel,
+  accessibilityHint
 }) {
   const { colors } = useTheme();
   const insets = useSafeAreaInsets();
   const ref = useRef(null);
-  const wasOpened = useRef(false);
-  const isPresentedRef = useRef(false);
+  const dialogState = useRef("idle");
+  const onCancelRef = useRef(onCancel);
   const name = useId();
-  const handleDismiss = useCallback(() => {
-    isPresentedRef.current = false;
-    onCancel();
+  const [tick, setTick] = useState(0);
+  useEffect(() => {
+    onCancelRef.current = onCancel;
   }, [onCancel]);
+  const handleDismiss = useCallback(() => {
+    dialogState.current = "idle";
+    onCancelRef.current?.();
+    setTick((t) => t + 1);
+  }, []);
   useEffect(() => {
-    if (visible && !isPresentedRef.current) {
-      impactMedium();
-      ref.current?.present();
-      wasOpened.current = true;
-      isPresentedRef.current = true;
-    } else if (!visible && wasOpened.current && isPresentedRef.current) {
-      ref.current?.dismiss();
+    if (visible) {
+      if (dialogState.current === "idle") {
+        dialogState.current = "presenting";
+        impactMedium();
+        ref.current?.present();
+        dialogState.current = "presented";
+      }
+    } else {
+      if (dialogState.current === "presented" || dialogState.current === "presenting") {
+        dialogState.current = "dismissing";
+        ref.current?.dismiss();
+      }
     }
-  }, [visible]);
+  }, [visible, tick]);
   const renderBackdrop = useCallback(
     (props) => /* @__PURE__ */ React.createElement(
       BottomSheetBackdrop,
@@ -73,7 +84,7 @@ function ConfirmDialog({
         activeOpacity: 0.6,
         touchSoundDisabled: true,
         accessibilityRole: "button",
-        accessibilityLabel: "Close",
+        accessibilityLabel: "Cerrar",
         hitSlop: { top: 12, bottom: 12, left: 12, right: 12 }
       },
       /* @__PURE__ */ React.createElement(Feather, { name: "x", size: ms(18), color: colors.foregroundMuted })
@@ -89,6 +100,7 @@ function ConfirmDialog({
           notificationSuccess();
           onConfirm();
         },
+        accessibilityHint,
         icon: /* @__PURE__ */ React.createElement(
           Feather,
           {

package/dist/{chunk-KSUWPU2F.mjs → chunk-WIPEDNSD.mjs}

@@ -1,9 +1,9 @@
-import { PressableChip } from './chunk-3DKJ2GIC.mjs';
-import { selectionAsync } from './chunk-EJ7ZPXOH.mjs';
-import { COLOR_TRANSITION } from './chunk-DVK4G2GT.mjs';
+import { COLOR_TRANSITION } from './chunk-M53LC4Q7.mjs';
+import { PressableChip } from './chunk-IFYMBOEN.mjs';
+import { selectionAsync } from './chunk-ARONDO7M.mjs';
 import { RADIUS } from './chunk-QY3X2UYR.mjs';
-import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { Icon } from './chunk-MZ6WRTD2.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { ms, mvs, s, vs } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, Text, ScrollView } from 'react-native';
@@ -20,7 +20,7 @@ function SheetSelectChip({
     onPress();
   };
   const iconColor = selected ? colors.primaryForeground : colors.foreground;
-  const resolvedIcon = option.iconName ? renderIcon(option.iconName, ms(13), iconColor) : null;
+  const resolvedIcon = option.iconName ? /* @__PURE__ */ React.createElement(Icon, { name: option.iconName, size: ms(13), color: iconColor }) : null;
   return /* @__PURE__ */ React.createElement(
     PressableChip,
     {
@@ -28,7 +28,7 @@ function SheetSelectChip({
       rippleColor: "transparent",
       touchSoundDisabled: true,
       accessibilityRole: "button",
-      accessibilityLabel: option.disabled ? `${option.label}, unavailable` : option.label,
+      accessibilityLabel: option.disabled ? `${option.label}, no disponible` : option.label,
       accessibilityState: { selected, disabled: option.disabled }
     },
     /* @__PURE__ */ React.createElement(

package/dist/{chunk-QDAZGZUF.mjs → chunk-XCIG6HT2.mjs}

@@ -1,6 +1,6 @@
-import { TIMINGS } from './chunk-DVK4G2GT.mjs';
+import { TIMINGS } from './chunk-M53LC4Q7.mjs';
 import { RADIUS } from './chunk-QY3X2UYR.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { vs, s } from './chunk-2CE3TQVY.mjs';
 import React, { useState, useEffect } from 'react';
 import { StyleSheet, View } from 'react-native';
@@ -43,7 +43,7 @@ function Skeleton({
       ],
       onLayout: (e) => setContainerWidth(e.nativeEvent.layout.width),
       accessibilityRole: "progressbar",
-      accessibilityLabel: "Loading",
+      accessibilityLabel: "Cargando",
       accessibilityState: { busy: true }
     },
     /* @__PURE__ */ React.createElement(Animated.View, { style: [StyleSheet.absoluteFill, shimmerStyle] }, /* @__PURE__ */ React.createElement(

package/dist/{chunk-4J2PXL36.mjs → chunk-Y6YS33GM.mjs}

@@ -1,11 +1,13 @@
-import { PressableButton } from './chunk-3DKJ2GIC.mjs';
-import { impactMedium } from './chunk-EJ7ZPXOH.mjs';
+import { COLOR_TRANSITION } from './chunk-M53LC4Q7.mjs';
+import { PressableButton } from './chunk-IFYMBOEN.mjs';
+import { impactMedium } from './chunk-ARONDO7M.mjs';
 import { TYPOGRAPHY, RADIUS } from './chunk-QY3X2UYR.mjs';
-import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { Icon } from './chunk-MZ6WRTD2.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { vs, s, mvs, ms } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, ActivityIndicator, Text } from 'react-native';
+import { EaseView } from 'react-native-ease';
 
 var containerSizeStyles = {
   // AUDIT FIX: sm was 40pt — below Apple HIG 44pt minimum touch target.
@@ -41,17 +43,10 @@ function ButtonBase({
     impactMedium();
     onPress?.();
   };
-  const containerVariantStyle = isDisabled ? {
-    primary: { backgroundColor: colors.surface },
-    secondary: { backgroundColor: "transparent", borderWidth: 1.5, borderColor: colors.border },
-    text: { backgroundColor: "transparent" },
-    destructive: { backgroundColor: colors.surface }
-  }[variant] : {
-    primary: { backgroundColor: colors.primary },
-    secondary: { backgroundColor: "transparent", borderWidth: 1.5, borderColor: colors.primary },
-    text: { backgroundColor: "transparent" },
-    destructive: { backgroundColor: colors.destructive }
-  }[variant];
+  const isSecondary = variant === "secondary";
+  const borderWidth = isSecondary ? 1.5 : 0;
+  const animateBgColor = isDisabled ? { primary: colors.surface, secondary: "transparent", text: "transparent", destructive: colors.surface }[variant] : { primary: colors.primary, secondary: "transparent", text: "transparent", destructive: colors.destructive }[variant];
+  const animateBorderColor = isDisabled ? isSecondary ? colors.border : "transparent" : isSecondary ? colors.primary : "transparent";
   const labelColor = isDisabled ? colors.foregroundMuted : {
     primary: colors.primaryForeground,
     secondary: colors.primary,
@@ -59,7 +54,7 @@ function ButtonBase({
     destructive: colors.destructiveForeground
   }[variant];
   const textColor = iconColor ?? labelColor;
-  const effectiveIcon = iconName ? renderIcon(iconName, iconSizeMap[size], textColor) : typeof icon === "function" ? icon({ label, size, variant, color: textColor }) : icon;
+  const effectiveIcon = iconName ? /* @__PURE__ */ React.createElement(Icon, { name: iconName, size: iconSizeMap[size], color: textColor }) : typeof icon === "function" ? icon({ label, size, variant, color: textColor }) : icon;
   const spinnerColor = isDisabled ? colors.foregroundMuted : variant === "destructive" ? colors.destructiveForeground : variant === "primary" ? colors.primaryForeground : colors.accentResolved;
   const styleArray = Array.isArray(style) ? style : style ? [style] : [];
   const flatStyle = StyleSheet.flatten(styleArray);
@@ -67,13 +62,6 @@ function ButtonBase({
   return /* @__PURE__ */ React.createElement(View, { style: [fullWidth && styles.fullWidth, flex !== void 0 && { flex }] }, /* @__PURE__ */ React.createElement(
     PressableButton,
     {
-      style: [
-        styles.base,
-        containerVariantStyle,
-        containerSizeStyles[size],
-        fullWidth && styles.fullWidth,
-        restStyle
-      ],
       enabled: !isDisabled,
       onPress: handlePress,
       rippleColor: "transparent",
@@ -84,23 +72,37 @@ function ButtonBase({
       accessibilityHint,
       accessibilityState: { disabled: isDisabled, busy: loading }
     },
-    loading ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ActivityIndicator, { size: "small", color: spinnerColor, style: { marginRight: s(6) } }), /* @__PURE__ */ React.createElement(
-      Text,
-      {
-        style: [styles.label, { color: labelColor }, labelSizeStyles[size], styles.labelLoading],
-        allowFontScaling: true,
-        numberOfLines: 1
-      },
-      label
-    )) : /* @__PURE__ */ React.createElement(React.Fragment, null, effectiveIcon && iconPosition === "left" && /* @__PURE__ */ React.createElement(React.Fragment, null, effectiveIcon), /* @__PURE__ */ React.createElement(
-      Text,
+    /* @__PURE__ */ React.createElement(
+      EaseView,
       {
-        style: [styles.label, { color: labelColor }, labelSizeStyles[size], effectiveIcon ? styles.labelWithIcon : void 0],
-        allowFontScaling: true,
-        numberOfLines: 1
+        style: [
+          styles.base,
+          containerSizeStyles[size],
+          { borderWidth },
+          fullWidth && styles.fullWidth,
+          restStyle
+        ],
+        animate: { backgroundColor: animateBgColor, borderColor: animateBorderColor },
+        transition: COLOR_TRANSITION
       },
-      label
-    ), effectiveIcon && iconPosition === "right" && /* @__PURE__ */ React.createElement(React.Fragment, null, effectiveIcon))
+      loading ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(ActivityIndicator, { size: "small", color: spinnerColor, style: { marginRight: s(6) } }), /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          style: [styles.label, { color: labelColor }, labelSizeStyles[size], styles.labelLoading],
+          allowFontScaling: true,
+          numberOfLines: 1
+        },
+        label
+      )) : /* @__PURE__ */ React.createElement(React.Fragment, null, effectiveIcon && iconPosition === "left" && /* @__PURE__ */ React.createElement(React.Fragment, null, effectiveIcon), /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          style: [styles.label, { color: labelColor }, labelSizeStyles[size], effectiveIcon ? styles.labelWithIcon : void 0],
+          allowFontScaling: true,
+          numberOfLines: 1
+        },
+        label
+      ), effectiveIcon && iconPosition === "right" && /* @__PURE__ */ React.createElement(React.Fragment, null, effectiveIcon))
+    )
   ));
 }
 var Button = React.memo(ButtonBase);

package/dist/{chunk-4XOB5TTD.mjs → chunk-ZKDKKQCE.mjs}

@@ -1,8 +1,8 @@
-import { PressableCard } from './chunk-3DKJ2GIC.mjs';
-import { impactLight } from './chunk-EJ7ZPXOH.mjs';
+import { PressableCard } from './chunk-IFYMBOEN.mjs';
+import { impactLight } from './chunk-ARONDO7M.mjs';
 import { RADIUS } from './chunk-QY3X2UYR.mjs';
-import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { Icon } from './chunk-MZ6WRTD2.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { s, vs, mvs, ms } from './chunk-2CE3TQVY.mjs';
 import React, { useState, useCallback } from 'react';
 import { StyleSheet, View, Text } from 'react-native';
@@ -80,7 +80,7 @@ function StatsComponent({
     }
   }[variant];
   const iconColorResolved = iconColor ?? colors.primary;
-  const resolvedIcon = iconName ? renderIcon(iconName, sizeStyles.iconSize, iconColorResolved) : icon;
+  const resolvedIcon = iconName ? /* @__PURE__ */ React.createElement(Icon, { name: iconName, size: sizeStyles.iconSize, color: iconColorResolved }) : icon;
   const iconElement = resolvedIcon ? /* @__PURE__ */ React.createElement(View, { style: styles.iconWrapper }, resolvedIcon) : null;
   const valueElement = /* @__PURE__ */ React.createElement(Text, { style: [styles.value, { color: colors.foreground, fontFamily: sizeStyles.valueFontFamily, fontSize: sizeStyles.valueFontSize, lineHeight: sizeStyles.valueLineHeight }], allowFontScaling: true }, value);
   const cardContent = /* @__PURE__ */ React.createElement(View, { style: [styles.card, variantStyle, { padding: sizeStyles.padding }, style], onLayout: handleLayout }, isCompact ? /* @__PURE__ */ React.createElement(React.Fragment, null, iconElement, /* @__PURE__ */ React.createElement(View, { style: styles.compactValue }, valueElement), /* @__PURE__ */ React.createElement(Text, { style: [styles.label, { color: colors.foregroundSubtle, fontSize: sizeStyles.labelFontSize, lineHeight: sizeStyles.labelLineHeight }], allowFontScaling: true }, label), description ? /* @__PURE__ */ React.createElement(Text, { style: [styles.description, { color: colors.foregroundMuted, fontSize: sizeStyles.descriptionFontSize, lineHeight: sizeStyles.descriptionLineHeight }], allowFontScaling: true }, description) : null) : /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(View, { style: styles.valueRow }, iconElement, valueElement), /* @__PURE__ */ React.createElement(Text, { style: [styles.label, { color: colors.foregroundSubtle, fontSize: sizeStyles.labelFontSize, lineHeight: sizeStyles.labelLineHeight }], allowFontScaling: true }, label), description ? /* @__PURE__ */ React.createElement(Text, { style: [styles.description, { color: colors.foregroundMuted, fontSize: sizeStyles.descriptionFontSize, lineHeight: sizeStyles.descriptionLineHeight }], allowFontScaling: true }, description) : null));

package/dist/{chunk-LOBLCFMN.mjs → chunk-ZTPYUU5C.mjs}

@@ -1,7 +1,7 @@
-import { PressableButton } from './chunk-3DKJ2GIC.mjs';
-import { impactLight } from './chunk-EJ7ZPXOH.mjs';
-import { renderIcon } from './chunk-KA7LTET3.mjs';
-import { useTheme } from './chunk-YTXRIXNZ.mjs';
+import { PressableButton } from './chunk-IFYMBOEN.mjs';
+import { impactLight } from './chunk-ARONDO7M.mjs';
+import { Icon } from './chunk-MZ6WRTD2.mjs';
+import { useTheme } from './chunk-KSSVIFYR.mjs';
 import { s, ms } from './chunk-2CE3TQVY.mjs';
 import React from 'react';
 import { StyleSheet, View, ActivityIndicator, Text } from 'react-native';
@@ -48,7 +48,7 @@ function IconButtonBase({
   }[variant];
   const spinnerColor = variant === "destructive" ? colors.destructiveForeground : variant === "primary" ? colors.primaryForeground : colors.foreground;
   const { container: containerSize, icon: iconSize } = sizeMap[size];
-  const resolvedIcon = iconName ? renderIcon(iconName, iconSize, iconColor ?? defaultIconColor) : icon;
+  const resolvedIcon = iconName ? /* @__PURE__ */ React.createElement(Icon, { name: iconName, size: iconSize, color: iconColor ?? defaultIconColor }) : icon;
   const showBadge = badge !== void 0 && badge !== false && badge !== 0;
   const badgeCount = typeof badge === "number" ? Math.min(badge, 99) : null;
   const showCount = typeof badge === "number" && badge > 0;

package/dist/fonts.mjs

@@ -1,5 +1,3 @@
-import './chunk-Y6FXYEAI.mjs';
-
 // src/fonts.ts
 var SohneFontNames = [
   // Sohne base (14)