primereact 7.0.0-rc.1 → 7.1.0

package/overlaypanel/overlaypanel.js

@@ -1,10 +1,11 @@
 this.primereact = this.primereact || {};
-this.primereact.overlaypanel = (function (exports, React, core) {
+this.primereact.overlaypanel = (function (exports, React, utils, csstransition, ripple, overlayservice, portal, PrimeReact) {
   'use strict';
 
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
   var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+  var PrimeReact__default = /*#__PURE__*/_interopDefaultLegacy(PrimeReact);
 
   function _classCallCheck(instance, Constructor) {
     if (!(instance instanceof Constructor)) {
@@ -131,8 +132,9 @@ this.primereact.overlaypanel = (function (exports, React, core) {
       _this.onEntered = _this.onEntered.bind(_assertThisInitialized(_this));
       _this.onExit = _this.onExit.bind(_assertThisInitialized(_this));
       _this.onExited = _this.onExited.bind(_assertThisInitialized(_this));
-      _this.attributeSelector = core.UniqueComponentId();
-      _this.overlayRef = /*#__PURE__*/React__default['default'].createRef();
+      _this.onContentClick = _this.onContentClick.bind(_assertThisInitialized(_this));
+      _this.attributeSelector = utils.UniqueComponentId();
+      _this.overlayRef = /*#__PURE__*/React__default["default"].createRef();
       return _this;
     }
 
@@ -167,7 +169,7 @@ this.primereact.overlaypanel = (function (exports, React, core) {
         var _this3 = this;
 
         if (!this.scrollHandler) {
-          this.scrollHandler = new core.ConnectedOverlayScrollHandler(this.target, function () {
+          this.scrollHandler = new utils.ConnectedOverlayScrollHandler(this.target, function () {
             if (_this3.state.visible) {
               _this3.hide();
             }
@@ -190,7 +192,7 @@ this.primereact.overlaypanel = (function (exports, React, core) {
 
         if (!this.resizeListener) {
           this.resizeListener = function () {
-            if (_this4.state.visible && !core.DomHandler.isAndroid()) {
+            if (_this4.state.visible && !utils.DomHandler.isTouchDevice()) {
               _this4.hide();
             }
           };
@@ -226,7 +228,7 @@ this.primereact.overlaypanel = (function (exports, React, core) {
       key: "onPanelClick",
       value: function onPanelClick(event) {
         this.isPanelClicked = true;
-        core.OverlayService.emit('overlay-click', {
+        overlayservice.OverlayService.emit('overlay-click', {
           originalEvent: event,
           target: this.target
         });
@@ -273,7 +275,7 @@ this.primereact.overlaypanel = (function (exports, React, core) {
               }
             };
 
-            core.OverlayService.on('overlay-click', _this6.overlayEventListener);
+            overlayservice.OverlayService.on('overlay-click', _this6.overlayEventListener);
           });
         }
       }
@@ -285,14 +287,14 @@ this.primereact.overlaypanel = (function (exports, React, core) {
         this.setState({
           visible: false
         }, function () {
-          core.OverlayService.off('overlay-click', _this7.overlayEventListener);
+          overlayservice.OverlayService.off('overlay-click', _this7.overlayEventListener);
           _this7.overlayEventListener = null;
         });
       }
     }, {
       key: "onEnter",
       value: function onEnter() {
-        core.ZIndexUtils.set('overlay', this.overlayRef.current);
+        utils.ZIndexUtils.set('overlay', this.overlayRef.current, PrimeReact__default["default"].autoZIndex, PrimeReact__default["default"].zIndex['overlay']);
         this.overlayRef.current.setAttribute(this.attributeSelector, '');
         this.align();
       }
@@ -314,16 +316,16 @@ this.primereact.overlaypanel = (function (exports, React, core) {
     }, {
       key: "onExited",
       value: function onExited() {
-        core.ZIndexUtils.clear(this.overlayRef.current);
+        utils.ZIndexUtils.clear(this.overlayRef.current);
         this.props.onHide && this.props.onHide();
       }
     }, {
       key: "align",
       value: function align() {
         if (this.target) {
-          core.DomHandler.absolutePosition(this.overlayRef.current, this.target);
-          var containerOffset = core.DomHandler.getOffset(this.overlayRef.current);
-          var targetOffset = core.DomHandler.getOffset(this.target);
+          utils.DomHandler.absolutePosition(this.overlayRef.current, this.target);
+          var containerOffset = utils.DomHandler.getOffset(this.overlayRef.current);
+          var targetOffset = utils.DomHandler.getOffset(this.target);
           var arrowLeft = 0;
 
           if (containerOffset.left < targetOffset.left) {
@@ -333,7 +335,7 @@ this.primereact.overlaypanel = (function (exports, React, core) {
           this.overlayRef.current.style.setProperty('--overlayArrowLeft', "".concat(arrowLeft, "px"));
 
           if (containerOffset.top < targetOffset.top) {
-            core.DomHandler.addClass(this.overlayRef.current, 'p-overlaypanel-flipped');
+            utils.DomHandler.addClass(this.overlayRef.current, 'p-overlaypanel-flipped');
           }
         }
       }
@@ -341,8 +343,7 @@ this.primereact.overlaypanel = (function (exports, React, core) {
       key: "createStyle",
       value: function createStyle() {
         if (!this.styleElement) {
-          this.styleElement = document.createElement('style');
-          document.head.appendChild(this.styleElement);
+          this.styleElement = utils.DomHandler.createInlineStyle();
           var innerHTML = '';
 
           for (var breakpoint in this.props.breakpoints) {
@@ -370,30 +371,27 @@ this.primereact.overlaypanel = (function (exports, React, core) {
           this.scrollHandler = null;
         }
 
-        if (this.styleElement) {
-          document.head.removeChild(this.styleElement);
-          this.styleElement = null;
-        }
+        this.styleElement = utils.DomHandler.removeInlineStyle(this.styleElement);
 
         if (this.overlayEventListener) {
-          core.OverlayService.off('overlay-click', this.overlayEventListener);
+          overlayservice.OverlayService.off('overlay-click', this.overlayEventListener);
           this.overlayEventListener = null;
         }
 
-        core.ZIndexUtils.clear(this.overlayRef.current);
+        utils.ZIndexUtils.clear(this.overlayRef.current);
       }
     }, {
       key: "renderCloseIcon",
       value: function renderCloseIcon() {
         if (this.props.showCloseIcon) {
-          return /*#__PURE__*/React__default['default'].createElement("button", {
+          return /*#__PURE__*/React__default["default"].createElement("button", {
             type: "button",
             className: "p-overlaypanel-close p-link",
             onClick: this.onCloseClick,
             "aria-label": this.props.ariaCloseLabel
-          }, /*#__PURE__*/React__default['default'].createElement("span", {
+          }, /*#__PURE__*/React__default["default"].createElement("span", {
             className: "p-overlaypanel-close-icon pi pi-times"
-          }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+          }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
         }
 
         return null;
@@ -401,9 +399,9 @@ this.primereact.overlaypanel = (function (exports, React, core) {
     }, {
       key: "renderElement",
       value: function renderElement() {
-        var className = core.classNames('p-overlaypanel p-component', this.props.className);
+        var className = utils.classNames('p-overlaypanel p-component', this.props.className);
         var closeIcon = this.renderCloseIcon();
-        return /*#__PURE__*/React__default['default'].createElement(core.CSSTransition, {
+        return /*#__PURE__*/React__default["default"].createElement(csstransition.CSSTransition, {
           nodeRef: this.overlayRef,
           classNames: "p-overlaypanel",
           in: this.state.visible,
@@ -417,13 +415,13 @@ this.primereact.overlaypanel = (function (exports, React, core) {
           onEntered: this.onEntered,
           onExit: this.onExit,
           onExited: this.onExited
-        }, /*#__PURE__*/React__default['default'].createElement("div", {
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
           ref: this.overlayRef,
           id: this.props.id,
           className: className,
           style: this.props.style,
           onClick: this.onPanelClick
-        }, /*#__PURE__*/React__default['default'].createElement("div", {
+        }, /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-overlaypanel-content",
           onClick: this.onContentClick,
           onMouseDown: this.onContentClick
@@ -433,7 +431,7 @@ this.primereact.overlaypanel = (function (exports, React, core) {
       key: "render",
       value: function render() {
         var element = this.renderElement();
-        return /*#__PURE__*/React__default['default'].createElement(core.Portal, {
+        return /*#__PURE__*/React__default["default"].createElement(portal.Portal, {
           element: element,
           appendTo: this.props.appendTo
         });
@@ -463,4 +461,4 @@ this.primereact.overlaypanel = (function (exports, React, core) {
 
   return exports;
 
-}({}, React, primereact.core));
+})({}, React, primereact.utils, primereact.csstransition, primereact.ripple, primereact.overlayservice, primereact.portal, primereact.api);

package/overlaypanel/overlaypanel.min.js

@@ -1 +1 @@
-this.primereact=this.primereact||{},this.primereact.overlaypanel=function(e,t,n){"use strict";function i(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=i(t);function o(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function l(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function s(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function a(e,t){return(a=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e})(e,t)}function c(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&a(e,t)}function u(e){return(u="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function h(e,t){if(t&&("object"===u(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return s(e)}function d(e){return(d=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}function f(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}var p,v,y,m=function(e){c(y,e);var t,i,a,u,p,v=(t=y,i=f(),function(){var e,n=d(t);if(i){var r=d(this).constructor;e=Reflect.construct(n,arguments,r)}else e=n.apply(this,arguments);return h(this,e)});function y(e){var t;return o(this,y),(t=v.call(this,e)).state={visible:!1},t.onCloseClick=t.onCloseClick.bind(s(t)),t.onPanelClick=t.onPanelClick.bind(s(t)),t.onEnter=t.onEnter.bind(s(t)),t.onEntered=t.onEntered.bind(s(t)),t.onExit=t.onExit.bind(s(t)),t.onExited=t.onExited.bind(s(t)),t.attributeSelector=n.UniqueComponentId(),t.overlayRef=r.default.createRef(),t}return a=y,(u=[{key:"bindDocumentClickListener",value:function(){var e=this;!this.documentClickListener&&this.props.dismissable&&(this.documentClickListener=function(t){!e.isPanelClicked&&e.isOutsideClicked(t.target)&&e.hide(),e.isPanelClicked=!1},document.addEventListener("click",this.documentClickListener))}},{key:"unbindDocumentClickListener",value:function(){this.documentClickListener&&(document.removeEventListener("click",this.documentClickListener),this.documentClickListener=null)}},{key:"bindScrollListener",value:function(){var e=this;this.scrollHandler||(this.scrollHandler=new n.ConnectedOverlayScrollHandler(this.target,(function(){e.state.visible&&e.hide()}))),this.scrollHandler.bindScrollListener()}},{key:"unbindScrollListener",value:function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()}},{key:"bindResizeListener",value:function(){var e=this;this.resizeListener||(this.resizeListener=function(){e.state.visible&&!n.DomHandler.isAndroid()&&e.hide()},window.addEventListener("resize",this.resizeListener))}},{key:"unbindResizeListener",value:function(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)}},{key:"isOutsideClicked",value:function(e){return this.overlayRef&&this.overlayRef.current&&!(this.overlayRef.current.isSameNode(e)||this.overlayRef.current.contains(e))}},{key:"hasTargetChanged",value:function(e,t){return null!=this.target&&this.target!==(t||e.currentTarget||e.target)}},{key:"onCloseClick",value:function(e){this.hide(),e.preventDefault()}},{key:"onPanelClick",value:function(e){this.isPanelClicked=!0,n.OverlayService.emit("overlay-click",{originalEvent:e,target:this.target})}},{key:"onContentClick",value:function(){this.isPanelClicked=!0}},{key:"toggle",value:function(e,t){var n=this;this.state.visible?(this.hide(),this.hasTargetChanged(e,t)&&(this.target=t||e.currentTarget||e.target,setTimeout((function(){n.show(e,n.target)}),200))):this.show(e,t)}},{key:"show",value:function(e,t){var i=this;this.target=t||e.currentTarget||e.target,this.state.visible?this.align():this.setState({visible:!0},(function(){i.overlayEventListener=function(e){i.isOutsideClicked(e.target)||(i.isPanelClicked=!0)},n.OverlayService.on("overlay-click",i.overlayEventListener)}))}},{key:"hide",value:function(){var e=this;this.setState({visible:!1},(function(){n.OverlayService.off("overlay-click",e.overlayEventListener),e.overlayEventListener=null}))}},{key:"onEnter",value:function(){n.ZIndexUtils.set("overlay",this.overlayRef.current),this.overlayRef.current.setAttribute(this.attributeSelector,""),this.align()}},{key:"onEntered",value:function(){this.bindDocumentClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.props.onShow&&this.props.onShow()}},{key:"onExit",value:function(){this.unbindDocumentClickListener(),this.unbindScrollListener(),this.unbindResizeListener()}},{key:"onExited",value:function(){n.ZIndexUtils.clear(this.overlayRef.current),this.props.onHide&&this.props.onHide()}},{key:"align",value:function(){if(this.target){n.DomHandler.absolutePosition(this.overlayRef.current,this.target);var e=n.DomHandler.getOffset(this.overlayRef.current),t=n.DomHandler.getOffset(this.target),i=0;e.left<t.left&&(i=t.left-e.left),this.overlayRef.current.style.setProperty("--overlayArrowLeft","".concat(i,"px")),e.top<t.top&&n.DomHandler.addClass(this.overlayRef.current,"p-overlaypanel-flipped")}}},{key:"createStyle",value:function(){if(!this.styleElement){this.styleElement=document.createElement("style"),document.head.appendChild(this.styleElement);var e="";for(var t in this.props.breakpoints)e+="\n                    @media screen and (max-width: ".concat(t,") {\n                        .p-overlaypanel[").concat(this.attributeSelector,"] {\n                            width: ").concat(this.props.breakpoints[t]," !important;\n                        }\n                    }\n                ");this.styleElement.innerHTML=e}}},{key:"componentDidMount",value:function(){this.props.breakpoints&&this.createStyle()}},{key:"componentWillUnmount",value:function(){this.unbindDocumentClickListener(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.styleElement&&(document.head.removeChild(this.styleElement),this.styleElement=null),this.overlayEventListener&&(n.OverlayService.off("overlay-click",this.overlayEventListener),this.overlayEventListener=null),n.ZIndexUtils.clear(this.overlayRef.current)}},{key:"renderCloseIcon",value:function(){return this.props.showCloseIcon?r.default.createElement("button",{type:"button",className:"p-overlaypanel-close p-link",onClick:this.onCloseClick,"aria-label":this.props.ariaCloseLabel},r.default.createElement("span",{className:"p-overlaypanel-close-icon pi pi-times"}),r.default.createElement(n.Ripple,null)):null}},{key:"renderElement",value:function(){var e=n.classNames("p-overlaypanel p-component",this.props.className),t=this.renderCloseIcon();return r.default.createElement(n.CSSTransition,{nodeRef:this.overlayRef,classNames:"p-overlaypanel",in:this.state.visible,timeout:{enter:120,exit:100},options:this.props.transitionOptions,unmountOnExit:!0,onEnter:this.onEnter,onEntered:this.onEntered,onExit:this.onExit,onExited:this.onExited},r.default.createElement("div",{ref:this.overlayRef,id:this.props.id,className:e,style:this.props.style,onClick:this.onPanelClick},r.default.createElement("div",{className:"p-overlaypanel-content",onClick:this.onContentClick,onMouseDown:this.onContentClick},this.props.children),t))}},{key:"render",value:function(){var e=this.renderElement();return r.default.createElement(n.Portal,{element:e,appendTo:this.props.appendTo})}}])&&l(a.prototype,u),p&&l(a,p),y}(t.Component);return y={id:null,dismissable:!0,showCloseIcon:!1,style:null,className:null,appendTo:null,breakpoints:null,ariaCloseLabel:"close",transitionOptions:null,onShow:null,onHide:null},(v="defaultProps")in(p=m)?Object.defineProperty(p,v,{value:y,enumerable:!0,configurable:!0,writable:!0}):p[v]=y,e.OverlayPanel=m,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.core);
+this.primereact=this.primereact||{},this.primereact.overlaypanel=function(e,t,n,i,r,o,l,s){"use strict";function a(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var c=a(t),u=a(s);function h(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function f(e,t){for(var n=0;n<t.length;n++){var i=t[n];i.enumerable=i.enumerable||!1,i.configurable=!0,"value"in i&&(i.writable=!0),Object.defineProperty(e,i.key,i)}}function d(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}function p(e,t){return p=Object.setPrototypeOf||function(e,t){return e.__proto__=t,e},p(e,t)}function v(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),t&&p(e,t)}function y(e){return y="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},y(e)}function m(e,t){if(t&&("object"===y(t)||"function"==typeof t))return t;if(void 0!==t)throw new TypeError("Derived constructors may only return object or undefined");return d(e)}function b(e){return b=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)},b(e)}function k(){if("undefined"==typeof Reflect||!Reflect.construct)return!1;if(Reflect.construct.sham)return!1;if("function"==typeof Proxy)return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){}))),!0}catch(e){return!1}}var C,E,L,g=function(e){v(E,e);var t,s,a,p,y,C=(t=E,s=k(),function(){var e,n=b(t);if(s){var i=b(this).constructor;e=Reflect.construct(n,arguments,i)}else e=n.apply(this,arguments);return m(this,e)});function E(e){var t;return h(this,E),(t=C.call(this,e)).state={visible:!1},t.onCloseClick=t.onCloseClick.bind(d(t)),t.onPanelClick=t.onPanelClick.bind(d(t)),t.onEnter=t.onEnter.bind(d(t)),t.onEntered=t.onEntered.bind(d(t)),t.onExit=t.onExit.bind(d(t)),t.onExited=t.onExited.bind(d(t)),t.onContentClick=t.onContentClick.bind(d(t)),t.attributeSelector=n.UniqueComponentId(),t.overlayRef=c.default.createRef(),t}return a=E,(p=[{key:"bindDocumentClickListener",value:function(){var e=this;!this.documentClickListener&&this.props.dismissable&&(this.documentClickListener=function(t){!e.isPanelClicked&&e.isOutsideClicked(t.target)&&e.hide(),e.isPanelClicked=!1},document.addEventListener("click",this.documentClickListener))}},{key:"unbindDocumentClickListener",value:function(){this.documentClickListener&&(document.removeEventListener("click",this.documentClickListener),this.documentClickListener=null)}},{key:"bindScrollListener",value:function(){var e=this;this.scrollHandler||(this.scrollHandler=new n.ConnectedOverlayScrollHandler(this.target,(function(){e.state.visible&&e.hide()}))),this.scrollHandler.bindScrollListener()}},{key:"unbindScrollListener",value:function(){this.scrollHandler&&this.scrollHandler.unbindScrollListener()}},{key:"bindResizeListener",value:function(){var e=this;this.resizeListener||(this.resizeListener=function(){e.state.visible&&!n.DomHandler.isTouchDevice()&&e.hide()},window.addEventListener("resize",this.resizeListener))}},{key:"unbindResizeListener",value:function(){this.resizeListener&&(window.removeEventListener("resize",this.resizeListener),this.resizeListener=null)}},{key:"isOutsideClicked",value:function(e){return this.overlayRef&&this.overlayRef.current&&!(this.overlayRef.current.isSameNode(e)||this.overlayRef.current.contains(e))}},{key:"hasTargetChanged",value:function(e,t){return null!=this.target&&this.target!==(t||e.currentTarget||e.target)}},{key:"onCloseClick",value:function(e){this.hide(),e.preventDefault()}},{key:"onPanelClick",value:function(e){this.isPanelClicked=!0,o.OverlayService.emit("overlay-click",{originalEvent:e,target:this.target})}},{key:"onContentClick",value:function(){this.isPanelClicked=!0}},{key:"toggle",value:function(e,t){var n=this;this.state.visible?(this.hide(),this.hasTargetChanged(e,t)&&(this.target=t||e.currentTarget||e.target,setTimeout((function(){n.show(e,n.target)}),200))):this.show(e,t)}},{key:"show",value:function(e,t){var n=this;this.target=t||e.currentTarget||e.target,this.state.visible?this.align():this.setState({visible:!0},(function(){n.overlayEventListener=function(e){n.isOutsideClicked(e.target)||(n.isPanelClicked=!0)},o.OverlayService.on("overlay-click",n.overlayEventListener)}))}},{key:"hide",value:function(){var e=this;this.setState({visible:!1},(function(){o.OverlayService.off("overlay-click",e.overlayEventListener),e.overlayEventListener=null}))}},{key:"onEnter",value:function(){n.ZIndexUtils.set("overlay",this.overlayRef.current,u.default.autoZIndex,u.default.zIndex.overlay),this.overlayRef.current.setAttribute(this.attributeSelector,""),this.align()}},{key:"onEntered",value:function(){this.bindDocumentClickListener(),this.bindScrollListener(),this.bindResizeListener(),this.props.onShow&&this.props.onShow()}},{key:"onExit",value:function(){this.unbindDocumentClickListener(),this.unbindScrollListener(),this.unbindResizeListener()}},{key:"onExited",value:function(){n.ZIndexUtils.clear(this.overlayRef.current),this.props.onHide&&this.props.onHide()}},{key:"align",value:function(){if(this.target){n.DomHandler.absolutePosition(this.overlayRef.current,this.target);var e=n.DomHandler.getOffset(this.overlayRef.current),t=n.DomHandler.getOffset(this.target),i=0;e.left<t.left&&(i=t.left-e.left),this.overlayRef.current.style.setProperty("--overlayArrowLeft","".concat(i,"px")),e.top<t.top&&n.DomHandler.addClass(this.overlayRef.current,"p-overlaypanel-flipped")}}},{key:"createStyle",value:function(){if(!this.styleElement){this.styleElement=n.DomHandler.createInlineStyle();var e="";for(var t in this.props.breakpoints)e+="\n                    @media screen and (max-width: ".concat(t,") {\n                        .p-overlaypanel[").concat(this.attributeSelector,"] {\n                            width: ").concat(this.props.breakpoints[t]," !important;\n                        }\n                    }\n                ");this.styleElement.innerHTML=e}}},{key:"componentDidMount",value:function(){this.props.breakpoints&&this.createStyle()}},{key:"componentWillUnmount",value:function(){this.unbindDocumentClickListener(),this.unbindResizeListener(),this.scrollHandler&&(this.scrollHandler.destroy(),this.scrollHandler=null),this.styleElement=n.DomHandler.removeInlineStyle(this.styleElement),this.overlayEventListener&&(o.OverlayService.off("overlay-click",this.overlayEventListener),this.overlayEventListener=null),n.ZIndexUtils.clear(this.overlayRef.current)}},{key:"renderCloseIcon",value:function(){return this.props.showCloseIcon?c.default.createElement("button",{type:"button",className:"p-overlaypanel-close p-link",onClick:this.onCloseClick,"aria-label":this.props.ariaCloseLabel},c.default.createElement("span",{className:"p-overlaypanel-close-icon pi pi-times"}),c.default.createElement(r.Ripple,null)):null}},{key:"renderElement",value:function(){var e=n.classNames("p-overlaypanel p-component",this.props.className),t=this.renderCloseIcon();return c.default.createElement(i.CSSTransition,{nodeRef:this.overlayRef,classNames:"p-overlaypanel",in:this.state.visible,timeout:{enter:120,exit:100},options:this.props.transitionOptions,unmountOnExit:!0,onEnter:this.onEnter,onEntered:this.onEntered,onExit:this.onExit,onExited:this.onExited},c.default.createElement("div",{ref:this.overlayRef,id:this.props.id,className:e,style:this.props.style,onClick:this.onPanelClick},c.default.createElement("div",{className:"p-overlaypanel-content",onClick:this.onContentClick,onMouseDown:this.onContentClick},this.props.children),t))}},{key:"render",value:function(){var e=this.renderElement();return c.default.createElement(l.Portal,{element:e,appendTo:this.props.appendTo})}}])&&f(a.prototype,p),y&&f(a,y),E}(t.Component);return L={id:null,dismissable:!0,showCloseIcon:!1,style:null,className:null,appendTo:null,breakpoints:null,ariaCloseLabel:"close",transitionOptions:null,onShow:null,onHide:null},(E="defaultProps")in(C=g)?Object.defineProperty(C,E,{value:L,enumerable:!0,configurable:!0,writable:!0}):C[E]=L,e.OverlayPanel=g,Object.defineProperty(e,"__esModule",{value:!0}),e}({},React,primereact.utils,primereact.csstransition,primereact.ripple,primereact.overlayservice,primereact.portal,primereact.api);

package/overlayservice/overlayservice.cjs.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var core = require('primereact/core');
+var utils = require('primereact/utils');
 
-var OverlayService = core.EventBus();
+var OverlayService = utils.EventBus();
 
 exports.OverlayService = OverlayService;

package/overlayservice/overlayservice.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("primereact/core").EventBus();exports.OverlayService=e;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("primereact/utils").EventBus();exports.OverlayService=e;

package/overlayservice/overlayservice.esm.js

@@ -1,4 +1,4 @@
-import { EventBus } from 'primereact/core';
+import { EventBus } from 'primereact/utils';
 
 var OverlayService = EventBus();
 

package/overlayservice/overlayservice.esm.min.js

@@ -1 +1 @@
-import{EventBus as r}from"primereact/core";var e=r();export{e as OverlayService};
+import{EventBus as r}from"primereact/utils";var t=r();export{t as OverlayService};

package/overlayservice/overlayservice.js

@@ -1,8 +1,8 @@
 this.primereact = this.primereact || {};
-this.primereact.overlayservice = (function (exports, core) {
+this.primereact.overlayservice = (function (exports, utils) {
 	'use strict';
 
-	var OverlayService = core.EventBus();
+	var OverlayService = utils.EventBus();
 
 	exports.OverlayService = OverlayService;
 
@@ -10,4 +10,4 @@ this.primereact.overlayservice = (function (exports, core) {
 
 	return exports;
 
-}({}, primereact.core));
+})({}, primereact.utils);

package/overlayservice/overlayservice.min.js

@@ -1 +1 @@
-this.primereact=this.primereact||{},this.primereact.overlayservice=function(e,r){"use strict";var t=primereact.core.EventBus();return e.OverlayService=t,Object.defineProperty(e,"__esModule",{value:!0}),e}({});
+this.primereact=this.primereact||{},this.primereact.overlayservice=function(e,r){"use strict";var t=primereact.utils.EventBus();return e.OverlayService=t,Object.defineProperty(e,"__esModule",{value:!0}),e}({});

package/package.json

@@ -1,10 +1,10 @@
 {
     "name": "primereact",
-    "version": "7.0.0-rc.1",
+    "version": "7.1.0",
     "homepage": "https://www.primefaces.org/primereact",
     "repository": {
-      "type": "git",
-      "url": "https://github.com/primefaces/primereact.git"
+        "type": "git",
+        "url": "https://github.com/primefaces/primereact.git"
     },
     "license": "MIT",
     "bugs": {
@@ -24,7 +24,14 @@
     ],
     "peerDependencies": {
         "react": "^17.0.1",
-        "react-dom": "^17.0.1"
+        "react-dom": "^17.0.1",
+        "react-transition-group": "^4.4.1",
+        "primeicons": "^5.0.0"
+    },
+    "peerDependenciesMeta": {
+        "react-transition-group": {
+            "optional": true
+        }
     },
     "unpkg": "primereact.all.min.js"
 }

package/paginator/paginator.cjs.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var core = require('primereact/core');
+var utils = require('primereact/utils');
+var ripple = require('primereact/ripple');
 var dropdown = require('primereact/dropdown');
 var inputnumber = require('primereact/inputnumber');
 
@@ -191,18 +192,18 @@ var FirstPageLink = /*#__PURE__*/function (_Component) {
   _createClass(FirstPageLink, [{
     key: "render",
     value: function render() {
-      var className = core.classNames('p-paginator-first p-paginator-element p-link', {
+      var className = utils.classNames('p-paginator-first p-paginator-element p-link', {
         'p-disabled': this.props.disabled
       });
       var iconClassName = 'p-paginator-icon pi pi-angle-double-left';
-      var element = /*#__PURE__*/React__default['default'].createElement("button", {
+      var element = /*#__PURE__*/React__default["default"].createElement("button", {
         type: "button",
         className: className,
         onClick: this.props.onClick,
         disabled: this.props.disabled
-      }, /*#__PURE__*/React__default['default'].createElement("span", {
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
         className: iconClassName
-      }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+      }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
 
       if (this.props.template) {
         var defaultOptions = {
@@ -213,7 +214,7 @@ var FirstPageLink = /*#__PURE__*/function (_Component) {
           element: element,
           props: this.props
         };
-        return core.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
+        return utils.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
       }
 
       return element;
@@ -246,18 +247,18 @@ var NextPageLink = /*#__PURE__*/function (_Component) {
   _createClass(NextPageLink, [{
     key: "render",
     value: function render() {
-      var className = core.classNames('p-paginator-next p-paginator-element p-link', {
+      var className = utils.classNames('p-paginator-next p-paginator-element p-link', {
         'p-disabled': this.props.disabled
       });
       var iconClassName = 'p-paginator-icon pi pi-angle-right';
-      var element = /*#__PURE__*/React__default['default'].createElement("button", {
+      var element = /*#__PURE__*/React__default["default"].createElement("button", {
         type: "button",
         className: className,
         onClick: this.props.onClick,
         disabled: this.props.disabled
-      }, /*#__PURE__*/React__default['default'].createElement("span", {
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
         className: iconClassName
-      }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+      }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
 
       if (this.props.template) {
         var defaultOptions = {
@@ -268,7 +269,7 @@ var NextPageLink = /*#__PURE__*/function (_Component) {
           element: element,
           props: this.props
         };
-        return core.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
+        return utils.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
       }
 
       return element;
@@ -301,18 +302,18 @@ var PrevPageLink = /*#__PURE__*/function (_Component) {
   _createClass(PrevPageLink, [{
     key: "render",
     value: function render() {
-      var className = core.classNames('p-paginator-prev p-paginator-element p-link', {
+      var className = utils.classNames('p-paginator-prev p-paginator-element p-link', {
         'p-disabled': this.props.disabled
       });
       var iconClassName = 'p-paginator-icon pi pi-angle-left';
-      var element = /*#__PURE__*/React__default['default'].createElement("button", {
+      var element = /*#__PURE__*/React__default["default"].createElement("button", {
         type: "button",
         className: className,
         onClick: this.props.onClick,
         disabled: this.props.disabled
-      }, /*#__PURE__*/React__default['default'].createElement("span", {
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
         className: iconClassName
-      }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+      }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
 
       if (this.props.template) {
         var defaultOptions = {
@@ -323,7 +324,7 @@ var PrevPageLink = /*#__PURE__*/function (_Component) {
           element: element,
           props: this.props
         };
-        return core.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
+        return utils.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
       }
 
       return element;
@@ -356,18 +357,18 @@ var LastPageLink = /*#__PURE__*/function (_Component) {
   _createClass(LastPageLink, [{
     key: "render",
     value: function render() {
-      var className = core.classNames('p-paginator-last p-paginator-element p-link', {
+      var className = utils.classNames('p-paginator-last p-paginator-element p-link', {
         'p-disabled': this.props.disabled
       });
       var iconClassName = 'p-paginator-icon pi pi-angle-double-right';
-      var element = /*#__PURE__*/React__default['default'].createElement("button", {
+      var element = /*#__PURE__*/React__default["default"].createElement("button", {
         type: "button",
         className: className,
         onClick: this.props.onClick,
         disabled: this.props.disabled
-      }, /*#__PURE__*/React__default['default'].createElement("span", {
+      }, /*#__PURE__*/React__default["default"].createElement("span", {
         className: iconClassName
-      }), /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+      }), /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
 
       if (this.props.template) {
         var defaultOptions = {
@@ -378,7 +379,7 @@ var LastPageLink = /*#__PURE__*/function (_Component) {
           element: element,
           props: this.props
         };
-        return core.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
+        return utils.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
       }
 
       return element;
@@ -431,18 +432,18 @@ var PageLinks = /*#__PURE__*/function (_Component) {
         var startPageInView = this.props.value[0];
         var endPageInView = this.props.value[this.props.value.length - 1];
         elements = this.props.value.map(function (pageLink, i) {
-          var className = core.classNames('p-paginator-page p-paginator-element p-link', {
+          var className = utils.classNames('p-paginator-page p-paginator-element p-link', {
             'p-paginator-page-start': pageLink === startPageInView,
             'p-paginator-page-end': pageLink === endPageInView,
             'p-highlight': pageLink - 1 === _this.props.page
           });
-          var element = /*#__PURE__*/React__default['default'].createElement("button", {
+          var element = /*#__PURE__*/React__default["default"].createElement("button", {
             type: "button",
             className: className,
             onClick: function onClick(e) {
               return _this.onPageLinkClick(e, pageLink);
             }
-          }, pageLink, /*#__PURE__*/React__default['default'].createElement(core.Ripple, null));
+          }, pageLink, /*#__PURE__*/React__default["default"].createElement(ripple.Ripple, null));
 
           if (_this.props.template) {
             var defaultOptions = {
@@ -460,16 +461,16 @@ var PageLinks = /*#__PURE__*/function (_Component) {
               element: element,
               props: _this.props
             };
-            element = core.ObjectUtils.getJSXElement(_this.props.template, defaultOptions);
+            element = utils.ObjectUtils.getJSXElement(_this.props.template, defaultOptions);
           }
 
-          return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, {
+          return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, {
             key: pageLink
           }, element);
         });
       }
 
-      return /*#__PURE__*/React__default['default'].createElement("span", {
+      return /*#__PURE__*/React__default["default"].createElement("span", {
         className: "p-paginator-pages"
       }, elements);
     }
@@ -516,7 +517,7 @@ var RowsPerPageDropdown = /*#__PURE__*/function (_Component) {
           value: opt
         };
       }) : [];
-      var element = hasOptions ? /*#__PURE__*/React__default['default'].createElement(dropdown.Dropdown, {
+      var element = hasOptions ? /*#__PURE__*/React__default["default"].createElement(dropdown.Dropdown, {
         value: this.props.value,
         options: options,
         onChange: this.props.onChange,
@@ -537,7 +538,7 @@ var RowsPerPageDropdown = /*#__PURE__*/function (_Component) {
           element: element,
           props: this.props
         };
-        return core.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
+        return utils.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
       }
 
       return element;
@@ -589,7 +590,7 @@ var CurrentPageReport = /*#__PURE__*/function (_Component) {
         totalRecords: this.props.totalRecords
       };
       var text = this.props.reportTemplate.replace("{currentPage}", report.currentPage).replace("{totalPages}", report.totalPages).replace("{first}", report.first).replace("{last}", report.last).replace("{rows}", report.rows).replace("{totalRecords}", report.totalRecords);
-      var element = /*#__PURE__*/React__default['default'].createElement("span", {
+      var element = /*#__PURE__*/React__default["default"].createElement("span", {
         className: "p-paginator-current"
       }, text);
 
@@ -600,7 +601,7 @@ var CurrentPageReport = /*#__PURE__*/function (_Component) {
           props: this.props
         });
 
-        return core.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
+        return utils.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
       }
 
       return element;
@@ -649,7 +650,7 @@ var JumpToPageInput = /*#__PURE__*/function (_Component) {
     key: "render",
     value: function render() {
       var value = this.props.pageCount > 0 ? this.props.page + 1 : 0;
-      var element = /*#__PURE__*/React__default['default'].createElement(inputnumber.InputNumber, {
+      var element = /*#__PURE__*/React__default["default"].createElement(inputnumber.InputNumber, {
         value: value,
         onChange: this.onChange,
         className: "p-paginator-page-input",
@@ -665,7 +666,7 @@ var JumpToPageInput = /*#__PURE__*/function (_Component) {
           element: element,
           props: this.props
         };
-        return core.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
+        return utils.ObjectUtils.getJSXElement(this.props.template, defaultOptions);
       }
 
       return element;
@@ -834,7 +835,7 @@ var Paginator = /*#__PURE__*/function (_Component) {
 
       switch (key) {
         case 'FirstPageLink':
-          element = /*#__PURE__*/React__default['default'].createElement(FirstPageLink, {
+          element = /*#__PURE__*/React__default["default"].createElement(FirstPageLink, {
             key: key,
             onClick: this.changePageToFirst,
             disabled: this.isFirstPage() || this.empty(),
@@ -843,7 +844,7 @@ var Paginator = /*#__PURE__*/function (_Component) {
           break;
 
         case 'PrevPageLink':
-          element = /*#__PURE__*/React__default['default'].createElement(PrevPageLink, {
+          element = /*#__PURE__*/React__default["default"].createElement(PrevPageLink, {
             key: key,
             onClick: this.changePageToPrev,
             disabled: this.isFirstPage() || this.empty(),
@@ -852,7 +853,7 @@ var Paginator = /*#__PURE__*/function (_Component) {
           break;
 
         case 'NextPageLink':
-          element = /*#__PURE__*/React__default['default'].createElement(NextPageLink, {
+          element = /*#__PURE__*/React__default["default"].createElement(NextPageLink, {
             key: key,
             onClick: this.changePageToNext,
             disabled: this.isLastPage() || this.empty(),
@@ -861,7 +862,7 @@ var Paginator = /*#__PURE__*/function (_Component) {
           break;
 
         case 'LastPageLink':
-          element = /*#__PURE__*/React__default['default'].createElement(LastPageLink, {
+          element = /*#__PURE__*/React__default["default"].createElement(LastPageLink, {
             key: key,
             onClick: this.changePageToLast,
             disabled: this.isLastPage() || this.empty(),
@@ -870,7 +871,7 @@ var Paginator = /*#__PURE__*/function (_Component) {
           break;
 
         case 'PageLinks':
-          element = /*#__PURE__*/React__default['default'].createElement(PageLinks, {
+          element = /*#__PURE__*/React__default["default"].createElement(PageLinks, {
             key: key,
             value: this.updatePageLinks(),
             page: this.getPage(),
@@ -882,7 +883,7 @@ var Paginator = /*#__PURE__*/function (_Component) {
           break;
 
         case 'RowsPerPageDropdown':
-          element = /*#__PURE__*/React__default['default'].createElement(RowsPerPageDropdown, {
+          element = /*#__PURE__*/React__default["default"].createElement(RowsPerPageDropdown, {
             key: key,
             value: this.props.rows,
             page: this.getPage(),
@@ -897,7 +898,7 @@ var Paginator = /*#__PURE__*/function (_Component) {
           break;
 
         case 'CurrentPageReport':
-          element = /*#__PURE__*/React__default['default'].createElement(CurrentPageReport, {
+          element = /*#__PURE__*/React__default["default"].createElement(CurrentPageReport, {
             reportTemplate: this.props.currentPageReportTemplate,
             key: key,
             page: this.getPage(),
@@ -910,7 +911,7 @@ var Paginator = /*#__PURE__*/function (_Component) {
           break;
 
         case 'JumpToPageInput':
-          element = /*#__PURE__*/React__default['default'].createElement(JumpToPageInput, {
+          element = /*#__PURE__*/React__default["default"].createElement(JumpToPageInput, {
             key: key,
             rows: this.props.rows,
             page: this.getPage(),
@@ -962,17 +963,17 @@ var Paginator = /*#__PURE__*/function (_Component) {
       if (!this.props.alwaysShow && this.getPageCount() === 1) {
         return null;
       } else {
-        var className = core.classNames('p-paginator p-component', this.props.className);
-        var leftContent = core.ObjectUtils.getJSXElement(this.props.leftContent, this.props);
-        var rightContent = core.ObjectUtils.getJSXElement(this.props.rightContent, this.props);
+        var className = utils.classNames('p-paginator p-component', this.props.className);
+        var leftContent = utils.ObjectUtils.getJSXElement(this.props.leftContent, this.props);
+        var rightContent = utils.ObjectUtils.getJSXElement(this.props.rightContent, this.props);
         var elements = this.renderElements();
-        var leftElement = leftContent && /*#__PURE__*/React__default['default'].createElement("div", {
+        var leftElement = leftContent && /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-paginator-left-content"
         }, leftContent);
-        var rightElement = rightContent && /*#__PURE__*/React__default['default'].createElement("div", {
+        var rightElement = rightContent && /*#__PURE__*/React__default["default"].createElement("div", {
           className: "p-paginator-right-content"
         }, rightContent);
-        return /*#__PURE__*/React__default['default'].createElement("div", {
+        return /*#__PURE__*/React__default["default"].createElement("div", {
           className: className,
           style: this.props.style
         }, leftElement, elements, rightElement);