@solcre-org/core-ui 2.12.28 → 2.12.30
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.
|
@@ -12243,12 +12243,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
12243
12243
|
// Este archivo es generado automáticamente por scripts/update-version.js
|
|
12244
12244
|
// No edites manualmente este archivo
|
|
12245
12245
|
const VERSION = {
|
|
12246
|
-
full: '2.12.
|
|
12246
|
+
full: '2.12.30',
|
|
12247
12247
|
major: 2,
|
|
12248
12248
|
minor: 12,
|
|
12249
|
-
patch:
|
|
12250
|
-
timestamp: '2025-09-
|
|
12251
|
-
buildDate: '
|
|
12249
|
+
patch: 30,
|
|
12250
|
+
timestamp: '2025-09-12T11:42:46.742Z',
|
|
12251
|
+
buildDate: '12/9/2025'
|
|
12252
12252
|
};
|
|
12253
12253
|
|
|
12254
12254
|
class MainNavComponent {
|
|
@@ -12823,6 +12823,177 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
12823
12823
|
args: ['document:mouseup']
|
|
12824
12824
|
}] } });
|
|
12825
12825
|
|
|
12826
|
+
class GalleryModalGlobalService {
|
|
12827
|
+
_isModalOpen = signal(false);
|
|
12828
|
+
_isClosing = signal(false);
|
|
12829
|
+
_currentImages = signal([]);
|
|
12830
|
+
_currentIndex = signal(0);
|
|
12831
|
+
isModalOpen = this._isModalOpen.asReadonly();
|
|
12832
|
+
isClosing = this._isClosing.asReadonly();
|
|
12833
|
+
currentImages = this._currentImages.asReadonly();
|
|
12834
|
+
currentIndex = this._currentIndex.asReadonly();
|
|
12835
|
+
currentImage = computed(() => {
|
|
12836
|
+
const images = this._currentImages();
|
|
12837
|
+
const index = this._currentIndex();
|
|
12838
|
+
return images.length > 0 && index >= 0 && index < images.length
|
|
12839
|
+
? images[index]
|
|
12840
|
+
: null;
|
|
12841
|
+
});
|
|
12842
|
+
imageCounter = computed(() => {
|
|
12843
|
+
const images = this._currentImages();
|
|
12844
|
+
const index = this._currentIndex();
|
|
12845
|
+
return images.length > 0
|
|
12846
|
+
? `${index + 1} / ${images.length}`
|
|
12847
|
+
: '';
|
|
12848
|
+
});
|
|
12849
|
+
hasPrevious = computed(() => this._currentIndex() > 0);
|
|
12850
|
+
hasNext = computed(() => {
|
|
12851
|
+
const images = this._currentImages();
|
|
12852
|
+
const index = this._currentIndex();
|
|
12853
|
+
return index < images.length - 1;
|
|
12854
|
+
});
|
|
12855
|
+
openModal(images, initialIndex = 0) {
|
|
12856
|
+
if (!images || images.length === 0) {
|
|
12857
|
+
console.warn('GalleryModalGlobalService: No se proporcionaron imágenes');
|
|
12858
|
+
return;
|
|
12859
|
+
}
|
|
12860
|
+
this._currentImages.set(images);
|
|
12861
|
+
this._currentIndex.set(Math.min(initialIndex, images.length - 1));
|
|
12862
|
+
this._isClosing.set(false);
|
|
12863
|
+
this._isModalOpen.set(true);
|
|
12864
|
+
}
|
|
12865
|
+
closeModal(immediate = false) {
|
|
12866
|
+
if (!this._isModalOpen()) {
|
|
12867
|
+
return;
|
|
12868
|
+
}
|
|
12869
|
+
if (immediate) {
|
|
12870
|
+
this._isModalOpen.set(false);
|
|
12871
|
+
this._isClosing.set(false);
|
|
12872
|
+
this._currentImages.set([]);
|
|
12873
|
+
this._currentIndex.set(0);
|
|
12874
|
+
}
|
|
12875
|
+
else {
|
|
12876
|
+
this._isClosing.set(true);
|
|
12877
|
+
setTimeout(() => {
|
|
12878
|
+
this._isModalOpen.set(false);
|
|
12879
|
+
this._isClosing.set(false);
|
|
12880
|
+
this._currentImages.set([]);
|
|
12881
|
+
this._currentIndex.set(0);
|
|
12882
|
+
}, 200);
|
|
12883
|
+
}
|
|
12884
|
+
}
|
|
12885
|
+
previousImage() {
|
|
12886
|
+
if (this.hasPrevious()) {
|
|
12887
|
+
this._currentIndex.update(index => index - 1);
|
|
12888
|
+
}
|
|
12889
|
+
}
|
|
12890
|
+
nextImage() {
|
|
12891
|
+
if (this.hasNext()) {
|
|
12892
|
+
this._currentIndex.update(index => index + 1);
|
|
12893
|
+
}
|
|
12894
|
+
}
|
|
12895
|
+
goToImage(index) {
|
|
12896
|
+
const images = this._currentImages();
|
|
12897
|
+
if (index >= 0 && index < images.length) {
|
|
12898
|
+
this._currentIndex.set(index);
|
|
12899
|
+
}
|
|
12900
|
+
}
|
|
12901
|
+
getImageIndexById(imageId) {
|
|
12902
|
+
const images = this._currentImages();
|
|
12903
|
+
return images.findIndex(img => img.id === imageId);
|
|
12904
|
+
}
|
|
12905
|
+
updateImages(images) {
|
|
12906
|
+
if (images && images.length > 0) {
|
|
12907
|
+
const currentIndex = Math.min(this._currentIndex(), images.length - 1);
|
|
12908
|
+
this._currentImages.set(images);
|
|
12909
|
+
this._currentIndex.set(currentIndex);
|
|
12910
|
+
}
|
|
12911
|
+
}
|
|
12912
|
+
reset() {
|
|
12913
|
+
this._isModalOpen.set(false);
|
|
12914
|
+
this._isClosing.set(false);
|
|
12915
|
+
this._currentImages.set([]);
|
|
12916
|
+
this._currentIndex.set(0);
|
|
12917
|
+
}
|
|
12918
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GalleryModalGlobalService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
12919
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GalleryModalGlobalService, providedIn: 'root' });
|
|
12920
|
+
}
|
|
12921
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GalleryModalGlobalService, decorators: [{
|
|
12922
|
+
type: Injectable,
|
|
12923
|
+
args: [{
|
|
12924
|
+
providedIn: 'root'
|
|
12925
|
+
}]
|
|
12926
|
+
}] });
|
|
12927
|
+
|
|
12928
|
+
class GalleryModalComponent {
|
|
12929
|
+
galleryModalService = inject(GalleryModalGlobalService);
|
|
12930
|
+
isModalOpen = this.galleryModalService.isModalOpen;
|
|
12931
|
+
isModalClosing = this.galleryModalService.isClosing;
|
|
12932
|
+
currentImage = computed(() => this.galleryModalService.currentImage());
|
|
12933
|
+
currentIndex = this.galleryModalService.currentIndex;
|
|
12934
|
+
imageCounter = computed(() => this.galleryModalService.imageCounter());
|
|
12935
|
+
canNavigatePrevious = computed(() => this.galleryModalService.hasPrevious());
|
|
12936
|
+
canNavigateNext = computed(() => this.galleryModalService.hasNext());
|
|
12937
|
+
keyboardListener;
|
|
12938
|
+
constructor() { }
|
|
12939
|
+
ngOnDestroy() { }
|
|
12940
|
+
onKeyDown(event) {
|
|
12941
|
+
if (!this.isModalOpen()) {
|
|
12942
|
+
return;
|
|
12943
|
+
}
|
|
12944
|
+
switch (event.key) {
|
|
12945
|
+
case 'Escape':
|
|
12946
|
+
this.closeModal();
|
|
12947
|
+
break;
|
|
12948
|
+
case 'ArrowLeft':
|
|
12949
|
+
event.preventDefault();
|
|
12950
|
+
this.previousImage();
|
|
12951
|
+
break;
|
|
12952
|
+
case 'ArrowRight':
|
|
12953
|
+
event.preventDefault();
|
|
12954
|
+
this.nextImage();
|
|
12955
|
+
break;
|
|
12956
|
+
}
|
|
12957
|
+
}
|
|
12958
|
+
closeModal() {
|
|
12959
|
+
this.galleryModalService.closeModal();
|
|
12960
|
+
}
|
|
12961
|
+
previousImage() {
|
|
12962
|
+
this.galleryModalService.previousImage();
|
|
12963
|
+
}
|
|
12964
|
+
nextImage() {
|
|
12965
|
+
this.galleryModalService.nextImage();
|
|
12966
|
+
}
|
|
12967
|
+
onOverlayClick() {
|
|
12968
|
+
this.closeModal();
|
|
12969
|
+
}
|
|
12970
|
+
getModalClasses() {
|
|
12971
|
+
const classes = ['c-gallery-modal', 'js-gallery-modal'];
|
|
12972
|
+
if (this.isModalOpen()) {
|
|
12973
|
+
classes.push('is-visible');
|
|
12974
|
+
}
|
|
12975
|
+
if (this.isModalClosing()) {
|
|
12976
|
+
classes.push('is-closing');
|
|
12977
|
+
}
|
|
12978
|
+
return classes.join(' ');
|
|
12979
|
+
}
|
|
12980
|
+
getModalStyles() {
|
|
12981
|
+
return {
|
|
12982
|
+
'--_modal-animation-in': '200ms',
|
|
12983
|
+
'--_modal-animation-out': '200ms'
|
|
12984
|
+
};
|
|
12985
|
+
}
|
|
12986
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GalleryModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12987
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GalleryModalComponent, isStandalone: true, selector: "core-gallery-modal", host: { listeners: { "document:keydown": "onKeyDown($event)" } }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div [class]=\"getModalClasses()\" \n[ngStyle]=\"getModalStyles()\">\n\n<span class=\"c-gallery-modal__close icon-cross-thin js-gallery-modal-close\" \n (click)=\"closeModal()\"></span>\n\n<div class=\"c-gallery-modal__overlay js-gallery-modal-close\" \n (click)=\"onOverlayClick()\"></div>\n\n<div class=\"c-gallery-modal__holder\">\n\n@if (canNavigatePrevious()) {\n <button class=\"c-gallery-modal__nav icon-arrow-left c-gallery-modal__nav--left\" \n (click)=\"previousImage()\"\n [attr.aria-label]=\"'Imagen anterior'\"\n data-control=\"prevBtn\">\n </button>\n}\n\n@if (currentImage()) {\n <img \n [src]=\"currentImage()!.src\"\n [alt]=\"currentImage()!.alt || 'Imagen Ampliada'\"\n [title]=\"currentImage()!.title || ''\"\n loading=\"eager\"\n class=\"js-gallery-modal-img\">\n}\n\n@if (canNavigateNext()) {\n <button class=\"c-gallery-modal__nav icon-arrow-right c-gallery-modal__nav--right\" \n (click)=\"nextImage()\"\n [attr.aria-label]=\"'Siguiente imagen'\"\n data-control=\"nextBtn\">\n </button>\n}\n\n</div>\n\n<div class=\"c-gallery-modal__counter js-gallery-modal-counter\">\n{{ imageCounter() }}\n</div>\n</div>", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
|
|
12988
|
+
}
|
|
12989
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GalleryModalComponent, decorators: [{
|
|
12990
|
+
type: Component,
|
|
12991
|
+
args: [{ selector: 'core-gallery-modal', standalone: true, imports: [CommonModule], hostDirectives: [CoreHostDirective], template: "<div [class]=\"getModalClasses()\" \n[ngStyle]=\"getModalStyles()\">\n\n<span class=\"c-gallery-modal__close icon-cross-thin js-gallery-modal-close\" \n (click)=\"closeModal()\"></span>\n\n<div class=\"c-gallery-modal__overlay js-gallery-modal-close\" \n (click)=\"onOverlayClick()\"></div>\n\n<div class=\"c-gallery-modal__holder\">\n\n@if (canNavigatePrevious()) {\n <button class=\"c-gallery-modal__nav icon-arrow-left c-gallery-modal__nav--left\" \n (click)=\"previousImage()\"\n [attr.aria-label]=\"'Imagen anterior'\"\n data-control=\"prevBtn\">\n </button>\n}\n\n@if (currentImage()) {\n <img \n [src]=\"currentImage()!.src\"\n [alt]=\"currentImage()!.alt || 'Imagen Ampliada'\"\n [title]=\"currentImage()!.title || ''\"\n loading=\"eager\"\n class=\"js-gallery-modal-img\">\n}\n\n@if (canNavigateNext()) {\n <button class=\"c-gallery-modal__nav icon-arrow-right c-gallery-modal__nav--right\" \n (click)=\"nextImage()\"\n [attr.aria-label]=\"'Siguiente imagen'\"\n data-control=\"nextBtn\">\n </button>\n}\n\n</div>\n\n<div class=\"c-gallery-modal__counter js-gallery-modal-counter\">\n{{ imageCounter() }}\n</div>\n</div>" }]
|
|
12992
|
+
}], ctorParameters: () => [], propDecorators: { onKeyDown: [{
|
|
12993
|
+
type: HostListener,
|
|
12994
|
+
args: ['document:keydown', ['$event']]
|
|
12995
|
+
}] } });
|
|
12996
|
+
|
|
12826
12997
|
class LayoutComponent {
|
|
12827
12998
|
navItems = input([]);
|
|
12828
12999
|
bottomNavItems = input([]);
|
|
@@ -12999,7 +13170,7 @@ class LayoutComponent {
|
|
|
12999
13170
|
this.onLogout.emit();
|
|
13000
13171
|
}
|
|
13001
13172
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
13002
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LayoutComponent, isStandalone: true, selector: "core-layout", inputs: { navItems: { classPropertyName: "navItems", publicName: "navItems", isSignal: true, isRequired: false, transformFunction: null }, bottomNavItems: { classPropertyName: "bottomNavItems", publicName: "bottomNavItems", isSignal: true, isRequired: false, transformFunction: null }, collapsedLogo: { classPropertyName: "collapsedLogo", publicName: "collapsedLogo", isSignal: true, isRequired: false, transformFunction: null }, expandedLogo: { classPropertyName: "expandedLogo", publicName: "expandedLogo", isSignal: true, isRequired: false, transformFunction: null }, logoImagesConfig: { classPropertyName: "logoImagesConfig", publicName: "logoImagesConfig", isSignal: true, isRequired: false, transformFunction: null }, navConfig: { classPropertyName: "navConfig", publicName: "navConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onLogout: "onLogout" }, host: { listeners: { "window:resize": "onResize($event)" } }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div class=\"o-layout\" \n [attr.data-layout]=\"layoutService.dataAttributes()['data-layout']\"\n [attr.data-sidebar-left]=\"getEffectiveLeftSidebarVisibility()\"\n [attr.data-sidebar-left-w]=\"getEffectiveLeftSidebarWidth()\"\n [attr.data-sidebar-left-h]=\"getEffectiveLeftSidebarHeight()\"\n [attr.data-sidebar-right]=\"getEffectiveRightSidebarVisibility()\"\n [attr.data-sidebar-right-w]=\"getEffectiveRightSidebarWidth()\"\n [attr.data-sidebar-right-h]=\"getEffectiveRightSidebarHeight()\"\n >\n\n <!-- Nav -->\n <core-main-nav class=\"o-layout__nav\" \n (toggleSidebar)=\"toggleSidebar()\"\n [navItems]=\"navItems()\"\n [navConfig]=\"navConfig()\"\n [bottomNavItems]=\"bottomNavItems()\"\n [logoImagesConfig]=\"logoImagesConfig()\"\n [collapsedLogo]=\"collapsedLogo()\"\n [expandedLogo]=\"expandedLogo()\"\n (onLogout)=\"logout()\"\n >\n </core-main-nav>\n\n <!-- Main -->\n <div class=\"o-layout__body\">\n \n @if(layoutStateService.isHeaderVisible$() | async) {\n <core-header\n [class]=\"getHeaderClasses()\"\n (filterRequested)=\"onFilterRequested()\"\n (createRequested)=\"onCreateRequested()\"\n (globalActionTriggered)=\"onGlobalActionTriggered($event)\">\n </core-header>\n }\n\n @if(layoutService.sidebarLeft().visibility === SidebarVisibility.SHOW && leftSidebarConfig && shouldRenderLeftSidebar()) {\n <core-generic-sidebar \n class=\"o-layout__sidebar--left\"\n [config]=\"leftSidebarConfig\">\n </core-generic-sidebar>\n }\n\n <ng-content></ng-content>\n\n @if(layoutService.sidebarRight().visibility === SidebarVisibility.SHOW && rightSidebarConfig && shouldRenderRightSidebar()) {\n <core-generic-sidebar \n class=\"o-layout__sidebar--right\"\n [config]=\"rightSidebarConfig\">\n </core-generic-sidebar>\n }\n\n\n @if(dialogService.isOpen$()) {\n <core-confirmation-dialog\n [isOpen]=\"dialogService.isOpen$()\"\n [config]=\"dialogService.config$()\"\n (confirm)=\"dialogService.confirm($event)\"\n (cancel)=\"dialogService.cancel()\"\n ></core-confirmation-dialog>\n }\n\n @if(sidebarMobileModalService.isOpen()) {\n <core-generic-modal\n [isOpen]=\"sidebarMobileModalService.isOpen()\"\n [mode]=\"ModalMode.CREATE\"\n [title]=\"getSidebarModalTitle()\"\n [customTemplate]=\"sidebarModalContentTemplate\"\n (close)=\"sidebarMobileModalService.closeModal()\"\n [buttonConfig]=\"getSidebarModalButtons()\">\n </core-generic-modal>\n }\n\n </div> <!-- .o-layout__body -->\n</div> <!-- .o-layout -->\n\n<!-- Sidebar Custom Modal Global -->\n<core-sidebar-custom-modal></core-sidebar-custom-modal>\n\n<!-- Image Modal Global -->\n<core-image-modal></core-image-modal>\n\n<!-- ! Refactor: End -->", dependencies: [{ kind: "component", type: MainNavComponent, selector: "core-main-nav", inputs: ["navConfig", "appVersion", "navItems", "bottomNavItems", "isProduction", "logoImagesConfig", "collapsedLogo", "expandedLogo"], outputs: ["onLogout"] }, { kind: "component", type: HeaderComponent, selector: "core-header", outputs: ["filterRequested", "createRequested", "globalActionTriggered"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "component", type: ConfirmationDialogComponent, selector: "core-confirmation-dialog", inputs: ["isOpen", "config"], outputs: ["confirm", "cancel"] }, { kind: "component", type: GenericSidebarComponent, selector: "core-generic-sidebar", inputs: ["config", "position", "customTemplate"], outputs: ["itemClicked", "subItemClicked"] }, { kind: "component", type: GenericModalComponent, selector: "core-generic-modal", inputs: ["isOpen", "mode", "data", "fields", "tabs", "title", "isMultiple", "customTemplate", "customViewTemplate", "buttonConfig", "modelFactory", "errors", "validators", "customHasChanges"], outputs: ["save", "close", "modalData"] }, { kind: "component", type: ImageModalComponent, selector: "core-image-modal", outputs: ["modalClosed"] }, { kind: "component", type: SidebarCustomModalComponent, selector: "core-sidebar-custom-modal" }] });
|
|
13173
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: LayoutComponent, isStandalone: true, selector: "core-layout", inputs: { navItems: { classPropertyName: "navItems", publicName: "navItems", isSignal: true, isRequired: false, transformFunction: null }, bottomNavItems: { classPropertyName: "bottomNavItems", publicName: "bottomNavItems", isSignal: true, isRequired: false, transformFunction: null }, collapsedLogo: { classPropertyName: "collapsedLogo", publicName: "collapsedLogo", isSignal: true, isRequired: false, transformFunction: null }, expandedLogo: { classPropertyName: "expandedLogo", publicName: "expandedLogo", isSignal: true, isRequired: false, transformFunction: null }, logoImagesConfig: { classPropertyName: "logoImagesConfig", publicName: "logoImagesConfig", isSignal: true, isRequired: false, transformFunction: null }, navConfig: { classPropertyName: "navConfig", publicName: "navConfig", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onLogout: "onLogout" }, host: { listeners: { "window:resize": "onResize($event)" } }, hostDirectives: [{ directive: CoreHostDirective }], ngImport: i0, template: "<div class=\"o-layout\" \n [attr.data-layout]=\"layoutService.dataAttributes()['data-layout']\"\n [attr.data-sidebar-left]=\"getEffectiveLeftSidebarVisibility()\"\n [attr.data-sidebar-left-w]=\"getEffectiveLeftSidebarWidth()\"\n [attr.data-sidebar-left-h]=\"getEffectiveLeftSidebarHeight()\"\n [attr.data-sidebar-right]=\"getEffectiveRightSidebarVisibility()\"\n [attr.data-sidebar-right-w]=\"getEffectiveRightSidebarWidth()\"\n [attr.data-sidebar-right-h]=\"getEffectiveRightSidebarHeight()\"\n >\n\n <!-- Nav -->\n <core-main-nav class=\"o-layout__nav\" \n (toggleSidebar)=\"toggleSidebar()\"\n [navItems]=\"navItems()\"\n [navConfig]=\"navConfig()\"\n [bottomNavItems]=\"bottomNavItems()\"\n [logoImagesConfig]=\"logoImagesConfig()\"\n [collapsedLogo]=\"collapsedLogo()\"\n [expandedLogo]=\"expandedLogo()\"\n (onLogout)=\"logout()\"\n >\n </core-main-nav>\n\n <!-- Main -->\n <div class=\"o-layout__body\">\n \n @if(layoutStateService.isHeaderVisible$() | async) {\n <core-header\n [class]=\"getHeaderClasses()\"\n (filterRequested)=\"onFilterRequested()\"\n (createRequested)=\"onCreateRequested()\"\n (globalActionTriggered)=\"onGlobalActionTriggered($event)\">\n </core-header>\n }\n\n @if(layoutService.sidebarLeft().visibility === SidebarVisibility.SHOW && leftSidebarConfig && shouldRenderLeftSidebar()) {\n <core-generic-sidebar \n class=\"o-layout__sidebar--left\"\n [config]=\"leftSidebarConfig\">\n </core-generic-sidebar>\n }\n\n <ng-content></ng-content>\n\n @if(layoutService.sidebarRight().visibility === SidebarVisibility.SHOW && rightSidebarConfig && shouldRenderRightSidebar()) {\n <core-generic-sidebar \n class=\"o-layout__sidebar--right\"\n [config]=\"rightSidebarConfig\">\n </core-generic-sidebar>\n }\n\n\n @if(dialogService.isOpen$()) {\n <core-confirmation-dialog\n [isOpen]=\"dialogService.isOpen$()\"\n [config]=\"dialogService.config$()\"\n (confirm)=\"dialogService.confirm($event)\"\n (cancel)=\"dialogService.cancel()\"\n ></core-confirmation-dialog>\n }\n\n @if(sidebarMobileModalService.isOpen()) {\n <core-generic-modal\n [isOpen]=\"sidebarMobileModalService.isOpen()\"\n [mode]=\"ModalMode.CREATE\"\n [title]=\"getSidebarModalTitle()\"\n [customTemplate]=\"sidebarModalContentTemplate\"\n (close)=\"sidebarMobileModalService.closeModal()\"\n [buttonConfig]=\"getSidebarModalButtons()\">\n </core-generic-modal>\n }\n\n </div> <!-- .o-layout__body -->\n</div> <!-- .o-layout -->\n\n<!-- Sidebar Custom Modal Global -->\n<core-sidebar-custom-modal></core-sidebar-custom-modal>\n\n<!-- Image Modal Global -->\n<core-image-modal></core-image-modal>\n\n<!-- Gallery Modal Global -->\n<core-gallery-modal></core-gallery-modal>\n\n<!-- ! Refactor: End -->", dependencies: [{ kind: "component", type: MainNavComponent, selector: "core-main-nav", inputs: ["navConfig", "appVersion", "navItems", "bottomNavItems", "isProduction", "logoImagesConfig", "collapsedLogo", "expandedLogo"], outputs: ["onLogout"] }, { kind: "component", type: HeaderComponent, selector: "core-header", outputs: ["filterRequested", "createRequested", "globalActionTriggered"] }, { kind: "ngmodule", type: CommonModule }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "component", type: ConfirmationDialogComponent, selector: "core-confirmation-dialog", inputs: ["isOpen", "config"], outputs: ["confirm", "cancel"] }, { kind: "component", type: GenericSidebarComponent, selector: "core-generic-sidebar", inputs: ["config", "position", "customTemplate"], outputs: ["itemClicked", "subItemClicked"] }, { kind: "component", type: GenericModalComponent, selector: "core-generic-modal", inputs: ["isOpen", "mode", "data", "fields", "tabs", "title", "isMultiple", "customTemplate", "customViewTemplate", "buttonConfig", "modelFactory", "errors", "validators", "customHasChanges"], outputs: ["save", "close", "modalData"] }, { kind: "component", type: ImageModalComponent, selector: "core-image-modal", outputs: ["modalClosed"] }, { kind: "component", type: GalleryModalComponent, selector: "core-gallery-modal" }, { kind: "component", type: SidebarCustomModalComponent, selector: "core-sidebar-custom-modal" }] });
|
|
13003
13174
|
}
|
|
13004
13175
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: LayoutComponent, decorators: [{
|
|
13005
13176
|
type: Component,
|
|
@@ -13011,8 +13182,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
13011
13182
|
GenericSidebarComponent,
|
|
13012
13183
|
GenericModalComponent,
|
|
13013
13184
|
ImageModalComponent,
|
|
13185
|
+
GalleryModalComponent,
|
|
13014
13186
|
SidebarCustomModalComponent
|
|
13015
|
-
], hostDirectives: [CoreHostDirective], template: "<div class=\"o-layout\" \n [attr.data-layout]=\"layoutService.dataAttributes()['data-layout']\"\n [attr.data-sidebar-left]=\"getEffectiveLeftSidebarVisibility()\"\n [attr.data-sidebar-left-w]=\"getEffectiveLeftSidebarWidth()\"\n [attr.data-sidebar-left-h]=\"getEffectiveLeftSidebarHeight()\"\n [attr.data-sidebar-right]=\"getEffectiveRightSidebarVisibility()\"\n [attr.data-sidebar-right-w]=\"getEffectiveRightSidebarWidth()\"\n [attr.data-sidebar-right-h]=\"getEffectiveRightSidebarHeight()\"\n >\n\n <!-- Nav -->\n <core-main-nav class=\"o-layout__nav\" \n (toggleSidebar)=\"toggleSidebar()\"\n [navItems]=\"navItems()\"\n [navConfig]=\"navConfig()\"\n [bottomNavItems]=\"bottomNavItems()\"\n [logoImagesConfig]=\"logoImagesConfig()\"\n [collapsedLogo]=\"collapsedLogo()\"\n [expandedLogo]=\"expandedLogo()\"\n (onLogout)=\"logout()\"\n >\n </core-main-nav>\n\n <!-- Main -->\n <div class=\"o-layout__body\">\n \n @if(layoutStateService.isHeaderVisible$() | async) {\n <core-header\n [class]=\"getHeaderClasses()\"\n (filterRequested)=\"onFilterRequested()\"\n (createRequested)=\"onCreateRequested()\"\n (globalActionTriggered)=\"onGlobalActionTriggered($event)\">\n </core-header>\n }\n\n @if(layoutService.sidebarLeft().visibility === SidebarVisibility.SHOW && leftSidebarConfig && shouldRenderLeftSidebar()) {\n <core-generic-sidebar \n class=\"o-layout__sidebar--left\"\n [config]=\"leftSidebarConfig\">\n </core-generic-sidebar>\n }\n\n <ng-content></ng-content>\n\n @if(layoutService.sidebarRight().visibility === SidebarVisibility.SHOW && rightSidebarConfig && shouldRenderRightSidebar()) {\n <core-generic-sidebar \n class=\"o-layout__sidebar--right\"\n [config]=\"rightSidebarConfig\">\n </core-generic-sidebar>\n }\n\n\n @if(dialogService.isOpen$()) {\n <core-confirmation-dialog\n [isOpen]=\"dialogService.isOpen$()\"\n [config]=\"dialogService.config$()\"\n (confirm)=\"dialogService.confirm($event)\"\n (cancel)=\"dialogService.cancel()\"\n ></core-confirmation-dialog>\n }\n\n @if(sidebarMobileModalService.isOpen()) {\n <core-generic-modal\n [isOpen]=\"sidebarMobileModalService.isOpen()\"\n [mode]=\"ModalMode.CREATE\"\n [title]=\"getSidebarModalTitle()\"\n [customTemplate]=\"sidebarModalContentTemplate\"\n (close)=\"sidebarMobileModalService.closeModal()\"\n [buttonConfig]=\"getSidebarModalButtons()\">\n </core-generic-modal>\n }\n\n </div> <!-- .o-layout__body -->\n</div> <!-- .o-layout -->\n\n<!-- Sidebar Custom Modal Global -->\n<core-sidebar-custom-modal></core-sidebar-custom-modal>\n\n<!-- Image Modal Global -->\n<core-image-modal></core-image-modal>\n\n<!-- ! Refactor: End -->" }]
|
|
13187
|
+
], hostDirectives: [CoreHostDirective], template: "<div class=\"o-layout\" \n [attr.data-layout]=\"layoutService.dataAttributes()['data-layout']\"\n [attr.data-sidebar-left]=\"getEffectiveLeftSidebarVisibility()\"\n [attr.data-sidebar-left-w]=\"getEffectiveLeftSidebarWidth()\"\n [attr.data-sidebar-left-h]=\"getEffectiveLeftSidebarHeight()\"\n [attr.data-sidebar-right]=\"getEffectiveRightSidebarVisibility()\"\n [attr.data-sidebar-right-w]=\"getEffectiveRightSidebarWidth()\"\n [attr.data-sidebar-right-h]=\"getEffectiveRightSidebarHeight()\"\n >\n\n <!-- Nav -->\n <core-main-nav class=\"o-layout__nav\" \n (toggleSidebar)=\"toggleSidebar()\"\n [navItems]=\"navItems()\"\n [navConfig]=\"navConfig()\"\n [bottomNavItems]=\"bottomNavItems()\"\n [logoImagesConfig]=\"logoImagesConfig()\"\n [collapsedLogo]=\"collapsedLogo()\"\n [expandedLogo]=\"expandedLogo()\"\n (onLogout)=\"logout()\"\n >\n </core-main-nav>\n\n <!-- Main -->\n <div class=\"o-layout__body\">\n \n @if(layoutStateService.isHeaderVisible$() | async) {\n <core-header\n [class]=\"getHeaderClasses()\"\n (filterRequested)=\"onFilterRequested()\"\n (createRequested)=\"onCreateRequested()\"\n (globalActionTriggered)=\"onGlobalActionTriggered($event)\">\n </core-header>\n }\n\n @if(layoutService.sidebarLeft().visibility === SidebarVisibility.SHOW && leftSidebarConfig && shouldRenderLeftSidebar()) {\n <core-generic-sidebar \n class=\"o-layout__sidebar--left\"\n [config]=\"leftSidebarConfig\">\n </core-generic-sidebar>\n }\n\n <ng-content></ng-content>\n\n @if(layoutService.sidebarRight().visibility === SidebarVisibility.SHOW && rightSidebarConfig && shouldRenderRightSidebar()) {\n <core-generic-sidebar \n class=\"o-layout__sidebar--right\"\n [config]=\"rightSidebarConfig\">\n </core-generic-sidebar>\n }\n\n\n @if(dialogService.isOpen$()) {\n <core-confirmation-dialog\n [isOpen]=\"dialogService.isOpen$()\"\n [config]=\"dialogService.config$()\"\n (confirm)=\"dialogService.confirm($event)\"\n (cancel)=\"dialogService.cancel()\"\n ></core-confirmation-dialog>\n }\n\n @if(sidebarMobileModalService.isOpen()) {\n <core-generic-modal\n [isOpen]=\"sidebarMobileModalService.isOpen()\"\n [mode]=\"ModalMode.CREATE\"\n [title]=\"getSidebarModalTitle()\"\n [customTemplate]=\"sidebarModalContentTemplate\"\n (close)=\"sidebarMobileModalService.closeModal()\"\n [buttonConfig]=\"getSidebarModalButtons()\">\n </core-generic-modal>\n }\n\n </div> <!-- .o-layout__body -->\n</div> <!-- .o-layout -->\n\n<!-- Sidebar Custom Modal Global -->\n<core-sidebar-custom-modal></core-sidebar-custom-modal>\n\n<!-- Image Modal Global -->\n<core-image-modal></core-image-modal>\n\n<!-- Gallery Modal Global -->\n<core-gallery-modal></core-gallery-modal>\n\n<!-- ! Refactor: End -->" }]
|
|
13016
13188
|
}], propDecorators: { onResize: [{
|
|
13017
13189
|
type: HostListener,
|
|
13018
13190
|
args: ['window:resize', ['$event']]
|
|
@@ -15136,6 +15308,190 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
15136
15308
|
args: ['document:keydown', ['$event']]
|
|
15137
15309
|
}] } });
|
|
15138
15310
|
|
|
15311
|
+
var GalleryLayoutType;
|
|
15312
|
+
(function (GalleryLayoutType) {
|
|
15313
|
+
GalleryLayoutType["MAIN_LEFT"] = "main-left";
|
|
15314
|
+
GalleryLayoutType["MAIN_RIGHT"] = "main-right";
|
|
15315
|
+
GalleryLayoutType["MAIN_TOP"] = "main-top";
|
|
15316
|
+
GalleryLayoutType["SINGLE"] = "single";
|
|
15317
|
+
})(GalleryLayoutType || (GalleryLayoutType = {}));
|
|
15318
|
+
|
|
15319
|
+
var GalleryAnimationType;
|
|
15320
|
+
(function (GalleryAnimationType) {
|
|
15321
|
+
GalleryAnimationType["FADE"] = "fade";
|
|
15322
|
+
GalleryAnimationType["SLIDE_DOWN"] = "slide-down";
|
|
15323
|
+
GalleryAnimationType["SLIDE_UP"] = "slide-up";
|
|
15324
|
+
GalleryAnimationType["SLIDE_LEFT"] = "slide-left";
|
|
15325
|
+
GalleryAnimationType["SLIDE_RIGHT"] = "slide-right";
|
|
15326
|
+
GalleryAnimationType["ZOOM"] = "zoom";
|
|
15327
|
+
GalleryAnimationType["NONE"] = "none";
|
|
15328
|
+
})(GalleryAnimationType || (GalleryAnimationType = {}));
|
|
15329
|
+
|
|
15330
|
+
class GenericGalleryComponent {
|
|
15331
|
+
galleryModalService = inject(GalleryModalGlobalService);
|
|
15332
|
+
images = input.required();
|
|
15333
|
+
config = input({});
|
|
15334
|
+
imageClick = output();
|
|
15335
|
+
modalOpen = output();
|
|
15336
|
+
modalClose = output();
|
|
15337
|
+
imageChange = output();
|
|
15338
|
+
imageLoadingStates = signal(new Map());
|
|
15339
|
+
imageErrorStates = signal(new Map());
|
|
15340
|
+
SkeletonType = SkeletonType;
|
|
15341
|
+
SkeletonAnimation = SkeletonAnimation;
|
|
15342
|
+
defaultConfig = {
|
|
15343
|
+
layoutType: GalleryLayoutType.MAIN_LEFT,
|
|
15344
|
+
totalItems: 3,
|
|
15345
|
+
gap: '8px',
|
|
15346
|
+
borderRadius: '16px',
|
|
15347
|
+
showCounter: true,
|
|
15348
|
+
showNavigation: true,
|
|
15349
|
+
enableKeyboardNavigation: true,
|
|
15350
|
+
closeOnOutsideClick: true,
|
|
15351
|
+
animationType: GalleryAnimationType.FADE,
|
|
15352
|
+
animationInDuration: 400,
|
|
15353
|
+
animationOutDuration: 200,
|
|
15354
|
+
};
|
|
15355
|
+
finalConfig = computed(() => ({
|
|
15356
|
+
...this.defaultConfig,
|
|
15357
|
+
...this.config()
|
|
15358
|
+
}));
|
|
15359
|
+
mainImage = computed(() => {
|
|
15360
|
+
const imgs = this.images();
|
|
15361
|
+
return imgs.length > 0 ? imgs[0] : null;
|
|
15362
|
+
});
|
|
15363
|
+
thumbnailImages = computed(() => {
|
|
15364
|
+
const imgs = this.images();
|
|
15365
|
+
const config = this.finalConfig();
|
|
15366
|
+
const totalItems = config.totalItems || 3;
|
|
15367
|
+
if (config.layoutType === GalleryLayoutType.MAIN_LEFT ||
|
|
15368
|
+
config.layoutType === GalleryLayoutType.MAIN_RIGHT) {
|
|
15369
|
+
return imgs.slice(1, totalItems);
|
|
15370
|
+
}
|
|
15371
|
+
return imgs.slice(0, totalItems);
|
|
15372
|
+
});
|
|
15373
|
+
containerClasses = computed(() => {
|
|
15374
|
+
const config = this.finalConfig();
|
|
15375
|
+
const classes = ['c-gallery-grid', 'js-gallery-grid'];
|
|
15376
|
+
if (config.layoutType === GalleryLayoutType.MAIN_LEFT ||
|
|
15377
|
+
config.layoutType === GalleryLayoutType.MAIN_RIGHT) {
|
|
15378
|
+
classes.push('c-gallery-grid--side-items');
|
|
15379
|
+
}
|
|
15380
|
+
return classes.join(' ');
|
|
15381
|
+
});
|
|
15382
|
+
containerStyles = computed(() => {
|
|
15383
|
+
const config = this.finalConfig();
|
|
15384
|
+
const inputConfig = this.config();
|
|
15385
|
+
let sidesSize;
|
|
15386
|
+
if (inputConfig.sidesSize) {
|
|
15387
|
+
sidesSize = inputConfig.sidesSize;
|
|
15388
|
+
}
|
|
15389
|
+
else {
|
|
15390
|
+
switch (config.layoutType) {
|
|
15391
|
+
case GalleryLayoutType.MAIN_LEFT:
|
|
15392
|
+
case GalleryLayoutType.MAIN_TOP:
|
|
15393
|
+
sidesSize = '1.5fr 0.5fr';
|
|
15394
|
+
break;
|
|
15395
|
+
case GalleryLayoutType.MAIN_RIGHT:
|
|
15396
|
+
sidesSize = '0.5fr 1.5fr';
|
|
15397
|
+
break;
|
|
15398
|
+
default:
|
|
15399
|
+
sidesSize = '1.5fr 0.5fr';
|
|
15400
|
+
break;
|
|
15401
|
+
}
|
|
15402
|
+
}
|
|
15403
|
+
const styles = {
|
|
15404
|
+
'--total-items': config.totalItems || 3,
|
|
15405
|
+
'--sides-size': sidesSize,
|
|
15406
|
+
};
|
|
15407
|
+
return styles;
|
|
15408
|
+
});
|
|
15409
|
+
constructor() {
|
|
15410
|
+
effect(() => {
|
|
15411
|
+
const images = this.images();
|
|
15412
|
+
if (images.length > 0) {
|
|
15413
|
+
this.initializeImageStates();
|
|
15414
|
+
}
|
|
15415
|
+
});
|
|
15416
|
+
effect(() => {
|
|
15417
|
+
const currentIndex = this.galleryModalService.currentIndex();
|
|
15418
|
+
const currentImage = this.galleryModalService.currentImage();
|
|
15419
|
+
const isOpen = this.galleryModalService.isModalOpen();
|
|
15420
|
+
if (currentImage && isOpen) {
|
|
15421
|
+
this.imageChange.emit({ image: currentImage, index: currentIndex });
|
|
15422
|
+
}
|
|
15423
|
+
});
|
|
15424
|
+
}
|
|
15425
|
+
ngOnDestroy() { }
|
|
15426
|
+
onImageClick(image, index) {
|
|
15427
|
+
this.imageClick.emit({ image, index });
|
|
15428
|
+
this.openModal(index);
|
|
15429
|
+
}
|
|
15430
|
+
openModal(initialIndex = 0) {
|
|
15431
|
+
const images = this.images();
|
|
15432
|
+
this.galleryModalService.openModal(images, initialIndex);
|
|
15433
|
+
this.modalOpen.emit({ images, index: initialIndex });
|
|
15434
|
+
}
|
|
15435
|
+
closeModal() {
|
|
15436
|
+
this.galleryModalService.closeModal();
|
|
15437
|
+
this.modalClose.emit();
|
|
15438
|
+
}
|
|
15439
|
+
getImageKey(image, index) {
|
|
15440
|
+
return image.id?.toString() || image.src || index.toString();
|
|
15441
|
+
}
|
|
15442
|
+
isImageLoading(image, index) {
|
|
15443
|
+
const key = this.getImageKey(image, index);
|
|
15444
|
+
return this.imageLoadingStates().get(key) ?? true;
|
|
15445
|
+
}
|
|
15446
|
+
hasImageError(image, index) {
|
|
15447
|
+
const key = this.getImageKey(image, index);
|
|
15448
|
+
return this.imageErrorStates().get(key) ?? false;
|
|
15449
|
+
}
|
|
15450
|
+
onImageLoad(image, index) {
|
|
15451
|
+
const key = this.getImageKey(image, index);
|
|
15452
|
+
const loadingStates = new Map(this.imageLoadingStates());
|
|
15453
|
+
const errorStates = new Map(this.imageErrorStates());
|
|
15454
|
+
loadingStates.set(key, false);
|
|
15455
|
+
errorStates.set(key, false);
|
|
15456
|
+
this.imageLoadingStates.set(loadingStates);
|
|
15457
|
+
this.imageErrorStates.set(errorStates);
|
|
15458
|
+
}
|
|
15459
|
+
onImageError(image, index) {
|
|
15460
|
+
const key = this.getImageKey(image, index);
|
|
15461
|
+
const loadingStates = new Map(this.imageLoadingStates());
|
|
15462
|
+
const errorStates = new Map(this.imageErrorStates());
|
|
15463
|
+
loadingStates.set(key, false);
|
|
15464
|
+
errorStates.set(key, true);
|
|
15465
|
+
this.imageLoadingStates.set(loadingStates);
|
|
15466
|
+
this.imageErrorStates.set(errorStates);
|
|
15467
|
+
}
|
|
15468
|
+
initializeImageStates() {
|
|
15469
|
+
const images = this.images();
|
|
15470
|
+
const loadingStates = new Map();
|
|
15471
|
+
const errorStates = new Map();
|
|
15472
|
+
images.forEach((image, index) => {
|
|
15473
|
+
const key = this.getImageKey(image, index);
|
|
15474
|
+
loadingStates.set(key, true);
|
|
15475
|
+
errorStates.set(key, false);
|
|
15476
|
+
});
|
|
15477
|
+
this.imageLoadingStates.set(loadingStates);
|
|
15478
|
+
this.imageErrorStates.set(errorStates);
|
|
15479
|
+
}
|
|
15480
|
+
getImageLoading(isMainImage = false) {
|
|
15481
|
+
const config = this.finalConfig();
|
|
15482
|
+
if (isMainImage) {
|
|
15483
|
+
return 'eager';
|
|
15484
|
+
}
|
|
15485
|
+
return config.lazyLoading ? 'lazy' : 'eager';
|
|
15486
|
+
}
|
|
15487
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericGalleryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
15488
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.0.6", type: GenericGalleryComponent, isStandalone: true, selector: "core-generic-gallery", inputs: { images: { classPropertyName: "images", publicName: "images", isSignal: true, isRequired: true, transformFunction: null }, config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { imageClick: "imageClick", modalOpen: "modalOpen", modalClose: "modalClose", imageChange: "imageChange" }, providers: [], ngImport: i0, template: "<div [class]=\"containerClasses()\" \n [ngStyle]=\"containerStyles()\">\n \n @if (finalConfig().layoutType === 'main-left') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n \n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n }\n \n @if (finalConfig().layoutType === 'main-right') {\n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n \n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n }\n \n @if (finalConfig().layoutType === 'main-top') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n \n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n }\n\n @if (finalConfig().layoutType === 'single') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Single image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n }\n</div>\n", styles: [""], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: GenericSkeletonComponent, selector: "core-generic-skeleton", inputs: ["config", "items", "type", "size", "width", "height", "animated", "animation", "lines", "customClass", "ariaLabel"] }] });
|
|
15489
|
+
}
|
|
15490
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: GenericGalleryComponent, decorators: [{
|
|
15491
|
+
type: Component,
|
|
15492
|
+
args: [{ selector: 'core-generic-gallery', standalone: true, imports: [CommonModule, GenericSkeletonComponent], providers: [], template: "<div [class]=\"containerClasses()\" \n [ngStyle]=\"containerStyles()\">\n \n @if (finalConfig().layoutType === 'main-left') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n \n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n }\n \n @if (finalConfig().layoutType === 'main-right') {\n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n \n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n }\n \n @if (finalConfig().layoutType === 'main-top') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Main image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n \n @if (thumbnailImages().length > 0) {\n <div class=\"c-gallery-grid__imgs-xs\">\n @for (image of thumbnailImages(); track image.id || $index; let i = $index) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(image, i + 1)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(image, i + 1)\">\n \n @if (isImageLoading(image, i + 1)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading thumbnail: ' + (image.alt || 'Thumbnail')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(image, i + 1) && !hasImageError(image, i + 1)) {\n <img\n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n [title]=\"image.title || ''\"\n [loading]=\"getImageLoading(false)\"\n (click)=\"onImageClick(image, i + 1)\">\n }\n \n @if (isImageLoading(image, i + 1)) {\n <img \n [src]=\"image.thumbnail || image.src\"\n [alt]=\"image.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(image, i + 1)\"\n (error)=\"onImageError(image, i + 1)\">\n }\n \n @if (hasImageError(image, i + 1)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error</span>\n </div>\n </div>\n }\n </div>\n }\n </div>\n }\n }\n\n @if (finalConfig().layoutType === 'single') {\n @if (mainImage()) {\n <div class=\"c-gallery-grid__img\" \n [class.c-gallery-grid__img--loading]=\"isImageLoading(mainImage()!, 0)\"\n [class.c-gallery-grid__img--error]=\"hasImageError(mainImage()!, 0)\">\n \n @if (isImageLoading(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__skeleton\">\n <core-generic-skeleton \n [type]=\"SkeletonType.IMAGE\"\n width=\"100%\"\n height=\"100%\"\n [animation]=\"SkeletonAnimation.SHIMMER\"\n [ariaLabel]=\"'Loading image: ' + (mainImage()!.alt || 'Single image')\">\n </core-generic-skeleton>\n </div>\n }\n \n @if (!isImageLoading(mainImage()!, 0) && !hasImageError(mainImage()!, 0)) {\n <img\n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n [title]=\"mainImage()!.title || ''\"\n [loading]=\"getImageLoading(true)\"\n (click)=\"onImageClick(mainImage()!, 0)\">\n }\n \n @if (isImageLoading(mainImage()!, 0)) {\n <img \n [src]=\"mainImage()!.src\"\n [alt]=\"mainImage()!.alt || ''\"\n style=\"display: none;\"\n (load)=\"onImageLoad(mainImage()!, 0)\"\n (error)=\"onImageError(mainImage()!, 0)\">\n }\n \n @if (hasImageError(mainImage()!, 0)) {\n <div class=\"c-gallery-grid__error\">\n <div class=\"c-gallery-grid__error-content\">\n <span class=\"c-gallery-grid__error-icon\">\uD83D\uDCF7</span>\n <span class=\"c-gallery-grid__error-text\">Error al cargar imagen</span>\n </div>\n </div>\n }\n </div>\n }\n }\n</div>\n" }]
|
|
15493
|
+
}], ctorParameters: () => [] });
|
|
15494
|
+
|
|
15139
15495
|
class CacheBustingInterceptor {
|
|
15140
15496
|
intercept(req, next) {
|
|
15141
15497
|
if (req.url.includes('/assets/i18n/') && req.url.endsWith('.json')) {
|
|
@@ -15323,5 +15679,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
|
|
|
15323
15679
|
* Generated bundle index. Do not edit.
|
|
15324
15680
|
*/
|
|
15325
15681
|
|
|
15326
|
-
export { ActiveFiltersComponent, AlertComponent, AlertContainerComponent, AlertService, AlertType, ApiConfigurationProvider, BaseFieldComponent, ButtonContext, ButtonSize, ButtonType, CacheBustingInterceptor, CardComponent, CarouselComponent, ChatMessagePosition, ChatMessageType, CheckboxFieldComponent, ConfigurationModel, ConfirmationDialogComponent, ConfirmationDialogService, CoreHostDirective, CoreManualRefreshComponent, CoreUiHttpLoaderFactory, CoreUiTranslateLoader, CoreUiTranslateService, DataListComponent, DataListItemComponent, DateFieldComponent, DateUtility, DatetimeFieldComponent, DialogActions, DocumentAction, DocumentDisplayMode, DropdownComponent, DropdownDirection, DropdownService, DynamicFieldDirective, DynamicFieldsHelper, FieldErrorsComponent, FieldType, FileFieldComponent, FileModel, FilePreviewActionType, FileTemplateModel, FileTemplateType, FileType, FileTypeModel, FileUploadService, FilterModalComponent, FilterService, FilterType, GenericButtonComponent, GenericChatComponent, GenericChatService, GenericDocumentationComponent, GenericModalComponent, GenericPaginationComponent, GenericRatingComponent, GenericSidebarComponent, GenericSkeletonComponent, GenericStepsComponent, GenericTableComponent, GenericTabsComponent, GenericTimelineComponent, GlobalApiConfigService, HeaderComponent, HeaderConfigurationService, HeaderElementType, HeaderService, HttpLoaderFactory, ImageModalComponent, ImageModalService, ImagePreviewComponent, LayoutAuth, LayoutBreakpoint, LayoutComponent, LayoutService, LayoutStateService, LayoutType, LoaderComponent, LoaderService, MainNavComponent, MainNavService, ManualRefreshService, ModalMode, ModelApiService, MultiEntryFieldComponent, MultiEntryOutputFormat, NumberFieldComponent, NumberFieldConfigType, NumberFieldType, NumberRange, PERMISSION_ACTIONS_PROVIDER, PERMISSION_PROVIDER, PERMISSION_RESOURCES_PROVIDER, PaginationService, PasswordFieldComponent, PermissionEnumsService, PermissionModel, PermissionService, PermissionWrapperService, PermissionsActions, PermissionsInterceptor, PermissionsResources, ProgressBarComponent, ProgressBarSize, RatingService, RatingSize, RatingType, ResetPasswordModel, RoleModel, SelectFieldComponent, ServerSelectFieldComponent, ServerSelectService, SidebarCustomModalComponent, SidebarCustomModalService, SidebarHeight, SidebarMobileModalService, SidebarMobileType, SidebarPosition, SidebarService, SidebarState, SidebarTemplateRegistryService, SidebarVisibility, SidebarWidth, SkeletonAnimation, SkeletonService, SkeletonSize, SkeletonType, SmartFieldComponent, SortDirection, SortMode, StepSize, StepStatus, StepType, StepsService, SwitchFieldComponent, TableAction, TableActionService, TableDataService, TableSortService, TextAreaFieldComponent, TextFieldComponent, TimeFieldComponent, TimeInterval, TimelineService, TimelineStatus, TimelineType, TranslationMergeService, UsersModel, VERSION, equalToValidator, isSameDate, provideCoreUiTranslateLoader, providePermissionActions, providePermissionEnums, providePermissionResources, providePermissionService, providePermissionServiceFactory, provideTranslateLoader };
|
|
15682
|
+
export { ActiveFiltersComponent, AlertComponent, AlertContainerComponent, AlertService, AlertType, ApiConfigurationProvider, BaseFieldComponent, ButtonContext, ButtonSize, ButtonType, CacheBustingInterceptor, CardComponent, CarouselComponent, ChatMessagePosition, ChatMessageType, CheckboxFieldComponent, ConfigurationModel, ConfirmationDialogComponent, ConfirmationDialogService, CoreHostDirective, CoreManualRefreshComponent, CoreUiHttpLoaderFactory, CoreUiTranslateLoader, CoreUiTranslateService, DataListComponent, DataListItemComponent, DateFieldComponent, DateUtility, DatetimeFieldComponent, DialogActions, DocumentAction, DocumentDisplayMode, DropdownComponent, DropdownDirection, DropdownService, DynamicFieldDirective, DynamicFieldsHelper, FieldErrorsComponent, FieldType, FileFieldComponent, FileModel, FilePreviewActionType, FileTemplateModel, FileTemplateType, FileType, FileTypeModel, FileUploadService, FilterModalComponent, FilterService, FilterType, GalleryAnimationType, GalleryLayoutType, GalleryModalComponent, GalleryModalGlobalService, GenericButtonComponent, GenericChatComponent, GenericChatService, GenericDocumentationComponent, GenericGalleryComponent, GenericModalComponent, GenericPaginationComponent, GenericRatingComponent, GenericSidebarComponent, GenericSkeletonComponent, GenericStepsComponent, GenericTableComponent, GenericTabsComponent, GenericTimelineComponent, GlobalApiConfigService, HeaderComponent, HeaderConfigurationService, HeaderElementType, HeaderService, HttpLoaderFactory, ImageModalComponent, ImageModalService, ImagePreviewComponent, LayoutAuth, LayoutBreakpoint, LayoutComponent, LayoutService, LayoutStateService, LayoutType, LoaderComponent, LoaderService, MainNavComponent, MainNavService, ManualRefreshService, ModalMode, ModelApiService, MultiEntryFieldComponent, MultiEntryOutputFormat, NumberFieldComponent, NumberFieldConfigType, NumberFieldType, NumberRange, PERMISSION_ACTIONS_PROVIDER, PERMISSION_PROVIDER, PERMISSION_RESOURCES_PROVIDER, PaginationService, PasswordFieldComponent, PermissionEnumsService, PermissionModel, PermissionService, PermissionWrapperService, PermissionsActions, PermissionsInterceptor, PermissionsResources, ProgressBarComponent, ProgressBarSize, RatingService, RatingSize, RatingType, ResetPasswordModel, RoleModel, SelectFieldComponent, ServerSelectFieldComponent, ServerSelectService, SidebarCustomModalComponent, SidebarCustomModalService, SidebarHeight, SidebarMobileModalService, SidebarMobileType, SidebarPosition, SidebarService, SidebarState, SidebarTemplateRegistryService, SidebarVisibility, SidebarWidth, SkeletonAnimation, SkeletonService, SkeletonSize, SkeletonType, SmartFieldComponent, SortDirection, SortMode, StepSize, StepStatus, StepType, StepsService, SwitchFieldComponent, TableAction, TableActionService, TableDataService, TableSortService, TextAreaFieldComponent, TextFieldComponent, TimeFieldComponent, TimeInterval, TimelineService, TimelineStatus, TimelineType, TranslationMergeService, UsersModel, VERSION, equalToValidator, isSameDate, provideCoreUiTranslateLoader, providePermissionActions, providePermissionEnums, providePermissionResources, providePermissionService, providePermissionServiceFactory, provideTranslateLoader };
|
|
15327
15683
|
//# sourceMappingURL=solcre-org-core-ui.mjs.map
|