{"_id":"@cardial/react-scheduler","_rev":"3-dcc4fcc9f97c7f3fe317e29abc90598f","name":"@cardial/react-scheduler","dist-tags":{"latest":"2.9.0"},"versions":{"2.8.2":{"name":"@cardial/react-scheduler","version":"2.8.2","description":"React scheduler component based on Material-UI & date-fns","scripts":{"start":"react-scripts start","webpack":"webpack","pack":"rm -rf dist && npm run webpack && npm run post:pack","local:pack":"npm run pack && cd dist && npm pack && mv *.tgz ../","post:pack":"node ./scripts/post-pack.js","format":"prettier --check \"**/*.{js,jsx,ts,tsx,json}\"","format:write":"prettier --write \"**/*.{js,jsx,ts,tsx,json}\"","lint":"npm run types && eslint .","lint:fix":"eslint . --fix","types":"tsc --noEmit","prepare":"husky install","pre:commit":"lint-staged","test":"jest","test:watch":"jest --watch","test:ci":"jest --ci"},"lint-staged":{"**/*.{ts,js,tsx,jsx}":["npm run lint"],"**/*.{ts,js,tsx,jsx,json,yml}":["npm run format:write"]},"repository":{"type":"git","url":"git+https://github.com/lucascardial/react-scheduler.git"},"keywords":["react","material-ui","calendar","scheduler"],"author":{"name":"Aldabil"},"license":"MIT","homepage":"https://github.com/lucascardial/react-scheduler#readme","bugs":{"url":"https://github.com/lucascardial/react-scheduler/issues"},"devDependencies":{"@emotion/react":"^11.10.4","@emotion/styled":"^11.10.4","@mui/icons-material":"^5.10.6","@mui/material":"^5.10.8","@mui/x-date-pickers":"^6.0.1","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^13.4.0","@testing-library/user-event":"^14.4.3","@types/jest":"^27.0.2","@types/react-dom":"^18.0.6","@typescript-eslint/eslint-plugin":"^5.39.0","@typescript-eslint/parser":"^5.39.0","date-fns":"^2.29.3","eslint":"^8.24.0","eslint-plugin-react":"^7.31.8","husky":"^8.0.0","jest":"^29.1.2","jest-environment-jsdom":"^29.1.2","lint-staged":"^13.0.3","prettier":"^2.7.1","react":"^18.2.0","react-dom":"^18.2.0","react-scripts":"^5.0.1","ts-jest":"^29.0.3","ts-loader":"^9.4.1","ts-node":"^10.9.1","typescript":"^4.8.4","webpack-cli":"^4.7.0","webpack-node-externals":"^3.0.0"},"peerDependencies":{"@mui/icons-material":">=5.0.0","@mui/material":">=5.0.0","@mui/x-date-pickers":">=6.0.0-alpha","date-fns":">=2.2","react":">=17.0.0"},"eslintConfig":{"extends":["react-app","react-app/jest"]},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"_id":"@cardial/react-scheduler@2.8.2","gitHead":"e446ab08ba5a6a51dd17fd40e5a3758263028f5c","_nodeVersion":"20.9.0","_npmVersion":"10.1.0","dist":{"integrity":"sha512-i2xknny6+AkAVUWZ7Q0VdpMhfqXn2jjzyyfYloF46pJyyh35e2cLg5MSdghmSHrc6bbRkPmMEk4poIPeitn7hA==","shasum":"08873966c4ef36fe206e3f339d471e399cf0eac7","tarball":"https://registry.npmjs.org/@cardial/react-scheduler/-/react-scheduler-2.8.2.tgz","fileCount":184,"unpackedSize":1040094,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIAaI+B/gToL+pM/KKxbpmCXUyiI1hsmKtpReCJLeAspPAiBVlMHpgPfczBBsZjOKWapmNj3oya6WSHGODM0MX2w5Yw=="}]},"_npmUser":{"name":"lucascardial","email":"luccascardial@gmail.com"},"directories":{},"maintainers":[{"name":"lucascardial","email":"luccascardial@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-scheduler_2.8.2_1708207398408_0.9137355077508564"},"_hasShrinkwrap":false},"2.8.3":{"name":"@cardial/react-scheduler","version":"2.8.3","description":"React scheduler component based on Material-UI & date-fns","scripts":{"start":"react-scripts start","webpack":"webpack","pack":"rm -rf dist && npm run webpack && npm run post:pack","local:pack":"npm run pack && cd dist && npm pack && mv *.tgz ../","post:pack":"node ./scripts/post-pack.js","format":"prettier --check \"**/*.{js,jsx,ts,tsx,json}\"","format:write":"prettier --write \"**/*.{js,jsx,ts,tsx,json}\"","lint":"npm run types && eslint .","lint:fix":"eslint . --fix","types":"tsc --noEmit","prepare":"husky install","pre:commit":"lint-staged","test":"jest","test:watch":"jest --watch","test:ci":"jest --ci"},"lint-staged":{"**/*.{ts,js,tsx,jsx}":["npm run lint"],"**/*.{ts,js,tsx,jsx,json,yml}":["npm run format:write"]},"repository":{"type":"git","url":"git+https://github.com/lucascardial/react-scheduler.git"},"keywords":["react","material-ui","calendar","scheduler"],"author":{"name":"Aldabil"},"license":"MIT","homepage":"https://github.com/lucascardial/react-scheduler#readme","bugs":{"url":"https://github.com/lucascardial/react-scheduler/issues"},"devDependencies":{"@emotion/react":"^11.10.4","@emotion/styled":"^11.10.4","@mui/icons-material":"^5.10.6","@mui/material":"^5.10.8","@mui/x-date-pickers":"^6.0.1","@testing-library/jest-dom":"^5.16.5","@testing-library/react":"^13.4.0","@testing-library/user-event":"^14.4.3","@types/jest":"^27.0.2","@types/react-dom":"^18.0.6","@typescript-eslint/eslint-plugin":"^5.39.0","@typescript-eslint/parser":"^5.39.0","date-fns":"^2.29.3","eslint":"^8.24.0","eslint-plugin-react":"^7.31.8","husky":"^8.0.0","jest":"^29.1.2","jest-environment-jsdom":"^29.1.2","lint-staged":"^13.0.3","prettier":"^2.7.1","react":"^18.2.0","react-dom":"^18.2.0","react-scripts":"^5.0.1","ts-jest":"^29.0.3","ts-loader":"^9.4.1","ts-node":"^10.9.1","typescript":"^4.8.4","webpack-cli":"^4.7.0","webpack-node-externals":"^3.0.0"},"peerDependencies":{"@mui/icons-material":">=5.0.0","@mui/material":">=5.0.0","@mui/x-date-pickers":">=6.0.0-alpha","date-fns":">=2.2","react":">=17.0.0"},"eslintConfig":{"extends":["react-app","react-app/jest"]},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"_id":"@cardial/react-scheduler@2.8.3","gitHead":"e446ab08ba5a6a51dd17fd40e5a3758263028f5c","_nodeVersion":"20.9.0","_npmVersion":"10.1.0","dist":{"integrity":"sha512-X9kgKZNDN/pdwWMkc+PGTESSDz/5QbVD9opgbDNcsh6DIIWiskKeTW8jTYw8lVFMIhbCN9VkoKW2yCwxn+Iu9w==","shasum":"ce94de5495cf805f706e7a179349a6114d8f5625","tarball":"https://registry.npmjs.org/@cardial/react-scheduler/-/react-scheduler-2.8.3.tgz","fileCount":125,"unpackedSize":984493,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCICV4r9zPNEwDR5q3a+hvElsSp2jnpKAb0J9iVIoKg4doAiEA0AvfLdF5R69Ai+f13CFNsJvu4gq6Ut3qkHKCqWsNNDA="}]},"_npmUser":{"name":"lucascardial","email":"luccascardial@gmail.com"},"directories":{},"maintainers":[{"name":"lucascardial","email":"luccascardial@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-scheduler_2.8.3_1708207798094_0.1758411082998277"},"_hasShrinkwrap":false},"2.8.4":{"name":"@cardial/react-scheduler","version":"2.8.4","description":"React scheduler component based on Material-UI & date-fns","repository":{"type":"git","url":"git+https://github.com/lucascardial/react-scheduler.git"},"keywords":["react","material-ui","calendar","scheduler"],"author":{"name":"Aldabil"},"license":"MIT","homepage":"https://github.com/lucascardial/react-scheduler#readme","bugs":{"url":"https://github.com/lucascardial/react-scheduler/issues"},"peerDependencies":{"@mui/icons-material":">=5.0.0","@mui/material":">=5.0.0","@mui/x-date-pickers":">=6.0.0-alpha","date-fns":">=2.2","react":">=17.0.0"},"eslintConfig":{"extends":["react-app","react-app/jest"]},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"_id":"@cardial/react-scheduler@2.8.4","gitHead":"74ff43257fc502219a2ea219152f37fd98228cde","types":"./index.d.ts","_nodeVersion":"20.9.0","_npmVersion":"10.1.0","dist":{"integrity":"sha512-IXAeJaZ0d1j4b49EQntDFDiVSIXn8LN5BtuKEAy0LwkCz88VOZmiKnjHggvQWTWJ2L302ChHhlnNpDBN/O3WIA==","shasum":"88a3c9816278bf12f86a84d2dc1e328c46195d0f","tarball":"https://registry.npmjs.org/@cardial/react-scheduler/-/react-scheduler-2.8.4.tgz","fileCount":52,"unpackedSize":159781,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIGxtRJXKLUVwn7rHt9gRW6WmA/I+nAQkYPhjt8PV0M0vAiB90Kzx5RfyAzH5UZG/AK5XfWg4rphGbIv0M6eZEw+00w=="}]},"_npmUser":{"name":"lucascardial","email":"luccascardial@gmail.com"},"directories":{},"maintainers":[{"name":"lucascardial","email":"luccascardial@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-scheduler_2.8.4_1708208934174_0.07700333910488011"},"_hasShrinkwrap":false},"2.9.0":{"name":"@cardial/react-scheduler","version":"2.9.0","description":"React scheduler component based on Material-UI & date-fns","repository":{"type":"git","url":"git+https://github.com/lucascardial/react-scheduler.git"},"keywords":["react","material-ui","calendar","scheduler"],"author":{"name":"Aldabil"},"license":"MIT","homepage":"https://github.com/lucascardial/react-scheduler#readme","bugs":{"url":"https://github.com/lucascardial/react-scheduler/issues"},"peerDependencies":{"@mui/icons-material":">=5.0.0","@mui/material":">=5.0.0","@mui/x-date-pickers":">=6.0.0-alpha","date-fns":">=2.2","react":">=17.0.0"},"eslintConfig":{"extends":["react-app","react-app/jest"]},"browserslist":{"production":[">0.2%","not dead","not op_mini all"],"development":["last 1 chrome version","last 1 firefox version","last 1 safari version"]},"_id":"@cardial/react-scheduler@2.9.0","gitHead":"74ff43257fc502219a2ea219152f37fd98228cde","types":"./index.d.ts","_nodeVersion":"20.9.0","_npmVersion":"10.1.0","dist":{"integrity":"sha512-+GnxhK9Tz4jNlBAZU4LjcjwobonkpS4UeYy/cWoVzwSJM60si7nnqSwhMu+yKjzBWTqHvmAbmZcZX3Fu57C9FA==","shasum":"5f787645fc50146d76d2d722e9a228e258ff9e10","tarball":"https://registry.npmjs.org/@cardial/react-scheduler/-/react-scheduler-2.9.0.tgz","fileCount":53,"unpackedSize":222960,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDB5K/z1HYK4o2dTEavH77CHIZzPd9rbVoPTZ/MrxtYBQIgLldeS/5khx1OJCSmSrlh7KVUE2IjY9fBO3cndbLQeJw="}]},"_npmUser":{"name":"lucascardial","email":"luccascardial@gmail.com"},"directories":{},"maintainers":[{"name":"lucascardial","email":"luccascardial@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-scheduler_2.9.0_1708216387831_0.3096607205884969"},"_hasShrinkwrap":false}},"time":{"created":"2024-02-17T22:03:18.275Z","2.8.2":"2024-02-17T22:03:18.694Z","modified":"2024-02-18T00:33:08.438Z","2.8.3":"2024-02-17T22:09:58.313Z","2.8.4":"2024-02-17T22:28:54.433Z","2.9.0":"2024-02-18T00:33:08.035Z"},"maintainers":[{"name":"lucascardial","email":"luccascardial@gmail.com"}],"description":"React scheduler component based on Material-UI & date-fns","homepage":"https://github.com/lucascardial/react-scheduler#readme","keywords":["react","material-ui","calendar","scheduler"],"repository":{"type":"git","url":"git+https://github.com/lucascardial/react-scheduler.git"},"author":{"name":"Aldabil"},"bugs":{"url":"https://github.com/lucascardial/react-scheduler/issues"},"license":"MIT","readme":"# React Scheduler Component\n\n[![npm package](https://img.shields.io/npm/v/@aldabil/react-scheduler/latest.svg)](https://www.npmjs.com/package/@aldabil/react-scheduler)\n[![Twitter URL](https://img.shields.io/twitter/url?label=%40aldabil&style=social&url=https%3A%2F%2Ftwitter.com%2Fintent%2Ffollow%3Fscreen_name%3Daldabil21)](https://twitter.com/intent/follow?screen_name=aldabil21)\n\n> :warning: **Notice**: This component uses `mui`/`emotion`/`date-fns`. if your project is not already using these libs, this component may not be suitable.\n\n## Installation\n\n```jsx\nnpm i @aldabil/react-scheduler\n```\n\n## Usage\n\n```jsx\nimport { Scheduler } from \"@aldabil/react-scheduler\";\n```\n\n## Example\n\n```jsx\n\n```\n\n### Scheduler Props\n\n| Prop | Value |\n| ----------------------- |--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| height | number. Min height of table.
_Default_: 600 |\n| view | string. Initial view to load. options: \"week\", \"month\", \"day\".
_Default_: \"week\" (if it's not null) |\n| agenda | boolean. Activate agenda view |\n| month | Object. Month view props.
_default_: 
{
weekDays: [0, 1, 2, 3, 4, 5], 
weekStartOn: 6, 
startHour: 9, 
endHour: 17,
cellRenderer?:(props: CellProps) => JSX.Element,
navigation: true,
disableGoToDay: false
}
|\n| week | Object. Week view props.
_default_: 
{ 
weekDays: [0, 1, 2, 3, 4, 5], 
weekStartOn: 6, 
startHour: 9, 
endHour: 17,
step: 60,
cellRenderer?:(props: CellProps) => JSX.Element,
navigation: true,
disableGoToDay: false
}
|\n| day | Object. Day view props.
_default_: 
{
startHour: 9, 
endHour: 17, 
step: 60,
cellRenderer?:(props: CellProps) => JSX.Element,
hourRenderer?:(hour: string) => JSX.Element,
navigation: true
}
|\n| selectedDate | Date. Initial selected date.
_Default_: new Date() |\n| navigation | boolean. Show/Hide top bar date navigation.
_Default_: true |\n| navigationPickerProps | CalendarPickerProps for top bar date navigation. Ref: [CalendarPicker API](https://mui.com/x/api/date-pickers/calendar-picker/#main-content) |\n| disableViewNavigator | boolean. Show/Hide top bar date View navigator.
_Default_: false |\n| events | Array of ProcessedEvent.
_Default_: [] 
type ProcessedEvent = {
event_id: number or string;
title: string;
start: Date;
end: Date;
disabled?: boolean;
color?: string or \"palette.path\";
textColor?: string or \"palette.path\";
editable?: boolean;
deletable?: boolean;
draggable?: boolean;
allDay?: boolean;
}
|\n| eventRenderer | Function(event:ProcessedEvent): JSX.Element.
A function that overrides the event item render function, see demo _Custom Event Renderer_ below |\n| editable | boolean. If `true`, the scheduler cell click will not open the editor, and the event item will not show the edit button, this is applied to all events, and can be overridden in each event property, see `ProcessedEvent` type. |\n| deletable | boolean. Whether the event item will show the delete button, this is applied to all events, and can be overridden in each event property, see `ProcessedEvent` type. |\n| draggable | boolean. Whether activate drag&drop for the events, this is applied to all events, and can be overridden in each event property, see `ProcessedEvent` type. |\n| getRemoteEvents | Function(RemoteQuery). Return promise of array of events. Can be used as a callback to fetch events by parent component or fetch.
type RemoteQuery = { 
 start: Date;
 end: Date;
 view: \"day\" \\| \"week\" \\| \"month\";
}
|\n| fields | Array of extra fields with configurations.
Example: 
 { 
 name: \"description\", 
 type: \"input\" , 
 config: { label: \"Description\", required: true, min: 3, email: true, variant: \"outlined\", ....
}
|\n| loading | boolean. Loading state of the calendar table | |\n| loadingComponent | Custom component to override the default `CircularProgress` |\n| onConfirm | Function(event, action). Return promise with the new added/edited event use with remote data.
_action_: \"add\", \"edit\" |\n| onDelete | Function(id) Return promise with the deleted event id to use with remote data. |\n| customEditor | Function(scheduler). Override editor modal.
Provided prop _scheduler_ object with helper props: 
{
state: state obj, 
close(): void
loading(status: boolean): void
edited?: ProcessedEvent
onConfirm(event: ProcessedEvent, action:EventActions): void
}
|\n| customViewer | Function(event: ProcessedEvent, close: () => void). Used to render fully customized content of the event popper. If used, `viewerExtraComponent` & `viewerTitleComponent` will be ignored |\n| viewerExtraComponent | Function(fields, event) OR Component. Additional component in event viewer popper |\n| viewerTitleComponent | Function(event). Helper function to render custom title in event popper |\n| resources | Array. Resources array to split event views with resources
_Example_ 
{
assignee: 1,
text: \"User One\", 
subtext: \"Sales Manager\", 
avatar: \"https://picsum.photos/200/300\", 
color: \"#ab2d2d\",
 }
|\n| resourceFields | Object. Map the resources correct fields.
_Example_:
{
idField: \"admin_id\", 
textField: \"title\", 
subTextField: \"mobile\",
avatarField: \"title\", 
colorField: \"background\",
}
|\n| resourceHeaderComponent | Function(resource). Override header component of resource |\n| resourceViewMode | Display resources mode.
_Options_: \"default\", \"tabs\" |\n| direction | string. Table direction. \"rtl\", \"ltr\" |\n| dialogMaxWidth | Edito dialog maxWith. Ex: \"lg\", \"md\", \"sm\"... _Default_:\"md\" |\n| locale | Locale of date-fns. _Default_:enUS |\n| hourFormat | Hour format.
_Options_: \"12\", \"24\"..._Default_: \"12\" |\n| timeZone | String, time zone IANA ID: https://en.wikipedia.org/wiki/List_of_tz_database_time_zones |\n| translations | Object. Translations view props.
_default_: 
{
 navigation: {
 month: \"Month\",
 week: \"Week\",
 day: \"Day\",
 today: \"Today\"
 agenda: \"Agenda\"
 },
 form: {
 addTitle: \"Add Event\",
 editTitle: \"Edit Event\",
 confirm: \"Confirm\",
 delete: \"Delete\",
 cancel: \"Cancel\"
 },
 event: {
 title: \"Title\",
 start: \"Start\",
 end: \"End\",
 allDay: \"All Day\"
},
 validation: {
 required: \"Required\",
 invalidEmail: \"Invalid Email\",
 onlyNumbers: \"Only Numbers Allowed\",
 min: \"Minimum {{min}} letters\",
 max: \"Maximum {{max}} letters\"
 },
 moreEvents: \"More...\",
 noDataToDisplay: \"No data to display\",
 loading: \"Loading...\"
}
|\n| onEventDrop | Function(droppedOn: Date, updatedEvent: ProcessedEvent, originalEvent: ProcessedEvent). Return a promise, used to update remote data of the dropped event. Return an event to update state internally, or void if event state is managed within component |\n| onEventClick | Function(event: ProcessedEvent): void. Triggered when an event item is clicked |\n| onSelectedDateChange | Function(date: Date): void. Triggered when the `selectedDate` prop changes by navigation date picker or `today` button |\n| onViewChange | Function(view: View): void. Triggered when navigation view changes |\n| stickyNavigation | If true, the navigation controller bar will be sticky |\n\n
\n\n### SchedulerRef\n\nUsed to help manage and control the internal state of the `Scheduler` component from outside of `Scheduler` props, Example:\n\n```js\nimport { Scheduler } from \"@aldabil/react-scheduler\";\nimport type { SchedulerRef } from \"@aldabil/react-scheduler/types\"\n\nconst SomeComponent = () => {\n const calendarRef = useRef(null);\n\n return \n
\n \n \n
\n\n \n \n};\n```\n\nThe `calendarRef` holds the entire internal state of the Scheduler component. Perhaps the most useful method inside the `calendarRef` is `handleState`, example:\n\n```\ncalendarRef.current.scheduler.handleState(value, key);\n```\n\nconsider looking inside `SchedulerRef` type to see all fields & methods available.\n\n### Demos\n\n- [Basic](https://codesandbox.io/s/react-scheduler-demo-standard-v96bd)\n- [Remote Data](https://codesandbox.io/s/remote-data-j13ei)\n- [Custom Fields](https://codesandbox.io/s/custom-fields-b2kbv)\n- [Editor/Viewer Override](https://codesandbox.io/s/customeditor-tt2pf)\n- [Resources/View Mode](https://codesandbox.io/s/resources-7wlcy)\n- [Custom Cell Action](https://codesandbox.io/s/custom-cell-action-n02dv)\n- [Custom Event Renderer](https://codesandbox.io/s/custom-event-renderer-rkf4xw)\n\n### Todos\n\n- [ ] Tests\n- [x] Drag&Drop - partially\n- [ ] Resizable\n- [ ] Recurring events\n- [x] Localization\n- [x] Hour format 12 | 24\n","readmeFilename":"README.md"}