]> git.wincent.com - hextrapolate.git/blob - src/DynamicField.react.js
1a0595de58972067609a50d5f702deaa47201955
[hextrapolate.git] / src / DynamicField.react.js
1 /**
2  * Copyright 2003-present Greg Hurrell. All rights reserved.
3  * Licensed under the terms of the MIT license.
4  *
5  * @flow
6  */
7
8 'use strict';
9
10 import React from 'react';
11 import {
12   default as Field,
13   ValuePropType,
14 } from './Field.react';
15
16 export default class DynamicField extends React.Component {
17   static propTypes = {
18     initialBase: React.PropTypes.number,
19     onValueChange: React.PropTypes.func.required,
20     value: ValuePropType,
21   };
22
23   constructor(props) {
24     super(props);
25     this.state = {base: props.initialBase};
26   }
27
28   _onChange = event => {
29     const base = parseInt(event.target.value, 10);
30     this.setState({base});
31   }
32
33   _renderOptions() {
34     const options = [];
35     for (let i = 2; i <= 36; i++) {
36       options.push(
37         <option key={i} value={i}>Base {i}</option>
38       );
39     }
40     return options;
41   }
42
43   render() {
44     return (
45       <label className="hextrapolate-row">
46         <span className="hextrapolate-base">
47           <select
48             onChange={this._onChange}
49             value={this.state.base}>
50             {this._renderOptions()}
51           </select>
52         </span>
53         <Field
54           base={this.state.base}
55           onValueChange={this.props.onValueChange}
56           value={this.props.value}
57         />
58       </label>
59     );
60   }
61 }