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) • 10.3 kB
JavaScript
;Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),r=require("primereact/hooks"),n=require("primereact/ripple"),a=require("primereact/utils");function l(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(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var c=u(e),o=l(t);function i(){return i=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},i.apply(this,arguments)}function s(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function p(e){if(Array.isArray(e))return s(e)}function m(e){if("undefined"!=typeof Symbol&&null!=e[Symbol.iterator]||null!=e["@@iterator"])return Array.from(e)}function f(e,t){if(e){if("string"==typeof e)return s(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?s(e,t):void 0}}function v(){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 d(e){if(Array.isArray(e))return e}function h(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,a,l,u,c=[],o=!0,i=!1;try{if(l=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;o=!1}else for(;!(o=(n=l.call(r)).done)&&(c.push(n.value),c.length!==t);o=!0);}catch(e){i=!0,a=e}finally{try{if(!o&&null!=r.return&&(u=r.return(),Object(u)!==u))return}finally{if(i)throw a}}return c}}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 b(e,t){return d(e)||h(e,t)||f(e,t)||g()}var y={defaultProps:{__TYPE:"Carousel",id:null,value:null,page:0,header:null,footer:null,style:null,className:null,itemTemplate:null,circular:!1,showIndicators:!0,showNavigators:!0,autoplayInterval:0,numVisible:1,numScroll:1,responsiveOptions:null,orientation:"horizontal",verticalViewPortHeight:"300px",contentClassName:null,containerClassName:null,indicatorsContentClassName:null,onPageChange:null,children:void 0},getProps:function(e){return a.ObjectUtils.getMergedProps(e,y.defaultProps)},getOtherProps:function(e){return a.ObjectUtils.getDiffProps(e,y.defaultProps)}},N=c.memo((function(e){var t=e.template(e.item),r=a.classNames(e.className,"p-carousel-item",{"p-carousel-item-active":e.active,"p-carousel-item-start":e.start,"p-carousel-item-end":e.end});return c.createElement("div",{className:r},t)})),E=c.memo(c.forwardRef((function(e,l){var u=y.getProps(e),s=b(c.useState(u.numVisible),2),d=s[0],h=s[1],g=b(c.useState(u.numScroll),2),E=g[0],P=g[1],C=b(c.useState(u.page*u.numScroll*-1),2),O=C[0],S=C[1],w=b(c.useState(u.page),2),I=w[0],j=w[1],k=c.useRef(null),R=c.useRef(null),T=c.useRef(0),x=c.useRef(!!u.autoplayInterval),M=c.useRef(""),A=c.useRef(20),V=c.useRef(null),D=c.useRef(null),L=c.useRef(null),_=c.useRef(!1),H=c.useRef(null),U=r.usePrevious(E),q=r.usePrevious(d),z=r.usePrevious(u.value),Y=r.usePrevious(u.page),X="vertical"===u.orientation,F=u.circular||!!u.autoplayInterval,W=F&&u.value&&u.value.length>=d,$=u.onPageChange?u.page:I,B=u.value?Math.max(Math.ceil((u.value.length-d)/E)+1,0):0,G=B&&u.autoplayInterval&&x.current,J=b(r.useResizeListener({listener:function(){Q()},when:u.responsiveOptions}),1)[0],K=function(e,t){var r=O;null!=t?(r=E*t*-1,W&&(r-=d),_.current=!1):(r+=E*e,_.current&&(r+=T.current-E*e,_.current=!1),t=Math.abs(Math.floor((W?r+d:r)/E)));W&&I===B-1&&-1===e?(r=-1*(u.value.length+d),t=0):W&&0===I&&1===e?(r=0,t=B-1):t===B-1&&T.current>0&&(r+=-1*T.current-E*e,_.current=!0),R.current&&(a.DomHandler.removeClass(R.current,"p-items-hidden"),ie(r),R.current.style.transition="transform 500ms ease 0s"),u.onPageChange?(S(r),u.onPageChange({page:t})):(j(t),S(r))},Q=function(){if(R.current&&H.current){for(var e=window.innerWidth,t={numVisible:u.numVisible,numScroll:u.numScroll},r=0;r<H.current.length;r++){var n=H.current[r];parseInt(n.breakpoint,10)>=e&&(t=n)}if(E!==t.numScroll){var a=Math.floor($*E/t.numScroll),l=t.numScroll*a*-1;W&&(l-=t.numVisible),S(l),P(t.numScroll),u.onPageChange?u.onPageChange({page:a}):j(a)}d!==t.numVisible&&h(t.numVisible)}},Z=function(e,t){(F||0!==$)&&K(1,t),x.current=!1,e.cancelable&&e.preventDefault()},ee=function(e,t){(F||$<B-1)&&K(-1,t),x.current=!1,e.cancelable&&e.preventDefault()},te=function(e,t){t>$?ee(e,t):t<$&&Z(e,t)},re=function(e){R.current&&"transform"===e.propertyName&&(a.DomHandler.addClass(R.current,"p-items-hidden"),R.current.style.transition="",0!==I&&I!==B-1||!W||ie(O))},ne=function(e){var t=e.changedTouches[0];V.current={x:t.pageX,y:t.pageY}},ae=function(e){e.cancelable&&e.preventDefault()},le=function(e){var t=e.changedTouches[0];ue(e,X?t.pageY-V.current.y:t.pageX-V.current.x)},ue=function(e,t){Math.abs(t)>A&&(t<0?ee(e):Z(e))},ce=function(){D.current&&clearInterval(D.current)},oe=function(){L.current||(L.current=a.DomHandler.createInlineStyle(o.default.nonce));var e,t="\n .p-carousel[".concat(M.current,"] .p-carousel-item {\n flex: 1 0 ").concat(100/d,"%\n }\n ");if(u.responsiveOptions){H.current=p(e=u.responsiveOptions)||m(e)||f(e)||v(),H.current.sort((function(e,t){return a.ObjectUtils.sort(e.breakpoint,t.breakpoint,-1,o.default.locale,o.default.nullSortOrder)}));for(var r=0;r<H.current.length;r++){var n=H.current[r];t+="\n @media screen and (max-width: ".concat(n.breakpoint,") {\n .p-carousel[").concat(M.current,"] .p-carousel-item {\n flex: 1 0 ").concat(100/n.numVisible,"%\n }\n }\n ")}}L.current.innerHTML=t},ie=function(e){R.current&&(R.current.style.transform=X?"translate3d(0, ".concat(e*(100/d),"%, 0)"):"translate3d(".concat(e*(100/d),"%, 0, 0)"))};c.useImperativeHandle(l,(function(){return{props:u,getElement:function(){return k.current}}})),r.useMountEffect((function(){k.current&&(M.current=a.UniqueComponentId(),k.current.setAttribute(M.current,"")),oe(),Q(),ie(O),J()})),r.useUpdateEffect((function(){var e=!1,t=O;if(u.autoplayInterval&&ce(),U!==E||q!==d||u.value&&z&&z.length!==u.value.length){T.current=(u.value.length-d)%E;var r=$;0!==B&&r>=B&&(r=B-1,u.onPageChange?u.onPageChange({page:r}):j(r),e=!0),t=r*E*-1,W&&(t-=d),r===B-1&&T.current>0?(t+=-1*T.current+E,_.current=!0):_.current=!1,t!==O&&(S(t),e=!0),ie(t)}W&&(0===I?t=-1*d:0===t&&(t=-1*u.value.length,T.current>0&&(_.current=!0)),t!==O&&(S(t),e=!0)),Y!==u.page&&(u.page>Y&&u.page<=B-1?K(-1,u.page):u.page<Y&&K(1,u.page)),!e&&G&&(D.current=setInterval((function(){K(-1,I===B-1?0:I+1)}),u.autoplayInterval))})),r.useUnmountEffect((function(){u.autoplayInterval&&ce()}));var se=function(){if(u.value&&u.value.length){var e=null,t=null;if(W){var r=null;e=(r=u.value.slice(-1*d)).map((function(e,t){return c.createElement(N,{key:t+"_scloned",className:"p-carousel-item-cloned",template:u.itemTemplate,item:e,active:-1*O===u.value.length+d,start:0===t,end:t===r.length-1})})),t=(r=u.value.slice(0,d)).map((function(e,t){return c.createElement(N,{key:t+"_fcloned",className:"p-carousel-item-cloned",template:u.itemTemplate,item:e,active:0===O,start:0===t,end:t===r.length-1})}))}var n=u.value.map((function(e,t){var r=W?-1*(O+d):-1*O,n=r+d-1;return c.createElement(N,{key:t,template:u.itemTemplate,item:e,active:r<=t&&n>=t,start:r===t,end:n===t})}));return c.createElement(c.Fragment,null,e,n,t)}},pe=function(){if(u.showNavigators){var e=(!F||u.value&&u.value.length<d)&&0===$,r=a.classNames("p-carousel-prev p-link",{"p-disabled":e}),l=a.classNames("p-carousel-prev-icon pi",{"pi-chevron-left":!X,"pi-chevron-up":X});return c.createElement("button",{type:"button",className:r,onClick:Z,disabled:e,"aria-label":t.ariaLabel("previousPageLabel")},c.createElement("span",{className:l}),c.createElement(n.Ripple,null))}return null},me=function(){if(u.showNavigators){var e=(!F||u.value&&u.value.length<d)&&($===B-1||0===B),r=a.classNames("p-carousel-next p-link",{"p-disabled":e}),l=a.classNames("p-carousel-next-icon pi",{"pi-chevron-right":!X,"pi-chevron-down":X});return c.createElement("button",{type:"button",className:r,onClick:ee,disabled:e,"aria-label":t.ariaLabel("nextPageLabel")},c.createElement("span",{className:l}),c.createElement(n.Ripple,null))}return null},fe=function(e){var r="carousel-indicator-"+e,l=a.classNames("p-carousel-indicator",{"p-highlight":$===e});return c.createElement("li",{key:r,className:l},c.createElement("button",{type:"button",className:"p-link",onClick:function(t){return te(t,e)},"aria-label":"".concat(t.ariaLabel("pageLabel")," ").concat(e+1)},c.createElement(n.Ripple,null)))},ve=y.getOtherProps(u),de=a.classNames("p-carousel p-component",{"p-carousel-vertical":X,"p-carousel-horizontal":!X},u.className),he=a.classNames("p-carousel-content",u.contentClassName),ge=function(){var e=se(),t=X?u.verticalViewPortHeight:"auto",r=pe(),n=me(),l=a.classNames("p-carousel-container",u.containerClassName);return c.createElement("div",{className:l},r,c.createElement("div",{className:"p-carousel-items-content",style:{height:t},onTouchStart:ne,onTouchMove:ae,onTouchEnd:le},c.createElement("div",{ref:R,className:"p-carousel-items-container",onTransitionEnd:re},e)),n)}(),be=function(){if(u.showIndicators){for(var e=a.classNames("p-carousel-indicators p-reset",u.indicatorsContentClassName),t=[],r=0;r<B;r++)t.push(fe(r));return c.createElement("ul",{className:e},t)}return null}(),ye=u.header?c.createElement("div",{className:"p-carousel-header"},u.header):null,Ne=u.footer?c.createElement("div",{className:"p-carousel-footer"},u.footer):null;return c.createElement("div",i({ref:k,id:u.id,className:de,style:u.style},ve),ye,c.createElement("div",{className:he},ge,be),Ne)})));N.displayName="CarouselItem",E.displayName="Carousel",exports.Carousel=E;