SM-1146: Tab link component simplifications
This commit is contained in:
parent
7fe1200310
commit
df122148da
|
@ -9,12 +9,10 @@
|
|||
[attr.aria-disabled]="disabled"
|
||||
ariaCurrentWhenActive="page"
|
||||
role="link"
|
||||
[class]="'tw-flex' + (haveSlotEnd ? ' hover:tw-no-underline' : '')"
|
||||
[class]="'tw-flex' + (haveEndSlot ? ' hover:tw-no-underline' : '')"
|
||||
>
|
||||
<ng-container>
|
||||
<div [class]="'tw-inline-flex' + (haveSlotEnd ? ' hover:tw-underline' : '')">
|
||||
<ng-content></ng-content>
|
||||
</div>
|
||||
</ng-container>
|
||||
<ng-content #slotEnd select="[slot=end]"></ng-content>
|
||||
<div [class]="'tw-inline-flex' + (haveEndSlot ? ' hover:tw-underline' : '')">
|
||||
<ng-content></ng-content>
|
||||
</div>
|
||||
<ng-content #endSlot select="[slot=end]"></ng-content>
|
||||
</a>
|
||||
|
|
|
@ -24,7 +24,7 @@ export class TabLinkComponent implements FocusableOption, AfterViewInit, OnDestr
|
|||
|
||||
@ViewChild(TabListItemDirective) tabItem: TabListItemDirective;
|
||||
@ViewChild("rla") routerLinkActive: RouterLinkActive;
|
||||
@ViewChild("slotEnd") slotEnd: ElementRef<HTMLElement>;
|
||||
@ViewChild("endSlot") endSlot: ElementRef<HTMLElement>;
|
||||
|
||||
readonly routerLinkMatchOptions: IsActiveMatchOptions = {
|
||||
queryParams: "ignored",
|
||||
|
@ -46,8 +46,8 @@ export class TabLinkComponent implements FocusableOption, AfterViewInit, OnDestr
|
|||
return this.routerLinkActive?.isActive ?? false;
|
||||
}
|
||||
|
||||
get haveSlotEnd() {
|
||||
return this.slotEnd?.nativeElement?.innerHTML !== "" ?? false;
|
||||
get haveEndSlot() {
|
||||
return this.endSlot?.nativeElement?.childElementCount !== 0;
|
||||
}
|
||||
|
||||
constructor(private _tabNavBar: TabNavBarComponent) {}
|
||||
|
|
Loading…
Reference in New Issue