react-native-knot-promo

react-native-knot-promo

Installation

npm install react-native-knot-promo

Usage

import { FullScreenModal, Popup } from "react-native-knot-promo";

// ...

<FullScreenModal
  onClose={() => setShowModal(false)}
  onDone={() => setShowModal(false)}
  isVisible={showModal}
  cardImage={require('./assets/card_desktop.png')}
  primaryColor={'#482A90'}
  textColor={'#ffffff'}
/>
<Popup
  onGetStarted={() => setShowGetStartedModal(false)}
  isVisible={showGetStartedModal}
  cardImage={require('./assets/card_desktop.png')}
  primaryColor={'#21C577'}
  textColor={'#FFFFFF'}
/>

Options

FullScreenModal

| name | type | required | default | description | |--------------|---|----------|---|---| | onClose | function | Yes | - | - | Called when user close modal | | onDone | function | Yes | - | - | Called when user start the flow | | isVisible | boolean | Yes | - | - | Determines whether your modal is visible | | cardImage | ImageURISource | Yes | - | - | Card image url | | primaryColor | string | Yes | - | - | Button background color | | textColor | string | Yes | - | - | Button text color |

Popup

| name | type | required | default | description | |---|----------------|---|---|---| | onGetStarted | function | Yes | - | - | Called when user start the flow | | isVisible | boolean | Yes | - | - | Determines whether your modal is visible | | cardImage | ImageURISource | Yes | - | - | Card image url | | primaryColor | string | Yes | - | - | Button background color | | textColor | string | Yes | - | - | Button text color |

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT

Made with create-react-native-library