40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
import * as React from "react";
|
|
import { Row, Col } from "../ui/index";
|
|
import { KeyValRowProps } from "./key_val_show_row";
|
|
import { t } from "../i18next_wrapper";
|
|
|
|
interface Props extends KeyValRowProps {
|
|
onLabelChange(e: React.ChangeEvent<HTMLInputElement>): void;
|
|
onValueChange(e: React.ChangeEvent<HTMLInputElement>): void;
|
|
valueType: "number" | "string";
|
|
}
|
|
|
|
/** A row containing two textboxes and a delete button. Useful for maintaining
|
|
* lists of things (peripherals, feeds, tools etc). */
|
|
export function KeyValEditRow(p: Props) {
|
|
return <Row>
|
|
<Col xs={6}>
|
|
<input type="text"
|
|
name="label"
|
|
placeholder={p.labelPlaceholder}
|
|
value={p.label}
|
|
onChange={p.onLabelChange} />
|
|
</Col>
|
|
<Col xs={4}>
|
|
<input type={p.valueType}
|
|
name="value"
|
|
value={p.value}
|
|
placeholder={p.valuePlaceholder}
|
|
onChange={p.onValueChange} />
|
|
</Col>
|
|
<Col xs={2}>
|
|
<button
|
|
className="red fb-button del-button"
|
|
title={t("Delete")}
|
|
onClick={p.onClick}>
|
|
<i className="fa fa-times" />
|
|
</button>
|
|
</Col>
|
|
</Row>;
|
|
}
|