primereact 10.0.2 → 10.0.3

package/scrollpanel/scrollpanel.cjs.js

@@ -10,25 +10,40 @@ var utils = require('primereact/utils');
 var componentbase = require('primereact/componentbase');
 
 function _interopNamespace(e) {
-    if (e && e.__esModule) return e;
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
         });
-    }
-    n["default"] = e;
-    return Object.freeze(n);
+      }
+    });
+  }
+  n["default"] = e;
+  return Object.freeze(n);
 }
 
 var React__namespace = /*#__PURE__*/_interopNamespace(React);
 
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+
 var ScrollPanelBase = componentbase.ComponentBase.extend({
   defaultProps: {
     __TYPE: 'ScrollPanel',
@@ -48,7 +63,7 @@ var ScrollPanelBase = componentbase.ComponentBase.extend({
       barx: 'p-scrollpanel-bar p-scrollpanel-bar-x',
       bary: 'p-scrollpanel-bar p-scrollpanel-bar-y'
     },
-    styles: "\n        @layer primereact {\n            .p-scrollpanel-wrapper {\n                overflow: hidden;\n                width: 100%;\n                height: 100%;\n                position: relative;\n                z-index: 1;\n                float: left;\n            }\n            \n            .p-scrollpanel-content {\n                height: calc(100% + 18px);\n                width: calc(100% + 18px);\n                padding: 0 18px 18px 0;\n                position: relative;\n                overflow: hidden;\n                box-sizing: border-box;\n            }\n            \n            .p-scrollpanel-bar {\n                position: relative;\n                background: #c1c1c1;\n                border-radius: 3px;\n                z-index: 2;\n                cursor: pointer;\n                opacity: 0;\n                transition: opacity 0.25s linear;\n            }\n            \n            .p-scrollpanel-bar-y {\n                width: 9px;\n                top: 0;\n            }\n            \n            .p-scrollpanel-bar-x {\n                height: 9px;\n                bottom: 0;\n            }\n            \n            .p-scrollpanel-hidden {\n                visibility: hidden;\n            }\n            \n            .p-scrollpanel:hover .p-scrollpanel-bar,\n            .p-scrollpanel:active .p-scrollpanel-bar {\n                opacity: 1;\n            }\n            \n            .p-scrollpanel-grabbed {\n                user-select: none;\n            }\n        }\n        "
+    styles: "\n        @layer primereact {\n            .p-scrollpanel-wrapper {\n                overflow: hidden;\n                width: 100%;\n                height: 100%;\n                position: relative;\n                z-index: 1;\n                float: left;\n            }\n            \n            .p-scrollpanel-content {\n                height: calc(100% + 18px);\n                width: calc(100% + 18px);\n                padding: 0 18px 18px 0;\n                position: relative;\n                overflow: auto;\n                box-sizing: border-box;\n            }\n            \n            .p-scrollpanel-bar {\n                position: relative;\n                background: #c1c1c1;\n                border-radius: 3px;\n                z-index: 2;\n                cursor: pointer;\n                opacity: 0;\n                transition: opacity 0.25s linear;\n            }\n            \n            .p-scrollpanel-bar-y {\n                width: 9px;\n                top: 0;\n            }\n            \n            .p-scrollpanel-bar-x {\n                height: 9px;\n                bottom: 0;\n            }\n            \n            .p-scrollpanel-hidden {\n                visibility: hidden;\n            }\n            \n            .p-scrollpanel:hover .p-scrollpanel-bar,\n            .p-scrollpanel:active .p-scrollpanel-bar {\n                opacity: 1;\n            }\n            \n            .p-scrollpanel-grabbed {\n                user-select: none;\n            }\n        }\n        "
   }
 });
 
@@ -212,7 +227,6 @@ var ScrollPanel = /*#__PURE__*/React__namespace.forwardRef(function (inProps, re
   }, ptm('wrapper'));
   var contentProps = utils.mergeProps({
     className: cx('content'),
-    ref: contentRef,
     onScroll: moveBar,
     onMouseEnter: moveBar
   }, ptm('content'));
@@ -226,7 +240,9 @@ var ScrollPanel = /*#__PURE__*/React__namespace.forwardRef(function (inProps, re
     className: cx('bary'),
     onMouseDown: onYBarMouseDown
   }, ptm('bary'));
-  return /*#__PURE__*/React__namespace.createElement("div", rootProps, /*#__PURE__*/React__namespace.createElement("div", wrapperProps, /*#__PURE__*/React__namespace.createElement("div", contentProps, props.children)), /*#__PURE__*/React__namespace.createElement("div", barXProps), /*#__PURE__*/React__namespace.createElement("div", barYProps));
+  return /*#__PURE__*/React__namespace.createElement("div", rootProps, /*#__PURE__*/React__namespace.createElement("div", wrapperProps, /*#__PURE__*/React__namespace.createElement("div", _extends({
+    ref: contentRef
+  }, contentProps), props.children)), /*#__PURE__*/React__namespace.createElement("div", barXProps), /*#__PURE__*/React__namespace.createElement("div", barYProps));
 });
 ScrollPanel.displayName = 'ScrollPanel';
 

package/scrollpanel/scrollpanel.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("primereact/api"),n=require("primereact/hooks"),t=require("primereact/utils"),l=require("primereact/componentbase");function o(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var t=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,t.get?t:{enumerable:!0,get:function(){return e[n]}})}})),r.default=e,Object.freeze(r)}var a=o(e),c=l.ComponentBase.extend({defaultProps:{__TYPE:"ScrollPanel",id:null,style:null,className:null,children:void 0},css:{classes:{root:function(e){return t.classNames("p-scrollpanel p-component",e.props.className)},wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"},styles:"\n        @layer primereact {\n            .p-scrollpanel-wrapper {\n                overflow: hidden;\n                width: 100%;\n                height: 100%;\n                position: relative;\n                z-index: 1;\n                float: left;\n            }\n            \n            .p-scrollpanel-content {\n                height: calc(100% + 18px);\n                width: calc(100% + 18px);\n                padding: 0 18px 18px 0;\n                position: relative;\n                overflow: hidden;\n                box-sizing: border-box;\n            }\n            \n            .p-scrollpanel-bar {\n                position: relative;\n                background: #c1c1c1;\n                border-radius: 3px;\n                z-index: 2;\n                cursor: pointer;\n                opacity: 0;\n                transition: opacity 0.25s linear;\n            }\n            \n            .p-scrollpanel-bar-y {\n                width: 9px;\n                top: 0;\n            }\n            \n            .p-scrollpanel-bar-x {\n                height: 9px;\n                bottom: 0;\n            }\n            \n            .p-scrollpanel-hidden {\n                visibility: hidden;\n            }\n            \n            .p-scrollpanel:hover .p-scrollpanel-bar,\n            .p-scrollpanel:active .p-scrollpanel-bar {\n                opacity: 1;\n            }\n            \n            .p-scrollpanel-grabbed {\n                user-select: none;\n            }\n        }\n        "}}),s=a.forwardRef((function(e,o){var s=a.useContext(r.PrimeReactContext),u=c.getProps(e,s),i=c.setMetaData({props:u}),p=i.ptm,d=i.cx;l.useHandleStyle(c.css.styles,i.isUnstyled,{name:"scrollpanel"});var m=a.useRef(null),f=a.useRef(null),h=a.useRef(null),g=a.useRef(null),b=a.useRef(!1),v=a.useRef(!1),x=a.useRef(null),y=a.useRef(null),w=a.useRef(null),H=a.useRef(null),E=a.useRef(null),D=a.useRef(!1),C=function(){var e=f.current.scrollWidth,r=-1*(m.current.clientHeight-h.current.clientHeight);w.current=f.current.clientWidth/e;var n=f.current.scrollHeight,l=-1*(m.current.clientWidth-g.current.clientWidth);H.current=f.current.clientHeight/n,E.current=window.requestAnimationFrame((function(){w.current>=1?t.DomHandler.addClass(h.current,"p-scrollpanel-hidden"):(t.DomHandler.removeClass(h.current,"p-scrollpanel-hidden"),h.current.style.cssText="width:"+Math.max(100*w.current,10)+"%; left:"+f.current.scrollLeft/e*100+"%;bottom:"+r+"px;"),H.current>=1?t.DomHandler.addClass(g.current,"p-scrollpanel-hidden"):(t.DomHandler.removeClass(g.current,"p-scrollpanel-hidden"),g.current.style.cssText="height:"+Math.max(100*H.current,10)+"%; top: calc("+f.current.scrollTop/n*100+"% - "+h.current.clientHeight+"px);right:"+l+"px;")}))},P=function(e){b.current?R(e):(v.current||R(e),L(e))},R=function(e){var r=e.pageX-x.current;x.current=e.pageX,E.current=window.requestAnimationFrame((function(){f.current.scrollLeft+=r/w.current}))},L=function(e){var r=e.pageY-y.current;y.current=e.pageY,E.current=window.requestAnimationFrame((function(){f.current.scrollTop+=r/H.current}))},M=function e(r){t.DomHandler.removeClass(g.current,"p-scrollpanel-grabbed"),t.DomHandler.removeClass(h.current,"p-scrollpanel-grabbed"),t.DomHandler.removeClass(document.body,"p-scrollpanel-grabbed"),document.removeEventListener("mousemove",P),document.removeEventListener("mouseup",e),b.current=!1,v.current=!1},N=function(){C()};n.useMountEffect((function(){var e,r,n;C(),window.addEventListener("resize",C),e=getComputedStyle(m.current),r=getComputedStyle(h.current),n=t.DomHandler.getHeight(m.current)-parseInt(r.height,10),"none"!==e["max-height"]&&0===n&&(m.current.style.height=f.current.offsetHeight+parseInt(r.height,10)>parseInt(e["max-height"],10)?e["max-height"]:f.current.offsetHeight+parseFloat(e.paddingTop)+parseFloat(e.paddingBottom)+parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth)+"px"),D.current=!0})),n.useUnmountEffect((function(){D.current&&window.removeEventListener("resize",C),E.current&&window.cancelAnimationFrame(E.current)})),a.useImperativeHandle(o,(function(){return{props:u,refresh:N,getElement:function(){return m.current},getContent:function(){return f.current},getXBar:function(){return h.current},getYBar:function(){return g.current}}}));var q=t.mergeProps({id:u.id,ref:m,style:u.style,className:d("root")},c.getOtherProps(u),p("root")),F=t.mergeProps({className:d("wrapper")},p("wrapper")),O=t.mergeProps({className:d("content"),ref:f,onScroll:C,onMouseEnter:C},p("content")),S=t.mergeProps({ref:h,className:d("barx"),onMouseDown:function(e){b.current=!0,x.current=e.pageX,t.DomHandler.addClass(h.current,"p-scrollpanel-grabbed"),t.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",P),document.addEventListener("mouseup",M),e.preventDefault()}},p("barx")),T=t.mergeProps({ref:g,className:d("bary"),onMouseDown:function(e){v.current=!0,y.current=e.pageY,t.DomHandler.addClass(g.current,"p-scrollpanel-grabbed"),t.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",P),document.addEventListener("mouseup",M),e.preventDefault()}},p("bary"));return a.createElement("div",q,a.createElement("div",F,a.createElement("div",O,u.children)),a.createElement("div",S),a.createElement("div",T))}));s.displayName="ScrollPanel",exports.ScrollPanel=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),r=require("primereact/api"),n=require("primereact/hooks"),t=require("primereact/utils"),l=require("primereact/componentbase");function o(e){if(e&&e.__esModule)return e;var r=Object.create(null);return e&&Object.keys(e).forEach((function(n){if("default"!==n){var t=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(r,n,t.get?t:{enumerable:!0,get:function(){return e[n]}})}})),r.default=e,Object.freeze(r)}var a=o(e);function c(){return c=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e},c.apply(this,arguments)}var s=l.ComponentBase.extend({defaultProps:{__TYPE:"ScrollPanel",id:null,style:null,className:null,children:void 0},css:{classes:{root:function(e){return t.classNames("p-scrollpanel p-component",e.props.className)},wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"},styles:"\n        @layer primereact {\n            .p-scrollpanel-wrapper {\n                overflow: hidden;\n                width: 100%;\n                height: 100%;\n                position: relative;\n                z-index: 1;\n                float: left;\n            }\n            \n            .p-scrollpanel-content {\n                height: calc(100% + 18px);\n                width: calc(100% + 18px);\n                padding: 0 18px 18px 0;\n                position: relative;\n                overflow: auto;\n                box-sizing: border-box;\n            }\n            \n            .p-scrollpanel-bar {\n                position: relative;\n                background: #c1c1c1;\n                border-radius: 3px;\n                z-index: 2;\n                cursor: pointer;\n                opacity: 0;\n                transition: opacity 0.25s linear;\n            }\n            \n            .p-scrollpanel-bar-y {\n                width: 9px;\n                top: 0;\n            }\n            \n            .p-scrollpanel-bar-x {\n                height: 9px;\n                bottom: 0;\n            }\n            \n            .p-scrollpanel-hidden {\n                visibility: hidden;\n            }\n            \n            .p-scrollpanel:hover .p-scrollpanel-bar,\n            .p-scrollpanel:active .p-scrollpanel-bar {\n                opacity: 1;\n            }\n            \n            .p-scrollpanel-grabbed {\n                user-select: none;\n            }\n        }\n        "}}),u=a.forwardRef((function(e,o){var u=a.useContext(r.PrimeReactContext),i=s.getProps(e,u),p=s.setMetaData({props:i}),d=p.ptm,m=p.cx;l.useHandleStyle(s.css.styles,p.isUnstyled,{name:"scrollpanel"});var f=a.useRef(null),g=a.useRef(null),h=a.useRef(null),b=a.useRef(null),v=a.useRef(!1),x=a.useRef(!1),y=a.useRef(null),w=a.useRef(null),H=a.useRef(null),E=a.useRef(null),D=a.useRef(null),C=a.useRef(!1),P=function(){var e=g.current.scrollWidth,r=-1*(f.current.clientHeight-h.current.clientHeight);H.current=g.current.clientWidth/e;var n=g.current.scrollHeight,l=-1*(f.current.clientWidth-b.current.clientWidth);E.current=g.current.clientHeight/n,D.current=window.requestAnimationFrame((function(){H.current>=1?t.DomHandler.addClass(h.current,"p-scrollpanel-hidden"):(t.DomHandler.removeClass(h.current,"p-scrollpanel-hidden"),h.current.style.cssText="width:"+Math.max(100*H.current,10)+"%; left:"+g.current.scrollLeft/e*100+"%;bottom:"+r+"px;"),E.current>=1?t.DomHandler.addClass(b.current,"p-scrollpanel-hidden"):(t.DomHandler.removeClass(b.current,"p-scrollpanel-hidden"),b.current.style.cssText="height:"+Math.max(100*E.current,10)+"%; top: calc("+g.current.scrollTop/n*100+"% - "+h.current.clientHeight+"px);right:"+l+"px;")}))},R=function(e){v.current?O(e):(x.current||O(e),L(e))},O=function(e){var r=e.pageX-y.current;y.current=e.pageX,D.current=window.requestAnimationFrame((function(){g.current.scrollLeft+=r/H.current}))},L=function(e){var r=e.pageY-w.current;w.current=e.pageY,D.current=window.requestAnimationFrame((function(){g.current.scrollTop+=r/E.current}))},j=function e(r){t.DomHandler.removeClass(b.current,"p-scrollpanel-grabbed"),t.DomHandler.removeClass(h.current,"p-scrollpanel-grabbed"),t.DomHandler.removeClass(document.body,"p-scrollpanel-grabbed"),document.removeEventListener("mousemove",R),document.removeEventListener("mouseup",e),v.current=!1,x.current=!1},M=function(){P()};n.useMountEffect((function(){var e,r,n;P(),window.addEventListener("resize",P),e=getComputedStyle(f.current),r=getComputedStyle(h.current),n=t.DomHandler.getHeight(f.current)-parseInt(r.height,10),"none"!==e["max-height"]&&0===n&&(f.current.style.height=g.current.offsetHeight+parseInt(r.height,10)>parseInt(e["max-height"],10)?e["max-height"]:g.current.offsetHeight+parseFloat(e.paddingTop)+parseFloat(e.paddingBottom)+parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth)+"px"),C.current=!0})),n.useUnmountEffect((function(){C.current&&window.removeEventListener("resize",P),D.current&&window.cancelAnimationFrame(D.current)})),a.useImperativeHandle(o,(function(){return{props:i,refresh:M,getElement:function(){return f.current},getContent:function(){return g.current},getXBar:function(){return h.current},getYBar:function(){return b.current}}}));var N=t.mergeProps({id:i.id,ref:f,style:i.style,className:m("root")},s.getOtherProps(i),d("root")),q=t.mergeProps({className:m("wrapper")},d("wrapper")),F=t.mergeProps({className:m("content"),onScroll:P,onMouseEnter:P},d("content")),S=t.mergeProps({ref:h,className:m("barx"),onMouseDown:function(e){v.current=!0,y.current=e.pageX,t.DomHandler.addClass(h.current,"p-scrollpanel-grabbed"),t.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",R),document.addEventListener("mouseup",j),e.preventDefault()}},d("barx")),T=t.mergeProps({ref:b,className:m("bary"),onMouseDown:function(e){x.current=!0,w.current=e.pageY,t.DomHandler.addClass(b.current,"p-scrollpanel-grabbed"),t.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",R),document.addEventListener("mouseup",j),e.preventDefault()}},d("bary"));return a.createElement("div",N,a.createElement("div",q,a.createElement("div",c({ref:g},F),i.children)),a.createElement("div",S),a.createElement("div",T))}));u.displayName="ScrollPanel",exports.ScrollPanel=u;

package/scrollpanel/scrollpanel.esm.js

@@ -5,6 +5,21 @@ import { useMountEffect, useUnmountEffect } from 'primereact/hooks';
 import { classNames, mergeProps, DomHandler } from 'primereact/utils';
 import { ComponentBase, useHandleStyle } from 'primereact/componentbase';
 
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+
 var ScrollPanelBase = ComponentBase.extend({
   defaultProps: {
     __TYPE: 'ScrollPanel',
@@ -24,7 +39,7 @@ var ScrollPanelBase = ComponentBase.extend({
       barx: 'p-scrollpanel-bar p-scrollpanel-bar-x',
       bary: 'p-scrollpanel-bar p-scrollpanel-bar-y'
     },
-    styles: "\n        @layer primereact {\n            .p-scrollpanel-wrapper {\n                overflow: hidden;\n                width: 100%;\n                height: 100%;\n                position: relative;\n                z-index: 1;\n                float: left;\n            }\n            \n            .p-scrollpanel-content {\n                height: calc(100% + 18px);\n                width: calc(100% + 18px);\n                padding: 0 18px 18px 0;\n                position: relative;\n                overflow: hidden;\n                box-sizing: border-box;\n            }\n            \n            .p-scrollpanel-bar {\n                position: relative;\n                background: #c1c1c1;\n                border-radius: 3px;\n                z-index: 2;\n                cursor: pointer;\n                opacity: 0;\n                transition: opacity 0.25s linear;\n            }\n            \n            .p-scrollpanel-bar-y {\n                width: 9px;\n                top: 0;\n            }\n            \n            .p-scrollpanel-bar-x {\n                height: 9px;\n                bottom: 0;\n            }\n            \n            .p-scrollpanel-hidden {\n                visibility: hidden;\n            }\n            \n            .p-scrollpanel:hover .p-scrollpanel-bar,\n            .p-scrollpanel:active .p-scrollpanel-bar {\n                opacity: 1;\n            }\n            \n            .p-scrollpanel-grabbed {\n                user-select: none;\n            }\n        }\n        "
+    styles: "\n        @layer primereact {\n            .p-scrollpanel-wrapper {\n                overflow: hidden;\n                width: 100%;\n                height: 100%;\n                position: relative;\n                z-index: 1;\n                float: left;\n            }\n            \n            .p-scrollpanel-content {\n                height: calc(100% + 18px);\n                width: calc(100% + 18px);\n                padding: 0 18px 18px 0;\n                position: relative;\n                overflow: auto;\n                box-sizing: border-box;\n            }\n            \n            .p-scrollpanel-bar {\n                position: relative;\n                background: #c1c1c1;\n                border-radius: 3px;\n                z-index: 2;\n                cursor: pointer;\n                opacity: 0;\n                transition: opacity 0.25s linear;\n            }\n            \n            .p-scrollpanel-bar-y {\n                width: 9px;\n                top: 0;\n            }\n            \n            .p-scrollpanel-bar-x {\n                height: 9px;\n                bottom: 0;\n            }\n            \n            .p-scrollpanel-hidden {\n                visibility: hidden;\n            }\n            \n            .p-scrollpanel:hover .p-scrollpanel-bar,\n            .p-scrollpanel:active .p-scrollpanel-bar {\n                opacity: 1;\n            }\n            \n            .p-scrollpanel-grabbed {\n                user-select: none;\n            }\n        }\n        "
   }
 });
 
@@ -188,7 +203,6 @@ var ScrollPanel = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
   }, ptm('wrapper'));
   var contentProps = mergeProps({
     className: cx('content'),
-    ref: contentRef,
     onScroll: moveBar,
     onMouseEnter: moveBar
   }, ptm('content'));
@@ -202,7 +216,9 @@ var ScrollPanel = /*#__PURE__*/React.forwardRef(function (inProps, ref) {
     className: cx('bary'),
     onMouseDown: onYBarMouseDown
   }, ptm('bary'));
-  return /*#__PURE__*/React.createElement("div", rootProps, /*#__PURE__*/React.createElement("div", wrapperProps, /*#__PURE__*/React.createElement("div", contentProps, props.children)), /*#__PURE__*/React.createElement("div", barXProps), /*#__PURE__*/React.createElement("div", barYProps));
+  return /*#__PURE__*/React.createElement("div", rootProps, /*#__PURE__*/React.createElement("div", wrapperProps, /*#__PURE__*/React.createElement("div", _extends({
+    ref: contentRef
+  }, contentProps), props.children)), /*#__PURE__*/React.createElement("div", barXProps), /*#__PURE__*/React.createElement("div", barYProps));
 });
 ScrollPanel.displayName = 'ScrollPanel';
 

package/scrollpanel/scrollpanel.esm.min.js

@@ -1 +1 @@
-import*as e from"react";import{PrimeReactContext as r}from"primereact/api";import{useMountEffect as n,useUnmountEffect as t}from"primereact/hooks";import{classNames as l,mergeProps as o,DomHandler as a}from"primereact/utils";import{ComponentBase as c,useHandleStyle as s}from"primereact/componentbase";var u=c.extend({defaultProps:{__TYPE:"ScrollPanel",id:null,style:null,className:null,children:void 0},css:{classes:{root:function(e){return l("p-scrollpanel p-component",e.props.className)},wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"},styles:"\n        @layer primereact {\n            .p-scrollpanel-wrapper {\n                overflow: hidden;\n                width: 100%;\n                height: 100%;\n                position: relative;\n                z-index: 1;\n                float: left;\n            }\n            \n            .p-scrollpanel-content {\n                height: calc(100% + 18px);\n                width: calc(100% + 18px);\n                padding: 0 18px 18px 0;\n                position: relative;\n                overflow: hidden;\n                box-sizing: border-box;\n            }\n            \n            .p-scrollpanel-bar {\n                position: relative;\n                background: #c1c1c1;\n                border-radius: 3px;\n                z-index: 2;\n                cursor: pointer;\n                opacity: 0;\n                transition: opacity 0.25s linear;\n            }\n            \n            .p-scrollpanel-bar-y {\n                width: 9px;\n                top: 0;\n            }\n            \n            .p-scrollpanel-bar-x {\n                height: 9px;\n                bottom: 0;\n            }\n            \n            .p-scrollpanel-hidden {\n                visibility: hidden;\n            }\n            \n            .p-scrollpanel:hover .p-scrollpanel-bar,\n            .p-scrollpanel:active .p-scrollpanel-bar {\n                opacity: 1;\n            }\n            \n            .p-scrollpanel-grabbed {\n                user-select: none;\n            }\n        }\n        "}}),i=e.forwardRef((function(l,c){var i=e.useContext(r),p=u.getProps(l,i),d=u.setMetaData({props:p}),m=d.ptm,f=d.cx;s(u.css.styles,d.isUnstyled,{name:"scrollpanel"});var h=e.useRef(null),g=e.useRef(null),b=e.useRef(null),v=e.useRef(null),x=e.useRef(!1),w=e.useRef(!1),y=e.useRef(null),E=e.useRef(null),C=e.useRef(null),R=e.useRef(null),L=e.useRef(null),H=e.useRef(!1),F=function(){var e=g.current.scrollWidth,r=-1*(h.current.clientHeight-b.current.clientHeight);C.current=g.current.clientWidth/e;var n=g.current.scrollHeight,t=-1*(h.current.clientWidth-v.current.clientWidth);R.current=g.current.clientHeight/n,L.current=window.requestAnimationFrame((function(){C.current>=1?a.addClass(b.current,"p-scrollpanel-hidden"):(a.removeClass(b.current,"p-scrollpanel-hidden"),b.current.style.cssText="width:"+Math.max(100*C.current,10)+"%; left:"+g.current.scrollLeft/e*100+"%;bottom:"+r+"px;"),R.current>=1?a.addClass(v.current,"p-scrollpanel-hidden"):(a.removeClass(v.current,"p-scrollpanel-hidden"),v.current.style.cssText="height:"+Math.max(100*R.current,10)+"%; top: calc("+g.current.scrollTop/n*100+"% - "+b.current.clientHeight+"px);right:"+t+"px;")}))},N=function(e){x.current?T(e):(w.current||T(e),M(e))},T=function(e){var r=e.pageX-y.current;y.current=e.pageX,L.current=window.requestAnimationFrame((function(){g.current.scrollLeft+=r/C.current}))},M=function(e){var r=e.pageY-E.current;E.current=e.pageY,L.current=window.requestAnimationFrame((function(){g.current.scrollTop+=r/R.current}))},P=function e(r){a.removeClass(v.current,"p-scrollpanel-grabbed"),a.removeClass(b.current,"p-scrollpanel-grabbed"),a.removeClass(document.body,"p-scrollpanel-grabbed"),document.removeEventListener("mousemove",N),document.removeEventListener("mouseup",e),x.current=!1,w.current=!1},W=function(){F()};n((function(){var e,r,n;F(),window.addEventListener("resize",F),e=getComputedStyle(h.current),r=getComputedStyle(b.current),n=a.getHeight(h.current)-parseInt(r.height,10),"none"!==e["max-height"]&&0===n&&(h.current.style.height=g.current.offsetHeight+parseInt(r.height,10)>parseInt(e["max-height"],10)?e["max-height"]:g.current.offsetHeight+parseFloat(e.paddingTop)+parseFloat(e.paddingBottom)+parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth)+"px"),H.current=!0})),t((function(){H.current&&window.removeEventListener("resize",F),L.current&&window.cancelAnimationFrame(L.current)})),e.useImperativeHandle(c,(function(){return{props:p,refresh:W,getElement:function(){return h.current},getContent:function(){return g.current},getXBar:function(){return b.current},getYBar:function(){return v.current}}}));var z=o({id:p.id,ref:h,style:p.style,className:f("root")},u.getOtherProps(p),m("root")),D=o({className:f("wrapper")},m("wrapper")),S=o({className:f("content"),ref:g,onScroll:F,onMouseEnter:F},m("content")),Y=o({ref:b,className:f("barx"),onMouseDown:function(e){x.current=!0,y.current=e.pageX,a.addClass(b.current,"p-scrollpanel-grabbed"),a.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",N),document.addEventListener("mouseup",P),e.preventDefault()}},m("barx")),A=o({ref:v,className:f("bary"),onMouseDown:function(e){w.current=!0,E.current=e.pageY,a.addClass(v.current,"p-scrollpanel-grabbed"),a.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",N),document.addEventListener("mouseup",P),e.preventDefault()}},m("bary"));return e.createElement("div",z,e.createElement("div",D,e.createElement("div",S,p.children)),e.createElement("div",Y),e.createElement("div",A))}));i.displayName="ScrollPanel";export{i as ScrollPanel};
+import*as e from"react";import{PrimeReactContext as r}from"primereact/api";import{useMountEffect as n,useUnmountEffect as t}from"primereact/hooks";import{classNames as l,mergeProps as o,DomHandler as a}from"primereact/utils";import{ComponentBase as c,useHandleStyle as s}from"primereact/componentbase";function u(){return u=Object.assign?Object.assign.bind():function(e){for(var r=1;r<arguments.length;r++){var n=arguments[r];for(var t in n)Object.prototype.hasOwnProperty.call(n,t)&&(e[t]=n[t])}return e},u.apply(this,arguments)}var i=c.extend({defaultProps:{__TYPE:"ScrollPanel",id:null,style:null,className:null,children:void 0},css:{classes:{root:function(e){return l("p-scrollpanel p-component",e.props.className)},wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"},styles:"\n        @layer primereact {\n            .p-scrollpanel-wrapper {\n                overflow: hidden;\n                width: 100%;\n                height: 100%;\n                position: relative;\n                z-index: 1;\n                float: left;\n            }\n            \n            .p-scrollpanel-content {\n                height: calc(100% + 18px);\n                width: calc(100% + 18px);\n                padding: 0 18px 18px 0;\n                position: relative;\n                overflow: auto;\n                box-sizing: border-box;\n            }\n            \n            .p-scrollpanel-bar {\n                position: relative;\n                background: #c1c1c1;\n                border-radius: 3px;\n                z-index: 2;\n                cursor: pointer;\n                opacity: 0;\n                transition: opacity 0.25s linear;\n            }\n            \n            .p-scrollpanel-bar-y {\n                width: 9px;\n                top: 0;\n            }\n            \n            .p-scrollpanel-bar-x {\n                height: 9px;\n                bottom: 0;\n            }\n            \n            .p-scrollpanel-hidden {\n                visibility: hidden;\n            }\n            \n            .p-scrollpanel:hover .p-scrollpanel-bar,\n            .p-scrollpanel:active .p-scrollpanel-bar {\n                opacity: 1;\n            }\n            \n            .p-scrollpanel-grabbed {\n                user-select: none;\n            }\n        }\n        "}}),p=e.forwardRef((function(l,c){var p=e.useContext(r),d=i.getProps(l,p),m=i.setMetaData({props:d}),f=m.ptm,h=m.cx;s(i.css.styles,m.isUnstyled,{name:"scrollpanel"});var g=e.useRef(null),b=e.useRef(null),v=e.useRef(null),x=e.useRef(null),y=e.useRef(!1),w=e.useRef(!1),E=e.useRef(null),C=e.useRef(null),R=e.useRef(null),L=e.useRef(null),H=e.useRef(null),F=e.useRef(!1),N=function(){var e=b.current.scrollWidth,r=-1*(g.current.clientHeight-v.current.clientHeight);R.current=b.current.clientWidth/e;var n=b.current.scrollHeight,t=-1*(g.current.clientWidth-x.current.clientWidth);L.current=b.current.clientHeight/n,H.current=window.requestAnimationFrame((function(){R.current>=1?a.addClass(v.current,"p-scrollpanel-hidden"):(a.removeClass(v.current,"p-scrollpanel-hidden"),v.current.style.cssText="width:"+Math.max(100*R.current,10)+"%; left:"+b.current.scrollLeft/e*100+"%;bottom:"+r+"px;"),L.current>=1?a.addClass(x.current,"p-scrollpanel-hidden"):(a.removeClass(x.current,"p-scrollpanel-hidden"),x.current.style.cssText="height:"+Math.max(100*L.current,10)+"%; top: calc("+b.current.scrollTop/n*100+"% - "+v.current.clientHeight+"px);right:"+t+"px;")}))},P=function(e){y.current?T(e):(w.current||T(e),M(e))},T=function(e){var r=e.pageX-E.current;E.current=e.pageX,H.current=window.requestAnimationFrame((function(){b.current.scrollLeft+=r/R.current}))},M=function(e){var r=e.pageY-C.current;C.current=e.pageY,H.current=window.requestAnimationFrame((function(){b.current.scrollTop+=r/L.current}))},W=function e(r){a.removeClass(x.current,"p-scrollpanel-grabbed"),a.removeClass(v.current,"p-scrollpanel-grabbed"),a.removeClass(document.body,"p-scrollpanel-grabbed"),document.removeEventListener("mousemove",P),document.removeEventListener("mouseup",e),y.current=!1,w.current=!1},z=function(){N()};n((function(){var e,r,n;N(),window.addEventListener("resize",N),e=getComputedStyle(g.current),r=getComputedStyle(v.current),n=a.getHeight(g.current)-parseInt(r.height,10),"none"!==e["max-height"]&&0===n&&(g.current.style.height=b.current.offsetHeight+parseInt(r.height,10)>parseInt(e["max-height"],10)?e["max-height"]:b.current.offsetHeight+parseFloat(e.paddingTop)+parseFloat(e.paddingBottom)+parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth)+"px"),F.current=!0})),t((function(){F.current&&window.removeEventListener("resize",N),H.current&&window.cancelAnimationFrame(H.current)})),e.useImperativeHandle(c,(function(){return{props:d,refresh:z,getElement:function(){return g.current},getContent:function(){return b.current},getXBar:function(){return v.current},getYBar:function(){return x.current}}}));var D=o({id:d.id,ref:g,style:d.style,className:h("root")},i.getOtherProps(d),f("root")),O=o({className:h("wrapper")},f("wrapper")),S=o({className:h("content"),onScroll:N,onMouseEnter:N},f("content")),Y=o({ref:v,className:h("barx"),onMouseDown:function(e){y.current=!0,E.current=e.pageX,a.addClass(v.current,"p-scrollpanel-grabbed"),a.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",P),document.addEventListener("mouseup",W),e.preventDefault()}},f("barx")),A=o({ref:x,className:h("bary"),onMouseDown:function(e){w.current=!0,C.current=e.pageY,a.addClass(x.current,"p-scrollpanel-grabbed"),a.addClass(document.body,"p-scrollpanel-grabbed"),document.addEventListener("mousemove",P),document.addEventListener("mouseup",W),e.preventDefault()}},f("bary"));return e.createElement("div",D,e.createElement("div",O,e.createElement("div",u({ref:b},S),d.children)),e.createElement("div",Y),e.createElement("div",A))}));p.displayName="ScrollPanel";export{p as ScrollPanel};