Apeman-react-range NPM

apeman-react-range

apeman react package for range input component.

Installation

$ npm install apeman-react-range --save

Demo

Live demo is hosted on GitHub Pages.

Usage

'use strict'

import React from 'react'
import {ApRange, ApRangeStyle} from 'apeman-react-range'

const html = (
  <html>
  <head>
    <ApRangeStyle></ApRangeStyle>
  </head>
  <body>
  <ApRange min={ 0 } max={ 100 }
           onChange={ (from, to)=>{console.log(from, to)} } />
  </body>
  </html>
)

Components

ApRangeHandle

Props

Name	Type
onMove	func	Handle for move
shouldMove	func
x	number
minX	number
maxX	number

ApRangeLabel

Props

Name	Type	Default	Description
value	number	null

ApRangeStyle

Props

Name	Type	Default
style	object	{}
handleSize	number	24
barHeight	number	4
highlightColor	string	'#38E'

ApRange

Props

Name	Type	Default
from	number	25	Range from value
to	number	75	Range to value
min	number	0	Min value for range from
max	number	100	Max value for range to
step	number	0.01	Step for value
onChange	func		Handler for change
barOnly	bool	false