@frxjs/ngx-timeline 21.0.2 → 22.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +19 -19
- package/fesm2022/frxjs-ngx-timeline.mjs +65 -41
- package/fesm2022/frxjs-ngx-timeline.mjs.map +1 -1
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
The main goal of this angular library is to give you the possibility to integrate a timeline in your app.
|
|
4
4
|
<br>
|
|
5
|
-
Version
|
|
5
|
+
Version 22.0.0 is compatible with angular 22.
|
|
6
6
|
<br>
|
|
7
7
|
Go [here](https://emanuelefricano93.github.io/frxjs-Ngx-Timeline/) and discover all possible configurations for the timeline
|
|
8
8
|
|
|
@@ -33,25 +33,25 @@ After installing the library and including NgxTimelineModule in your imports mod
|
|
|
33
33
|
|
|
34
34
|
### Input
|
|
35
35
|
|
|
36
|
-
| Input name | Explanation | Mandatory | Type/Supported Values
|
|
37
|
-
|
|
38
|
-
| events | list of events to be displayed | yes | NgxTimelineEvent
|
|
36
|
+
| Input name | Explanation | Mandatory | Type/Supported Values | Default value |
|
|
37
|
+
|--------------------------------|-------------------------------------------------------------|-----------|----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|------------------------------------------------------|
|
|
38
|
+
| events | list of events to be displayed | yes | NgxTimelineEvent | no default |
|
|
39
39
|
| langCode | language code use to format dates | no | <ul><li>'de' (German)</li><li>'en' (English)</li><li>'es' (Spanish)</li><li>'fr' (French)</li><li>'it' (Italian)</li><li>'nb' (Norwegian)</li><li>'pl' (Polish)</li><li>'pt' (Portuguese)</li><li>'ru' (Russian)</li><li>'sl' (Slovenian)</li><li>'tr' (Turkish)</li></ul> | 'en' |
|
|
40
|
-
| enableAnimation | Boolean used to enable or disable the animations | no | boolean
|
|
41
|
-
| reverseOrder | Boolean used to reverse sort order (default older first) | no | boolean
|
|
42
|
-
| virtualScroll | Boolean used to enable or disable the virtual scroll | no | boolean
|
|
43
|
-
| virtualScrollItemSize | Number of pixels of a single item used for virtual scroll | no | number
|
|
44
|
-
| virtualScrollMaxBufferPx | Number of max pixels the buffer for the virtual scroll has | no | number
|
|
45
|
-
| virtualScrollMinBufferPx | Minimum
|
|
46
|
-
| groupEvent | Logic to be applied in order to group events | no | enum NgxTimelineEventGroup
|
|
47
|
-
| orientation | Orientation of the timeline | no | enum NgxTimelineOrientation
|
|
48
|
-
| changeSide | Logic to be applied in order to put events on LEFT or RIGHT | no | enum NgxTimelineEventChangeSide
|
|
49
|
-
| periodCustomTemplate | Custom Template displayed before a group of events | no | `TemplateRef<unknown>`
|
|
50
|
-
| eventCustomTemplate | Custom Template displayed to show a single event | no | `TemplateRef<unknown>`
|
|
51
|
-
| centerIconCustomTemplate | Custom Template displayed to show an separator icon | no | `TemplateRef<unknown>`
|
|
52
|
-
| dateInstantCustomTemplate | Custom Template displayed to show the side date | no | `TemplateRef<unknown>`
|
|
53
|
-
| innerEventCustomTemplate | Custom Template displayed to show the inner event | no | `TemplateRef<unknown>`
|
|
54
|
-
| eventDescriptionCustomTemplate | Custom Template displayed to show the description | no | `TemplateRef<unknown>`
|
|
40
|
+
| enableAnimation | Boolean used to enable or disable the animations | no | boolean | true |
|
|
41
|
+
| reverseOrder | Boolean used to reverse sort order (default older first) | no | boolean | false |
|
|
42
|
+
| virtualScroll | Boolean used to enable or disable the virtual scroll | no | boolean | false |
|
|
43
|
+
| virtualScrollItemSize | Number of pixels of a single item used for virtual scroll | no | number | 100 |
|
|
44
|
+
| virtualScrollMaxBufferPx | Number of max pixels the buffer for the virtual scroll has | no | number | 200 |
|
|
45
|
+
| virtualScrollMinBufferPx | Minimum amount of the buffer rendered beyond the viewport | no | number | 100 |
|
|
46
|
+
| groupEvent | Logic to be applied in order to group events | no | enum NgxTimelineEventGroup | NgxTimelineEventGroup.MONTH_YEAR |
|
|
47
|
+
| orientation | Orientation of the timeline | no | enum NgxTimelineOrientation | NgxTimelineOrientation.VERTICAL |
|
|
48
|
+
| changeSide | Logic to be applied in order to put events on LEFT or RIGHT | no | enum NgxTimelineEventChangeSide | NgxTimelineEventChangeSide.ON_DIFFERENT_DAY_IN_GROUP |
|
|
49
|
+
| periodCustomTemplate | Custom Template displayed before a group of events | no | `TemplateRef<unknown>` | no default |
|
|
50
|
+
| eventCustomTemplate | Custom Template displayed to show a single event | no | `TemplateRef<unknown>` | no default |
|
|
51
|
+
| centerIconCustomTemplate | Custom Template displayed to show an separator icon | no | `TemplateRef<unknown>` | no default |
|
|
52
|
+
| dateInstantCustomTemplate | Custom Template displayed to show the side date | no | `TemplateRef<unknown>` | no default |
|
|
53
|
+
| innerEventCustomTemplate | Custom Template displayed to show the inner event | no | `TemplateRef<unknown>` | no default |
|
|
54
|
+
| eventDescriptionCustomTemplate | Custom Template displayed to show the description | no | `TemplateRef<unknown>` | no default |
|
|
55
55
|
|
|
56
56
|
### Output
|
|
57
57
|
|
|
@@ -172,7 +172,6 @@ var NgxTimelineItemPosition;
|
|
|
172
172
|
})(NgxTimelineItemPosition || (NgxTimelineItemPosition = {}));
|
|
173
173
|
|
|
174
174
|
class NgxDatePipe {
|
|
175
|
-
// eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents
|
|
176
175
|
transform(date, dateFormat, langCode) {
|
|
177
176
|
const configDate = this.getDateConfig(langCode);
|
|
178
177
|
let dateFormatString = 'yyyy';
|
|
@@ -194,10 +193,10 @@ class NgxDatePipe {
|
|
|
194
193
|
const code = langCode ?? defaultSupportedLanguageCode;
|
|
195
194
|
return dateConfigMap[code];
|
|
196
195
|
}
|
|
197
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
198
|
-
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "
|
|
196
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxDatePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe });
|
|
197
|
+
static ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.0.1", ngImport: i0, type: NgxDatePipe, isStandalone: true, name: "ngxdate" });
|
|
199
198
|
}
|
|
200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
199
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxDatePipe, decorators: [{
|
|
201
200
|
type: Pipe,
|
|
202
201
|
args: [{
|
|
203
202
|
name: 'ngxdate',
|
|
@@ -208,38 +207,46 @@ class NgxTimelineEventComponent {
|
|
|
208
207
|
/**
|
|
209
208
|
* Event to be displayed.
|
|
210
209
|
*/
|
|
211
|
-
event = input.required(
|
|
210
|
+
event = input.required(/* @ts-ignore */
|
|
211
|
+
...(ngDevMode ? [{ debugName: "event" }] : /* istanbul ignore next */ []));
|
|
212
212
|
/**
|
|
213
213
|
* Event position respect to the vertical line (LEFT or RIGHT).
|
|
214
214
|
*/
|
|
215
|
-
colSidePosition = input(
|
|
215
|
+
colSidePosition = input(/* @ts-ignore */
|
|
216
|
+
...(ngDevMode ? [undefined, { debugName: "colSidePosition" }] : /* istanbul ignore next */ []));
|
|
216
217
|
/**
|
|
217
218
|
* Language code used to format the dates.
|
|
218
219
|
*/
|
|
219
|
-
langCode = input(defaultSupportedLanguageCode,
|
|
220
|
+
langCode = input(defaultSupportedLanguageCode, /* @ts-ignore */
|
|
221
|
+
...(ngDevMode ? [{ debugName: "langCode" }] : /* istanbul ignore next */ []));
|
|
220
222
|
/**
|
|
221
223
|
* Inner custom template used to display the event detail.
|
|
222
224
|
*/
|
|
223
|
-
innerEventCustomTemplate = input(
|
|
225
|
+
innerEventCustomTemplate = input(/* @ts-ignore */
|
|
226
|
+
...(ngDevMode ? [undefined, { debugName: "innerEventCustomTemplate" }] : /* istanbul ignore next */ []));
|
|
224
227
|
/**
|
|
225
228
|
* Inner custom template used to display the event description.
|
|
226
229
|
*/
|
|
227
|
-
eventDescriptionCustomTemplate = input(
|
|
230
|
+
eventDescriptionCustomTemplate = input(/* @ts-ignore */
|
|
231
|
+
...(ngDevMode ? [undefined, { debugName: "eventDescriptionCustomTemplate" }] : /* istanbul ignore next */ []));
|
|
228
232
|
/**
|
|
229
233
|
* Boolean used to enable or disable the animations.
|
|
230
234
|
*/
|
|
231
|
-
enableAnimation = input(true,
|
|
235
|
+
enableAnimation = input(true, /* @ts-ignore */
|
|
236
|
+
...(ngDevMode ? [{ debugName: "enableAnimation" }] : /* istanbul ignore next */ []));
|
|
232
237
|
/**
|
|
233
238
|
* Orientation of the timeline.
|
|
234
239
|
*/
|
|
235
|
-
orientation = input(NgxTimelineOrientation.VERTICAL,
|
|
240
|
+
orientation = input(NgxTimelineOrientation.VERTICAL, /* @ts-ignore */
|
|
241
|
+
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
236
242
|
/**
|
|
237
243
|
* Output click event emitter.
|
|
238
244
|
*/
|
|
239
245
|
clickEmitter = output();
|
|
240
246
|
ngxTimelineItemPosition = NgxTimelineItemPosition;
|
|
241
247
|
ngxTimelineOrientation = NgxTimelineOrientation;
|
|
242
|
-
dateObjSignal = computed(() => !this.event() ? null : this.getDateObj(),
|
|
248
|
+
dateObjSignal = computed(() => !this.event() ? null : this.getDateObj(), /* @ts-ignore */
|
|
249
|
+
...(ngDevMode ? [{ debugName: "dateObjSignal" }] : /* istanbul ignore next */ []));
|
|
243
250
|
monthAbbr = 'MMM';
|
|
244
251
|
dayFormat = 'dd';
|
|
245
252
|
getDateObj() {
|
|
@@ -259,10 +266,10 @@ class NgxTimelineEventComponent {
|
|
|
259
266
|
getLangCode() {
|
|
260
267
|
return this.langCode();
|
|
261
268
|
}
|
|
262
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
263
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "
|
|
269
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxTimelineEventComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
270
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: NgxTimelineEventComponent, isStandalone: true, selector: "ngx-timeline-event", inputs: { event: { classPropertyName: "event", publicName: "event", isSignal: true, isRequired: true, transformFunction: null }, colSidePosition: { classPropertyName: "colSidePosition", publicName: "colSidePosition", isSignal: true, isRequired: false, transformFunction: null }, langCode: { classPropertyName: "langCode", publicName: "langCode", isSignal: true, isRequired: false, transformFunction: null }, innerEventCustomTemplate: { classPropertyName: "innerEventCustomTemplate", publicName: "innerEventCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventDescriptionCustomTemplate: { classPropertyName: "eventDescriptionCustomTemplate", publicName: "eventDescriptionCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, enableAnimation: { classPropertyName: "enableAnimation", publicName: "enableAnimation", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clickEmitter: "clickEmitter" }, ngImport: i0, template: "<div class=\"event-wrapper-container\" (click)=\"clickEmitter.emit(event())\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\n @if (colSidePosition()===ngxTimelineItemPosition.ON_RIGHT) {\n <div class=\"arrow left\"></div>\n }\n <div class=\"event\" [class.enableAnimation]=\"enableAnimation()\">\n <ng-container *ngTemplateOutlet=\"innerEventCustomTemplate() || innerEventContainer; context: {event: event()}\"></ng-container>\n </div>\n @if (colSidePosition() === ngxTimelineItemPosition.ON_LEFT) {\n <div class=\"arrow right\"></div>\n }\n</div>\n\n<ng-template #innerEventContainer let-event=event>\n <div class=\"event-container\" [class.reverse]=\"colSidePosition() === ngxTimelineItemPosition.ON_LEFT\">\n <div class=\"event-info-container\">\n <div class=\"event-info-header\">\n <div class=\"title-container\">{{event?.eventInfo?.title | titlecase}}</div>\n </div>\n <div class=\"event-info-body\">\n <ng-container *ngTemplateOutlet=\"eventDescriptionCustomTemplate() || eventDescriptionContainer; context: {event: event}\"></ng-container>\n </div>\n </div>\n\n <div class=\"event-divider-container\">\n <hr>\n </div>\n\n @if (dateObjSignal(); as dateObj) {\n <div class=\"event-date-container\">\n <div>\n <p>{{dateObj.month}}</p>\n </div>\n <div>\n <p class=\"day\">{{dateObj.day}}</p>\n </div>\n <div>\n <p>{{dateObj.year}}</p>\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n\n<ng-template #eventDescriptionContainer let-event=event>\n <p class=\"event-info-description\">{{event?.eventInfo?.description}}</p>\n</ng-template>\n", styles: ["::ng-deep :root{--ngx-timeline-period-inner-container: orange;--ngx-timeline-icon: orange;--ngx-timeline-line-background: #464646;--ngx-timeline-flex-display-col: 49 49 0;--ngx-timeline-flex-display-col-center: 2 2 0;--ngx-timeline-event-background: white;--ngx-timeline-event-divider-background: #e9e9e9;--ngx-timeline-event-text-color: black}.event-wrapper-container{display:flex;justify-content:center;align-items:center;cursor:pointer;color:var(--ngx-timeline-event-text-color)}.event-wrapper-container.horizontal{display:flex;flex-direction:column;padding:0 3rem}.event-wrapper-container.horizontal .event-container.reverse{flex-direction:row}.event-wrapper-container.horizontal .event{margin:0}.event-wrapper-container.horizontal .arrow.right{border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-top:.5rem solid var(--ngx-timeline-event-background);border-bottom:none}.event-wrapper-container.horizontal .arrow.left{border-left:.5rem solid transparent;border-right:.5rem solid transparent;border-bottom:.5rem solid var(--ngx-timeline-event-background);border-top:none}.arrow{width:0;height:0;border-top:.5rem solid transparent;border-bottom:.5rem solid transparent;border-radius:6px;z-index:10}.arrow.right{filter:drop-shadow(2px 0px 0px rgba(36,74,110,.1333333333));border-left:.5rem solid var(--ngx-timeline-event-background)}.arrow.left{filter:drop-shadow(-1px 0px 0px rgba(36,74,110,.1333333333));border-right:.5rem solid var(--ngx-timeline-event-background)}.event{background:var(--ngx-timeline-event-background);border-radius:.8rem;padding:1rem;width:100%;margin:1rem 0}.event.enableAnimation:hover{padding:2rem;transition:all .5s ease-in-out}.event.enableAnimation:not(:hover){padding:1rem;transition:all .5s ease-in-out}.event:not(.hour){background:var(--ngx-timeline-event-background) 0% 0% no-repeat padding-box;box-shadow:0 3px 6px #244a6e52}.event.hour{padding:.5rem;background:none;display:flex;justify-content:center;align-items:center}.event.hour.right{justify-content:flex-start}.event.hour.left{justify-content:flex-end}.event .hour-inner-container{margin:0}.event-container{display:flex}.event-container.reverse{flex-direction:row-reverse}.event-container .event-info-container{display:flex;flex-direction:column;align-items:flex-start;padding:.1rem;flex:88 88 0}.event-container .event-info-container .event-info-header{display:flex;align-items:center;width:100%}.event-container .event-info-container .event-info-header .icon-container{margin-right:.3rem}.event-container .event-info-container .event-info-header .title-container{font-weight:700;font-size:15px}.event-container .event-info-container .event-info-body{padding:.5rem 0;display:flex;flex-direction:column;justify-content:flex-start;overflow-wrap:anywhere}.event-container .event-info-container .event-info-body .event-info-description{margin-bottom:.5rem;font-size:13px}.event-container .event-info-container .event-info-body .expiration-container,.event-container .event-info-container .event-info-body .category-container{display:flex;font-size:13px;justify-content:flex-start;align-items:center}.event-container .event-info-container .event-info-body .expiration-container p,.event-container .event-info-container .event-info-body .category-container p{font-size:13px;margin:0}.event-container .event-info-container .event-info-body .expiration-container .expiration-label,.event-container .event-info-container .event-info-body .expiration-container .category-label,.event-container .event-info-container .event-info-body .category-container .expiration-label,.event-container .event-info-container .event-info-body .category-container .category-label{margin-right:.5rem}.event-container .event-info-container .event-info-body .expiration-container .expiration-value,.event-container .event-info-container .event-info-body .expiration-container .category-value,.event-container .event-info-container .event-info-body .category-container .expiration-value,.event-container .event-info-container .event-info-body .category-container .category-value{font-weight:700}.event-container .event-info-container .event-info-footer{font-size:15px;cursor:pointer;padding-top:1rem}.event-container .event-info-container .event-info-footer .footer-inner-container{display:flex;justify-content:flex-start;align-items:flex-end}.event-container .event-divider-container{display:flex;justify-content:center;align-items:center;padding:.1rem;flex:5 5 0}.event-container .event-divider-container hr{height:100%;width:1px;background:var(--ngx-timeline-event-divider-background)}.event-container .event-date-container{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:.1rem;flex:15 15 0}.event-container .event-date-container p{margin:0;text-align:center}.event-container .event-date-container p.day{font-size:32px;font-weight:700;padding:.5rem 0}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: TitleCasePipe, name: "titlecase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
264
271
|
}
|
|
265
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
272
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxTimelineEventComponent, decorators: [{
|
|
266
273
|
type: Component,
|
|
267
274
|
args: [{ selector: 'ngx-timeline-event', imports: [
|
|
268
275
|
NgTemplateOutlet,
|
|
@@ -274,72 +281,89 @@ class NgxTimelineComponent {
|
|
|
274
281
|
/**
|
|
275
282
|
* List of events to be displayed.
|
|
276
283
|
*/
|
|
277
|
-
events = input.required(
|
|
284
|
+
events = input.required(/* @ts-ignore */
|
|
285
|
+
...(ngDevMode ? [{ debugName: "events" }] : /* istanbul ignore next */ []));
|
|
278
286
|
/**
|
|
279
287
|
* Language code used to show the date formatted.
|
|
280
288
|
*/
|
|
281
|
-
langCode = input(defaultSupportedLanguageCode,
|
|
289
|
+
langCode = input(defaultSupportedLanguageCode, /* @ts-ignore */
|
|
290
|
+
...(ngDevMode ? [{ debugName: "langCode" }] : /* istanbul ignore next */ []));
|
|
282
291
|
/**
|
|
283
292
|
* Boolean used to enable or disable the animations.
|
|
284
293
|
*/
|
|
285
|
-
enableAnimation = input(true,
|
|
294
|
+
enableAnimation = input(true, /* @ts-ignore */
|
|
295
|
+
...(ngDevMode ? [{ debugName: "enableAnimation" }] : /* istanbul ignore next */ []));
|
|
286
296
|
/**
|
|
287
297
|
* Boolean used to reverse sort order (default older first).
|
|
288
298
|
*/
|
|
289
|
-
reverseOrder = input(false,
|
|
299
|
+
reverseOrder = input(false, /* @ts-ignore */
|
|
300
|
+
...(ngDevMode ? [{ debugName: "reverseOrder" }] : /* istanbul ignore next */ []));
|
|
290
301
|
/**
|
|
291
302
|
* Orientation of the timeline.
|
|
292
303
|
*/
|
|
293
|
-
orientation = input(NgxTimelineOrientation.VERTICAL,
|
|
304
|
+
orientation = input(NgxTimelineOrientation.VERTICAL, /* @ts-ignore */
|
|
305
|
+
...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
|
|
294
306
|
/**
|
|
295
307
|
* Logic to be applied in order to group events.
|
|
296
308
|
*/
|
|
297
|
-
groupEvent = input(NgxTimelineEventGroup.MONTH_YEAR,
|
|
309
|
+
groupEvent = input(NgxTimelineEventGroup.MONTH_YEAR, /* @ts-ignore */
|
|
310
|
+
...(ngDevMode ? [{ debugName: "groupEvent" }] : /* istanbul ignore next */ []));
|
|
298
311
|
/**
|
|
299
312
|
* Logic to be applied in order to put events on LEFT or RIGHT.
|
|
300
313
|
*/
|
|
301
|
-
changeSide = input(NgxTimelineEventChangeSide.ON_DIFFERENT_DAY_IN_GROUP,
|
|
314
|
+
changeSide = input(NgxTimelineEventChangeSide.ON_DIFFERENT_DAY_IN_GROUP, /* @ts-ignore */
|
|
315
|
+
...(ngDevMode ? [{ debugName: "changeSide" }] : /* istanbul ignore next */ []));
|
|
302
316
|
/**
|
|
303
317
|
* Custom Template displayed before a group of events.
|
|
304
318
|
*/
|
|
305
|
-
periodCustomTemplate = input(
|
|
319
|
+
periodCustomTemplate = input(/* @ts-ignore */
|
|
320
|
+
...(ngDevMode ? [undefined, { debugName: "periodCustomTemplate" }] : /* istanbul ignore next */ []));
|
|
306
321
|
/**
|
|
307
322
|
* Custom Template displayed to show a single event.
|
|
308
323
|
*/
|
|
309
|
-
eventCustomTemplate = input(
|
|
324
|
+
eventCustomTemplate = input(/* @ts-ignore */
|
|
325
|
+
...(ngDevMode ? [undefined, { debugName: "eventCustomTemplate" }] : /* istanbul ignore next */ []));
|
|
310
326
|
/**
|
|
311
327
|
* Custom Template displayed to show a separator icon.
|
|
312
328
|
*/
|
|
313
|
-
centerIconCustomTemplate = input(
|
|
329
|
+
centerIconCustomTemplate = input(/* @ts-ignore */
|
|
330
|
+
...(ngDevMode ? [undefined, { debugName: "centerIconCustomTemplate" }] : /* istanbul ignore next */ []));
|
|
314
331
|
/**
|
|
315
332
|
* Custom Template displayed to show the side date.
|
|
316
333
|
*/
|
|
317
|
-
dateInstantCustomTemplate = input(
|
|
334
|
+
dateInstantCustomTemplate = input(/* @ts-ignore */
|
|
335
|
+
...(ngDevMode ? [undefined, { debugName: "dateInstantCustomTemplate" }] : /* istanbul ignore next */ []));
|
|
318
336
|
/**
|
|
319
337
|
* Custom Template displayed to show the inner event.
|
|
320
338
|
*/
|
|
321
|
-
innerEventCustomTemplate = input(
|
|
339
|
+
innerEventCustomTemplate = input(/* @ts-ignore */
|
|
340
|
+
...(ngDevMode ? [undefined, { debugName: "innerEventCustomTemplate" }] : /* istanbul ignore next */ []));
|
|
322
341
|
/**
|
|
323
342
|
* Inner custom template used to display the event description.
|
|
324
343
|
*/
|
|
325
|
-
eventDescriptionCustomTemplate = input(
|
|
344
|
+
eventDescriptionCustomTemplate = input(/* @ts-ignore */
|
|
345
|
+
...(ngDevMode ? [undefined, { debugName: "eventDescriptionCustomTemplate" }] : /* istanbul ignore next */ []));
|
|
326
346
|
/**
|
|
327
347
|
* Enable virtual scrolling, for rendering performance. Useful when rendering thousands of items.
|
|
328
348
|
*/
|
|
329
|
-
virtualScroll = input(false,
|
|
349
|
+
virtualScroll = input(false, /* @ts-ignore */
|
|
350
|
+
...(ngDevMode ? [{ debugName: "virtualScroll" }] : /* istanbul ignore next */ []));
|
|
330
351
|
/**
|
|
331
352
|
* The size of the items in the list (in pixels).
|
|
332
353
|
*/
|
|
333
|
-
virtualScrollItemSize = input(100,
|
|
354
|
+
virtualScrollItemSize = input(100, /* @ts-ignore */
|
|
355
|
+
...(ngDevMode ? [{ debugName: "virtualScrollItemSize" }] : /* istanbul ignore next */ []));
|
|
334
356
|
/**
|
|
335
357
|
* The number of pixels worth of buffer to render for when rendering new items. Defaults to 200px.
|
|
336
358
|
*/
|
|
337
|
-
virtualScrollMaxBufferPx = input(200,
|
|
359
|
+
virtualScrollMaxBufferPx = input(200, /* @ts-ignore */
|
|
360
|
+
...(ngDevMode ? [{ debugName: "virtualScrollMaxBufferPx" }] : /* istanbul ignore next */ []));
|
|
338
361
|
/**
|
|
339
362
|
* The minimum amount of buffer rendered beyond the viewport (in pixels).
|
|
340
363
|
* If the amount of buffer dips below this number, more items will be rendered. Defaults to 100px.
|
|
341
364
|
*/
|
|
342
|
-
virtualScrollMinBufferPx = input(100,
|
|
365
|
+
virtualScrollMinBufferPx = input(100, /* @ts-ignore */
|
|
366
|
+
...(ngDevMode ? [{ debugName: "virtualScrollMinBufferPx" }] : /* istanbul ignore next */ []));
|
|
343
367
|
/**
|
|
344
368
|
* Output click event emitter.
|
|
345
369
|
*/
|
|
@@ -448,7 +472,7 @@ class NgxTimelineComponent {
|
|
|
448
472
|
|| this.compareEventsField(prevEvent, event, ...(fieldsToCheckEventChangeSideInGroup[this.changeSide()] ?? []));
|
|
449
473
|
}
|
|
450
474
|
compareEventsField(prevEvent, event, ...fields) {
|
|
451
|
-
return fields.reduce((res, field) => res
|
|
475
|
+
return fields.reduce((res, field) => res || prevEvent.timestamp[field]() !== event.timestamp[field](), false);
|
|
452
476
|
}
|
|
453
477
|
getPeriodInfoFromPeriodKey(periodKey, firstGroupEvent) {
|
|
454
478
|
const split = periodKey.split(this.separator);
|
|
@@ -472,10 +496,10 @@ class NgxTimelineComponent {
|
|
|
472
496
|
getOrientationForVirtualScroll() {
|
|
473
497
|
return this.orientation().toLowerCase();
|
|
474
498
|
}
|
|
475
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
476
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.2", type: NgxTimelineComponent, isStandalone: true, selector: "ngx-timeline", inputs: { events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: true, transformFunction: null }, langCode: { classPropertyName: "langCode", publicName: "langCode", isSignal: true, isRequired: false, transformFunction: null }, enableAnimation: { classPropertyName: "enableAnimation", publicName: "enableAnimation", isSignal: true, isRequired: false, transformFunction: null }, reverseOrder: { classPropertyName: "reverseOrder", publicName: "reverseOrder", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, groupEvent: { classPropertyName: "groupEvent", publicName: "groupEvent", isSignal: true, isRequired: false, transformFunction: null }, changeSide: { classPropertyName: "changeSide", publicName: "changeSide", isSignal: true, isRequired: false, transformFunction: null }, periodCustomTemplate: { classPropertyName: "periodCustomTemplate", publicName: "periodCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventCustomTemplate: { classPropertyName: "eventCustomTemplate", publicName: "eventCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, centerIconCustomTemplate: { classPropertyName: "centerIconCustomTemplate", publicName: "centerIconCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, dateInstantCustomTemplate: { classPropertyName: "dateInstantCustomTemplate", publicName: "dateInstantCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, innerEventCustomTemplate: { classPropertyName: "innerEventCustomTemplate", publicName: "innerEventCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventDescriptionCustomTemplate: { classPropertyName: "eventDescriptionCustomTemplate", publicName: "eventDescriptionCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollItemSize: { classPropertyName: "virtualScrollItemSize", publicName: "virtualScrollItemSize", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollMaxBufferPx: { classPropertyName: "virtualScrollMaxBufferPx", publicName: "virtualScrollMaxBufferPx", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollMinBufferPx: { classPropertyName: "virtualScrollMinBufferPx", publicName: "virtualScrollMinBufferPx", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clickEmitter: "clickEmitter" }, usesOnChanges: true, ngImport: i0, template: "<div [ngClass]=\"virtualScroll() ? 'virtual-scroll-container' : 'main-container'\">\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n class=\"items-container\"\r\n [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\"\r\n [orientation]=\"getOrientationForVirtualScroll()\"\r\n [itemSize]=\"virtualScrollItemSize()\"\r\n [maxBufferPx]=\"virtualScrollMaxBufferPx()\"\r\n [minBufferPx]=\"virtualScrollMinBufferPx()\"\r\n >\r\n <div *cdkVirtualFor=\"let item of items\">\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item }\"\r\n ></ng-template>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n <div class=\"items-container\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\r\n @for (item of items; track item; let index = $index) {\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: index }\"\r\n ></ng-template>\r\n }\r\n </div>\r\n }\r\n</div>\r\n\r\n<ng-template #rowTemplate let-item=\"item\" let-index=\"index\">\r\n <div class=\"row\">\r\n <!-- DESKTOP -->\r\n <div class=\"col col-left desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_LEFT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"hour left\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n }\r\n @if (!item.periodInfo) {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"hour right\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <!-- MOBILE -->\r\n <div class=\"col col-left mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"hour left\">\r\n <div class=\"hour-inner-container\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n }\r\n @if (!item.periodInfo) {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #centerLinesIconTemplate let-index=index let-event=event>\r\n <div class=\"line\"></div>\r\n <ng-container *ngTemplateOutlet=\"centerIconCustomTemplate() || centerIconTemplate; context: {index:index, event:event}\"></ng-container>\r\n <div [class.transparent]=\"index === items.length - 1\" [class.last-line]=\"index === items.length - 1\" class=\"line\"></div>\r\n</ng-template>\r\n\r\n<ng-template #centerIconTemplate let-index=index let-event=event>\r\n <div class=\"center-icon-container\">\r\n <div class=\"icon\"></div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dateInstantTemplate let-item=item>\r\n <span>\r\n {{item?.timestamp | ngxdate : ngxDateFormat.HOURS_MINUTES : langCode()}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #periodContainerTemplate let-period=period let-index=index let-event=event>\r\n <div class=\"period-container\">\r\n <ng-container *ngTemplateOutlet=\"periodCustomTemplate() || periodTemplate; context: {period: period, index:index, event:event}\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #periodTemplate let-period=period>\r\n <div class=\"period-inner-container\">\r\n <span>{{period?.firstDate | ngxdate : getPeriodKeyDateFormat() : langCode()}}</span>\r\n </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #eventTemplate let-event=event let-colSidePosition=colSidePosition>\r\n <ngx-timeline-event\r\n [event]=\"event\"\r\n [langCode]=\"langCode()\"\r\n [orientation]=\"orientation()\"\r\n [enableAnimation]=\"enableAnimation()\"\r\n [innerEventCustomTemplate]=\"innerEventCustomTemplate()\"\r\n [eventDescriptionCustomTemplate]=\"eventDescriptionCustomTemplate()\"\r\n [colSidePosition]=\"colSidePosition\"\r\n (clickEmitter)=\"clickEmitter.emit($event)\">\r\n </ngx-timeline-event>\r\n</ng-template>\r\n\r\n", styles: ["::ng-deep :root{--ngx-timeline-period-inner-container: orange;--ngx-timeline-icon: orange;--ngx-timeline-line-background: #464646;--ngx-timeline-flex-display-col: 49 49 0;--ngx-timeline-flex-display-col-center: 2 2 0;--ngx-timeline-event-background: white;--ngx-timeline-event-divider-background: #e9e9e9;--ngx-timeline-event-text-color: black}.main-container,.virtual-scroll-container{display:flex;justify-content:center;width:100%}.virtual-scroll-container{height:100%}.virtual-scroll-container>.horizontal ::ng-deep .cdk-virtual-scroll-content-wrapper{width:max-content;display:flex;flex-direction:row}.virtual-scroll-container>.horizontal{min-height:0}.items-container{padding:1rem 0;min-width:max(20rem,100%)}.items-container.horizontal{display:flex;flex-direction:row;min-height:max(20rem,100%)}.items-container.horizontal .row{min-width:fit-content;flex-direction:column}.items-container.horizontal .row>[class*=col-]{display:flex;flex-direction:column;align-items:center}.items-container.horizontal .col-center{min-height:2rem}.items-container.horizontal .col-left{min-height:300px;align-items:center;justify-content:flex-end}.items-container.horizontal .col-right{min-height:300px;align-items:center;justify-content:flex-start}.items-container.horizontal .center-inner{display:flex;flex-direction:row}.items-container.horizontal .center-inner .line{max-width:50%;width:50%;height:.1rem;min-height:.1rem;max-height:.1rem}.items-container.horizontal .center-icon-container{padding:0 .5rem}.row{display:flex;flex-wrap:wrap}.row>[class*=col-]{display:flex;flex-direction:column;justify-content:center}.col-left{align-items:flex-end;padding:0;flex:var(--ngx-timeline-flex-display-col)}.col-right{align-items:flex-start;padding:0;flex:var(--ngx-timeline-flex-display-col)}.col-center:not(.col-period){min-height:10rem}.col-center{padding:0;flex:var(--ngx-timeline-flex-display-col-center)}.center-inner{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.center-inner .line{flex:50 50 0;background:var(--ngx-timeline-line-background);width:.1rem}.center-inner .line.transparent{background:transparent}.period-container .period-inner-container{color:#fff;border-radius:2px;background:var(--ngx-timeline-period-inner-container);width:max-content;padding:.2rem .5rem;z-index:10}.center-icon-container{padding:.8rem 0;display:flex;justify-content:center;align-items:center;position:relative;height:10px;width:10px}.center-icon-container .icon{height:1rem;width:1rem;border-radius:50%;background:var(--ngx-timeline-icon);margin:0;position:absolute}.event-outer-container{margin:0 .5rem;width:97%}.hour{padding:.5rem;background:none;display:flex;justify-content:center;align-items:center}.hour.right{justify-content:flex-start}.hour.left{justify-content:flex-end}.hour .hour-inner-container{margin:0}.desktop{display:flex!important}.mobile{display:none!important}@media(max-width:900px){.desktop{display:none!important}.mobile{display:flex!important}.items-container{min-width:max(20rem,95%)}.items-container.horizontal .event-outer-container{margin:0 .5rem}.items-container.horizontal .col-left{min-height:6rem}.items-container.horizontal .col-center{min-height:2rem}.event-outer-container{margin:.5rem .3rem}.col-left{align-items:flex-start}.col-left .hour{font-size:clamp(10px,2.5vw,12px);padding:0;margin-right:.3rem}.col-left.col-period{flex:14 14 0}.col-left.col-event{flex:17 17 0;padding:0;align-items:flex-end}.col-right{align-items:flex-start}.col-right.col-period{flex:77 77 0}.col-right.col-event{flex:77 77 0;padding:0}.col-center{justify-content:center;margin:0}.col-center.col-period,.col-center.col-event{flex:5 5 0}.center-inner{align-items:center}.period-container{height:fit-content;display:flex;justify-content:center;align-items:center;position:relative}.center-icon-container{align-items:center;justify-content:center}.center-icon-container .icon{height:1rem;width:1rem;position:absolute}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgxTimelineEventComponent, selector: "ngx-timeline-event", inputs: ["event", "colSidePosition", "langCode", "innerEventCustomTemplate", "eventDescriptionCustomTemplate", "enableAnimation", "orientation"], outputs: ["clickEmitter"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "pipe", type: NgxDatePipe, name: "ngxdate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
499
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxTimelineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
500
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.1", type: NgxTimelineComponent, isStandalone: true, selector: "ngx-timeline", inputs: { events: { classPropertyName: "events", publicName: "events", isSignal: true, isRequired: true, transformFunction: null }, langCode: { classPropertyName: "langCode", publicName: "langCode", isSignal: true, isRequired: false, transformFunction: null }, enableAnimation: { classPropertyName: "enableAnimation", publicName: "enableAnimation", isSignal: true, isRequired: false, transformFunction: null }, reverseOrder: { classPropertyName: "reverseOrder", publicName: "reverseOrder", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, groupEvent: { classPropertyName: "groupEvent", publicName: "groupEvent", isSignal: true, isRequired: false, transformFunction: null }, changeSide: { classPropertyName: "changeSide", publicName: "changeSide", isSignal: true, isRequired: false, transformFunction: null }, periodCustomTemplate: { classPropertyName: "periodCustomTemplate", publicName: "periodCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventCustomTemplate: { classPropertyName: "eventCustomTemplate", publicName: "eventCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, centerIconCustomTemplate: { classPropertyName: "centerIconCustomTemplate", publicName: "centerIconCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, dateInstantCustomTemplate: { classPropertyName: "dateInstantCustomTemplate", publicName: "dateInstantCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, innerEventCustomTemplate: { classPropertyName: "innerEventCustomTemplate", publicName: "innerEventCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, eventDescriptionCustomTemplate: { classPropertyName: "eventDescriptionCustomTemplate", publicName: "eventDescriptionCustomTemplate", isSignal: true, isRequired: false, transformFunction: null }, virtualScroll: { classPropertyName: "virtualScroll", publicName: "virtualScroll", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollItemSize: { classPropertyName: "virtualScrollItemSize", publicName: "virtualScrollItemSize", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollMaxBufferPx: { classPropertyName: "virtualScrollMaxBufferPx", publicName: "virtualScrollMaxBufferPx", isSignal: true, isRequired: false, transformFunction: null }, virtualScrollMinBufferPx: { classPropertyName: "virtualScrollMinBufferPx", publicName: "virtualScrollMinBufferPx", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { clickEmitter: "clickEmitter" }, usesOnChanges: true, ngImport: i0, template: "<div [ngClass]=\"virtualScroll() ? 'virtual-scroll-container' : 'main-container'\">\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n class=\"items-container\"\r\n [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\"\r\n [orientation]=\"getOrientationForVirtualScroll()\"\r\n [itemSize]=\"virtualScrollItemSize()\"\r\n [maxBufferPx]=\"virtualScrollMaxBufferPx()\"\r\n [minBufferPx]=\"virtualScrollMinBufferPx()\"\r\n >\r\n <div *cdkVirtualFor=\"let item of items\">\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item }\"\r\n ></ng-template>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n <div class=\"items-container\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\r\n @for (item of items; track item; let index = $index) {\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: index }\"\r\n ></ng-template>\r\n }\r\n </div>\r\n }\r\n</div>\r\n\r\n<ng-template #rowTemplate let-item=\"item\" let-index=\"index\">\r\n <div class=\"row\">\r\n <!-- DESKTOP -->\r\n <div class=\"col col-left desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_LEFT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"hour left\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n } @else {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"hour right\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <!-- MOBILE -->\r\n <div class=\"col col-left mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"hour left\">\r\n <div class=\"hour-inner-container\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n } @else {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #centerLinesIconTemplate let-index=index let-event=event>\r\n <div class=\"line\"></div>\r\n <ng-container *ngTemplateOutlet=\"centerIconCustomTemplate() || centerIconTemplate; context: {index:index, event:event}\"></ng-container>\r\n <div [class.transparent]=\"index === items.length - 1\" [class.last-line]=\"index === items.length - 1\" class=\"line\"></div>\r\n</ng-template>\r\n\r\n<ng-template #centerIconTemplate let-index=index let-event=event>\r\n <div class=\"center-icon-container\">\r\n <div class=\"icon\"></div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dateInstantTemplate let-item=item>\r\n <span>\r\n {{item?.timestamp | ngxdate : ngxDateFormat.HOURS_MINUTES : langCode()}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #periodContainerTemplate let-period=period let-index=index let-event=event>\r\n <div class=\"period-container\">\r\n <ng-container *ngTemplateOutlet=\"periodCustomTemplate() || periodTemplate; context: {period: period, index:index, event:event}\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #periodTemplate let-period=period>\r\n <div class=\"period-inner-container\">\r\n <span>{{period?.firstDate | ngxdate : getPeriodKeyDateFormat() : langCode()}}</span>\r\n </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #eventTemplate let-event=event let-colSidePosition=colSidePosition>\r\n <ngx-timeline-event\r\n [event]=\"event\"\r\n [langCode]=\"langCode()\"\r\n [orientation]=\"orientation()\"\r\n [enableAnimation]=\"enableAnimation()\"\r\n [innerEventCustomTemplate]=\"innerEventCustomTemplate()\"\r\n [eventDescriptionCustomTemplate]=\"eventDescriptionCustomTemplate()\"\r\n [colSidePosition]=\"colSidePosition\"\r\n (clickEmitter)=\"clickEmitter.emit($event)\">\r\n </ngx-timeline-event>\r\n</ng-template>\r\n\r\n", styles: ["::ng-deep :root{--ngx-timeline-period-inner-container: orange;--ngx-timeline-icon: orange;--ngx-timeline-line-background: #464646;--ngx-timeline-flex-display-col: 49 49 0;--ngx-timeline-flex-display-col-center: 2 2 0;--ngx-timeline-event-background: white;--ngx-timeline-event-divider-background: #e9e9e9;--ngx-timeline-event-text-color: black}.main-container,.virtual-scroll-container{display:flex;justify-content:center;width:100%}.virtual-scroll-container{height:100%}.virtual-scroll-container>.horizontal ::ng-deep .cdk-virtual-scroll-content-wrapper{width:max-content;display:flex;flex-direction:row}.virtual-scroll-container>.horizontal{min-height:0}.items-container{padding:1rem 0;min-width:max(20rem,100%)}.items-container.horizontal{display:flex;flex-direction:row;min-height:max(20rem,100%)}.items-container.horizontal .row{min-width:fit-content;flex-direction:column}.items-container.horizontal .row>[class*=col-]{display:flex;flex-direction:column;align-items:center}.items-container.horizontal .col-center{min-height:2rem}.items-container.horizontal .col-left{min-height:300px;align-items:center;justify-content:flex-end}.items-container.horizontal .col-right{min-height:300px;align-items:center;justify-content:flex-start}.items-container.horizontal .center-inner{display:flex;flex-direction:row}.items-container.horizontal .center-inner .line{max-width:50%;width:50%;height:.1rem;min-height:.1rem;max-height:.1rem}.items-container.horizontal .center-icon-container{padding:0 .5rem}.row{display:flex;flex-wrap:wrap}.row>[class*=col-]{display:flex;flex-direction:column;justify-content:center}.col-left{align-items:flex-end;padding:0;flex:var(--ngx-timeline-flex-display-col)}.col-right{align-items:flex-start;padding:0;flex:var(--ngx-timeline-flex-display-col)}.col-center:not(.col-period){min-height:10rem}.col-center{padding:0;flex:var(--ngx-timeline-flex-display-col-center)}.center-inner{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.center-inner .line{flex:50 50 0;background:var(--ngx-timeline-line-background);width:.1rem}.center-inner .line.transparent{background:transparent}.period-container .period-inner-container{color:#fff;border-radius:2px;background:var(--ngx-timeline-period-inner-container);width:max-content;padding:.2rem .5rem;z-index:10}.center-icon-container{padding:.8rem 0;display:flex;justify-content:center;align-items:center;position:relative;height:10px;width:10px}.center-icon-container .icon{height:1rem;width:1rem;border-radius:50%;background:var(--ngx-timeline-icon);margin:0;position:absolute}.event-outer-container{margin:0 .5rem;width:97%}.hour{padding:.5rem;background:none;display:flex;justify-content:center;align-items:center}.hour.right{justify-content:flex-start}.hour.left{justify-content:flex-end}.hour .hour-inner-container{margin:0}.desktop{display:flex!important}.mobile{display:none!important}@media(max-width:900px){.desktop{display:none!important}.mobile{display:flex!important}.items-container{min-width:max(20rem,95%)}.items-container.horizontal .event-outer-container{margin:0 .5rem}.items-container.horizontal .col-left{min-height:6rem}.items-container.horizontal .col-center{min-height:2rem}.event-outer-container{margin:.5rem .3rem}.col-left{align-items:flex-start}.col-left .hour{font-size:clamp(10px,2.5vw,12px);padding:0;margin-right:.3rem}.col-left.col-period{flex:14 14 0}.col-left.col-event{flex:17 17 0;padding:0;align-items:flex-end}.col-right{align-items:flex-start}.col-right.col-period{flex:77 77 0}.col-right.col-event{flex:77 77 0;padding:0}.col-center{justify-content:center;margin:0}.col-center.col-period,.col-center.col-event{flex:5 5 0}.center-inner{align-items:center}.period-container{height:fit-content;display:flex;justify-content:center;align-items:center;position:relative}.center-icon-container{align-items:center;justify-content:center}.center-icon-container .icon{height:1rem;width:1rem;position:absolute}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgxTimelineEventComponent, selector: "ngx-timeline-event", inputs: ["event", "colSidePosition", "langCode", "innerEventCustomTemplate", "eventDescriptionCustomTemplate", "enableAnimation", "orientation"], outputs: ["clickEmitter"] }, { kind: "ngmodule", type: ScrollingModule }, { kind: "directive", type: i1.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { kind: "directive", type: i1.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { kind: "component", type: i1.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { kind: "pipe", type: NgxDatePipe, name: "ngxdate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
477
501
|
}
|
|
478
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
502
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxTimelineComponent, decorators: [{
|
|
479
503
|
type: Component,
|
|
480
504
|
args: [{ selector: 'ngx-timeline', imports: [
|
|
481
505
|
NgClass,
|
|
@@ -483,7 +507,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.2", ngImpor
|
|
|
483
507
|
NgxDatePipe,
|
|
484
508
|
NgxTimelineEventComponent,
|
|
485
509
|
ScrollingModule,
|
|
486
|
-
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"virtualScroll() ? 'virtual-scroll-container' : 'main-container'\">\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n class=\"items-container\"\r\n [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\"\r\n [orientation]=\"getOrientationForVirtualScroll()\"\r\n [itemSize]=\"virtualScrollItemSize()\"\r\n [maxBufferPx]=\"virtualScrollMaxBufferPx()\"\r\n [minBufferPx]=\"virtualScrollMinBufferPx()\"\r\n >\r\n <div *cdkVirtualFor=\"let item of items\">\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item }\"\r\n ></ng-template>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n <div class=\"items-container\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\r\n @for (item of items; track item; let index = $index) {\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: index }\"\r\n ></ng-template>\r\n }\r\n </div>\r\n }\r\n</div>\r\n\r\n<ng-template #rowTemplate let-item=\"item\" let-index=\"index\">\r\n <div class=\"row\">\r\n <!-- DESKTOP -->\r\n <div class=\"col col-left desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_LEFT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"hour left\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n }\r\n @if (!item.periodInfo) {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"hour right\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <!-- MOBILE -->\r\n <div class=\"col col-left mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"hour left\">\r\n <div class=\"hour-inner-container\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n }\r\n @if (!item.periodInfo) {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #centerLinesIconTemplate let-index=index let-event=event>\r\n <div class=\"line\"></div>\r\n <ng-container *ngTemplateOutlet=\"centerIconCustomTemplate() || centerIconTemplate; context: {index:index, event:event}\"></ng-container>\r\n <div [class.transparent]=\"index === items.length - 1\" [class.last-line]=\"index === items.length - 1\" class=\"line\"></div>\r\n</ng-template>\r\n\r\n<ng-template #centerIconTemplate let-index=index let-event=event>\r\n <div class=\"center-icon-container\">\r\n <div class=\"icon\"></div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dateInstantTemplate let-item=item>\r\n <span>\r\n {{item?.timestamp | ngxdate : ngxDateFormat.HOURS_MINUTES : langCode()}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #periodContainerTemplate let-period=period let-index=index let-event=event>\r\n <div class=\"period-container\">\r\n <ng-container *ngTemplateOutlet=\"periodCustomTemplate() || periodTemplate; context: {period: period, index:index, event:event}\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #periodTemplate let-period=period>\r\n <div class=\"period-inner-container\">\r\n <span>{{period?.firstDate | ngxdate : getPeriodKeyDateFormat() : langCode()}}</span>\r\n </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #eventTemplate let-event=event let-colSidePosition=colSidePosition>\r\n <ngx-timeline-event\r\n [event]=\"event\"\r\n [langCode]=\"langCode()\"\r\n [orientation]=\"orientation()\"\r\n [enableAnimation]=\"enableAnimation()\"\r\n [innerEventCustomTemplate]=\"innerEventCustomTemplate()\"\r\n [eventDescriptionCustomTemplate]=\"eventDescriptionCustomTemplate()\"\r\n [colSidePosition]=\"colSidePosition\"\r\n (clickEmitter)=\"clickEmitter.emit($event)\">\r\n </ngx-timeline-event>\r\n</ng-template>\r\n\r\n", styles: ["::ng-deep :root{--ngx-timeline-period-inner-container: orange;--ngx-timeline-icon: orange;--ngx-timeline-line-background: #464646;--ngx-timeline-flex-display-col: 49 49 0;--ngx-timeline-flex-display-col-center: 2 2 0;--ngx-timeline-event-background: white;--ngx-timeline-event-divider-background: #e9e9e9;--ngx-timeline-event-text-color: black}.main-container,.virtual-scroll-container{display:flex;justify-content:center;width:100%}.virtual-scroll-container{height:100%}.virtual-scroll-container>.horizontal ::ng-deep .cdk-virtual-scroll-content-wrapper{width:max-content;display:flex;flex-direction:row}.virtual-scroll-container>.horizontal{min-height:0}.items-container{padding:1rem 0;min-width:max(20rem,100%)}.items-container.horizontal{display:flex;flex-direction:row;min-height:max(20rem,100%)}.items-container.horizontal .row{min-width:fit-content;flex-direction:column}.items-container.horizontal .row>[class*=col-]{display:flex;flex-direction:column;align-items:center}.items-container.horizontal .col-center{min-height:2rem}.items-container.horizontal .col-left{min-height:300px;align-items:center;justify-content:flex-end}.items-container.horizontal .col-right{min-height:300px;align-items:center;justify-content:flex-start}.items-container.horizontal .center-inner{display:flex;flex-direction:row}.items-container.horizontal .center-inner .line{max-width:50%;width:50%;height:.1rem;min-height:.1rem;max-height:.1rem}.items-container.horizontal .center-icon-container{padding:0 .5rem}.row{display:flex;flex-wrap:wrap}.row>[class*=col-]{display:flex;flex-direction:column;justify-content:center}.col-left{align-items:flex-end;padding:0;flex:var(--ngx-timeline-flex-display-col)}.col-right{align-items:flex-start;padding:0;flex:var(--ngx-timeline-flex-display-col)}.col-center:not(.col-period){min-height:10rem}.col-center{padding:0;flex:var(--ngx-timeline-flex-display-col-center)}.center-inner{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.center-inner .line{flex:50 50 0;background:var(--ngx-timeline-line-background);width:.1rem}.center-inner .line.transparent{background:transparent}.period-container .period-inner-container{color:#fff;border-radius:2px;background:var(--ngx-timeline-period-inner-container);width:max-content;padding:.2rem .5rem;z-index:10}.center-icon-container{padding:.8rem 0;display:flex;justify-content:center;align-items:center;position:relative;height:10px;width:10px}.center-icon-container .icon{height:1rem;width:1rem;border-radius:50%;background:var(--ngx-timeline-icon);margin:0;position:absolute}.event-outer-container{margin:0 .5rem;width:97%}.hour{padding:.5rem;background:none;display:flex;justify-content:center;align-items:center}.hour.right{justify-content:flex-start}.hour.left{justify-content:flex-end}.hour .hour-inner-container{margin:0}.desktop{display:flex!important}.mobile{display:none!important}@media(max-width:900px){.desktop{display:none!important}.mobile{display:flex!important}.items-container{min-width:max(20rem,95%)}.items-container.horizontal .event-outer-container{margin:0 .5rem}.items-container.horizontal .col-left{min-height:6rem}.items-container.horizontal .col-center{min-height:2rem}.event-outer-container{margin:.5rem .3rem}.col-left{align-items:flex-start}.col-left .hour{font-size:clamp(10px,2.5vw,12px);padding:0;margin-right:.3rem}.col-left.col-period{flex:14 14 0}.col-left.col-event{flex:17 17 0;padding:0;align-items:flex-end}.col-right{align-items:flex-start}.col-right.col-period{flex:77 77 0}.col-right.col-event{flex:77 77 0;padding:0}.col-center{justify-content:center;margin:0}.col-center.col-period,.col-center.col-event{flex:5 5 0}.center-inner{align-items:center}.period-container{height:fit-content;display:flex;justify-content:center;align-items:center;position:relative}.center-icon-container{align-items:center;justify-content:center}.center-icon-container .icon{height:1rem;width:1rem;position:absolute}}\n"] }]
|
|
510
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [ngClass]=\"virtualScroll() ? 'virtual-scroll-container' : 'main-container'\">\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n class=\"items-container\"\r\n [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\"\r\n [orientation]=\"getOrientationForVirtualScroll()\"\r\n [itemSize]=\"virtualScrollItemSize()\"\r\n [maxBufferPx]=\"virtualScrollMaxBufferPx()\"\r\n [minBufferPx]=\"virtualScrollMinBufferPx()\"\r\n >\r\n <div *cdkVirtualFor=\"let item of items\">\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item }\"\r\n ></ng-template>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n <div class=\"items-container\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\r\n @for (item of items; track item; let index = $index) {\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: index }\"\r\n ></ng-template>\r\n }\r\n </div>\r\n }\r\n</div>\r\n\r\n<ng-template #rowTemplate let-item=\"item\" let-index=\"index\">\r\n <div class=\"row\">\r\n <!-- DESKTOP -->\r\n <div class=\"col col-left desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_LEFT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"hour left\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n } @else {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"hour right\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <!-- MOBILE -->\r\n <div class=\"col col-left mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"hour left\">\r\n <div class=\"hour-inner-container\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n } @else {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #centerLinesIconTemplate let-index=index let-event=event>\r\n <div class=\"line\"></div>\r\n <ng-container *ngTemplateOutlet=\"centerIconCustomTemplate() || centerIconTemplate; context: {index:index, event:event}\"></ng-container>\r\n <div [class.transparent]=\"index === items.length - 1\" [class.last-line]=\"index === items.length - 1\" class=\"line\"></div>\r\n</ng-template>\r\n\r\n<ng-template #centerIconTemplate let-index=index let-event=event>\r\n <div class=\"center-icon-container\">\r\n <div class=\"icon\"></div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dateInstantTemplate let-item=item>\r\n <span>\r\n {{item?.timestamp | ngxdate : ngxDateFormat.HOURS_MINUTES : langCode()}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #periodContainerTemplate let-period=period let-index=index let-event=event>\r\n <div class=\"period-container\">\r\n <ng-container *ngTemplateOutlet=\"periodCustomTemplate() || periodTemplate; context: {period: period, index:index, event:event}\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #periodTemplate let-period=period>\r\n <div class=\"period-inner-container\">\r\n <span>{{period?.firstDate | ngxdate : getPeriodKeyDateFormat() : langCode()}}</span>\r\n </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #eventTemplate let-event=event let-colSidePosition=colSidePosition>\r\n <ngx-timeline-event\r\n [event]=\"event\"\r\n [langCode]=\"langCode()\"\r\n [orientation]=\"orientation()\"\r\n [enableAnimation]=\"enableAnimation()\"\r\n [innerEventCustomTemplate]=\"innerEventCustomTemplate()\"\r\n [eventDescriptionCustomTemplate]=\"eventDescriptionCustomTemplate()\"\r\n [colSidePosition]=\"colSidePosition\"\r\n (clickEmitter)=\"clickEmitter.emit($event)\">\r\n </ngx-timeline-event>\r\n</ng-template>\r\n\r\n", styles: ["::ng-deep :root{--ngx-timeline-period-inner-container: orange;--ngx-timeline-icon: orange;--ngx-timeline-line-background: #464646;--ngx-timeline-flex-display-col: 49 49 0;--ngx-timeline-flex-display-col-center: 2 2 0;--ngx-timeline-event-background: white;--ngx-timeline-event-divider-background: #e9e9e9;--ngx-timeline-event-text-color: black}.main-container,.virtual-scroll-container{display:flex;justify-content:center;width:100%}.virtual-scroll-container{height:100%}.virtual-scroll-container>.horizontal ::ng-deep .cdk-virtual-scroll-content-wrapper{width:max-content;display:flex;flex-direction:row}.virtual-scroll-container>.horizontal{min-height:0}.items-container{padding:1rem 0;min-width:max(20rem,100%)}.items-container.horizontal{display:flex;flex-direction:row;min-height:max(20rem,100%)}.items-container.horizontal .row{min-width:fit-content;flex-direction:column}.items-container.horizontal .row>[class*=col-]{display:flex;flex-direction:column;align-items:center}.items-container.horizontal .col-center{min-height:2rem}.items-container.horizontal .col-left{min-height:300px;align-items:center;justify-content:flex-end}.items-container.horizontal .col-right{min-height:300px;align-items:center;justify-content:flex-start}.items-container.horizontal .center-inner{display:flex;flex-direction:row}.items-container.horizontal .center-inner .line{max-width:50%;width:50%;height:.1rem;min-height:.1rem;max-height:.1rem}.items-container.horizontal .center-icon-container{padding:0 .5rem}.row{display:flex;flex-wrap:wrap}.row>[class*=col-]{display:flex;flex-direction:column;justify-content:center}.col-left{align-items:flex-end;padding:0;flex:var(--ngx-timeline-flex-display-col)}.col-right{align-items:flex-start;padding:0;flex:var(--ngx-timeline-flex-display-col)}.col-center:not(.col-period){min-height:10rem}.col-center{padding:0;flex:var(--ngx-timeline-flex-display-col-center)}.center-inner{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.center-inner .line{flex:50 50 0;background:var(--ngx-timeline-line-background);width:.1rem}.center-inner .line.transparent{background:transparent}.period-container .period-inner-container{color:#fff;border-radius:2px;background:var(--ngx-timeline-period-inner-container);width:max-content;padding:.2rem .5rem;z-index:10}.center-icon-container{padding:.8rem 0;display:flex;justify-content:center;align-items:center;position:relative;height:10px;width:10px}.center-icon-container .icon{height:1rem;width:1rem;border-radius:50%;background:var(--ngx-timeline-icon);margin:0;position:absolute}.event-outer-container{margin:0 .5rem;width:97%}.hour{padding:.5rem;background:none;display:flex;justify-content:center;align-items:center}.hour.right{justify-content:flex-start}.hour.left{justify-content:flex-end}.hour .hour-inner-container{margin:0}.desktop{display:flex!important}.mobile{display:none!important}@media(max-width:900px){.desktop{display:none!important}.mobile{display:flex!important}.items-container{min-width:max(20rem,95%)}.items-container.horizontal .event-outer-container{margin:0 .5rem}.items-container.horizontal .col-left{min-height:6rem}.items-container.horizontal .col-center{min-height:2rem}.event-outer-container{margin:.5rem .3rem}.col-left{align-items:flex-start}.col-left .hour{font-size:clamp(10px,2.5vw,12px);padding:0;margin-right:.3rem}.col-left.col-period{flex:14 14 0}.col-left.col-event{flex:17 17 0;padding:0;align-items:flex-end}.col-right{align-items:flex-start}.col-right.col-period{flex:77 77 0}.col-right.col-event{flex:77 77 0;padding:0}.col-center{justify-content:center;margin:0}.col-center.col-period,.col-center.col-event{flex:5 5 0}.center-inner{align-items:center}.period-container{height:fit-content;display:flex;justify-content:center;align-items:center;position:relative}.center-icon-container{align-items:center;justify-content:center}.center-icon-container .icon{height:1rem;width:1rem;position:absolute}}\n"] }]
|
|
487
511
|
}], propDecorators: { events: [{ type: i0.Input, args: [{ isSignal: true, alias: "events", required: true }] }], langCode: [{ type: i0.Input, args: [{ isSignal: true, alias: "langCode", required: false }] }], enableAnimation: [{ type: i0.Input, args: [{ isSignal: true, alias: "enableAnimation", required: false }] }], reverseOrder: [{ type: i0.Input, args: [{ isSignal: true, alias: "reverseOrder", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], groupEvent: [{ type: i0.Input, args: [{ isSignal: true, alias: "groupEvent", required: false }] }], changeSide: [{ type: i0.Input, args: [{ isSignal: true, alias: "changeSide", required: false }] }], periodCustomTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "periodCustomTemplate", required: false }] }], eventCustomTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "eventCustomTemplate", required: false }] }], centerIconCustomTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "centerIconCustomTemplate", required: false }] }], dateInstantCustomTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "dateInstantCustomTemplate", required: false }] }], innerEventCustomTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "innerEventCustomTemplate", required: false }] }], eventDescriptionCustomTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "eventDescriptionCustomTemplate", required: false }] }], virtualScroll: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScroll", required: false }] }], virtualScrollItemSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollItemSize", required: false }] }], virtualScrollMaxBufferPx: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollMaxBufferPx", required: false }] }], virtualScrollMinBufferPx: [{ type: i0.Input, args: [{ isSignal: true, alias: "virtualScrollMinBufferPx", required: false }] }], clickEmitter: [{ type: i0.Output, args: ["clickEmitter"] }] } });
|
|
488
512
|
|
|
489
513
|
registerLocaleData(localeDe);
|
|
@@ -497,11 +521,11 @@ registerLocaleData(localeSl);
|
|
|
497
521
|
registerLocaleData(localeTr);
|
|
498
522
|
registerLocaleData(localeNo);
|
|
499
523
|
class NgxTimelineModule {
|
|
500
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "
|
|
501
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "
|
|
502
|
-
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "
|
|
524
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxTimelineModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
525
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.0.1", ngImport: i0, type: NgxTimelineModule, imports: [NgxDatePipe, NgxTimelineComponent, NgxTimelineEventComponent], exports: [NgxDatePipe, NgxTimelineComponent] });
|
|
526
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxTimelineModule, imports: [NgxTimelineComponent] });
|
|
503
527
|
}
|
|
504
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "
|
|
528
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.1", ngImport: i0, type: NgxTimelineModule, decorators: [{
|
|
505
529
|
type: NgModule,
|
|
506
530
|
args: [{
|
|
507
531
|
imports: [NgxDatePipe, NgxTimelineComponent, NgxTimelineEventComponent],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"frxjs-ngx-timeline.mjs","sources":["../../../projects/ngx-timeline/src/lib/models/NgxConfigObj.ts","../../../projects/ngx-timeline/src/lib/models/NgxTimelineEvent.ts","../../../projects/ngx-timeline/src/lib/pipes/ngx-date-pipe.ts","../../../projects/ngx-timeline/src/lib/components/ngx-timeline-event/ngx-timeline-event.component.ts","../../../projects/ngx-timeline/src/lib/components/ngx-timeline-event/ngx-timeline-event.component.html","../../../projects/ngx-timeline/src/lib/components/ngx-timeline.component.ts","../../../projects/ngx-timeline/src/lib/components/ngx-timeline.component.html","../../../projects/ngx-timeline/src/lib/ngx-timeline.module.ts","../../../projects/ngx-timeline/src/public-api.ts","../../../projects/ngx-timeline/src/frxjs-ngx-timeline.ts"],"sourcesContent":["export const supportedLanguageCodes = ['en', 'it', 'fr', 'de', 'es', 'sl', 'tr', 'pl', 'pt', 'ru', 'nb'] as const;\nexport type SupportedLanguageCode = typeof supportedLanguageCodes[number];\nexport const defaultSupportedLanguageCode: SupportedLanguageCode = supportedLanguageCodes[0];\n\nexport interface NgxConfigDate {\n code: string;\n dayMonthYear: string;\n fullDate: string;\n hoursMinutes: string;\n monthYear: string;\n year: string;\n}\n\nexport const dateConfigMap: Record<SupportedLanguageCode, NgxConfigDate> = {\n en: {\n code: 'en-US',\n fullDate: 'MM/dd/yyyy h:mm a',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'hh:mm a',\n },\n it: {\n code: 'it-IT',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n fr: {\n code: 'fr-FR',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n de: {\n code: 'de',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n es: {\n code: 'es',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n sl: {\n code: 'sl-SL',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n tr: {\n code: 'tr',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n pl: {\n code: 'pl',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n pt: {\n code: 'pt',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n ru: {\n code: 'ru-RU',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n nb: {\n code: 'nb-NO',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n};\n\nexport enum NgxDateFormat {\n DAY_MONTH_YEAR = 'DAY_MONTH_YEAR',\n FULL_DATE = 'FULL_DATE',\n HOURS_MINUTES = 'HOURS_MINUTES',\n MONTH_YEAR = 'MONTH_YEAR',\n YEAR = 'YEAR',\n}\n\nexport const fieldConfigDate: Record<NgxDateFormat, keyof NgxConfigDate> = {\n DAY_MONTH_YEAR: 'dayMonthYear',\n FULL_DATE: 'fullDate',\n HOURS_MINUTES: 'hoursMinutes',\n MONTH_YEAR: 'monthYear',\n YEAR: 'year',\n};\n\n/**\n * Enum used to set the group event logic\n */\nexport enum NgxTimelineEventGroup {\n YEAR = 'YEAR',\n MONTH_YEAR = 'MONTH_YEAR',\n DAY_MONTH_YEAR = 'DAY_MONTH_YEAR',\n}\n\nexport const fieldsToAddEventGroup: Record<NgxTimelineEventGroup, string[]> = {\n YEAR: ['getFullYear'],\n MONTH_YEAR: ['getFullYear', 'getMonth'],\n DAY_MONTH_YEAR: ['getFullYear', 'getMonth', 'getDate'],\n};\n\nexport const periodKeyDateFormat: Record<NgxTimelineEventGroup, NgxDateFormat> = {\n YEAR: NgxDateFormat.YEAR,\n MONTH_YEAR: NgxDateFormat.MONTH_YEAR,\n DAY_MONTH_YEAR: NgxDateFormat.DAY_MONTH_YEAR,\n};\n\n/**\n * Enum used to set the group event logic.\n */\nexport enum NgxTimelineOrientation {\n HORIZONTAL = 'HORIZONTAL',\n VERTICAL = 'VERTICAL',\n}\n\n/**\n * Enum used to set the change side event logic.\n */\nexport enum NgxTimelineEventChangeSide {\n ALL = 'ALL',\n ALL_IN_GROUP = 'ALL_IN_GROUP',\n ON_DIFFERENT_DAY_IN_GROUP = 'ON_DIFFERENT_DAY_IN_GROUP',\n ON_DIFFERENT_HMS_IN_GROUP = 'ON_DIFFERENT_HMS_IN_GROUP',\n ON_DIFFERENT_MONTH_IN_GROUP = 'ON_DIFFERENT_MONTH_IN_GROUP',\n}\n\nexport const fieldsToCheckEventChangeSideInGroup: Partial<Record<NgxTimelineEventChangeSide, string[]>> = {\n ON_DIFFERENT_DAY_IN_GROUP: ['getFullYear', 'getMonth', 'getDate'],\n ON_DIFFERENT_MONTH_IN_GROUP: ['getFullYear', 'getMonth'],\n ON_DIFFERENT_HMS_IN_GROUP: ['getFullYear', 'getMonth', 'getDate', 'getHours', 'getMinutes', 'getSeconds'],\n};\n","/**\n * Event to be provided from outside the timeline.\n */\nexport interface NgxTimelineEvent {\n timestamp: Date;\n title?: string;\n description?: string;\n id?: unknown;\n itemPosition?: NgxTimelineItemPosition;\n}\n\nexport interface NgxTimelinePeriodInfo {\n periodKey?: string;\n year?: number;\n month?: number;\n day?: number;\n firstDate?: Date;\n}\n\n/**\n * Item used inside the timeline.\n */\nexport interface NgxTimelineItem {\n position?: NgxTimelineItemPosition.ON_LEFT | NgxTimelineItemPosition.ON_RIGHT;\n periodInfo?: NgxTimelinePeriodInfo;\n eventInfo?: NgxTimelineEvent;\n}\n\nexport enum NgxTimelineItemPosition {\n ON_LEFT = 'ON_LEFT',\n ON_RIGHT = 'ON_RIGHT',\n}\n","import { DatePipe } from '@angular/common';\nimport { Pipe, PipeTransform } from '@angular/core';\n\nimport { dateConfigMap, defaultSupportedLanguageCode, fieldConfigDate, NgxConfigDate, NgxDateFormat, SupportedLanguageCode } from '../models';\n\n@Pipe({\n name: 'ngxdate',\n})\nexport class NgxDatePipe implements PipeTransform {\n // eslint-disable-next-line @typescript-eslint/no-redundant-type-constituents\n transform(date: Date | string, dateFormat?: NgxDateFormat | string, langCode?: SupportedLanguageCode): string | null {\n const configDate = this.getDateConfig(langCode);\n let dateFormatString = 'yyyy';\n if (dateFormat === undefined) {\n console.warn('frxjs-ngx-timeline: no date format defined.');\n }\n else if (dateFormat in NgxDateFormat) {\n dateFormatString = this.dateFormat(dateFormat as NgxDateFormat, configDate);\n }\n else if (typeof dateFormat === 'string') {\n dateFormatString = dateFormat;\n }\n return new DatePipe(configDate.code).transform(new Date(date), dateFormatString);\n }\n\n private dateFormat(dateFormat: NgxDateFormat, configDate: NgxConfigDate): string {\n return configDate[fieldConfigDate[dateFormat]];\n }\n\n private getDateConfig(langCode?: SupportedLanguageCode): NgxConfigDate {\n const code: SupportedLanguageCode = langCode ?? defaultSupportedLanguageCode;\n return dateConfigMap[code];\n }\n}\n","import { DatePipe, NgTemplateOutlet, TitleCasePipe } from '@angular/common';\nimport { Component, output, TemplateRef, input, ChangeDetectionStrategy, computed } from '@angular/core';\n\nimport { defaultSupportedLanguageCode, NgxTimelineOrientation, SupportedLanguageCode } from '../../models';\nimport { NgxTimelineItem, NgxTimelineItemPosition } from '../../models/NgxTimelineEvent';\n\n@Component({\n selector: 'ngx-timeline-event',\n imports: [\n NgTemplateOutlet,\n TitleCasePipe,\n ],\n templateUrl: './ngx-timeline-event.component.html',\n styleUrl: './ngx-timeline-event.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NgxTimelineEventComponent {\n /**\n * Event to be displayed.\n */\n readonly event = input.required<NgxTimelineItem>();\n /**\n * Event position respect to the vertical line (LEFT or RIGHT).\n */\n readonly colSidePosition = input<NgxTimelineItemPosition>();\n /**\n * Language code used to format the dates.\n */\n readonly langCode = input<SupportedLanguageCode>(defaultSupportedLanguageCode);\n /**\n * Inner custom template used to display the event detail.\n */\n readonly innerEventCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Inner custom template used to display the event description.\n */\n readonly eventDescriptionCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Boolean used to enable or disable the animations.\n */\n readonly enableAnimation = input(true);\n /**\n * Orientation of the timeline.\n */\n readonly orientation = input<NgxTimelineOrientation>(NgxTimelineOrientation.VERTICAL);\n /**\n * Output click event emitter.\n */\n readonly clickEmitter = output<NgxTimelineItem>();\n\n ngxTimelineItemPosition = NgxTimelineItemPosition;\n ngxTimelineOrientation = NgxTimelineOrientation;\n readonly dateObjSignal = computed(() => !this.event() ? null : this.getDateObj());\n\n private readonly monthAbbr = 'MMM';\n private readonly dayFormat = 'dd';\n\n getDateObj(): { day: unknown; month: unknown; year: unknown } {\n let day = undefined;\n let month = undefined;\n let year = undefined;\n const dateTimestamp = this.event().eventInfo?.timestamp;\n if (dateTimestamp) {\n const timestamp = new Date(dateTimestamp);\n const langCode = this.getLangCode();\n month = new DatePipe(langCode).transform(timestamp, this.monthAbbr);\n day = new DatePipe(langCode).transform(timestamp, this.dayFormat);\n year = timestamp.getFullYear();\n }\n\n return { day, month, year };\n }\n\n protected getLangCode(): SupportedLanguageCode {\n return this.langCode();\n }\n}\n","<div class=\"event-wrapper-container\" (click)=\"clickEmitter.emit(event())\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\n @if (colSidePosition()===ngxTimelineItemPosition.ON_RIGHT) {\n <div class=\"arrow left\"></div>\n }\n <div class=\"event\" [class.enableAnimation]=\"enableAnimation()\">\n <ng-container *ngTemplateOutlet=\"innerEventCustomTemplate() || innerEventContainer; context: {event: event()}\"></ng-container>\n </div>\n @if (colSidePosition() === ngxTimelineItemPosition.ON_LEFT) {\n <div class=\"arrow right\"></div>\n }\n</div>\n\n<ng-template #innerEventContainer let-event=event>\n <div class=\"event-container\" [class.reverse]=\"colSidePosition() === ngxTimelineItemPosition.ON_LEFT\">\n <div class=\"event-info-container\">\n <div class=\"event-info-header\">\n <div class=\"title-container\">{{event?.eventInfo?.title | titlecase}}</div>\n </div>\n <div class=\"event-info-body\">\n <ng-container *ngTemplateOutlet=\"eventDescriptionCustomTemplate() || eventDescriptionContainer; context: {event: event}\"></ng-container>\n </div>\n </div>\n\n <div class=\"event-divider-container\">\n <hr>\n </div>\n\n @if (dateObjSignal(); as dateObj) {\n <div class=\"event-date-container\">\n <div>\n <p>{{dateObj.month}}</p>\n </div>\n <div>\n <p class=\"day\">{{dateObj.day}}</p>\n </div>\n <div>\n <p>{{dateObj.year}}</p>\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n\n<ng-template #eventDescriptionContainer let-event=event>\n <p class=\"event-info-description\">{{event?.eventInfo?.description}}</p>\n</ng-template>\n","import { ScrollingModule } from '@angular/cdk/scrolling';\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport { Component, DoCheck, inject, IterableDiffer, IterableDiffers, OnChanges, TemplateRef, input, output, ChangeDetectionStrategy } from '@angular/core';\n\nimport {\n NgxTimelineEvent,\n NgxTimelineItem,\n NgxTimelineItemPosition,\n NgxTimelineOrientation,\n NgxTimelinePeriodInfo,\n NgxDateFormat,\n NgxTimelineEventGroup,\n NgxTimelineEventChangeSide,\n periodKeyDateFormat,\n fieldsToCheckEventChangeSideInGroup as fieldsToCheckEventChangeSide,\n fieldsToAddEventGroup, SupportedLanguageCode, defaultSupportedLanguageCode,\n} from '../models';\nimport { NgxDatePipe } from '../pipes';\nimport { NgxTimelineEventComponent } from './ngx-timeline-event/ngx-timeline-event.component';\n\n@Component({\n selector: 'ngx-timeline',\n imports: [\n NgClass,\n NgTemplateOutlet,\n NgxDatePipe,\n NgxTimelineEventComponent,\n ScrollingModule,\n ],\n templateUrl: './ngx-timeline.component.html',\n styleUrl: './ngx-timeline.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NgxTimelineComponent implements OnChanges, DoCheck {\n /**\n * List of events to be displayed.\n */\n readonly events = input.required<NgxTimelineEvent[]>();\n /**\n * Language code used to show the date formatted.\n */\n readonly langCode = input<SupportedLanguageCode>(defaultSupportedLanguageCode);\n /**\n * Boolean used to enable or disable the animations.\n */\n readonly enableAnimation = input<boolean>(true);\n /**\n * Boolean used to reverse sort order (default older first).\n */\n readonly reverseOrder = input<boolean>(false);\n /**\n * Orientation of the timeline.\n */\n readonly orientation = input<NgxTimelineOrientation>(NgxTimelineOrientation.VERTICAL);\n /**\n * Logic to be applied in order to group events.\n */\n readonly groupEvent = input<NgxTimelineEventGroup>(NgxTimelineEventGroup.MONTH_YEAR);\n /**\n * Logic to be applied in order to put events on LEFT or RIGHT.\n */\n readonly changeSide = input<NgxTimelineEventChangeSide>(NgxTimelineEventChangeSide.ON_DIFFERENT_DAY_IN_GROUP);\n /**\n * Custom Template displayed before a group of events.\n */\n readonly periodCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Custom Template displayed to show a single event.\n */\n readonly eventCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Custom Template displayed to show a separator icon.\n */\n readonly centerIconCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Custom Template displayed to show the side date.\n */\n readonly dateInstantCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Custom Template displayed to show the inner event.\n */\n readonly innerEventCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Inner custom template used to display the event description.\n */\n readonly eventDescriptionCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Enable virtual scrolling, for rendering performance. Useful when rendering thousands of items.\n */\n readonly virtualScroll = input<boolean>(false);\n /**\n * The size of the items in the list (in pixels).\n */\n readonly virtualScrollItemSize = input<number>(100);\n /**\n * The number of pixels worth of buffer to render for when rendering new items. Defaults to 200px.\n */\n readonly virtualScrollMaxBufferPx = input<number>(200);\n /**\n * The minimum amount of buffer rendered beyond the viewport (in pixels).\n * If the amount of buffer dips below this number, more items will be rendered. Defaults to 100px.\n */\n readonly virtualScrollMinBufferPx = input<number>(100);\n /**\n * Output click event emitter.\n */\n readonly clickEmitter = output<NgxTimelineItem>();\n\n groups: Record<string, NgxTimelineEvent[]> = {};\n periods: NgxTimelineItem[] = [];\n items: NgxTimelineItem[] = [];\n ngxTimelineItemPosition = NgxTimelineItemPosition;\n ngxTimelineOrientation = NgxTimelineOrientation;\n ngxDateFormat = NgxDateFormat;\n\n private differs: IterableDiffers = inject(IterableDiffers);\n private iterableDiffer: IterableDiffer<unknown> = this.differs.find([]).create();\n private readonly separator = '/';\n\n ngOnChanges(): void {\n this.groupEvents(this.events());\n }\n\n ngDoCheck(): void {\n const changes = this.iterableDiffer.diff(this.events());\n if (changes) {\n this.groupEvents(this.events());\n }\n }\n\n getPeriodKeyDateFormat(): string {\n return periodKeyDateFormat[this.groupEvent()];\n }\n\n protected clear(): void {\n this.groups = {};\n this.periods = [];\n this.items = [];\n }\n\n protected groupEvents(events: NgxTimelineEvent[]): void {\n if (events) {\n this.clear();\n this.sortEvents(events);\n this.setGroupsAndPeriods(events);\n this.setItems();\n }\n }\n\n protected sortEvents(events: NgxTimelineEvent[]): void {\n events.sort((a, b) => {\n const aTime: number = a.timestamp.getTime();\n const bTime: number = b.timestamp.getTime();\n return this.reverseOrder() ? bTime - aTime : aTime - bTime;\n });\n }\n\n protected setGroupsAndPeriods(events: NgxTimelineEvent[]): void {\n this.periods = [];\n events.forEach((event) => {\n // conversion from string to actual Date\n event.timestamp = new Date(event.timestamp);\n const periodKey = this.getPeriodKeyFromEvent(event);\n if (!this.groups[periodKey]) {\n this.groups[periodKey] = [];\n this.periods.push({ periodInfo: this.getPeriodInfoFromPeriodKey(periodKey, event) });\n }\n this.groups[periodKey].push(event);\n });\n }\n\n protected setItems(): void {\n let isLastItemOnLeft = false;\n this.periods.forEach((p) => {\n // insert first the period\n this.items.push(p);\n // in each period putting items on left\n let onLeft = true;\n if (this.changeSide() === NgxTimelineEventChangeSide.ALL) {\n onLeft = !isLastItemOnLeft;\n }\n const periodInfo: NgxTimelinePeriodInfo | undefined = p.periodInfo;\n if (periodInfo) {\n // insert then all the events in this period\n isLastItemOnLeft = this.addPeriodEvents(periodInfo, onLeft);\n // onLeft = this.addEventItemsAndGetIfOnLeft(periodInfo, onLeft);\n }\n });\n }\n\n protected addPeriodEvents(periodInfo: NgxTimelinePeriodInfo, onLeft: boolean): boolean {\n const periodKey = periodInfo?.periodKey;\n if (periodKey == undefined) {\n return onLeft;\n }\n this.groups[periodKey].forEach((event: NgxTimelineEvent, index: number) => {\n const prevEvent = this.groups[periodKey][index - 1];\n if (event.itemPosition) {\n onLeft = event.itemPosition && event.itemPosition === NgxTimelineItemPosition.ON_LEFT;\n }\n else if (index > 0 && this.compareEvents(prevEvent, event)) {\n onLeft = !onLeft;\n }\n this.pushEventOnItems(event, onLeft);\n });\n return onLeft;\n }\n\n protected pushEventOnItems(event: NgxTimelineEvent, onLeft: boolean): void {\n this.items.push({\n eventInfo: { ...event }, position: onLeft\n ? this.ngxTimelineItemPosition.ON_LEFT\n : this.ngxTimelineItemPosition.ON_RIGHT,\n });\n }\n\n /**\n * Compare the events inside the same group\n */\n protected compareEvents(prevEvent: NgxTimelineEvent, event: NgxTimelineEvent): boolean {\n return this.shouldChangeEventsInPeriod()\n || this.compareEventsField(prevEvent, event, ...(fieldsToCheckEventChangeSide[this.changeSide()] ?? []));\n }\n\n protected compareEventsField(prevEvent: NgxTimelineEvent, event: NgxTimelineEvent, ...fields: string[]): boolean {\n return fields.reduce((res, field) => res = res || (prevEvent.timestamp[field as keyof Date] as () => number)() !== (event.timestamp[field as keyof Date] as () => number)(), false);\n }\n\n protected getPeriodInfoFromPeriodKey(periodKey: string, firstGroupEvent: NgxTimelineEvent): NgxTimelinePeriodInfo {\n const split = periodKey.split(this.separator);\n return this.getPeriodInfo(split, periodKey, firstGroupEvent);\n }\n\n private getPeriodInfo(split: string[], periodKey: string, firstGroupEvent: NgxTimelineEvent): NgxTimelinePeriodInfo {\n return {\n year: Number(split[0]),\n month: Number(split[1]),\n day: Number(split[2]),\n periodKey,\n firstDate: firstGroupEvent.timestamp,\n };\n }\n\n private shouldChangeEventsInPeriod(): boolean {\n return [NgxTimelineEventChangeSide.ALL_IN_GROUP, NgxTimelineEventChangeSide.ALL].includes(this.changeSide());\n }\n\n protected getPeriodKeyFromEvent(event: NgxTimelineEvent): string {\n return fieldsToAddEventGroup[this.groupEvent()].map(field => (event.timestamp[field as keyof Date] as () => number)()).join(this.separator);\n }\n\n getOrientationForVirtualScroll(): Lowercase<NgxTimelineOrientation.HORIZONTAL | NgxTimelineOrientation.VERTICAL> {\n return this.orientation().toLowerCase() as Lowercase<NgxTimelineOrientation>;\n }\n}\n","<div [ngClass]=\"virtualScroll() ? 'virtual-scroll-container' : 'main-container'\">\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n class=\"items-container\"\r\n [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\"\r\n [orientation]=\"getOrientationForVirtualScroll()\"\r\n [itemSize]=\"virtualScrollItemSize()\"\r\n [maxBufferPx]=\"virtualScrollMaxBufferPx()\"\r\n [minBufferPx]=\"virtualScrollMinBufferPx()\"\r\n >\r\n <div *cdkVirtualFor=\"let item of items\">\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item }\"\r\n ></ng-template>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n <div class=\"items-container\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\r\n @for (item of items; track item; let index = $index) {\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: index }\"\r\n ></ng-template>\r\n }\r\n </div>\r\n }\r\n</div>\r\n\r\n<ng-template #rowTemplate let-item=\"item\" let-index=\"index\">\r\n <div class=\"row\">\r\n <!-- DESKTOP -->\r\n <div class=\"col col-left desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_LEFT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"hour left\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n }\r\n @if (!item.periodInfo) {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"hour right\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <!-- MOBILE -->\r\n <div class=\"col col-left mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"hour left\">\r\n <div class=\"hour-inner-container\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n }\r\n @if (!item.periodInfo) {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #centerLinesIconTemplate let-index=index let-event=event>\r\n <div class=\"line\"></div>\r\n <ng-container *ngTemplateOutlet=\"centerIconCustomTemplate() || centerIconTemplate; context: {index:index, event:event}\"></ng-container>\r\n <div [class.transparent]=\"index === items.length - 1\" [class.last-line]=\"index === items.length - 1\" class=\"line\"></div>\r\n</ng-template>\r\n\r\n<ng-template #centerIconTemplate let-index=index let-event=event>\r\n <div class=\"center-icon-container\">\r\n <div class=\"icon\"></div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dateInstantTemplate let-item=item>\r\n <span>\r\n {{item?.timestamp | ngxdate : ngxDateFormat.HOURS_MINUTES : langCode()}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #periodContainerTemplate let-period=period let-index=index let-event=event>\r\n <div class=\"period-container\">\r\n <ng-container *ngTemplateOutlet=\"periodCustomTemplate() || periodTemplate; context: {period: period, index:index, event:event}\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #periodTemplate let-period=period>\r\n <div class=\"period-inner-container\">\r\n <span>{{period?.firstDate | ngxdate : getPeriodKeyDateFormat() : langCode()}}</span>\r\n </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #eventTemplate let-event=event let-colSidePosition=colSidePosition>\r\n <ngx-timeline-event\r\n [event]=\"event\"\r\n [langCode]=\"langCode()\"\r\n [orientation]=\"orientation()\"\r\n [enableAnimation]=\"enableAnimation()\"\r\n [innerEventCustomTemplate]=\"innerEventCustomTemplate()\"\r\n [eventDescriptionCustomTemplate]=\"eventDescriptionCustomTemplate()\"\r\n [colSidePosition]=\"colSidePosition\"\r\n (clickEmitter)=\"clickEmitter.emit($event)\">\r\n </ngx-timeline-event>\r\n</ng-template>\r\n\r\n","import { registerLocaleData } from '@angular/common';\nimport localeDe from '@angular/common/locales/de';\nimport localeEs from '@angular/common/locales/es';\nimport localeFr from '@angular/common/locales/fr';\nimport localeIt from '@angular/common/locales/it';\nimport localePl from '@angular/common/locales/pl';\nimport localePt from '@angular/common/locales/pt';\nimport localeRu from '@angular/common/locales/ru';\nimport localeSl from '@angular/common/locales/sl';\nimport localeTr from '@angular/common/locales/tr';\nimport localeNo from '@angular/common/locales/nb';\nimport { NgModule } from '@angular/core';\n\nimport { NgxTimelineComponent, NgxTimelineEventComponent } from './components';\nimport { NgxDatePipe } from './pipes';\n\nregisterLocaleData(localeDe);\nregisterLocaleData(localeEs);\nregisterLocaleData(localeFr);\nregisterLocaleData(localeIt);\nregisterLocaleData(localePl);\nregisterLocaleData(localePt);\nregisterLocaleData(localeRu);\nregisterLocaleData(localeSl);\nregisterLocaleData(localeTr);\nregisterLocaleData(localeNo);\n\n@NgModule({\n imports: [NgxDatePipe, NgxTimelineComponent, NgxTimelineEventComponent],\n declarations: [],\n exports: [NgxDatePipe, NgxTimelineComponent],\n})\nexport class NgxTimelineModule { }\n","/*\n * Public API Surface of ngx-timeline\n */\nexport * from './lib/components';\nexport * from './lib/models';\nexport * from './lib/pipes/';\nexport * from './lib/ngx-timeline.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["fieldsToCheckEventChangeSide"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"frxjs-ngx-timeline.mjs","sources":["../../../projects/ngx-timeline/src/lib/models/NgxConfigObj.ts","../../../projects/ngx-timeline/src/lib/models/NgxTimelineEvent.ts","../../../projects/ngx-timeline/src/lib/pipes/ngx-date-pipe.ts","../../../projects/ngx-timeline/src/lib/components/ngx-timeline-event/ngx-timeline-event.component.ts","../../../projects/ngx-timeline/src/lib/components/ngx-timeline-event/ngx-timeline-event.component.html","../../../projects/ngx-timeline/src/lib/components/ngx-timeline.component.ts","../../../projects/ngx-timeline/src/lib/components/ngx-timeline.component.html","../../../projects/ngx-timeline/src/lib/ngx-timeline.module.ts","../../../projects/ngx-timeline/src/public-api.ts","../../../projects/ngx-timeline/src/frxjs-ngx-timeline.ts"],"sourcesContent":["export const supportedLanguageCodes = ['en', 'it', 'fr', 'de', 'es', 'sl', 'tr', 'pl', 'pt', 'ru', 'nb'] as const;\nexport type SupportedLanguageCode = typeof supportedLanguageCodes[number];\nexport const defaultSupportedLanguageCode: SupportedLanguageCode = supportedLanguageCodes[0];\n\nexport interface NgxConfigDate {\n code: string;\n dayMonthYear: string;\n fullDate: string;\n hoursMinutes: string;\n monthYear: string;\n year: string;\n}\n\nexport const dateConfigMap: Record<SupportedLanguageCode, NgxConfigDate> = {\n en: {\n code: 'en-US',\n fullDate: 'MM/dd/yyyy h:mm a',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'hh:mm a',\n },\n it: {\n code: 'it-IT',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n fr: {\n code: 'fr-FR',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n de: {\n code: 'de',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n es: {\n code: 'es',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n sl: {\n code: 'sl-SL',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n tr: {\n code: 'tr',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n pl: {\n code: 'pl',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n pt: {\n code: 'pt',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n ru: {\n code: 'ru-RU',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n nb: {\n code: 'nb-NO',\n fullDate: 'dd/MM/yyyy H:mm',\n dayMonthYear: 'dd MMMM yyyy',\n monthYear: 'MMMM yyyy',\n year: 'yyyy',\n hoursMinutes: 'HH:mm',\n },\n};\n\nexport enum NgxDateFormat {\n DAY_MONTH_YEAR = 'DAY_MONTH_YEAR',\n FULL_DATE = 'FULL_DATE',\n HOURS_MINUTES = 'HOURS_MINUTES',\n MONTH_YEAR = 'MONTH_YEAR',\n YEAR = 'YEAR',\n}\n\nexport const fieldConfigDate: Record<NgxDateFormat, keyof NgxConfigDate> = {\n DAY_MONTH_YEAR: 'dayMonthYear',\n FULL_DATE: 'fullDate',\n HOURS_MINUTES: 'hoursMinutes',\n MONTH_YEAR: 'monthYear',\n YEAR: 'year',\n};\n\n/**\n * Enum used to set the group event logic\n */\nexport enum NgxTimelineEventGroup {\n YEAR = 'YEAR',\n MONTH_YEAR = 'MONTH_YEAR',\n DAY_MONTH_YEAR = 'DAY_MONTH_YEAR',\n}\n\nexport const fieldsToAddEventGroup: Record<NgxTimelineEventGroup, string[]> = {\n YEAR: ['getFullYear'],\n MONTH_YEAR: ['getFullYear', 'getMonth'],\n DAY_MONTH_YEAR: ['getFullYear', 'getMonth', 'getDate'],\n};\n\nexport const periodKeyDateFormat: Record<NgxTimelineEventGroup, NgxDateFormat> = {\n YEAR: NgxDateFormat.YEAR,\n MONTH_YEAR: NgxDateFormat.MONTH_YEAR,\n DAY_MONTH_YEAR: NgxDateFormat.DAY_MONTH_YEAR,\n};\n\n/**\n * Enum used to set the group event logic.\n */\nexport enum NgxTimelineOrientation {\n HORIZONTAL = 'HORIZONTAL',\n VERTICAL = 'VERTICAL',\n}\n\n/**\n * Enum used to set the change side event logic.\n */\nexport enum NgxTimelineEventChangeSide {\n ALL = 'ALL',\n ALL_IN_GROUP = 'ALL_IN_GROUP',\n ON_DIFFERENT_DAY_IN_GROUP = 'ON_DIFFERENT_DAY_IN_GROUP',\n ON_DIFFERENT_HMS_IN_GROUP = 'ON_DIFFERENT_HMS_IN_GROUP',\n ON_DIFFERENT_MONTH_IN_GROUP = 'ON_DIFFERENT_MONTH_IN_GROUP',\n}\n\nexport const fieldsToCheckEventChangeSideInGroup: Partial<Record<NgxTimelineEventChangeSide, string[]>> = {\n ON_DIFFERENT_DAY_IN_GROUP: ['getFullYear', 'getMonth', 'getDate'],\n ON_DIFFERENT_MONTH_IN_GROUP: ['getFullYear', 'getMonth'],\n ON_DIFFERENT_HMS_IN_GROUP: ['getFullYear', 'getMonth', 'getDate', 'getHours', 'getMinutes', 'getSeconds'],\n};\n","/**\n * Event to be provided from outside the timeline.\n */\nexport interface NgxTimelineEvent {\n timestamp: Date;\n title?: string;\n description?: string;\n id?: unknown;\n itemPosition?: NgxTimelineItemPosition;\n}\n\nexport interface NgxTimelinePeriodInfo {\n periodKey?: string;\n year?: number;\n month?: number;\n day?: number;\n firstDate?: Date;\n}\n\n/**\n * Item used inside the timeline.\n */\nexport interface NgxTimelineItem {\n position?: NgxTimelineItemPosition.ON_LEFT | NgxTimelineItemPosition.ON_RIGHT;\n periodInfo?: NgxTimelinePeriodInfo;\n eventInfo?: NgxTimelineEvent;\n}\n\nexport enum NgxTimelineItemPosition {\n ON_LEFT = 'ON_LEFT',\n ON_RIGHT = 'ON_RIGHT',\n}\n","import { DatePipe } from '@angular/common';\nimport { Pipe, PipeTransform } from '@angular/core';\n\nimport { dateConfigMap, defaultSupportedLanguageCode, fieldConfigDate, NgxConfigDate, NgxDateFormat, SupportedLanguageCode } from '../models';\n\n@Pipe({\n name: 'ngxdate',\n})\nexport class NgxDatePipe implements PipeTransform {\n transform(date: Date | string, dateFormat?: NgxDateFormat | string, langCode?: SupportedLanguageCode): string | null {\n const configDate = this.getDateConfig(langCode);\n let dateFormatString = 'yyyy';\n if (dateFormat === undefined) {\n console.warn('frxjs-ngx-timeline: no date format defined.');\n }\n else if (dateFormat in NgxDateFormat) {\n dateFormatString = this.dateFormat(dateFormat as NgxDateFormat, configDate);\n }\n else if (typeof dateFormat === 'string') {\n dateFormatString = dateFormat;\n }\n return new DatePipe(configDate.code).transform(new Date(date), dateFormatString);\n }\n\n private dateFormat(dateFormat: NgxDateFormat, configDate: NgxConfigDate): string {\n return configDate[fieldConfigDate[dateFormat]];\n }\n\n private getDateConfig(langCode?: SupportedLanguageCode): NgxConfigDate {\n const code: SupportedLanguageCode = langCode ?? defaultSupportedLanguageCode;\n return dateConfigMap[code];\n }\n}\n","import { DatePipe, NgTemplateOutlet, TitleCasePipe } from '@angular/common';\nimport { Component, output, TemplateRef, input, ChangeDetectionStrategy, computed } from '@angular/core';\n\nimport { defaultSupportedLanguageCode, NgxTimelineOrientation, SupportedLanguageCode } from '../../models';\nimport { NgxTimelineItem, NgxTimelineItemPosition } from '../../models/NgxTimelineEvent';\n\n@Component({\n selector: 'ngx-timeline-event',\n imports: [\n NgTemplateOutlet,\n TitleCasePipe,\n ],\n templateUrl: './ngx-timeline-event.component.html',\n styleUrl: './ngx-timeline-event.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NgxTimelineEventComponent {\n /**\n * Event to be displayed.\n */\n readonly event = input.required<NgxTimelineItem>();\n /**\n * Event position respect to the vertical line (LEFT or RIGHT).\n */\n readonly colSidePosition = input<NgxTimelineItemPosition>();\n /**\n * Language code used to format the dates.\n */\n readonly langCode = input<SupportedLanguageCode>(defaultSupportedLanguageCode);\n /**\n * Inner custom template used to display the event detail.\n */\n readonly innerEventCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Inner custom template used to display the event description.\n */\n readonly eventDescriptionCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Boolean used to enable or disable the animations.\n */\n readonly enableAnimation = input(true);\n /**\n * Orientation of the timeline.\n */\n readonly orientation = input<NgxTimelineOrientation>(NgxTimelineOrientation.VERTICAL);\n /**\n * Output click event emitter.\n */\n readonly clickEmitter = output<NgxTimelineItem>();\n\n ngxTimelineItemPosition = NgxTimelineItemPosition;\n ngxTimelineOrientation = NgxTimelineOrientation;\n readonly dateObjSignal = computed(() => !this.event() ? null : this.getDateObj());\n\n private readonly monthAbbr = 'MMM';\n private readonly dayFormat = 'dd';\n\n getDateObj(): { day: unknown; month: unknown; year: unknown } {\n let day = undefined;\n let month = undefined;\n let year = undefined;\n const dateTimestamp = this.event().eventInfo?.timestamp;\n if (dateTimestamp) {\n const timestamp = new Date(dateTimestamp);\n const langCode = this.getLangCode();\n month = new DatePipe(langCode).transform(timestamp, this.monthAbbr);\n day = new DatePipe(langCode).transform(timestamp, this.dayFormat);\n year = timestamp.getFullYear();\n }\n\n return { day, month, year };\n }\n\n protected getLangCode(): SupportedLanguageCode {\n return this.langCode();\n }\n}\n","<div class=\"event-wrapper-container\" (click)=\"clickEmitter.emit(event())\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\n @if (colSidePosition()===ngxTimelineItemPosition.ON_RIGHT) {\n <div class=\"arrow left\"></div>\n }\n <div class=\"event\" [class.enableAnimation]=\"enableAnimation()\">\n <ng-container *ngTemplateOutlet=\"innerEventCustomTemplate() || innerEventContainer; context: {event: event()}\"></ng-container>\n </div>\n @if (colSidePosition() === ngxTimelineItemPosition.ON_LEFT) {\n <div class=\"arrow right\"></div>\n }\n</div>\n\n<ng-template #innerEventContainer let-event=event>\n <div class=\"event-container\" [class.reverse]=\"colSidePosition() === ngxTimelineItemPosition.ON_LEFT\">\n <div class=\"event-info-container\">\n <div class=\"event-info-header\">\n <div class=\"title-container\">{{event?.eventInfo?.title | titlecase}}</div>\n </div>\n <div class=\"event-info-body\">\n <ng-container *ngTemplateOutlet=\"eventDescriptionCustomTemplate() || eventDescriptionContainer; context: {event: event}\"></ng-container>\n </div>\n </div>\n\n <div class=\"event-divider-container\">\n <hr>\n </div>\n\n @if (dateObjSignal(); as dateObj) {\n <div class=\"event-date-container\">\n <div>\n <p>{{dateObj.month}}</p>\n </div>\n <div>\n <p class=\"day\">{{dateObj.day}}</p>\n </div>\n <div>\n <p>{{dateObj.year}}</p>\n </div>\n </div>\n }\n </div>\n</ng-template>\n\n\n<ng-template #eventDescriptionContainer let-event=event>\n <p class=\"event-info-description\">{{event?.eventInfo?.description}}</p>\n</ng-template>\n","import { ScrollingModule } from '@angular/cdk/scrolling';\nimport { NgClass, NgTemplateOutlet } from '@angular/common';\nimport { Component, DoCheck, inject, IterableDiffer, IterableDiffers, OnChanges, TemplateRef, input, output, ChangeDetectionStrategy } from '@angular/core';\n\nimport {\n NgxTimelineEvent,\n NgxTimelineItem,\n NgxTimelineItemPosition,\n NgxTimelineOrientation,\n NgxTimelinePeriodInfo,\n NgxDateFormat,\n NgxTimelineEventGroup,\n NgxTimelineEventChangeSide,\n periodKeyDateFormat,\n fieldsToCheckEventChangeSideInGroup as fieldsToCheckEventChangeSide,\n fieldsToAddEventGroup, SupportedLanguageCode, defaultSupportedLanguageCode,\n} from '../models';\nimport { NgxDatePipe } from '../pipes';\nimport { NgxTimelineEventComponent } from './ngx-timeline-event/ngx-timeline-event.component';\n\n@Component({\n selector: 'ngx-timeline',\n imports: [\n NgClass,\n NgTemplateOutlet,\n NgxDatePipe,\n NgxTimelineEventComponent,\n ScrollingModule,\n ],\n templateUrl: './ngx-timeline.component.html',\n styleUrl: './ngx-timeline.component.scss',\n changeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class NgxTimelineComponent implements OnChanges, DoCheck {\n /**\n * List of events to be displayed.\n */\n readonly events = input.required<NgxTimelineEvent[]>();\n /**\n * Language code used to show the date formatted.\n */\n readonly langCode = input<SupportedLanguageCode>(defaultSupportedLanguageCode);\n /**\n * Boolean used to enable or disable the animations.\n */\n readonly enableAnimation = input<boolean>(true);\n /**\n * Boolean used to reverse sort order (default older first).\n */\n readonly reverseOrder = input<boolean>(false);\n /**\n * Orientation of the timeline.\n */\n readonly orientation = input<NgxTimelineOrientation>(NgxTimelineOrientation.VERTICAL);\n /**\n * Logic to be applied in order to group events.\n */\n readonly groupEvent = input<NgxTimelineEventGroup>(NgxTimelineEventGroup.MONTH_YEAR);\n /**\n * Logic to be applied in order to put events on LEFT or RIGHT.\n */\n readonly changeSide = input<NgxTimelineEventChangeSide>(NgxTimelineEventChangeSide.ON_DIFFERENT_DAY_IN_GROUP);\n /**\n * Custom Template displayed before a group of events.\n */\n readonly periodCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Custom Template displayed to show a single event.\n */\n readonly eventCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Custom Template displayed to show a separator icon.\n */\n readonly centerIconCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Custom Template displayed to show the side date.\n */\n readonly dateInstantCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Custom Template displayed to show the inner event.\n */\n readonly innerEventCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Inner custom template used to display the event description.\n */\n readonly eventDescriptionCustomTemplate = input<TemplateRef<unknown>>();\n /**\n * Enable virtual scrolling, for rendering performance. Useful when rendering thousands of items.\n */\n readonly virtualScroll = input<boolean>(false);\n /**\n * The size of the items in the list (in pixels).\n */\n readonly virtualScrollItemSize = input<number>(100);\n /**\n * The number of pixels worth of buffer to render for when rendering new items. Defaults to 200px.\n */\n readonly virtualScrollMaxBufferPx = input<number>(200);\n /**\n * The minimum amount of buffer rendered beyond the viewport (in pixels).\n * If the amount of buffer dips below this number, more items will be rendered. Defaults to 100px.\n */\n readonly virtualScrollMinBufferPx = input<number>(100);\n /**\n * Output click event emitter.\n */\n readonly clickEmitter = output<NgxTimelineItem>();\n\n groups: Record<string, NgxTimelineEvent[]> = {};\n periods: NgxTimelineItem[] = [];\n items: NgxTimelineItem[] = [];\n ngxTimelineItemPosition = NgxTimelineItemPosition;\n ngxTimelineOrientation = NgxTimelineOrientation;\n ngxDateFormat = NgxDateFormat;\n\n private differs: IterableDiffers = inject(IterableDiffers);\n private iterableDiffer: IterableDiffer<unknown> = this.differs.find([]).create();\n private readonly separator = '/';\n\n ngOnChanges(): void {\n this.groupEvents(this.events());\n }\n\n ngDoCheck(): void {\n const changes = this.iterableDiffer.diff(this.events());\n if (changes) {\n this.groupEvents(this.events());\n }\n }\n\n getPeriodKeyDateFormat(): string {\n return periodKeyDateFormat[this.groupEvent()];\n }\n\n protected clear(): void {\n this.groups = {};\n this.periods = [];\n this.items = [];\n }\n\n protected groupEvents(events: NgxTimelineEvent[]): void {\n if (events) {\n this.clear();\n this.sortEvents(events);\n this.setGroupsAndPeriods(events);\n this.setItems();\n }\n }\n\n protected sortEvents(events: NgxTimelineEvent[]): void {\n events.sort((a, b) => {\n const aTime: number = a.timestamp.getTime();\n const bTime: number = b.timestamp.getTime();\n return this.reverseOrder() ? bTime - aTime : aTime - bTime;\n });\n }\n\n protected setGroupsAndPeriods(events: NgxTimelineEvent[]): void {\n this.periods = [];\n events.forEach((event) => {\n // conversion from string to actual Date\n event.timestamp = new Date(event.timestamp);\n const periodKey = this.getPeriodKeyFromEvent(event);\n if (!this.groups[periodKey]) {\n this.groups[periodKey] = [];\n this.periods.push({ periodInfo: this.getPeriodInfoFromPeriodKey(periodKey, event) });\n }\n this.groups[periodKey].push(event);\n });\n }\n\n protected setItems(): void {\n let isLastItemOnLeft = false;\n this.periods.forEach((p) => {\n // insert first the period\n this.items.push(p);\n // in each period putting items on left\n let onLeft = true;\n if (this.changeSide() === NgxTimelineEventChangeSide.ALL) {\n onLeft = !isLastItemOnLeft;\n }\n const periodInfo: NgxTimelinePeriodInfo | undefined = p.periodInfo;\n if (periodInfo) {\n // insert then all the events in this period\n isLastItemOnLeft = this.addPeriodEvents(periodInfo, onLeft);\n // onLeft = this.addEventItemsAndGetIfOnLeft(periodInfo, onLeft);\n }\n });\n }\n\n protected addPeriodEvents(periodInfo: NgxTimelinePeriodInfo, onLeft: boolean): boolean {\n const periodKey = periodInfo?.periodKey;\n if (periodKey == undefined) {\n return onLeft;\n }\n this.groups[periodKey].forEach((event: NgxTimelineEvent, index: number) => {\n const prevEvent = this.groups[periodKey][index - 1];\n if (event.itemPosition) {\n onLeft = event.itemPosition && event.itemPosition === NgxTimelineItemPosition.ON_LEFT;\n }\n else if (index > 0 && this.compareEvents(prevEvent, event)) {\n onLeft = !onLeft;\n }\n this.pushEventOnItems(event, onLeft);\n });\n return onLeft;\n }\n\n protected pushEventOnItems(event: NgxTimelineEvent, onLeft: boolean): void {\n this.items.push({\n eventInfo: { ...event }, position: onLeft\n ? this.ngxTimelineItemPosition.ON_LEFT\n : this.ngxTimelineItemPosition.ON_RIGHT,\n });\n }\n\n /**\n * Compare the events inside the same group\n */\n protected compareEvents(prevEvent: NgxTimelineEvent, event: NgxTimelineEvent): boolean {\n return this.shouldChangeEventsInPeriod()\n || this.compareEventsField(prevEvent, event, ...(fieldsToCheckEventChangeSide[this.changeSide()] ?? []));\n }\n\n protected compareEventsField(prevEvent: NgxTimelineEvent, event: NgxTimelineEvent, ...fields: string[]): boolean {\n return fields.reduce((res, field) => res || (prevEvent.timestamp[field as keyof Date] as () => number)() !== (event.timestamp[field as keyof Date] as () => number)(), false);\n }\n\n protected getPeriodInfoFromPeriodKey(periodKey: string, firstGroupEvent: NgxTimelineEvent): NgxTimelinePeriodInfo {\n const split = periodKey.split(this.separator);\n return this.getPeriodInfo(split, periodKey, firstGroupEvent);\n }\n\n private getPeriodInfo(split: string[], periodKey: string, firstGroupEvent: NgxTimelineEvent): NgxTimelinePeriodInfo {\n return {\n year: Number(split[0]),\n month: Number(split[1]),\n day: Number(split[2]),\n periodKey,\n firstDate: firstGroupEvent.timestamp,\n };\n }\n\n private shouldChangeEventsInPeriod(): boolean {\n return [NgxTimelineEventChangeSide.ALL_IN_GROUP, NgxTimelineEventChangeSide.ALL].includes(this.changeSide());\n }\n\n protected getPeriodKeyFromEvent(event: NgxTimelineEvent): string {\n return fieldsToAddEventGroup[this.groupEvent()].map(field => (event.timestamp[field as keyof Date] as () => number)()).join(this.separator);\n }\n\n getOrientationForVirtualScroll(): Lowercase<NgxTimelineOrientation.HORIZONTAL | NgxTimelineOrientation.VERTICAL> {\n return this.orientation().toLowerCase() as Lowercase<NgxTimelineOrientation>;\n }\n}\n","<div [ngClass]=\"virtualScroll() ? 'virtual-scroll-container' : 'main-container'\">\r\n @if (virtualScroll()) {\r\n <cdk-virtual-scroll-viewport\r\n class=\"items-container\"\r\n [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\"\r\n [orientation]=\"getOrientationForVirtualScroll()\"\r\n [itemSize]=\"virtualScrollItemSize()\"\r\n [maxBufferPx]=\"virtualScrollMaxBufferPx()\"\r\n [minBufferPx]=\"virtualScrollMinBufferPx()\"\r\n >\r\n <div *cdkVirtualFor=\"let item of items\">\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item }\"\r\n ></ng-template>\r\n </div>\r\n </cdk-virtual-scroll-viewport>\r\n } @else {\r\n <div class=\"items-container\" [class.horizontal]=\"orientation() === ngxTimelineOrientation.HORIZONTAL\">\r\n @for (item of items; track item; let index = $index) {\r\n <ng-template\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: index }\"\r\n ></ng-template>\r\n }\r\n </div>\r\n }\r\n</div>\r\n\r\n<ng-template #rowTemplate let-item=\"item\" let-index=\"index\">\r\n <div class=\"row\">\r\n <!-- DESKTOP -->\r\n <div class=\"col col-left desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_LEFT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"hour left\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n } @else {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right desktop\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_RIGHT) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n @if (item.eventInfo && item.position === ngxTimelineItemPosition.ON_LEFT) {\r\n <div class=\"hour right\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <!-- MOBILE -->\r\n <div class=\"col col-left mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"hour left\">\r\n <div class=\"hour-inner-container\">\r\n <ng-container *ngTemplateOutlet=\"dateInstantCustomTemplate() || dateInstantTemplate; context: {item: item.eventInfo}\"></ng-container>\r\n </div>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-center mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.periodInfo) {\r\n <div class=\"center-inner\">\r\n <ng-container *ngTemplateOutlet=\"periodContainerTemplate; context: {period: item.periodInfo, index: index, event: item}\"></ng-container>\r\n </div>\r\n } @else {\r\n <div class=\"center-inner no-period-key\">\r\n <ng-container *ngTemplateOutlet=\"centerLinesIconTemplate; context: {event: item, index: index}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n <div class=\"col col-right mobile\" [ngClass]=\"item.periodInfo ? 'col-period' : 'col-event'\">\r\n @if (item.eventInfo) {\r\n <div class=\"event-outer-container\">\r\n <ng-container *ngTemplateOutlet=\"eventCustomTemplate() || eventTemplate; context: {event: item, colSidePosition: ngxTimelineItemPosition.ON_RIGHT}\"></ng-container>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #centerLinesIconTemplate let-index=index let-event=event>\r\n <div class=\"line\"></div>\r\n <ng-container *ngTemplateOutlet=\"centerIconCustomTemplate() || centerIconTemplate; context: {index:index, event:event}\"></ng-container>\r\n <div [class.transparent]=\"index === items.length - 1\" [class.last-line]=\"index === items.length - 1\" class=\"line\"></div>\r\n</ng-template>\r\n\r\n<ng-template #centerIconTemplate let-index=index let-event=event>\r\n <div class=\"center-icon-container\">\r\n <div class=\"icon\"></div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dateInstantTemplate let-item=item>\r\n <span>\r\n {{item?.timestamp | ngxdate : ngxDateFormat.HOURS_MINUTES : langCode()}}\r\n </span>\r\n</ng-template>\r\n\r\n<ng-template #periodContainerTemplate let-period=period let-index=index let-event=event>\r\n <div class=\"period-container\">\r\n <ng-container *ngTemplateOutlet=\"periodCustomTemplate() || periodTemplate; context: {period: period, index:index, event:event}\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #periodTemplate let-period=period>\r\n <div class=\"period-inner-container\">\r\n <span>{{period?.firstDate | ngxdate : getPeriodKeyDateFormat() : langCode()}}</span>\r\n </div>\r\n</ng-template>\r\n\r\n\r\n<ng-template #eventTemplate let-event=event let-colSidePosition=colSidePosition>\r\n <ngx-timeline-event\r\n [event]=\"event\"\r\n [langCode]=\"langCode()\"\r\n [orientation]=\"orientation()\"\r\n [enableAnimation]=\"enableAnimation()\"\r\n [innerEventCustomTemplate]=\"innerEventCustomTemplate()\"\r\n [eventDescriptionCustomTemplate]=\"eventDescriptionCustomTemplate()\"\r\n [colSidePosition]=\"colSidePosition\"\r\n (clickEmitter)=\"clickEmitter.emit($event)\">\r\n </ngx-timeline-event>\r\n</ng-template>\r\n\r\n","import { registerLocaleData } from '@angular/common';\nimport localeDe from '@angular/common/locales/de';\nimport localeEs from '@angular/common/locales/es';\nimport localeFr from '@angular/common/locales/fr';\nimport localeIt from '@angular/common/locales/it';\nimport localePl from '@angular/common/locales/pl';\nimport localePt from '@angular/common/locales/pt';\nimport localeRu from '@angular/common/locales/ru';\nimport localeSl from '@angular/common/locales/sl';\nimport localeTr from '@angular/common/locales/tr';\nimport localeNo from '@angular/common/locales/nb';\nimport { NgModule } from '@angular/core';\n\nimport { NgxTimelineComponent, NgxTimelineEventComponent } from './components';\nimport { NgxDatePipe } from './pipes';\n\nregisterLocaleData(localeDe);\nregisterLocaleData(localeEs);\nregisterLocaleData(localeFr);\nregisterLocaleData(localeIt);\nregisterLocaleData(localePl);\nregisterLocaleData(localePt);\nregisterLocaleData(localeRu);\nregisterLocaleData(localeSl);\nregisterLocaleData(localeTr);\nregisterLocaleData(localeNo);\n\n@NgModule({\n imports: [NgxDatePipe, NgxTimelineComponent, NgxTimelineEventComponent],\n declarations: [],\n exports: [NgxDatePipe, NgxTimelineComponent],\n})\nexport class NgxTimelineModule { }\n","/*\n * Public API Surface of ngx-timeline\n */\nexport * from './lib/components';\nexport * from './lib/models';\nexport * from './lib/pipes/';\nexport * from './lib/ngx-timeline.module';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":["fieldsToCheckEventChangeSide"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@frxjs/ngx-timeline",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "22.0.1",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular",
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
},
|
|
16
16
|
"license": "MIT",
|
|
17
17
|
"peerDependencies": {
|
|
18
|
-
"@angular/cdk": "^
|
|
19
|
-
"@angular/common": "^
|
|
20
|
-
"@angular/core": "^
|
|
18
|
+
"@angular/cdk": "^22.0.1",
|
|
19
|
+
"@angular/common": "^22.0.1",
|
|
20
|
+
"@angular/core": "^22.0.1"
|
|
21
21
|
},
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"tslib": "^2.3.0"
|