@fundamental-ngx/core 0.34.3-rc.13 → 0.34.3-rc.16
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/action-bar/package.json +1 -1
- package/action-sheet/package.json +1 -1
- package/alert/package.json +1 -1
- package/avatar/package.json +1 -1
- package/avatar-group/package.json +1 -1
- package/bar/package.json +1 -1
- package/breadcrumb/package.json +1 -1
- package/busy-indicator/package.json +1 -1
- package/button/package.json +1 -1
- package/calendar/package.json +1 -1
- package/card/package.json +1 -1
- package/carousel/package.json +1 -1
- package/checkbox/package.json +1 -1
- package/combobox/package.json +1 -1
- package/date-picker/package.json +1 -1
- package/datetime/package.json +1 -1
- package/datetime-picker/datetime-picker.component.d.ts +7 -1
- package/datetime-picker/datetime-picker.module.d.ts +3 -2
- package/datetime-picker/esm2020/datetime-picker.component.mjs +21 -10
- package/datetime-picker/esm2020/datetime-picker.module.mjs +5 -1
- package/datetime-picker/fesm2015/fundamental-ngx-core-datetime-picker.mjs +25 -10
- package/datetime-picker/fesm2015/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
- package/datetime-picker/fesm2020/fundamental-ngx-core-datetime-picker.mjs +25 -10
- package/datetime-picker/fesm2020/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
- package/datetime-picker/package.json +1 -1
- package/dialog/package.json +1 -1
- package/dynamic-page/package.json +1 -1
- package/dynamic-side-content/package.json +1 -1
- package/esm2020/datetime-picker/datetime-picker.component.mjs +21 -10
- package/esm2020/datetime-picker/datetime-picker.module.mjs +5 -1
- package/esm2020/feed-list-item/components/item/feed-list-item.component.mjs +1 -1
- package/esm2020/form/form-label/form-label.component.mjs +7 -6
- package/esm2020/form/form-label/form-label.module.mjs +5 -4
- package/esm2020/link/link.component.mjs +6 -3
- package/esm2020/multi-input/multi-input.component.mjs +1 -1
- package/esm2020/text/text.component.mjs +1 -1
- package/esm2020/time-picker/time-picker.component.mjs +4 -1
- package/facets/package.json +1 -1
- package/feed-input/package.json +1 -1
- package/feed-list-item/esm2020/components/item/feed-list-item.component.mjs +1 -1
- package/feed-list-item/fesm2015/fundamental-ngx-core-feed-list-item.mjs +1 -1
- package/feed-list-item/fesm2020/fundamental-ngx-core-feed-list-item.mjs +1 -1
- package/feed-list-item/package.json +1 -1
- package/fesm2015/fundamental-ngx-core-datetime-picker.mjs +25 -10
- package/fesm2015/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-feed-list-item.mjs +1 -1
- package/fesm2015/fundamental-ngx-core-form.mjs +10 -8
- package/fesm2015/fundamental-ngx-core-form.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-link.mjs +5 -2
- package/fesm2015/fundamental-ngx-core-link.mjs.map +1 -1
- package/fesm2015/fundamental-ngx-core-multi-input.mjs +1 -1
- package/fesm2015/fundamental-ngx-core-text.mjs +1 -1
- package/fesm2015/fundamental-ngx-core-time-picker.mjs +3 -0
- package/fesm2015/fundamental-ngx-core-time-picker.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-datetime-picker.mjs +25 -10
- package/fesm2020/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-feed-list-item.mjs +1 -1
- package/fesm2020/fundamental-ngx-core-form.mjs +10 -8
- package/fesm2020/fundamental-ngx-core-form.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-link.mjs +5 -2
- package/fesm2020/fundamental-ngx-core-link.mjs.map +1 -1
- package/fesm2020/fundamental-ngx-core-multi-input.mjs +1 -1
- package/fesm2020/fundamental-ngx-core-text.mjs +1 -1
- package/fesm2020/fundamental-ngx-core-time-picker.mjs +3 -0
- package/fesm2020/fundamental-ngx-core-time-picker.mjs.map +1 -1
- package/file-uploader/package.json +1 -1
- package/fixed-card-layout/package.json +1 -1
- package/flexible-column-layout/package.json +1 -1
- package/form/esm2020/form-label/form-label.component.mjs +7 -6
- package/form/esm2020/form-label/form-label.module.mjs +5 -4
- package/form/fesm2015/fundamental-ngx-core-form.mjs +10 -8
- package/form/fesm2015/fundamental-ngx-core-form.mjs.map +1 -1
- package/form/fesm2020/fundamental-ngx-core-form.mjs +10 -8
- package/form/fesm2020/fundamental-ngx-core-form.mjs.map +1 -1
- package/form/form-label/form-label.module.d.ts +2 -1
- package/form/package.json +1 -1
- package/formatted-text/package.json +1 -1
- package/grid-list/package.json +1 -1
- package/icon/package.json +1 -1
- package/illustrated-message/package.json +1 -1
- package/infinite-scroll/package.json +1 -1
- package/info-label/package.json +1 -1
- package/inline-help/package.json +1 -1
- package/input-group/package.json +1 -1
- package/layout-grid/package.json +1 -1
- package/layout-panel/package.json +1 -1
- package/link/esm2020/link.component.mjs +6 -3
- package/link/fesm2015/fundamental-ngx-core-link.mjs +5 -2
- package/link/fesm2015/fundamental-ngx-core-link.mjs.map +1 -1
- package/link/fesm2020/fundamental-ngx-core-link.mjs +5 -2
- package/link/fesm2020/fundamental-ngx-core-link.mjs.map +1 -1
- package/link/link.component.d.ts +3 -1
- package/link/package.json +1 -1
- package/list/package.json +1 -1
- package/menu/package.json +1 -1
- package/message-box/package.json +1 -1
- package/message-strip/package.json +1 -1
- package/message-toast/package.json +1 -1
- package/micro-process-flow/package.json +1 -1
- package/mobile-mode/package.json +1 -1
- package/multi-input/esm2020/multi-input.component.mjs +1 -1
- package/multi-input/fesm2015/fundamental-ngx-core-multi-input.mjs +1 -1
- package/multi-input/fesm2020/fundamental-ngx-core-multi-input.mjs +1 -1
- package/multi-input/package.json +1 -1
- package/nested-list/package.json +1 -1
- package/notification/package.json +1 -1
- package/object-identifier/package.json +1 -1
- package/object-marker/package.json +1 -1
- package/object-number/package.json +1 -1
- package/object-status/package.json +1 -1
- package/package.json +1 -1
- package/pagination/package.json +1 -1
- package/panel/package.json +1 -1
- package/popover/package.json +1 -1
- package/product-switch/package.json +1 -1
- package/progress-indicator/package.json +1 -1
- package/quick-view/package.json +1 -1
- package/radio/package.json +1 -1
- package/rating-indicator/package.json +1 -1
- package/resizable-card-layout/package.json +1 -1
- package/scroll-spy/package.json +1 -1
- package/scrollbar/package.json +1 -1
- package/segmented-button/package.json +1 -1
- package/select/package.json +1 -1
- package/shared/package.json +1 -1
- package/shellbar/package.json +1 -1
- package/side-navigation/package.json +1 -1
- package/slider/package.json +1 -1
- package/split-button/package.json +1 -1
- package/splitter/package.json +1 -1
- package/status-indicator/package.json +1 -1
- package/step-input/package.json +1 -1
- package/switch/package.json +1 -1
- package/table/package.json +1 -1
- package/tabs/package.json +1 -1
- package/text/esm2020/text.component.mjs +1 -1
- package/text/fesm2015/fundamental-ngx-core-text.mjs +1 -1
- package/text/fesm2020/fundamental-ngx-core-text.mjs +1 -1
- package/text/package.json +1 -1
- package/tile/package.json +1 -1
- package/time/package.json +1 -1
- package/time-picker/esm2020/time-picker.component.mjs +4 -1
- package/time-picker/fesm2015/fundamental-ngx-core-time-picker.mjs +3 -0
- package/time-picker/fesm2015/fundamental-ngx-core-time-picker.mjs.map +1 -1
- package/time-picker/fesm2020/fundamental-ngx-core-time-picker.mjs +3 -0
- package/time-picker/fesm2020/fundamental-ngx-core-time-picker.mjs.map +1 -1
- package/time-picker/package.json +1 -1
- package/timeline/package.json +1 -1
- package/title/package.json +1 -1
- package/token/package.json +1 -1
- package/toolbar/package.json +1 -1
- package/tree/package.json +1 -1
- package/upload-collection/package.json +1 -1
- package/utils/package.json +1 -1
- package/vertical-navigation/package.json +1 -1
- package/wizard/package.json +1 -1
package/input-group/package.json
CHANGED
package/layout-grid/package.json
CHANGED
|
@@ -21,6 +21,7 @@ export class LinkComponent {
|
|
|
21
21
|
this.disabled ? 'is-disabled' : '',
|
|
22
22
|
this.inverted ? `fd-link--inverted` : '',
|
|
23
23
|
this.subtle ? 'fd-link--subtle' : '',
|
|
24
|
+
this.undecorated ? 'fd-link--undecorated' : '',
|
|
24
25
|
this.class
|
|
25
26
|
];
|
|
26
27
|
}
|
|
@@ -34,7 +35,7 @@ export class LinkComponent {
|
|
|
34
35
|
}
|
|
35
36
|
}
|
|
36
37
|
LinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: LinkComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
37
|
-
LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: { class: "class", emphasized: "emphasized", disabled: "disabled", inverted: "inverted", subtle: "subtle" }, usesOnChanges: true, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
38
|
+
LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: { class: "class", emphasized: "emphasized", disabled: "disabled", inverted: "inverted", subtle: "subtle", undecorated: "undecorated" }, usesOnChanges: true, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}.fd-link--undecorated:hover,.fd-link--undecorated:hover [class*=sap-icon],.fd-link--undecorated:hover[class*=sap-icon]{text-decoration:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
38
39
|
__decorate([
|
|
39
40
|
applyCssClass,
|
|
40
41
|
__metadata("design:type", Function),
|
|
@@ -43,7 +44,7 @@ __decorate([
|
|
|
43
44
|
], LinkComponent.prototype, "buildComponentCssClass", null);
|
|
44
45
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: LinkComponent, decorators: [{
|
|
45
46
|
type: Component,
|
|
46
|
-
args: [{ selector: '[fdLink], [fd-link]', template: ` <ng-content></ng-content> `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}\n"] }]
|
|
47
|
+
args: [{ selector: '[fdLink], [fd-link]', template: ` <ng-content></ng-content> `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}.fd-link--undecorated:hover,.fd-link--undecorated:hover [class*=sap-icon],.fd-link--undecorated:hover[class*=sap-icon]{text-decoration:none}\n"] }]
|
|
47
48
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { class: [{
|
|
48
49
|
type: Input
|
|
49
50
|
}], emphasized: [{
|
|
@@ -54,9 +55,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
|
|
|
54
55
|
type: Input
|
|
55
56
|
}], subtle: [{
|
|
56
57
|
type: Input
|
|
58
|
+
}], undecorated: [{
|
|
59
|
+
type: Input
|
|
57
60
|
}],
|
|
58
61
|
/** CssClassBuilder interface implementation
|
|
59
62
|
* function is responsible for order which css classes are applied
|
|
60
63
|
*/
|
|
61
64
|
buildComponentCssClass: [] } });
|
|
62
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
65
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGluay5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9saWJzL2NvcmUvc3JjL2xpYi9saW5rL2xpbmsuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQ0gsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFDVCxVQUFVLEVBQ1YsS0FBSyxFQUVMLGlCQUFpQixFQUVwQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sNkJBQTZCLENBQUM7O0FBVzVELE1BQU0sT0FBTyxhQUFhO0lBeUJ0QixjQUFjO0lBQ2QsWUFBb0IsV0FBdUI7UUFBdkIsZ0JBQVcsR0FBWCxXQUFXLENBQVk7SUFBRyxDQUFDO0lBRS9DLGNBQWM7SUFDZCxXQUFXO1FBQ1AsSUFBSSxDQUFDLHNCQUFzQixFQUFFLENBQUM7SUFDbEMsQ0FBQztJQU1ELEFBSEE7O09BRUc7SUFDSCxzQkFBc0I7UUFDbEIsT0FBTztZQUNILFNBQVM7WUFDVCxJQUFJLENBQUMsVUFBVSxDQUFDLENBQUMsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsRUFBRTtZQUM1QyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDLEVBQUU7WUFDbEMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxDQUFDLENBQUMsbUJBQW1CLENBQUMsQ0FBQyxDQUFDLEVBQUU7WUFDeEMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxDQUFDLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFDLEVBQUU7WUFDcEMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDLENBQUMsc0JBQXNCLENBQUMsQ0FBQyxDQUFDLEVBQUU7WUFDOUMsSUFBSSxDQUFDLEtBQUs7U0FDYixDQUFDO0lBQ04sQ0FBQztJQUVELGNBQWM7SUFDZCxVQUFVO1FBQ04sT0FBTyxJQUFJLENBQUMsV0FBVyxDQUFDO0lBQzVCLENBQUM7SUFFRCxjQUFjO0lBQ2QsUUFBUTtRQUNKLElBQUksQ0FBQyxzQkFBc0IsRUFBRSxDQUFDO0lBQ2xDLENBQUM7OzBHQXpEUSxhQUFhOzhGQUFiLGFBQWEsZ09BTFosNkJBQTZCO0FBMEN2QztJQUpDLGFBQWE7Ozs7MkRBY2I7MkZBL0NRLGFBQWE7a0JBUnpCLFNBQVM7K0JBRUkscUJBQXFCLFlBQ3JCLDZCQUE2QixpQkFFeEIsaUJBQWlCLENBQUMsSUFBSSxtQkFDcEIsdUJBQXVCLENBQUMsTUFBTTtpR0FLL0MsS0FBSztzQkFESixLQUFLO2dCQUtOLFVBQVU7c0JBRFQsS0FBSztnQkFLTixRQUFRO3NCQURQLEtBQUs7Z0JBS04sUUFBUTtzQkFEUCxLQUFLO2dCQUtOLE1BQU07c0JBREwsS0FBSztnQkFLTixXQUFXO3NCQURWLEtBQUs7O1FBWU47O1dBRUc7UUFDSCxzQkFBc0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xuICAgIENoYW5nZURldGVjdGlvblN0cmF0ZWd5LFxuICAgIENvbXBvbmVudCxcbiAgICBFbGVtZW50UmVmLFxuICAgIElucHV0LFxuICAgIE9uQ2hhbmdlcyxcbiAgICBWaWV3RW5jYXBzdWxhdGlvbixcbiAgICBPbkluaXRcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBhcHBseUNzc0NsYXNzIH0gZnJvbSAnQGZ1bmRhbWVudGFsLW5neC9jb3JlL3V0aWxzJztcbmltcG9ydCB7IENzc0NsYXNzQnVpbGRlciB9IGZyb20gJ0BmdW5kYW1lbnRhbC1uZ3gvY29yZS91dGlscyc7XG5cbkBDb21wb25lbnQoe1xuICAgIC8vIGVzbGludC1kaXNhYmxlLW5leHQtbGluZSBAYW5ndWxhci1lc2xpbnQvY29tcG9uZW50LXNlbGVjdG9yXG4gICAgc2VsZWN0b3I6ICdbZmRMaW5rXSwgW2ZkLWxpbmtdJyxcbiAgICB0ZW1wbGF0ZTogYCA8bmctY29udGVudD48L25nLWNvbnRlbnQ+IGAsXG4gICAgc3R5bGVVcmxzOiBbJy4vbGluay5jb21wb25lbnQuc2NzcyddLFxuICAgIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmUsXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2hcbn0pXG5leHBvcnQgY2xhc3MgTGlua0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcywgT25Jbml0LCBDc3NDbGFzc0J1aWxkZXIge1xuICAgIC8qKiB1c2VyJ3MgY3VzdG9tIGNsYXNzZXMgKi9cbiAgICBASW5wdXQoKVxuICAgIGNsYXNzOiBzdHJpbmc7XG5cbiAgICAvKiogV2hldGhlciB1c2VyIHdhbnRzIHRvIHVzZSBlbXBoYXNpemVkIG1vZGUgKi9cbiAgICBASW5wdXQoKVxuICAgIGVtcGhhc2l6ZWQ6IGJvb2xlYW47XG5cbiAgICAvKiogV2hldGhlciB1c2VyIHdhbnRzIHRvIHB1dCBkaXNhYmxlZCBtb2RlICovXG4gICAgQElucHV0KClcbiAgICBkaXNhYmxlZDogYm9vbGVhbjtcblxuICAgIC8qKiBXaGV0aGVyIHVzZXIgd2FudHMgdG8gdXNlIGludmVydGVkIG1vZGUgKi9cbiAgICBASW5wdXQoKVxuICAgIGludmVydGVkOiBib29sZWFuO1xuXG4gICAgLyoqIFdoZXRoZXIgdXNlciB3YW50cyB0byB1c2Ugc3VidGxlIG1vZGUgKi9cbiAgICBASW5wdXQoKVxuICAgIHN1YnRsZTogYm9vbGVhbjtcblxuICAgIC8qKiBXaGV0aGVyIHVzZXIgd2FudHMgdG8gaGF2ZSBhIGxpbmsgd2l0aG91dCB1bmRlcmxpbmUgZGVjb3JhdGlvbiAqL1xuICAgIEBJbnB1dCgpXG4gICAgdW5kZWNvcmF0ZWQ6IGJvb2xlYW47XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgX2VsZW1lbnRSZWY6IEVsZW1lbnRSZWYpIHt9XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIG5nT25DaGFuZ2VzKCk6IHZvaWQge1xuICAgICAgICB0aGlzLmJ1aWxkQ29tcG9uZW50Q3NzQ2xhc3MoKTtcbiAgICB9XG5cbiAgICBAYXBwbHlDc3NDbGFzc1xuICAgIC8qKiBDc3NDbGFzc0J1aWxkZXIgaW50ZXJmYWNlIGltcGxlbWVudGF0aW9uXG4gICAgICogZnVuY3Rpb24gaXMgcmVzcG9uc2libGUgZm9yIG9yZGVyIHdoaWNoIGNzcyBjbGFzc2VzIGFyZSBhcHBsaWVkXG4gICAgICovXG4gICAgYnVpbGRDb21wb25lbnRDc3NDbGFzcygpOiBzdHJpbmdbXSB7XG4gICAgICAgIHJldHVybiBbXG4gICAgICAgICAgICAnZmQtbGluaycsXG4gICAgICAgICAgICB0aGlzLmVtcGhhc2l6ZWQgPyAnZmQtbGluay0tZW1waGFzaXplZCcgOiAnJyxcbiAgICAgICAgICAgIHRoaXMuZGlzYWJsZWQgPyAnaXMtZGlzYWJsZWQnIDogJycsXG4gICAgICAgICAgICB0aGlzLmludmVydGVkID8gYGZkLWxpbmstLWludmVydGVkYCA6ICcnLFxuICAgICAgICAgICAgdGhpcy5zdWJ0bGUgPyAnZmQtbGluay0tc3VidGxlJyA6ICcnLFxuICAgICAgICAgICAgdGhpcy51bmRlY29yYXRlZCA/ICdmZC1saW5rLS11bmRlY29yYXRlZCcgOiAnJyxcbiAgICAgICAgICAgIHRoaXMuY2xhc3NcbiAgICAgICAgXTtcbiAgICB9XG5cbiAgICAvKiogQGhpZGRlbiAqL1xuICAgIGVsZW1lbnRSZWYoKTogRWxlbWVudFJlZjxhbnk+IHtcbiAgICAgICAgcmV0dXJuIHRoaXMuX2VsZW1lbnRSZWY7XG4gICAgfVxuXG4gICAgLyoqIEBoaWRkZW4gKi9cbiAgICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICAgICAgdGhpcy5idWlsZENvbXBvbmVudENzc0NsYXNzKCk7XG4gICAgfVxufVxuIl19
|
|
@@ -23,6 +23,7 @@ class LinkComponent {
|
|
|
23
23
|
this.disabled ? 'is-disabled' : '',
|
|
24
24
|
this.inverted ? `fd-link--inverted` : '',
|
|
25
25
|
this.subtle ? 'fd-link--subtle' : '',
|
|
26
|
+
this.undecorated ? 'fd-link--undecorated' : '',
|
|
26
27
|
this.class
|
|
27
28
|
];
|
|
28
29
|
}
|
|
@@ -36,7 +37,7 @@ class LinkComponent {
|
|
|
36
37
|
}
|
|
37
38
|
}
|
|
38
39
|
LinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: LinkComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
39
|
-
LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: { class: "class", emphasized: "emphasized", disabled: "disabled", inverted: "inverted", subtle: "subtle" }, usesOnChanges: true, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
40
|
+
LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: { class: "class", emphasized: "emphasized", disabled: "disabled", inverted: "inverted", subtle: "subtle", undecorated: "undecorated" }, usesOnChanges: true, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}.fd-link--undecorated:hover,.fd-link--undecorated:hover [class*=sap-icon],.fd-link--undecorated:hover[class*=sap-icon]{text-decoration:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
40
41
|
__decorate([
|
|
41
42
|
applyCssClass,
|
|
42
43
|
__metadata("design:type", Function),
|
|
@@ -45,7 +46,7 @@ __decorate([
|
|
|
45
46
|
], LinkComponent.prototype, "buildComponentCssClass", null);
|
|
46
47
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: LinkComponent, decorators: [{
|
|
47
48
|
type: Component,
|
|
48
|
-
args: [{ selector: '[fdLink], [fd-link]', template: ` <ng-content></ng-content> `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}\n"] }]
|
|
49
|
+
args: [{ selector: '[fdLink], [fd-link]', template: ` <ng-content></ng-content> `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}.fd-link--undecorated:hover,.fd-link--undecorated:hover [class*=sap-icon],.fd-link--undecorated:hover[class*=sap-icon]{text-decoration:none}\n"] }]
|
|
49
50
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { class: [{
|
|
50
51
|
type: Input
|
|
51
52
|
}], emphasized: [{
|
|
@@ -56,6 +57,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
|
|
|
56
57
|
type: Input
|
|
57
58
|
}], subtle: [{
|
|
58
59
|
type: Input
|
|
60
|
+
}], undecorated: [{
|
|
61
|
+
type: Input
|
|
59
62
|
}],
|
|
60
63
|
/** CssClassBuilder interface implementation
|
|
61
64
|
* function is responsible for order which css classes are applied
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-core-link.mjs","sources":["../../../../../libs/core/src/lib/link/link.component.ts","../../../../../libs/core/src/lib/link/link.module.ts","../../../../../libs/core/src/lib/link/fundamental-ngx-core-link.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n Input,\n OnChanges,\n ViewEncapsulation,\n OnInit\n} from '@angular/core';\nimport { applyCssClass } from '@fundamental-ngx/core/utils';\nimport { CssClassBuilder } from '@fundamental-ngx/core/utils';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fdLink], [fd-link]',\n template: ` <ng-content></ng-content> `,\n styleUrls: ['./link.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LinkComponent implements OnChanges, OnInit, CssClassBuilder {\n /** user's custom classes */\n @Input()\n class: string;\n\n /** Whether user wants to use emphasized mode */\n @Input()\n emphasized: boolean;\n\n /** Whether user wants to put disabled mode */\n @Input()\n disabled: boolean;\n\n /** Whether user wants to use inverted mode */\n @Input()\n inverted: boolean;\n\n /** Whether user wants to use subtle mode */\n @Input()\n subtle: boolean;\n\n /** @hidden */\n constructor(private _elementRef: ElementRef) {}\n\n /** @hidden */\n ngOnChanges(): void {\n this.buildComponentCssClass();\n }\n\n @applyCssClass\n /** CssClassBuilder interface implementation\n * function is responsible for order which css classes are applied\n */\n buildComponentCssClass(): string[] {\n return [\n 'fd-link',\n this.emphasized ? 'fd-link--emphasized' : '',\n this.disabled ? 'is-disabled' : '',\n this.inverted ? `fd-link--inverted` : '',\n this.subtle ? 'fd-link--subtle' : '',\n this.class\n ];\n }\n\n /** @hidden */\n elementRef(): ElementRef<any> {\n return this._elementRef;\n }\n\n /** @hidden */\n ngOnInit(): void {\n this.buildComponentCssClass();\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { LinkComponent } from './link.component';\n\n@NgModule({\n declarations: [LinkComponent],\n imports: [CommonModule],\n exports: [LinkComponent]\n})\nexport class LinkModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;MAoBa,aAAa;;
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-core-link.mjs","sources":["../../../../../libs/core/src/lib/link/link.component.ts","../../../../../libs/core/src/lib/link/link.module.ts","../../../../../libs/core/src/lib/link/fundamental-ngx-core-link.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n Input,\n OnChanges,\n ViewEncapsulation,\n OnInit\n} from '@angular/core';\nimport { applyCssClass } from '@fundamental-ngx/core/utils';\nimport { CssClassBuilder } from '@fundamental-ngx/core/utils';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fdLink], [fd-link]',\n template: ` <ng-content></ng-content> `,\n styleUrls: ['./link.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LinkComponent implements OnChanges, OnInit, CssClassBuilder {\n /** user's custom classes */\n @Input()\n class: string;\n\n /** Whether user wants to use emphasized mode */\n @Input()\n emphasized: boolean;\n\n /** Whether user wants to put disabled mode */\n @Input()\n disabled: boolean;\n\n /** Whether user wants to use inverted mode */\n @Input()\n inverted: boolean;\n\n /** Whether user wants to use subtle mode */\n @Input()\n subtle: boolean;\n\n /** Whether user wants to have a link without underline decoration */\n @Input()\n undecorated: boolean;\n\n /** @hidden */\n constructor(private _elementRef: ElementRef) {}\n\n /** @hidden */\n ngOnChanges(): void {\n this.buildComponentCssClass();\n }\n\n @applyCssClass\n /** CssClassBuilder interface implementation\n * function is responsible for order which css classes are applied\n */\n buildComponentCssClass(): string[] {\n return [\n 'fd-link',\n this.emphasized ? 'fd-link--emphasized' : '',\n this.disabled ? 'is-disabled' : '',\n this.inverted ? `fd-link--inverted` : '',\n this.subtle ? 'fd-link--subtle' : '',\n this.undecorated ? 'fd-link--undecorated' : '',\n this.class\n ];\n }\n\n /** @hidden */\n elementRef(): ElementRef<any> {\n return this._elementRef;\n }\n\n /** @hidden */\n ngOnInit(): void {\n this.buildComponentCssClass();\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { LinkComponent } from './link.component';\n\n@NgModule({\n declarations: [LinkComponent],\n imports: [CommonModule],\n exports: [LinkComponent]\n})\nexport class LinkModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;MAoBa,aAAa;;IA0BtB,YAAoB,WAAuB;QAAvB,gBAAW,GAAX,WAAW,CAAY;KAAI;;IAG/C,WAAW;QACP,IAAI,CAAC,sBAAsB,EAAE,CAAC;KACjC;;;;IAMD,sBAAsB;QAClB,OAAO;YACH,SAAS;YACT,IAAI,CAAC,UAAU,GAAG,qBAAqB,GAAG,EAAE;YAC5C,IAAI,CAAC,QAAQ,GAAG,aAAa,GAAG,EAAE;YAClC,IAAI,CAAC,QAAQ,GAAG,mBAAmB,GAAG,EAAE;YACxC,IAAI,CAAC,MAAM,GAAG,iBAAiB,GAAG,EAAE;YACpC,IAAI,CAAC,WAAW,GAAG,sBAAsB,GAAG,EAAE;YAC9C,IAAI,CAAC,KAAK;SACb,CAAC;KACL;;IAGD,UAAU;QACN,OAAO,IAAI,CAAC,WAAW,CAAC;KAC3B;;IAGD,QAAQ;QACJ,IAAI,CAAC,sBAAsB,EAAE,CAAC;KACjC;;0GAzDQ,aAAa;8FAAb,aAAa,gOALZ,6BAA6B;AA0CvC;IAJC,aAAa;;;;2DAcb;2FA/CQ,aAAa;kBARzB,SAAS;+BAEI,qBAAqB,YACrB,6BAA6B,iBAExB,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM;iGAK/C,KAAK;sBADJ,KAAK;gBAKN,UAAU;sBADT,KAAK;gBAKN,QAAQ;sBADP,KAAK;gBAKN,QAAQ;sBADP,KAAK;gBAKN,MAAM;sBADL,KAAK;gBAKN,WAAW;sBADV,KAAK;;;;;QAeN,sBAAsB;;MC/Cb,UAAU;;uGAAV,UAAU;wGAAV,UAAU,iBAJJ,aAAa,aAClB,YAAY,aACZ,aAAa;wGAEd,UAAU,YAHV,CAAC,YAAY,CAAC;2FAGd,UAAU;kBALtB,QAAQ;mBAAC;oBACN,YAAY,EAAE,CAAC,aAAa,CAAC;oBAC7B,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,aAAa,CAAC;iBAC3B;;;ACTD;;;;;;"}
|
|
@@ -23,6 +23,7 @@ class LinkComponent {
|
|
|
23
23
|
this.disabled ? 'is-disabled' : '',
|
|
24
24
|
this.inverted ? `fd-link--inverted` : '',
|
|
25
25
|
this.subtle ? 'fd-link--subtle' : '',
|
|
26
|
+
this.undecorated ? 'fd-link--undecorated' : '',
|
|
26
27
|
this.class
|
|
27
28
|
];
|
|
28
29
|
}
|
|
@@ -36,7 +37,7 @@ class LinkComponent {
|
|
|
36
37
|
}
|
|
37
38
|
}
|
|
38
39
|
LinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: LinkComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
39
|
-
LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: { class: "class", emphasized: "emphasized", disabled: "disabled", inverted: "inverted", subtle: "subtle" }, usesOnChanges: true, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
40
|
+
LinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.4", type: LinkComponent, selector: "[fdLink], [fd-link]", inputs: { class: "class", emphasized: "emphasized", disabled: "disabled", inverted: "inverted", subtle: "subtle", undecorated: "undecorated" }, usesOnChanges: true, ngImport: i0, template: ` <ng-content></ng-content> `, isInline: true, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}.fd-link--undecorated:hover,.fd-link--undecorated:hover [class*=sap-icon],.fd-link--undecorated:hover[class*=sap-icon]{text-decoration:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
40
41
|
__decorate([
|
|
41
42
|
applyCssClass,
|
|
42
43
|
__metadata("design:type", Function),
|
|
@@ -45,7 +46,7 @@ __decorate([
|
|
|
45
46
|
], LinkComponent.prototype, "buildComponentCssClass", null);
|
|
46
47
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImport: i0, type: LinkComponent, decorators: [{
|
|
47
48
|
type: Component,
|
|
48
|
-
args: [{ selector: '[fdLink], [fd-link]', template: ` <ng-content></ng-content> `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}\n"] }]
|
|
49
|
+
args: [{ selector: '[fdLink], [fd-link]', template: ` <ng-content></ng-content> `, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: ["/*!\n * Fundamental Library Styles v0.24.0-rc.8\n * Copyright (c) 2022 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.fd-link\n*/.fd-link{font-size:var(--sapFontSize);line-height:var(--sapContent_LineHeight);color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;box-sizing:border-box;padding:0;margin:0;border:0;color:var(--sapLinkColor);-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration);text-shadow:var(--sapContent_TextShadow);display:inline-block;transition:all 125ms ease-in;line-height:inherit}.fd-link:after,.fd-link:before{box-sizing:inherit;font-size:inherit}.fd-link--emphasized{font-weight:700}.fd-link:visited{color:var(--sapLink_Visited_Color)}.fd-link.is-hover,.fd-link:hover{color:var(--sapLink_Hover_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-focus,.fd-link:focus{z-index:5;box-shadow:none;outline-offset:-.0625rem;outline-width:var(--sapContent_FocusWidth);outline-color:var(--sapContent_FocusColor);outline-style:var(--sapContent_FocusStyle);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link.is-active,.fd-link:active{color:var(--sapLink_Active_Color);-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite)}.fd-link--inverted{color:var(--sapLink_InvertedColor);text-shadow:none}.fd-link--inverted.is-hover,.fd-link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-link--inverted.is-focus,.fd-link--inverted:focus{z-index:5;outline-color:var(--sapContent_ContrastFocusColor)}.fd-link--subtle{color:var(--sapLink_SubtleColor)}.fd-link.is-disabled,.fd-link:disabled,.fd-link[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);color:var(--sapLinkColor);pointer-events:none}.fd-link>img{vertical-align:bottom}.fd-link [class*=sap-icon],.fd-link[class*=sap-icon]{color:inherit;background:inherit;font-size:inherit;border-radius:inherit;line-height:1;-webkit-text-decoration:var(--fdLink_Text_Decoration);text-decoration:var(--fdLink_Text_Decoration)}.fd-link.is-hover [class*=sap-icon],.fd-link.is-hover[class*=sap-icon],.fd-link:hover [class*=sap-icon],.fd-link:hover[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Hover_Color)}.fd-link.is-focus,.fd-link:focus{z-index:5}.fd-link.is-focus [class*=sap-icon],.fd-link.is-focus[class*=sap-icon],.fd-link:focus [class*=sap-icon],.fd-link:focus[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLinkColor)}.fd-link.is-active [class*=sap-icon],.fd-link.is-active[class*=sap-icon],.fd-link:active [class*=sap-icon],.fd-link:active[class*=sap-icon]{-webkit-text-decoration:var(--fdLink_Text_Decoration_Opposite);text-decoration:var(--fdLink_Text_Decoration_Opposite);color:var(--sapLink_Active_Color)}.fd-link--undecorated:hover,.fd-link--undecorated:hover [class*=sap-icon],.fd-link--undecorated:hover[class*=sap-icon]{text-decoration:none}\n"] }]
|
|
49
50
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { class: [{
|
|
50
51
|
type: Input
|
|
51
52
|
}], emphasized: [{
|
|
@@ -56,6 +57,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.4", ngImpor
|
|
|
56
57
|
type: Input
|
|
57
58
|
}], subtle: [{
|
|
58
59
|
type: Input
|
|
60
|
+
}], undecorated: [{
|
|
61
|
+
type: Input
|
|
59
62
|
}],
|
|
60
63
|
/** CssClassBuilder interface implementation
|
|
61
64
|
* function is responsible for order which css classes are applied
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-core-link.mjs","sources":["../../../../../libs/core/src/lib/link/link.component.ts","../../../../../libs/core/src/lib/link/link.module.ts","../../../../../libs/core/src/lib/link/fundamental-ngx-core-link.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n Input,\n OnChanges,\n ViewEncapsulation,\n OnInit\n} from '@angular/core';\nimport { applyCssClass } from '@fundamental-ngx/core/utils';\nimport { CssClassBuilder } from '@fundamental-ngx/core/utils';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fdLink], [fd-link]',\n template: ` <ng-content></ng-content> `,\n styleUrls: ['./link.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LinkComponent implements OnChanges, OnInit, CssClassBuilder {\n /** user's custom classes */\n @Input()\n class: string;\n\n /** Whether user wants to use emphasized mode */\n @Input()\n emphasized: boolean;\n\n /** Whether user wants to put disabled mode */\n @Input()\n disabled: boolean;\n\n /** Whether user wants to use inverted mode */\n @Input()\n inverted: boolean;\n\n /** Whether user wants to use subtle mode */\n @Input()\n subtle: boolean;\n\n /** @hidden */\n constructor(private _elementRef: ElementRef) {}\n\n /** @hidden */\n ngOnChanges(): void {\n this.buildComponentCssClass();\n }\n\n @applyCssClass\n /** CssClassBuilder interface implementation\n * function is responsible for order which css classes are applied\n */\n buildComponentCssClass(): string[] {\n return [\n 'fd-link',\n this.emphasized ? 'fd-link--emphasized' : '',\n this.disabled ? 'is-disabled' : '',\n this.inverted ? `fd-link--inverted` : '',\n this.subtle ? 'fd-link--subtle' : '',\n this.class\n ];\n }\n\n /** @hidden */\n elementRef(): ElementRef<any> {\n return this._elementRef;\n }\n\n /** @hidden */\n ngOnInit(): void {\n this.buildComponentCssClass();\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { LinkComponent } from './link.component';\n\n@NgModule({\n declarations: [LinkComponent],\n imports: [CommonModule],\n exports: [LinkComponent]\n})\nexport class LinkModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;MAoBa,aAAa;;
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-core-link.mjs","sources":["../../../../../libs/core/src/lib/link/link.component.ts","../../../../../libs/core/src/lib/link/link.module.ts","../../../../../libs/core/src/lib/link/fundamental-ngx-core-link.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n Input,\n OnChanges,\n ViewEncapsulation,\n OnInit\n} from '@angular/core';\nimport { applyCssClass } from '@fundamental-ngx/core/utils';\nimport { CssClassBuilder } from '@fundamental-ngx/core/utils';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fdLink], [fd-link]',\n template: ` <ng-content></ng-content> `,\n styleUrls: ['./link.component.scss'],\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class LinkComponent implements OnChanges, OnInit, CssClassBuilder {\n /** user's custom classes */\n @Input()\n class: string;\n\n /** Whether user wants to use emphasized mode */\n @Input()\n emphasized: boolean;\n\n /** Whether user wants to put disabled mode */\n @Input()\n disabled: boolean;\n\n /** Whether user wants to use inverted mode */\n @Input()\n inverted: boolean;\n\n /** Whether user wants to use subtle mode */\n @Input()\n subtle: boolean;\n\n /** Whether user wants to have a link without underline decoration */\n @Input()\n undecorated: boolean;\n\n /** @hidden */\n constructor(private _elementRef: ElementRef) {}\n\n /** @hidden */\n ngOnChanges(): void {\n this.buildComponentCssClass();\n }\n\n @applyCssClass\n /** CssClassBuilder interface implementation\n * function is responsible for order which css classes are applied\n */\n buildComponentCssClass(): string[] {\n return [\n 'fd-link',\n this.emphasized ? 'fd-link--emphasized' : '',\n this.disabled ? 'is-disabled' : '',\n this.inverted ? `fd-link--inverted` : '',\n this.subtle ? 'fd-link--subtle' : '',\n this.undecorated ? 'fd-link--undecorated' : '',\n this.class\n ];\n }\n\n /** @hidden */\n elementRef(): ElementRef<any> {\n return this._elementRef;\n }\n\n /** @hidden */\n ngOnInit(): void {\n this.buildComponentCssClass();\n }\n}\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\n\nimport { LinkComponent } from './link.component';\n\n@NgModule({\n declarations: [LinkComponent],\n imports: [CommonModule],\n exports: [LinkComponent]\n})\nexport class LinkModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;MAoBa,aAAa;;IA0BtB,YAAoB,WAAuB;QAAvB,gBAAW,GAAX,WAAW,CAAY;KAAI;;IAG/C,WAAW;QACP,IAAI,CAAC,sBAAsB,EAAE,CAAC;KACjC;;;;IAMD,sBAAsB;QAClB,OAAO;YACH,SAAS;YACT,IAAI,CAAC,UAAU,GAAG,qBAAqB,GAAG,EAAE;YAC5C,IAAI,CAAC,QAAQ,GAAG,aAAa,GAAG,EAAE;YAClC,IAAI,CAAC,QAAQ,GAAG,mBAAmB,GAAG,EAAE;YACxC,IAAI,CAAC,MAAM,GAAG,iBAAiB,GAAG,EAAE;YACpC,IAAI,CAAC,WAAW,GAAG,sBAAsB,GAAG,EAAE;YAC9C,IAAI,CAAC,KAAK;SACb,CAAC;KACL;;IAGD,UAAU;QACN,OAAO,IAAI,CAAC,WAAW,CAAC;KAC3B;;IAGD,QAAQ;QACJ,IAAI,CAAC,sBAAsB,EAAE,CAAC;KACjC;;0GAzDQ,aAAa;8FAAb,aAAa,gOALZ,6BAA6B;AA0CvC;IAJC,aAAa;;;;2DAcb;2FA/CQ,aAAa;kBARzB,SAAS;+BAEI,qBAAqB,YACrB,6BAA6B,iBAExB,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM;iGAK/C,KAAK;sBADJ,KAAK;gBAKN,UAAU;sBADT,KAAK;gBAKN,QAAQ;sBADP,KAAK;gBAKN,QAAQ;sBADP,KAAK;gBAKN,MAAM;sBADL,KAAK;gBAKN,WAAW;sBADV,KAAK;;;;;QAeN,sBAAsB;;MC/Cb,UAAU;;uGAAV,UAAU;wGAAV,UAAU,iBAJJ,aAAa,aAClB,YAAY,aACZ,aAAa;wGAEd,UAAU,YAHV,CAAC,YAAY,CAAC;2FAGd,UAAU;kBALtB,QAAQ;mBAAC;oBACN,YAAY,EAAE,CAAC,aAAa,CAAC;oBAC7B,OAAO,EAAE,CAAC,YAAY,CAAC;oBACvB,OAAO,EAAE,CAAC,aAAa,CAAC;iBAC3B;;;ACTD;;;;;;"}
|
package/link/link.component.d.ts
CHANGED
|
@@ -13,6 +13,8 @@ export declare class LinkComponent implements OnChanges, OnInit, CssClassBuilder
|
|
|
13
13
|
inverted: boolean;
|
|
14
14
|
/** Whether user wants to use subtle mode */
|
|
15
15
|
subtle: boolean;
|
|
16
|
+
/** Whether user wants to have a link without underline decoration */
|
|
17
|
+
undecorated: boolean;
|
|
16
18
|
/** @hidden */
|
|
17
19
|
constructor(_elementRef: ElementRef);
|
|
18
20
|
/** @hidden */
|
|
@@ -26,5 +28,5 @@ export declare class LinkComponent implements OnChanges, OnInit, CssClassBuilder
|
|
|
26
28
|
/** @hidden */
|
|
27
29
|
ngOnInit(): void;
|
|
28
30
|
static ɵfac: i0.ɵɵFactoryDeclaration<LinkComponent, never>;
|
|
29
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<LinkComponent, "[fdLink], [fd-link]", never, { "class": "class"; "emphasized": "emphasized"; "disabled": "disabled"; "inverted": "inverted"; "subtle": "subtle"; }, {}, never, ["*"]>;
|
|
31
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<LinkComponent, "[fdLink], [fd-link]", never, { "class": "class"; "emphasized": "emphasized"; "disabled": "disabled"; "inverted": "inverted"; "subtle": "subtle"; "undecorated": "undecorated"; }, {}, never, ["*"]>;
|
|
30
32
|
}
|
package/link/package.json
CHANGED
package/list/package.json
CHANGED
package/menu/package.json
CHANGED
package/message-box/package.json
CHANGED
package/mobile-mode/package.json
CHANGED
|
@@ -560,7 +560,7 @@ MultiInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
|
|
|
560
560
|
multi: true
|
|
561
561
|
},
|
|
562
562
|
MenuKeyboardService
|
|
563
|
-
], viewQueries: [{ propertyName: "popoverRef", first: true, predicate: PopoverComponent, descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["control"], descendants: true, read: TemplateRef }, { propertyName: "listTemplate", first: true, predicate: ["list"], descendants: true, read: TemplateRef }, { propertyName: "listComponent", first: true, predicate: ListComponent, descendants: true }, { propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true, read: ElementRef }, { propertyName: "tokenizer", first: true, predicate: TokenizerComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"viewModel$ | async as vm\">\n <div class=\"fd-multi-input fd-multi-input-custom\">\n <div class=\"fd-multi-input-field\">\n <ng-container [ngTemplateOutlet]=\"control\" *ngIf=\"mobile && !open\"></ng-container>\n <fd-popover\n additionalBodyClass=\"fd-popover-custom-list\"\n *ngIf=\"!mobile\"\n [isOpen]=\"open\"\n (isOpenChange)=\"openChangeHandle($event)\"\n (input)=\"!open && openChangeHandle(true)\"\n [triggers]=\"[]\"\n [maxWidth]=\"bodyMaxWidth\"\n [focusTrapped]=\"true\"\n [disabled]=\"disabled\"\n [fillControlMode]=\"fillControlMode\"\n class=\"fd-multi-input-popover-custom\"\n >\n <fd-popover-control>\n <form (submit)=\"_onSubmit()\">\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n </form>\n </fd-popover-control>\n <fd-popover-body\n [attr.aria-hidden]=\"!open\"\n [class.fd-popover__body--hidden]=\"!vm.displayedOptions.length\"\n >\n <ng-container *ngTemplateOutlet=\"list\"></ng-container>\n <ng-content></ng-content>\n </fd-popover-body>\n </fd-popover>\n </div>\n </div>\n\n <ng-template #control>\n <fd-input-group\n class=\"fd-multi-input-input-group-custom\"\n [state]=\"state\"\n [buttonFocusable]=\"buttonFocusable\"\n [button]=\"displayAddonButton\"\n [compact]=\"compact\"\n [disabled]=\"disabled\"\n [isExpanded]=\"open && !mobile && vm.displayedOptions.length > 0\"\n [isControl]=\"true\"\n [glyph]=\"displayAddonButton ? glyph : ''\"\n [iconTitle]=\"title\"\n (addOnButtonClicked)=\"_addOnButtonClicked()\"\n >\n <fd-tokenizer\n [compactCollapse]=\"compactCollapse\"\n [compact]=\"compact\"\n [open]=\"open\"\n [tokenizerFocusable]=\"false\"\n (moreClickedEvent)=\"_moreClicked()\"\n class=\"fd-multi-input-tokenizer-custom\"\n [class.fd-multi-input-tokenizer-custom--compact]=\"compact\"\n tabindex=\"-1\"\n >\n <fd-token\n *ngFor=\"let option of vm.selectedOptions; trackBy: valueFn\"\n [compact]=\"compact\"\n [disabled]=\"disabled\"\n (onCloseClick)=\"_onTokenClick(option.value, false, $event)\"\n (onRemove)=\"_onTokenClick(option.value, false)\"\n >\n <span [innerHtml]=\"option.label\"></span>\n </fd-token>\n <input\n type=\"text\"\n class=\"fd-input fd-tokenizer__input fd-multi-input-tokenizer-input\"\n autocomplete=\"off\"\n fd-form-control\n fd-input-group-input\n fd-auto-complete\n (onComplete)=\"_handleComplete($event)\"\n #searchInputElement\n [displayFn]=\"displayFn\"\n [inputText]=\"_searchTermCtrl.value\"\n [options]=\"dropdownValues\"\n [enable]=\"autoComplete && !mobile\"\n [placeholder]=\"placeholder\"\n [formControl]=\"_searchTermCtrl\"\n [compact]=\"compact\"\n [attr.aria-required]=\"required\"\n [class.fd-input--compact]=\"compact\"\n (keydown)=\"_handleInputKeydown($event)\"\n [attr.id]=\"inputId\"\n />\n </fd-tokenizer>\n </fd-input-group>\n </ng-template>\n\n <ng-template #list>\n <ul\n *ngIf=\"vm.displayedOptions.length\"\n fd-list\n class=\"fd-multi-input-menu-overflow\"\n [selection]=\"true\"\n [mobileMode]=\"mobile\"\n [compact]=\"compact\"\n [style.maxHeight]=\"!mobile ? maxHeight : 'auto'\"\n (focusEscapeList)=\"handleListFocusEscape($event)\"\n [style.minWidth]=\"'100%'\"\n >\n <li\n *ngFor=\"let option of vm.displayedOptions; index as idx; trackBy: valueFn\"\n fd-list-item\n (click)=\"_onCheckboxClick(option.value, $event, idx, true)\"\n (keyup)=\"_onCheckboxKeyup(option.value, $event, idx)\"\n [selected]=\"option.isSelected\"\n >\n <fd-checkbox\n [compact]=\"compact\"\n (click)=\"_onCheckboxClick(option.value, $event, idx)\"\n [value]=\"option.isSelected\"\n >\n <!-- TODO -->\n </fd-checkbox>\n <ng-container\n [ngTemplateOutlet]=\"itemSource\"\n [ngTemplateOutletContext]=\"{ option: option }\"\n ></ng-container>\n </li>\n <li\n *ngIf=\"showAllButton && vm.displayedOptions.length < dropdownValues.length\"\n fd-list-item\n class=\"fd-multi-input-show-all\"\n (keyDown)=\"_showAllKeyDown($event)\"\n (click)=\"_showAllClicked($event)\"\n >\n <a fd-link tabindex=\"0\">Show All ({{ dropdownValues.length }})</a>\n </li>\n </ul>\n </ng-template>\n\n <ng-template let-option=\"option\" #itemSource>\n <span\n *ngIf=\"!itemTemplate\"\n fd-list-title\n [innerHtml]=\"option.label | highlight: _searchTermCtrl.value:highlight\"\n >\n </span>\n\n <ng-container *ngIf=\"itemTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"itemTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: option.item }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n</ng-container>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fd-multi-input-input-group-custom{max-width:100%}.fd-multi-input-custom{display:block}.fd-multi-input-item{cursor:pointer;padding:0}.fd-multi-input-popover-size{overflow:auto;display:block}.fd-multi-input-popover-custom.fd-popover-custom{max-width:100%;display:block}.fd-multi-input-popover-custom.fd-popover-custom .fd-tokenizer{height:100%}.fd-multi-input-menu-overflow{max-width:37.5rem;overflow:auto}.fd-input.fd-multi-input-tokenizer-input{margin-top:0;margin-bottom:0;padding-left:0;background-color:transparent}.fd-multi-input-show-all{width:100%;display:flex;justify-content:flex-end;background-color:transparent}.fd-multi-input-show-all .fd-link:active{color:inherit}.fd-multi-input-checkbox{width:100%;cursor:pointer}.fd-multi-input-checkbox .fd-checkbox__label{color:inherit}.fd-list--multi-input{max-width:100%}.fd-popover__body--hidden{display:none}\n"], components: [{ type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { type: i3.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "compact", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby"], outputs: ["addOnButtonClicked", "search"] }, { type: i4.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "ariaRoleDescription", "compact", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { type: i4.TokenComponent, selector: "fd-token", inputs: ["disabled", "compact", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick"] }, { type: i5.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "compact", "type", "class"] }, { type: i6.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "compact", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { type: i6.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "tabindex", "noData", "action", "interactive", "growing", "counter", "unread"], outputs: ["keyDown"] }, { type: i7.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "compact", "tristate", "tristateSelectable", "labelClass", "required", "values"], outputs: ["focusChange"] }, { type: i8.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle"] }], directives: [{ type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i10.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i10.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.InputGroupInputDirective, selector: "[fd-input-group-input]", inputs: ["class", "compact"] }, { type: i1.AutoCompleteDirective, selector: "[fd-auto-complete]", inputs: ["options", "inputText", "enable", "displayFn"], outputs: ["onComplete"] }, { type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i10.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }], pipes: { "async": i9.AsyncPipe, "highlight": i1.SearchHighlightPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
563
|
+
], viewQueries: [{ propertyName: "popoverRef", first: true, predicate: PopoverComponent, descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["control"], descendants: true, read: TemplateRef }, { propertyName: "listTemplate", first: true, predicate: ["list"], descendants: true, read: TemplateRef }, { propertyName: "listComponent", first: true, predicate: ListComponent, descendants: true }, { propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true, read: ElementRef }, { propertyName: "tokenizer", first: true, predicate: TokenizerComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"viewModel$ | async as vm\">\n <div class=\"fd-multi-input fd-multi-input-custom\">\n <div class=\"fd-multi-input-field\">\n <ng-container [ngTemplateOutlet]=\"control\" *ngIf=\"mobile && !open\"></ng-container>\n <fd-popover\n additionalBodyClass=\"fd-popover-custom-list\"\n *ngIf=\"!mobile\"\n [isOpen]=\"open\"\n (isOpenChange)=\"openChangeHandle($event)\"\n (input)=\"!open && openChangeHandle(true)\"\n [triggers]=\"[]\"\n [maxWidth]=\"bodyMaxWidth\"\n [focusTrapped]=\"true\"\n [disabled]=\"disabled\"\n [fillControlMode]=\"fillControlMode\"\n class=\"fd-multi-input-popover-custom\"\n >\n <fd-popover-control>\n <form (submit)=\"_onSubmit()\">\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n </form>\n </fd-popover-control>\n <fd-popover-body\n [attr.aria-hidden]=\"!open\"\n [class.fd-popover__body--hidden]=\"!vm.displayedOptions.length\"\n >\n <ng-container *ngTemplateOutlet=\"list\"></ng-container>\n <ng-content></ng-content>\n </fd-popover-body>\n </fd-popover>\n </div>\n </div>\n\n <ng-template #control>\n <fd-input-group\n class=\"fd-multi-input-input-group-custom\"\n [state]=\"state\"\n [buttonFocusable]=\"buttonFocusable\"\n [button]=\"displayAddonButton\"\n [compact]=\"compact\"\n [disabled]=\"disabled\"\n [isExpanded]=\"open && !mobile && vm.displayedOptions.length > 0\"\n [isControl]=\"true\"\n [glyph]=\"displayAddonButton ? glyph : ''\"\n [iconTitle]=\"title\"\n (addOnButtonClicked)=\"_addOnButtonClicked()\"\n >\n <fd-tokenizer\n [compactCollapse]=\"compactCollapse\"\n [compact]=\"compact\"\n [open]=\"open\"\n [tokenizerFocusable]=\"false\"\n (moreClickedEvent)=\"_moreClicked()\"\n class=\"fd-multi-input-tokenizer-custom\"\n [class.fd-multi-input-tokenizer-custom--compact]=\"compact\"\n tabindex=\"-1\"\n >\n <fd-token\n *ngFor=\"let option of vm.selectedOptions; trackBy: valueFn\"\n [compact]=\"compact\"\n [disabled]=\"disabled\"\n (onCloseClick)=\"_onTokenClick(option.value, false, $event)\"\n (onRemove)=\"_onTokenClick(option.value, false)\"\n >\n <span [innerHtml]=\"option.label\"></span>\n </fd-token>\n <input\n type=\"text\"\n class=\"fd-input fd-tokenizer__input fd-multi-input-tokenizer-input\"\n autocomplete=\"off\"\n fd-form-control\n fd-input-group-input\n fd-auto-complete\n (onComplete)=\"_handleComplete($event)\"\n #searchInputElement\n [displayFn]=\"displayFn\"\n [inputText]=\"_searchTermCtrl.value\"\n [options]=\"dropdownValues\"\n [enable]=\"autoComplete && !mobile\"\n [placeholder]=\"placeholder\"\n [formControl]=\"_searchTermCtrl\"\n [compact]=\"compact\"\n [attr.aria-required]=\"required\"\n [class.fd-input--compact]=\"compact\"\n (keydown)=\"_handleInputKeydown($event)\"\n [attr.id]=\"inputId\"\n />\n </fd-tokenizer>\n </fd-input-group>\n </ng-template>\n\n <ng-template #list>\n <ul\n *ngIf=\"vm.displayedOptions.length\"\n fd-list\n class=\"fd-multi-input-menu-overflow\"\n [selection]=\"true\"\n [mobileMode]=\"mobile\"\n [compact]=\"compact\"\n [style.maxHeight]=\"!mobile ? maxHeight : 'auto'\"\n (focusEscapeList)=\"handleListFocusEscape($event)\"\n [style.minWidth]=\"'100%'\"\n >\n <li\n *ngFor=\"let option of vm.displayedOptions; index as idx; trackBy: valueFn\"\n fd-list-item\n (click)=\"_onCheckboxClick(option.value, $event, idx, true)\"\n (keyup)=\"_onCheckboxKeyup(option.value, $event, idx)\"\n [selected]=\"option.isSelected\"\n >\n <fd-checkbox\n [compact]=\"compact\"\n (click)=\"_onCheckboxClick(option.value, $event, idx)\"\n [value]=\"option.isSelected\"\n >\n <!-- TODO -->\n </fd-checkbox>\n <ng-container\n [ngTemplateOutlet]=\"itemSource\"\n [ngTemplateOutletContext]=\"{ option: option }\"\n ></ng-container>\n </li>\n <li\n *ngIf=\"showAllButton && vm.displayedOptions.length < dropdownValues.length\"\n fd-list-item\n class=\"fd-multi-input-show-all\"\n (keyDown)=\"_showAllKeyDown($event)\"\n (click)=\"_showAllClicked($event)\"\n >\n <a fd-link tabindex=\"0\">Show All ({{ dropdownValues.length }})</a>\n </li>\n </ul>\n </ng-template>\n\n <ng-template let-option=\"option\" #itemSource>\n <span\n *ngIf=\"!itemTemplate\"\n fd-list-title\n [innerHtml]=\"option.label | highlight: _searchTermCtrl.value:highlight\"\n >\n </span>\n\n <ng-container *ngIf=\"itemTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"itemTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: option.item }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n</ng-container>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fd-multi-input-input-group-custom{max-width:100%}.fd-multi-input-custom{display:block}.fd-multi-input-item{cursor:pointer;padding:0}.fd-multi-input-popover-size{overflow:auto;display:block}.fd-multi-input-popover-custom.fd-popover-custom{max-width:100%;display:block}.fd-multi-input-popover-custom.fd-popover-custom .fd-tokenizer{height:100%}.fd-multi-input-menu-overflow{max-width:37.5rem;overflow:auto}.fd-input.fd-multi-input-tokenizer-input{margin-top:0;margin-bottom:0;padding-left:0;background-color:transparent}.fd-multi-input-show-all{width:100%;display:flex;justify-content:flex-end;background-color:transparent}.fd-multi-input-show-all .fd-link:active{color:inherit}.fd-multi-input-checkbox{width:100%;cursor:pointer}.fd-multi-input-checkbox .fd-checkbox__label{color:inherit}.fd-list--multi-input{max-width:100%}.fd-popover__body--hidden{display:none}\n"], components: [{ type: i2.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { type: i2.PopoverControlComponent, selector: "fd-popover-control" }, { type: i2.PopoverBodyComponent, selector: "fd-popover-body" }, { type: i3.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "compact", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby"], outputs: ["addOnButtonClicked", "search"] }, { type: i4.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "ariaRoleDescription", "compact", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { type: i4.TokenComponent, selector: "fd-token", inputs: ["disabled", "compact", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick"] }, { type: i5.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "compact", "type", "class"] }, { type: i6.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "compact", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { type: i6.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "tabindex", "noData", "action", "interactive", "growing", "counter", "unread"], outputs: ["keyDown"] }, { type: i7.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "compact", "tristate", "tristateSelectable", "labelClass", "required", "values"], outputs: ["focusChange"] }, { type: i8.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }], directives: [{ type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i10.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i10.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.InputGroupInputDirective, selector: "[fd-input-group-input]", inputs: ["class", "compact"] }, { type: i1.AutoCompleteDirective, selector: "[fd-auto-complete]", inputs: ["options", "inputText", "enable", "displayFn"], outputs: ["onComplete"] }, { type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i10.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }], pipes: { "async": i9.AsyncPipe, "highlight": i1.SearchHighlightPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
564
564
|
__decorate([
|
|
565
565
|
applyCssClass,
|
|
566
566
|
__metadata("design:type", Function),
|
|
@@ -676,7 +676,7 @@ MultiInputComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", ve
|
|
|
676
676
|
multi: true
|
|
677
677
|
},
|
|
678
678
|
MenuKeyboardService
|
|
679
|
-
], viewQueries: [{ propertyName: "popoverRef", first: true, predicate: PopoverComponent, descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["control"], descendants: true, read: TemplateRef }, { propertyName: "listTemplate", first: true, predicate: ["list"], descendants: true, read: TemplateRef }, { propertyName: "listComponent", first: true, predicate: ListComponent, descendants: true }, { propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true, read: ElementRef }, { propertyName: "tokenizer", first: true, predicate: TokenizerComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"viewModel$ | async as vm\">\n <div class=\"fd-multi-input fd-multi-input-custom\">\n <div class=\"fd-multi-input-field\">\n <ng-container [ngTemplateOutlet]=\"control\" *ngIf=\"mobile && !open\"></ng-container>\n <fd-popover\n additionalBodyClass=\"fd-popover-custom-list\"\n *ngIf=\"!mobile\"\n [isOpen]=\"open\"\n (isOpenChange)=\"openChangeHandle($event)\"\n (input)=\"!open && openChangeHandle(true)\"\n [triggers]=\"[]\"\n [maxWidth]=\"bodyMaxWidth\"\n [focusTrapped]=\"true\"\n [disabled]=\"disabled\"\n [fillControlMode]=\"fillControlMode\"\n class=\"fd-multi-input-popover-custom\"\n >\n <fd-popover-control>\n <form (submit)=\"_onSubmit()\">\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n </form>\n </fd-popover-control>\n <fd-popover-body\n [attr.aria-hidden]=\"!open\"\n [class.fd-popover__body--hidden]=\"!vm.displayedOptions.length\"\n >\n <ng-container *ngTemplateOutlet=\"list\"></ng-container>\n <ng-content></ng-content>\n </fd-popover-body>\n </fd-popover>\n </div>\n </div>\n\n <ng-template #control>\n <fd-input-group\n class=\"fd-multi-input-input-group-custom\"\n [state]=\"state\"\n [buttonFocusable]=\"buttonFocusable\"\n [button]=\"displayAddonButton\"\n [compact]=\"compact\"\n [disabled]=\"disabled\"\n [isExpanded]=\"open && !mobile && vm.displayedOptions.length > 0\"\n [isControl]=\"true\"\n [glyph]=\"displayAddonButton ? glyph : ''\"\n [iconTitle]=\"title\"\n (addOnButtonClicked)=\"_addOnButtonClicked()\"\n >\n <fd-tokenizer\n [compactCollapse]=\"compactCollapse\"\n [compact]=\"compact\"\n [open]=\"open\"\n [tokenizerFocusable]=\"false\"\n (moreClickedEvent)=\"_moreClicked()\"\n class=\"fd-multi-input-tokenizer-custom\"\n [class.fd-multi-input-tokenizer-custom--compact]=\"compact\"\n tabindex=\"-1\"\n >\n <fd-token\n *ngFor=\"let option of vm.selectedOptions; trackBy: valueFn\"\n [compact]=\"compact\"\n [disabled]=\"disabled\"\n (onCloseClick)=\"_onTokenClick(option.value, false, $event)\"\n (onRemove)=\"_onTokenClick(option.value, false)\"\n >\n <span [innerHtml]=\"option.label\"></span>\n </fd-token>\n <input\n type=\"text\"\n class=\"fd-input fd-tokenizer__input fd-multi-input-tokenizer-input\"\n autocomplete=\"off\"\n fd-form-control\n fd-input-group-input\n fd-auto-complete\n (onComplete)=\"_handleComplete($event)\"\n #searchInputElement\n [displayFn]=\"displayFn\"\n [inputText]=\"_searchTermCtrl.value\"\n [options]=\"dropdownValues\"\n [enable]=\"autoComplete && !mobile\"\n [placeholder]=\"placeholder\"\n [formControl]=\"_searchTermCtrl\"\n [compact]=\"compact\"\n [attr.aria-required]=\"required\"\n [class.fd-input--compact]=\"compact\"\n (keydown)=\"_handleInputKeydown($event)\"\n [attr.id]=\"inputId\"\n />\n </fd-tokenizer>\n </fd-input-group>\n </ng-template>\n\n <ng-template #list>\n <ul\n *ngIf=\"vm.displayedOptions.length\"\n fd-list\n class=\"fd-multi-input-menu-overflow\"\n [selection]=\"true\"\n [mobileMode]=\"mobile\"\n [compact]=\"compact\"\n [style.maxHeight]=\"!mobile ? maxHeight : 'auto'\"\n (focusEscapeList)=\"handleListFocusEscape($event)\"\n [style.minWidth]=\"'100%'\"\n >\n <li\n *ngFor=\"let option of vm.displayedOptions; index as idx; trackBy: valueFn\"\n fd-list-item\n (click)=\"_onCheckboxClick(option.value, $event, idx, true)\"\n (keyup)=\"_onCheckboxKeyup(option.value, $event, idx)\"\n [selected]=\"option.isSelected\"\n >\n <fd-checkbox\n [compact]=\"compact\"\n (click)=\"_onCheckboxClick(option.value, $event, idx)\"\n [value]=\"option.isSelected\"\n >\n <!-- TODO -->\n </fd-checkbox>\n <ng-container\n [ngTemplateOutlet]=\"itemSource\"\n [ngTemplateOutletContext]=\"{ option: option }\"\n ></ng-container>\n </li>\n <li\n *ngIf=\"showAllButton && vm.displayedOptions.length < dropdownValues.length\"\n fd-list-item\n class=\"fd-multi-input-show-all\"\n (keyDown)=\"_showAllKeyDown($event)\"\n (click)=\"_showAllClicked($event)\"\n >\n <a fd-link tabindex=\"0\">Show All ({{ dropdownValues.length }})</a>\n </li>\n </ul>\n </ng-template>\n\n <ng-template let-option=\"option\" #itemSource>\n <span\n *ngIf=\"!itemTemplate\"\n fd-list-title\n [innerHtml]=\"option.label | highlight: _searchTermCtrl.value:highlight\"\n >\n </span>\n\n <ng-container *ngIf=\"itemTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"itemTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: option.item }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n</ng-container>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fd-multi-input-input-group-custom{max-width:100%}.fd-multi-input-custom{display:block}.fd-multi-input-item{cursor:pointer;padding:0}.fd-multi-input-popover-size{overflow:auto;display:block}.fd-multi-input-popover-custom.fd-popover-custom{max-width:100%;display:block}.fd-multi-input-popover-custom.fd-popover-custom .fd-tokenizer{height:100%}.fd-multi-input-menu-overflow{max-width:37.5rem;overflow:auto}.fd-input.fd-multi-input-tokenizer-input{margin-top:0;margin-bottom:0;padding-left:0;background-color:transparent}.fd-multi-input-show-all{width:100%;display:flex;justify-content:flex-end;background-color:transparent}.fd-multi-input-show-all .fd-link:active{color:inherit}.fd-multi-input-checkbox{width:100%;cursor:pointer}.fd-multi-input-checkbox .fd-checkbox__label{color:inherit}.fd-list--multi-input{max-width:100%}.fd-popover__body--hidden{display:none}\n"], components: [{ type: i2$1.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { type: i2$1.PopoverControlComponent, selector: "fd-popover-control" }, { type: i2$1.PopoverBodyComponent, selector: "fd-popover-body" }, { type: i3$1.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "compact", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby"], outputs: ["addOnButtonClicked", "search"] }, { type: i4$1.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "ariaRoleDescription", "compact", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { type: i4$1.TokenComponent, selector: "fd-token", inputs: ["disabled", "compact", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick"] }, { type: i5.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "compact", "type", "class"] }, { type: i6.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "compact", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { type: i6.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "tabindex", "noData", "action", "interactive", "growing", "counter", "unread"], outputs: ["keyDown"] }, { type: i7.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "compact", "tristate", "tristateSelectable", "labelClass", "required", "values"], outputs: ["focusChange"] }, { type: i8.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle"] }], directives: [{ type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i10.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i10.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3$1.InputGroupInputDirective, selector: "[fd-input-group-input]", inputs: ["class", "compact"] }, { type: i1$1.AutoCompleteDirective, selector: "[fd-auto-complete]", inputs: ["options", "inputText", "enable", "displayFn"], outputs: ["onComplete"] }, { type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i10.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }], pipes: { "async": i9.AsyncPipe, "highlight": i1$1.SearchHighlightPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
679
|
+
], viewQueries: [{ propertyName: "popoverRef", first: true, predicate: PopoverComponent, descendants: true }, { propertyName: "controlTemplate", first: true, predicate: ["control"], descendants: true, read: TemplateRef }, { propertyName: "listTemplate", first: true, predicate: ["list"], descendants: true, read: TemplateRef }, { propertyName: "listComponent", first: true, predicate: ListComponent, descendants: true }, { propertyName: "searchInputElement", first: true, predicate: ["searchInputElement"], descendants: true, read: ElementRef }, { propertyName: "tokenizer", first: true, predicate: TokenizerComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"viewModel$ | async as vm\">\n <div class=\"fd-multi-input fd-multi-input-custom\">\n <div class=\"fd-multi-input-field\">\n <ng-container [ngTemplateOutlet]=\"control\" *ngIf=\"mobile && !open\"></ng-container>\n <fd-popover\n additionalBodyClass=\"fd-popover-custom-list\"\n *ngIf=\"!mobile\"\n [isOpen]=\"open\"\n (isOpenChange)=\"openChangeHandle($event)\"\n (input)=\"!open && openChangeHandle(true)\"\n [triggers]=\"[]\"\n [maxWidth]=\"bodyMaxWidth\"\n [focusTrapped]=\"true\"\n [disabled]=\"disabled\"\n [fillControlMode]=\"fillControlMode\"\n class=\"fd-multi-input-popover-custom\"\n >\n <fd-popover-control>\n <form (submit)=\"_onSubmit()\">\n <ng-container *ngTemplateOutlet=\"control\"></ng-container>\n </form>\n </fd-popover-control>\n <fd-popover-body\n [attr.aria-hidden]=\"!open\"\n [class.fd-popover__body--hidden]=\"!vm.displayedOptions.length\"\n >\n <ng-container *ngTemplateOutlet=\"list\"></ng-container>\n <ng-content></ng-content>\n </fd-popover-body>\n </fd-popover>\n </div>\n </div>\n\n <ng-template #control>\n <fd-input-group\n class=\"fd-multi-input-input-group-custom\"\n [state]=\"state\"\n [buttonFocusable]=\"buttonFocusable\"\n [button]=\"displayAddonButton\"\n [compact]=\"compact\"\n [disabled]=\"disabled\"\n [isExpanded]=\"open && !mobile && vm.displayedOptions.length > 0\"\n [isControl]=\"true\"\n [glyph]=\"displayAddonButton ? glyph : ''\"\n [iconTitle]=\"title\"\n (addOnButtonClicked)=\"_addOnButtonClicked()\"\n >\n <fd-tokenizer\n [compactCollapse]=\"compactCollapse\"\n [compact]=\"compact\"\n [open]=\"open\"\n [tokenizerFocusable]=\"false\"\n (moreClickedEvent)=\"_moreClicked()\"\n class=\"fd-multi-input-tokenizer-custom\"\n [class.fd-multi-input-tokenizer-custom--compact]=\"compact\"\n tabindex=\"-1\"\n >\n <fd-token\n *ngFor=\"let option of vm.selectedOptions; trackBy: valueFn\"\n [compact]=\"compact\"\n [disabled]=\"disabled\"\n (onCloseClick)=\"_onTokenClick(option.value, false, $event)\"\n (onRemove)=\"_onTokenClick(option.value, false)\"\n >\n <span [innerHtml]=\"option.label\"></span>\n </fd-token>\n <input\n type=\"text\"\n class=\"fd-input fd-tokenizer__input fd-multi-input-tokenizer-input\"\n autocomplete=\"off\"\n fd-form-control\n fd-input-group-input\n fd-auto-complete\n (onComplete)=\"_handleComplete($event)\"\n #searchInputElement\n [displayFn]=\"displayFn\"\n [inputText]=\"_searchTermCtrl.value\"\n [options]=\"dropdownValues\"\n [enable]=\"autoComplete && !mobile\"\n [placeholder]=\"placeholder\"\n [formControl]=\"_searchTermCtrl\"\n [compact]=\"compact\"\n [attr.aria-required]=\"required\"\n [class.fd-input--compact]=\"compact\"\n (keydown)=\"_handleInputKeydown($event)\"\n [attr.id]=\"inputId\"\n />\n </fd-tokenizer>\n </fd-input-group>\n </ng-template>\n\n <ng-template #list>\n <ul\n *ngIf=\"vm.displayedOptions.length\"\n fd-list\n class=\"fd-multi-input-menu-overflow\"\n [selection]=\"true\"\n [mobileMode]=\"mobile\"\n [compact]=\"compact\"\n [style.maxHeight]=\"!mobile ? maxHeight : 'auto'\"\n (focusEscapeList)=\"handleListFocusEscape($event)\"\n [style.minWidth]=\"'100%'\"\n >\n <li\n *ngFor=\"let option of vm.displayedOptions; index as idx; trackBy: valueFn\"\n fd-list-item\n (click)=\"_onCheckboxClick(option.value, $event, idx, true)\"\n (keyup)=\"_onCheckboxKeyup(option.value, $event, idx)\"\n [selected]=\"option.isSelected\"\n >\n <fd-checkbox\n [compact]=\"compact\"\n (click)=\"_onCheckboxClick(option.value, $event, idx)\"\n [value]=\"option.isSelected\"\n >\n <!-- TODO -->\n </fd-checkbox>\n <ng-container\n [ngTemplateOutlet]=\"itemSource\"\n [ngTemplateOutletContext]=\"{ option: option }\"\n ></ng-container>\n </li>\n <li\n *ngIf=\"showAllButton && vm.displayedOptions.length < dropdownValues.length\"\n fd-list-item\n class=\"fd-multi-input-show-all\"\n (keyDown)=\"_showAllKeyDown($event)\"\n (click)=\"_showAllClicked($event)\"\n >\n <a fd-link tabindex=\"0\">Show All ({{ dropdownValues.length }})</a>\n </li>\n </ul>\n </ng-template>\n\n <ng-template let-option=\"option\" #itemSource>\n <span\n *ngIf=\"!itemTemplate\"\n fd-list-title\n [innerHtml]=\"option.label | highlight: _searchTermCtrl.value:highlight\"\n >\n </span>\n\n <ng-container *ngIf=\"itemTemplate\">\n <ng-container\n [ngTemplateOutlet]=\"itemTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: option.item }\"\n ></ng-container>\n </ng-container>\n </ng-template>\n</ng-container>\n", styles: [".fd-multi-input-tokenizer-custom{width:calc(100% - 2.25rem)}.fd-multi-input-tokenizer-custom--compact{width:calc(100% - 2rem)}.fd-multi-input-input-group-custom{max-width:100%}.fd-multi-input-custom{display:block}.fd-multi-input-item{cursor:pointer;padding:0}.fd-multi-input-popover-size{overflow:auto;display:block}.fd-multi-input-popover-custom.fd-popover-custom{max-width:100%;display:block}.fd-multi-input-popover-custom.fd-popover-custom .fd-tokenizer{height:100%}.fd-multi-input-menu-overflow{max-width:37.5rem;overflow:auto}.fd-input.fd-multi-input-tokenizer-input{margin-top:0;margin-bottom:0;padding-left:0;background-color:transparent}.fd-multi-input-show-all{width:100%;display:flex;justify-content:flex-end;background-color:transparent}.fd-multi-input-show-all .fd-link:active{color:inherit}.fd-multi-input-checkbox{width:100%;cursor:pointer}.fd-multi-input-checkbox .fd-checkbox__label{color:inherit}.fd-list--multi-input{max-width:100%}.fd-popover__body--hidden{display:none}\n"], components: [{ type: i2$1.PopoverComponent, selector: "fd-popover", inputs: ["title", "trigger", "fixedPosition", "id", "mobile", "mobileConfig"] }, { type: i2$1.PopoverControlComponent, selector: "fd-popover-control" }, { type: i2$1.PopoverBodyComponent, selector: "fd-popover-body" }, { type: i3$1.InputGroupComponent, selector: "fd-input-group", inputs: ["inputTemplate", "placement", "compact", "required", "inline", "placeholder", "addOnText", "buttonFocusable", "type", "glyph", "button", "disabled", "readonly", "state", "isControl", "showFocus", "isExpanded", "glyphAriaLabel", "iconTitle", "ariaLabelledby"], outputs: ["addOnButtonClicked", "search"] }, { type: i4$1.TokenizerComponent, selector: "fd-tokenizer", inputs: ["class", "disableKeyboardDeletion", "ariaRoleDescription", "compact", "compactCollapse", "tokenizerFocusable", "inputValue", "glyph", "moreTerm", "open"], outputs: ["moreClickedEvent"] }, { type: i4$1.TokenComponent, selector: "fd-token", inputs: ["disabled", "compact", "selected", "readOnly", "deleteButtonLabel", "ariaRoleDescription"], outputs: ["onCloseClick", "onRemove", "onTokenClick"] }, { type: i5.FormControlComponent, selector: "[fd-form-control]", inputs: ["state", "compact", "type", "class"] }, { type: i6.ListComponent, selector: "[fd-list], [fdList]", inputs: ["dropdownMode", "multiInputMode", "mobileMode", "compact", "hasMessage", "noBorder", "navigationIndicator", "selection", "keyboardSupport", "byline"], outputs: ["focusEscapeList"] }, { type: i6.ListItemComponent, selector: "[fdListItem] ,[fd-list-item]", inputs: ["selected", "tabindex", "noData", "action", "interactive", "growing", "counter", "unread"], outputs: ["keyDown"] }, { type: i7.CheckboxComponent, selector: "fd-checkbox", inputs: ["ariaLabel", "value", "ariaLabelledBy", "ariaDescribedBy", "title", "inputId", "state", "name", "label", "disabled", "compact", "tristate", "tristateSelectable", "labelClass", "required", "values"], outputs: ["focusChange"] }, { type: i8.LinkComponent, selector: "[fdLink], [fd-link]", inputs: ["class", "emphasized", "disabled", "inverted", "subtle", "undecorated"] }], directives: [{ type: i9.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i9.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i10.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i10.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i10.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i9.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i10.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3$1.InputGroupInputDirective, selector: "[fd-input-group-input]", inputs: ["class", "compact"] }, { type: i1$1.AutoCompleteDirective, selector: "[fd-auto-complete]", inputs: ["options", "inputText", "enable", "displayFn"], outputs: ["onComplete"] }, { type: i10.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i10.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { type: i6.ListTitleDirective, selector: "[fd-list-title], [fdListTitle]", inputs: ["wrap"] }], pipes: { "async": i9.AsyncPipe, "highlight": i1$1.SearchHighlightPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
680
680
|
__decorate([
|
|
681
681
|
applyCssClass,
|
|
682
682
|
__metadata("design:type", Function),
|