@bryntum/scheduler-vue-3-thin 7.1.2 → 7.1.3

package/src/components/BryntumSchedulerBase.vue

@@ -2299,6 +2299,18 @@ const emit = defineEmits<{
      * @param {any} params.params.event.value The value being set
      */
     (e: 'beforeCellRangeEdit', params: ((event: { record: Model, field: string, value: any }) => Promise<boolean>|boolean|void)|string): Promise<boolean>|boolean|void
+    /**
+     * This event is triggered before a parent column is collapsed or expanded.
+     * @param {string} e Event name
+     * @param {object} params Event parameters
+     * @param {string} params.e Event name
+     * @param {object} params.params Event parameters
+     * @param {object} params.params.event Event object
+     * @param {Grid.view.GridBase} params.params.event.source The grid instance
+     * @param {Grid.column.Column} params.params.event.column The column
+     * @param {boolean} params.params.event.collapsed `true` if the column is being collapsed, `false` if expanded
+     */
+    (e: 'beforeColumnCollapseToggle', params: ((event: { source: GridBase, column: Column, collapsed: boolean }) => void)|string): void
     /**
      * This event is fired prior to starting a column drag gesture. The drag is canceled if a listener returns `false`.
      * @param {string} e Event name
@@ -2820,12 +2832,12 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance.
-     * @param {Grid.row.Row} params.params.event.row The row about to be rendered.
-     * @param {Core.data.Model} params.params.event.record The record for the row.
-     * @param {number} params.params.event.recordIndex The zero-based index of the record.
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance
+     * @param {Grid.row.Row} params.params.event.row The row about to be rendered
+     * @param {Core.data.Model} params.params.event.record The record for the row
+     * @param {number} params.params.event.recordIndex The zero-based index of the record
      */
-    (e: 'beforeRenderRow', params: ((event: { source: Grid, row: Row, record: Model, recordIndex: number }) => void)|string): void
+    (e: 'beforeRenderRow', params: ((event: { source: GridBase, row: Row, record: Model, recordIndex: number }) => void)|string): void
     /**
      * Grid rows are about to be rendered
      * @param {string} e Event name
@@ -2833,9 +2845,9 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source This grid.
+     * @param {Grid.view.GridBase} params.params.event.source This grid.
      */
-    (e: 'beforeRenderRows', params: ((event: { source: Grid }) => void)|string): void
+    (e: 'beforeRenderRows', params: ((event: { source: GridBase }) => void)|string): void
     /**
      * This event fires before row collapse is started.
      * ...
@@ -3192,6 +3204,18 @@ const emit = defineEmits<{
      * @param {Core.data.Model} params.params.event.record The record which has been collapsed.
      */
     (e: 'collapseNode', params: ((event: { source: Grid, record: Model }) => void)|string): void
+    /**
+     * This event is triggered after a parent column has been collapsed or expanded.
+     * @param {string} e Event name
+     * @param {object} params Event parameters
+     * @param {string} params.e Event name
+     * @param {object} params.params Event parameters
+     * @param {object} params.params.event Event object
+     * @param {Grid.view.GridBase} params.params.event.source The Grid instance
+     * @param {Grid.column.Column} params.params.event.column The column being toggled
+     * @param {boolean} params.params.event.collapsed `true` if the column is now collapsed, `false` if expanded
+     */
+    (e: 'columnCollapseToggle', params: ((event: { source: GridBase, column: Column, collapsed: boolean }) => void)|string): void
     /**
      * This event is fired when a column is being dragged, and you can set the `valid` flag on the `context` object
      * to indicate whether the drop position is valid or not.
@@ -3320,14 +3344,14 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source Owning grid
+     * @param {Grid.view.GridBase} params.params.event.source Owning grid
      * @param {Core.data.Store} params.params.event.store The originating store
      * @param {'remove','removeAll','add','clearchanges','filter','update','dataset','replace'} params.params.event.action Name of action which triggered the change. May be one of:  * `'remove'` * `'removeAll'` * `'add'` * `'clearchanges'` * `'filter'` * `'update'` * `'dataset'` * `'replace'`
      * @param {Core.data.Model} params.params.event.record Changed record, for actions that affects exactly one record (`'update'`)
      * @param {Core.data.Model[]} params.params.event.records Changed records, passed for all actions except `'removeAll'`
      * @param {object} params.params.event.changes Passed for the `'update'` action, info on which record fields changed
      */
-    (e: 'dataChange', params: ((event: { source: Grid, store: Store, action: 'remove'|'removeAll'|'add'|'clearchanges'|'filter'|'update'|'dataset'|'replace', record: Model, records: Model[], changes: object }) => void)|string): void
+    (e: 'dataChange', params: ((event: { source: GridBase, store: Store, action: 'remove'|'removeAll'|'add'|'clearchanges'|'filter'|'update'|'dataset'|'replace', record: Model, records: Model[], changes: object }) => void)|string): void
     /**
      * Fired when the range of dates encapsulated by the UI changes. This will be when
      * moving a view in time by reconfiguring its [timeAxis](https://bryntum.com/products/scheduler/docs/api/Scheduler/view/TimelineBase#config-timeAxis). This will happen
@@ -4518,12 +4542,12 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance.
-     * @param {Grid.row.Row} params.params.event.row The row that has been rendered.
-     * @param {Core.data.Model} params.params.event.record The record for the row.
-     * @param {number} params.params.event.recordIndex The zero-based index of the record.
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance
+     * @param {Grid.row.Row} params.params.event.row The row that has been rendered
+     * @param {Core.data.Model} params.params.event.record The record for the row
+     * @param {number} params.params.event.recordIndex The zero-based index of the record
      */
-    (e: 'renderRow', params: ((event: { source: Grid, row: Row, record: Model, recordIndex: number }) => void)|string): void
+    (e: 'renderRow', params: ((event: { source: GridBase, row: Row, record: Model, recordIndex: number }) => void)|string): void
     /**
      * Grid rows have been rendered
      * @param {string} e Event name
@@ -4531,9 +4555,9 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source This grid.
+     * @param {Grid.view.GridBase} params.params.event.source This grid.
      */
-    (e: 'renderRows', params: ((event: { source: Grid }) => void)|string): void
+    (e: 'renderRows', params: ((event: { source: GridBase }) => void)|string): void
     /**
      * Fired when the encapsulating element of a Widget resizes *only when [monitorResize](https://bryntum.com/products/scheduler/docs/api/Core/widget/Widget#config-monitorResize) is `true`*.
      * @param {string} e Event name
@@ -5003,10 +5027,10 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance.
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance.
      * @param {number} params.params.event.scrollTop The vertical scroll position.
      */
-    (e: 'scroll', params: ((event: { source: Grid, scrollTop: number }) => void)|string): void
+    (e: 'scroll', params: ((event: { source: GridBase, scrollTop: number }) => void)|string): void
     /**
      * Fires on owner when the scroll button is clicked, return `false` to prevent default scroll behavior
      * @param {string} e Event name
@@ -5162,10 +5186,10 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance
      * @param {Grid.view.SubGrid} params.params.event.subGrid The sub grid instance
      */
-    (e: 'subGridCollapse', params: ((event: { source: Grid, subGrid: SubGrid }) => void)|string): void
+    (e: 'subGridCollapse', params: ((event: { source: GridBase, subGrid: SubGrid }) => void)|string): void
     /**
      * Fires after a sub grid is expanded.
      * @param {string} e Event name
@@ -5173,10 +5197,10 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance
      * @param {Grid.view.SubGrid} params.params.event.subGrid The sub grid instance
      */
-    (e: 'subGridExpand', params: ((event: { source: Grid, subGrid: SubGrid }) => void)|string): void
+    (e: 'subGridExpand', params: ((event: { source: GridBase, subGrid: SubGrid }) => void)|string): void
     /**
      * Triggered for click on a tick cell. Only triggered if the TreeSummary feature is configured with
      * `[enableMouseEvents](https://bryntum.com/products/scheduler/docs/api/Scheduler/feature/TreeSummary#config-enableMouseEvents): true`.
@@ -5829,6 +5853,7 @@ const widgetData = {
         'onBeforeCellEditStart',
         'onBeforeCellRangeDelete',
         'onBeforeCellRangeEdit',
+        'onBeforeColumnCollapseToggle',
         'onBeforeColumnDragStart',
         'onBeforeColumnDropFinalize',
         'onBeforeColumnResize',
@@ -5894,6 +5919,7 @@ const widgetData = {
         'onCellMouseOver',
         'onCollapse',
         'onCollapseNode',
+        'onColumnCollapseToggle',
         'onColumnDrag',
         'onColumnDragStart',
         'onColumnDrop',
@@ -6152,6 +6178,7 @@ const widgetData = {
         'beforeCellEditStart',
         'beforeCellRangeDelete',
         'beforeCellRangeEdit',
+        'beforeColumnCollapseToggle',
         'beforeColumnDragStart',
         'beforeColumnDropFinalize',
         'beforeColumnResize',
@@ -6217,6 +6244,7 @@ const widgetData = {
         'cellMouseOver',
         'collapse',
         'collapseNode',
+        'columnCollapseToggle',
         'columnDrag',
         'columnDragStart',
         'columnDrop',

package/src/components/BryntumTimelineHistogram.vue

@@ -1676,6 +1676,18 @@ const emit = defineEmits<{
      * @param {any} params.params.event.value The value being set
      */
     (e: 'beforeCellRangeEdit', params: ((event: { record: Model, field: string, value: any }) => Promise<boolean>|boolean|void)|string): Promise<boolean>|boolean|void
+    /**
+     * This event is triggered before a parent column is collapsed or expanded.
+     * @param {string} e Event name
+     * @param {object} params Event parameters
+     * @param {string} params.e Event name
+     * @param {object} params.params Event parameters
+     * @param {object} params.params.event Event object
+     * @param {Grid.view.GridBase} params.params.event.source The grid instance
+     * @param {Grid.column.Column} params.params.event.column The column
+     * @param {boolean} params.params.event.collapsed `true` if the column is being collapsed, `false` if expanded
+     */
+    (e: 'beforeColumnCollapseToggle', params: ((event: { source: GridBase, column: Column, collapsed: boolean }) => void)|string): void
     /**
      * This event is fired prior to starting a column drag gesture. The drag is canceled if a listener returns `false`.
      * @param {string} e Event name
@@ -1926,12 +1938,12 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance.
-     * @param {Grid.row.Row} params.params.event.row The row about to be rendered.
-     * @param {Core.data.Model} params.params.event.record The record for the row.
-     * @param {number} params.params.event.recordIndex The zero-based index of the record.
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance
+     * @param {Grid.row.Row} params.params.event.row The row about to be rendered
+     * @param {Core.data.Model} params.params.event.record The record for the row
+     * @param {number} params.params.event.recordIndex The zero-based index of the record
      */
-    (e: 'beforeRenderRow', params: ((event: { source: Grid, row: Row, record: Model, recordIndex: number }) => void)|string): void
+    (e: 'beforeRenderRow', params: ((event: { source: GridBase, row: Row, record: Model, recordIndex: number }) => void)|string): void
     /**
      * Grid rows are about to be rendered
      * @param {string} e Event name
@@ -1939,9 +1951,9 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source This grid.
+     * @param {Grid.view.GridBase} params.params.event.source This grid.
      */
-    (e: 'beforeRenderRows', params: ((event: { source: Grid }) => void)|string): void
+    (e: 'beforeRenderRows', params: ((event: { source: GridBase }) => void)|string): void
     /**
      * This event fires before row collapse is started.
      * ...
@@ -2272,6 +2284,18 @@ const emit = defineEmits<{
      * @param {Core.data.Model} params.params.event.record The record which has been collapsed.
      */
     (e: 'collapseNode', params: ((event: { source: Grid, record: Model }) => void)|string): void
+    /**
+     * This event is triggered after a parent column has been collapsed or expanded.
+     * @param {string} e Event name
+     * @param {object} params Event parameters
+     * @param {string} params.e Event name
+     * @param {object} params.params Event parameters
+     * @param {object} params.params.event Event object
+     * @param {Grid.view.GridBase} params.params.event.source The Grid instance
+     * @param {Grid.column.Column} params.params.event.column The column being toggled
+     * @param {boolean} params.params.event.collapsed `true` if the column is now collapsed, `false` if expanded
+     */
+    (e: 'columnCollapseToggle', params: ((event: { source: GridBase, column: Column, collapsed: boolean }) => void)|string): void
     /**
      * This event is fired when a column is being dragged, and you can set the `valid` flag on the `context` object
      * to indicate whether the drop position is valid or not.
@@ -2400,14 +2424,14 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source Owning grid
+     * @param {Grid.view.GridBase} params.params.event.source Owning grid
      * @param {Core.data.Store} params.params.event.store The originating store
      * @param {'remove','removeAll','add','clearchanges','filter','update','dataset','replace'} params.params.event.action Name of action which triggered the change. May be one of:  * `'remove'` * `'removeAll'` * `'add'` * `'clearchanges'` * `'filter'` * `'update'` * `'dataset'` * `'replace'`
      * @param {Core.data.Model} params.params.event.record Changed record, for actions that affects exactly one record (`'update'`)
      * @param {Core.data.Model[]} params.params.event.records Changed records, passed for all actions except `'removeAll'`
      * @param {object} params.params.event.changes Passed for the `'update'` action, info on which record fields changed
      */
-    (e: 'dataChange', params: ((event: { source: Grid, store: Store, action: 'remove'|'removeAll'|'add'|'clearchanges'|'filter'|'update'|'dataset'|'replace', record: Model, records: Model[], changes: object }) => void)|string): void
+    (e: 'dataChange', params: ((event: { source: GridBase, store: Store, action: 'remove'|'removeAll'|'add'|'clearchanges'|'filter'|'update'|'dataset'|'replace', record: Model, records: Model[], changes: object }) => void)|string): void
     /**
      * Fired when the range of dates encapsulated by the UI changes. This will be when
      * moving a view in time by reconfiguring its [timeAxis](https://bryntum.com/products/scheduler/docs/api/Scheduler/view/TimelineBase#config-timeAxis). This will happen
@@ -2917,12 +2941,12 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance.
-     * @param {Grid.row.Row} params.params.event.row The row that has been rendered.
-     * @param {Core.data.Model} params.params.event.record The record for the row.
-     * @param {number} params.params.event.recordIndex The zero-based index of the record.
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance
+     * @param {Grid.row.Row} params.params.event.row The row that has been rendered
+     * @param {Core.data.Model} params.params.event.record The record for the row
+     * @param {number} params.params.event.recordIndex The zero-based index of the record
      */
-    (e: 'renderRow', params: ((event: { source: Grid, row: Row, record: Model, recordIndex: number }) => void)|string): void
+    (e: 'renderRow', params: ((event: { source: GridBase, row: Row, record: Model, recordIndex: number }) => void)|string): void
     /**
      * Grid rows have been rendered
      * @param {string} e Event name
@@ -2930,9 +2954,9 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source This grid.
+     * @param {Grid.view.GridBase} params.params.event.source This grid.
      */
-    (e: 'renderRows', params: ((event: { source: Grid }) => void)|string): void
+    (e: 'renderRows', params: ((event: { source: GridBase }) => void)|string): void
     /**
      * Fired when the encapsulating element of a Widget resizes *only when [monitorResize](https://bryntum.com/products/scheduler/docs/api/Core/widget/Widget#config-monitorResize) is `true`*.
      * @param {string} e Event name
@@ -3182,10 +3206,10 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance.
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance.
      * @param {number} params.params.event.scrollTop The vertical scroll position.
      */
-    (e: 'scroll', params: ((event: { source: Grid, scrollTop: number }) => void)|string): void
+    (e: 'scroll', params: ((event: { source: GridBase, scrollTop: number }) => void)|string): void
     /**
      * The selection has been changed.
      * @param {string} e Event name
@@ -3317,10 +3341,10 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance
      * @param {Grid.view.SubGrid} params.params.event.subGrid The sub grid instance
      */
-    (e: 'subGridCollapse', params: ((event: { source: Grid, subGrid: SubGrid }) => void)|string): void
+    (e: 'subGridCollapse', params: ((event: { source: GridBase, subGrid: SubGrid }) => void)|string): void
     /**
      * Fires after a sub grid is expanded.
      * @param {string} e Event name
@@ -3328,10 +3352,10 @@ const emit = defineEmits<{
      * @param {string} params.e Event name
      * @param {object} params.params Event parameters
      * @param {object} params.params.event Event object
-     * @param {Grid.view.Grid} params.params.event.source The firing Grid instance
+     * @param {Grid.view.GridBase} params.params.event.source The firing Grid instance
      * @param {Grid.view.SubGrid} params.params.event.subGrid The sub grid instance
      */
-    (e: 'subGridExpand', params: ((event: { source: Grid, subGrid: SubGrid }) => void)|string): void
+    (e: 'subGridExpand', params: ((event: { source: GridBase, subGrid: SubGrid }) => void)|string): void
     /**
      * Fired when the tick size changes.
      * ...
@@ -3798,6 +3822,7 @@ const widgetData = {
         'onBeforeCellEditStart',
         'onBeforeCellRangeDelete',
         'onBeforeCellRangeEdit',
+        'onBeforeColumnCollapseToggle',
         'onBeforeColumnDragStart',
         'onBeforeColumnDropFinalize',
         'onBeforeColumnResize',
@@ -3844,6 +3869,7 @@ const widgetData = {
         'onCellMouseOver',
         'onCollapse',
         'onCollapseNode',
+        'onColumnCollapseToggle',
         'onColumnDrag',
         'onColumnDragStart',
         'onColumnDrop',
@@ -3999,6 +4025,7 @@ const widgetData = {
         'beforeCellEditStart',
         'beforeCellRangeDelete',
         'beforeCellRangeEdit',
+        'beforeColumnCollapseToggle',
         'beforeColumnDragStart',
         'beforeColumnDropFinalize',
         'beforeColumnResize',
@@ -4045,6 +4072,7 @@ const widgetData = {
         'cellMouseOver',
         'collapse',
         'collapseNode',
+        'columnCollapseToggle',
         'columnDrag',
         'columnDragStart',
         'columnDrop',

package/src/helper/WrapperHelper.ts

@@ -469,9 +469,13 @@ export class WrapperHelper {
                 isRecurring = eventRecord.isRecurring || eventRecord.isOccurrence,
                 key         = `assignment-${assignmentRecord?.id}${isRecurring ? '-' + eventRecord.id : ''}`;
 
-            if (wrap.vueKey) {
+            // Only delete the teleport if it's rendering into this specific targetElement.
+            // Prevents issues when elements are reused during scrolling with LockRows feature.
+            if (wrap.vueKey && teleports.get(wrap.vueKey)?.to === targetElement) {
+                // Only delete if the existing teleport is rendering into this specific targetElement
                 teleports.delete(wrap.vueKey);
             }
+
             const
                 bind            = { ...rendererConfig },
                 { is, on = {} } = bind;