telerik / kendo-angular

Issue tracker - Kendo UI for Angular
http://www.telerik.com/kendo-angular-ui/
Other
466 stars 215 forks source link

[Splitter] Programmatically hiding the right panel doesn't allow the left panel to take up free space #4369

Open yanmariomenev opened 1 month ago

yanmariomenev commented 1 month ago

Describe the bug This is related to version 16.4.0 - https://github.com/telerik/kendo-angular/issues/4304

When you resize a pane and then collapse it, the remaining pane does not occupy the full space of the splitter.

https://github.com/user-attachments/assets/e9d52b25-758e-407b-a8b2-721781f0425f The first pane behavior is in v16.4.0 and the second in v16.3.0 (example).

To Reproduce Open the following demo: https://stackblitz.com/edit/angular-m7fxze-sgqntw?file=src%2Fapp%2Fapp.component.ts Resize the pane and collapse it using the button.

A second version to reproduce the behavior when resizing the Splitter:

  1. Open https://stackblitz.com/edit/splitter-behavior-lrmz6w You will see two panes with a splitter in the middle.
  2. Resize the application window to make it larger. Notice that both panes resize appropriately.
  3. Resize the application window to make it smaller again. Again both panes resize appropriately.
  4. Move the pane splitter so that the width of the green/right pane is smaller.
  5. Resize the application window to make it larger. Note that the red background appears due to the panes not resizing to take up the available space.
ian-nitro commented 1 month ago

Hi,

We discovered a related issue in version 16.3.0.

  1. Open https://stackblitz.com/edit/splitter-size-collapse
  2. Click the collapse button. Note the yellow pane collapses as expected. However the green pane does not fill the remaining space as demonstrated by the red background.
  3. Remove the size attribute from the second kendo-splitter-pane.
  4. Click collapse. Note that the green pane now fills the remaining space.