@kamil-perczynski/bootstrap-date-picker
Made with create-react-library
Install
npm install --save @kamil-perczynski/bootstrap-date-picker
Usage
import React, { useState } from "react";
import { format } from "date-fns";
import { DatePicker, useDatePickerContainer } from "@kamil-perczynski/bootstrap-date-picker";
import "@kamil-perczynski/bootstrap-date-picker/dist/index.css";
const DatePickerFormGroup: React.FC<any> = () => {
const [isOpen, setOpen] = useState(false);
const [value, setValue] = useState("2021-05-03T12:00");
const focuser = useDatePickerContainer(() => setOpen(false));
return (
<div
onClick={focuser.onClick}
onBlur={focuser.onBlur}
ref={focuser.containerRef}
className="form-group"
>
<label htmlFor="date-1">Pick a date:</label>
<input
value={format(new Date(value), "dd.MM.yyyy HH:mm")}
onFocus={() => setOpen(true)}
id="date-1"
readOnly
className="form-control bg-white"
/>
<DatePicker
type="localdatetime"
open={isOpen}
onClose={() => setOpen(false)}
value={value}
onChange={setValue}
locale="hr-HR"
/>
</div>
);
};
License
MIT © kamil-perczynski