@fundamental-ngx/btp 0.55.2 → 0.55.3-rc.1
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 +16 -16
- package/fesm2022/fundamental-ngx-btp-navigation.mjs +39 -39
- package/fesm2022/fundamental-ngx-btp-search-field.mjs +3 -3
- package/fesm2022/fundamental-ngx-btp-splitter.mjs +22 -22
- package/fesm2022/fundamental-ngx-btp-tool-header.mjs +33 -33
- package/fesm2022/fundamental-ngx-btp-tool-layout.mjs +19 -19
- 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.
|
|
21
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
20
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ButtonTypeGuard, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
21
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", type: ButtonTypeGuard, isStandalone: true, usesOnChanges: true, ngImport: i0 }); }
|
|
22
22
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", 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.
|
|
41
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.
|
|
40
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NestedButtonDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
41
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "19.2.3", 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.
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", 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.
|
|
63
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
62
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ToolHeaderButtonDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
63
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", 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.
|
|
65
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: ToolHeaderButtonDirective, decorators: [{
|
|
66
66
|
type: Directive,
|
|
67
67
|
args: [{
|
|
68
68
|
selector: '[fd-button][fdbToolHeaderButton]',
|
|
@@ -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.
|
|
40
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
39
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationMenuItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
40
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", 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.
|
|
63
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", 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.
|
|
114
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
113
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", 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.2.3", type: NavigationMenuPopoverControlDirective, isStandalone: true, selector: "[fdbNavigationMenuPopoverControl]", ngImport: i0 }); }
|
|
115
115
|
}
|
|
116
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
116
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", 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.7", 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.
|
|
126
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
125
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationMenuPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
126
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", 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.
|
|
137
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", 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.
|
|
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 }); }
|
|
159
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
160
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.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 }); }
|
|
161
161
|
}
|
|
162
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
162
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", 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.7", ngImpor
|
|
|
167
167
|
}], ctorParameters: () => [] });
|
|
168
168
|
|
|
169
169
|
class NavigationMenuModule {
|
|
170
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
171
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.
|
|
172
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.
|
|
170
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationMenuModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
171
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.3", ngImport: i0, type: NavigationMenuModule, imports: [NavigationMenuComponent, NavigationMenuItemComponent], exports: [NavigationMenuComponent, NavigationMenuItemComponent] }); }
|
|
172
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationMenuModule, imports: [NavigationMenuItemComponent] }); }
|
|
173
173
|
}
|
|
174
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationMenuModule, decorators: [{
|
|
175
175
|
type: NgModule,
|
|
176
176
|
args: [{
|
|
177
177
|
imports: [NavigationMenuComponent, NavigationMenuItemComponent],
|
|
@@ -126,10 +126,10 @@ class NavigationService {
|
|
|
126
126
|
/** Currently active list item. */
|
|
127
127
|
this.currentItem$ = new Subject();
|
|
128
128
|
}
|
|
129
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
130
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.
|
|
129
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
130
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationService }); }
|
|
131
131
|
}
|
|
132
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
132
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationService, decorators: [{
|
|
133
133
|
type: Injectable
|
|
134
134
|
}] });
|
|
135
135
|
|
|
@@ -251,10 +251,10 @@ class NavigationListComponent {
|
|
|
251
251
|
.withVerticalOrientation()
|
|
252
252
|
.skipPredicate((item) => item.skipNavigation);
|
|
253
253
|
}
|
|
254
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
255
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
254
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
255
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", 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 }); }
|
|
256
256
|
}
|
|
257
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
257
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListComponent, decorators: [{
|
|
258
258
|
type: Component,
|
|
259
259
|
args: [{ selector: 'ul[fdb-navigation-list]', imports: [NgTemplateOutlet], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
260
260
|
class: 'fd-navigation__list',
|
|
@@ -317,15 +317,15 @@ class NavigationContentEndComponent extends FdbNavigationContentContainer {
|
|
|
317
317
|
this.listItems$.set(this._listItems.toArray());
|
|
318
318
|
});
|
|
319
319
|
}
|
|
320
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
321
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
320
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationContentEndComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
321
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: NavigationContentEndComponent, isStandalone: true, selector: "fdb-navigation-content-end", inputs: { contentProjected: "contentProjected" }, host: { classAttribute: "fd-navigation__container fd-navigation__container--bottom" }, providers: [
|
|
322
322
|
{
|
|
323
323
|
provide: FdbNavigationContentContainer,
|
|
324
324
|
useExisting: NavigationContentEndComponent
|
|
325
325
|
}
|
|
326
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 }); }
|
|
327
327
|
}
|
|
328
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
328
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationContentEndComponent, decorators: [{
|
|
329
329
|
type: Component,
|
|
330
330
|
args: [{
|
|
331
331
|
selector: 'fdb-navigation-content-end',
|
|
@@ -401,15 +401,15 @@ class NavigationListItemDirective {
|
|
|
401
401
|
this._item = null;
|
|
402
402
|
this.childDirectives().clear();
|
|
403
403
|
}
|
|
404
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
405
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
404
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
405
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", type: NavigationListItemDirective, isStandalone: true, selector: "[fdbNavigationListItem]", inputs: { item: "item" }, providers: [
|
|
406
406
|
{
|
|
407
407
|
provide: FdbNavigationListItem,
|
|
408
408
|
useExisting: NavigationListItemDirective
|
|
409
409
|
}
|
|
410
410
|
], exportAs: ["fdbListItem"], ngImport: i0 }); }
|
|
411
411
|
}
|
|
412
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
412
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListItemDirective, decorators: [{
|
|
413
413
|
type: Directive,
|
|
414
414
|
args: [{
|
|
415
415
|
selector: '[fdbNavigationListItem]',
|
|
@@ -434,10 +434,10 @@ class NavigationListItemRefDirective {
|
|
|
434
434
|
static ngTemplateContextGuard(dir, ctx) {
|
|
435
435
|
return true;
|
|
436
436
|
}
|
|
437
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
438
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
437
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListItemRefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
438
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", type: NavigationListItemRefDirective, isStandalone: true, selector: "[fdbNavigationListItemRef]", inputs: { fdbNavigationListItemRefAs: "fdbNavigationListItemRefAs" }, ngImport: i0 }); }
|
|
439
439
|
}
|
|
440
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
440
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListItemRefDirective, decorators: [{
|
|
441
441
|
type: Directive,
|
|
442
442
|
args: [{
|
|
443
443
|
selector: '[fdbNavigationListItemRef]',
|
|
@@ -455,10 +455,10 @@ class NavigationLinkRefDirective {
|
|
|
455
455
|
/** Link template ref. */
|
|
456
456
|
this.templateRef = inject(TemplateRef);
|
|
457
457
|
}
|
|
458
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
459
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
458
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationLinkRefDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
459
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", type: NavigationLinkRefDirective, isStandalone: true, selector: "[fdbNavigationLinkRef]", ngImport: i0 }); }
|
|
460
460
|
}
|
|
461
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
461
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationLinkRefDirective, decorators: [{
|
|
462
462
|
type: Directive,
|
|
463
463
|
args: [{
|
|
464
464
|
selector: '[fdbNavigationLinkRef]',
|
|
@@ -533,15 +533,15 @@ class NavigationLinkComponent extends FdbNavigationItemLink {
|
|
|
533
533
|
ngOnDestroy() {
|
|
534
534
|
this._listItemComponent?.unregisterLink(this);
|
|
535
535
|
}
|
|
536
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
537
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
536
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationLinkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
537
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", 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: [
|
|
538
538
|
{
|
|
539
539
|
provide: FdbNavigationItemLink,
|
|
540
540
|
useExisting: NavigationLinkComponent
|
|
541
541
|
}
|
|
542
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 }); }
|
|
543
543
|
}
|
|
544
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
544
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationLinkComponent, decorators: [{
|
|
545
545
|
type: Component,
|
|
546
546
|
args: [{ selector: 'a[fdb-navigation-link]', imports: [IconComponent, NgTemplateOutlet], hostDirectives: [RouterLinkActive], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
|
|
547
547
|
{
|
|
@@ -578,10 +578,10 @@ class NavigationListItemMarkerDirective {
|
|
|
578
578
|
this.elementRef = inject(ElementRef);
|
|
579
579
|
inject(NavigationListItemComponent).marker = this;
|
|
580
580
|
}
|
|
581
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
582
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
581
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListItemMarkerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
582
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", type: NavigationListItemMarkerDirective, isStandalone: true, selector: "[fdbNavigationListItemMarker]", ngImport: i0 }); }
|
|
583
583
|
}
|
|
584
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
584
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListItemMarkerDirective, decorators: [{
|
|
585
585
|
type: Directive,
|
|
586
586
|
args: [{
|
|
587
587
|
selector: '[fdbNavigationListItemMarker]',
|
|
@@ -967,8 +967,8 @@ class NavigationListItemComponent extends FdbNavigationListItem {
|
|
|
967
967
|
_onZoneStable() {
|
|
968
968
|
return this._zone.onStable.pipe(startWith(this._zone.isStable), observeOn(asyncScheduler), take(1), takeUntilDestroyed(this._destroyRef));
|
|
969
969
|
}
|
|
970
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
971
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
970
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
971
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", 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: [
|
|
972
972
|
NavigationService,
|
|
973
973
|
{
|
|
974
974
|
provide: FdbNavigationListItem,
|
|
@@ -980,7 +980,7 @@ class NavigationListItemComponent extends FdbNavigationListItem {
|
|
|
980
980
|
}
|
|
981
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 }); }
|
|
982
982
|
}
|
|
983
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
983
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListItemComponent, decorators: [{
|
|
984
984
|
type: Component,
|
|
985
985
|
args: [{ selector: 'fdb-navigation-list-item', imports: [
|
|
986
986
|
NgTemplateOutlet,
|
|
@@ -1133,15 +1133,15 @@ class NavigationMoreButtonComponent {
|
|
|
1133
1133
|
}
|
|
1134
1134
|
this.popoverOpen$.set(isOpenAction);
|
|
1135
1135
|
}
|
|
1136
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
1137
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.
|
|
1136
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationMoreButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1137
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: NavigationMoreButtonComponent, isStandalone: true, selector: "li[fdb-navigation-more-button]", inputs: { listItems: "listItems" }, host: { classAttribute: "fd-navigation__list-item" }, providers: [
|
|
1138
1138
|
{
|
|
1139
1139
|
provide: FdbNavigationListItem,
|
|
1140
1140
|
useExisting: NavigationMoreButtonComponent
|
|
1141
1141
|
}
|
|
1142
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 }); }
|
|
1143
1143
|
}
|
|
1144
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
1144
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationMoreButtonComponent, decorators: [{
|
|
1145
1145
|
type: Component,
|
|
1146
1146
|
args: [{ selector: 'li[fdb-navigation-more-button]', imports: [
|
|
1147
1147
|
NavigationLinkComponent,
|
|
@@ -1271,15 +1271,15 @@ class NavigationContentStartComponent extends FdbNavigationContentContainer {
|
|
|
1271
1271
|
this.navigation.showMoreButton$.set(this._showMoreButton);
|
|
1272
1272
|
this._calculationInProgress = false;
|
|
1273
1273
|
}
|
|
1274
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
1275
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
1274
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationContentStartComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
1275
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", 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: [
|
|
1276
1276
|
{
|
|
1277
1277
|
provide: FdbNavigationContentContainer,
|
|
1278
1278
|
useExisting: NavigationContentStartComponent
|
|
1279
1279
|
}
|
|
1280
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 }); }
|
|
1281
1281
|
}
|
|
1282
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
1282
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationContentStartComponent, decorators: [{
|
|
1283
1283
|
type: Component,
|
|
1284
1284
|
args: [{ selector: 'fdb-navigation-content-start', imports: [PortalModule, NgTemplateOutlet, NavigationListComponent, NavigationMoreButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
|
|
1285
1285
|
class: 'fd-navigation__container fd-navigation__container--top',
|
|
@@ -1344,15 +1344,15 @@ class NavigationDataSourceParser {
|
|
|
1344
1344
|
}
|
|
1345
1345
|
|
|
1346
1346
|
class NavigationListDataSourceDirective extends DataSourceDirective {
|
|
1347
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
1348
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.
|
|
1347
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListDataSourceDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1348
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.3", type: NavigationListDataSourceDirective, isStandalone: true, selector: "fdb-navigation[dataSource]", providers: [
|
|
1349
1349
|
{
|
|
1350
1350
|
provide: FD_DATA_SOURCE_TRANSFORMER,
|
|
1351
1351
|
useClass: NavigationDataSourceParser
|
|
1352
1352
|
}
|
|
1353
1353
|
], usesInheritance: true, ngImport: i0 }); }
|
|
1354
1354
|
}
|
|
1355
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
1355
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationListDataSourceDirective, decorators: [{
|
|
1356
1356
|
type: Directive,
|
|
1357
1357
|
args: [{
|
|
1358
1358
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -1533,8 +1533,8 @@ class NavigationComponent extends FdbNavigation {
|
|
|
1533
1533
|
this._navigationItems.reset(items);
|
|
1534
1534
|
}
|
|
1535
1535
|
}
|
|
1536
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
1537
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.
|
|
1536
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1537
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.3", 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: [
|
|
1538
1538
|
NavigationService,
|
|
1539
1539
|
{
|
|
1540
1540
|
provide: FdbNavigation,
|
|
@@ -1548,7 +1548,7 @@ __decorate([
|
|
|
1548
1548
|
__metadata("design:paramtypes", []),
|
|
1549
1549
|
__metadata("design:returntype", Array)
|
|
1550
1550
|
], NavigationComponent.prototype, "buildComponentCssClass", null);
|
|
1551
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
1551
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: NavigationComponent, decorators: [{
|
|
1552
1552
|
type: Component,
|
|
1553
1553
|
args: [{ selector: 'fdb-navigation', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, providers: [
|
|
1554
1554
|
NavigationService,
|
|
@@ -47,10 +47,10 @@ class SearchFieldComponent {
|
|
|
47
47
|
_search() {
|
|
48
48
|
this.search.emit(this._value);
|
|
49
49
|
}
|
|
50
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.
|
|
51
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.7", type: SearchFieldComponent, isStandalone: true, selector: "fdb-search-field", inputs: { placeholder: "placeholder" }, outputs: { search: "search" }, providers: [CvaControl], viewQueries: [{ propertyName: "_searchInputField", first: true, predicate: ["searchInputField"], descendants: true }], hostDirectives: [{ directive: i1.CvaDirective }], ngImport: i0, template: "<div class=\"fd-search-field\">\n <fd-icon glyph=\"search\" class=\"fd-search-field__icon\" role=\"presentation\" [ariaHidden]=\"true\"></fd-icon>\n <input\n [placeholder]=\"placeholder || ('btpSearchField.searchInputPlaceholder' | fdTranslate)\"\n type=\"search\"\n [attr.aria-label]=\"'btpSearchField.searchInputAriaLabel' | fdTranslate\"\n class=\"fd-search-field__input\"\n [ngModel]=\"_value\"\n (ngModelChange)=\"updateValue($event)\"\n (keydown.enter)=\"_search()\"\n (focusin)=\"_inputFocused.set(true)\"\n (focusout)=\"_inputFocused.set(false)\"\n #searchInputField\n />\n <div role=\"presentation\" aria-hidden=\"true\" class=\"fd-search-field__underline\"></div>\n <div class=\"fd-search-field__actions\">\n <div class=\"fd-search-field__action-container\">\n <button\n fd-button\n fdbNestedButton\n glyph=\"decline\"\n [ariaLabel]=\"'btpSearchField.clearButtonLabel' | fdTranslate\"\n (click)=\"updateValue(''); searchInputField.focus()\"\n ></button>\n </div>\n <div class=\"fd-search-field__action-container\">\n <button\n fd-button\n (click)=\"_search()\"\n glyph=\"slim-arrow-right\"\n fdbNestedButton\n [class.is-focus]=\"_value && _inputFocused()\"\n [ariaLabel]=\"'btpSearchField.searchButtonLabel' | fdTranslate\"\n [attr.aria-disabled]=\"!_value\"\n [attr.tabindex]=\"!_value ? -1 : 0\"\n ></button>\n </div>\n </div>\n</div>\n", styles: [".fd-search-field{--fdSearchField_Height:2.5rem;--fdSearchField_Height_Compact:2rem;--fdSearchField_Height_Border:calc(var(--fdSearchField_Height) - .125rem);--fdSearchField_Border_Radius:var(--fdSearchField_BorderRadius);--fdSearchField_Padding:.625rem;--fdSearchField_Padding_Compact:.5rem;--fdSearchField_Box_Shadow:var(--sapField_Shadow);--fdSearchField_Background:var(--fdSearchField_Background_Normal);--fdSearchField_Color:var(--sapShell_TextColor);--fdSearchField_Icon_Size:1rem;--fdSearchField_Icon_Size_Offset:.375rem;--fdSearchField_Actions_Offset:.25rem;--fdSearchField_Actions_Offset_Compact:.1875rem;--fdSearchField_Action_Container_Size:2rem;--fdSearchField_Action_Container_Size_Compact:1.625rem;--fdSearchField_Clear_Button_Display:none;--fdSearchField_Padding_Left:calc(var(--fdSearchField_Padding) + var(--fdSearchField_Icon_Size) + var(--fdSearchField_Icon_Size_Offset));--fdSearchField_Padding_Left_Compact:calc(var(--fdSearchField_Padding_Compact) + var(--fdSearchField_Icon_Size) + var(--fdSearchField_Icon_Size_Offset));--fdSearchField_Padding_Right:calc(var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset));--fdSearchField_Padding_Right_Compact:calc(var(--fdSearchField_Action_Container_Size_Compact) + var(--fdSearchField_Actions_Offset_Compact));--fdSearchField_Padding_Right_Typed:calc(var(--fdSearchField_Padding_Right)*2);--fdSearchField_Padding_Right_Typed_Compact:calc(var(--fdSearchField_Padding_Right_Compact)*2);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-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:.0625rem solid var(--fdSearchField_Border_Color);border-radius:var(--fdSearchField_Border_Radius);height:var(--fdSearchField_Height);max-height:var(--fdSearchField_Height);min-height:var(--fdSearchField_Height);position:relative;width:16rem}.fd-search-field:after,.fd-search-field:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__icon{color:var(--fdSearchField_Icon_Color);height:1rem;left:var(--fdSearchField_Padding);max-height:1rem;max-width:1rem;min-height:1rem;min-width:1rem;position:absolute;width:1rem;z-index:10}.fd-search-field__icon[dir=rtl],[dir=rtl] .fd-search-field__icon{left:auto;right:var(--fdSearchField_Padding)}.fd-search-field__icon [class*=sap-icon],.fd-search-field__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;font-size:1rem}.fd-search-field__input{background:var(--fdSearchField_Background);border:0;border-radius:var(--fdSearchField_Border_Radius);-webkit-box-shadow:var(--fdSearchField_Box_Shadow);box-shadow:var(--fdSearchField_Box_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSearchField_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdSearchField_Height_Border);line-height:normal;margin-block:0;margin-inline:0;max-height:var(--fdSearchField_Height_Border);min-height:var(--fdSearchField_Height_Border);padding-block:0;padding-block:var(--fdSearchField_Padding);padding-inline:0;padding-inline:var(--fdSearchField_Padding_Left) var(--fdSearchField_Padding_Right);width:16rem;z-index:1}.fd-search-field__input:after,.fd-search-field__input:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__input::-webkit-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-moz-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input:-ms-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-ms-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-webkit-search-cancel-button,.fd-search-field__input::-webkit-search-decoration,.fd-search-field__input::-webkit-search-results-button,.fd-search-field__input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.fd-search-field__input:not(:-moz-placeholder-shown){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:-ms-input-placeholder){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:placeholder-shown){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:-moz-placeholder-shown)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:-moz-placeholder-shown):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:-ms-input-placeholder)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:-ms-input-placeholder):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:placeholder-shown)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:placeholder-shown):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:-moz-placeholder-shown)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:-ms-input-placeholder)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:placeholder-shown)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:-moz-placeholder-shown)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:-ms-input-placeholder)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:placeholder-shown)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:-moz-placeholder-shown).is-focus,.fd-search-field__input:not(:-moz-placeholder-shown):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input:not(:-ms-input-placeholder).is-focus,.fd-search-field__input:not(:-ms-input-placeholder):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input:not(:placeholder-shown).is-focus,.fd-search-field__input:not(:placeholder-shown):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input.is-hover,.fd-search-field__input:hover{--fdSearchField_Background:var(--fdSearchField_Background_Hover);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input.is-hover+.fd-search-field__underline,.fd-search-field__input:hover+.fd-search-field__underline{display:none}.fd-search-field__input.is-focus,.fd-search-field__input:focus{z-index:5;--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Border_Color:transparent;--fdSearchField_Box_Shadow:none;outline:var(--fdSearchField_Outline);outline-offset:var(--fdSearchField_Outline_Offset)}.fd-search-field__input.is-focus+.fd-search-field__underline,.fd-search-field__input:focus+.fd-search-field__underline{display:none}.fd-search-field__underline{border:0;border-radius:var(--fdSearchField_Border_Radius);-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;height:100%;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;position:absolute;width:100%}.fd-search-field__underline:after,.fd-search-field__underline:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__underline:after{background:var(--fdSearchField_Underline_Color);bottom:0;content:\"\";height:.0625rem;position:absolute;width:100%;z-index:30}.fd-search-field__actions{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-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;position:absolute;right:var(--fdSearchField_Actions_Offset);z-index:10}.fd-search-field__actions:after,.fd-search-field__actions:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__actions[dir=rtl],[dir=rtl] .fd-search-field__actions{left:var(--fdSearchField_Actions_Offset);right:auto}.fd-search-field__actions button.is-disabled,.fd-search-field__actions button:disabled,.fd-search-field__actions button[aria-disabled=true]{opacity:1}.fd-search-field__action-container{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-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:var(--fdSearchField_Action_Container_Size);max-height:var(--fdSearchField_Action_Container_Size);max-width:var(--fdSearchField_Action_Container_Size);min-height:var(--fdSearchField_Action_Container_Size);min-width:var(--fdSearchField_Action_Container_Size);width:var(--fdSearchField_Action_Container_Size)}.fd-search-field__action-container:after,.fd-search-field__action-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__action-container:first-child{display:var(--fdSearchField_Clear_Button_Display)}.fd-search-field__action-container button{--fdButton_Nested_Color:var(--sapShell_TextColor)}.fd-search-field[class*=-compact],[class*=-compact] .fd-search-field:not([class*=-cozy]){--fdSearchField_Height:var(--fdSearchField_Height_Compact);--fdSearchField_Padding:var(--fdSearchField_Padding_Compact);--fdSearchField_Actions_Offset:var(--fdSearchField_Actions_Offset_Compact);--fdSearchField_Action_Container_Size:var(--fdSearchField_Action_Container_Size_Compact);--fdSearchField_Padding_Left:var(--fdSearchField_Padding_Left_Compact);--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Compact)}\n/*! Bundled license information:\n\nfundamental-styles/dist/search-field.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"], dependencies: [{ kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { 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"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
50
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: SearchFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
51
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: SearchFieldComponent, isStandalone: true, selector: "fdb-search-field", inputs: { placeholder: "placeholder" }, outputs: { search: "search" }, providers: [CvaControl], viewQueries: [{ propertyName: "_searchInputField", first: true, predicate: ["searchInputField"], descendants: true }], hostDirectives: [{ directive: i1.CvaDirective }], ngImport: i0, template: "<div class=\"fd-search-field\">\n <fd-icon glyph=\"search\" class=\"fd-search-field__icon\" role=\"presentation\" [ariaHidden]=\"true\"></fd-icon>\n <input\n [placeholder]=\"placeholder || ('btpSearchField.searchInputPlaceholder' | fdTranslate)\"\n type=\"search\"\n [attr.aria-label]=\"'btpSearchField.searchInputAriaLabel' | fdTranslate\"\n class=\"fd-search-field__input\"\n [ngModel]=\"_value\"\n (ngModelChange)=\"updateValue($event)\"\n (keydown.enter)=\"_search()\"\n (focusin)=\"_inputFocused.set(true)\"\n (focusout)=\"_inputFocused.set(false)\"\n #searchInputField\n />\n <div role=\"presentation\" aria-hidden=\"true\" class=\"fd-search-field__underline\"></div>\n <div class=\"fd-search-field__actions\">\n <div class=\"fd-search-field__action-container\">\n <button\n fd-button\n fdbNestedButton\n glyph=\"decline\"\n [ariaLabel]=\"'btpSearchField.clearButtonLabel' | fdTranslate\"\n (click)=\"updateValue(''); searchInputField.focus()\"\n ></button>\n </div>\n <div class=\"fd-search-field__action-container\">\n <button\n fd-button\n (click)=\"_search()\"\n glyph=\"slim-arrow-right\"\n fdbNestedButton\n [class.is-focus]=\"_value && _inputFocused()\"\n [ariaLabel]=\"'btpSearchField.searchButtonLabel' | fdTranslate\"\n [attr.aria-disabled]=\"!_value\"\n [attr.tabindex]=\"!_value ? -1 : 0\"\n ></button>\n </div>\n </div>\n</div>\n", styles: [".fd-search-field{--fdSearchField_Height:2.5rem;--fdSearchField_Height_Compact:2rem;--fdSearchField_Height_Border:calc(var(--fdSearchField_Height) - .125rem);--fdSearchField_Border_Radius:var(--fdSearchField_BorderRadius);--fdSearchField_Padding:.625rem;--fdSearchField_Padding_Compact:.5rem;--fdSearchField_Box_Shadow:var(--sapField_Shadow);--fdSearchField_Background:var(--fdSearchField_Background_Normal);--fdSearchField_Color:var(--sapShell_TextColor);--fdSearchField_Icon_Size:1rem;--fdSearchField_Icon_Size_Offset:.375rem;--fdSearchField_Actions_Offset:.25rem;--fdSearchField_Actions_Offset_Compact:.1875rem;--fdSearchField_Action_Container_Size:2rem;--fdSearchField_Action_Container_Size_Compact:1.625rem;--fdSearchField_Clear_Button_Display:none;--fdSearchField_Padding_Left:calc(var(--fdSearchField_Padding) + var(--fdSearchField_Icon_Size) + var(--fdSearchField_Icon_Size_Offset));--fdSearchField_Padding_Left_Compact:calc(var(--fdSearchField_Padding_Compact) + var(--fdSearchField_Icon_Size) + var(--fdSearchField_Icon_Size_Offset));--fdSearchField_Padding_Right:calc(var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset));--fdSearchField_Padding_Right_Compact:calc(var(--fdSearchField_Action_Container_Size_Compact) + var(--fdSearchField_Actions_Offset_Compact));--fdSearchField_Padding_Right_Typed:calc(var(--fdSearchField_Padding_Right)*2);--fdSearchField_Padding_Right_Typed_Compact:calc(var(--fdSearchField_Padding_Right_Compact)*2);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-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:.0625rem solid var(--fdSearchField_Border_Color);border-radius:var(--fdSearchField_Border_Radius);height:var(--fdSearchField_Height);max-height:var(--fdSearchField_Height);min-height:var(--fdSearchField_Height);position:relative;width:16rem}.fd-search-field:after,.fd-search-field:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__icon{color:var(--fdSearchField_Icon_Color);height:1rem;left:var(--fdSearchField_Padding);max-height:1rem;max-width:1rem;min-height:1rem;min-width:1rem;position:absolute;width:1rem;z-index:10}.fd-search-field__icon[dir=rtl],[dir=rtl] .fd-search-field__icon{left:auto;right:var(--fdSearchField_Padding)}.fd-search-field__icon [class*=sap-icon],.fd-search-field__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;font-size:1rem}.fd-search-field__input{background:var(--fdSearchField_Background);border:0;border-radius:var(--fdSearchField_Border_Radius);-webkit-box-shadow:var(--fdSearchField_Box_Shadow);box-shadow:var(--fdSearchField_Box_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSearchField_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdSearchField_Height_Border);line-height:normal;margin-block:0;margin-inline:0;max-height:var(--fdSearchField_Height_Border);min-height:var(--fdSearchField_Height_Border);padding-block:0;padding-block:var(--fdSearchField_Padding);padding-inline:0;padding-inline:var(--fdSearchField_Padding_Left) var(--fdSearchField_Padding_Right);width:16rem;z-index:1}.fd-search-field__input:after,.fd-search-field__input:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__input::-webkit-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-moz-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input:-ms-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-ms-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-webkit-search-cancel-button,.fd-search-field__input::-webkit-search-decoration,.fd-search-field__input::-webkit-search-results-button,.fd-search-field__input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.fd-search-field__input:not(:-moz-placeholder-shown){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:-ms-input-placeholder){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:placeholder-shown){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:-moz-placeholder-shown)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:-moz-placeholder-shown):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:-ms-input-placeholder)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:-ms-input-placeholder):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:placeholder-shown)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:placeholder-shown):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:-moz-placeholder-shown)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:-ms-input-placeholder)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:placeholder-shown)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:-moz-placeholder-shown)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:-ms-input-placeholder)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:placeholder-shown)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:-moz-placeholder-shown).is-focus,.fd-search-field__input:not(:-moz-placeholder-shown):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input:not(:-ms-input-placeholder).is-focus,.fd-search-field__input:not(:-ms-input-placeholder):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input:not(:placeholder-shown).is-focus,.fd-search-field__input:not(:placeholder-shown):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input.is-hover,.fd-search-field__input:hover{--fdSearchField_Background:var(--fdSearchField_Background_Hover);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input.is-hover+.fd-search-field__underline,.fd-search-field__input:hover+.fd-search-field__underline{display:none}.fd-search-field__input.is-focus,.fd-search-field__input:focus{z-index:5;--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Border_Color:transparent;--fdSearchField_Box_Shadow:none;outline:var(--fdSearchField_Outline);outline-offset:var(--fdSearchField_Outline_Offset)}.fd-search-field__input.is-focus+.fd-search-field__underline,.fd-search-field__input:focus+.fd-search-field__underline{display:none}.fd-search-field__underline{border:0;border-radius:var(--fdSearchField_Border_Radius);-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;height:100%;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;position:absolute;width:100%}.fd-search-field__underline:after,.fd-search-field__underline:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__underline:after{background:var(--fdSearchField_Underline_Color);bottom:0;content:\"\";height:.0625rem;position:absolute;width:100%;z-index:30}.fd-search-field__actions{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-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;position:absolute;right:var(--fdSearchField_Actions_Offset);z-index:10}.fd-search-field__actions:after,.fd-search-field__actions:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__actions[dir=rtl],[dir=rtl] .fd-search-field__actions{left:var(--fdSearchField_Actions_Offset);right:auto}.fd-search-field__actions button.is-disabled,.fd-search-field__actions button:disabled,.fd-search-field__actions button[aria-disabled=true]{opacity:1}.fd-search-field__action-container{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-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:var(--fdSearchField_Action_Container_Size);max-height:var(--fdSearchField_Action_Container_Size);max-width:var(--fdSearchField_Action_Container_Size);min-height:var(--fdSearchField_Action_Container_Size);min-width:var(--fdSearchField_Action_Container_Size);width:var(--fdSearchField_Action_Container_Size)}.fd-search-field__action-container:after,.fd-search-field__action-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__action-container:first-child{display:var(--fdSearchField_Clear_Button_Display)}.fd-search-field__action-container button{--fdButton_Nested_Color:var(--sapShell_TextColor)}.fd-search-field[class*=-compact],[class*=-compact] .fd-search-field:not([class*=-cozy]){--fdSearchField_Height:var(--fdSearchField_Height_Compact);--fdSearchField_Padding:var(--fdSearchField_Padding_Compact);--fdSearchField_Actions_Offset:var(--fdSearchField_Actions_Offset_Compact);--fdSearchField_Action_Container_Size:var(--fdSearchField_Action_Container_Size_Compact);--fdSearchField_Padding_Left:var(--fdSearchField_Padding_Left_Compact);--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Compact)}\n/*! Bundled license information:\n\nfundamental-styles/dist/search-field.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"], dependencies: [{ kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "class", "ariaLabel", "ariaHidden"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }, { 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"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
52
52
|
}
|
|
53
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.
|
|
53
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: SearchFieldComponent, decorators: [{
|
|
54
54
|
type: Component,
|
|
55
55
|
args: [{ selector: 'fdb-search-field', hostDirectives: [CvaDirective], providers: [CvaControl], imports: [IconComponent, FormsModule, FdTranslatePipe, ButtonComponent, NestedButtonDirective], encapsulation: ViewEncapsulation.None, template: "<div class=\"fd-search-field\">\n <fd-icon glyph=\"search\" class=\"fd-search-field__icon\" role=\"presentation\" [ariaHidden]=\"true\"></fd-icon>\n <input\n [placeholder]=\"placeholder || ('btpSearchField.searchInputPlaceholder' | fdTranslate)\"\n type=\"search\"\n [attr.aria-label]=\"'btpSearchField.searchInputAriaLabel' | fdTranslate\"\n class=\"fd-search-field__input\"\n [ngModel]=\"_value\"\n (ngModelChange)=\"updateValue($event)\"\n (keydown.enter)=\"_search()\"\n (focusin)=\"_inputFocused.set(true)\"\n (focusout)=\"_inputFocused.set(false)\"\n #searchInputField\n />\n <div role=\"presentation\" aria-hidden=\"true\" class=\"fd-search-field__underline\"></div>\n <div class=\"fd-search-field__actions\">\n <div class=\"fd-search-field__action-container\">\n <button\n fd-button\n fdbNestedButton\n glyph=\"decline\"\n [ariaLabel]=\"'btpSearchField.clearButtonLabel' | fdTranslate\"\n (click)=\"updateValue(''); searchInputField.focus()\"\n ></button>\n </div>\n <div class=\"fd-search-field__action-container\">\n <button\n fd-button\n (click)=\"_search()\"\n glyph=\"slim-arrow-right\"\n fdbNestedButton\n [class.is-focus]=\"_value && _inputFocused()\"\n [ariaLabel]=\"'btpSearchField.searchButtonLabel' | fdTranslate\"\n [attr.aria-disabled]=\"!_value\"\n [attr.tabindex]=\"!_value ? -1 : 0\"\n ></button>\n </div>\n </div>\n</div>\n", styles: [".fd-search-field{--fdSearchField_Height:2.5rem;--fdSearchField_Height_Compact:2rem;--fdSearchField_Height_Border:calc(var(--fdSearchField_Height) - .125rem);--fdSearchField_Border_Radius:var(--fdSearchField_BorderRadius);--fdSearchField_Padding:.625rem;--fdSearchField_Padding_Compact:.5rem;--fdSearchField_Box_Shadow:var(--sapField_Shadow);--fdSearchField_Background:var(--fdSearchField_Background_Normal);--fdSearchField_Color:var(--sapShell_TextColor);--fdSearchField_Icon_Size:1rem;--fdSearchField_Icon_Size_Offset:.375rem;--fdSearchField_Actions_Offset:.25rem;--fdSearchField_Actions_Offset_Compact:.1875rem;--fdSearchField_Action_Container_Size:2rem;--fdSearchField_Action_Container_Size_Compact:1.625rem;--fdSearchField_Clear_Button_Display:none;--fdSearchField_Padding_Left:calc(var(--fdSearchField_Padding) + var(--fdSearchField_Icon_Size) + var(--fdSearchField_Icon_Size_Offset));--fdSearchField_Padding_Left_Compact:calc(var(--fdSearchField_Padding_Compact) + var(--fdSearchField_Icon_Size) + var(--fdSearchField_Icon_Size_Offset));--fdSearchField_Padding_Right:calc(var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset));--fdSearchField_Padding_Right_Compact:calc(var(--fdSearchField_Action_Container_Size_Compact) + var(--fdSearchField_Actions_Offset_Compact));--fdSearchField_Padding_Right_Typed:calc(var(--fdSearchField_Padding_Right)*2);--fdSearchField_Padding_Right_Typed_Compact:calc(var(--fdSearchField_Padding_Right_Compact)*2);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-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;border:.0625rem solid var(--fdSearchField_Border_Color);border-radius:var(--fdSearchField_Border_Radius);height:var(--fdSearchField_Height);max-height:var(--fdSearchField_Height);min-height:var(--fdSearchField_Height);position:relative;width:16rem}.fd-search-field:after,.fd-search-field:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__icon{color:var(--fdSearchField_Icon_Color);height:1rem;left:var(--fdSearchField_Padding);max-height:1rem;max-width:1rem;min-height:1rem;min-width:1rem;position:absolute;width:1rem;z-index:10}.fd-search-field__icon[dir=rtl],[dir=rtl] .fd-search-field__icon{left:auto;right:var(--fdSearchField_Padding)}.fd-search-field__icon [class*=sap-icon],.fd-search-field__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;font-size:1rem}.fd-search-field__input{background:var(--fdSearchField_Background);border:0;border-radius:var(--fdSearchField_Border_Radius);-webkit-box-shadow:var(--fdSearchField_Box_Shadow);box-shadow:var(--fdSearchField_Box_Shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdSearchField_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdSearchField_Height_Border);line-height:normal;margin-block:0;margin-inline:0;max-height:var(--fdSearchField_Height_Border);min-height:var(--fdSearchField_Height_Border);padding-block:0;padding-block:var(--fdSearchField_Padding);padding-inline:0;padding-inline:var(--fdSearchField_Padding_Left) var(--fdSearchField_Padding_Right);width:16rem;z-index:1}.fd-search-field__input:after,.fd-search-field__input:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__input::-webkit-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-moz-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input:-ms-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-ms-input-placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::placeholder{color:var(--fdSearchField_Placeholder_Color);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-style:italic;font-weight:400;line-height:1rem}.fd-search-field__input::-webkit-search-cancel-button,.fd-search-field__input::-webkit-search-decoration,.fd-search-field__input::-webkit-search-results-button,.fd-search-field__input::-webkit-search-results-decoration{-webkit-appearance:none;appearance:none}.fd-search-field__input:not(:-moz-placeholder-shown){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:-ms-input-placeholder){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:placeholder-shown){--fdSearchField_Padding_Right:calc((var(--fdSearchField_Action_Container_Size) + var(--fdSearchField_Actions_Offset))*2);--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input:not(:-moz-placeholder-shown)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:-moz-placeholder-shown):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:-ms-input-placeholder)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:-ms-input-placeholder):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:placeholder-shown)[class*=-compact],[class*=-compact] .fd-search-field__input:not(:placeholder-shown):not([class*=-cozy]){--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Typed_Compact)}.fd-search-field__input:not(:-moz-placeholder-shown)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:-ms-input-placeholder)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:placeholder-shown)+.fd-search-field__underline{display:none}.fd-search-field__input:not(:-moz-placeholder-shown)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:-ms-input-placeholder)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:placeholder-shown)~.fd-search-field__actions{--fdSearchField_Clear_Button_Display:inline-flex}.fd-search-field__input:not(:-moz-placeholder-shown).is-focus,.fd-search-field__input:not(:-moz-placeholder-shown):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input:not(:-ms-input-placeholder).is-focus,.fd-search-field__input:not(:-ms-input-placeholder):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input:not(:placeholder-shown).is-focus,.fd-search-field__input:not(:placeholder-shown):focus{z-index:5;--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow);outline:none}.fd-search-field__input.is-hover,.fd-search-field__input:hover{--fdSearchField_Background:var(--fdSearchField_Background_Hover);--fdSearchField_Box_Shadow:var(--sapSearchHover_Shadow)}.fd-search-field__input.is-hover+.fd-search-field__underline,.fd-search-field__input:hover+.fd-search-field__underline{display:none}.fd-search-field__input.is-focus,.fd-search-field__input:focus{z-index:5;--fdSearchField_Background:var(--fdSearchField_Background_Focus);--fdSearchField_Border_Color:transparent;--fdSearchField_Box_Shadow:none;outline:var(--fdSearchField_Outline);outline-offset:var(--fdSearchField_Outline_Offset)}.fd-search-field__input.is-focus+.fd-search-field__underline,.fd-search-field__input:focus+.fd-search-field__underline{display:none}.fd-search-field__underline{border:0;border-radius:var(--fdSearchField_Border_Radius);-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;height:100%;line-height:normal;margin-block:0;margin-inline:0;overflow:hidden;padding-block:0;padding-inline:0;position:absolute;width:100%}.fd-search-field__underline:after,.fd-search-field__underline:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__underline:after{background:var(--fdSearchField_Underline_Color);bottom:0;content:\"\";height:.0625rem;position:absolute;width:100%;z-index:30}.fd-search-field__actions{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-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:100%;position:absolute;right:var(--fdSearchField_Actions_Offset);z-index:10}.fd-search-field__actions:after,.fd-search-field__actions:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__actions[dir=rtl],[dir=rtl] .fd-search-field__actions{left:var(--fdSearchField_Actions_Offset);right:auto}.fd-search-field__actions button.is-disabled,.fd-search-field__actions button:disabled,.fd-search-field__actions button[aria-disabled=true]{opacity:1}.fd-search-field__action-container{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-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:var(--fdSearchField_Action_Container_Size);max-height:var(--fdSearchField_Action_Container_Size);max-width:var(--fdSearchField_Action_Container_Size);min-height:var(--fdSearchField_Action_Container_Size);min-width:var(--fdSearchField_Action_Container_Size);width:var(--fdSearchField_Action_Container_Size)}.fd-search-field__action-container:after,.fd-search-field__action-container:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-search-field__action-container:first-child{display:var(--fdSearchField_Clear_Button_Display)}.fd-search-field__action-container button{--fdButton_Nested_Color:var(--sapShell_TextColor)}.fd-search-field[class*=-compact],[class*=-compact] .fd-search-field:not([class*=-cozy]){--fdSearchField_Height:var(--fdSearchField_Height_Compact);--fdSearchField_Padding:var(--fdSearchField_Padding_Compact);--fdSearchField_Actions_Offset:var(--fdSearchField_Actions_Offset_Compact);--fdSearchField_Action_Container_Size:var(--fdSearchField_Action_Container_Size_Compact);--fdSearchField_Padding_Left:var(--fdSearchField_Padding_Left_Compact);--fdSearchField_Padding_Right:var(--fdSearchField_Padding_Right_Compact)}\n/*! Bundled license information:\n\nfundamental-styles/dist/search-field.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"] }]
|
|
56
56
|
}], propDecorators: { placeholder: [{
|