npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

react-native-modal-wrap

v1.1.0

Published

A <Modal/> component for react-native

Downloads

14

Readme

react-native-modalbox-wrap

compare react-native-modalbox

1.解决安卓原生后退键无效的问题 2.解决阿拉伯下位置偏移的问题

npm npm

A react native component, fork [react-native-modalbox]

Preview

Install

npm install react-native-modalbox-wrap@latest --save

Example

Check index.js in the Example folder.

Properties

| Prop | Default | Type | Description | | :------------ |:---------------:| :---------------:| :-----| | isOpen | false | bool | Open/close the modal, optional, you can use the open/close methods instead | | isDisabled | false | bool | Disable any action on the modal (open, close, swipe) | | backdropPressToClose | true | bool | Close the the modal by pressing on the backdrop | | swipeToClose | true | bool | Set to true to enable the swipe down to close feature | | swipeThreshold | 50 | number | The threshold to reach in pixels to close the modal | | swipeArea | - | number | The height in pixels of the swipeable area, window height by default | | position | center | string | Control the modal position using top or center or bottom | entry | bottom | string | Control the modal entry position top or bottom | backdrop | true | bool | Display a backdrop behind the modal | backdropOpacity | 0.5| number | Opacity of the backdrop | backdropColor | black| string | backgroundColor of the backdrop | backdropContent | null| ReactElement | Add an element in the backdrop (a close button for example) | animationDuration | 400| number | Duration of the animation | easing | Easing.elastic(0.8) | function | Easing function applied to opening modal animation | backButtonClose | false | bool | (Android only) Close modal when receiving back button event | startOpen | false | bool | Allow modal to appear open without animation upon first mount | coverScreen | false | bool | Will use RN Modal component to cover the entire screen wherever the modal is mounted in the component | keyboardTopOffset | ios:22, android:0 | number | This property prevent the modal to cover the ios status bar when the modal is scrolling up because the keyboard is opening

Events

| Prop | Params | Description | | :------------ |:---------------:| :---------------:| | onClosed | - | When the modal is close and the animation is done | | onOpened | - | When the modal is open and the animation is done | | onClosingState | state bool | When the state of the swipe to close feature has changed (usefull to change the content of the modal, display a message for example) |

Methods

These methods are optional, you can use the isOpen property instead

| Prop | Params | Description | | :------------ |:---------------:| :---------------:| | open | - | Open the modal | | close | - | Close the modal |