primereact 8.7.2 → 9.0.0-beta.1

package/dialog/dialog.js

@@ -29,14 +29,12 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
     _extends = Object.assign ? Object.assign.bind() : function (target) {
       for (var i = 1; i < arguments.length; i++) {
         var source = arguments[i];
-
         for (var key in source) {
           if (Object.prototype.hasOwnProperty.call(source, key)) {
             target[key] = source[key];
           }
         }
       }
-
       return target;
     };
     return _extends.apply(this, arguments);
@@ -44,11 +42,9 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
 
   function _arrayLikeToArray(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
-
     for (var i = 0, arr2 = new Array(len); i < len; i++) {
       arr2[i] = arr[i];
     }
-
     return arr2;
   }
 
@@ -82,33 +78,33 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
   }
 
   function _iterableToArrayLimit(arr, i) {
-    var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
-
-    if (_i == null) return;
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-
-    var _s, _e;
-
-    try {
-      for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) {
-        _arr.push(_s.value);
-
-        if (i && _arr.length === i) break;
-      }
-    } catch (err) {
-      _d = true;
-      _e = err;
-    } finally {
+    var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"];
+    if (null != _i) {
+      var _s,
+        _e,
+        _x,
+        _r,
+        _arr = [],
+        _n = !0,
+        _d = !1;
       try {
-        if (!_n && _i["return"] != null) _i["return"]();
+        if (_x = (_i = _i.call(arr)).next, 0 === i) {
+          if (Object(_i) !== _i) return;
+          _n = !1;
+        } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) {
+          ;
+        }
+      } catch (err) {
+        _d = !0, _e = err;
       } finally {
-        if (_d) throw _e;
+        try {
+          if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return;
+        } finally {
+          if (_d) throw _e;
+        }
       }
+      return _arr;
     }
-
-    return _arr;
   }
 
   function _nonIterableRest() {
@@ -120,26 +116,23 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
   }
 
   var Dialog = /*#__PURE__*/React__namespace.forwardRef(function (props, ref) {
-    var _React$useState = React__namespace.useState(props.id),
-        _React$useState2 = _slicedToArray(_React$useState, 2),
-        idState = _React$useState2[0],
-        setIdState = _React$useState2[1];
-
+    var uniqueId = props.id ? props.id : utils.UniqueComponentId();
+    var _React$useState = React__namespace.useState(uniqueId),
+      _React$useState2 = _slicedToArray(_React$useState, 2),
+      idState = _React$useState2[0];
+      _React$useState2[1];
     var _React$useState3 = React__namespace.useState(false),
-        _React$useState4 = _slicedToArray(_React$useState3, 2),
-        maskVisibleState = _React$useState4[0],
-        setMaskVisibleState = _React$useState4[1];
-
+      _React$useState4 = _slicedToArray(_React$useState3, 2),
+      maskVisibleState = _React$useState4[0],
+      setMaskVisibleState = _React$useState4[1];
     var _React$useState5 = React__namespace.useState(false),
-        _React$useState6 = _slicedToArray(_React$useState5, 2),
-        visibleState = _React$useState6[0],
-        setVisibleState = _React$useState6[1];
-
+      _React$useState6 = _slicedToArray(_React$useState5, 2),
+      visibleState = _React$useState6[0],
+      setVisibleState = _React$useState6[1];
     var _React$useState7 = React__namespace.useState(props.maximized),
-        _React$useState8 = _slicedToArray(_React$useState7, 2),
-        maximizedState = _React$useState8[0],
-        setMaximizedState = _React$useState8[1];
-
+      _React$useState8 = _slicedToArray(_React$useState7, 2),
+      maximizedState = _React$useState8[0],
+      setMaximizedState = _React$useState8[1];
     var dialogRef = React__namespace.useRef(null);
     var maskRef = React__namespace.useRef(null);
     var contentRef = React__namespace.useRef(null);
@@ -151,93 +144,82 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
     var lastPageX = React__namespace.useRef(null);
     var lastPageY = React__namespace.useRef(null);
     var styleElement = React__namespace.useRef(null);
-    var attributeSelector = React__namespace.useRef('');
+    var attributeSelector = React__namespace.useRef(uniqueId);
     var maximized = props.onMaximize ? props.maximized : maximizedState;
-
     var _useEventListener = hooks.useEventListener({
-      type: 'keydown',
-      listener: function listener(event) {
-        return onKeyDown(event);
-      }
-    }),
-        _useEventListener2 = _slicedToArray(_useEventListener, 2),
-        bindDocumentKeyDownListener = _useEventListener2[0],
-        unbindDocumentKeyDownListener = _useEventListener2[1];
-
+        type: 'keydown',
+        listener: function listener(event) {
+          return onKeyDown(event);
+        }
+      }),
+      _useEventListener2 = _slicedToArray(_useEventListener, 2),
+      bindDocumentKeyDownListener = _useEventListener2[0],
+      unbindDocumentKeyDownListener = _useEventListener2[1];
     var _useEventListener3 = hooks.useEventListener({
-      type: 'mousemove',
-      target: function target() {
-        return window.document;
-      },
-      listener: function listener(event) {
-        return onResize(event);
-      }
-    }),
-        _useEventListener4 = _slicedToArray(_useEventListener3, 2),
-        bindDocumentResizeListener = _useEventListener4[0],
-        unbindDocumentResizeListener = _useEventListener4[1];
-
+        type: 'mousemove',
+        target: function target() {
+          return window.document;
+        },
+        listener: function listener(event) {
+          return onResize(event);
+        }
+      }),
+      _useEventListener4 = _slicedToArray(_useEventListener3, 2),
+      bindDocumentResizeListener = _useEventListener4[0],
+      unbindDocumentResizeListener = _useEventListener4[1];
     var _useEventListener5 = hooks.useEventListener({
-      type: 'mouseup',
-      target: function target() {
-        return window.document;
-      },
-      listener: function listener(event) {
-        return onResizeEnd(event);
-      }
-    }),
-        _useEventListener6 = _slicedToArray(_useEventListener5, 2),
-        bindDocumentResizeEndListener = _useEventListener6[0],
-        unbindDocumentResizEndListener = _useEventListener6[1];
-
+        type: 'mouseup',
+        target: function target() {
+          return window.document;
+        },
+        listener: function listener(event) {
+          return onResizeEnd(event);
+        }
+      }),
+      _useEventListener6 = _slicedToArray(_useEventListener5, 2),
+      bindDocumentResizeEndListener = _useEventListener6[0],
+      unbindDocumentResizEndListener = _useEventListener6[1];
     var _useEventListener7 = hooks.useEventListener({
-      type: 'mousemove',
-      target: function target() {
-        return window.document;
-      },
-      listener: function listener(event) {
-        return onDrag(event);
-      }
-    }),
-        _useEventListener8 = _slicedToArray(_useEventListener7, 2),
-        bindDocumentDragListener = _useEventListener8[0],
-        unbindDocumentDragListener = _useEventListener8[1];
-
+        type: 'mousemove',
+        target: function target() {
+          return window.document;
+        },
+        listener: function listener(event) {
+          return onDrag(event);
+        }
+      }),
+      _useEventListener8 = _slicedToArray(_useEventListener7, 2),
+      bindDocumentDragListener = _useEventListener8[0],
+      unbindDocumentDragListener = _useEventListener8[1];
     var _useEventListener9 = hooks.useEventListener({
-      type: 'mouseup',
-      target: function target() {
-        return window.document;
-      },
-      listener: function listener(event) {
-        return onDragEnd(event);
-      }
-    }),
-        _useEventListener10 = _slicedToArray(_useEventListener9, 2),
-        bindDocumentDragEndListener = _useEventListener10[0],
-        unbindDocumentDragEndListener = _useEventListener10[1];
-
+        type: 'mouseup',
+        target: function target() {
+          return window.document;
+        },
+        listener: function listener(event) {
+          return onDragEnd(event);
+        }
+      }),
+      _useEventListener10 = _slicedToArray(_useEventListener9, 2),
+      bindDocumentDragEndListener = _useEventListener10[0],
+      unbindDocumentDragEndListener = _useEventListener10[1];
     var onClose = function onClose(event) {
       props.onHide();
       event.preventDefault();
     };
-
     var focus = function focus() {
       var activeElement = document.activeElement;
       var isActiveElementInDialog = activeElement && dialogRef.current && dialogRef.current.contains(activeElement);
-
       if (!isActiveElementInDialog && props.closable && props.showHeader) {
         closeRef.current.focus();
       }
     };
-
     var onMaskClick = function onMaskClick(event) {
       if (props.dismissableMask && props.modal && maskRef.current === event.target) {
         onClose(event);
       }
-
       props.onMaskClick && props.onMaskClick(event);
     };
-
     var toggleMaximize = function toggleMaximize(event) {
       if (props.onMaximize) {
         props.onMaximize({
@@ -249,27 +231,20 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
           return !prevMaximized;
         });
       }
-
       event.preventDefault();
     };
-
     var onKeyDown = function onKeyDown(event) {
       var currentTarget = event.currentTarget;
-
       if (!currentTarget || !currentTarget.primeDialogParams) {
         return;
       }
-
       var params = currentTarget.primeDialogParams;
       var paramLength = params.length;
       var dialogId = params[paramLength - 1] ? params[paramLength - 1].id : undefined;
-
       if (dialogId !== idState) {
         return;
       }
-
       var dialog = document.getElementById(dialogId);
-
       if (props.closable && props.closeOnEscape && event.key === 'Escape') {
         onClose(event);
         event.stopImmediatePropagation();
@@ -277,13 +252,11 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
       } else if (event.key === 'Tab') {
         event.preventDefault();
         var focusableElements = utils.DomHandler.getFocusableElements(dialog);
-
         if (focusableElements && focusableElements.length > 0) {
           if (!document.activeElement) {
             focusableElements[0].focus();
           } else {
             var focusedIndex = focusableElements.indexOf(document.activeElement);
-
             if (event.shiftKey) {
               if (focusedIndex === -1 || focusedIndex === 0) focusableElements[focusableElements.length - 1].focus();else focusableElements[focusedIndex - 1].focus();
             } else {
@@ -293,12 +266,10 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         }
       }
     };
-
     var onDragStart = function onDragStart(event) {
       if (utils.DomHandler.hasClass(event.target, 'p-dialog-header-icon') || utils.DomHandler.hasClass(event.target.parentElement, 'p-dialog-header-icon')) {
         return;
       }
-
       if (props.draggable) {
         dragging.current = true;
         lastPageX.current = event.pageX;
@@ -308,7 +279,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         props.onDragStart && props.onDragStart(event);
       }
     };
-
     var onDrag = function onDrag(event) {
       if (dragging.current) {
         var width = utils.DomHandler.getOuterWidth(dialogRef.current);
@@ -320,13 +290,11 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         var topPos = offset.top + deltaY;
         var viewport = utils.DomHandler.getViewport();
         dialogRef.current.style.position = 'fixed';
-
         if (props.keepInViewport) {
           if (leftPos >= props.minX && leftPos + width < viewport.width) {
             lastPageX.current = event.pageX;
             dialogRef.current.style.left = leftPos + 'px';
           }
-
           if (topPos >= props.minY && topPos + height < viewport.height) {
             lastPageY.current = event.pageY;
             dialogRef.current.style.top = topPos + 'px';
@@ -337,11 +305,9 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
           lastPageY.current = event.pageY;
           dialogRef.current.style.top = topPos + 'px';
         }
-
         props.onDrag && props.onDrag(event);
       }
     };
-
     var onDragEnd = function onDragEnd(event) {
       if (dragging.current) {
         dragging.current = false;
@@ -349,7 +315,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         props.onDragEnd && props.onDragEnd(event);
       }
     };
-
     var onResizeStart = function onResizeStart(event) {
       if (props.resizable) {
         resizing.current = true;
@@ -359,18 +324,14 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         props.onResizeStart && props.onResizeStart(event);
       }
     };
-
     var convertToPx = function convertToPx(value, property, viewport) {
       !viewport && (viewport = utils.DomHandler.getViewport());
       var val = parseInt(value);
-
       if (/^(\d+|(\.\d+))(\.\d+)?%$/.test(value)) {
         return val * (viewport[property] / 100);
       }
-
       return val;
     };
-
     var onResize = function onResize(event) {
       if (resizing.current) {
         var deltaX = event.pageX - lastPageX.current;
@@ -384,26 +345,21 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         var minHeight = convertToPx(dialogRef.current.style.minHeight, 'height', viewport);
         var newWidth = width + deltaX;
         var newHeight = height + deltaY;
-
         if (hasBeenDragged) {
           newWidth += deltaX;
           newHeight += deltaY;
         }
-
         if ((!minWidth || newWidth > minWidth) && offset.left + newWidth < viewport.width) {
           dialogRef.current.style.width = newWidth + 'px';
         }
-
         if ((!minHeight || newHeight > minHeight) && offset.top + newHeight < viewport.height) {
           dialogRef.current.style.height = newHeight + 'px';
         }
-
         lastPageX.current = event.pageX;
         lastPageY.current = event.pageY;
         props.onResize && props.onResize(event);
       }
     };
-
     var onResizeEnd = function onResizeEnd(event) {
       if (resizing.current) {
         resizing.current = false;
@@ -411,14 +367,12 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         props.onResizeEnd && props.onResizeEnd(event);
       }
     };
-
     var resetPosition = function resetPosition() {
       dialogRef.current.style.position = '';
       dialogRef.current.style.left = '';
       dialogRef.current.style.top = '';
       dialogRef.current.style.margin = '';
     };
-
     var getPositionClass = function getPositionClass() {
       var positions = ['center', 'left', 'right', 'top', 'top-left', 'top-right', 'bottom', 'bottom-left', 'bottom-right'];
       var pos = positions.find(function (item) {
@@ -426,55 +380,43 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
       });
       return pos ? "p-dialog-".concat(pos) : '';
     };
-
     var onEnter = function onEnter() {
       dialogRef.current.setAttribute(attributeSelector.current, '');
     };
-
     var onEntered = function onEntered() {
       props.onShow && props.onShow();
-
       if (props.focusOnShow) {
         focus();
       }
-
       enableDocumentSettings();
     };
-
     var onExiting = function onExiting() {
       if (props.modal) {
         utils.DomHandler.addClass(maskRef.current, 'p-component-overlay-leave');
       }
-
       if (props.blockScroll) {
         utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
       }
     };
-
     var onExited = function onExited() {
       dragging.current = false;
       utils.ZIndexUtils.clear(maskRef.current);
       setMaskVisibleState(false);
       disableDocumentSettings();
     };
-
     var enableDocumentSettings = function enableDocumentSettings() {
       bindGlobalListeners();
-
       if (props.blockScroll || props.maximizable && maximized) {
         utils.DomHandler.addClass(document.body, 'p-overflow-hidden');
       }
     };
-
     var disableDocumentSettings = function disableDocumentSettings() {
       unbindGlobalListeners();
       var isMaximized = props.maximizable && maximized;
-
       if (props.modal) {
         var hasBlockScroll = document.primeDialogParams && document.primeDialogParams.some(function (param) {
           return param.hasBlockScroll;
         });
-
         if (hasBlockScroll || isMaximized) {
           utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
         }
@@ -482,18 +424,15 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
       }
     };
-
     var bindGlobalListeners = function bindGlobalListeners() {
       if (props.draggable) {
         bindDocumentDragListener();
         bindDocumentDragEndListener();
       }
-
       if (props.resizable) {
         bindDocumentResizeListener();
         bindDocumentResizeEndListener();
       }
-
       bindDocumentKeyDownListener();
       var newParam = {
         id: idState,
@@ -501,7 +440,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
       };
       document.primeDialogParams = document.primeDialogParams ? [].concat(_toConsumableArray(document.primeDialogParams), [newParam]) : [newParam];
     };
-
     var unbindGlobalListeners = function unbindGlobalListeners() {
       unbindDocumentDragListener();
       unbindDocumentDragEndListener();
@@ -512,42 +450,24 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         return param.id !== idState;
       });
     };
-
     var createStyle = function createStyle() {
-      if (!styleElement.current) {
-        styleElement.current = utils.DomHandler.createInlineStyle(PrimeReact__default["default"].nonce);
-        var innerHTML = '';
-
-        for (var breakpoint in props.breakpoints) {
-          innerHTML += "\n                    @media screen and (max-width: ".concat(breakpoint, ") {\n                        .p-dialog[").concat(attributeSelector.current, "] {\n                            width: ").concat(props.breakpoints[breakpoint], " !important;\n                        }\n                    }\n                ");
-        }
-
-        styleElement.current.innerHTML = innerHTML;
+      styleElement.current = utils.DomHandler.createInlineStyle(PrimeReact__default["default"].nonce);
+      var innerHTML = '';
+      for (var breakpoint in props.breakpoints) {
+        innerHTML += "\n                @media screen and (max-width: ".concat(breakpoint, ") {\n                    .p-dialog[").concat(attributeSelector.current, "] {\n                        width: ").concat(props.breakpoints[breakpoint], " !important;\n                    }\n                }\n            ");
       }
+      styleElement.current.innerHTML = innerHTML;
     };
-
     var changeScrollOnMaximizable = function changeScrollOnMaximizable() {
       if (!props.blockScroll) {
         var funcName = maximized ? 'addClass' : 'removeClass';
         utils.DomHandler[funcName](document.body, 'p-overflow-hidden');
       }
     };
-
     hooks.useMountEffect(function () {
-      var unqiueId = utils.UniqueComponentId();
-
-      if (!idState) {
-        setIdState(unqiueId);
-      }
-
-      if (!attributeSelector.current) {
-        attributeSelector.current = unqiueId;
-      }
-
       if (props.visible) {
         setMaskVisibleState(true);
       }
-
       if (props.breakpoints) {
         createStyle();
       }
@@ -556,7 +476,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
       if (props.visible && !maskVisibleState) {
         setMaskVisibleState(true);
       }
-
       if (props.visible !== visibleState && maskVisibleState) {
         setVisibleState(props.visible);
       }
@@ -599,7 +518,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         }
       };
     });
-
     var createCloseIcon = function createCloseIcon() {
       if (props.closable) {
         var ariaLabel = props.ariaCloseIconLabel || PrimeReact.localeOption('close');
@@ -614,16 +532,13 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
           "aria-hidden": "true"
         }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
       }
-
       return null;
     };
-
     var createMaximizeIcon = function createMaximizeIcon() {
       var iconClassName = utils.classNames('p-dialog-header-maximize-icon pi', {
         'pi-window-maximize': !maximized,
         'pi-window-minimize': maximized
       });
-
       if (props.maximizable) {
         return /*#__PURE__*/React__namespace.createElement("button", {
           type: "button",
@@ -633,10 +548,8 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
           className: iconClassName
         }), /*#__PURE__*/React__namespace.createElement(ripple.Ripple, null));
       }
-
       return null;
     };
-
     var createHeader = function createHeader() {
       if (props.showHeader) {
         var closeIcon = createCloseIcon();
@@ -657,10 +570,8 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
           className: "p-dialog-header-icons"
         }, icons, maximizeIcon, closeIcon));
       }
-
       return null;
     };
-
     var createContent = function createContent() {
       var className = utils.classNames('p-dialog-content', props.contentClassName);
       var contentId = idState + '_content';
@@ -671,7 +582,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         style: props.contentStyle
       }, props.children);
     };
-
     var createFooter = function createFooter() {
       var footer = utils.ObjectUtils.getJSXElement(props.footer, props);
       return footer && /*#__PURE__*/React__namespace.createElement("div", {
@@ -679,7 +589,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         className: "p-dialog-footer"
       }, footer);
     };
-
     var createResizer = function createResizer() {
       if (props.resizable) {
         return /*#__PURE__*/React__namespace.createElement("span", {
@@ -690,15 +599,16 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
           onMouseDown: onResizeStart
         });
       }
-
       return null;
     };
-
     var createElement = function createElement() {
       var otherProps = utils.ObjectUtils.findDiffKeys(props, Dialog.defaultProps);
       var className = utils.classNames('p-dialog p-component', props.className, {
         'p-dialog-rtl': props.rtl,
-        'p-dialog-maximized': maximized
+        'p-dialog-maximized': maximized,
+        'p-dialog-default': !maximized,
+        'p-input-filled': PrimeReact__default["default"].inputStyle === 'filled',
+        'p-ripple-disabled': PrimeReact__default["default"].ripple === false
       });
       var maskClassName = utils.classNames('p-dialog-mask', getPositionClass(), {
         'p-component-overlay p-component-overlay-enter': props.modal,
@@ -745,7 +655,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         "aria-modal": props.modal
       }), header, content, footer, resizer)));
     };
-
     var createDialog = function createDialog() {
       var element = createElement();
       return /*#__PURE__*/React__namespace.createElement(portal.Portal, {
@@ -754,7 +663,6 @@ this.primereact.dialog = (function (exports, React, PrimeReact, csstransition, h
         visible: true
       });
     };
-
     return maskVisibleState && createDialog();
   });
   Dialog.displayName = 'Dialog';

package/dialog/dialog.min.css

@@ -1 +1 @@
-.p-dialog-mask{position:fixed;top:0;left:0;width:100%;height:100%;display:none;justify-content:center;align-items:center;pointer-events:none;background-color:transparent;transition-property:background-color}.p-dialog-visible{display:flex}.p-dialog-mask.p-component-overlay{pointer-events:auto}.p-dialog{display:flex;flex-direction:column;pointer-events:auto;max-height:90%;transform:scale(1);position:relative}.p-dialog-content{overflow-y:auto;flex-grow:1}.p-dialog-header{display:flex;align-items:center;flex-shrink:0}.p-dialog-footer{flex-shrink:0}.p-dialog .p-dialog-header-icons{display:flex;align-items:center;align-self:flex-start;flex-shrink:0}.p-dialog .p-dialog-header-icon{display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.p-dialog .p-dialog-title{flex-grow:1}.p-fluid .p-dialog-footer .p-button{width:auto}.p-dialog-enter{opacity:0;transform:scale(0.7)}.p-dialog-enter-active{opacity:1;transform:scale(1);transition:all 150ms cubic-bezier(0,0,0.2,1)}.p-dialog-enter-done{transform:none}.p-dialog-exit-active{opacity:0;transform:scale(0.7);transition:all 150ms cubic-bezier(0.4,0.0,0.2,1)}.p-dialog-top .p-dialog,.p-dialog-bottom .p-dialog,.p-dialog-left .p-dialog,.p-dialog-right .p-dialog,.p-dialog-top-left .p-dialog,.p-dialog-top-right .p-dialog,.p-dialog-bottom-left .p-dialog,.p-dialog-bottom-right .p-dialog{margin:.75em}.p-dialog-top .p-dialog-enter,.p-dialog-top .p-dialog-exit-active{transform:translate3d(0,-100%,0)}.p-dialog-bottom .p-dialog-enter,.p-dialog-bottom .p-dialog-exit-active{transform:translate3d(0,100%,0)}.p-dialog-left .p-dialog-enter,.p-dialog-left .p-dialog-exit-active,.p-dialog-top-left .p-dialog-enter,.p-dialog-top-left .p-dialog-exit-active,.p-dialog-bottom-left .p-dialog-enter,.p-dialog-bottom-left .p-dialog-exit-active{transform:translate3d(-100%,0,0)}.p-dialog-right .p-dialog-enter,.p-dialog-right .p-dialog-exit-active,.p-dialog-top-right .p-dialog-enter,.p-dialog-top-right .p-dialog-exit-active,.p-dialog-bottom-right .p-dialog-enter,.p-dialog-bottom-right .p-dialog-exit-active{transform:translate3d(100%,0,0)}.p-dialog-top .p-dialog-enter-active,.p-dialog-bottom .p-dialog-enter-active,.p-dialog-left .p-dialog-enter-active,.p-dialog-top-left .p-dialog-enter-active,.p-dialog-bottom-left .p-dialog-enter-active,.p-dialog-right .p-dialog-enter-active,.p-dialog-top-right .p-dialog-enter-active,.p-dialog-bottom-right .p-dialog-enter-active{transform:translate3d(0,0,0);transition:all .3s ease-out}.p-dialog-top .p-dialog-exit-active,.p-dialog-bottom .p-dialog-exit-active,.p-dialog-left .p-dialog-exit-active,.p-dialog-top-left .p-dialog-exit-active,.p-dialog-bottom-left .p-dialog-exit-active,.p-dialog-right .p-dialog-exit-active,.p-dialog-top-right .p-dialog-exit-active,.p-dialog-bottom-right .p-dialog-exit-active{transition:all .3s ease-out}.p-dialog-maximized{transition:none;transform:none;width:100vw !important;height:100vh !important;max-height:100%;top:0 !important;left:0 !important}.p-dialog-maximized .p-dialog-content{flex-grow:1}.p-dialog-left{justify-content:flex-start}.p-dialog-right{justify-content:flex-end}.p-dialog-top{align-items:flex-start}.p-dialog-top-left{justify-content:flex-start;align-items:flex-start}.p-dialog-top-right{justify-content:flex-end;align-items:flex-start}.p-dialog-bottom{align-items:flex-end}.p-dialog-bottom-left{justify-content:flex-start;align-items:flex-end}.p-dialog-bottom-right{justify-content:flex-end;align-items:flex-end}.p-confirm-dialog .p-dialog-content{display:flex;align-items:center}.p-dialog .p-resizable-handle{position:absolute;font-size:.1px;display:block;cursor:se-resize;width:12px;height:12px;right:1px;bottom:1px}.p-dialog-draggable .p-dialog-header{cursor:move}
+.p-dialog-mask{position:fixed;top:0;left:0;width:100%;height:100%;display:none;justify-content:center;align-items:center;pointer-events:none;background-color:transparent;transition-property:background-color}.p-dialog-visible{display:flex}.p-dialog-mask.p-component-overlay{pointer-events:auto}.p-dialog{display:flex;flex-direction:column;pointer-events:auto;max-height:90%;transform:scale(1);position:relative}.p-dialog:not([class*='p-dialog-']){display:none}.p-dialog-content{overflow-y:auto;flex-grow:1}.p-dialog-header{display:flex;align-items:center;flex-shrink:0}.p-dialog-footer{flex-shrink:0}.p-dialog .p-dialog-header-icons{display:flex;align-items:center;align-self:flex-start;flex-shrink:0}.p-dialog .p-dialog-header-icon{display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}.p-dialog .p-dialog-title{flex-grow:1}.p-fluid .p-dialog-footer .p-button{width:auto}.p-dialog-enter{opacity:0;transform:scale(0.7)}.p-dialog-enter-active{opacity:1;transform:scale(1);transition:all 150ms cubic-bezier(0,0,0.2,1)}.p-dialog-enter-done{transform:none}.p-dialog-exit-active{opacity:0;transform:scale(0.7);transition:all 150ms cubic-bezier(0.4,0.0,0.2,1)}.p-dialog-top .p-dialog,.p-dialog-bottom .p-dialog,.p-dialog-left .p-dialog,.p-dialog-right .p-dialog,.p-dialog-top-left .p-dialog,.p-dialog-top-right .p-dialog,.p-dialog-bottom-left .p-dialog,.p-dialog-bottom-right .p-dialog{margin:.75em}.p-dialog-top .p-dialog-enter,.p-dialog-top .p-dialog-exit-active{transform:translate3d(0,-100%,0)}.p-dialog-bottom .p-dialog-enter,.p-dialog-bottom .p-dialog-exit-active{transform:translate3d(0,100%,0)}.p-dialog-left .p-dialog-enter,.p-dialog-left .p-dialog-exit-active,.p-dialog-top-left .p-dialog-enter,.p-dialog-top-left .p-dialog-exit-active,.p-dialog-bottom-left .p-dialog-enter,.p-dialog-bottom-left .p-dialog-exit-active{transform:translate3d(-100%,0,0)}.p-dialog-right .p-dialog-enter,.p-dialog-right .p-dialog-exit-active,.p-dialog-top-right .p-dialog-enter,.p-dialog-top-right .p-dialog-exit-active,.p-dialog-bottom-right .p-dialog-enter,.p-dialog-bottom-right .p-dialog-exit-active{transform:translate3d(100%,0,0)}.p-dialog-top .p-dialog-enter-active,.p-dialog-bottom .p-dialog-enter-active,.p-dialog-left .p-dialog-enter-active,.p-dialog-top-left .p-dialog-enter-active,.p-dialog-bottom-left .p-dialog-enter-active,.p-dialog-right .p-dialog-enter-active,.p-dialog-top-right .p-dialog-enter-active,.p-dialog-bottom-right .p-dialog-enter-active{transform:translate3d(0,0,0);transition:all .3s ease-out}.p-dialog-top .p-dialog-exit-active,.p-dialog-bottom .p-dialog-exit-active,.p-dialog-left .p-dialog-exit-active,.p-dialog-top-left .p-dialog-exit-active,.p-dialog-bottom-left .p-dialog-exit-active,.p-dialog-right .p-dialog-exit-active,.p-dialog-top-right .p-dialog-exit-active,.p-dialog-bottom-right .p-dialog-exit-active{transition:all .3s ease-out}.p-dialog-maximized{transition:none;transform:none;margin:0 !important;width:100vw !important;height:100vh !important;max-height:100%;top:0 !important;left:0 !important}.p-dialog-maximized .p-dialog-content{flex-grow:1}.p-dialog-left{justify-content:flex-start}.p-dialog-right{justify-content:flex-end}.p-dialog-top{align-items:flex-start}.p-dialog-top-left{justify-content:flex-start;align-items:flex-start}.p-dialog-top-right{justify-content:flex-end;align-items:flex-start}.p-dialog-bottom{align-items:flex-end}.p-dialog-bottom-left{justify-content:flex-start;align-items:flex-end}.p-dialog-bottom-right{justify-content:flex-end;align-items:flex-end}.p-confirm-dialog .p-dialog-content{display:flex;align-items:center}.p-dialog .p-resizable-handle{position:absolute;font-size:.1px;display:block;cursor:se-resize;width:12px;height:12px;right:1px;bottom:1px}.p-dialog-draggable .p-dialog-header{cursor:move}