diff --git a/components/lib/splitter/Splitter.d.ts b/components/lib/splitter/Splitter.d.ts index b9f1e0ccf..a308cae67 100644 --- a/components/lib/splitter/Splitter.d.ts +++ b/components/lib/splitter/Splitter.d.ts @@ -55,6 +55,21 @@ export interface SplitterResizeStartEvent { sizes: number[]; } +/** + * Custom resize event. + * @see {@link SplitterEmits.resize} + */ +export interface SplitterResizeEvent { + /** + * Browser event + */ + originalEvent: Event; + /** + * Sizes of the panels + */ + sizes: number[]; +} + /** * Custom resize end event. * @see {@link SplitterEmits.resizeend} @@ -185,6 +200,11 @@ export interface SplitterEmits { * @param {SplitterResizeStartEvent} event - Custom resize start event. */ resizestart(event: SplitterResizeStartEvent): void; + /** + * Callback to invoke during the resizing process. + * @param {SplitterResizeEvent} event - Custom resize event. + */ + resize(event: SplitterResizeEvent): void; /** * Callback to invoke when resize ends. * @param {SplitterResizeEndEvent} event - Custom resize end event. diff --git a/components/lib/splitter/Splitter.vue b/components/lib/splitter/Splitter.vue index 4d3a5a9ea..48693d4dc 100644 --- a/components/lib/splitter/Splitter.vue +++ b/components/lib/splitter/Splitter.vue @@ -28,7 +28,7 @@ import BaseSplitter from './BaseSplitter.vue'; export default { name: 'Splitter', extends: BaseSplitter, - emits: ['resizestart', 'resizeend'], + emits: ['resizestart', 'resizeend', 'resize'], dragging: false, mouseMoveListener: null, mouseUpListener: null, @@ -141,6 +141,8 @@ export default { this.panelSizes[this.prevPanelIndex] = newPrevPanelSize; this.panelSizes[this.prevPanelIndex + 1] = newNextPanelSize; } + + this.$emit('resize', { originalEvent: event, sizes: this.panelSizes }); }, onResizeEnd(event) { if (this.isStateful()) { diff --git a/doc/common/apidoc/index.json b/doc/common/apidoc/index.json index e41b00b20..0bd5ae05f 100644 --- a/doc/common/apidoc/index.json +++ b/doc/common/apidoc/index.json @@ -45040,9 +45040,9 @@ ], "methods": [] }, - "SplitterResizeEndEvent": { - "description": "Custom resize end event.", - "relatedProp": "SplitterEmits.resizeend", + "SplitterResizeEvent": { + "description": "Custom resize event.", + "relatedProp": "SplitterEmits.resize", "props": [ { "name": "originalEvent", @@ -45058,7 +45058,7 @@ "readonly": false, "type": "number[]", "default": "", - "description": "Sizes of the panels" + "description": "Sizes of the panels during resize" } ], "methods": [] @@ -45247,6 +45247,19 @@ "returnType": "void", "description": "Callback to invoke when resize starts." }, + { + "name": "resize", + "parameters": [ + { + "name": "event", + "optional": false, + "type": "SplitterResizeEvent", + "description": "Custom resize event." + } + ], + "returnType": "void", + "description": "Callback to invoke during the resizing process." + }, { "name": "resizeend", "parameters": [