@tekus/kiosks-design-system 1.17.0 → 1.18.0
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.
|
@@ -66,7 +66,7 @@ export class TkKioskSliderComponent {
|
|
|
66
66
|
this.viewAll.emit();
|
|
67
67
|
}
|
|
68
68
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: TkKioskSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
69
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: TkKioskSliderComponent, isStandalone: true, selector: "tk-kiosk-slider", inputs: { sizeNextScroll: "sizeNextScroll", sizePreviousScroll: "sizePreviousScroll", showArrows: "showArrows", marginTop: "marginTop", appearance: "appearance", direction: "direction", showViewAll: "showViewAll" }, outputs: { viewAll: "viewAll" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["slider"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"'cont' + ' ' + direction + ' ' + appearance\">\n <ng-container *ngIf=\"showArrows && appearance == 'default'\">\n <div\n class=\"ant-arrow ant-arrow__previous\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-left\" ></tk-kiosk-icon-btn>\n </div>\n\n <div\n class=\"ant-arrow ant-arrow__next\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-right\" ></tk-kiosk-icon-btn>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showArrows && appearance == 'lg'\">\n <div\n class=\"ant-arrow__lg ant-arrow__previous_lg\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-left\" class=\"icon\"></span>\n </div>\n\n <div\n class=\"ant-arrow__lg ant-arrow__next_lg\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-right\" class=\"icon\"></span>\n\n </div>\n </ng-container>\n\n\n <div #slider class=\"slider\" (scroll)=\"onScroll()\">\n <ng-content></ng-content>\n\n <nz-card class=\"view-more\" *ngIf=\"showViewAll\" (click)=\"goToViewAll()\" >\n <div class=\"view-more__body\">\n\n <tk-kiosk-typography type=\"h5-heading\" color=\"tk-color-text-900\">\n Ver todos\n </tk-kiosk-typography>\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:arrow-right\" color=\"secondary\"></tk-kiosk-icon-btn>\n </div>\n </nz-card>\n </div>\n\n</div>\n", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}.cont{max-width:100%;height:fit-content;position:relative}.icon{margin-right:6px;font-size:30px;color:var(--tk-color-primary-900)}.slider{margin:0 100px;display:flex;position:relative;overflow-x:auto;gap:18px;padding:20px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.slider::-webkit-scrollbar{display:none}.ant-arrow{position:absolute;z-index:2;top:calc(50% - 30px)}.ant-arrow__previous{left:14px}.ant-arrow__next{right:14px}.ant-arrow__lg{width:48px;height:200px;z-index:2;top:calc(50% - 100px);border-radius:8px;background:var(--tk-color-white-900);display:flex;justify-content:center;align-items:center;box-shadow:0 4px 4px #00000040}.ant-arrow__lg img{width:50px;height:50px}.ant-arrow__previous_lg{left:35px;transform:translate(-100%);position:absolute}.ant-arrow__previous_lg img{transform:rotate(180deg)}.ant-arrow__next_lg{position:absolute;right:-15px}.view-more{min-width:330px;display:flex;justify-content:center;align-items:center;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}.view-more__body{width:max-content;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}::ng-deep .example-box{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:260px;max-width:150px;max-height:260px;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}::ng-deep .example-box--lg{min-width:330px;min-height:400px;max-width:330px;max-height:400px}.lg .slider{margin:0}.vertical.cont{max-width:fit-content;height:100%;padding:100px 0}.vertical .slider{height:100%;flex-direction:column;margin:0}.vertical .ant-arrow{top:unset;left:calc(50% - 30px);transform:rotate(90deg)}.vertical .ant-arrow__previous{top:14px}.vertical .ant-arrow__next{right:unset;bottom:14px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NzIconDirective, selector: "[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: NzCardComponent, selector: "nz-card", inputs: ["nzBordered", "nzBorderless", "nzLoading", "nzHoverable", "nzBodyStyle", "nzCover", "nzActions", "nzType", "nzSize", "nzTitle", "nzExtra"], exportAs: ["nzCard"] }, { kind: "component", type: TkKioskTypographyComponent, selector: "tk-kiosk-typography", inputs: ["type", "color", "size", "weight", "lineBreak"] }, { kind: "component", type: TkKioskIconBtnComponent, selector: "tk-kiosk-icon-btn", inputs: ["isDisabled", "size", "type", "color", "icon", "iconSrc", "bgColor"], outputs: ["btnClick"] }] }); }
|
|
69
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: TkKioskSliderComponent, isStandalone: true, selector: "tk-kiosk-slider", inputs: { sizeNextScroll: "sizeNextScroll", sizePreviousScroll: "sizePreviousScroll", showArrows: "showArrows", marginTop: "marginTop", appearance: "appearance", direction: "direction", showViewAll: "showViewAll" }, outputs: { viewAll: "viewAll" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["slider"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"'cont' + ' ' + direction + ' ' + appearance\">\n <ng-container *ngIf=\"showArrows && appearance == 'default'\">\n <div\n class=\"ant-arrow ant-arrow__previous\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-left\" ></tk-kiosk-icon-btn>\n </div>\n\n <div\n class=\"ant-arrow ant-arrow__next\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-right\" ></tk-kiosk-icon-btn>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showArrows && appearance == 'lg'\">\n <div\n class=\"ant-arrow__lg ant-arrow__previous_lg\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-left\" class=\"icon\"></span>\n </div>\n\n <div\n class=\"ant-arrow__lg ant-arrow__next_lg\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-right\" class=\"icon\"></span>\n\n </div>\n </ng-container>\n\n\n <div #slider class=\"slider\" (scroll)=\"onScroll()\">\n <ng-content></ng-content>\n\n <nz-card class=\"view-more\" *ngIf=\"showViewAll\" (click)=\"goToViewAll()\" >\n <div class=\"view-more__body\">\n\n <tk-kiosk-typography type=\"h5-heading\" color=\"tk-color-text-900\">\n Ver todos\n </tk-kiosk-typography>\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:arrow-right\" color=\"secondary\"></tk-kiosk-icon-btn>\n </div>\n </nz-card>\n </div>\n\n</div>\n", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}:host{height:100%}.cont{max-width:100%;height:fit-content;position:relative}.icon{margin-right:6px;font-size:30px;color:var(--tk-color-primary-900)}.slider{margin:0 100px;display:flex;position:relative;overflow-x:auto;gap:18px;padding:20px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.slider::-webkit-scrollbar{display:none}.ant-arrow{position:absolute;z-index:2;top:calc(50% - 30px)}.ant-arrow__previous{left:14px}.ant-arrow__next{right:14px}.ant-arrow__lg{width:48px;height:200px;z-index:2;top:calc(50% - 100px);border-radius:8px;background:var(--tk-color-white-900);display:flex;justify-content:center;align-items:center;box-shadow:0 4px 4px #00000040}.ant-arrow__lg img{width:50px;height:50px}.ant-arrow__previous_lg{left:35px;transform:translate(-100%);position:absolute}.ant-arrow__previous_lg img{transform:rotate(180deg)}.ant-arrow__next_lg{position:absolute;right:-15px}.view-more{min-width:330px;display:flex;justify-content:center;align-items:center;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}.view-more__body{width:max-content;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}::ng-deep .example-box{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:260px;max-width:150px;max-height:260px;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}::ng-deep .example-box--lg{min-width:330px;min-height:400px;max-width:330px;max-height:400px}.lg .slider{margin:0}.vertical.cont{max-width:fit-content;height:100%;padding:100px 0}.vertical .slider{height:100%;flex-direction:column;margin:0}.vertical .ant-arrow{top:unset;left:calc(50% - 30px);transform:rotate(90deg)}.vertical .ant-arrow__previous{top:14px}.vertical .ant-arrow__next{right:unset;bottom:14px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NzIconDirective, selector: "[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: NzCardComponent, selector: "nz-card", inputs: ["nzBordered", "nzBorderless", "nzLoading", "nzHoverable", "nzBodyStyle", "nzCover", "nzActions", "nzType", "nzSize", "nzTitle", "nzExtra"], exportAs: ["nzCard"] }, { kind: "component", type: TkKioskTypographyComponent, selector: "tk-kiosk-typography", inputs: ["type", "color", "size", "weight", "lineBreak"] }, { kind: "component", type: TkKioskIconBtnComponent, selector: "tk-kiosk-icon-btn", inputs: ["isDisabled", "size", "type", "color", "icon", "iconSrc", "bgColor"], outputs: ["btnClick"] }] }); }
|
|
70
70
|
}
|
|
71
71
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: TkKioskSliderComponent, decorators: [{
|
|
72
72
|
type: Component,
|
|
@@ -78,7 +78,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImpor
|
|
|
78
78
|
NzCardComponent,
|
|
79
79
|
TkKioskTypographyComponent,
|
|
80
80
|
TkKioskIconBtnComponent,
|
|
81
|
-
], template: "<div [ngClass]=\"'cont' + ' ' + direction + ' ' + appearance\">\n <ng-container *ngIf=\"showArrows && appearance == 'default'\">\n <div\n class=\"ant-arrow ant-arrow__previous\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-left\" ></tk-kiosk-icon-btn>\n </div>\n\n <div\n class=\"ant-arrow ant-arrow__next\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-right\" ></tk-kiosk-icon-btn>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showArrows && appearance == 'lg'\">\n <div\n class=\"ant-arrow__lg ant-arrow__previous_lg\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-left\" class=\"icon\"></span>\n </div>\n\n <div\n class=\"ant-arrow__lg ant-arrow__next_lg\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-right\" class=\"icon\"></span>\n\n </div>\n </ng-container>\n\n\n <div #slider class=\"slider\" (scroll)=\"onScroll()\">\n <ng-content></ng-content>\n\n <nz-card class=\"view-more\" *ngIf=\"showViewAll\" (click)=\"goToViewAll()\" >\n <div class=\"view-more__body\">\n\n <tk-kiosk-typography type=\"h5-heading\" color=\"tk-color-text-900\">\n Ver todos\n </tk-kiosk-typography>\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:arrow-right\" color=\"secondary\"></tk-kiosk-icon-btn>\n </div>\n </nz-card>\n </div>\n\n</div>\n", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}.cont{max-width:100%;height:fit-content;position:relative}.icon{margin-right:6px;font-size:30px;color:var(--tk-color-primary-900)}.slider{margin:0 100px;display:flex;position:relative;overflow-x:auto;gap:18px;padding:20px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.slider::-webkit-scrollbar{display:none}.ant-arrow{position:absolute;z-index:2;top:calc(50% - 30px)}.ant-arrow__previous{left:14px}.ant-arrow__next{right:14px}.ant-arrow__lg{width:48px;height:200px;z-index:2;top:calc(50% - 100px);border-radius:8px;background:var(--tk-color-white-900);display:flex;justify-content:center;align-items:center;box-shadow:0 4px 4px #00000040}.ant-arrow__lg img{width:50px;height:50px}.ant-arrow__previous_lg{left:35px;transform:translate(-100%);position:absolute}.ant-arrow__previous_lg img{transform:rotate(180deg)}.ant-arrow__next_lg{position:absolute;right:-15px}.view-more{min-width:330px;display:flex;justify-content:center;align-items:center;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}.view-more__body{width:max-content;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}::ng-deep .example-box{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:260px;max-width:150px;max-height:260px;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}::ng-deep .example-box--lg{min-width:330px;min-height:400px;max-width:330px;max-height:400px}.lg .slider{margin:0}.vertical.cont{max-width:fit-content;height:100%;padding:100px 0}.vertical .slider{height:100%;flex-direction:column;margin:0}.vertical .ant-arrow{top:unset;left:calc(50% - 30px);transform:rotate(90deg)}.vertical .ant-arrow__previous{top:14px}.vertical .ant-arrow__next{right:unset;bottom:14px}\n"] }]
|
|
81
|
+
], template: "<div [ngClass]=\"'cont' + ' ' + direction + ' ' + appearance\">\n <ng-container *ngIf=\"showArrows && appearance == 'default'\">\n <div\n class=\"ant-arrow ant-arrow__previous\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-left\" ></tk-kiosk-icon-btn>\n </div>\n\n <div\n class=\"ant-arrow ant-arrow__next\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-right\" ></tk-kiosk-icon-btn>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showArrows && appearance == 'lg'\">\n <div\n class=\"ant-arrow__lg ant-arrow__previous_lg\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-left\" class=\"icon\"></span>\n </div>\n\n <div\n class=\"ant-arrow__lg ant-arrow__next_lg\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-right\" class=\"icon\"></span>\n\n </div>\n </ng-container>\n\n\n <div #slider class=\"slider\" (scroll)=\"onScroll()\">\n <ng-content></ng-content>\n\n <nz-card class=\"view-more\" *ngIf=\"showViewAll\" (click)=\"goToViewAll()\" >\n <div class=\"view-more__body\">\n\n <tk-kiosk-typography type=\"h5-heading\" color=\"tk-color-text-900\">\n Ver todos\n </tk-kiosk-typography>\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:arrow-right\" color=\"secondary\"></tk-kiosk-icon-btn>\n </div>\n </nz-card>\n </div>\n\n</div>\n", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}:host{height:100%}.cont{max-width:100%;height:fit-content;position:relative}.icon{margin-right:6px;font-size:30px;color:var(--tk-color-primary-900)}.slider{margin:0 100px;display:flex;position:relative;overflow-x:auto;gap:18px;padding:20px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.slider::-webkit-scrollbar{display:none}.ant-arrow{position:absolute;z-index:2;top:calc(50% - 30px)}.ant-arrow__previous{left:14px}.ant-arrow__next{right:14px}.ant-arrow__lg{width:48px;height:200px;z-index:2;top:calc(50% - 100px);border-radius:8px;background:var(--tk-color-white-900);display:flex;justify-content:center;align-items:center;box-shadow:0 4px 4px #00000040}.ant-arrow__lg img{width:50px;height:50px}.ant-arrow__previous_lg{left:35px;transform:translate(-100%);position:absolute}.ant-arrow__previous_lg img{transform:rotate(180deg)}.ant-arrow__next_lg{position:absolute;right:-15px}.view-more{min-width:330px;display:flex;justify-content:center;align-items:center;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}.view-more__body{width:max-content;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}::ng-deep .example-box{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:260px;max-width:150px;max-height:260px;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}::ng-deep .example-box--lg{min-width:330px;min-height:400px;max-width:330px;max-height:400px}.lg .slider{margin:0}.vertical.cont{max-width:fit-content;height:100%;padding:100px 0}.vertical .slider{height:100%;flex-direction:column;margin:0}.vertical .ant-arrow{top:unset;left:calc(50% - 30px);transform:rotate(90deg)}.vertical .ant-arrow__previous{top:14px}.vertical .ant-arrow__next{right:unset;bottom:14px}\n"] }]
|
|
82
82
|
}], propDecorators: { sizeNextScroll: [{
|
|
83
83
|
type: Input,
|
|
84
84
|
args: ['sizeNextScroll']
|
|
@@ -106,4 +106,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImpor
|
|
|
106
106
|
type: ViewChild,
|
|
107
107
|
args: ['slider', { static: false }]
|
|
108
108
|
}] } });
|
|
109
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
109
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGsta2lvc2stc2xpZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3RrLWtpb3NrLWRzL3NyYy9saWIvY29tcG9uZW50cy90ay1raW9zay1zbGlkZXIvdGsta2lvc2stc2xpZGVyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3RrLWtpb3NrLWRzL3NyYy9saWIvY29tcG9uZW50cy90ay1raW9zay1zbGlkZXIvdGsta2lvc2stc2xpZGVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxPQUFPLEVBQUUsSUFBSSxFQUFFLE9BQU8sRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQ3pELE9BQU8sRUFDTCxTQUFTLEVBRVQsWUFBWSxFQUNaLEtBQUssRUFDTCxNQUFNLEVBQ04sU0FBUyxHQUNWLE1BQU0sZUFBZSxDQUFDO0FBQ3ZCLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUNyRCxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sb0JBQW9CLENBQUM7QUFDckQsT0FBTyxFQUFFLDBCQUEwQixFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDcEUsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sc0JBQXNCLENBQUM7O0FBaUIvRCxNQUFNLE9BQU8sc0JBQXNCO0lBZm5DO1FBZ0IyQixtQkFBYyxHQUFHLEdBQUcsQ0FBQztRQUNqQix1QkFBa0IsR0FBRyxHQUFHLENBQUM7UUFDakMsZUFBVSxHQUFHLElBQUksQ0FBQztRQUNuQixjQUFTLEdBQUcsTUFBTSxDQUFDO1FBQ2xCLGVBQVUsR0FBcUIsU0FBUyxDQUFDO1FBQzFDLGNBQVMsR0FBOEIsWUFBWSxDQUFDO1FBQ2xELGdCQUFXLEdBQVksS0FBSyxDQUFDO1FBRXpDLFlBQU8sR0FBc0IsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQVkxRCxzQkFB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O3VCQUFDLGFBQWE7Z0JBRVYsT0FBTztzQkFBaEIsTUFBTTtnQkFHcUMsT0FBTztzQkFBbEQsU0FBUzt1QkFBQyxRQUFRLEVBQUUsRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdDbGFzcywgTmdJZiwgTmdTdHlsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQge1xuICBDb21wb25lbnQsXG4gIEVsZW1lbnRSZWYsXG4gIEV2ZW50RW1pdHRlcixcbiAgSW5wdXQsXG4gIE91dHB1dCxcbiAgVmlld0NoaWxkLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE56Q2FyZENvbXBvbmVudCB9IGZyb20gJ25nLXpvcnJvLWFudGQvY2FyZCc7XG5pbXBvcnQgeyBOekljb25EaXJlY3RpdmUgfSBmcm9tICduZy16b3Jyby1hbnRkL2ljb24nO1xuaW1wb3J0IHsgVGtLaW9za1R5cG9ncmFwaHlDb21wb25lbnQgfSBmcm9tICcuLi90ay1raW9zay10eXBvZ3JhcGh5JztcbmltcG9ydCB7IFRrS2lvc2tJY29uQnRuQ29tcG9uZW50IH0gZnJvbSAnLi4vdGsta2lvc2staWNvbi1idG4nO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd0ay1raW9zay1zbGlkZXInLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbXG4gICAgTmdJZixcbiAgICBOZ1N0eWxlLFxuICAgIE5nQ2xhc3MsXG4gICAgTnpJY29uRGlyZWN0aXZlLFxuICAgIE56Q2FyZENvbXBvbmVudCxcbiAgICBUa0tpb3NrVHlwb2dyYXBoeUNvbXBvbmVudCxcbiAgICBUa0tpb3NrSWNvbkJ0bkNvbXBvbmVudCxcbiAgXSxcbiAgdGVtcGxhdGVVcmw6ICcuL3RrLWtpb3NrLXNsaWRlci5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi90ay1raW9zay1zbGlkZXIuY29tcG9uZW50LnNjc3MnLFxufSlcbmV4cG9ydCBjbGFzcyBUa0tpb3NrU2xpZGVyQ29tcG9uZW50IHtcbiAgQElucHV0KCdzaXplTmV4dFNjcm9sbCcpIHNpemVOZXh0U2Nyb2xsID0gODUwO1xuICBASW5wdXQoJ3NpemVQcmV2aW91c1Njcm9sbCcpIHNpemVQcmV2aW91c1Njcm9sbCA9IDg1MDtcbiAgQElucHV0KCdzaG93QXJyb3dzJykgc2hvd0Fycm93cyA9IHRydWU7XG4gIEBJbnB1dCgnbWFyZ2luVG9wJykgbWFyZ2luVG9wID0gJzkwcHgnO1xuICBASW5wdXQoJ2FwcGVhcmFuY2UnKSBhcHBlYXJhbmNlOiAnZGVmYXVsdCcgfCAnbGcnID0gJ2RlZmF1bHQnO1xuICBASW5wdXQoJ2RpcmVjdGlvbicpIGRpcmVjdGlvbjogJ2hvcml6b250YWwnIHwgJ3ZlcnRpY2FsJyA9ICdob3Jpem9udGFsJztcbiAgQElucHV0KCdzaG93Vmlld0FsbCcpIHNob3dWaWV3QWxsOiBib29sZWFuID0gZmFsc2U7XG5cbiAgQE91dHB1dCgpIHZpZXdBbGw6IEV2ZW50RW1pdHRlcjxhbnk+ID0gbmV3IEV2ZW50RW1pdHRlcigpO1xuXG4gIHNsaWRlckVsZW1lbnQhOiBFbGVtZW50UmVmO1xuICBAVmlld0NoaWxkKCdzbGlkZXInLCB7IHN0YXRpYzogZmFsc2UgfSkgc2V0IGNvbnRlbnQoY29udGVudDogRWxlbWVudFJlZikge1xuICAgIGlmIChjb250ZW50KSB7XG4gICAgICAvLyBpbml0aWFsbHkgc2V0dGVyIGdldHMgY2FsbGVkIHdpdGggdW5kZWZpbmVkXG4gICAgICAvLyBkZWJ1Z2dlcjtcblxuICAgICAgdGhpcy5zbGlkZXJFbGVtZW50ID0gY29udGVudDtcbiAgICB9XG4gIH1cblxuICBzaG93UHJldmlvdXNBcnJvdyA9IGZhbHNlO1xuICBzaG93TmV4dEFycm93ID0gZmFsc2U7XG5cbiAgbmdBZnRlclZpZXdJbml0KCkge1xuICAgIHRoaXMub25TY3JvbGwoKTtcbiAgfVxuXG4gIG9uU2Nyb2xsKCkge1xuICAgIGlmICh0aGlzLnNsaWRlckVsZW1lbnQ/Lm5hdGl2ZUVsZW1lbnQpIHtcbiAgICAgIGNvbnN0IHtcbiAgICAgICAgc2Nyb2xsTGVmdCxcbiAgICAgICAgc2Nyb2xsVG9wLFxuICAgICAgICBzY3JvbGxXaWR0aCxcbiAgICAgICAgY2xpZW50V2lkdGgsXG4gICAgICAgIHNjcm9sbEhlaWdodCxcbiAgICAgICAgY2xpZW50SGVpZ2h0LFxuICAgICAgfSA9IHRoaXMuc2xpZGVyRWxlbWVudD8ubmF0aXZlRWxlbWVudDtcblxuICAgICAgaWYgKHRoaXMuZGlyZWN0aW9uID09ICd2ZXJ0aWNhbCcpIHtcbiAgICAgICAgdGhpcy5zaG93UHJldmlvdXNBcnJvdyA9IHNjcm9sbFRvcCA+IDEwMDtcbiAgICAgICAgdGhpcy5zaG93TmV4dEFycm93ID1cbiAgICAgICAgICBNYXRoLmZsb29yKHNjcm9sbEhlaWdodCAtIHNjcm9sbFRvcCkgPiBjbGllbnRIZWlnaHQ7XG4gICAgICB9IGVsc2Uge1xuICAgICAgICB0aGlzLnNob3dQcmV2aW91c0Fycm93ID0gc2Nyb2xsTGVmdCA+IDEwMDtcbiAgICAgICAgdGhpcy5zaG93TmV4dEFycm93ID0gTWF0aC5mbG9vcihzY3JvbGxXaWR0aCAtIHNjcm9sbExlZnQpID4gY2xpZW50V2lkdGg7XG4gICAgICB9XG4gICAgfVxuICB9XG5cbiAgZ29QcmV2aW91cygpIHtcbiAgICBpZiAoIXRoaXMuc2xpZGVyRWxlbWVudD8ubmF0aXZlRWxlbWVudCkgcmV0dXJuO1xuICAgIGlmICh0aGlzLmRpcmVjdGlvbiA9PSAndmVydGljYWwnKSB7XG4gICAgICB0aGlzLnNsaWRlckVsZW1lbnQubmF0aXZlRWxlbWVudC5zY3JvbGxUb3AgLT0gdGhpcy5zaXplUHJldmlvdXNTY3JvbGw7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuc2xpZGVyRWxlbWVudC5uYXRpdmVFbGVtZW50LnNjcm9sbExlZnQgLT0gdGhpcy5zaXplUHJldmlvdXNTY3JvbGw7XG4gICAgfVxuICB9XG5cbiAgZ29OZXh0KCkge1xuICAgIGlmICghdGhpcy5zbGlkZXJFbGVtZW50Py5uYXRpdmVFbGVtZW50KSByZXR1cm47XG4gICAgaWYgKHRoaXMuZGlyZWN0aW9uID09ICd2ZXJ0aWNhbCcpIHtcbiAgICAgIHRoaXMuc2xpZGVyRWxlbWVudC5uYXRpdmVFbGVtZW50LnNjcm9sbFRvcCArPSB0aGlzLnNpemVOZXh0U2Nyb2xsO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aGlzLnNsaWRlckVsZW1lbnQubmF0aXZlRWxlbWVudC5zY3JvbGxMZWZ0ICs9IHRoaXMuc2l6ZU5leHRTY3JvbGw7XG4gICAgfVxuICB9XG5cbiAgZ29Ub1ZpZXdBbGwoKSB7XG4gICAgdGhpcy52aWV3QWxsLmVtaXQoKTtcbiAgfVxufVxuIiwiPGRpdiBbbmdDbGFzc109XCInY29udCcgKyAnICcgKyBkaXJlY3Rpb24gICsgJyAnICsgYXBwZWFyYW5jZVwiPlxuICA8bmctY29udGFpbmVyICpuZ0lmPVwic2hvd0Fycm93cyAmJiBhcHBlYXJhbmNlID09ICdkZWZhdWx0J1wiPlxuICAgIDxkaXZcbiAgICAgIGNsYXNzPVwiYW50LWFycm93IGFudC1hcnJvd19fcHJldmlvdXNcIlxuICAgICAgKGNsaWNrKT1cImdvUHJldmlvdXMoKVwiXG4gICAgICAqbmdJZj1cInNob3dQcmV2aW91c0Fycm93XCJcbiAgICA+XG4gICAgICA8dGsta2lvc2staWNvbi1idG4gc2l6ZT1cInNtYWxsXCIgaWNvbj1cInRrLWtpb3NrOmNoZXZyb24tbGVmdFwiID48L3RrLWtpb3NrLWljb24tYnRuPlxuICAgIDwvZGl2PlxuXG4gICAgPGRpdlxuICAgICAgY2xhc3M9XCJhbnQtYXJyb3cgYW50LWFycm93X19uZXh0XCJcbiAgICAgIChjbGljayk9XCJnb05leHQoKVwiXG4gICAgICAqbmdJZj1cInNob3dOZXh0QXJyb3dcIlxuICAgID5cbiAgICAgIDx0ay1raW9zay1pY29uLWJ0biBzaXplPVwic21hbGxcIiBpY29uPVwidGsta2lvc2s6Y2hldnJvbi1yaWdodFwiID48L3RrLWtpb3NrLWljb24tYnRuPlxuICAgIDwvZGl2PlxuICA8L25nLWNvbnRhaW5lcj5cblxuICA8bmctY29udGFpbmVyICpuZ0lmPVwic2hvd0Fycm93cyAmJiBhcHBlYXJhbmNlID09ICdsZydcIj5cbiAgICA8ZGl2XG4gICAgICBjbGFzcz1cImFudC1hcnJvd19fbGcgYW50LWFycm93X19wcmV2aW91c19sZ1wiXG4gICAgICAoY2xpY2spPVwiZ29QcmV2aW91cygpXCJcbiAgICAgICpuZ0lmPVwic2hvd1ByZXZpb3VzQXJyb3dcIlxuICAgID5cbiAgICAgICAgPHNwYW4gbnotaWNvbiBuelR5cGU9XCJ0ay1raW9zazpjaGV2cm9uLWxlZnRcIiBjbGFzcz1cImljb25cIj48L3NwYW4+XG4gICAgPC9kaXY+XG5cbiAgICA8ZGl2XG4gICAgICBjbGFzcz1cImFudC1hcnJvd19fbGcgYW50LWFycm93X19uZXh0X2xnXCJcbiAgICAgIChjbGljayk9XCJnb05leHQoKVwiXG4gICAgICAqbmdJZj1cInNob3dOZXh0QXJyb3dcIlxuICAgID5cbiAgICAgICAgPHNwYW4gbnotaWNvbiBuelR5cGU9XCJ0ay1raW9zazpjaGV2cm9uLXJpZ2h0XCIgY2xhc3M9XCJpY29uXCI+PC9zcGFuPlxuXG4gICAgPC9kaXY+XG4gIDwvbmctY29udGFpbmVyPlxuXG5cbiAgPGRpdiAjc2xpZGVyIGNsYXNzPVwic2xpZGVyXCIgKHNjcm9sbCk9XCJvblNjcm9sbCgpXCI+XG4gICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuXG4gICAgPG56LWNhcmQgY2xhc3M9XCJ2aWV3LW1vcmVcIiAqbmdJZj1cInNob3dWaWV3QWxsXCIgKGNsaWNrKT1cImdvVG9WaWV3QWxsKClcIiA+XG4gICAgICA8ZGl2IGNsYXNzPVwidmlldy1tb3JlX19ib2R5XCI+XG5cbiAgICAgICAgPHRrLWtpb3NrLXR5cG9ncmFwaHkgdHlwZT1cImg1LWhlYWRpbmdcIiBjb2xvcj1cInRrLWNvbG9yLXRleHQtOTAwXCI+XG4gICAgICAgICAgVmVyIHRvZG9zXG4gICAgICAgIDwvdGsta2lvc2stdHlwb2dyYXBoeT5cbiAgICAgICAgPHRrLWtpb3NrLWljb24tYnRuIHNpemU9XCJzbWFsbFwiIGljb249XCJ0ay1raW9zazphcnJvdy1yaWdodFwiIGNvbG9yPVwic2Vjb25kYXJ5XCI+PC90ay1raW9zay1pY29uLWJ0bj5cbiAgICAgIDwvZGl2PlxuICAgIDwvbnotY2FyZD5cbiAgPC9kaXY+XG5cbjwvZGl2PlxuIl19
|
|
@@ -842,7 +842,7 @@ class TkKioskSliderComponent {
|
|
|
842
842
|
this.viewAll.emit();
|
|
843
843
|
}
|
|
844
844
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: TkKioskSliderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
845
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: TkKioskSliderComponent, isStandalone: true, selector: "tk-kiosk-slider", inputs: { sizeNextScroll: "sizeNextScroll", sizePreviousScroll: "sizePreviousScroll", showArrows: "showArrows", marginTop: "marginTop", appearance: "appearance", direction: "direction", showViewAll: "showViewAll" }, outputs: { viewAll: "viewAll" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["slider"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"'cont' + ' ' + direction + ' ' + appearance\">\n <ng-container *ngIf=\"showArrows && appearance == 'default'\">\n <div\n class=\"ant-arrow ant-arrow__previous\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-left\" ></tk-kiosk-icon-btn>\n </div>\n\n <div\n class=\"ant-arrow ant-arrow__next\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-right\" ></tk-kiosk-icon-btn>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showArrows && appearance == 'lg'\">\n <div\n class=\"ant-arrow__lg ant-arrow__previous_lg\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-left\" class=\"icon\"></span>\n </div>\n\n <div\n class=\"ant-arrow__lg ant-arrow__next_lg\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-right\" class=\"icon\"></span>\n\n </div>\n </ng-container>\n\n\n <div #slider class=\"slider\" (scroll)=\"onScroll()\">\n <ng-content></ng-content>\n\n <nz-card class=\"view-more\" *ngIf=\"showViewAll\" (click)=\"goToViewAll()\" >\n <div class=\"view-more__body\">\n\n <tk-kiosk-typography type=\"h5-heading\" color=\"tk-color-text-900\">\n Ver todos\n </tk-kiosk-typography>\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:arrow-right\" color=\"secondary\"></tk-kiosk-icon-btn>\n </div>\n </nz-card>\n </div>\n\n</div>\n", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}.cont{max-width:100%;height:fit-content;position:relative}.icon{margin-right:6px;font-size:30px;color:var(--tk-color-primary-900)}.slider{margin:0 100px;display:flex;position:relative;overflow-x:auto;gap:18px;padding:20px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.slider::-webkit-scrollbar{display:none}.ant-arrow{position:absolute;z-index:2;top:calc(50% - 30px)}.ant-arrow__previous{left:14px}.ant-arrow__next{right:14px}.ant-arrow__lg{width:48px;height:200px;z-index:2;top:calc(50% - 100px);border-radius:8px;background:var(--tk-color-white-900);display:flex;justify-content:center;align-items:center;box-shadow:0 4px 4px #00000040}.ant-arrow__lg img{width:50px;height:50px}.ant-arrow__previous_lg{left:35px;transform:translate(-100%);position:absolute}.ant-arrow__previous_lg img{transform:rotate(180deg)}.ant-arrow__next_lg{position:absolute;right:-15px}.view-more{min-width:330px;display:flex;justify-content:center;align-items:center;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}.view-more__body{width:max-content;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}::ng-deep .example-box{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:260px;max-width:150px;max-height:260px;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}::ng-deep .example-box--lg{min-width:330px;min-height:400px;max-width:330px;max-height:400px}.lg .slider{margin:0}.vertical.cont{max-width:fit-content;height:100%;padding:100px 0}.vertical .slider{height:100%;flex-direction:column;margin:0}.vertical .ant-arrow{top:unset;left:calc(50% - 30px);transform:rotate(90deg)}.vertical .ant-arrow__previous{top:14px}.vertical .ant-arrow__next{right:unset;bottom:14px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NzIconDirective, selector: "[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: NzCardComponent, selector: "nz-card", inputs: ["nzBordered", "nzBorderless", "nzLoading", "nzHoverable", "nzBodyStyle", "nzCover", "nzActions", "nzType", "nzSize", "nzTitle", "nzExtra"], exportAs: ["nzCard"] }, { kind: "component", type: TkKioskTypographyComponent, selector: "tk-kiosk-typography", inputs: ["type", "color", "size", "weight", "lineBreak"] }, { kind: "component", type: TkKioskIconBtnComponent, selector: "tk-kiosk-icon-btn", inputs: ["isDisabled", "size", "type", "color", "icon", "iconSrc", "bgColor"], outputs: ["btnClick"] }] }); }
|
|
845
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.1.3", type: TkKioskSliderComponent, isStandalone: true, selector: "tk-kiosk-slider", inputs: { sizeNextScroll: "sizeNextScroll", sizePreviousScroll: "sizePreviousScroll", showArrows: "showArrows", marginTop: "marginTop", appearance: "appearance", direction: "direction", showViewAll: "showViewAll" }, outputs: { viewAll: "viewAll" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["slider"], descendants: true }], ngImport: i0, template: "<div [ngClass]=\"'cont' + ' ' + direction + ' ' + appearance\">\n <ng-container *ngIf=\"showArrows && appearance == 'default'\">\n <div\n class=\"ant-arrow ant-arrow__previous\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-left\" ></tk-kiosk-icon-btn>\n </div>\n\n <div\n class=\"ant-arrow ant-arrow__next\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-right\" ></tk-kiosk-icon-btn>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showArrows && appearance == 'lg'\">\n <div\n class=\"ant-arrow__lg ant-arrow__previous_lg\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-left\" class=\"icon\"></span>\n </div>\n\n <div\n class=\"ant-arrow__lg ant-arrow__next_lg\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-right\" class=\"icon\"></span>\n\n </div>\n </ng-container>\n\n\n <div #slider class=\"slider\" (scroll)=\"onScroll()\">\n <ng-content></ng-content>\n\n <nz-card class=\"view-more\" *ngIf=\"showViewAll\" (click)=\"goToViewAll()\" >\n <div class=\"view-more__body\">\n\n <tk-kiosk-typography type=\"h5-heading\" color=\"tk-color-text-900\">\n Ver todos\n </tk-kiosk-typography>\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:arrow-right\" color=\"secondary\"></tk-kiosk-icon-btn>\n </div>\n </nz-card>\n </div>\n\n</div>\n", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}:host{height:100%}.cont{max-width:100%;height:fit-content;position:relative}.icon{margin-right:6px;font-size:30px;color:var(--tk-color-primary-900)}.slider{margin:0 100px;display:flex;position:relative;overflow-x:auto;gap:18px;padding:20px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.slider::-webkit-scrollbar{display:none}.ant-arrow{position:absolute;z-index:2;top:calc(50% - 30px)}.ant-arrow__previous{left:14px}.ant-arrow__next{right:14px}.ant-arrow__lg{width:48px;height:200px;z-index:2;top:calc(50% - 100px);border-radius:8px;background:var(--tk-color-white-900);display:flex;justify-content:center;align-items:center;box-shadow:0 4px 4px #00000040}.ant-arrow__lg img{width:50px;height:50px}.ant-arrow__previous_lg{left:35px;transform:translate(-100%);position:absolute}.ant-arrow__previous_lg img{transform:rotate(180deg)}.ant-arrow__next_lg{position:absolute;right:-15px}.view-more{min-width:330px;display:flex;justify-content:center;align-items:center;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}.view-more__body{width:max-content;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}::ng-deep .example-box{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:260px;max-width:150px;max-height:260px;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}::ng-deep .example-box--lg{min-width:330px;min-height:400px;max-width:330px;max-height:400px}.lg .slider{margin:0}.vertical.cont{max-width:fit-content;height:100%;padding:100px 0}.vertical .slider{height:100%;flex-direction:column;margin:0}.vertical .ant-arrow{top:unset;left:calc(50% - 30px);transform:rotate(90deg)}.vertical .ant-arrow__previous{top:14px}.vertical .ant-arrow__next{right:unset;bottom:14px}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NzIconDirective, selector: "[nz-icon]", inputs: ["nzSpin", "nzRotate", "nzType", "nzTheme", "nzTwotoneColor", "nzIconfont"], exportAs: ["nzIcon"] }, { kind: "component", type: NzCardComponent, selector: "nz-card", inputs: ["nzBordered", "nzBorderless", "nzLoading", "nzHoverable", "nzBodyStyle", "nzCover", "nzActions", "nzType", "nzSize", "nzTitle", "nzExtra"], exportAs: ["nzCard"] }, { kind: "component", type: TkKioskTypographyComponent, selector: "tk-kiosk-typography", inputs: ["type", "color", "size", "weight", "lineBreak"] }, { kind: "component", type: TkKioskIconBtnComponent, selector: "tk-kiosk-icon-btn", inputs: ["isDisabled", "size", "type", "color", "icon", "iconSrc", "bgColor"], outputs: ["btnClick"] }] }); }
|
|
846
846
|
}
|
|
847
847
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImport: i0, type: TkKioskSliderComponent, decorators: [{
|
|
848
848
|
type: Component,
|
|
@@ -854,7 +854,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.3", ngImpor
|
|
|
854
854
|
NzCardComponent,
|
|
855
855
|
TkKioskTypographyComponent,
|
|
856
856
|
TkKioskIconBtnComponent,
|
|
857
|
-
], template: "<div [ngClass]=\"'cont' + ' ' + direction + ' ' + appearance\">\n <ng-container *ngIf=\"showArrows && appearance == 'default'\">\n <div\n class=\"ant-arrow ant-arrow__previous\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-left\" ></tk-kiosk-icon-btn>\n </div>\n\n <div\n class=\"ant-arrow ant-arrow__next\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-right\" ></tk-kiosk-icon-btn>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showArrows && appearance == 'lg'\">\n <div\n class=\"ant-arrow__lg ant-arrow__previous_lg\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-left\" class=\"icon\"></span>\n </div>\n\n <div\n class=\"ant-arrow__lg ant-arrow__next_lg\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-right\" class=\"icon\"></span>\n\n </div>\n </ng-container>\n\n\n <div #slider class=\"slider\" (scroll)=\"onScroll()\">\n <ng-content></ng-content>\n\n <nz-card class=\"view-more\" *ngIf=\"showViewAll\" (click)=\"goToViewAll()\" >\n <div class=\"view-more__body\">\n\n <tk-kiosk-typography type=\"h5-heading\" color=\"tk-color-text-900\">\n Ver todos\n </tk-kiosk-typography>\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:arrow-right\" color=\"secondary\"></tk-kiosk-icon-btn>\n </div>\n </nz-card>\n </div>\n\n</div>\n", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}.cont{max-width:100%;height:fit-content;position:relative}.icon{margin-right:6px;font-size:30px;color:var(--tk-color-primary-900)}.slider{margin:0 100px;display:flex;position:relative;overflow-x:auto;gap:18px;padding:20px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.slider::-webkit-scrollbar{display:none}.ant-arrow{position:absolute;z-index:2;top:calc(50% - 30px)}.ant-arrow__previous{left:14px}.ant-arrow__next{right:14px}.ant-arrow__lg{width:48px;height:200px;z-index:2;top:calc(50% - 100px);border-radius:8px;background:var(--tk-color-white-900);display:flex;justify-content:center;align-items:center;box-shadow:0 4px 4px #00000040}.ant-arrow__lg img{width:50px;height:50px}.ant-arrow__previous_lg{left:35px;transform:translate(-100%);position:absolute}.ant-arrow__previous_lg img{transform:rotate(180deg)}.ant-arrow__next_lg{position:absolute;right:-15px}.view-more{min-width:330px;display:flex;justify-content:center;align-items:center;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}.view-more__body{width:max-content;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}::ng-deep .example-box{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:260px;max-width:150px;max-height:260px;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}::ng-deep .example-box--lg{min-width:330px;min-height:400px;max-width:330px;max-height:400px}.lg .slider{margin:0}.vertical.cont{max-width:fit-content;height:100%;padding:100px 0}.vertical .slider{height:100%;flex-direction:column;margin:0}.vertical .ant-arrow{top:unset;left:calc(50% - 30px);transform:rotate(90deg)}.vertical .ant-arrow__previous{top:14px}.vertical .ant-arrow__next{right:unset;bottom:14px}\n"] }]
|
|
857
|
+
], template: "<div [ngClass]=\"'cont' + ' ' + direction + ' ' + appearance\">\n <ng-container *ngIf=\"showArrows && appearance == 'default'\">\n <div\n class=\"ant-arrow ant-arrow__previous\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-left\" ></tk-kiosk-icon-btn>\n </div>\n\n <div\n class=\"ant-arrow ant-arrow__next\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:chevron-right\" ></tk-kiosk-icon-btn>\n </div>\n </ng-container>\n\n <ng-container *ngIf=\"showArrows && appearance == 'lg'\">\n <div\n class=\"ant-arrow__lg ant-arrow__previous_lg\"\n (click)=\"goPrevious()\"\n *ngIf=\"showPreviousArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-left\" class=\"icon\"></span>\n </div>\n\n <div\n class=\"ant-arrow__lg ant-arrow__next_lg\"\n (click)=\"goNext()\"\n *ngIf=\"showNextArrow\"\n >\n <span nz-icon nzType=\"tk-kiosk:chevron-right\" class=\"icon\"></span>\n\n </div>\n </ng-container>\n\n\n <div #slider class=\"slider\" (scroll)=\"onScroll()\">\n <ng-content></ng-content>\n\n <nz-card class=\"view-more\" *ngIf=\"showViewAll\" (click)=\"goToViewAll()\" >\n <div class=\"view-more__body\">\n\n <tk-kiosk-typography type=\"h5-heading\" color=\"tk-color-text-900\">\n Ver todos\n </tk-kiosk-typography>\n <tk-kiosk-icon-btn size=\"small\" icon=\"tk-kiosk:arrow-right\" color=\"secondary\"></tk-kiosk-icon-btn>\n </div>\n </nz-card>\n </div>\n\n</div>\n", styles: ["@charset \"UTF-8\";*{box-sizing:border-box}:host{height:100%}.cont{max-width:100%;height:fit-content;position:relative}.icon{margin-right:6px;font-size:30px;color:var(--tk-color-primary-900)}.slider{margin:0 100px;display:flex;position:relative;overflow-x:auto;gap:18px;padding:20px 0;scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none}.slider::-webkit-scrollbar{display:none}.ant-arrow{position:absolute;z-index:2;top:calc(50% - 30px)}.ant-arrow__previous{left:14px}.ant-arrow__next{right:14px}.ant-arrow__lg{width:48px;height:200px;z-index:2;top:calc(50% - 100px);border-radius:8px;background:var(--tk-color-white-900);display:flex;justify-content:center;align-items:center;box-shadow:0 4px 4px #00000040}.ant-arrow__lg img{width:50px;height:50px}.ant-arrow__previous_lg{left:35px;transform:translate(-100%);position:absolute}.ant-arrow__previous_lg img{transform:rotate(180deg)}.ant-arrow__next_lg{position:absolute;right:-15px}.view-more{min-width:330px;display:flex;justify-content:center;align-items:center;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}.view-more__body{width:max-content;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}::ng-deep .example-box{display:flex;align-items:center;justify-content:center;min-width:150px;min-height:260px;max-width:150px;max-height:260px;border-radius:16px;background-color:var(--tk-color-neutral-100);box-shadow:6px 6px 10px #7884950d}::ng-deep .example-box--lg{min-width:330px;min-height:400px;max-width:330px;max-height:400px}.lg .slider{margin:0}.vertical.cont{max-width:fit-content;height:100%;padding:100px 0}.vertical .slider{height:100%;flex-direction:column;margin:0}.vertical .ant-arrow{top:unset;left:calc(50% - 30px);transform:rotate(90deg)}.vertical .ant-arrow__previous{top:14px}.vertical .ant-arrow__next{right:unset;bottom:14px}\n"] }]
|
|
858
858
|
}], propDecorators: { sizeNextScroll: [{
|
|
859
859
|
type: Input,
|
|
860
860
|
args: ['sizeNextScroll']
|