# react-draggable-splitscreen

> A React component for displaying overlapping elements with a draggable splitscreen-like effect.

Latest version **3.0.5** (published 2020-08-14) · ISC license · 0 weekly downloads

## Install

```sh
npm install react-draggable-splitscreen
pnpm add react-draggable-splitscreen
yarn add react-draggable-splitscreen
bun add react-draggable-splitscreen
```

## 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 | 3.0.5 |
| Published | 2020-08-14 |
| First published | 2017-12-28 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 4 |
| Unpacked size | 14.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | John Watkins |
| Maintainers | johnwatkins0 |

## Links

- npm: https://www.npmjs.com/package/react-draggable-splitscreen
- Repository: https://github.com/johnwatkins0/react-draggable-splitscreen
- Homepage: https://github.com/johnwatkins0/react-draggable-splitscreen#readme
- Issues: https://github.com/johnwatkins0/react-draggable-splitscreen/issues
- npm.io page: https://npm.io/package/react-draggable-splitscreen

## Dependencies (4)

- [react](https://npm.io/package/react.md) ^16.13.1
- [react-dom](https://npm.io/package/react-dom.md) ^16.13.1
- [react-draggable](https://npm.io/package/react-draggable.md) ^4.4.3
- [styled-components](https://npm.io/package/styled-components.md) ^5.1.1

## Recent versions

- 3.0.5 (latest) — 2020-08-14
- 3.0.4 — 2020-08-14
- 3.0.2 — 2019-01-05
- 3.0.1 — 2019-01-05
- 2.0.1 — 2018-04-29
- 1.0.5 — 2017-12-28

## README

# react-draggable-splitscreen

A React component for displaying overlapping elements with a draggable splitscreen-like effect. See examples [here](https://johnwatkins0.github.io/react-draggable-splitscreen/).

## Install

```
npm install react-draggable-splitscreen
```

## Usage

The component takes two props, `leftSide` and `rightSide`, both of which must be rendered React elements/components.

```Javascript
import * as React from 'react';
import Splitscreen from 'react-draggable-splitscreen';

const MyLeftSide = () => <img src="some/image" />;
const MyRightSide = () => <img src="some/other/image" />;

const MyElement = () => <Splitscreen leftSide={<MyLeftSide />} rightSide={<MyRightSide />} />
```

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