Scheduling flows where users expect to manipulate events directly on the calendar surface.
Interaction guide
Drag-and-drop calendar behavior for React products.
A real drag-and-drop calendar is more than pointer movement. It needs preview states, resize handles, keyboard alternatives, touch behavior, and clean mutation payloads. CalendarCN is built around that interaction model.
Teams that need consistent behavior across desktop and touch devices.
Products that want to intercept create, move, and resize requests before persistence.
Builder route
What you get out of the box
CalendarCN supports drag-and-drop calendar workflows in React with event creation, move, resize, keyboard nudges, and touch interactions.
Create blocks by dragging on empty slots, then move or resize them in place.
Keep direct editing accessible with arrow-key moves, resize shortcuts, and focus-managed overlays.
Return every change as a typed operation so your app can validate or persist it on its own terms.
Evaluation
What to look for in a drag-and-drop calendar
Use these criteria to decide whether this route actually matches your product and evaluation context.
- Direct editing matters most when users plan by moving time blocks instead of filling modal forms.
- CalendarCN covers mouse, keyboard, and touch interaction paths rather than treating drag and drop as desktop-only polish.
- This is the right fit if your product wants typed mutation callbacks instead of internal hidden state.
Next step
Go deeper without losing the install path
Move from search intent into evaluation fast: docs, patterns, and API pages that match this use case.