orn-ui 0.2.7 → 0.2.8

package/lib/module/organisms/Slides.js

@@ -0,0 +1,401 @@
+"use strict";
+
+import React, { memo, useEffect, useRef } from 'react';
+import { Animated, Easing, ScrollView, StyleSheet, Text, TouchableOpacity, View } from 'react-native';
+import { createStyles } from '../theme/createStyles';
+import { useAllowFontScaling, useColors, useTheme } from '../theme/UIProvider';
+import { useReduceMotion } from '../atoms/Transition';
+import { Gradient } from '../atoms/Gradient';
+import { useSlides } from './useSlides';
+
+/** Un color sólido, o dos o más para un degradado (ver `Gradient`). */
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+const DOT = 8;
+const DOT_ACTIVE = 20;
+const NUMBER_CIRCLE = 24;
+const TOGGLE = 32;
+const DEFAULT_HEIGHT = 240;
+const DEFAULT_INTERVAL = 4000;
+const useStyles = createStyles(theme => ({
+  // Deja redondear el bloque por `style` sin que el degradado se salga.
+  root: {
+    overflow: 'hidden'
+  },
+  viewport: {
+    flex: 1
+  },
+  // La slide visible es la caja de adentro: con `spacing` la página es más
+  // ancha que ella, y el fondo tiene que recortarse acá y no en la página, o
+  // el degradado pinta también el hueco.
+  slide: {
+    flex: 1,
+    overflow: 'hidden'
+  },
+  // Con indicadores fuera y orientación vertical el contenedor es una fila:
+  // sin flex la ventana no tiene ancho propio y colapsa a 0.
+  viewportInRow: {
+    flex: 1
+  },
+  slideContent: {
+    flex: 1
+  },
+  indicatorsRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  indicatorsColumn: {
+    flexDirection: 'column',
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  indicatorsOverlayHorizontal: {
+    position: 'absolute',
+    left: 0,
+    right: 0,
+    bottom: theme.tokens.spacing.md
+  },
+  indicatorsOverlayVertical: {
+    position: 'absolute',
+    top: 0,
+    bottom: 0,
+    right: theme.tokens.spacing.md
+  },
+  indicatorsOutsideHorizontal: {
+    paddingTop: theme.tokens.spacing.md
+  },
+  indicatorsOutsideVertical: {
+    paddingLeft: theme.tokens.spacing.md
+  },
+  indicatorSlot: {
+    padding: theme.tokens.spacing.xs
+  },
+  dot: {
+    width: DOT,
+    height: DOT,
+    borderRadius: DOT / 2
+  },
+  autoPlayToggle: {
+    position: 'absolute',
+    top: theme.tokens.spacing.md,
+    right: theme.tokens.spacing.md,
+    width: TOGGLE,
+    height: TOGGLE,
+    borderRadius: TOGGLE / 2,
+    alignItems: 'center',
+    justifyContent: 'center',
+    flexDirection: 'row',
+    gap: 3
+  },
+  pauseBar: {
+    width: 3,
+    height: 12,
+    borderRadius: 1
+  },
+  // Triángulo con bordes: un "play" sin SVG ni set de íconos.
+  playTriangle: {
+    width: 0,
+    height: 0,
+    marginLeft: 2,
+    borderTopWidth: 6,
+    borderBottomWidth: 6,
+    borderLeftWidth: 10,
+    borderTopColor: 'transparent',
+    borderBottomColor: 'transparent'
+  },
+  numberCircle: {
+    minWidth: NUMBER_CIRCLE,
+    height: NUMBER_CIRCLE,
+    borderRadius: NUMBER_CIRCLE / 2,
+    borderWidth: 1,
+    paddingHorizontal: theme.tokens.spacing.xs,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  numberText: {
+    fontSize: theme.tokens.fontSize.xs,
+    fontWeight: theme.tokens.fontWeight.semibold
+  },
+  outsideHorizontal: {
+    flexDirection: 'column'
+  },
+  outsideVertical: {
+    flexDirection: 'row'
+  }
+}));
+/**
+ * El punto activo se estira en vez de saltar: el cambio de golpe se lee como
+ * "apareció otro punto", no como "el mismo se movió". Ancho y color son props
+ * de layout/pintura, así que van por el driver de JS.
+ */
+const Dot = /*#__PURE__*/memo(({
+  selected,
+  isHorizontal,
+  overlay,
+  activeColor,
+  inactiveColor,
+  testID
+}) => {
+  const styles = useStyles();
+  const theme = useTheme();
+  const reduceMotion = useReduceMotion();
+  const progress = useRef(new Animated.Value(selected ? 1 : 0)).current;
+  useEffect(() => {
+    Animated.timing(progress, {
+      toValue: selected ? 1 : 0,
+      duration: reduceMotion ? 0 : theme.tokens.duration.base,
+      easing: Easing.out(Easing.quad),
+      useNativeDriver: false
+    }).start();
+  }, [progress, reduceMotion, selected, theme]);
+  const length = progress.interpolate({
+    inputRange: [0, 1],
+    outputRange: [DOT, DOT_ACTIVE]
+  });
+  const backgroundColor = progress.interpolate({
+    inputRange: [0, 1],
+    outputRange: [inactiveColor, activeColor]
+  });
+  return /*#__PURE__*/_jsx(Animated.View, {
+    testID: testID,
+    style: [styles.dot, isHorizontal ? {
+      width: length
+    } : {
+      height: length
+    }, {
+      backgroundColor
+    }, overlay && {
+      opacity: progress.interpolate({
+        inputRange: [0, 1],
+        outputRange: [0.45, 1]
+      })
+    }]
+  });
+});
+Dot.displayName = 'SlidesDot';
+
+/**
+ * Slides
+ * Carrusel con fondo propio (color plano o degradado) y contenido libre:
+ * `renderItem` decide si adentro va una imagen, texto o botones. El estado
+ * vive en `useSlides`; acá sólo está el árbol.
+ *
+ * El deslizamiento es un `ScrollView` con `pagingEnabled` en vez de gestos a
+ * mano: es lo único que da snap nativo en iOS y Android sin
+ * `react-native-gesture-handler`, en todo el rango soportado (Expo SDK 54–57).
+ */
+export function Slides({
+  data,
+  keyExtractor,
+  renderItem,
+  background,
+  gradientDirection = 'vertical',
+  orientation = 'horizontal',
+  indicators = 'dots',
+  indicatorPlacement = 'overlay',
+  loop = false,
+  autoPlay = false,
+  interval = DEFAULT_INTERVAL,
+  showAutoPlayToggle = true,
+  spacing = 0,
+  index,
+  defaultIndex = 0,
+  onIndexChange,
+  height = DEFAULT_HEIGHT,
+  swipeEnabled = true,
+  slideStyle,
+  style,
+  testID
+}) {
+  const colors = useColors();
+  const styles = useStyles();
+  const allowFontScaling = useAllowFontScaling();
+  const total = data.length;
+  const {
+    active,
+    pages,
+    isHorizontal,
+    size,
+    pageSize,
+    scrollRef,
+    autoPlayPaused,
+    motionReduced,
+    goTo,
+    toggleAutoPlay,
+    onLayout,
+    onMomentumScrollEnd,
+    onScrollBeginDrag,
+    onScrollEndDrag
+  } = useSlides({
+    total,
+    orientation,
+    loop,
+    autoPlay,
+    interval,
+    index,
+    defaultIndex,
+    onIndexChange
+  });
+  const isOverlay = indicatorPlacement === 'overlay';
+  const renderBackground = (item, real) => {
+    const value = background?.(item, real);
+    if (!value) return null;
+    if (Array.isArray(value)) {
+      return /*#__PURE__*/_jsx(Gradient, {
+        colors: value,
+        direction: gradientDirection,
+        style: StyleSheet.absoluteFill
+      });
+    }
+    return /*#__PURE__*/_jsx(View, {
+      style: [StyleSheet.absoluteFill, {
+        backgroundColor: value
+      }],
+      pointerEvents: "none"
+    });
+  };
+  const renderIndicator = position => {
+    const selected = position === active;
+    if (indicators === 'numbers') {
+      const numberColors = isOverlay ? {
+        background: selected ? colors.white : 'transparent',
+        border: colors.white,
+        text: selected ? colors.black : colors.white
+      } : {
+        background: selected ? colors.primary : 'transparent',
+        border: selected ? colors.primary : colors.border,
+        text: selected ? colors.onPrimary : colors.textLight
+      };
+      return /*#__PURE__*/_jsx(View, {
+        style: [styles.numberCircle, {
+          backgroundColor: numberColors.background,
+          borderColor: numberColors.border
+        }],
+        children: /*#__PURE__*/_jsx(Text, {
+          allowFontScaling: allowFontScaling,
+          style: [styles.numberText, {
+            color: numberColors.text
+          }],
+          children: position + 1
+        })
+      });
+    }
+    return /*#__PURE__*/_jsx(Dot, {
+      testID: `${testID ?? 'slides'}-dot-${position}`,
+      selected: selected,
+      isHorizontal: isHorizontal,
+      overlay: isOverlay,
+      activeColor: isOverlay ? colors.white : colors.primary,
+      inactiveColor: isOverlay ? colors.white : colors.border
+    });
+  };
+
+  // Con reduce-motion el autoPlay ya está apagado: no hay nada que pausar.
+  const renderAutoPlayToggle = () => {
+    if (!autoPlay || !showAutoPlayToggle || motionReduced || total < 2) return null;
+    return /*#__PURE__*/_jsx(TouchableOpacity, {
+      testID: `${testID ?? 'slides'}-autoplay-toggle`,
+      style: [styles.autoPlayToggle, {
+        backgroundColor: colors.black,
+        opacity: 0.55
+      }],
+      activeOpacity: 0.7,
+      onPress: toggleAutoPlay,
+      accessibilityRole: "button",
+      accessibilityLabel: autoPlayPaused ? 'Resume automatic slides' : 'Pause automatic slides',
+      accessibilityState: {
+        selected: !autoPlayPaused
+      },
+      children: autoPlayPaused ? /*#__PURE__*/_jsx(View, {
+        style: [styles.playTriangle, {
+          borderLeftColor: colors.white
+        }]
+      }) : /*#__PURE__*/_jsxs(_Fragment, {
+        children: [/*#__PURE__*/_jsx(View, {
+          style: [styles.pauseBar, {
+            backgroundColor: colors.white
+          }]
+        }), /*#__PURE__*/_jsx(View, {
+          style: [styles.pauseBar, {
+            backgroundColor: colors.white
+          }]
+        })]
+      })
+    });
+  };
+  const renderIndicators = () => {
+    if (indicators === 'none' || total < 2) return null;
+    return /*#__PURE__*/_jsx(View, {
+      testID: `${testID ?? 'slides'}-indicators`,
+      style: [isHorizontal ? styles.indicatorsRow : styles.indicatorsColumn, isOverlay ? isHorizontal ? styles.indicatorsOverlayHorizontal : styles.indicatorsOverlayVertical : isHorizontal ? styles.indicatorsOutsideHorizontal : styles.indicatorsOutsideVertical],
+      pointerEvents: "box-none",
+      children: data.map((item, position) => /*#__PURE__*/_jsx(TouchableOpacity, {
+        testID: `${testID ?? 'slides'}-indicator-${position}`,
+        style: styles.indicatorSlot,
+        activeOpacity: 0.7,
+        onPress: () => goTo(position),
+        accessibilityRole: "button",
+        accessibilityLabel: `Slide ${position + 1} of ${total}`,
+        accessibilityState: {
+          selected: position === active
+        },
+        children: renderIndicator(position)
+      }, `indicator-${keyExtractor(item, position)}`))
+    });
+  };
+  const viewport = /*#__PURE__*/_jsxs(View, {
+    testID: testID,
+    style: [styles.root, {
+      height
+    }, !isOverlay && !isHorizontal && styles.viewportInRow, isOverlay && style],
+    onLayout: onLayout,
+    children: [/*#__PURE__*/_jsx(ScrollView, {
+      ref: scrollRef,
+      testID: `${testID ?? 'slides'}-scroll`,
+      style: styles.viewport,
+      horizontal: isHorizontal,
+      pagingEnabled: true,
+      scrollEnabled: swipeEnabled && total > 1,
+      showsHorizontalScrollIndicator: false,
+      showsVerticalScrollIndicator: false,
+      onMomentumScrollEnd: onMomentumScrollEnd,
+      onScrollBeginDrag: onScrollBeginDrag,
+      onScrollEndDrag: onScrollEndDrag,
+      children: pageSize > 0 && pages.map(({
+        real,
+        clone
+      }) => {
+        const item = data[real];
+        return (
+          /*#__PURE__*/
+          // El hueco se reparte a los dos lados de cada página: así la
+          // separación entre dos slides es `spacing` entero y la página
+          // sigue midiendo exactamente lo que pagina el ScrollView.
+          _jsx(View, {
+            style: [{
+              width: size.width,
+              height: size.height
+            }, isHorizontal ? {
+              paddingHorizontal: spacing / 2
+            } : {
+              paddingVertical: spacing / 2
+            }],
+            children: /*#__PURE__*/_jsxs(View, {
+              style: [styles.slide, slideStyle],
+              children: [renderBackground(item, real), /*#__PURE__*/_jsx(View, {
+                style: styles.slideContent,
+                children: renderItem(item, real)
+              })]
+            })
+          }, clone ? `slides-clone-${clone}` : keyExtractor(item, real))
+        );
+      })
+    }), renderAutoPlayToggle(), isOverlay && renderIndicators()]
+  });
+  if (isOverlay) return viewport;
+  return /*#__PURE__*/_jsxs(View, {
+    style: [isHorizontal ? styles.outsideHorizontal : styles.outsideVertical, style],
+    children: [viewport, renderIndicators()]
+  });
+}
+//# sourceMappingURL=Slides.js.map

package/lib/module/organisms/Slides.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","memo","useEffect","useRef","Animated","Easing","ScrollView","StyleSheet","Text","TouchableOpacity","View","createStyles","useAllowFontScaling","useColors","useTheme","useReduceMotion","Gradient","useSlides","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","DOT","DOT_ACTIVE","NUMBER_CIRCLE","TOGGLE","DEFAULT_HEIGHT","DEFAULT_INTERVAL","useStyles","theme","root","overflow","viewport","flex","slide","viewportInRow","slideContent","indicatorsRow","flexDirection","alignItems","justifyContent","indicatorsColumn","indicatorsOverlayHorizontal","position","left","right","bottom","tokens","spacing","md","indicatorsOverlayVertical","top","indicatorsOutsideHorizontal","paddingTop","indicatorsOutsideVertical","paddingLeft","indicatorSlot","padding","xs","dot","width","height","borderRadius","autoPlayToggle","gap","pauseBar","playTriangle","marginLeft","borderTopWidth","borderBottomWidth","borderLeftWidth","borderTopColor","borderBottomColor","numberCircle","minWidth","borderWidth","paddingHorizontal","numberText","fontSize","fontWeight","semibold","outsideHorizontal","outsideVertical","Dot","selected","isHorizontal","overlay","activeColor","inactiveColor","testID","styles","reduceMotion","progress","Value","current","timing","toValue","duration","base","easing","out","quad","useNativeDriver","start","length","interpolate","inputRange","outputRange","backgroundColor","style","opacity","displayName","Slides","data","keyExtractor","renderItem","background","gradientDirection","orientation","indicators","indicatorPlacement","loop","autoPlay","interval","showAutoPlayToggle","index","defaultIndex","onIndexChange","swipeEnabled","slideStyle","colors","allowFontScaling","total","active","pages","size","pageSize","scrollRef","autoPlayPaused","motionReduced","goTo","toggleAutoPlay","onLayout","onMomentumScrollEnd","onScrollBeginDrag","onScrollEndDrag","isOverlay","renderBackground","item","real","value","Array","isArray","direction","absoluteFill","pointerEvents","renderIndicator","numberColors","white","border","text","black","primary","onPrimary","textLight","borderColor","children","color","renderAutoPlayToggle","activeOpacity","onPress","accessibilityRole","accessibilityLabel","accessibilityState","borderLeftColor","renderIndicators","map","ref","horizontal","pagingEnabled","scrollEnabled","showsHorizontalScrollIndicator","showsVerticalScrollIndicator","clone","paddingVertical"],"sourceRoot":"../../../src","sources":["organisms/Slides.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/organisms/index.js

@@ -16,4 +16,5 @@ export { Wizard } from './Wizard';
 export { ThemeToggle } from './ThemeToggle';
 export { NavigationBar } from './NavigationBar';
 export { ReorderableList } from './ReorderableList';
+export { Slides } from './Slides';
 //# sourceMappingURL=index.js.map

package/lib/module/organisms/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["Modal","BottomSheet","Select","Alert","AlertProvider","useAlert","showAlert","showConfirm","hideAlert","Screen","List","SearchList","Toast","ToastProvider","useToast","showToast","hideToast","hideAllToasts","DatePicker","buildMonthGrid","DEFAULT_MONTH_NAMES","DEFAULT_WEEKDAY_NAMES","DateField","Wizard","ThemeToggle","NavigationBar","ReorderableList"],"sourceRoot":"../../../src","sources":["organisms/index.ts"],"mappings":";;AAAA,SAASA,KAAK,QAAQ,SAAS;AAE/B,SAASC,WAAW,QAAQ,eAAe;AAE3C,SAASC,MAAM,QAAQ,UAAU;AAEjC,SAASC,KAAK,QAAQ,SAAS;AAE/B,SAASC,aAAa,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,WAAW,EAAEC,SAAS,QAAQ,iBAAiB;AAE5F,SAASC,MAAM,QAAQ,UAAU;AAEjC,SAASC,IAAI,QAAQ,QAAQ;AAE7B,SAASC,UAAU,QAAQ,cAAc;AAEzC,SAASC,KAAK,QAAQ,SAAS;AAE/B,SAASC,aAAa,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAEC,aAAa,QAAQ,iBAAiB;AAE9F,SAASC,UAAU,EAAEC,cAAc,EAAEC,mBAAmB,EAAEC,qBAAqB,QAAQ,cAAc;AAErG,SAASC,SAAS,QAAQ,aAAa;AAEvC,SAASC,MAAM,QAAQ,UAAU;AAEjC,SAASC,WAAW,QAAQ,eAAe;AAE3C,SAASC,aAAa,QAAQ,iBAAiB;AAE/C,SAASC,eAAe,QAAQ,mBAAmB","ignoreList":[]}
+{"version":3,"names":["Modal","BottomSheet","Select","Alert","AlertProvider","useAlert","showAlert","showConfirm","hideAlert","Screen","List","SearchList","Toast","ToastProvider","useToast","showToast","hideToast","hideAllToasts","DatePicker","buildMonthGrid","DEFAULT_MONTH_NAMES","DEFAULT_WEEKDAY_NAMES","DateField","Wizard","ThemeToggle","NavigationBar","ReorderableList","Slides"],"sourceRoot":"../../../src","sources":["organisms/index.ts"],"mappings":";;AAAA,SAASA,KAAK,QAAQ,SAAS;AAE/B,SAASC,WAAW,QAAQ,eAAe;AAE3C,SAASC,MAAM,QAAQ,UAAU;AAEjC,SAASC,KAAK,QAAQ,SAAS;AAE/B,SAASC,aAAa,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,WAAW,EAAEC,SAAS,QAAQ,iBAAiB;AAE5F,SAASC,MAAM,QAAQ,UAAU;AAEjC,SAASC,IAAI,QAAQ,QAAQ;AAE7B,SAASC,UAAU,QAAQ,cAAc;AAEzC,SAASC,KAAK,QAAQ,SAAS;AAE/B,SAASC,aAAa,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,SAAS,EAAEC,aAAa,QAAQ,iBAAiB;AAE9F,SAASC,UAAU,EAAEC,cAAc,EAAEC,mBAAmB,EAAEC,qBAAqB,QAAQ,cAAc;AAErG,SAASC,SAAS,QAAQ,aAAa;AAEvC,SAASC,MAAM,QAAQ,UAAU;AAEjC,SAASC,WAAW,QAAQ,eAAe;AAE3C,SAASC,aAAa,QAAQ,iBAAiB;AAE/C,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,MAAM,QAAQ,UAAU","ignoreList":[]}

package/lib/module/organisms/useSlides.js

@@ -0,0 +1,182 @@
+"use strict";
+
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { useReduceMotion } from '../atoms/Transition';
+
+/** Una página del scroll. Los clones del modo infinito repiten el `real` de un vecino. */
+
+export function clampIndex(value, total) {
+  if (total === 0) return 0;
+  if (value < 0) return 0;
+  if (value > total - 1) return total - 1;
+  return value;
+}
+
+/**
+ * useSlides
+ * Todo lo que en `Slides` no se ve: qué página está encuadrada, cuándo mover el
+ * scroll, cómo se mapean los clones del modo infinito a índices reales, y el
+ * reloj del avance automático.
+ *
+ * Trabaja sólo con índices, nunca con los ítems: así no necesita el genérico
+ * `T` del componente, y el UI resuelve `pages[i].real` contra su propio `data`.
+ */
+export function useSlides({
+  total,
+  orientation,
+  loop,
+  autoPlay,
+  interval,
+  index,
+  defaultIndex,
+  onIndexChange
+}) {
+  const motionReduced = useReduceMotion();
+  const isHorizontal = orientation === 'horizontal';
+  // Un solo elemento no tiene a dónde ciclar: quedaría deslizable entre tres
+  // copias de lo mismo.
+  const isLoop = loop && total > 1;
+  const [uncontrolled, setUncontrolled] = useState(() => clampIndex(defaultIndex, total));
+  const active = clampIndex(index ?? uncontrolled, total);
+  const activeRef = useRef(active);
+  activeRef.current = active;
+  const [autoPlayPaused, setAutoPlayPaused] = useState(false);
+  const [size, setSize] = useState({
+    width: 0,
+    height: 0
+  });
+  const pageSize = isHorizontal ? size.width : size.height;
+  const scrollRef = useRef(null);
+  /** Página realmente visible (índice dentro de `pages`, clones incluidos). */
+  const offsetPageRef = useRef(isLoop ? 1 : 0);
+  const didInitRef = useRef(false);
+  const lastPageSizeRef = useRef(0);
+  const draggingRef = useRef(false);
+  const pages = useMemo(() => {
+    const real = Array.from({
+      length: total
+    }, (_, i) => ({
+      real: i,
+      clone: null
+    }));
+    if (!isLoop) return real;
+    return [{
+      real: total - 1,
+      clone: 'head'
+    }, ...real, {
+      real: 0,
+      clone: 'tail'
+    }];
+  }, [isLoop, total]);
+  const scrollToPage = useCallback((page, animated) => {
+    const offset = page * pageSize;
+    scrollRef.current?.scrollTo({
+      x: isHorizontal ? offset : 0,
+      y: isHorizontal ? 0 : offset,
+      animated
+    });
+  }, [isHorizontal, pageSize]);
+  const goTo = useCallback(next => {
+    if (next === activeRef.current) return;
+    activeRef.current = next;
+    if (index == null) setUncontrolled(next);
+    onIndexChange?.(next);
+  }, [index, onIndexChange]);
+
+  // Sólo actúa cuando el índice y la página visible discrepan: un cambio que
+  // vino del propio gesto no dispara un segundo scroll encima del que frenó.
+  useEffect(() => {
+    if (pageSize === 0 || total === 0) return;
+    const target = isLoop ? active + 1 : active;
+    const resized = lastPageSizeRef.current !== pageSize;
+    if (offsetPageRef.current === target && didInitRef.current && !resized) return;
+    // Ni el primer posicionamiento ni el reacomodo por rotación son un cambio
+    // de slide: animarlos sería un deslizamiento que nadie pidió.
+    const animated = didInitRef.current && !resized;
+    didInitRef.current = true;
+    lastPageSizeRef.current = pageSize;
+    offsetPageRef.current = target;
+    scrollToPage(target, animated);
+  }, [active, isLoop, pageSize, scrollToPage, total]);
+  const onLayout = useCallback(event => {
+    const {
+      width,
+      height
+    } = event.nativeEvent.layout;
+    setSize(prev => prev.width === width && prev.height === height ? prev : {
+      width,
+      height
+    });
+  }, []);
+  const onMomentumScrollEnd = useCallback(event => {
+    draggingRef.current = false;
+    if (pageSize === 0) return;
+    const {
+      contentOffset
+    } = event.nativeEvent;
+    const page = Math.round((isHorizontal ? contentOffset.x : contentOffset.y) / pageSize);
+    if (isLoop) {
+      if (page === 0) {
+        offsetPageRef.current = total;
+        scrollToPage(total, false);
+        goTo(total - 1);
+        return;
+      }
+      if (page === total + 1) {
+        offsetPageRef.current = 1;
+        scrollToPage(1, false);
+        goTo(0);
+        return;
+      }
+      offsetPageRef.current = page;
+      goTo(page - 1);
+      return;
+    }
+    offsetPageRef.current = page;
+    goTo(clampIndex(page, total));
+  }, [goTo, isHorizontal, isLoop, pageSize, scrollToPage, total]);
+  const onScrollBeginDrag = useCallback(() => {
+    draggingRef.current = true;
+  }, []);
+  const onScrollEndDrag = useCallback(() => {
+    // Un arrastre corto puede soltarse sin inercia y no emitir
+    // momentumScrollEnd: sin esto el autoPlay quedaría pausado para siempre.
+    draggingRef.current = false;
+  }, []);
+  const toggleAutoPlay = useCallback(() => setAutoPlayPaused(paused => !paused), []);
+  useEffect(() => {
+    if (!autoPlay || autoPlayPaused || motionReduced || total < 2 || pageSize === 0) return;
+    const timer = setInterval(() => {
+      if (draggingRef.current) return;
+      const from = activeRef.current;
+      if (from < total - 1) {
+        goTo(from + 1);
+        return;
+      }
+      if (!isLoop) return;
+      // Última en modo infinito: avanza al clon de la primera en vez de
+      // rebobinar; el salto al original lo cierra momentumScrollEnd.
+      offsetPageRef.current = total + 1;
+      scrollToPage(total + 1, true);
+    }, interval);
+    return () => clearInterval(timer);
+  }, [autoPlay, autoPlayPaused, goTo, interval, isLoop, motionReduced, pageSize, scrollToPage, total]);
+  return {
+    active,
+    pages,
+    isHorizontal,
+    isLoop,
+    size,
+    pageSize,
+    scrollRef,
+    autoPlayPaused,
+    motionReduced,
+    goTo,
+    toggleAutoPlay,
+    onLayout,
+    onMomentumScrollEnd,
+    onScrollBeginDrag,
+    onScrollEndDrag
+  };
+}
+//# sourceMappingURL=useSlides.js.map

package/lib/module/organisms/useSlides.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useCallback","useEffect","useMemo","useRef","useState","useReduceMotion","clampIndex","value","total","useSlides","orientation","loop","autoPlay","interval","index","defaultIndex","onIndexChange","motionReduced","isHorizontal","isLoop","uncontrolled","setUncontrolled","active","activeRef","current","autoPlayPaused","setAutoPlayPaused","size","setSize","width","height","pageSize","scrollRef","offsetPageRef","didInitRef","lastPageSizeRef","draggingRef","pages","real","Array","from","length","_","i","clone","scrollToPage","page","animated","offset","scrollTo","x","y","goTo","next","target","resized","onLayout","event","nativeEvent","layout","prev","onMomentumScrollEnd","contentOffset","Math","round","onScrollBeginDrag","onScrollEndDrag","toggleAutoPlay","paused","timer","setInterval","clearInterval"],"sourceRoot":"../../../src","sources":["organisms/useSlides.ts"],"mappings":"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","ignoreList":[]}

package/lib/typescript/atoms/Gradient.d.ts

@@ -0,0 +1,37 @@
+import React from 'react';
+import { type StyleProp, type ViewStyle } from 'react-native';
+export type GradientDirection = 'vertical' | 'horizontal' | 'diagonal' | 'diagonal-reverse';
+export interface GradientProps {
+    /** Paradas del degradado. Uno solo pinta plano; ninguno no pinta nada. */
+    colors: string[];
+    /**
+     * 'vertical' va de arriba a abajo, 'horizontal' de izquierda a derecha,
+     * 'diagonal' de arriba-izquierda a abajo-derecha y 'diagonal-reverse' de
+     * arriba-derecha a abajo-izquierda.
+     * @default 'vertical'
+     */
+    direction?: GradientDirection;
+    /**
+     * Bandas por tramo (un tramo = un par de colores consecutivos). Más bandas
+     * = transición más suave y más vistas en el árbol.
+     * @default 24
+     */
+    steps?: number;
+    /** Contenido por encima del degradado. */
+    children?: React.ReactNode;
+    style?: StyleProp<ViewStyle>;
+    testID?: string;
+}
+/**
+ * Gradient
+ * Degradado lineal sin dependencias: React Native no trae uno en el rango
+ * soportado (Expo SDK 54–57) y `experimental_backgroundImage` no está en toda
+ * esa ventana, así que se compone con bandas.
+ *
+ * Cada tramo pinta el color inicial y encima N bandas del final con opacidad
+ * de 0 a 1. El compositor mezcla alpha linealmente: el resultado es la
+ * interpolación sRGB entre paradas sin parsear el color, y por eso vale
+ * cualquier formato que acepte RN (hex, `rgba()`, nombre).
+ */
+export declare const Gradient: React.MemoExoticComponent<({ colors, direction, steps, children, style, testID }: GradientProps) => React.JSX.Element>;
+//# sourceMappingURL=Gradient.d.ts.map