@fundamental-ngx/core 0.63.2-rc.5 → 0.63.2-rc.7
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/README.md +1 -1
- package/fesm2022/fundamental-ngx-core-action-bar.mjs +27 -26
- package/fesm2022/fundamental-ngx-core-action-bar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-action-sheet.mjs +25 -22
- package/fesm2022/fundamental-ngx-core-action-sheet.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-avatar-group-legacy.mjs +35 -31
- package/fesm2022/fundamental-ngx-core-avatar-group-legacy.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-avatar-group.mjs +52 -43
- package/fesm2022/fundamental-ngx-core-avatar-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-avatar.mjs +67 -43
- package/fesm2022/fundamental-ngx-core-avatar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-bar.mjs +50 -41
- package/fesm2022/fundamental-ngx-core-bar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-breadcrumb.mjs +18 -14
- package/fesm2022/fundamental-ngx-core-breadcrumb.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-busy-indicator.mjs +34 -23
- package/fesm2022/fundamental-ngx-core-busy-indicator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-button.mjs +56 -37
- package/fesm2022/fundamental-ngx-core-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-calendar.mjs +87 -62
- package/fesm2022/fundamental-ngx-core-calendar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-card.mjs +264 -188
- package/fesm2022/fundamental-ngx-core-card.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-carousel.mjs +35 -26
- package/fesm2022/fundamental-ngx-core-carousel.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-checkbox.mjs +7 -7
- package/fesm2022/fundamental-ngx-core-combobox.mjs +19 -18
- package/fesm2022/fundamental-ngx-core-combobox.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-content-density.mjs +46 -36
- package/fesm2022/fundamental-ngx-core-content-density.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-date-picker.mjs +13 -13
- package/fesm2022/fundamental-ngx-core-date-picker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-datetime-picker.mjs +15 -14
- package/fesm2022/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-datetime.mjs +32 -31
- package/fesm2022/fundamental-ngx-core-datetime.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-dialog.mjs +116 -89
- package/fesm2022/fundamental-ngx-core-dialog.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-dynamic-page.mjs +100 -77
- package/fesm2022/fundamental-ngx-core-dynamic-page.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-dynamic-side-content.mjs +13 -13
- package/fesm2022/fundamental-ngx-core-facets.mjs +24 -20
- package/fesm2022/fundamental-ngx-core-facets.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-feed-input.mjs +18 -17
- package/fesm2022/fundamental-ngx-core-feed-input.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-feed-list-item.mjs +22 -22
- package/fesm2022/fundamental-ngx-core-file-uploader.mjs +16 -16
- package/fesm2022/fundamental-ngx-core-fixed-card-layout.mjs +17 -15
- package/fesm2022/fundamental-ngx-core-fixed-card-layout.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-flexible-column-layout.mjs +7 -7
- package/fesm2022/fundamental-ngx-core-form.mjs +74 -74
- package/fesm2022/fundamental-ngx-core-form.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-formatted-text.mjs +17 -12
- package/fesm2022/fundamental-ngx-core-formatted-text.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-generic-tag.mjs +19 -13
- package/fesm2022/fundamental-ngx-core-generic-tag.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-grid-list.mjs +56 -51
- package/fesm2022/fundamental-ngx-core-grid-list.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-icon.mjs +33 -20
- package/fesm2022/fundamental-ngx-core-icon.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-illustrated-message.mjs +42 -31
- package/fesm2022/fundamental-ngx-core-illustrated-message.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-infinite-scroll.mjs +11 -9
- package/fesm2022/fundamental-ngx-core-infinite-scroll.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-info-label.mjs +29 -18
- package/fesm2022/fundamental-ngx-core-info-label.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-inline-help.mjs +35 -25
- package/fesm2022/fundamental-ngx-core-inline-help.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-input-group.mjs +21 -21
- package/fesm2022/fundamental-ngx-core-input-group.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-layout-grid.mjs +40 -27
- package/fesm2022/fundamental-ngx-core-layout-grid.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-layout-panel.mjs +41 -37
- package/fesm2022/fundamental-ngx-core-layout-panel.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-link.mjs +24 -19
- package/fesm2022/fundamental-ngx-core-link.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-list.mjs +100 -91
- package/fesm2022/fundamental-ngx-core-list.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-menu.mjs +125 -101
- package/fesm2022/fundamental-ngx-core-menu.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-message-box.mjs +39 -38
- package/fesm2022/fundamental-ngx-core-message-box.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-message-page.mjs +19 -19
- package/fesm2022/fundamental-ngx-core-message-strip.mjs +79 -55
- package/fesm2022/fundamental-ngx-core-message-strip.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-message-toast.mjs +17 -17
- package/fesm2022/fundamental-ngx-core-message-toast.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-micro-process-flow.mjs +21 -20
- package/fesm2022/fundamental-ngx-core-micro-process-flow.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-mobile-mode.mjs +3 -3
- package/fesm2022/fundamental-ngx-core-multi-combobox.mjs +98 -66
- package/fesm2022/fundamental-ngx-core-multi-combobox.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-multi-input.mjs +27 -21
- package/fesm2022/fundamental-ngx-core-multi-input.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-nested-list.mjs +46 -43
- package/fesm2022/fundamental-ngx-core-nested-list.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-notification.mjs +178 -132
- package/fesm2022/fundamental-ngx-core-notification.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-object-attribute.mjs +7 -7
- package/fesm2022/fundamental-ngx-core-object-identifier.mjs +24 -17
- package/fesm2022/fundamental-ngx-core-object-identifier.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-object-marker.mjs +41 -24
- package/fesm2022/fundamental-ngx-core-object-marker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-object-number.mjs +33 -21
- package/fesm2022/fundamental-ngx-core-object-number.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-object-status.mjs +41 -26
- package/fesm2022/fundamental-ngx-core-object-status.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-overflow-layout.mjs +33 -32
- package/fesm2022/fundamental-ngx-core-overflow-layout.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-pagination.mjs +10 -10
- package/fesm2022/fundamental-ngx-core-pagination.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-panel.mjs +51 -35
- package/fesm2022/fundamental-ngx-core-panel.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-popover.mjs +267 -164
- package/fesm2022/fundamental-ngx-core-popover.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-product-switch.mjs +46 -32
- package/fesm2022/fundamental-ngx-core-product-switch.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-progress-indicator.mjs +7 -7
- package/fesm2022/fundamental-ngx-core-quick-view.mjs +47 -44
- package/fesm2022/fundamental-ngx-core-quick-view.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-radio.mjs +8 -8
- package/fesm2022/fundamental-ngx-core-radio.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-rating-indicator.mjs +61 -39
- package/fesm2022/fundamental-ngx-core-rating-indicator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-resizable-card-layout.mjs +12 -11
- package/fesm2022/fundamental-ngx-core-resizable-card-layout.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-scroll-spy.mjs +17 -12
- package/fesm2022/fundamental-ngx-core-scroll-spy.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-scrollbar.mjs +14 -12
- package/fesm2022/fundamental-ngx-core-scrollbar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-segmented-button.mjs +9 -8
- package/fesm2022/fundamental-ngx-core-segmented-button.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-select.mjs +22 -21
- package/fesm2022/fundamental-ngx-core-select.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-settings.mjs +70 -60
- package/fesm2022/fundamental-ngx-core-settings.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-shared.mjs +3 -3
- package/fesm2022/fundamental-ngx-core-shellbar.mjs +77 -63
- package/fesm2022/fundamental-ngx-core-shellbar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-side-navigation.mjs +13 -13
- package/fesm2022/fundamental-ngx-core-skeleton.mjs +24 -16
- package/fesm2022/fundamental-ngx-core-skeleton.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-slider.mjs +15 -13
- package/fesm2022/fundamental-ngx-core-slider.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-split-button.mjs +10 -10
- package/fesm2022/fundamental-ngx-core-status-indicator.mjs +62 -35
- package/fesm2022/fundamental-ngx-core-status-indicator.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-step-input.mjs +11 -9
- package/fesm2022/fundamental-ngx-core-step-input.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-switch.mjs +8 -8
- package/fesm2022/fundamental-ngx-core-switch.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-table.mjs +51 -50
- package/fesm2022/fundamental-ngx-core-table.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-tabs.mjs +56 -55
- package/fesm2022/fundamental-ngx-core-tabs.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-text.mjs +29 -19
- package/fesm2022/fundamental-ngx-core-text.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-theming.mjs +7 -7
- package/fesm2022/fundamental-ngx-core-tile.mjs +171 -136
- package/fesm2022/fundamental-ngx-core-tile.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-time-picker.mjs +9 -8
- package/fesm2022/fundamental-ngx-core-time-picker.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-time.mjs +16 -13
- package/fesm2022/fundamental-ngx-core-time.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-timeline.mjs +43 -43
- package/fesm2022/fundamental-ngx-core-title.mjs +12 -10
- package/fesm2022/fundamental-ngx-core-title.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-token.mjs +33 -24
- package/fesm2022/fundamental-ngx-core-token.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-toolbar.mjs +35 -32
- package/fesm2022/fundamental-ngx-core-toolbar.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-tree.mjs +41 -36
- package/fesm2022/fundamental-ngx-core-tree.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-upload-collection.mjs +37 -37
- package/fesm2022/fundamental-ngx-core-upload-collection.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-user-menu.mjs +108 -84
- package/fesm2022/fundamental-ngx-core-user-menu.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-vertical-navigation.mjs +20 -17
- package/fesm2022/fundamental-ngx-core-vertical-navigation.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core-wizard.mjs +41 -32
- package/fesm2022/fundamental-ngx-core-wizard.mjs.map +1 -1
- package/fesm2022/fundamental-ngx-core.mjs +4 -4
- package/package.json +11 -10
- package/schematics/add-styles/index.js +3 -3
- package/schematics/add-styles/index.js.map +1 -1
- package/schematics/add-theming/index.js +1 -1
- package/schematics/add-theming/index.js.map +1 -1
- package/schematics/package.json +7 -0
- package/schematics/tsconfig.json +12 -6
- package/schematics/tsconfig.spec.json +2 -0
- package/schematics/utils/calls-providers-function.js +34 -1
- package/schematics/utils/calls-providers-function.js.map +1 -1
- package/schematics/utils/ng-module-utils.js +34 -1
- package/schematics/utils/ng-module-utils.js.map +1 -1
- package/types/fundamental-ngx-core-avatar-group-legacy.d.ts +1 -0
- package/types/fundamental-ngx-core-carousel.d.ts +2 -0
- package/types/fundamental-ngx-core-list.d.ts +2 -2
- package/types/fundamental-ngx-core-menu.d.ts +4 -4
- package/types/fundamental-ngx-core-notification.d.ts +0 -2
- package/types/fundamental-ngx-core-popover.d.ts +8 -6
- package/types/fundamental-ngx-core-product-switch.d.ts +6 -3
- package/types/fundamental-ngx-core-wizard.d.ts +4 -1
|
@@ -11,39 +11,46 @@ class ObjectIdentifierComponent {
|
|
|
11
11
|
* Object Identifier ID
|
|
12
12
|
* If not set, a default value is provided
|
|
13
13
|
*/
|
|
14
|
-
this.id = input('fd-object-identifier-' + ++objectIdentifierId,
|
|
14
|
+
this.id = input('fd-object-identifier-' + ++objectIdentifierId, /* @ts-ignore */
|
|
15
|
+
...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
15
16
|
/**
|
|
16
17
|
* Optional description text to display below the title.
|
|
17
18
|
* When provided, renders as a paragraph with the class `fd-object-identifier__text`.
|
|
18
19
|
*/
|
|
19
|
-
this.description = input(
|
|
20
|
+
this.description = input(/* @ts-ignore */
|
|
21
|
+
...(ngDevMode ? [undefined, { debugName: "description" }] : /* istanbul ignore next */ []));
|
|
20
22
|
/**
|
|
21
23
|
* Accessible label for screen readers.
|
|
22
24
|
* Used in the screen-reader-only span element to provide context for assistive technologies.
|
|
23
25
|
*/
|
|
24
|
-
this.ariaLabel = input(
|
|
26
|
+
this.ariaLabel = input(/* @ts-ignore */
|
|
27
|
+
...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
25
28
|
/**
|
|
26
29
|
* Whether to apply bold styling to the title.
|
|
27
30
|
* When true, adds the `fd-object-identifier__title--bold` class to the title element.
|
|
28
31
|
* @default false
|
|
29
32
|
*/
|
|
30
|
-
this.bold = input(false, { ...(ngDevMode ? { debugName: "bold" } : {}), transform: booleanAttribute });
|
|
33
|
+
this.bold = input(false, { ...(ngDevMode ? { debugName: "bold" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
31
34
|
/**
|
|
32
35
|
* Whether to apply medium sizing to the component.
|
|
33
36
|
* When true, adds the `fd-object-identifier--medium` class to the host element.
|
|
34
37
|
* @default false
|
|
35
38
|
*/
|
|
36
|
-
this.medium = input(false, { ...(ngDevMode ? { debugName: "medium" } : {}), transform: booleanAttribute });
|
|
39
|
+
this.medium = input(false, { ...(ngDevMode ? { debugName: "medium" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
37
40
|
/** Computed ID for the description text element */
|
|
38
|
-
this.textId = computed(() => `${this.id()}-text`,
|
|
41
|
+
this.textId = computed(() => `${this.id()}-text`, /* @ts-ignore */
|
|
42
|
+
...(ngDevMode ? [{ debugName: "textId" }] : /* istanbul ignore next */ []));
|
|
39
43
|
/** Computed ID for the title element */
|
|
40
|
-
this.titleId = computed(() => `${this.id()}-title`,
|
|
44
|
+
this.titleId = computed(() => `${this.id()}-title`, /* @ts-ignore */
|
|
45
|
+
...(ngDevMode ? [{ debugName: "titleId" }] : /* istanbul ignore next */ []));
|
|
41
46
|
/** Computed ID for the screen-reader only description element */
|
|
42
|
-
this.descriptionId = computed(() => `${this.id()}-description`,
|
|
47
|
+
this.descriptionId = computed(() => `${this.id()}-description`, /* @ts-ignore */
|
|
48
|
+
...(ngDevMode ? [{ debugName: "descriptionId" }] : /* istanbul ignore next */ []));
|
|
43
49
|
/** Whether any link components are projected via content projection */
|
|
44
|
-
this.hasLinks = computed(() => this._linkComponents().length > 0,
|
|
50
|
+
this.hasLinks = computed(() => this._linkComponents().length > 0, /* @ts-ignore */
|
|
51
|
+
...(ngDevMode ? [{ debugName: "hasLinks" }] : /* istanbul ignore next */ []));
|
|
45
52
|
/** Query for all projected link components to apply identifier-specific styling and ARIA attributes */
|
|
46
|
-
this._linkComponents = contentChildren(FD_LINK_COMPONENT, { ...(ngDevMode ? { debugName: "_linkComponents" } : {}), read: ElementRef });
|
|
53
|
+
this._linkComponents = contentChildren(FD_LINK_COMPONENT, { ...(ngDevMode ? { debugName: "_linkComponents" } : /* istanbul ignore next */ {}), read: ElementRef });
|
|
47
54
|
effect(() => {
|
|
48
55
|
this._applyLinkAttributes();
|
|
49
56
|
});
|
|
@@ -56,8 +63,8 @@ class ObjectIdentifierComponent {
|
|
|
56
63
|
link.nativeElement.setAttribute('aria-labelledby', ariaLabelledBy);
|
|
57
64
|
});
|
|
58
65
|
}
|
|
59
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
60
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
66
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectIdentifierComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
67
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: ObjectIdentifierComponent, isStandalone: true, selector: "fd-object-identifier", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, description: { classPropertyName: "description", publicName: "description", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, bold: { classPropertyName: "bold", publicName: "bold", isSignal: true, isRequired: false, transformFunction: null }, medium: { classPropertyName: "medium", publicName: "medium", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "id()", "class.fd-object-identifier--medium": "medium()" }, classAttribute: "fd-object-identifier" }, queries: [{ propertyName: "_linkComponents", predicate: FD_LINK_COMPONENT, read: ElementRef, isSignal: true }], ngImport: i0, template: `
|
|
61
68
|
<p class="fd-object-identifier__title" [class.fd-object-identifier__title--bold]="bold()" [attr.id]="titleId()">
|
|
62
69
|
<ng-content></ng-content>
|
|
63
70
|
</p>
|
|
@@ -75,7 +82,7 @@ class ObjectIdentifierComponent {
|
|
|
75
82
|
</span>
|
|
76
83
|
`, isInline: true, styles: [".fd-object-identifier .fd-object-identifier__link{font-size:inherit;font-weight:inherit}.fd-object-identifier__title{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapList_TextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdObjectIdentifier_Font_Size,var(--sapFontLargeSize));font-weight:400;font-weight:var(--fdObjectIdentifier_Font_Weight,normal);forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0}.fd-object-identifier__title:after,.fd-object-identifier__title:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-object-identifier__title--bold{--fdObjectIdentifier_Font_Weight:bold}.fd-object-identifier__text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1.5;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-margin-before:.5rem;color:var(--sapContent_LabelColor);margin-block-start:.5rem}.fd-object-identifier__text:after,.fd-object-identifier__text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-object-identifier__sr-only{position:absolute;clip:rect(0 0 0 0);border:0;height:1px;margin-block:-1px;margin-inline:-1px;overflow:hidden;padding-block:0;padding-inline:0;white-space:nowrap;width:1px}.fd-object-identifier--medium{--fdObjectIdentifier_Font_Size:var(--sapFontSize)}.fd-object-identifier__sr-only{position:absolute;clip:rect(0 0 0 0);height:1px;width:1px;border:0;margin-inline:-1px;margin-block:-1px;padding-inline:0;padding-block:0;overflow:hidden;white-space:nowrap}\n/*! Bundled license information:\n\nfundamental-styles/dist/object-identifier.css:\n (*!\n * Fundamental Library Styles v0.41.8\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"], dependencies: [{ kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
77
84
|
}
|
|
78
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
85
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectIdentifierComponent, decorators: [{
|
|
79
86
|
type: Component,
|
|
80
87
|
args: [{ selector: 'fd-object-identifier', template: `
|
|
81
88
|
<p class="fd-object-identifier__title" [class.fd-object-identifier__title--bold]="bold()" [attr.id]="titleId()">
|
|
@@ -105,11 +112,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
105
112
|
* Use direct import of `ObjectIdentifierComponent`.
|
|
106
113
|
*/
|
|
107
114
|
class ObjectIdentifierModule {
|
|
108
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
109
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
110
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
115
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectIdentifierModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
116
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ObjectIdentifierModule, imports: [ObjectIdentifierComponent], exports: [ObjectIdentifierComponent] }); }
|
|
117
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectIdentifierModule }); }
|
|
111
118
|
}
|
|
112
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
119
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectIdentifierModule, decorators: [{
|
|
113
120
|
type: NgModule,
|
|
114
121
|
args: [{
|
|
115
122
|
imports: [ObjectIdentifierComponent],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-core-object-identifier.mjs","sources":["../../../../libs/core/object-identifier/object-identifier.component.ts","../../../../libs/core/object-identifier/object-identifier.module.ts","../../../../libs/core/object-identifier/fundamental-ngx-core-object-identifier.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n ViewEncapsulation,\n booleanAttribute,\n computed,\n contentChildren,\n effect,\n input\n} from '@angular/core';\nimport { FD_LINK_COMPONENT } from '@fundamental-ngx/core/link';\nimport { FdTranslatePipe } from '@fundamental-ngx/i18n';\n\nlet objectIdentifierId = 0;\n\n@Component({\n selector: 'fd-object-identifier',\n template: `\n <p class=\"fd-object-identifier__title\" [class.fd-object-identifier__title--bold]=\"bold()\" [attr.id]=\"titleId()\">\n <ng-content></ng-content>\n </p>\n @if (description()) {\n <p class=\"fd-object-identifier__text\" [attr.id]=\"textId()\">\n {{ description() }}\n </p>\n }\n <span\n class=\"fd-object-identifier__sr-only\"\n [attr.id]=\"descriptionId()\"\n [attr.aria-hidden]=\"hasLinks() ? 'true' : null\"\n >\n {{ ariaLabel() || ('coreObjectIdentifier.srOnlyAriaLabel' | fdTranslate)() }}\n </span>\n `,\n styleUrl: './object-identifier.component.scss',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [FdTranslatePipe],\n host: {\n class: 'fd-object-identifier',\n '[attr.id]': 'id()',\n '[class.fd-object-identifier--medium]': 'medium()'\n }\n})\nexport class ObjectIdentifierComponent {\n /**\n * Object Identifier ID\n * If not set, a default value is provided\n */\n readonly id = input('fd-object-identifier-' + ++objectIdentifierId);\n\n /**\n * Optional description text to display below the title.\n * When provided, renders as a paragraph with the class `fd-object-identifier__text`.\n */\n readonly description = input<string>();\n\n /**\n * Accessible label for screen readers.\n * Used in the screen-reader-only span element to provide context for assistive technologies.\n */\n readonly ariaLabel = input<string>();\n\n /**\n * Whether to apply bold styling to the title.\n * When true, adds the `fd-object-identifier__title--bold` class to the title element.\n * @default false\n */\n readonly bold = input(false, { transform: booleanAttribute });\n\n /**\n * Whether to apply medium sizing to the component.\n * When true, adds the `fd-object-identifier--medium` class to the host element.\n * @default false\n */\n readonly medium = input(false, { transform: booleanAttribute });\n\n /** Computed ID for the description text element */\n protected readonly textId = computed(() => `${this.id()}-text`);\n\n /** Computed ID for the title element */\n protected readonly titleId = computed(() => `${this.id()}-title`);\n\n /** Computed ID for the screen-reader only description element */\n protected readonly descriptionId = computed(() => `${this.id()}-description`);\n\n /** Whether any link components are projected via content projection */\n protected readonly hasLinks = computed(() => this._linkComponents().length > 0);\n\n /** Query for all projected link components to apply identifier-specific styling and ARIA attributes */\n private readonly _linkComponents = contentChildren(FD_LINK_COMPONENT, { read: ElementRef });\n\n /** @hidden */\n constructor() {\n effect(() => {\n this._applyLinkAttributes();\n });\n }\n\n /** Applies identifier-specific CSS class and ARIA attributes to all link components */\n private _applyLinkAttributes(): void {\n const ariaLabelledBy = this.description() ? `${this.descriptionId()} ${this.textId()}` : this.descriptionId();\n\n this._linkComponents().forEach((link) => {\n link.nativeElement.classList.add('fd-object-identifier__link');\n link.nativeElement.setAttribute('aria-labelledby', ariaLabelledBy);\n });\n }\n}\n","import { NgModule } from '@angular/core';\nimport { ObjectIdentifierComponent } from './object-identifier.component';\n\n/**\n * @deprecated\n * Use direct import of `ObjectIdentifierComponent`.\n */\n@NgModule({\n imports: [ObjectIdentifierComponent],\n exports: [ObjectIdentifierComponent]\n})\nexport class ObjectIdentifierModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAcA,IAAI,kBAAkB,GAAG,CAAC;MA+Bb,yBAAyB,CAAA;;AAiDlC,IAAA,WAAA,GAAA;AAhDA;;;AAGG;
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-core-object-identifier.mjs","sources":["../../../../libs/core/object-identifier/object-identifier.component.ts","../../../../libs/core/object-identifier/object-identifier.module.ts","../../../../libs/core/object-identifier/fundamental-ngx-core-object-identifier.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n ElementRef,\n ViewEncapsulation,\n booleanAttribute,\n computed,\n contentChildren,\n effect,\n input\n} from '@angular/core';\nimport { FD_LINK_COMPONENT } from '@fundamental-ngx/core/link';\nimport { FdTranslatePipe } from '@fundamental-ngx/i18n';\n\nlet objectIdentifierId = 0;\n\n@Component({\n selector: 'fd-object-identifier',\n template: `\n <p class=\"fd-object-identifier__title\" [class.fd-object-identifier__title--bold]=\"bold()\" [attr.id]=\"titleId()\">\n <ng-content></ng-content>\n </p>\n @if (description()) {\n <p class=\"fd-object-identifier__text\" [attr.id]=\"textId()\">\n {{ description() }}\n </p>\n }\n <span\n class=\"fd-object-identifier__sr-only\"\n [attr.id]=\"descriptionId()\"\n [attr.aria-hidden]=\"hasLinks() ? 'true' : null\"\n >\n {{ ariaLabel() || ('coreObjectIdentifier.srOnlyAriaLabel' | fdTranslate)() }}\n </span>\n `,\n styleUrl: './object-identifier.component.scss',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [FdTranslatePipe],\n host: {\n class: 'fd-object-identifier',\n '[attr.id]': 'id()',\n '[class.fd-object-identifier--medium]': 'medium()'\n }\n})\nexport class ObjectIdentifierComponent {\n /**\n * Object Identifier ID\n * If not set, a default value is provided\n */\n readonly id = input('fd-object-identifier-' + ++objectIdentifierId);\n\n /**\n * Optional description text to display below the title.\n * When provided, renders as a paragraph with the class `fd-object-identifier__text`.\n */\n readonly description = input<string>();\n\n /**\n * Accessible label for screen readers.\n * Used in the screen-reader-only span element to provide context for assistive technologies.\n */\n readonly ariaLabel = input<string>();\n\n /**\n * Whether to apply bold styling to the title.\n * When true, adds the `fd-object-identifier__title--bold` class to the title element.\n * @default false\n */\n readonly bold = input(false, { transform: booleanAttribute });\n\n /**\n * Whether to apply medium sizing to the component.\n * When true, adds the `fd-object-identifier--medium` class to the host element.\n * @default false\n */\n readonly medium = input(false, { transform: booleanAttribute });\n\n /** Computed ID for the description text element */\n protected readonly textId = computed(() => `${this.id()}-text`);\n\n /** Computed ID for the title element */\n protected readonly titleId = computed(() => `${this.id()}-title`);\n\n /** Computed ID for the screen-reader only description element */\n protected readonly descriptionId = computed(() => `${this.id()}-description`);\n\n /** Whether any link components are projected via content projection */\n protected readonly hasLinks = computed(() => this._linkComponents().length > 0);\n\n /** Query for all projected link components to apply identifier-specific styling and ARIA attributes */\n private readonly _linkComponents = contentChildren(FD_LINK_COMPONENT, { read: ElementRef });\n\n /** @hidden */\n constructor() {\n effect(() => {\n this._applyLinkAttributes();\n });\n }\n\n /** Applies identifier-specific CSS class and ARIA attributes to all link components */\n private _applyLinkAttributes(): void {\n const ariaLabelledBy = this.description() ? `${this.descriptionId()} ${this.textId()}` : this.descriptionId();\n\n this._linkComponents().forEach((link) => {\n link.nativeElement.classList.add('fd-object-identifier__link');\n link.nativeElement.setAttribute('aria-labelledby', ariaLabelledBy);\n });\n }\n}\n","import { NgModule } from '@angular/core';\nimport { ObjectIdentifierComponent } from './object-identifier.component';\n\n/**\n * @deprecated\n * Use direct import of `ObjectIdentifierComponent`.\n */\n@NgModule({\n imports: [ObjectIdentifierComponent],\n exports: [ObjectIdentifierComponent]\n})\nexport class ObjectIdentifierModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;AAcA,IAAI,kBAAkB,GAAG,CAAC;MA+Bb,yBAAyB,CAAA;;AAiDlC,IAAA,WAAA,GAAA;AAhDA;;;AAGG;AACM,QAAA,IAAA,CAAA,EAAE,GAAG,KAAK,CAAC,uBAAuB,GAAG,EAAE,kBAAkB;+EAAC;AAEnE;;;AAGG;AACM,QAAA,IAAA,CAAA,WAAW,GAAG,KAAK;mGAAU;AAEtC;;;AAGG;AACM,QAAA,IAAA,CAAA,SAAS,GAAG,KAAK;iGAAU;AAEpC;;;;AAIG;QACM,IAAA,CAAA,IAAI,GAAG,KAAK,CAAC,KAAK,4EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;AAE7D;;;;AAIG;QACM,IAAA,CAAA,MAAM,GAAG,KAAK,CAAC,KAAK,8EAAI,SAAS,EAAE,gBAAgB,EAAA,CAAG;;QAG5C,IAAA,CAAA,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,IAAI,CAAC,EAAE,EAAE,CAAA,KAAA,CAAO;mFAAC;;QAG5C,IAAA,CAAA,OAAO,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,IAAI,CAAC,EAAE,EAAE,CAAA,MAAA,CAAQ;oFAAC;;QAG9C,IAAA,CAAA,aAAa,GAAG,QAAQ,CAAC,MAAM,CAAA,EAAG,IAAI,CAAC,EAAE,EAAE,CAAA,YAAA,CAAc;0FAAC;;AAG1D,QAAA,IAAA,CAAA,QAAQ,GAAG,QAAQ,CAAC,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC,MAAM,GAAG,CAAC;qFAAC;;QAG9D,IAAA,CAAA,eAAe,GAAG,eAAe,CAAC,iBAAiB,uFAAI,IAAI,EAAE,UAAU,EAAA,CAAG;QAIvF,MAAM,CAAC,MAAK;YACR,IAAI,CAAC,oBAAoB,EAAE;AAC/B,QAAA,CAAC,CAAC;IACN;;IAGQ,oBAAoB,GAAA;QACxB,MAAM,cAAc,GAAG,IAAI,CAAC,WAAW,EAAE,GAAG,CAAA,EAAG,IAAI,CAAC,aAAa,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,MAAM,EAAE,CAAA,CAAE,GAAG,IAAI,CAAC,aAAa,EAAE;QAE7G,IAAI,CAAC,eAAe,EAAE,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;YACpC,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,GAAG,CAAC,4BAA4B,CAAC;YAC9D,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC,iBAAiB,EAAE,cAAc,CAAC;AACtE,QAAA,CAAC,CAAC;IACN;8GA/DS,yBAAyB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAzB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,yBAAyB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,sBAAA,EAAA,MAAA,EAAA,EAAA,EAAA,EAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,WAAA,EAAA,EAAA,iBAAA,EAAA,aAAA,EAAA,UAAA,EAAA,aAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,SAAA,EAAA,EAAA,iBAAA,EAAA,WAAA,EAAA,UAAA,EAAA,WAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,IAAA,EAAA,EAAA,iBAAA,EAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,MAAA,EAAA,EAAA,iBAAA,EAAA,QAAA,EAAA,UAAA,EAAA,QAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,IAAA,EAAA,EAAA,UAAA,EAAA,EAAA,SAAA,EAAA,MAAA,EAAA,oCAAA,EAAA,UAAA,EAAA,EAAA,cAAA,EAAA,sBAAA,EAAA,EAAA,OAAA,EAAA,CAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,SAAA,EA8CiB,iBAAiB,EAAA,IAAA,EAAU,UAAU,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,EAzE9E;;;;;;;;;;;;;;;;AAgBT,IAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,MAAA,EAAA,CAAA,0iEAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAIS,eAAe,EAAA,IAAA,EAAA,aAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAOhB,yBAAyB,EAAA,UAAA,EAAA,CAAA;kBA7BrC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sBAAsB,EAAA,QAAA,EACtB;;;;;;;;;;;;;;;;KAgBT,EAAA,aAAA,EAEc,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,OAAA,EACtC,CAAC,eAAe,CAAC,EAAA,IAAA,EACpB;AACF,wBAAA,KAAK,EAAE,sBAAsB;AAC7B,wBAAA,WAAW,EAAE,MAAM;AACnB,wBAAA,sCAAsC,EAAE;AAC3C,qBAAA,EAAA,MAAA,EAAA,CAAA,0iEAAA,CAAA,EAAA;AAgDkD,SAAA,CAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,cAAA,EAAA,EAAA,EAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,IAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,WAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,aAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,SAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,WAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,IAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,MAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,MAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,IAAA,EAAA,KAAA,EAAA,QAAA,EAAA,QAAA,EAAA,KAAA,EAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,CAAA,EAAA,IAAA,EAAA,EAAA,CAAA,eAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,UAAA,CAAA,MAAA,iBAAiB,CAAA,EAAA,EAAA,GAAE,EAAE,IAAI,EAAE,UAAU,EAAE,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,EAAA,EAAA,CAAA;;ACxF9F;;;AAGG;MAKU,sBAAsB,CAAA;8GAAtB,sBAAsB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;+GAAtB,sBAAsB,EAAA,OAAA,EAAA,CAHrB,yBAAyB,CAAA,EAAA,OAAA,EAAA,CACzB,yBAAyB,CAAA,EAAA,CAAA,CAAA;+GAE1B,sBAAsB,EAAA,CAAA,CAAA;;2FAAtB,sBAAsB,EAAA,UAAA,EAAA,CAAA;kBAJlC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACN,OAAO,EAAE,CAAC,yBAAyB,CAAC;oBACpC,OAAO,EAAE,CAAC,yBAAyB;AACtC,iBAAA;;;ACVD;;AAEG;;;;"}
|
|
@@ -10,42 +10,57 @@ class ObjectMarkerComponent {
|
|
|
10
10
|
* Object Marker ID
|
|
11
11
|
* If not set, a default value is provided
|
|
12
12
|
*/
|
|
13
|
-
this.id = input('fd-object-marker-' + ++objectMarkerId,
|
|
13
|
+
this.id = input('fd-object-marker-' + ++objectMarkerId, /* @ts-ignore */
|
|
14
|
+
...(ngDevMode ? [{ debugName: "id" }] : /* istanbul ignore next */ []));
|
|
14
15
|
/** Sets aria-labelledby attribute for object marker */
|
|
15
|
-
this.ariaLabelledBy = input(
|
|
16
|
+
this.ariaLabelledBy = input(/* @ts-ignore */
|
|
17
|
+
...(ngDevMode ? [undefined, { debugName: "ariaLabelledBy" }] : /* istanbul ignore next */ []));
|
|
16
18
|
/** Status text for the Object Status. */
|
|
17
|
-
this.statusText = input(
|
|
19
|
+
this.statusText = input(/* @ts-ignore */
|
|
20
|
+
...(ngDevMode ? [undefined, { debugName: "statusText" }] : /* istanbul ignore next */ []));
|
|
18
21
|
/** Glyph (icon) of the Object Status.*/
|
|
19
|
-
this.glyph = input(
|
|
22
|
+
this.glyph = input(/* @ts-ignore */
|
|
23
|
+
...(ngDevMode ? [undefined, { debugName: "glyph" }] : /* istanbul ignore next */ []));
|
|
20
24
|
/** Glyph font family */
|
|
21
|
-
this.glyphFont = input(FD_DEFAULT_ICON_FONT_FAMILY,
|
|
25
|
+
this.glyphFont = input(FD_DEFAULT_ICON_FONT_FAMILY, /* @ts-ignore */
|
|
26
|
+
...(ngDevMode ? [{ debugName: "glyphFont" }] : /* istanbul ignore next */ []));
|
|
22
27
|
/** Whether the Object Status is clickable. */
|
|
23
|
-
this.clickable = input(false,
|
|
28
|
+
this.clickable = input(false, /* @ts-ignore */
|
|
29
|
+
...(ngDevMode ? [{ debugName: "clickable" }] : /* istanbul ignore next */ []));
|
|
24
30
|
/** Define the text content of the Object Status */
|
|
25
|
-
this.label = input(
|
|
31
|
+
this.label = input(/* @ts-ignore */
|
|
32
|
+
...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
26
33
|
/** Title attribute for the Object Status */
|
|
27
|
-
this.title = input(
|
|
34
|
+
this.title = input(/* @ts-ignore */
|
|
35
|
+
...(ngDevMode ? [undefined, { debugName: "title" }] : /* istanbul ignore next */ []));
|
|
28
36
|
/** @hidden */
|
|
29
37
|
this.elementRef = inject(ElementRef);
|
|
30
38
|
/** Computed ID for the screen-reader only element */
|
|
31
|
-
this.srOnlyId = computed(() => `${this.id()}-sr-only`,
|
|
39
|
+
this.srOnlyId = computed(() => `${this.id()}-sr-only`, /* @ts-ignore */
|
|
40
|
+
...(ngDevMode ? [{ debugName: "srOnlyId" }] : /* istanbul ignore next */ []));
|
|
32
41
|
/** Computed ID for the label element */
|
|
33
|
-
this.labelId = computed(() => `${this.id()}-label`,
|
|
42
|
+
this.labelId = computed(() => `${this.id()}-label`, /* @ts-ignore */
|
|
43
|
+
...(ngDevMode ? [{ debugName: "labelId" }] : /* istanbul ignore next */ []));
|
|
34
44
|
/** Computed ID for the screen-reader only element for icon-only object marker */
|
|
35
|
-
this.srOnlyIconOnlyId = computed(() => `${this.id()}-sr-only-icon-only`,
|
|
45
|
+
this.srOnlyIconOnlyId = computed(() => `${this.id()}-sr-only-icon-only`, /* @ts-ignore */
|
|
46
|
+
...(ngDevMode ? [{ debugName: "srOnlyIconOnlyId" }] : /* istanbul ignore next */ []));
|
|
36
47
|
/** @hidden Role attribute for the object marker */
|
|
37
|
-
this.role = computed(() => this.clickable() ? 'link' : this.glyph() && !this.label() ? 'img' : undefined,
|
|
48
|
+
this.role = computed(() => this.clickable() ? 'link' : this.glyph() && !this.label() ? 'img' : undefined, /* @ts-ignore */
|
|
49
|
+
...(ngDevMode ? [{ debugName: "role" }] : /* istanbul ignore next */ []));
|
|
38
50
|
/** @hidden Role attribute for the icon */
|
|
39
|
-
this.iconRole = computed(() => (this.label() ? 'presentation' : undefined),
|
|
51
|
+
this.iconRole = computed(() => (this.label() ? 'presentation' : undefined), /* @ts-ignore */
|
|
52
|
+
...(ngDevMode ? [{ debugName: "iconRole" }] : /* istanbul ignore next */ []));
|
|
40
53
|
/** @hidden Computed status text (uses custom or default) */
|
|
41
|
-
this.statusText$ = computed(() => this.statusText() ?? this._defaultStatusText(),
|
|
54
|
+
this.statusText$ = computed(() => this.statusText() ?? this._defaultStatusText(), /* @ts-ignore */
|
|
55
|
+
...(ngDevMode ? [{ debugName: "statusText$" }] : /* istanbul ignore next */ []));
|
|
42
56
|
/** @hidden Computed title for icon (only when no label exists) */
|
|
43
57
|
this.iconTitle = computed(() => {
|
|
44
58
|
if (!this.glyph() || this.label()) {
|
|
45
59
|
return undefined;
|
|
46
60
|
}
|
|
47
61
|
return this.title() ?? this.glyph();
|
|
48
|
-
},
|
|
62
|
+
}, /* @ts-ignore */
|
|
63
|
+
...(ngDevMode ? [{ debugName: "iconTitle" }] : /* istanbul ignore next */ []));
|
|
49
64
|
/** @hidden Computed aria-labelledby attribute */
|
|
50
65
|
this.computedAriaLabelledBy = computed(() => {
|
|
51
66
|
if (this.ariaLabelledBy()) {
|
|
@@ -55,18 +70,20 @@ class ObjectMarkerComponent {
|
|
|
55
70
|
return `${this.srOnlyId()} ${this.srOnlyIconOnlyId()}`;
|
|
56
71
|
}
|
|
57
72
|
return `${this.srOnlyId()} ${this.labelId()}`;
|
|
58
|
-
},
|
|
73
|
+
}, /* @ts-ignore */
|
|
74
|
+
...(ngDevMode ? [{ debugName: "computedAriaLabelledBy" }] : /* istanbul ignore next */ []));
|
|
59
75
|
/** @hidden Translation signal for active state */
|
|
60
76
|
this._activeStatusText = resolveTranslationSignal('coreObjectMarker.active');
|
|
61
77
|
/** @hidden Translation signal for inactive state */
|
|
62
78
|
this._inactiveStatusText = resolveTranslationSignal('coreObjectMarker.inactive');
|
|
63
79
|
/** @hidden Default status text for the Object Marker. */
|
|
64
|
-
this._defaultStatusText = computed(() => this.clickable() ? this._activeStatusText() : this._inactiveStatusText(),
|
|
80
|
+
this._defaultStatusText = computed(() => this.clickable() ? this._activeStatusText() : this._inactiveStatusText(), /* @ts-ignore */
|
|
81
|
+
...(ngDevMode ? [{ debugName: "_defaultStatusText" }] : /* istanbul ignore next */ []));
|
|
65
82
|
}
|
|
66
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
67
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
83
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectMarkerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
84
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: ObjectMarkerComponent, isStandalone: true, selector: "[fd-object-marker]", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, statusText: { classPropertyName: "statusText", publicName: "statusText", isSignal: true, isRequired: false, transformFunction: null }, glyph: { classPropertyName: "glyph", publicName: "glyph", isSignal: true, isRequired: false, transformFunction: null }, glyphFont: { classPropertyName: "glyphFont", publicName: "glyphFont", isSignal: true, isRequired: false, transformFunction: null }, clickable: { classPropertyName: "clickable", publicName: "clickable", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.fd-object-marker--link": "clickable()", "attr.id": "id()", "attr.tabindex": "clickable() ? 0 : -1", "attr.role": "role()", "attr.aria-labelledby": "computedAriaLabelledBy()" }, classAttribute: "fd-object-marker" }, ngImport: i0, template: "<span class=\"fd-object-marker__sr-only\" [id]=\"srOnlyId()\" [attr.aria-hidden]=\"true\">{{ statusText$() }}</span>\n\n@if (glyph()) {\n <fd-icon\n [glyph]=\"glyph()\"\n [font]=\"glyphFont()\"\n class=\"fd-object-marker__icon\"\n [attr.role]=\"iconRole()\"\n [attr.title]=\"iconTitle()\"\n [ariaHidden]=\"true\"\n ></fd-icon>\n}\n@if (label()) {\n <span class=\"fd-object-marker__text\" [id]=\"labelId()\">{{ label() }}</span>\n}\n\n@if (glyph() && !label()) {\n <span class=\"fd-object-marker__sr-only\" [id]=\"srOnlyIconOnlyId()\" [attr.aria-hidden]=\"true\">{{ iconTitle() }}</span>\n}\n<ng-content></ng-content>\n", styles: [".fd-object-marker{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:1rem;font-weight:400;forced-color-adjust:none;line-height:normal;line-height:1;margin-block:0;margin-inline:0;max-width:100%;padding-block:0;padding-inline:0;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-object-marker:after,.fd-object-marker:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-object-marker--link{color:var(--sapLinkColor);cursor:pointer;display:var(--fdLink_Display,inline-block);text-shadow:var(--sapContent_TextShadow);-webkit-box-align:center;-ms-flex-align:center;align-items:center;line-height:inherit;overflow-wrap:break-word;text-decoration:var(--fdLink_Text_Decoration,none);-webkit-transition:all .125s ease-in;transition:all .125s ease-in;white-space:normal;word-break:break-word}.fd-object-marker--link--emphasized{font-family:var(--sapFontBoldFamily)}.fd-object-marker--link--touch-target{--fdLink_Line_Height:1.5rem}.fd-object-marker--link:visited{color:var(--sapLink_Visited_Color)}.fd-object-marker--link.is-hover,.fd-object-marker--link:hover{color:var(--sapLink_Hover_Color)}.fd-object-marker--link.is-focus,.fd-object-marker--link:focus{background-color:var(--fdLink_Focus_Background);border-radius:var(--fdLink_Focus_Border_Radius);-webkit-box-shadow:none;box-shadow:none;color:var(--fdLink_Text_Focus_Color);outline:var(--fdLink_Hover_Outline_Color) var(--fdLink_Hover_Outline_Style) var(--fdLink_Hover_Outline_Width);outline-offset:var(--fdLink_Hover_Outline_Offset);text-shadow:var(--fdLink_Focus_Text_Shadow)}.fd-object-marker--link.is-active,.fd-object-marker--link:active{color:var(--sapLink_Active_Color)}.fd-object-marker--link.is-active.is-focus,.fd-object-marker--link.is-active:focus,.fd-object-marker--link:active.is-focus,.fd-object-marker--link:active:focus{background-color:transparent;z-index:5}.fd-object-marker--link--inverted{text-shadow:none}.fd-object-marker--link--inverted,.fd-object-marker--link--inverted.is-hover,.fd-object-marker--link--inverted:hover{color:var(--sapLink_InvertedColor)}.fd-object-marker--link--inverted.is-focus,.fd-object-marker--link--inverted:focus{outline-color:var(--sapContent_ContrastFocusColor);z-index:5}.fd-object-marker--link--subtle{color:var(--sapLink_SubtleColor)}.fd-object-marker--link.is-disabled,.fd-object-marker--link:disabled,.fd-object-marker--link[aria-disabled=true]{color:var(--sapLinkColor);opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-object-marker--link>img{vertical-align:bottom}.fd-object-marker--link .fd-object-marker__text,.fd-object-marker--link__content{text-decoration:var(--fdLink_Text_Content_Decoration,none)}.fd-object-marker--link.is-hover,.fd-object-marker--link:hover{--fdLink_Text_Decoration:var(--fdLink_Text_Decoration_Hover,none);--fdLink_Text_Content_Decoration:var(--fdLink_Text_Content_Decoration_Hover,none)}.fd-object-marker--link.is-focus,.fd-object-marker--link:focus{z-index:5;--fdLink_Text_Decoration:var(--fdLink_Text_Decoration_Focus,none);--fdLink_Text_Content_Decoration:var(--fdLink_Text_Content_Decoration_Focus,none)}.fd-object-marker--link.is-active,.fd-object-marker--link:active{--fdLink_Text_Decoration:var(--fdLink_Text_Decoration_Active,none);--fdLink_Text_Content_Decoration:var(--fdLink_Text_Content_Decoration_Active,none)}.fd-object-marker--link.is-disabled,.fd-object-marker--link:disabled,.fd-object-marker--link[aria-disabled=true]{--fdLink_Text_Decoration:var(--fdLink_Text_Decoration_Disabled,none);--fdLink_Text_Content_Decoration:var(--fdLink_Text_Content_Decoration_Disabled,none)}.fd-object-marker--link--subtle{--fdLink_Text_Content_Decoration:var(--fdLink_Text_Content_Decoration_Subtle,none);--fdLink_Text_Content_Decoration_Hover:var(--fdLink_Text_Content_Decoration_Subtle_Hover,none);--fdLink_Text_Content_Decoration_Active:var(--fdLink_Text_Content_Decoration_Subtle_Active,none);--fdLink_Text_Decoration:var(--fdLink_Text_Decoration_Subtle,none);--fdLink_Text_Decoration_Hover:var(--fdLink_Text_Decoration_Subtle_Hover,none);--fdLink_Text_Decoration_Active:var(--fdLink_Text_Decoration_Subtle_Active,none)}.fd-object-marker--link--undecorated{--fdLink_Text_Decoration:none;--fdLink_Text_Decoration_Subtle:none;--fdLink_Text_Decoration_Subtle_Hover:none;--fdLink_Text_Decoration_Subtle_Active:none;--fdLink_Text_Decoration_Hover:none;--fdLink_Text_Decoration_Focus:none;--fdLink_Text_Decoration_Active:none;--fdLink_Text_Decoration_Visited:none;--fdLink_Text_Decoration_Disabled:none;--fdLink_Text_Content_Decoration:none;--fdLink_Text_Content_Decoration_Subtle:none;--fdLink_Text_Content_Decoration_Subtle_Hover:none;--fdLink_Text_Content_Decoration_Subtle_Active:none;--fdLink_Text_Content_Decoration_Hover:none;--fdLink_Text_Content_Decoration_Focus:none;--fdLink_Text_Content_Decoration_Active:none;--fdLink_Text_Content_Decoration_Visited:none;--fdLink_Text_Content_Decoration_Disabled:none}.fd-object-marker__icon [class*=sap-icon],.fd-object-marker__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:1rem;line-height:normal;-webkit-padding-end:.25rem;color:var(--sapContent_MarkerIconColor);padding-inline-end:.25rem}.fd-object-marker__icon [class*=sap-icon]:first-child:last-child,.fd-object-marker__icon[class*=sap-icon]:first-child:last-child{padding-inline:0}.fd-object-marker__sr-only{position:absolute;clip:rect(0 0 0 0);border:0;height:1px;margin-block:-1px;margin-inline:-1px;overflow:hidden;padding-block:0;padding-inline:0;white-space:nowrap;width:1px}.fd-object-marker:not(.fd-object-marker--link) .fd-object-marker__text{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--sapContent_LabelColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:1rem;font-style:normal;font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;word-break:break-word}.fd-object-marker:not(.fd-object-marker--link) .fd-object-marker__text:after,.fd-object-marker:not(.fd-object-marker--link) .fd-object-marker__text:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-object-marker+.fd-object-marker{-webkit-margin-start:.5rem;margin-inline-start:.5rem}.fd-object-marker__sr-only{position:absolute;clip:rect(0 0 0 0);height:1px;width:1px;border:0;margin-inline:-1px;margin-block:-1px;padding-inline:0;padding-block:0;overflow:hidden;white-space:nowrap}\n/*! Bundled license information:\n\nfundamental-styles/dist/object-marker.css:\n (*!\n * Fundamental Library Styles v0.41.8\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n *)\n*/\n"], dependencies: [{ kind: "component", type: IconComponent, selector: "fd-icon", inputs: ["glyph", "font", "color", "background", "size", "class", "ariaLabel", "ariaHidden"], outputs: ["ariaHiddenChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
68
85
|
}
|
|
69
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
86
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectMarkerComponent, decorators: [{
|
|
70
87
|
type: Component,
|
|
71
88
|
args: [{ selector: '[fd-object-marker]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
72
89
|
class: 'fd-object-marker',
|
|
@@ -83,11 +100,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
83
100
|
* Use direct import of `ObjectMarkerComponent`
|
|
84
101
|
*/
|
|
85
102
|
class ObjectMarkerModule {
|
|
86
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
87
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
88
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
103
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectMarkerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
104
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ObjectMarkerModule, imports: [ObjectMarkerComponent], exports: [ObjectMarkerComponent] }); }
|
|
105
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectMarkerModule, imports: [ObjectMarkerComponent] }); }
|
|
89
106
|
}
|
|
90
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
107
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectMarkerModule, decorators: [{
|
|
91
108
|
type: NgModule,
|
|
92
109
|
args: [{
|
|
93
110
|
imports: [ObjectMarkerComponent],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fundamental-ngx-core-object-marker.mjs","sources":["../../../../libs/core/object-marker/object-marker.component.ts","../../../../libs/core/object-marker/object-marker.component.html","../../../../libs/core/object-marker/object-marker.module.ts","../../../../libs/core/object-marker/fundamental-ngx-core-object-marker.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n computed,\n ElementRef,\n inject,\n input,\n ViewEncapsulation\n} from '@angular/core';\nimport { HasElementRef } from '@fundamental-ngx/cdk';\nimport { FD_DEFAULT_ICON_FONT_FAMILY, IconComponent, IconFont } from '@fundamental-ngx/core/icon';\nimport { resolveTranslationSignal } from '@fundamental-ngx/i18n';\n\nlet objectMarkerId = 0;\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fd-object-marker]',\n templateUrl: './object-marker.component.html',\n styleUrl: './object-marker.component.scss',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'fd-object-marker',\n '[class.fd-object-marker--link]': 'clickable()',\n '[attr.id]': 'id()',\n '[attr.tabindex]': 'clickable() ? 0 : -1',\n '[attr.role]': 'role()',\n '[attr.aria-labelledby]': 'computedAriaLabelledBy()'\n },\n imports: [IconComponent]\n})\nexport class ObjectMarkerComponent implements HasElementRef {\n /**\n * Object Marker ID\n * If not set, a default value is provided\n */\n readonly id = input('fd-object-marker-' + ++objectMarkerId);\n\n /** Sets aria-labelledby attribute for object marker */\n readonly ariaLabelledBy = input<string>();\n\n /** Status text for the Object Status. */\n readonly statusText = input<string>();\n\n /** Glyph (icon) of the Object Status.*/\n readonly glyph = input<string>();\n\n /** Glyph font family */\n readonly glyphFont = input<IconFont>(FD_DEFAULT_ICON_FONT_FAMILY);\n\n /** Whether the Object Status is clickable. */\n readonly clickable = input(false);\n\n /** Define the text content of the Object Status */\n readonly label = input<string>();\n\n /** Title attribute for the Object Status */\n readonly title = input<string>();\n\n /** @hidden */\n readonly elementRef = inject(ElementRef);\n\n /** Computed ID for the screen-reader only element */\n protected readonly srOnlyId = computed(() => `${this.id()}-sr-only`);\n\n /** Computed ID for the label element */\n protected readonly labelId = computed(() => `${this.id()}-label`);\n\n /** Computed ID for the screen-reader only element for icon-only object marker */\n protected readonly srOnlyIconOnlyId = computed(() => `${this.id()}-sr-only-icon-only`);\n\n /** @hidden Role attribute for the object marker */\n protected readonly role = computed(() =>\n this.clickable() ? 'link' : this.glyph() && !this.label() ? 'img' : undefined\n );\n\n /** @hidden Role attribute for the icon */\n protected readonly iconRole = computed(() => (this.label() ? 'presentation' : undefined));\n\n /** @hidden Computed status text (uses custom or default) */\n protected readonly statusText$ = computed(() => this.statusText() ?? this._defaultStatusText());\n\n /** @hidden Computed title for icon (only when no label exists) */\n protected readonly iconTitle = computed(() => {\n if (!this.glyph() || this.label()) {\n return undefined;\n }\n return this.title() ?? this.glyph();\n });\n\n /** @hidden Computed aria-labelledby attribute */\n protected readonly computedAriaLabelledBy = computed(() => {\n if (this.ariaLabelledBy()) {\n return this.ariaLabelledBy();\n }\n\n if (this.glyph() && !this.label()) {\n return `${this.srOnlyId()} ${this.srOnlyIconOnlyId()}`;\n }\n\n return `${this.srOnlyId()} ${this.labelId()}`;\n });\n\n /** @hidden Translation signal for active state */\n private readonly _activeStatusText = resolveTranslationSignal('coreObjectMarker.active');\n\n /** @hidden Translation signal for inactive state */\n private readonly _inactiveStatusText = resolveTranslationSignal('coreObjectMarker.inactive');\n\n /** @hidden Default status text for the Object Marker. */\n private readonly _defaultStatusText = computed(() =>\n this.clickable() ? this._activeStatusText() : this._inactiveStatusText()\n );\n}\n","<span class=\"fd-object-marker__sr-only\" [id]=\"srOnlyId()\" [attr.aria-hidden]=\"true\">{{ statusText$() }}</span>\n\n@if (glyph()) {\n <fd-icon\n [glyph]=\"glyph()\"\n [font]=\"glyphFont()\"\n class=\"fd-object-marker__icon\"\n [attr.role]=\"iconRole()\"\n [attr.title]=\"iconTitle()\"\n [ariaHidden]=\"true\"\n ></fd-icon>\n}\n@if (label()) {\n <span class=\"fd-object-marker__text\" [id]=\"labelId()\">{{ label() }}</span>\n}\n\n@if (glyph() && !label()) {\n <span class=\"fd-object-marker__sr-only\" [id]=\"srOnlyIconOnlyId()\" [attr.aria-hidden]=\"true\">{{ iconTitle() }}</span>\n}\n<ng-content></ng-content>\n","import { NgModule } from '@angular/core';\nimport { ObjectMarkerComponent } from './object-marker.component';\n\n/**\n * @deprecated\n * Use direct import of `ObjectMarkerComponent`\n */\n@NgModule({\n imports: [ObjectMarkerComponent],\n exports: [ObjectMarkerComponent]\n})\nexport class ObjectMarkerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"fundamental-ngx-core-object-marker.mjs","sources":["../../../../libs/core/object-marker/object-marker.component.ts","../../../../libs/core/object-marker/object-marker.component.html","../../../../libs/core/object-marker/object-marker.module.ts","../../../../libs/core/object-marker/fundamental-ngx-core-object-marker.ts"],"sourcesContent":["import {\n ChangeDetectionStrategy,\n Component,\n computed,\n ElementRef,\n inject,\n input,\n ViewEncapsulation\n} from '@angular/core';\nimport { HasElementRef } from '@fundamental-ngx/cdk';\nimport { FD_DEFAULT_ICON_FONT_FAMILY, IconComponent, IconFont } from '@fundamental-ngx/core/icon';\nimport { resolveTranslationSignal } from '@fundamental-ngx/i18n';\n\nlet objectMarkerId = 0;\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fd-object-marker]',\n templateUrl: './object-marker.component.html',\n styleUrl: './object-marker.component.scss',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'fd-object-marker',\n '[class.fd-object-marker--link]': 'clickable()',\n '[attr.id]': 'id()',\n '[attr.tabindex]': 'clickable() ? 0 : -1',\n '[attr.role]': 'role()',\n '[attr.aria-labelledby]': 'computedAriaLabelledBy()'\n },\n imports: [IconComponent]\n})\nexport class ObjectMarkerComponent implements HasElementRef {\n /**\n * Object Marker ID\n * If not set, a default value is provided\n */\n readonly id = input('fd-object-marker-' + ++objectMarkerId);\n\n /** Sets aria-labelledby attribute for object marker */\n readonly ariaLabelledBy = input<string>();\n\n /** Status text for the Object Status. */\n readonly statusText = input<string>();\n\n /** Glyph (icon) of the Object Status.*/\n readonly glyph = input<string>();\n\n /** Glyph font family */\n readonly glyphFont = input<IconFont>(FD_DEFAULT_ICON_FONT_FAMILY);\n\n /** Whether the Object Status is clickable. */\n readonly clickable = input(false);\n\n /** Define the text content of the Object Status */\n readonly label = input<string>();\n\n /** Title attribute for the Object Status */\n readonly title = input<string>();\n\n /** @hidden */\n readonly elementRef = inject(ElementRef);\n\n /** Computed ID for the screen-reader only element */\n protected readonly srOnlyId = computed(() => `${this.id()}-sr-only`);\n\n /** Computed ID for the label element */\n protected readonly labelId = computed(() => `${this.id()}-label`);\n\n /** Computed ID for the screen-reader only element for icon-only object marker */\n protected readonly srOnlyIconOnlyId = computed(() => `${this.id()}-sr-only-icon-only`);\n\n /** @hidden Role attribute for the object marker */\n protected readonly role = computed(() =>\n this.clickable() ? 'link' : this.glyph() && !this.label() ? 'img' : undefined\n );\n\n /** @hidden Role attribute for the icon */\n protected readonly iconRole = computed(() => (this.label() ? 'presentation' : undefined));\n\n /** @hidden Computed status text (uses custom or default) */\n protected readonly statusText$ = computed(() => this.statusText() ?? this._defaultStatusText());\n\n /** @hidden Computed title for icon (only when no label exists) */\n protected readonly iconTitle = computed(() => {\n if (!this.glyph() || this.label()) {\n return undefined;\n }\n return this.title() ?? this.glyph();\n });\n\n /** @hidden Computed aria-labelledby attribute */\n protected readonly computedAriaLabelledBy = computed(() => {\n if (this.ariaLabelledBy()) {\n return this.ariaLabelledBy();\n }\n\n if (this.glyph() && !this.label()) {\n return `${this.srOnlyId()} ${this.srOnlyIconOnlyId()}`;\n }\n\n return `${this.srOnlyId()} ${this.labelId()}`;\n });\n\n /** @hidden Translation signal for active state */\n private readonly _activeStatusText = resolveTranslationSignal('coreObjectMarker.active');\n\n /** @hidden Translation signal for inactive state */\n private readonly _inactiveStatusText = resolveTranslationSignal('coreObjectMarker.inactive');\n\n /** @hidden Default status text for the Object Marker. */\n private readonly _defaultStatusText = computed(() =>\n this.clickable() ? this._activeStatusText() : this._inactiveStatusText()\n );\n}\n","<span class=\"fd-object-marker__sr-only\" [id]=\"srOnlyId()\" [attr.aria-hidden]=\"true\">{{ statusText$() }}</span>\n\n@if (glyph()) {\n <fd-icon\n [glyph]=\"glyph()\"\n [font]=\"glyphFont()\"\n class=\"fd-object-marker__icon\"\n [attr.role]=\"iconRole()\"\n [attr.title]=\"iconTitle()\"\n [ariaHidden]=\"true\"\n ></fd-icon>\n}\n@if (label()) {\n <span class=\"fd-object-marker__text\" [id]=\"labelId()\">{{ label() }}</span>\n}\n\n@if (glyph() && !label()) {\n <span class=\"fd-object-marker__sr-only\" [id]=\"srOnlyIconOnlyId()\" [attr.aria-hidden]=\"true\">{{ iconTitle() }}</span>\n}\n<ng-content></ng-content>\n","import { NgModule } from '@angular/core';\nimport { ObjectMarkerComponent } from './object-marker.component';\n\n/**\n * @deprecated\n * Use direct import of `ObjectMarkerComponent`\n */\n@NgModule({\n imports: [ObjectMarkerComponent],\n exports: [ObjectMarkerComponent]\n})\nexport class ObjectMarkerModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -8,33 +8,43 @@ class ObjectNumberComponent {
|
|
|
8
8
|
/**
|
|
9
9
|
* Numerical value of the object number.
|
|
10
10
|
*/
|
|
11
|
-
this.number = input(
|
|
11
|
+
this.number = input(/* @ts-ignore */
|
|
12
|
+
...(ngDevMode ? [undefined, { debugName: "number" }] : /* istanbul ignore next */ []));
|
|
12
13
|
/**
|
|
13
14
|
* Number of decimal places to show
|
|
14
15
|
*/
|
|
15
|
-
this.decimal = input(0,
|
|
16
|
+
this.decimal = input(0, /* @ts-ignore */
|
|
17
|
+
...(ngDevMode ? [{ debugName: "decimal" }] : /* istanbul ignore next */ []));
|
|
16
18
|
/** Sets unit of measure displayed. */
|
|
17
|
-
this.unit = input(
|
|
19
|
+
this.unit = input(/* @ts-ignore */
|
|
20
|
+
...(ngDevMode ? [undefined, { debugName: "unit" }] : /* istanbul ignore next */ []));
|
|
18
21
|
/** Set the value to true to display the object number in bold text */
|
|
19
|
-
this.emphasized = input(false,
|
|
22
|
+
this.emphasized = input(false, /* @ts-ignore */
|
|
23
|
+
...(ngDevMode ? [{ debugName: "emphasized" }] : /* istanbul ignore next */ []));
|
|
20
24
|
/** Set the value to true to display the object number in large text */
|
|
21
|
-
this.large = input(false,
|
|
25
|
+
this.large = input(false, /* @ts-ignore */
|
|
26
|
+
...(ngDevMode ? [{ debugName: "large" }] : /* istanbul ignore next */ []));
|
|
22
27
|
/** Sets status/semantic color 'negative' / 'critical' / 'positive' / 'informative' */
|
|
23
|
-
this.status = input(
|
|
28
|
+
this.status = input(/* @ts-ignore */
|
|
29
|
+
...(ngDevMode ? [undefined, { debugName: "status" }] : /* istanbul ignore next */ []));
|
|
24
30
|
/** An optional status message for the object number */
|
|
25
|
-
this.statusMessage = input(
|
|
31
|
+
this.statusMessage = input(/* @ts-ignore */
|
|
32
|
+
...(ngDevMode ? [undefined, { debugName: "statusMessage" }] : /* istanbul ignore next */ []));
|
|
26
33
|
/** Id of the element that labels object number. */
|
|
27
|
-
this.ariaLabelledBy = input(
|
|
34
|
+
this.ariaLabelledBy = input(/* @ts-ignore */
|
|
35
|
+
...(ngDevMode ? [undefined, { debugName: "ariaLabelledBy" }] : /* istanbul ignore next */ []));
|
|
28
36
|
/** Aria label for the object number. */
|
|
29
|
-
this.ariaLabel = input(
|
|
37
|
+
this.ariaLabel = input(/* @ts-ignore */
|
|
38
|
+
...(ngDevMode ? [undefined, { debugName: "ariaLabel" }] : /* istanbul ignore next */ []));
|
|
30
39
|
/** Whether the object number is interactive */
|
|
31
|
-
this.interactive = input(false, { ...(ngDevMode ? { debugName: "interactive" } : {}), transform: booleanAttribute });
|
|
40
|
+
this.interactive = input(false, { ...(ngDevMode ? { debugName: "interactive" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
32
41
|
/** Whether the object number is inverted. */
|
|
33
|
-
this.inverted = input(false, { ...(ngDevMode ? { debugName: "inverted" } : {}), transform: booleanAttribute });
|
|
42
|
+
this.inverted = input(false, { ...(ngDevMode ? { debugName: "inverted" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
34
43
|
/** @hidden */
|
|
35
44
|
this.elementRef = inject(ElementRef);
|
|
36
45
|
/** @hidden Computed number pipe configuration */
|
|
37
|
-
this._numberPipeConfig = computed(() => `0.${this.decimal()}-${this.decimal()}`,
|
|
46
|
+
this._numberPipeConfig = computed(() => `0.${this.decimal()}-${this.decimal()}`, /* @ts-ignore */
|
|
47
|
+
...(ngDevMode ? [{ debugName: "_numberPipeConfig" }] : /* istanbul ignore next */ []));
|
|
38
48
|
/** @hidden Status key to translate for screen readers */
|
|
39
49
|
this.statusKey = computed(() => {
|
|
40
50
|
const status = this.status();
|
|
@@ -42,7 +52,8 @@ class ObjectNumberComponent {
|
|
|
42
52
|
return `coreObjectNumber.${status}`;
|
|
43
53
|
}
|
|
44
54
|
return null;
|
|
45
|
-
},
|
|
55
|
+
}, /* @ts-ignore */
|
|
56
|
+
...(ngDevMode ? [{ debugName: "statusKey" }] : /* istanbul ignore next */ []));
|
|
46
57
|
/** @hidden Computed CSS classes */
|
|
47
58
|
this._cssClass = computed(() => [
|
|
48
59
|
'fd-object-number',
|
|
@@ -52,7 +63,8 @@ class ObjectNumberComponent {
|
|
|
52
63
|
this.status() ? `fd-object-number--${this.status()}` : ''
|
|
53
64
|
]
|
|
54
65
|
.filter(Boolean)
|
|
55
|
-
.join(' '),
|
|
66
|
+
.join(' '), /* @ts-ignore */
|
|
67
|
+
...(ngDevMode ? [{ debugName: "_cssClass" }] : /* istanbul ignore next */ []));
|
|
56
68
|
}
|
|
57
69
|
/**
|
|
58
70
|
* Type guard to check if the status is a valid ObjectStatus
|
|
@@ -61,10 +73,10 @@ class ObjectNumberComponent {
|
|
|
61
73
|
isValidObjectStatus(status) {
|
|
62
74
|
return status === 'negative' || status === 'critical' || status === 'positive' || status === 'informative';
|
|
63
75
|
}
|
|
64
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
65
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: ObjectNumberComponent, isStandalone: true, selector: "fd-object-number", inputs: { number: { classPropertyName: "number", publicName: "number", isSignal: true, isRequired: false, transformFunction: null }, decimal: { classPropertyName: "decimal", publicName: "decimal", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, emphasized: { classPropertyName: "emphasized", publicName: "emphasized", isSignal: true, isRequired: false, transformFunction: null }, large: { classPropertyName: "large", publicName: "large", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, statusMessage: { classPropertyName: "statusMessage", publicName: "statusMessage", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, inverted: { classPropertyName: "inverted", publicName: "inverted", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-labelledby": "ariaLabelledBy()", "attr.aria-label": "ariaLabel()", "attr.tabindex": "interactive() ? 0 : null", "attr.role": "interactive() ? \"button\" : null", "class": "_cssClass()" } }, ngImport: i0, template: "<span class=\"fd-object-number__text\" [class.fd-object-number__text--bold]=\"!large() && emphasized()\">\n {{ number() | number: (decimal() ? _numberPipeConfig() : '1.0-0') }}\n</span>\n<span class=\"fd-object-number__unit\">{{ unit() }}</span>\n@if (emphasized()) {\n <span class=\"fd-object-number__sr-only\">{{ ('coreObjectNumber.emphasized' | fdTranslate)() }}</span>\n}\n@if (status()) {\n @if (statusMessage()) {\n <span class=\"fd-object-number__sr-only\">{{ statusMessage() }}</span>\n } @else {\n <span class=\"fd-object-number__sr-only\">{{ (statusKey() | fdTranslate)() }}</span>\n }\n}\n", styles: ["@charset \"UTF-8\";.fd-object-number{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;max-width:100%;position:relative;display:inline-block;vertical-align:middle;padding:var(--fdObjectNumber_Padding, 0);border:var(--fdObjectNumber_Border, none);cursor:var(--fdObjectNumber_Cursor, auto);min-height:var(--fdObjectNumber_Min_Height, 1rem);background:var(--fdObjectNumber_Background, none);line-height:var(--fdObjectNumber_Line_Height, 1rem);border-radius:var(--fdObjectNumber_Border_Radius, 0);color:var(--fdObjectNumber_Color, var(--sapNeutralTextColor));font-size:var(--fdObjectNumber_Font_Size, var(--sapFontSize));font-family:var(--fdObjectNumber_Font_Family, var(--sapFontFamily))}.fd-object-number:before,.fd-object-number:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-object-number__text,.fd-object-number__unit{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:inherit;max-width:100%;font-size:inherit;min-height:inherit;line-height:inherit;font-family:inherit;display:inline-block;vertical-align:middle;-webkit-text-decoration:var(--fdObjectNumber_Text_Decoration, none);text-decoration:var(--fdObjectNumber_Text_Decoration, none);text-shadow:var(--fdObjectNumber_Text_Shadow, var(--sapContent_TextShadow))}.fd-object-number__text:before,.fd-object-number__text:after,.fd-object-number__unit:before,.fd-object-number__unit:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-object-number__text{font-weight:var(--fdObjectNumber_Text_Font_Weight, normal)}.fd-object-number__text:after{content:\"\\a0\"}.fd-object-number__text--bold{--fdObjectNumber_Text_Font_Weight: bold}.fd-object-number__unit{font-family:var(--sapFontLightFamily)}.fd-object-number__sr-only{position:absolute;clip:rect(0 0 0 0);height:1px;width:1px;border:0;margin-inline:-1px;margin-block:-1px;padding-inline:0;padding-block:0;overflow:hidden;white-space:nowrap}.fd-object-number--positive{--fdObjectNumber_Color: var(--sapPositiveTextColor)}.fd-object-number--critical{--fdObjectNumber_Color: var(--sapCriticalTextColor)}.fd-object-number--negative{--fdObjectNumber_Color: var(--sapNegativeTextColor)}.fd-object-number--informative{--fdObjectNumber_Color: var(--sapInformativeTextColor)}.fd-object-number--large{--fdObjectNumber_Min_Height: 2rem;--fdObjectNumber_Line_Height: 2rem;--fdObjectNumber_Font_Size: 1.5rem;--fdObjectNumber_Font_Family: var(--sapFontLightFamily)}.fd-object-number--inverted{--fdObjectNumber_Text_Shadow: none;--fdObjectNumber_Line_Height: 1rem;--fdObjectNumber_Padding: .1875rem .25rem;--fdObjectNumber_Color: var(--sapTextColor);--fdObjectNumber_Font_Size: var(--sapFontSmallSize);--fdObjectNumber_Font_Family: var(--sapFontBoldFamily);--fdObjectNumber_Background: var(--sapNeutralBackground);--fdObjectNumber_Border_Radius: var(--sapButton_BorderCornerRadius);--fdObjectNumber_Border: .0625rem solid var(--fdObjectNumber_Border_Color, var(--sapNeutralBorderColor))}.fd-object-number--inverted.fd-object-number--interactive{--fdObjectNumber_Text_Decoration: none}.fd-object-number--inverted.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Neutral_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Neutral_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Neutral_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Active_TextColor);--fdObjectNumber_Background: var(--sapButton_Neutral_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Neutral_Active_BorderColor)}.fd-object-number--inverted.fd-object-number--interactive:focus,.fd-object-number--inverted.fd-object-number--interactive.is-focus{z-index:5;outline:none}.fd-object-number--inverted.fd-object-number--interactive:focus:focus,.fd-object-number--inverted.fd-object-number--interactive:focus.is-focus,.fd-object-number--inverted.fd-object-number--interactive.is-focus:focus,.fd-object-number--inverted.fd-object-number--interactive.is-focus.is-focus{outline:none}.fd-object-number--inverted.fd-object-number--interactive:focus:focus:after,.fd-object-number--inverted.fd-object-number--interactive:focus.is-focus:after,.fd-object-number--inverted.fd-object-number--interactive.is-focus:focus:after,.fd-object-number--inverted.fd-object-number--interactive.is-focus.is-focus:after{border-width:var(--sapContent_FocusWidth);border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-radius:var(--sapButton_BorderCornerRadius);content:\"\";position:absolute;pointer-events:none;inset:-.125rem}.fd-object-number--inverted.fd-object-number--positive{--fdObjectNumber_Color: var(--sapButton_Success_TextColor);--fdObjectNumber_Background: var(--sapButton_Success_Background);--fdObjectNumber_Border_Color: var(--sapButton_Success_BorderColor)}.fd-object-number--inverted.fd-object-number--positive.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--positive.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Success_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Success_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Success_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--positive.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--positive.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Accept_Selected_TextColor);--fdObjectNumber_Background: var(--sapButton_Success_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Success_Active_BorderColor)}.fd-object-number--inverted.fd-object-number--critical{--fdObjectNumber_Color: var(--sapButton_Critical_TextColor);--fdObjectNumber_Background: var(--sapButton_Critical_Background);--fdObjectNumber_Border_Color: var(--sapButton_Critical_BorderColor)}.fd-object-number--inverted.fd-object-number--critical.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--critical.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Critical_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Critical_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Critical_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--critical.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--critical.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Attention_Selected_TextColor);--fdObjectNumber_Background: var(--sapButton_Critical_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Critical_Active_BorderColor)}.fd-object-number--inverted.fd-object-number--negative{--fdObjectNumber_Color: var(--sapButton_Negative_TextColor);--fdObjectNumber_Background: var(--sapButton_Negative_Background);--fdObjectNumber_Border_Color: var(--sapButton_Negative_BorderColor)}.fd-object-number--inverted.fd-object-number--negative.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--negative.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Negative_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Negative_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Negative_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--negative.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--negative.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Reject_Selected_TextColor);--fdObjectNumber_Background: var(--sapButton_Negative_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Negative_Active_BorderColor)}.fd-object-number--inverted.fd-object-number--informative{--fdObjectNumber_Color: var(--sapButton_Information_TextColor);--fdObjectNumber_Background: var(--sapButton_Information_Background);--fdObjectNumber_Border_Color: var(--sapButton_Information_BorderColor)}.fd-object-number--inverted.fd-object-number--informative.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--informative.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Information_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Information_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Information_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--informative.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--informative.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Selected_TextColor);--fdObjectNumber_Background: var(--sapButton_Information_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Information_Active_BorderColor)}.fd-object-number--interactive{--fdObjectNumber_Cursor: pointer;--fdObjectNumber_Text_Decoration: underline}.fd-object-number--interactive:hover,.fd-object-number--interactive.is-hover{--fdObjectNumber_Text_Decoration: none}.fd-object-number--interactive:focus,.fd-object-number--interactive.is-focus{z-index:5;outline:none}.fd-object-number--interactive:focus:focus,.fd-object-number--interactive:focus.is-focus,.fd-object-number--interactive.is-focus:focus,.fd-object-number--interactive.is-focus.is-focus{outline:none}.fd-object-number--interactive:focus:focus:after,.fd-object-number--interactive:focus.is-focus:after,.fd-object-number--interactive.is-focus:focus:after,.fd-object-number--interactive.is-focus.is-focus:after{border-width:var(--sapContent_FocusWidth);border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-radius:.25rem;content:\"\";position:absolute;pointer-events:none;inset:-.1875rem}\n"], dependencies: [{ kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
76
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectNumberComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
77
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: ObjectNumberComponent, isStandalone: true, selector: "fd-object-number", inputs: { number: { classPropertyName: "number", publicName: "number", isSignal: true, isRequired: false, transformFunction: null }, decimal: { classPropertyName: "decimal", publicName: "decimal", isSignal: true, isRequired: false, transformFunction: null }, unit: { classPropertyName: "unit", publicName: "unit", isSignal: true, isRequired: false, transformFunction: null }, emphasized: { classPropertyName: "emphasized", publicName: "emphasized", isSignal: true, isRequired: false, transformFunction: null }, large: { classPropertyName: "large", publicName: "large", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, statusMessage: { classPropertyName: "statusMessage", publicName: "statusMessage", isSignal: true, isRequired: false, transformFunction: null }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, interactive: { classPropertyName: "interactive", publicName: "interactive", isSignal: true, isRequired: false, transformFunction: null }, inverted: { classPropertyName: "inverted", publicName: "inverted", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.aria-labelledby": "ariaLabelledBy()", "attr.aria-label": "ariaLabel()", "attr.tabindex": "interactive() ? 0 : null", "attr.role": "interactive() ? \"button\" : null", "class": "_cssClass()" } }, ngImport: i0, template: "<span class=\"fd-object-number__text\" [class.fd-object-number__text--bold]=\"!large() && emphasized()\">\n {{ number() | number: (decimal() ? _numberPipeConfig() : '1.0-0') }}\n</span>\n<span class=\"fd-object-number__unit\">{{ unit() }}</span>\n@if (emphasized()) {\n <span class=\"fd-object-number__sr-only\">{{ ('coreObjectNumber.emphasized' | fdTranslate)() }}</span>\n}\n@if (status()) {\n @if (statusMessage()) {\n <span class=\"fd-object-number__sr-only\">{{ statusMessage() }}</span>\n } @else {\n <span class=\"fd-object-number__sr-only\">{{ (statusKey() | fdTranslate)() }}</span>\n }\n}\n", styles: ["@charset \"UTF-8\";.fd-object-number{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;max-width:100%;position:relative;display:inline-block;vertical-align:middle;padding:var(--fdObjectNumber_Padding, 0);border:var(--fdObjectNumber_Border, none);cursor:var(--fdObjectNumber_Cursor, auto);min-height:var(--fdObjectNumber_Min_Height, 1rem);background:var(--fdObjectNumber_Background, none);line-height:var(--fdObjectNumber_Line_Height, 1rem);border-radius:var(--fdObjectNumber_Border_Radius, 0);color:var(--fdObjectNumber_Color, var(--sapNeutralTextColor));font-size:var(--fdObjectNumber_Font_Size, var(--sapFontSize));font-family:var(--fdObjectNumber_Font_Family, var(--sapFontFamily))}.fd-object-number:before,.fd-object-number:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-object-number__text,.fd-object-number__unit{font-size:var(--sapFontSize);line-height:normal;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-weight:400;-webkit-box-sizing:border-box;box-sizing:border-box;forced-color-adjust:none;padding-inline:0;padding-block:0;margin-inline:0;margin-block:0;border:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:inherit;max-width:100%;font-size:inherit;min-height:inherit;line-height:inherit;font-family:inherit;display:inline-block;vertical-align:middle;-webkit-text-decoration:var(--fdObjectNumber_Text_Decoration, none);text-decoration:var(--fdObjectNumber_Text_Decoration, none);text-shadow:var(--fdObjectNumber_Text_Shadow, var(--sapContent_TextShadow))}.fd-object-number__text:before,.fd-object-number__text:after,.fd-object-number__unit:before,.fd-object-number__unit:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-object-number__text{font-weight:var(--fdObjectNumber_Text_Font_Weight, normal)}.fd-object-number__text:after{content:\"\\a0\"}.fd-object-number__text--bold{--fdObjectNumber_Text_Font_Weight: bold}.fd-object-number__unit{font-family:var(--sapFontLightFamily)}.fd-object-number__sr-only{position:absolute;clip:rect(0 0 0 0);height:1px;width:1px;border:0;margin-inline:-1px;margin-block:-1px;padding-inline:0;padding-block:0;overflow:hidden;white-space:nowrap}.fd-object-number--positive{--fdObjectNumber_Color: var(--sapPositiveTextColor)}.fd-object-number--critical{--fdObjectNumber_Color: var(--sapCriticalTextColor)}.fd-object-number--negative{--fdObjectNumber_Color: var(--sapNegativeTextColor)}.fd-object-number--informative{--fdObjectNumber_Color: var(--sapInformativeTextColor)}.fd-object-number--large{--fdObjectNumber_Min_Height: 2rem;--fdObjectNumber_Line_Height: 2rem;--fdObjectNumber_Font_Size: 1.5rem;--fdObjectNumber_Font_Family: var(--sapFontLightFamily)}.fd-object-number--inverted{--fdObjectNumber_Text_Shadow: none;--fdObjectNumber_Line_Height: 1rem;--fdObjectNumber_Padding: .1875rem .25rem;--fdObjectNumber_Color: var(--sapTextColor);--fdObjectNumber_Font_Size: var(--sapFontSmallSize);--fdObjectNumber_Font_Family: var(--sapFontBoldFamily);--fdObjectNumber_Background: var(--sapNeutralBackground);--fdObjectNumber_Border_Radius: var(--sapButton_BorderCornerRadius);--fdObjectNumber_Border: .0625rem solid var(--fdObjectNumber_Border_Color, var(--sapNeutralBorderColor))}.fd-object-number--inverted.fd-object-number--interactive{--fdObjectNumber_Text_Decoration: none}.fd-object-number--inverted.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Neutral_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Neutral_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Neutral_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Active_TextColor);--fdObjectNumber_Background: var(--sapButton_Neutral_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Neutral_Active_BorderColor)}.fd-object-number--inverted.fd-object-number--interactive:focus,.fd-object-number--inverted.fd-object-number--interactive.is-focus{z-index:5;outline:none}.fd-object-number--inverted.fd-object-number--interactive:focus:focus,.fd-object-number--inverted.fd-object-number--interactive:focus.is-focus,.fd-object-number--inverted.fd-object-number--interactive.is-focus:focus,.fd-object-number--inverted.fd-object-number--interactive.is-focus.is-focus{outline:none}.fd-object-number--inverted.fd-object-number--interactive:focus:focus:after,.fd-object-number--inverted.fd-object-number--interactive:focus.is-focus:after,.fd-object-number--inverted.fd-object-number--interactive.is-focus:focus:after,.fd-object-number--inverted.fd-object-number--interactive.is-focus.is-focus:after{border-width:var(--sapContent_FocusWidth);border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-radius:var(--sapButton_BorderCornerRadius);content:\"\";position:absolute;pointer-events:none;inset:-.125rem}.fd-object-number--inverted.fd-object-number--positive{--fdObjectNumber_Color: var(--sapButton_Success_TextColor);--fdObjectNumber_Background: var(--sapButton_Success_Background);--fdObjectNumber_Border_Color: var(--sapButton_Success_BorderColor)}.fd-object-number--inverted.fd-object-number--positive.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--positive.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Success_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Success_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Success_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--positive.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--positive.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Accept_Selected_TextColor);--fdObjectNumber_Background: var(--sapButton_Success_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Success_Active_BorderColor)}.fd-object-number--inverted.fd-object-number--critical{--fdObjectNumber_Color: var(--sapButton_Critical_TextColor);--fdObjectNumber_Background: var(--sapButton_Critical_Background);--fdObjectNumber_Border_Color: var(--sapButton_Critical_BorderColor)}.fd-object-number--inverted.fd-object-number--critical.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--critical.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Critical_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Critical_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Critical_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--critical.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--critical.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Attention_Selected_TextColor);--fdObjectNumber_Background: var(--sapButton_Critical_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Critical_Active_BorderColor)}.fd-object-number--inverted.fd-object-number--negative{--fdObjectNumber_Color: var(--sapButton_Negative_TextColor);--fdObjectNumber_Background: var(--sapButton_Negative_Background);--fdObjectNumber_Border_Color: var(--sapButton_Negative_BorderColor)}.fd-object-number--inverted.fd-object-number--negative.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--negative.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Negative_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Negative_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Negative_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--negative.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--negative.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Reject_Selected_TextColor);--fdObjectNumber_Background: var(--sapButton_Negative_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Negative_Active_BorderColor)}.fd-object-number--inverted.fd-object-number--informative{--fdObjectNumber_Color: var(--sapButton_Information_TextColor);--fdObjectNumber_Background: var(--sapButton_Information_Background);--fdObjectNumber_Border_Color: var(--sapButton_Information_BorderColor)}.fd-object-number--inverted.fd-object-number--informative.fd-object-number--interactive:hover,.fd-object-number--inverted.fd-object-number--informative.fd-object-number--interactive.is-hover{--fdObjectNumber_Color: var(--sapButton_Information_Hover_TextColor);--fdObjectNumber_Background: var(--sapButton_Information_Hover_Background);--fdObjectNumber_Border_Color: var(--sapButton_Information_Hover_BorderColor)}.fd-object-number--inverted.fd-object-number--informative.fd-object-number--interactive:active,.fd-object-number--inverted.fd-object-number--informative.fd-object-number--interactive.is-active{--fdObjectNumber_Color: var(--sapButton_Selected_TextColor);--fdObjectNumber_Background: var(--sapButton_Information_Active_Background);--fdObjectNumber_Border_Color: var(--sapButton_Information_Active_BorderColor)}.fd-object-number--interactive{--fdObjectNumber_Cursor: pointer;--fdObjectNumber_Text_Decoration: underline}.fd-object-number--interactive:hover,.fd-object-number--interactive.is-hover{--fdObjectNumber_Text_Decoration: none}.fd-object-number--interactive:focus,.fd-object-number--interactive.is-focus{z-index:5;outline:none}.fd-object-number--interactive:focus:focus,.fd-object-number--interactive:focus.is-focus,.fd-object-number--interactive.is-focus:focus,.fd-object-number--interactive.is-focus.is-focus{outline:none}.fd-object-number--interactive:focus:focus:after,.fd-object-number--interactive:focus.is-focus:after,.fd-object-number--interactive.is-focus:focus:after,.fd-object-number--interactive.is-focus.is-focus:after{border-width:var(--sapContent_FocusWidth);border-color:var(--sapContent_FocusColor);border-style:var(--sapContent_FocusStyle);border-radius:.25rem;content:\"\";position:absolute;pointer-events:none;inset:-.1875rem}\n"], dependencies: [{ kind: "pipe", type: DecimalPipe, name: "number" }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
66
78
|
}
|
|
67
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
79
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectNumberComponent, decorators: [{
|
|
68
80
|
type: Component,
|
|
69
81
|
args: [{ selector: 'fd-object-number', host: {
|
|
70
82
|
'[attr.aria-labelledby]': 'ariaLabelledBy()',
|
|
@@ -80,11 +92,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
80
92
|
* Use direct import of `ObjectNumberComponent`
|
|
81
93
|
*/
|
|
82
94
|
class ObjectNumberModule {
|
|
83
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
84
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
85
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
95
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectNumberModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
96
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.5", ngImport: i0, type: ObjectNumberModule, imports: [ObjectNumberComponent], exports: [ObjectNumberComponent] }); }
|
|
97
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectNumberModule }); }
|
|
86
98
|
}
|
|
87
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
99
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: ObjectNumberModule, decorators: [{
|
|
88
100
|
type: NgModule,
|
|
89
101
|
args: [{
|
|
90
102
|
imports: [ObjectNumberComponent],
|