@adaptabletools/adaptable-cjs
Version:
Powerful data-agnostic HTML5 AG Grid extension which provides advanced, cutting-edge functionality to meet all DataGrid requirements
71 lines (70 loc) • 3.93 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.AdaptablePopupDialog = void 0;
const tslib_1 = require("tslib");
const React = tslib_1.__importStar(require("react"));
const react_dom_1 = require("react-dom");
const react_redux_1 = require("react-redux");
const Dialog_1 = tslib_1.__importDefault(require("../../../../components/Dialog"));
const InternalRedux_1 = require("../../../../Redux/ActionsReducers/InternalRedux");
const AdaptableContext_1 = require("../../../AdaptableContext");
const Utilities_1 = require("../Utilities");
const WindowDialog = (props) => {
const { onChange, style, baseClassName, className, isActionModule, settingsPanelOptionsKey, onHide, ...dialogProps } = props;
const adaptable = (0, AdaptableContext_1.useAdaptable)();
const dispatch = (0, react_redux_1.useDispatch)();
const settingsPanelOptions = adaptable.adaptableOptions.settingsPanelOptions;
let popupSettings = (0, react_redux_1.useSelector)((state) => state?.Internal?.SettingsPanel?.[settingsPanelOptionsKey]);
const handleWindowSettings = (settings) => {
dispatch((0, InternalRedux_1.SettingsPanelSet)(settingsPanelOptionsKey, settings));
};
if (!popupSettings) {
const size = isActionModule
? (0, Utilities_1.getActionPanelSize)()
: settingsPanelOptions.size ?? (0, Utilities_1.getSettingsPanelSize)();
popupSettings = {
size: size,
position: settingsPanelOptions.position ?? (0, Utilities_1.getMiddlePosition)(size),
};
}
const windowModalProps = {
handleSelector: isActionModule
? `.${baseClassName} .ab-Panel__header`
: '.ab-Adaptable-Popup__TopBar',
minHeight: 460,
minWidth: 400,
size: popupSettings.size,
position: popupSettings.position,
onChange: handleWindowSettings,
};
return (React.createElement(Dialog_1.default, { windowModal: true, fixed: false, windowModalProps: windowModalProps, style: { ...props.style, height: '100%' }, padding: 0, className: className, onDismiss: onHide, isOpen: true, showCloseButton: true, ...dialogProps }));
};
const PopupDialog = (props) => {
const { style, className, onHide, children, ...dialogProps } = props;
return (React.createElement(Dialog_1.default, { fixed: false, style: props.style, padding: 0, height: '90vh', width: '90vw', className: className, onDismiss: onHide, isOpen: true, showCloseButton: true, ...dialogProps }, children));
};
const AdaptablePopupDialog = (props) => {
const { isActionModule, style, friendlyName, baseClassName, className, children, onHide, isWindowModal, modalContainer, } = props;
if (modalContainer) {
let ref = null;
if (typeof modalContainer === 'string') {
ref = globalThis.document.querySelector(modalContainer);
}
else {
ref = modalContainer;
}
return (0, react_dom_1.createPortal)(React.createElement(Dialog_1.default, { "data-name": props.dataName, modal: false, fixed: false, onDismiss: onHide, className: className }, children), ref);
}
if (isWindowModal) {
const settingsPanelOptionsKey = isActionModule ? `action-${friendlyName}` : 'settings';
return (React.createElement(WindowDialog, { dataName: props.dataName, settingsPanelOptionsKey: settingsPanelOptionsKey, isActionModule: isActionModule, onHide: onHide, style: style, baseClassName: baseClassName, className: className }, children));
}
else {
const modalStyle = {
...style,
...(isActionModule ? { maxWidth: 800, maxHeight: 600 } : { maxWidth: 1200, maxHeight: 1000 }),
};
return (React.createElement(PopupDialog, { "data-name": props.dataName, onHide: onHide, style: modalStyle, className: className }, children));
}
};
exports.AdaptablePopupDialog = AdaptablePopupDialog;