38 lines
999 B
TypeScript
38 lines
999 B
TypeScript
import * as React from "react";
|
|
import { Row, Col } from "../ui/index";
|
|
import { ToggleButton } from "./toggle_button";
|
|
import { t } from "../i18next_wrapper";
|
|
|
|
export interface KeyValRowProps {
|
|
label: string;
|
|
labelPlaceholder: string;
|
|
value: string;
|
|
valuePlaceholder: string;
|
|
onClick(): void;
|
|
disabled: boolean;
|
|
toggleValue?: number | undefined;
|
|
title?: string;
|
|
}
|
|
|
|
/** A row containing a label, value, and toggle button. Useful for maintaining
|
|
* lists of things (peripherals, feeds, tools etc). */
|
|
export function KeyValShowRow(p: KeyValRowProps) {
|
|
const { label, value, toggleValue, disabled, onClick, title } = p;
|
|
return <Row>
|
|
<Col xs={4}>
|
|
<label>{label}</label>
|
|
</Col>
|
|
<Col xs={6}>
|
|
<p>{value}</p>
|
|
</Col>
|
|
<Col xs={2}>
|
|
<ToggleButton
|
|
toggleValue={toggleValue}
|
|
toggleAction={onClick}
|
|
title={title}
|
|
customText={{ textFalse: t("off"), textTrue: t("on") }}
|
|
disabled={disabled} />
|
|
</Col>
|
|
</Row>;
|
|
}
|