react-scheduler-pro
v1.1.0
Published
React scheduler pro is light weight scheduler package.
Downloads
56
Maintainers
Readme
React Scheduler Pro
React Scheduler Pro is a lightweight and powerful event Calender built with Flexbox. React Scheduler Pro – your essential toolkit for effortlessly managing schedules and events within your React applications.
Demo
Installation
npm i react-scheduler-pro
or
yarn add react-scheduler-pro
Documenation
Usage
import { Scheduler } from "react-scheduler-pro";
Example
function App() {
const evs = [
{
_id: 36,
name: 'Owais',
startDate: new Date(
new Date(new Date(new Date().setHours(1))).setDate(12)
),
endDate: new Date(new Date(new Date(new Date().setHours(5))).setDate(15)),
resourceId: 2,
backgroundColor: '#FFA447',
isAllDay: true,
},
{
_id: 47,
name: 'B',
startDate: new Date(
new Date(new Date(new Date().setHours(1))).setDate(13)
),
endDate: new Date(new Date(new Date(new Date().setHours(5))).setDate(31)),
resourceId: 1,
backgroundColor: '#0079FF',
},
];
const [events, setEvents] = useState<
{
_id: number;
name: string;
startDate: Date;
endDate: Date;
backgroundColor?: string;
resourceId?: string | number;
isAllDay?: boolean;
}[]
>(evs);
return (
<div className="App p-2">
<Scheduler
events={events}
fields={{
id: '_id',
subject: 'name',
start: 'startDate',
end: 'endDate',
allDay: 'isAllDay',
}}
/>
</div>
);
}