|
|
|
@ -63,34 +63,41 @@ class KeyValueListInputItem extends Component {
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className={styles.itemContainer}>
|
|
|
|
|
<TextInput
|
|
|
|
|
className={styles.keyInput}
|
|
|
|
|
name="key"
|
|
|
|
|
value={keyValue}
|
|
|
|
|
placeholder={keyPlaceholder}
|
|
|
|
|
onChange={this.onKeyChange}
|
|
|
|
|
onFocus={this.onFocus}
|
|
|
|
|
onBlur={this.onBlur}
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
<TextInput
|
|
|
|
|
className={styles.valueInput}
|
|
|
|
|
name="value"
|
|
|
|
|
value={value}
|
|
|
|
|
placeholder={valuePlaceholder}
|
|
|
|
|
onChange={this.onValueChange}
|
|
|
|
|
onFocus={this.onFocus}
|
|
|
|
|
onBlur={this.onBlur}
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
|
|
{
|
|
|
|
|
!isNew &&
|
|
|
|
|
<IconButton
|
|
|
|
|
name={icons.REMOVE}
|
|
|
|
|
tabIndex={-1}
|
|
|
|
|
onPress={this.onRemovePress}
|
|
|
|
|
/>
|
|
|
|
|
}
|
|
|
|
|
<div className={styles.inputWrapper}>
|
|
|
|
|
<TextInput
|
|
|
|
|
className={styles.keyInput}
|
|
|
|
|
name="key"
|
|
|
|
|
value={keyValue}
|
|
|
|
|
placeholder={keyPlaceholder}
|
|
|
|
|
onChange={this.onKeyChange}
|
|
|
|
|
onFocus={this.onFocus}
|
|
|
|
|
onBlur={this.onBlur}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div className={styles.inputWrapper}>
|
|
|
|
|
<TextInput
|
|
|
|
|
className={styles.valueInput}
|
|
|
|
|
name="value"
|
|
|
|
|
value={value}
|
|
|
|
|
placeholder={valuePlaceholder}
|
|
|
|
|
onChange={this.onValueChange}
|
|
|
|
|
onFocus={this.onFocus}
|
|
|
|
|
onBlur={this.onBlur}
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div className={styles.buttonWrapper}>
|
|
|
|
|
{
|
|
|
|
|
isNew ?
|
|
|
|
|
null :
|
|
|
|
|
<IconButton
|
|
|
|
|
name={icons.REMOVE}
|
|
|
|
|
tabIndex={-1}
|
|
|
|
|
onPress={this.onRemovePress}
|
|
|
|
|
/>
|
|
|
|
|
}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|