Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

rc-color-picker

Package Overview
Dependencies
Maintainers
3
Versions
17
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

rc-color-picker

color-picker ui component for react

  • 1.1.2
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
15K
decreased by-14.35%
Maintainers
3
Weekly downloads
 
Created
Source

rc-color-picker


React Color Picker

npm version npm download npm dependency Build Status

Browser Support

ChromeEdgeFirefoxIEOperaSafari
Chrome 31.0+ ✔Edge 12.0+ ✔Firefox 31.0+ ✔IE 10+ ✔Opera 30.0+ ✔Safari 7.0+ ✔

Screenshots

<img src=https://cloud.githubusercontent.com/assets/1292082/8275606/8608e8f8-18db-11e5-8d10-703253db2a4f.png width=238 />

Development

npm install
npm start

Example

online example: http://react-component.github.io/color-picker/

Feature

  • support color mode RGB HSB HSL

install

rc-color-picker

Usage

var ColorPicker = require('rc-color-picker');
var React = require('react');
var ReactDOM = require('react-dom');
ReactDOM.render(<ColorPicker />, container);

API

ColorPicker.props

nametypedefaultdescription
animationStringindex.css support 'slide-up'
transitionNameStringcss class for animation
getCalendarContainerFunction():Elementfunction(){return document.body;}dom node where picker to be rendered into
alignObject: alignConfig of dom-alignpopup 's align config
alphaNumber100opacity of the color
defaultAlphaNumber100opacity of the color
colorString#ff0000color board current background color
defaultColorString#ff0000color board current background color
onChangeFunctionnoopwhen select color
onOpenFunctionnoopwhen color picker popup open
onCloseFunctionnoopwhen color picker popup close
placementStringtopLeftone of ['topLeft', 'topRight', 'bottomLeft', 'bottomRight']
modeString'RGB'color mode, support mode 'RGB', 'HSB' or 'HSL'
childrenNode<span className='react-colorpicker-trigger'></span>additional trigger appended to picker

ColorPicker.Panel.props

nametypedefaultdescription
alphaNumber100opacity of the color
defaultAlphaNumber100opacity of the color
colorString#ff0000color board current background color
defaultColorString#ff0000color board current background color
styleObject{}root node CSS style
onChangeFunctionwhen select color trigger
onFocusFunctionwhen picker focus trigger
onBlurFunctionwhen picker loose focus
modeString'RGB'color mode, support mode 'RGB', 'HSB' or 'HSL'

License

rc-color-picker is released under the MIT license.

Keywords

FAQs

Package last updated on 17 Dec 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc