UNPKG

primereact

Version:

PrimeReact is an open source UI library for React featuring a rich set of 90+ components, a theme designer, various theme alternatives such as Material, Bootstrap, Tailwind, premium templates and professional support. In addition, it integrates with Prime

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