diff --git a/projects/components/src/navigation/nav-item/nav-item.component.scss b/projects/components/src/navigation/nav-item/nav-item.component.scss index 9eb12d8ff..de4529059 100644 --- a/projects/components/src/navigation/nav-item/nav-item.component.scss +++ b/projects/components/src/navigation/nav-item/nav-item.component.scss @@ -1,8 +1,8 @@ -@import 'color-palette'; -@import 'font'; +@import 'mixins'; .nav-item { @include font-left-nav-label; + @include raised-shadow-hover(); color: $gray-7; display: flex; height: 36px; diff --git a/projects/components/src/navigation/nav-item/nav-item.component.ts b/projects/components/src/navigation/nav-item/nav-item.component.ts index 4c3584b3d..be954e3da 100644 --- a/projects/components/src/navigation/nav-item/nav-item.component.ts +++ b/projects/components/src/navigation/nav-item/nav-item.component.ts @@ -18,7 +18,7 @@ import { NavItemLinkConfig } from '../navigation-list.component'; @@ -30,6 +30,15 @@ import { NavItemLinkConfig } from '../navigation-list.component'; SOON + + diff --git a/projects/components/src/navigation/navigation-list.component.ts b/projects/components/src/navigation/navigation-list.component.ts index 3c0025d02..0acfeaf7d 100644 --- a/projects/components/src/navigation/navigation-list.component.ts +++ b/projects/components/src/navigation/navigation-list.component.ts @@ -1,7 +1,7 @@ import { ChangeDetectionStrategy, Component, EventEmitter, Input, Output } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { IconType } from '@hypertrace/assets-library'; -import { NavigationService } from '@hypertrace/common'; +import { Color, NavigationService } from '@hypertrace/common'; import { Observable } from 'rxjs'; import { map, startWith } from 'rxjs/operators'; import { IconSize } from '../icon/icon-size'; @@ -103,11 +103,15 @@ export type NavItemConfig = NavItemLinkConfig | NavItemHeaderConfig | NavItemDiv export interface NavItemLinkConfig { type: NavItemType.Link; icon: string; + iconSize?: IconSize; label: string; matchPaths: string[]; // For now, default path is index 0 features?: string[]; replaceCurrentHistory?: boolean; isBeta?: boolean; + trailingIcon?: string; + trailingIconTooltip?: string; + trailingIconColor?: Color; } export type FooterItemConfig = FooterItemLinkConfig; diff --git a/projects/components/src/navigation/navigation-list.module.ts b/projects/components/src/navigation/navigation-list.module.ts index 076034459..77dc86185 100644 --- a/projects/components/src/navigation/navigation-list.module.ts +++ b/projects/components/src/navigation/navigation-list.module.ts @@ -10,6 +10,7 @@ import { LabelModule } from '../label/label.module'; import { LayoutChangeModule } from '../layout/layout-change.module'; import { LetAsyncModule } from '../let-async/let-async.module'; import { LinkModule } from '../link/link.module'; +import { TooltipModule } from './../tooltip/tooltip.module'; import { NavItemComponent } from './nav-item/nav-item.component'; import { NavigationListComponent } from './navigation-list.component'; @@ -26,7 +27,8 @@ import { NavigationListComponent } from './navigation-list.component'; LabelModule, BetaTagModule, MemoizeModule, - LinkModule + LinkModule, + TooltipModule ], declarations: [NavigationListComponent, NavItemComponent], exports: [NavigationListComponent]