60 lines
1.6 KiB
TypeScript
60 lines
1.6 KiB
TypeScript
import React from 'react';
|
|
|
|
interface DeliveryOptionsProps {
|
|
pickUpAvailable: boolean;
|
|
inPlaceUseAvailable: boolean;
|
|
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
}
|
|
|
|
const DeliveryOptions: React.FC<DeliveryOptionsProps> = ({
|
|
pickUpAvailable,
|
|
inPlaceUseAvailable,
|
|
onChange
|
|
}) => {
|
|
return (
|
|
<div className="card mb-4">
|
|
<div className="card-body">
|
|
<label className="form-label">
|
|
How will renters receive this item?
|
|
</label>
|
|
<div className="form-check">
|
|
<input
|
|
type="checkbox"
|
|
className="form-check-input"
|
|
id="pickUpAvailable"
|
|
name="pickUpAvailable"
|
|
checked={pickUpAvailable}
|
|
onChange={onChange}
|
|
/>
|
|
<label className="form-check-label" htmlFor="pickUpAvailable">
|
|
Pick-Up/Drop-off
|
|
<div className="small text-muted">
|
|
You and the renter coordinate pick-up and drop-off
|
|
</div>
|
|
</label>
|
|
</div>
|
|
<div className="form-check">
|
|
<input
|
|
type="checkbox"
|
|
className="form-check-input"
|
|
id="inPlaceUseAvailable"
|
|
name="inPlaceUseAvailable"
|
|
checked={inPlaceUseAvailable}
|
|
onChange={onChange}
|
|
/>
|
|
<label
|
|
className="form-check-label"
|
|
htmlFor="inPlaceUseAvailable"
|
|
>
|
|
In-Place Use
|
|
<div className="small text-muted">
|
|
They use at your location
|
|
</div>
|
|
</label>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default DeliveryOptions; |