Resize

Resize events in the time grid by dragging their bottom edge, and fullday/multiple-day events by dragging their right edge.

This is a premium plugin which requires an active license to be used. Learn more at Schedule-X premium.

2. Installation

2.1 Set up premium auth (only once)

Follow the instructions for setting up an .npmrc

2.2 Install


npm i @sx-premium/resize

Usage


import { createResizePlugin } from '@sx-premium/resize'
 
const calendar = createCalendar({
  /* other configuration */
  plugins: [
    createResizePlugin()
  ],
 
  callbacks: {
    onEventUpdate(updatedEvent) {
      console.log('onEventUpdate', updatedEvent)
    },
 
    // (Optionally) run your validation or side effects
    // return false to stop the update, and true to allow it
    onBeforeEventUpdate(oldEvent, newEvent, $app) {
      return false
    }
  }
})

Configuration

You can configure the length, in minutes, of the intervals that are used when resizing:


import { createResizePlugin } from '@sx-premium/resize'
 
const calendar = createCalendar({
  /* other configuration */
  plugins: [
    createResizePlugin(30) // 30 minute intervals when resizing
  ]
})

Available values are 15 (default), 30 and 60

Methods

setInterval(minutes: number)

Set the interval, in minutes, for resizing events.


import { createResizePlugin } from '@sx-premium/resize'
 
const resizePlugin = createResizePlugin()
 
const calendar = createCalendar({
  /* other configuration */
  plugins: [
    resizePlugin
  ]
})
 
resizePlugin.setInterval(30)

Changelog

See changelog page.