Security News
Research
Data Theft Repackaged: A Case Study in Malicious Wrapper Packages on npm
The Socket Research Team breaks down a malicious wrapper package that uses obfuscation to harvest credentials and exfiltrate sensitive data.
react-native-swipe-list-view
Advanced tools
<SwipeListView>
is a vertical ListView with rows that swipe open and closed. Handles default native behavior such as closing rows when ListView is scrolled or when other rows are opened.
Also includes <SwipeRow>
if you want to use a swipeable row outside of the <SwipeListView>
🔥🔥 BREAKING CHANGES 🔥🔥
For use with RN 0.60+ please use react-native-swipe-list-view@2.0.0+
RN 0.60 and RNSLV 2.0.0 deprecate the use of ListView entirely, please see example.js
for examples and see the migrating-to-flatlist doc for a migration guide if you aren't already using FlatList
.
The useFlatList
prop is no longer required, as FlatList
is the default ListView used.
Try it out! https://snack.expo.io/@jemise111/react-native-swipe-list-view
npm install --save react-native-swipe-list-view
The application under ./SwipeListExample will produce the above example. To run execute the following:
git clone https://github.com/jemise111/react-native-swipe-list-view.git
cd react-native-swipe-list-view
cd SwipeListExample
yarn
cd ios
pod install
cd ..
react-native run-ios | react-native run-android
Android: If you get the following error
SwipeListExample/android/app/debug.keystore' not found for signing config 'debug'.
:
cd android/app/ && keytool -genkey -v -keystore debug.keystore -storepass android -alias androiddebugkey -keypass android -keyalg RSA -keysize 2048 -validity 10000 // answer the questions cd ../..
import { SwipeListView } from 'react-native-swipe-list-view';
//... note: your data array objects MUST contain a key property
// or you must pass a keyExtractor to the SwipeListView to ensure proper functionality
// see: https://reactnative.dev/docs/flatlist#keyextractor
this.state.listViewData = Array(20)
.fill("")
.map((_, i) => ({ key: `${i}`, text: `item #${i}` }));
//...
render() {
return (
<SwipeListView
data={this.state.listViewData}
renderItem={ (data, rowMap) => (
<View style={styles.rowFront}>
<Text>I am {data.item.text} in a SwipeListView</Text>
</View>
)}
renderHiddenItem={ (data, rowMap) => (
<View style={styles.rowBack}>
<Text>Left</Text>
<Text>Right</Text>
</View>
)}
leftOpenValue={75}
rightOpenValue={-75}
/>
)
}
See example.js
for full usage guide (including using <SwipeRow>
by itself)
If your row is touchable (TouchableOpacity, TouchableHighlight, etc.) with an onPress
function make sure renderItem
returns the Touchable as the topmost element.
GOOD:
renderItem={ data => (
<TouchableHighlight onPress={this.doSomething.bind(this)}>
<View>
<Text>I am {data.item} in a SwipeListView</Text>
</View>
</TouchableHighlight>
)}
BAD:
renderItem={ data => (
<View>
<TouchableHighlight onPress={this.doSomething.bind(this)}>
<Text>I am {data.item} in a SwipeListView</Text>
</TouchableHighlight>
</View>
)}
SwipeListView
now supports FlatList
and SectionList
! (as of v1.0.0)
Please see the migrating-to-flatlist doc for all details.
And see example.js
for a full usage example.
docs/
for help withexamples/
folder for examples onRN Core added a SwipeList component as of v0.27.0 It is actively being worked on and has no documentation yet. So I will continue to maintain this component until a future date.
MIT
FAQs
A ListView with rows that swipe open and closed.
The npm package react-native-swipe-list-view receives a total of 36,267 weekly downloads. As such, react-native-swipe-list-view popularity was classified as popular.
We found that react-native-swipe-list-view demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Research
The Socket Research Team breaks down a malicious wrapper package that uses obfuscation to harvest credentials and exfiltrate sensitive data.
Research
Security News
Attackers used a malicious npm package typosquatting a popular ESLint plugin to steal sensitive data, execute commands, and exploit developer systems.
Security News
The Ultralytics' PyPI Package was compromised four times in one weekend through GitHub Actions cache poisoning and failure to rotate previously compromised API tokens.