184 lines
9.8 KiB
JavaScript
184 lines
9.8 KiB
JavaScript
|
"use strict";
|
||
|
exports.id = 5472;
|
||
|
exports.ids = [5472];
|
||
|
exports.modules = {
|
||
|
|
||
|
/***/ 5472:
|
||
|
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||
|
|
||
|
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||
|
/* harmony export */ "Mw": () => (/* binding */ openPopup),
|
||
|
/* harmony export */ "ZP": () => (/* binding */ GeneralPopup),
|
||
|
/* harmony export */ "j4": () => (/* binding */ closePopup)
|
||
|
/* harmony export */ });
|
||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(997);
|
||
|
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__);
|
||
|
/* harmony import */ var lucide_react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(2423);
|
||
|
/* harmony import */ var lucide_react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(lucide_react__WEBPACK_IMPORTED_MODULE_1__);
|
||
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(6689);
|
||
|
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_2__);
|
||
|
// @ts-check
|
||
|
/**
|
||
|
* ==============================================================================
|
||
|
* Imports
|
||
|
* ==============================================================================
|
||
|
*/
|
||
|
|
||
|
|
||
|
////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
||
|
* ==============================================================================
|
||
|
* Main Component { Functional }
|
||
|
* ==============================================================================
|
||
|
* @param {Object} props - React component props including { children }
|
||
|
* @param {React.ReactNode} props.children - React children
|
||
|
* @param {string} props.title - Popup title
|
||
|
* @param {Object} [props.data] - data to pass in the "data-data" attribute as JSON
|
||
|
* @param {boolean} [props.fullPage] - If the popup will span the full screen
|
||
|
* @param {string} [props.wrapperClasses] - Popup wrapper additional class names
|
||
|
* @param {() => void} [props.closePopupDispatch] - Function to run when popup is closed
|
||
|
* @param {React.CSSProperties} [props.wrapperStyle] - React styles for the popup wrapper
|
||
|
* @param {boolean} [props.noContainer] - If no container should be provided
|
||
|
*/ function GeneralPopup({ children , title , data , fullPage , wrapperClasses , closePopupDispatch , wrapperStyle , noContainer , }) {
|
||
|
/**
|
||
|
* Get Contexts
|
||
|
*
|
||
|
* @description { React.useContext }
|
||
|
*/ ////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
/**
|
||
|
* Javascript Variables
|
||
|
*
|
||
|
* @description Non hook variables and functions
|
||
|
*/ ////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
/**
|
||
|
* React Hooks
|
||
|
*
|
||
|
* @description { useState, useEffect, useRef, etc ... }
|
||
|
*/ ////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
/**
|
||
|
* Function Return
|
||
|
*
|
||
|
* @description Main Function Return
|
||
|
*/ if (fullPage) {
|
||
|
return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
|
||
|
className: "popup-bg overflow-hidden " + (wrapperClasses ? wrapperClasses : ""),
|
||
|
"data-popupid": title ? title : null,
|
||
|
style: wrapperStyle,
|
||
|
children: [
|
||
|
noContainer ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), {
|
||
|
children: children
|
||
|
}) : /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
|
||
|
className: "relative w-full h-full z-50",
|
||
|
"data-data": data ? JSON.stringify(data) : "",
|
||
|
children: children
|
||
|
}),
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("button", {
|
||
|
className: "popup-cancel-button fixed outlined gray",
|
||
|
onClick: (e)=>{
|
||
|
closePopup();
|
||
|
if (closePopupDispatch) closePopupDispatch();
|
||
|
},
|
||
|
children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx(lucide_react__WEBPACK_IMPORTED_MODULE_1__.X, {
|
||
|
color: "white",
|
||
|
size: 20
|
||
|
})
|
||
|
}),
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
|
||
|
className: "popup-canceller",
|
||
|
onClick: (e)=>{
|
||
|
closePopup();
|
||
|
closePopupDispatch && closePopupDispatch();
|
||
|
}
|
||
|
})
|
||
|
]
|
||
|
});
|
||
|
}
|
||
|
////////////////////////////////////////
|
||
|
return /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
|
||
|
className: "popup-bg",
|
||
|
"data-popupid": title ? title : null,
|
||
|
children: [
|
||
|
noContainer ? /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx((react__WEBPACK_IMPORTED_MODULE_2___default().Fragment), {
|
||
|
children: children
|
||
|
}) : /*#__PURE__*/ (0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsxs)("div", {
|
||
|
className: "popup-content-container minimal-scrollbars",
|
||
|
"data-data": data ? JSON.stringify(data) : "",
|
||
|
children: [
|
||
|
children,
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("button", {
|
||
|
className: "outlined gray popup-cancel-button",
|
||
|
onClick: (e)=>{
|
||
|
closePopup();
|
||
|
closePopupDispatch && closePopupDispatch();
|
||
|
},
|
||
|
children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
|
||
|
className: "font-normal",
|
||
|
children: "✖"
|
||
|
})
|
||
|
})
|
||
|
]
|
||
|
}),
|
||
|
noContainer && /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("button", {
|
||
|
className: "gray popup-cancel-button",
|
||
|
onClick: (e)=>{
|
||
|
closePopup();
|
||
|
closePopupDispatch && closePopupDispatch();
|
||
|
},
|
||
|
children: /*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("span", {
|
||
|
className: "font-normal",
|
||
|
children: "✖"
|
||
|
})
|
||
|
}),
|
||
|
/*#__PURE__*/ react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx("div", {
|
||
|
className: "popup-canceller",
|
||
|
onClick: (e)=>{
|
||
|
closePopup();
|
||
|
closePopupDispatch && closePopupDispatch();
|
||
|
}
|
||
|
})
|
||
|
]
|
||
|
});
|
||
|
////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
////////////////////////////////////////
|
||
|
}
|
||
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
||
|
* ==============================================================================
|
||
|
* Open Popup Function
|
||
|
* ==============================================================================
|
||
|
* @param {string} popupId - popup id
|
||
|
* @param {(popup?: Element) => void} [openPopupDispatch] - Function to run on popup open
|
||
|
*/ function openPopup(popupId, openPopupDispatch) {
|
||
|
let popup = document.querySelector(`[data-popupid='${popupId}']`);
|
||
|
if (popup) {
|
||
|
// @ts-ignore
|
||
|
popup.style.display = "flex";
|
||
|
openPopupDispatch && openPopupDispatch(popup);
|
||
|
}
|
||
|
}
|
||
|
/** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /** ****************************************************************************** */ /**
|
||
|
* ==============================================================================
|
||
|
* Close Popup Function
|
||
|
* ==============================================================================
|
||
|
* @param {() => void} [closePopupDispatch] - Function to run on popup open
|
||
|
*/ function closePopup(closePopupDispatch) {
|
||
|
document.querySelectorAll(`[data-popupid]`).forEach((popup)=>{
|
||
|
// @ts-ignore
|
||
|
popup.style.display = "none";
|
||
|
});
|
||
|
closePopupDispatch && closePopupDispatch();
|
||
|
}
|
||
|
|
||
|
|
||
|
/***/ })
|
||
|
|
||
|
};
|
||
|
;
|