fix(circle-toggle): addition check error state from group (#1197)

* fix(circle-toggle): addition check error state from group * fix(circle-toggle): add test * fix(circle-toggle): remove unused style
allianz · May 29, 2024 · 01e518f · 01e518f
1 parent 5e6bca0
commit 01e518f
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 7 deletions.
diff --git a/projects/ng-aquila/src/circle-toggle/circle-toggle-group/circle-toggle-group.component.scss b/projects/ng-aquila/src/circle-toggle/circle-toggle-group/circle-toggle-group.component.scss
@@ -18,9 +18,3 @@
         flex-direction: row;
     }
 }
-
-:host(.has-error) {
-    ::ng-deep .nx-toggle-circle__icon-wrapper {
-        border-color: v(danger);
-    }
-}
diff --git a/...cts/ng-aquila/src/circle-toggle/circle-toggle-group/circle-toggle-group.component.spec.ts b/...cts/ng-aquila/src/circle-toggle/circle-toggle-group/circle-toggle-group.component.spec.ts
@@ -94,8 +94,13 @@ describe('NxToggleButtonGroup', () => {
         reactComp.testGroup.controls.reactiveToggle.setValue(null);
         reactComp.testGroup.markAllAsTouched();
         fixture.detectChanges();
+        const children = fixture.nativeElement.querySelectorAll('.nx-toggle-circle');
+
         tick();
 
+        children.forEach((child: any) => {
+            expect(child).toHaveClass('has-error');
+        });
         expect(toggleComponent.errorState).toBeTrue();
     }));
 

diff --git a/projects/ng-aquila/src/circle-toggle/circle-toggle/circle-toggle.component.ts b/projects/ng-aquila/src/circle-toggle/circle-toggle/circle-toggle.component.ts
@@ -53,7 +53,7 @@ let nextId = 0;
         '[class.in-group]': 'inGroup',
         '[class.is-disabled]': 'disabled',
         '[class.is-responsive]': 'responsive',
-        '[class.has-error]': 'errorState',
+        '[class.has-error]': 'toggleGroup?.errorState || errorState',
     },
 })
 export class NxCircleToggleComponent extends ToggleButton implements OnDestroy, AfterViewInit, ControlValueAccessor, DoCheck {