From 9864b182023dc0b18b827e2fa79e399f3e9a45d3 Mon Sep 17 00:00:00 2001
From: Ivan Kitanov <IKitanov@infragistics.com>
Date: Thu, 27 Feb 2025 18:19:45 +0200
Subject: [PATCH 1/2] fix(splitter): Sizing panes corectly with minSize and the
 browser is shrinked

---
 .../lib/splitter/splitter.component.spec.ts   | 71 ++++++++++++++++++-
 .../src/lib/splitter/splitter.component.ts    | 12 +++-
 2 files changed, 80 insertions(+), 3 deletions(-)

diff --git a/projects/igniteui-angular/src/lib/splitter/splitter.component.spec.ts b/projects/igniteui-angular/src/lib/splitter/splitter.component.spec.ts
index 8f233d27635..dbaeb3d8efd 100644
--- a/projects/igniteui-angular/src/lib/splitter/splitter.component.spec.ts
+++ b/projects/igniteui-angular/src/lib/splitter/splitter.component.spec.ts
@@ -21,7 +21,7 @@ describe('IgxSplitter', () => {
 }).compileComponents()));
     let fixture: ComponentFixture<SplitterTestComponent>;
     let splitter: IgxSplitterComponent;
-    
+
     beforeEach(waitForAsync(() => {
         fixture = TestBed.createComponent(SplitterTestComponent);
         fixture.detectChanges();
@@ -462,6 +462,75 @@ describe('IgxSplitter pane collapse', () => {
     });
 });
 
+describe('IgxSplitter resizing with minSize and browser window is shrinked', () => {
+    configureTestSuite();
+    beforeAll(waitForAsync(() => TestBed.configureTestingModule({
+        imports: [
+            SplitterMinSiezComponent
+        ]
+    }).compileComponents()));
+
+    let fixture; let splitter;
+    beforeEach(waitForAsync(() => {
+        fixture = TestBed.createComponent(SplitterMinSiezComponent);
+        fixture.detectChanges();
+        splitter = fixture.componentInstance.splitter;
+    }));
+
+    it('should set the correct sizes when the user drags one pane to the end of another', () => {
+        const pane1 = splitter.panes.toArray()[0];
+        const pane2 = splitter.panes.toArray()[1];
+        const splitterBarComponent = fixture.debugElement.query(By.css(SPLITTERBAR_CLASS)).context;
+        const minSize = parseInt(pane1.minSize);
+        spyOn(splitter, 'onMoveEnd').and.callThrough();
+
+        pane1.size = (splitter.getTotalSize() - parseInt(pane2.size)) + 'px';
+        fixture.detectChanges();
+
+        splitterBarComponent.moveStart.emit(pane1);
+        fixture.detectChanges();
+        splitterBarComponent.movingEnd.emit(splitter.getTotalSize() -minSize);
+        fixture.detectChanges();
+
+        spyOnProperty(window, 'innerWidth', 'get').and.returnValue(500);
+        window.dispatchEvent(new Event('resize'));
+        splitter.elementRef.nativeElement.style.width = '500px';
+        pane2.size = (splitter.getTotalSize() - minSize) + 'px';
+        fixture.detectChanges();
+
+        splitterBarComponent.moveStart.emit(pane1);
+        fixture.detectChanges();
+        splitterBarComponent.movingEnd.emit(-400);
+        fixture.detectChanges();
+
+        const isFullSize = pane1.size === '100%' || pane1.size === (splitter.getTotalSize() + 'px');
+
+        expect(splitter.onMoveEnd).toHaveBeenCalled();
+        expect(isFullSize).toBeTruthy();
+    });
+});
+
+@Component({
+    template: `
+    <igx-splitter>
+    <igx-splitter-pane minSize="200px">
+        <div>
+           Pane 1
+        </div>
+    </igx-splitter-pane>
+    <igx-splitter-pane size="200px">
+        <div>
+            Pane 2
+         </div>
+    </igx-splitter-pane>
+</igx-splitter>
+    `,
+    imports: [IgxSplitterComponent, IgxSplitterPaneComponent]
+})
+export class SplitterMinSiezComponent {
+    @ViewChild(IgxSplitterComponent, { static: true })
+    public splitter: IgxSplitterComponent;
+}
 @Component({
     template: `
     <igx-splitter [type]="type">
diff --git a/projects/igniteui-angular/src/lib/splitter/splitter.component.ts b/projects/igniteui-angular/src/lib/splitter/splitter.component.ts
index 812b6e8a2f7..d60069ec3fe 100644
--- a/projects/igniteui-angular/src/lib/splitter/splitter.component.ts
+++ b/projects/igniteui-angular/src/lib/splitter/splitter.component.ts
@@ -178,7 +178,7 @@ export class IgxSplitterComponent implements AfterContentInit {
     /**
      * Sets the visibility of the handle and expanders in the splitter bar.
      * False by default
-     * 
+     *
      * @example
      * ```html
      * <igx-splitter [nonCollapsible]='true'>
@@ -240,7 +240,15 @@ export class IgxSplitterComponent implements AfterContentInit {
     }
 
     public onMoveEnd(delta: number) {
-        const [ paneSize, siblingSize ] = this.calcNewSizes(delta);
+        let [ paneSize, siblingSize ] = this.calcNewSizes(delta);
+
+        if (paneSize + siblingSize > this.getTotalSize() && delta < 0) {
+            paneSize = this.getTotalSize();
+            siblingSize = 0;
+        } else if(paneSize + siblingSize > this.getTotalSize() && delta > 0) {
+            paneSize = 0;
+            siblingSize = this.getTotalSize();
+        }
 
         if (this.pane.isPercentageSize) {
             // handle % resizes

From 2f0c9ef215a040492cb657ebe58a7c914ed3bb08 Mon Sep 17 00:00:00 2001
From: IvanKitanov17 <ikitanov117@gmail.com>
Date: Fri, 28 Feb 2025 11:58:17 +0200
Subject: [PATCH 2/2] chore(splitter): Adding standalone to
 SplitterMinSiezComponent

---
 .../src/lib/splitter/splitter.component.spec.ts                | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/projects/igniteui-angular/src/lib/splitter/splitter.component.spec.ts b/projects/igniteui-angular/src/lib/splitter/splitter.component.spec.ts
index dbaeb3d8efd..0a96d876bec 100644
--- a/projects/igniteui-angular/src/lib/splitter/splitter.component.spec.ts
+++ b/projects/igniteui-angular/src/lib/splitter/splitter.component.spec.ts
@@ -492,8 +492,6 @@ describe('IgxSplitter resizing with minSize and browser window is shrinked', ()
         splitterBarComponent.movingEnd.emit(splitter.getTotalSize() -minSize);
         fixture.detectChanges();
 
-        spyOnProperty(window, 'innerWidth', 'get').and.returnValue(500);
-        window.dispatchEvent(new Event('resize'));
         splitter.elementRef.nativeElement.style.width = '500px';
         pane2.size = (splitter.getTotalSize() - minSize) + 'px';
         fixture.detectChanges();
@@ -525,6 +523,7 @@ describe('IgxSplitter resizing with minSize and browser window is shrinked', ()
     </igx-splitter-pane>
 </igx-splitter>
     `,
+    standalone: true,
     imports: [IgxSplitterComponent, IgxSplitterPaneComponent]
 })
 export class SplitterMinSiezComponent {