ng-prime-tools 1.1.10 → 1.1.12
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.
|
@@ -9793,6 +9793,7 @@ var PTNewsTickerTrend;
|
|
|
9793
9793
|
})(PTNewsTickerTrend || (PTNewsTickerTrend = {}));
|
|
9794
9794
|
|
|
9795
9795
|
class PTNewsTickerComponent {
|
|
9796
|
+
static { this.SCROLL_ANIMATION_NAME = 'pt-news-ticker-scroll'; }
|
|
9796
9797
|
constructor(changeDetectorRef, zone) {
|
|
9797
9798
|
this.changeDetectorRef = changeDetectorRef;
|
|
9798
9799
|
this.zone = zone;
|
|
@@ -9837,11 +9838,13 @@ class PTNewsTickerComponent {
|
|
|
9837
9838
|
this.PTNewsTickerTrend = PTNewsTickerTrend;
|
|
9838
9839
|
this.internalNews = [];
|
|
9839
9840
|
this.animationDurationSeconds = 20;
|
|
9841
|
+
this.loopGapPixels = 0;
|
|
9840
9842
|
this.playing = true;
|
|
9841
9843
|
this.hovered = false;
|
|
9842
9844
|
this.pendingNews = null;
|
|
9843
9845
|
this.animationFrameId = null;
|
|
9844
9846
|
this.viewInitialized = false;
|
|
9847
|
+
this.applyingPendingNews = false;
|
|
9845
9848
|
this.newBadgeTimeouts = new Map();
|
|
9846
9849
|
this.expiredNewBadgeIds = new Set();
|
|
9847
9850
|
}
|
|
@@ -9852,7 +9855,7 @@ class PTNewsTickerComponent {
|
|
|
9852
9855
|
}
|
|
9853
9856
|
if (changes['speed'] || changes['minSpeed'] || changes['maxSpeed']) {
|
|
9854
9857
|
this.speed = this.normalizeSpeed(this.speed);
|
|
9855
|
-
this.scheduleAnimationRefresh();
|
|
9858
|
+
this.scheduleAnimationRefresh(true);
|
|
9856
9859
|
}
|
|
9857
9860
|
if (changes['defaultSpeed']) {
|
|
9858
9861
|
this.defaultSpeed = this.normalizeSpeed(this.defaultSpeed);
|
|
@@ -9863,19 +9866,22 @@ class PTNewsTickerComponent {
|
|
|
9863
9866
|
if (changes['autoplay']) {
|
|
9864
9867
|
this.playing = this.autoplay;
|
|
9865
9868
|
this.emitPlayStateChange();
|
|
9869
|
+
if (!this.playing) {
|
|
9870
|
+
this.applyPendingNewsImmediately();
|
|
9871
|
+
}
|
|
9866
9872
|
}
|
|
9867
9873
|
if (changes['gap'] ||
|
|
9868
9874
|
changes['height'] ||
|
|
9869
9875
|
changes['direction'] ||
|
|
9870
9876
|
changes['loop']) {
|
|
9871
|
-
this.scheduleAnimationRefresh();
|
|
9877
|
+
this.scheduleAnimationRefresh(true);
|
|
9872
9878
|
}
|
|
9873
9879
|
}
|
|
9874
9880
|
ngAfterViewInit() {
|
|
9875
9881
|
this.viewInitialized = true;
|
|
9876
9882
|
this.playing = this.autoplay;
|
|
9877
9883
|
this.initializeResizeObserver();
|
|
9878
|
-
this.scheduleAnimationRefresh();
|
|
9884
|
+
this.scheduleAnimationRefresh(true);
|
|
9879
9885
|
this.changeDetectorRef.detectChanges();
|
|
9880
9886
|
}
|
|
9881
9887
|
ngOnDestroy() {
|
|
@@ -9900,7 +9906,7 @@ class PTNewsTickerComponent {
|
|
|
9900
9906
|
: [...sourceNews, normalizedItem];
|
|
9901
9907
|
this.queueOrApplyNews(updatedNews);
|
|
9902
9908
|
this.emitNewsChange({
|
|
9903
|
-
news:
|
|
9909
|
+
news: this.cloneNews(updatedNews),
|
|
9904
9910
|
addedItem: normalizedItem,
|
|
9905
9911
|
});
|
|
9906
9912
|
}
|
|
@@ -9916,7 +9922,7 @@ class PTNewsTickerComponent {
|
|
|
9916
9922
|
this.queueOrApplyNews(updatedNews);
|
|
9917
9923
|
this.newsRemove.emit(removedItem);
|
|
9918
9924
|
this.emitNewsChange({
|
|
9919
|
-
news:
|
|
9925
|
+
news: this.cloneNews(updatedNews),
|
|
9920
9926
|
removedItem,
|
|
9921
9927
|
});
|
|
9922
9928
|
}
|
|
@@ -9928,13 +9934,13 @@ class PTNewsTickerComponent {
|
|
|
9928
9934
|
this.emitNewsChange({
|
|
9929
9935
|
news: [],
|
|
9930
9936
|
});
|
|
9931
|
-
this.scheduleAnimationRefresh();
|
|
9937
|
+
this.scheduleAnimationRefresh(true);
|
|
9932
9938
|
}
|
|
9933
9939
|
replaceNews(news) {
|
|
9934
9940
|
const normalizedNews = this.normalizeNews(news);
|
|
9935
9941
|
this.queueOrApplyNews(normalizedNews);
|
|
9936
9942
|
this.emitNewsChange({
|
|
9937
|
-
news:
|
|
9943
|
+
news: this.cloneNews(normalizedNews),
|
|
9938
9944
|
});
|
|
9939
9945
|
}
|
|
9940
9946
|
play() {
|
|
@@ -9980,7 +9986,7 @@ class PTNewsTickerComponent {
|
|
|
9980
9986
|
speed: nextSpeed,
|
|
9981
9987
|
});
|
|
9982
9988
|
this.emitPlayStateChange();
|
|
9983
|
-
this.scheduleAnimationRefresh();
|
|
9989
|
+
this.scheduleAnimationRefresh(true);
|
|
9984
9990
|
}
|
|
9985
9991
|
onMouseEnter() {
|
|
9986
9992
|
if (!this.pauseOnHover) {
|
|
@@ -9991,11 +9997,17 @@ class PTNewsTickerComponent {
|
|
|
9991
9997
|
onMouseLeave() {
|
|
9992
9998
|
this.hovered = false;
|
|
9993
9999
|
}
|
|
9994
|
-
onTrackAnimationIteration() {
|
|
9995
|
-
this.
|
|
10000
|
+
onTrackAnimationIteration(event) {
|
|
10001
|
+
if (!this.isTickerScrollEvent(event)) {
|
|
10002
|
+
return;
|
|
10003
|
+
}
|
|
10004
|
+
this.applyPendingNewsAtCycleBoundary();
|
|
9996
10005
|
}
|
|
9997
|
-
onTrackAnimationEnd() {
|
|
9998
|
-
this.
|
|
10006
|
+
onTrackAnimationEnd(event) {
|
|
10007
|
+
if (!this.isTickerScrollEvent(event)) {
|
|
10008
|
+
return;
|
|
10009
|
+
}
|
|
10010
|
+
this.applyPendingNewsAtCycleBoundary();
|
|
9999
10011
|
}
|
|
10000
10012
|
onItemClick(event, item) {
|
|
10001
10013
|
if (item.disabled) {
|
|
@@ -10030,6 +10042,9 @@ class PTNewsTickerComponent {
|
|
|
10030
10042
|
hasSegments(item) {
|
|
10031
10043
|
return Array.isArray(item.segments) && item.segments.length > 0;
|
|
10032
10044
|
}
|
|
10045
|
+
hasSingleNewsItem() {
|
|
10046
|
+
return this.internalNews.length === 1;
|
|
10047
|
+
}
|
|
10033
10048
|
isItemRemovable(item) {
|
|
10034
10049
|
return this.showRemoveButton && item.removable !== false && !item.disabled;
|
|
10035
10050
|
}
|
|
@@ -10082,6 +10097,7 @@ class PTNewsTickerComponent {
|
|
|
10082
10097
|
return {
|
|
10083
10098
|
'--pt-news-ticker-duration': `${this.animationDurationSeconds}s`,
|
|
10084
10099
|
'--pt-news-ticker-gap': this.gap,
|
|
10100
|
+
'--pt-news-ticker-loop-gap': `${this.loopGapPixels}px`,
|
|
10085
10101
|
animationDirection: this.direction === PTNewsTickerDirection.RIGHT ? 'reverse' : 'normal',
|
|
10086
10102
|
animationPlayState: this.getAnimationPlayState(),
|
|
10087
10103
|
};
|
|
@@ -10100,9 +10116,9 @@ class PTNewsTickerComponent {
|
|
|
10100
10116
|
}
|
|
10101
10117
|
getItemStyle(item) {
|
|
10102
10118
|
const typeStyles = this.getTypeStyles(item.type);
|
|
10103
|
-
const backgroundColor = item
|
|
10104
|
-
const textColor = item.textColor ?? typeStyles.textColor;
|
|
10105
|
-
const iconColor = item.iconColor ?? textColor
|
|
10119
|
+
const backgroundColor = this.resolveItemBackgroundColor(item, typeStyles.backgroundColor);
|
|
10120
|
+
const textColor = item.textColor ?? typeStyles.textColor ?? this.containerTextColor;
|
|
10121
|
+
const iconColor = item.iconColor ?? textColor;
|
|
10106
10122
|
const borderColor = item.borderColor ?? typeStyles.borderColor ?? 'transparent';
|
|
10107
10123
|
const flashBackgroundColor = item.flashBackgroundColor ??
|
|
10108
10124
|
item.backgroundColor ??
|
|
@@ -10111,8 +10127,8 @@ class PTNewsTickerComponent {
|
|
|
10111
10127
|
const flashAlternateBackgroundColor = item.flashAlternateBackgroundColor ?? '#7f1d1d';
|
|
10112
10128
|
const flashTextColor = item.flashTextColor ?? item.textColor ?? '#ffffff';
|
|
10113
10129
|
return {
|
|
10114
|
-
'--pt-news-item-background': backgroundColor
|
|
10115
|
-
'--pt-news-item-text-color': textColor
|
|
10130
|
+
'--pt-news-item-background': backgroundColor,
|
|
10131
|
+
'--pt-news-item-text-color': textColor,
|
|
10116
10132
|
'--pt-news-item-icon-color': iconColor,
|
|
10117
10133
|
'--pt-news-item-border-color': borderColor,
|
|
10118
10134
|
'--pt-news-item-gap': this.itemGap,
|
|
@@ -10129,6 +10145,11 @@ class PTNewsTickerComponent {
|
|
|
10129
10145
|
'pt-news-ticker__item--clickable': !item.disabled &&
|
|
10130
10146
|
(this.hasItemLink(item) || this.newsClick.observers.length > 0),
|
|
10131
10147
|
'pt-news-ticker__item--link': this.hasItemLink(item),
|
|
10148
|
+
'pt-news-ticker__item--info': item.type === PTNewsTickerType.INFO,
|
|
10149
|
+
'pt-news-ticker__item--default': !item.type || item.type === PTNewsTickerType.DEFAULT,
|
|
10150
|
+
'pt-news-ticker__item--success': item.type === PTNewsTickerType.SUCCESS,
|
|
10151
|
+
'pt-news-ticker__item--warning': item.type === PTNewsTickerType.WARNING,
|
|
10152
|
+
'pt-news-ticker__item--danger': item.type === PTNewsTickerType.DANGER,
|
|
10132
10153
|
};
|
|
10133
10154
|
if (item.styleClass?.trim()) {
|
|
10134
10155
|
classes[item.styleClass.trim()] = true;
|
|
@@ -10136,20 +10157,16 @@ class PTNewsTickerComponent {
|
|
|
10136
10157
|
return classes;
|
|
10137
10158
|
}
|
|
10138
10159
|
getDuplicateItemClasses(item) {
|
|
10139
|
-
const classes =
|
|
10140
|
-
|
|
10141
|
-
|
|
10142
|
-
};
|
|
10143
|
-
if (item.styleClass?.trim()) {
|
|
10144
|
-
classes[item.styleClass.trim()] = true;
|
|
10145
|
-
}
|
|
10160
|
+
const classes = this.getItemClasses(item);
|
|
10161
|
+
classes['pt-news-ticker__item--clickable'] = false;
|
|
10162
|
+
classes['pt-news-ticker__item--link'] = false;
|
|
10146
10163
|
return classes;
|
|
10147
10164
|
}
|
|
10148
10165
|
getTrackById(index, item) {
|
|
10149
|
-
return `${item.id}-${index}`;
|
|
10166
|
+
return `${String(item.id)}-${index}`;
|
|
10150
10167
|
}
|
|
10151
10168
|
getDuplicateTrackById(index, item) {
|
|
10152
|
-
return `duplicate-${item.id}-${index}`;
|
|
10169
|
+
return `duplicate-${String(item.id)}-${index}`;
|
|
10153
10170
|
}
|
|
10154
10171
|
getItemRole(item) {
|
|
10155
10172
|
return this.hasItemLink(item) ? 'link' : null;
|
|
@@ -10163,14 +10180,15 @@ class PTNewsTickerComponent {
|
|
|
10163
10180
|
: -1;
|
|
10164
10181
|
}
|
|
10165
10182
|
queueOrApplyNews(news) {
|
|
10166
|
-
this.
|
|
10183
|
+
const clonedNews = this.cloneNews(news);
|
|
10184
|
+
this.scheduleNewBadges(clonedNews);
|
|
10167
10185
|
if (this.shouldApplyNewsImmediately()) {
|
|
10168
10186
|
this.pendingNews = null;
|
|
10169
|
-
this.internalNews =
|
|
10170
|
-
this.scheduleAnimationRefresh();
|
|
10187
|
+
this.internalNews = clonedNews;
|
|
10188
|
+
this.scheduleAnimationRefresh(true);
|
|
10171
10189
|
return;
|
|
10172
10190
|
}
|
|
10173
|
-
this.pendingNews =
|
|
10191
|
+
this.pendingNews = clonedNews;
|
|
10174
10192
|
}
|
|
10175
10193
|
shouldApplyNewsImmediately() {
|
|
10176
10194
|
return (!this.viewInitialized ||
|
|
@@ -10179,21 +10197,47 @@ class PTNewsTickerComponent {
|
|
|
10179
10197
|
this.internalNews.length === 0 ||
|
|
10180
10198
|
this.prefersReducedMotion());
|
|
10181
10199
|
}
|
|
10182
|
-
|
|
10183
|
-
if (!this.pendingNews) {
|
|
10200
|
+
applyPendingNewsAtCycleBoundary() {
|
|
10201
|
+
if (!this.pendingNews || this.applyingPendingNews) {
|
|
10184
10202
|
return;
|
|
10185
10203
|
}
|
|
10186
|
-
|
|
10204
|
+
this.applyingPendingNews = true;
|
|
10205
|
+
const nextNews = this.cloneNews(this.pendingNews);
|
|
10187
10206
|
this.pendingNews = null;
|
|
10188
10207
|
this.internalNews = nextNews;
|
|
10189
10208
|
this.changeDetectorRef.detectChanges();
|
|
10190
|
-
this.
|
|
10209
|
+
this.zone.runOutsideAngular(() => {
|
|
10210
|
+
requestAnimationFrame(() => {
|
|
10211
|
+
requestAnimationFrame(() => {
|
|
10212
|
+
this.zone.run(() => {
|
|
10213
|
+
this.calculateAnimationDuration();
|
|
10214
|
+
this.applyingPendingNews = false;
|
|
10215
|
+
});
|
|
10216
|
+
});
|
|
10217
|
+
});
|
|
10218
|
+
});
|
|
10191
10219
|
}
|
|
10192
10220
|
applyPendingNewsImmediately() {
|
|
10193
10221
|
if (!this.pendingNews) {
|
|
10194
10222
|
return;
|
|
10195
10223
|
}
|
|
10196
|
-
this.
|
|
10224
|
+
const nextNews = this.cloneNews(this.pendingNews);
|
|
10225
|
+
this.pendingNews = null;
|
|
10226
|
+
this.internalNews = nextNews;
|
|
10227
|
+
this.changeDetectorRef.detectChanges();
|
|
10228
|
+
this.scheduleAnimationRefresh(true);
|
|
10229
|
+
}
|
|
10230
|
+
isTickerScrollEvent(event) {
|
|
10231
|
+
return (event.animationName === PTNewsTickerComponent.SCROLL_ANIMATION_NAME &&
|
|
10232
|
+
event.target === event.currentTarget);
|
|
10233
|
+
}
|
|
10234
|
+
resolveItemBackgroundColor(item, typeBackgroundColor) {
|
|
10235
|
+
if (item.type === PTNewsTickerType.INFO ||
|
|
10236
|
+
!item.type ||
|
|
10237
|
+
item.type === PTNewsTickerType.DEFAULT) {
|
|
10238
|
+
return 'transparent';
|
|
10239
|
+
}
|
|
10240
|
+
return item.backgroundColor ?? typeBackgroundColor ?? 'transparent';
|
|
10197
10241
|
}
|
|
10198
10242
|
scheduleNewBadges(news) {
|
|
10199
10243
|
news.forEach((item) => {
|
|
@@ -10289,26 +10333,29 @@ class PTNewsTickerComponent {
|
|
|
10289
10333
|
return 'running';
|
|
10290
10334
|
}
|
|
10291
10335
|
initializeResizeObserver() {
|
|
10292
|
-
if (typeof ResizeObserver === 'undefined'
|
|
10293
|
-
|
|
10336
|
+
if (typeof ResizeObserver === 'undefined') {
|
|
10337
|
+
return;
|
|
10338
|
+
}
|
|
10339
|
+
const viewportElement = this.tickerViewport?.nativeElement;
|
|
10340
|
+
if (!viewportElement) {
|
|
10294
10341
|
return;
|
|
10295
10342
|
}
|
|
10296
10343
|
this.zone.runOutsideAngular(() => {
|
|
10297
10344
|
this.resizeObserver = new ResizeObserver(() => {
|
|
10298
10345
|
this.zone.run(() => {
|
|
10299
|
-
this.
|
|
10346
|
+
this.scheduleAnimationRefresh(true);
|
|
10300
10347
|
});
|
|
10301
10348
|
});
|
|
10302
|
-
this.resizeObserver.observe(
|
|
10303
|
-
if (this.tickerViewport?.nativeElement) {
|
|
10304
|
-
this.resizeObserver.observe(this.tickerViewport.nativeElement);
|
|
10305
|
-
}
|
|
10349
|
+
this.resizeObserver.observe(viewportElement);
|
|
10306
10350
|
});
|
|
10307
10351
|
}
|
|
10308
|
-
scheduleAnimationRefresh() {
|
|
10352
|
+
scheduleAnimationRefresh(force = false) {
|
|
10309
10353
|
if (!this.viewInitialized) {
|
|
10310
10354
|
return;
|
|
10311
10355
|
}
|
|
10356
|
+
if (!force && this.playing && this.loop) {
|
|
10357
|
+
return;
|
|
10358
|
+
}
|
|
10312
10359
|
if (this.animationFrameId !== null) {
|
|
10313
10360
|
cancelAnimationFrame(this.animationFrameId);
|
|
10314
10361
|
}
|
|
@@ -10318,26 +10365,45 @@ class PTNewsTickerComponent {
|
|
|
10318
10365
|
});
|
|
10319
10366
|
}
|
|
10320
10367
|
calculateAnimationDuration() {
|
|
10368
|
+
const viewportElement = this.tickerViewport?.nativeElement;
|
|
10321
10369
|
const groupElement = this.tickerGroup?.nativeElement;
|
|
10322
|
-
if (!groupElement || this.internalNews.length === 0) {
|
|
10370
|
+
if (!viewportElement || !groupElement || this.internalNews.length === 0) {
|
|
10371
|
+
this.loopGapPixels = 0;
|
|
10323
10372
|
this.animationDurationSeconds = 1;
|
|
10373
|
+
this.changeDetectorRef.markForCheck();
|
|
10324
10374
|
return;
|
|
10325
10375
|
}
|
|
10326
|
-
const
|
|
10376
|
+
const viewportWidth = Math.max(viewportElement.clientWidth, viewportElement.getBoundingClientRect().width, 1);
|
|
10377
|
+
const groupContentWidth = Math.max(groupElement.scrollWidth, groupElement.getBoundingClientRect().width, 1);
|
|
10378
|
+
const nextLoopGapPixels = this.hasSingleNewsItem() ? viewportWidth : 0;
|
|
10327
10379
|
const normalizedSpeed = this.normalizeSpeed(this.speed);
|
|
10328
|
-
|
|
10329
|
-
|
|
10380
|
+
const travelDistance = this.loop
|
|
10381
|
+
? groupContentWidth + nextLoopGapPixels
|
|
10382
|
+
: groupContentWidth + viewportWidth;
|
|
10383
|
+
const nextDuration = Math.max(1, travelDistance / normalizedSpeed);
|
|
10384
|
+
const durationChanged = Math.abs(nextDuration - this.animationDurationSeconds) >= 0.01;
|
|
10385
|
+
const loopGapChanged = Math.abs(nextLoopGapPixels - this.loopGapPixels) >= 0.5;
|
|
10386
|
+
this.loopGapPixels = nextLoopGapPixels;
|
|
10387
|
+
this.animationDurationSeconds = nextDuration;
|
|
10388
|
+
if (durationChanged || loopGapChanged) {
|
|
10389
|
+
this.changeDetectorRef.markForCheck();
|
|
10390
|
+
}
|
|
10330
10391
|
}
|
|
10331
10392
|
normalizeNews(news) {
|
|
10332
10393
|
if (!Array.isArray(news)) {
|
|
10333
10394
|
return [];
|
|
10334
10395
|
}
|
|
10335
|
-
|
|
10396
|
+
const normalizedItems = news
|
|
10336
10397
|
.filter((item) => item &&
|
|
10337
10398
|
item.id !== null &&
|
|
10338
10399
|
item.id !== undefined &&
|
|
10339
10400
|
String(item.text ?? '').trim().length > 0)
|
|
10340
10401
|
.map((item) => this.normalizeItem(item));
|
|
10402
|
+
const itemsById = new Map();
|
|
10403
|
+
normalizedItems.forEach((item) => {
|
|
10404
|
+
itemsById.set(String(item.id), item);
|
|
10405
|
+
});
|
|
10406
|
+
return Array.from(itemsById.values());
|
|
10341
10407
|
}
|
|
10342
10408
|
normalizeItem(item) {
|
|
10343
10409
|
return {
|
|
@@ -10371,6 +10437,14 @@ class PTNewsTickerComponent {
|
|
|
10371
10437
|
: String(segment.value).trim(),
|
|
10372
10438
|
}));
|
|
10373
10439
|
}
|
|
10440
|
+
cloneNews(news) {
|
|
10441
|
+
return news.map((item) => ({
|
|
10442
|
+
...item,
|
|
10443
|
+
segments: item.segments?.map((segment) => ({
|
|
10444
|
+
...segment,
|
|
10445
|
+
})),
|
|
10446
|
+
}));
|
|
10447
|
+
}
|
|
10374
10448
|
normalizeSpeed(speed) {
|
|
10375
10449
|
const numericSpeed = Number(speed);
|
|
10376
10450
|
const safeMinSpeed = Math.max(1, Number(this.minSpeed) || 1);
|
|
@@ -10400,9 +10474,9 @@ class PTNewsTickerComponent {
|
|
|
10400
10474
|
switch (type) {
|
|
10401
10475
|
case PTNewsTickerType.INFO:
|
|
10402
10476
|
return {
|
|
10403
|
-
backgroundColor: '
|
|
10477
|
+
backgroundColor: 'transparent',
|
|
10404
10478
|
textColor: '#1e3a8a',
|
|
10405
|
-
borderColor: '#
|
|
10479
|
+
borderColor: '#bfdbfe',
|
|
10406
10480
|
};
|
|
10407
10481
|
case PTNewsTickerType.SUCCESS:
|
|
10408
10482
|
return {
|
|
@@ -10418,9 +10492,9 @@ class PTNewsTickerComponent {
|
|
|
10418
10492
|
};
|
|
10419
10493
|
case PTNewsTickerType.DANGER:
|
|
10420
10494
|
return {
|
|
10421
|
-
backgroundColor: '#
|
|
10422
|
-
textColor: '#
|
|
10423
|
-
borderColor: '#
|
|
10495
|
+
backgroundColor: '#dc2626',
|
|
10496
|
+
textColor: '#ffffff',
|
|
10497
|
+
borderColor: '#991b1b',
|
|
10424
10498
|
};
|
|
10425
10499
|
case PTNewsTickerType.FLASH:
|
|
10426
10500
|
return {
|
|
@@ -10430,18 +10504,18 @@ class PTNewsTickerComponent {
|
|
|
10430
10504
|
};
|
|
10431
10505
|
default:
|
|
10432
10506
|
return {
|
|
10433
|
-
backgroundColor: '
|
|
10507
|
+
backgroundColor: 'transparent',
|
|
10434
10508
|
textColor: '#0f172a',
|
|
10435
10509
|
borderColor: '#e2e8f0',
|
|
10436
10510
|
};
|
|
10437
10511
|
}
|
|
10438
10512
|
}
|
|
10439
10513
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PTNewsTickerComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10440
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: PTNewsTickerComponent, isStandalone: false, selector: "pt-news-ticker", inputs: { news: "news", speed: "speed", defaultSpeed: "defaultSpeed", speedStep: "speedStep", minSpeed: "minSpeed", maxSpeed: "maxSpeed", direction: "direction", autoplay: "autoplay", loop: "loop", pauseOnHover: "pauseOnHover", showControls: "showControls", showPlayPauseControl: "showPlayPauseControl", showSpeedControls: "showSpeedControls", showResetSpeedControl: "showResetSpeedControl", showRemoveButton: "showRemoveButton", showSpeedValue: "showSpeedValue", showNewBadge: "showNewBadge", newBadgeText: "newBadgeText", newBadgeDuration: "newBadgeDuration", height: "height", gap: "gap", itemGap: "itemGap", containerBackgroundColor: "containerBackgroundColor", containerTextColor: "containerTextColor", borderColor: "borderColor", borderWidth: "borderWidth", borderRadius: "borderRadius", controlsBackgroundColor: "controlsBackgroundColor", controlsBorderColor: "controlsBorderColor", emptyMessage: "emptyMessage", emptyIcon: "emptyIcon", ariaLabel: "ariaLabel" }, outputs: { newsClick: "newsClick", newsRemove: "newsRemove", newsChange: "newsChange", playStateChange: "playStateChange", speedChange: "speedChange" }, viewQueries: [{ propertyName: "tickerViewport", first: true, predicate: ["tickerViewport"], descendants: true }, { propertyName: "tickerGroup", first: true, predicate: ["tickerGroup"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"pt-news-ticker\"\n [ngStyle]=\"getContainerStyle()\"\n [attr.aria-label]=\"ariaLabel\"\n role=\"region\"\n>\n @if (showControls) {\n <div class=\"pt-news-ticker__controls\">\n @if (showPlayPauseControl) {\n <button\n pButton\n pRipple\n type=\"button\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n [icon]=\"playing ? 'pi pi-pause' : 'pi pi-play'\"\n [pTooltip]=\"playing ? 'Mettre en pause' : 'Reprendre'\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-label]=\"\n playing ? 'Mettre le ruban en pause' : 'Reprendre le ruban'\n \"\n (click)=\"togglePlayState()\"\n ></button>\n }\n\n @if (showSpeedControls) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-minus\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Ralentir\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"Ralentir le ruban\"\n [disabled]=\"speed <= minSpeed\"\n (click)=\"decreaseSpeed()\"\n ></button>\n\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-plus\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Acc\u00E9l\u00E9rer\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"Acc\u00E9l\u00E9rer le ruban\"\n [disabled]=\"speed >= maxSpeed\"\n (click)=\"increaseSpeed()\"\n ></button>\n }\n\n @if (showResetSpeedControl) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-refresh\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"R\u00E9initialiser la vitesse\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"R\u00E9initialiser la vitesse\"\n [disabled]=\"speed === defaultSpeed\"\n (click)=\"resetSpeed()\"\n ></button>\n }\n\n @if (showSpeedValue) {\n <span\n class=\"pt-news-ticker__speed\"\n [attr.aria-label]=\"'Vitesse ' + speed + ' pixels par seconde'\"\n >\n {{ speed }} px/s\n </span>\n }\n </div>\n }\n\n <div\n #tickerViewport\n class=\"pt-news-ticker__viewport\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n >\n @if (internalNews.length > 0) {\n <div\n class=\"pt-news-ticker__track\"\n [class.pt-news-ticker__track--single]=\"!loop\"\n [ngStyle]=\"getTrackStyle()\"\n (animationiteration)=\"onTrackAnimationIteration()\"\n (animationend)=\"onTrackAnimationEnd()\"\n >\n <div\n #tickerGroup\n class=\"pt-news-ticker__group\"\n [attr.aria-hidden]=\"false\"\n >\n @for (item of internalNews; track getTrackById($index, item)) {\n <article\n class=\"pt-news-ticker__item\"\n [ngClass]=\"getItemClasses(item)\"\n [ngStyle]=\"getItemStyle(item)\"\n [pTooltip]=\"item.tooltip || ''\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-disabled]=\"item.disabled\"\n [attr.aria-label]=\"\n hasItemLink(item) ? item.text + ', ouvrir le lien' : item.text\n \"\n [attr.role]=\"getItemRole(item)\"\n [attr.tabindex]=\"getItemTabIndex(item)\"\n (click)=\"onItemClick($event, item)\"\n (keydown.enter)=\"onItemClick($event, item)\"\n (keydown.space)=\"onItemClick($event, item)\"\n >\n @if (item.icon) {\n <i\n class=\"pt-news-ticker__item-icon\"\n [ngClass]=\"item.icon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n <div class=\"pt-news-ticker__content\">\n <span class=\"pt-news-ticker__item-title\">\n {{ item.text }}\n </span>\n\n @if (hasSegments(item)) {\n <span class=\"pt-news-ticker__segments\">\n @for (segment of item.segments; track $index) {\n @if ($index > 0) {\n <span\n class=\"pt-news-ticker__segment-separator\"\n aria-hidden=\"true\"\n >\n {{ getSegmentSeparator(item) }}\n </span>\n }\n\n <span\n class=\"pt-news-ticker__segment\"\n [ngStyle]=\"getSegmentStyle(segment)\"\n [pTooltip]=\"segment.tooltip || ''\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n >\n @if (segment.label) {\n <span class=\"pt-news-ticker__segment-label\">\n {{ segment.label }}\n </span>\n }\n\n @if (getSegmentIcon(segment); as segmentIcon) {\n <i\n class=\"pt-news-ticker__segment-icon\"\n [ngClass]=\"segmentIcon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (segment.value) {\n <span class=\"pt-news-ticker__segment-value\">\n {{ segment.value }}\n </span>\n }\n </span>\n }\n </span>\n }\n </div>\n\n @if (shouldShowNewBadge(item)) {\n <span class=\"pt-news-ticker__new-badge\">\n {{ getNewBadgeText(item) }}\n </span>\n }\n\n @if (hasItemLink(item)) {\n <i\n class=\"pt-news-ticker__link-icon pi pi-external-link\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (isItemRemovable(item)) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-times\"\n class=\"pt-news-ticker__remove-button p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Supprimer l\u2019actualit\u00E9\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-label]=\"'Supprimer : ' + item.text\"\n (click)=\"onRemoveClick($event, item)\"\n ></button>\n }\n </article>\n }\n </div>\n\n @if (loop) {\n <div class=\"pt-news-ticker__group\" aria-hidden=\"true\">\n @for (\n item of internalNews;\n track getDuplicateTrackById($index, item)\n ) {\n <article\n class=\"pt-news-ticker__item\"\n [ngClass]=\"getDuplicateItemClasses(item)\"\n [ngStyle]=\"getItemStyle(item)\"\n >\n @if (item.icon) {\n <i\n class=\"pt-news-ticker__item-icon\"\n [ngClass]=\"item.icon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n <div class=\"pt-news-ticker__content\">\n <span class=\"pt-news-ticker__item-title\">\n {{ item.text }}\n </span>\n\n @if (hasSegments(item)) {\n <span class=\"pt-news-ticker__segments\">\n @for (segment of item.segments; track $index) {\n @if ($index > 0) {\n <span\n class=\"pt-news-ticker__segment-separator\"\n aria-hidden=\"true\"\n >\n {{ getSegmentSeparator(item) }}\n </span>\n }\n\n <span\n class=\"pt-news-ticker__segment\"\n [ngStyle]=\"getSegmentStyle(segment)\"\n >\n @if (segment.label) {\n <span class=\"pt-news-ticker__segment-label\">\n {{ segment.label }}\n </span>\n }\n\n @if (getSegmentIcon(segment); as segmentIcon) {\n <i\n class=\"pt-news-ticker__segment-icon\"\n [ngClass]=\"segmentIcon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (segment.value) {\n <span class=\"pt-news-ticker__segment-value\">\n {{ segment.value }}\n </span>\n }\n </span>\n }\n </span>\n }\n </div>\n\n @if (shouldShowNewBadge(item)) {\n <span class=\"pt-news-ticker__new-badge\">\n {{ getNewBadgeText(item) }}\n </span>\n }\n\n @if (hasItemLink(item)) {\n <i\n class=\"pt-news-ticker__link-icon pi pi-external-link\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (isItemRemovable(item)) {\n <span\n class=\"pt-news-ticker__duplicate-remove-placeholder\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-times\"></i>\n </span>\n }\n </article>\n }\n </div>\n }\n </div>\n } @else {\n <div class=\"pt-news-ticker__empty\">\n @if (emptyIcon) {\n <i [ngClass]=\"emptyIcon\" aria-hidden=\"true\"></i>\n }\n\n <span>{{ emptyMessage }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.pt-news-ticker{display:flex;align-items:stretch;width:100%;min-width:0;max-width:100%;min-height:var(--pt-news-ticker-height, 3.25rem);overflow:hidden;border:var(--pt-news-ticker-border-width, 1px) solid var(--pt-news-ticker-border-color, #e2e8f0);border-radius:var(--pt-news-ticker-border-radius, 8px);background:var(--pt-news-ticker-background, #ffffff);color:var(--pt-news-ticker-text-color, #0f172a)}.pt-news-ticker__controls{position:relative;z-index:4;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;gap:.1rem;min-height:var(--pt-news-ticker-height, 3.25rem);padding:.25rem .4rem;border-right:1px solid var(--pt-news-ticker-controls-border-color, #e2e8f0);background:var(--pt-news-ticker-controls-background, #f8fafc)}.pt-news-ticker__controls ::ng-deep .p-button.p-button-rounded.p-button-text{width:1.9rem;min-width:1.9rem;height:1.9rem;padding:0}.pt-news-ticker__controls ::ng-deep .p-button .p-button-icon{font-size:.78rem}.pt-news-ticker__speed{min-width:3.5rem;padding:0 .35rem;color:#475569;font-size:.7rem;font-weight:700;text-align:center;white-space:nowrap}.pt-news-ticker__viewport{position:relative;display:flex;align-items:center;flex:1 1 auto;width:100%;min-width:0;min-height:var(--pt-news-ticker-height, 3.25rem);overflow:hidden}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{position:absolute;z-index:3;top:0;bottom:0;width:2.5rem;content:\"\";pointer-events:none}.pt-news-ticker__viewport:before{left:0;background:linear-gradient(to right,var(--pt-news-ticker-background, #ffffff),transparent)}.pt-news-ticker__viewport:after{right:0;background:linear-gradient(to left,var(--pt-news-ticker-background, #ffffff),transparent)}.pt-news-ticker__track{display:flex;align-items:center;flex:0 0 auto;width:max-content;min-width:max-content;animation-name:pt-news-ticker-scroll;animation-duration:var(--pt-news-ticker-duration, 20s);animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform}.pt-news-ticker__track--single{animation-iteration-count:1;animation-fill-mode:forwards}.pt-news-ticker__group{display:inline-flex;align-items:center;flex:0 0 auto;gap:var(--pt-news-ticker-gap, 2rem);min-width:max-content;padding-right:var(--pt-news-ticker-gap, 2rem)}.pt-news-ticker__item{display:inline-flex;align-items:center;flex:0 0 auto;gap:var(--pt-news-item-gap, .5rem);min-height:2.25rem;max-width:48rem;padding:.35rem .65rem;overflow:hidden;border:1px solid var(--pt-news-item-border-color, transparent);border-radius:999px;outline:none;background:var(--pt-news-item-background, transparent);color:var( --pt-news-item-text-color, var(--pt-news-ticker-text-color, #0f172a) );line-height:1.25;white-space:nowrap;transition:box-shadow .15s ease,opacity .15s ease,transform .15s ease}.pt-news-ticker__item--clickable,.pt-news-ticker__item--link{cursor:pointer}.pt-news-ticker__item--clickable:hover,.pt-news-ticker__item--link:hover{box-shadow:0 3px 10px #0f172a1f;transform:translateY(-1px)}.pt-news-ticker__item:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--primary-color, #3b82f6)}.pt-news-ticker__item--disabled{cursor:not-allowed;opacity:.5}.pt-news-ticker__item-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:var(--pt-news-item-icon-color, currentColor);font-size:.95rem}.pt-news-ticker__content{display:inline-flex;align-items:center;flex:0 0 auto;gap:.55rem;min-width:0}.pt-news-ticker__item-title{display:inline-block;flex:0 0 auto;overflow:hidden;font-size:.85rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.pt-news-ticker__item-text{display:block;flex:1 1 auto;min-width:0;overflow:hidden;font-size:.85rem;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.pt-news-ticker__segments{display:inline-flex;align-items:center;flex:0 0 auto;gap:.45rem;white-space:nowrap}.pt-news-ticker__segment{display:inline-flex;align-items:center;flex:0 0 auto;gap:.22rem;color:var(--pt-news-segment-color, currentColor);font-size:.82rem;font-weight:700;white-space:nowrap}.pt-news-ticker__segment-label{color:inherit;font-weight:700}.pt-news-ticker__segment-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--pt-news-segment-icon-color, currentColor);font-size:.68rem;font-weight:700}.pt-news-ticker__segment-value{color:inherit;font-variant-numeric:tabular-nums;font-weight:800}.pt-news-ticker__segment-separator{color:#94a3b8;font-size:.75rem;font-weight:700}.pt-news-ticker__new-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:1.15rem;padding:.12rem .42rem;border:1px solid #93c5fd;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:.62rem;font-weight:800;line-height:1;letter-spacing:.025em;text-transform:uppercase;white-space:nowrap;animation:pt-news-ticker-new-badge-pulse 1.5s ease-in-out infinite}.pt-news-ticker__item--flash .pt-news-ticker__new-badge{border-color:#ffffffb3;background:#fff;color:#b91c1c}.pt-news-ticker__link-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:currentColor;font-size:.72rem;opacity:.75}.pt-news-ticker__item--link:hover .pt-news-ticker__link-icon{opacity:1}.pt-news-ticker__remove-button{flex:0 0 auto}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button{width:1.45rem;min-width:1.45rem;height:1.45rem;padding:0;color:currentColor}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button .p-button-icon{font-size:.65rem}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button:not(:disabled):hover{background:#0f172a1a}.pt-news-ticker__duplicate-remove-placeholder{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:1.45rem;min-width:1.45rem;height:1.45rem;opacity:0;pointer-events:none}.pt-news-ticker__duplicate-remove-placeholder .pi{font-size:.65rem}.pt-news-ticker__item--flash{border-color:var(--pt-news-item-border-color, #991b1b);color:var(--pt-news-flash-text-color, #ffffff);animation-name:pt-news-ticker-flash;animation-duration:var(--pt-news-flash-duration, .7s);animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}.pt-news-ticker__item--flash .pt-news-ticker__item-icon{color:var(--pt-news-item-icon-color, #ffffff)}.pt-news-ticker__empty{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:var(--pt-news-ticker-height, 3.25rem);padding:.75rem 1rem;color:#64748b;font-size:.85rem;font-weight:500;text-align:center}.pt-news-ticker__empty .pi{font-size:1rem}@keyframes pt-news-ticker-scroll{0%{transform:translateZ(0)}to{transform:translate3d(-50%,0,0)}}@keyframes pt-news-ticker-flash{0%{background-color:var(--pt-news-flash-background, #dc2626)}to{background-color:var(--pt-news-flash-alternate-background, #7f1d1d)}}@keyframes pt-news-ticker-new-badge-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.75;transform:scale(.96)}}@media(max-width:768px){.pt-news-ticker{min-height:3rem}.pt-news-ticker__controls{padding-right:.25rem;padding-left:.25rem}.pt-news-ticker__speed{display:none}.pt-news-ticker__item{max-width:34rem}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{width:1.25rem}}@media(max-width:480px){.pt-news-ticker__item{max-width:24rem}.pt-news-ticker__item-title,.pt-news-ticker__item-text{font-size:.78rem}.pt-news-ticker__segment{font-size:.75rem}.pt-news-ticker__new-badge{font-size:.56rem}}@media(prefers-reduced-motion:reduce){.pt-news-ticker__track{animation:none!important;transform:none!important}.pt-news-ticker__item--flash{animation:none!important;background-color:var(--pt-news-flash-background, #dc2626)!important}.pt-news-ticker__new-badge{animation:none!important}.pt-news-ticker__viewport{overflow-x:auto}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{display:none}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "directive", type: i13.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }] }); }
|
|
10514
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.14", type: PTNewsTickerComponent, isStandalone: false, selector: "pt-news-ticker", inputs: { news: "news", speed: "speed", defaultSpeed: "defaultSpeed", speedStep: "speedStep", minSpeed: "minSpeed", maxSpeed: "maxSpeed", direction: "direction", autoplay: "autoplay", loop: "loop", pauseOnHover: "pauseOnHover", showControls: "showControls", showPlayPauseControl: "showPlayPauseControl", showSpeedControls: "showSpeedControls", showResetSpeedControl: "showResetSpeedControl", showRemoveButton: "showRemoveButton", showSpeedValue: "showSpeedValue", showNewBadge: "showNewBadge", newBadgeText: "newBadgeText", newBadgeDuration: "newBadgeDuration", height: "height", gap: "gap", itemGap: "itemGap", containerBackgroundColor: "containerBackgroundColor", containerTextColor: "containerTextColor", borderColor: "borderColor", borderWidth: "borderWidth", borderRadius: "borderRadius", controlsBackgroundColor: "controlsBackgroundColor", controlsBorderColor: "controlsBorderColor", emptyMessage: "emptyMessage", emptyIcon: "emptyIcon", ariaLabel: "ariaLabel" }, outputs: { newsClick: "newsClick", newsRemove: "newsRemove", newsChange: "newsChange", playStateChange: "playStateChange", speedChange: "speedChange" }, viewQueries: [{ propertyName: "tickerViewport", first: true, predicate: ["tickerViewport"], descendants: true }, { propertyName: "tickerTrack", first: true, predicate: ["tickerTrack"], descendants: true }, { propertyName: "tickerGroup", first: true, predicate: ["tickerGroup"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"pt-news-ticker\"\n [ngStyle]=\"getContainerStyle()\"\n [attr.aria-label]=\"ariaLabel\"\n role=\"region\"\n>\n @if (showControls) {\n <div class=\"pt-news-ticker__controls\">\n @if (showPlayPauseControl) {\n <button\n pButton\n pRipple\n type=\"button\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n [icon]=\"playing ? 'pi pi-pause' : 'pi pi-play'\"\n [pTooltip]=\"playing ? 'Mettre en pause' : 'Reprendre'\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-label]=\"\n playing ? 'Mettre le ruban en pause' : 'Reprendre le ruban'\n \"\n (click)=\"togglePlayState()\"\n ></button>\n }\n\n @if (showSpeedControls) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-minus\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Ralentir\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"Ralentir le ruban\"\n [disabled]=\"speed <= minSpeed\"\n (click)=\"decreaseSpeed()\"\n ></button>\n\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-plus\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Acc\u00E9l\u00E9rer\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"Acc\u00E9l\u00E9rer le ruban\"\n [disabled]=\"speed >= maxSpeed\"\n (click)=\"increaseSpeed()\"\n ></button>\n }\n\n @if (showResetSpeedControl) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-refresh\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"R\u00E9initialiser la vitesse\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"R\u00E9initialiser la vitesse\"\n [disabled]=\"speed === defaultSpeed\"\n (click)=\"resetSpeed()\"\n ></button>\n }\n\n @if (showSpeedValue) {\n <span\n class=\"pt-news-ticker__speed\"\n [attr.aria-label]=\"'Vitesse ' + speed + ' pixels par seconde'\"\n >\n {{ speed }} px/s\n </span>\n }\n </div>\n }\n\n <div\n #tickerViewport\n class=\"pt-news-ticker__viewport\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n >\n @if (internalNews.length > 0) {\n <div\n #tickerTrack\n class=\"pt-news-ticker__track\"\n [class.pt-news-ticker__track--single]=\"!loop\"\n [ngStyle]=\"getTrackStyle()\"\n (animationiteration)=\"onTrackAnimationIteration($event)\"\n (animationend)=\"onTrackAnimationEnd($event)\"\n >\n <div\n #tickerGroup\n class=\"pt-news-ticker__group\"\n [class.pt-news-ticker__group--single]=\"hasSingleNewsItem()\"\n [attr.aria-hidden]=\"false\"\n >\n @for (item of internalNews; track getTrackById($index, item)) {\n <article\n class=\"pt-news-ticker__item\"\n [ngClass]=\"getItemClasses(item)\"\n [ngStyle]=\"getItemStyle(item)\"\n [pTooltip]=\"item.tooltip || ''\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-disabled]=\"item.disabled\"\n [attr.aria-label]=\"\n hasItemLink(item) ? item.text + ', ouvrir le lien' : item.text\n \"\n [attr.role]=\"getItemRole(item)\"\n [attr.tabindex]=\"getItemTabIndex(item)\"\n (click)=\"onItemClick($event, item)\"\n (keydown.enter)=\"onItemClick($event, item)\"\n (keydown.space)=\"onItemClick($event, item)\"\n >\n @if (item.icon) {\n <i\n class=\"pt-news-ticker__item-icon\"\n [ngClass]=\"item.icon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n <div class=\"pt-news-ticker__content\">\n <span class=\"pt-news-ticker__item-title\">\n {{ item.text }}\n </span>\n\n @if (hasSegments(item)) {\n <span class=\"pt-news-ticker__segments\">\n @for (segment of item.segments; track $index) {\n @if ($index > 0) {\n <span\n class=\"pt-news-ticker__segment-separator\"\n aria-hidden=\"true\"\n >\n {{ getSegmentSeparator(item) }}\n </span>\n }\n\n <span\n class=\"pt-news-ticker__segment\"\n [ngStyle]=\"getSegmentStyle(segment)\"\n [pTooltip]=\"segment.tooltip || ''\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n >\n @if (segment.label) {\n <span class=\"pt-news-ticker__segment-label\">\n {{ segment.label }}\n </span>\n }\n\n @if (getSegmentIcon(segment); as segmentIcon) {\n <i\n class=\"pt-news-ticker__segment-icon\"\n [ngClass]=\"segmentIcon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (segment.value) {\n <span class=\"pt-news-ticker__segment-value\">\n {{ segment.value }}\n </span>\n }\n </span>\n }\n </span>\n }\n </div>\n\n @if (shouldShowNewBadge(item)) {\n <span class=\"pt-news-ticker__new-badge\">\n {{ getNewBadgeText(item) }}\n </span>\n }\n\n @if (hasItemLink(item)) {\n <i\n class=\"pt-news-ticker__link-icon pi pi-external-link\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (isItemRemovable(item)) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-times\"\n class=\"pt-news-ticker__remove-button p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Supprimer l\u2019actualit\u00E9\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-label]=\"'Supprimer : ' + item.text\"\n (click)=\"onRemoveClick($event, item)\"\n ></button>\n }\n </article>\n }\n </div>\n\n @if (loop) {\n <div\n class=\"pt-news-ticker__group\"\n [class.pt-news-ticker__group--single]=\"hasSingleNewsItem()\"\n aria-hidden=\"true\"\n >\n @for (\n item of internalNews;\n track getDuplicateTrackById($index, item)\n ) {\n <article\n class=\"pt-news-ticker__item\"\n [ngClass]=\"getDuplicateItemClasses(item)\"\n [ngStyle]=\"getItemStyle(item)\"\n >\n @if (item.icon) {\n <i\n class=\"pt-news-ticker__item-icon\"\n [ngClass]=\"item.icon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n <div class=\"pt-news-ticker__content\">\n <span class=\"pt-news-ticker__item-title\">\n {{ item.text }}\n </span>\n\n @if (hasSegments(item)) {\n <span class=\"pt-news-ticker__segments\">\n @for (segment of item.segments; track $index) {\n @if ($index > 0) {\n <span\n class=\"pt-news-ticker__segment-separator\"\n aria-hidden=\"true\"\n >\n {{ getSegmentSeparator(item) }}\n </span>\n }\n\n <span\n class=\"pt-news-ticker__segment\"\n [ngStyle]=\"getSegmentStyle(segment)\"\n >\n @if (segment.label) {\n <span class=\"pt-news-ticker__segment-label\">\n {{ segment.label }}\n </span>\n }\n\n @if (getSegmentIcon(segment); as segmentIcon) {\n <i\n class=\"pt-news-ticker__segment-icon\"\n [ngClass]=\"segmentIcon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (segment.value) {\n <span class=\"pt-news-ticker__segment-value\">\n {{ segment.value }}\n </span>\n }\n </span>\n }\n </span>\n }\n </div>\n\n @if (shouldShowNewBadge(item)) {\n <span class=\"pt-news-ticker__new-badge\">\n {{ getNewBadgeText(item) }}\n </span>\n }\n\n @if (hasItemLink(item)) {\n <i\n class=\"pt-news-ticker__link-icon pi pi-external-link\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (isItemRemovable(item)) {\n <span\n class=\"pt-news-ticker__duplicate-remove-placeholder\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-times\"></i>\n </span>\n }\n </article>\n }\n </div>\n }\n </div>\n } @else {\n <div class=\"pt-news-ticker__empty\">\n @if (emptyIcon) {\n <i [ngClass]=\"emptyIcon\" aria-hidden=\"true\"></i>\n }\n\n <span>{{ emptyMessage }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.pt-news-ticker{display:flex;align-items:stretch;width:100%;min-width:0;max-width:100%;min-height:var(--pt-news-ticker-height, 3.25rem);overflow:hidden;border:var(--pt-news-ticker-border-width, 1px) solid var(--pt-news-ticker-border-color, #e2e8f0);border-radius:var(--pt-news-ticker-border-radius, 8px);background:var(--pt-news-ticker-background, #ffffff);color:var(--pt-news-ticker-text-color, #0f172a)}.pt-news-ticker__controls{position:relative;z-index:4;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;gap:.1rem;min-height:var(--pt-news-ticker-height, 3.25rem);padding:.25rem .4rem;border-right:1px solid var(--pt-news-ticker-controls-border-color, #e2e8f0);background:var(--pt-news-ticker-controls-background, #f8fafc)}.pt-news-ticker__controls ::ng-deep .p-button.p-button-rounded.p-button-text{width:1.9rem;min-width:1.9rem;height:1.9rem;padding:0}.pt-news-ticker__controls ::ng-deep .p-button .p-button-icon{font-size:.78rem}.pt-news-ticker__speed{min-width:3.5rem;padding:0 .35rem;color:#475569;font-size:.7rem;font-weight:700;text-align:center;white-space:nowrap}.pt-news-ticker__viewport{position:relative;display:flex;align-items:center;flex:1 1 auto;width:100%;min-width:0;min-height:var(--pt-news-ticker-height, 3.25rem);overflow:hidden;contain:layout paint}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{position:absolute;z-index:3;top:0;bottom:0;width:2.5rem;content:\"\";pointer-events:none}.pt-news-ticker__viewport:before{left:0;background:linear-gradient(to right,var(--pt-news-ticker-background, #ffffff),transparent)}.pt-news-ticker__viewport:after{right:0;background:linear-gradient(to left,var(--pt-news-ticker-background, #ffffff),transparent)}.pt-news-ticker__track{display:flex;align-items:center;flex:0 0 auto;width:max-content;min-width:max-content;transform:translateZ(0);animation-name:pt-news-ticker-scroll;animation-duration:var(--pt-news-ticker-duration, 20s);animation-timing-function:linear;animation-iteration-count:infinite;animation-fill-mode:both;backface-visibility:hidden;will-change:transform}.pt-news-ticker__track--single{animation-iteration-count:1;animation-fill-mode:forwards}.pt-news-ticker__group{display:inline-flex;align-items:center;flex:0 0 auto;gap:var(--pt-news-ticker-gap, 2rem);width:max-content;min-width:max-content;padding-right:var(--pt-news-ticker-gap, 2rem)}.pt-news-ticker__group--single{padding-right:max(var(--pt-news-ticker-gap, 2rem),var(--pt-news-ticker-loop-gap, 0px))}.pt-news-ticker__item{display:inline-flex;align-items:center;flex:0 0 auto;gap:var(--pt-news-item-gap, .5rem);width:max-content;min-width:max-content;max-width:none;min-height:2.25rem;padding:.35rem .65rem;overflow:visible;border:1px solid var(--pt-news-item-border-color, transparent);border-radius:999px;outline:none;background:var(--pt-news-item-background, transparent);color:var( --pt-news-item-text-color, var(--pt-news-ticker-text-color, #0f172a) );line-height:1.25;white-space:nowrap;transition:box-shadow .15s ease,opacity .15s ease,transform .15s ease}.pt-news-ticker__item--info,.pt-news-ticker__item--default{background:transparent}.pt-news-ticker__item--clickable,.pt-news-ticker__item--link{cursor:pointer}.pt-news-ticker__item--clickable:hover,.pt-news-ticker__item--link:hover{box-shadow:0 3px 10px #0f172a1f;transform:translateY(-1px)}.pt-news-ticker__item:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--primary-color, #3b82f6)}.pt-news-ticker__item--disabled{cursor:not-allowed;opacity:.5}.pt-news-ticker__item-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:var(--pt-news-item-icon-color, currentColor);font-size:.95rem}.pt-news-ticker__content{display:inline-flex;align-items:center;flex:0 0 auto;gap:.55rem;width:max-content;min-width:max-content;overflow:visible;white-space:nowrap}.pt-news-ticker__item-title{display:inline-block;flex:0 0 auto;width:max-content;min-width:max-content;overflow:visible;font-size:.85rem;font-weight:700;text-overflow:clip;white-space:nowrap}.pt-news-ticker__item-text{display:block;flex:0 0 auto;width:max-content;min-width:max-content;overflow:visible;font-size:.85rem;font-weight:600;text-overflow:clip;white-space:nowrap}.pt-news-ticker__segments{display:inline-flex;align-items:center;flex:0 0 auto;width:max-content;min-width:max-content;gap:.45rem;overflow:visible;white-space:nowrap}.pt-news-ticker__segment{display:inline-flex;align-items:center;flex:0 0 auto;gap:.22rem;color:var(--pt-news-segment-color, currentColor);font-size:.82rem;font-weight:700;white-space:nowrap}.pt-news-ticker__segment-label{color:inherit;font-weight:700}.pt-news-ticker__segment-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--pt-news-segment-icon-color, currentColor);font-size:.68rem;font-weight:700}.pt-news-ticker__segment-value{color:inherit;font-variant-numeric:tabular-nums;font-weight:800}.pt-news-ticker__segment-separator{color:#94a3b8;font-size:.75rem;font-weight:700}.pt-news-ticker__new-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:1.15rem;padding:.12rem .42rem;border:1px solid #93c5fd;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:.62rem;font-weight:800;line-height:1;letter-spacing:.025em;text-transform:uppercase;white-space:nowrap;animation:pt-news-ticker-new-badge-pulse 1.5s ease-in-out infinite}.pt-news-ticker__item--flash .pt-news-ticker__new-badge{border-color:#ffffffb3;background:#fff;color:#b91c1c}.pt-news-ticker__item--danger .pt-news-ticker__new-badge{border-color:#ffffffbf;background:#fff;color:#b91c1c}.pt-news-ticker__link-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:currentColor;font-size:.72rem;opacity:.75}.pt-news-ticker__item--link:hover .pt-news-ticker__link-icon{opacity:1}.pt-news-ticker__remove-button{flex:0 0 auto}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button{width:1.45rem;min-width:1.45rem;height:1.45rem;padding:0;color:currentColor}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button .p-button-icon{font-size:.65rem}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button:not(:disabled):hover{background:#0f172a1a}.pt-news-ticker__duplicate-remove-placeholder{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:1.45rem;min-width:1.45rem;height:1.45rem;opacity:0;pointer-events:none}.pt-news-ticker__duplicate-remove-placeholder .pi{font-size:.65rem}.pt-news-ticker__item--flash{border-color:var(--pt-news-item-border-color, #991b1b);color:var(--pt-news-flash-text-color, #ffffff);animation-name:pt-news-ticker-flash;animation-duration:var(--pt-news-flash-duration, .7s);animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}.pt-news-ticker__item--flash .pt-news-ticker__item-icon{color:var(--pt-news-item-icon-color, #ffffff)}.pt-news-ticker__empty{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:var(--pt-news-ticker-height, 3.25rem);padding:.75rem 1rem;color:#64748b;font-size:.85rem;font-weight:500;text-align:center}.pt-news-ticker__empty .pi{font-size:1rem}@keyframes pt-news-ticker-scroll{0%{transform:translateZ(0)}to{transform:translate3d(-50%,0,0)}}@keyframes pt-news-ticker-flash{0%{background-color:var(--pt-news-flash-background, #dc2626)}to{background-color:var(--pt-news-flash-alternate-background, #7f1d1d)}}@keyframes pt-news-ticker-new-badge-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.75;transform:scale(.96)}}@media(max-width:768px){.pt-news-ticker{min-height:3rem}.pt-news-ticker__controls{padding-right:.25rem;padding-left:.25rem}.pt-news-ticker__speed{display:none}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{width:1.25rem}}@media(max-width:480px){.pt-news-ticker__item-title,.pt-news-ticker__item-text{font-size:.78rem}.pt-news-ticker__segment{font-size:.75rem}.pt-news-ticker__new-badge{font-size:.56rem}}@media(prefers-reduced-motion:reduce){.pt-news-ticker__track{animation:none!important;transform:none!important}.pt-news-ticker__item--flash{animation:none!important;background-color:var(--pt-news-flash-background, #dc2626)!important}.pt-news-ticker__new-badge{animation:none!important}.pt-news-ticker__viewport{overflow-x:auto;contain:none}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{display:none}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i6.ButtonDirective, selector: "[pButton]", inputs: ["ptButtonDirective", "pButtonPT", "pButtonUnstyled", "hostName", "text", "plain", "raised", "size", "outlined", "rounded", "iconPos", "loadingIcon", "fluid", "label", "icon", "loading", "buttonProps", "severity"] }, { kind: "directive", type: i13.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "showOnEllipsis", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }] }); }
|
|
10441
10515
|
}
|
|
10442
10516
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImport: i0, type: PTNewsTickerComponent, decorators: [{
|
|
10443
10517
|
type: Component,
|
|
10444
|
-
args: [{ selector: 'pt-news-ticker', standalone: false, template: "<div\n class=\"pt-news-ticker\"\n [ngStyle]=\"getContainerStyle()\"\n [attr.aria-label]=\"ariaLabel\"\n role=\"region\"\n>\n @if (showControls) {\n <div class=\"pt-news-ticker__controls\">\n @if (showPlayPauseControl) {\n <button\n pButton\n pRipple\n type=\"button\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n [icon]=\"playing ? 'pi pi-pause' : 'pi pi-play'\"\n [pTooltip]=\"playing ? 'Mettre en pause' : 'Reprendre'\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-label]=\"\n playing ? 'Mettre le ruban en pause' : 'Reprendre le ruban'\n \"\n (click)=\"togglePlayState()\"\n ></button>\n }\n\n @if (showSpeedControls) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-minus\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Ralentir\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"Ralentir le ruban\"\n [disabled]=\"speed <= minSpeed\"\n (click)=\"decreaseSpeed()\"\n ></button>\n\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-plus\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Acc\u00E9l\u00E9rer\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"Acc\u00E9l\u00E9rer le ruban\"\n [disabled]=\"speed >= maxSpeed\"\n (click)=\"increaseSpeed()\"\n ></button>\n }\n\n @if (showResetSpeedControl) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-refresh\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"R\u00E9initialiser la vitesse\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"R\u00E9initialiser la vitesse\"\n [disabled]=\"speed === defaultSpeed\"\n (click)=\"resetSpeed()\"\n ></button>\n }\n\n @if (showSpeedValue) {\n <span\n class=\"pt-news-ticker__speed\"\n [attr.aria-label]=\"'Vitesse ' + speed + ' pixels par seconde'\"\n >\n {{ speed }} px/s\n </span>\n }\n </div>\n }\n\n <div\n #tickerViewport\n class=\"pt-news-ticker__viewport\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n >\n @if (internalNews.length > 0) {\n <div\n class=\"pt-news-ticker__track\"\n [class.pt-news-ticker__track--single]=\"!loop\"\n [ngStyle]=\"getTrackStyle()\"\n (animationiteration)=\"onTrackAnimationIteration()\"\n (animationend)=\"onTrackAnimationEnd()\"\n >\n <div\n #tickerGroup\n class=\"pt-news-ticker__group\"\n [attr.aria-hidden]=\"false\"\n >\n @for (item of internalNews; track getTrackById($index, item)) {\n <article\n class=\"pt-news-ticker__item\"\n [ngClass]=\"getItemClasses(item)\"\n [ngStyle]=\"getItemStyle(item)\"\n [pTooltip]=\"item.tooltip || ''\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-disabled]=\"item.disabled\"\n [attr.aria-label]=\"\n hasItemLink(item) ? item.text + ', ouvrir le lien' : item.text\n \"\n [attr.role]=\"getItemRole(item)\"\n [attr.tabindex]=\"getItemTabIndex(item)\"\n (click)=\"onItemClick($event, item)\"\n (keydown.enter)=\"onItemClick($event, item)\"\n (keydown.space)=\"onItemClick($event, item)\"\n >\n @if (item.icon) {\n <i\n class=\"pt-news-ticker__item-icon\"\n [ngClass]=\"item.icon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n <div class=\"pt-news-ticker__content\">\n <span class=\"pt-news-ticker__item-title\">\n {{ item.text }}\n </span>\n\n @if (hasSegments(item)) {\n <span class=\"pt-news-ticker__segments\">\n @for (segment of item.segments; track $index) {\n @if ($index > 0) {\n <span\n class=\"pt-news-ticker__segment-separator\"\n aria-hidden=\"true\"\n >\n {{ getSegmentSeparator(item) }}\n </span>\n }\n\n <span\n class=\"pt-news-ticker__segment\"\n [ngStyle]=\"getSegmentStyle(segment)\"\n [pTooltip]=\"segment.tooltip || ''\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n >\n @if (segment.label) {\n <span class=\"pt-news-ticker__segment-label\">\n {{ segment.label }}\n </span>\n }\n\n @if (getSegmentIcon(segment); as segmentIcon) {\n <i\n class=\"pt-news-ticker__segment-icon\"\n [ngClass]=\"segmentIcon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (segment.value) {\n <span class=\"pt-news-ticker__segment-value\">\n {{ segment.value }}\n </span>\n }\n </span>\n }\n </span>\n }\n </div>\n\n @if (shouldShowNewBadge(item)) {\n <span class=\"pt-news-ticker__new-badge\">\n {{ getNewBadgeText(item) }}\n </span>\n }\n\n @if (hasItemLink(item)) {\n <i\n class=\"pt-news-ticker__link-icon pi pi-external-link\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (isItemRemovable(item)) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-times\"\n class=\"pt-news-ticker__remove-button p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Supprimer l\u2019actualit\u00E9\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-label]=\"'Supprimer : ' + item.text\"\n (click)=\"onRemoveClick($event, item)\"\n ></button>\n }\n </article>\n }\n </div>\n\n @if (loop) {\n <div class=\"pt-news-ticker__group\" aria-hidden=\"true\">\n @for (\n item of internalNews;\n track getDuplicateTrackById($index, item)\n ) {\n <article\n class=\"pt-news-ticker__item\"\n [ngClass]=\"getDuplicateItemClasses(item)\"\n [ngStyle]=\"getItemStyle(item)\"\n >\n @if (item.icon) {\n <i\n class=\"pt-news-ticker__item-icon\"\n [ngClass]=\"item.icon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n <div class=\"pt-news-ticker__content\">\n <span class=\"pt-news-ticker__item-title\">\n {{ item.text }}\n </span>\n\n @if (hasSegments(item)) {\n <span class=\"pt-news-ticker__segments\">\n @for (segment of item.segments; track $index) {\n @if ($index > 0) {\n <span\n class=\"pt-news-ticker__segment-separator\"\n aria-hidden=\"true\"\n >\n {{ getSegmentSeparator(item) }}\n </span>\n }\n\n <span\n class=\"pt-news-ticker__segment\"\n [ngStyle]=\"getSegmentStyle(segment)\"\n >\n @if (segment.label) {\n <span class=\"pt-news-ticker__segment-label\">\n {{ segment.label }}\n </span>\n }\n\n @if (getSegmentIcon(segment); as segmentIcon) {\n <i\n class=\"pt-news-ticker__segment-icon\"\n [ngClass]=\"segmentIcon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (segment.value) {\n <span class=\"pt-news-ticker__segment-value\">\n {{ segment.value }}\n </span>\n }\n </span>\n }\n </span>\n }\n </div>\n\n @if (shouldShowNewBadge(item)) {\n <span class=\"pt-news-ticker__new-badge\">\n {{ getNewBadgeText(item) }}\n </span>\n }\n\n @if (hasItemLink(item)) {\n <i\n class=\"pt-news-ticker__link-icon pi pi-external-link\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (isItemRemovable(item)) {\n <span\n class=\"pt-news-ticker__duplicate-remove-placeholder\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-times\"></i>\n </span>\n }\n </article>\n }\n </div>\n }\n </div>\n } @else {\n <div class=\"pt-news-ticker__empty\">\n @if (emptyIcon) {\n <i [ngClass]=\"emptyIcon\" aria-hidden=\"true\"></i>\n }\n\n <span>{{ emptyMessage }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.pt-news-ticker{display:flex;align-items:stretch;width:100%;min-width:0;max-width:100%;min-height:var(--pt-news-ticker-height, 3.25rem);overflow:hidden;border:var(--pt-news-ticker-border-width, 1px) solid var(--pt-news-ticker-border-color, #e2e8f0);border-radius:var(--pt-news-ticker-border-radius, 8px);background:var(--pt-news-ticker-background, #ffffff);color:var(--pt-news-ticker-text-color, #0f172a)}.pt-news-ticker__controls{position:relative;z-index:4;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;gap:.1rem;min-height:var(--pt-news-ticker-height, 3.25rem);padding:.25rem .4rem;border-right:1px solid var(--pt-news-ticker-controls-border-color, #e2e8f0);background:var(--pt-news-ticker-controls-background, #f8fafc)}.pt-news-ticker__controls ::ng-deep .p-button.p-button-rounded.p-button-text{width:1.9rem;min-width:1.9rem;height:1.9rem;padding:0}.pt-news-ticker__controls ::ng-deep .p-button .p-button-icon{font-size:.78rem}.pt-news-ticker__speed{min-width:3.5rem;padding:0 .35rem;color:#475569;font-size:.7rem;font-weight:700;text-align:center;white-space:nowrap}.pt-news-ticker__viewport{position:relative;display:flex;align-items:center;flex:1 1 auto;width:100%;min-width:0;min-height:var(--pt-news-ticker-height, 3.25rem);overflow:hidden}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{position:absolute;z-index:3;top:0;bottom:0;width:2.5rem;content:\"\";pointer-events:none}.pt-news-ticker__viewport:before{left:0;background:linear-gradient(to right,var(--pt-news-ticker-background, #ffffff),transparent)}.pt-news-ticker__viewport:after{right:0;background:linear-gradient(to left,var(--pt-news-ticker-background, #ffffff),transparent)}.pt-news-ticker__track{display:flex;align-items:center;flex:0 0 auto;width:max-content;min-width:max-content;animation-name:pt-news-ticker-scroll;animation-duration:var(--pt-news-ticker-duration, 20s);animation-timing-function:linear;animation-iteration-count:infinite;will-change:transform}.pt-news-ticker__track--single{animation-iteration-count:1;animation-fill-mode:forwards}.pt-news-ticker__group{display:inline-flex;align-items:center;flex:0 0 auto;gap:var(--pt-news-ticker-gap, 2rem);min-width:max-content;padding-right:var(--pt-news-ticker-gap, 2rem)}.pt-news-ticker__item{display:inline-flex;align-items:center;flex:0 0 auto;gap:var(--pt-news-item-gap, .5rem);min-height:2.25rem;max-width:48rem;padding:.35rem .65rem;overflow:hidden;border:1px solid var(--pt-news-item-border-color, transparent);border-radius:999px;outline:none;background:var(--pt-news-item-background, transparent);color:var( --pt-news-item-text-color, var(--pt-news-ticker-text-color, #0f172a) );line-height:1.25;white-space:nowrap;transition:box-shadow .15s ease,opacity .15s ease,transform .15s ease}.pt-news-ticker__item--clickable,.pt-news-ticker__item--link{cursor:pointer}.pt-news-ticker__item--clickable:hover,.pt-news-ticker__item--link:hover{box-shadow:0 3px 10px #0f172a1f;transform:translateY(-1px)}.pt-news-ticker__item:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--primary-color, #3b82f6)}.pt-news-ticker__item--disabled{cursor:not-allowed;opacity:.5}.pt-news-ticker__item-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:var(--pt-news-item-icon-color, currentColor);font-size:.95rem}.pt-news-ticker__content{display:inline-flex;align-items:center;flex:0 0 auto;gap:.55rem;min-width:0}.pt-news-ticker__item-title{display:inline-block;flex:0 0 auto;overflow:hidden;font-size:.85rem;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.pt-news-ticker__item-text{display:block;flex:1 1 auto;min-width:0;overflow:hidden;font-size:.85rem;font-weight:600;text-overflow:ellipsis;white-space:nowrap}.pt-news-ticker__segments{display:inline-flex;align-items:center;flex:0 0 auto;gap:.45rem;white-space:nowrap}.pt-news-ticker__segment{display:inline-flex;align-items:center;flex:0 0 auto;gap:.22rem;color:var(--pt-news-segment-color, currentColor);font-size:.82rem;font-weight:700;white-space:nowrap}.pt-news-ticker__segment-label{color:inherit;font-weight:700}.pt-news-ticker__segment-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--pt-news-segment-icon-color, currentColor);font-size:.68rem;font-weight:700}.pt-news-ticker__segment-value{color:inherit;font-variant-numeric:tabular-nums;font-weight:800}.pt-news-ticker__segment-separator{color:#94a3b8;font-size:.75rem;font-weight:700}.pt-news-ticker__new-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:1.15rem;padding:.12rem .42rem;border:1px solid #93c5fd;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:.62rem;font-weight:800;line-height:1;letter-spacing:.025em;text-transform:uppercase;white-space:nowrap;animation:pt-news-ticker-new-badge-pulse 1.5s ease-in-out infinite}.pt-news-ticker__item--flash .pt-news-ticker__new-badge{border-color:#ffffffb3;background:#fff;color:#b91c1c}.pt-news-ticker__link-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:currentColor;font-size:.72rem;opacity:.75}.pt-news-ticker__item--link:hover .pt-news-ticker__link-icon{opacity:1}.pt-news-ticker__remove-button{flex:0 0 auto}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button{width:1.45rem;min-width:1.45rem;height:1.45rem;padding:0;color:currentColor}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button .p-button-icon{font-size:.65rem}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button:not(:disabled):hover{background:#0f172a1a}.pt-news-ticker__duplicate-remove-placeholder{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:1.45rem;min-width:1.45rem;height:1.45rem;opacity:0;pointer-events:none}.pt-news-ticker__duplicate-remove-placeholder .pi{font-size:.65rem}.pt-news-ticker__item--flash{border-color:var(--pt-news-item-border-color, #991b1b);color:var(--pt-news-flash-text-color, #ffffff);animation-name:pt-news-ticker-flash;animation-duration:var(--pt-news-flash-duration, .7s);animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}.pt-news-ticker__item--flash .pt-news-ticker__item-icon{color:var(--pt-news-item-icon-color, #ffffff)}.pt-news-ticker__empty{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:var(--pt-news-ticker-height, 3.25rem);padding:.75rem 1rem;color:#64748b;font-size:.85rem;font-weight:500;text-align:center}.pt-news-ticker__empty .pi{font-size:1rem}@keyframes pt-news-ticker-scroll{0%{transform:translateZ(0)}to{transform:translate3d(-50%,0,0)}}@keyframes pt-news-ticker-flash{0%{background-color:var(--pt-news-flash-background, #dc2626)}to{background-color:var(--pt-news-flash-alternate-background, #7f1d1d)}}@keyframes pt-news-ticker-new-badge-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.75;transform:scale(.96)}}@media(max-width:768px){.pt-news-ticker{min-height:3rem}.pt-news-ticker__controls{padding-right:.25rem;padding-left:.25rem}.pt-news-ticker__speed{display:none}.pt-news-ticker__item{max-width:34rem}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{width:1.25rem}}@media(max-width:480px){.pt-news-ticker__item{max-width:24rem}.pt-news-ticker__item-title,.pt-news-ticker__item-text{font-size:.78rem}.pt-news-ticker__segment{font-size:.75rem}.pt-news-ticker__new-badge{font-size:.56rem}}@media(prefers-reduced-motion:reduce){.pt-news-ticker__track{animation:none!important;transform:none!important}.pt-news-ticker__item--flash{animation:none!important;background-color:var(--pt-news-flash-background, #dc2626)!important}.pt-news-ticker__new-badge{animation:none!important}.pt-news-ticker__viewport{overflow-x:auto}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{display:none}}\n"] }]
|
|
10518
|
+
args: [{ selector: 'pt-news-ticker', standalone: false, template: "<div\n class=\"pt-news-ticker\"\n [ngStyle]=\"getContainerStyle()\"\n [attr.aria-label]=\"ariaLabel\"\n role=\"region\"\n>\n @if (showControls) {\n <div class=\"pt-news-ticker__controls\">\n @if (showPlayPauseControl) {\n <button\n pButton\n pRipple\n type=\"button\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n [icon]=\"playing ? 'pi pi-pause' : 'pi pi-play'\"\n [pTooltip]=\"playing ? 'Mettre en pause' : 'Reprendre'\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-label]=\"\n playing ? 'Mettre le ruban en pause' : 'Reprendre le ruban'\n \"\n (click)=\"togglePlayState()\"\n ></button>\n }\n\n @if (showSpeedControls) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-minus\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Ralentir\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"Ralentir le ruban\"\n [disabled]=\"speed <= minSpeed\"\n (click)=\"decreaseSpeed()\"\n ></button>\n\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-plus\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Acc\u00E9l\u00E9rer\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"Acc\u00E9l\u00E9rer le ruban\"\n [disabled]=\"speed >= maxSpeed\"\n (click)=\"increaseSpeed()\"\n ></button>\n }\n\n @if (showResetSpeedControl) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-refresh\"\n class=\"p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"R\u00E9initialiser la vitesse\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n aria-label=\"R\u00E9initialiser la vitesse\"\n [disabled]=\"speed === defaultSpeed\"\n (click)=\"resetSpeed()\"\n ></button>\n }\n\n @if (showSpeedValue) {\n <span\n class=\"pt-news-ticker__speed\"\n [attr.aria-label]=\"'Vitesse ' + speed + ' pixels par seconde'\"\n >\n {{ speed }} px/s\n </span>\n }\n </div>\n }\n\n <div\n #tickerViewport\n class=\"pt-news-ticker__viewport\"\n (mouseenter)=\"onMouseEnter()\"\n (mouseleave)=\"onMouseLeave()\"\n >\n @if (internalNews.length > 0) {\n <div\n #tickerTrack\n class=\"pt-news-ticker__track\"\n [class.pt-news-ticker__track--single]=\"!loop\"\n [ngStyle]=\"getTrackStyle()\"\n (animationiteration)=\"onTrackAnimationIteration($event)\"\n (animationend)=\"onTrackAnimationEnd($event)\"\n >\n <div\n #tickerGroup\n class=\"pt-news-ticker__group\"\n [class.pt-news-ticker__group--single]=\"hasSingleNewsItem()\"\n [attr.aria-hidden]=\"false\"\n >\n @for (item of internalNews; track getTrackById($index, item)) {\n <article\n class=\"pt-news-ticker__item\"\n [ngClass]=\"getItemClasses(item)\"\n [ngStyle]=\"getItemStyle(item)\"\n [pTooltip]=\"item.tooltip || ''\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-disabled]=\"item.disabled\"\n [attr.aria-label]=\"\n hasItemLink(item) ? item.text + ', ouvrir le lien' : item.text\n \"\n [attr.role]=\"getItemRole(item)\"\n [attr.tabindex]=\"getItemTabIndex(item)\"\n (click)=\"onItemClick($event, item)\"\n (keydown.enter)=\"onItemClick($event, item)\"\n (keydown.space)=\"onItemClick($event, item)\"\n >\n @if (item.icon) {\n <i\n class=\"pt-news-ticker__item-icon\"\n [ngClass]=\"item.icon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n <div class=\"pt-news-ticker__content\">\n <span class=\"pt-news-ticker__item-title\">\n {{ item.text }}\n </span>\n\n @if (hasSegments(item)) {\n <span class=\"pt-news-ticker__segments\">\n @for (segment of item.segments; track $index) {\n @if ($index > 0) {\n <span\n class=\"pt-news-ticker__segment-separator\"\n aria-hidden=\"true\"\n >\n {{ getSegmentSeparator(item) }}\n </span>\n }\n\n <span\n class=\"pt-news-ticker__segment\"\n [ngStyle]=\"getSegmentStyle(segment)\"\n [pTooltip]=\"segment.tooltip || ''\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n >\n @if (segment.label) {\n <span class=\"pt-news-ticker__segment-label\">\n {{ segment.label }}\n </span>\n }\n\n @if (getSegmentIcon(segment); as segmentIcon) {\n <i\n class=\"pt-news-ticker__segment-icon\"\n [ngClass]=\"segmentIcon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (segment.value) {\n <span class=\"pt-news-ticker__segment-value\">\n {{ segment.value }}\n </span>\n }\n </span>\n }\n </span>\n }\n </div>\n\n @if (shouldShowNewBadge(item)) {\n <span class=\"pt-news-ticker__new-badge\">\n {{ getNewBadgeText(item) }}\n </span>\n }\n\n @if (hasItemLink(item)) {\n <i\n class=\"pt-news-ticker__link-icon pi pi-external-link\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (isItemRemovable(item)) {\n <button\n pButton\n pRipple\n type=\"button\"\n icon=\"pi pi-times\"\n class=\"pt-news-ticker__remove-button p-button-rounded p-button-text p-button-sm\"\n pTooltip=\"Supprimer l\u2019actualit\u00E9\"\n tooltipPosition=\"top\"\n appendTo=\"body\"\n [attr.aria-label]=\"'Supprimer : ' + item.text\"\n (click)=\"onRemoveClick($event, item)\"\n ></button>\n }\n </article>\n }\n </div>\n\n @if (loop) {\n <div\n class=\"pt-news-ticker__group\"\n [class.pt-news-ticker__group--single]=\"hasSingleNewsItem()\"\n aria-hidden=\"true\"\n >\n @for (\n item of internalNews;\n track getDuplicateTrackById($index, item)\n ) {\n <article\n class=\"pt-news-ticker__item\"\n [ngClass]=\"getDuplicateItemClasses(item)\"\n [ngStyle]=\"getItemStyle(item)\"\n >\n @if (item.icon) {\n <i\n class=\"pt-news-ticker__item-icon\"\n [ngClass]=\"item.icon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n <div class=\"pt-news-ticker__content\">\n <span class=\"pt-news-ticker__item-title\">\n {{ item.text }}\n </span>\n\n @if (hasSegments(item)) {\n <span class=\"pt-news-ticker__segments\">\n @for (segment of item.segments; track $index) {\n @if ($index > 0) {\n <span\n class=\"pt-news-ticker__segment-separator\"\n aria-hidden=\"true\"\n >\n {{ getSegmentSeparator(item) }}\n </span>\n }\n\n <span\n class=\"pt-news-ticker__segment\"\n [ngStyle]=\"getSegmentStyle(segment)\"\n >\n @if (segment.label) {\n <span class=\"pt-news-ticker__segment-label\">\n {{ segment.label }}\n </span>\n }\n\n @if (getSegmentIcon(segment); as segmentIcon) {\n <i\n class=\"pt-news-ticker__segment-icon\"\n [ngClass]=\"segmentIcon\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (segment.value) {\n <span class=\"pt-news-ticker__segment-value\">\n {{ segment.value }}\n </span>\n }\n </span>\n }\n </span>\n }\n </div>\n\n @if (shouldShowNewBadge(item)) {\n <span class=\"pt-news-ticker__new-badge\">\n {{ getNewBadgeText(item) }}\n </span>\n }\n\n @if (hasItemLink(item)) {\n <i\n class=\"pt-news-ticker__link-icon pi pi-external-link\"\n aria-hidden=\"true\"\n ></i>\n }\n\n @if (isItemRemovable(item)) {\n <span\n class=\"pt-news-ticker__duplicate-remove-placeholder\"\n aria-hidden=\"true\"\n >\n <i class=\"pi pi-times\"></i>\n </span>\n }\n </article>\n }\n </div>\n }\n </div>\n } @else {\n <div class=\"pt-news-ticker__empty\">\n @if (emptyIcon) {\n <i [ngClass]=\"emptyIcon\" aria-hidden=\"true\"></i>\n }\n\n <span>{{ emptyMessage }}</span>\n </div>\n }\n </div>\n</div>\n", styles: [":host{display:block;width:100%;min-width:0;max-width:100%;box-sizing:border-box}:host *,:host *:before,:host *:after{box-sizing:border-box}.pt-news-ticker{display:flex;align-items:stretch;width:100%;min-width:0;max-width:100%;min-height:var(--pt-news-ticker-height, 3.25rem);overflow:hidden;border:var(--pt-news-ticker-border-width, 1px) solid var(--pt-news-ticker-border-color, #e2e8f0);border-radius:var(--pt-news-ticker-border-radius, 8px);background:var(--pt-news-ticker-background, #ffffff);color:var(--pt-news-ticker-text-color, #0f172a)}.pt-news-ticker__controls{position:relative;z-index:4;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;gap:.1rem;min-height:var(--pt-news-ticker-height, 3.25rem);padding:.25rem .4rem;border-right:1px solid var(--pt-news-ticker-controls-border-color, #e2e8f0);background:var(--pt-news-ticker-controls-background, #f8fafc)}.pt-news-ticker__controls ::ng-deep .p-button.p-button-rounded.p-button-text{width:1.9rem;min-width:1.9rem;height:1.9rem;padding:0}.pt-news-ticker__controls ::ng-deep .p-button .p-button-icon{font-size:.78rem}.pt-news-ticker__speed{min-width:3.5rem;padding:0 .35rem;color:#475569;font-size:.7rem;font-weight:700;text-align:center;white-space:nowrap}.pt-news-ticker__viewport{position:relative;display:flex;align-items:center;flex:1 1 auto;width:100%;min-width:0;min-height:var(--pt-news-ticker-height, 3.25rem);overflow:hidden;contain:layout paint}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{position:absolute;z-index:3;top:0;bottom:0;width:2.5rem;content:\"\";pointer-events:none}.pt-news-ticker__viewport:before{left:0;background:linear-gradient(to right,var(--pt-news-ticker-background, #ffffff),transparent)}.pt-news-ticker__viewport:after{right:0;background:linear-gradient(to left,var(--pt-news-ticker-background, #ffffff),transparent)}.pt-news-ticker__track{display:flex;align-items:center;flex:0 0 auto;width:max-content;min-width:max-content;transform:translateZ(0);animation-name:pt-news-ticker-scroll;animation-duration:var(--pt-news-ticker-duration, 20s);animation-timing-function:linear;animation-iteration-count:infinite;animation-fill-mode:both;backface-visibility:hidden;will-change:transform}.pt-news-ticker__track--single{animation-iteration-count:1;animation-fill-mode:forwards}.pt-news-ticker__group{display:inline-flex;align-items:center;flex:0 0 auto;gap:var(--pt-news-ticker-gap, 2rem);width:max-content;min-width:max-content;padding-right:var(--pt-news-ticker-gap, 2rem)}.pt-news-ticker__group--single{padding-right:max(var(--pt-news-ticker-gap, 2rem),var(--pt-news-ticker-loop-gap, 0px))}.pt-news-ticker__item{display:inline-flex;align-items:center;flex:0 0 auto;gap:var(--pt-news-item-gap, .5rem);width:max-content;min-width:max-content;max-width:none;min-height:2.25rem;padding:.35rem .65rem;overflow:visible;border:1px solid var(--pt-news-item-border-color, transparent);border-radius:999px;outline:none;background:var(--pt-news-item-background, transparent);color:var( --pt-news-item-text-color, var(--pt-news-ticker-text-color, #0f172a) );line-height:1.25;white-space:nowrap;transition:box-shadow .15s ease,opacity .15s ease,transform .15s ease}.pt-news-ticker__item--info,.pt-news-ticker__item--default{background:transparent}.pt-news-ticker__item--clickable,.pt-news-ticker__item--link{cursor:pointer}.pt-news-ticker__item--clickable:hover,.pt-news-ticker__item--link:hover{box-shadow:0 3px 10px #0f172a1f;transform:translateY(-1px)}.pt-news-ticker__item:focus-visible{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--primary-color, #3b82f6)}.pt-news-ticker__item--disabled{cursor:not-allowed;opacity:.5}.pt-news-ticker__item-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:var(--pt-news-item-icon-color, currentColor);font-size:.95rem}.pt-news-ticker__content{display:inline-flex;align-items:center;flex:0 0 auto;gap:.55rem;width:max-content;min-width:max-content;overflow:visible;white-space:nowrap}.pt-news-ticker__item-title{display:inline-block;flex:0 0 auto;width:max-content;min-width:max-content;overflow:visible;font-size:.85rem;font-weight:700;text-overflow:clip;white-space:nowrap}.pt-news-ticker__item-text{display:block;flex:0 0 auto;width:max-content;min-width:max-content;overflow:visible;font-size:.85rem;font-weight:600;text-overflow:clip;white-space:nowrap}.pt-news-ticker__segments{display:inline-flex;align-items:center;flex:0 0 auto;width:max-content;min-width:max-content;gap:.45rem;overflow:visible;white-space:nowrap}.pt-news-ticker__segment{display:inline-flex;align-items:center;flex:0 0 auto;gap:.22rem;color:var(--pt-news-segment-color, currentColor);font-size:.82rem;font-weight:700;white-space:nowrap}.pt-news-ticker__segment-label{color:inherit;font-weight:700}.pt-news-ticker__segment-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--pt-news-segment-icon-color, currentColor);font-size:.68rem;font-weight:700}.pt-news-ticker__segment-value{color:inherit;font-variant-numeric:tabular-nums;font-weight:800}.pt-news-ticker__segment-separator{color:#94a3b8;font-size:.75rem;font-weight:700}.pt-news-ticker__new-badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:1.15rem;padding:.12rem .42rem;border:1px solid #93c5fd;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:.62rem;font-weight:800;line-height:1;letter-spacing:.025em;text-transform:uppercase;white-space:nowrap;animation:pt-news-ticker-new-badge-pulse 1.5s ease-in-out infinite}.pt-news-ticker__item--flash .pt-news-ticker__new-badge{border-color:#ffffffb3;background:#fff;color:#b91c1c}.pt-news-ticker__item--danger .pt-news-ticker__new-badge{border-color:#ffffffbf;background:#fff;color:#b91c1c}.pt-news-ticker__link-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;color:currentColor;font-size:.72rem;opacity:.75}.pt-news-ticker__item--link:hover .pt-news-ticker__link-icon{opacity:1}.pt-news-ticker__remove-button{flex:0 0 auto}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button{width:1.45rem;min-width:1.45rem;height:1.45rem;padding:0;color:currentColor}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button .p-button-icon{font-size:.65rem}.pt-news-ticker__item ::ng-deep .pt-news-ticker__remove-button.p-button:not(:disabled):hover{background:#0f172a1a}.pt-news-ticker__duplicate-remove-placeholder{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:1.45rem;min-width:1.45rem;height:1.45rem;opacity:0;pointer-events:none}.pt-news-ticker__duplicate-remove-placeholder .pi{font-size:.65rem}.pt-news-ticker__item--flash{border-color:var(--pt-news-item-border-color, #991b1b);color:var(--pt-news-flash-text-color, #ffffff);animation-name:pt-news-ticker-flash;animation-duration:var(--pt-news-flash-duration, .7s);animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate}.pt-news-ticker__item--flash .pt-news-ticker__item-icon{color:var(--pt-news-item-icon-color, #ffffff)}.pt-news-ticker__empty{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%;min-height:var(--pt-news-ticker-height, 3.25rem);padding:.75rem 1rem;color:#64748b;font-size:.85rem;font-weight:500;text-align:center}.pt-news-ticker__empty .pi{font-size:1rem}@keyframes pt-news-ticker-scroll{0%{transform:translateZ(0)}to{transform:translate3d(-50%,0,0)}}@keyframes pt-news-ticker-flash{0%{background-color:var(--pt-news-flash-background, #dc2626)}to{background-color:var(--pt-news-flash-alternate-background, #7f1d1d)}}@keyframes pt-news-ticker-new-badge-pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.75;transform:scale(.96)}}@media(max-width:768px){.pt-news-ticker{min-height:3rem}.pt-news-ticker__controls{padding-right:.25rem;padding-left:.25rem}.pt-news-ticker__speed{display:none}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{width:1.25rem}}@media(max-width:480px){.pt-news-ticker__item-title,.pt-news-ticker__item-text{font-size:.78rem}.pt-news-ticker__segment{font-size:.75rem}.pt-news-ticker__new-badge{font-size:.56rem}}@media(prefers-reduced-motion:reduce){.pt-news-ticker__track{animation:none!important;transform:none!important}.pt-news-ticker__item--flash{animation:none!important;background-color:var(--pt-news-flash-background, #dc2626)!important}.pt-news-ticker__new-badge{animation:none!important}.pt-news-ticker__viewport{overflow-x:auto;contain:none}.pt-news-ticker__viewport:before,.pt-news-ticker__viewport:after{display:none}}\n"] }]
|
|
10445
10519
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { news: [{
|
|
10446
10520
|
type: Input
|
|
10447
10521
|
}], speed: [{
|
|
@@ -10519,6 +10593,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.14", ngImpo
|
|
|
10519
10593
|
}], tickerViewport: [{
|
|
10520
10594
|
type: ViewChild,
|
|
10521
10595
|
args: ['tickerViewport', { static: false }]
|
|
10596
|
+
}], tickerTrack: [{
|
|
10597
|
+
type: ViewChild,
|
|
10598
|
+
args: ['tickerTrack', { static: false }]
|
|
10522
10599
|
}], tickerGroup: [{
|
|
10523
10600
|
type: ViewChild,
|
|
10524
10601
|
args: ['tickerGroup', { static: false }]
|