Getting Started with KendoReact Calendar

The KendoReact Calendar is a form component that represents a graphical Gregorian calendar and supports the selection of and navigation between dates and date ranges for scheduling appointments.

The KendoReact Calendar component is part of the KendoReact library of React UI components. It is distributed through NPM under the kendo-react-dateinputs package.

Basic Usage

The following example demonstrates the Calendar in action.

Copy Codeimport * as React from 'react';
import * as ReactDOM from 'react-dom';

import { Calendar } from '@progress/kendo-react-dateinputs';

class App extends React.Component {
    render() {
        return <Calendar />;
    }
}

ReactDOM.render(
    <App />,
    document.querySelector('my-app')
);

Functionality and Features

• Disabled state
• Dates
• Fast navigation bar
• Active view
• View selection depth
• Date limits
• Week number column
• Custom rendering
• Integration with JSON
• Globalization
• Keyboard navigation
• Accessibility

Suggested Links

• API Reference of the Calendar
• Globalization of the Date Inputs