schnabu/maputnik
1
0
Fork 0
mirror of https://github.com/a-nyx/maputnik-with-pmtiles.git synced 2025-01-14 17:33:30 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Switch to chrome color picker

Browse source
This commit is contained in:
Lukas Martinelli 2016-12-17 21:52:27 +01:00
parent db8fc64eb9
commit 3d51095e6e
2 changed files with 7 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
package.json
View file

@ -30,6 +30,7 @@
"react": "^15.4.0", "react": "^15.4.0",
"react-addons-pure-render-mixin": "^15.4.0", "react-addons-pure-render-mixin": "^15.4.0",
"react-collapse": "^2.3.3", "react-collapse": "^2.3.3",
"react-color": "^2.10.0",
"react-dom": "^15.4.0", "react-dom": "^15.4.0",
"react-file-reader-input": "^1.1.0", "react-file-reader-input": "^1.1.0",
"react-height": "^2.1.1", "react-height": "^2.1.1",

14
src/fields/color.jsx
View file

@ -1,13 +1,11 @@
import React from 'react' import React from 'react'
import inputStyle from './input.js' import inputStyle from './input.js'
import ColorPicker from 'react-colorpickr' import { getColor } from 'react-colorpickr/dist/colorfunc'
import 'react-colorpickr/dist/colorpickr.css' import { ChromePicker } from 'react-color';
function formatColor(color) { function formatColor(color) {
if(color.a !== 1) { const rgb = color.rgb
return `rgba(${color.r}, ${color.g}, ${color.b}, ${color.a})` return `rgba(${rgb.r}, ${rgb.g}, ${rgb.b}, ${rgb.a})`
}
return `rgb(${color.r}, ${color.g}, ${color.b})`
} }
/*** Number fields with support for min, max and units and documentation*/ /*** Number fields with support for min, max and units and documentation*/
@ -26,8 +24,8 @@ static propTypes = {
position: 'absolute', position: 'absolute',
left: 200 left: 200
}}> }}>
<ColorPicker <ChromePicker
value={this.props.value} color={getColor(this.props.value)}
onChange={c => this.props.onChange(formatColor(c))} onChange={c => this.props.onChange(formatColor(c))}
/> />
</div> </div>