From 109e03170bc725de4deb96b68072605c7494a5bd Mon Sep 17 00:00:00 2001 From: "marco.spasiano" Date: Sat, 29 Jun 2024 17:00:12 +0200 Subject: [PATCH 1/3] feat: added output event --- .../tab/tab-container/tab-container.component.html | 3 ++- .../tab/tab-container/tab-container.component.ts | 13 +++++++++++++ 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.html b/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.html index 65ba0329..af877618 100644 --- a/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.html +++ b/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.html @@ -10,7 +10,8 @@ [class.active]="tab.active" [class.disabled]="tab.disabled" [attr.href]="'#' + tab.id + '-tab'" - [attr.aria-controls]="tab.id + '-tab'"> + [attr.aria-controls]="tab.id + '-tab'" + (click)="onTab(tab)"> @if (tab.icon) { } diff --git a/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.ts b/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.ts index 98064dd8..be5e6dc9 100644 --- a/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.ts +++ b/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.ts @@ -4,8 +4,10 @@ import { Component, ContentChildren, ElementRef, + EventEmitter, Input, OnDestroy, + Output, QueryList, ViewChildren, } from '@angular/core'; @@ -48,8 +50,15 @@ export class ItTabContainerComponent extends ItAbstractComponent implements OnDe @ViewChildren('tabNavLinks') private tabNavLinks?: QueryList>; + @Output() tabSelected = new EventEmitter(); + private tabSubscriptions?: Array; + constructor() { + super(); + this.tabSelected = new EventEmitter(); + } + override ngAfterViewInit(): void { super.ngAfterViewInit(); @@ -89,4 +98,8 @@ export class ItTabContainerComponent extends ItAbstractComponent implements OnDe ngOnDestroy(): void { this.tabSubscriptions?.forEach(sub => sub.unsubscribe()); } + + onTab(tab?: ItTabItemComponent) { + this.tabSelected.emit(tab); + } } From c4e1d876a7226f975b865ee8380b500e26a11209 Mon Sep 17 00:00:00 2001 From: "marco.spasiano" Date: Sat, 29 Jun 2024 17:09:10 +0200 Subject: [PATCH 2/3] fix: top on sticky header and add method for close NavBar on mobile --- .../lib/components/navigation/header/header.component.html | 5 +++-- .../lib/components/navigation/header/header.component.ts | 7 +++++++ 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/projects/design-angular-kit/src/lib/components/navigation/header/header.component.html b/projects/design-angular-kit/src/lib/components/navigation/header/header.component.html index ea76dec6..993ca518 100644 --- a/projects/design-angular-kit/src/lib/components/navigation/header/header.component.html +++ b/projects/design-angular-kit/src/lib/components/navigation/header/header.component.html @@ -3,7 +3,8 @@ class="it-header-wrapper" [class.it-header-sticky]="sticky" data-bs-position-type="fixed" - data-bs-sticky-class-name="is-sticky"> + data-bs-sticky-class-name="is-sticky" + data-bs-target="#header-nav-wrapper"> @if (showSlim) {
@@ -84,7 +85,7 @@
-
+
diff --git a/projects/design-angular-kit/src/lib/components/navigation/header/header.component.ts b/projects/design-angular-kit/src/lib/components/navigation/header/header.component.ts index 05569f3e..65a2fa1c 100644 --- a/projects/design-angular-kit/src/lib/components/navigation/header/header.component.ts +++ b/projects/design-angular-kit/src/lib/components/navigation/header/header.component.ts @@ -13,6 +13,7 @@ import { import { TranslateModule } from '@ngx-translate/core'; import { ItIconComponent } from '../../utils/icon/icon.component'; import { ItNavBarModule } from '../navbar/navbar.module'; +import { ItNavBarComponent } from '../navbar/navbar/navbar.component'; import { ItButtonDirective } from '../../core/button/button.directive'; import { inputToBoolean } from '../../../utils/coercion'; @@ -48,6 +49,8 @@ export class ItHeaderComponent implements AfterViewInit, OnChanges { @ViewChild('headerWrapper') private headerWrapper?: ElementRef; + @ViewChild(ItNavBarComponent) private itNavBarComponent?: ItNavBarComponent; + @Input({ transform: inputToBoolean }) megamenu?: boolean; @Input({ transform: inputToBoolean }) expand?: boolean = true; @@ -89,4 +92,8 @@ export class ItHeaderComponent implements AfterViewInit, OnChanges { event.preventDefault(); this.searchClick.emit(event); } + + toggleCollapse() { + this.itNavBarComponent?.toggleCollapse(); + } } From 0234598246bb1cdf5fd445903446b2fb682c882b Mon Sep 17 00:00:00 2001 From: "marco.spasiano" Date: Tue, 9 Jul 2024 17:38:18 +0200 Subject: [PATCH 3/3] fix: multiple initialization --- .../core/tab/tab-container/tab-container.component.ts | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.ts b/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.ts index be5e6dc9..ed4dc88d 100644 --- a/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.ts +++ b/projects/design-angular-kit/src/lib/components/core/tab/tab-container/tab-container.component.ts @@ -56,7 +56,6 @@ export class ItTabContainerComponent extends ItAbstractComponent implements OnDe constructor() { super(); - this.tabSelected = new EventEmitter(); } override ngAfterViewInit(): void { @@ -99,7 +98,7 @@ export class ItTabContainerComponent extends ItAbstractComponent implements OnDe this.tabSubscriptions?.forEach(sub => sub.unsubscribe()); } - onTab(tab?: ItTabItemComponent) { + onTab(tab: ItTabItemComponent) { this.tabSelected.emit(tab); } }