mirror of
https://github.com/a-nyx/maputnik-with-pmtiles.git
synced 2024-11-10 10:57:45 +01:00
Add color field
This commit is contained in:
parent
957d805ab8
commit
4d1609a826
4 changed files with 31 additions and 2 deletions
21
src/fields/color.jsx
Normal file
21
src/fields/color.jsx
Normal file
|
@ -0,0 +1,21 @@
|
||||||
|
import React from 'react'
|
||||||
|
import { Select, Input } from 'rebass'
|
||||||
|
|
||||||
|
/*** Number fields with support for min, max and units and documentation*/
|
||||||
|
class ColorField extends React.Component {
|
||||||
|
static propTypes = {
|
||||||
|
name: React.PropTypes.string.isRequired,
|
||||||
|
value: React.PropTypes.number,
|
||||||
|
default: React.PropTypes.number,
|
||||||
|
doc: React.PropTypes.string,
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return <Input
|
||||||
|
label={this.props.name}
|
||||||
|
name={this.props.name}
|
||||||
|
/>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ColorField
|
|
@ -4,7 +4,7 @@ import { Select, Input } from 'rebass'
|
||||||
class EnumField extends React.Component {
|
class EnumField extends React.Component {
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
name: React.PropTypes.string.isRequired,
|
name: React.PropTypes.string.isRequired,
|
||||||
value: React.PropTypes.string.isRequired,
|
value: React.PropTypes.string,
|
||||||
allowedValues: React.PropTypes.array.isRequired,
|
allowedValues: React.PropTypes.array.isRequired,
|
||||||
doc: React.PropTypes.string,
|
doc: React.PropTypes.string,
|
||||||
}
|
}
|
||||||
|
|
|
@ -5,7 +5,7 @@ import { Select, Input } from 'rebass'
|
||||||
class NumberField extends React.Component {
|
class NumberField extends React.Component {
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
name: React.PropTypes.string.isRequired,
|
name: React.PropTypes.string.isRequired,
|
||||||
value: React.PropTypes.number.isRequired,
|
value: React.PropTypes.number,
|
||||||
default: React.PropTypes.number,
|
default: React.PropTypes.number,
|
||||||
unit: React.PropTypes.string,
|
unit: React.PropTypes.string,
|
||||||
min: React.PropTypes.number,
|
min: React.PropTypes.number,
|
||||||
|
|
|
@ -3,6 +3,7 @@ import Immutable from 'immutable'
|
||||||
import GlSpec from 'mapbox-gl-style-spec/reference/latest.min.js'
|
import GlSpec from 'mapbox-gl-style-spec/reference/latest.min.js'
|
||||||
import NumberField from './number'
|
import NumberField from './number'
|
||||||
import EnumField from './enum'
|
import EnumField from './enum'
|
||||||
|
import ColorField from './color'
|
||||||
|
|
||||||
class SpecField extends React.Component {
|
class SpecField extends React.Component {
|
||||||
static propTypes = {
|
static propTypes = {
|
||||||
|
@ -36,6 +37,13 @@ class SpecField extends React.Component {
|
||||||
doc={this.props.fieldSpec.doc}
|
doc={this.props.fieldSpec.doc}
|
||||||
/>
|
/>
|
||||||
)
|
)
|
||||||
|
case 'color': return (
|
||||||
|
<ColorField
|
||||||
|
value={this.props.value}
|
||||||
|
name={this.props.fieldName}
|
||||||
|
doc={this.props.fieldSpec.doc}
|
||||||
|
/>
|
||||||
|
)
|
||||||
default: return null
|
default: return null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue