barsa-tiles 1.0.267 → 1.0.269
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/esm2020/lib/actions-link/actions-link.component.mjs +11 -4
- package/esm2020/lib/directives/emptylist.directive.mjs +1 -1
- package/esm2020/lib/news-tile/news-tile.component.mjs +3 -6
- package/esm2020/lib/tile-renderer.directive.mjs +6 -5
- package/fesm2015/barsa-tiles.mjs +18 -12
- package/fesm2015/barsa-tiles.mjs.map +1 -1
- package/fesm2020/barsa-tiles.mjs +17 -12
- package/fesm2020/barsa-tiles.mjs.map +1 -1
- package/lib/actions-link/actions-link.component.d.ts +2 -0
- package/lib/news-tile/news-tile.component.d.ts +0 -1
- package/lib/tile-renderer.directive.d.ts +3 -2
- package/package.json +1 -1
package/fesm2020/barsa-tiles.mjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, HostListener, Directive, Injectable, ViewChild,
|
|
2
|
+
import { EventEmitter, Component, ChangeDetectionStrategy, Input, Output, HostListener, HostBinding, Directive, Injectable, ViewChild, Inject, Pipe, NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
|
|
3
3
|
import * as i1$2 from 'barsa-novin-ray-core';
|
|
4
4
|
import { BaseComponent, BarsaApi, BaseDirective, IntersectionStatus, APP_VERSION, BaseModule, BarsaNovinRayCoreModule } from 'barsa-novin-ray-core';
|
|
5
5
|
import * as i1 from '@angular/common';
|
|
@@ -212,25 +212,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImpor
|
|
|
212
212
|
}] });
|
|
213
213
|
|
|
214
214
|
class ActionsLinkComponent extends BaseComponent {
|
|
215
|
+
ngOnInit() {
|
|
216
|
+
super.ngOnInit();
|
|
217
|
+
this.hide = !this.actionsLink?.length;
|
|
218
|
+
}
|
|
215
219
|
}
|
|
216
220
|
ActionsLinkComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ActionsLinkComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
217
|
-
ActionsLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: { actionsLink: "actionsLink", editHome: "editHome" }, usesInheritance: true, ngImport: i0, template: "<bt-action-item\r\n *ngFor=\"let actionItem of actionsLink\"\r\n cdkDrag\r\n [data]=\"actionItem\"\r\n [editHome]=\"editHome\"\r\n [cdkDragDisabled]=\"!actionItem || actionItem.Locked\"\r\n [mo]=\"actionItem\"\r\n>\r\n</bt-action-item>\r\n", styles: [":host{display:flex;width:100%;row-gap:3px;flex-wrap:wrap;border-radius:var(--sapElement_BorderCornerRadius, .25rem);column-gap:3px;padding:1rem 0}bt-action-item{margin-top:auto;margin-bottom:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: ActionItemComponent, selector: "bt-action-item" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
221
|
+
ActionsLinkComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: ActionsLinkComponent, selector: "bt-actions-link", inputs: { actionsLink: "actionsLink", editHome: "editHome" }, host: { properties: { "class.hide": "this.hide" } }, usesInheritance: true, ngImport: i0, template: "<bt-action-item\r\n *ngFor=\"let actionItem of actionsLink\"\r\n cdkDrag\r\n [data]=\"actionItem\"\r\n [editHome]=\"editHome\"\r\n [cdkDragDisabled]=\"!actionItem || actionItem.Locked\"\r\n [mo]=\"actionItem\"\r\n>\r\n</bt-action-item>\r\n", styles: [":host{display:flex;width:100%;row-gap:3px;flex-wrap:wrap;border-radius:var(--sapElement_BorderCornerRadius, .25rem);column-gap:3px;padding:1rem 0}bt-action-item{margin-top:auto;margin-bottom:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$2.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: ActionItemComponent, selector: "bt-action-item" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
218
222
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: ActionsLinkComponent, decorators: [{
|
|
219
223
|
type: Component,
|
|
220
224
|
args: [{ selector: 'bt-actions-link', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-action-item\r\n *ngFor=\"let actionItem of actionsLink\"\r\n cdkDrag\r\n [data]=\"actionItem\"\r\n [editHome]=\"editHome\"\r\n [cdkDragDisabled]=\"!actionItem || actionItem.Locked\"\r\n [mo]=\"actionItem\"\r\n>\r\n</bt-action-item>\r\n", styles: [":host{display:flex;width:100%;row-gap:3px;flex-wrap:wrap;border-radius:var(--sapElement_BorderCornerRadius, .25rem);column-gap:3px;padding:1rem 0}bt-action-item{margin-top:auto;margin-bottom:auto}\n"] }]
|
|
221
|
-
}], propDecorators: {
|
|
225
|
+
}], propDecorators: { hide: [{
|
|
226
|
+
type: HostBinding,
|
|
227
|
+
args: ['class.hide']
|
|
228
|
+
}], actionsLink: [{
|
|
222
229
|
type: Input
|
|
223
230
|
}], editHome: [{
|
|
224
231
|
type: Input
|
|
225
232
|
}] } });
|
|
226
233
|
|
|
227
234
|
class TileRendererDirective extends BaseDirective {
|
|
228
|
-
constructor(_cdr, _portalService, _vcr, _injector) {
|
|
229
|
-
super();
|
|
235
|
+
constructor(_cdr, _portalService, _vcr, _injector, _el) {
|
|
236
|
+
super(_el);
|
|
230
237
|
this._cdr = _cdr;
|
|
231
238
|
this._portalService = _portalService;
|
|
232
239
|
this._vcr = _vcr;
|
|
233
240
|
this._injector = _injector;
|
|
241
|
+
this._el = _el;
|
|
234
242
|
this.hideClick = new EventEmitter();
|
|
235
243
|
this.renameClick = new EventEmitter();
|
|
236
244
|
}
|
|
@@ -269,14 +277,14 @@ class TileRendererDirective extends BaseDirective {
|
|
|
269
277
|
}
|
|
270
278
|
}
|
|
271
279
|
}
|
|
272
|
-
TileRendererDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TileRendererDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.PortalService }, { token: i0.ViewContainerRef }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Directive });
|
|
280
|
+
TileRendererDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TileRendererDirective, deps: [{ token: i0.ChangeDetectorRef }, { token: i1$2.PortalService }, { token: i0.ViewContainerRef }, { token: i0.Injector }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
|
|
273
281
|
TileRendererDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.2.7", type: TileRendererDirective, selector: "[tileRenderer]", inputs: { component: "component", data: "data", editHome: "editHome" }, outputs: { hideClick: "hideClick", renameClick: "renameClick" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
|
|
274
282
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: TileRendererDirective, decorators: [{
|
|
275
283
|
type: Directive,
|
|
276
284
|
args: [{
|
|
277
285
|
selector: '[tileRenderer]'
|
|
278
286
|
}]
|
|
279
|
-
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$2.PortalService }, { type: i0.ViewContainerRef }, { type: i0.Injector }]; }, propDecorators: { component: [{
|
|
287
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1$2.PortalService }, { type: i0.ViewContainerRef }, { type: i0.Injector }, { type: i0.ElementRef }]; }, propDecorators: { component: [{
|
|
280
288
|
type: Input
|
|
281
289
|
}], data: [{
|
|
282
290
|
type: Input
|
|
@@ -1433,9 +1441,6 @@ class NewsTileComponent extends BaseBtTileComponent {
|
|
|
1433
1441
|
}
|
|
1434
1442
|
this.slides = slides;
|
|
1435
1443
|
}
|
|
1436
|
-
trigger() {
|
|
1437
|
-
this.isStop = !this.isStop;
|
|
1438
|
-
}
|
|
1439
1444
|
slideChange(activeSlide) {
|
|
1440
1445
|
const currentSlide = activeSlide.activeItems[0].value;
|
|
1441
1446
|
this._updateTile(currentSlide);
|
|
@@ -1445,10 +1450,10 @@ class NewsTileComponent extends BaseBtTileComponent {
|
|
|
1445
1450
|
}
|
|
1446
1451
|
}
|
|
1447
1452
|
NewsTileComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: NewsTileComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
1448
|
-
NewsTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: NewsTileComponent, selector: "bt-news-tile", viewQueries: [{ propertyName: "carouselComponent", first: true, predicate: CarouselComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<bt-tile [data]=\"data\" [type]=\"'launch'\" [footerTemplate]=\"newsFooter\" [editHome]=\"editHome\">\
|
|
1453
|
+
NewsTileComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.7", type: NewsTileComponent, selector: "bt-news-tile", viewQueries: [{ propertyName: "carouselComponent", first: true, predicate: CarouselComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<bt-tile [data]=\"data\" [type]=\"'launch'\" [footerTemplate]=\"newsFooter\" [editHome]=\"editHome\">\n <div fd-tile-content style=\"align-items: center; padding-top: 1rem\">\n <span>\n {{ activeNews?.Text }}\n </span>\n\n <div class=\"wrapper-carousel\">\n <div class=\"cover\"></div>\n <button\n fd-button\n fdType=\"transparent\"\n [glyph]=\"isStop ? 'play' : 'pause'\"\n (click)=\"isStop = !isStop; $event.preventDefault(); $event.stopPropagation()\"\n ></button>\n <fd-carousel\n carouselIndicatorsOrientation=\"top\"\n [slideTransitionDuration]=\"1000\"\n (slideChange)=\"slideChange($event)\"\n [loop]=\"true\"\n [navigation]=\"false\"\n [navigatorInPageIndicator]=\"false\"\n width=\"100%\"\n >\n <fd-carousel-item *ngFor=\"let slide of slides\" [value]=\"slide\">\n <img\n [src]=\"slide.Img ? (slide.Img.FileId | picFieldSrc: 'ID':null:slide.Img.FileId:335:170) : ''\"\n />\n </fd-carousel-item>\n </fd-carousel>\n </div>\n </div>\n</bt-tile>\n\n<!-- tile footer-->\n<ng-template #newsFooter>\n <div fd-tile-footer [twoColumn]=\"twoColumn\" *untilInView=\"el\">\n <ng-container *ngIf=\"twoColumn; else oneColumn\">\n <div fd-tile-section>\n <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n </div>\n <div fd-tile-section>\n <span fd-tile-footer-text>{{ activeNews?.Footer2 }}</span>\n </div>\n </ng-container>\n <ng-template #oneColumn>\n <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n </ng-template>\n </div>\n</ng-template>\n", styles: [":host{position:relative;display:block}:host bt-tile{position:relative}:host bt-tile .wrapper-carousel{position:absolute;top:0;width:100%;height:100%;left:0;z-index:0}:host bt-tile .wrapper-carousel img{width:335px;height:165px;object-fit:cover}:host ::ng-deep span{z-index:3;color:#fff}:host ::ng-deep button{position:absolute;right:15px;top:15px;display:none}:host ::ng-deep button fd-icon{z-index:4;min-width:1.5rem!important;font-size:1.5rem!important;color:#fff!important}:host ::ng-deep .fd-carousel__content{z-index:3}:host ::ng-deep .fd-carousel__page-indicator-container{position:absolute;bottom:0;display:none;background-color:transparent}:host ::ng-deep .fd-carousel__page-indicator-container ol{z-index:5}:host ::ng-deep .fd-carousel__page-indicator-container ol li{background-color:#dad7d7}:host ::ng-deep .fd-carousel__page-indicator-container ol li.fd-carousel__page-indicator--active{background-color:#fff}:host .cover{background-color:#064079d9;position:absolute;bottom:0;left:0;right:0;height:50%;z-index:4;opacity:.6}:host:hover ::ng-deep .fd-carousel__page-indicator-container{display:inherit}:host:hover ::ng-deep button{display:inline-flex}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.ButtonComponent, selector: "button[fd-button], a[fd-button]", inputs: ["class"], exportAs: ["fd-button"] }, { kind: "component", type: i3$2.CarouselComponent, selector: "fd-carousel", inputs: ["id", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "pageIndicatorsOrientation", "height", "width", "loop", "leftNavigationBtnLabel", "rightNavigationBtnLabel", "navigation", "navigatorInPageIndicator", "numericIndicator", "pageIndicatorContainer", "pageIndicator", "resourceStrings", "slideTransitionDuration", "swipeEnabled", "vertical", "visibleSlidesCount"], outputs: ["slideChange"] }, { kind: "component", type: i3$2.CarouselItemComponent, selector: "fd-carousel-item", inputs: ["id", "ariaLabel", "ariaLabelledBy", "ariaDescribedBy", "loading", "title", "initialHeight", "initialWidth", "value"] }, { kind: "directive", type: i1$1.TileContentDirective, selector: "[fdTileContent], [fd-tile-content]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileFooterDirective, selector: "[fdTileFooter], [fd-tile-footer]", inputs: ["twoColumn"] }, { kind: "directive", type: i1$1.TileSectionDirective, selector: "[fdTileSection], [fd-tile-section]" }, { kind: "directive", type: i1$1.TileFooterTextDirective, selector: "[fdTileFooterText], [fd-tile-footer-text]" }, { kind: "directive", type: i1$2.UntilInViewDirective, selector: "[untilInView]", inputs: ["untilInView", "intersectionDebounce"] }, { kind: "component", type: TileComponent, selector: "bt-tile", inputs: ["type", "footerTemplate", "disableClick"] }, { kind: "pipe", type: i1$2.PictureFieldSourcePipe, name: "picFieldSrc" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1449
1454
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.7", ngImport: i0, type: NewsTileComponent, decorators: [{
|
|
1450
1455
|
type: Component,
|
|
1451
|
-
args: [{ selector: 'bt-news-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile [data]=\"data\" [type]=\"'launch'\" [footerTemplate]=\"newsFooter\" [editHome]=\"editHome\">\
|
|
1456
|
+
args: [{ selector: 'bt-news-tile', changeDetection: ChangeDetectionStrategy.OnPush, template: "<bt-tile [data]=\"data\" [type]=\"'launch'\" [footerTemplate]=\"newsFooter\" [editHome]=\"editHome\">\n <div fd-tile-content style=\"align-items: center; padding-top: 1rem\">\n <span>\n {{ activeNews?.Text }}\n </span>\n\n <div class=\"wrapper-carousel\">\n <div class=\"cover\"></div>\n <button\n fd-button\n fdType=\"transparent\"\n [glyph]=\"isStop ? 'play' : 'pause'\"\n (click)=\"isStop = !isStop; $event.preventDefault(); $event.stopPropagation()\"\n ></button>\n <fd-carousel\n carouselIndicatorsOrientation=\"top\"\n [slideTransitionDuration]=\"1000\"\n (slideChange)=\"slideChange($event)\"\n [loop]=\"true\"\n [navigation]=\"false\"\n [navigatorInPageIndicator]=\"false\"\n width=\"100%\"\n >\n <fd-carousel-item *ngFor=\"let slide of slides\" [value]=\"slide\">\n <img\n [src]=\"slide.Img ? (slide.Img.FileId | picFieldSrc: 'ID':null:slide.Img.FileId:335:170) : ''\"\n />\n </fd-carousel-item>\n </fd-carousel>\n </div>\n </div>\n</bt-tile>\n\n<!-- tile footer-->\n<ng-template #newsFooter>\n <div fd-tile-footer [twoColumn]=\"twoColumn\" *untilInView=\"el\">\n <ng-container *ngIf=\"twoColumn; else oneColumn\">\n <div fd-tile-section>\n <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n </div>\n <div fd-tile-section>\n <span fd-tile-footer-text>{{ activeNews?.Footer2 }}</span>\n </div>\n </ng-container>\n <ng-template #oneColumn>\n <span fd-tile-footer-text>{{ activeNews?.Footer1 }}</span>\n </ng-template>\n </div>\n</ng-template>\n", styles: [":host{position:relative;display:block}:host bt-tile{position:relative}:host bt-tile .wrapper-carousel{position:absolute;top:0;width:100%;height:100%;left:0;z-index:0}:host bt-tile .wrapper-carousel img{width:335px;height:165px;object-fit:cover}:host ::ng-deep span{z-index:3;color:#fff}:host ::ng-deep button{position:absolute;right:15px;top:15px;display:none}:host ::ng-deep button fd-icon{z-index:4;min-width:1.5rem!important;font-size:1.5rem!important;color:#fff!important}:host ::ng-deep .fd-carousel__content{z-index:3}:host ::ng-deep .fd-carousel__page-indicator-container{position:absolute;bottom:0;display:none;background-color:transparent}:host ::ng-deep .fd-carousel__page-indicator-container ol{z-index:5}:host ::ng-deep .fd-carousel__page-indicator-container ol li{background-color:#dad7d7}:host ::ng-deep .fd-carousel__page-indicator-container ol li.fd-carousel__page-indicator--active{background-color:#fff}:host .cover{background-color:#064079d9;position:absolute;bottom:0;left:0;right:0;height:50%;z-index:4;opacity:.6}:host:hover ::ng-deep .fd-carousel__page-indicator-container{display:inherit}:host:hover ::ng-deep button{display:inline-flex}\n"] }]
|
|
1452
1457
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { carouselComponent: [{
|
|
1453
1458
|
type: ViewChild,
|
|
1454
1459
|
args: [CarouselComponent]
|