@tamkeentech/react-native-bottom-sheet v1.0.1

@TamkeenTech/react-native-bottom-sheet

A simple react native package for creating and using different kind of modals

Demo

Installation

1. Install react-native-reanimatad 2, for installation instructions please follow the below link:

   expo or react-native.

2. Install react-native-gesture-handler, for installation instructions please follow the below link:

   expo or react-native.

3. Finally, run the command:

   npm install @tamkeentech/react-native-bottom-sheet

Usage and Example

Basic Usage

1- Sheet

import React from 'react';
import { Sheet } from '@tamkeentech/react-native-bottom-sheet';
import { Block, Label, Paragraph } from '../placeholder';

export const DemoSheet = ({ show, onClose }) => {
  return (
    <Sheet
      contentContainerStyle={{ paddingHorizontal: 15 }}
      show={show}
      onClose={onClose}
    >
      <Label />
      <Paragraph />
      <Block />
    </Sheet>
  );
};

2- Sticky Sheet

import React from 'react';
import { StickySheet } from 'react-native-bottom-sheet';
import { Block, Label, Paragraph } from '../placeholder';

export const DemoSheet = () => {
  return (
    <StickySheet contentContainerStyle={{ paddingHorizontal: 15 }}>
      {/* Child 1 */}
      <View>
        <Label />
        <Paragraph />
      </View>
      {/* Child 2 */}
      <View>
        <Label />
        <Paragraph num={1} />
        <Block />
      </View>
      {/* Child 3 */}
      <View>
        <Label />
        <Paragraph />
        <Block />
      </View>
    </StickySheet>
  );
};

API

Contributing

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

License

MIT ©

Author

ezziddin