{"__symbolic":"module","version":4,"exports":[{"from":"./lib/support"},{"from":"./lib/object-fit"},{"from":"./lib/loading"},{"from":"./lib/orientation"},{"from":"./lib/template-contexts"},{"export":[{"name":"GalleryItem","as":"GalleryItem"},{"name":"GalleryImage","as":"GalleryImage"},{"name":"GalleryVideo","as":"GalleryVideo"},{"name":"GalleryItemEvent","as":"GalleryItemEvent"}],"from":"./lib/gallery-item"},{"export":[{"name":"Aria","as":"Aria"}],"from":"./lib/aria"},{"export":[{"name":"MediaDirective","as":"MediaDirective"}],"from":"./directives/media.directive"}],"metadata":{"GalleryComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":30,"character":1},"arguments":[{"selector":"doe-gallery","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":34,"character":19},"member":"OnPush"},"template":"<span *ngIf=\"aria?.galleryLabel\" class=\"doe-sr-only\" tabindex=\"0\">\n  {{ aria.galleryLabel }}\n</span>\n\n<doe-thumbs\n  *ngIf=\"thumbs\"\n  [items]=\"items\"\n  [selectedIndex]=\"selectedIndex\"\n  [orientation]=\"thumbsOrientation\"\n  [arrows]=\"thumbsArrows\"\n  [arrowSlideByLength]=\"thumbsArrowSlideByLength\"\n  [autoScroll]=\"thumbsAutoScroll\"\n  [scrollBehavior]=\"thumbsScrollBehavior\"\n  [thumbTemplate]=\"thumbTemplate\"\n  [arrowTemplate]=\"thumbsArrowTemplate\"\n  [errorTemplate]=\"thumbErrorTemplate\"\n  [aria]=\"aria\"\n  [isRtl]=\"isRtl\"\n  (thumbClick)=\"_onThumbClick($event)\"\n  (thumbHover)=\"thumbHover.emit($event)\"\n></doe-thumbs>\n\n<doe-viewer\n  [items]=\"items\"\n  [selectedIndex]=\"selectedIndex\"\n  [arrows]=\"arrows\"\n  [descriptions]=\"descriptions\"\n  [errorText]=\"errorText\"\n  [mouseGestures]=\"mouseGestures\"\n  [touchGestures]=\"touchGestures\"\n  [counter]=\"counter\"\n  [counterOrientation]=\"counterOrientation\"\n  [itemWidth]=\"itemWidth\"\n  [objectFit]=\"objectFit\"\n  [loading]=\"loading\"\n  [itemTemplate]=\"itemTemplate\"\n  [loadingTemplate]=\"loadingTemplate || defaultLoadingTemplate\"\n  [errorTemplate]=\"errorTemplate\"\n  [contentTemplate]=\"contentTemplate\"\n  [loop]=\"loop\"\n  [thumbsOrientation]=\"_thumbsOrientationFlag\"\n  [arrowTemplate]=\"arrowTemplate\"\n  [aria]=\"aria\"\n  [isRtl]=\"isRtl\"\n  [touched]=\"_touched\"\n  (imageClick)=\"imageClick.emit($event)\"\n  (descriptionClick)=\"descriptionClick.emit($event)\"\n  (selection)=\"_selectInternal($event); _thumbsRef?.select($event)\"\n>\n</doe-viewer>\n\n<ng-template #defaultLoadingTemplate>\n  <div class=\"doe-loading\">\n    <div></div>\n    <div></div>\n    <div></div>\n  </div>\n</ng-template>\n","styles":[":host{display:flex;height:600px;outline:0;position:relative;width:500px}:host.doe-gallery--column{flex-direction:column}:host.rtl{direction:ltr}:host.rtl doe-thumbs,:host.rtl doe-viewer{direction:rtl}:host::ng-deep{font-family:Helvetica Neue,Helvetica,Arial,sans-serif}:host::ng-deep button{border:none}:host::ng-deep ul{list-style-type:none;margin:0;padding:0}:host::ng-deep .doe-sr-only{clip:rect(1px,1px,1px,1px);height:1px;left:-9999px;overflow:hidden;position:absolute!important;top:auto;width:1px}.doe-loading{align-items:center;background-color:transparent;display:flex;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%;z-index:10}.doe-loading>div{-webkit-animation:bounce 2s infinite;animation:bounce 2s infinite;background-color:#4a4a4a;border-radius:50%;box-shadow:0 0 0 1px #f5f5f5,0 0 1px 1px #f5f5f5;height:13px;width:13px}.doe-loading>div+div{-webkit-animation-delay:.125s;animation-delay:.125s;margin-left:10px}.doe-loading>div+div+div{-webkit-animation-delay:.3s;animation-delay:.3s}@-webkit-keyframes bounce{20%{transform:translateY(-20px)}50%{transform:translateY(0)}}@keyframes bounce{20%{transform:translateY(-20px)}50%{transform:translateY(0)}}"]}]}],"members":{"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"selectedIndex":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"aria":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"arrows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"descriptions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"errorText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"mouseGestures":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"touchGestures":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"counter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"counterOrientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":3}}]}],"itemWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"loading":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":48,"character":3}}]}],"loop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":49,"character":3}}]}],"objectFit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":3}}]}],"isRtl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":51,"character":3},"arguments":["class.rtl"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":52,"character":3}}]}],"itemTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3}}]}],"loadingTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"errorTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"arrowTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"contentTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":3}}]}],"thumbs":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":3}}]}],"thumbsAutoScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"thumbsOrientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":3}}]}],"thumbsArrows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":3}}]}],"thumbsArrowSlideByLength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"thumbsScrollBehavior":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":3}}]}],"thumbTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":3}}]}],"thumbsArrowTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":66,"character":3}}]}],"thumbErrorTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":3}}]}],"imageClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":69,"character":3}}]}],"thumbClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":70,"character":3}}]}],"thumbHover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":71,"character":3}}]}],"descriptionClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":3}}]}],"selection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":73,"character":3}}]}],"_viewerRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":75,"character":3},"arguments":[{"__symbolic":"reference","name":"ɵa"},{"static":false}]}]}],"_thumbsRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":76,"character":3},"arguments":[{"__symbolic":"reference","name":"ɵb"},{"static":false}]}]}],"_viewerElRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":77,"character":3},"arguments":[{"__symbolic":"reference","name":"ɵa"},{"static":false,"read":{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":77,"character":53}}]}]}],"_galleryColumn":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":83,"character":3},"arguments":["class.doe-gallery--column"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":101,"character":16},{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":102,"character":32,"context":{"typeName":"HTMLElement"},"module":"./lib/components/gallery/gallery.component"}]}]}],"focus":[{"__symbolic":"method"}],"next":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":119,"character":3},"arguments":["keydown.arrowright"]}]}],"prev":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":124,"character":3},"arguments":["keydown.arrowleft"]}]}],"select":[{"__symbolic":"method"}],"slideThumbs":[{"__symbolic":"method"}],"_onThumbClick":[{"__symbolic":"method"}],"_selectInternal":[{"__symbolic":"method"}]}},"GalleryModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":11,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"GalleryComponent"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","name":"ɵd"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵf"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":21,"character":12}],"exports":[{"__symbolic":"reference","name":"GalleryComponent"},{"__symbolic":"reference","name":"ɵf"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":40,"character":1},"arguments":[{"selector":"doe-viewer","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":44,"character":19},"member":"OnPush"},"animations":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"trigger","line":46,"character":4},"arguments":["mediaAnimate",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":47,"character":6},"arguments":[":leave",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":47,"character":27},"arguments":["0ms 100ms"]}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"transition","line":48,"character":6},"arguments":[":enter",[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":49,"character":8},"arguments":[{"opacity":0}]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"animate","line":50,"character":8},"arguments":["400ms",{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/animations","name":"style","line":50,"character":25},"arguments":[{"opacity":1}]}]}]]}]]}],"template":"<div\n  *ngIf=\"showPrevArrow\"\n  class=\"doe-viewer-arrow doe-viewer-arrow-prev\"\n  (click)=\"selectByDelta(-1)\"\n>\n  <doe-chevron-icon\n    *ngIf=\"!arrowTemplate; else arrowTemplate\"\n  ></doe-chevron-icon>\n</div>\n\n<ul #itemList [attr.aria-label]=\"aria?.viewerLabel\">\n  <li *ngIf=\"!_displayedItems?.length\" class=\"doe-viewer-initial-item\"></li>\n  <li\n    #itemsRef\n    *ngFor=\"let item of _displayedItems; let i = index\"\n    [class.doe-viewer-item--selected]=\"i === selectedIndex\"\n    [attr.tabindex]=\"itemTabbable(i)\"\n    [attr.aria-label]=\"item.alt\"\n    [attr.aria-describedby]=\"'doe-viewer-aria-description-' + i\"\n    (click)=\"onImageClick(item, $event)\"\n    (doe-media-load)=\"onItemLoaded(item)\"\n    (doe-media-error)=\"onItemErrored(item)\"\n    (keydown.Tab)=\"onTab(i + 1)\"\n    (keydown.shift.Tab)=\"onTab(i - 1)\"\n  >\n    <ng-container *ngIf=\"!lazyLoading || isInScrollportProximity(i)\">\n      <ng-container *ngIf=\"!itemTemplate; else customTemplate\">\n        <picture *ngIf=\"!isVideo(item)\" @mediaAnimate>\n          <source\n            *ngFor=\"let source of item.pictureSources\"\n            [srcset]=\"source.srcset\"\n            [attr.media]=\"source.media\"\n            [attr.sizes]=\"source.sizes\"\n            [attr.type]=\"source.type\"\n          />\n          <img\n            [src]=\"item.src\"\n            [alt]=\"item.alt\"\n            [class.doe-viewer-media-loading]=\"!itemLoaded(item)\"\n            [style.objectFit]=\"objectFit\"\n            (load)=\"onItemLoaded(item)\"\n            (error)=\"onItemErrored(item)\"\n          />\n        </picture>\n        <!-- Using loadedmetadata instead of loadeddata because iOS loads data lazily upon user's interaction -->\n        <video\n          *ngIf=\"!isYoutube(item) && isVideo(item)\"\n          @mediaAnimate\n          [src]=\"item.src\"\n          [poster]=\"item.thumbSrc || ''\"\n          [class.doe-viewer-media-loading]=\"!itemLoaded(item)\"\n          [style.objectFit]=\"objectFit\"\n          controls\n          playsinline\n          (loadedmetadata)=\"onItemLoaded(item)\"\n          (error)=\"onItemErrored(item)\"\n        ></video>\n\n        <iframe\n          *ngIf=\"isYoutube(item)\"\n          @mediaAnimate\n          [src]=\"item.src | safe\"\n          frameborder=\"0\"\n          allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\"\n          allowfullscreen\n          (load)=\"onItemLoaded(item)\"\n        ></iframe>\n      </ng-container>\n\n      <ng-container *ngIf=\"!itemLoaded(item) && !itemFailedToLoad(item)\">\n        <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n      </ng-container>\n\n      <ng-container *ngIf=\"itemFailedToLoad(item)\">\n        <div\n          *ngIf=\"!errorTemplate; else errorTemplate\"\n          class=\"doe-viewer-error\"\n        >\n          <div class=\"doe-viewer-error-icon\">⚠</div>\n          <p class=\"doe-viewer-error-text\">\n            {{ errorText || 'Loading of this media failed' }}\n          </p>\n        </div>\n      </ng-container>\n\n      <span\n        [id]=\"'doe-viewer-aria-description-' + i\"\n        class=\"doe-sr-only\"\n        [innerHTML]=\"item.description\"\n      ></span>\n    </ng-container>\n\n    <ng-template #customTemplate>\n      <ng-container\n        *ngTemplateOutlet=\"\n          itemTemplate;\n          context: {\n            index: items?.indexOf(item),\n            selectedIndex: selectedIndex,\n            item: item,\n            video: isVideo(item)\n          }\n        \"\n      ></ng-container>\n    </ng-template>\n  </li>\n</ul>\n\n<ng-container *ngIf=\"items?.length <= 0\">\n  <ng-container *ngTemplateOutlet=\"loadingTemplate\"></ng-container>\n</ng-container>\n\n<div\n  *ngIf=\"showNextArrow\"\n  class=\"doe-viewer-arrow doe-viewer-arrow-next\"\n  (click)=\"selectByDelta(1)\"\n>\n  <doe-chevron-icon\n    *ngIf=\"!arrowTemplate; else arrowTemplate\"\n  ></doe-chevron-icon>\n</div>\n\n<doe-counter\n  *ngIf=\"counter && items?.length\"\n  [itemQuantity]=\"items?.length\"\n  [selectedIndex]=\"selectedIndex\"\n  [orientation]=\"counterOrientation\"\n></doe-counter>\n\n<ng-container\n  *ngTemplateOutlet=\"\n    contentTemplate;\n    context: {\n      selectedIndex: selectedIndex\n    }\n  \"\n></ng-container>\n\n<div\n  *ngIf=\"descriptions && items\"\n  class=\"doe-viewer-description\"\n  [class.doe-viewer-description--above-counter]=\"\n    counter && counterOrientation === 'bottom'\n  \"\n  aria-hidden=\"true\"\n>\n  <div\n    *ngIf=\"items[selectedIndex]?.description as description\"\n    class=\"doe-viewer-description-inner\"\n    [innerHTML]=\"description\"\n    (click)=\"descriptionClick.emit($event)\"\n  ></div>\n</div>\n","styles":[":host{background-color:#ececec;display:block;height:100%;outline:none;overflow:hidden;position:relative;width:100%;z-index:1}:host.rtl .doe-viewer-arrow-next{left:0;right:auto;transform:translateY(-50%) scale(-1)}:host.rtl .doe-viewer-arrow-prev{left:auto;right:0;transform:translateY(-50%)}ul{--item-width:calc(100% - 0.01px);-ms-overflow-style:none;display:flex;height:100%;scrollbar-width:none;transition:transform .4s;width:100%}ul::-webkit-scrollbar{height:0;width:0}li{-moz-user-select:none;-webkit-user-select:none;align-items:center;display:flex;flex:none;outline:0;position:relative;user-select:none;width:calc(100% - .01px);width:var(--item-width)}picture{height:100%;width:100%}picture:not(:first-child){display:none}iframe,img,video{background-color:transparent;color:transparent;height:100%;outline:0;width:100%}img{-moz-user-select:none;-webkit-user-select:none;user-select:none}.doe-viewer-description{bottom:5px;display:flex;justify-content:center;position:absolute;width:100%}.doe-viewer-description--above-counter{bottom:35px}.doe-viewer-description-inner{background:#000;color:#fff;display:inline-block;font-size:.95em;max-width:80%;opacity:.8;padding:6px 15px;text-align:center}.doe-viewer-error{align-items:center;background-color:#f5f5f5;color:#7d7d7d;display:flex;flex-flow:column nowrap;height:100%;justify-content:center;left:0;position:absolute;top:0;width:100%}.doe-viewer-error-icon{font-size:40px}.doe-viewer-error-text{letter-spacing:.01em;margin-top:10px}.doe-viewer-arrow{cursor:pointer;display:flex;position:absolute;top:50%;transform:translateY(-50%);z-index:100}.doe-viewer-arrow-prev{left:0;transform:scale(-1) translateY(50%)}.doe-viewer-arrow-next{right:0}.doe-viewer-arrow doe-chevron-icon{margin:15px 6px;opacity:.7}@media (hover:hover) and (pointer:fine){.doe-viewer-arrow doe-chevron-icon:hover{opacity:1}}.doe-viewer-arrow doe-chevron-icon::ng-deep svg{height:32px;width:32px}"]}]}],"members":{"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"arrows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"selectedIndex":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":3}}]}],"descriptions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":3}}]}],"errorText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"mouseGestures":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":3}}]}],"touchGestures":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":3}}]}],"counter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"counterOrientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":3}}]}],"loading":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":3}}]}],"objectFit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":66,"character":3}}]}],"itemTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":67,"character":3}}]}],"loadingTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":68,"character":3}}]}],"errorTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":69,"character":3}}]}],"arrowTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":70,"character":3}}]}],"contentTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":71,"character":3}}]}],"thumbsOrientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":72,"character":3}}]}],"aria":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":73,"character":3}}]}],"loop":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":74,"character":3}}]}],"itemWidth":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":82,"character":3}}]}],"touched":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":85,"character":3}}]}],"isRtl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":87,"character":3},"arguments":["class.rtl"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":88,"character":3}}]}],"imageClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":91,"character":3}}]}],"descriptionClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":92,"character":3}}]}],"selection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":93,"character":3}}]}],"itemListRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":95,"character":3},"arguments":["itemList",{"static":true}]}]}],"itemsRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChildren","line":96,"character":3},"arguments":["itemsRef"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":135,"character":33,"context":{"typeName":"HTMLElement"},"module":"./lib/components/viewer/viewer.component"}]},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":136,"character":17},{"__symbolic":"reference","module":"@angular/core","name":"NgZone","line":137,"character":19}]}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"isInScrollportProximity":[{"__symbolic":"method"}],"isYoutube":[{"__symbolic":"method"}],"select":[{"__symbolic":"method"}],"selectByDelta":[{"__symbolic":"method"}],"onImageClick":[{"__symbolic":"method"}],"onTab":[{"__symbolic":"method"}],"onItemLoaded":[{"__symbolic":"method"}],"onItemErrored":[{"__symbolic":"method"}],"itemFailedToLoad":[{"__symbolic":"method"}],"itemLoaded":[{"__symbolic":"method"}],"itemTabbable":[{"__symbolic":"method"}],"center":[{"__symbolic":"method"}],"correctIndexOutOfBounds":[{"__symbolic":"method"}],"getFringeCount":[{"__symbolic":"method"}],"getItemsToBeDisplayed":[{"__symbolic":"method"}],"getSelectedItemProximitySpread":[{"__symbolic":"method"}],"handleMouseSlides":[{"__symbolic":"method"}],"handleTouchSlides":[{"__symbolic":"method"}],"handleResizes":[{"__symbolic":"method"}],"loopTo":[{"__symbolic":"method"}],"readDimensions":[{"__symbolic":"method"}],"selectBySwipeStats":[{"__symbolic":"method"}],"shift":[{"__symbolic":"method"}],"stopCurrentVideo":[{"__symbolic":"method"}],"updateDimensionsAndCenter":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":30,"character":1},"arguments":[{"selector":"doe-thumbs","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":34,"character":19},"member":"OnPush"},"template":"<div\n  *ngIf=\"showStartArrow\"\n  class=\"doe-thumbs-arrow doe-thumbs-arrow-prev\"\n  (click)=\"slide(-1)\"\n>\n  <div *ngIf=\"!arrowTemplate; else arrowTemplate\">\n    <doe-chevron-icon></doe-chevron-icon>\n  </div>\n</div>\n\n<ul #thumbs [style.scrollBehavior]=\"scrollBehavior\" [class.rtl]=\"isRtl\">\n  <li *ngIf=\"!items || !items.length\" class=\"doe-thumbs-initial-item\"></li>\n  <li\n    #thumb\n    *ngFor=\"let item of items; let i = index\"\n    [class.doe-thumbs-item--selected]=\"i === selectedIndex\"\n    aria-hidden=\"true\"\n    (click)=\"emitEvent(i, item, $event, thumbClick)\"\n    (mouseenter)=\"emitEvent(i, item, $event, thumbHover)\"\n  >\n    <ng-container *ngIf=\"!thumbTemplate; else customThumbTemplate\">\n      <img\n        [src]=\"item.thumbSrc || ''\"\n        [alt]=\"item.alt\"\n        (load)=\"onLoadChange(item, true)\"\n        (error)=\"onLoadChange(item, false)\"\n      />\n\n      <ng-container *ngIf=\"item._thumbFailed\">\n        <div\n          *ngIf=\"!errorTemplate; else errorTemplate\"\n          class=\"doe-thumbs-error\"\n        >\n          <div\n            class=\"doe-thumbs-error-icon\"\n            [class.doe-thumbs-error-icon--video]=\"isVideo(item)\"\n          ></div>\n        </div>\n      </ng-container>\n    </ng-container>\n\n    <ng-template #customThumbTemplate>\n      <ng-container\n        *ngTemplateOutlet=\"\n          thumbTemplate;\n          context: { index: i, selectedIndex: selectedIndex, item: item }\n        \"\n      ></ng-container>\n    </ng-template>\n  </li>\n</ul>\n\n<div\n  *ngIf=\"showEndArrow\"\n  class=\"doe-thumbs-arrow doe-thumbs-arrow-next\"\n  (click)=\"slide(1)\"\n>\n  <div *ngIf=\"!arrowTemplate; else arrowTemplate\">\n    <doe-chevron-icon></doe-chevron-icon>\n  </div>\n</div>\n","styles":[":host{background-color:#f3f3f3;flex:1 0 auto;position:relative}:host.doe-thumbs--bottom,:host.doe-thumbs--top{width:100%}:host.doe-thumbs--bottom ul,:host.doe-thumbs--top ul{display:flex;overflow-x:scroll;overflow-y:hidden;width:100%}:host.doe-thumbs--bottom ul.rtl li:first-child,:host.doe-thumbs--top ul.rtl li:first-child{margin-left:0;margin-right:auto}:host.doe-thumbs--bottom ul.rtl li:last-child,:host.doe-thumbs--top ul.rtl li:last-child{margin-left:auto;margin-right:0}:host.doe-thumbs--bottom li,:host.doe-thumbs--top li{flex:none}:host.doe-thumbs--bottom li:not(:first-child),:host.doe-thumbs--top li:not(:first-child){border-left:0}:host.doe-thumbs--bottom li:first-child,:host.doe-thumbs--top li:first-child{margin-left:auto}:host.doe-thumbs--bottom li:last-child,:host.doe-thumbs--top li:last-child{margin-right:auto}:host.doe-thumbs--bottom .doe-thumbs-arrow,:host.doe-thumbs--top .doe-thumbs-arrow{height:100%;top:0}:host.doe-thumbs--bottom .doe-thumbs-arrow>div,:host.doe-thumbs--top .doe-thumbs-arrow>div{height:100%;width:30px}:host.doe-thumbs--bottom .doe-thumbs-arrow-prev,:host.doe-thumbs--top .doe-thumbs-arrow-prev{left:0}:host.doe-thumbs--bottom .doe-thumbs-arrow-next,:host.doe-thumbs--top .doe-thumbs-arrow-next{right:0}:host.doe-thumbs--bottom .doe-thumbs-error,:host.doe-thumbs--top .doe-thumbs-error{border-right:1px solid #cecece}:host.doe-thumbs--left,:host.doe-thumbs--right{height:100%}:host.doe-thumbs--left ul,:host.doe-thumbs--right ul{height:100%;overflow-x:hidden;overflow-y:scroll}:host.doe-thumbs--left li,:host.doe-thumbs--right li{border-top:0}:host.doe-thumbs--left .doe-thumbs-arrow,:host.doe-thumbs--right .doe-thumbs-arrow{width:100%}:host.doe-thumbs--left .doe-thumbs-arrow>div,:host.doe-thumbs--right .doe-thumbs-arrow>div{height:30px;width:100%}:host.doe-thumbs--left .doe-thumbs-arrow doe-chevron-icon,:host.doe-thumbs--right .doe-thumbs-arrow doe-chevron-icon{transform:rotate(90deg)}:host.doe-thumbs--left .doe-thumbs-arrow-prev,:host.doe-thumbs--right .doe-thumbs-arrow-prev{top:0}:host.doe-thumbs--left .doe-thumbs-arrow-next,:host.doe-thumbs--right .doe-thumbs-arrow-next{bottom:0}:host.doe-thumbs--left .doe-thumbs-error,:host.doe-thumbs--right .doe-thumbs-error{border-bottom:1px solid #cecece}:host.doe-thumbs--bottom,:host.doe-thumbs--right{order:1}ul{-ms-overflow-style:none;-webkit-overflow-scrolling:touch;outline:0;scrollbar-width:none;transform:translateZ(0)}ul::-webkit-scrollbar{height:0;width:0}li{box-sizing:border-box;cursor:pointer;height:80px;position:relative;width:120px}li.doe-thumbs-initial-item{visibility:hidden}li.doe-thumbs-item--selected:after{border:10px solid hsla(0,0%,100%,.8117647058823529);bottom:0;box-sizing:border-box;content:\"\";display:block;height:100%;left:0;position:absolute;width:100%}img{-o-object-fit:cover;background-position:50%;background-repeat:no-repeat;color:transparent;object-fit:cover}.doe-thumbs-error,img{height:100%;width:100%}.doe-thumbs-error{align-items:center;background:#e8e8e8;box-sizing:border-box;display:flex;flex-flow:column nowrap;justify-content:center;left:0;position:absolute;top:0}.doe-thumbs-error-icon:not(.doe-thumbs-error-icon--video){border-bottom:28px solid #a5a5a5;border-left:16px solid transparent;border-right:16px solid transparent;margin-left:-8px;position:relative}.doe-thumbs-error-icon:not(.doe-thumbs-error-icon--video):after,.doe-thumbs-error-icon:not(.doe-thumbs-error-icon--video):before{content:\"\";position:absolute}.doe-thumbs-error-icon:not(.doe-thumbs-error-icon--video):before{background-color:#a5a5a5;border-radius:100%;height:10px;left:14px;width:10px}.doe-thumbs-error-icon:not(.doe-thumbs-error-icon--video):after{border-bottom:17px solid #a5a5a5;border-left:14px solid transparent;border-right:14px solid transparent;top:11px}.doe-thumbs-error-icon--video{border-bottom:16px solid transparent;border-left:28px solid #a5a5a5;border-top:16px solid transparent;margin-left:9px}.doe-thumbs-arrow{cursor:pointer;position:absolute;z-index:10}.doe-thumbs-arrow-prev{transform:scale(-1)}.doe-thumbs-arrow>div{align-items:center;background:rgba(0,0,0,.5);display:flex;justify-content:center;opacity:.7;padding:0}@media (hover:hover) and (pointer:fine){.doe-thumbs-arrow>div:hover{opacity:1}}"]}]}],"members":{"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"selectedIndex":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"aria":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"arrows":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"arrowSlideByLength":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"autoScroll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"thumbTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"arrowTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":3}}]}],"errorTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":46,"character":3}}]}],"scrollBehavior":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":47,"character":3}}]}],"isRtl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":48,"character":3}}]}],"thumbClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":50,"character":3}}]}],"thumbHover":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":51,"character":3}}]}],"thumbListRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":53,"character":3},"arguments":["thumbs",{"static":true}]}]}],"thumbsRef":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChildren","line":54,"character":3},"arguments":["thumb"]}]}],"cssClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":64,"character":3},"arguments":["class"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":88,"character":16},{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":89,"character":30,"context":{"typeName":"HTMLElement"},"module":"./lib/components/thumbs/thumbs.component"}]}]}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"slide":[{"__symbolic":"method"}],"centerThumbIfNeeded":[{"__symbolic":"method"}],"select":[{"__symbolic":"method"}],"emitEvent":[{"__symbolic":"method"}],"onLoadChange":[{"__symbolic":"method"}],"scroll":[{"__symbolic":"method"}],"shiftByDelta":[{"__symbolic":"method"}],"observeArrows":[{"__symbolic":"method"}],"setObservedArrows":[{"__symbolic":"method"}],"unobserveArrows":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"doe-chevron-icon","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":6,"character":19},"member":"OnPush"},"template":"<!-- Icon made by Dave Gandy from www.flaticon.com -->\n<svg\n  version=\"1.1\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n  x=\"0px\"\n  y=\"0px\"\n  viewBox=\"0 0 407.436 407.436\"\n  xml:space=\"preserve\"\n>\n  <polygon\n    points=\"112.814,0 91.566,21.178 273.512,203.718 91.566,386.258 112.814,407.436 315.869,203.718 \"\n  />\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n  <g></g>\n</svg>\n","styles":["svg{display:block;fill:#fff;filter:drop-shadow(0 0 1px black);height:26px;width:26px}"]}]}],"members":{}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"doe-counter","template":"\n    <span aria-hidden=\"true\">\n      {{ selectedIndex + 1 }}<span class=\"doe-counter-delimiter\">/</span\n      >{{ itemQuantity || 0 }}\n    </span>\n  ","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":18,"character":19},"member":"OnPush"},"styles":[":host{-moz-user-select:none;-webkit-user-select:none;background:#000;color:#fff;font-size:14px;left:50%;opacity:.7;padding:4px 7px 3px;position:absolute;transform:translateX(-50%);user-select:none}:host.top{top:0}:host.bottom{bottom:0}.doe-counter-delimiter{padding:0 2px}"]}]}],"members":{"itemQuantity":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"selectedIndex":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"orientation":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":27,"character":3},"arguments":["class"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Pipe","line":3,"character":1},"arguments":[{"name":"safe"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/platform-browser","name":"DomSanitizer","line":7,"character":33}]}],"transform":[{"__symbolic":"method"}]}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":2,"character":1},"arguments":[{"selector":"[doeMedia]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ElementRef","module":"@angular/core","arguments":[{"__symbolic":"error","message":"Could not resolve type","line":6,"character":42,"context":{"typeName":"HTMLElement"},"module":"./lib/directives/media.directive"}]}]}],"onLoad":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":8,"character":3},"arguments":["load",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":9,"character":3},"arguments":["loadedmetadata",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener","line":10,"character":3},"arguments":["error",["$event"]]}]}]}}},"origins":{"GalleryComponent":"./lib/components/gallery/gallery.component","GalleryModule":"./lib/gallery.module","ɵa":"./lib/components/viewer/viewer.component","ɵb":"./lib/components/thumbs/thumbs.component","ɵc":"./lib/components/icons/chevron/chevron-icon.component","ɵd":"./lib/components/counter/counter.component","ɵe":"./lib/pipes/safe.pipe","ɵf":"./lib/directives/media.directive"},"importAs":"ngx-doe-gallery"}