primereact/galleria/galleria.min.js

PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime

this.primereact=this.primereact||{},this.primereact.galleria=function(e,t,n,a,r,i,l,o){"use strict";function c(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function u(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var a=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,a.get?a:{enumerable:!0,get:function(){return e[n]}})}})),t.default=e,Object.freeze(t)}var s=u(t),m=c(n);function d(){return d=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)Object.prototype.hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},d.apply(this,arguments)}function p(e){if(Array.isArray(e))return e}function v(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var a,r,i,l,o=[],c=!0,u=!1;try{if(i=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;c=!1}else for(;!(c=(a=i.call(n)).done)&&(o.push(a.value),o.length!==t);c=!0);}catch(e){u=!0,r=e}finally{try{if(!c&&null!=n.return&&(l=n.return(),Object(l)!==l))return}finally{if(u)throw r}}return o}}function f(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,a=new Array(t);n<t;n++)a[n]=e[n];return a}function h(e,t){if(e){if("string"==typeof e)return f(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?f(e,t):void 0}}function g(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function I(e,t){return p(e)||v(e,t)||h(e,t)||g()}var b={defaultProps:{__TYPE:"Galleria",id:null,value:null,activeIndex:0,fullScreen:!1,item:null,thumbnail:null,indicator:null,caption:null,className:null,style:null,header:null,footer:null,numVisible:3,responsiveOptions:null,showItemNavigators:!1,showThumbnailNavigators:!0,showItemNavigatorsOnHover:!1,changeItemOnIndicatorHover:!1,circular:!1,autoPlay:!1,transitionInterval:4e3,showThumbnails:!0,thumbnailsPosition:"bottom",verticalThumbnailViewPortHeight:"300px",showIndicators:!1,showIndicatorsOnItem:!1,indicatorsPosition:"bottom",baseZIndex:0,transitionOptions:null,onItemChange:null,children:void 0},getProps:function(e){return o.ObjectUtils.getMergedProps(e,b.defaultProps)},getOtherProps:function(e){return o.ObjectUtils.getDiffProps(e,b.defaultProps)}},x=s.memo(s.forwardRef((function(e,t){var n=function(){e.slideShowActive&&e.stopSlideShow&&e.stopSlideShow()},a=function(t){n(),e.onActiveItemChange({index:e.circular&&0===e.activeItemIndex?e.value.length-1:0!==e.activeItemIndex?e.activeItemIndex-1:0}),t&&t.cancelable&&t.preventDefault()},i=function(t){n(),e.onActiveItemChange({index:e.circular&&e.value.length-1===e.activeItemIndex?0:e.activeItemIndex+1}),t&&t.cancelable&&t.preventDefault()},c=function(t){n(),e.onActiveItemChange({index:t})},u=function(t){e.changeItemOnIndicatorHover&&(n(),e.onActiveItemChange({index:t}))},m=function(t,a){13===t.which&&(n(),e.onActiveItemChange({index:a}))};r.useMountEffect((function(){e.autoPlay&&e.startSlideShow()}));var d=function(t){var n="p-galleria-indicator-"+t,a=o.classNames("p-galleria-indicator",{"p-highlight":e.activeItemIndex===t}),r=e.indicator&&e.indicator(t);return r||(r=s.createElement("button",{type:"button",tabIndex:-1,className:"p-link"},s.createElement(l.Ripple,null))),s.createElement("li",{className:a,key:n,tabIndex:0,onClick:function(){return c(t)},onMouseEnter:function(){return u(t)},onKeyDown:function(e){return m(e,t)}},r)},p=e.itemTemplate&&e.itemTemplate(e.value[e.activeItemIndex]),v=function(){if(e.showItemNavigators){var t=!e.circular&&0===e.activeItemIndex,n=o.classNames("p-galleria-item-prev p-galleria-item-nav p-link",{"p-disabled":t});return s.createElement("button",{type:"button",className:n,onClick:a,disabled:t},s.createElement("span",{className:"p-galleria-item-prev-icon pi pi-chevron-left"}),s.createElement(l.Ripple,null))}return null}(),f=function(){if(e.showItemNavigators){var t=!e.circular&&e.activeItemIndex===e.value.length-1,n=o.classNames("p-galleria-item-next p-galleria-item-nav p-link",{"p-disabled":t});return s.createElement("button",{type:"button",className:n,onClick:i,disabled:t},s.createElement("span",{className:"p-galleria-item-next-icon pi pi-chevron-right"}),s.createElement(l.Ripple,null))}return null}(),h=function(){if(e.caption){var t=e.caption(e.value[e.activeItemIndex]);return s.createElement("div",{className:"p-galleria-caption"},t)}return null}(),g=function(){if(e.showIndicators){for(var t=o.classNames("p-galleria-indicators p-reset",e.indicatorsContentClassName),n=[],a=0;a<e.value.length;a++)n.push(d(a));return s.createElement("ul",{className:t},n)}return null}();return s.createElement("div",{ref:t,className:"p-galleria-item-wrapper"},s.createElement("div",{className:"p-galleria-item-container"},v,s.createElement("div",{className:"p-galleria-item"},p),f,h),g)})));function y(e){if(Array.isArray(e))return f(e)}function w(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function E(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}x.displayName="GalleriaItem";var N=s.memo((function(e){var t=e.active?0:null,n=e.template&&e.template(e.item),a=o.classNames("p-galleria-thumbnail-item",{"p-galleria-thumbnail-item-current":e.current,"p-galleria-thumbnail-item-active":e.active,"p-galleria-thumbnail-item-start":e.start,"p-galleria-thumbnail-item-end":e.end},e.className);return s.createElement("div",{className:a},s.createElement("div",{className:"p-galleria-thumbnail-item-content",tabIndex:t,onClick:function(t){e.onItemClick({originalEvent:t,index:e.index})},onKeyDown:function(t){13===t.which&&e.onItemClick({originalEvent:t,index:e.index})}},n))})),S=s.memo(s.forwardRef((function(e,t){var n=I(s.useState(e.numVisible),2),a=n[0],i=n[1],c=I(s.useState(0),2),u=c[0],d=c[1],p=s.useRef(null),v=s.useRef(null),f=s.useRef(""),g=s.useRef(null),b=s.useRef(null),x=r.usePrevious(a),S=r.usePrevious(e.activeItemIndex),O=I(r.useResizeListener({listener:function(){Z()},when:e.responsiveOptions}),1)[0],C=function(t){var n=u+t;t<0&&-1*n+a>e.value.length-1?n=a-e.value.length:t>0&&n>0&&(n=0),e.circular&&(t<0&&e.value.length-1===e.activeItemIndex?n=0:t>0&&0===e.activeItemIndex&&(n=a-e.value.length)),p.current&&(o.DomHandler.removeClass(p.current,"p-items-hidden"),p.current.style.transform=e.isVertical?"translate3d(0, ".concat(n*(100/a),"%, 0)"):"translate3d(".concat(n*(100/a),"%, 0, 0)"),p.current.style.transition="transform 500ms ease 0s"),d(n)},P=function(){e.slideShowActive&&e.stopSlideShow&&e.stopSlideShow()},T=function(){var e=Math.floor(a/2);return a%2?e:e-1},A=function(t){P();var n=0!==e.activeItemIndex?e.activeItemIndex-1:0;a-(n+u)-1>T()&&(-1*u!=0||e.circular)&&C(1),e.onActiveItemChange({index:e.circular&&0===e.activeItemIndex?e.value.length-1:n}),t.cancelable&&t.preventDefault()},k=function(t){P();var n=e.activeItemIndex+1;n+u>T()&&(-1*u<U()-1||e.circular)&&C(-1),e.onActiveItemChange({index:e.circular&&e.value.length-1===e.activeItemIndex?0:n}),t.cancelable&&t.preventDefault()},H=function(t){P();var n=t.index;if(n!==e.activeItemIndex){var r=n+u,i=0;n<e.activeItemIndex?(i=a-r-1-T())>0&&-1*u!=0&&C(i):(i=T()-r)<0&&-1*u<U()-1&&C(i),e.onActiveItemChange({index:n})}},V=function(e){p.current&&"transform"===e.propertyName&&(o.DomHandler.addClass(p.current,"p-items-hidden"),p.current.style.transition="")},j=function(e){var t=e.changedTouches[0];v.current={x:t.pageX,y:t.pageY}},R=function(e){e.cancelable&&e.preventDefault()},D=function(t){var n=t.changedTouches[0];M(t,e.isVertical?n.pageY-v.current.y:n.pageX-v.current.x)},M=function(e,t){t<0?k(e):A(e)},U=function(){return e.value.length>a?e.value.length-a+1:0},G=function(){g.current||(g.current=o.DomHandler.createInlineStyle(m.default.nonce));var t,n="\n            .p-galleria-thumbnail-items[".concat(f.current,"] .p-galleria-thumbnail-item {\n                flex: 1 0 ").concat(100/a,"%\n            }\n        ");if(e.responsiveOptions){b.current=y(t=e.responsiveOptions)||w(t)||h(t)||E(),b.current.sort((function(e,t){return o.ObjectUtils.sort(e.breakpoint,t.breakpoint,-1,m.default.locale,m.default.nullSortOrder)}));for(var r=0;r<b.current.length;r++){var i=b.current[r];n+="\n                    @media screen and (max-width: ".concat(i.breakpoint,") {\n                        .p-galleria-thumbnail-items[").concat(f.current,"] .p-galleria-thumbnail-item {\n                            flex: 1 0 ").concat(100/i.numVisible,"%\n                        }\n                    }\n                ")}}g.current.innerHTML=n},Z=function(){if(p.current&&b.current){for(var t=window.innerWidth,n={numVisible:e.numVisible},r=0;r<b.current.length;r++){var l=b.current[r];parseInt(l.breakpoint,10)>=t&&(n=l)}a!==n.numVisible&&i(n.numVisible)}};r.useMountEffect((function(){p.current&&(f.current=o.UniqueComponentId(),p.current.setAttribute(f.current,"")),G(),Z(),O()})),r.useUpdateEffect((function(){var t=u;x===a&&S===e.activeItemIndex||((t=e.activeItemIndex<=T()?0:e.value.length-a+T()<e.activeItemIndex?a-e.value.length:e.value.length-a<e.activeItemIndex&&a%2==0?-1*e.activeItemIndex+T()+1:-1*e.activeItemIndex+T())!==u&&d(t),p.current.style.transform=e.isVertical?"translate3d(0, ".concat(t*(100/a),"%, 0)"):"translate3d(".concat(t*(100/a),"%, 0, 0)"),S!==e.activeItemIndex&&(o.DomHandler.removeClass(p.current,"p-items-hidden"),p.current.style.transition="transform 500ms ease 0s"))}));var _,z,Y,K,L=function(){if(e.showThumbnailNavigators){var t=!e.circular&&0===e.activeItemIndex||e.value.length<=a,n=o.classNames("p-galleria-thumbnail-prev p-link",{"p-disabled":t}),r=o.classNames("p-galleria-thumbnail-prev-icon pi",{"pi-chevron-left":!e.isVertical,"pi-chevron-up":e.isVertical});return s.createElement("button",{className:n,onClick:A,disabled:t},s.createElement("span",{className:r}),s.createElement(l.Ripple,null))}return null},X=function(){if(e.showThumbnailNavigators){var t=!e.circular&&e.activeItemIndex===e.value.length-1||e.value.length<=a,n=o.classNames("p-galleria-thumbnail-next p-link",{"p-disabled":t}),r=o.classNames("p-galleria-thumbnail-next-icon pi",{"pi-chevron-right":!e.isVertical,"pi-chevron-down":e.isVertical});return s.createElement("button",{className:n,onClick:k,disabled:t},s.createElement("span",{className:r}),s.createElement(l.Ripple,null))}return null},q=(_=e.value.map((function(t,n){var r=-1*u,i=r+a-1;return s.createElement(N,{key:n,index:n,template:e.itemTemplate,item:t,active:r<=n&&i>=n,start:r===n,end:i===n,onItemClick:H,current:e.activeItemIndex===n})})),z=e.isVertical?e.contentHeight:"",Y=L(),K=X(),s.createElement("div",{className:"p-galleria-thumbnail-container"},Y,s.createElement("div",{className:"p-galleria-thumbnail-items-container",style:{height:z}},s.createElement("div",{ref:p,className:"p-galleria-thumbnail-items",onTransitionEnd:V,onTouchStart:j,onTouchMove:R,onTouchEnd:D},_)),K));return s.createElement("div",{className:"p-galleria-thumbnail-wrapper"},q)})));N.displayName="GalleriaThumbnailItem",S.displayName="GalleriaThumbnails";var O=s.memo(s.forwardRef((function(e,t){var c=b.getProps(e),u=I(s.useState(!1),2),p=u[0],v=u[1],f=I(s.useState(c.numVisible),2),h=f[0],g=f[1],y=I(s.useState(!1),2),w=y[0],E=y[1],N=I(s.useState(c.activeIndex),2),O=N[0],C=N[1],P=s.useRef(null),T=s.useRef(null),A=s.useRef(null),k=c.onItemChange?c.activeIndex:O,H="left"===c.thumbnailsPosition||"right"===c.thumbnailsPosition;r.useInterval((function(){V({index:c.circular&&c.value.length-1===k?0:k+1})}),c.transitionInterval,w);var V=function(e){c.onItemChange?c.onItemChange(e):C(e.index)},j=function(){v(!0)},R=function(){v(!1)},D=function(){o.DomHandler.addClass(document.body,"p-overflow-hidden")},M=function(){o.ZIndexUtils.set("modal",A.current,m.default.autoZIndex,c.baseZIndex||m.default.zIndex.modal),o.DomHandler.addMultipleClasses(A.current,"p-component-overlay p-component-overlay-enter")},U=function(){c.onShow&&c.onShow()},G=function(){o.DomHandler.removeClass(document.body,"p-overflow-hidden"),o.DomHandler.addClass(A.current,"p-component-overlay-leave")},Z=function(){o.ZIndexUtils.clear(A.current),c.onHide&&c.onHide()},_=function(){return w},z=function(){E(!0)},Y=function(){E(!1)},K=function(e,t){var n=["top","left","bottom","right"].find((function(e){return e===t}));return n?"".concat(e,"-").concat(n):""};s.useEffect((function(){c.value&&c.value.length<h&&g(c.value.length)}),[c.value,h]),s.useEffect((function(){g(c.numVisible)}),[c.numVisible]),r.useUnmountEffect((function(){w&&Y(),o.ZIndexUtils.clear(A.current)})),s.useImperativeHandle(t,(function(){return{props:c,show:j,hide:R,isAutoPlayActive:_,startSlideShow:z,stopSlideShow:Y,getElement:function(){return P.current},getPreviewContent:function(){return T.current}}}));return o.ObjectUtils.isNotEmpty(c.value)&&function(){var e,t,r,u,v,f,g,I=(e=b.getOtherProps(c),t=c.showThumbnails&&K("p-galleria-thumbnails",c.thumbnailsPosition),r=c.showIndicators&&K("p-galleria-indicators",c.indicatorsPosition),u=o.classNames("p-galleria p-component",c.className,{"p-galleria-fullscreen":c.fullScreen,"p-galleria-indicator-onitem":c.showIndicatorsOnItem,"p-galleria-item-nav-onhover":c.showItemNavigatorsOnHover&&!c.fullScreen,"p-input-filled":"filled"===m.default.inputStyle,"p-ripple-disabled":!1===m.default.ripple},t,r),v=c.fullScreen&&s.createElement("button",{type:"button",className:"p-galleria-close p-link","aria-label":n.localeOption("close"),onClick:R},s.createElement("span",{className:"p-galleria-close-icon pi pi-times","aria-hidden":"true"}),s.createElement(l.Ripple,null)),f=c.header?s.createElement("div",{className:"p-galleria-header"},c.header):null,g=c.footer?s.createElement("div",{className:"p-galleria-footer"},c.footer):null,s.createElement("div",d({ref:P,id:c.id,className:u,style:c.style},e),v,f,s.createElement("div",{className:"p-galleria-content"},s.createElement(x,{ref:T,value:c.value,activeItemIndex:k,onActiveItemChange:V,itemTemplate:c.item,circular:c.circular,caption:c.caption,showIndicators:c.showIndicators,changeItemOnIndicatorHover:c.changeItemOnIndicatorHover,indicator:c.indicator,showItemNavigators:c.showItemNavigators,autoPlay:c.autoPlay,slideShowActive:w,startSlideShow:z,stopSlideShow:Y}),c.showThumbnails&&s.createElement(S,{value:c.value,activeItemIndex:k,onActiveItemChange:V,itemTemplate:c.thumbnail,numVisible:h,responsiveOptions:c.responsiveOptions,circular:c.circular,isVertical:H,contentHeight:c.verticalThumbnailViewPortHeight,showThumbnailNavigators:c.showThumbnailNavigators,autoPlay:c.autoPlay,slideShowActive:w,stopSlideShow:Y})),g));if(c.fullScreen){var y=o.classNames("p-galleria-mask",{"p-galleria-visible":p});return s.createElement(i.Portal,{element:s.createElement("div",{ref:A,className:y},s.createElement(a.CSSTransition,{nodeRef:P,classNames:"p-galleria",in:p,timeout:{enter:150,exit:150},options:c.transitionOptions,unmountOnExit:!0,onEnter:D,onEntering:M,onEntered:U,onExit:G,onExited:Z},I))})}return I}()})));return O.displayName="Galleria",e.Galleria=O,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.api,primereact.csstransition,primereact.hooks,primereact.portal,primereact.ripple,primereact.utils);