]> git.wincent.com - hextrapolate.git/blob - src/DynamicField.react.js
f24c60524bef9691fc68cab5b3bd0a5bb9dc14d2
[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 import React from 'react';
9 import {
10   default as Field,
11   ValuePropType,
12 } from './Field.react';
13
14 export default class DynamicField extends React.Component {
15   static propTypes = {
16     initialBase: React.PropTypes.number,
17     onValueChange: React.PropTypes.func.required,
18     value: ValuePropType,
19   };
20
21   constructor(props) {
22     super(props);
23     this.state = {base: props.initialBase};
24   }
25
26   _onChange = event => {
27     const base = parseInt(event.target.value, 10);
28     this.setState({base});
29   }
30
31   _renderOptions() {
32     const options = [];
33     for (let i = 2; i <= 36; i++) {
34       options.push(
35         <option key={i} value={i}>Base {i}</option>
36       );
37     }
38     return options;
39   }
40
41   render() {
42     return (
43       <label className="hextrapolate-row">
44         <span className="hextrapolate-base">
45           <select
46             onChange={this._onChange}
47             value={this.state.base}>
48             {this._renderOptions()}
49           </select>
50         </span>
51         <Field
52           base={this.state.base}
53           onValueChange={this.props.onValueChange}
54           value={this.props.value}
55         />
56       </label>
57     );
58   }
59 }