mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Remove duplicate fixture components
This commit is contained in:
committed by
Nathan Hunzaker
parent
5deb9826ca
commit
52a1ee492a
@@ -1,28 +0,0 @@
|
||||
const React = window.React;
|
||||
|
||||
const RangeInputs = React.createClass({
|
||||
getInitialState() {
|
||||
return { value: 0.5 };
|
||||
},
|
||||
onChange(event) {
|
||||
this.setState({ value: event.target.value });
|
||||
},
|
||||
render() {
|
||||
return (
|
||||
<form>
|
||||
<fieldset>
|
||||
<legend>Controlled</legend>
|
||||
<input type="range" value={this.state.value} onChange={this.onChange.bind(this)} />
|
||||
<span className="hint">Value: {this.state.value}</span>
|
||||
</fieldset>
|
||||
|
||||
<fieldset>
|
||||
<legend>Uncontrolled</legend>
|
||||
<input type="range" defaultValue={0.5} />
|
||||
</fieldset>
|
||||
</form>
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
export default RangeInputs;
|
||||
@@ -1,67 +0,0 @@
|
||||
const React = window.React;
|
||||
import '../styles/TextInputs.css';
|
||||
|
||||
const TextInputFixtures = React.createClass({
|
||||
getInitialState() {
|
||||
return {
|
||||
color: '#ffaaee',
|
||||
};
|
||||
},
|
||||
|
||||
renderControlled(type) {
|
||||
let id = `controlled_${type}`;
|
||||
|
||||
let onChange = e => {
|
||||
let value = e.target.value;
|
||||
if (type === 'number') {
|
||||
value = value === '' ? '' : parseFloat(value, 10) || 0
|
||||
}
|
||||
this.setState({
|
||||
[type] : value,
|
||||
});
|
||||
};
|
||||
|
||||
let state = this.state[type] || '';
|
||||
|
||||
return (
|
||||
<div key={type} className="field">
|
||||
<label htmlFor={id}>{type}</label>
|
||||
<input id={id} type={type} value={state} onChange={onChange} />
|
||||
→ {JSON.stringify(state)}
|
||||
</div>
|
||||
);
|
||||
},
|
||||
|
||||
renderUncontrolled(type) {
|
||||
let id = `uncontrolled_${type}`;
|
||||
return (
|
||||
<div key={type} className="field">
|
||||
<label htmlFor={id}>{type}</label>
|
||||
<input id={id} type={type} />
|
||||
</div>
|
||||
);
|
||||
},
|
||||
|
||||
render() {
|
||||
// https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input
|
||||
let types = [
|
||||
'text', 'email', 'number', 'url', 'tel',
|
||||
'color', 'date', 'datetime-local',
|
||||
'time', 'month', 'week', 'range', 'password',
|
||||
];
|
||||
return (
|
||||
<form onSubmit={event => event.preventDefault()}>
|
||||
<fieldset>
|
||||
<legend>Controlled</legend>
|
||||
{types.map(this.renderControlled)}
|
||||
</fieldset>
|
||||
<fieldset>
|
||||
<legend>Uncontrolled</legend>
|
||||
{types.map(this.renderUncontrolled)}
|
||||
</fieldset>
|
||||
</form>
|
||||
);
|
||||
},
|
||||
});
|
||||
|
||||
module.exports = TextInputFixtures;
|
||||
Reference in New Issue
Block a user