@ng-doc/app/fesm2022/ng-doc-app-components-image-viewer.mjs.map

<!-- PROJECT LOGO --> <br /> <div align="center"> <a href="https://github.com/ng-doc/ng-doc"> <img src="https://ng-doc.com/assets/images/ng-doc.svg?raw=true" alt="Logo" height="150px"> </a>

{"version":3,"file":"ng-doc-app-components-image-viewer.mjs","sources":["../../../../libs/app/components/image-viewer/image-viewer.component.ts","../../../../libs/app/components/image-viewer/image-viewer.component.html","../../../../libs/app/components/image-viewer/ng-doc-app-components-image-viewer.ts"],"sourcesContent":["import { animate, group, query, style } from '@angular/animations';\nimport { NgTemplateOutlet } from '@angular/common';\nimport {\n  ChangeDetectionStrategy,\n  ChangeDetectorRef,\n  Component,\n  ElementRef,\n  HostListener,\n  inject,\n  input,\n  TemplateRef,\n  viewChild,\n} from '@angular/core';\nimport { NgDocOverlayContainerComponent, NgDocOverlayService } from '@ng-doc/ui-kit';\nimport { NgDocOverlayRef } from '@ng-doc/ui-kit/classes';\n\n@Component({\n  selector: 'ng-doc-image-viewer',\n  imports: [NgTemplateOutlet],\n  templateUrl: './image-viewer.component.html',\n  styleUrl: './image-viewer.component.scss',\n  changeDetection: ChangeDetectionStrategy.OnPush,\n  host: {\n    '[attr.data-opened]': '!!overlayRef',\n  },\n})\nexport class NgDocImageViewerComponent {\n  src = input.required<string>();\n  alt = input.required<string>();\n\n  protected readonly image = viewChild('image', { read: TemplateRef });\n  protected readonly overlay = inject(NgDocOverlayService);\n  protected readonly element = inject(ElementRef<HTMLElement>).nativeElement;\n  protected readonly changeDetectorRef = inject(ChangeDetectorRef);\n  protected overlayRef?: NgDocOverlayRef;\n\n  @HostListener('click')\n  clickEvent(): void {\n    this.overlayRef?.close();\n\n    const { width, height, top, left } = this.element.getBoundingClientRect();\n    const windowWidth = window.innerWidth;\n    const windowHeight = window.innerHeight;\n    const ratio = Math.min(windowWidth / width, windowHeight / height);\n    const newWidth = width * ratio;\n    const newHeight = height * ratio;\n\n    this.overlayRef = this.overlay.open(this.image(), {\n      overlayContainer: NgDocOverlayContainerComponent,\n      positionStrategy: this.overlay\n        .globalPositionStrategy()\n        .centerHorizontally()\n        .centerVertically(),\n      scrollStrategy: this.overlay.scrollStrategy().block(),\n      hasBackdrop: true,\n      backdropClass: 'ng-doc-blur-backdrop',\n      openAnimation: [\n        style({ position: 'fixed', width, height, top, left, transform: 'translate(0%, 0)' }),\n        group([\n          animate(\n            '300ms cubic-bezier(0.25, 0.8, 0.25, 1)',\n            style({\n              width: `${newWidth}px`,\n              height: `${newHeight}px`,\n              top: '50%',\n              left: '50%',\n              transform: 'translate(-50%, -50%)',\n            }),\n          ),\n          query('.ng-doc-image-container', [\n            style({ padding: 0 }),\n            animate('300ms cubic-bezier(0.25, 0.8, 0.25, 1)', style({ padding: '16px' })),\n          ]),\n        ]),\n      ],\n      closeAnimation: [\n        style({\n          position: 'fixed',\n          width: `${newWidth}px`,\n          height: `${newHeight}px`,\n          top: '50%',\n          left: '50%',\n          transform: 'translate(-50%, -50%)',\n        }),\n        group([\n          animate(\n            '300ms cubic-bezier(0.25, 0.8, 0.25, 1)',\n            style({ width, height, top, left, transform: 'translate(0%, 0)' }),\n          ),\n          query(\n            '.ng-doc-image-container',\n            animate('300ms cubic-bezier(0.25, 0.8, 0.25, 1)', style({ padding: 0 })),\n          ),\n        ]),\n      ],\n    });\n\n    this.overlayRef.afterClose().subscribe(() => {\n      this.overlayRef = undefined;\n      this.changeDetectorRef.markForCheck();\n    });\n  }\n}\n","<ng-content></ng-content>\n\n<ng-template #image>\n  <div class=\"ng-doc-image-container\" (click)=\"overlayRef?.close()\">\n    <img class=\"ng-doc-scaled-image\" [src]=\"src()\" [alt]=\"alt()\" />\n  </div>\n</ng-template>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}