@bryntum/gantt-react 7.2.0 → 7.2.2

package/src/BryntumSchedulerPro.tsx

@@ -440,7 +440,7 @@ export type BryntumSchedulerProProps = {
      */
     emptyText? : string|EmptyTextDomConfig
     /**
-     * Allow using [Delete] and [Backspace] to remove events/assignments
+     * Allow using <kbd>Delete</kbd> and <kbd>Backspace</kbd> to remove events/assignments
      */
     enableDeleteKey? : boolean
     /**
@@ -539,8 +539,8 @@ export type BryntumSchedulerProProps = {
      * @param {'tonal','filled','bordered','traced','outlined','indented','line','dashed','minimal','rounded','calendar','interday','gantt',null} detail.renderData.eventStyle The `eventStyle` of the event. Use this to apply custom styles to the event DOM element
      * @param {string} detail.renderData.eventColor The `eventColor` of the event. Use this to set a custom color for the rendered event
      * @param {string} detail.renderData.ariaLabel A description of the event details used for screen readers
-     * @param {DomConfig[]} detail.renderData.children An array of DOM configs used as children to the `b-sch-event` element. Can be populated with additional DOM configs to have more control over contents.
-     * @returns {string,DomConfig,DomConfig[]} A simple string, or a DomConfig (or array thereof)
+     * @param {DomConfig[]} detail.renderData.children An array of DOM configs used as children to the `b-sch-event` element. Can be populated with additional DOM configs to have more control over contents. <h3>Using JSX (React)</h3> When using the Bryntum React wrapper, the event renderer can return JSX elements: ```javascript eventRenderer({ eventRecord, resourceRecord, renderData }) {     return &lt;MyEventComponent event={eventRecord} resource={resourceRecord} />; } ``` *Using JSX in the event renderer creates a React portal for each rendered event. For schedulers with many visible events or frequently re-rendered views, this may impact scrolling performance compared to returning plain strings or [DomConfig](https://bryntum.com/products/gantt/docs/api/Core/helper/DomHelper#typedef-DomConfig) objects. Consider using JSX primarily for events that require complex interactive React components.*
+     * @returns {string,DomConfig,DomConfig[]} A simple string, a DomConfig (or array thereof), or a JSX element when using React
      */
     eventRenderer? : (detail: { eventRecord: SchedulerEventModel, resourceRecord: SchedulerResourceModel, assignmentRecord: SchedulerAssignmentModel, scheduler: Scheduler, renderData: { event: SchedulerEventModel, cls: DomClassList|string, wrapperCls: DomClassList|string, iconCls: DomClassList|string, left: number, width: number, height: number, style: string|Record<string, string>, wrapperStyle: string|Record<string, string>, eventStyle: 'tonal'|'filled'|'bordered'|'traced'|'outlined'|'indented'|'line'|'dashed'|'minimal'|'rounded'|'calendar'|'interday'|'gantt'|null, eventColor: string, ariaLabel: string, children: DomConfig[] } }) => string|DomConfig|DomConfig[]
     /**
@@ -1712,7 +1712,7 @@ export type BryntumSchedulerProProps = {
      */
     onAssignmentSelectionChange? : ((event: { source: Scheduler, action: 'select'|'deselect'|'update'|'clear', selected: SchedulerAssignmentModel[], deselected: SchedulerAssignmentModel[], selection: SchedulerAssignmentModel[] }) => void)|string
     /**
-     * Fires before an assignment is removed. Can be triggered by user pressing [DELETE] or [BACKSPACE] or
+     * Fires before an assignment is removed. Can be triggered by user pressing <kbd>Delete</kbd> or <kbd>Backspace</kbd> or
      * by the event editor. Can for example be used to display a custom dialog to confirm deletion, in which
      * case records should be "manually" removed after confirmation:
      * ...
@@ -1770,7 +1770,7 @@ export type BryntumSchedulerProProps = {
      */
     onBeforeCellEditStart? : ((event: { source: Grid, editorContext: CellEditorContext }) => Promise<boolean>|boolean|void)|string
     /**
-     * Fires on the owning Grid before deleting a range of selected cell values by pressing `Backspace` or `Del`
+     * Fires on the owning Grid before deleting a range of selected cell values by pressing <kbd>Backspace</kbd> or <kbd>Delete</kbd>
      * buttons while [autoEdit](https://bryntum.com/products/gantt/docs/api/Grid/feature/CellEdit#config-autoEdit) is set to `true`. Return `false` to prevent editing.
      * @param {object} event Event object
      * @param {Grid.view.Grid} event.source Owner grid
@@ -1962,7 +1962,7 @@ export type BryntumSchedulerProProps = {
      */
     onBeforeEventAdd? : ((event: { source: Scheduler, eventRecord: SchedulerEventModel, resourceRecords: SchedulerResourceModel[], assignmentRecords: SchedulerAssignmentModel[] }) => Promise<boolean>|boolean|void)|string
     /**
-     * Fires before an event is removed. Can be triggered by user pressing [DELETE] or [BACKSPACE] or by the
+     * Fires before an event is removed. Can be triggered by user pressing <kbd>Delete</kbd> or <kbd>Backspace</kbd> or by the
      * event editor. Return `false` to immediately veto the removal (or a `Promise` yielding `true` or `false`
      * for async vetoing).
      * ...
@@ -3500,19 +3500,20 @@ export type BryntumSchedulerProProps = {
      * @param {Scheduler.model.SchedulerEventModel[]} event.originalEventRecords The event records that were copied
      * @param {Scheduler.model.SchedulerAssignmentModel[]} event.originalAssignmentRecords The assignment records that were copied
      * @param {Date} event.date The paste date
-     * @param {Scheduler.model.SchedulerResourceModel} event.resourceRecord The target resource record
+     * @param {Scheduler.model.SchedulerResourceModel} event.resourceRecord The target resource record. When multiple resources are pasted to, this will be the top resource
+     * @param {Scheduler.model.SchedulerResourceModel[]} event.resourceRecords All target resource records that the events would be pasted to
      * @param {boolean} event.isCut `true` if this is a cut action
      * @param {string} event.entityName 'event' to distinguish this event from other `pasteNotAllowed` events
      * @param {'overlappingEvents','resourceReadOnly'} event.reason A string id to use for displaying an error message to the user.
      */
-    onPasteNotAllowed? : ((event: { source: Scheduler, eventRecords: SchedulerEventModel[], assignmentRecords: SchedulerAssignmentModel[], originalEventRecords: SchedulerEventModel[], originalAssignmentRecords: SchedulerAssignmentModel[], date: Date, resourceRecord: SchedulerResourceModel, isCut: boolean, entityName: string, reason: 'overlappingEvents'|'resourceReadOnly' }) => void)|string
+    onPasteNotAllowed? : ((event: { source: Scheduler, eventRecords: SchedulerEventModel[], assignmentRecords: SchedulerAssignmentModel[], originalEventRecords: SchedulerEventModel[], originalAssignmentRecords: SchedulerAssignmentModel[], date: Date, resourceRecord: SchedulerResourceModel, resourceRecords: SchedulerResourceModel[], isCut: boolean, entityName: string, reason: 'overlappingEvents'|'resourceReadOnly' }) => void)|string
     /**
      * Fires on the owning Grid when export has finished
      * @param {object} event Event object
      * @param {Response} event.response Optional response, if received
      * @param {Error} event.error Optional error, if exception occurred
      */
-    onPdfExport? : ((event: { response?: any, error?: Error }) => void)|string
+    onPdfExport? : ((event: { response?: Response, error?: Error }) => void)|string
     /**
      * Fired on the owning Scheduler or Gantt widget when dragging the percent bar
      * @param {object} event Event object
@@ -4469,6 +4470,14 @@ export type BryntumSchedulerProProps = {
      * @param {boolean} event.hasChanges Whether any changes are recorded that are not yet attached to a version.
      */
     onTransactionChange? : ((event: { hasChanges: boolean }) => void)|string
+    /**
+     * Fired on the owning Grid/Scheduler/Gantt after tree grouping levels change
+     * @param {object} event Event object
+     * @param {Grid.view.Grid} event.source The grid instance
+     * @param {(string|Function)[]} event.groupers Array of field names or functions representing the current grouping levels
+     * @param {(string|Function)[]} event.oldGroupers Array of field names or functions representing the previous grouping levels
+     */
+    onTreeGroup? : ((event: { source: Grid, groupers: (string|Function)[], oldGroupers: (string|Function)[] }) => void)|string
     /**
      * Fires when row locking is disabled.
      * @param {object} event Event object
@@ -4535,7 +4544,7 @@ export type BryntumSchedulerProProps = {
     cellEditFeature? : object|boolean|string|SchedulerProCellEdit|SchedulerProCellEditConfig
     /**
      * Right click to display context menu for cells. To invoke the cell menu in a keyboard-accessible manner, use the
-     * `SPACE` key when the cell is focused.
+     * <kbd>Space</kbd> key when the cell is focused.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/feature/CellMenu)
      */
@@ -4632,8 +4641,8 @@ export type BryntumSchedulerProProps = {
      */
     eventBufferFeature? : object|boolean|string|EventBuffer|EventBufferConfig
     /**
-     * Allow using <kbd>Ctrl</kbd>/<kbd>CMD</kbd> + <kbd>C</kbd>/<kbd>X</kbd> and <kbd>Ctrl</kbd>/<kbd>CMD</kbd> +
-     * <kbd>V</kbd> to copy/cut and paste events.
+     * Allow using <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>C</kbd>, <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>X</kbd> and
+     * <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>V</kbd> to copy/cut and paste events.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Scheduler/feature/EventCopyPaste)
      */
@@ -4754,8 +4763,8 @@ export type BryntumSchedulerProProps = {
     filterBarFeature? : object|boolean|string|FilterBar|FilterBarConfig
     /**
      * Enables rendering and handling of row groups. The actual grouping is done in the store, but triggered by
-     * <kbd>shift</kbd> + clicking headers, or by using the context menu, or by using two finger tap (one on header,
-     * one anywhere on grid). Use <kbd>shift</kbd> + <kbd>alt</kbd> + click, or the context menu, to remove a column
+     * <kbd>Shift</kbd> + clicking headers, or by using the context menu, or by using two finger tap (one on header,
+     * one anywhere on grid). Use <kbd>Shift</kbd> + <kbd>Alt</kbd> + click, or the context menu, to remove a column
      * grouper.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/feature/Group)
@@ -5713,6 +5722,7 @@ export class BryntumSchedulerPro extends React.Component<BryntumSchedulerProProp
         'onToggleNode',
         'onToolClick',
         'onTransactionChange',
+        'onTreeGroup',
         'onUnlockRows',
         'onUnsplit',
         'onVisibleDateRangeChange',

package/src/BryntumSchedulerProBase.tsx

@@ -440,7 +440,7 @@ export type BryntumSchedulerProBaseProps = {
      */
     emptyText? : string|EmptyTextDomConfig
     /**
-     * Allow using [Delete] and [Backspace] to remove events/assignments
+     * Allow using <kbd>Delete</kbd> and <kbd>Backspace</kbd> to remove events/assignments
      */
     enableDeleteKey? : boolean
     /**
@@ -539,8 +539,8 @@ export type BryntumSchedulerProBaseProps = {
      * @param {'tonal','filled','bordered','traced','outlined','indented','line','dashed','minimal','rounded','calendar','interday','gantt',null} detail.renderData.eventStyle The `eventStyle` of the event. Use this to apply custom styles to the event DOM element
      * @param {string} detail.renderData.eventColor The `eventColor` of the event. Use this to set a custom color for the rendered event
      * @param {string} detail.renderData.ariaLabel A description of the event details used for screen readers
-     * @param {DomConfig[]} detail.renderData.children An array of DOM configs used as children to the `b-sch-event` element. Can be populated with additional DOM configs to have more control over contents.
-     * @returns {string,DomConfig,DomConfig[]} A simple string, or a DomConfig (or array thereof)
+     * @param {DomConfig[]} detail.renderData.children An array of DOM configs used as children to the `b-sch-event` element. Can be populated with additional DOM configs to have more control over contents. <h3>Using JSX (React)</h3> When using the Bryntum React wrapper, the event renderer can return JSX elements: ```javascript eventRenderer({ eventRecord, resourceRecord, renderData }) {     return &lt;MyEventComponent event={eventRecord} resource={resourceRecord} />; } ``` *Using JSX in the event renderer creates a React portal for each rendered event. For schedulers with many visible events or frequently re-rendered views, this may impact scrolling performance compared to returning plain strings or [DomConfig](https://bryntum.com/products/gantt/docs/api/Core/helper/DomHelper#typedef-DomConfig) objects. Consider using JSX primarily for events that require complex interactive React components.*
+     * @returns {string,DomConfig,DomConfig[]} A simple string, a DomConfig (or array thereof), or a JSX element when using React
      */
     eventRenderer? : (detail: { eventRecord: SchedulerEventModel, resourceRecord: SchedulerResourceModel, assignmentRecord: SchedulerAssignmentModel, scheduler: Scheduler, renderData: { event: SchedulerEventModel, cls: DomClassList|string, wrapperCls: DomClassList|string, iconCls: DomClassList|string, left: number, width: number, height: number, style: string|Record<string, string>, wrapperStyle: string|Record<string, string>, eventStyle: 'tonal'|'filled'|'bordered'|'traced'|'outlined'|'indented'|'line'|'dashed'|'minimal'|'rounded'|'calendar'|'interday'|'gantt'|null, eventColor: string, ariaLabel: string, children: DomConfig[] } }) => string|DomConfig|DomConfig[]
     /**
@@ -1711,7 +1711,7 @@ export type BryntumSchedulerProBaseProps = {
      */
     onAssignmentSelectionChange? : ((event: { source: Scheduler, action: 'select'|'deselect'|'update'|'clear', selected: SchedulerAssignmentModel[], deselected: SchedulerAssignmentModel[], selection: SchedulerAssignmentModel[] }) => void)|string
     /**
-     * Fires before an assignment is removed. Can be triggered by user pressing [DELETE] or [BACKSPACE] or
+     * Fires before an assignment is removed. Can be triggered by user pressing <kbd>Delete</kbd> or <kbd>Backspace</kbd> or
      * by the event editor. Can for example be used to display a custom dialog to confirm deletion, in which
      * case records should be "manually" removed after confirmation:
      * ...
@@ -1769,7 +1769,7 @@ export type BryntumSchedulerProBaseProps = {
      */
     onBeforeCellEditStart? : ((event: { source: Grid, editorContext: CellEditorContext }) => Promise<boolean>|boolean|void)|string
     /**
-     * Fires on the owning Grid before deleting a range of selected cell values by pressing `Backspace` or `Del`
+     * Fires on the owning Grid before deleting a range of selected cell values by pressing <kbd>Backspace</kbd> or <kbd>Delete</kbd>
      * buttons while [autoEdit](https://bryntum.com/products/gantt/docs/api/Grid/feature/CellEdit#config-autoEdit) is set to `true`. Return `false` to prevent editing.
      * @param {object} event Event object
      * @param {Grid.view.Grid} event.source Owner grid
@@ -1961,7 +1961,7 @@ export type BryntumSchedulerProBaseProps = {
      */
     onBeforeEventAdd? : ((event: { source: Scheduler, eventRecord: SchedulerEventModel, resourceRecords: SchedulerResourceModel[], assignmentRecords: SchedulerAssignmentModel[] }) => Promise<boolean>|boolean|void)|string
     /**
-     * Fires before an event is removed. Can be triggered by user pressing [DELETE] or [BACKSPACE] or by the
+     * Fires before an event is removed. Can be triggered by user pressing <kbd>Delete</kbd> or <kbd>Backspace</kbd> or by the
      * event editor. Return `false` to immediately veto the removal (or a `Promise` yielding `true` or `false`
      * for async vetoing).
      * ...
@@ -3499,19 +3499,20 @@ export type BryntumSchedulerProBaseProps = {
      * @param {Scheduler.model.SchedulerEventModel[]} event.originalEventRecords The event records that were copied
      * @param {Scheduler.model.SchedulerAssignmentModel[]} event.originalAssignmentRecords The assignment records that were copied
      * @param {Date} event.date The paste date
-     * @param {Scheduler.model.SchedulerResourceModel} event.resourceRecord The target resource record
+     * @param {Scheduler.model.SchedulerResourceModel} event.resourceRecord The target resource record. When multiple resources are pasted to, this will be the top resource
+     * @param {Scheduler.model.SchedulerResourceModel[]} event.resourceRecords All target resource records that the events would be pasted to
      * @param {boolean} event.isCut `true` if this is a cut action
      * @param {string} event.entityName 'event' to distinguish this event from other `pasteNotAllowed` events
      * @param {'overlappingEvents','resourceReadOnly'} event.reason A string id to use for displaying an error message to the user.
      */
-    onPasteNotAllowed? : ((event: { source: Scheduler, eventRecords: SchedulerEventModel[], assignmentRecords: SchedulerAssignmentModel[], originalEventRecords: SchedulerEventModel[], originalAssignmentRecords: SchedulerAssignmentModel[], date: Date, resourceRecord: SchedulerResourceModel, isCut: boolean, entityName: string, reason: 'overlappingEvents'|'resourceReadOnly' }) => void)|string
+    onPasteNotAllowed? : ((event: { source: Scheduler, eventRecords: SchedulerEventModel[], assignmentRecords: SchedulerAssignmentModel[], originalEventRecords: SchedulerEventModel[], originalAssignmentRecords: SchedulerAssignmentModel[], date: Date, resourceRecord: SchedulerResourceModel, resourceRecords: SchedulerResourceModel[], isCut: boolean, entityName: string, reason: 'overlappingEvents'|'resourceReadOnly' }) => void)|string
     /**
      * Fires on the owning Grid when export has finished
      * @param {object} event Event object
      * @param {Response} event.response Optional response, if received
      * @param {Error} event.error Optional error, if exception occurred
      */
-    onPdfExport? : ((event: { response?: any, error?: Error }) => void)|string
+    onPdfExport? : ((event: { response?: Response, error?: Error }) => void)|string
     /**
      * Fired on the owning Scheduler or Gantt widget when dragging the percent bar
      * @param {object} event Event object
@@ -4468,6 +4469,14 @@ export type BryntumSchedulerProBaseProps = {
      * @param {boolean} event.hasChanges Whether any changes are recorded that are not yet attached to a version.
      */
     onTransactionChange? : ((event: { hasChanges: boolean }) => void)|string
+    /**
+     * Fired on the owning Grid/Scheduler/Gantt after tree grouping levels change
+     * @param {object} event Event object
+     * @param {Grid.view.Grid} event.source The grid instance
+     * @param {(string|Function)[]} event.groupers Array of field names or functions representing the current grouping levels
+     * @param {(string|Function)[]} event.oldGroupers Array of field names or functions representing the previous grouping levels
+     */
+    onTreeGroup? : ((event: { source: Grid, groupers: (string|Function)[], oldGroupers: (string|Function)[] }) => void)|string
     /**
      * Fires when row locking is disabled.
      * @param {object} event Event object
@@ -4534,7 +4543,7 @@ export type BryntumSchedulerProBaseProps = {
     cellEditFeature? : object|boolean|string|SchedulerProCellEdit|SchedulerProCellEditConfig
     /**
      * Right click to display context menu for cells. To invoke the cell menu in a keyboard-accessible manner, use the
-     * `SPACE` key when the cell is focused.
+     * <kbd>Space</kbd> key when the cell is focused.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/feature/CellMenu)
      */
@@ -4631,8 +4640,8 @@ export type BryntumSchedulerProBaseProps = {
      */
     eventBufferFeature? : object|boolean|string|EventBuffer|EventBufferConfig
     /**
-     * Allow using <kbd>Ctrl</kbd>/<kbd>CMD</kbd> + <kbd>C</kbd>/<kbd>X</kbd> and <kbd>Ctrl</kbd>/<kbd>CMD</kbd> +
-     * <kbd>V</kbd> to copy/cut and paste events.
+     * Allow using <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>C</kbd>, <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>X</kbd> and
+     * <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>V</kbd> to copy/cut and paste events.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Scheduler/feature/EventCopyPaste)
      */
@@ -4753,8 +4762,8 @@ export type BryntumSchedulerProBaseProps = {
     filterBarFeature? : object|boolean|string|FilterBar|FilterBarConfig
     /**
      * Enables rendering and handling of row groups. The actual grouping is done in the store, but triggered by
-     * <kbd>shift</kbd> + clicking headers, or by using the context menu, or by using two finger tap (one on header,
-     * one anywhere on grid). Use <kbd>shift</kbd> + <kbd>alt</kbd> + click, or the context menu, to remove a column
+     * <kbd>Shift</kbd> + clicking headers, or by using the context menu, or by using two finger tap (one on header,
+     * one anywhere on grid). Use <kbd>Shift</kbd> + <kbd>Alt</kbd> + click, or the context menu, to remove a column
      * grouper.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/feature/Group)
@@ -5711,6 +5720,7 @@ export class BryntumSchedulerProBase extends React.Component<BryntumSchedulerPro
         'onToggleNode',
         'onToolClick',
         'onTransactionChange',
+        'onTreeGroup',
         'onUnlockRows',
         'onUnsplit',
         'onVisibleDateRangeChange',

package/src/BryntumSchedulingDirectionPicker.tsx

@@ -181,7 +181,7 @@ export type BryntumSchedulingDirectionPickerProps = {
     contentElementCls? : string|object
     /**
      * If configured as `true`, this means that when an unmatched string is typed into the
-     * combo's input field, and `ENTER`, or the [multiValueSeparator](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-multiValueSeparator) is typed,
+     * combo's input field, and <kbd>Enter</kbd>, or the [multiValueSeparator](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-multiValueSeparator) is typed,
      * a new record will be created using the typed string as the [displayField](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-displayField).
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/SchedulerPro/widget/SchedulingDirectionPicker#config-createOnUnmatched)
@@ -676,7 +676,7 @@ export type BryntumSchedulingDirectionPickerProps = {
     required? : boolean
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */

package/src/BryntumSchedulingModePicker.tsx

@@ -188,7 +188,7 @@ export type BryntumSchedulingModePickerProps = {
     contentElementCls? : string|object
     /**
      * If configured as `true`, this means that when an unmatched string is typed into the
-     * combo's input field, and `ENTER`, or the [multiValueSeparator](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-multiValueSeparator) is typed,
+     * combo's input field, and <kbd>Enter</kbd>, or the [multiValueSeparator](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-multiValueSeparator) is typed,
      * a new record will be created using the typed string as the [displayField](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-displayField).
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/SchedulerPro/widget/SchedulingModePicker#config-createOnUnmatched)
@@ -683,7 +683,7 @@ export type BryntumSchedulingModePickerProps = {
     required? : boolean
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */

package/src/BryntumSlideToggle.tsx

@@ -480,7 +480,7 @@ export type BryntumSlideToggleProps = {
     required? : boolean
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */

package/src/BryntumSlider.tsx

@@ -491,7 +491,7 @@ export type BryntumSliderProps = {
     unit? : string
     /**
      * Initial value.
-     * `String` value allows to link value by reference name.
+     * `String` value allows linking value by reference name.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Core/widget/Slider#config-value)
      */

package/src/BryntumStartDateField.tsx

@@ -562,7 +562,7 @@ export type BryntumStartDateFieldProps = {
     required? : boolean
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */

package/src/BryntumTextAreaField.tsx

@@ -493,7 +493,7 @@ export type BryntumTextAreaFieldProps = {
     resize? : 'none'|'both'|'horizontal'|'vertical'
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */

package/src/BryntumTextAreaPickerField.tsx

@@ -508,7 +508,7 @@ export type BryntumTextAreaPickerFieldProps = {
     resize? : 'none'|'both'|'horizontal'|'vertical'
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */

package/src/BryntumTextField.tsx

@@ -497,7 +497,7 @@ export type BryntumTextFieldProps = {
     required? : boolean
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */

package/src/BryntumTimeField.tsx

@@ -534,7 +534,7 @@ export type BryntumTimeFieldProps = {
     required? : boolean
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */

package/src/BryntumTimeline.tsx

@@ -419,7 +419,7 @@ export type BryntumTimelineProps = {
      */
     emptyText? : string|EmptyTextDomConfig
     /**
-     * Allow using [Delete] and [Backspace] to remove events/assignments
+     * Allow using <kbd>Delete</kbd> and <kbd>Backspace</kbd> to remove events/assignments
      */
     enableDeleteKey? : boolean
     /**
@@ -520,8 +520,8 @@ export type BryntumTimelineProps = {
      * @param {'tonal','filled','bordered','traced','outlined','indented','line','dashed','minimal','rounded','calendar','interday','gantt',null} detail.renderData.eventStyle The `eventStyle` of the event. Use this to apply custom styles to the event DOM element
      * @param {string} detail.renderData.eventColor The `eventColor` of the event. Use this to set a custom color for the rendered event
      * @param {string} detail.renderData.ariaLabel A description of the event details used for screen readers
-     * @param {DomConfig[]} detail.renderData.children An array of DOM configs used as children to the `b-sch-event` element. Can be populated with additional DOM configs to have more control over contents.
-     * @returns {string,DomConfig,DomConfig[]} A simple string, or a DomConfig (or array thereof)
+     * @param {DomConfig[]} detail.renderData.children An array of DOM configs used as children to the `b-sch-event` element. Can be populated with additional DOM configs to have more control over contents. <h3>Using JSX (React)</h3> When using the Bryntum React wrapper, the event renderer can return JSX elements: ```javascript eventRenderer({ eventRecord, resourceRecord, renderData }) {     return &lt;MyEventComponent event={eventRecord} resource={resourceRecord} />; } ``` *Using JSX in the event renderer creates a React portal for each rendered event. For schedulers with many visible events or frequently re-rendered views, this may impact scrolling performance compared to returning plain strings or [DomConfig](https://bryntum.com/products/gantt/docs/api/Core/helper/DomHelper#typedef-DomConfig) objects. Consider using JSX primarily for events that require complex interactive React components.*
+     * @returns {string,DomConfig,DomConfig[]} A simple string, a DomConfig (or array thereof), or a JSX element when using React
      */
     eventRenderer? : (detail: { eventRecord: SchedulerEventModel, resourceRecord: SchedulerResourceModel, assignmentRecord: SchedulerAssignmentModel, scheduler: Scheduler, renderData: { event: SchedulerEventModel, cls: DomClassList|string, wrapperCls: DomClassList|string, iconCls: DomClassList|string, left: number, width: number, height: number, style: string|Record<string, string>, wrapperStyle: string|Record<string, string>, eventStyle: 'tonal'|'filled'|'bordered'|'traced'|'outlined'|'indented'|'line'|'dashed'|'minimal'|'rounded'|'calendar'|'interday'|'gantt'|null, eventColor: string, ariaLabel: string, children: DomConfig[] } }) => string|DomConfig|DomConfig[]
     /**
@@ -1638,7 +1638,7 @@ export type BryntumTimelineProps = {
      */
     onAssignmentSelectionChange? : ((event: { source: Scheduler, action: 'select'|'deselect'|'update'|'clear', selected: SchedulerAssignmentModel[], deselected: SchedulerAssignmentModel[], selection: SchedulerAssignmentModel[] }) => void)|string
     /**
-     * Fires before an assignment is removed. Can be triggered by user pressing [DELETE] or [BACKSPACE] or
+     * Fires before an assignment is removed. Can be triggered by user pressing <kbd>Delete</kbd> or <kbd>Backspace</kbd> or
      * by the event editor. Can for example be used to display a custom dialog to confirm deletion, in which
      * case records should be "manually" removed after confirmation:
      * ...
@@ -1696,7 +1696,7 @@ export type BryntumTimelineProps = {
      */
     onBeforeCellEditStart? : ((event: { source: Grid, editorContext: CellEditorContext }) => Promise<boolean>|boolean|void)|string
     /**
-     * Fires on the owning Grid before deleting a range of selected cell values by pressing `Backspace` or `Del`
+     * Fires on the owning Grid before deleting a range of selected cell values by pressing <kbd>Backspace</kbd> or <kbd>Delete</kbd>
      * buttons while [autoEdit](https://bryntum.com/products/gantt/docs/api/Grid/feature/CellEdit#config-autoEdit) is set to `true`. Return `false` to prevent editing.
      * @param {object} event Event object
      * @param {Grid.view.Grid} event.source Owner grid
@@ -1888,7 +1888,7 @@ export type BryntumTimelineProps = {
      */
     onBeforeEventAdd? : ((event: { source: Scheduler, eventRecord: SchedulerEventModel, resourceRecords: SchedulerResourceModel[], assignmentRecords: SchedulerAssignmentModel[] }) => Promise<boolean>|boolean|void)|string
     /**
-     * Fires before an event is removed. Can be triggered by user pressing [DELETE] or [BACKSPACE] or by the
+     * Fires before an event is removed. Can be triggered by user pressing <kbd>Delete</kbd> or <kbd>Backspace</kbd> or by the
      * event editor. Return `false` to immediately veto the removal (or a `Promise` yielding `true` or `false`
      * for async vetoing).
      * ...
@@ -3252,19 +3252,20 @@ export type BryntumTimelineProps = {
      * @param {Scheduler.model.SchedulerEventModel[]} event.originalEventRecords The event records that were copied
      * @param {Scheduler.model.SchedulerAssignmentModel[]} event.originalAssignmentRecords The assignment records that were copied
      * @param {Date} event.date The paste date
-     * @param {Scheduler.model.SchedulerResourceModel} event.resourceRecord The target resource record
+     * @param {Scheduler.model.SchedulerResourceModel} event.resourceRecord The target resource record. When multiple resources are pasted to, this will be the top resource
+     * @param {Scheduler.model.SchedulerResourceModel[]} event.resourceRecords All target resource records that the events would be pasted to
      * @param {boolean} event.isCut `true` if this is a cut action
      * @param {string} event.entityName 'event' to distinguish this event from other `pasteNotAllowed` events
      * @param {'overlappingEvents','resourceReadOnly'} event.reason A string id to use for displaying an error message to the user.
      */
-    onPasteNotAllowed? : ((event: { source: Scheduler, eventRecords: SchedulerEventModel[], assignmentRecords: SchedulerAssignmentModel[], originalEventRecords: SchedulerEventModel[], originalAssignmentRecords: SchedulerAssignmentModel[], date: Date, resourceRecord: SchedulerResourceModel, isCut: boolean, entityName: string, reason: 'overlappingEvents'|'resourceReadOnly' }) => void)|string
+    onPasteNotAllowed? : ((event: { source: Scheduler, eventRecords: SchedulerEventModel[], assignmentRecords: SchedulerAssignmentModel[], originalEventRecords: SchedulerEventModel[], originalAssignmentRecords: SchedulerAssignmentModel[], date: Date, resourceRecord: SchedulerResourceModel, resourceRecords: SchedulerResourceModel[], isCut: boolean, entityName: string, reason: 'overlappingEvents'|'resourceReadOnly' }) => void)|string
     /**
      * Fires on the owning Grid when export has finished
      * @param {object} event Event object
      * @param {Response} event.response Optional response, if received
      * @param {Error} event.error Optional error, if exception occurred
      */
-    onPdfExport? : ((event: { response?: any, error?: Error }) => void)|string
+    onPdfExport? : ((event: { response?: Response, error?: Error }) => void)|string
     /**
      * Fired after the [viewPreset](https://bryntum.com/products/gantt/docs/api/Scheduler/view/mixin/TimelineViewPresets#config-viewPreset) has changed.
      * @param {object} event Event object
@@ -4067,6 +4068,14 @@ export type BryntumTimelineProps = {
      * @param {Core.widget.Tool} event.tool The tool which is being clicked.
      */
     onToolClick? : ((event: { source: Tool, tool: Tool }) => void)|string
+    /**
+     * Fired on the owning Grid/Scheduler/Gantt after tree grouping levels change
+     * @param {object} event Event object
+     * @param {Grid.view.Grid} event.source The grid instance
+     * @param {(string|Function)[]} event.groupers Array of field names or functions representing the current grouping levels
+     * @param {(string|Function)[]} event.oldGroupers Array of field names or functions representing the previous grouping levels
+     */
+    onTreeGroup? : ((event: { source: Grid, groupers: (string|Function)[], oldGroupers: (string|Function)[] }) => void)|string
     /**
      * Fires when row locking is disabled.
      * @param {object} event Event object
@@ -4126,7 +4135,7 @@ export type BryntumTimelineProps = {
     cellEditFeature? : object|boolean|string|GridCellEdit|GridCellEditConfig
     /**
      * Right click to display context menu for cells. To invoke the cell menu in a keyboard-accessible manner, use the
-     * `SPACE` key when the cell is focused.
+     * <kbd>Space</kbd> key when the cell is focused.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/feature/CellMenu)
      */
@@ -4218,8 +4227,8 @@ export type BryntumTimelineProps = {
      */
     dependencyMenuFeature? : object|boolean|string|DependencyMenu|DependencyMenuConfig
     /**
-     * Allow using <kbd>Ctrl</kbd>/<kbd>CMD</kbd> + <kbd>C</kbd>/<kbd>X</kbd> and <kbd>Ctrl</kbd>/<kbd>CMD</kbd> +
-     * <kbd>V</kbd> to copy/cut and paste events.
+     * Allow using <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>C</kbd>, <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>X</kbd> and
+     * <kbd>Ctrl</kbd>/<kbd>Cmd</kbd>+<kbd>V</kbd> to copy/cut and paste events.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Scheduler/feature/EventCopyPaste)
      */
@@ -4321,8 +4330,8 @@ export type BryntumTimelineProps = {
     filterBarFeature? : object|boolean|string|FilterBar|FilterBarConfig
     /**
      * Enables rendering and handling of row groups. The actual grouping is done in the store, but triggered by
-     * <kbd>shift</kbd> + clicking headers, or by using the context menu, or by using two finger tap (one on header,
-     * one anywhere on grid). Use <kbd>shift</kbd> + <kbd>alt</kbd> + click, or the context menu, to remove a column
+     * <kbd>Shift</kbd> + clicking headers, or by using the context menu, or by using two finger tap (one on header,
+     * one anywhere on grid). Use <kbd>Shift</kbd> + <kbd>Alt</kbd> + click, or the context menu, to remove a column
      * grouper.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/feature/Group)
@@ -5069,6 +5078,7 @@ export class BryntumTimeline extends React.Component<BryntumTimelineProps> {
         'onToggleGroup',
         'onToggleNode',
         'onToolClick',
+        'onTreeGroup',
         'onUnlockRows',
         'onUnsplit',
         'onVisibleDateRangeChange',

package/src/BryntumTimelineHistogram.tsx

@@ -883,7 +883,7 @@ export type BryntumTimelineHistogramProps = {
     rootElement? : ShadowRoot|HTMLElement
     /**
      * Row height in pixels. This allows the default height for rows to be controlled. Note that it may be
-     * overriden by specifying a [rowHeight](https://bryntum.com/products/gantt/docs/api/Grid/data/GridRowModel#field-rowHeight) on a per record basis, or from
+     * overridden by specifying a [rowHeight](https://bryntum.com/products/gantt/docs/api/Grid/data/GridRowModel#field-rowHeight) on a per record basis, or from
      * a column [renderer](https://bryntum.com/products/gantt/docs/api/Grid/column/Column#config-renderer).
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Scheduler/view/TimelineHistogram#config-rowHeight)
@@ -1226,7 +1226,7 @@ export type BryntumTimelineHistogramProps = {
 
     // Events
     /**
-     * Fires before an assignment is removed. Can be triggered by user pressing [DELETE] or [BACKSPACE] or
+     * Fires before an assignment is removed. Can be triggered by user pressing <kbd>Delete</kbd> or <kbd>Backspace</kbd> or
      * by the event editor. Can for example be used to display a custom dialog to confirm deletion, in which
      * case records should be "manually" removed after confirmation:
      * ...
@@ -1263,7 +1263,7 @@ export type BryntumTimelineHistogramProps = {
      */
     onBeforeCellEditStart? : ((event: { source: Grid, editorContext: CellEditorContext }) => Promise<boolean>|boolean|void)|string
     /**
-     * Fires on the owning Grid before deleting a range of selected cell values by pressing `Backspace` or `Del`
+     * Fires on the owning Grid before deleting a range of selected cell values by pressing <kbd>Backspace</kbd> or <kbd>Delete</kbd>
      * buttons while [autoEdit](https://bryntum.com/products/gantt/docs/api/Grid/feature/CellEdit#config-autoEdit) is set to `true`. Return `false` to prevent editing.
      * @param {object} event Event object
      * @param {Grid.view.Grid} event.source Owner grid
@@ -1341,7 +1341,7 @@ export type BryntumTimelineHistogramProps = {
      */
     onBeforeDestroy? : ((event: { source: Base }) => void)|string
     /**
-     * Fires before an event is removed. Can be triggered by user pressing [DELETE] or [BACKSPACE] or by the
+     * Fires before an event is removed. Can be triggered by user pressing <kbd>Delete</kbd> or <kbd>Backspace</kbd> or by the
      * event editor. Return `false` to immediately veto the removal (or a `Promise` yielding `true` or `false`
      * for async vetoing).
      * ...
@@ -2129,7 +2129,7 @@ export type BryntumTimelineHistogramProps = {
      * @param {Response} event.response Optional response, if received
      * @param {Error} event.error Optional error, if exception occurred
      */
-    onPdfExport? : ((event: { response?: any, error?: Error }) => void)|string
+    onPdfExport? : ((event: { response?: Response, error?: Error }) => void)|string
     /**
      * Fired after the [viewPreset](https://bryntum.com/products/gantt/docs/api/Scheduler/view/mixin/TimelineViewPresets#config-viewPreset) has changed.
      * @param {object} event Event object
@@ -2587,6 +2587,14 @@ export type BryntumTimelineHistogramProps = {
      * @param {Core.widget.Tool} event.tool The tool which is being clicked.
      */
     onToolClick? : ((event: { source: Tool, tool: Tool }) => void)|string
+    /**
+     * Fired on the owning Grid/Scheduler/Gantt after tree grouping levels change
+     * @param {object} event Event object
+     * @param {Grid.view.Grid} event.source The grid instance
+     * @param {(string|Function)[]} event.groupers Array of field names or functions representing the current grouping levels
+     * @param {(string|Function)[]} event.oldGroupers Array of field names or functions representing the previous grouping levels
+     */
+    onTreeGroup? : ((event: { source: Grid, groupers: (string|Function)[], oldGroupers: (string|Function)[] }) => void)|string
     /**
      * Fires when row locking is disabled.
      * @param {object} event Event object
@@ -2646,7 +2654,7 @@ export type BryntumTimelineHistogramProps = {
     cellEditFeature? : object|boolean|string|GridCellEdit|GridCellEditConfig
     /**
      * Right click to display context menu for cells. To invoke the cell menu in a keyboard-accessible manner, use the
-     * `SPACE` key when the cell is focused.
+     * <kbd>Space</kbd> key when the cell is focused.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/feature/CellMenu)
      */
@@ -2754,8 +2762,8 @@ export type BryntumTimelineHistogramProps = {
     filterBarFeature? : object|boolean|string|FilterBar|FilterBarConfig
     /**
      * Enables rendering and handling of row groups. The actual grouping is done in the store, but triggered by
-     * <kbd>shift</kbd> + clicking headers, or by using the context menu, or by using two finger tap (one on header,
-     * one anywhere on grid). Use <kbd>shift</kbd> + <kbd>alt</kbd> + click, or the context menu, to remove a column
+     * <kbd>Shift</kbd> + clicking headers, or by using the context menu, or by using two finger tap (one on header,
+     * one anywhere on grid). Use <kbd>Shift</kbd> + <kbd>Alt</kbd> + click, or the context menu, to remove a column
      * grouper.
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/feature/Group)
@@ -3364,6 +3372,7 @@ export class BryntumTimelineHistogram extends React.Component<BryntumTimelineHis
         'onToggleGroup',
         'onToggleNode',
         'onToolClick',
+        'onTreeGroup',
         'onUnlockRows',
         'onUnsplit',
         'onVisibleDateRangeChange',

package/src/BryntumTreeCombo.tsx

@@ -181,7 +181,7 @@ export type BryntumTreeComboProps = {
     contentElementCls? : string|object
     /**
      * If configured as `true`, this means that when an unmatched string is typed into the
-     * combo's input field, and `ENTER`, or the [multiValueSeparator](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-multiValueSeparator) is typed,
+     * combo's input field, and <kbd>Enter</kbd>, or the [multiValueSeparator](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-multiValueSeparator) is typed,
      * a new record will be created using the typed string as the [displayField](https://bryntum.com/products/gantt/docs/api/Core/widget/Combo#config-displayField).
      * ...
      * [View online docs...](https://bryntum.com/products/gantt/docs/api/Grid/widget/TreeCombo#config-createOnUnmatched)
@@ -676,7 +676,7 @@ export type BryntumTreeComboProps = {
     required? : boolean
     /**
      * If this field is not [readOnly](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-readOnly), then setting this option means that pressing
-     * the `ESCAPE` key after editing the field will revert the field to the value it had when
+     * the <kbd>Escape</kbd> key after editing the field will revert the field to the value it had when
      * the user focused the field. If the field is *not* changed from when focused, the [clearable](https://bryntum.com/products/gantt/docs/api/Core/widget/Field#config-clearable)
      * behaviour will be activated.
      */