# mobile-photo-slider

> Mobile photo slider for React Native

Latest version **1.3.4** (published 2022-02-26) · 0 weekly downloads

## Install

```sh
npm install mobile-photo-slider
pnpm add mobile-photo-slider
yarn add mobile-photo-slider
bun add mobile-photo-slider
```

## Health

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

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.3.4 |
| Published | 2022-02-26 |
| First published | 2021-01-26 |
| Weekly downloads | 0 |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 4 |
| Unpacked size | 95 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | joaovitor32 |

## Links

- npm: https://www.npmjs.com/package/mobile-photo-slider
- npm.io page: https://npm.io/package/mobile-photo-slider

## Dependencies (4)

- [react](https://npm.io/package/react.md) 16.13.1
- [react-native](https://npm.io/package/react-native.md) ^0.67.2
- [react-scripts](https://npm.io/package/react-scripts.md) 3.0.1
- [eslint-plugin-import-helpers](https://npm.io/package/eslint-plugin-import-helpers.md) ^1.1.0

## Recent versions

- 1.3.4 (latest) — 2022-02-26
- 1.3.3 — 2022-02-26
- 1.3.2 — 2022-02-26
- 1.3.1 — 2022-02-08
- 1.3.0 — 2022-02-08
- 1.2.0 — 2022-02-08
- 1.0.1 — 2021-12-02
- 1.0.0 — 2021-12-02
- 0.1.0 — 2021-07-22
- 0.0.9 — 2021-01-26
- 0.0.8 — 2021-01-26
- 0.0.7 — 2021-01-26
- 0.0.6 — 2021-01-26
- 0.0.5 — 2021-01-26

## README

# Mobile photo slider - React Native
Mobile photo slider for React Native

## Installation

```bash
yarn add mobile-photo-slider
```

## Usage

```tsx
import React, { useState } from "react";
import { Text, TouchableOpacity } from "react-native";

import data from "./data/data";
import Carousel from "mobile-photo-slider";

interface ComponentsProps {
  photos: string[];
}

const Component: React.FC<ComponentsProps> = () => {
  const [open, setOpen] = useState<boolean>(true);

  return (
    <>
      {open && (
        <Carousel
          photos={data}
          primaryColor={"white"}
          secondaryColor={"blue"}
          open={open}
          setOpen={setOpen}
        />
      )}

      {!open && (
        <TouchableOpacity onPress={() => setOpen(true)}>
          <Text>Open</Text>
        </TouchableOpacity>
      )}
    </>
  );
};

export default Component;
```

## Properties

| Prop                      | Description                                                                                                                                                                                                                                                                                                             | Default        |
| ------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------- |
| **`primaryColor`**               | string related to color | none   
| **`secondaryColor`**               | string related to color | none
| **`open`**               | boolean associated with modal toogle | none   
| **`photos`**               | Array of string containing url's | none
| **`setOpen`**               | Function to open and close modal  | none


## Demo

![Mobile Photo Slider](demo/git.gif)

---
_Source: https://npm.io/package/mobile-photo-slider · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._