primevue 3.28.0 → 3.29.0

package/galleria/galleria.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.galleria=function(e,t,i,n,a,l,s,o,r,c){"use strict";function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var h=d(e),m=d(t),p=d(n),u=d(a),v=d(l),g=d(s),f=d(r),b=d(c),I={name:"GalleriaItem",emits:["start-slideshow","stop-slideshow","update:activeIndex"],props:{circular:{type:Boolean,default:!1},activeIndex:{type:Number,default:0},value:{type:Array,default:null},showItemNavigators:{type:Boolean,default:!0},showIndicators:{type:Boolean,default:!0},slideShowActive:{type:Boolean,default:!0},changeItemOnIndicatorHover:{type:Boolean,default:!0},autoPlay:{type:Boolean,default:!1},templates:{type:null,default:null},id:{type:String,default:null}},mounted(){this.autoPlay&&this.$emit("start-slideshow")},methods:{next(){let e=this.activeIndex+1,t=this.circular&&this.value.length-1===this.activeIndex?0:e;this.$emit("update:activeIndex",t)},prev(){let e=0!==this.activeIndex?this.activeIndex-1:0,t=this.circular&&0===this.activeIndex?this.value.length-1:e;this.$emit("update:activeIndex",t)},stopSlideShow(){this.slideShowActive&&this.stopSlideShow&&this.$emit("stop-slideshow")},navBackward(e){this.stopSlideShow(),this.prev(),e&&e.cancelable&&e.preventDefault()},navForward(e){this.stopSlideShow(),this.next(),e&&e.cancelable&&e.preventDefault()},onIndicatorClick(e){this.stopSlideShow(),this.$emit("update:activeIndex",e)},onIndicatorMouseEnter(e){this.changeItemOnIndicatorHover&&(this.stopSlideShow(),this.$emit("update:activeIndex",e))},onIndicatorKeyDown(e,t){switch(e.code){case"Enter":case"Space":this.stopSlideShow(),this.$emit("update:activeIndex",t),e.preventDefault();break;case"ArrowDown":case"ArrowUp":e.preventDefault()}},isIndicatorItemActive(e){return this.activeIndex===e},isNavBackwardDisabled(){return!this.circular&&0===this.activeIndex},isNavForwardDisabled(){return!this.circular&&this.activeIndex===this.value.length-1},ariaSlideNumber(e){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.slideNumber.replace(/{slideNumber}/g,e):void 0},ariaPageLabel(e){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.pageLabel.replace(/{page}/g,e):void 0}},computed:{activeItem(){return this.value[this.activeIndex]},navBackwardClass(){return["p-galleria-item-prev p-galleria-item-nav p-link",{"p-disabled":this.isNavBackwardDisabled()}]},navForwardClass(){return["p-galleria-item-next p-galleria-item-nav p-link",{"p-disabled":this.isNavForwardDisabled()}]},ariaSlideLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.slide:void 0}},components:{ChevronLeftIcon:v.default,ChevronRightIcon:g.default},directives:{ripple:u.default}};const y={class:"p-galleria-item-wrapper"},x={class:"p-galleria-item-container"},w=["disabled"],k=["id","aria-label","aria-roledescription"],S=["disabled"],C={key:2,class:"p-galleria-caption"},B={key:0,class:"p-galleria-indicators p-reset"},$=["aria-label","aria-selected","aria-controls","onClick","onMouseenter","onKeydown"],V={key:0,type:"button",tabindex:"-1",class:"p-link"};I.render=function(e,t,i,n,a,l){const s=o.resolveDirective("ripple");return o.openBlock(),o.createElementBlock("div",y,[o.createElementVNode("div",x,[i.showItemNavigators?o.withDirectives((o.openBlock(),o.createElementBlock("button",{key:0,type:"button",class:o.normalizeClass(l.navBackwardClass),onClick:t[0]||(t[0]=e=>l.navBackward(e)),disabled:l.isNavBackwardDisabled()},[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.templates.previousitemicon||"ChevronLeftIcon"),{class:"p-galleria-item-prev-icon"}))],10,w)),[[s]]):o.createCommentVNode("",!0),o.createElementVNode("div",{id:i.id+"_item_"+i.activeIndex,class:"p-galleria-item",role:"group","aria-label":l.ariaSlideNumber(i.activeIndex+1),"aria-roledescription":l.ariaSlideLabel},[i.templates.item?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.templates.item),{key:0,item:l.activeItem},null,8,["item"])):o.createCommentVNode("",!0)],8,k),i.showItemNavigators?o.withDirectives((o.openBlock(),o.createElementBlock("button",{key:1,type:"button",class:o.normalizeClass(l.navForwardClass),onClick:t[1]||(t[1]=e=>l.navForward(e)),disabled:l.isNavForwardDisabled()},[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.templates.nextitemicon||"ChevronRightIcon"),{class:"p-galleria-item-next-icon"}))],10,S)),[[s]]):o.createCommentVNode("",!0),i.templates.caption?(o.openBlock(),o.createElementBlock("div",C,[i.templates.caption?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.templates.caption),{key:0,item:l.activeItem},null,8,["item"])):o.createCommentVNode("",!0)])):o.createCommentVNode("",!0)]),i.showIndicators?(o.openBlock(),o.createElementBlock("ul",B,[(o.openBlock(!0),o.createElementBlock(o.Fragment,null,o.renderList(i.value,((e,t)=>(o.openBlock(),o.createElementBlock("li",{key:`p-galleria-indicator-${t}`,class:o.normalizeClass(["p-galleria-indicator",{"p-highlight":l.isIndicatorItemActive(t)}]),tabindex:"0","aria-label":l.ariaPageLabel(t+1),"aria-selected":i.activeIndex===t,"aria-controls":i.id+"_item_"+t,onClick:e=>l.onIndicatorClick(t),onMouseenter:e=>l.onIndicatorMouseEnter(t),onKeydown:e=>l.onIndicatorKeyDown(e,t)},[i.templates.indicator?o.createCommentVNode("",!0):(o.openBlock(),o.createElementBlock("button",V)),i.templates.indicator?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.templates.indicator),{key:1,index:t},null,8,["index"])):o.createCommentVNode("",!0)],42,$)))),128))])):o.createCommentVNode("",!0)])};var N={name:"GalleriaThumbnails",emits:["stop-slideshow","update:activeIndex"],props:{containerId:{type:String,default:null},value:{type:Array,default:null},numVisible:{type:Number,default:3},activeIndex:{type:Number,default:0},isVertical:{type:Boolean,default:!1},slideShowActive:{type:Boolean,default:!1},circular:{type:Boolean,default:!1},responsiveOptions:{type:Array,default:null},contentHeight:{type:String,default:"300px"},showThumbnailNavigators:{type:Boolean,default:!0},templates:{type:null,default:null},prevButtonProps:{type:null,default:null},nextButtonProps:{type:null,default:null}},startPos:null,thumbnailsStyle:null,sortedResponsiveOptions:null,data(){return{d_numVisible:this.numVisible,d_oldNumVisible:this.numVisible,d_activeIndex:this.activeIndex,d_oldActiveItemIndex:this.activeIndex,totalShiftedItems:0,page:0}},watch:{numVisible(e,t){this.d_numVisible=e,this.d_oldNumVisible=t},activeIndex(e,t){this.d_activeIndex=e,this.d_oldActiveItemIndex=t}},mounted(){this.createStyle(),this.calculatePosition(),this.responsiveOptions&&this.bindDocumentListeners()},updated(){let e=this.totalShiftedItems;this.d_oldNumVisible===this.d_numVisible&&this.d_oldActiveItemIndex===this.d_activeIndex||(e=this.d_activeIndex<=this.getMedianItemIndex()?0:this.value.length-this.d_numVisible+this.getMedianItemIndex()<this.d_activeIndex?this.d_numVisible-this.value.length:this.value.length-this.d_numVisible<this.d_activeIndex&&this.d_numVisible%2==0?-1*this.d_activeIndex+this.getMedianItemIndex()+1:-1*this.d_activeIndex+this.getMedianItemIndex(),e!==this.totalShiftedItems&&(this.totalShiftedItems=e),this.$refs.itemsContainer.style.transform=this.isVertical?`translate3d(0, ${e*(100/this.d_numVisible)}%, 0)`:`translate3d(${e*(100/this.d_numVisible)}%, 0, 0)`,this.d_oldActiveItemIndex!==this.d_activeIndex&&(i.DomHandler.removeClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transition="transform 500ms ease 0s"),this.d_oldActiveItemIndex=this.d_activeIndex,this.d_oldNumVisible=this.d_numVisible)},beforeUnmount(){this.responsiveOptions&&this.unbindDocumentListeners(),this.thumbnailsStyle&&this.thumbnailsStyle.parentNode.removeChild(this.thumbnailsStyle)},methods:{step(e){let t=this.totalShiftedItems+e;e<0&&-1*t+this.d_numVisible>this.value.length-1?t=this.d_numVisible-this.value.length:e>0&&t>0&&(t=0),this.circular&&(e<0&&this.value.length-1===this.d_activeIndex?t=0:e>0&&0===this.d_activeIndex&&(t=this.d_numVisible-this.value.length)),this.$refs.itemsContainer&&(i.DomHandler.removeClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transform=this.isVertical?`translate3d(0, ${t*(100/this.d_numVisible)}%, 0)`:`translate3d(${t*(100/this.d_numVisible)}%, 0, 0)`,this.$refs.itemsContainer.style.transition="transform 500ms ease 0s"),this.totalShiftedItems=t},stopSlideShow(){this.slideShowActive&&this.stopSlideShow&&this.$emit("stop-slideshow")},getMedianItemIndex(){let e=Math.floor(this.d_numVisible/2);return this.d_numVisible%2?e:e-1},navBackward(e){this.stopSlideShow();let t=0!==this.d_activeIndex?this.d_activeIndex-1:0,i=t+this.totalShiftedItems;this.d_numVisible-i-1>this.getMedianItemIndex()&&(-1*this.totalShiftedItems!=0||this.circular)&&this.step(1);let n=this.circular&&0===this.d_activeIndex?this.value.length-1:t;this.$emit("update:activeIndex",n),e.cancelable&&e.preventDefault()},navForward(e){this.stopSlideShow();let t=this.d_activeIndex===this.value.length-1?this.value.length-1:this.d_activeIndex+1;t+this.totalShiftedItems>this.getMedianItemIndex()&&(-1*this.totalShiftedItems<this.getTotalPageNumber()-1||this.circular)&&this.step(-1);let i=this.circular&&this.value.length-1===this.d_activeIndex?0:t;this.$emit("update:activeIndex",i),e.cancelable&&e.preventDefault()},onItemClick(e){this.stopSlideShow();let t=e;if(t!==this.d_activeIndex){const e=t+this.totalShiftedItems;let i=0;t<this.d_activeIndex?(i=this.d_numVisible-e-1-this.getMedianItemIndex(),i>0&&-1*this.totalShiftedItems!=0&&this.step(i)):(i=this.getMedianItemIndex()-e,i<0&&-1*this.totalShiftedItems<this.getTotalPageNumber()-1&&this.step(i)),this.$emit("update:activeIndex",t)}},onThumbnailKeydown(e,t){switch("Enter"!==e.code&&"Space"!==e.code||(this.onItemClick(t),e.preventDefault()),e.code){case"ArrowRight":this.onRightKey();break;case"ArrowLeft":this.onLeftKey();break;case"Home":this.onHomeKey(),e.preventDefault();break;case"End":this.onEndKey(),e.preventDefault();break;case"ArrowUp":case"ArrowDown":e.preventDefault();break;case"Tab":this.onTabKey()}},onRightKey(){const e=i.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item"),t=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(t,t+1===e.length?e.length-1:t+1)},onLeftKey(){const e=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(e,e-1<=0?0:e-1)},onHomeKey(){const e=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(e,0)},onEndKey(){const e=i.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item"),t=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(t,e.length-1)},onTabKey(){const e=[...i.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item")],t=e.findIndex((e=>i.DomHandler.hasClass(e,"p-galleria-thumbnail-item-current"))),n=i.DomHandler.findSingle(this.$refs.itemsContainer,'.p-galleria-thumbnail-item > [tabindex="0"'),a=e.findIndex((e=>e===n.parentElement));e[a].children[0].tabIndex="-1",e[t].children[0].tabIndex="0"},findFocusedIndicatorIndex(){const e=[...i.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item")],t=i.DomHandler.findSingle(this.$refs.itemsContainer,'.p-galleria-thumbnail-item > [tabindex="0"]');return e.findIndex((e=>e===t.parentElement))},changedFocusedIndicator(e,t){const n=i.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item");n[e].children[0].tabIndex="-1",n[t].children[0].tabIndex="0",n[t].children[0].focus()},onTransitionEnd(){this.$refs.itemsContainer&&(i.DomHandler.addClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transition="")},onTouchStart(e){let t=e.changedTouches[0];this.startPos={x:t.pageX,y:t.pageY}},onTouchMove(e){e.cancelable&&e.preventDefault()},onTouchEnd(e){let t=e.changedTouches[0];this.isVertical?this.changePageOnTouch(e,t.pageY-this.startPos.y):this.changePageOnTouch(e,t.pageX-this.startPos.x)},changePageOnTouch(e,t){t<0?this.navForward(e):this.navBackward(e)},getTotalPageNumber(){return this.value.length>this.d_numVisible?this.value.length-this.d_numVisible+1:0},createStyle(){this.thumbnailsStyle||(this.thumbnailsStyle=document.createElement("style"),this.thumbnailsStyle.type="text/css",document.body.appendChild(this.thumbnailsStyle));let e=`\n                #${this.containerId} .p-galleria-thumbnail-item {\n                    flex: 1 0 ${100/this.d_numVisible}%\n                }\n            `;if(this.responsiveOptions){this.sortedResponsiveOptions=[...this.responsiveOptions],this.sortedResponsiveOptions.sort(((e,t)=>{const i=e.breakpoint,n=t.breakpoint;let a=null;return a=null==i&&null!=n?-1:null!=i&&null==n?1:null==i&&null==n?0:"string"==typeof i&&"string"==typeof n?i.localeCompare(n,void 0,{numeric:!0}):i<n?-1:i>n?1:0,-1*a}));for(let t=0;t<this.sortedResponsiveOptions.length;t++){let i=this.sortedResponsiveOptions[t];e+=`\n                        @media screen and (max-width: ${i.breakpoint}) {\n                            #${this.containerId} .p-galleria-thumbnail-item {\n                                flex: 1 0 ${100/i.numVisible}%\n                            }\n                        }\n                    `}}this.thumbnailsStyle.innerHTML=e},calculatePosition(){if(this.$refs.itemsContainer&&this.sortedResponsiveOptions){let e=window.innerWidth,t={numVisible:this.numVisible};for(let i=0;i<this.sortedResponsiveOptions.length;i++){let n=this.sortedResponsiveOptions[i];parseInt(n.breakpoint,10)>=e&&(t=n)}this.d_numVisible!==t.numVisible&&(this.d_numVisible=t.numVisible)}},bindDocumentListeners(){this.documentResizeListener||(this.documentResizeListener=()=>{this.calculatePosition()},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentListeners(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)},isNavBackwardDisabled(){return!this.circular&&0===this.d_activeIndex||this.value.length<=this.d_numVisible},isNavForwardDisabled(){return!this.circular&&this.d_activeIndex===this.value.length-1||this.value.length<=this.d_numVisible},firstItemAciveIndex(){return-1*this.totalShiftedItems},lastItemActiveIndex(){return this.firstItemAciveIndex()+this.d_numVisible-1},isItemActive(e){return this.firstItemAciveIndex()<=e&&this.lastItemActiveIndex()>=e},ariaPageLabel(e){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.pageLabel.replace(/{page}/g,e):void 0}},computed:{navBackwardClass(){return["p-galleria-thumbnail-prev p-link",{"p-disabled":this.isNavBackwardDisabled()}]},navForwardClass(){return["p-galleria-thumbnail-next p-link",{"p-disabled":this.isNavForwardDisabled()}]},ariaPrevButtonLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.prevPageLabel:void 0},ariaNextButtonLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.nextPageLabel:void 0}},components:{ChevronLeftIcon:v.default,ChevronRightIcon:g.default,ChevronUpIcon:b.default,ChevronDownIcon:f.default},directives:{ripple:u.default}};const D={class:"p-galleria-thumbnail-wrapper"},_={class:"p-galleria-thumbnail-container"},A=["disabled","aria-label"],P=["aria-selected","aria-controls","onKeydown"],E=["tabindex","aria-label","aria-current","onClick"],T=["disabled","aria-label"];N.render=function(e,t,i,n,a,l){const s=o.resolveDirective("ripple");return o.openBlock(),o.createElementBlock("div",D,[o.createElementVNode("div",_,[i.showThumbnailNavigators?o.withDirectives((o.openBlock(),o.createElementBlock("button",o.mergeProps({key:0,class:l.navBackwardClass,disabled:l.isNavBackwardDisabled(),type:"button","aria-label":l.ariaPrevButtonLabel,onClick:t[0]||(t[0]=e=>l.navBackward(e))},i.prevButtonProps),[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.templates.previousthumbnailicon||(i.isVertical?"ChevronUpIcon":"ChevronLeftIcon")),{class:"p-galleria-thumbnail-prev-icon"}))],16,A)),[[s]]):o.createCommentVNode("",!0),o.createElementVNode("div",{class:"p-galleria-thumbnail-items-container",style:o.normalizeStyle({height:i.isVertical?i.contentHeight:""})},[o.createElementVNode("div",{ref:"itemsContainer",class:"p-galleria-thumbnail-items",role:"tablist",onTransitionend:t[1]||(t[1]=(...e)=>l.onTransitionEnd&&l.onTransitionEnd(...e)),onTouchstart:t[2]||(t[2]=e=>l.onTouchStart(e)),onTouchmove:t[3]||(t[3]=e=>l.onTouchMove(e)),onTouchend:t[4]||(t[4]=e=>l.onTouchEnd(e))},[(o.openBlock(!0),o.createElementBlock(o.Fragment,null,o.renderList(i.value,((e,t)=>(o.openBlock(),o.createElementBlock("div",{key:`p-galleria-thumbnail-item-${t}`,class:o.normalizeClass(["p-galleria-thumbnail-item",{"p-galleria-thumbnail-item-current":i.activeIndex===t,"p-galleria-thumbnail-item-active":l.isItemActive(t),"p-galleria-thumbnail-item-start":l.firstItemAciveIndex()===t,"p-galleria-thumbnail-item-end":l.lastItemActiveIndex()===t}]),role:"tab","aria-selected":i.activeIndex===t,"aria-controls":i.containerId+"_item_"+t,onKeydown:e=>l.onThumbnailKeydown(e,t)},[o.createElementVNode("div",{class:"p-galleria-thumbnail-item-content",tabindex:i.activeIndex===t?"0":"-1","aria-label":l.ariaPageLabel(t+1),"aria-current":i.activeIndex===t?"page":void 0,onClick:e=>l.onItemClick(t)},[i.templates.thumbnail?(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.templates.thumbnail),{key:0,item:e},null,8,["item"])):o.createCommentVNode("",!0)],8,E)],42,P)))),128))],544)],4),i.showThumbnailNavigators?o.withDirectives((o.openBlock(),o.createElementBlock("button",o.mergeProps({key:1,class:l.navForwardClass,disabled:l.isNavForwardDisabled(),type:"button","aria-label":l.ariaNextButtonLabel,onClick:t[5]||(t[5]=e=>l.navForward(e))},i.nextButtonProps),[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(i.templates.nextthumbnailicon||(i.isVertical?"ChevronDownIcon":"ChevronRightIcon")),{class:"p-galleria-thumbnail-prev-icon"}))],16,T)),[[s]]):o.createCommentVNode("",!0)])])};var L={name:"GalleriaContent",inheritAttrs:!1,interval:null,emits:["activeitem-change","mask-hide"],data(){return{id:this.$attrs.id||i.UniqueComponentId(),activeIndex:this.$attrs.activeIndex,numVisible:this.$attrs.numVisible,slideShowActive:!1}},watch:{"$attrs.value":function(e){e&&e.length<this.numVisible&&(this.numVisible=e.length)},"$attrs.activeIndex":function(e){this.activeIndex=e},"$attrs.numVisible":function(e){this.numVisible=e},"$attrs.autoPlay":function(e){e?this.startSlideShow():this.stopSlideShow()}},updated(){this.$emit("activeitem-change",this.activeIndex)},beforeUnmount(){this.slideShowActive&&this.stopSlideShow()},methods:{isAutoPlayActive(){return this.slideShowActive},startSlideShow(){this.interval=setInterval((()=>{let e=this.$attrs.circular&&this.$attrs.value.length-1===this.activeIndex?0:this.activeIndex+1;this.activeIndex=e}),this.$attrs.transitionInterval),this.slideShowActive=!0},stopSlideShow(){this.interval&&clearInterval(this.interval),this.slideShowActive=!1},getPositionClass(e,t){const i=["top","left","bottom","right"].find((e=>e===t));return i?`${e}-${i}`:""},isVertical(){return"left"===this.$attrs.thumbnailsPosition||"right"===this.$attrs.thumbnailsPosition}},computed:{galleriaClass(){const e=this.$attrs.showThumbnails&&this.getPositionClass("p-galleria-thumbnails",this.$attrs.thumbnailsPosition),t=this.$attrs.showIndicators&&this.getPositionClass("p-galleria-indicators",this.$attrs.indicatorsPosition);return["p-galleria p-component",{"p-galleria-fullscreen":this.$attrs.fullScreen,"p-galleria-indicator-onitem":this.$attrs.showIndicatorsOnItem,"p-galleria-item-nav-onhover":this.$attrs.showItemNavigatorsOnHover&&!this.$attrs.fullScreen},e,t,this.$attrs.containerClass]},closeAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0}},components:{GalleriaItem:I,GalleriaThumbnails:N,TimesIcon:p.default},directives:{ripple:u.default}};const H=["id"],O=["aria-label"],F={key:1,class:"p-galleria-header"},R=["aria-live"],z={key:2,class:"p-galleria-footer"};L.render=function(e,t,i,n,a,l){const s=o.resolveComponent("GalleriaItem"),r=o.resolveComponent("GalleriaThumbnails"),c=o.resolveDirective("ripple");return e.$attrs.value&&e.$attrs.value.length>0?(o.openBlock(),o.createElementBlock("div",o.mergeProps({key:0,id:a.id,class:l.galleriaClass,style:e.$attrs.containerStyle},e.$attrs.containerProps),[e.$attrs.fullScreen?o.withDirectives((o.openBlock(),o.createElementBlock("button",{key:0,autofocus:"",type:"button",class:"p-galleria-close p-link","aria-label":l.closeAriaLabel,onClick:t[0]||(t[0]=t=>e.$emit("mask-hide"))},[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.$attrs.templates.closeicon||"TimesIcon"),{class:"p-galleria-close-icon"}))],8,O)),[[c]]):o.createCommentVNode("",!0),e.$attrs.templates&&e.$attrs.templates.header?(o.openBlock(),o.createElementBlock("div",F,[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.$attrs.templates.header)))])):o.createCommentVNode("",!0),o.createElementVNode("div",{class:"p-galleria-content","aria-live":e.$attrs.autoPlay?"polite":"off"},[o.createVNode(s,{id:a.id,activeIndex:a.activeIndex,"onUpdate:activeIndex":t[1]||(t[1]=e=>a.activeIndex=e),slideShowActive:a.slideShowActive,"onUpdate:slideShowActive":t[2]||(t[2]=e=>a.slideShowActive=e),value:e.$attrs.value,circular:e.$attrs.circular,templates:e.$attrs.templates,showIndicators:e.$attrs.showIndicators,changeItemOnIndicatorHover:e.$attrs.changeItemOnIndicatorHover,showItemNavigators:e.$attrs.showItemNavigators,autoPlay:e.$attrs.autoPlay,onStartSlideshow:l.startSlideShow,onStopSlideshow:l.stopSlideShow},null,8,["id","activeIndex","slideShowActive","value","circular","templates","showIndicators","changeItemOnIndicatorHover","showItemNavigators","autoPlay","onStartSlideshow","onStopSlideshow"]),e.$attrs.showThumbnails?(o.openBlock(),o.createBlock(r,{key:0,activeIndex:a.activeIndex,"onUpdate:activeIndex":t[3]||(t[3]=e=>a.activeIndex=e),slideShowActive:a.slideShowActive,"onUpdate:slideShowActive":t[4]||(t[4]=e=>a.slideShowActive=e),containerId:a.id,value:e.$attrs.value,templates:e.$attrs.templates,numVisible:a.numVisible,responsiveOptions:e.$attrs.responsiveOptions,circular:e.$attrs.circular,isVertical:l.isVertical(),contentHeight:e.$attrs.verticalThumbnailViewPortHeight,showThumbnailNavigators:e.$attrs.showThumbnailNavigators,prevButtonProps:e.$attrs.prevButtonProps,nextButtonProps:e.$attrs.nextButtonProps,onStopSlideshow:l.stopSlideShow},null,8,["activeIndex","slideShowActive","containerId","value","templates","numVisible","responsiveOptions","circular","isVertical","contentHeight","showThumbnailNavigators","prevButtonProps","nextButtonProps","onStopSlideshow"])):o.createCommentVNode("",!0)],8,R),e.$attrs.templates&&e.$attrs.templates.footer?(o.openBlock(),o.createElementBlock("div",z,[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.$attrs.templates.footer)))])):o.createCommentVNode("",!0)],16,H)):o.createCommentVNode("",!0)};var K={name:"Galleria",inheritAttrs:!1,emits:["update:activeIndex","update:visible"],props:{id:{type:String,default:null},value:{type:Array,default:null},activeIndex:{type:Number,default:0},fullScreen:{type:Boolean,default:!1},visible:{type:Boolean,default:!1},numVisible:{type:Number,default:3},responsiveOptions:{type:Array,default:null},showItemNavigators:{type:Boolean,default:!1},showThumbnailNavigators:{type:Boolean,default:!0},showItemNavigatorsOnHover:{type:Boolean,default:!1},changeItemOnIndicatorHover:{type:Boolean,default:!1},circular:{type:Boolean,default:!1},autoPlay:{type:Boolean,default:!1},transitionInterval:{type:Number,default:4e3},showThumbnails:{type:Boolean,default:!0},thumbnailsPosition:{type:String,default:"bottom"},verticalThumbnailViewPortHeight:{type:String,default:"300px"},showIndicators:{type:Boolean,default:!1},showIndicatorsOnItem:{type:Boolean,default:!1},indicatorsPosition:{type:String,default:"bottom"},baseZIndex:{type:Number,default:0},maskClass:{type:String,default:null},containerStyle:{type:null,default:null},containerClass:{type:null,default:null},containerProps:{type:null,default:null},prevButtonProps:{type:null,default:null},nextButtonProps:{type:null,default:null}},container:null,mask:null,data(){return{containerVisible:this.visible}},updated(){this.fullScreen&&this.visible&&(this.containerVisible=this.visible)},beforeUnmount(){this.fullScreen&&i.DomHandler.removeClass(document.body,"p-overflow-hidden"),this.mask=null,this.container&&(i.ZIndexUtils.clear(this.container),this.container=null)},methods:{onBeforeEnter(e){i.ZIndexUtils.set("modal",e,this.baseZIndex||this.$primevue.config.zIndex.modal)},onEnter(e){this.mask.style.zIndex=String(parseInt(e.style.zIndex,10)-1),i.DomHandler.addClass(document.body,"p-overflow-hidden"),this.focus()},onBeforeLeave(){i.DomHandler.addClass(this.mask,"p-component-overlay-leave")},onAfterLeave(e){i.ZIndexUtils.clear(e),this.containerVisible=!1,i.DomHandler.removeClass(document.body,"p-overflow-hidden")},onActiveItemChange(e){this.activeIndex!==e&&this.$emit("update:activeIndex",e)},maskHide(){this.$emit("update:visible",!1)},containerRef(e){this.container=e},maskRef(e){this.mask=e},focus(){let e=this.container.$el.querySelector("[autofocus]");e&&e.focus()}},computed:{maskContentClass(){return["p-galleria-mask p-component-overlay p-component-overlay-enter",this.maskClass,{"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple}]}},components:{GalleriaContent:L,Portal:m.default},directives:{focustrap:h.default}};const M=["role","aria-modal"];return function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===i&&n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}("\n.p-galleria-content {\n    display: flex;\n    flex-direction: column;\n}\n.p-galleria-item-wrapper {\n    display: flex;\n    flex-direction: column;\n    position: relative;\n}\n.p-galleria-item-container {\n    position: relative;\n    display: flex;\n    height: 100%;\n}\n.p-galleria-item-nav {\n    position: absolute;\n    top: 50%;\n    margin-top: -0.5rem;\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n}\n.p-galleria-item-prev {\n    left: 0;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n}\n.p-galleria-item-next {\n    right: 0;\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n}\n.p-galleria-item {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 100%;\n    width: 100%;\n}\n.p-galleria-item-nav-onhover .p-galleria-item-nav {\n    pointer-events: none;\n    opacity: 0;\n    transition: opacity 0.2s ease-in-out;\n}\n.p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav {\n    pointer-events: all;\n    opacity: 1;\n}\n.p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav.p-disabled {\n    pointer-events: none;\n}\n.p-galleria-caption {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n}\n\n/* Thumbnails */\n.p-galleria-thumbnail-wrapper {\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n    flex-shrink: 0;\n}\n.p-galleria-thumbnail-prev,\n.p-galleria-thumbnail-next {\n    align-self: center;\n    flex: 0 0 auto;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-galleria-thumbnail-prev span,\n.p-galleria-thumbnail-next span {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n.p-galleria-thumbnail-container {\n    display: flex;\n    flex-direction: row;\n}\n.p-galleria-thumbnail-items-container {\n    overflow: hidden;\n    width: 100%;\n}\n.p-galleria-thumbnail-items {\n    display: flex;\n}\n.p-galleria-thumbnail-item {\n    overflow: auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    opacity: 0.5;\n}\n.p-galleria-thumbnail-item:hover {\n    opacity: 1;\n    transition: opacity 0.3s;\n}\n.p-galleria-thumbnail-item-current {\n    opacity: 1;\n}\n\n/* Positions */\n/* Thumbnails */\n.p-galleria-thumbnails-left .p-galleria-content,\n.p-galleria-thumbnails-right .p-galleria-content {\n    flex-direction: row;\n}\n.p-galleria-thumbnails-left .p-galleria-item-wrapper,\n.p-galleria-thumbnails-right .p-galleria-item-wrapper {\n    flex-direction: row;\n}\n.p-galleria-thumbnails-left .p-galleria-item-wrapper,\n.p-galleria-thumbnails-top .p-galleria-item-wrapper {\n    order: 2;\n}\n.p-galleria-thumbnails-left .p-galleria-thumbnail-wrapper,\n.p-galleria-thumbnails-top .p-galleria-thumbnail-wrapper {\n    order: 1;\n}\n.p-galleria-thumbnails-left .p-galleria-thumbnail-container,\n.p-galleria-thumbnails-right .p-galleria-thumbnail-container {\n    flex-direction: column;\n    flex-grow: 1;\n}\n.p-galleria-thumbnails-left .p-galleria-thumbnail-items,\n.p-galleria-thumbnails-right .p-galleria-thumbnail-items {\n    flex-direction: column;\n    height: 100%;\n}\n\n/* Indicators */\n.p-galleria-indicators {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.p-galleria-indicator > button {\n    display: inline-flex;\n    align-items: center;\n}\n.p-galleria-indicators-left .p-galleria-item-wrapper,\n.p-galleria-indicators-right .p-galleria-item-wrapper {\n    flex-direction: row;\n    align-items: center;\n}\n.p-galleria-indicators-left .p-galleria-item-container,\n.p-galleria-indicators-top .p-galleria-item-container {\n    order: 2;\n}\n.p-galleria-indicators-left .p-galleria-indicators,\n.p-galleria-indicators-top .p-galleria-indicators {\n    order: 1;\n}\n.p-galleria-indicators-left .p-galleria-indicators,\n.p-galleria-indicators-right .p-galleria-indicators {\n    flex-direction: column;\n}\n.p-galleria-indicator-onitem .p-galleria-indicators {\n    position: absolute;\n    display: flex;\n}\n.p-galleria-indicator-onitem.p-galleria-indicators-top .p-galleria-indicators {\n    top: 0;\n    left: 0;\n    width: 100%;\n    align-items: flex-start;\n}\n.p-galleria-indicator-onitem.p-galleria-indicators-right .p-galleria-indicators {\n    right: 0;\n    top: 0;\n    height: 100%;\n    align-items: flex-end;\n}\n.p-galleria-indicator-onitem.p-galleria-indicators-bottom .p-galleria-indicators {\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    align-items: flex-end;\n}\n.p-galleria-indicator-onitem.p-galleria-indicators-left .p-galleria-indicators {\n    left: 0;\n    top: 0;\n    height: 100%;\n    align-items: flex-start;\n}\n\n/* FullScreen */\n.p-galleria-mask {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.p-galleria-close {\n    position: absolute;\n    top: 0;\n    right: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n}\n.p-galleria-mask .p-galleria-item-nav {\n    position: fixed;\n    top: 50%;\n    margin-top: -0.5rem;\n}\n\n/* Animation */\n.p-galleria-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-galleria-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-galleria-enter-from,\n.p-galleria-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n.p-galleria-enter-active .p-galleria-item-nav {\n    opacity: 0;\n}\n\n/* Keyboard Support */\n.p-items-hidden .p-galleria-thumbnail-item {\n    visibility: hidden;\n}\n.p-items-hidden .p-galleria-thumbnail-item.p-galleria-thumbnail-item-active {\n    visibility: visible;\n}\n"),K.render=function(e,t,i,n,a,l){const s=o.resolveComponent("GalleriaContent"),r=o.resolveComponent("Portal"),c=o.resolveDirective("focustrap");return i.fullScreen?(o.openBlock(),o.createBlock(r,{key:0},{default:o.withCtx((()=>[a.containerVisible?(o.openBlock(),o.createElementBlock("div",{key:0,ref:l.maskRef,class:o.normalizeClass(l.maskContentClass),role:i.fullScreen?"dialog":"region","aria-modal":i.fullScreen?"true":void 0},[o.createVNode(o.Transition,{name:"p-galleria",onBeforeEnter:l.onBeforeEnter,onEnter:l.onEnter,onBeforeLeave:l.onBeforeLeave,onAfterLeave:l.onAfterLeave,appear:""},{default:o.withCtx((()=>[i.visible?o.withDirectives((o.openBlock(),o.createBlock(s,o.mergeProps({key:0,ref:l.containerRef,onMaskHide:l.maskHide,templates:e.$slots,onActiveitemChange:l.onActiveItemChange},e.$props),null,16,["onMaskHide","templates","onActiveitemChange"])),[[c]]):o.createCommentVNode("",!0)])),_:1},8,["onBeforeEnter","onEnter","onBeforeLeave","onAfterLeave"])],10,M)):o.createCommentVNode("",!0)])),_:1})):(o.openBlock(),o.createBlock(s,o.mergeProps({key:1,templates:e.$slots,onActiveitemChange:l.onActiveItemChange},e.$props),null,16,["templates","onActiveitemChange"]))},K}(primevue.focustrap,primevue.portal,primevue.utils,primevue.icons.times,primevue.ripple,primevue.icons.chevronleft,primevue.icons.chevronright,Vue,primevue.icons.chevrondown,primevue.icons.chevronup);
+this.primevue=this.primevue||{},this.primevue.galleria=function(e,t,i,n,a,l,s,o,r,c,d){"use strict";function m(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var p=m(e),h=m(t),u=m(i),v=m(a),g=m(l),b=m(s),f=m(o),I=m(c),y=m(d),x={name:"GalleriaItem",extends:p.default,emits:["start-slideshow","stop-slideshow","update:activeIndex"],props:{circular:{type:Boolean,default:!1},activeIndex:{type:Number,default:0},value:{type:Array,default:null},showItemNavigators:{type:Boolean,default:!0},showIndicators:{type:Boolean,default:!0},slideShowActive:{type:Boolean,default:!0},changeItemOnIndicatorHover:{type:Boolean,default:!0},autoPlay:{type:Boolean,default:!1},templates:{type:null,default:null},id:{type:String,default:null}},mounted(){this.autoPlay&&this.$emit("start-slideshow")},methods:{next(){let e=this.activeIndex+1,t=this.circular&&this.value.length-1===this.activeIndex?0:e;this.$emit("update:activeIndex",t)},prev(){let e=0!==this.activeIndex?this.activeIndex-1:0,t=this.circular&&0===this.activeIndex?this.value.length-1:e;this.$emit("update:activeIndex",t)},stopSlideShow(){this.slideShowActive&&this.stopSlideShow&&this.$emit("stop-slideshow")},navBackward(e){this.stopSlideShow(),this.prev(),e&&e.cancelable&&e.preventDefault()},navForward(e){this.stopSlideShow(),this.next(),e&&e.cancelable&&e.preventDefault()},onIndicatorClick(e){this.stopSlideShow(),this.$emit("update:activeIndex",e)},onIndicatorMouseEnter(e){this.changeItemOnIndicatorHover&&(this.stopSlideShow(),this.$emit("update:activeIndex",e))},onIndicatorKeyDown(e,t){switch(e.code){case"Enter":case"Space":this.stopSlideShow(),this.$emit("update:activeIndex",t),e.preventDefault();break;case"ArrowDown":case"ArrowUp":e.preventDefault()}},isIndicatorItemActive(e){return this.activeIndex===e},isNavBackwardDisabled(){return!this.circular&&0===this.activeIndex},isNavForwardDisabled(){return!this.circular&&this.activeIndex===this.value.length-1},ariaSlideNumber(e){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.slideNumber.replace(/{slideNumber}/g,e):void 0},ariaPageLabel(e){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.pageLabel.replace(/{page}/g,e):void 0}},computed:{activeItem(){return this.value[this.activeIndex]},navBackwardClass(){return["p-galleria-item-prev p-galleria-item-nav p-link",{"p-disabled":this.isNavBackwardDisabled()}]},navForwardClass(){return["p-galleria-item-next p-galleria-item-nav p-link",{"p-disabled":this.isNavForwardDisabled()}]},ariaSlideLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.slide:void 0}},components:{ChevronLeftIcon:b.default,ChevronRightIcon:f.default},directives:{ripple:g.default}};const w=["disabled"],k=["id","aria-label","aria-roledescription"],B=["disabled"],S=["aria-label","aria-selected","aria-controls","onClick","onMouseenter","onKeydown"],C={key:0,type:"button",tabindex:"-1",class:"p-link"};x.render=function(e,t,i,n,a,l){const s=r.resolveDirective("ripple");return r.openBlock(),r.createElementBlock("div",r.mergeProps({class:"p-galleria-item-wrapper"},e.ptm("itemWrapper")),[r.createElementVNode("div",r.mergeProps({class:"p-galleria-item-container"},e.ptm("itemContainer")),[i.showItemNavigators?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:0,type:"button",class:l.navBackwardClass,onClick:t[0]||(t[0]=e=>l.navBackward(e)),disabled:l.isNavBackwardDisabled()},e.ptm("previousItemButton")),[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.templates.previousitemicon||"ChevronLeftIcon"),r.mergeProps({class:"p-galleria-item-prev-icon"},e.ptm("previousItemIcon")),null,16))],16,w)),[[s]]):r.createCommentVNode("",!0),r.createElementVNode("div",r.mergeProps({id:i.id+"_item_"+i.activeIndex,class:"p-galleria-item",role:"group","aria-label":l.ariaSlideNumber(i.activeIndex+1),"aria-roledescription":l.ariaSlideLabel},e.ptm("item")),[i.templates.item?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.templates.item),{key:0,item:l.activeItem},null,8,["item"])):r.createCommentVNode("",!0)],16,k),i.showItemNavigators?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:1,type:"button",class:l.navForwardClass,onClick:t[1]||(t[1]=e=>l.navForward(e)),disabled:l.isNavForwardDisabled()},e.ptm("nextItemButton")),[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.templates.nextitemicon||"ChevronRightIcon"),r.mergeProps({class:"p-galleria-item-next-icon"},e.ptm("nextItemIcon")),null,16))],16,B)),[[s]]):r.createCommentVNode("",!0),i.templates.caption?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:2,class:"p-galleria-caption"},e.ptm("caption")),[i.templates.caption?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.templates.caption),{key:0,item:l.activeItem},null,8,["item"])):r.createCommentVNode("",!0)],16)):r.createCommentVNode("",!0)],16),i.showIndicators?(r.openBlock(),r.createElementBlock("ul",r.mergeProps({key:0,class:"p-galleria-indicators p-reset"},e.ptm("indicators")),[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(i.value,((t,n)=>(r.openBlock(),r.createElementBlock("li",r.mergeProps({key:`p-galleria-indicator-${n}`,class:["p-galleria-indicator",{"p-highlight":l.isIndicatorItemActive(n)}],tabindex:"0","aria-label":l.ariaPageLabel(n+1),"aria-selected":i.activeIndex===n,"aria-controls":i.id+"_item_"+n,onClick:e=>l.onIndicatorClick(n),onMouseenter:e=>l.onIndicatorMouseEnter(n),onKeydown:e=>l.onIndicatorKeyDown(e,n)},e.ptm("indicator")),[i.templates.indicator?r.createCommentVNode("",!0):(r.openBlock(),r.createElementBlock("button",C)),i.templates.indicator?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.templates.indicator),{key:1,index:n},null,8,["index"])):r.createCommentVNode("",!0)],16,S)))),128))],16)):r.createCommentVNode("",!0)],16)};var $={name:"GalleriaThumbnails",extends:p.default,emits:["stop-slideshow","update:activeIndex"],props:{containerId:{type:String,default:null},value:{type:Array,default:null},numVisible:{type:Number,default:3},activeIndex:{type:Number,default:0},isVertical:{type:Boolean,default:!1},slideShowActive:{type:Boolean,default:!1},circular:{type:Boolean,default:!1},responsiveOptions:{type:Array,default:null},contentHeight:{type:String,default:"300px"},showThumbnailNavigators:{type:Boolean,default:!0},templates:{type:null,default:null},prevButtonProps:{type:null,default:null},nextButtonProps:{type:null,default:null}},startPos:null,thumbnailsStyle:null,sortedResponsiveOptions:null,data(){return{d_numVisible:this.numVisible,d_oldNumVisible:this.numVisible,d_activeIndex:this.activeIndex,d_oldActiveItemIndex:this.activeIndex,totalShiftedItems:0,page:0}},watch:{numVisible(e,t){this.d_numVisible=e,this.d_oldNumVisible=t},activeIndex(e,t){this.d_activeIndex=e,this.d_oldActiveItemIndex=t}},mounted(){this.createStyle(),this.calculatePosition(),this.responsiveOptions&&this.bindDocumentListeners()},updated(){let e=this.totalShiftedItems;this.d_oldNumVisible===this.d_numVisible&&this.d_oldActiveItemIndex===this.d_activeIndex||(e=this.d_activeIndex<=this.getMedianItemIndex()?0:this.value.length-this.d_numVisible+this.getMedianItemIndex()<this.d_activeIndex?this.d_numVisible-this.value.length:this.value.length-this.d_numVisible<this.d_activeIndex&&this.d_numVisible%2==0?-1*this.d_activeIndex+this.getMedianItemIndex()+1:-1*this.d_activeIndex+this.getMedianItemIndex(),e!==this.totalShiftedItems&&(this.totalShiftedItems=e),this.$refs.itemsContainer.style.transform=this.isVertical?`translate3d(0, ${e*(100/this.d_numVisible)}%, 0)`:`translate3d(${e*(100/this.d_numVisible)}%, 0, 0)`,this.d_oldActiveItemIndex!==this.d_activeIndex&&(n.DomHandler.removeClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transition="transform 500ms ease 0s"),this.d_oldActiveItemIndex=this.d_activeIndex,this.d_oldNumVisible=this.d_numVisible)},beforeUnmount(){this.responsiveOptions&&this.unbindDocumentListeners(),this.thumbnailsStyle&&this.thumbnailsStyle.parentNode.removeChild(this.thumbnailsStyle)},methods:{step(e){let t=this.totalShiftedItems+e;e<0&&-1*t+this.d_numVisible>this.value.length-1?t=this.d_numVisible-this.value.length:e>0&&t>0&&(t=0),this.circular&&(e<0&&this.value.length-1===this.d_activeIndex?t=0:e>0&&0===this.d_activeIndex&&(t=this.d_numVisible-this.value.length)),this.$refs.itemsContainer&&(n.DomHandler.removeClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transform=this.isVertical?`translate3d(0, ${t*(100/this.d_numVisible)}%, 0)`:`translate3d(${t*(100/this.d_numVisible)}%, 0, 0)`,this.$refs.itemsContainer.style.transition="transform 500ms ease 0s"),this.totalShiftedItems=t},stopSlideShow(){this.slideShowActive&&this.stopSlideShow&&this.$emit("stop-slideshow")},getMedianItemIndex(){let e=Math.floor(this.d_numVisible/2);return this.d_numVisible%2?e:e-1},navBackward(e){this.stopSlideShow();let t=0!==this.d_activeIndex?this.d_activeIndex-1:0,i=t+this.totalShiftedItems;this.d_numVisible-i-1>this.getMedianItemIndex()&&(-1*this.totalShiftedItems!=0||this.circular)&&this.step(1);let n=this.circular&&0===this.d_activeIndex?this.value.length-1:t;this.$emit("update:activeIndex",n),e.cancelable&&e.preventDefault()},navForward(e){this.stopSlideShow();let t=this.d_activeIndex===this.value.length-1?this.value.length-1:this.d_activeIndex+1;t+this.totalShiftedItems>this.getMedianItemIndex()&&(-1*this.totalShiftedItems<this.getTotalPageNumber()-1||this.circular)&&this.step(-1);let i=this.circular&&this.value.length-1===this.d_activeIndex?0:t;this.$emit("update:activeIndex",i),e.cancelable&&e.preventDefault()},onItemClick(e){this.stopSlideShow();let t=e;if(t!==this.d_activeIndex){const e=t+this.totalShiftedItems;let i=0;t<this.d_activeIndex?(i=this.d_numVisible-e-1-this.getMedianItemIndex(),i>0&&-1*this.totalShiftedItems!=0&&this.step(i)):(i=this.getMedianItemIndex()-e,i<0&&-1*this.totalShiftedItems<this.getTotalPageNumber()-1&&this.step(i)),this.$emit("update:activeIndex",t)}},onThumbnailKeydown(e,t){switch("Enter"!==e.code&&"Space"!==e.code||(this.onItemClick(t),e.preventDefault()),e.code){case"ArrowRight":this.onRightKey();break;case"ArrowLeft":this.onLeftKey();break;case"Home":this.onHomeKey(),e.preventDefault();break;case"End":this.onEndKey(),e.preventDefault();break;case"ArrowUp":case"ArrowDown":e.preventDefault();break;case"Tab":this.onTabKey()}},onRightKey(){const e=n.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item"),t=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(t,t+1===e.length?e.length-1:t+1)},onLeftKey(){const e=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(e,e-1<=0?0:e-1)},onHomeKey(){const e=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(e,0)},onEndKey(){const e=n.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item"),t=this.findFocusedIndicatorIndex();this.changedFocusedIndicator(t,e.length-1)},onTabKey(){const e=[...n.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item")],t=e.findIndex((e=>n.DomHandler.hasClass(e,"p-galleria-thumbnail-item-current"))),i=n.DomHandler.findSingle(this.$refs.itemsContainer,'.p-galleria-thumbnail-item > [tabindex="0"'),a=e.findIndex((e=>e===i.parentElement));e[a].children[0].tabIndex="-1",e[t].children[0].tabIndex="0"},findFocusedIndicatorIndex(){const e=[...n.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item")],t=n.DomHandler.findSingle(this.$refs.itemsContainer,'.p-galleria-thumbnail-item > [tabindex="0"]');return e.findIndex((e=>e===t.parentElement))},changedFocusedIndicator(e,t){const i=n.DomHandler.find(this.$refs.itemsContainer,".p-galleria-thumbnail-item");i[e].children[0].tabIndex="-1",i[t].children[0].tabIndex="0",i[t].children[0].focus()},onTransitionEnd(){this.$refs.itemsContainer&&(n.DomHandler.addClass(this.$refs.itemsContainer,"p-items-hidden"),this.$refs.itemsContainer.style.transition="")},onTouchStart(e){let t=e.changedTouches[0];this.startPos={x:t.pageX,y:t.pageY}},onTouchMove(e){e.cancelable&&e.preventDefault()},onTouchEnd(e){let t=e.changedTouches[0];this.isVertical?this.changePageOnTouch(e,t.pageY-this.startPos.y):this.changePageOnTouch(e,t.pageX-this.startPos.x)},changePageOnTouch(e,t){t<0?this.navForward(e):this.navBackward(e)},getTotalPageNumber(){return this.value.length>this.d_numVisible?this.value.length-this.d_numVisible+1:0},createStyle(){this.thumbnailsStyle||(this.thumbnailsStyle=document.createElement("style"),this.thumbnailsStyle.type="text/css",document.body.appendChild(this.thumbnailsStyle));let e=`\n                #${this.containerId} .p-galleria-thumbnail-item {\n                    flex: 1 0 ${100/this.d_numVisible}%\n                }\n            `;if(this.responsiveOptions){this.sortedResponsiveOptions=[...this.responsiveOptions],this.sortedResponsiveOptions.sort(((e,t)=>{const i=e.breakpoint,n=t.breakpoint;let a=null;return a=null==i&&null!=n?-1:null!=i&&null==n?1:null==i&&null==n?0:"string"==typeof i&&"string"==typeof n?i.localeCompare(n,void 0,{numeric:!0}):i<n?-1:i>n?1:0,-1*a}));for(let t=0;t<this.sortedResponsiveOptions.length;t++){let i=this.sortedResponsiveOptions[t];e+=`\n                        @media screen and (max-width: ${i.breakpoint}) {\n                            #${this.containerId} .p-galleria-thumbnail-item {\n                                flex: 1 0 ${100/i.numVisible}%\n                            }\n                        }\n                    `}}this.thumbnailsStyle.innerHTML=e},calculatePosition(){if(this.$refs.itemsContainer&&this.sortedResponsiveOptions){let e=window.innerWidth,t={numVisible:this.numVisible};for(let i=0;i<this.sortedResponsiveOptions.length;i++){let n=this.sortedResponsiveOptions[i];parseInt(n.breakpoint,10)>=e&&(t=n)}this.d_numVisible!==t.numVisible&&(this.d_numVisible=t.numVisible)}},bindDocumentListeners(){this.documentResizeListener||(this.documentResizeListener=()=>{this.calculatePosition()},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentListeners(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)},isNavBackwardDisabled(){return!this.circular&&0===this.d_activeIndex||this.value.length<=this.d_numVisible},isNavForwardDisabled(){return!this.circular&&this.d_activeIndex===this.value.length-1||this.value.length<=this.d_numVisible},firstItemAciveIndex(){return-1*this.totalShiftedItems},lastItemActiveIndex(){return this.firstItemAciveIndex()+this.d_numVisible-1},isItemActive(e){return this.firstItemAciveIndex()<=e&&this.lastItemActiveIndex()>=e},ariaPageLabel(e){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.pageLabel.replace(/{page}/g,e):void 0}},computed:{navBackwardClass(){return["p-galleria-thumbnail-prev p-link",{"p-disabled":this.isNavBackwardDisabled()}]},navForwardClass(){return["p-galleria-thumbnail-next p-link",{"p-disabled":this.isNavForwardDisabled()}]},ariaPrevButtonLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.prevPageLabel:void 0},ariaNextButtonLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.nextPageLabel:void 0}},components:{ChevronLeftIcon:b.default,ChevronRightIcon:f.default,ChevronUpIcon:y.default,ChevronDownIcon:I.default},directives:{ripple:g.default}};const V=["disabled","aria-label"],P=["aria-selected","aria-controls","onKeydown"],N=["tabindex","aria-label","aria-current","onClick"],D=["disabled","aria-label"];$.render=function(e,t,i,n,a,l){const s=r.resolveDirective("ripple");return r.openBlock(),r.createElementBlock("div",r.mergeProps({class:"p-galleria-thumbnail-wrapper"},e.ptm("thumbnailWrapper")),[r.createElementVNode("div",r.mergeProps({class:"p-galleria-thumbnail-container"},e.ptm("thumbnailContainer")),[i.showThumbnailNavigators?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:0,class:l.navBackwardClass,disabled:l.isNavBackwardDisabled(),type:"button","aria-label":l.ariaPrevButtonLabel,onClick:t[0]||(t[0]=e=>l.navBackward(e))},{...i.prevButtonProps,...e.ptm("previousThumbnailButton")}),[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.templates.previousthumbnailicon||(i.isVertical?"ChevronUpIcon":"ChevronLeftIcon")),r.mergeProps({class:"p-galleria-thumbnail-prev-icon"},e.ptm("previousThumbnailIcon")),null,16))],16,V)),[[s]]):r.createCommentVNode("",!0),r.createElementVNode("div",r.mergeProps({class:"p-galleria-thumbnail-items-container",style:{height:i.isVertical?i.contentHeight:""}},e.ptm("thumbnailItemsContainer")),[r.createElementVNode("div",r.mergeProps({ref:"itemsContainer",class:"p-galleria-thumbnail-items",role:"tablist",onTransitionend:t[1]||(t[1]=(...e)=>l.onTransitionEnd&&l.onTransitionEnd(...e)),onTouchstart:t[2]||(t[2]=e=>l.onTouchStart(e)),onTouchmove:t[3]||(t[3]=e=>l.onTouchMove(e)),onTouchend:t[4]||(t[4]=e=>l.onTouchEnd(e))},e.ptm("thumbnailItems")),[(r.openBlock(!0),r.createElementBlock(r.Fragment,null,r.renderList(i.value,((t,n)=>(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:`p-galleria-thumbnail-item-${n}`,class:["p-galleria-thumbnail-item",{"p-galleria-thumbnail-item-current":i.activeIndex===n,"p-galleria-thumbnail-item-active":l.isItemActive(n),"p-galleria-thumbnail-item-start":l.firstItemAciveIndex()===n,"p-galleria-thumbnail-item-end":l.lastItemActiveIndex()===n}],role:"tab","aria-selected":i.activeIndex===n,"aria-controls":i.containerId+"_item_"+n,onKeydown:e=>l.onThumbnailKeydown(e,n)},e.ptm("thumbnailItem")),[r.createElementVNode("div",r.mergeProps({class:"p-galleria-thumbnail-item-content",tabindex:i.activeIndex===n?"0":"-1","aria-label":l.ariaPageLabel(n+1),"aria-current":i.activeIndex===n?"page":void 0,onClick:e=>l.onItemClick(n)},e.ptm("thumbnailItemContent")),[i.templates.thumbnail?(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.templates.thumbnail),{key:0,item:t},null,8,["item"])):r.createCommentVNode("",!0)],16,N)],16,P)))),128))],16)],16),i.showThumbnailNavigators?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:1,class:l.navForwardClass,disabled:l.isNavForwardDisabled(),type:"button","aria-label":l.ariaNextButtonLabel,onClick:t[5]||(t[5]=e=>l.navForward(e))},{...i.nextButtonProps,...e.ptm("nextThumbnailButton")}),[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(i.templates.nextthumbnailicon||(i.isVertical?"ChevronDownIcon":"ChevronRightIcon")),r.mergeProps({class:"p-galleria-thumbnail-next-icon"},e.ptm("nextThumbnailIcon")),null,16))],16,D)),[[s]]):r.createCommentVNode("",!0)],16)],16)};var _={name:"GalleriaContent",extends:p.default,inheritAttrs:!1,interval:null,emits:["activeitem-change","mask-hide"],data(){return{id:this.$attrs.id||n.UniqueComponentId(),activeIndex:this.$attrs.activeIndex,numVisible:this.$attrs.numVisible,slideShowActive:!1}},watch:{"$attrs.value":function(e){e&&e.length<this.numVisible&&(this.numVisible=e.length)},"$attrs.activeIndex":function(e){this.activeIndex=e},"$attrs.numVisible":function(e){this.numVisible=e},"$attrs.autoPlay":function(e){e?this.startSlideShow():this.stopSlideShow()}},updated(){this.$emit("activeitem-change",this.activeIndex)},beforeUnmount(){this.slideShowActive&&this.stopSlideShow()},methods:{isAutoPlayActive(){return this.slideShowActive},startSlideShow(){this.interval=setInterval((()=>{let e=this.$attrs.circular&&this.$attrs.value.length-1===this.activeIndex?0:this.activeIndex+1;this.activeIndex=e}),this.$attrs.transitionInterval),this.slideShowActive=!0},stopSlideShow(){this.interval&&clearInterval(this.interval),this.slideShowActive=!1},getPositionClass(e,t){const i=["top","left","bottom","right"].find((e=>e===t));return i?`${e}-${i}`:""},isVertical(){return"left"===this.$attrs.thumbnailsPosition||"right"===this.$attrs.thumbnailsPosition}},computed:{galleriaClass(){const e=this.$attrs.showThumbnails&&this.getPositionClass("p-galleria-thumbnails",this.$attrs.thumbnailsPosition),t=this.$attrs.showIndicators&&this.getPositionClass("p-galleria-indicators",this.$attrs.indicatorsPosition);return["p-galleria p-component",{"p-galleria-fullscreen":this.$attrs.fullScreen,"p-galleria-indicator-onitem":this.$attrs.showIndicatorsOnItem,"p-galleria-item-nav-onhover":this.$attrs.showItemNavigatorsOnHover&&!this.$attrs.fullScreen},e,t,this.$attrs.containerClass]},closeAriaLabel(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.close:void 0}},components:{GalleriaItem:x,GalleriaThumbnails:$,TimesIcon:v.default},directives:{ripple:g.default}};const A=["id"],T=["aria-label"],E=["aria-live"];_.render=function(e,t,i,n,a,l){const s=r.resolveComponent("GalleriaItem"),o=r.resolveComponent("GalleriaThumbnails"),c=r.resolveDirective("ripple");return e.$attrs.value&&e.$attrs.value.length>0?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,id:a.id,class:l.galleriaClass,style:e.$attrs.containerStyle},{...e.$attrs.containerProps,...e.ptm("root")}),[e.$attrs.fullScreen?r.withDirectives((r.openBlock(),r.createElementBlock("button",r.mergeProps({key:0,autofocus:"",type:"button",class:"p-galleria-close p-link","aria-label":l.closeAriaLabel,onClick:t[0]||(t[0]=t=>e.$emit("mask-hide"))},e.ptm("closeButton")),[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.$attrs.templates.closeicon||"TimesIcon"),r.mergeProps({class:"p-galleria-close-icon"},e.ptm("closeIcon")),null,16))],16,T)),[[c]]):r.createCommentVNode("",!0),e.$attrs.templates&&e.$attrs.templates.header?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:1,class:"p-galleria-header"},e.ptm("header")),[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.$attrs.templates.header)))],16)):r.createCommentVNode("",!0),r.createElementVNode("div",r.mergeProps({class:"p-galleria-content","aria-live":e.$attrs.autoPlay?"polite":"off"},e.ptm("content")),[r.createVNode(s,{id:a.id,activeIndex:a.activeIndex,"onUpdate:activeIndex":t[1]||(t[1]=e=>a.activeIndex=e),slideShowActive:a.slideShowActive,"onUpdate:slideShowActive":t[2]||(t[2]=e=>a.slideShowActive=e),value:e.$attrs.value,circular:e.$attrs.circular,templates:e.$attrs.templates,showIndicators:e.$attrs.showIndicators,changeItemOnIndicatorHover:e.$attrs.changeItemOnIndicatorHover,showItemNavigators:e.$attrs.showItemNavigators,autoPlay:e.$attrs.autoPlay,onStartSlideshow:l.startSlideShow,onStopSlideshow:l.stopSlideShow,pt:e.pt},null,8,["id","activeIndex","slideShowActive","value","circular","templates","showIndicators","changeItemOnIndicatorHover","showItemNavigators","autoPlay","onStartSlideshow","onStopSlideshow","pt"]),e.$attrs.showThumbnails?(r.openBlock(),r.createBlock(o,{key:0,activeIndex:a.activeIndex,"onUpdate:activeIndex":t[3]||(t[3]=e=>a.activeIndex=e),slideShowActive:a.slideShowActive,"onUpdate:slideShowActive":t[4]||(t[4]=e=>a.slideShowActive=e),containerId:a.id,value:e.$attrs.value,templates:e.$attrs.templates,numVisible:a.numVisible,responsiveOptions:e.$attrs.responsiveOptions,circular:e.$attrs.circular,isVertical:l.isVertical(),contentHeight:e.$attrs.verticalThumbnailViewPortHeight,showThumbnailNavigators:e.$attrs.showThumbnailNavigators,prevButtonProps:e.$attrs.prevButtonProps,nextButtonProps:e.$attrs.nextButtonProps,onStopSlideshow:l.stopSlideShow,pt:e.pt},null,8,["activeIndex","slideShowActive","containerId","value","templates","numVisible","responsiveOptions","circular","isVertical","contentHeight","showThumbnailNavigators","prevButtonProps","nextButtonProps","onStopSlideshow","pt"])):r.createCommentVNode("",!0)],16,E),e.$attrs.templates&&e.$attrs.templates.footer?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:2,class:"p-galleria-footer"},e.ptm("footer")),[(r.openBlock(),r.createBlock(r.resolveDynamicComponent(e.$attrs.templates.footer)))],16)):r.createCommentVNode("",!0)],16,A)):r.createCommentVNode("",!0)};var L={name:"Galleria",extends:p.default,inheritAttrs:!1,emits:["update:activeIndex","update:visible"],props:{id:{type:String,default:null},value:{type:Array,default:null},activeIndex:{type:Number,default:0},fullScreen:{type:Boolean,default:!1},visible:{type:Boolean,default:!1},numVisible:{type:Number,default:3},responsiveOptions:{type:Array,default:null},showItemNavigators:{type:Boolean,default:!1},showThumbnailNavigators:{type:Boolean,default:!0},showItemNavigatorsOnHover:{type:Boolean,default:!1},changeItemOnIndicatorHover:{type:Boolean,default:!1},circular:{type:Boolean,default:!1},autoPlay:{type:Boolean,default:!1},transitionInterval:{type:Number,default:4e3},showThumbnails:{type:Boolean,default:!0},thumbnailsPosition:{type:String,default:"bottom"},verticalThumbnailViewPortHeight:{type:String,default:"300px"},showIndicators:{type:Boolean,default:!1},showIndicatorsOnItem:{type:Boolean,default:!1},indicatorsPosition:{type:String,default:"bottom"},baseZIndex:{type:Number,default:0},maskClass:{type:String,default:null},containerStyle:{type:null,default:null},containerClass:{type:null,default:null},containerProps:{type:null,default:null},prevButtonProps:{type:null,default:null},nextButtonProps:{type:null,default:null}},container:null,mask:null,data(){return{containerVisible:this.visible}},updated(){this.fullScreen&&this.visible&&(this.containerVisible=this.visible)},beforeUnmount(){this.fullScreen&&n.DomHandler.removeClass(document.body,"p-overflow-hidden"),this.mask=null,this.container&&(n.ZIndexUtils.clear(this.container),this.container=null)},methods:{onBeforeEnter(e){n.ZIndexUtils.set("modal",e,this.baseZIndex||this.$primevue.config.zIndex.modal)},onEnter(e){this.mask.style.zIndex=String(parseInt(e.style.zIndex,10)-1),n.DomHandler.addClass(document.body,"p-overflow-hidden"),this.focus()},onBeforeLeave(){n.DomHandler.addClass(this.mask,"p-component-overlay-leave")},onAfterLeave(e){n.ZIndexUtils.clear(e),this.containerVisible=!1,n.DomHandler.removeClass(document.body,"p-overflow-hidden")},onActiveItemChange(e){this.activeIndex!==e&&this.$emit("update:activeIndex",e)},maskHide(){this.$emit("update:visible",!1)},containerRef(e){this.container=e},maskRef(e){this.mask=e},focus(){let e=this.container.$el.querySelector("[autofocus]");e&&e.focus()}},computed:{maskContentClass(){return["p-galleria-mask p-component-overlay p-component-overlay-enter",this.maskClass,{"p-input-filled":"filled"===this.$primevue.config.inputStyle,"p-ripple-disabled":!1===this.$primevue.config.ripple}]}},components:{GalleriaContent:_,Portal:u.default},directives:{focustrap:h.default}};const H=["role","aria-modal"];return function(e,t){void 0===t&&(t={});var i=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],a=document.createElement("style");a.type="text/css","top"===i&&n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.styleSheet?a.styleSheet.cssText=e:a.appendChild(document.createTextNode(e))}}("\n.p-galleria-content {\n    display: flex;\n    flex-direction: column;\n}\n.p-galleria-item-wrapper {\n    display: flex;\n    flex-direction: column;\n    position: relative;\n}\n.p-galleria-item-container {\n    position: relative;\n    display: flex;\n    height: 100%;\n}\n.p-galleria-item-nav {\n    position: absolute;\n    top: 50%;\n    margin-top: -0.5rem;\n    display: inline-flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n}\n.p-galleria-item-prev {\n    left: 0;\n    border-top-left-radius: 0;\n    border-bottom-left-radius: 0;\n}\n.p-galleria-item-next {\n    right: 0;\n    border-top-right-radius: 0;\n    border-bottom-right-radius: 0;\n}\n.p-galleria-item {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    height: 100%;\n    width: 100%;\n}\n.p-galleria-item-nav-onhover .p-galleria-item-nav {\n    pointer-events: none;\n    opacity: 0;\n    transition: opacity 0.2s ease-in-out;\n}\n.p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav {\n    pointer-events: all;\n    opacity: 1;\n}\n.p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav.p-disabled {\n    pointer-events: none;\n}\n.p-galleria-caption {\n    position: absolute;\n    bottom: 0;\n    left: 0;\n    width: 100%;\n}\n\n/* Thumbnails */\n.p-galleria-thumbnail-wrapper {\n    display: flex;\n    flex-direction: column;\n    overflow: auto;\n    flex-shrink: 0;\n}\n.p-galleria-thumbnail-prev,\n.p-galleria-thumbnail-next {\n    align-self: center;\n    flex: 0 0 auto;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n    position: relative;\n}\n.p-galleria-thumbnail-prev span,\n.p-galleria-thumbnail-next span {\n    display: flex;\n    justify-content: center;\n    align-items: center;\n}\n.p-galleria-thumbnail-container {\n    display: flex;\n    flex-direction: row;\n}\n.p-galleria-thumbnail-items-container {\n    overflow: hidden;\n    width: 100%;\n}\n.p-galleria-thumbnail-items {\n    display: flex;\n}\n.p-galleria-thumbnail-item {\n    overflow: auto;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    cursor: pointer;\n    opacity: 0.5;\n}\n.p-galleria-thumbnail-item:hover {\n    opacity: 1;\n    transition: opacity 0.3s;\n}\n.p-galleria-thumbnail-item-current {\n    opacity: 1;\n}\n\n/* Positions */\n/* Thumbnails */\n.p-galleria-thumbnails-left .p-galleria-content,\n.p-galleria-thumbnails-right .p-galleria-content {\n    flex-direction: row;\n}\n.p-galleria-thumbnails-left .p-galleria-item-wrapper,\n.p-galleria-thumbnails-right .p-galleria-item-wrapper {\n    flex-direction: row;\n}\n.p-galleria-thumbnails-left .p-galleria-item-wrapper,\n.p-galleria-thumbnails-top .p-galleria-item-wrapper {\n    order: 2;\n}\n.p-galleria-thumbnails-left .p-galleria-thumbnail-wrapper,\n.p-galleria-thumbnails-top .p-galleria-thumbnail-wrapper {\n    order: 1;\n}\n.p-galleria-thumbnails-left .p-galleria-thumbnail-container,\n.p-galleria-thumbnails-right .p-galleria-thumbnail-container {\n    flex-direction: column;\n    flex-grow: 1;\n}\n.p-galleria-thumbnails-left .p-galleria-thumbnail-items,\n.p-galleria-thumbnails-right .p-galleria-thumbnail-items {\n    flex-direction: column;\n    height: 100%;\n}\n\n/* Indicators */\n.p-galleria-indicators {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.p-galleria-indicator > button {\n    display: inline-flex;\n    align-items: center;\n}\n.p-galleria-indicators-left .p-galleria-item-wrapper,\n.p-galleria-indicators-right .p-galleria-item-wrapper {\n    flex-direction: row;\n    align-items: center;\n}\n.p-galleria-indicators-left .p-galleria-item-container,\n.p-galleria-indicators-top .p-galleria-item-container {\n    order: 2;\n}\n.p-galleria-indicators-left .p-galleria-indicators,\n.p-galleria-indicators-top .p-galleria-indicators {\n    order: 1;\n}\n.p-galleria-indicators-left .p-galleria-indicators,\n.p-galleria-indicators-right .p-galleria-indicators {\n    flex-direction: column;\n}\n.p-galleria-indicator-onitem .p-galleria-indicators {\n    position: absolute;\n    display: flex;\n}\n.p-galleria-indicator-onitem.p-galleria-indicators-top .p-galleria-indicators {\n    top: 0;\n    left: 0;\n    width: 100%;\n    align-items: flex-start;\n}\n.p-galleria-indicator-onitem.p-galleria-indicators-right .p-galleria-indicators {\n    right: 0;\n    top: 0;\n    height: 100%;\n    align-items: flex-end;\n}\n.p-galleria-indicator-onitem.p-galleria-indicators-bottom .p-galleria-indicators {\n    bottom: 0;\n    left: 0;\n    width: 100%;\n    align-items: flex-end;\n}\n.p-galleria-indicator-onitem.p-galleria-indicators-left .p-galleria-indicators {\n    left: 0;\n    top: 0;\n    height: 100%;\n    align-items: flex-start;\n}\n\n/* FullScreen */\n.p-galleria-mask {\n    position: fixed;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n.p-galleria-close {\n    position: absolute;\n    top: 0;\n    right: 0;\n    display: flex;\n    justify-content: center;\n    align-items: center;\n    overflow: hidden;\n}\n.p-galleria-mask .p-galleria-item-nav {\n    position: fixed;\n    top: 50%;\n    margin-top: -0.5rem;\n}\n\n/* Animation */\n.p-galleria-enter-active {\n    transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n}\n.p-galleria-leave-active {\n    transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);\n}\n.p-galleria-enter-from,\n.p-galleria-leave-to {\n    opacity: 0;\n    transform: scale(0.7);\n}\n.p-galleria-enter-active .p-galleria-item-nav {\n    opacity: 0;\n}\n\n/* Keyboard Support */\n.p-items-hidden .p-galleria-thumbnail-item {\n    visibility: hidden;\n}\n.p-items-hidden .p-galleria-thumbnail-item.p-galleria-thumbnail-item-active {\n    visibility: visible;\n}\n"),L.render=function(e,t,i,n,a,l){const s=r.resolveComponent("GalleriaContent"),o=r.resolveComponent("Portal"),c=r.resolveDirective("focustrap");return i.fullScreen?(r.openBlock(),r.createBlock(o,{key:0},{default:r.withCtx((()=>[a.containerVisible?(r.openBlock(),r.createElementBlock("div",r.mergeProps({key:0,ref:l.maskRef,class:l.maskContentClass,role:i.fullScreen?"dialog":"region","aria-modal":i.fullScreen?"true":void 0},e.ptm("mask")),[r.createVNode(r.Transition,{name:"p-galleria",onBeforeEnter:l.onBeforeEnter,onEnter:l.onEnter,onBeforeLeave:l.onBeforeLeave,onAfterLeave:l.onAfterLeave,appear:""},{default:r.withCtx((()=>[i.visible?r.withDirectives((r.openBlock(),r.createBlock(s,r.mergeProps({key:0,ref:l.containerRef,onMaskHide:l.maskHide,templates:e.$slots,onActiveitemChange:l.onActiveItemChange,pt:e.pt},e.$props),null,16,["onMaskHide","templates","onActiveitemChange","pt"])),[[c]]):r.createCommentVNode("",!0)])),_:1},8,["onBeforeEnter","onEnter","onBeforeLeave","onAfterLeave"])],16,H)):r.createCommentVNode("",!0)])),_:1})):(r.openBlock(),r.createBlock(s,r.mergeProps({key:1,templates:e.$slots,onActiveitemChange:l.onActiveItemChange,pt:e.pt},e.$props),null,16,["templates","onActiveitemChange","pt"]))},L}(primevue.basecomponent,primevue.focustrap,primevue.portal,primevue.utils,primevue.icons.times,primevue.ripple,primevue.icons.chevronleft,primevue.icons.chevronright,Vue,primevue.icons.chevrondown,primevue.icons.chevronup);

package/image/Image.d.ts

@@ -9,6 +9,127 @@
  */
 import { VNode } from 'vue';
 import { ClassComponent, GlobalComponentConstructor } from '../ts-helpers';
+export declare type ImagePassThroughOptionType = ImagePassThroughAttributes | ((options: ImagePassThroughMethodOptions) => ImagePassThroughAttributes) | null | undefined;
+
+/**
+ * Custom passthrough(pt) option method.
+ */
+export interface ImagePassThroughMethodOptions {
+    props: ImageProps;
+    state: ImageState;
+}
+
+/**
+ * Custom passthrough(pt) options.
+ * @see {@link ImageProps.pt}
+ */
+export interface ImagePassThroughOptions {
+    /**
+     * Uses to pass attributes to the root's DOM element.
+     */
+    root?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the image's DOM element.
+     */
+    image?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the button's DOM element.
+     */
+    button?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the icon's DOM element.
+     */
+    icon?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the mask's DOM element.
+     */
+    mask?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the toolbar's DOM element.
+     */
+    toolbar?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the rotate right button's DOM element.
+     */
+    rotateRightButton?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the rotate right icon's DOM element.
+     */
+    rotateRightIcon?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the rotate left button's DOM element.
+     */
+    rotateLeftButton?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the rotate left icon's DOM element.
+     */
+    rotateLeftIcon?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the zoom out button's DOM element.
+     */
+    zoomOutButton?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the zoom out icon's DOM element.
+     */
+    zoomOutIcon?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the zoom in button's DOM element.
+     */
+    zoomInButton?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the zoom in icon's DOM element.
+     */
+    zoomInIcon?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the close button's DOM element.
+     */
+    closeButton?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the close icon's DOM element.
+     */
+    closeIcon?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the preview container's DOM element.
+     */
+    previewContainer?: ImagePassThroughOptionType;
+    /**
+     * Uses to pass attributes to the preview's DOM element.
+     */
+    preview?: ImagePassThroughOptionType;
+}
+
+/**
+ * Custom passthrough attributes for each DOM elements
+ */
+export interface ImagePassThroughAttributes {
+    [key: string]: any;
+}
+
+/**
+ * Defines current inline state in Image component.
+ */
+export interface ImageState {
+    /**
+     * Mask visible state as a boolean.
+     * @defaultValue false
+     */
+    maskVisible: boolean;
+    /**
+     * Preview visible state as a boolean.
+     * @defaultValue false
+     */
+    previewVisible: boolean;
+    /**
+     * Rotate state as a number.
+     * @defaultValue 0
+     */
+    rotate: number;
+    /**
+     * Scale state as a boolean.
+     * @defaultValue 1
+     */
+    scale: number;
+}
 
 /**
  * Defines valid properties in Image component.
@@ -32,6 +153,21 @@ export interface ImageProps {
      * @deprecated since v3.27.0. Use 'indicator' slot.
      */
     indicatorIcon?: string;
+    /**
+     * Disable the zoom-in button
+     * @defaultValue false
+     */
+    zoomInDisabled?: boolean | undefined;
+    /**
+     * Disable the zoom-out button
+     * @defaultValue false
+     */
+    zoomOutDisabled?: boolean | undefined;
+    /**
+     * Uses to pass attributes to DOM elements inside the component.
+     * @type {ImagePassThroughOptions}
+     */
+    pt?: ImagePassThroughOptions;
 }
 
 /**
@@ -62,6 +198,40 @@ export interface ImageSlots {
      * Custom close template.
      */
     close(): VNode[];
+    /**
+     * Custom image template.
+     */
+    image(scope: {
+        /**
+         * Style class of the image element.
+         */
+        class: any;
+        /**
+         * Style of the image element.
+         */
+        style: any;
+        /**
+         * Image error function.
+         */
+        onError: void;
+    }): VNode[];
+    /**
+     * Custom preview template.
+     */
+    preview(scope: {
+        /**
+         * Style class of the preview image element.
+         */
+        class: any;
+        /**
+         * Style of the preview image element.
+         */
+        style: any;
+        /**
+         * Preview click function.
+         */
+        onClick: void;
+    }): VNode[];
 }
 
 export interface ImageEmits {}

package/image/Image.vue

@@ -1,47 +1,51 @@
 <template>
-    <span :class="containerClass" :style="style">
-        <img v-bind="$attrs" :style="imageStyle" :class="imageClass" @error="onError" />
-        <button v-if="preview" ref="previewButton" class="p-image-preview-indicator" @click="onImageClick" v-bind="previewButtonProps">
+    <span :class="containerClass" :style="style" v-bind="ptm('root')">
+        <slot name="image" :class="imageClass" :style="imageStyle" :onError="onError">
+            <img :style="imageStyle" :class="imageClass" @error="onError" v-bind="{ ...$attrs, ...ptm('image') }" />
+        </slot>
+        <button v-if="preview" ref="previewButton" class="p-image-preview-indicator" @click="onImageClick" v-bind="{ ...previewButtonProps, ...ptm('button') }">
             <slot name="indicatoricon">
-                <component :is="indicatorIcon ? 'i' : 'EyeIcon'" class="p-image-preview-icon" />
+                <component :is="indicatorIcon ? 'i' : 'EyeIcon'" class="p-image-preview-icon" v-bind="ptm('icon')" />
             </slot>
         </button>
         <Portal>
-            <div v-if="maskVisible" :ref="maskRef" v-focustrap role="dialog" :class="maskClass" :aria-modal="maskVisible" @click="onMaskClick" @keydown="onMaskKeydown">
-                <div class="p-image-toolbar">
-                    <button class="p-image-action p-link" @click="rotateRight" type="button" :aria-label="rightAriaLabel">
+            <div v-if="maskVisible" :ref="maskRef" v-focustrap role="dialog" :class="maskClass" :aria-modal="maskVisible" @click="onMaskClick" @keydown="onMaskKeydown" v-bind="ptm('mask')">
+                <div class="p-image-toolbar" v-bind="ptm('toolbar')">
+                    <button class="p-image-action p-link" @click="rotateRight" type="button" :aria-label="rightAriaLabel" v-bind="ptm('rotateRightButton')">
                         <slot name="refresh">
-                            <RefreshIcon />
+                            <RefreshIcon v-bind="ptm('rotateRightIcon')" />
                         </slot>
                     </button>
 
-                    <button class="p-image-action p-link" @click="rotateLeft" type="button" :aria-label="leftAriaLabel">
+                    <button class="p-image-action p-link" @click="rotateLeft" type="button" :aria-label="leftAriaLabel" v-bind="ptm('rotateLeftButton')">
                         <slot name="undo">
-                            <UndoIcon />
+                            <UndoIcon v-bind="ptm('rotateLeftIcon')" />
                         </slot>
                     </button>
 
-                    <button class="p-image-action p-link" @click="zoomOut" type="button" :disabled="zoomDisabled" :aria-label="zoomOutAriaLabel">
+                    <button :class="['p-image-action p-link', { 'p-disabled': isZoomOutDisabled }]" @click="zoomOut" type="button" :disabled="isZoomOutDisabled" :aria-label="zoomOutAriaLabel" v-bind="ptm('zoomOutButton')">
                         <slot name="zoomout">
-                            <SearchMinusIcon />
+                            <SearchMinusIcon v-bind="ptm('zoomOutIcon')" />
                         </slot>
                     </button>
 
-                    <button class="p-image-action p-link" @click="zoomIn" type="button" :disabled="zoomDisabled" :aria-label="zoomInAriaLabel">
+                    <button :class="['p-image-action p-link', { 'p-disabled': isZoomInDisabled }]" @click="zoomIn" type="button" :disabled="isZoomInDisabled" :aria-label="zoomInAriaLabel" v-bind="ptm('zoomInButton')">
                         <slot name="zoomin">
-                            <SearchPlusIcon />
+                            <SearchPlusIcon v-bind="ptm('zoomInIcon')" />
                         </slot>
                     </button>
 
-                    <button class="p-image-action p-link" type="button" @click="hidePreview" :aria-label="closeAriaLabel" autofocus>
+                    <button class="p-image-action p-link" type="button" @click="hidePreview" :aria-label="closeAriaLabel" autofocus v-bind="ptm('closeButton')">
                         <slot name="close">
-                            <TimesIcon />
+                            <TimesIcon v-bind="ptm('closeIcon')" />
                         </slot>
                     </button>
                 </div>
                 <transition name="p-image-preview" @before-enter="onBeforeEnter" @enter="onEnter" @leave="onLeave" @before-leave="onBeforeLeave" @after-leave="onAfterLeave">
-                    <div v-if="previewVisible">
-                        <img :src="$attrs.src" class="p-image-preview" :style="imagePreviewStyle" @click="onPreviewImageClick" />
+                    <div v-if="previewVisible" v-bind="ptm('previewContainer')">
+                        <slot name="preview" class="p-image-preview" :style="imagePreviewStyle" :onClick="onPreviewImageClick">
+                            <img :src="$attrs.src" class="p-image-preview" :style="imagePreviewStyle" @click="onPreviewImageClick" v-bind="ptm('preview')" />
+                        </slot>
                     </div>
                 </transition>
             </div>
@@ -50,6 +54,7 @@
 </template>
 
 <script>
+import BaseComponent from 'primevue/basecomponent';
 import FocusTrap from 'primevue/focustrap';
 import EyeIcon from 'primevue/icons/eye';
 import RefreshIcon from 'primevue/icons/refresh';
@@ -62,6 +67,7 @@ import { DomHandler, ZIndexUtils } from 'primevue/utils';
 
 export default {
     name: 'Image',
+    extends: BaseComponent,
     inheritAttrs: false,
     emits: ['show', 'hide', 'error'],
     props: {
@@ -92,6 +98,14 @@ export default {
         indicatorIcon: {
             type: String,
             default: undefined
+        },
+        zoomInDisabled: {
+            type: Boolean,
+            default: false
+        },
+        zoomOutDisabled: {
+            type: Boolean,
+            default: false
         }
     },
     mask: null,
@@ -126,7 +140,13 @@ export default {
         onPreviewImageClick() {
             this.previewClick = true;
         },
-        onMaskClick() {
+        onMaskClick(event) {
+            const isActionbarTarget = [event.target.classList].includes('p-image-action') || event.target.closest('.p-image-action');
+
+            if (isActionbarTarget) {
+                return;
+            }
+
             if (!this.previewClick) {
                 this.previewVisible = false;
                 this.rotate = 0;
@@ -192,6 +212,11 @@ export default {
             if (focusTarget) {
                 focusTarget.focus();
             }
+        },
+        hidePreview() {
+            this.previewVisible = false;
+            this.rotate = 0;
+            this.scale = 1;
         }
     },
     computed: {
@@ -213,8 +238,11 @@ export default {
         imagePreviewStyle() {
             return { transform: 'rotate(' + this.rotate + 'deg) scale(' + this.scale + ')' };
         },
-        zoomDisabled() {
-            return this.scale <= 0.5 || this.scale >= 1.5;
+        isZoomInDisabled() {
+            return this.zoomInDisabled || this.scale >= 1.5;
+        },
+        isZoomOutDisabled() {
+            return this.zoomOutDisabled || this.scale <= 0.5;
         },
         rightAriaLabel() {
             return this.$primevue.config.locale.aria ? this.$primevue.config.locale.aria.rotateRight : undefined;