primereact 10.2.1 → 10.3.1

package/confirmpopup/confirmpopup.cjs.js

@@ -176,29 +176,30 @@ var classes = {
 var ConfirmPopupBase = componentbase.ComponentBase.extend({
   defaultProps: {
     __TYPE: 'ConfirmPopup',
-    tagKey: undefined,
-    target: null,
-    visible: false,
-    message: null,
-    rejectLabel: null,
-    acceptLabel: null,
-    icon: null,
-    rejectIcon: null,
-    acceptIcon: null,
-    rejectClassName: null,
+    accept: null,
     acceptClassName: null,
-    className: null,
-    style: null,
+    acceptIcon: null,
+    acceptLabel: null,
     appendTo: null,
+    children: undefined,
+    className: null,
+    closeOnEscape: true,
+    defaultFocus: 'accept',
     dismissable: true,
     footer: null,
-    onShow: null,
+    icon: null,
+    message: null,
     onHide: null,
-    accept: null,
+    onShow: null,
     reject: null,
+    rejectClassName: null,
+    rejectIcon: null,
+    rejectLabel: null,
+    style: null,
+    tagKey: undefined,
+    target: null,
     transitionOptions: null,
-    children: undefined,
-    closeOnEscape: true
+    visible: false
   },
   css: {
     classes: classes,
@@ -206,104 +207,6 @@ var ConfirmPopupBase = componentbase.ComponentBase.extend({
   }
 });
 
-var usePrevious = function usePrevious(newValue) {
-  var ref = React__namespace.useRef(undefined);
-  React__namespace.useEffect(function () {
-    ref.current = newValue;
-  });
-  return ref.current;
-};
-
-/* eslint-disable */
-var useUnmountEffect = function useUnmountEffect(fn) {
-  return React__namespace.useEffect(function () {
-    return fn;
-  }, []);
-};
-/* eslint-enable */
-
-/* eslint-disable */
-var useEventListener = function useEventListener(_ref) {
-  var _ref$target = _ref.target,
-    target = _ref$target === void 0 ? 'document' : _ref$target,
-    type = _ref.type,
-    listener = _ref.listener,
-    options = _ref.options,
-    _ref$when = _ref.when,
-    when = _ref$when === void 0 ? true : _ref$when;
-  var targetRef = React__namespace.useRef(null);
-  var listenerRef = React__namespace.useRef(null);
-  var prevOptions = usePrevious(options);
-  var bind = function bind() {
-    var bindOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
-    if (utils.ObjectUtils.isNotEmpty(bindOptions.target)) {
-      unbind();
-      (bindOptions.when || when) && (targetRef.current = utils.DomHandler.getTargetElement(bindOptions.target));
-    }
-    if (!listenerRef.current && targetRef.current) {
-      listenerRef.current = function (event) {
-        return listener && listener(event);
-      };
-      targetRef.current.addEventListener(type, listenerRef.current, options);
-    }
-  };
-  var unbind = function unbind() {
-    if (listenerRef.current) {
-      targetRef.current.removeEventListener(type, listenerRef.current, options);
-      listenerRef.current = null;
-    }
-  };
-  React__namespace.useEffect(function () {
-    if (when) {
-      targetRef.current = utils.DomHandler.getTargetElement(target);
-    } else {
-      unbind();
-      targetRef.current = null;
-    }
-  }, [target, when]);
-  React__namespace.useEffect(function () {
-    if (listenerRef.current && (listenerRef.current !== listener || prevOptions !== options)) {
-      unbind();
-      when && bind();
-    }
-  }, [listener, options]);
-  useUnmountEffect(function () {
-    unbind();
-  });
-  return [bind, unbind];
-};
-/* eslint-enable */
-
-var useOnEscapeKey = function useOnEscapeKey(ref, condition, callback) {
-  var handleEsc = function handleEsc(event) {
-    if (event.key === 'Esc' || event.key === 'Escape') {
-      event.stopImmediatePropagation();
-      callback(event);
-    }
-    return;
-  };
-  var _useEventListener = useEventListener({
-      type: 'keydown',
-      listener: handleEsc
-    }),
-    _useEventListener2 = _slicedToArray(_useEventListener, 2),
-    bindKeyDownListener = _useEventListener2[0],
-    unbindKeyDownListener = _useEventListener2[1];
-  React__namespace.useEffect(function () {
-    if (!condition) {
-      return;
-    }
-    if (!ref.current) {
-      return;
-    }
-    bindKeyDownListener();
-    return function () {
-      unbindKeyDownListener();
-    };
-  });
-  return [ref, callback];
-};
-
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var confirmPopup = function confirmPopup() {
@@ -355,6 +258,7 @@ var ConfirmPopup = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__names
   });
   var overlayRef = React__namespace.useRef(null);
   var acceptBtnRef = React__namespace.useRef(null);
+  var rejectBtnRef = React__namespace.useRef(null);
   var isPanelClicked = React__namespace.useRef(false);
   var overlayEventListener = React__namespace.useRef(null);
   var confirmProps = React__namespace.useRef(null);
@@ -374,8 +278,15 @@ var ConfirmPopup = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__names
   };
   var acceptLabel = getPropValue('acceptLabel') || PrimeReact.localeOption('accept');
   var rejectLabel = getPropValue('rejectLabel') || PrimeReact.localeOption('reject');
-  useOnEscapeKey(overlayRef, props.dismissable && props.closeOnEscape, function (event) {
-    hide('hide');
+  var displayOrder = hooks.useDisplayOrder('dialog', visibleState);
+  hooks.useGlobalOnEscapeKey({
+    callback: function callback() {
+      if (props.dismissable && props.closeOnEscape) {
+        hide('hide');
+      }
+    },
+    when: visibleState,
+    priority: [hooks.ESC_KEY_HANDLING_PRIORITIES.DIALOG, displayOrder]
   });
   var _useOverlayListener = hooks.useOverlayListener({
       target: getPropValue('target'),
@@ -415,16 +326,20 @@ var ConfirmPopup = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__names
     }
   };
   var show = function show() {
-    // Remember the focused element before we opened the dialog
-    // so we can return focus to it once we close the dialog.
-    focusElementOnHide.current = document.activeElement;
-    setVisibleState(true);
+    var currentProps = getCurrentProps();
     setReshowState(false);
-    isCallbackExecuting.current = false;
-    overlayEventListener.current = function (e) {
-      !isOutsideClicked(e.target) && (isPanelClicked.current = true);
-    };
-    overlayservice.OverlayService.on('overlay-click', overlayEventListener.current);
+    if (currentProps.group === props.group) {
+      setVisibleState(true);
+      isCallbackExecuting.current = false;
+      overlayEventListener.current = function (e) {
+        !isOutsideClicked(e.target) && (isPanelClicked.current = true);
+      };
+      overlayservice.OverlayService.on('overlay-click', overlayEventListener.current);
+
+      // Remember the focused element before we opened the dialog
+      // so we can return focus to it once we close the dialog.
+      focusElementOnHide.current = document.activeElement;
+    }
   };
   var hide = function hide(result) {
     setVisibleState(false);
@@ -448,8 +363,12 @@ var ConfirmPopup = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__names
   };
   var onEntered = function onEntered() {
     bindOverlayListener();
-    if (acceptBtnRef.current) {
-      acceptBtnRef.current.focus();
+    var defaultFocus = getPropValue('defaultFocus');
+    if (defaultFocus === undefined || defaultFocus === 'accept') {
+      acceptBtnRef.current && acceptBtnRef.current.focus();
+    }
+    if (defaultFocus === 'reject') {
+      rejectBtnRef.current && rejectBtnRef.current.focus();
     }
     callbackFromProp('onShow');
   };
@@ -548,6 +467,7 @@ var ConfirmPopup = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__names
       className: cx('footer')
     }, ptm('footer'));
     var rejectButtonProps = utils.mergeProps({
+      ref: rejectBtnRef,
       label: rejectLabel,
       icon: getPropValue('rejectIcon'),
       className: cx('rejectButton', {
@@ -591,38 +511,51 @@ var ConfirmPopup = /*#__PURE__*/React__namespace.memo( /*#__PURE__*/React__names
     }
     return content;
   };
+  var rootProps = utils.mergeProps({
+    ref: overlayRef,
+    id: getPropValue('id'),
+    className: cx('root', {
+      context: context,
+      getPropValue: getPropValue
+    }),
+    style: getPropValue('style'),
+    onClick: onPanelClick
+  }, ConfirmPopupBase.getOtherProps(props), ptm('root'));
+  var transitionProps = utils.mergeProps({
+    classNames: cx('transition'),
+    "in": visibleState,
+    timeout: {
+      enter: 120,
+      exit: 100
+    },
+    options: getPropValue('transitionOptions'),
+    unmountOnExit: true,
+    onEnter: onEnter,
+    onEntered: onEntered,
+    onExit: onExit,
+    onExited: onExited
+  }, ptm('transition'));
+  var createTemplateElement = function createTemplateElement() {
+    var currentProps = getCurrentProps();
+    var message = utils.ObjectUtils.getJSXElement(getPropValue('message'), currentProps);
+    var templateElementProps = {
+      message: message,
+      acceptBtnRef: acceptBtnRef,
+      rejectBtnRef: rejectBtnRef,
+      hide: hide
+    };
+    return /*#__PURE__*/React__namespace.createElement(csstransition.CSSTransition, _extends({
+      nodeRef: overlayRef
+    }, transitionProps), /*#__PURE__*/React__namespace.createElement("div", rootProps, utils.ObjectUtils.getJSXElement(inProps.content, templateElementProps)));
+  };
   var createElement = function createElement() {
     var content = createContent();
     var footer = createFooter();
-    var rootProps = utils.mergeProps({
-      ref: overlayRef,
-      id: getPropValue('id'),
-      className: cx('root', {
-        context: context,
-        getPropValue: getPropValue
-      }),
-      style: getPropValue('style'),
-      onClick: onPanelClick
-    }, ConfirmPopupBase.getOtherProps(props), ptm('root'));
-    var transitionProps = utils.mergeProps({
-      classNames: cx('transition'),
-      "in": visibleState,
-      timeout: {
-        enter: 120,
-        exit: 100
-      },
-      options: getPropValue('transitionOptions'),
-      unmountOnExit: true,
-      onEnter: onEnter,
-      onEntered: onEntered,
-      onExit: onExit,
-      onExited: onExited
-    }, ptm('transition'));
     return /*#__PURE__*/React__namespace.createElement(csstransition.CSSTransition, _extends({
       nodeRef: overlayRef
     }, transitionProps), /*#__PURE__*/React__namespace.createElement("div", rootProps, content, footer));
   };
-  var element = createElement();
+  var element = inProps !== null && inProps !== void 0 && inProps.content ? createTemplateElement() : createElement();
   return /*#__PURE__*/React__namespace.createElement(portal.Portal, {
     element: element,
     appendTo: getPropValue('appendTo'),

package/confirmpopup/confirmpopup.cjs.min.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),r=require("primereact/button"),n=require("primereact/componentbase"),o=require("primereact/csstransition"),c=require("primereact/hooks"),i=require("primereact/overlayservice"),u=require("primereact/portal"),a=require("primereact/utils");function l(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function p(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=p(e),f=l(t);function m(){return m=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},m.apply(this,arguments)}function d(e){if(Array.isArray(e))return e}function v(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,c,i,u=[],a=!0,l=!1;try{if(c=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;a=!1}else for(;!(a=(n=c.call(r)).done)&&(u.push(n.value),u.length!==t);a=!0);}catch(e){l=!0,o=e}finally{try{if(!a&&null!=r.return&&(i=r.return(),Object(i)!==i))return}finally{if(l)throw o}}return u}}function b(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function y(e,t){if(e){if("string"==typeof e)return b(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?b(e,t):void 0}}function g(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function O(e,t){return d(e)||v(e,t)||y(e,t)||g()}function j(e){return j="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},j(e)}function P(e,t){if("object"!==j(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!==j(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function h(e){var t=P(e,"string");return"symbol"===j(t)?t:String(t)}var E=n.ComponentBase.extend({defaultProps:{__TYPE:"ConfirmPopup",tagKey:void 0,target:null,visible:!1,message:null,rejectLabel:null,acceptLabel:null,icon:null,rejectIcon:null,acceptIcon:null,rejectClassName:null,acceptClassName:null,className:null,style:null,appendTo:null,dismissable:!0,footer:null,onShow:null,onHide:null,accept:null,reject:null,transitionOptions:null,children:void 0,closeOnEscape:!0},css:{classes:{root:function(e){var t=e.context;return a.classNames("p-confirm-popup p-component",(0,e.getPropValue)("className"),{"p-input-filled":t&&"filled"===t.inputStyle||"filled"===f.default.inputStyle,"p-ripple-disabled":t&&!1===t.ripple||!1===f.default.ripple})},acceptButton:function(e){return a.classNames("p-confirm-popup-accept p-button-sm",(0,e.getPropValue)("acceptClassName"))},rejectButton:function(e){var t=e.getPropValue;return a.classNames("p-confirm-popup-reject p-button-sm",{"p-button-text":!t("rejectClassName")},t("rejectClassName"))},content:"p-confirm-popup-content",icon:"p-confirm-popup-icon",message:"p-confirm-popup-message",footer:"p-confirm-popup-footer",transition:"p-connected-overlay"},styles:'\n@layer primereact {\n    .p-confirm-popup-flipped {\n        margin-top: 0;\n        margin-bottom: 10px;\n    }\n    \n    .p-confirm-popup:after, .p-confirm-popup:before {\n        bottom: 100%;\n        left: calc(var(--overlayArrowLeft, 0) + 1.25rem);\n        content: " ";\n        height: 0;\n        width: 0;\n        position: absolute;\n        pointer-events: none;\n    }\n    \n    .p-confirm-popup:after {\n        border-width: 8px;\n        margin-left: -8px;\n    }\n    \n    .p-confirm-popup:before {\n        border-width: 10px;\n        margin-left: -10px;\n    }\n    \n    .p-confirm-popup-flipped:after, .p-confirm-popup-flipped:before {\n        bottom: auto;\n        top: 100%;\n    }\n    \n    .p-confirm-popup.p-confirm-popup-flipped:after {\n        border-bottom-color: transparent;\n    }\n    \n    .p-confirm-popup.p-confirm-popup-flipped:before {\n        border-bottom-color: transparent\n    }\n    \n    .p-confirm-popup .p-confirm-popup-content {\n        display: flex;\n        align-items: center;\n    }\n}\n'}}),S=function(e){var t,r,n,o=e.target,c=void 0===o?"document":o,i=e.type,u=e.listener,l=e.options,p=e.when,f=void 0===p||p,m=s.useRef(null),d=s.useRef(null),v=(t=l,r=s.useRef(void 0),s.useEffect((function(){r.current=t})),r.current),b=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};a.ObjectUtils.isNotEmpty(e.target)&&(y(),(e.when||f)&&(m.current=a.DomHandler.getTargetElement(e.target))),!d.current&&m.current&&(d.current=function(e){return u&&u(e)},m.current.addEventListener(i,d.current,l))},y=function(){d.current&&(m.current.removeEventListener(i,d.current,l),d.current=null)};return s.useEffect((function(){f?m.current=a.DomHandler.getTargetElement(c):(y(),m.current=null)}),[c,f]),s.useEffect((function(){!d.current||d.current===u&&v===l||(y(),f&&b())}),[u,l]),n=function(){y()},s.useEffect((function(){return n}),[]),[b,y]},x=function(e,t,r){var n=O(S({type:"keydown",listener:function(e){"Esc"!==e.key&&"Escape"!==e.key||(e.stopImmediatePropagation(),r(e))}}),2),o=n[0],c=n[1];return s.useEffect((function(){if(t&&e.current)return o(),function(){c()}})),[e,r]};function w(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function N(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?w(Object(r),!0).forEach((function(t){var n,o,c;n=e,c=r[t],(o=h(o=t))in n?Object.defineProperty(n,o,{value:c,enumerable:!0,configurable:!0,writable:!0}):n[o]=c})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):w(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var C=s.memo(s.forwardRef((function(e,l){var p=s.useContext(t.PrimeReactContext),d=E.getProps(e,p),v=O(s.useState(d.visible),2),b=v[0],y=v[1],g=O(s.useState(!1),2),j=g[0],P=g[1],h={props:d,state:{visible:b,reshow:j}},S=E.setMetaData(h),w=S.ptm,C=S.cx,I=S.isUnstyled;n.useHandleStyle(E.css.styles,I,{name:"confirmpopup"});var D=s.useRef(null),k=s.useRef(null),R=s.useRef(!1),H=s.useRef(null),U=s.useRef(null),L=s.useRef(null),T=s.useRef(!1),_=function(){return U.current||d},q=function(e){return(U.current||d)[e]},A=function(e){for(var t=arguments.length,r=new Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return a.ObjectUtils.getPropValue(q(e),r)},B=q("acceptLabel")||t.localeOption("accept"),V=q("rejectLabel")||t.localeOption("reject");x(D,d.dismissable&&d.closeOnEscape,(function(e){$("hide")}));var M=O(c.useOverlayListener({target:q("target"),overlay:D,listener:function(e,t){t.valid&&("outside"===t.type?d.dismissable&&!R.current&&$("hide"):$("hide")),R.current=!1},when:b}),2),Z=M[0],z=M[1],J=function(e){R.current=!0,i.OverlayService.emit("overlay-click",{originalEvent:e,target:q("target")})},K=function(){T.current||(T.current=!0,A("accept"),$("accept"))},X=function(){T.current||(T.current=!0,A("reject"),$("reject"))},Y=function(){L.current=document.activeElement,y(!0),P(!1),T.current=!1,H.current=function(e){!te(e.target)&&(R.current=!0)},i.OverlayService.on("overlay-click",H.current)},$=function(e){y(!1),i.OverlayService.off("overlay-click",H.current),H.current=null,e&&A("onHide",e),a.DomHandler.focus(L.current),L.current=null},F=function(){a.ZIndexUtils.set("overlay",D.current,p&&p.autoZIndex||f.default.autoZIndex,p&&p.zIndex.overlay||f.default.zIndex.overlay),a.DomHandler.addStyles(D.current,{position:"absolute",top:"50%",left:"50%",marginTop:"10px"}),ee()},G=function(){Z(),k.current&&k.current.focus(),A("onShow")},Q=function(){z()},W=function(){a.ZIndexUtils.clear(D.current),R.current=!1},ee=function(){if(q("target")){a.DomHandler.absolutePosition(D.current,q("target"));var e=a.DomHandler.getOffset(D.current),t=a.DomHandler.getOffset(q("target")),r=0;e.left<t.left&&(r=t.left-e.left),D.current.style.setProperty("--overlayArrowLeft","".concat(r,"px")),e.top<t.top&&!I()&&a.DomHandler.addClass(D.current,"p-confirm-popup-flipped")}},te=function(e){return D&&D.current&&!(D.current.isSameNode(e)||D.current.contains(e))},re=function(e){if(e.tagKey===d.tagKey){var t=b!==e.visible;q("target")!==e.target&&!d.target?($(),U.current=e,P(!0)):t&&(U.current=e,e.visible?Y():$())}};s.useEffect((function(){d.visible?Y():$()}),[d.visible]),s.useEffect((function(){return d.target||d.message||i.OverlayService.on("confirm-popup",re),function(){i.OverlayService.off("confirm-popup",re)}}),[d.target]),c.useUpdateEffect((function(){j&&Y()}),[j]),c.useUnmountEffect((function(){H.current&&(i.OverlayService.off("overlay-click",H.current),H.current=null),i.OverlayService.off("confirm-popup",re),a.ZIndexUtils.clear(D.current)})),s.useImperativeHandle(l,(function(){return{props:d,confirm:re}}));var ne,oe,ce,ie,ue,ae,le,pe,se,fe,me=function(){var e=a.classNames("p-confirm-popup-accept p-button-sm",q("acceptClassName")),t=a.classNames("p-confirm-popup-reject p-button-sm",{"p-button-text":!q("rejectClassName")},q("rejectClassName")),n=a.mergeProps({className:C("footer")},w("footer")),o=a.mergeProps({label:V,icon:q("rejectIcon"),className:C("rejectButton",{getPropValue:q}),onClick:X,pt:w("rejectButton"),unstyled:d.unstyled,__parentMetadata:{parent:h}}),c=a.mergeProps({ref:k,label:B,icon:q("acceptIcon"),className:C("acceptButton",{getPropValue:q}),onClick:K,pt:w("acceptButton"),unstyled:d.unstyled,__parentMetadata:{parent:h}}),i=s.createElement("div",n,s.createElement(r.Button,o),s.createElement(r.Button,c));if(q("footer")){var u={accept:K,reject:X,className:"p-confirm-popup-footer",acceptClassName:e,rejectClassName:t,acceptLabel:B,rejectLabel:V,element:i,props:_()};return a.ObjectUtils.getJSXElement(q("footer"),u)}return i},de=(ne=_(),oe=a.ObjectUtils.getJSXElement(q("message"),ne),ce=a.mergeProps({className:C("icon")},w("icon")),ie=a.IconUtils.getJSXIcon(q("icon"),N({},ce),{props:ne}),ue=a.mergeProps({className:C("message")},w("message")),ae=a.mergeProps({className:C("content")},w("content")),le=s.createElement("div",ae,ie,s.createElement("span",ue,oe)),pe=me(),se=a.mergeProps({ref:D,id:q("id"),className:C("root",{context:p,getPropValue:q}),style:q("style"),onClick:J},E.getOtherProps(d),w("root")),fe=a.mergeProps({classNames:C("transition"),in:b,timeout:{enter:120,exit:100},options:q("transitionOptions"),unmountOnExit:!0,onEnter:F,onEntered:G,onExit:Q,onExited:W},w("transition")),s.createElement(o.CSSTransition,m({nodeRef:D},fe),s.createElement("div",se,le,pe)));return s.createElement(u.Portal,{element:de,appendTo:q("appendTo"),visible:q("visible")})})));C.displayName="ConfirmPopup",exports.ConfirmPopup=C,exports.confirmPopup=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};(e=N(N({},e),{visible:void 0===e.visible||e.visible})).visible&&i.OverlayService.emit("confirm-popup",e);return{show:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};i.OverlayService.emit("confirm-popup",N(N(N({},e),t),{visible:!0}))},hide:function(){i.OverlayService.emit("confirm-popup",{visible:!1})}}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("primereact/api"),r=require("primereact/button"),n=require("primereact/componentbase"),o=require("primereact/csstransition"),c=require("primereact/hooks"),i=require("primereact/overlayservice"),a=require("primereact/portal"),l=require("primereact/utils");function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}function p(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}var s=p(e),f=u(t);function m(){return m=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e},m.apply(this,arguments)}function d(e){if(Array.isArray(e))return e}function v(e,t){var r=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=r){var n,o,c,i,a=[],l=!0,u=!1;try{if(c=(r=r.call(e)).next,0===t){if(Object(r)!==r)return;l=!1}else for(;!(l=(n=c.call(r)).done)&&(a.push(n.value),a.length!==t);l=!0);}catch(e){u=!0,o=e}finally{try{if(!l&&null!=r.return&&(i=r.return(),Object(i)!==i))return}finally{if(u)throw o}}return a}}function b(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=new Array(t);r<t;r++)n[r]=e[r];return n}function y(e,t){if(e){if("string"==typeof e)return b(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);return"Object"===r&&e.constructor&&(r=e.constructor.name),"Map"===r||"Set"===r?Array.from(e):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?b(e,t):void 0}}function g(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function O(e,t){return d(e)||v(e,t)||y(e,t)||g()}function j(e){return j="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},j(e)}function S(e,t){if("object"!==j(e)||null===e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var n=r.call(e,t||"default");if("object"!==j(n))return n;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}function P(e){var t=S(e,"string");return"symbol"===j(t)?t:String(t)}var h=n.ComponentBase.extend({defaultProps:{__TYPE:"ConfirmPopup",accept:null,acceptClassName:null,acceptIcon:null,acceptLabel:null,appendTo:null,children:void 0,className:null,closeOnEscape:!0,defaultFocus:"accept",dismissable:!0,footer:null,icon:null,message:null,onHide:null,onShow:null,reject:null,rejectClassName:null,rejectIcon:null,rejectLabel:null,style:null,tagKey:void 0,target:null,transitionOptions:null,visible:!1},css:{classes:{root:function(e){var t=e.context;return l.classNames("p-confirm-popup p-component",(0,e.getPropValue)("className"),{"p-input-filled":t&&"filled"===t.inputStyle||"filled"===f.default.inputStyle,"p-ripple-disabled":t&&!1===t.ripple||!1===f.default.ripple})},acceptButton:function(e){return l.classNames("p-confirm-popup-accept p-button-sm",(0,e.getPropValue)("acceptClassName"))},rejectButton:function(e){var t=e.getPropValue;return l.classNames("p-confirm-popup-reject p-button-sm",{"p-button-text":!t("rejectClassName")},t("rejectClassName"))},content:"p-confirm-popup-content",icon:"p-confirm-popup-icon",message:"p-confirm-popup-message",footer:"p-confirm-popup-footer",transition:"p-connected-overlay"},styles:'\n@layer primereact {\n    .p-confirm-popup-flipped {\n        margin-top: 0;\n        margin-bottom: 10px;\n    }\n    \n    .p-confirm-popup:after, .p-confirm-popup:before {\n        bottom: 100%;\n        left: calc(var(--overlayArrowLeft, 0) + 1.25rem);\n        content: " ";\n        height: 0;\n        width: 0;\n        position: absolute;\n        pointer-events: none;\n    }\n    \n    .p-confirm-popup:after {\n        border-width: 8px;\n        margin-left: -8px;\n    }\n    \n    .p-confirm-popup:before {\n        border-width: 10px;\n        margin-left: -10px;\n    }\n    \n    .p-confirm-popup-flipped:after, .p-confirm-popup-flipped:before {\n        bottom: auto;\n        top: 100%;\n    }\n    \n    .p-confirm-popup.p-confirm-popup-flipped:after {\n        border-bottom-color: transparent;\n    }\n    \n    .p-confirm-popup.p-confirm-popup-flipped:before {\n        border-bottom-color: transparent\n    }\n    \n    .p-confirm-popup .p-confirm-popup-content {\n        display: flex;\n        align-items: center;\n    }\n}\n'}});function E(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),r.push.apply(r,n)}return r}function x(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?E(Object(r),!0).forEach((function(t){var n,o,c;n=e,c=r[t],(o=P(o=t))in n?Object.defineProperty(n,o,{value:c,enumerable:!0,configurable:!0,writable:!0}):n[o]=c})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):E(Object(r)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))}))}return e}var N=s.memo(s.forwardRef((function(e,u){var p=s.useContext(t.PrimeReactContext),d=h.getProps(e,p),v=O(s.useState(d.visible),2),b=v[0],y=v[1],g=O(s.useState(!1),2),j=g[0],S=g[1],P={props:d,state:{visible:b,reshow:j}},E=h.setMetaData(P),N=E.ptm,w=E.cx,C=E.isUnstyled;n.useHandleStyle(h.css.styles,C,{name:"confirmpopup"});var I=s.useRef(null),R=s.useRef(null),D=s.useRef(null),U=s.useRef(!1),_=s.useRef(null),k=s.useRef(null),A=s.useRef(null),B=s.useRef(!1),H=function(){return k.current||d},L=function(e){return(k.current||d)[e]},T=function(e){for(var t=arguments.length,r=new Array(t>1?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return l.ObjectUtils.getPropValue(L(e),r)},q=L("acceptLabel")||t.localeOption("accept"),V=L("rejectLabel")||t.localeOption("reject"),M=c.useDisplayOrder("dialog",b);c.useGlobalOnEscapeKey({callback:function(){d.dismissable&&d.closeOnEscape&&F("hide")},when:b,priority:[c.ESC_KEY_HANDLING_PRIORITIES.DIALOG,M]});var J=O(c.useOverlayListener({target:L("target"),overlay:I,listener:function(e,t){t.valid&&("outside"===t.type?d.dismissable&&!U.current&&F("hide"):F("hide")),U.current=!1},when:b}),2),K=J[0],X=J[1],Z=function(){B.current||(B.current=!0,T("accept"),F("accept"))},z=function(){B.current||(B.current=!0,T("reject"),F("reject"))},G=function(){var e=H();S(!1),e.group===d.group&&(y(!0),B.current=!1,_.current=function(e){!$(e.target)&&(U.current=!0)},i.OverlayService.on("overlay-click",_.current),A.current=document.activeElement)},F=function(e){y(!1),i.OverlayService.off("overlay-click",_.current),_.current=null,e&&T("onHide",e),l.DomHandler.focus(A.current),A.current=null},Y=function(){if(L("target")){l.DomHandler.absolutePosition(I.current,L("target"));var e=l.DomHandler.getOffset(I.current),t=l.DomHandler.getOffset(L("target")),r=0;e.left<t.left&&(r=t.left-e.left),I.current.style.setProperty("--overlayArrowLeft","".concat(r,"px")),e.top<t.top&&!C()&&l.DomHandler.addClass(I.current,"p-confirm-popup-flipped")}},$=function(e){return I&&I.current&&!(I.current.isSameNode(e)||I.current.contains(e))},Q=function(e){if(e.tagKey===d.tagKey){var t=b!==e.visible;L("target")!==e.target&&!d.target?(F(),k.current=e,S(!0)):t&&(k.current=e,e.visible?G():F())}};s.useEffect((function(){d.visible?G():F()}),[d.visible]),s.useEffect((function(){return d.target||d.message||i.OverlayService.on("confirm-popup",Q),function(){i.OverlayService.off("confirm-popup",Q)}}),[d.target]),c.useUpdateEffect((function(){j&&G()}),[j]),c.useUnmountEffect((function(){_.current&&(i.OverlayService.off("overlay-click",_.current),_.current=null),i.OverlayService.off("confirm-popup",Q),l.ZIndexUtils.clear(I.current)})),s.useImperativeHandle(u,(function(){return{props:d,confirm:Q}}));var W,ee,te=function(){var e=l.classNames("p-confirm-popup-accept p-button-sm",L("acceptClassName")),t=l.classNames("p-confirm-popup-reject p-button-sm",{"p-button-text":!L("rejectClassName")},L("rejectClassName")),n=l.mergeProps({className:w("footer")},N("footer")),o=l.mergeProps({ref:D,label:V,icon:L("rejectIcon"),className:w("rejectButton",{getPropValue:L}),onClick:z,pt:N("rejectButton"),unstyled:d.unstyled,__parentMetadata:{parent:P}}),c=l.mergeProps({ref:R,label:q,icon:L("acceptIcon"),className:w("acceptButton",{getPropValue:L}),onClick:Z,pt:N("acceptButton"),unstyled:d.unstyled,__parentMetadata:{parent:P}}),i=s.createElement("div",n,s.createElement(r.Button,o),s.createElement(r.Button,c));if(L("footer")){var a={accept:Z,reject:z,className:"p-confirm-popup-footer",acceptClassName:e,rejectClassName:t,acceptLabel:q,rejectLabel:V,element:i,props:H()};return l.ObjectUtils.getJSXElement(L("footer"),a)}return i},re=l.mergeProps({ref:I,id:L("id"),className:w("root",{context:p,getPropValue:L}),style:L("style"),onClick:function(e){U.current=!0,i.OverlayService.emit("overlay-click",{originalEvent:e,target:L("target")})}},h.getOtherProps(d),N("root")),ne=l.mergeProps({classNames:w("transition"),in:b,timeout:{enter:120,exit:100},options:L("transitionOptions"),unmountOnExit:!0,onEnter:function(){l.ZIndexUtils.set("overlay",I.current,p&&p.autoZIndex||f.default.autoZIndex,p&&p.zIndex.overlay||f.default.zIndex.overlay),l.DomHandler.addStyles(I.current,{position:"absolute",top:"50%",left:"50%",marginTop:"10px"}),Y()},onEntered:function(){K();var e=L("defaultFocus");void 0!==e&&"accept"!==e||R.current&&R.current.focus(),"reject"===e&&D.current&&D.current.focus(),T("onShow")},onExit:function(){X()},onExited:function(){l.ZIndexUtils.clear(I.current),U.current=!1}},N("transition")),oe=null!=e&&e.content?(W=H(),ee={message:l.ObjectUtils.getJSXElement(L("message"),W),acceptBtnRef:R,rejectBtnRef:D,hide:F},s.createElement(o.CSSTransition,m({nodeRef:I},ne),s.createElement("div",re,l.ObjectUtils.getJSXElement(e.content,ee)))):function(){var e,t,r,n,c,i,a=(e=H(),t=l.ObjectUtils.getJSXElement(L("message"),e),r=l.mergeProps({className:w("icon")},N("icon")),n=l.IconUtils.getJSXIcon(L("icon"),x({},r),{props:e}),c=l.mergeProps({className:w("message")},N("message")),i=l.mergeProps({className:w("content")},N("content")),s.createElement("div",i,n,s.createElement("span",c,t))),u=te();return s.createElement(o.CSSTransition,m({nodeRef:I},ne),s.createElement("div",re,a,u))}();return s.createElement(a.Portal,{element:oe,appendTo:L("appendTo"),visible:L("visible")})})));N.displayName="ConfirmPopup",exports.ConfirmPopup=N,exports.confirmPopup=function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};(e=x(x({},e),{visible:void 0===e.visible||e.visible})).visible&&i.OverlayService.emit("confirm-popup",e);return{show:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};i.OverlayService.emit("confirm-popup",x(x(x({},e),t),{visible:!0}))},hide:function(){i.OverlayService.emit("confirm-popup",{visible:!1})}}};

package/confirmpopup/confirmpopup.d.ts

@@ -122,6 +122,11 @@ interface ConfirmPopupOptions {
      * @defaultValue No
      */
     rejectLabel: string;
+    /**
+     * Element to receive the focus when the dialog gets visible, valid values are "accept" and "reject".
+     * @defaultValue accept
+     */
+    defaultFocus: string;
     /**
      * Default element created by the component.
      */
@@ -137,6 +142,29 @@ interface ConfirmPopupOptions {
     [key: string]: any;
 }
 
+/**
+ * Defines current content values and refs for headless development.
+ * @see {@link ConfirmPopupProps.content}
+ */
+interface ContentProps {
+    /**
+     * Reference for the accept button. Used to focus the element and execute the action.
+     */
+    acceptBtnRef: React.RefObject<HTMLButtonElement>;
+    /**
+     * Reference for the reject button. Used to focus the element and execute the action.
+     */
+    rejectBtnRef: React.RefObject<HTMLButtonElement>;
+    /**
+     * Message value of confirm popup.
+     */
+    message: React.ReactNode | string;
+    /**
+     * Hide action of confirm popup.
+     */
+    hide(): void;
+}
+
 /**
  * Defines valid properties in ConfirmPopup component.
  * @group Properties
@@ -155,6 +183,11 @@ export interface ConfirmPopupProps {
      * @defaultValue false
      */
     visible?: boolean | undefined;
+    /**
+     * Element to receive the focus when the dialog gets visible, valid values are "accept" and "reject".
+     * @defaultValue accept
+     */
+    defaultFocus?: string | undefined;
     /**
      * Message of the confirmation.
      */
@@ -201,7 +234,7 @@ export interface ConfirmPopupProps {
      * DOM element instance where the overlay panel should be mounted. Valid values are any DOM Element and 'self'. The self value is used to render a component where it is located.
      * @defaultValue document.body
      */
-    appendTo?: 'self' | HTMLElement | undefined | null;
+    appendTo?: 'self' | HTMLElement | undefined | null | (() => HTMLElement);
     /**
      * Enables to hide the popup when outside is clicked.
      * @defaultValue true
@@ -256,6 +289,12 @@ export interface ConfirmPopupProps {
      * @defaultValue false
      */
     unstyled?: boolean;
+    /**
+     * Specifies a custom content for the dialog. For more complex markup, use the "content" slot instead.
+     * @param {ContentProps} props - The values of dialog.
+     * @return {React.ReactNode}
+     */
+    content?: React.ReactNode | ((props: ContentProps) => React.ReactNode);
 }
 
 /**