@fundamental-ngx/core 0.59.1-rc.9 → 0.59.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (131) hide show
  1. package/fesm2022/fundamental-ngx-core-avatar-group-legacy.mjs +33 -50
  2. package/fesm2022/fundamental-ngx-core-avatar-group-legacy.mjs.map +1 -1
  3. package/fesm2022/fundamental-ngx-core-avatar-group.mjs +9 -11
  4. package/fesm2022/fundamental-ngx-core-avatar-group.mjs.map +1 -1
  5. package/fesm2022/fundamental-ngx-core-avatar.mjs +206 -293
  6. package/fesm2022/fundamental-ngx-core-avatar.mjs.map +1 -1
  7. package/fesm2022/fundamental-ngx-core-breadcrumb.mjs +25 -12
  8. package/fesm2022/fundamental-ngx-core-breadcrumb.mjs.map +1 -1
  9. package/fesm2022/fundamental-ngx-core-calendar.mjs +11 -14
  10. package/fesm2022/fundamental-ngx-core-calendar.mjs.map +1 -1
  11. package/fesm2022/fundamental-ngx-core-card.mjs +13 -26
  12. package/fesm2022/fundamental-ngx-core-card.mjs.map +1 -1
  13. package/fesm2022/fundamental-ngx-core-carousel.mjs +11 -11
  14. package/fesm2022/fundamental-ngx-core-carousel.mjs.map +1 -1
  15. package/fesm2022/fundamental-ngx-core-combobox.mjs +33 -7
  16. package/fesm2022/fundamental-ngx-core-combobox.mjs.map +1 -1
  17. package/fesm2022/fundamental-ngx-core-dialog.mjs +13 -17
  18. package/fesm2022/fundamental-ngx-core-dialog.mjs.map +1 -1
  19. package/fesm2022/fundamental-ngx-core-dynamic-page.mjs +32 -24
  20. package/fesm2022/fundamental-ngx-core-dynamic-page.mjs.map +1 -1
  21. package/fesm2022/fundamental-ngx-core-fixed-card-layout.mjs +28 -30
  22. package/fesm2022/fundamental-ngx-core-fixed-card-layout.mjs.map +1 -1
  23. package/fesm2022/fundamental-ngx-core-grid-list.mjs +12 -10
  24. package/fesm2022/fundamental-ngx-core-grid-list.mjs.map +1 -1
  25. package/fesm2022/fundamental-ngx-core-illustrated-message.mjs +202 -100
  26. package/fesm2022/fundamental-ngx-core-illustrated-message.mjs.map +1 -1
  27. package/fesm2022/fundamental-ngx-core-layout-panel.mjs +72 -231
  28. package/fesm2022/fundamental-ngx-core-layout-panel.mjs.map +1 -1
  29. package/fesm2022/fundamental-ngx-core-list.mjs +12 -12
  30. package/fesm2022/fundamental-ngx-core-list.mjs.map +1 -1
  31. package/fesm2022/fundamental-ngx-core-menu.mjs +28 -28
  32. package/fesm2022/fundamental-ngx-core-menu.mjs.map +1 -1
  33. package/fesm2022/fundamental-ngx-core-message-strip.mjs +85 -84
  34. package/fesm2022/fundamental-ngx-core-message-strip.mjs.map +1 -1
  35. package/fesm2022/fundamental-ngx-core-micro-process-flow.mjs +21 -24
  36. package/fesm2022/fundamental-ngx-core-micro-process-flow.mjs.map +1 -1
  37. package/fesm2022/fundamental-ngx-core-multi-combobox.mjs +19 -12
  38. package/fesm2022/fundamental-ngx-core-multi-combobox.mjs.map +1 -1
  39. package/fesm2022/fundamental-ngx-core-multi-input.mjs +46 -39
  40. package/fesm2022/fundamental-ngx-core-multi-input.mjs.map +1 -1
  41. package/fesm2022/fundamental-ngx-core-nested-list.mjs +66 -103
  42. package/fesm2022/fundamental-ngx-core-nested-list.mjs.map +1 -1
  43. package/fesm2022/fundamental-ngx-core-notification.mjs +10 -12
  44. package/fesm2022/fundamental-ngx-core-notification.mjs.map +1 -1
  45. package/fesm2022/fundamental-ngx-core-object-marker.mjs +69 -59
  46. package/fesm2022/fundamental-ngx-core-object-marker.mjs.map +1 -1
  47. package/fesm2022/fundamental-ngx-core-object-status.mjs +92 -118
  48. package/fesm2022/fundamental-ngx-core-object-status.mjs.map +1 -1
  49. package/fesm2022/fundamental-ngx-core-overflow-layout.mjs +27 -29
  50. package/fesm2022/fundamental-ngx-core-overflow-layout.mjs.map +1 -1
  51. package/fesm2022/fundamental-ngx-core-pagination.mjs +17 -18
  52. package/fesm2022/fundamental-ngx-core-pagination.mjs.map +1 -1
  53. package/fesm2022/fundamental-ngx-core-panel.mjs +7 -9
  54. package/fesm2022/fundamental-ngx-core-panel.mjs.map +1 -1
  55. package/fesm2022/fundamental-ngx-core-popover.mjs +10 -15
  56. package/fesm2022/fundamental-ngx-core-popover.mjs.map +1 -1
  57. package/fesm2022/fundamental-ngx-core-product-switch.mjs +12 -15
  58. package/fesm2022/fundamental-ngx-core-product-switch.mjs.map +1 -1
  59. package/fesm2022/fundamental-ngx-core-resizable-card-layout.mjs +18 -20
  60. package/fesm2022/fundamental-ngx-core-resizable-card-layout.mjs.map +1 -1
  61. package/fesm2022/fundamental-ngx-core-segmented-button.mjs +8 -11
  62. package/fesm2022/fundamental-ngx-core-segmented-button.mjs.map +1 -1
  63. package/fesm2022/fundamental-ngx-core-select.mjs +6 -8
  64. package/fesm2022/fundamental-ngx-core-select.mjs.map +1 -1
  65. package/fesm2022/fundamental-ngx-core-settings.mjs +9 -12
  66. package/fesm2022/fundamental-ngx-core-settings.mjs.map +1 -1
  67. package/fesm2022/fundamental-ngx-core-shellbar.mjs +48 -34
  68. package/fesm2022/fundamental-ngx-core-shellbar.mjs.map +1 -1
  69. package/fesm2022/fundamental-ngx-core-slider.mjs +30 -31
  70. package/fesm2022/fundamental-ngx-core-slider.mjs.map +1 -1
  71. package/fesm2022/fundamental-ngx-core-status-indicator.mjs +137 -131
  72. package/fesm2022/fundamental-ngx-core-status-indicator.mjs.map +1 -1
  73. package/fesm2022/fundamental-ngx-core-tabs.mjs +21 -17
  74. package/fesm2022/fundamental-ngx-core-tabs.mjs.map +1 -1
  75. package/fesm2022/fundamental-ngx-core-tile.mjs +375 -631
  76. package/fesm2022/fundamental-ngx-core-tile.mjs.map +1 -1
  77. package/fesm2022/fundamental-ngx-core-time.mjs +7 -9
  78. package/fesm2022/fundamental-ngx-core-time.mjs.map +1 -1
  79. package/fesm2022/fundamental-ngx-core-token.mjs +11 -13
  80. package/fesm2022/fundamental-ngx-core-token.mjs.map +1 -1
  81. package/fesm2022/fundamental-ngx-core-toolbar.mjs +2 -2
  82. package/fesm2022/fundamental-ngx-core-toolbar.mjs.map +1 -1
  83. package/fesm2022/fundamental-ngx-core-tree.mjs +2 -2
  84. package/fesm2022/fundamental-ngx-core-tree.mjs.map +1 -1
  85. package/fesm2022/fundamental-ngx-core-user-menu.mjs +63 -21
  86. package/fesm2022/fundamental-ngx-core-user-menu.mjs.map +1 -1
  87. package/fesm2022/fundamental-ngx-core-wizard.mjs +1 -1
  88. package/fesm2022/fundamental-ngx-core-wizard.mjs.map +1 -1
  89. package/package.json +4 -4
  90. package/types/fundamental-ngx-core-avatar-group-legacy.d.ts +15 -17
  91. package/types/fundamental-ngx-core-avatar-group.d.ts +1 -1
  92. package/types/fundamental-ngx-core-avatar.d.ts +66 -86
  93. package/types/fundamental-ngx-core-breadcrumb.d.ts +13 -5
  94. package/types/fundamental-ngx-core-calendar.d.ts +3 -4
  95. package/types/fundamental-ngx-core-card.d.ts +4 -11
  96. package/types/fundamental-ngx-core-carousel.d.ts +3 -3
  97. package/types/fundamental-ngx-core-combobox.d.ts +8 -1
  98. package/types/fundamental-ngx-core-dialog.d.ts +2 -4
  99. package/types/fundamental-ngx-core-dynamic-page.d.ts +0 -6
  100. package/types/fundamental-ngx-core-fixed-card-layout.d.ts +7 -7
  101. package/types/fundamental-ngx-core-grid-list.d.ts +6 -4
  102. package/types/fundamental-ngx-core-illustrated-message.d.ts +165 -31
  103. package/types/fundamental-ngx-core-layout-panel.d.ts +19 -131
  104. package/types/fundamental-ngx-core-list.d.ts +8 -6
  105. package/types/fundamental-ngx-core-menu.d.ts +16 -13
  106. package/types/fundamental-ngx-core-message-strip.d.ts +5 -2
  107. package/types/fundamental-ngx-core-micro-process-flow.d.ts +8 -6
  108. package/types/fundamental-ngx-core-multi-combobox.d.ts +8 -5
  109. package/types/fundamental-ngx-core-multi-input.d.ts +24 -16
  110. package/types/fundamental-ngx-core-nested-list.d.ts +19 -33
  111. package/types/fundamental-ngx-core-notification.d.ts +2 -2
  112. package/types/fundamental-ngx-core-object-marker.d.ts +47 -27
  113. package/types/fundamental-ngx-core-object-status.d.ts +49 -48
  114. package/types/fundamental-ngx-core-overflow-layout.d.ts +10 -10
  115. package/types/fundamental-ngx-core-pagination.d.ts +7 -8
  116. package/types/fundamental-ngx-core-panel.d.ts +2 -4
  117. package/types/fundamental-ngx-core-popover.d.ts +7 -5
  118. package/types/fundamental-ngx-core-product-switch.d.ts +5 -4
  119. package/types/fundamental-ngx-core-resizable-card-layout.d.ts +10 -8
  120. package/types/fundamental-ngx-core-segmented-button.d.ts +5 -4
  121. package/types/fundamental-ngx-core-select.d.ts +4 -5
  122. package/types/fundamental-ngx-core-settings.d.ts +7 -10
  123. package/types/fundamental-ngx-core-shellbar.d.ts +23 -14
  124. package/types/fundamental-ngx-core-slider.d.ts +18 -13
  125. package/types/fundamental-ngx-core-status-indicator.d.ts +42 -58
  126. package/types/fundamental-ngx-core-tabs.d.ts +9 -7
  127. package/types/fundamental-ngx-core-tile.d.ts +114 -243
  128. package/types/fundamental-ngx-core-time.d.ts +5 -4
  129. package/types/fundamental-ngx-core-token.d.ts +5 -4
  130. package/types/fundamental-ngx-core-tree.d.ts +1 -1
  131. package/types/fundamental-ngx-core-user-menu.d.ts +25 -21
@@ -1,10 +1,13 @@
1
1
  import * as i0 from '@angular/core';
2
- import { ChangeDetectionStrategy, Component, HostBinding, Directive, Input, ViewEncapsulation, NgModule } from '@angular/core';
3
- import { __decorate, __metadata } from 'tslib';
4
- import * as i1 from '@angular/platform-browser';
5
- import { applyCssClass } from '@fundamental-ngx/cdk/utils';
6
- import { Subscription, fromEvent, debounceTime } from 'rxjs';
2
+ import { ChangeDetectionStrategy, Component, Directive, input, booleanAttribute, inject, ElementRef, signal, computed, afterNextRender, effect, ViewEncapsulation, NgModule } from '@angular/core';
3
+ import { toSignal } from '@angular/core/rxjs-interop';
4
+ import { DomSanitizer } from '@angular/platform-browser';
5
+ import { fromEvent, debounceTime } from 'rxjs';
7
6
 
7
+ /**
8
+ * Component representing the actions section of an illustrated message.
9
+ * Typically contains buttons or links for user actions.
10
+ */
8
11
  class IllustratedMessageActionsComponent {
9
12
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
10
13
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageActionsComponent, isStandalone: true, selector: "fd-illustrated-message-actions", host: { classAttribute: "fd-illustrated-message__actions" }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -17,11 +20,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
17
20
  changeDetection: ChangeDetectionStrategy.OnPush,
18
21
  host: {
19
22
  class: 'fd-illustrated-message__actions'
20
- },
21
- standalone: true
23
+ }
22
24
  }]
23
25
  }] });
24
26
 
27
+ /**
28
+ * Component representing the figcaption section of an illustrated message.
29
+ * Contains title and text content slots.
30
+ */
25
31
  class IllustratedMessageFigcaptionComponent {
26
32
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageFigcaptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
27
33
  static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageFigcaptionComponent, isStandalone: true, selector: "[fd-illustrated-message-figcaption]", host: { classAttribute: "fd-illustrated-message__figcaption" }, ngImport: i0, template: `
@@ -41,53 +47,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
41
47
  changeDetection: ChangeDetectionStrategy.OnPush,
42
48
  host: {
43
49
  class: 'fd-illustrated-message__figcaption'
44
- },
45
- standalone: true
50
+ }
46
51
  }]
47
52
  }] });
48
53
 
54
+ /**
55
+ * Directive for the text/description element within an illustrated message figcaption.
56
+ */
49
57
  class IllustratedMessageTextDirective {
50
- constructor() {
51
- /** @hidden */
52
- this.fdIllustratedMessageTextClass = true;
53
- }
54
58
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageTextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
55
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageTextDirective, isStandalone: true, selector: "[fd-illustrated-message-text]", host: { properties: { "class.fd-illustrated-message__text": "this.fdIllustratedMessageTextClass" } }, ngImport: i0 }); }
59
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageTextDirective, isStandalone: true, selector: "[fd-illustrated-message-text]", host: { classAttribute: "fd-illustrated-message__text" }, ngImport: i0 }); }
56
60
  }
57
61
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageTextDirective, decorators: [{
58
62
  type: Directive,
59
63
  args: [{
60
- // TODO to be discussed
61
64
  // eslint-disable-next-line @angular-eslint/directive-selector
62
65
  selector: '[fd-illustrated-message-text]',
63
- standalone: true
66
+ host: {
67
+ class: 'fd-illustrated-message__text'
68
+ }
64
69
  }]
65
- }], propDecorators: { fdIllustratedMessageTextClass: [{
66
- type: HostBinding,
67
- args: ['class.fd-illustrated-message__text']
68
- }] } });
70
+ }] });
69
71
 
72
+ /**
73
+ * Directive for the title element within an illustrated message figcaption.
74
+ */
70
75
  class IllustratedMessageTitleDirective {
71
- constructor() {
72
- /** @hidden */
73
- this.fdIllustratedMessageTitleClass = true;
74
- }
75
76
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
76
- static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageTitleDirective, isStandalone: true, selector: "[fd-illustrated-message-title]", host: { properties: { "class.fd-illustrated-message__title": "this.fdIllustratedMessageTitleClass" } }, ngImport: i0 }); }
77
+ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.1.0", type: IllustratedMessageTitleDirective, isStandalone: true, selector: "[fd-illustrated-message-title]", host: { classAttribute: "fd-illustrated-message__title" }, ngImport: i0 }); }
77
78
  }
78
79
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageTitleDirective, decorators: [{
79
80
  type: Directive,
80
81
  args: [{
81
- // TODO to be discussed
82
82
  // eslint-disable-next-line @angular-eslint/directive-selector
83
83
  selector: '[fd-illustrated-message-title]',
84
- standalone: true
84
+ host: {
85
+ class: 'fd-illustrated-message__title'
86
+ }
85
87
  }]
86
- }], propDecorators: { fdIllustratedMessageTitleClass: [{
87
- type: HostBinding,
88
- args: ['class.fd-illustrated-message__title']
89
- }] } });
88
+ }] });
90
89
 
90
+ /**
91
+ * Enumeration of illustrated message types with their string values.
92
+ */
91
93
  var IllustratedMessageTypes;
92
94
  (function (IllustratedMessageTypes) {
93
95
  IllustratedMessageTypes["LARGE"] = "large";
@@ -95,60 +97,159 @@ var IllustratedMessageTypes;
95
97
  IllustratedMessageTypes["SMALL"] = "small";
96
98
  IllustratedMessageTypes["EXTRA_SMALL"] = "xsmall";
97
99
  IllustratedMessageTypes["BASE"] = "base";
100
+ /** @deprecated Use LARGE instead */
98
101
  IllustratedMessageTypes["SCENE"] = "scene";
102
+ /** @deprecated Use MEDIUM instead */
99
103
  IllustratedMessageTypes["DIALOG"] = "dialog";
104
+ /** @deprecated Use SMALL instead */
100
105
  IllustratedMessageTypes["SPOT"] = "spot";
106
+ /** @deprecated Use EXTRA_SMALL instead */
101
107
  IllustratedMessageTypes["DOT"] = "dot";
102
108
  })(IllustratedMessageTypes || (IllustratedMessageTypes = {}));
103
109
  let illustratedMessageUniqueId = 0;
110
+ /**
111
+ * Component representing an illustrated message with responsive SVG illustration.
112
+ *
113
+ * The component automatically adjusts its illustration size based on container width:
114
+ * - Large (>= 682px)
115
+ * - Medium (361px - 681px)
116
+ * - Small (261px - 360px)
117
+ * - Extra Small (161px - 260px)
118
+ * - Base (< 161px)
119
+ *
120
+ * Supports both URL-based SVG sprites and inline SVG content.
121
+ *
122
+ * @example
123
+ * ```html
124
+ * <div fd-illustrated-message [svgConfig]="svgConfig">
125
+ * <figcaption fd-illustrated-message-figcaption>
126
+ * <h3>No Data Available</h3>
127
+ * <p>Please check back later</p>
128
+ * </figcaption>
129
+ * </div>
130
+ * ```
131
+ */
104
132
  class IllustratedMessageComponent {
105
- constructor(elementRef, _cdRef, _sanitizer) {
106
- this.elementRef = elementRef;
107
- this._cdRef = _cdRef;
108
- this._sanitizer = _sanitizer;
109
- this.noSvg = false;
110
- this.id = 'fd-illustrated-message-' + illustratedMessageUniqueId++;
111
- this._subscriptions = new Subscription();
112
- }
113
- buildComponentCssClass() {
114
- return [
115
- 'fd-illustrated-message',
116
- this._tempType ? `fd-illustrated-message--${this._tempType}` : '',
117
- this.class || ''
118
- ].filter(Boolean);
119
- }
120
- ngOnChanges(changes) {
121
- if ('svgConfig' in changes) {
122
- this._constructHref();
123
- }
124
- }
125
- ngOnInit() {
126
- const resizeSubscription = fromEvent(window, 'resize')
127
- .pipe(debounceTime(200))
128
- .subscribe(() => this._constructHref());
129
- this._subscriptions.add(resizeSubscription);
130
- }
131
- ngAfterContentChecked() {
132
- this._constructHref();
133
- }
134
- ngOnDestroy() {
135
- this._subscriptions.unsubscribe();
133
+ /** @hidden */
134
+ constructor() {
135
+ /**
136
+ * Explicitly set the illustration type. If not provided, type is determined by container width.
137
+ */
138
+ this.type = input(...(ngDevMode ? [undefined, { debugName: "type" }] : []));
139
+ /**
140
+ * Configuration for SVG illustrations at different sizes.
141
+ */
142
+ this.svgConfig = input(...(ngDevMode ? [undefined, { debugName: "svgConfig" }] : []));
143
+ /**
144
+ * Accessible label for the SVG illustration.
145
+ */
146
+ this.svgAriaLabel = input(null, ...(ngDevMode ? [{ debugName: "svgAriaLabel" }] : []));
147
+ /**
148
+ * When true, hides the SVG illustration entirely.
149
+ */
150
+ this.noSvg = input(false, { ...(ngDevMode ? { debugName: "noSvg" } : {}), transform: booleanAttribute });
151
+ /**
152
+ * Unique identifier for the illustrated message component.
153
+ */
154
+ this.id = input(`fd-illustrated-message-${++illustratedMessageUniqueId}`, ...(ngDevMode ? [{ debugName: "id" }] : []));
155
+ /**
156
+ * Reference to the host element.
157
+ */
158
+ this.elementRef = inject(ElementRef);
159
+ /**
160
+ * Signal tracking container width for responsive behavior.
161
+ * @hidden
162
+ */
163
+ this.containerWidth = signal(0, ...(ngDevMode ? [{ debugName: "containerWidth" }] : []));
164
+ /**
165
+ * Normalized illustration type from explicit input or legacy names.
166
+ * @hidden
167
+ */
168
+ this.normalizedInputType = computed(() => {
169
+ const explicitType = this.type();
170
+ return explicitType ? this._normalizeType(explicitType) : undefined;
171
+ }, ...(ngDevMode ? [{ debugName: "normalizedInputType" }] : []));
172
+ /**
173
+ * Current illustration type based on explicit type or container width.
174
+ * @hidden
175
+ */
176
+ this.currentType = computed(() => this.normalizedInputType() || this._determineTypeByWidth(this.containerWidth()), ...(ngDevMode ? [{ debugName: "currentType" }] : []));
177
+ /**
178
+ * Normalized SVG configuration with legacy keys mapped to modern keys.
179
+ * @hidden
180
+ */
181
+ this.normalizedConfig = computed(() => {
182
+ const config = this.svgConfig();
183
+ return config ? this._normalizeSvgConfig(config) : null;
184
+ }, ...(ngDevMode ? [{ debugName: "normalizedConfig" }] : []));
185
+ /**
186
+ * Inline SVG content for the current type.
187
+ * @hidden
188
+ */
189
+ this.inlineSvg = computed(() => {
190
+ const config = this.normalizedConfig();
191
+ const type = this.currentType();
192
+ const inlineSvg = config?.[type]?.file;
193
+ return inlineSvg ? this._sanitizer.bypassSecurityTrustHtml(inlineSvg) : undefined;
194
+ }, ...(ngDevMode ? [{ debugName: "inlineSvg" }] : []));
195
+ /**
196
+ * SVG href attribute for the current type.
197
+ * @hidden
198
+ */
199
+ this.href = computed(() => {
200
+ const config = this.normalizedConfig();
201
+ if (!config) {
202
+ return '';
203
+ }
204
+ return this._getHrefByType(this.currentType(), config);
205
+ }, ...(ngDevMode ? [{ debugName: "href" }] : []));
206
+ /**
207
+ * Computed CSS class string for the component.
208
+ * @hidden
209
+ */
210
+ this.cssClass = computed(() => {
211
+ const classes = ['fd-illustrated-message'];
212
+ const currentTypeValue = this.currentType();
213
+ if (currentTypeValue && currentTypeValue !== 'base') {
214
+ classes.push(`fd-illustrated-message--${currentTypeValue}`);
215
+ }
216
+ return classes.join(' ');
217
+ }, ...(ngDevMode ? [{ debugName: "cssClass" }] : []));
218
+ /** @hidden */
219
+ this._sanitizer = inject(DomSanitizer);
220
+ // Setup resize listener for responsive behavior with automatic cleanup
221
+ const resize$ = toSignal(fromEvent(window, 'resize').pipe(debounceTime(200)));
222
+ // Measure container width after render
223
+ afterNextRender(() => {
224
+ this._measureContainerWidth();
225
+ });
226
+ // React to resize events and input changes
227
+ effect(() => {
228
+ // Track resize events
229
+ resize$();
230
+ this.type();
231
+ this.svgConfig();
232
+ // Remeasure on changes
233
+ this._measureContainerWidth();
234
+ });
136
235
  }
137
- _constructHref() {
138
- this._inlineSvg = undefined;
139
- const containerWidth = this.elementRef.nativeElement.offsetWidth;
140
- const normalizedType = this._normalizeType(this.type);
141
- this._tempType = this.type ? normalizedType : this._determineIllustratedMessageType(containerWidth);
142
- const normalizedConfig = this._normalizeSvgConfig(this.svgConfig);
143
- const inlineSvg = normalizedConfig?.[this._tempType]?.file;
144
- if (inlineSvg) {
145
- this._inlineSvg = this._sanitizer.bypassSecurityTrustHtml(inlineSvg);
236
+ /**
237
+ * Measures and updates the container width.
238
+ * @private
239
+ */
240
+ _measureContainerWidth() {
241
+ const width = this.elementRef.nativeElement.offsetWidth;
242
+ if (this.containerWidth() !== width) {
243
+ this.containerWidth.set(width);
146
244
  }
147
- this._href = normalizedConfig ? this._getHrefByType(this._tempType, normalizedConfig) : '';
148
- this.buildComponentCssClass();
149
- this._cdRef.markForCheck();
150
245
  }
151
- _determineIllustratedMessageType(width) {
246
+ /**
247
+ * Determines the illustration type based on container width.
248
+ * @param width - Container width in pixels
249
+ * @returns Appropriate illustration type
250
+ * @private
251
+ */
252
+ _determineTypeByWidth(width) {
152
253
  if (width >= 682) {
153
254
  return IllustratedMessageTypes.LARGE;
154
255
  }
@@ -163,6 +264,12 @@ class IllustratedMessageComponent {
163
264
  }
164
265
  return IllustratedMessageTypes.BASE;
165
266
  }
267
+ /**
268
+ * Normalizes legacy type names to modern equivalents.
269
+ * @param type - Illustration type to normalize
270
+ * @returns Normalized illustration type
271
+ * @private
272
+ */
166
273
  _normalizeType(type) {
167
274
  switch (type) {
168
275
  case 'scene':
@@ -177,6 +284,12 @@ class IllustratedMessageComponent {
177
284
  return type;
178
285
  }
179
286
  }
287
+ /**
288
+ * Normalizes SVG configuration, mapping legacy keys to modern keys.
289
+ * @param config - SVG configuration to normalize
290
+ * @returns Normalized SVG configuration
291
+ * @private
292
+ */
180
293
  _normalizeSvgConfig(config) {
181
294
  return {
182
295
  large: config.large || config.scene,
@@ -185,6 +298,13 @@ class IllustratedMessageComponent {
185
298
  xsmall: config.xsmall || config.dot
186
299
  };
187
300
  }
301
+ /**
302
+ * Constructs the SVG href attribute value for the given type.
303
+ * @param type - Illustration type
304
+ * @param svgConfig - Normalized SVG configuration
305
+ * @returns SVG href string
306
+ * @private
307
+ */
188
308
  _getHrefByType(type, svgConfig) {
189
309
  switch (type) {
190
310
  case 'large':
@@ -199,34 +319,16 @@ class IllustratedMessageComponent {
199
319
  return '';
200
320
  }
201
321
  }
202
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
203
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: IllustratedMessageComponent, isStandalone: true, selector: "[fd-illustrated-message]", inputs: { type: "type", svgConfig: "svgConfig", svgAriaLabel: "svgAriaLabel", noSvg: "noSvg", id: "id", class: "class" }, host: { properties: { "attr.id": "this.id" } }, usesOnChanges: true, ngImport: i0, template: "<div class=\"fd-illustrated-message__container\">\n @if (!noSvg) {\n <svg class=\"fd-illustrated-message__illustration\" [attr.aria-label]=\"svgAriaLabel\">\n <use [attr.href]=\"_href\"></use>\n </svg>\n }\n @if (_inlineSvg) {\n <div [style.display]=\"'none'\" [innerHTML]=\"_inlineSvg\"></div>\n }\n <ng-content select=\"[fd-illustrated-message-figcaption]\"></ng-content>\n</div>\n<ng-content select=\"fd-illustrated-message-actions\"></ng-content>\n", styles: [".fd-illustrated-message{--illustratedMessagePadding: 1rem;--illustratedMessageMaxWidth: auto;--actionsMarginInline: 0;--actionsMarginBlock: 1rem;--actionsPaddingInlineStart: 0;--actionsPaddingInlineEnd: 0;--illustrationMinWidth: 15rem;--illustrationMaxWidth: 20rem;--illustrationMinHeight: 11.25rem;--illustrationMaxHeight: 15rem;--illustrationMarginBlock: 2rem;--illustrationMarginInlineStart: 0;--illustrationMarginInlineEnd: 0;--illustrationDisplay: flex;--containerFlexDirection: column;--figcaptionMaxWidth: 61.9375rem;--titleMinWidth: auto;--titleMarginBottom: 1rem;--titleFontSize: var(--sapFontHeader2Size);--textMinWidth: auto;--textMarginBottom: .5rem;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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;text-align:center;max-width:var(--illustratedMessageMaxWidth);padding-block:var(--illustratedMessagePadding);padding-inline:var(--illustratedMessagePadding)}.fd-illustrated-message:before,.fd-illustrated-message:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message-responsive-container{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;min-height:100%;height:100%;container-type:inline-size}.fd-illustrated-message-responsive-container:before,.fd-illustrated-message-responsive-container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__container{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:var(--containerFlexAlignment, center);-ms-flex-align:var(--containerFlexAlignment, center);align-items:var(--containerFlexAlignment, center);-ms-flex-direction:var(--containerFlexDirection);flex-direction:var(--containerFlexDirection)}.fd-illustrated-message__container:before,.fd-illustrated-message__container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__illustration{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;width:auto;height:auto;display:var(--illustrationDisplay);min-width:var(--illustrationMinWidth);min-height:var(--illustrationMinHeight);max-width:var(--illustrationMaxWidth);max-height:var(--illustrationMaxHeight);margin-block:var(--illustrationMarginBlock);margin-inline:var(--illustrationMarginInlineStart) var(--illustrationMarginInlineEnd)}.fd-illustrated-message__illustration:before,.fd-illustrated-message__illustration:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__figcaption{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;max-width:var(--figcaptionMaxWidth)}.fd-illustrated-message__figcaption:before,.fd-illustrated-message__figcaption:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__title{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;width:100%;text-align:center;font-size:var(--titleFontSize);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontHeaderFamily);-webkit-margin-after:var(--titleMarginBottom);margin-block-end:var(--titleMarginBottom)}.fd-illustrated-message__title:before,.fd-illustrated-message__title:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__text{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;text-wrap:wrap;text-align:center;line-height:1.5;-webkit-margin-after:var(--textMarginBottom);margin-block-end:var(--textMarginBottom)}.fd-illustrated-message__text:before,.fd-illustrated-message__text:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__actions{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;margin-block:var(--actionsMarginBlock);margin-inline:var(--actionsMarginInline);padding-inline:var(--actionsPaddingInlineStart) var(--actionsPaddingInlineEnd)}.fd-illustrated-message__actions:before,.fd-illustrated-message__actions:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message--dialog,.fd-illustrated-message--medium{--illustrationMinWidth: 10rem;--illustrationMinHeight: 10rem;--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: 1rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader3Size);--figcaptionMaxWidth: 40.5625rem;--actionsMarginBlock: .5rem 1rem}.fd-illustrated-message--spot,.fd-illustrated-message--small{--illustratedMessagePadding: .5rem;--illustrationMinWidth: 8rem;--illustrationMinHeight: 8rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: 0 .5rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader4Size);--figcaptionMaxWidth: 21.5rem;--actionsMarginBlock: .5rem}.fd-illustrated-message--dot,.fd-illustrated-message--xsmall{--illustratedMessagePadding: .25rem;--illustrationMinWidth: 2.8125rem;--illustrationMaxWidth: 2.8125rem;--illustrationMinHeight: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: 0 .25rem;--illustrationMarginInlineEnd: 0;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto}.fd-illustrated-message--base{--illustratedMessagePadding: .25rem;--illustratedMessageMaxWidth: auto;--illustrationDisplay: none;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto;--actionsPaddingInlineStart: 0}@container (width <= 681px){.fd-illustrated-message{--illustrationMinWidth: 10rem;--illustrationMinHeight: 10rem;--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: 1rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader3Size);--figcaptionMaxWidth: 40.5625rem;--actionsMarginBlock: .5rem 1rem}}@container (width <= 360px){.fd-illustrated-message{--illustratedMessagePadding: .5rem;--illustrationMinWidth: 8rem;--illustrationMinHeight: 8rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: 0 .5rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader4Size);--figcaptionMaxWidth: 21.5rem;--actionsMarginBlock: .5rem}}@container (width <= 260px){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustrationMinWidth: 2.8125rem;--illustrationMaxWidth: 2.8125rem;--illustrationMinHeight: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: 0 .25rem;--illustrationMarginInlineEnd: 0;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto}}@container (width <= 160px){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustratedMessageMaxWidth: auto;--illustrationDisplay: none;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto;--actionsPaddingInlineStart: 0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
322
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
323
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: IllustratedMessageComponent, isStandalone: true, selector: "[fd-illustrated-message]", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, svgConfig: { classPropertyName: "svgConfig", publicName: "svgConfig", isSignal: true, isRequired: false, transformFunction: null }, svgAriaLabel: { classPropertyName: "svgAriaLabel", publicName: "svgAriaLabel", isSignal: true, isRequired: false, transformFunction: null }, noSvg: { classPropertyName: "noSvg", publicName: "noSvg", isSignal: true, isRequired: false, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.id": "id()", "class": "cssClass()" } }, ngImport: i0, template: "<div class=\"fd-illustrated-message__container\">\n @if (!noSvg()) {\n <svg class=\"fd-illustrated-message__illustration\" [attr.aria-label]=\"svgAriaLabel()\">\n <use [attr.href]=\"href()\"></use>\n </svg>\n }\n @if (inlineSvg()) {\n <div [style.display]=\"'none'\" [innerHTML]=\"inlineSvg()\"></div>\n }\n <ng-content select=\"[fd-illustrated-message-figcaption]\"></ng-content>\n</div>\n<ng-content select=\"fd-illustrated-message-actions\"></ng-content>\n", styles: [".fd-illustrated-message{--illustratedMessagePadding: 1rem;--illustratedMessageMaxWidth: auto;--actionsMarginInline: 0;--actionsMarginBlock: 1rem;--actionsPaddingInlineStart: 0;--actionsPaddingInlineEnd: 0;--illustrationMinWidth: 15rem;--illustrationMaxWidth: 20rem;--illustrationMinHeight: 11.25rem;--illustrationMaxHeight: 15rem;--illustrationMarginBlock: 2rem;--illustrationMarginInlineStart: 0;--illustrationMarginInlineEnd: 0;--illustrationDisplay: flex;--containerFlexDirection: column;--figcaptionMaxWidth: 61.9375rem;--titleMinWidth: auto;--titleMarginBottom: 1rem;--titleFontSize: var(--sapFontHeader2Size);--textMinWidth: auto;--textMarginBottom: .5rem;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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;text-align:center;max-width:var(--illustratedMessageMaxWidth);padding-block:var(--illustratedMessagePadding);padding-inline:var(--illustratedMessagePadding)}.fd-illustrated-message:before,.fd-illustrated-message:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message-responsive-container{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;min-height:100%;height:100%;container-type:inline-size}.fd-illustrated-message-responsive-container:before,.fd-illustrated-message-responsive-container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__container{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:var(--containerFlexAlignment, center);-ms-flex-align:var(--containerFlexAlignment, center);align-items:var(--containerFlexAlignment, center);-ms-flex-direction:var(--containerFlexDirection);flex-direction:var(--containerFlexDirection)}.fd-illustrated-message__container:before,.fd-illustrated-message__container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__illustration{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;width:auto;height:auto;display:var(--illustrationDisplay);min-width:var(--illustrationMinWidth);min-height:var(--illustrationMinHeight);max-width:var(--illustrationMaxWidth);max-height:var(--illustrationMaxHeight);margin-block:var(--illustrationMarginBlock);margin-inline:var(--illustrationMarginInlineStart) var(--illustrationMarginInlineEnd)}.fd-illustrated-message__illustration:before,.fd-illustrated-message__illustration:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__figcaption{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;max-width:var(--figcaptionMaxWidth)}.fd-illustrated-message__figcaption:before,.fd-illustrated-message__figcaption:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__title{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;width:100%;text-align:center;font-size:var(--titleFontSize);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontHeaderFamily);-webkit-margin-after:var(--titleMarginBottom);margin-block-end:var(--titleMarginBottom)}.fd-illustrated-message__title:before,.fd-illustrated-message__title:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__text{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;text-wrap:wrap;text-align:center;line-height:1.5;-webkit-margin-after:var(--textMarginBottom);margin-block-end:var(--textMarginBottom)}.fd-illustrated-message__text:before,.fd-illustrated-message__text:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__actions{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;margin-block:var(--actionsMarginBlock);margin-inline:var(--actionsMarginInline);padding-inline:var(--actionsPaddingInlineStart) var(--actionsPaddingInlineEnd)}.fd-illustrated-message__actions:before,.fd-illustrated-message__actions:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message--dialog,.fd-illustrated-message--medium{--illustrationMinWidth: 10rem;--illustrationMinHeight: 10rem;--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: 1rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader3Size);--figcaptionMaxWidth: 40.5625rem;--actionsMarginBlock: .5rem 1rem}.fd-illustrated-message--spot,.fd-illustrated-message--small{--illustratedMessagePadding: .5rem;--illustrationMinWidth: 8rem;--illustrationMinHeight: 8rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: 0 .5rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader4Size);--figcaptionMaxWidth: 21.5rem;--actionsMarginBlock: .5rem}.fd-illustrated-message--dot,.fd-illustrated-message--xsmall{--illustratedMessagePadding: .25rem;--illustrationMinWidth: 2.8125rem;--illustrationMaxWidth: 2.8125rem;--illustrationMinHeight: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: 0 .25rem;--illustrationMarginInlineEnd: 0;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto}.fd-illustrated-message--base{--illustratedMessagePadding: .25rem;--illustratedMessageMaxWidth: auto;--illustrationDisplay: none;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto;--actionsPaddingInlineStart: 0}@container (width <= 681px){.fd-illustrated-message{--illustrationMinWidth: 10rem;--illustrationMinHeight: 10rem;--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: 1rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader3Size);--figcaptionMaxWidth: 40.5625rem;--actionsMarginBlock: .5rem 1rem}}@container (width <= 360px){.fd-illustrated-message{--illustratedMessagePadding: .5rem;--illustrationMinWidth: 8rem;--illustrationMinHeight: 8rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: 0 .5rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader4Size);--figcaptionMaxWidth: 21.5rem;--actionsMarginBlock: .5rem}}@container (width <= 260px){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustrationMinWidth: 2.8125rem;--illustrationMaxWidth: 2.8125rem;--illustrationMinHeight: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: 0 .25rem;--illustrationMarginInlineEnd: 0;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto}}@container (width <= 160px){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustratedMessageMaxWidth: auto;--illustrationDisplay: none;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto;--actionsPaddingInlineStart: 0}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
204
324
  }
205
- __decorate([
206
- applyCssClass,
207
- __metadata("design:type", Function),
208
- __metadata("design:paramtypes", []),
209
- __metadata("design:returntype", Array)
210
- ], IllustratedMessageComponent.prototype, "buildComponentCssClass", null);
211
325
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: IllustratedMessageComponent, decorators: [{
212
326
  type: Component,
213
- args: [{ selector: '[fd-illustrated-message]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [], template: "<div class=\"fd-illustrated-message__container\">\n @if (!noSvg) {\n <svg class=\"fd-illustrated-message__illustration\" [attr.aria-label]=\"svgAriaLabel\">\n <use [attr.href]=\"_href\"></use>\n </svg>\n }\n @if (_inlineSvg) {\n <div [style.display]=\"'none'\" [innerHTML]=\"_inlineSvg\"></div>\n }\n <ng-content select=\"[fd-illustrated-message-figcaption]\"></ng-content>\n</div>\n<ng-content select=\"fd-illustrated-message-actions\"></ng-content>\n", styles: [".fd-illustrated-message{--illustratedMessagePadding: 1rem;--illustratedMessageMaxWidth: auto;--actionsMarginInline: 0;--actionsMarginBlock: 1rem;--actionsPaddingInlineStart: 0;--actionsPaddingInlineEnd: 0;--illustrationMinWidth: 15rem;--illustrationMaxWidth: 20rem;--illustrationMinHeight: 11.25rem;--illustrationMaxHeight: 15rem;--illustrationMarginBlock: 2rem;--illustrationMarginInlineStart: 0;--illustrationMarginInlineEnd: 0;--illustrationDisplay: flex;--containerFlexDirection: column;--figcaptionMaxWidth: 61.9375rem;--titleMinWidth: auto;--titleMarginBottom: 1rem;--titleFontSize: var(--sapFontHeader2Size);--textMinWidth: auto;--textMarginBottom: .5rem;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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;text-align:center;max-width:var(--illustratedMessageMaxWidth);padding-block:var(--illustratedMessagePadding);padding-inline:var(--illustratedMessagePadding)}.fd-illustrated-message:before,.fd-illustrated-message:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message-responsive-container{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;min-height:100%;height:100%;container-type:inline-size}.fd-illustrated-message-responsive-container:before,.fd-illustrated-message-responsive-container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__container{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:var(--containerFlexAlignment, center);-ms-flex-align:var(--containerFlexAlignment, center);align-items:var(--containerFlexAlignment, center);-ms-flex-direction:var(--containerFlexDirection);flex-direction:var(--containerFlexDirection)}.fd-illustrated-message__container:before,.fd-illustrated-message__container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__illustration{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;width:auto;height:auto;display:var(--illustrationDisplay);min-width:var(--illustrationMinWidth);min-height:var(--illustrationMinHeight);max-width:var(--illustrationMaxWidth);max-height:var(--illustrationMaxHeight);margin-block:var(--illustrationMarginBlock);margin-inline:var(--illustrationMarginInlineStart) var(--illustrationMarginInlineEnd)}.fd-illustrated-message__illustration:before,.fd-illustrated-message__illustration:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__figcaption{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;max-width:var(--figcaptionMaxWidth)}.fd-illustrated-message__figcaption:before,.fd-illustrated-message__figcaption:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__title{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;width:100%;text-align:center;font-size:var(--titleFontSize);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontHeaderFamily);-webkit-margin-after:var(--titleMarginBottom);margin-block-end:var(--titleMarginBottom)}.fd-illustrated-message__title:before,.fd-illustrated-message__title:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__text{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;text-wrap:wrap;text-align:center;line-height:1.5;-webkit-margin-after:var(--textMarginBottom);margin-block-end:var(--textMarginBottom)}.fd-illustrated-message__text:before,.fd-illustrated-message__text:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__actions{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;margin-block:var(--actionsMarginBlock);margin-inline:var(--actionsMarginInline);padding-inline:var(--actionsPaddingInlineStart) var(--actionsPaddingInlineEnd)}.fd-illustrated-message__actions:before,.fd-illustrated-message__actions:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message--dialog,.fd-illustrated-message--medium{--illustrationMinWidth: 10rem;--illustrationMinHeight: 10rem;--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: 1rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader3Size);--figcaptionMaxWidth: 40.5625rem;--actionsMarginBlock: .5rem 1rem}.fd-illustrated-message--spot,.fd-illustrated-message--small{--illustratedMessagePadding: .5rem;--illustrationMinWidth: 8rem;--illustrationMinHeight: 8rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: 0 .5rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader4Size);--figcaptionMaxWidth: 21.5rem;--actionsMarginBlock: .5rem}.fd-illustrated-message--dot,.fd-illustrated-message--xsmall{--illustratedMessagePadding: .25rem;--illustrationMinWidth: 2.8125rem;--illustrationMaxWidth: 2.8125rem;--illustrationMinHeight: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: 0 .25rem;--illustrationMarginInlineEnd: 0;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto}.fd-illustrated-message--base{--illustratedMessagePadding: .25rem;--illustratedMessageMaxWidth: auto;--illustrationDisplay: none;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto;--actionsPaddingInlineStart: 0}@container (width <= 681px){.fd-illustrated-message{--illustrationMinWidth: 10rem;--illustrationMinHeight: 10rem;--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: 1rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader3Size);--figcaptionMaxWidth: 40.5625rem;--actionsMarginBlock: .5rem 1rem}}@container (width <= 360px){.fd-illustrated-message{--illustratedMessagePadding: .5rem;--illustrationMinWidth: 8rem;--illustrationMinHeight: 8rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: 0 .5rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader4Size);--figcaptionMaxWidth: 21.5rem;--actionsMarginBlock: .5rem}}@container (width <= 260px){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustrationMinWidth: 2.8125rem;--illustrationMaxWidth: 2.8125rem;--illustrationMinHeight: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: 0 .25rem;--illustrationMarginInlineEnd: 0;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto}}@container (width <= 160px){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustratedMessageMaxWidth: auto;--illustrationDisplay: none;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto;--actionsPaddingInlineStart: 0}}\n"] }]
214
- }], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.DomSanitizer }], propDecorators: { type: [{
215
- type: Input
216
- }], svgConfig: [{
217
- type: Input
218
- }], svgAriaLabel: [{
219
- type: Input
220
- }], noSvg: [{
221
- type: Input
222
- }], id: [{
223
- type: Input
224
- }, {
225
- type: HostBinding,
226
- args: ['attr.id']
227
- }], class: [{
228
- type: Input
229
- }], buildComponentCssClass: [] } });
327
+ args: [{ selector: '[fd-illustrated-message]', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [], host: {
328
+ '[attr.id]': 'id()',
329
+ '[class]': 'cssClass()'
330
+ }, template: "<div class=\"fd-illustrated-message__container\">\n @if (!noSvg()) {\n <svg class=\"fd-illustrated-message__illustration\" [attr.aria-label]=\"svgAriaLabel()\">\n <use [attr.href]=\"href()\"></use>\n </svg>\n }\n @if (inlineSvg()) {\n <div [style.display]=\"'none'\" [innerHTML]=\"inlineSvg()\"></div>\n }\n <ng-content select=\"[fd-illustrated-message-figcaption]\"></ng-content>\n</div>\n<ng-content select=\"fd-illustrated-message-actions\"></ng-content>\n", styles: [".fd-illustrated-message{--illustratedMessagePadding: 1rem;--illustratedMessageMaxWidth: auto;--actionsMarginInline: 0;--actionsMarginBlock: 1rem;--actionsPaddingInlineStart: 0;--actionsPaddingInlineEnd: 0;--illustrationMinWidth: 15rem;--illustrationMaxWidth: 20rem;--illustrationMinHeight: 11.25rem;--illustrationMaxHeight: 15rem;--illustrationMarginBlock: 2rem;--illustrationMarginInlineStart: 0;--illustrationMarginInlineEnd: 0;--illustrationDisplay: flex;--containerFlexDirection: column;--figcaptionMaxWidth: 61.9375rem;--titleMinWidth: auto;--titleMarginBottom: 1rem;--titleFontSize: var(--sapFontHeader2Size);--textMinWidth: auto;--textMarginBottom: .5rem;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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;text-align:center;max-width:var(--illustratedMessageMaxWidth);padding-block:var(--illustratedMessagePadding);padding-inline:var(--illustratedMessagePadding)}.fd-illustrated-message:before,.fd-illustrated-message:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message-responsive-container{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;width:100%;min-height:100%;height:100%;container-type:inline-size}.fd-illustrated-message-responsive-container:before,.fd-illustrated-message-responsive-container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__container{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row;-webkit-box-align:var(--containerFlexAlignment, center);-ms-flex-align:var(--containerFlexAlignment, center);align-items:var(--containerFlexAlignment, center);-ms-flex-direction:var(--containerFlexDirection);flex-direction:var(--containerFlexDirection)}.fd-illustrated-message__container:before,.fd-illustrated-message__container:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__illustration{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;width:auto;height:auto;display:var(--illustrationDisplay);min-width:var(--illustrationMinWidth);min-height:var(--illustrationMinHeight);max-width:var(--illustrationMaxWidth);max-height:var(--illustrationMaxHeight);margin-block:var(--illustrationMarginBlock);margin-inline:var(--illustrationMarginInlineStart) var(--illustrationMarginInlineEnd)}.fd-illustrated-message__illustration:before,.fd-illustrated-message__illustration:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__figcaption{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;overflow:hidden;max-width:var(--figcaptionMaxWidth)}.fd-illustrated-message__figcaption:before,.fd-illustrated-message__figcaption:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__title{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;width:100%;text-align:center;font-size:var(--titleFontSize);color:var(--sapGroup_TitleTextColor);font-family:var(--sapFontHeaderFamily);-webkit-margin-after:var(--titleMarginBottom);margin-block-end:var(--titleMarginBottom)}.fd-illustrated-message__title:before,.fd-illustrated-message__title:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__text{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;text-wrap:wrap;text-align:center;line-height:1.5;-webkit-margin-after:var(--textMarginBottom);margin-block-end:var(--textMarginBottom)}.fd-illustrated-message__text:before,.fd-illustrated-message__text:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message__actions{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;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:.5rem;margin-block:var(--actionsMarginBlock);margin-inline:var(--actionsMarginInline);padding-inline:var(--actionsPaddingInlineStart) var(--actionsPaddingInlineEnd)}.fd-illustrated-message__actions:before,.fd-illustrated-message__actions:after{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-illustrated-message--dialog,.fd-illustrated-message--medium{--illustrationMinWidth: 10rem;--illustrationMinHeight: 10rem;--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: 1rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader3Size);--figcaptionMaxWidth: 40.5625rem;--actionsMarginBlock: .5rem 1rem}.fd-illustrated-message--spot,.fd-illustrated-message--small{--illustratedMessagePadding: .5rem;--illustrationMinWidth: 8rem;--illustrationMinHeight: 8rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: 0 .5rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader4Size);--figcaptionMaxWidth: 21.5rem;--actionsMarginBlock: .5rem}.fd-illustrated-message--dot,.fd-illustrated-message--xsmall{--illustratedMessagePadding: .25rem;--illustrationMinWidth: 2.8125rem;--illustrationMaxWidth: 2.8125rem;--illustrationMinHeight: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: 0 .25rem;--illustrationMarginInlineEnd: 0;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto}.fd-illustrated-message--base{--illustratedMessagePadding: .25rem;--illustratedMessageMaxWidth: auto;--illustrationDisplay: none;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto;--actionsPaddingInlineStart: 0}@container (width <= 681px){.fd-illustrated-message{--illustrationMinWidth: 10rem;--illustrationMinHeight: 10rem;--illustrationMaxWidth: 10rem;--illustrationMaxHeight: 10rem;--illustrationMarginBlock: 1rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader3Size);--figcaptionMaxWidth: 40.5625rem;--actionsMarginBlock: .5rem 1rem}}@container (width <= 360px){.fd-illustrated-message{--illustratedMessagePadding: .5rem;--illustrationMinWidth: 8rem;--illustrationMinHeight: 8rem;--illustrationMaxWidth: 8rem;--illustrationMaxHeight: 8rem;--illustrationMarginBlock: 0 .5rem;--titleMarginBottom: .5rem;--titleFontSize: var(--sapFontHeader4Size);--figcaptionMaxWidth: 21.5rem;--actionsMarginBlock: .5rem}}@container (width <= 260px){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustrationMinWidth: 2.8125rem;--illustrationMaxWidth: 2.8125rem;--illustrationMinHeight: 2.8125rem;--illustrationMaxHeight: 2.8125rem;--illustrationMarginBlock: 0 .25rem;--illustrationMarginInlineEnd: 0;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto}}@container (width <= 160px){.fd-illustrated-message{--illustratedMessagePadding: .25rem;--illustratedMessageMaxWidth: auto;--illustrationDisplay: none;--figcaptionMaxWidth: 12.6875rem;--titleMarginBottom: .25rem;--titleFontSize: var(--sapFontHeader5Size);--textMarginBottom: .313rem;--actionsMarginBlock: .25rem;--actionsMarginInline: auto;--actionsPaddingInlineStart: 0}}\n"] }]
331
+ }], ctorParameters: () => [], propDecorators: { type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: false }] }], svgConfig: [{ type: i0.Input, args: [{ isSignal: true, alias: "svgConfig", required: false }] }], svgAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "svgAriaLabel", required: false }] }], noSvg: [{ type: i0.Input, args: [{ isSignal: true, alias: "noSvg", required: false }] }], id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }] } });
230
332
 
231
333
  const components = [
232
334
  IllustratedMessageComponent,
@@ -1 +1 @@
1
- {"version":3,"file":"fundamental-ngx-core-illustrated-message.mjs","sources":["../../../../libs/core/illustrated-message/components/illustrated-message-actions/illustrated-message-actions.component.ts","../../../../libs/core/illustrated-message/components/illustrated-message-figcaption/illustrated-message-figcaption.component.ts","../../../../libs/core/illustrated-message/directives/illustrated-message-text/illustrated-message-text.directive.ts","../../../../libs/core/illustrated-message/directives/illustrated-message-title/illustrated-message-title.directive.ts","../../../../libs/core/illustrated-message/illustrated-message.component.ts","../../../../libs/core/illustrated-message/illustrated-message.component.html","../../../../libs/core/illustrated-message/illustrated-message.module.ts","../../../../libs/core/illustrated-message/fundamental-ngx-core-illustrated-message.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n selector: 'fd-illustrated-message-actions',\n template: `<ng-content></ng-content>`,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'fd-illustrated-message__actions'\n },\n standalone: true\n})\nexport class IllustratedMessageActionsComponent {}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fd-illustrated-message-figcaption]',\n template: `\n <ng-content select=\"[fd-illustrated-message-title]\"></ng-content>\n <ng-content select=\"[fd-illustrated-message-text]\"></ng-content>\n `,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'fd-illustrated-message__figcaption'\n },\n standalone: true\n})\nexport class IllustratedMessageFigcaptionComponent {}\n","import { Directive, HostBinding } from '@angular/core';\n\n@Directive({\n // TODO to be discussed\n // eslint-disable-next-line @angular-eslint/directive-selector\n selector: '[fd-illustrated-message-text]',\n standalone: true\n})\nexport class IllustratedMessageTextDirective {\n /** @hidden */\n @HostBinding('class.fd-illustrated-message__text')\n fdIllustratedMessageTextClass = true;\n}\n","import { Directive, HostBinding } from '@angular/core';\n\n@Directive({\n // TODO to be discussed\n // eslint-disable-next-line @angular-eslint/directive-selector\n selector: '[fd-illustrated-message-title]',\n standalone: true\n})\nexport class IllustratedMessageTitleDirective {\n /** @hidden */\n @HostBinding('class.fd-illustrated-message__title')\n fdIllustratedMessageTitleClass = true;\n}\n","import {\n AfterContentChecked,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n ElementRef,\n HostBinding,\n Input,\n OnChanges,\n OnDestroy,\n OnInit,\n SimpleChanges,\n ViewEncapsulation\n} from '@angular/core';\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\nimport { CssClassBuilder, Nullable, RequireOnlyOne, applyCssClass } from '@fundamental-ngx/cdk/utils';\nimport { Subscription, debounceTime, fromEvent } from 'rxjs';\n\nexport interface SvgItemConfig {\n url: string;\n id: string;\n file: string;\n}\n\nexport interface SvgConfig {\n // New keys\n large?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n medium?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n small?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n xsmall?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n\n // Legacy keys\n scene?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n dialog?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n spot?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n dot?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n}\n\nexport type IllustratedMessageType =\n | 'large'\n | 'medium'\n | 'small'\n | 'xsmall'\n | 'base'\n | 'scene'\n | 'dialog'\n | 'spot'\n | 'dot';\n\nexport enum IllustratedMessageTypes {\n LARGE = 'large',\n MEDIUM = 'medium',\n SMALL = 'small',\n EXTRA_SMALL = 'xsmall',\n BASE = 'base',\n SCENE = 'scene',\n DIALOG = 'dialog',\n SPOT = 'spot',\n DOT = 'dot'\n}\n\nlet illustratedMessageUniqueId = 0;\n\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fd-illustrated-message]',\n templateUrl: './illustrated-message.component.html',\n styleUrl: './illustrated-message.component.scss',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: []\n})\nexport class IllustratedMessageComponent implements AfterContentChecked, OnChanges, OnDestroy, OnInit, CssClassBuilder {\n @Input()\n type: IllustratedMessageType;\n\n @Input()\n svgConfig: SvgConfig;\n\n @Input()\n svgAriaLabel: Nullable<string>;\n\n @Input()\n noSvg = false;\n\n @Input()\n @HostBinding('attr.id')\n id: string = 'fd-illustrated-message-' + illustratedMessageUniqueId++;\n\n @Input()\n class: string;\n\n _href: string;\n _isSmallScreen: boolean;\n _inlineSvg: SafeHtml | undefined;\n _tempType: IllustratedMessageType;\n\n private _subscriptions = new Subscription();\n\n constructor(\n public readonly elementRef: ElementRef,\n private _cdRef: ChangeDetectorRef,\n private _sanitizer: DomSanitizer\n ) {}\n\n @applyCssClass\n buildComponentCssClass(): string[] {\n return [\n 'fd-illustrated-message',\n this._tempType ? `fd-illustrated-message--${this._tempType}` : '',\n this.class || ''\n ].filter(Boolean);\n }\n\n ngOnChanges(changes: SimpleChanges): void {\n if ('svgConfig' in changes) {\n this._constructHref();\n }\n }\n\n ngOnInit(): void {\n const resizeSubscription = fromEvent(window, 'resize')\n .pipe(debounceTime(200))\n .subscribe(() => this._constructHref());\n this._subscriptions.add(resizeSubscription);\n }\n\n ngAfterContentChecked(): void {\n this._constructHref();\n }\n\n ngOnDestroy(): void {\n this._subscriptions.unsubscribe();\n }\n\n private _constructHref(): void {\n this._inlineSvg = undefined;\n const containerWidth = this.elementRef.nativeElement.offsetWidth;\n const normalizedType = this._normalizeType(this.type);\n this._tempType = this.type ? normalizedType : this._determineIllustratedMessageType(containerWidth);\n\n const normalizedConfig = this._normalizeSvgConfig(this.svgConfig);\n const inlineSvg = normalizedConfig?.[this._tempType]?.file;\n if (inlineSvg) {\n this._inlineSvg = this._sanitizer.bypassSecurityTrustHtml(inlineSvg);\n }\n\n this._href = normalizedConfig ? this._getHrefByType(this._tempType, normalizedConfig) : '';\n this.buildComponentCssClass();\n this._cdRef.markForCheck();\n }\n\n private _determineIllustratedMessageType(width: number): IllustratedMessageType {\n if (width >= 682) {\n return IllustratedMessageTypes.LARGE;\n } else if (width >= 361) {\n return IllustratedMessageTypes.MEDIUM;\n } else if (width >= 261) {\n return IllustratedMessageTypes.SMALL;\n } else if (width >= 161) {\n return IllustratedMessageTypes.EXTRA_SMALL;\n }\n\n return IllustratedMessageTypes.BASE;\n }\n\n private _normalizeType(type: IllustratedMessageType): IllustratedMessageType {\n switch (type) {\n case 'scene':\n return 'large';\n case 'dialog':\n return 'medium';\n case 'spot':\n return 'small';\n case 'dot':\n return 'xsmall';\n default:\n return type;\n }\n }\n\n private _normalizeSvgConfig(config: SvgConfig): SvgConfig {\n return {\n large: config.large || config.scene,\n medium: config.medium || config.dialog,\n small: config.small || config.spot,\n xsmall: config.xsmall || config.dot\n };\n }\n\n private _getHrefByType(type: IllustratedMessageType, svgConfig: SvgConfig): string {\n switch (type) {\n case 'large':\n return `${svgConfig.large?.url || ''}#${svgConfig.large?.id}`;\n case 'medium':\n return `${svgConfig.medium?.url || ''}#${svgConfig.medium?.id}`;\n case 'small':\n return `${svgConfig.small?.url || ''}#${svgConfig.small?.id}`;\n case 'xsmall':\n return `${svgConfig.xsmall?.url || ''}#${svgConfig.xsmall?.id}`;\n default:\n return '';\n }\n }\n}\n","<div class=\"fd-illustrated-message__container\">\n @if (!noSvg) {\n <svg class=\"fd-illustrated-message__illustration\" [attr.aria-label]=\"svgAriaLabel\">\n <use [attr.href]=\"_href\"></use>\n </svg>\n }\n @if (_inlineSvg) {\n <div [style.display]=\"'none'\" [innerHTML]=\"_inlineSvg\"></div>\n }\n <ng-content select=\"[fd-illustrated-message-figcaption]\"></ng-content>\n</div>\n<ng-content select=\"fd-illustrated-message-actions\"></ng-content>\n","import { NgModule } from '@angular/core';\n\nimport { IllustratedMessageActionsComponent } from './components/illustrated-message-actions/illustrated-message-actions.component';\nimport { IllustratedMessageComponent } from './illustrated-message.component';\n\nimport { IllustratedMessageFigcaptionComponent } from './components/illustrated-message-figcaption/illustrated-message-figcaption.component';\nimport { IllustratedMessageTextDirective } from './directives/illustrated-message-text/illustrated-message-text.directive';\nimport { IllustratedMessageTitleDirective } from './directives/illustrated-message-title/illustrated-message-title.directive';\n\nconst components = [\n IllustratedMessageComponent,\n IllustratedMessageActionsComponent,\n IllustratedMessageFigcaptionComponent,\n IllustratedMessageTextDirective,\n IllustratedMessageTitleDirective\n];\n\n/**\n * @deprecated\n * Use direct imports of components and directives.\n */\n@NgModule({\n imports: [...components],\n exports: [...components]\n})\nexport class IllustratedMessageModule {}\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-illustrated-message.mjs","sources":["../../../../libs/core/illustrated-message/components/illustrated-message-actions/illustrated-message-actions.component.ts","../../../../libs/core/illustrated-message/components/illustrated-message-figcaption/illustrated-message-figcaption.component.ts","../../../../libs/core/illustrated-message/directives/illustrated-message-text/illustrated-message-text.directive.ts","../../../../libs/core/illustrated-message/directives/illustrated-message-title/illustrated-message-title.directive.ts","../../../../libs/core/illustrated-message/illustrated-message.component.ts","../../../../libs/core/illustrated-message/illustrated-message.component.html","../../../../libs/core/illustrated-message/illustrated-message.module.ts","../../../../libs/core/illustrated-message/fundamental-ngx-core-illustrated-message.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n/**\n * Component representing the actions section of an illustrated message.\n * Typically contains buttons or links for user actions.\n */\n@Component({\n selector: 'fd-illustrated-message-actions',\n template: `<ng-content></ng-content>`,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'fd-illustrated-message__actions'\n }\n})\nexport class IllustratedMessageActionsComponent {}\n","import { ChangeDetectionStrategy, Component } from '@angular/core';\n\n/**\n * Component representing the figcaption section of an illustrated message.\n * Contains title and text content slots.\n */\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fd-illustrated-message-figcaption]',\n template: `\n <ng-content select=\"[fd-illustrated-message-title]\"></ng-content>\n <ng-content select=\"[fd-illustrated-message-text]\"></ng-content>\n `,\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n class: 'fd-illustrated-message__figcaption'\n }\n})\nexport class IllustratedMessageFigcaptionComponent {}\n","import { Directive } from '@angular/core';\n\n/**\n * Directive for the text/description element within an illustrated message figcaption.\n */\n@Directive({\n // eslint-disable-next-line @angular-eslint/directive-selector\n selector: '[fd-illustrated-message-text]',\n host: {\n class: 'fd-illustrated-message__text'\n }\n})\nexport class IllustratedMessageTextDirective {}\n","import { Directive } from '@angular/core';\n\n/**\n * Directive for the title element within an illustrated message figcaption.\n */\n@Directive({\n // eslint-disable-next-line @angular-eslint/directive-selector\n selector: '[fd-illustrated-message-title]',\n host: {\n class: 'fd-illustrated-message__title'\n }\n})\nexport class IllustratedMessageTitleDirective {}\n","import {\n afterNextRender,\n booleanAttribute,\n ChangeDetectionStrategy,\n Component,\n computed,\n effect,\n ElementRef,\n inject,\n input,\n signal,\n ViewEncapsulation\n} from '@angular/core';\nimport { toSignal } from '@angular/core/rxjs-interop';\nimport { DomSanitizer } from '@angular/platform-browser';\nimport { HasElementRef, RequireOnlyOne } from '@fundamental-ngx/cdk/utils';\nimport { debounceTime, fromEvent } from 'rxjs';\n\n/**\n * Configuration for an SVG item in the illustrated message.\n */\nexport interface SvgItemConfig {\n /** URL to the SVG sprite file */\n url: string;\n /** ID of the symbol within the SVG sprite */\n id: string;\n /** Inline SVG file content */\n file: string;\n}\n\n/**\n * Configuration for different SVG sizes in the illustrated message.\n * Supports both modern (large, medium, small, xsmall) and legacy (scene, dialog, spot, dot) naming.\n */\nexport interface SvgConfig {\n /** Configuration for large/scene size (>= 682px) */\n large?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n /** Configuration for medium/dialog size (361px - 681px) */\n medium?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n /** Configuration for small/spot size (261px - 360px) */\n small?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n /** Configuration for extra small/dot size (161px - 260px) */\n xsmall?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n\n /** @deprecated Use 'large' instead */\n scene?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n /** @deprecated Use 'medium' instead */\n dialog?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n /** @deprecated Use 'small' instead */\n spot?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n /** @deprecated Use 'xsmall' instead */\n dot?: RequireOnlyOne<SvgItemConfig, 'url' | 'file'>;\n}\n\n/**\n * Type of illustrated message based on container width or explicit configuration.\n * Modern types: large, medium, small, xsmall, base\n * Legacy types: scene, dialog, spot, dot\n */\nexport type IllustratedMessageType =\n | 'large'\n | 'medium'\n | 'small'\n | 'xsmall'\n | 'base'\n | 'scene'\n | 'dialog'\n | 'spot'\n | 'dot';\n\n/**\n * Enumeration of illustrated message types with their string values.\n */\nexport enum IllustratedMessageTypes {\n LARGE = 'large',\n MEDIUM = 'medium',\n SMALL = 'small',\n EXTRA_SMALL = 'xsmall',\n BASE = 'base',\n /** @deprecated Use LARGE instead */\n SCENE = 'scene',\n /** @deprecated Use MEDIUM instead */\n DIALOG = 'dialog',\n /** @deprecated Use SMALL instead */\n SPOT = 'spot',\n /** @deprecated Use EXTRA_SMALL instead */\n DOT = 'dot'\n}\n\nlet illustratedMessageUniqueId = 0;\n\n/**\n * Component representing an illustrated message with responsive SVG illustration.\n *\n * The component automatically adjusts its illustration size based on container width:\n * - Large (>= 682px)\n * - Medium (361px - 681px)\n * - Small (261px - 360px)\n * - Extra Small (161px - 260px)\n * - Base (< 161px)\n *\n * Supports both URL-based SVG sprites and inline SVG content.\n *\n * @example\n * ```html\n * <div fd-illustrated-message [svgConfig]=\"svgConfig\">\n * <figcaption fd-illustrated-message-figcaption>\n * <h3>No Data Available</h3>\n * <p>Please check back later</p>\n * </figcaption>\n * </div>\n * ```\n */\n@Component({\n // eslint-disable-next-line @angular-eslint/component-selector\n selector: '[fd-illustrated-message]',\n templateUrl: './illustrated-message.component.html',\n styleUrl: './illustrated-message.component.scss',\n encapsulation: ViewEncapsulation.None,\n changeDetection: ChangeDetectionStrategy.OnPush,\n imports: [],\n host: {\n '[attr.id]': 'id()',\n '[class]': 'cssClass()'\n }\n})\nexport class IllustratedMessageComponent implements HasElementRef {\n /**\n * Explicitly set the illustration type. If not provided, type is determined by container width.\n */\n readonly type = input<IllustratedMessageType>();\n\n /**\n * Configuration for SVG illustrations at different sizes.\n */\n readonly svgConfig = input<SvgConfig>();\n\n /**\n * Accessible label for the SVG illustration.\n */\n readonly svgAriaLabel = input<string | null | undefined>(null);\n\n /**\n * When true, hides the SVG illustration entirely.\n */\n readonly noSvg = input(false, { transform: booleanAttribute });\n\n /**\n * Unique identifier for the illustrated message component.\n */\n readonly id = input<string>(`fd-illustrated-message-${++illustratedMessageUniqueId}`);\n\n /**\n * Reference to the host element.\n */\n readonly elementRef = inject(ElementRef);\n\n /**\n * Signal tracking container width for responsive behavior.\n * @hidden\n */\n protected readonly containerWidth = signal<number>(0);\n\n /**\n * Normalized illustration type from explicit input or legacy names.\n * @hidden\n */\n protected readonly normalizedInputType = computed(() => {\n const explicitType = this.type();\n return explicitType ? this._normalizeType(explicitType) : undefined;\n });\n\n /**\n * Current illustration type based on explicit type or container width.\n * @hidden\n */\n protected readonly currentType = computed(\n () => this.normalizedInputType() || this._determineTypeByWidth(this.containerWidth())\n );\n\n /**\n * Normalized SVG configuration with legacy keys mapped to modern keys.\n * @hidden\n */\n protected readonly normalizedConfig = computed(() => {\n const config = this.svgConfig();\n return config ? this._normalizeSvgConfig(config) : null;\n });\n\n /**\n * Inline SVG content for the current type.\n * @hidden\n */\n protected readonly inlineSvg = computed(() => {\n const config = this.normalizedConfig();\n const type = this.currentType();\n const inlineSvg = config?.[type]?.file;\n return inlineSvg ? this._sanitizer.bypassSecurityTrustHtml(inlineSvg) : undefined;\n });\n\n /**\n * SVG href attribute for the current type.\n * @hidden\n */\n protected readonly href = computed(() => {\n const config = this.normalizedConfig();\n if (!config) {\n return '';\n }\n return this._getHrefByType(this.currentType(), config);\n });\n\n /**\n * Computed CSS class string for the component.\n * @hidden\n */\n protected readonly cssClass = computed(() => {\n const classes: string[] = ['fd-illustrated-message'];\n\n const currentTypeValue = this.currentType();\n if (currentTypeValue && currentTypeValue !== 'base') {\n classes.push(`fd-illustrated-message--${currentTypeValue}`);\n }\n\n return classes.join(' ');\n });\n\n /** @hidden */\n private readonly _sanitizer = inject(DomSanitizer);\n\n /** @hidden */\n constructor() {\n // Setup resize listener for responsive behavior with automatic cleanup\n const resize$ = toSignal(fromEvent(window, 'resize').pipe(debounceTime(200)));\n\n // Measure container width after render\n afterNextRender(() => {\n this._measureContainerWidth();\n });\n\n // React to resize events and input changes\n effect(() => {\n // Track resize events\n resize$();\n this.type();\n this.svgConfig();\n\n // Remeasure on changes\n this._measureContainerWidth();\n });\n }\n\n /**\n * Measures and updates the container width.\n * @private\n */\n private _measureContainerWidth(): void {\n const width = this.elementRef.nativeElement.offsetWidth;\n\n if (this.containerWidth() !== width) {\n this.containerWidth.set(width);\n }\n }\n\n /**\n * Determines the illustration type based on container width.\n * @param width - Container width in pixels\n * @returns Appropriate illustration type\n * @private\n */\n private _determineTypeByWidth(width: number): IllustratedMessageType {\n if (width >= 682) {\n return IllustratedMessageTypes.LARGE;\n } else if (width >= 361) {\n return IllustratedMessageTypes.MEDIUM;\n } else if (width >= 261) {\n return IllustratedMessageTypes.SMALL;\n } else if (width >= 161) {\n return IllustratedMessageTypes.EXTRA_SMALL;\n }\n\n return IllustratedMessageTypes.BASE;\n }\n\n /**\n * Normalizes legacy type names to modern equivalents.\n * @param type - Illustration type to normalize\n * @returns Normalized illustration type\n * @private\n */\n private _normalizeType(type: IllustratedMessageType): IllustratedMessageType {\n switch (type) {\n case 'scene':\n return 'large';\n case 'dialog':\n return 'medium';\n case 'spot':\n return 'small';\n case 'dot':\n return 'xsmall';\n default:\n return type;\n }\n }\n\n /**\n * Normalizes SVG configuration, mapping legacy keys to modern keys.\n * @param config - SVG configuration to normalize\n * @returns Normalized SVG configuration\n * @private\n */\n private _normalizeSvgConfig(config: SvgConfig): SvgConfig {\n return {\n large: config.large || config.scene,\n medium: config.medium || config.dialog,\n small: config.small || config.spot,\n xsmall: config.xsmall || config.dot\n };\n }\n\n /**\n * Constructs the SVG href attribute value for the given type.\n * @param type - Illustration type\n * @param svgConfig - Normalized SVG configuration\n * @returns SVG href string\n * @private\n */\n private _getHrefByType(type: IllustratedMessageType, svgConfig: SvgConfig): string {\n switch (type) {\n case 'large':\n return `${svgConfig.large?.url || ''}#${svgConfig.large?.id}`;\n case 'medium':\n return `${svgConfig.medium?.url || ''}#${svgConfig.medium?.id}`;\n case 'small':\n return `${svgConfig.small?.url || ''}#${svgConfig.small?.id}`;\n case 'xsmall':\n return `${svgConfig.xsmall?.url || ''}#${svgConfig.xsmall?.id}`;\n default:\n return '';\n }\n }\n}\n","<div class=\"fd-illustrated-message__container\">\n @if (!noSvg()) {\n <svg class=\"fd-illustrated-message__illustration\" [attr.aria-label]=\"svgAriaLabel()\">\n <use [attr.href]=\"href()\"></use>\n </svg>\n }\n @if (inlineSvg()) {\n <div [style.display]=\"'none'\" [innerHTML]=\"inlineSvg()\"></div>\n }\n <ng-content select=\"[fd-illustrated-message-figcaption]\"></ng-content>\n</div>\n<ng-content select=\"fd-illustrated-message-actions\"></ng-content>\n","import { NgModule } from '@angular/core';\n\nimport { IllustratedMessageActionsComponent } from './components/illustrated-message-actions/illustrated-message-actions.component';\nimport { IllustratedMessageComponent } from './illustrated-message.component';\n\nimport { IllustratedMessageFigcaptionComponent } from './components/illustrated-message-figcaption/illustrated-message-figcaption.component';\nimport { IllustratedMessageTextDirective } from './directives/illustrated-message-text/illustrated-message-text.directive';\nimport { IllustratedMessageTitleDirective } from './directives/illustrated-message-title/illustrated-message-title.directive';\n\nconst components = [\n IllustratedMessageComponent,\n IllustratedMessageActionsComponent,\n IllustratedMessageFigcaptionComponent,\n IllustratedMessageTextDirective,\n IllustratedMessageTitleDirective\n];\n\n/**\n * @deprecated\n * Use direct imports of components and directives.\n */\n@NgModule({\n imports: [...components],\n exports: [...components]\n})\nexport class IllustratedMessageModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}