# react-native-stories-festo

> Story component for React Native.

Latest version **1.0.4** (published 2023-08-08) · MIT license · 0 weekly downloads

## Install

```sh
npm install react-native-stories-festo
pnpm add react-native-stories-festo
yarn add react-native-stories-festo
bun add react-native-stories-festo
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2023-08-08 |
| First published | 2023-07-19 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 5 |
| Unpacked size | 83 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Illia Denysevych |
| Maintainers | illyay |
| Keywords | react-native, react-native story, react-native festo, story, festo |

## Links

- npm: https://www.npmjs.com/package/react-native-stories-festo
- Repository: https://denysevych@bitbucket.org/denysevych/react-native-stories-festo
- Homepage: https://bitbucket.org/denysevych/react-native-stories-festo#readme
- Issues: https://bitbucket.org/denysevych/react-native-stories-festo/issues
- npm.io page: https://npm.io/package/react-native-stories-festo

## Dependencies (5)

- [lodash](https://npm.io/package/lodash.md) ^4.17.21
- [prop-types](https://npm.io/package/prop-types.md) ^15.6.2
- [react-native-svg](https://npm.io/package/react-native-svg.md) ^12.1.1
- [react-native-modalbox](https://npm.io/package/react-native-modalbox.md) ^2.0.2
- [react-native-swipe-gestures](https://npm.io/package/react-native-swipe-gestures.md) ^1.0.5

## Recent versions

- 1.0.4 (latest) — 2023-08-08
- 1.0.3 — 2023-07-31
- 1.0.2 — 2023-07-19
- 1.0.1 — 2023-07-19
- 1.0.0 — 2023-07-19

## README

# react-native-stories-festo

## Install

#### 1. Step

```javascript
npm install react-native-stories-festo --save
```

or

```javascript
yarn add react-native-stories-festo
```

#### 2. Step

```javascript
cd ios && pod install
```

## Import

```javascript
import FestoStory from 'react-native-stories-festo';
```

### Basic

```javascript
import FestoStory from 'react-native-stories-festo';

const stories = [
  {
    user_id: 1,
    user_image:
      'https://pbs.twimg.com/profile_images/1222140802475773952/61OmyINj.jpg',
    user_name: 'You',
    stories: [
      {
        story_id: 1,
        story_image:
          'https://image.freepik.com/free-vector/universe-mobile-wallpaper-with-planets_79603-600.jpg',
        onPress: () => console.log('story 1 swiped'),
      },
      {
        story_id: 2,
        story_image:
          'https://image.freepik.com/free-vector/mobile-wallpaper-with-fluid-shapes_79603-601.jpg',
        onPress: () => console.log('story 1 swiped'),
      },
    ],
  },
  {
    user_id: 2,
    user_image:
      'https://images.unsplash.com/photo-1511367461989-f85a21fda167?ixid=MnwxMjA3fDB8MHxzZWFyY2h8Mnx8cHJvZmlsZXxlbnwwfHwwfHw%3D&ixlib=rb-1.2.1&w=1000&q=80',
    user_name: 'Test User',
    stories: [
      {
        story_id: 1,
        story_image:
          'https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTjORKvjcbMRGYPR3QIs3MofoWkD4wHzRd_eg&usqp=CAU',
      },
      {
        story_id: 2,
        story_image:
          'https://files.oyebesmartest.com/uploads/preview/vivo-u20-mobile-wallpaper-full-hd-(1)qm6qyz9v60.jpg',
      },
    ],
  },
];

<View style={{paddingBottom: 32}}>
  <FestoStory
    setScrollOffset={setScrollOffset}
    flatListRef={flatListRef}

    data={stories}
    duration={10}
    onStorySeen={handleViewStory}
    getMoreData={loadData}
    onClose={handleReload}

    onCreate={handleCreate}
  />
</View>

```

---
_Source: https://npm.io/package/react-native-stories-festo · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._