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) • 4.61 kB
JavaScript
Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("primereact/hooks"),t=require("primereact/utils");function n(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(t){if("default"!==t){var n=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(r,t,n.get?n:{enumerable:!0,get:function(){return e[t]}})}})),r.default=e,Object.freeze(r)}var l=n(e);function c(){return c=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var t=arguments[r];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&(e[n]=t[n])}return e},c.apply(this,arguments)}var u={defaultProps:{__TYPE:"ScrollPanel",id:null,style:null,className:null,children:void 0},getProps:function(e){return t.ObjectUtils.getMergedProps(e,u.defaultProps)},getOtherProps:function(e){return t.ObjectUtils.getDiffProps(e,u.defaultProps)}},o=l.forwardRef((function(e,n){var o=u.getProps(e),a=l.useRef(null),s=l.useRef(null),i=l.useRef(null),d=l.useRef(null),p=l.useRef(!1),m=l.useRef(!1),f=l.useRef(null),g=l.useRef(null),h=l.useRef(null),v=l.useRef(null),b=l.useRef(null),H=l.useRef(!1),y=function(){var e=s.current.scrollWidth,r=-1*(a.current.clientHeight-i.current.clientHeight);h.current=s.current.clientWidth/e;var n=s.current.scrollHeight,l=-1*(a.current.clientWidth-d.current.clientWidth);v.current=s.current.clientHeight/n,b.current=window.requestAnimationFrame((function(){h.current>=1?t.DomHandler.addClass(i.current,"p-scrollpanel-hidden"):(t.DomHandler.removeClass(i.current,"p-scrollpanel-hidden"),i.current.style.cssText="width:"+Math.max(100*h.current,10)+"%; left:"+s.current.scrollLeft/e*100+"%;bottom:"+r+"px;"),v.current>=1?t.DomHandler.addClass(d.current,"p-scrollpanel-hidden"):(t.DomHandler.removeClass(d.current,"p-scrollpanel-hidden"),d.current.style.cssText="height:"+Math.max(100*v.current,10)+"%; top: calc("+s.current.scrollTop/n*100+"% - "+i.current.clientHeight+"px);right:"+l+"px;")}))},w=function(e){p.current?E(e):(m.current||E(e),D(e))},E=function(e){var r=e.pageX-f.current;f.current=e.pageX,b.current=window.requestAnimationFrame((function(){s.current.scrollLeft+=r/h.current}))},D=function(e){var r=e.pageY-g.current;g.current=e.pageY,b.current=window.requestAnimationFrame((function(){s.current.scrollTop+=r/v.current}))},P=function e(r){t.DomHandler.removeClass(d.current,"p-scrollpanel-grabbed"),t.DomHandler.removeClass(i.current,"p-scrollpanel-grabbed"),t.DomHandler.removeClass(document.body,"p-scrollpanel-grabbed"),document.removeEventListener("mousemove",w),document.removeEventListener("mouseup",e),p.current=!1,m.current=!1},O=function(){y()};r.useMountEffect((function(){var e,r,n;y(),window.addEventListener("resize",y),e=getComputedStyle(a.current),r=getComputedStyle(i.current),n=t.DomHandler.getHeight(a.current)-parseInt(r.height,10),"none"!==e["max-height"]&&0===n&&(a.current.style.height=s.current.offsetHeight+parseInt(r.height,10)>parseInt(e["max-height"],10)?e["max-height"]:s.current.offsetHeight+parseFloat(e.paddingTop)+parseFloat(e.paddingBottom)+parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth)+"px"),H.current=!0})),r.useUnmountEffect((function(){H.current&&window.removeEventListener("resize",y),b.current&&window.cancelAnimationFrame(b.current)})),l.useImperativeHandle(n,(function(){return{props:o,refresh:O,getElement:function(){return a.current},getContent:function(){return s.current},getXBar:function(){return i.current},getYBar:function(){return d.current}}}));var x=u.getOtherProps(o),C=t.classNames("p-scrollpanel p-component",o.className);return l.createElement("div",c({ref:a,id:o.id,className:C,style:o.style},x),l.createElement("div",{className:"p-scrollpanel-wrapper"},l.createElement("div",{ref:s,className:"p-scrollpanel-content",onScroll:y,onMouseEnter:y},o.children)),l.createElement("div",{ref:i,className:"p-scrollpanel-bar p-scrollpanel-bar-x",onMouseDown:function(e){p.current=!0,f.current=e.pageX,t.DomHandler.addClass(i.current,"p-scrollpanel-grabbed"),t.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",w),document.addEventListener("mouseup",P),e.preventDefault()}}),l.createElement("div",{ref:d,className:"p-scrollpanel-bar p-scrollpanel-bar-y",onMouseDown:function(e){m.current=!0,g.current=e.pageY,t.DomHandler.addClass(d.current,"p-scrollpanel-grabbed"),t.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",w),document.addEventListener("mouseup",P),e.preventDefault()}}))}));o.displayName="ScrollPanel",exports.ScrollPanel=o;
;