apeman-react-draggable
apeman react package for draggable component.
Installation
$ npm install apeman-react-draggable --save
Demo
Live demo is hosted on GitHub Pages.
Usage
'use strict' import React from 'react'import ApDraggable ApDraggableStyle from 'apeman-react-draggable' const ExampleComponent = React
Components
ApDraggableStyle
Props
Name | Type | Default | Description |
---|---|---|---|
style | object | {} |
ApDraggable
Props
Name | Type | Default | Description |
---|---|---|---|
onStart | func | ||
onMove | func | ||
onStop | func | ||
shouldMove | func | function() { |
return true } | | | | direction | enum | 'ALL' | | Move direction | | x | number | | | | | minX | number | Number.MIN_SAFE_INTEGER || (-9007199254740991) | | | | maxX | number | Number.MAX_SAFE_INTEGER || (9007199254740991) | | | | y | number | | | | | minY | number | Number.MIN_SAFE_INTEGER || (-9007199254740991) | | | | maxY | number | Number.MAX_SAFE_INTEGER || (9007199254740991) | | |
Props
Name | Type | Default | Description |
---|---|---|---|
onStart | function | Callback when drag started. | |
onMove | function | Callback when drag moved. | |
onStop | function | Callback when drag stopped. | |
shouldMove | function | Called when drag moved. Returns false to cancel moving. | |
direction | string | Move direction. | |
x | number | X position. | |
minX | number | MIN_SAFE_INTEGER | Min x position. |
maxX | number | MAX_SAFE_INTEGER | Max x position. |
y | number | Y potion. | |
minY | number | MIN_SAFE_INTEGER | Min y position. |
maxY | number | MAX_SAFE_INTEGER | Max y position. |
Directions
License
This software is released under the MIT License.