Premium

Resource DayGrid

Review a day or week by resource without an hourly axis. Timed and all-day events share the corresponding resource/date cell, making this layout useful when daily allocation matters more than exact slot placement.

Loading interactive demo…

What you configure

view
Choose resource-day-grid-day or resource-day-grid-week.
datesAboveResources
Choose date-first or resource-first column headings.
resources / events
Provide resources and event assignments with matching resource IDs.

Essential integration

This assumes the shared Quick start already provides premiumLicense and, for UI views, premiumCalendarOptions. Only the feature-specific setup is shown.

Feature-specific TypeScript
import { WtsCalendar } from '@wts-calendar/core';
import { resourceSchedulingModule } from '@wts-calendar/core/resource-scheduling';

const calendar = new WtsCalendar({
  ...premiumCalendarOptions,
  plugins: [resourceSchedulingModule],
  view: 'resource-day-grid-day',
  resources: [
    { id: 'design', title: 'Design studio', capacity: 2 },
    { id: 'engineering', title: 'Engineering', capacity: 4 },
  ],
  events: [
    {
      id: 'review',
      title: 'Design review',
      resourceId: 'design',
      start: '2026-09-07T09:00:00Z',
      end: '2026-09-07T10:30:00Z',
    },
  ],
});

Behavior and lifecycle

  • Resource and date headings identify the ownership of each visible cell.
  • Timed events remain represented even though the view has no hourly grid.

Limits and responsibilities

  • Use Resource TimeGrid when users need to position appointments against an hourly axis.
  • Changing the header arrangement does not change event timestamps or resource assignments.
Premium

Enable this capability

Optional module
@wts-calendar/core/resource-scheduling
Local capability ID
resource-scheduling · enabled by package-wide Premium

Use the request form to describe your project and deployment origins. Pricing and terms are confirmed privately. A WTS license is separate from provider credentials; do not send passwords or production access tokens.

The live example uses a browser-visible deployment key restricted to this package and approved origins. It does not collect license keys or visitor credentials.

Request Premium pricing

Share the details we need to respond to your request.

Optional for this inquiry, but required before deployment. Add one origin per line without a page path. Registered HTTP localhost origins are allowed for development.

Don’t include license keys, passwords, or confidential information.