Saltar al contenido principal

BottomModal

Un modal tipo alerta que puede contener cualquier componente.

Docusaurus logo

Uso​

import React from "react";
import { View } from "react-native";
import { BottomModal, Theme, Text } from "@ga-innoval/react-native-ui";

export function Component() {
  const [isBottomModalVisible, setIsBottomModalVisible] = useState(true);

  return (
    <View style={{ flex: 1 }}>
      <BottomModal
        visible={isBottomModalVisible}
        onDismiss={() => setIsBottomModalVisible(false)}
      >
        <Title style={{ marginBottom: 10 }}>Titulo del modal</Title>
        <Text style={{ marginBottom: 10 }}>
          Este es una modal que puede contener cualquier componente!
        </Text>
        <DefaultTextInput
          placeholder="Ingresa un algun texto aqui..."
          style={styles.textInput}
        />
      </BottomModal>
    </View>
  );
}

Props​

visible​

Type: boolean

Esta propiedad determina si el modal se muestra o no.

onDismiss​

Type: ()=> void

Permite pasar una función que se llamará una vez que se haya descartado el modal.

children​

Type: ReactNode

Componente hijo.

Este componente incluye todas las propiedades del componente Modal.