44 lines
1.5 KiB
TypeScript
44 lines
1.5 KiB
TypeScript
import React, { Fragment } from 'react';
|
|
|
|
import { BaseDataEntryProps } from './data-entry';
|
|
import { DataTitleCopyable } from './data-title';
|
|
|
|
interface CheckboxDataEntryProps extends BaseDataEntryProps {
|
|
value: boolean;
|
|
}
|
|
|
|
const CheckboxDataEntry: React.FunctionComponent<CheckboxDataEntryProps> = (props) => {
|
|
return (
|
|
<Fragment>
|
|
<DataTitleCopyable
|
|
slug={props.slug}
|
|
title={props.title}
|
|
tooltip={props.tooltip}
|
|
disabled={props.disabled || props.value == undefined}
|
|
copy={props.copy}
|
|
/>
|
|
<div className="form-check">
|
|
<label
|
|
htmlFor={props.slug}
|
|
className="form-check-label">
|
|
<input className="form-check-input" type="checkbox"
|
|
id={props.slug}
|
|
name={props.slug}
|
|
checked={!!props.value}
|
|
disabled={props.mode === 'view' || props.disabled}
|
|
onChange={e => props.onChange(props.slug, e.target.checked)}
|
|
/>
|
|
{
|
|
props.value?
|
|
<span><strong>Yes</strong>/No</span>
|
|
:
|
|
<span>Yes/<strong>No</strong></span>
|
|
}
|
|
</label>
|
|
</div>
|
|
</Fragment>
|
|
);
|
|
};
|
|
|
|
export default CheckboxDataEntry;
|