primevue 3.47.2 → 3.48.0

package/ripple/style/ripplestyle.cjs.js

@@ -6,13 +6,11 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-var css = "\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n@layer primevue {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\n        border-radius: 100%;\n        transform: scale(0);\n        pointer-events: none;\n    }\n\n    .p-ink-active {\n        animation: ripple 0.4s linear;\n    }\n\n    .p-ripple-disabled .p-ink {\n        display: none;\n    }\n}\n";
 var classes = {
   root: 'p-ink'
 };
 var RippleStyle = BaseStyle__default["default"].extend({
   name: 'ripple',
-  css: css,
   classes: classes
 });
 

package/ripple/style/ripplestyle.cjs.min.js

@@ -1 +1 @@
-"use strict";function n(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var e=n(require("primevue/base/style")).default.extend({name:"ripple",css:"\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n@layer primevue {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\n        border-radius: 100%;\n        transform: scale(0);\n        pointer-events: none;\n    }\n\n    .p-ink-active {\n        animation: ripple 0.4s linear;\n    }\n\n    .p-ripple-disabled .p-ink {\n        display: none;\n    }\n}\n",classes:{root:"p-ink"}});module.exports=e;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=e(require("primevue/base/style")).default.extend({name:"ripple",classes:{root:"p-ink"}});module.exports=t;

package/ripple/style/ripplestyle.esm.js

@@ -1,12 +1,10 @@
 import BaseStyle from 'primevue/base/style';
 
-var css = "\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n@layer primevue {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\n        border-radius: 100%;\n        transform: scale(0);\n        pointer-events: none;\n    }\n\n    .p-ink-active {\n        animation: ripple 0.4s linear;\n    }\n\n    .p-ripple-disabled .p-ink {\n        display: none;\n    }\n}\n";
 var classes = {
   root: 'p-ink'
 };
 var RippleStyle = BaseStyle.extend({
   name: 'ripple',
-  css: css,
   classes: classes
 });
 

package/ripple/style/ripplestyle.esm.min.js

@@ -1 +1 @@
-import n from"primevue/base/style";var e=n.extend({name:"ripple",css:"\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n@layer primevue {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\n        border-radius: 100%;\n        transform: scale(0);\n        pointer-events: none;\n    }\n\n    .p-ink-active {\n        animation: ripple 0.4s linear;\n    }\n\n    .p-ripple-disabled .p-ink {\n        display: none;\n    }\n}\n",classes:{root:"p-ink"}});export{e as default};
+import e from"primevue/base/style";var r=e.extend({name:"ripple",classes:{root:"p-ink"}});export{r as default};

package/ripple/style/ripplestyle.js

@@ -7,13 +7,11 @@ this.primevue.ripple.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n@layer primevue {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\n        border-radius: 100%;\n        transform: scale(0);\n        pointer-events: none;\n    }\n\n    .p-ink-active {\n        animation: ripple 0.4s linear;\n    }\n\n    .p-ripple-disabled .p-ink {\n        display: none;\n    }\n}\n";
     var classes = {
       root: 'p-ink'
     };
     var RippleStyle = BaseStyle__default["default"].extend({
       name: 'ripple',
-      css: css,
       classes: classes
     });
 

package/ripple/style/ripplestyle.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.ripple=this.primevue.ripple||{},this.primevue.ripple.style=function(n){"use strict";function e(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}return e(primevue.base.style).default.extend({name:"ripple",css:"\n@keyframes ripple {\n    100% {\n        opacity: 0;\n        transform: scale(2.5);\n    }\n}\n\n@layer primevue {\n    .p-ripple {\n        overflow: hidden;\n        position: relative;\n    }\n\n    .p-ink {\n        display: block;\n        position: absolute;\n        background: rgba(255, 255, 255, 0.5);\n        border-radius: 100%;\n        transform: scale(0);\n        pointer-events: none;\n    }\n\n    .p-ink-active {\n        animation: ripple 0.4s linear;\n    }\n\n    .p-ripple-disabled .p-ink {\n        display: none;\n    }\n}\n",classes:{root:"p-ink"}})}();
+this.primevue=this.primevue||{},this.primevue.ripple=this.primevue.ripple||{},this.primevue.ripple.style=function(e){"use strict";function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}return i(primevue.base.style).default.extend({name:"ripple",classes:{root:"p-ink"}})}();

package/scrollpanel/ScrollPanel.vue

@@ -1,5 +1,5 @@
 <template>
-    <div :class="cx('root')" v-bind="ptm('root')" data-pc-name="scrollpanel">
+    <div :class="cx('root')" v-bind="ptm('root')">
         <div :class="cx('wrapper')" v-bind="ptm('wrapper')">
             <div ref="content" :id="contentId" :class="cx('content')" @scroll="onScroll" @mouseenter="moveBar" v-bind="ptm('content')">
                 <slot></slot>
@@ -61,13 +61,20 @@ export default {
     outsideClickListener: null,
     data() {
         return {
-            id: UniqueComponentId(),
+            id: this.$attrs.id,
             orientation: 'vertical',
             lastScrollTop: 0,
             lastScrollLeft: 0
         };
     },
+    watch: {
+        '$attrs.id': function (newValue) {
+            this.id = newValue || UniqueComponentId();
+        }
+    },
     mounted() {
+        this.id = this.id || UniqueComponentId();
+
         if (this.$el.offsetParent) {
             this.initialize();
         }
@@ -362,7 +369,7 @@ export default {
     },
     computed: {
         contentId() {
-            return UniqueComponentId() + '_content';
+            return this.id + '_content';
         }
     }
 };

package/scrollpanel/scrollpanel.cjs.js

@@ -45,13 +45,19 @@ var script = {
   outsideClickListener: null,
   data: function data() {
     return {
-      id: utils.UniqueComponentId(),
+      id: this.$attrs.id,
       orientation: 'vertical',
       lastScrollTop: 0,
       lastScrollLeft: 0
     };
   },
+  watch: {
+    '$attrs.id': function $attrsId(newValue) {
+      this.id = newValue || utils.UniqueComponentId();
+    }
+  },
   mounted: function mounted() {
+    this.id = this.id || utils.UniqueComponentId();
     if (this.$el.offsetParent) {
       this.initialize();
     }
@@ -322,7 +328,7 @@ var script = {
   },
   computed: {
     contentId: function contentId() {
-      return utils.UniqueComponentId() + '_content';
+      return this.id + '_content';
     }
   }
 };
@@ -333,9 +339,7 @@ var _hoisted_3 = ["aria-controls", "aria-valuenow"];
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
     "class": _ctx.cx('root')
-  }, _ctx.ptm('root'), {
-    "data-pc-name": "scrollpanel"
-  }), [vue.createElementVNode("div", vue.mergeProps({
+  }, _ctx.ptm('root')), [vue.createElementVNode("div", vue.mergeProps({
     "class": _ctx.cx('wrapper')
   }, _ctx.ptm('wrapper')), [vue.createElementVNode("div", vue.mergeProps({
     ref: "content",

package/scrollpanel/scrollpanel.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/utils"),t=require("primevue/basecomponent"),n=require("primevue/scrollpanel/style"),o=require("vue");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"ScrollPanel",extends:{name:"BaseScrollPanel",extends:s(t).default,props:{step:{type:Number,default:5}},style:s(n).default,provide:function(){return{$parentInstance:this}}},initialized:!1,documentResizeListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,frame:null,scrollXRatio:null,scrollYRatio:null,isXBarClicked:!1,isYBarClicked:!1,lastPageX:null,lastPageY:null,timer:null,outsideClickListener:null,data:function(){return{id:e.UniqueComponentId(),orientation:"vertical",lastScrollTop:0,lastScrollLeft:0}},mounted:function(){this.$el.offsetParent&&this.initialize()},updated:function(){!this.initialized&&this.$el.offsetParent&&this.initialize()},beforeUnmount:function(){this.unbindDocumentResizeListener(),this.frame&&window.cancelAnimationFrame(this.frame)},methods:{initialize:function(){this.moveBar(),this.bindDocumentResizeListener(),this.calculateContainerHeight()},calculateContainerHeight:function(){var t=getComputedStyle(this.$el),n=getComputedStyle(this.$refs.xBar),o=e.DomHandler.getHeight(this.$el)-parseInt(n.height,10);"none"!==t["max-height"]&&0===o&&(this.$el.style.height=this.$refs.content.offsetHeight+parseInt(n.height,10)>parseInt(t["max-height"],10)?t["max-height"]:this.$refs.content.offsetHeight+parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)+parseFloat(t.borderTopWidth)+parseFloat(t.borderBottomWidth)+"px")},moveBar:function(){var t=this;if(this.$refs.content){var n=this.$refs.content.scrollWidth,o=-1*(this.$el.clientHeight-this.$refs.xBar.clientHeight);this.scrollXRatio=this.$refs.content.clientWidth/n;var s=this.$refs.content.scrollHeight,r=-1*(this.$el.clientWidth-this.$refs.yBar.clientWidth);this.scrollYRatio=this.$refs.content.clientHeight/s,this.frame=this.requestAnimationFrame((function(){t.scrollXRatio>=1?(t.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","true"),!t.isUnstyled&&e.DomHandler.addClass(t.$refs.xBar,"p-scrollpanel-hidden")):(t.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","false"),!t.isUnstyled&&e.DomHandler.removeClass(t.$refs.xBar,"p-scrollpanel-hidden"),t.$refs.xBar.style.cssText="width:"+Math.max(100*t.scrollXRatio,10)+"%; left:"+t.$refs.content.scrollLeft/n*100+"%;bottom:"+o+"px;"),t.scrollYRatio>=1?(t.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","true"),!t.isUnstyled&&e.DomHandler.addClass(t.$refs.yBar,"p-scrollpanel-hidden")):(t.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","false"),!t.isUnstyled&&e.DomHandler.removeClass(t.$refs.yBar,"p-scrollpanel-hidden"),t.$refs.yBar.style.cssText="height:"+Math.max(100*t.scrollYRatio,10)+"%; top: calc("+t.$refs.content.scrollTop/s*100+"% - "+t.$refs.xBar.clientHeight+"px);right:"+r+"px;")}))}},onYBarMouseDown:function(t){this.isYBarClicked=!0,this.$refs.yBar.focus(),this.lastPageY=t.pageY,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&e.DomHandler.addClass(this.$refs.yBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&e.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),t.preventDefault()},onXBarMouseDown:function(t){this.isXBarClicked=!0,this.$refs.xBar.focus(),this.lastPageX=t.pageX,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.addClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),t.preventDefault()},onScroll:function(e){this.lastScrollLeft!==e.target.scrollLeft?(this.lastScrollLeft=e.target.scrollLeft,this.orientation="horizontal"):this.lastScrollTop!==e.target.scrollTop&&(this.lastScrollTop=e.target.scrollTop,this.orientation="vertical"),this.moveBar()},onKeyDown:function(e){if("vertical"===this.orientation)switch(e.code){case"ArrowDown":this.setTimer("scrollTop",this.step),e.preventDefault();break;case"ArrowUp":this.setTimer("scrollTop",-1*this.step),e.preventDefault();break;case"ArrowLeft":case"ArrowRight":e.preventDefault()}else if("horizontal"===this.orientation)switch(e.code){case"ArrowRight":this.setTimer("scrollLeft",this.step),e.preventDefault();break;case"ArrowLeft":this.setTimer("scrollLeft",-1*this.step),e.preventDefault();break;case"ArrowDown":case"ArrowUp":e.preventDefault()}},onKeyUp:function(){this.clearTimer()},repeat:function(e,t){this.$refs.content[e]+=t,this.moveBar()},setTimer:function(e,t){var n=this;this.clearTimer(),this.timer=setTimeout((function(){n.repeat(e,t)}),40)},clearTimer:function(){this.timer&&clearTimeout(this.timer)},onDocumentMouseMove:function(e){this.isXBarClicked?this.onMouseMoveForXBar(e):(this.isYBarClicked||this.onMouseMoveForXBar(e),this.onMouseMoveForYBar(e))},onMouseMoveForXBar:function(e){var t=this,n=e.pageX-this.lastPageX;this.lastPageX=e.pageX,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollLeft+=n/t.scrollXRatio}))},onMouseMoveForYBar:function(e){var t=this,n=e.pageY-this.lastPageY;this.lastPageY=e.pageY,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollTop+=n/t.scrollYRatio}))},onFocus:function(e){this.$refs.xBar.isSameNode(e.target)?this.orientation="horizontal":this.$refs.yBar.isSameNode(e.target)&&(this.orientation="vertical")},onBlur:function(){"horizontal"===this.orientation&&(this.orientation="vertical")},onDocumentMouseUp:function(){this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(this.$refs.yBar,"p-scrollpanel-grabbed"),this.$refs.xBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(document.body,"p-scrollpanel-grabbed"),this.unbindDocumentMouseListeners(),this.isXBarClicked=!1,this.isYBarClicked=!1},requestAnimationFrame:function(e){return(window.requestAnimationFrame||this.timeoutFrame)(e)},refresh:function(){this.moveBar()},scrollTop:function(e){var t=this.$refs.content.scrollHeight-this.$refs.content.clientHeight;this.$refs.content.scrollTop=e=e>t?t:e>0?e:0},timeoutFrame:function(e){setTimeout(e,0)},bindDocumentMouseListeners:function(){var e=this;this.documentMouseMoveListener||(this.documentMouseMoveListener=function(t){e.onDocumentMouseMove(t)},document.addEventListener("mousemove",this.documentMouseMoveListener)),this.documentMouseUpListener||(this.documentMouseUpListener=function(t){e.onDocumentMouseUp(t)},document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseListeners:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null),this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},bindDocumentResizeListener:function(){var e=this;this.documentResizeListener||(this.documentResizeListener=function(){e.moveBar()},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentResizeListener:function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)}},computed:{contentId:function(){return e.UniqueComponentId()+"_content"}}},i=["id"],a=["aria-controls","aria-valuenow"],l=["aria-controls","aria-valuenow"];r.render=function(e,t,n,s,r,c){return o.openBlock(),o.createElementBlock("div",o.mergeProps({class:e.cx("root")},e.ptm("root"),{"data-pc-name":"scrollpanel"}),[o.createElementVNode("div",o.mergeProps({class:e.cx("wrapper")},e.ptm("wrapper")),[o.createElementVNode("div",o.mergeProps({ref:"content",id:c.contentId,class:e.cx("content"),onScroll:t[0]||(t[0]=function(){return c.onScroll&&c.onScroll.apply(c,arguments)}),onMouseenter:t[1]||(t[1]=function(){return c.moveBar&&c.moveBar.apply(c,arguments)})},e.ptm("content")),[o.renderSlot(e.$slots,"default")],16,i)],16),o.createElementVNode("div",o.mergeProps({ref:"xBar",class:e.cx("barx"),tabindex:"0",role:"scrollbar","aria-orientation":"horizontal","aria-controls":c.contentId,"aria-valuenow":r.lastScrollLeft,onMousedown:t[2]||(t[2]=function(){return c.onXBarMouseDown&&c.onXBarMouseDown.apply(c,arguments)}),onKeydown:t[3]||(t[3]=function(e){return c.onKeyDown(e)}),onKeyup:t[4]||(t[4]=function(){return c.onKeyUp&&c.onKeyUp.apply(c,arguments)}),onFocus:t[5]||(t[5]=function(){return c.onFocus&&c.onFocus.apply(c,arguments)}),onBlur:t[6]||(t[6]=function(){return c.onBlur&&c.onBlur.apply(c,arguments)})},e.ptm("barx"),{"data-pc-group-section":"bar"}),null,16,a),o.createElementVNode("div",o.mergeProps({ref:"yBar",class:e.cx("bary"),tabindex:"0",role:"scrollbar","aria-orientation":"vertical","aria-controls":c.contentId,"aria-valuenow":r.lastScrollTop,onMousedown:t[7]||(t[7]=function(){return c.onYBarMouseDown&&c.onYBarMouseDown.apply(c,arguments)}),onKeydown:t[8]||(t[8]=function(e){return c.onKeyDown(e)}),onKeyup:t[9]||(t[9]=function(){return c.onKeyUp&&c.onKeyUp.apply(c,arguments)}),onFocus:t[10]||(t[10]=function(){return c.onFocus&&c.onFocus.apply(c,arguments)})},e.ptm("bary"),{"data-pc-group-section":"bar"}),null,16,l)],16)},module.exports=r;
+"use strict";var e=require("primevue/utils"),t=require("primevue/basecomponent"),n=require("primevue/scrollpanel/style"),o=require("vue");function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"ScrollPanel",extends:{name:"BaseScrollPanel",extends:s(t).default,props:{step:{type:Number,default:5}},style:s(n).default,provide:function(){return{$parentInstance:this}}},initialized:!1,documentResizeListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,frame:null,scrollXRatio:null,scrollYRatio:null,isXBarClicked:!1,isYBarClicked:!1,lastPageX:null,lastPageY:null,timer:null,outsideClickListener:null,data:function(){return{id:this.$attrs.id,orientation:"vertical",lastScrollTop:0,lastScrollLeft:0}},watch:{"$attrs.id":function(t){this.id=t||e.UniqueComponentId()}},mounted:function(){this.id=this.id||e.UniqueComponentId(),this.$el.offsetParent&&this.initialize()},updated:function(){!this.initialized&&this.$el.offsetParent&&this.initialize()},beforeUnmount:function(){this.unbindDocumentResizeListener(),this.frame&&window.cancelAnimationFrame(this.frame)},methods:{initialize:function(){this.moveBar(),this.bindDocumentResizeListener(),this.calculateContainerHeight()},calculateContainerHeight:function(){var t=getComputedStyle(this.$el),n=getComputedStyle(this.$refs.xBar),o=e.DomHandler.getHeight(this.$el)-parseInt(n.height,10);"none"!==t["max-height"]&&0===o&&(this.$el.style.height=this.$refs.content.offsetHeight+parseInt(n.height,10)>parseInt(t["max-height"],10)?t["max-height"]:this.$refs.content.offsetHeight+parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)+parseFloat(t.borderTopWidth)+parseFloat(t.borderBottomWidth)+"px")},moveBar:function(){var t=this;if(this.$refs.content){var n=this.$refs.content.scrollWidth,o=-1*(this.$el.clientHeight-this.$refs.xBar.clientHeight);this.scrollXRatio=this.$refs.content.clientWidth/n;var s=this.$refs.content.scrollHeight,r=-1*(this.$el.clientWidth-this.$refs.yBar.clientWidth);this.scrollYRatio=this.$refs.content.clientHeight/s,this.frame=this.requestAnimationFrame((function(){t.scrollXRatio>=1?(t.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","true"),!t.isUnstyled&&e.DomHandler.addClass(t.$refs.xBar,"p-scrollpanel-hidden")):(t.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","false"),!t.isUnstyled&&e.DomHandler.removeClass(t.$refs.xBar,"p-scrollpanel-hidden"),t.$refs.xBar.style.cssText="width:"+Math.max(100*t.scrollXRatio,10)+"%; left:"+t.$refs.content.scrollLeft/n*100+"%;bottom:"+o+"px;"),t.scrollYRatio>=1?(t.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","true"),!t.isUnstyled&&e.DomHandler.addClass(t.$refs.yBar,"p-scrollpanel-hidden")):(t.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","false"),!t.isUnstyled&&e.DomHandler.removeClass(t.$refs.yBar,"p-scrollpanel-hidden"),t.$refs.yBar.style.cssText="height:"+Math.max(100*t.scrollYRatio,10)+"%; top: calc("+t.$refs.content.scrollTop/s*100+"% - "+t.$refs.xBar.clientHeight+"px);right:"+r+"px;")}))}},onYBarMouseDown:function(t){this.isYBarClicked=!0,this.$refs.yBar.focus(),this.lastPageY=t.pageY,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&e.DomHandler.addClass(this.$refs.yBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&e.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),t.preventDefault()},onXBarMouseDown:function(t){this.isXBarClicked=!0,this.$refs.xBar.focus(),this.lastPageX=t.pageX,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.addClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),t.preventDefault()},onScroll:function(e){this.lastScrollLeft!==e.target.scrollLeft?(this.lastScrollLeft=e.target.scrollLeft,this.orientation="horizontal"):this.lastScrollTop!==e.target.scrollTop&&(this.lastScrollTop=e.target.scrollTop,this.orientation="vertical"),this.moveBar()},onKeyDown:function(e){if("vertical"===this.orientation)switch(e.code){case"ArrowDown":this.setTimer("scrollTop",this.step),e.preventDefault();break;case"ArrowUp":this.setTimer("scrollTop",-1*this.step),e.preventDefault();break;case"ArrowLeft":case"ArrowRight":e.preventDefault()}else if("horizontal"===this.orientation)switch(e.code){case"ArrowRight":this.setTimer("scrollLeft",this.step),e.preventDefault();break;case"ArrowLeft":this.setTimer("scrollLeft",-1*this.step),e.preventDefault();break;case"ArrowDown":case"ArrowUp":e.preventDefault()}},onKeyUp:function(){this.clearTimer()},repeat:function(e,t){this.$refs.content[e]+=t,this.moveBar()},setTimer:function(e,t){var n=this;this.clearTimer(),this.timer=setTimeout((function(){n.repeat(e,t)}),40)},clearTimer:function(){this.timer&&clearTimeout(this.timer)},onDocumentMouseMove:function(e){this.isXBarClicked?this.onMouseMoveForXBar(e):(this.isYBarClicked||this.onMouseMoveForXBar(e),this.onMouseMoveForYBar(e))},onMouseMoveForXBar:function(e){var t=this,n=e.pageX-this.lastPageX;this.lastPageX=e.pageX,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollLeft+=n/t.scrollXRatio}))},onMouseMoveForYBar:function(e){var t=this,n=e.pageY-this.lastPageY;this.lastPageY=e.pageY,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollTop+=n/t.scrollYRatio}))},onFocus:function(e){this.$refs.xBar.isSameNode(e.target)?this.orientation="horizontal":this.$refs.yBar.isSameNode(e.target)&&(this.orientation="vertical")},onBlur:function(){"horizontal"===this.orientation&&(this.orientation="vertical")},onDocumentMouseUp:function(){this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(this.$refs.yBar,"p-scrollpanel-grabbed"),this.$refs.xBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(document.body,"p-scrollpanel-grabbed"),this.unbindDocumentMouseListeners(),this.isXBarClicked=!1,this.isYBarClicked=!1},requestAnimationFrame:function(e){return(window.requestAnimationFrame||this.timeoutFrame)(e)},refresh:function(){this.moveBar()},scrollTop:function(e){var t=this.$refs.content.scrollHeight-this.$refs.content.clientHeight;this.$refs.content.scrollTop=e=e>t?t:e>0?e:0},timeoutFrame:function(e){setTimeout(e,0)},bindDocumentMouseListeners:function(){var e=this;this.documentMouseMoveListener||(this.documentMouseMoveListener=function(t){e.onDocumentMouseMove(t)},document.addEventListener("mousemove",this.documentMouseMoveListener)),this.documentMouseUpListener||(this.documentMouseUpListener=function(t){e.onDocumentMouseUp(t)},document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseListeners:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null),this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},bindDocumentResizeListener:function(){var e=this;this.documentResizeListener||(this.documentResizeListener=function(){e.moveBar()},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentResizeListener:function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)}},computed:{contentId:function(){return this.id+"_content"}}},i=["id"],a=["aria-controls","aria-valuenow"],l=["aria-controls","aria-valuenow"];r.render=function(e,t,n,s,r,c){return o.openBlock(),o.createElementBlock("div",o.mergeProps({class:e.cx("root")},e.ptm("root")),[o.createElementVNode("div",o.mergeProps({class:e.cx("wrapper")},e.ptm("wrapper")),[o.createElementVNode("div",o.mergeProps({ref:"content",id:c.contentId,class:e.cx("content"),onScroll:t[0]||(t[0]=function(){return c.onScroll&&c.onScroll.apply(c,arguments)}),onMouseenter:t[1]||(t[1]=function(){return c.moveBar&&c.moveBar.apply(c,arguments)})},e.ptm("content")),[o.renderSlot(e.$slots,"default")],16,i)],16),o.createElementVNode("div",o.mergeProps({ref:"xBar",class:e.cx("barx"),tabindex:"0",role:"scrollbar","aria-orientation":"horizontal","aria-controls":c.contentId,"aria-valuenow":r.lastScrollLeft,onMousedown:t[2]||(t[2]=function(){return c.onXBarMouseDown&&c.onXBarMouseDown.apply(c,arguments)}),onKeydown:t[3]||(t[3]=function(e){return c.onKeyDown(e)}),onKeyup:t[4]||(t[4]=function(){return c.onKeyUp&&c.onKeyUp.apply(c,arguments)}),onFocus:t[5]||(t[5]=function(){return c.onFocus&&c.onFocus.apply(c,arguments)}),onBlur:t[6]||(t[6]=function(){return c.onBlur&&c.onBlur.apply(c,arguments)})},e.ptm("barx"),{"data-pc-group-section":"bar"}),null,16,a),o.createElementVNode("div",o.mergeProps({ref:"yBar",class:e.cx("bary"),tabindex:"0",role:"scrollbar","aria-orientation":"vertical","aria-controls":c.contentId,"aria-valuenow":r.lastScrollTop,onMousedown:t[7]||(t[7]=function(){return c.onYBarMouseDown&&c.onYBarMouseDown.apply(c,arguments)}),onKeydown:t[8]||(t[8]=function(e){return c.onKeyDown(e)}),onKeyup:t[9]||(t[9]=function(){return c.onKeyUp&&c.onKeyUp.apply(c,arguments)}),onFocus:t[10]||(t[10]=function(){return c.onFocus&&c.onFocus.apply(c,arguments)})},e.ptm("bary"),{"data-pc-group-section":"bar"}),null,16,l)],16)},module.exports=r;

package/scrollpanel/scrollpanel.esm.js

@@ -38,13 +38,19 @@ var script = {
   outsideClickListener: null,
   data: function data() {
     return {
-      id: UniqueComponentId(),
+      id: this.$attrs.id,
       orientation: 'vertical',
       lastScrollTop: 0,
       lastScrollLeft: 0
     };
   },
+  watch: {
+    '$attrs.id': function $attrsId(newValue) {
+      this.id = newValue || UniqueComponentId();
+    }
+  },
   mounted: function mounted() {
+    this.id = this.id || UniqueComponentId();
     if (this.$el.offsetParent) {
       this.initialize();
     }
@@ -315,7 +321,7 @@ var script = {
   },
   computed: {
     contentId: function contentId() {
-      return UniqueComponentId() + '_content';
+      return this.id + '_content';
     }
   }
 };
@@ -326,9 +332,7 @@ var _hoisted_3 = ["aria-controls", "aria-valuenow"];
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("div", mergeProps({
     "class": _ctx.cx('root')
-  }, _ctx.ptm('root'), {
-    "data-pc-name": "scrollpanel"
-  }), [createElementVNode("div", mergeProps({
+  }, _ctx.ptm('root')), [createElementVNode("div", mergeProps({
     "class": _ctx.cx('wrapper')
   }, _ctx.ptm('wrapper')), [createElementVNode("div", mergeProps({
     ref: "content",

package/scrollpanel/scrollpanel.esm.min.js

@@ -1 +1 @@
-import{UniqueComponentId as e,DomHandler as t}from"primevue/utils";import s from"primevue/basecomponent";import n from"primevue/scrollpanel/style";import{openBlock as o,createElementBlock as i,mergeProps as r,createElementVNode as a,renderSlot as l}from"vue";var c={name:"ScrollPanel",extends:{name:"BaseScrollPanel",extends:s,props:{step:{type:Number,default:5}},style:n,provide:function(){return{$parentInstance:this}}},initialized:!1,documentResizeListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,frame:null,scrollXRatio:null,scrollYRatio:null,isXBarClicked:!1,isYBarClicked:!1,lastPageX:null,lastPageY:null,timer:null,outsideClickListener:null,data:function(){return{id:e(),orientation:"vertical",lastScrollTop:0,lastScrollLeft:0}},mounted:function(){this.$el.offsetParent&&this.initialize()},updated:function(){!this.initialized&&this.$el.offsetParent&&this.initialize()},beforeUnmount:function(){this.unbindDocumentResizeListener(),this.frame&&window.cancelAnimationFrame(this.frame)},methods:{initialize:function(){this.moveBar(),this.bindDocumentResizeListener(),this.calculateContainerHeight()},calculateContainerHeight:function(){var e=getComputedStyle(this.$el),s=getComputedStyle(this.$refs.xBar),n=t.getHeight(this.$el)-parseInt(s.height,10);"none"!==e["max-height"]&&0===n&&(this.$el.style.height=this.$refs.content.offsetHeight+parseInt(s.height,10)>parseInt(e["max-height"],10)?e["max-height"]:this.$refs.content.offsetHeight+parseFloat(e.paddingTop)+parseFloat(e.paddingBottom)+parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth)+"px")},moveBar:function(){var e=this;if(this.$refs.content){var s=this.$refs.content.scrollWidth,n=-1*(this.$el.clientHeight-this.$refs.xBar.clientHeight);this.scrollXRatio=this.$refs.content.clientWidth/s;var o=this.$refs.content.scrollHeight,i=-1*(this.$el.clientWidth-this.$refs.yBar.clientWidth);this.scrollYRatio=this.$refs.content.clientHeight/o,this.frame=this.requestAnimationFrame((function(){e.scrollXRatio>=1?(e.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","true"),!e.isUnstyled&&t.addClass(e.$refs.xBar,"p-scrollpanel-hidden")):(e.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","false"),!e.isUnstyled&&t.removeClass(e.$refs.xBar,"p-scrollpanel-hidden"),e.$refs.xBar.style.cssText="width:"+Math.max(100*e.scrollXRatio,10)+"%; left:"+e.$refs.content.scrollLeft/s*100+"%;bottom:"+n+"px;"),e.scrollYRatio>=1?(e.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","true"),!e.isUnstyled&&t.addClass(e.$refs.yBar,"p-scrollpanel-hidden")):(e.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","false"),!e.isUnstyled&&t.removeClass(e.$refs.yBar,"p-scrollpanel-hidden"),e.$refs.yBar.style.cssText="height:"+Math.max(100*e.scrollYRatio,10)+"%; top: calc("+e.$refs.content.scrollTop/o*100+"% - "+e.$refs.xBar.clientHeight+"px);right:"+i+"px;")}))}},onYBarMouseDown:function(e){this.isYBarClicked=!0,this.$refs.yBar.focus(),this.lastPageY=e.pageY,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&t.addClass(this.$refs.yBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&t.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),e.preventDefault()},onXBarMouseDown:function(e){this.isXBarClicked=!0,this.$refs.xBar.focus(),this.lastPageX=e.pageX,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.addClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),e.preventDefault()},onScroll:function(e){this.lastScrollLeft!==e.target.scrollLeft?(this.lastScrollLeft=e.target.scrollLeft,this.orientation="horizontal"):this.lastScrollTop!==e.target.scrollTop&&(this.lastScrollTop=e.target.scrollTop,this.orientation="vertical"),this.moveBar()},onKeyDown:function(e){if("vertical"===this.orientation)switch(e.code){case"ArrowDown":this.setTimer("scrollTop",this.step),e.preventDefault();break;case"ArrowUp":this.setTimer("scrollTop",-1*this.step),e.preventDefault();break;case"ArrowLeft":case"ArrowRight":e.preventDefault()}else if("horizontal"===this.orientation)switch(e.code){case"ArrowRight":this.setTimer("scrollLeft",this.step),e.preventDefault();break;case"ArrowLeft":this.setTimer("scrollLeft",-1*this.step),e.preventDefault();break;case"ArrowDown":case"ArrowUp":e.preventDefault()}},onKeyUp:function(){this.clearTimer()},repeat:function(e,t){this.$refs.content[e]+=t,this.moveBar()},setTimer:function(e,t){var s=this;this.clearTimer(),this.timer=setTimeout((function(){s.repeat(e,t)}),40)},clearTimer:function(){this.timer&&clearTimeout(this.timer)},onDocumentMouseMove:function(e){this.isXBarClicked?this.onMouseMoveForXBar(e):(this.isYBarClicked||this.onMouseMoveForXBar(e),this.onMouseMoveForYBar(e))},onMouseMoveForXBar:function(e){var t=this,s=e.pageX-this.lastPageX;this.lastPageX=e.pageX,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollLeft+=s/t.scrollXRatio}))},onMouseMoveForYBar:function(e){var t=this,s=e.pageY-this.lastPageY;this.lastPageY=e.pageY,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollTop+=s/t.scrollYRatio}))},onFocus:function(e){this.$refs.xBar.isSameNode(e.target)?this.orientation="horizontal":this.$refs.yBar.isSameNode(e.target)&&(this.orientation="vertical")},onBlur:function(){"horizontal"===this.orientation&&(this.orientation="vertical")},onDocumentMouseUp:function(){this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.removeClass(this.$refs.yBar,"p-scrollpanel-grabbed"),this.$refs.xBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.removeClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.removeClass(document.body,"p-scrollpanel-grabbed"),this.unbindDocumentMouseListeners(),this.isXBarClicked=!1,this.isYBarClicked=!1},requestAnimationFrame:function(e){return(window.requestAnimationFrame||this.timeoutFrame)(e)},refresh:function(){this.moveBar()},scrollTop:function(e){var t=this.$refs.content.scrollHeight-this.$refs.content.clientHeight;this.$refs.content.scrollTop=e=e>t?t:e>0?e:0},timeoutFrame:function(e){setTimeout(e,0)},bindDocumentMouseListeners:function(){var e=this;this.documentMouseMoveListener||(this.documentMouseMoveListener=function(t){e.onDocumentMouseMove(t)},document.addEventListener("mousemove",this.documentMouseMoveListener)),this.documentMouseUpListener||(this.documentMouseUpListener=function(t){e.onDocumentMouseUp(t)},document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseListeners:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null),this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},bindDocumentResizeListener:function(){var e=this;this.documentResizeListener||(this.documentResizeListener=function(){e.moveBar()},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentResizeListener:function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)}},computed:{contentId:function(){return e()+"_content"}}},u=["id"],d=["aria-controls","aria-valuenow"],h=["aria-controls","aria-valuenow"];c.render=function(e,t,s,n,c,p){return o(),i("div",r({class:e.cx("root")},e.ptm("root"),{"data-pc-name":"scrollpanel"}),[a("div",r({class:e.cx("wrapper")},e.ptm("wrapper")),[a("div",r({ref:"content",id:p.contentId,class:e.cx("content"),onScroll:t[0]||(t[0]=function(){return p.onScroll&&p.onScroll.apply(p,arguments)}),onMouseenter:t[1]||(t[1]=function(){return p.moveBar&&p.moveBar.apply(p,arguments)})},e.ptm("content")),[l(e.$slots,"default")],16,u)],16),a("div",r({ref:"xBar",class:e.cx("barx"),tabindex:"0",role:"scrollbar","aria-orientation":"horizontal","aria-controls":p.contentId,"aria-valuenow":c.lastScrollLeft,onMousedown:t[2]||(t[2]=function(){return p.onXBarMouseDown&&p.onXBarMouseDown.apply(p,arguments)}),onKeydown:t[3]||(t[3]=function(e){return p.onKeyDown(e)}),onKeyup:t[4]||(t[4]=function(){return p.onKeyUp&&p.onKeyUp.apply(p,arguments)}),onFocus:t[5]||(t[5]=function(){return p.onFocus&&p.onFocus.apply(p,arguments)}),onBlur:t[6]||(t[6]=function(){return p.onBlur&&p.onBlur.apply(p,arguments)})},e.ptm("barx"),{"data-pc-group-section":"bar"}),null,16,d),a("div",r({ref:"yBar",class:e.cx("bary"),tabindex:"0",role:"scrollbar","aria-orientation":"vertical","aria-controls":p.contentId,"aria-valuenow":c.lastScrollTop,onMousedown:t[7]||(t[7]=function(){return p.onYBarMouseDown&&p.onYBarMouseDown.apply(p,arguments)}),onKeydown:t[8]||(t[8]=function(e){return p.onKeyDown(e)}),onKeyup:t[9]||(t[9]=function(){return p.onKeyUp&&p.onKeyUp.apply(p,arguments)}),onFocus:t[10]||(t[10]=function(){return p.onFocus&&p.onFocus.apply(p,arguments)})},e.ptm("bary"),{"data-pc-group-section":"bar"}),null,16,h)],16)};export{c as default};
+import{UniqueComponentId as e,DomHandler as t}from"primevue/utils";import s from"primevue/basecomponent";import n from"primevue/scrollpanel/style";import{openBlock as o,createElementBlock as i,mergeProps as r,createElementVNode as a,renderSlot as l}from"vue";var c={name:"ScrollPanel",extends:{name:"BaseScrollPanel",extends:s,props:{step:{type:Number,default:5}},style:n,provide:function(){return{$parentInstance:this}}},initialized:!1,documentResizeListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,frame:null,scrollXRatio:null,scrollYRatio:null,isXBarClicked:!1,isYBarClicked:!1,lastPageX:null,lastPageY:null,timer:null,outsideClickListener:null,data:function(){return{id:this.$attrs.id,orientation:"vertical",lastScrollTop:0,lastScrollLeft:0}},watch:{"$attrs.id":function(t){this.id=t||e()}},mounted:function(){this.id=this.id||e(),this.$el.offsetParent&&this.initialize()},updated:function(){!this.initialized&&this.$el.offsetParent&&this.initialize()},beforeUnmount:function(){this.unbindDocumentResizeListener(),this.frame&&window.cancelAnimationFrame(this.frame)},methods:{initialize:function(){this.moveBar(),this.bindDocumentResizeListener(),this.calculateContainerHeight()},calculateContainerHeight:function(){var e=getComputedStyle(this.$el),s=getComputedStyle(this.$refs.xBar),n=t.getHeight(this.$el)-parseInt(s.height,10);"none"!==e["max-height"]&&0===n&&(this.$el.style.height=this.$refs.content.offsetHeight+parseInt(s.height,10)>parseInt(e["max-height"],10)?e["max-height"]:this.$refs.content.offsetHeight+parseFloat(e.paddingTop)+parseFloat(e.paddingBottom)+parseFloat(e.borderTopWidth)+parseFloat(e.borderBottomWidth)+"px")},moveBar:function(){var e=this;if(this.$refs.content){var s=this.$refs.content.scrollWidth,n=-1*(this.$el.clientHeight-this.$refs.xBar.clientHeight);this.scrollXRatio=this.$refs.content.clientWidth/s;var o=this.$refs.content.scrollHeight,i=-1*(this.$el.clientWidth-this.$refs.yBar.clientWidth);this.scrollYRatio=this.$refs.content.clientHeight/o,this.frame=this.requestAnimationFrame((function(){e.scrollXRatio>=1?(e.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","true"),!e.isUnstyled&&t.addClass(e.$refs.xBar,"p-scrollpanel-hidden")):(e.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","false"),!e.isUnstyled&&t.removeClass(e.$refs.xBar,"p-scrollpanel-hidden"),e.$refs.xBar.style.cssText="width:"+Math.max(100*e.scrollXRatio,10)+"%; left:"+e.$refs.content.scrollLeft/s*100+"%;bottom:"+n+"px;"),e.scrollYRatio>=1?(e.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","true"),!e.isUnstyled&&t.addClass(e.$refs.yBar,"p-scrollpanel-hidden")):(e.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","false"),!e.isUnstyled&&t.removeClass(e.$refs.yBar,"p-scrollpanel-hidden"),e.$refs.yBar.style.cssText="height:"+Math.max(100*e.scrollYRatio,10)+"%; top: calc("+e.$refs.content.scrollTop/o*100+"% - "+e.$refs.xBar.clientHeight+"px);right:"+i+"px;")}))}},onYBarMouseDown:function(e){this.isYBarClicked=!0,this.$refs.yBar.focus(),this.lastPageY=e.pageY,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&t.addClass(this.$refs.yBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&t.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),e.preventDefault()},onXBarMouseDown:function(e){this.isXBarClicked=!0,this.$refs.xBar.focus(),this.lastPageX=e.pageX,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.addClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),e.preventDefault()},onScroll:function(e){this.lastScrollLeft!==e.target.scrollLeft?(this.lastScrollLeft=e.target.scrollLeft,this.orientation="horizontal"):this.lastScrollTop!==e.target.scrollTop&&(this.lastScrollTop=e.target.scrollTop,this.orientation="vertical"),this.moveBar()},onKeyDown:function(e){if("vertical"===this.orientation)switch(e.code){case"ArrowDown":this.setTimer("scrollTop",this.step),e.preventDefault();break;case"ArrowUp":this.setTimer("scrollTop",-1*this.step),e.preventDefault();break;case"ArrowLeft":case"ArrowRight":e.preventDefault()}else if("horizontal"===this.orientation)switch(e.code){case"ArrowRight":this.setTimer("scrollLeft",this.step),e.preventDefault();break;case"ArrowLeft":this.setTimer("scrollLeft",-1*this.step),e.preventDefault();break;case"ArrowDown":case"ArrowUp":e.preventDefault()}},onKeyUp:function(){this.clearTimer()},repeat:function(e,t){this.$refs.content[e]+=t,this.moveBar()},setTimer:function(e,t){var s=this;this.clearTimer(),this.timer=setTimeout((function(){s.repeat(e,t)}),40)},clearTimer:function(){this.timer&&clearTimeout(this.timer)},onDocumentMouseMove:function(e){this.isXBarClicked?this.onMouseMoveForXBar(e):(this.isYBarClicked||this.onMouseMoveForXBar(e),this.onMouseMoveForYBar(e))},onMouseMoveForXBar:function(e){var t=this,s=e.pageX-this.lastPageX;this.lastPageX=e.pageX,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollLeft+=s/t.scrollXRatio}))},onMouseMoveForYBar:function(e){var t=this,s=e.pageY-this.lastPageY;this.lastPageY=e.pageY,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollTop+=s/t.scrollYRatio}))},onFocus:function(e){this.$refs.xBar.isSameNode(e.target)?this.orientation="horizontal":this.$refs.yBar.isSameNode(e.target)&&(this.orientation="vertical")},onBlur:function(){"horizontal"===this.orientation&&(this.orientation="vertical")},onDocumentMouseUp:function(){this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.removeClass(this.$refs.yBar,"p-scrollpanel-grabbed"),this.$refs.xBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.removeClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&t.removeClass(document.body,"p-scrollpanel-grabbed"),this.unbindDocumentMouseListeners(),this.isXBarClicked=!1,this.isYBarClicked=!1},requestAnimationFrame:function(e){return(window.requestAnimationFrame||this.timeoutFrame)(e)},refresh:function(){this.moveBar()},scrollTop:function(e){var t=this.$refs.content.scrollHeight-this.$refs.content.clientHeight;this.$refs.content.scrollTop=e=e>t?t:e>0?e:0},timeoutFrame:function(e){setTimeout(e,0)},bindDocumentMouseListeners:function(){var e=this;this.documentMouseMoveListener||(this.documentMouseMoveListener=function(t){e.onDocumentMouseMove(t)},document.addEventListener("mousemove",this.documentMouseMoveListener)),this.documentMouseUpListener||(this.documentMouseUpListener=function(t){e.onDocumentMouseUp(t)},document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseListeners:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null),this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},bindDocumentResizeListener:function(){var e=this;this.documentResizeListener||(this.documentResizeListener=function(){e.moveBar()},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentResizeListener:function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)}},computed:{contentId:function(){return this.id+"_content"}}},u=["id"],h=["aria-controls","aria-valuenow"],d=["aria-controls","aria-valuenow"];c.render=function(e,t,s,n,c,p){return o(),i("div",r({class:e.cx("root")},e.ptm("root")),[a("div",r({class:e.cx("wrapper")},e.ptm("wrapper")),[a("div",r({ref:"content",id:p.contentId,class:e.cx("content"),onScroll:t[0]||(t[0]=function(){return p.onScroll&&p.onScroll.apply(p,arguments)}),onMouseenter:t[1]||(t[1]=function(){return p.moveBar&&p.moveBar.apply(p,arguments)})},e.ptm("content")),[l(e.$slots,"default")],16,u)],16),a("div",r({ref:"xBar",class:e.cx("barx"),tabindex:"0",role:"scrollbar","aria-orientation":"horizontal","aria-controls":p.contentId,"aria-valuenow":c.lastScrollLeft,onMousedown:t[2]||(t[2]=function(){return p.onXBarMouseDown&&p.onXBarMouseDown.apply(p,arguments)}),onKeydown:t[3]||(t[3]=function(e){return p.onKeyDown(e)}),onKeyup:t[4]||(t[4]=function(){return p.onKeyUp&&p.onKeyUp.apply(p,arguments)}),onFocus:t[5]||(t[5]=function(){return p.onFocus&&p.onFocus.apply(p,arguments)}),onBlur:t[6]||(t[6]=function(){return p.onBlur&&p.onBlur.apply(p,arguments)})},e.ptm("barx"),{"data-pc-group-section":"bar"}),null,16,h),a("div",r({ref:"yBar",class:e.cx("bary"),tabindex:"0",role:"scrollbar","aria-orientation":"vertical","aria-controls":p.contentId,"aria-valuenow":c.lastScrollTop,onMousedown:t[7]||(t[7]=function(){return p.onYBarMouseDown&&p.onYBarMouseDown.apply(p,arguments)}),onKeydown:t[8]||(t[8]=function(e){return p.onKeyDown(e)}),onKeyup:t[9]||(t[9]=function(){return p.onKeyUp&&p.onKeyUp.apply(p,arguments)}),onFocus:t[10]||(t[10]=function(){return p.onFocus&&p.onFocus.apply(p,arguments)})},e.ptm("bary"),{"data-pc-group-section":"bar"}),null,16,d)],16)};export{c as default};

package/scrollpanel/scrollpanel.js

@@ -42,13 +42,19 @@ this.primevue.scrollpanel = (function (utils, BaseComponent, ScrollPanelStyle, v
       outsideClickListener: null,
       data: function data() {
         return {
-          id: utils.UniqueComponentId(),
+          id: this.$attrs.id,
           orientation: 'vertical',
           lastScrollTop: 0,
           lastScrollLeft: 0
         };
       },
+      watch: {
+        '$attrs.id': function $attrsId(newValue) {
+          this.id = newValue || utils.UniqueComponentId();
+        }
+      },
       mounted: function mounted() {
+        this.id = this.id || utils.UniqueComponentId();
         if (this.$el.offsetParent) {
           this.initialize();
         }
@@ -319,7 +325,7 @@ this.primevue.scrollpanel = (function (utils, BaseComponent, ScrollPanelStyle, v
       },
       computed: {
         contentId: function contentId() {
-          return utils.UniqueComponentId() + '_content';
+          return this.id + '_content';
         }
       }
     };
@@ -330,9 +336,7 @@ this.primevue.scrollpanel = (function (utils, BaseComponent, ScrollPanelStyle, v
     function render(_ctx, _cache, $props, $setup, $data, $options) {
       return vue.openBlock(), vue.createElementBlock("div", vue.mergeProps({
         "class": _ctx.cx('root')
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "scrollpanel"
-      }), [vue.createElementVNode("div", vue.mergeProps({
+      }, _ctx.ptm('root')), [vue.createElementVNode("div", vue.mergeProps({
         "class": _ctx.cx('wrapper')
       }, _ctx.ptm('wrapper')), [vue.createElementVNode("div", vue.mergeProps({
         ref: "content",

package/scrollpanel/scrollpanel.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.scrollpanel=function(e,t,n,o){"use strict";function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"ScrollPanel",extends:{name:"BaseScrollPanel",extends:s(t).default,props:{step:{type:Number,default:5}},style:s(n).default,provide:function(){return{$parentInstance:this}}},initialized:!1,documentResizeListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,frame:null,scrollXRatio:null,scrollYRatio:null,isXBarClicked:!1,isYBarClicked:!1,lastPageX:null,lastPageY:null,timer:null,outsideClickListener:null,data:function(){return{id:e.UniqueComponentId(),orientation:"vertical",lastScrollTop:0,lastScrollLeft:0}},mounted:function(){this.$el.offsetParent&&this.initialize()},updated:function(){!this.initialized&&this.$el.offsetParent&&this.initialize()},beforeUnmount:function(){this.unbindDocumentResizeListener(),this.frame&&window.cancelAnimationFrame(this.frame)},methods:{initialize:function(){this.moveBar(),this.bindDocumentResizeListener(),this.calculateContainerHeight()},calculateContainerHeight:function(){var t=getComputedStyle(this.$el),n=getComputedStyle(this.$refs.xBar),o=e.DomHandler.getHeight(this.$el)-parseInt(n.height,10);"none"!==t["max-height"]&&0===o&&(this.$el.style.height=this.$refs.content.offsetHeight+parseInt(n.height,10)>parseInt(t["max-height"],10)?t["max-height"]:this.$refs.content.offsetHeight+parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)+parseFloat(t.borderTopWidth)+parseFloat(t.borderBottomWidth)+"px")},moveBar:function(){var t=this;if(this.$refs.content){var n=this.$refs.content.scrollWidth,o=-1*(this.$el.clientHeight-this.$refs.xBar.clientHeight);this.scrollXRatio=this.$refs.content.clientWidth/n;var s=this.$refs.content.scrollHeight,r=-1*(this.$el.clientWidth-this.$refs.yBar.clientWidth);this.scrollYRatio=this.$refs.content.clientHeight/s,this.frame=this.requestAnimationFrame((function(){t.scrollXRatio>=1?(t.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","true"),!t.isUnstyled&&e.DomHandler.addClass(t.$refs.xBar,"p-scrollpanel-hidden")):(t.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","false"),!t.isUnstyled&&e.DomHandler.removeClass(t.$refs.xBar,"p-scrollpanel-hidden"),t.$refs.xBar.style.cssText="width:"+Math.max(100*t.scrollXRatio,10)+"%; left:"+t.$refs.content.scrollLeft/n*100+"%;bottom:"+o+"px;"),t.scrollYRatio>=1?(t.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","true"),!t.isUnstyled&&e.DomHandler.addClass(t.$refs.yBar,"p-scrollpanel-hidden")):(t.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","false"),!t.isUnstyled&&e.DomHandler.removeClass(t.$refs.yBar,"p-scrollpanel-hidden"),t.$refs.yBar.style.cssText="height:"+Math.max(100*t.scrollYRatio,10)+"%; top: calc("+t.$refs.content.scrollTop/s*100+"% - "+t.$refs.xBar.clientHeight+"px);right:"+r+"px;")}))}},onYBarMouseDown:function(t){this.isYBarClicked=!0,this.$refs.yBar.focus(),this.lastPageY=t.pageY,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&e.DomHandler.addClass(this.$refs.yBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&e.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),t.preventDefault()},onXBarMouseDown:function(t){this.isXBarClicked=!0,this.$refs.xBar.focus(),this.lastPageX=t.pageX,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.addClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),t.preventDefault()},onScroll:function(e){this.lastScrollLeft!==e.target.scrollLeft?(this.lastScrollLeft=e.target.scrollLeft,this.orientation="horizontal"):this.lastScrollTop!==e.target.scrollTop&&(this.lastScrollTop=e.target.scrollTop,this.orientation="vertical"),this.moveBar()},onKeyDown:function(e){if("vertical"===this.orientation)switch(e.code){case"ArrowDown":this.setTimer("scrollTop",this.step),e.preventDefault();break;case"ArrowUp":this.setTimer("scrollTop",-1*this.step),e.preventDefault();break;case"ArrowLeft":case"ArrowRight":e.preventDefault()}else if("horizontal"===this.orientation)switch(e.code){case"ArrowRight":this.setTimer("scrollLeft",this.step),e.preventDefault();break;case"ArrowLeft":this.setTimer("scrollLeft",-1*this.step),e.preventDefault();break;case"ArrowDown":case"ArrowUp":e.preventDefault()}},onKeyUp:function(){this.clearTimer()},repeat:function(e,t){this.$refs.content[e]+=t,this.moveBar()},setTimer:function(e,t){var n=this;this.clearTimer(),this.timer=setTimeout((function(){n.repeat(e,t)}),40)},clearTimer:function(){this.timer&&clearTimeout(this.timer)},onDocumentMouseMove:function(e){this.isXBarClicked?this.onMouseMoveForXBar(e):(this.isYBarClicked||this.onMouseMoveForXBar(e),this.onMouseMoveForYBar(e))},onMouseMoveForXBar:function(e){var t=this,n=e.pageX-this.lastPageX;this.lastPageX=e.pageX,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollLeft+=n/t.scrollXRatio}))},onMouseMoveForYBar:function(e){var t=this,n=e.pageY-this.lastPageY;this.lastPageY=e.pageY,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollTop+=n/t.scrollYRatio}))},onFocus:function(e){this.$refs.xBar.isSameNode(e.target)?this.orientation="horizontal":this.$refs.yBar.isSameNode(e.target)&&(this.orientation="vertical")},onBlur:function(){"horizontal"===this.orientation&&(this.orientation="vertical")},onDocumentMouseUp:function(){this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(this.$refs.yBar,"p-scrollpanel-grabbed"),this.$refs.xBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(document.body,"p-scrollpanel-grabbed"),this.unbindDocumentMouseListeners(),this.isXBarClicked=!1,this.isYBarClicked=!1},requestAnimationFrame:function(e){return(window.requestAnimationFrame||this.timeoutFrame)(e)},refresh:function(){this.moveBar()},scrollTop:function(e){var t=this.$refs.content.scrollHeight-this.$refs.content.clientHeight;this.$refs.content.scrollTop=e=e>t?t:e>0?e:0},timeoutFrame:function(e){setTimeout(e,0)},bindDocumentMouseListeners:function(){var e=this;this.documentMouseMoveListener||(this.documentMouseMoveListener=function(t){e.onDocumentMouseMove(t)},document.addEventListener("mousemove",this.documentMouseMoveListener)),this.documentMouseUpListener||(this.documentMouseUpListener=function(t){e.onDocumentMouseUp(t)},document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseListeners:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null),this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},bindDocumentResizeListener:function(){var e=this;this.documentResizeListener||(this.documentResizeListener=function(){e.moveBar()},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentResizeListener:function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)}},computed:{contentId:function(){return e.UniqueComponentId()+"_content"}}},i=["id"],a=["aria-controls","aria-valuenow"],l=["aria-controls","aria-valuenow"];return r.render=function(e,t,n,s,r,c){return o.openBlock(),o.createElementBlock("div",o.mergeProps({class:e.cx("root")},e.ptm("root"),{"data-pc-name":"scrollpanel"}),[o.createElementVNode("div",o.mergeProps({class:e.cx("wrapper")},e.ptm("wrapper")),[o.createElementVNode("div",o.mergeProps({ref:"content",id:c.contentId,class:e.cx("content"),onScroll:t[0]||(t[0]=function(){return c.onScroll&&c.onScroll.apply(c,arguments)}),onMouseenter:t[1]||(t[1]=function(){return c.moveBar&&c.moveBar.apply(c,arguments)})},e.ptm("content")),[o.renderSlot(e.$slots,"default")],16,i)],16),o.createElementVNode("div",o.mergeProps({ref:"xBar",class:e.cx("barx"),tabindex:"0",role:"scrollbar","aria-orientation":"horizontal","aria-controls":c.contentId,"aria-valuenow":r.lastScrollLeft,onMousedown:t[2]||(t[2]=function(){return c.onXBarMouseDown&&c.onXBarMouseDown.apply(c,arguments)}),onKeydown:t[3]||(t[3]=function(e){return c.onKeyDown(e)}),onKeyup:t[4]||(t[4]=function(){return c.onKeyUp&&c.onKeyUp.apply(c,arguments)}),onFocus:t[5]||(t[5]=function(){return c.onFocus&&c.onFocus.apply(c,arguments)}),onBlur:t[6]||(t[6]=function(){return c.onBlur&&c.onBlur.apply(c,arguments)})},e.ptm("barx"),{"data-pc-group-section":"bar"}),null,16,a),o.createElementVNode("div",o.mergeProps({ref:"yBar",class:e.cx("bary"),tabindex:"0",role:"scrollbar","aria-orientation":"vertical","aria-controls":c.contentId,"aria-valuenow":r.lastScrollTop,onMousedown:t[7]||(t[7]=function(){return c.onYBarMouseDown&&c.onYBarMouseDown.apply(c,arguments)}),onKeydown:t[8]||(t[8]=function(e){return c.onKeyDown(e)}),onKeyup:t[9]||(t[9]=function(){return c.onKeyUp&&c.onKeyUp.apply(c,arguments)}),onFocus:t[10]||(t[10]=function(){return c.onFocus&&c.onFocus.apply(c,arguments)})},e.ptm("bary"),{"data-pc-group-section":"bar"}),null,16,l)],16)},r}(primevue.utils,primevue.basecomponent,primevue.scrollpanel.style,Vue);
+this.primevue=this.primevue||{},this.primevue.scrollpanel=function(e,t,n,o){"use strict";function s(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r={name:"ScrollPanel",extends:{name:"BaseScrollPanel",extends:s(t).default,props:{step:{type:Number,default:5}},style:s(n).default,provide:function(){return{$parentInstance:this}}},initialized:!1,documentResizeListener:null,documentMouseMoveListener:null,documentMouseUpListener:null,frame:null,scrollXRatio:null,scrollYRatio:null,isXBarClicked:!1,isYBarClicked:!1,lastPageX:null,lastPageY:null,timer:null,outsideClickListener:null,data:function(){return{id:this.$attrs.id,orientation:"vertical",lastScrollTop:0,lastScrollLeft:0}},watch:{"$attrs.id":function(t){this.id=t||e.UniqueComponentId()}},mounted:function(){this.id=this.id||e.UniqueComponentId(),this.$el.offsetParent&&this.initialize()},updated:function(){!this.initialized&&this.$el.offsetParent&&this.initialize()},beforeUnmount:function(){this.unbindDocumentResizeListener(),this.frame&&window.cancelAnimationFrame(this.frame)},methods:{initialize:function(){this.moveBar(),this.bindDocumentResizeListener(),this.calculateContainerHeight()},calculateContainerHeight:function(){var t=getComputedStyle(this.$el),n=getComputedStyle(this.$refs.xBar),o=e.DomHandler.getHeight(this.$el)-parseInt(n.height,10);"none"!==t["max-height"]&&0===o&&(this.$el.style.height=this.$refs.content.offsetHeight+parseInt(n.height,10)>parseInt(t["max-height"],10)?t["max-height"]:this.$refs.content.offsetHeight+parseFloat(t.paddingTop)+parseFloat(t.paddingBottom)+parseFloat(t.borderTopWidth)+parseFloat(t.borderBottomWidth)+"px")},moveBar:function(){var t=this;if(this.$refs.content){var n=this.$refs.content.scrollWidth,o=-1*(this.$el.clientHeight-this.$refs.xBar.clientHeight);this.scrollXRatio=this.$refs.content.clientWidth/n;var s=this.$refs.content.scrollHeight,r=-1*(this.$el.clientWidth-this.$refs.yBar.clientWidth);this.scrollYRatio=this.$refs.content.clientHeight/s,this.frame=this.requestAnimationFrame((function(){t.scrollXRatio>=1?(t.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","true"),!t.isUnstyled&&e.DomHandler.addClass(t.$refs.xBar,"p-scrollpanel-hidden")):(t.$refs.xBar.setAttribute("data-p-scrollpanel-hidden","false"),!t.isUnstyled&&e.DomHandler.removeClass(t.$refs.xBar,"p-scrollpanel-hidden"),t.$refs.xBar.style.cssText="width:"+Math.max(100*t.scrollXRatio,10)+"%; left:"+t.$refs.content.scrollLeft/n*100+"%;bottom:"+o+"px;"),t.scrollYRatio>=1?(t.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","true"),!t.isUnstyled&&e.DomHandler.addClass(t.$refs.yBar,"p-scrollpanel-hidden")):(t.$refs.yBar.setAttribute("data-p-scrollpanel-hidden","false"),!t.isUnstyled&&e.DomHandler.removeClass(t.$refs.yBar,"p-scrollpanel-hidden"),t.$refs.yBar.style.cssText="height:"+Math.max(100*t.scrollYRatio,10)+"%; top: calc("+t.$refs.content.scrollTop/s*100+"% - "+t.$refs.xBar.clientHeight+"px);right:"+r+"px;")}))}},onYBarMouseDown:function(t){this.isYBarClicked=!0,this.$refs.yBar.focus(),this.lastPageY=t.pageY,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&e.DomHandler.addClass(this.$refs.yBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","true"),!this.isUnstyled&&e.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),t.preventDefault()},onXBarMouseDown:function(t){this.isXBarClicked=!0,this.$refs.xBar.focus(),this.lastPageX=t.pageX,this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.addClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.addClass(document.body,"p-scrollpanel-grabbed"),this.bindDocumentMouseListeners(),t.preventDefault()},onScroll:function(e){this.lastScrollLeft!==e.target.scrollLeft?(this.lastScrollLeft=e.target.scrollLeft,this.orientation="horizontal"):this.lastScrollTop!==e.target.scrollTop&&(this.lastScrollTop=e.target.scrollTop,this.orientation="vertical"),this.moveBar()},onKeyDown:function(e){if("vertical"===this.orientation)switch(e.code){case"ArrowDown":this.setTimer("scrollTop",this.step),e.preventDefault();break;case"ArrowUp":this.setTimer("scrollTop",-1*this.step),e.preventDefault();break;case"ArrowLeft":case"ArrowRight":e.preventDefault()}else if("horizontal"===this.orientation)switch(e.code){case"ArrowRight":this.setTimer("scrollLeft",this.step),e.preventDefault();break;case"ArrowLeft":this.setTimer("scrollLeft",-1*this.step),e.preventDefault();break;case"ArrowDown":case"ArrowUp":e.preventDefault()}},onKeyUp:function(){this.clearTimer()},repeat:function(e,t){this.$refs.content[e]+=t,this.moveBar()},setTimer:function(e,t){var n=this;this.clearTimer(),this.timer=setTimeout((function(){n.repeat(e,t)}),40)},clearTimer:function(){this.timer&&clearTimeout(this.timer)},onDocumentMouseMove:function(e){this.isXBarClicked?this.onMouseMoveForXBar(e):(this.isYBarClicked||this.onMouseMoveForXBar(e),this.onMouseMoveForYBar(e))},onMouseMoveForXBar:function(e){var t=this,n=e.pageX-this.lastPageX;this.lastPageX=e.pageX,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollLeft+=n/t.scrollXRatio}))},onMouseMoveForYBar:function(e){var t=this,n=e.pageY-this.lastPageY;this.lastPageY=e.pageY,this.frame=this.requestAnimationFrame((function(){t.$refs.content.scrollTop+=n/t.scrollYRatio}))},onFocus:function(e){this.$refs.xBar.isSameNode(e.target)?this.orientation="horizontal":this.$refs.yBar.isSameNode(e.target)&&(this.orientation="vertical")},onBlur:function(){"horizontal"===this.orientation&&(this.orientation="vertical")},onDocumentMouseUp:function(){this.$refs.yBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(this.$refs.yBar,"p-scrollpanel-grabbed"),this.$refs.xBar.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(this.$refs.xBar,"p-scrollpanel-grabbed"),document.body.setAttribute("data-p-scrollpanel-grabbed","false"),!this.isUnstyled&&e.DomHandler.removeClass(document.body,"p-scrollpanel-grabbed"),this.unbindDocumentMouseListeners(),this.isXBarClicked=!1,this.isYBarClicked=!1},requestAnimationFrame:function(e){return(window.requestAnimationFrame||this.timeoutFrame)(e)},refresh:function(){this.moveBar()},scrollTop:function(e){var t=this.$refs.content.scrollHeight-this.$refs.content.clientHeight;this.$refs.content.scrollTop=e=e>t?t:e>0?e:0},timeoutFrame:function(e){setTimeout(e,0)},bindDocumentMouseListeners:function(){var e=this;this.documentMouseMoveListener||(this.documentMouseMoveListener=function(t){e.onDocumentMouseMove(t)},document.addEventListener("mousemove",this.documentMouseMoveListener)),this.documentMouseUpListener||(this.documentMouseUpListener=function(t){e.onDocumentMouseUp(t)},document.addEventListener("mouseup",this.documentMouseUpListener))},unbindDocumentMouseListeners:function(){this.documentMouseMoveListener&&(document.removeEventListener("mousemove",this.documentMouseMoveListener),this.documentMouseMoveListener=null),this.documentMouseUpListener&&(document.removeEventListener("mouseup",this.documentMouseUpListener),this.documentMouseUpListener=null)},bindDocumentResizeListener:function(){var e=this;this.documentResizeListener||(this.documentResizeListener=function(){e.moveBar()},window.addEventListener("resize",this.documentResizeListener))},unbindDocumentResizeListener:function(){this.documentResizeListener&&(window.removeEventListener("resize",this.documentResizeListener),this.documentResizeListener=null)}},computed:{contentId:function(){return this.id+"_content"}}},i=["id"],a=["aria-controls","aria-valuenow"],l=["aria-controls","aria-valuenow"];return r.render=function(e,t,n,s,r,c){return o.openBlock(),o.createElementBlock("div",o.mergeProps({class:e.cx("root")},e.ptm("root")),[o.createElementVNode("div",o.mergeProps({class:e.cx("wrapper")},e.ptm("wrapper")),[o.createElementVNode("div",o.mergeProps({ref:"content",id:c.contentId,class:e.cx("content"),onScroll:t[0]||(t[0]=function(){return c.onScroll&&c.onScroll.apply(c,arguments)}),onMouseenter:t[1]||(t[1]=function(){return c.moveBar&&c.moveBar.apply(c,arguments)})},e.ptm("content")),[o.renderSlot(e.$slots,"default")],16,i)],16),o.createElementVNode("div",o.mergeProps({ref:"xBar",class:e.cx("barx"),tabindex:"0",role:"scrollbar","aria-orientation":"horizontal","aria-controls":c.contentId,"aria-valuenow":r.lastScrollLeft,onMousedown:t[2]||(t[2]=function(){return c.onXBarMouseDown&&c.onXBarMouseDown.apply(c,arguments)}),onKeydown:t[3]||(t[3]=function(e){return c.onKeyDown(e)}),onKeyup:t[4]||(t[4]=function(){return c.onKeyUp&&c.onKeyUp.apply(c,arguments)}),onFocus:t[5]||(t[5]=function(){return c.onFocus&&c.onFocus.apply(c,arguments)}),onBlur:t[6]||(t[6]=function(){return c.onBlur&&c.onBlur.apply(c,arguments)})},e.ptm("barx"),{"data-pc-group-section":"bar"}),null,16,a),o.createElementVNode("div",o.mergeProps({ref:"yBar",class:e.cx("bary"),tabindex:"0",role:"scrollbar","aria-orientation":"vertical","aria-controls":c.contentId,"aria-valuenow":r.lastScrollTop,onMousedown:t[7]||(t[7]=function(){return c.onYBarMouseDown&&c.onYBarMouseDown.apply(c,arguments)}),onKeydown:t[8]||(t[8]=function(e){return c.onKeyDown(e)}),onKeyup:t[9]||(t[9]=function(){return c.onKeyUp&&c.onKeyUp.apply(c,arguments)}),onFocus:t[10]||(t[10]=function(){return c.onFocus&&c.onFocus.apply(c,arguments)})},e.ptm("bary"),{"data-pc-group-section":"bar"}),null,16,l)],16)},r}(primevue.utils,primevue.basecomponent,primevue.scrollpanel.style,Vue);

package/scrollpanel/style/scrollpanelstyle.cjs.js

@@ -6,7 +6,6 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-var css = "\n@layer primevue {\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        scrollbar-width: none;\n    }\n\n    .p-scrollpanel-content::-webkit-scrollbar {\n        display: none;\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";
 var classes = {
   root: 'p-scrollpanel p-component',
   wrapper: 'p-scrollpanel-wrapper',
@@ -16,7 +15,6 @@ var classes = {
 };
 var ScrollPanelStyle = BaseStyle__default["default"].extend({
   name: 'scrollpanel',
-  css: css,
   classes: classes
 });
 

package/scrollpanel/style/scrollpanelstyle.cjs.min.js

@@ -1 +1 @@
-"use strict";function n(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var l=n(require("primevue/base/style")).default.extend({name:"scrollpanel",css:"\n@layer primevue {\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        scrollbar-width: none;\n    }\n\n    .p-scrollpanel-content::-webkit-scrollbar {\n        display: none;\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",classes:{root:"p-scrollpanel p-component",wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"}});module.exports=l;
+"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=e(require("primevue/base/style")).default.extend({name:"scrollpanel",classes:{root:"p-scrollpanel p-component",wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"}});module.exports=l;

package/scrollpanel/style/scrollpanelstyle.esm.js

@@ -1,6 +1,5 @@
 import BaseStyle from 'primevue/base/style';
 
-var css = "\n@layer primevue {\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        scrollbar-width: none;\n    }\n\n    .p-scrollpanel-content::-webkit-scrollbar {\n        display: none;\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";
 var classes = {
   root: 'p-scrollpanel p-component',
   wrapper: 'p-scrollpanel-wrapper',
@@ -10,7 +9,6 @@ var classes = {
 };
 var ScrollPanelStyle = BaseStyle.extend({
   name: 'scrollpanel',
-  css: css,
   classes: classes
 });
 

package/scrollpanel/style/scrollpanelstyle.esm.min.js

@@ -1 +1 @@
-import n from"primevue/base/style";var l=n.extend({name:"scrollpanel",css:"\n@layer primevue {\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        scrollbar-width: none;\n    }\n\n    .p-scrollpanel-content::-webkit-scrollbar {\n        display: none;\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",classes:{root:"p-scrollpanel p-component",wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"}});export{l as default};
+import l from"primevue/base/style";var p=l.extend({name:"scrollpanel",classes:{root:"p-scrollpanel p-component",wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"}});export{p as default};

package/scrollpanel/style/scrollpanelstyle.js

@@ -7,7 +7,6 @@ this.primevue.scrollpanel.style = (function (BaseStyle) {
 
     var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-    var css = "\n@layer primevue {\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        scrollbar-width: none;\n    }\n\n    .p-scrollpanel-content::-webkit-scrollbar {\n        display: none;\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";
     var classes = {
       root: 'p-scrollpanel p-component',
       wrapper: 'p-scrollpanel-wrapper',
@@ -17,7 +16,6 @@ this.primevue.scrollpanel.style = (function (BaseStyle) {
     };
     var ScrollPanelStyle = BaseStyle__default["default"].extend({
       name: 'scrollpanel',
-      css: css,
       classes: classes
     });
 

package/scrollpanel/style/scrollpanelstyle.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.scrollpanel=this.primevue.scrollpanel||{},this.primevue.scrollpanel.style=function(n){"use strict";function l(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}return l(primevue.base.style).default.extend({name:"scrollpanel",css:"\n@layer primevue {\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        scrollbar-width: none;\n    }\n\n    .p-scrollpanel-content::-webkit-scrollbar {\n        display: none;\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",classes:{root:"p-scrollpanel p-component",wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"}})}();
+this.primevue=this.primevue||{},this.primevue.scrollpanel=this.primevue.scrollpanel||{},this.primevue.scrollpanel.style=function(e){"use strict";function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}return l(primevue.base.style).default.extend({name:"scrollpanel",classes:{root:"p-scrollpanel p-component",wrapper:"p-scrollpanel-wrapper",content:"p-scrollpanel-content",barx:"p-scrollpanel-bar p-scrollpanel-bar-x",bary:"p-scrollpanel-bar p-scrollpanel-bar-y"}})}();

package/scrolltop/ScrollTop.vue

@@ -1,6 +1,6 @@
 <template>
     <transition name="p-scrolltop" appear @enter="onEnter" @after-leave="onAfterLeave" v-bind="ptm('transition')">
-        <button v-if="visible" :ref="containerRef" :class="cx('root')" @click="onClick" type="button" :aria-label="scrollTopAriaLabel" v-bind="ptm('root')" data-pc-name="scrolltop">
+        <button v-if="visible" :ref="containerRef" :class="cx('root')" @click="onClick" type="button" :aria-label="scrollTopAriaLabel" v-bind="ptm('root')">
             <slot name="icon" :class="cx('icon')">
                 <component :is="icon ? 'span' : 'ChevronUpIcon'" :class="[cx('icon'), icon]" v-bind="ptm('icon')" />
             </slot>

package/scrolltop/scrolltop.cjs.js

@@ -136,9 +136,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }),
         type: "button",
         "aria-label": $options.scrollTopAriaLabel
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "scrolltop"
-      }), [vue.renderSlot(_ctx.$slots, "icon", {
+      }, _ctx.ptm('root')), [vue.renderSlot(_ctx.$slots, "icon", {
         "class": vue.normalizeClass(_ctx.cx('icon'))
       }, function () {
         return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.icon ? 'span' : 'ChevronUpIcon'), vue.mergeProps({

package/scrolltop/scrolltop.cjs.min.js

@@ -1 +1 @@
-"use strict";var e=require("primevue/icons/chevronup"),t=require("primevue/utils"),n=require("primevue/basecomponent"),r=require("primevue/scrolltop/style"),i=require("vue");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=o(e),s={name:"ScrollTop",extends:{name:"BaseScrollTop",extends:o(n).default,props:{target:{type:String,default:"window"},threshold:{type:Number,default:400},icon:{type:String,default:void 0},behavior:{type:String,default:"smooth"}},style:o(r).default,provide:function(){return{$parentInstance:this}}},scrollListener:null,container:null,data:function(){return{visible:!1}},mounted:function(){"window"===this.target?this.bindDocumentScrollListener():"parent"===this.target&&this.bindParentScrollListener()},beforeUnmount:function(){"window"===this.target?this.unbindDocumentScrollListener():"parent"===this.target&&this.unbindParentScrollListener(),this.container&&(t.ZIndexUtils.clear(this.container),this.overlay=null)},methods:{onClick:function(){("window"===this.target?window:this.$el.parentElement).scroll({top:0,behavior:this.behavior})},checkVisibility:function(e){this.visible=e>this.threshold},bindParentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(e.$el.parentElement.scrollTop)},this.$el.parentElement.addEventListener("scroll",this.scrollListener)},bindDocumentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(t.DomHandler.getWindowScrollTop())},window.addEventListener("scroll",this.scrollListener)},unbindParentScrollListener:function(){this.scrollListener&&(this.$el.parentElement.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},unbindDocumentScrollListener:function(){this.scrollListener&&(window.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},onEnter:function(e){t.ZIndexUtils.set("overlay",e,this.$primevue.config.zIndex.overlay)},onAfterLeave:function(e){t.ZIndexUtils.clear(e)},containerRef:function(e){this.container=e}},computed:{scrollTopAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.scrollTop:void 0}},components:{ChevronUpIcon:l.default}},c=["aria-label"];s.render=function(e,t,n,r,o,l){return i.openBlock(),i.createBlock(i.Transition,i.mergeProps({name:"p-scrolltop",appear:"",onEnter:l.onEnter,onAfterLeave:l.onAfterLeave},e.ptm("transition")),{default:i.withCtx((function(){return[o.visible?(i.openBlock(),i.createElementBlock("button",i.mergeProps({key:0,ref:l.containerRef,class:e.cx("root"),onClick:t[0]||(t[0]=function(){return l.onClick&&l.onClick.apply(l,arguments)}),type:"button","aria-label":l.scrollTopAriaLabel},e.ptm("root"),{"data-pc-name":"scrolltop"}),[i.renderSlot(e.$slots,"icon",{class:i.normalizeClass(e.cx("icon"))},(function(){return[(i.openBlock(),i.createBlock(i.resolveDynamicComponent(e.icon?"span":"ChevronUpIcon"),i.mergeProps({class:[e.cx("icon"),e.icon]},e.ptm("icon")),null,16,["class"]))]}))],16,c)):i.createCommentVNode("",!0)]})),_:3},16,["onEnter","onAfterLeave"])},module.exports=s;
+"use strict";var e=require("primevue/icons/chevronup"),t=require("primevue/utils"),n=require("primevue/basecomponent"),r=require("primevue/scrolltop/style"),i=require("vue");function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=o(e),s={name:"ScrollTop",extends:{name:"BaseScrollTop",extends:o(n).default,props:{target:{type:String,default:"window"},threshold:{type:Number,default:400},icon:{type:String,default:void 0},behavior:{type:String,default:"smooth"}},style:o(r).default,provide:function(){return{$parentInstance:this}}},scrollListener:null,container:null,data:function(){return{visible:!1}},mounted:function(){"window"===this.target?this.bindDocumentScrollListener():"parent"===this.target&&this.bindParentScrollListener()},beforeUnmount:function(){"window"===this.target?this.unbindDocumentScrollListener():"parent"===this.target&&this.unbindParentScrollListener(),this.container&&(t.ZIndexUtils.clear(this.container),this.overlay=null)},methods:{onClick:function(){("window"===this.target?window:this.$el.parentElement).scroll({top:0,behavior:this.behavior})},checkVisibility:function(e){this.visible=e>this.threshold},bindParentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(e.$el.parentElement.scrollTop)},this.$el.parentElement.addEventListener("scroll",this.scrollListener)},bindDocumentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(t.DomHandler.getWindowScrollTop())},window.addEventListener("scroll",this.scrollListener)},unbindParentScrollListener:function(){this.scrollListener&&(this.$el.parentElement.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},unbindDocumentScrollListener:function(){this.scrollListener&&(window.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},onEnter:function(e){t.ZIndexUtils.set("overlay",e,this.$primevue.config.zIndex.overlay)},onAfterLeave:function(e){t.ZIndexUtils.clear(e)},containerRef:function(e){this.container=e}},computed:{scrollTopAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.scrollTop:void 0}},components:{ChevronUpIcon:l.default}},c=["aria-label"];s.render=function(e,t,n,r,o,l){return i.openBlock(),i.createBlock(i.Transition,i.mergeProps({name:"p-scrolltop",appear:"",onEnter:l.onEnter,onAfterLeave:l.onAfterLeave},e.ptm("transition")),{default:i.withCtx((function(){return[o.visible?(i.openBlock(),i.createElementBlock("button",i.mergeProps({key:0,ref:l.containerRef,class:e.cx("root"),onClick:t[0]||(t[0]=function(){return l.onClick&&l.onClick.apply(l,arguments)}),type:"button","aria-label":l.scrollTopAriaLabel},e.ptm("root")),[i.renderSlot(e.$slots,"icon",{class:i.normalizeClass(e.cx("icon"))},(function(){return[(i.openBlock(),i.createBlock(i.resolveDynamicComponent(e.icon?"span":"ChevronUpIcon"),i.mergeProps({class:[e.cx("icon"),e.icon]},e.ptm("icon")),null,16,["class"]))]}))],16,c)):i.createCommentVNode("",!0)]})),_:3},16,["onEnter","onAfterLeave"])},module.exports=s;

package/scrolltop/scrolltop.esm.js

@@ -128,9 +128,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
         }),
         type: "button",
         "aria-label": $options.scrollTopAriaLabel
-      }, _ctx.ptm('root'), {
-        "data-pc-name": "scrolltop"
-      }), [renderSlot(_ctx.$slots, "icon", {
+      }, _ctx.ptm('root')), [renderSlot(_ctx.$slots, "icon", {
         "class": normalizeClass(_ctx.cx('icon'))
       }, function () {
         return [(openBlock(), createBlock(resolveDynamicComponent(_ctx.icon ? 'span' : 'ChevronUpIcon'), mergeProps({

package/scrolltop/scrolltop.esm.min.js

@@ -1 +1 @@
-import e from"primevue/icons/chevronup";import{ZIndexUtils as t,DomHandler as n}from"primevue/utils";import i from"primevue/basecomponent";import r from"primevue/scrolltop/style";import{openBlock as o,createBlock as l,Transition as s,mergeProps as c,withCtx as a,createElementBlock as u,renderSlot as p,normalizeClass as h,resolveDynamicComponent as f,createCommentVNode as m}from"vue";var d={name:"ScrollTop",extends:{name:"BaseScrollTop",extends:i,props:{target:{type:String,default:"window"},threshold:{type:Number,default:400},icon:{type:String,default:void 0},behavior:{type:String,default:"smooth"}},style:r,provide:function(){return{$parentInstance:this}}},scrollListener:null,container:null,data:function(){return{visible:!1}},mounted:function(){"window"===this.target?this.bindDocumentScrollListener():"parent"===this.target&&this.bindParentScrollListener()},beforeUnmount:function(){"window"===this.target?this.unbindDocumentScrollListener():"parent"===this.target&&this.unbindParentScrollListener(),this.container&&(t.clear(this.container),this.overlay=null)},methods:{onClick:function(){("window"===this.target?window:this.$el.parentElement).scroll({top:0,behavior:this.behavior})},checkVisibility:function(e){this.visible=e>this.threshold},bindParentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(e.$el.parentElement.scrollTop)},this.$el.parentElement.addEventListener("scroll",this.scrollListener)},bindDocumentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(n.getWindowScrollTop())},window.addEventListener("scroll",this.scrollListener)},unbindParentScrollListener:function(){this.scrollListener&&(this.$el.parentElement.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},unbindDocumentScrollListener:function(){this.scrollListener&&(window.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},onEnter:function(e){t.set("overlay",e,this.$primevue.config.zIndex.overlay)},onAfterLeave:function(e){t.clear(e)},containerRef:function(e){this.container=e}},computed:{scrollTopAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.scrollTop:void 0}},components:{ChevronUpIcon:e}},v=["aria-label"];d.render=function(e,t,n,i,r,d){return o(),l(s,c({name:"p-scrolltop",appear:"",onEnter:d.onEnter,onAfterLeave:d.onAfterLeave},e.ptm("transition")),{default:a((function(){return[r.visible?(o(),u("button",c({key:0,ref:d.containerRef,class:e.cx("root"),onClick:t[0]||(t[0]=function(){return d.onClick&&d.onClick.apply(d,arguments)}),type:"button","aria-label":d.scrollTopAriaLabel},e.ptm("root"),{"data-pc-name":"scrolltop"}),[p(e.$slots,"icon",{class:h(e.cx("icon"))},(function(){return[(o(),l(f(e.icon?"span":"ChevronUpIcon"),c({class:[e.cx("icon"),e.icon]},e.ptm("icon")),null,16,["class"]))]}))],16,v)):m("",!0)]})),_:3},16,["onEnter","onAfterLeave"])};export{d as default};
+import e from"primevue/icons/chevronup";import{ZIndexUtils as t,DomHandler as n}from"primevue/utils";import i from"primevue/basecomponent";import r from"primevue/scrolltop/style";import{openBlock as o,createBlock as l,Transition as s,mergeProps as c,withCtx as a,createElementBlock as u,renderSlot as p,normalizeClass as h,resolveDynamicComponent as f,createCommentVNode as m}from"vue";var d={name:"ScrollTop",extends:{name:"BaseScrollTop",extends:i,props:{target:{type:String,default:"window"},threshold:{type:Number,default:400},icon:{type:String,default:void 0},behavior:{type:String,default:"smooth"}},style:r,provide:function(){return{$parentInstance:this}}},scrollListener:null,container:null,data:function(){return{visible:!1}},mounted:function(){"window"===this.target?this.bindDocumentScrollListener():"parent"===this.target&&this.bindParentScrollListener()},beforeUnmount:function(){"window"===this.target?this.unbindDocumentScrollListener():"parent"===this.target&&this.unbindParentScrollListener(),this.container&&(t.clear(this.container),this.overlay=null)},methods:{onClick:function(){("window"===this.target?window:this.$el.parentElement).scroll({top:0,behavior:this.behavior})},checkVisibility:function(e){this.visible=e>this.threshold},bindParentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(e.$el.parentElement.scrollTop)},this.$el.parentElement.addEventListener("scroll",this.scrollListener)},bindDocumentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(n.getWindowScrollTop())},window.addEventListener("scroll",this.scrollListener)},unbindParentScrollListener:function(){this.scrollListener&&(this.$el.parentElement.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},unbindDocumentScrollListener:function(){this.scrollListener&&(window.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},onEnter:function(e){t.set("overlay",e,this.$primevue.config.zIndex.overlay)},onAfterLeave:function(e){t.clear(e)},containerRef:function(e){this.container=e}},computed:{scrollTopAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.scrollTop:void 0}},components:{ChevronUpIcon:e}},v=["aria-label"];d.render=function(e,t,n,i,r,d){return o(),l(s,c({name:"p-scrolltop",appear:"",onEnter:d.onEnter,onAfterLeave:d.onAfterLeave},e.ptm("transition")),{default:a((function(){return[r.visible?(o(),u("button",c({key:0,ref:d.containerRef,class:e.cx("root"),onClick:t[0]||(t[0]=function(){return d.onClick&&d.onClick.apply(d,arguments)}),type:"button","aria-label":d.scrollTopAriaLabel},e.ptm("root")),[p(e.$slots,"icon",{class:h(e.cx("icon"))},(function(){return[(o(),l(f(e.icon?"span":"ChevronUpIcon"),c({class:[e.cx("icon"),e.icon]},e.ptm("icon")),null,16,["class"]))]}))],16,v)):m("",!0)]})),_:3},16,["onEnter","onAfterLeave"])};export{d as default};

package/scrolltop/scrolltop.js

@@ -132,9 +132,7 @@ this.primevue.scrolltop = (function (ChevronUpIcon, utils, BaseComponent, Scroll
             }),
             type: "button",
             "aria-label": $options.scrollTopAriaLabel
-          }, _ctx.ptm('root'), {
-            "data-pc-name": "scrolltop"
-          }), [vue.renderSlot(_ctx.$slots, "icon", {
+          }, _ctx.ptm('root')), [vue.renderSlot(_ctx.$slots, "icon", {
             "class": vue.normalizeClass(_ctx.cx('icon'))
           }, function () {
             return [(vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(_ctx.icon ? 'span' : 'ChevronUpIcon'), vue.mergeProps({

package/scrolltop/scrolltop.min.js

@@ -1 +1 @@
-this.primevue=this.primevue||{},this.primevue.scrolltop=function(e,t,n,i,o){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=r(e),s={name:"ScrollTop",extends:{name:"BaseScrollTop",extends:r(n).default,props:{target:{type:String,default:"window"},threshold:{type:Number,default:400},icon:{type:String,default:void 0},behavior:{type:String,default:"smooth"}},style:r(i).default,provide:function(){return{$parentInstance:this}}},scrollListener:null,container:null,data:function(){return{visible:!1}},mounted:function(){"window"===this.target?this.bindDocumentScrollListener():"parent"===this.target&&this.bindParentScrollListener()},beforeUnmount:function(){"window"===this.target?this.unbindDocumentScrollListener():"parent"===this.target&&this.unbindParentScrollListener(),this.container&&(t.ZIndexUtils.clear(this.container),this.overlay=null)},methods:{onClick:function(){("window"===this.target?window:this.$el.parentElement).scroll({top:0,behavior:this.behavior})},checkVisibility:function(e){this.visible=e>this.threshold},bindParentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(e.$el.parentElement.scrollTop)},this.$el.parentElement.addEventListener("scroll",this.scrollListener)},bindDocumentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(t.DomHandler.getWindowScrollTop())},window.addEventListener("scroll",this.scrollListener)},unbindParentScrollListener:function(){this.scrollListener&&(this.$el.parentElement.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},unbindDocumentScrollListener:function(){this.scrollListener&&(window.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},onEnter:function(e){t.ZIndexUtils.set("overlay",e,this.$primevue.config.zIndex.overlay)},onAfterLeave:function(e){t.ZIndexUtils.clear(e)},containerRef:function(e){this.container=e}},computed:{scrollTopAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.scrollTop:void 0}},components:{ChevronUpIcon:l.default}},c=["aria-label"];return s.render=function(e,t,n,i,r,l){return o.openBlock(),o.createBlock(o.Transition,o.mergeProps({name:"p-scrolltop",appear:"",onEnter:l.onEnter,onAfterLeave:l.onAfterLeave},e.ptm("transition")),{default:o.withCtx((function(){return[r.visible?(o.openBlock(),o.createElementBlock("button",o.mergeProps({key:0,ref:l.containerRef,class:e.cx("root"),onClick:t[0]||(t[0]=function(){return l.onClick&&l.onClick.apply(l,arguments)}),type:"button","aria-label":l.scrollTopAriaLabel},e.ptm("root"),{"data-pc-name":"scrolltop"}),[o.renderSlot(e.$slots,"icon",{class:o.normalizeClass(e.cx("icon"))},(function(){return[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.icon?"span":"ChevronUpIcon"),o.mergeProps({class:[e.cx("icon"),e.icon]},e.ptm("icon")),null,16,["class"]))]}))],16,c)):o.createCommentVNode("",!0)]})),_:3},16,["onEnter","onAfterLeave"])},s}(primevue.icons.chevronup,primevue.utils,primevue.basecomponent,primevue.scrolltop.style,Vue);
+this.primevue=this.primevue||{},this.primevue.scrolltop=function(e,t,n,i,o){"use strict";function r(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var l=r(e),s={name:"ScrollTop",extends:{name:"BaseScrollTop",extends:r(n).default,props:{target:{type:String,default:"window"},threshold:{type:Number,default:400},icon:{type:String,default:void 0},behavior:{type:String,default:"smooth"}},style:r(i).default,provide:function(){return{$parentInstance:this}}},scrollListener:null,container:null,data:function(){return{visible:!1}},mounted:function(){"window"===this.target?this.bindDocumentScrollListener():"parent"===this.target&&this.bindParentScrollListener()},beforeUnmount:function(){"window"===this.target?this.unbindDocumentScrollListener():"parent"===this.target&&this.unbindParentScrollListener(),this.container&&(t.ZIndexUtils.clear(this.container),this.overlay=null)},methods:{onClick:function(){("window"===this.target?window:this.$el.parentElement).scroll({top:0,behavior:this.behavior})},checkVisibility:function(e){this.visible=e>this.threshold},bindParentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(e.$el.parentElement.scrollTop)},this.$el.parentElement.addEventListener("scroll",this.scrollListener)},bindDocumentScrollListener:function(){var e=this;this.scrollListener=function(){e.checkVisibility(t.DomHandler.getWindowScrollTop())},window.addEventListener("scroll",this.scrollListener)},unbindParentScrollListener:function(){this.scrollListener&&(this.$el.parentElement.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},unbindDocumentScrollListener:function(){this.scrollListener&&(window.removeEventListener("scroll",this.scrollListener),this.scrollListener=null)},onEnter:function(e){t.ZIndexUtils.set("overlay",e,this.$primevue.config.zIndex.overlay)},onAfterLeave:function(e){t.ZIndexUtils.clear(e)},containerRef:function(e){this.container=e}},computed:{scrollTopAriaLabel:function(){return this.$primevue.config.locale.aria?this.$primevue.config.locale.aria.scrollTop:void 0}},components:{ChevronUpIcon:l.default}},c=["aria-label"];return s.render=function(e,t,n,i,r,l){return o.openBlock(),o.createBlock(o.Transition,o.mergeProps({name:"p-scrolltop",appear:"",onEnter:l.onEnter,onAfterLeave:l.onAfterLeave},e.ptm("transition")),{default:o.withCtx((function(){return[r.visible?(o.openBlock(),o.createElementBlock("button",o.mergeProps({key:0,ref:l.containerRef,class:e.cx("root"),onClick:t[0]||(t[0]=function(){return l.onClick&&l.onClick.apply(l,arguments)}),type:"button","aria-label":l.scrollTopAriaLabel},e.ptm("root")),[o.renderSlot(e.$slots,"icon",{class:o.normalizeClass(e.cx("icon"))},(function(){return[(o.openBlock(),o.createBlock(o.resolveDynamicComponent(e.icon?"span":"ChevronUpIcon"),o.mergeProps({class:[e.cx("icon"),e.icon]},e.ptm("icon")),null,16,["class"]))]}))],16,c)):o.createCommentVNode("",!0)]})),_:3},16,["onEnter","onAfterLeave"])},s}(primevue.icons.chevronup,primevue.utils,primevue.basecomponent,primevue.scrolltop.style,Vue);

package/scrolltop/style/scrolltopstyle.cjs.js

@@ -6,7 +6,6 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var BaseStyle__default = /*#__PURE__*/_interopDefaultLegacy(BaseStyle);
 
-var css = "\n@layer primevue {\n    .p-scrolltop {\n        position: fixed;\n        bottom: 20px;\n        right: 20px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-scrolltop-sticky {\n        position: sticky;\n    }\n\n    .p-scrolltop-sticky.p-link {\n        margin-left: auto;\n    }\n\n    .p-scrolltop-enter-from {\n        opacity: 0;\n    }\n\n    .p-scrolltop-enter-active {\n        transition: opacity 0.15s;\n    }\n\n    .p-scrolltop.p-scrolltop-leave-to {\n        opacity: 0;\n    }\n\n    .p-scrolltop-leave-active {\n        transition: opacity 0.15s;\n    }\n}\n";
 var classes = {
   root: function root(_ref) {
     var props = _ref.props;
@@ -18,7 +17,6 @@ var classes = {
 };
 var ScrollTopStyle = BaseStyle__default["default"].extend({
   name: 'scrolltop',
-  css: css,
   classes: classes
 });
 

package/scrolltop/style/scrolltopstyle.cjs.min.js

@@ -1 +1 @@
-"use strict";function n(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var t=n(require("primevue/base/style")).default.extend({name:"scrolltop",css:"\n@layer primevue {\n    .p-scrolltop {\n        position: fixed;\n        bottom: 20px;\n        right: 20px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-scrolltop-sticky {\n        position: sticky;\n    }\n\n    .p-scrolltop-sticky.p-link {\n        margin-left: auto;\n    }\n\n    .p-scrolltop-enter-from {\n        opacity: 0;\n    }\n\n    .p-scrolltop-enter-active {\n        transition: opacity 0.15s;\n    }\n\n    .p-scrolltop.p-scrolltop-leave-to {\n        opacity: 0;\n    }\n\n    .p-scrolltop-leave-active {\n        transition: opacity 0.15s;\n    }\n}\n",classes:{root:function(n){return["p-scrolltop p-link p-component",{"p-scrolltop-sticky":"window"!==n.props.target}]},icon:"p-scrolltop-icon"}});module.exports=t;
+"use strict";function t(t){return t&&"object"==typeof t&&"default"in t?t:{default:t}}var e=t(require("primevue/base/style")).default.extend({name:"scrolltop",classes:{root:function(t){return["p-scrolltop p-link p-component",{"p-scrolltop-sticky":"window"!==t.props.target}]},icon:"p-scrolltop-icon"}});module.exports=e;

package/scrolltop/style/scrolltopstyle.esm.js

@@ -1,6 +1,5 @@
 import BaseStyle from 'primevue/base/style';
 
-var css = "\n@layer primevue {\n    .p-scrolltop {\n        position: fixed;\n        bottom: 20px;\n        right: 20px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .p-scrolltop-sticky {\n        position: sticky;\n    }\n\n    .p-scrolltop-sticky.p-link {\n        margin-left: auto;\n    }\n\n    .p-scrolltop-enter-from {\n        opacity: 0;\n    }\n\n    .p-scrolltop-enter-active {\n        transition: opacity 0.15s;\n    }\n\n    .p-scrolltop.p-scrolltop-leave-to {\n        opacity: 0;\n    }\n\n    .p-scrolltop-leave-active {\n        transition: opacity 0.15s;\n    }\n}\n";
 var classes = {
   root: function root(_ref) {
     var props = _ref.props;
@@ -12,7 +11,6 @@ var classes = {
 };
 var ScrollTopStyle = BaseStyle.extend({
   name: 'scrolltop',
-  css: css,
   classes: classes
 });