@libs-ui/components-gallery 0.2.10-6.2

package/fesm2022/libs-ui-components-gallery.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"libs-ui-components-gallery.mjs","sources":["../../../../../libs-ui/components/gallery/src/gallery.component.ts","../../../../../libs-ui/components/gallery/src/gallery.component.html","../../../../../libs-ui/components/gallery/src/libs-ui-components-gallery.ts"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-explicit-any */\nimport { AsyncPipe, NgComponentOutlet } from '@angular/common';\nimport { ChangeDetectionStrategy, Component, ComponentRef, computed, effect, inject, input, model, OnDestroy, OnInit, output, signal, untracked } from '@angular/core';\nimport { LibsUiIconsGetIconComponentPipe } from '@libs-ui/icons';\nimport { IEvent } from '@libs-ui/interfaces-types';\nimport { LibsUiDynamicComponentService } from '@libs-ui/services-dynamic-component';\nimport { isEmbedFrame, UtilsCommunicateMicro, UtilsCommunicateMicroKeyGlobal, uuid } from '@libs-ui/utils';\nimport dayjs from 'dayjs';\nimport { IGalleryFunctionsControlEvent } from './interfaces/functions-control-event.interface';\nimport { LibsUiComponentsGalleryViewerComponent } from './viewer/viewer.component';\n\n@Component({\n  // eslint-disable-next-line @angular-eslint/component-selector\n  selector: 'libs_ui-components-gallery',\n  templateUrl: './gallery.component.html',\n  styleUrls: ['./gallery.component.scss'],\n  standalone: true,\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  imports: [\n    NgComponentOutlet, AsyncPipe,\n    LibsUiIconsGetIconComponentPipe\n  ]\n})\nexport class LibsUiComponentsGalleryComponent implements OnInit, OnDestroy {\n  /* PROPERTY */\n  protected imagesDisplay = computed(() => {\n    return this.images().slice(this.start(), this.end());\n  });\n\n  private idOverlay = signal<string>(uuid());\n  private idInterval = signal<number | undefined>(undefined);\n  private viewerRef: ComponentRef<LibsUiComponentsGalleryViewerComponent> | undefined;\n\n  /* INPUT */\n  readonly images = model.required<Array<Record<string, any>>>();\n  readonly start = input<number>(0);\n  readonly end = input<number>(3);\n  readonly zIndex = input<number>(1200);\n  readonly fieldDisplaySrcImage = input<string>('url');\n  readonly ignoreOverlayCountImage = input<boolean>();\n  readonly imageArrayStringConvert = input<Array<string>>(); // sử dụng trong 1 số trường hợp images là Array<string>\n\n  /* OUTPUT */\n  readonly outFunctionsControl = output<IGalleryFunctionsControlEvent>();\n  readonly outViewerEvent = output<'show' | 'remove'>();\n\n  /* INJECT */\n  private dynamicComponent = inject(LibsUiDynamicComponentService);\n\n  constructor() {\n    effect(() => {\n      const imgConvert = this.imageArrayStringConvert();\n      const fieldGetSrc = this.fieldDisplaySrcImage();\n\n      if (!imgConvert?.length || !fieldGetSrc) {\n        return;\n      }\n      untracked(() => {\n        const convertedImages = imgConvert?.map(item => {\n          return {\n            [fieldGetSrc]: item\n          } as Record<string, any>;\n        }) || [];\n\n        this.images.set(convertedImages);\n      });\n    });\n  }\n\n  ngOnInit() {\n    this.outFunctionsControl.emit({\n      open: (imageSelected: Record<string, any>) => this.handlerSelectImage(undefined, imageSelected),\n      viewerRef: this.ViewerRef\n    })\n  }\n\n  /* FUNCTIONS */\n  protected async handlerSelectImage(event: MouseEvent | undefined, imageSelected: Record<string, any>) {\n    event?.stopPropagation();\n\n    if (this.viewerRef) {\n      return;\n    }\n\n    const viewerComponent = await import('./viewer/viewer.component').then(c => c.LibsUiComponentsGalleryViewerComponent);\n\n    this.viewerRef = this.dynamicComponent.resolveComponentFactory(viewerComponent);\n    this.outFunctionsControl.emit({ viewerRef: this.ViewerRef, open: (imageSelected: Record<string, any>) => this.handlerSelectImage(undefined, imageSelected) });\n\n    this.viewerRef.setInput('fieldDisplaySrcImage', this.fieldDisplaySrcImage());\n    this.viewerRef.setInput('images', this.images());\n    this.viewerRef.setInput('imageSelected', imageSelected);\n    this.viewerRef.setInput('zIndex', this.zIndex());\n    this.viewerRef.setInput('singleImage', this.images().length <= 1);\n\n    const sub = this.viewerRef.instance.outClose.subscribe(() => {\n      sub.unsubscribe();\n      this.closePopup();\n    });\n\n    this.dynamicComponent.addToBody(this.viewerRef);\n    this.outViewerEvent.emit('show');\n\n    if (isEmbedFrame()) {\n      const data = {\n        type: UtilsCommunicateMicroKeyGlobal.KEY_MESSAGE_MODAL,\n        response: {\n          message: 'open',\n          state: true,\n          idOverlay: this.idOverlay,\n          timeLiveUpdate: dayjs().unix()\n        }\n      };\n\n      UtilsCommunicateMicro.PostMessageToParent(data);\n\n      this.idInterval.set((setInterval(() => {\n        data.response.timeLiveUpdate = dayjs().unix();\n\n        UtilsCommunicateMicro.PostMessageToParent(data);\n      }, 2000) as unknown) as number);\n    }\n  }\n\n  protected handlerImageError(e: ErrorEvent, image: Record<string, any>) {\n    const event = e as IEvent;\n\n    event.stopPropagation();\n\n    image['isError'] = true;\n  }\n\n  private closePopup() {\n    clearInterval(this.idInterval());\n    if (this.viewerRef) {\n      this.outViewerEvent.emit('remove');\n      if (isEmbedFrame()) {\n        const data = {\n          type: UtilsCommunicateMicroKeyGlobal.KEY_MESSAGE_MODAL,\n          response: {\n            message: 'close',\n            state: false,\n            idOverlay: this.idOverlay\n          }\n        };\n\n        UtilsCommunicateMicro.PostMessageToParent(data);\n      }\n    }\n    this.dynamicComponent.remove(this.viewerRef);\n    this.viewerRef = undefined;\n    this.outFunctionsControl.emit({ viewerRef: this.ViewerRef, open: (imageSelected: Record<string, any>) => this.handlerSelectImage(undefined, imageSelected) });\n  }\n\n  private get ViewerRef() {\n    return this.viewerRef;\n  }\n\n  ngOnDestroy() {\n    this.viewerRef?.destroy();\n    this.closePopup();\n  }\n}\n","@if (images()) {\n  <div class=\"flex nowrap w-100 h-100\">\n    @for (image of imagesDisplay(); track $index; let last = $last) {\n      <div class=\"w-full h-full libs-ui-border-general relative cursor-pointer\"\n        [class.mr-[12px]]=\"!last\"\n        (click)=\"handlerSelectImage($event, image)\">\n        <div class=\"flex items-center justify-center w-full h-full\">\n          @if (!image['isError']) {\n            <img [src]=\"image[fieldDisplaySrcImage()]\"\n              class=\"flex libs-uipercent-max-height-100 libs-uipercent-max-width-100 m-auto\"\n              (error)='handlerImageError($event, image)' />\n          }\n          @if (image['isError']) {\n            <div *ngComponentOutlet=\"'image-default' | LibsUiIconsGetIconComponentPipe | async\"></div>\n          }\n        </div>\n        @if (last && images().length > end() && !ignoreOverlayCountImage()) {\n          <div class=\"flex w-full h-full absolute top-0 left-0 items-center justify-center bg-[#000] opacity-5\">\n          </div>\n          <div class=\"flex w-full h-full absolute top-0 left-0 items-center justify-center\">\n            <span class=\"libs-ui-font-h3s libs-ui-font-size-20px text-[#ffffff]\">+ {{ images().length - end() }}</span>\n          </div>\n        }\n      </div>\n    }\n  </div>\n}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}

package/gallery.component.d.ts

@@ -0,0 +1,28 @@
+import { OnDestroy, OnInit } from '@angular/core';
+import { IGalleryFunctionsControlEvent } from './interfaces/functions-control-event.interface';
+import * as i0 from "@angular/core";
+export declare class LibsUiComponentsGalleryComponent implements OnInit, OnDestroy {
+    protected imagesDisplay: import("@angular/core").Signal<Record<string, any>[]>;
+    private idOverlay;
+    private idInterval;
+    private viewerRef;
+    readonly images: import("@angular/core").ModelSignal<Record<string, any>[]>;
+    readonly start: import("@angular/core").InputSignal<number>;
+    readonly end: import("@angular/core").InputSignal<number>;
+    readonly zIndex: import("@angular/core").InputSignal<number>;
+    readonly fieldDisplaySrcImage: import("@angular/core").InputSignal<string>;
+    readonly ignoreOverlayCountImage: import("@angular/core").InputSignal<boolean | undefined>;
+    readonly imageArrayStringConvert: import("@angular/core").InputSignal<string[] | undefined>;
+    readonly outFunctionsControl: import("@angular/core").OutputEmitterRef<IGalleryFunctionsControlEvent>;
+    readonly outViewerEvent: import("@angular/core").OutputEmitterRef<"show" | "remove">;
+    private dynamicComponent;
+    constructor();
+    ngOnInit(): void;
+    protected handlerSelectImage(event: MouseEvent | undefined, imageSelected: Record<string, any>): Promise<void>;
+    protected handlerImageError(e: ErrorEvent, image: Record<string, any>): void;
+    private closePopup;
+    private get ViewerRef();
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsGalleryComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsGalleryComponent, "libs_ui-components-gallery", never, { "images": { "alias": "images"; "required": true; "isSignal": true; }; "start": { "alias": "start"; "required": false; "isSignal": true; }; "end": { "alias": "end"; "required": false; "isSignal": true; }; "zIndex": { "alias": "zIndex"; "required": false; "isSignal": true; }; "fieldDisplaySrcImage": { "alias": "fieldDisplaySrcImage"; "required": false; "isSignal": true; }; "ignoreOverlayCountImage": { "alias": "ignoreOverlayCountImage"; "required": false; "isSignal": true; }; "imageArrayStringConvert": { "alias": "imageArrayStringConvert"; "required": false; "isSignal": true; }; }, { "images": "imagesChange"; "outFunctionsControl": "outFunctionsControl"; "outViewerEvent": "outViewerEvent"; }, never, never, true, never>;
+}

package/index.d.ts

@@ -0,0 +1 @@
+export * from './gallery.component';

package/interfaces/functions-control-event.interface.d.ts

@@ -0,0 +1,5 @@
+import { ComponentRef } from "@angular/core";
+export interface IGalleryFunctionsControlEvent {
+    open: (imageSelected: Record<string, any>) => Promise<void>;
+    viewerRef: ComponentRef<any> | undefined;
+}

package/interfaces/zoom.interface.d.ts

@@ -0,0 +1,3 @@
+export interface IZoomDragHTMLElement extends HTMLElement {
+    stopDraggableBehavior?(): IZoomDragHTMLElement | null;
+}

package/package.json

@@ -0,0 +1,25 @@
+{
+  "name": "@libs-ui/components-gallery",
+  "version": "0.2.106.2",
+  "peerDependencies": {
+    "@angular/common": "^18.2.0",
+    "@angular/core": "^18.2.0"
+  },
+  "sideEffects": false,
+  "module": "fesm2022/libs-ui-components-gallery.mjs",
+  "typings": "index.d.ts",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "esm2022": "./esm2022/libs-ui-components-gallery.mjs",
+      "esm": "./esm2022/libs-ui-components-gallery.mjs",
+      "default": "./fesm2022/libs-ui-components-gallery.mjs"
+    }
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
+}

package/viewer/viewer.component.d.ts

@@ -0,0 +1,54 @@
+import { AfterViewInit, ElementRef, OnDestroy } from "@angular/core";
+import * as i0 from "@angular/core";
+export declare class LibsUiComponentsGalleryViewerComponent implements AfterViewInit, OnDestroy {
+    protected indexSelected: import("@angular/core").WritableSignal<number>;
+    protected scaleValue: import("@angular/core").WritableSignal<number>;
+    protected ratio: import("@angular/core").WritableSignal<string>;
+    protected fullScreen: import("@angular/core").WritableSignal<boolean>;
+    protected isShowButton: import("@angular/core").WritableSignal<boolean>;
+    protected disable: import("@angular/core").WritableSignal<boolean>;
+    protected hoverContentViewImage: import("@angular/core").WritableSignal<boolean>;
+    private step;
+    private draggableEl;
+    private widthDefault;
+    private heightDefault;
+    private viewPort;
+    private canDrag;
+    private widthImage;
+    private isFirstRender;
+    private timeouts;
+    private onDestroy;
+    readonly images: import("@angular/core").InputSignal<Record<string, any>[]>;
+    readonly fieldDisplaySrcImage: import("@angular/core").InputSignal<string>;
+    readonly imageSelected: import("@angular/core").ModelSignal<Record<string, any> | undefined>;
+    readonly removeBackdrop: import("@angular/core").InputSignal<boolean | undefined>;
+    readonly zIndex: import("@angular/core").InputSignal<number>;
+    readonly singleImage: import("@angular/core").InputSignal<boolean>;
+    readonly outClose: import("@angular/core").OutputEmitterRef<void>;
+    protected containerRef: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    protected singleImageRef: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    protected elementRatioRef: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    protected fullContainerRef: import("@angular/core").Signal<ElementRef<any> | undefined>;
+    protected imagesRef: import("@angular/core").Signal<readonly ElementRef<any>[]>;
+    constructor();
+    ngAfterViewInit(): void;
+    private setWidthImages;
+    protected handlerImageError(e: ErrorEvent, image: Record<string, any>): void;
+    protected handlerShowButton(isShow: boolean): void;
+    protected handlerMouseEvent(event: Event, status: boolean): void;
+    protected handlerClosePopup(e: Event): void;
+    protected handlerZoom(event: MouseEvent, type: 'in' | 'out'): void;
+    protected handlerNextImage(e: Event): void;
+    protected handlerPreviousImage(e: Event): void;
+    protected handlerSelectImage(e: Event, imageSelected: Record<string, any>, indexSelected: number): void;
+    protected handlerFullScreen(): void;
+    protected handlerReset(): void;
+    private makeElementDraggable;
+    private setStyleSelectImage;
+    private setWidthHeight;
+    private setDisplayRatio;
+    private createTimeout;
+    ngOnDestroy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<LibsUiComponentsGalleryViewerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<LibsUiComponentsGalleryViewerComponent, "libs_ui-components-gallery-viewer", never, { "images": { "alias": "images"; "required": true; "isSignal": true; }; "fieldDisplaySrcImage": { "alias": "fieldDisplaySrcImage"; "required": true; "isSignal": true; }; "imageSelected": { "alias": "imageSelected"; "required": false; "isSignal": true; }; "removeBackdrop": { "alias": "removeBackdrop"; "required": false; "isSignal": true; }; "zIndex": { "alias": "zIndex"; "required": false; "isSignal": true; }; "singleImage": { "alias": "singleImage"; "required": false; "isSignal": true; }; }, { "imageSelected": "imageSelectedChange"; "outClose": "outClose"; }, never, never, true, never>;
+}