@fundamental-ngx/btp 0.55.0-rc.9 → 0.55.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/fundamental-ngx-btp-button.mjs +9 -9
- package/fesm2022/fundamental-ngx-btp-navigation-menu.mjs +17 -17
- package/fesm2022/fundamental-ngx-btp-navigation.mjs +44 -47
- package/fesm2022/fundamental-ngx-btp-navigation.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-btp-search-field.mjs +5 -4
- package/fesm2022/fundamental-ngx-btp-search-field.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-btp-splitter.mjs +23 -23
- package/fesm2022/fundamental-ngx-btp-tool-header.mjs +35 -35
- package/fesm2022/fundamental-ngx-btp-tool-layout.mjs +20 -20
- package/fesm2022/fundamental-ngx-btp.mjs +4 -4
- package/package.json +3 -3
|
@@ -17,10 +17,10 @@ class ButtonTypeGuard {
|
|
|
17
17
|
this._buttonComponent.fdType = this.fdType;
|
|
18
18
|
this._buttonComponent.buildComponentCssClass();
|
|
19
19
|
}
|
|
20
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
21
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
20
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ButtonTypeGuard, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
21
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: ButtonTypeGuard, isStandalone: true, usesOnChanges: true, ngImport: i0 }); }
|
|
22
22
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ButtonTypeGuard, decorators: [{
|
|
24
24
|
type: Directive
|
|
25
25
|
}] });
|
|
26
26
|
|
|
@@ -37,10 +37,10 @@ class NestedButtonDirective extends ButtonTypeGuard {
|
|
|
37
37
|
this.fdType = this.square ? 'nested-square' : 'nested';
|
|
38
38
|
super.ngOnChanges();
|
|
39
39
|
}
|
|
40
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
41
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.0.
|
|
40
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NestedButtonDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
41
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.0.7", type: NestedButtonDirective, isStandalone: true, selector: "[fd-button][fdbNestedButton]", inputs: { fdType: "fdType", square: ["square", "square", booleanAttribute] }, usesInheritance: true, usesOnChanges: true, ngImport: i0 }); }
|
|
42
42
|
}
|
|
43
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NestedButtonDirective, decorators: [{
|
|
44
44
|
type: Directive,
|
|
45
45
|
args: [{
|
|
46
46
|
selector: '[fd-button][fdbNestedButton]',
|
|
@@ -59,10 +59,10 @@ class ToolHeaderButtonDirective extends ButtonTypeGuard {
|
|
|
59
59
|
/** Type of the button. In case of fdbToolHeaderButton it is always a `tool-header` */
|
|
60
60
|
this.fdType = 'tool-header';
|
|
61
61
|
}
|
|
62
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
63
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
62
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ToolHeaderButtonDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
63
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: ToolHeaderButtonDirective, isStandalone: true, selector: "[fd-button][fdbToolHeaderButton]", inputs: { fdType: "fdType" }, usesInheritance: true, ngImport: i0 }); }
|
|
64
64
|
}
|
|
65
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: ToolHeaderButtonDirective, decorators: [{
|
|
66
66
|
type: Directive,
|
|
67
67
|
args: [{
|
|
68
68
|
selector: '[fd-button][fdbToolHeaderButton]',
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { inject, ElementRef,
|
|
2
|
+
import { inject, ElementRef, HostBinding, Input, Component, Directive, ContentChild, ViewEncapsulation, ChangeDetectionStrategy, NgModule } from '@angular/core';
|
|
3
3
|
import * as i1 from '@fundamental-ngx/cdk/utils';
|
|
4
4
|
import { FDK_FOCUSABLE_ITEM_DIRECTIVE, IndirectFocusableItemDirective, FocusableListDirective } from '@fundamental-ngx/cdk/utils';
|
|
5
5
|
import { FD_DEFAULT_ICON_FONT_FAMILY, IconComponent } from '@fundamental-ngx/core/icon';
|
|
@@ -36,8 +36,8 @@ class NavigationMenuItemComponent {
|
|
|
36
36
|
getLabel() {
|
|
37
37
|
return this.label;
|
|
38
38
|
}
|
|
39
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
40
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
39
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
40
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.7", type: NavigationMenuItemComponent, isStandalone: true, selector: "fdb-navigation-menu-item, li[fdb-navigation-menu-item]", inputs: { glyph: "glyph", glyphFont: "glyphFont", label: "label" }, host: { properties: { "attr.tabindex": "this.tabindex" }, classAttribute: "fd-navigation-menu__item" }, providers: [
|
|
41
41
|
{
|
|
42
42
|
provide: FDK_FOCUSABLE_ITEM_DIRECTIVE,
|
|
43
43
|
useExisting: NavigationMenuItemComponent
|
|
@@ -60,7 +60,7 @@ class NavigationMenuItemComponent {
|
|
|
60
60
|
<ng-content></ng-content>
|
|
61
61
|
`, isInline: true, dependencies: [{ kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }] }); }
|
|
62
62
|
}
|
|
63
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
63
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuItemComponent, decorators: [{
|
|
64
64
|
type: Component,
|
|
65
65
|
args: [{
|
|
66
66
|
selector: 'fdb-navigation-menu-item, li[fdb-navigation-menu-item]',
|
|
@@ -110,10 +110,10 @@ class NavigationMenuPopoverControlDirective {
|
|
|
110
110
|
this.templateRef = templateRef;
|
|
111
111
|
this.viewContainerRef = viewContainerRef;
|
|
112
112
|
}
|
|
113
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
114
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
113
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuPopoverControlDirective, deps: [{ token: i0.TemplateRef }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
114
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NavigationMenuPopoverControlDirective, isStandalone: true, selector: "[fdbNavigationMenuPopoverControl]", ngImport: i0 }); }
|
|
115
115
|
}
|
|
116
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
116
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuPopoverControlDirective, decorators: [{
|
|
117
117
|
type: Directive,
|
|
118
118
|
args: [{
|
|
119
119
|
selector: '[fdbNavigationMenuPopoverControl]',
|
|
@@ -122,8 +122,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
122
122
|
}], ctorParameters: () => [{ type: i0.TemplateRef }, { type: i0.ViewContainerRef }] });
|
|
123
123
|
|
|
124
124
|
class NavigationMenuPopoverComponent {
|
|
125
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
126
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.
|
|
125
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
126
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: NavigationMenuPopoverComponent, isStandalone: true, selector: "fdb-navigation-menu-popover", queries: [{ propertyName: "_control", first: true, predicate: NavigationMenuPopoverControlDirective, descendants: true }], ngImport: i0, template: `
|
|
127
127
|
<fd-popover additionalBodyClass="fdb-navigation-popover-body" [noArrow]="false" [focusAutoCapture]="true">
|
|
128
128
|
<fd-popover-control>
|
|
129
129
|
<ng-template [ngTemplateOutlet]="_control.templateRef"></ng-template>
|
|
@@ -134,7 +134,7 @@ class NavigationMenuPopoverComponent {
|
|
|
134
134
|
</fd-popover>
|
|
135
135
|
`, isInline: true, styles: [".fdb-navigation-popover-body{--fdPopover_Offset: -.3875rem;background:var(--sapGroup_ContentBackground);border:none;border-radius:.5rem;box-shadow:var(--sapMenu_Shadow2)}.fdb-navigation-popover-body .fd-navigation-menu{padding:0;margin:.5rem}.fdb-navigation-popover-body .fd-button.fd-tool-header__action-button{max-width:initial;width:100%;justify-content:flex-start}\n"], dependencies: [{ kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
136
136
|
}
|
|
137
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
137
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuPopoverComponent, decorators: [{
|
|
138
138
|
type: Component,
|
|
139
139
|
args: [{ selector: 'fdb-navigation-menu-popover', template: `
|
|
140
140
|
<fd-popover additionalBodyClass="fdb-navigation-popover-body" [noArrow]="false" [focusAutoCapture]="true">
|
|
@@ -156,10 +156,10 @@ class NavigationMenuComponent {
|
|
|
156
156
|
constructor() {
|
|
157
157
|
inject(FocusableListDirective).wrap = true;
|
|
158
158
|
}
|
|
159
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
160
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: NavigationMenuComponent, isStandalone: true, selector: "fdb-navigation-menu, ul[fdb-navigation-menu]", host: { classAttribute: "fd-navigation-menu" }, hostDirectives: [{ directive: i1.FocusableListDirective }], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: ["@charset \"UTF-8\";.fd-navigation-menu{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;--fdNavigationMenu_Item_Background:var(--fdNavigationMenu_Item_Border_Color_Normal);--fdNavigationMenu_Item_Border_Color:var(--fdNavigationMenu_Item_Border_Color_Normal);--fdNavigationMenu_Item_Border_Bottom_Color:var(--fdNavigationMenu_Item_Border_Bottom_Color_Normal);--fdNavigationMenu_Item_Min_Height:2.5rem;--fdNavigationMenu_Item_Padding_Right:.5rem;--fdNavigationMenu_Item_Spacing:.4375rem;--fdNavigationMenu_Item_Selection_Indicator_Size:.5rem;--fdNavigationMenu_Item_Child_Indicator_Size:.75rem;--fdNavigationMenu_Item_Text_Color:inherit;--fdNavigationMenu_Item_Font_Weight:bold;--fdNavigationMenu_Item_Font_Size:var(--sapFontSize);--fdNavigationMenu_Item_Has_Child_Indicator_Icon:\"\\e1ed\";--fdNavigationMenu_Item_Has_Link_Indicator_Icon:\"\\e04c\";--fdNavigationMenu_Selection_Indicator_Offset_Right:var(--fdNavigationMenu_Item_Spacing);background:var(--sapGroup_ContentBackground);border-radius:.5rem;list-style-type:none;padding-block:.5rem;padding-inline:.5rem}.fd-navigation-menu:after,.fd-navigation-menu:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-navigation-menu__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:.5rem;padding-inline:0;padding-inline:.5rem var(--fdNavigationMenu_Item_Padding_Right);-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--fdNavigationMenu_Item_Background);border-bottom:.0625rem solid var(--fdNavigationMenu_Item_Border_Color);border:.0625rem solid var(--fdNavigationMenu_Item_Border_Color);border-bottom-color:var(--fdNavigationMenu_Item_Border_Bottom_Color);border-radius:var(--fdNavigationMenu_Item_Border_Radius);color:var(--sapList_TextColor);cursor:pointer;gap:var(--fdNavigationMenu_Item_Spacing);min-height:var(--fdNavigationMenu_Item_Min_Height);position:relative;-webkit-transition:var(--fdNavigationMenu_Item_Transition);transition:var(--fdNavigationMenu_Item_Transition);width:100%}.fd-navigation-menu__item:after,.fd-navigation-menu__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-navigation-menu__item.is-hover,.fd-navigation-menu__item:hover{--fdNavigationMenu_Item_Background:var(--sapMenu_Hover_Background);--fdNavigationMenu_Item_Border_Color:var(--fdNavigationMenu_Item_Border_Color_Hover);--fdNavigationMenu_Item_Border_Bottom_Color:var(--fdNavigationMenu_Item_Border_Color_Hover)}.fd-navigation-menu__item.is-active,.fd-navigation-menu__item.is-active.is-focus,.fd-navigation-menu__item.is-active:focus,.fd-navigation-menu__item:active,.fd-navigation-menu__item:active.is-focus,.fd-navigation-menu__item:active:focus{--fdNavigationMenu_Item_Background:var(--sapMenu_Active_Background);--fdNavigationMenu_Item_Border_Color:var(--fdNavigationMenu_Item_Border_Color_Active);--fdNavigationMenu_Item_Border_Bottom_Color:var(--fdNavigationMenu_Item_Border_Color_Active)}.fd-navigation-menu__item.is-active.is-focus,.fd-navigation-menu__item.is-active:focus,.fd-navigation-menu__item:active.is-focus,.fd-navigation-menu__item:active:focus{outline:none;z-index:5}.fd-navigation-menu__item.is-selected,.fd-navigation-menu__item[aria-selected=true]{--fdNavigationMenu_Item_Background:var(--sapMenu_Selected_Background);--fdNavigationMenu_Item_Border_Color:var(--fdNavigationMenu_Item_Border_Color_Selected);--fdNavigationMenu_Item_Border_Bottom_Color:var(--fdNavigationMenu_Item_Border_Color_Selected);--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Selection_Indicator_Size))}.fd-navigation-menu__item.is-selected:after,.fd-navigation-menu__item[aria-selected=true]:after{background:var(--sapList_SelectionBorderColor);border-radius:100%;content:\"\";height:var(--fdNavigationMenu_Item_Selection_Indicator_Size);max-height:var(--fdNavigationMenu_Item_Selection_Indicator_Size);max-width:var(--fdNavigationMenu_Item_Selection_Indicator_Size);min-height:var(--fdNavigationMenu_Item_Selection_Indicator_Size);min-width:var(--fdNavigationMenu_Item_Selection_Indicator_Size);position:absolute;right:var(--fdNavigationMenu_Selection_Indicator_Offset_Right);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:var(--fdNavigationMenu_Item_Selection_Indicator_Size)}[dir=rtl] .fd-navigation-menu__item.is-selected:after,[dir=rtl] .fd-navigation-menu__item[aria-selected=true]:after{left:var(--fdNavigationMenu_Selection_Indicator_Offset_Right);right:auto}.fd-navigation-menu__item.is-focus,.fd-navigation-menu__item:focus{z-index:5;--fdNavigationMenu_Item_Background:var(--sapMenu_Background);--fdNavigationMenu_Item_Border_Color:transparent;--fdNavigationMenu_Item_Border_Bottom_Color:transparent;outline:var(--sapContent_FocusStyle) var(--sapContent_FocusWidth) var(--sapContent_FocusColor)}.fd-navigation-menu__item.is-disabled,.fd-navigation-menu__item:disabled,.fd-navigation-menu__item[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-navigation-menu__item[class*=-compact],[class*=-compact] .fd-navigation-menu__item:not([class*=-cozy]){--fdNavigationMenu_Item_Min_Height:2rem}.fd-navigation-menu__item--has-children{--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Child_Indicator_Size))}.fd-navigation-menu__item--has-children:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;content:var(--fdNavigationMenu_Item_Has_Child_Indicator_Icon);font-family:SAP-icons;font-size:.75rem;height:.75rem;max-height:.75rem;max-width:.75rem;min-height:.75rem;min-width:.75rem;position:absolute;right:var(--fdNavigationMenu_Item_Spacing);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:.75rem}[dir=rtl] .fd-navigation-menu__item--has-children:before{left:var(--fdNavigationMenu_Item_Spacing);right:auto}.fd-navigation-menu__item--has-children.is-expanded,.fd-navigation-menu__item--has-children[aria-expanded=true]{--fdNavigationMenu_Item_Has_Child_Indicator_Icon:\"\\e1ef\"}.fd-navigation-menu__item--has-children[dir=rtl],[dir=rtl] .fd-navigation-menu__item--has-children{--fdNavigationMenu_Item_Has_Child_Indicator_Icon:\"\\e1ee\"}.fd-navigation-menu__item--has-children.is-selected,.fd-navigation-menu__item--has-children[aria-selected=true]{--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*3 + var(--fdNavigationMenu_Item_Selection_Indicator_Size) + var(--fdNavigationMenu_Item_Child_Indicator_Size));--fdNavigationMenu_Selection_Indicator_Offset_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Child_Indicator_Size))}.fd-navigation-menu__item--has-link-indicator{--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Child_Indicator_Size))}.fd-navigation-menu__item--has-link-indicator:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapContent_LabelColor);content:var(--fdNavigationMenu_Item_Has_Link_Indicator_Icon);font-family:SAP-icons;font-size:.75rem;height:.75rem;max-height:.75rem;max-width:.75rem;min-height:.75rem;min-width:.75rem;position:absolute;right:var(--fdNavigationMenu_Item_Spacing);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:.75rem}[dir=rtl] .fd-navigation-menu__item--has-link-indicator:before{left:var(--fdNavigationMenu_Item_Spacing);right:auto}.fd-navigation-menu__item--has-link-indicator[dir=rtl],[dir=rtl] .fd-navigation-menu__item--has-link-indicator{--fdNavigationMenu_Item_Has_Link_Indicator_Icon:\"\\e04d\"}.fd-navigation-menu__item--has-link-indicator.is-selected,.fd-navigation-menu__item--has-link-indicator[aria-selected=true]{--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*3 + var(--fdNavigationMenu_Item_Selection_Indicator_Size) + var(--fdNavigationMenu_Item_Child_Indicator_Size));--fdNavigationMenu_Selection_Indicator_Offset_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Child_Indicator_Size))}.fd-navigation-menu__item--child{--fdNavigationMenu_Item_Spacing:.5rem;--fdNavigationMenu_Item_Font_Weight:normal}.fd-navigation-menu__item--group{--fdNavigationMenu_Item_Spacing:.4375rem;--fdNavigationMenu_Item_Text_Color:var(--sapContent_LabelColor);--fdNavigationMenu_Item_Font_Weight:semibold;--fdNavigationMenu_Item_Font_Size:var(--sapFontSmallSize)}.fd-navigation-menu__icon{height:1rem;max-height:1rem;max-width:1rem;min-height:1rem;min-width:1rem;width:1rem}.fd-navigation-menu__icon [class*=sap-icon],.fd-navigation-menu__icon[class*=sap-icon]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:inherit;font-size:1rem}.fd-navigation-menu__text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdNavigationMenu_Item_Text_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdNavigationMenu_Item_Font_Size);font-weight:400;font-weight:var(--fdNavigationMenu_Item_Font_Weight);forced-color-adjust:none;line-height:normal;line-height:1;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;vertical-align:baseline;white-space:nowrap}.fd-navigation-menu__text:after,.fd-navigation-menu__text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}\n/*! Bundled license information:\n\nfundamental-styles/dist/navigation-menu.css:\n (*!\n * Fundamental Library Styles v0.38.0\n * Copyright (c) 2024 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
159
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
160
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: NavigationMenuComponent, isStandalone: true, selector: "fdb-navigation-menu, ul[fdb-navigation-menu]", host: { classAttribute: "fd-navigation-menu" }, hostDirectives: [{ directive: i1.FocusableListDirective }], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: ["@charset \"UTF-8\";.fd-navigation-menu{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;--fdNavigationMenu_Item_Background:var(--fdNavigationMenu_Item_Border_Color_Normal);--fdNavigationMenu_Item_Border_Color:var(--fdNavigationMenu_Item_Border_Color_Normal);--fdNavigationMenu_Item_Border_Bottom_Color:var(--fdNavigationMenu_Item_Border_Bottom_Color_Normal);--fdNavigationMenu_Item_Min_Height:2.5rem;--fdNavigationMenu_Item_Padding_Right:.5rem;--fdNavigationMenu_Item_Spacing:.4375rem;--fdNavigationMenu_Item_Selection_Indicator_Size:.5rem;--fdNavigationMenu_Item_Child_Indicator_Size:.75rem;--fdNavigationMenu_Item_Text_Color:inherit;--fdNavigationMenu_Item_Font_Weight:bold;--fdNavigationMenu_Item_Font_Size:var(--sapFontSize);--fdNavigationMenu_Item_Has_Child_Indicator_Icon:\"\\e1ed\";--fdNavigationMenu_Item_Has_Link_Indicator_Icon:\"\\e04c\";--fdNavigationMenu_Selection_Indicator_Offset_Right:var(--fdNavigationMenu_Item_Spacing);background:var(--sapGroup_ContentBackground);border-radius:.5rem;list-style-type:none;padding-block:.5rem;padding-inline:.5rem}.fd-navigation-menu:after,.fd-navigation-menu:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-navigation-menu__item{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:.5rem;padding-inline:0;padding-inline:.5rem var(--fdNavigationMenu_Item_Padding_Right);-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--fdNavigationMenu_Item_Background);border-bottom:.0625rem solid var(--fdNavigationMenu_Item_Border_Color);border:.0625rem solid var(--fdNavigationMenu_Item_Border_Color);border-bottom-color:var(--fdNavigationMenu_Item_Border_Bottom_Color);border-radius:var(--fdNavigationMenu_Item_Border_Radius);color:var(--sapList_TextColor);cursor:pointer;gap:var(--fdNavigationMenu_Item_Spacing);min-height:var(--fdNavigationMenu_Item_Min_Height);position:relative;-webkit-transition:var(--fdNavigationMenu_Item_Transition);transition:var(--fdNavigationMenu_Item_Transition);width:100%}.fd-navigation-menu__item:after,.fd-navigation-menu__item:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-navigation-menu__item.is-hover,.fd-navigation-menu__item:hover{--fdNavigationMenu_Item_Background:var(--sapMenu_Hover_Background);--fdNavigationMenu_Item_Border_Color:var(--fdNavigationMenu_Item_Border_Color_Hover);--fdNavigationMenu_Item_Border_Bottom_Color:var(--fdNavigationMenu_Item_Border_Color_Hover)}.fd-navigation-menu__item.is-active,.fd-navigation-menu__item.is-active.is-focus,.fd-navigation-menu__item.is-active:focus,.fd-navigation-menu__item:active,.fd-navigation-menu__item:active.is-focus,.fd-navigation-menu__item:active:focus{--fdNavigationMenu_Item_Background:var(--sapMenu_Active_Background);--fdNavigationMenu_Item_Border_Color:var(--fdNavigationMenu_Item_Border_Color_Active);--fdNavigationMenu_Item_Border_Bottom_Color:var(--fdNavigationMenu_Item_Border_Color_Active)}.fd-navigation-menu__item.is-active.is-focus,.fd-navigation-menu__item.is-active:focus,.fd-navigation-menu__item:active.is-focus,.fd-navigation-menu__item:active:focus{outline:none;z-index:5}.fd-navigation-menu__item.is-selected,.fd-navigation-menu__item[aria-selected=true]{--fdNavigationMenu_Item_Background:var(--sapMenu_Selected_Background);--fdNavigationMenu_Item_Border_Color:var(--fdNavigationMenu_Item_Border_Color_Selected);--fdNavigationMenu_Item_Border_Bottom_Color:var(--fdNavigationMenu_Item_Border_Color_Selected);--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Selection_Indicator_Size))}.fd-navigation-menu__item.is-selected:after,.fd-navigation-menu__item[aria-selected=true]:after{background:var(--sapList_SelectionBorderColor);border-radius:100%;content:\"\";height:var(--fdNavigationMenu_Item_Selection_Indicator_Size);max-height:var(--fdNavigationMenu_Item_Selection_Indicator_Size);max-width:var(--fdNavigationMenu_Item_Selection_Indicator_Size);min-height:var(--fdNavigationMenu_Item_Selection_Indicator_Size);min-width:var(--fdNavigationMenu_Item_Selection_Indicator_Size);position:absolute;right:var(--fdNavigationMenu_Selection_Indicator_Offset_Right);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:var(--fdNavigationMenu_Item_Selection_Indicator_Size)}[dir=rtl] .fd-navigation-menu__item.is-selected:after,[dir=rtl] .fd-navigation-menu__item[aria-selected=true]:after{left:var(--fdNavigationMenu_Selection_Indicator_Offset_Right);right:auto}.fd-navigation-menu__item.is-focus,.fd-navigation-menu__item:focus{z-index:5;--fdNavigationMenu_Item_Background:var(--sapMenu_Background);--fdNavigationMenu_Item_Border_Color:transparent;--fdNavigationMenu_Item_Border_Bottom_Color:transparent;outline:var(--sapContent_FocusStyle) var(--sapContent_FocusWidth) var(--sapContent_FocusColor)}.fd-navigation-menu__item.is-disabled,.fd-navigation-menu__item:disabled,.fd-navigation-menu__item[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-navigation-menu__item[class*=-compact],[class*=-compact] .fd-navigation-menu__item:not([class*=-cozy]){--fdNavigationMenu_Item_Min_Height:2rem}.fd-navigation-menu__item--has-children{--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Child_Indicator_Size))}.fd-navigation-menu__item--has-children:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;content:var(--fdNavigationMenu_Item_Has_Child_Indicator_Icon);font-family:SAP-icons;font-size:.75rem;height:.75rem;max-height:.75rem;max-width:.75rem;min-height:.75rem;min-width:.75rem;position:absolute;right:var(--fdNavigationMenu_Item_Spacing);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:.75rem}[dir=rtl] .fd-navigation-menu__item--has-children:before{left:var(--fdNavigationMenu_Item_Spacing);right:auto}.fd-navigation-menu__item--has-children.is-expanded,.fd-navigation-menu__item--has-children[aria-expanded=true]{--fdNavigationMenu_Item_Has_Child_Indicator_Icon:\"\\e1ef\"}.fd-navigation-menu__item--has-children[dir=rtl],[dir=rtl] .fd-navigation-menu__item--has-children{--fdNavigationMenu_Item_Has_Child_Indicator_Icon:\"\\e1ee\"}.fd-navigation-menu__item--has-children.is-selected,.fd-navigation-menu__item--has-children[aria-selected=true]{--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*3 + var(--fdNavigationMenu_Item_Selection_Indicator_Size) + var(--fdNavigationMenu_Item_Child_Indicator_Size));--fdNavigationMenu_Selection_Indicator_Offset_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Child_Indicator_Size))}.fd-navigation-menu__item--has-link-indicator{--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Child_Indicator_Size))}.fd-navigation-menu__item--has-link-indicator:before{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:var(--sapContent_LabelColor);content:var(--fdNavigationMenu_Item_Has_Link_Indicator_Icon);font-family:SAP-icons;font-size:.75rem;height:.75rem;max-height:.75rem;max-width:.75rem;min-height:.75rem;min-width:.75rem;position:absolute;right:var(--fdNavigationMenu_Item_Spacing);top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:.75rem}[dir=rtl] .fd-navigation-menu__item--has-link-indicator:before{left:var(--fdNavigationMenu_Item_Spacing);right:auto}.fd-navigation-menu__item--has-link-indicator[dir=rtl],[dir=rtl] .fd-navigation-menu__item--has-link-indicator{--fdNavigationMenu_Item_Has_Link_Indicator_Icon:\"\\e04d\"}.fd-navigation-menu__item--has-link-indicator.is-selected,.fd-navigation-menu__item--has-link-indicator[aria-selected=true]{--fdNavigationMenu_Item_Padding_Right:calc(var(--fdNavigationMenu_Item_Spacing)*3 + var(--fdNavigationMenu_Item_Selection_Indicator_Size) + var(--fdNavigationMenu_Item_Child_Indicator_Size));--fdNavigationMenu_Selection_Indicator_Offset_Right:calc(var(--fdNavigationMenu_Item_Spacing)*2 + var(--fdNavigationMenu_Item_Child_Indicator_Size))}.fd-navigation-menu__item--child{--fdNavigationMenu_Item_Spacing:.5rem;--fdNavigationMenu_Item_Font_Weight:normal}.fd-navigation-menu__item--group{--fdNavigationMenu_Item_Spacing:.4375rem;--fdNavigationMenu_Item_Text_Color:var(--sapContent_LabelColor);--fdNavigationMenu_Item_Font_Weight:semibold;--fdNavigationMenu_Item_Font_Size:var(--sapFontSmallSize)}.fd-navigation-menu__icon{height:1rem;max-height:1rem;max-width:1rem;min-height:1rem;min-width:1rem;width:1rem}.fd-navigation-menu__icon [class*=sap-icon],.fd-navigation-menu__icon[class*=sap-icon]{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:inherit;font-size:1rem}.fd-navigation-menu__text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdNavigationMenu_Item_Text_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdNavigationMenu_Item_Font_Size);font-weight:400;font-weight:var(--fdNavigationMenu_Item_Font_Weight);forced-color-adjust:none;line-height:normal;line-height:1;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;text-overflow:ellipsis;vertical-align:baseline;white-space:nowrap}.fd-navigation-menu__text:after,.fd-navigation-menu__text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}\n/*! Bundled license information:\n\nfundamental-styles/dist/navigation-menu.css:\n (*!\n * Fundamental Library Styles v0.38.0\n * Copyright (c) 2024 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
161
161
|
}
|
|
162
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
162
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuComponent, decorators: [{
|
|
163
163
|
type: Component,
|
|
164
164
|
args: [{ selector: 'fdb-navigation-menu, ul[fdb-navigation-menu]', template: `<ng-content></ng-content>`, standalone: true, encapsulation: ViewEncapsulation.None, host: {
|
|
165
165
|
class: 'fd-navigation-menu'
|
|
@@ -167,11 +167,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
167
167
|
}], ctorParameters: () => [] });
|
|
168
168
|
|
|
169
169
|
class NavigationMenuModule {
|
|
170
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
171
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.
|
|
172
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.
|
|
170
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
171
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuModule, imports: [NavigationMenuComponent, NavigationMenuItemComponent], exports: [NavigationMenuComponent, NavigationMenuItemComponent] }); }
|
|
172
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuModule, imports: [NavigationMenuItemComponent] }); }
|
|
173
173
|
}
|
|
174
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMenuModule, decorators: [{
|
|
175
175
|
type: NgModule,
|
|
176
176
|
args: [{
|
|
177
177
|
imports: [NavigationMenuComponent, NavigationMenuItemComponent],
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { NgTemplateOutlet, CommonModule, NgClass } from '@angular/common';
|
|
1
|
+
import { NgTemplateOutlet, NgClass } from '@angular/common';
|
|
3
2
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { signal, inject, DestroyRef, computed, Injectable, EventEmitter, booleanAttribute,
|
|
3
|
+
import { signal, inject, DestroyRef, computed, Injectable, EventEmitter, booleanAttribute, HostListener, Output, Input, HostBinding, ChangeDetectionStrategy, ViewEncapsulation, Component, ContentChildren, Injector, Directive, TemplateRef, ElementRef, NgZone, effect, ViewChild, ContentChild, ChangeDetectorRef } from '@angular/core';
|
|
5
4
|
import { takeUntilDestroyed, toSignal, toObservable } from '@angular/core/rxjs-interop';
|
|
6
5
|
import { Subject, startWith, observeOn, asyncScheduler, filter, of, take, debounceTime, merge, switchMap, isObservable, map } from 'rxjs';
|
|
7
6
|
import { FocusKeyManager } from '@angular/cdk/a11y';
|
|
@@ -15,7 +14,7 @@ import { PopoverComponent, PopoverBodyComponent, PopoverControlComponent } from
|
|
|
15
14
|
import * as i1 from '@angular/router';
|
|
16
15
|
import { RouterLink, RouterLinkActive } from '@angular/router';
|
|
17
16
|
import { PortalModule } from '@angular/cdk/portal';
|
|
18
|
-
import * as i1$
|
|
17
|
+
import * as i1$1 from '@fundamental-ngx/core/scrollbar';
|
|
19
18
|
import { ScrollbarDirective } from '@fundamental-ngx/core/scrollbar';
|
|
20
19
|
import { __decorate, __metadata } from 'tslib';
|
|
21
20
|
import { BaseDataSource, DataProvider, isDataSource, DataSourceDirective, FD_DATA_SOURCE_TRANSFORMER } from '@fundamental-ngx/cdk/data-source';
|
|
@@ -127,10 +126,10 @@ class NavigationService {
|
|
|
127
126
|
/** Currently active list item. */
|
|
128
127
|
this.currentItem$ = new Subject();
|
|
129
128
|
}
|
|
130
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
131
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.
|
|
129
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
130
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationService }); }
|
|
132
131
|
}
|
|
133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
132
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationService, decorators: [{
|
|
134
133
|
type: Injectable
|
|
135
134
|
}] });
|
|
136
135
|
|
|
@@ -252,10 +251,10 @@ class NavigationListComponent {
|
|
|
252
251
|
.withVerticalOrientation()
|
|
253
252
|
.skipPredicate((item) => item.skipNavigation);
|
|
254
253
|
}
|
|
255
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
256
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
254
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
255
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.7", type: NavigationListComponent, isStandalone: true, selector: "ul[fdb-navigation-list]", inputs: { _listItems: ["listItems", "_listItems"], role: "role", parentItems: ["parentItems", "parentItems", booleanAttribute], childItems: ["childItems", "childItems", booleanAttribute], noGrow: ["noGrow", "noGrow", booleanAttribute], withKeyboardNavigation: ["withKeyboardNavigation", "withKeyboardNavigation", booleanAttribute] }, outputs: { focusBefore: "focusBefore", focusAfter: "focusAfter" }, host: { attributes: { "tabindex": "-1" }, listeners: { "keydown": "_keydownHandler($event)" }, properties: { "attr.role": "this.role", "class.fd-navigation__list--parent-items": "this.parentItems", "class.fd-navigation__list--child-items": "this.childItems", "class.fd-navigation__list--no-grow": "this.noGrow" }, classAttribute: "fd-navigation__list" }, usesOnChanges: true, ngImport: i0, template: "@for (item of listItems$(); track item) {\n @if (item) {\n <li [class]=\"item.class$()\">\n <ng-template [ngTemplateOutlet]=\"item.renderer$()\"></ng-template>\n </li>\n <!-- Add separator after home list item. -->\n @if (item.home) {\n <li class=\"fd-navigation__list-item fd-navigation__list-item--separator\"></li>\n }\n }\n}\n<!-- Keep this for \"More\" button -->\n<ng-content></ng-content>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
257
256
|
}
|
|
258
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
257
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListComponent, decorators: [{
|
|
259
258
|
type: Component,
|
|
260
259
|
args: [{ selector: 'ul[fdb-navigation-list]', imports: [NgTemplateOutlet], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
261
260
|
class: 'fd-navigation__list',
|
|
@@ -318,15 +317,15 @@ class NavigationContentEndComponent extends FdbNavigationContentContainer {
|
|
|
318
317
|
this.listItems$.set(this._listItems.toArray());
|
|
319
318
|
});
|
|
320
319
|
}
|
|
321
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
322
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.
|
|
320
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationContentEndComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
321
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: NavigationContentEndComponent, isStandalone: true, selector: "fdb-navigation-content-end", inputs: { contentProjected: "contentProjected" }, host: { classAttribute: "fd-navigation__container fd-navigation__container--bottom" }, providers: [
|
|
323
322
|
{
|
|
324
323
|
provide: FdbNavigationContentContainer,
|
|
325
324
|
useExisting: NavigationContentEndComponent
|
|
326
325
|
}
|
|
327
326
|
], queries: [{ propertyName: "_listItems", predicate: FdbNavigationListItem }], usesInheritance: true, ngImport: i0, template: `<ul fdb-navigation-list [listItems]="allListItems$()"></ul>`, isInline: true, dependencies: [{ kind: "component", type: NavigationListComponent, selector: "ul[fdb-navigation-list]", inputs: ["listItems", "role", "parentItems", "childItems", "noGrow", "withKeyboardNavigation"], outputs: ["focusBefore", "focusAfter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
328
327
|
}
|
|
329
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
328
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationContentEndComponent, decorators: [{
|
|
330
329
|
type: Component,
|
|
331
330
|
args: [{
|
|
332
331
|
selector: 'fdb-navigation-content-end',
|
|
@@ -402,15 +401,15 @@ class NavigationListItemDirective {
|
|
|
402
401
|
this._item = null;
|
|
403
402
|
this.childDirectives().clear();
|
|
404
403
|
}
|
|
405
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
406
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
404
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
405
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NavigationListItemDirective, isStandalone: true, selector: "[fdbNavigationListItem]", inputs: { item: "item" }, providers: [
|
|
407
406
|
{
|
|
408
407
|
provide: FdbNavigationListItem,
|
|
409
408
|
useExisting: NavigationListItemDirective
|
|
410
409
|
}
|
|
411
410
|
], exportAs: ["fdbListItem"], ngImport: i0 }); }
|
|
412
411
|
}
|
|
413
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
412
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListItemDirective, decorators: [{
|
|
414
413
|
type: Directive,
|
|
415
414
|
args: [{
|
|
416
415
|
selector: '[fdbNavigationListItem]',
|
|
@@ -435,10 +434,10 @@ class NavigationListItemRefDirective {
|
|
|
435
434
|
static ngTemplateContextGuard(dir, ctx) {
|
|
436
435
|
return true;
|
|
437
436
|
}
|
|
438
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
439
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
437
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListItemRefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
438
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NavigationListItemRefDirective, isStandalone: true, selector: "[fdbNavigationListItemRef]", inputs: { fdbNavigationListItemRefAs: "fdbNavigationListItemRefAs" }, ngImport: i0 }); }
|
|
440
439
|
}
|
|
441
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
440
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListItemRefDirective, decorators: [{
|
|
442
441
|
type: Directive,
|
|
443
442
|
args: [{
|
|
444
443
|
selector: '[fdbNavigationListItemRef]',
|
|
@@ -456,10 +455,10 @@ class NavigationLinkRefDirective {
|
|
|
456
455
|
/** Link template ref. */
|
|
457
456
|
this.templateRef = inject(TemplateRef);
|
|
458
457
|
}
|
|
459
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
460
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
458
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationLinkRefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
459
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NavigationLinkRefDirective, isStandalone: true, selector: "[fdbNavigationLinkRef]", ngImport: i0 }); }
|
|
461
460
|
}
|
|
462
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
461
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationLinkRefDirective, decorators: [{
|
|
463
462
|
type: Directive,
|
|
464
463
|
args: [{
|
|
465
464
|
selector: '[fdbNavigationLinkRef]',
|
|
@@ -534,15 +533,15 @@ class NavigationLinkComponent extends FdbNavigationItemLink {
|
|
|
534
533
|
ngOnDestroy() {
|
|
535
534
|
this._listItemComponent?.unregisterLink(this);
|
|
536
535
|
}
|
|
537
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
538
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
536
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
537
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.7", type: NavigationLinkComponent, isStandalone: true, selector: "a[fdb-navigation-link]", inputs: { class: "class", glyph: "glyph", glyphFont: "glyphFont", external: "external" }, host: { attributes: { "role": "link" }, listeners: { "click": "_clickHandler()", "keydown": "_keyDownHandler($event)" }, properties: { "attr.tabindex": "this._tabIndex" }, classAttribute: "fd-navigation__link" }, providers: [
|
|
539
538
|
{
|
|
540
539
|
provide: FdbNavigationItemLink,
|
|
541
540
|
useExisting: NavigationLinkComponent
|
|
542
541
|
}
|
|
543
542
|
], usesInheritance: true, hostDirectives: [{ directive: i1.RouterLinkActive }], ngImport: i0, template: "@if (glyph) {\n <fd-icon\n [glyph]=\"glyph\"\n [font]=\"glyphFont\"\n class=\"fd-navigation__icon\"\n [attr.role]=\"'presentation'\"\n [ariaHidden]=\"true\"\n ></fd-icon>\n}\n<span class=\"fd-navigation__text\">\n <ng-content></ng-content>\n</span>\n@if (external) {\n <span\n class=\"fd-navigation__external-link-indicator\"\n role=\"presentation\"\n aria-hidden=\"true\"\n aria-label=\"external link indicator\"\n ></span>\n}\n<span\n class=\"fd-navigation__selection-indicator\"\n role=\"presentation\"\n aria-hidden=\"true\"\n aria-label=\"selection indicator\"\n>\n</span>\n@if (_listItemComponent?.hasChildren$() && !inPopover && !routerLink) {\n <span\n class=\"fd-navigation__has-children-indicator\"\n role=\"presentation\"\n aria-hidden=\"true\"\n aria-label=\"has children indicator, expanded\"\n >\n </span>\n}\n", dependencies: [{ kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
544
543
|
}
|
|
545
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
544
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationLinkComponent, decorators: [{
|
|
546
545
|
type: Component,
|
|
547
546
|
args: [{ selector: 'a[fdb-navigation-link]', imports: [IconComponent, NgTemplateOutlet], hostDirectives: [RouterLinkActive], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
|
|
548
547
|
{
|
|
@@ -579,10 +578,10 @@ class NavigationListItemMarkerDirective {
|
|
|
579
578
|
this.elementRef = inject(ElementRef);
|
|
580
579
|
inject(NavigationListItemComponent).marker = this;
|
|
581
580
|
}
|
|
582
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
583
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
581
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListItemMarkerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
582
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NavigationListItemMarkerDirective, isStandalone: true, selector: "[fdbNavigationListItemMarker]", ngImport: i0 }); }
|
|
584
583
|
}
|
|
585
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
584
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListItemMarkerDirective, decorators: [{
|
|
586
585
|
type: Directive,
|
|
587
586
|
args: [{
|
|
588
587
|
selector: '[fdbNavigationListItemMarker]',
|
|
@@ -968,8 +967,8 @@ class NavigationListItemComponent extends FdbNavigationListItem {
|
|
|
968
967
|
_onZoneStable() {
|
|
969
968
|
return this._zone.onStable.pipe(startWith(this._zone.isStable), observeOn(asyncScheduler), take(1), takeUntilDestroyed(this._destroyRef));
|
|
970
969
|
}
|
|
971
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
972
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
970
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
971
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.7", type: NavigationListItemComponent, isStandalone: true, selector: "fdb-navigation-list-item", inputs: { class: "class", home: ["home", "home", booleanAttribute], separator: ["separator", "separator", booleanAttribute], spacer: ["spacer", "spacer", booleanAttribute], group: ["group", "group", booleanAttribute], expanded: ["expanded", "expanded", booleanAttribute], selected: ["selected", "selected", booleanAttribute] }, providers: [
|
|
973
972
|
NavigationService,
|
|
974
973
|
{
|
|
975
974
|
provide: FdbNavigationListItem,
|
|
@@ -979,12 +978,11 @@ class NavigationListItemComponent extends FdbNavigationListItem {
|
|
|
979
978
|
provide: FdbNavigationListItemCmp,
|
|
980
979
|
useExisting: NavigationListItemComponent
|
|
981
980
|
}
|
|
982
|
-
], queries: [{ propertyName: "link", first: true, predicate: FdbNavigationItemLink, descendants: true }, { propertyName: "linkRef", first: true, predicate: NavigationLinkRefDirective, descendants: true }, { propertyName: "listItems", predicate: FdbNavigationListItem }], viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- General renderer. -->\n<ng-template #renderer>\n @if (!separator) {\n <div\n class=\"fd-navigation__item\"\n [class.fd-navigation__item--group]=\"isGroup$()\"\n [class.fd-navigation__item--child]=\"normalizedLevel$() > 2\"\n [class.fd-navigation__item--overflow]=\"isOverflow$()\"\n [class.fd-navigation__item--with-expander]=\"!!link$()?.routerLink && hasChildren$()\"\n [attr.aria-level]=\"level$()\"\n [attr.aria-selected]=\"isActiveAttr$()\"\n [attr.aria-expanded]=\"expandedAttr$()\"\n [attr.normalized-level]=\"normalizedLevel$()\"\n (focusin)=\"_focusInHandler()\"\n fdbNavigationListItemMarker\n #itemContainer\n >\n @if (!navigation.isSnapped$() || !hasChildren$()) {\n <ng-template\n [ngTemplateOutlet]=\"linkRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: true }\"\n ></ng-template>\n } @else {\n <ng-template\n [ngTemplateOutlet]=\"snappedNavigationItemRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: itemContainer }\"\n ></ng-template>\n }\n </div>\n @if (isOverflow$() && hasChildren$()) {\n <ng-template [ngTemplateOutlet]=\"overflowItemListRenderer\"></ng-template>\n }\n @if (!navigation.isSnapped$()) {\n <ng-template [ngTemplateOutlet]=\"listRenderer\"></ng-template>\n }\n }\n</ng-template>\n<!-- Snapped navigation list item renderer. Implicit context points to the popover trigger element. -->\n<ng-template #snappedNavigationItemRenderer let-itemContainer>\n <ng-template [ngTemplateOutlet]=\"linkRenderer\" [ngTemplateOutletContext]=\"{ $implicit: false }\"></ng-template>\n @if (!isOverflow$()) {\n <fd-popover\n #popover\n [noArrow]=\"false\"\n additionalBodyClass=\"fd-navigation__list-container\"\n [isOpen]=\"popoverOpen$()\"\n (isOpenChange)=\"_onPopoverOpen($event, popover)\"\n [trigger]=\"itemContainer\"\n [focusAutoCapture]=\"true\"\n [restoreFocusOnClose]=\"false\"\n [focusTrapped]=\"true\"\n [placement]=\"_popoverPlacement$()\"\n >\n <fd-popover-body [ngClass]=\"navigation.classList$()\">\n <ng-template\n [ngTemplateOutlet]=\"wrapperRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: true }\"\n ></ng-template>\n </fd-popover-body>\n </fd-popover>\n }\n</ng-template>\n<!-- Generic link renderer. -->\n<ng-template #linkRenderer let-showToggleButton>\n <ng-template [ngTemplateOutlet]=\"linkRef?.templateRef || null\"></ng-template>\n @if (!!showToggleButton && !!link$()?.routerLink && hasChildren$()) {\n <button (click)=\"toggleExpanded()\" fd-button fdbNestedButton class=\"fd-navigation__expander\">\n <fd-icon [glyph]=\"_toggleIcon$()\"></fd-icon>\n </button>\n }\n</ng-template>\n<!-- Generic list renderer. Used when navigation is not snapped. -->\n<ng-template #listRenderer>\n @if (isGroup$() && normalizedLevel$() === 1) {\n <ul fdb-navigation-list [listItems]=\"listItems$()\" parentItems></ul>\n } @else {\n <div class=\"fd-navigation__list-container\">\n <ng-template\n [ngTemplateOutlet]=\"wrapperRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: false }\"\n ></ng-template>\n </div>\n }\n</ng-template>\n<!-- Template used for rendering sublist of items for the list item that is currently in overflow menu. -->\n<ng-template #overflowItemListRenderer>\n <div class=\"fd-navigation__list-container fd-navigation__list-container--submenu fd-menu__sublist\">\n <ng-template [ngTemplateOutlet]=\"wrapperRenderer\" [ngTemplateOutletContext]=\"{ $implicit: true }\"></ng-template>\n </div>\n</ng-template>\n<!-- Generic list renderer. Implicit context defines whether the inner list should handle keyboard navigation by its own. -->\n<ng-template #wrapperRenderer let-keyboardNavigation>\n <div class=\"fd-navigation__list-wrapper\">\n @if (navigation.isSnapped$() && !isOverflow$()) {\n <!-- If opener link itself is active, project aria-selected attribute to link repeater too. -->\n <div\n class=\"fd-navigation__item fd-navigation__item--title fd-navigation__item--child\"\n [attr.aria-selected]=\"link$()?.isActive$() || selected$()\"\n >\n <ng-template\n [ngTemplateOutlet]=\"linkRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: false }\"\n ></ng-template>\n </div>\n }\n <ul\n fdb-navigation-list\n [listItems]=\"listItems$() || []\"\n [childItems]=\"normalizedLevel$() > 2\"\n (keydown)=\"(false)\"\n (focusBefore)=\"_focusBeforeList()\"\n [withKeyboardNavigation]=\"keyboardNavigation\"\n ></ul>\n </div>\n</ng-template>\n", dependencies: [{ kind: "
|
|
981
|
+
], queries: [{ propertyName: "link", first: true, predicate: FdbNavigationItemLink, descendants: true }, { propertyName: "linkRef", first: true, predicate: NavigationLinkRefDirective, descendants: true }, { propertyName: "listItems", predicate: FdbNavigationListItem }], viewQueries: [{ propertyName: "renderer", first: true, predicate: ["renderer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- General renderer. -->\n<ng-template #renderer>\n @if (!separator) {\n <div\n class=\"fd-navigation__item\"\n [class.fd-navigation__item--group]=\"isGroup$()\"\n [class.fd-navigation__item--child]=\"normalizedLevel$() > 2\"\n [class.fd-navigation__item--overflow]=\"isOverflow$()\"\n [class.fd-navigation__item--with-expander]=\"!!link$()?.routerLink && hasChildren$()\"\n [attr.aria-level]=\"level$()\"\n [attr.aria-selected]=\"isActiveAttr$()\"\n [attr.aria-expanded]=\"expandedAttr$()\"\n [attr.normalized-level]=\"normalizedLevel$()\"\n (focusin)=\"_focusInHandler()\"\n fdbNavigationListItemMarker\n #itemContainer\n >\n @if (!navigation.isSnapped$() || !hasChildren$()) {\n <ng-template\n [ngTemplateOutlet]=\"linkRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: true }\"\n ></ng-template>\n } @else {\n <ng-template\n [ngTemplateOutlet]=\"snappedNavigationItemRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: itemContainer }\"\n ></ng-template>\n }\n </div>\n @if (isOverflow$() && hasChildren$()) {\n <ng-template [ngTemplateOutlet]=\"overflowItemListRenderer\"></ng-template>\n }\n @if (!navigation.isSnapped$()) {\n <ng-template [ngTemplateOutlet]=\"listRenderer\"></ng-template>\n }\n }\n</ng-template>\n<!-- Snapped navigation list item renderer. Implicit context points to the popover trigger element. -->\n<ng-template #snappedNavigationItemRenderer let-itemContainer>\n <ng-template [ngTemplateOutlet]=\"linkRenderer\" [ngTemplateOutletContext]=\"{ $implicit: false }\"></ng-template>\n @if (!isOverflow$()) {\n <fd-popover\n #popover\n [noArrow]=\"false\"\n additionalBodyClass=\"fd-navigation__list-container\"\n [isOpen]=\"popoverOpen$()\"\n (isOpenChange)=\"_onPopoverOpen($event, popover)\"\n [trigger]=\"itemContainer\"\n [focusAutoCapture]=\"true\"\n [restoreFocusOnClose]=\"false\"\n [focusTrapped]=\"true\"\n [placement]=\"_popoverPlacement$()\"\n >\n <fd-popover-body [ngClass]=\"navigation.classList$()\">\n <ng-template\n [ngTemplateOutlet]=\"wrapperRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: true }\"\n ></ng-template>\n </fd-popover-body>\n </fd-popover>\n }\n</ng-template>\n<!-- Generic link renderer. -->\n<ng-template #linkRenderer let-showToggleButton>\n <ng-template [ngTemplateOutlet]=\"linkRef?.templateRef || null\"></ng-template>\n @if (!!showToggleButton && !!link$()?.routerLink && hasChildren$()) {\n <button (click)=\"toggleExpanded()\" fd-button fdbNestedButton class=\"fd-navigation__expander\">\n <fd-icon [glyph]=\"_toggleIcon$()\"></fd-icon>\n </button>\n }\n</ng-template>\n<!-- Generic list renderer. Used when navigation is not snapped. -->\n<ng-template #listRenderer>\n @if (isGroup$() && normalizedLevel$() === 1) {\n <ul fdb-navigation-list [listItems]=\"listItems$()\" parentItems></ul>\n } @else {\n <div class=\"fd-navigation__list-container\">\n <ng-template\n [ngTemplateOutlet]=\"wrapperRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: false }\"\n ></ng-template>\n </div>\n }\n</ng-template>\n<!-- Template used for rendering sublist of items for the list item that is currently in overflow menu. -->\n<ng-template #overflowItemListRenderer>\n <div class=\"fd-navigation__list-container fd-navigation__list-container--submenu fd-menu__sublist\">\n <ng-template [ngTemplateOutlet]=\"wrapperRenderer\" [ngTemplateOutletContext]=\"{ $implicit: true }\"></ng-template>\n </div>\n</ng-template>\n<!-- Generic list renderer. Implicit context defines whether the inner list should handle keyboard navigation by its own. -->\n<ng-template #wrapperRenderer let-keyboardNavigation>\n <div class=\"fd-navigation__list-wrapper\">\n @if (navigation.isSnapped$() && !isOverflow$()) {\n <!-- If opener link itself is active, project aria-selected attribute to link repeater too. -->\n <div\n class=\"fd-navigation__item fd-navigation__item--title fd-navigation__item--child\"\n [attr.aria-selected]=\"link$()?.isActive$() || selected$()\"\n >\n <ng-template\n [ngTemplateOutlet]=\"linkRenderer\"\n [ngTemplateOutletContext]=\"{ $implicit: false }\"\n ></ng-template>\n </div>\n }\n <ul\n fdb-navigation-list\n [listItems]=\"listItems$() || []\"\n [childItems]=\"normalizedLevel$() > 2\"\n (keydown)=\"(false)\"\n (focusBefore)=\"_focusBeforeList()\"\n [withKeyboardNavigation]=\"keyboardNavigation\"\n ></ul>\n </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NavigationListComponent, selector: "ul[fdb-navigation-list]", inputs: ["listItems", "role", "parentItems", "childItems", "noGrow", "withKeyboardNavigation"], outputs: ["focusBefore", "focusAfter"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: NavigationListItemMarkerDirective, selector: "[fdbNavigationListItemMarker]" }, { kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "component", type: ButtonComponent, selector: "button[fd-button], a[fd-button], span[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "directive", type: NestedButtonDirective, selector: "[fd-button][fdbNestedButton]", inputs: ["fdType", "square"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
983
982
|
}
|
|
984
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
983
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListItemComponent, decorators: [{
|
|
985
984
|
type: Component,
|
|
986
985
|
args: [{ selector: 'fdb-navigation-list-item', imports: [
|
|
987
|
-
CommonModule,
|
|
988
986
|
NgTemplateOutlet,
|
|
989
987
|
NavigationListComponent,
|
|
990
988
|
PopoverComponent,
|
|
@@ -1135,15 +1133,15 @@ class NavigationMoreButtonComponent {
|
|
|
1135
1133
|
}
|
|
1136
1134
|
this.popoverOpen$.set(isOpenAction);
|
|
1137
1135
|
}
|
|
1138
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
1139
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.
|
|
1136
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMoreButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1137
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: NavigationMoreButtonComponent, isStandalone: true, selector: "li[fdb-navigation-more-button]", inputs: { listItems: "listItems" }, host: { classAttribute: "fd-navigation__list-item" }, providers: [
|
|
1140
1138
|
{
|
|
1141
1139
|
provide: FdbNavigationListItem,
|
|
1142
1140
|
useExisting: NavigationMoreButtonComponent
|
|
1143
1141
|
}
|
|
1144
1142
|
], viewQueries: [{ propertyName: "_link", first: true, predicate: FdbNavigationItemLink, descendants: true }], ngImport: i0, template: "<div\n aria-current=\"page\"\n role=\"menuitem\"\n class=\"fd-navigation__item\"\n [attr.aria-expanded]=\"popoverOpen$()\"\n aria-level=\"1\"\n (click)=\"togglePopover(true)\"\n (keydown)=\"_keydownPopoverToggle($event)\"\n #trigger\n>\n <a fdb-navigation-link glyph=\"overflow\">More Items</a>\n <fd-popover\n [trigger]=\"trigger\"\n [triggers]=\"[]\"\n [isOpen]=\"popoverOpen$()\"\n (isOpenChange)=\"popoverOpen$.set($event)\"\n [focusTrapped]=\"true\"\n [noArrow]=\"false\"\n additionalBodyClass=\"fd-navigation__list-container fd-navigation__list-container--menu\"\n [placement]=\"_popoverPlacement$()\"\n >\n <fd-popover-body [ngClass]=\"_navigation.classList$()\">\n <ul\n fdb-navigation-list\n withKeyboardNavigation\n [parentItems]=\"true\"\n class=\"fd-menu__list\"\n [listItems]=\"listItems\"\n ></ul>\n </fd-popover-body>\n </fd-popover>\n</div>\n", dependencies: [{ kind: "component", type: NavigationLinkComponent, selector: "a[fdb-navigation-link]", inputs: ["class", "glyph", "glyphFont", "external"] }, { kind: "component", type: NavigationListComponent, selector: "ul[fdb-navigation-list]", inputs: ["listItems", "role", "parentItems", "childItems", "noGrow", "withKeyboardNavigation"], outputs: ["focusBefore", "focusAfter"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll"] }, { kind: "component", type: PopoverBodyComponent, selector: "fd-popover-body", inputs: ["minWidth", "maxWidth", "minHeight", "maxHeight"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1145
1143
|
}
|
|
1146
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
1144
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationMoreButtonComponent, decorators: [{
|
|
1147
1145
|
type: Component,
|
|
1148
1146
|
args: [{ selector: 'li[fdb-navigation-more-button]', imports: [
|
|
1149
1147
|
NavigationLinkComponent,
|
|
@@ -1168,7 +1166,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImpor
|
|
|
1168
1166
|
args: [FdbNavigationItemLink]
|
|
1169
1167
|
}] } });
|
|
1170
1168
|
|
|
1171
|
-
/* eslint-disable no-unused-vars */
|
|
1172
1169
|
const FD_NAVIGATION_OVERFLOW_ITEM_CLASS = 'fd-navigation__container--hidden-overflow';
|
|
1173
1170
|
class NavigationContentStartComponent extends FdbNavigationContentContainer {
|
|
1174
1171
|
constructor() {
|
|
@@ -1274,15 +1271,15 @@ class NavigationContentStartComponent extends FdbNavigationContentContainer {
|
|
|
1274
1271
|
this.navigation.showMoreButton$.set(this._showMoreButton);
|
|
1275
1272
|
this._calculationInProgress = false;
|
|
1276
1273
|
}
|
|
1277
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
1278
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
1274
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationContentStartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1275
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.7", type: NavigationContentStartComponent, isStandalone: true, selector: "fdb-navigation-content-start", inputs: { contentProjected: "contentProjected" }, host: { properties: { "style.flex-grow": "1" }, classAttribute: "fd-navigation__container fd-navigation__container--top" }, providers: [
|
|
1279
1276
|
{
|
|
1280
1277
|
provide: FdbNavigationContentContainer,
|
|
1281
1278
|
useExisting: NavigationContentStartComponent
|
|
1282
1279
|
}
|
|
1283
|
-
], queries: [{ propertyName: "_listItems", predicate: FdbNavigationListItem, descendants: true }], viewQueries: [{ propertyName: "_moreContainer", first: true, predicate: ["moreContainer"], descendants: true, read: ElementRef }, { propertyName: "_showMoreButton", first: true, predicate: NavigationMoreButtonComponent, descendants: true }], usesInheritance: true, hostDirectives: [{ directive: i1$
|
|
1280
|
+
], queries: [{ propertyName: "_listItems", predicate: FdbNavigationListItem, descendants: true }], viewQueries: [{ propertyName: "_moreContainer", first: true, predicate: ["moreContainer"], descendants: true, read: ElementRef }, { propertyName: "_showMoreButton", first: true, predicate: NavigationMoreButtonComponent, descendants: true }], usesInheritance: true, hostDirectives: [{ directive: i1$1.ScrollbarDirective }], ngImport: i0, template: "<ul fdb-navigation-list [listItems]=\"visibleItems$()\"></ul>\n@if (_showMoreButton$()) {\n <ul noGrow fdb-navigation-list role=\"menubar\" #moreContainer>\n <li fdb-navigation-more-button [listItems]=\"hiddenItems$()\"></li>\n </ul>\n}\n", dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "component", type: NavigationListComponent, selector: "ul[fdb-navigation-list]", inputs: ["listItems", "role", "parentItems", "childItems", "noGrow", "withKeyboardNavigation"], outputs: ["focusBefore", "focusAfter"] }, { kind: "component", type: NavigationMoreButtonComponent, selector: "li[fdb-navigation-more-button]", inputs: ["listItems"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1284
1281
|
}
|
|
1285
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
1282
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationContentStartComponent, decorators: [{
|
|
1286
1283
|
type: Component,
|
|
1287
1284
|
args: [{ selector: 'fdb-navigation-content-start', imports: [PortalModule, NgTemplateOutlet, NavigationListComponent, NavigationMoreButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
1288
1285
|
class: 'fd-navigation__container fd-navigation__container--top',
|
|
@@ -1347,15 +1344,15 @@ class NavigationDataSourceParser {
|
|
|
1347
1344
|
}
|
|
1348
1345
|
|
|
1349
1346
|
class NavigationListDataSourceDirective extends DataSourceDirective {
|
|
1350
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
1351
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.
|
|
1347
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListDataSourceDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1348
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.0.7", type: NavigationListDataSourceDirective, isStandalone: true, selector: "fdb-navigation[dataSource]", providers: [
|
|
1352
1349
|
{
|
|
1353
1350
|
provide: FD_DATA_SOURCE_TRANSFORMER,
|
|
1354
1351
|
useClass: NavigationDataSourceParser
|
|
1355
1352
|
}
|
|
1356
1353
|
], usesInheritance: true, ngImport: i0 }); }
|
|
1357
1354
|
}
|
|
1358
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
1355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationListDataSourceDirective, decorators: [{
|
|
1359
1356
|
type: Directive,
|
|
1360
1357
|
args: [{
|
|
1361
1358
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -1536,8 +1533,8 @@ class NavigationComponent extends FdbNavigation {
|
|
|
1536
1533
|
this._navigationItems.reset(items);
|
|
1537
1534
|
}
|
|
1538
1535
|
}
|
|
1539
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.
|
|
1540
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.
|
|
1536
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1537
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.7", type: NavigationComponent, isStandalone: true, selector: "fdb-navigation", inputs: { class: "class", mode: "mode", state: "state", type: "type" }, host: { attributes: { "role": "navigation" }, listeners: { "keydown": "_keyDownHandler($event)" } }, providers: [
|
|
1541
1538
|
NavigationService,
|
|
1542
1539
|
{
|
|
1543
1540
|
provide: FdbNavigation,
|
|
@@ -1551,7 +1548,7 @@ __decorate([
|
|
|
1551
1548
|
__metadata("design:paramtypes", []),
|
|
1552
1549
|
__metadata("design:returntype", Array)
|
|
1553
1550
|
], NavigationComponent.prototype, "buildComponentCssClass", null);
|
|
1554
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.
|
|
1551
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.7", ngImport: i0, type: NavigationComponent, decorators: [{
|
|
1555
1552
|
type: Component,
|
|
1556
1553
|
args: [{ selector: 'fdb-navigation', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
1557
1554
|
NavigationService,
|