Skip to content
Snippets Groups Projects
Commit 1c5287e1 authored by Alexander Rose's avatar Alexander Rose
Browse files

text param component

parent caf9557a
Branches
Tags
No related merge requests found
/**
* Copyright (c) 2018 mol* contributors, licensed under MIT, See LICENSE file for more info.
*
* @author Alexander Rose <alexander.rose@weirdbyte.de>
*/
import * as React from 'react'
import { TextParam } from 'mol-view/parameter';
export interface TextParamComponentProps {
param: TextParam
value: string
onChange(v: string): void
}
export interface TextParamComponentState {
value: string
}
export class TextParamComponent extends React.Component<TextParamComponentProps, TextParamComponentState> {
state = {
value: this.props.value
}
onChange(value: string) {
this.setState({ value })
this.props.onChange(value)
}
render() {
return <div>
<span>{this.props.param.label} </span>
<input type='text'
value={this.state.value}
onChange={e => this.onChange(e.currentTarget.value)}
>
</input>
</div>;
}
}
\ No newline at end of file
......@@ -11,6 +11,7 @@ import { NumberParamComponent } from './parameter/number';
import { RangeParamComponent } from './parameter/range';
import { SelectParamComponent } from './parameter/select';
import { MultiSelectParamComponent } from './parameter/multi-select';
import { TextParamComponent } from './parameter/text';
interface ParametersProps<P extends Params> {
params: P
......@@ -32,6 +33,8 @@ function getParamComponent<P extends Param>(p: Param, value: P['defaultValue'],
return <SelectParamComponent param={p} value={value} onChange={onChange} />
case 'multi-select':
return <MultiSelectParamComponent param={p} value={value} onChange={onChange} />
case 'text':
return <TextParamComponent param={p} value={value} onChange={onChange} />
}
return ''
}
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment