cdslibrary 1.2.8 → 1.2.10

package/components/CDSBottomSheet.jsx

@@ -26,16 +26,18 @@ export const CDSBottomSheet = ({
 }) => {
 
   const handleLayout = (event) => {
-    const { width } = event.nativeEvent.layout;
-    setChildHeight(width);  // Guardamos el ancho en el estado
+    const { height: layoutHeight } = event.nativeEvent.layout;
+    setChildHeight(layoutHeight);
   };
 
   const { theme } = useTheme();
-
+  const [childHeight, setChildHeight] = useState(0);
   const [modalVisible, setModalVisible] = useState(isVisible);
   const [modalOpacity] = useState(new Animated.Value(0));
   const [slidePosition] = useState(new Animated.Value(height));
 
+
+
   useEffect(() => {
     const targetValue = isMobile ? height : width; // Valor fuera de pantalla
 
@@ -71,7 +73,6 @@ export const CDSBottomSheet = ({
           }, isMobile ? [styles.container.typeBottomSheet, {
             borderTopLeftRadius: theme.radius.lg,
             borderTopRightRadius: theme.radius.lg,
-
           }] : [styles.container.typeDrawer, {
             borderBottomLeftRadius: theme.radius.lg, borderTopLeftRadius: theme.radius.lg, paddingBottom: theme.space.md,
           },
@@ -83,12 +84,15 @@ export const CDSBottomSheet = ({
             name={"close"}
             size={theme.typography.icon.lg}
             color={theme.text.neutral.primary}
-            onPress={() => setModalVisible(false)}
+            onPress={() => {
+              onFinish();
+              setModalVisible(false);
+            }}
             style={{ position: "absolute", right: theme.space.sm, top: theme.space.sm }}
           />
         )}
-        {title && <Text style={theme.typography.bold.lg}>{title}</Text>}
-        <View style={styles.scrollWrapper}> {/* 👈 Nuevo View para envolver */}
+        <Text style={theme.typography.bold.lg}>{title}</Text>
+        <View style={styles.scrollWrapper}>
           <ScrollView
             style={styles.scrollArea}
             contentContainerStyle={[styles.scrollContent, {
@@ -104,28 +108,29 @@ export const CDSBottomSheet = ({
             )}
             {customSlot && <View style={styles.customSlot}>{customSlot}</View>}
           </ScrollView>
-
-          {/* El Gradiente */}
           <LinearGradient
-            colors={['transparent', theme.surface.neutral.primary]} // Ajusta los colores
+            colors={['transparent', theme.surface.neutral.primary]}
             style={styles.fadeGradient}
-            pointerEvents="none" // Importante para que no bloquee el click en los botones debajo
+            pointerEvents="none"
           />
         </View>
         {type !== "informative" && (
           <View style={isMobile ? styles.actionsContainer.typeBottomSheet : styles.actionsContainer.typeDrawer}>
             <CDSButton
               label={primaryButtonLabel}
-              onPress={
-                onFinish
-                  ? () => setModalVisible(!modalVisible)
-                  : primaryButtonOnPress
+              onPress={() => {
+                primaryButtonOnPress(),
+                setModalVisible(!modalVisible)
+              }
               }
             />
             <CDSButton
               label={secondaryButtonLabel}
               type="ghost"
-              onPress={() => setModalVisible(!modalVisible)}
+              onPress={() => {
+                onFinish();
+                setModalVisible(false);
+              }}
             />
           </View>
         )}
@@ -182,10 +187,10 @@ const styles = StyleSheet.create({
     width: '100%',
   },
   scrollArea: {
-    flexShrink: 1, 
+    flexShrink: 1,
     flexGrow: 1,
-    width: '100%',  
-    paddingBottom: 20, 
+    width: '100%',
+    paddingBottom: 20,
   },
 
   scrollContent: {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "cdslibrary",
   "license": "0BSD",
-  "version": "1.2.8",
+  "version": "1.2.10",
   "main": "index.js",
   "author": "Nat Viramontes",
   "description": "A library of components for the CDS project",