primereact
Version:
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
2 lines (1 loc) • 33.9 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),n=require("primereact/api"),t=require("primereact/componentbase"),a=require("primereact/csstransition"),i=require("primereact/hooks"),r=require("primereact/icons/times"),l=require("primereact/portal"),o=require("primereact/ripple"),c=require("primereact/utils"),s=require("primereact/icons/chevronleft"),u=require("primereact/icons/chevronright"),m=require("primereact/icons/chevrondown"),p=require("primereact/icons/chevronup");function d(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function f(e){if(e&&e.__esModule)return e;var n=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var a=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,a.get?a:{enumerable:!0,get:function(){return e[t]}})}})),n.default=e,Object.freeze(n)}var h=f(e),b=d(n);function v(){return v=Object.assign?Object.assign.bind():function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var a in t)Object.prototype.hasOwnProperty.call(t,a)&&(e[a]=t[a])}return e},v.apply(this,arguments)}function g(e){return g="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},g(e)}function I(e,n){if("object"!==g(e)||null===e)return e;var t=e[Symbol.toPrimitive];if(void 0!==t){var a=t.call(e,n||"default");if("object"!==g(a))return a;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}function x(e){var n=I(e,"string");return"symbol"===g(n)?n:String(n)}function y(e,n,t){return(n=x(n))in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}function w(e){if(Array.isArray(e))return e}function O(e,n){var t=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=t){var a,i,r,l,o=[],c=!0,s=!1;try{if(r=(t=t.call(e)).next,0===n){if(Object(t)!==t)return;c=!1}else for(;!(c=(a=r.call(t)).done)&&(o.push(a.value),o.length!==n);c=!0);}catch(e){s=!0,i=e}finally{try{if(!c&&null!=t.return&&(l=t.return(),Object(l)!==l))return}finally{if(s)throw i}}return o}}function S(e,n){(null==n||n>e.length)&&(n=e.length);for(var t=0,a=new Array(n);t<n;t++)a[t]=e[t];return a}function E(e,n){if(e){if("string"==typeof e)return S(e,n);var t=Object.prototype.toString.call(e).slice(8,-1);return"Object"===t&&e.constructor&&(t=e.constructor.name),"Map"===t||"Set"===t?Array.from(e):"Arguments"===t||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)?S(e,n):void 0}}function N(){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 P(e,n){return w(e)||O(e,n)||E(e,n)||N()}var C=t.ComponentBase.extend({defaultProps:{__TYPE:"Galleria",activeIndex:0,autoPlay:!1,baseZIndex:0,caption:null,changeItemOnIndicatorHover:!1,children:void 0,circular:!1,className:null,closeIcon:null,footer:null,fullScreen:!1,header:null,id:null,indicator:null,indicatorsPosition:"bottom",item:null,itemNextIcon:null,itemPrevIcon:null,nextThumbnailIcon:null,numVisible:3,onHide:null,onItemChange:null,onShow:null,prevThumbnailIcon:null,responsiveOptions:null,showIndicators:!1,showIndicatorsOnItem:!1,showItemNavigators:!1,showItemNavigatorsOnHover:!1,showThumbnailNavigators:!0,showThumbnails:!0,style:null,thumbnail:null,thumbnailsPosition:"bottom",transitionInterval:4e3,transitionOptions:null,value:null,verticalThumbnailViewPortHeight:"300px"},css:{classes:{header:"p-galleria-header",footer:"p-galleria-footer",closeIcon:"p-galleria-close-icon",closeButton:"p-galleria-close p-link",root:function(e){var n=e.props,t=e.context;return c.classNames("p-galleria p-component",{"p-galleria-fullscreen":n.fullScreen,"p-galleria-indicator-onitem":n.showIndicatorsOnItem,"p-galleria-item-nav-onhover":n.showItemNavigatorsOnHover&&!n.fullScreen,"p-input-filled":t&&"filled"===t.inputStyle||"filled"===b.default.inputStyle,"p-ripple-disabled":t&&!1===t.ripple||!1===b.default.ripple},e.thumbnailsPosClassName,e.indicatorPosClassName)},content:"p-galleria-content",mask:function(e){return c.classNames("p-galleria-mask",{"p-galleria-visible":e.visibleState})},thumbnailItem:function(e){var n=e.subProps;return c.classNames("p-galleria-thumbnail-item",{"p-galleria-thumbnail-item-current":n.current,"p-galleria-thumbnail-item-active":n.active,"p-galleria-thumbnail-item-start":n.start,"p-galleria-thumbnail-item-end":n.end})},thumbnailItemContent:"p-galleria-thumbnail-item-content",previousThumbnailIcon:"p-galleria-thumbnail-prev-icon",previousThumbnailButton:function(e){return c.classNames("p-galleria-thumbnail-prev p-link",{"p-disabled":e.isDisabled})},nextThumbnailIcon:"p-galleria-thumbnail-next-icon",nextThumbnailButton:function(e){return c.classNames("p-galleria-thumbnail-next p-link",{"p-disabled":e.isDisabled})},thumbnailContainer:"p-galleria-thumbnail-container",thumbnailItemsContainer:"p-galleria-thumbnail-items-container",thumbnailItems:"p-galleria-thumbnail-items",thumbnailWrapper:"p-galleria-thumbnail-wrapper",previousItemIcon:"p-galleria-item-prev-icon",previousItemButton:function(e){return c.classNames("p-galleria-item-prev p-galleria-item-nav p-link",{"p-disabled":e.isDisabled})},nextItemIcon:"p-galleria-item-next-icon",nextItemButton:function(e){return c.classNames("p-galleria-item-next p-galleria-item-nav p-link",{"p-disabled":e.isDisabled})},caption:"p-galleria-caption",indicator:function(e){return c.classNames("p-galleria-indicator",{"p-highlight":e.isActive})},indicators:"p-galleria-indicators p-reset",itemWrapper:"p-galleria-item-wrapper",itemContainer:"p-galleria-item-container",item:"p-galleria-item",transition:"p-galleria"},styles:"\n@layer primereact {\n .p-galleria-content {\n display: flex;\n flex-direction: column;\n }\n \n .p-galleria-item-wrapper {\n display: flex;\n flex-direction: column;\n position: relative;\n }\n \n .p-galleria-item-container {\n position: relative;\n display: flex;\n height: 100%;\n }\n \n .p-galleria-item-nav {\n position: absolute;\n top: 50%;\n margin-top: -.5rem;\n display: inline-flex;\n justify-content: center;\n align-items: center;\n overflow: hidden;\n }\n \n .p-galleria-item-prev {\n left: 0;\n border-top-left-radius: 0;\n border-bottom-left-radius: 0;\n }\n \n .p-galleria-item-next {\n right: 0;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n \n .p-galleria-item {\n display: flex;\n justify-content: center;\n align-items: center;\n height: 100%;\n width: 100%;\n }\n \n .p-galleria-item-nav-onhover .p-galleria-item-nav {\n pointer-events: none;\n opacity: 0;\n transition: opacity .2s ease-in-out;\n }\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 \n .p-galleria-item-nav-onhover .p-galleria-item-wrapper:hover .p-galleria-item-nav.p-disabled {\n pointer-events: none;\n }\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 \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 \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 \n .p-galleria-thumbnail-container {\n display: flex;\n flex-direction: row;\n }\n \n .p-galleria-thumbnail-items-container {\n overflow: hidden;\n width: 100%;\n }\n \n .p-galleria-thumbnail-items {\n display: flex;\n }\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: .5;\n }\n \n .p-galleria-thumbnail-item:hover {\n opacity: 1;\n transition: opacity .3s;\n }\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 \n .p-galleria-thumbnails-left .p-galleria-item-wrapper,\n .p-galleria-thumbnails-right .p-galleria-item-wrapper {\n flex-direction: row;\n }\n \n .p-galleria-thumbnails-left .p-galleria-item-wrapper,\n .p-galleria-thumbnails-top .p-galleria-item-wrapper {\n order: 2;\n }\n \n .p-galleria-thumbnails-left .p-galleria-thumbnail-wrapper,\n .p-galleria-thumbnails-top .p-galleria-thumbnail-wrapper {\n order: 1;\n }\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 \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 \n .p-galleria-indicator > button {\n display: inline-flex;\n align-items: center;\n }\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 \n .p-galleria-indicators-left .p-galleria-item-container,\n .p-galleria-indicators-top .p-galleria-item-container {\n order: 2;\n }\n \n .p-galleria-indicators-left .p-galleria-indicators,\n .p-galleria-indicators-top .p-galleria-indicators {\n order: 1;\n }\n \n .p-galleria-indicators-left .p-galleria-indicators,\n .p-galleria-indicators-right .p-galleria-indicators {\n flex-direction: column;\n }\n \n .p-galleria-indicator-onitem .p-galleria-indicators {\n position: absolute;\n display: flex;\n z-index: 1;\n }\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 \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 \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 \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 pointer-events: none;\n }\n \n .p-galleria-mask.p-component-overlay {\n pointer-events: auto;\n }\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 \n .p-galleria-mask .p-galleria-item-nav {\n position: fixed;\n top: 50%;\n margin-top: -.5rem;\n }\n \n /* Animation */\n .p-galleria-enter {\n opacity: 0;\n transform: scale(0.7);\n }\n \n .p-galleria-enter-active {\n opacity: 1;\n transform: scale(1);\n transition: all 150ms cubic-bezier(0, 0, 0.2, 1);\n }\n \n .p-galleria-enter-done {\n transform: none;\n }\n \n .p-galleria-exit {\n opacity: 1;\n }\n \n .p-galleria-exit-active {\n opacity: 0;\n transform: scale(0.7);\n transition: all 150ms cubic-bezier(0.4, 0.0, 0.2, 1);\n }\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 \n .p-items-hidden .p-galleria-thumbnail-item.p-galleria-thumbnail-item-active {\n visibility: visible;\n }\n}\n",inlineStyles:{thumbnailItemsContainer:function(e){return{height:e.height}}}}});function D(e){if(Array.isArray(e))return S(e)}function j(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function T(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function k(e){return D(e)||j(e)||E(e)||T()}function A(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);n&&(a=a.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,a)}return t}function H(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?A(Object(t),!0).forEach((function(n){y(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):A(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}var R=h.memo(h.forwardRef((function(e,t){var a=i.useMergeProps(),r=h.useRef(null),l=e.ptm,m=e.cx,p=function(n,t){return l(n,H({hostName:e.hostName},t))},d=function(){e.slideShowActive&&e.stopSlideShow&&e.stopSlideShow()},f=function(n){d(),e.onActiveItemChange({index:e.circular&&0===e.activeItemIndex?e.value.length-1:0!==e.activeItemIndex?e.activeItemIndex-1:0}),n&&n.cancelable&&n.preventDefault()},b=function(n){d(),e.onActiveItemChange({index:e.circular&&e.value.length-1===e.activeItemIndex?0:e.activeItemIndex+1}),n&&n.cancelable&&n.preventDefault()},g=function(n){d(),e.onActiveItemChange({index:n})},I=function(n){e.changeItemOnIndicatorHover&&(d(),e.onActiveItemChange({index:n}))},x=function(n,t){switch(n.code){case"Enter":case"NumpadEnter":case"Space":d(),e.onActiveItemChange({index:t}),n.preventDefault();break;case"ArrowRight":y();break;case"ArrowLeft":w();break;case"Home":O(),n.preventDefault();break;case"End":S(),n.preventDefault();break;case"Tab":E();break;case"ArrowDown":case"ArrowUp":case"PageUp":case"PageDown":n.preventDefault()}},y=function(){var e=k(c.DomHandler.find(r.current,'[data-pc-section="indicator"]')),n=N();P(n,n+1===e.length?e.length-1:n+1)},w=function(){var e=N();P(e,e-1<=0?0:e-1)},O=function(){var e=N();P(e,0)},S=function(){var e=k(c.DomHandler.find(r.current,'[data-pc-section="indicator"]')),n=N();P(n,e.length-1)},E=function(){var e=k(c.DomHandler.find(r.current,'[data-pc-section="indicator"]')),n=e.findIndex((function(e){return!0===c.DomHandler.getAttribute(e,"data-p-highlight")})),t=c.DomHandler.findSingle(r.current,'[data-pc-section="indicator"] > button[tabindex="0"]'),a=e.findIndex((function(e){return e===t.parentElement}));e[a].children[0].tabIndex="-1",e[n].children[0].tabIndex="0"},N=function(){var e=k(c.DomHandler.find(r.current,'[data-pc-section="indicator"]')),n=c.DomHandler.findSingle(r.current,'[data-pc-section="indicator"] > button[tabindex="0"]');return e.findIndex((function(e){return e===n.parentElement}))},P=function(e,n){var t=k(c.DomHandler.find(r.current,'[data-pc-section="indicator"]'));t[e].children[0].tabIndex="-1",t[n].children[0].tabIndex="0",t[n].children[0].focus()};i.useMountEffect((function(){e.autoPlay&&e.startSlideShow()}));var C,D=function(t){var i,r="p-galleria-indicator-"+t,l=e.activeItemIndex===t,c=e.indicator&&e.indicator(t),s=a({className:m("indicator",{isActive:l}),tabIndex:0,"aria-label":(i=t+1,n.ariaLabel("pageLabel",{page:i})),"aria-selected":e.activeIndex===t,"aria-controls":e.id+"_item_"+t,"data-p-highlight":l,onClick:function(){return g(t)},onMouseEnter:function(){return I(t)},onKeyDown:function(e){return x(e,t)}},p("indicator"));return c||(c=h.createElement("button",{tabIndex:e.activeIndex===t?"0":"-1",type:"button",className:"p-link"},h.createElement(o.Ripple,null))),h.createElement("li",v({},s,{key:r}),c)},j=e.itemTemplate&&e.itemTemplate(e.value[e.activeItemIndex]),T=function(){if(e.showItemNavigators){var n=!e.circular&&0===e.activeItemIndex,t=a({className:m("previousItemIcon")},p("previousItemIcon")),i=c.IconUtils.getJSXIcon(e.itemPrevIcon||h.createElement(s.ChevronLeftIcon,t),H({},t),{props:e}),r=a({type:"button",className:m("previousItemButton",{isDisabled:n}),onClick:f,disabled:n,"data-p-disabled":n,"data-pc-group-section":"itemnavigator"},p("previousItemButton"));return h.createElement("button",r,i,h.createElement(o.Ripple,null))}return null}(),A=function(){if(e.showItemNavigators){var n=!e.circular&&e.activeItemIndex===e.value.length-1,t=a({className:m("nextItemIcon")},p("nextItemIcon")),i=c.IconUtils.getJSXIcon(e.itemNextIcon||h.createElement(u.ChevronRightIcon,t),H({},t),{props:e}),r=a({type:"button",className:m("nextItemButton",{isDisabled:n}),onClick:b,disabled:n,"data-p-disabled":n,"data-pc-group-section":"itemnavigator"},p("nextItemButton"));return h.createElement("button",r,i,h.createElement(o.Ripple,null))}return null}(),R=function(){var n=a({className:m("caption")},p("caption"));if(e.caption){var t=e.caption(e.value[e.activeItemIndex]);return h.createElement("div",n,t)}return null}(),U=function(){if(e.showIndicators){for(var n=[],t=a({className:c.classNames(e.indicatorsContentClassName,m("indicators"))},p("indicators")),i=0;i<e.value.length;i++)n.push(D(i));return h.createElement("ul",v({ref:r},t),n)}return null}(),V=a({ref:t,className:m("itemWrapper")},p("itemWrapper")),B=a({className:m("itemContainer")},p("itemContainer")),M=a({className:m("item"),id:e.id+"_item_"+e.activeItemIndex,role:"group","aria-label":(C=e.activeItemIndex+1,n.ariaLabel("slideNumber",{slideNumber:C})),"aria-roledescription":n.localeOption("aria")?n.localeOption("aria").slide:void 0},p("item"));return h.createElement("div",V,h.createElement("div",B,T,h.createElement("div",M,j),A,R),U)})));function U(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);n&&(a=a.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,a)}return t}function V(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?U(Object(t),!0).forEach((function(n){y(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):U(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}R.displayName="GalleriaItem";var B=h.memo((function(e){var t,a=i.useMergeProps(),r=e.ptm,l=e.cx,o=function(n,t){return r(n,V({hostName:e.hostName},t))},s=function(){var n=c.DomHandler.find(e.itemsContainerRef.current,'[data-pc-section="thumbnailitem"]'),t=f();b(t,t+1===n.length?n.length-1:t+1)},u=function(){var e=f();b(e,e-1<=0?0:e-1)},m=function(){var e=f();b(e,0)},p=function(){var n=c.DomHandler.find(e.itemsContainerRef.current,'[data-pc-section="thumbnailitem"]'),t=f();b(t,n.length-1)},d=function(){var n=k(c.DomHandler.find(e.itemsContainerRef.current,'[data-pc-section="thumbnailitem"]')),t=n.findIndex((function(e){return!0===c.DomHandler.getAttribute(e,"data-p-active")})),a=c.DomHandler.findSingle(e.itemsContainerRef.current,'[tabindex="0"]'),i=n.findIndex((function(e){return e===a.parentElement}));n[i].children[0].tabIndex="-1",n[t].children[0].tabIndex="0"},f=function(){var n=k(c.DomHandler.find(e.itemsContainerRef.current,'[data-pc-section="thumbnailitem"]')),t=c.DomHandler.findSingle(e.itemsContainerRef.current,'[data-pc-section="thumbnailitem"] > [tabindex="0"]');return n.findIndex((function(e){return e===t.parentElement}))},b=function(n,t){var a=c.DomHandler.find(e.itemsContainerRef.current,'[data-pc-section="thumbnailitem"]');a[n].children[0].tabIndex="-1",a[t].children[0].tabIndex="0",a[t].children[0].focus()},g=e.template&&e.template(e.item),I=a({className:c.classNames(e.className,l("thumbnailItem",{subProps:e})),role:"tab","data-p-active":e.current,"aria-selected":e.current,"aria-controls":e.containerId+"_item_"+e.index,onKeyDown:function(n){switch("Enter"!==n.code&&"NumpadEnter"!==n.code&&"Space"!==n.code||(e.onItemClick({originalEvent:n,index:e.index}),n.preventDefault()),n.code){case"ArrowRight":s();break;case"ArrowLeft":u();break;case"Home":m(),n.preventDefault();break;case"End":p(),n.preventDefault();break;case"ArrowUp":case"ArrowDown":n.preventDefault();break;case"Tab":d()}},"data-p-galleria-thumbnail-item-current":e.current,"data-p-galleria-thumbnail-item-active":e.active,"data-p-galleria-thumbnail-item-start":e.start,"data-p-galleria-thumbnail-item-end":e.end},o("thumbnailItem")),x=a({className:l("thumbnailItemContent"),tabIndex:e.current?"0":"-1","aria-label":(t=e.index+1,n.ariaLabel("pageLabel",{page:t})),"aria-current":e.current?"page":void 0,onClick:function(n){e.onItemClick({originalEvent:n,index:e.index})}},o("thumbnailItemContent"));return h.createElement("div",v({},I,{key:e.index+"_galleriathumbnailitem"}),h.createElement("div",x,g))})),M=h.memo(h.forwardRef((function(e,t){var a=i.useMergeProps(),r=P(h.useState(e.numVisible),2),l=r[0],d=r[1],f=P(h.useState(0),2),v=f[0],g=f[1],I=h.useRef(null),x=h.useRef(null),y=h.useRef(""),w=h.useRef(null),O=h.useRef(null),S=i.usePrevious(l),E=i.usePrevious(e.activeItemIndex),N=h.useContext(n.PrimeReactContext),C=e.ptm,D=e.cx,j=e.sx,T=function(n,t){return C(n,V({hostName:e.hostName},t))},A=P(i.useResizeListener({listener:function(){K()},when:e.responsiveOptions}),1)[0],H=function(n){var t=v+n;n<0&&-1*t+l>e.value.length-1?t=l-e.value.length:n>0&&t>0&&(t=0),e.circular&&(n<0&&e.value.length-1===e.activeItemIndex?t=0:n>0&&0===e.activeItemIndex&&(t=l-e.value.length)),I.current&&(c.DomHandler.removeClass(I.current,"p-items-hidden"),I.current.style.transform=e.isVertical?"translate3d(0, ".concat(t*(100/l),"%, 0)"):"translate3d(".concat(t*(100/l),"%, 0, 0)"),I.current.style.transition="transform 500ms ease 0s"),g(t)},R=function(){e.slideShowActive&&e.stopSlideShow&&e.stopSlideShow()},U=function(){var e=Math.floor(l/2);return l%2?e:e-1},M=function(n){R();var t=0!==e.activeItemIndex?e.activeItemIndex-1:0;l-(t+v)-1>U()&&(-1*v!=0||e.circular)&&H(1),e.onActiveItemChange({index:e.circular&&0===e.activeItemIndex?e.value.length-1:t}),n.cancelable&&n.preventDefault()},_=function(n){R();var t=e.activeItemIndex+1;t+v>U()&&(-1*v<Z()-1||e.circular)&&H(-1),e.onActiveItemChange({index:e.circular&&e.value.length-1===e.activeItemIndex?0:t}),n.cancelable&&n.preventDefault()},q=function(n){R();var t=n.index;if(t!==e.activeItemIndex){var a=t+v,i=0;t<e.activeItemIndex?(i=l-a-1-U())>0&&-1*v!=0&&H(i):(i=U()-a)<0&&-1*v<Z()-1&&H(i),e.onActiveItemChange({index:t})}},L=function(n){I.current&&"transform"===n.propertyName&&(document.body.setAttribute("data-p-items-hidden","false"),!e.isUnstyled()&&c.DomHandler.addClass(I.current,"p-items-hidden"),I.current.style.transition="")},G=function(e){var n=e.changedTouches[0];x.current={x:n.pageX,y:n.pageY}},z=function(e){e.cancelable&&e.preventDefault()},W=function(n){var t=n.changedTouches[0];X(n,e.isVertical?t.pageY-x.current.y:t.pageX-x.current.x)},X=function(e,n){n<0?_(e):M(e)},Z=function(){return e.value.length>l?e.value.length-l+1:0},J=function(){w.current||(w.current=c.DomHandler.createInlineStyle(N&&N.nonce||b.default.nonce,N&&N.styleContainer));var n='\n [data-pc-section="thumbnailitems"]['.concat(y.current,'] {\n [data-pc-section="thumbnailitem"] {\n flex: 1 0 ').concat(100/l,"%\n }\n } \n ");if(e.responsiveOptions){var t=c.ObjectUtils.localeComparator(N&&N.locale||b.default.locale);O.current=k(e.responsiveOptions),O.current.sort((function(e,n){return c.ObjectUtils.sort(e.breakpoint,n.breakpoint,-1,t,N&&N.nullSortOrder||b.default.nullSortOrder)}));for(var a=0;a<O.current.length;a++){var i=O.current[a];n+="\n @media screen and (max-width: ".concat(i.breakpoint,') {\n [data-pc-section="thumbnailitems"][').concat(y.current,'] {\n [data-pc-section="thumbnailitem"] {\n flex: 1 0 ').concat(100/i.numVisible,"%\n }\n } \n }\n ")}}w.current.innerHTML=n},K=function(){if(I.current&&O.current){for(var n=window.innerWidth,t={numVisible:e.numVisible},a=0;a<O.current.length;a++){var i=O.current[a];parseInt(i.breakpoint,10)>=n&&(t=i)}l!==t.numVisible&&d(t.numVisible)}};i.useMountEffect((function(){I.current&&(y.current=c.UniqueComponentId(),I.current.setAttribute(y.current,"")),J(),K(),A()})),i.useUpdateEffect((function(){var n=v;S===l&&E===e.activeItemIndex||((n=e.activeItemIndex<=U()?0:e.value.length-l+U()<e.activeItemIndex?l-e.value.length:e.value.length-l<e.activeItemIndex&&l%2==0?-1*e.activeItemIndex+U()+1:-1*e.activeItemIndex+U())!==v&&g(n),I.current.style.transform=e.isVertical?"translate3d(0, ".concat(n*(100/l),"%, 0)"):"translate3d(".concat(n*(100/l),"%, 0, 0)"),E!==e.activeItemIndex&&(document.body.setAttribute("data-p-items-hidden","false"),!e.isUnstyled()&&c.DomHandler.removeClass(I.current,"p-items-hidden"),I.current.style.transition="transform 500ms ease 0s"))}));var Y,F,$,Q,ee,ne,te,ae=function(){if(e.showThumbnailNavigators){var t=!e.circular&&0===e.activeItemIndex||e.value.length<=l,i=a({className:D("previousThumbnailIcon")},T("previousThumbnailIcon")),r=c.IconUtils.getJSXIcon(e.isVertical?e.prevThumbnailIcon||h.createElement(p.ChevronUpIcon,i):e.prevThumbnailIcon||h.createElement(s.ChevronLeftIcon,i),V({},i),{props:e}),u=a({className:D("previousThumbnailButton",{isDisabled:t}),onClick:M,type:"button",disabled:t,"data-p-disabled":t,"aria-label":n.localeOption("aria")?n.localeOption("aria").previousPageLabel:void 0,"data-pc-group-section":"thumbnailnavigator"},T("previousThumbnailButton"));return h.createElement("button",u,r,h.createElement(o.Ripple,null))}return null},ie=function(){if(e.showThumbnailNavigators){var t=!e.circular&&e.activeItemIndex===e.value.length-1||e.value.length<=l,i=a({className:D("nextThumbnailIcon")},T("nextThumbnailIcon")),r=c.IconUtils.getJSXIcon(e.isVertical?e.nextThumbnailIcon||h.createElement(m.ChevronDownIcon,i):e.nextThumbnailIcon||h.createElement(u.ChevronRightIcon,i),V({},i),{props:e}),s=a({className:D("nextThumbnailButton",{isDisabled:t}),disabled:t,type:"button","aria-label":n.localeOption("aria")?n.localeOption("aria").nextPageLabel:void 0,onClick:_,"data-p-disabled":t,"data-pc-group-section":"thumbnailnavigator"},T("nextThumbnailButton"));return h.createElement("button",s,r,h.createElement(o.Ripple,null))}return null},re=(Y=e.value.map((function(n,t){var a=-1*v,i=a+l-1;return h.createElement(B,{key:t,index:t,containerId:e.containerId,itemsContainerRef:I,template:e.itemTemplate,item:n,active:a<=t&&i>=t,start:a===t,end:i===t,onItemClick:q,current:e.activeItemIndex===t,ptm:C,cx:D,sx:j})})),F=e.isVertical?e.contentHeight:"",$=ae(),Q=ie(),ee=a({className:D("thumbnailContainer")},T("thumbnailContainer")),ne=a({className:D("thumbnailItemsContainer"),style:j("thumbnailItemsContainer",{height:F})},T("thumbnailItemsContainer")),te=a({ref:I,className:D("thumbnailItems"),role:"tablist",onTransitionEnd:L,onTouchStart:G,onTouchMove:z,onTouchEnd:W},T("thumbnailItems")),h.createElement("div",ee,$,h.createElement("div",ne,h.createElement("div",te,Y)),Q)),le=a({className:D("thumbnailWrapper")},T("thumbnailWrapper"));return h.createElement("div",le,re)})));function _(e,n){var t=Object.keys(e);if(Object.getOwnPropertySymbols){var a=Object.getOwnPropertySymbols(e);n&&(a=a.filter((function(n){return Object.getOwnPropertyDescriptor(e,n).enumerable}))),t.push.apply(t,a)}return t}function q(e){for(var n=1;n<arguments.length;n++){var t=null!=arguments[n]?arguments[n]:{};n%2?_(Object(t),!0).forEach((function(n){y(e,n,t[n])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(t)):_(Object(t)).forEach((function(n){Object.defineProperty(e,n,Object.getOwnPropertyDescriptor(t,n))}))}return e}B.displayName="GalleriaThumbnailItem",M.displayName="GalleriaThumbnails";var L=h.memo(h.forwardRef((function(e,s){var u=i.useMergeProps(),m=h.useContext(n.PrimeReactContext),p=C.getProps(e,m),d=P(h.useState(!1),2),f=d[0],g=d[1],I=P(h.useState(p.numVisible),2),x=I[0],y=I[1],w=P(h.useState(!1),2),O=w[0],S=w[1],E=P(h.useState(p.activeIndex),2),N=E[0],D=E[1],j=h.useRef(null),T=h.useRef(null),k=h.useRef(null),A=p.onItemChange?p.activeIndex:N,H="left"===p.thumbnailsPosition||"right"===p.thumbnailsPosition,U=p.id||c.UniqueComponentId(),V=C.setMetaData({props:p,state:{visible:f,numVisible:x,slideShowActive:O,activeIndex:N}}),B=V.ptm,_=V.cx,L=V.sx,G=V.isUnstyled;t.useHandleStyle(C.css.styles,G,{name:"galleria"}),i.useGlobalOnEscapeKey({callback:function(){X()},when:p.closeOnEscape&&p.fullScreen,priority:[i.ESC_KEY_HANDLING_PRIORITIES.IMAGE,0]}),i.useInterval((function(){z({index:p.circular&&p.value.length-1===A?0:A+1})}),p.transitionInterval,O);var z=function(e){e.index>=p.value.length?ee():p.onItemChange?p.onItemChange(e):D(e.index)},W=function(){g(!0)},X=function(){g(!1)},Z=function(){c.DomHandler.blockBodyScroll()},J=function(){c.ZIndexUtils.set("modal",k.current,m&&m.autoZIndex||b.default.autoZIndex,p.baseZIndex||m&&m.zIndex.modal||b.default.zIndex.modal),!G()&&c.DomHandler.addMultipleClasses(k.current,"p-component-overlay p-component-overlay-enter")},K=function(){p.onShow&&p.onShow()},Y=function(){c.DomHandler.unblockBodyScroll(),!G()&&c.DomHandler.addClass(k.current,"p-component-overlay-leave")},F=function(){c.ZIndexUtils.clear(k.current),p.onHide&&p.onHide()},$=function(){return O},Q=function(){S(!0)},ee=function(){S(!1)},ne=function(e,n){var t=["top","left","bottom","right"].find((function(e){return e===n}));return t?"".concat(e,"-").concat(t):""};h.useEffect((function(){p.value&&p.value.length<x&&y(p.value.length)}),[p.value,x]),h.useEffect((function(){y(p.numVisible)}),[p.numVisible]),i.useUnmountEffect((function(){O&&ee(),c.ZIndexUtils.clear(k.current)})),h.useImperativeHandle(s,(function(){return{props:p,show:W,hide:X,isAutoPlayActive:$,startSlideShow:Q,stopSlideShow:ee,getElement:function(){return j.current},getPreviewContent:function(){return T.current}}}));return c.ObjectUtils.isNotEmpty(p.value)&&function(){var e,t,i,s,d,b,g,I,y,w,S,E,N=(i=p.showThumbnails&&ne("p-galleria-thumbnails",p.thumbnailsPosition),s=p.showIndicators&&ne("p-galleria-indicators",p.indicatorsPosition),d=u({className:_("closeIcon"),"aria-hidden":!0},B("closeIcon")),b=c.IconUtils.getJSXIcon(p.closeIcon||h.createElement(r.TimesIcon,d),q({},d),{props:p}),g=u({type:"button",className:_("closeButton"),"aria-label":n.localeOption("aria")?n.localeOption("aria").close:void 0,onClick:X},B("closeButton")),I=p.fullScreen&&h.createElement("button",g,b,h.createElement(o.Ripple,null)),e=u({className:_("header")},B("header")),y=p.header?h.createElement("div",e,p.header):null,t=u({className:_("footer")},B("footer")),w=p.footer?h.createElement("div",t,p.footer):null,S=u({ref:j,id:U,className:c.classNames(p.className,_("root",{context:m,thumbnailsPosClassName:i,indicatorPosClassName:s})),style:p.style,role:"region"},C.getOtherProps(p),B("root")),E=u({className:_("content"),"aria-live":p.autoPlay?"polite":"off"},B("content")),h.createElement("div",S,I,y,h.createElement("div",E,h.createElement(R,{hostName:"Galleria",ref:T,id:U,value:p.value,activeItemIndex:A,onActiveItemChange:z,itemTemplate:p.item,circular:p.circular,caption:p.caption,showIndicators:p.showIndicators,itemPrevIcon:p.itemPrevIcon,itemNextIcon:p.itemNextIcon,changeItemOnIndicatorHover:p.changeItemOnIndicatorHover,indicator:p.indicator,showItemNavigators:p.showItemNavigators,autoPlay:p.autoPlay,slideShowActive:O,startSlideShow:Q,stopSlideShow:ee,ptm:B,cx:_}),p.showThumbnails&&h.createElement(M,{hostName:"Galleria",value:p.value,containerId:U,activeItemIndex:A,onActiveItemChange:z,itemTemplate:p.thumbnail,numVisible:x,nextThumbnailIcon:p.nextThumbnailIcon,prevThumbnailIcon:p.prevThumbnailIcon,responsiveOptions:p.responsiveOptions,circular:p.circular,isVertical:H,contentHeight:p.verticalThumbnailViewPortHeight,showThumbnailNavigators:p.showThumbnailNavigators,autoPlay:p.autoPlay,slideShowActive:O,stopSlideShow:ee,isUnstyled:G,ptm:B,cx:_,sx:L})),w));if(p.fullScreen){var P=u({className:_("mask",{visibleState:f}),role:"dialog","aria-modal":"true"},B("mask")),D=u({classNames:_("transition"),in:f,timeout:{enter:150,exit:150},options:p.transitionOptions,unmountOnExit:!0,onEnter:Z,onEntering:J,onEntered:K,onExit:Y,onExited:F},B("transition")),V=h.createElement("div",v({ref:k},P),h.createElement(a.CSSTransition,v({nodeRef:j},D),N));return h.createElement(l.Portal,{element:V})}return N}()})));L.displayName="Galleria",exports.Galleria=L;