react-native-universal-list

A wrapper around react-native/SectionList with swipe from right ability on every list item.

Installation

yarn add react-native-universal-list

Usage:

export default class App extends React.Component {
  render() {
    const data = Array.from(new Array(50)).map((x, i) => ({ key: `item ${i}` }));
    // console.log(data);
 
    return (
      <View style={styles.container}>
        <UniversalList
          data={data}
          renderItem={({ item }) => (
            <TouchableWithoutFeedback onPress={() => console.log('item press', item)}>
              <View style={{ padding: 16, backgroundColor: '#ffc' }}>
                <Text>{item.key || 'undefined'}</Text>
              </View>
            </TouchableWithoutFeedback>
          )}
          renderRight={({ item }) => (
            <View style={{ flexDirection: 'row' }}>
              <TouchableWithoutFeedback onPress={() => console.log('view press', item)}>
                <View style={{ width: 80, padding: 16, backgroundColor: '#009' }}>
                  <Text style={{ color: '#fff' }}>View</Text>
                </View>
              </TouchableWithoutFeedback>
              <TouchableWithoutFeedback onPress={() => console.log('delete press', item)}>
                <View style={{ width: 80, padding: 16, backgroundColor: '#f00' }}>
                  <Text style={{ color: '#fff' }}>Delete</Text>
                </View>
              </TouchableWithoutFeedback>
            </View>
          )}
        />
      </View>
    );
  }
}

Example

Try out Expo snack

License MIT