react-dialogger 1.1.21 → 1.1.22

package/components/CircularProgress.d.ts

@@ -1,8 +1,7 @@
-import * as React from "react";
 import { IInProcess } from "../types/types";
 declare const _default: ({ size, color, inProcess }: {
     color?: string;
     inProcess: IInProcess;
     size: number;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default _default;

package/components/CircularProgress.js

@@ -34,17 +34,14 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
 var React = __importStar(require("react"));
 exports.default = (function (_a) {
     var size = _a.size, color = _a.color, inProcess = _a.inProcess;
     if (inProcess === null || inProcess === void 0 ? void 0 : inProcess.inProcess) {
-        return React.createElement("div", { style: { display: 'flex', flexDirection: 'row', columnGap: 10, alignItems: 'center' } },
-            React.createElement("span", { className: "circular-root", style: __assign({ display: 'flex', flex: 1, width: size, height: size }, color ? { color: color } : {}), role: "progressbar" },
-                React.createElement("svg", { className: "circular", viewBox: "22 22 44 44" },
-                    React.createElement("circle", { className: "circular-circle", cx: "44", cy: "44", r: "20.2", fill: "none", strokeWidth: "3.6" }))),
-            inProcess.message
-                &&
-                    React.createElement("span", { style: { fontStyle: 'normal', fontSize: 12 } }, inProcess.message));
+        return (0, jsx_runtime_1.jsxs)("div", { style: { display: 'flex', flexDirection: 'row', columnGap: 10, alignItems: 'center' }, children: [(0, jsx_runtime_1.jsx)("span", { className: "circular-root", style: __assign({ display: 'flex', flex: 1, width: size, height: size }, color ? { color: color } : {}), role: "progressbar", children: (0, jsx_runtime_1.jsx)("svg", { className: "circular", viewBox: "22 22 44 44", children: (0, jsx_runtime_1.jsx)("circle", { className: "circular-circle", cx: "44", cy: "44", r: "20.2", fill: "none", strokeWidth: "3.6" }) }) }), inProcess.message
+                    &&
+                        (0, jsx_runtime_1.jsx)("span", { style: { fontStyle: 'normal', fontSize: 12 }, children: inProcess.message })] });
     }
-    return React.createElement(React.Fragment, null);
+    return (0, jsx_runtime_1.jsx)(React.Fragment, {});
 });

package/components/DialogActionBase.d.ts

@@ -1,5 +1,4 @@
 import { Component } from "react";
-import * as React from "react";
 import DialogBase from "./DialogBase";
 import { ActionProps, ActionState, DialogActionType, TBVariant, TBColor, DialogActionOptionsType, TDialogStateListenerForActionCallbackType } from "../types/DialogActionTypes";
 declare class DialogActionBase extends Component<ActionProps, ActionState> {
@@ -39,6 +38,6 @@ declare class DialogActionBase extends Component<ActionProps, ActionState> {
     remove: () => void;
     click: () => void;
     onClickHandler: () => DialogActionType;
-    render: () => React.JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
 }
 export default DialogActionBase;

package/components/DialogActionBase.js

@@ -52,6 +52,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var React = __importStar(require("react"));
 var RippleButton_1 = __importDefault(require("./RippleButton"));
@@ -133,22 +134,20 @@ var DialogActionBase = /** @class */ (function (_super) {
         };
         _this.render = function () {
             console.log('this._options.style.render', _this._options);
-            return React.createElement(RippleButton_1.default, { ref: _this._buttonRef, innerRef: _this._rippleButtonRef, variant: _this._options.variant, color: _this._options.color, disabled: _this._options.disabled, onClick: function (e) {
+            return (0, jsx_runtime_1.jsx)(RippleButton_1.default, { ref: _this._buttonRef, innerRef: _this._rippleButtonRef, variant: _this._options.variant, color: _this._options.color, disabled: _this._options.disabled, onClick: function (e) {
                     if (_this._options.disabled || _this.isInProcess())
                         return;
                     // @ts-ignore
                     _this._onClick(_this, _this._dialogBaseComponent);
-                }, style: _this._options.style, baseStyle: _this.props.baseStyle, fontFamily: _this.props.fontFamily }, function (buttonRef) {
-                if (buttonRef) {
-                    if (!_this.isInProcess()) {
-                        buttonRef.style.minWidth = buttonRef.getBoundingClientRect().width + 'px';
+                }, style: _this._options.style, baseStyle: _this.props.baseStyle, fontFamily: _this.props.fontFamily, children: function (buttonRef) {
+                    if (buttonRef) {
+                        if (!_this.isInProcess()) {
+                            buttonRef.style.minWidth = buttonRef.getBoundingClientRect().width + 'px';
+                        }
                     }
-                }
-                return React.createElement(React.Fragment, null,
-                    React.createElement(CircularProgress_1.default, { size: 15, inProcess: { inProcess: _this.isInProcess() } }),
-                    !_this.isInProcess() &&
-                        _this._options.label);
-            });
+                    return (0, jsx_runtime_1.jsxs)(React.Fragment, { children: [(0, jsx_runtime_1.jsx)(CircularProgress_1.default, { size: 15, inProcess: { inProcess: _this.isInProcess() } }), !_this.isInProcess() &&
+                                _this._options.label] });
+                } });
         };
         _this._options = props.options;
         // this._label = props.label;

package/components/DialogBase.d.ts

@@ -1,5 +1,5 @@
 import { Component, ReactNode, RefObject } from "react";
-import { FormikProps } from "../types/FormikProps";
+import { FormikProps } from "formik";
 import * as React from "react";
 import Dialog from "../models/Dialog";
 import { DialogAction } from "../models/DialogAction";
@@ -99,7 +99,7 @@ declare class DialogBase extends Component<BaseDialogProps, BaseDialogState> {
     close: (callbackFn?: any) => void;
     focus: () => void;
     get actions(): {
-        [key: string]: Pick<DialogActionBase, "remove" | "click" | "options" | "setInProcess" | "setOptions" | "getLabel">;
+        [key: string]: Pick<DialogActionBase, "options" | "setInProcess" | "setOptions" | "getLabel" | "click" | "remove">;
     };
     private orderPositionWithReference;
     /**
@@ -132,6 +132,6 @@ declare class DialogBase extends Component<BaseDialogProps, BaseDialogState> {
     private Actions;
     private Content;
     protected show(callback?: TDialogCallbackVoidFn): void;
-    render: () => React.JSX.Element;
+    render: () => import("react/jsx-runtime").JSX.Element;
 }
 export default DialogBase;

package/components/DialogBase.js

@@ -53,6 +53,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DialogHeaderFooterContext = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var React = __importStar(require("react"));
 var react_draggable_1 = __importDefault(require("react-draggable"));
@@ -65,10 +66,10 @@ var Resizeable_1 = __importDefault(require("../models/Resizeable"));
 var ResizeIcon_1 = __importDefault(require("./icons/ResizeIcon"));
 var Futures_1 = require("./Futures");
 var WithSnackbar = function (props) {
-    return React.createElement(notistack_1.SnackbarProvider, { ref: props.snackbarRef, maxSnack: props.maxSnack }, props.children);
+    return (0, jsx_runtime_1.jsx)(notistack_1.SnackbarProvider, { ref: props.snackbarRef, maxSnack: props.maxSnack, children: props.children });
 };
 var WithHeaderFooterContext = function (props) {
-    return React.createElement(exports.DialogHeaderFooterContext.Provider, { value: __assign({}, props) }, props.children);
+    return (0, jsx_runtime_1.jsx)(exports.DialogHeaderFooterContext.Provider, { value: __assign({}, props), children: props.children });
 };
 var hexToRgb = function (hex, opacity) {
     try {
@@ -313,7 +314,7 @@ var DialogBase = /** @class */ (function (_super) {
             _this.orderPositionWithReference();
             var _a = _this._dialogOptions.backdrop, backgroundColor = _a.backgroundColor, opacity = _a.opacity;
             var bgCl = hexToRgb(backgroundColor, opacity);
-            return React.createElement("div", { className: "dialog-backdrop dialog-backdrop-show", ref: _this._backdropRef, style: {
+            return (0, jsx_runtime_1.jsx)("div", { className: "dialog-backdrop dialog-backdrop-show", ref: _this._backdropRef, style: {
                     justifyContent: _this._dialogOptions.base.initialAnchor.horizontal,
                     // alignItems: dialogOptions.base.initialAnchor.vertical,
                     background: bgCl
@@ -325,7 +326,7 @@ var DialogBase = /** @class */ (function (_super) {
                         return;
                     }
                     _this.baseZoomEffect();
-                } }, _this.Content(body, header, actions));
+                }, children: _this.Content(body, header, actions) });
         };
         _this.switchFullScreen = function () {
             if (!_this.state.fullscreenMode) {
@@ -346,11 +347,11 @@ var DialogBase = /** @class */ (function (_super) {
                 _this._dialogOptions.base.style.backgroundColor : "#FFFFFF";
             var bg = _this._dialogOptions.base.style.background ?
                 _this._dialogOptions.base.style.background : "#FFFFFF";
-            return React.createElement("div", { className: 'dialog-content-placeholder', style: {
+            return (0, jsx_runtime_1.jsx)("div", { className: 'dialog-content-placeholder', style: {
                     backgroundColor: bgColor,
                     background: bg,
                     display: placeholder ? 'flex' : 'none',
-                } }, placeholder);
+                }, children: placeholder });
         };
         _this.Header = function (header) {
             var _a, _b, _c, _d, _e, _f, _g;
@@ -367,42 +368,33 @@ var DialogBase = /** @class */ (function (_super) {
                 headerProps = _this._dialogOptions.slotProps.header(staticProps);
             }
             if (_this._dialogOptions.slot.header) {
-                return React.createElement("div", { onDoubleClick: function (event) {
+                return (0, jsx_runtime_1.jsx)("div", { onDoubleClick: function (event) {
                         if (_this._fullscreen) {
                             _this.switchFullScreen();
                         }
-                    }, style: (_c = (_b = _this._dialogOptions.base) === null || _b === void 0 ? void 0 : _b.header) === null || _c === void 0 ? void 0 : _c.style, className: "dialog-header ".concat(_this._draggable && !_this.state.fullscreenMode ? 'drag-handle' : '') },
-                    React.createElement(WithHeaderFooterContext, __assign({}, staticProps),
-                        React.createElement(CustomHeader, __assign({}, staticProps, headerProps, { dialog: _this }))));
+                    }, style: (_c = (_b = _this._dialogOptions.base) === null || _b === void 0 ? void 0 : _b.header) === null || _c === void 0 ? void 0 : _c.style, className: "dialog-header ".concat(_this._draggable && !_this.state.fullscreenMode ? 'drag-handle' : ''), children: (0, jsx_runtime_1.jsx)(WithHeaderFooterContext, __assign({}, staticProps, { children: (0, jsx_runtime_1.jsx)(CustomHeader, __assign({}, staticProps, headerProps, { dialog: _this })) })) });
             }
             if (header instanceof Function) {
-                return React.createElement("div", { onDoubleClick: function (event) {
+                return (0, jsx_runtime_1.jsxs)("div", { onDoubleClick: function (event) {
                         if (_this._fullscreen) {
                             _this.switchFullScreen();
                         }
-                    }, style: (_e = (_d = _this._dialogOptions.base) === null || _d === void 0 ? void 0 : _d.header) === null || _e === void 0 ? void 0 : _e.style, className: "dialog-header ".concat(_this._draggable && !_this.state.fullscreenMode ? 'drag-handle' : '') },
-                    header(_this),
-                    (_this._closeable || _this._fullscreen) &&
-                        React.createElement(WithHeaderFooterContext, { dialog: _this },
-                            React.createElement(Futures_1.DialogHeaderActionsWrapper, null,
-                                _this._fullscreen &&
-                                    React.createElement(Futures_1.DialogFullscreenAction, null),
-                                _this._closeable &&
-                                    React.createElement(Futures_1.DialogCloseAction, null))));
+                    }, style: (_e = (_d = _this._dialogOptions.base) === null || _d === void 0 ? void 0 : _d.header) === null || _e === void 0 ? void 0 : _e.style, className: "dialog-header ".concat(_this._draggable && !_this.state.fullscreenMode ? 'drag-handle' : ''), children: [header(_this), (_this._closeable || _this._fullscreen) &&
+                            (0, jsx_runtime_1.jsx)(WithHeaderFooterContext, { dialog: _this, children: (0, jsx_runtime_1.jsxs)(Futures_1.DialogHeaderActionsWrapper, { children: [_this._fullscreen &&
+                                            (0, jsx_runtime_1.jsx)(Futures_1.DialogFullscreenAction, {}), _this._closeable &&
+                                            (0, jsx_runtime_1.jsx)(Futures_1.DialogCloseAction, {})] }) })] });
             }
-            return React.createElement("div", { style: (_g = (_f = _this._dialogOptions.base) === null || _f === void 0 ? void 0 : _f.header) === null || _g === void 0 ? void 0 : _g.style, className: 'drag-handle dialog-header' }, header);
+            return (0, jsx_runtime_1.jsx)("div", { style: (_g = (_f = _this._dialogOptions.base) === null || _f === void 0 ? void 0 : _f.header) === null || _g === void 0 ? void 0 : _g.style, className: 'drag-handle dialog-header', children: header });
         };
         _this.Body = function (body) {
             if (body instanceof Function) {
-                return React.createElement("div", { ref: _this._dialogBodyRef, className: 'dialog-body', style: { height: '100%' } },
-                    _this.Placeholder(_this._holder),
-                    body(_this));
+                return (0, jsx_runtime_1.jsxs)("div", { ref: _this._dialogBodyRef, className: 'dialog-body', style: { height: '100%' }, children: [_this.Placeholder(_this._holder), body(_this)] });
             }
-            return React.createElement("div", { style: { height: '100%', padding: 10 } }, _this._holder ?
-                _this.Placeholder(_this._holder)
-                :
-                    //@ts-ignore
-                    body);
+            return (0, jsx_runtime_1.jsx)("div", { style: { height: '100%', padding: 10 }, children: _this._holder ?
+                    _this.Placeholder(_this._holder)
+                    :
+                        //@ts-ignore
+                        body });
         };
         // private Footer = (actions?: DialogAction[]) => {
         //
@@ -449,6 +441,7 @@ var DialogBase = /** @class */ (function (_super) {
         //     </div>
         //
         // };
+        // Bu islem Dialog Base state inden bagimsiz calisir
         _this.Footer = React.forwardRef(function (_a, ref) {
             var _b, _c, _d;
             var actions = _a.actions;
@@ -477,43 +470,38 @@ var DialogBase = /** @class */ (function (_super) {
                 });
             }
             console.log('FooterSlot_props_Y', footerProps, staticProps, 'V6 ya hazirlik -2');
-            return React.createElement("div", { className: 'dialog-footer', style: (_d = (_c = _this._dialogOptions.base) === null || _c === void 0 ? void 0 : _c.footer) === null || _d === void 0 ? void 0 : _d.style },
-                React.createElement("div", null,
-                    React.createElement(WithHeaderFooterContext, __assign({}, staticProps, { dialog: _this }), _this._dialogOptions.slot.footer ?
-                        /*<CustomFooter inProcess={this._inProcess} dialogValues={this.state.values} dialogOptions={this._dialogOptions}  />*/
-                        React.createElement(CustomFooter, __assign({}, staticProps, footerProps))
-                        :
-                            React.createElement(Futures_1.DialogProcessing, null)
-                    /*<CircularProgress size={20} inProcess={this._inProcess} color={this._dialogOptions.progress.color}/>*/
-                    )),
-                _this.Actions(actions));
+            return (0, jsx_runtime_1.jsxs)("div", { className: 'dialog-footer', style: (_d = (_c = _this._dialogOptions.base) === null || _c === void 0 ? void 0 : _c.footer) === null || _d === void 0 ? void 0 : _d.style, children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(WithHeaderFooterContext, __assign({}, staticProps, { dialog: _this, children: _this._dialogOptions.slot.footer ?
+                                /*<CustomFooter inProcess={this._inProcess} dialogValues={this.state.values} dialogOptions={this._dialogOptions}  />*/
+                                (0, jsx_runtime_1.jsx)(CustomFooter, __assign({}, staticProps, footerProps))
+                                :
+                                    (0, jsx_runtime_1.jsx)(Futures_1.DialogProcessing, {}) })) }), _this.Actions(actions)] });
         });
         _this.Actions = function (actions) {
-            return React.createElement("div", { style: { position: 'relative', display: 'flex', flexDirection: 'row', columnGap: 10, alignItems: 'center' } }, actions.map(function (action, index) {
-                // const ref = this.slotActionsRef[index];
-                // const ActionSlot = this._dialogOptions?.slot?.action;
-                // // console.log('ActionSlot',ActionSlot);
-                // if (ActionSlot) {
-                //     return <ActionSlot
-                //         ref={ref}
-                //         key={index.toString()}
-                //         {...this._dialogOptions?.slotProps?.action}
-                //         onClick={ (event: React.MouseEvent) => {
-                //             action._onClickSlot( ref, this );
-                //         }}
-                //         label={action.options.label}
-                //         style={{...this._dialogOptions.slotProps?.action?.style, ...action.options.style }}
-                //     />
-                //
-                // }
-                var referencedAction = _this.initializeActionRef(action.name);
-                // this._actions[action.name] = referencedAction.current
-                return React.createElement(DialogActionBase_1.default, { name: action.name, ref: referencedAction, key: index.toString(), dialogBaseComponent: _this, options: action.options, onClick: action.onClickHandler(), inProcess: action.isInProcess(), 
-                    // onLoad={ dialogAction => {
-                    //     action.baseDialogAction = dialogAction;
-                    // }}
-                    style: action.options.style, baseStyle: _this._dialogOptions.base.actions.baseStyle, fontFamily: _this._fontFamily, stateListener: action._stateListener });
-            }));
+            return (0, jsx_runtime_1.jsx)("div", { style: { position: 'relative', display: 'flex', flexDirection: 'row', columnGap: 10, alignItems: 'center' }, children: actions.map(function (action, index) {
+                    // const ref = this.slotActionsRef[index];
+                    // const ActionSlot = this._dialogOptions?.slot?.action;
+                    // // console.log('ActionSlot',ActionSlot);
+                    // if (ActionSlot) {
+                    //     return <ActionSlot
+                    //         ref={ref}
+                    //         key={index.toString()}
+                    //         {...this._dialogOptions?.slotProps?.action}
+                    //         onClick={ (event: React.MouseEvent) => {
+                    //             action._onClickSlot( ref, this );
+                    //         }}
+                    //         label={action.options.label}
+                    //         style={{...this._dialogOptions.slotProps?.action?.style, ...action.options.style }}
+                    //     />
+                    //
+                    // }
+                    var referencedAction = _this.initializeActionRef(action.name);
+                    // this._actions[action.name] = referencedAction.current
+                    return (0, jsx_runtime_1.jsx)(DialogActionBase_1.default, { name: action.name, ref: referencedAction, dialogBaseComponent: _this, options: action.options, onClick: action.onClickHandler(), inProcess: action.isInProcess(), 
+                        // onLoad={ dialogAction => {
+                        //     action.baseDialogAction = dialogAction;
+                        // }}
+                        style: action.options.style, baseStyle: _this._dialogOptions.base.actions.baseStyle, fontFamily: _this._fontFamily, stateListener: action._stateListener }, index.toString());
+                }) });
         };
         _this.Content = function (body, header, actions) {
             var _a;
@@ -533,11 +521,10 @@ var DialogBase = /** @class */ (function (_super) {
             console.log('Content:', actions);
             var xKey = _this.dialogPosFromMultipleDialogs.isMultiple ? "left" : "marginLeft";
             var yKey = _this.dialogPosFromMultipleDialogs.isMultiple ? "top" : "marginTop";
-            return React.createElement(react_draggable_1.default, { disabled: !_this._draggable || _this.state.fullscreenMode, axis: 'both', handle: _this._draggable ? '.drag-handle' : '', scale: 1, ref: _this._backdropRef, onDrag: function (event, data) {
+            return (0, jsx_runtime_1.jsx)(react_draggable_1.default, { disabled: !_this._draggable || _this.state.fullscreenMode, axis: 'both', handle: _this._draggable ? '.drag-handle' : '', scale: 1, ref: _this._backdropRef, onDrag: function (event, data) {
                     event.stopPropagation();
                     _this._dialogTranslate = { lastX: data.lastX, lastY: data.lastY };
-                } },
-                React.createElement("div", { id: "dialog-main", ref: _this._dialogRef, onClick: function (e) {
+                }, children: (0, jsx_runtime_1.jsxs)("div", { id: "dialog-main", ref: _this._dialogRef, onClick: function (e) {
                         e.stopPropagation();
                     }, onKeyDown: function (e) {
                         if (typeof _this.props.keyboardListener === "function") {
@@ -546,15 +533,8 @@ var DialogBase = /** @class */ (function (_super) {
                         }
                     }, 
                     // className={this._dialogSize.width === 'auto' ? 'auto' : `dialog-width-${this._dialogSize.width} dialog-main show-opacity show-position-${this._dialogOptions.base.initialAnchor.vertical}`}
-                    className: _this._dialogOptions.base.size.width === 'auto' ? 'auto' : "dialog-width-".concat(_this._dialogOptions.base.size.width, " dialog-main show-opacity show-position-").concat(_this._dialogOptions.base.initialAnchor.vertical), style: __assign(__assign(__assign(__assign({ alignSelf: _this._dialogOptions.base.initialAnchor.vertical, height: (_b = _this._dialogOptions.base.size.height) !== null && _b !== void 0 ? _b : 'auto' }, typeof _this._dialogOptions.base.size.width === "number" ? { width: _this._dialogOptions.base.size.width } : null), (_a = { outline: 'none' }, _a[yKey] = _this.dialogPosFromMultipleDialogs.top + 'px', _a[xKey] = _this.dialogPosFromMultipleDialogs.left + 'px', _a)), _this._dialogOptions.base.style), { fontFamily: _this._fontFamily }) },
-                    React.createElement(WithSnackbar, { snackbarRef: _this._snackbarRef, maxSnack: _this._dialogOptions.snackbar.maxSnack },
-                        (_this._header || _this._dialogOptions.slot.header) && _this.Header(header),
-                        _this.Body(body),
-                        React.createElement(_this.Footer, { ref: _this._footeRef, actions: actions })),
-                    (_this._dialogOptions.base.resizeable) &&
-                        React.createElement(React.Fragment, null,
-                            React.createElement("div", { className: "resizable-handle", onMouseDown: (_c = _this._Resizeable) === null || _c === void 0 ? void 0 : _c.resizeHandleMouseDown },
-                                React.createElement(ResizeIcon_1.default, { color: '#286e94' })))));
+                    className: _this._dialogOptions.base.size.width === 'auto' ? 'auto' : "dialog-width-".concat(_this._dialogOptions.base.size.width, " dialog-main show-opacity show-position-").concat(_this._dialogOptions.base.initialAnchor.vertical), style: __assign(__assign(__assign(__assign({ alignSelf: _this._dialogOptions.base.initialAnchor.vertical, height: (_b = _this._dialogOptions.base.size.height) !== null && _b !== void 0 ? _b : 'auto' }, typeof _this._dialogOptions.base.size.width === "number" ? { width: _this._dialogOptions.base.size.width } : null), (_a = { outline: 'none' }, _a[yKey] = _this.dialogPosFromMultipleDialogs.top + 'px', _a[xKey] = _this.dialogPosFromMultipleDialogs.left + 'px', _a)), _this._dialogOptions.base.style), { fontFamily: _this._fontFamily }), children: [(0, jsx_runtime_1.jsxs)(WithSnackbar, { snackbarRef: _this._snackbarRef, maxSnack: _this._dialogOptions.snackbar.maxSnack, children: [(_this._header || _this._dialogOptions.slot.header) && _this.Header(header), _this.Body(body), (0, jsx_runtime_1.jsx)(_this.Footer, { ref: _this._footeRef, actions: actions })] }), (_this._dialogOptions.base.resizeable) &&
+                            (0, jsx_runtime_1.jsx)(React.Fragment, { children: (0, jsx_runtime_1.jsx)("div", { className: "resizable-handle", onMouseDown: (_c = _this._Resizeable) === null || _c === void 0 ? void 0 : _c.resizeHandleMouseDown, children: (0, jsx_runtime_1.jsx)(ResizeIcon_1.default, { color: '#286e94' }) }) })] }) });
         };
         _this.render = function () {
             return _this.withBackdrop(_this._body, _this._header, _this._actions);

package/components/Futures/DialogCloseAction.d.ts

@@ -1,3 +1,2 @@
-import * as React from "react";
-declare const DialogCloseAction: () => React.JSX.Element;
+declare const DialogCloseAction: () => import("react/jsx-runtime").JSX.Element;
 export { DialogCloseAction };

package/components/Futures/DialogCloseAction.js

@@ -1,34 +1,11 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DialogCloseAction = void 0;
+var jsx_runtime_1 = require("react/jsx-runtime");
 var CloseIcon_1 = __importDefault(require("../icons/CloseIcon"));
-var React = __importStar(require("react"));
 var react_1 = require("react");
 var DialogBase_1 = require("../DialogBase");
 // const DialogCloseAction = ({dialog}:{dialog: React.RefObject<IDialogRef> | undefined}) => {
@@ -39,16 +16,15 @@ var DialogCloseAction = function () {
     var _dialog = dialogHeaderContext.dialog;
     // console.log('DialogCloseAction_props', dialogHeaderContext);
     // return <div className={'close-icon-wrapper'} onClick={event => apiRef.current.close()} >
-    return React.createElement("div", { className: 'close-icon-wrapper', onClick: function (event) {
+    return (0, jsx_runtime_1.jsx)("div", { className: 'close-icon-wrapper', onClick: function (event) {
             // props.dialog.close()
             _dialog.close();
-        } },
-        React.createElement(CloseIcon_1.default
+        }, children: (0, jsx_runtime_1.jsx)(CloseIcon_1.default
         // size={apiRef.current.dialogOptions.base.headerControllerIcons?.size ?? 24 }
         // color={apiRef.current.dialogOptions.base.headerControllerIcons?.color ?? null }
         , { 
             // size={apiRef.current.dialogOptions.base.headerControllerIcons?.size ?? 24 }
             // color={apiRef.current.dialogOptions.base.headerControllerIcons?.color ?? null }
-            size: (_b = (_a = _dialog.dialogOptions.base.headerControllerIcons) === null || _a === void 0 ? void 0 : _a.size) !== null && _b !== void 0 ? _b : 24, color: (_d = (_c = _dialog.dialogOptions.base.headerControllerIcons) === null || _c === void 0 ? void 0 : _c.color) !== null && _d !== void 0 ? _d : null }));
+            size: (_b = (_a = _dialog.dialogOptions.base.headerControllerIcons) === null || _a === void 0 ? void 0 : _a.size) !== null && _b !== void 0 ? _b : 24, color: (_d = (_c = _dialog.dialogOptions.base.headerControllerIcons) === null || _c === void 0 ? void 0 : _c.color) !== null && _d !== void 0 ? _d : null }) });
 };
 exports.DialogCloseAction = DialogCloseAction;

package/components/Futures/DialogFullscreenAction.d.ts

@@ -1,3 +1,2 @@
-import * as React from "react";
-declare const DialogFullscreenAction: () => React.JSX.Element;
+declare const DialogFullscreenAction: () => import("react/jsx-runtime").JSX.Element;
 export { DialogFullscreenAction };

package/components/Futures/DialogFullscreenAction.js

@@ -1,33 +1,10 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DialogFullscreenAction = void 0;
-var React = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var FullscreenExitIcon_1 = __importDefault(require("../icons/FullscreenExitIcon"));
 var FullscreenIcon_1 = __importDefault(require("../icons/FullscreenIcon"));
 var react_1 = require("react");
@@ -37,24 +14,24 @@ var DialogFullscreenAction = function () {
     var _a, _b, _c, _d, _e, _f, _g, _h;
     var dialogHeaderContext = (0, react_1.useContext)(DialogBase_1.DialogHeaderFooterContext);
     var _dialog = dialogHeaderContext.dialog;
-    return React.createElement("div", { className: 'fullscreen-icon-wrapper', onClick: function (event) {
+    return (0, jsx_runtime_1.jsx)("div", { className: 'fullscreen-icon-wrapper', onClick: function (event) {
             event.stopPropagation();
             _dialog.switchFullScreen();
-        } }, _dialog.state.fullscreenMode ?
-        React.createElement(FullscreenExitIcon_1.default
-        // size={apiRef.current.dialogOptions.base.headerControllerIcons?.size ?? 24 }
-        // color={apiRef.current.dialogOptions.base.headerControllerIcons?.color ?? null }
-        , { 
-            // size={apiRef.current.dialogOptions.base.headerControllerIcons?.size ?? 24 }
-            // color={apiRef.current.dialogOptions.base.headerControllerIcons?.color ?? null }
-            size: (_b = (_a = _dialog.dialogOptions.base.headerControllerIcons) === null || _a === void 0 ? void 0 : _a.size) !== null && _b !== void 0 ? _b : 24, color: (_d = (_c = _dialog.dialogOptions.base.headerControllerIcons) === null || _c === void 0 ? void 0 : _c.color) !== null && _d !== void 0 ? _d : null })
-        :
-            React.createElement(FullscreenIcon_1.default
+        }, children: _dialog.state.fullscreenMode ?
+            (0, jsx_runtime_1.jsx)(FullscreenExitIcon_1.default
             // size={apiRef.current.dialogOptions.base.headerControllerIcons?.size ?? 24 }
             // color={apiRef.current.dialogOptions.base.headerControllerIcons?.color ?? null }
             , { 
                 // size={apiRef.current.dialogOptions.base.headerControllerIcons?.size ?? 24 }
                 // color={apiRef.current.dialogOptions.base.headerControllerIcons?.color ?? null }
-                size: (_f = (_e = _dialog.dialogOptions.base.headerControllerIcons) === null || _e === void 0 ? void 0 : _e.size) !== null && _f !== void 0 ? _f : 24, color: (_h = (_g = _dialog.dialogOptions.base.headerControllerIcons) === null || _g === void 0 ? void 0 : _g.color) !== null && _h !== void 0 ? _h : null }));
+                size: (_b = (_a = _dialog.dialogOptions.base.headerControllerIcons) === null || _a === void 0 ? void 0 : _a.size) !== null && _b !== void 0 ? _b : 24, color: (_d = (_c = _dialog.dialogOptions.base.headerControllerIcons) === null || _c === void 0 ? void 0 : _c.color) !== null && _d !== void 0 ? _d : null })
+            :
+                (0, jsx_runtime_1.jsx)(FullscreenIcon_1.default
+                // size={apiRef.current.dialogOptions.base.headerControllerIcons?.size ?? 24 }
+                // color={apiRef.current.dialogOptions.base.headerControllerIcons?.color ?? null }
+                , { 
+                    // size={apiRef.current.dialogOptions.base.headerControllerIcons?.size ?? 24 }
+                    // color={apiRef.current.dialogOptions.base.headerControllerIcons?.color ?? null }
+                    size: (_f = (_e = _dialog.dialogOptions.base.headerControllerIcons) === null || _e === void 0 ? void 0 : _e.size) !== null && _f !== void 0 ? _f : 24, color: (_h = (_g = _dialog.dialogOptions.base.headerControllerIcons) === null || _g === void 0 ? void 0 : _g.color) !== null && _h !== void 0 ? _h : null }) });
 };
 exports.DialogFullscreenAction = DialogFullscreenAction;

package/components/Futures/DialogHeaderActionsWrapper.d.ts

@@ -3,5 +3,5 @@ interface IProps {
     gap?: number;
     children?: React.ReactNode;
 }
-declare const DialogHeaderActionsWrapper: (props: IProps) => React.JSX.Element;
+declare const DialogHeaderActionsWrapper: (props: IProps) => import("react/jsx-runtime").JSX.Element;
 export { DialogHeaderActionsWrapper };

package/components/Futures/DialogHeaderActionsWrapper.js

@@ -10,14 +10,11 @@ var __assign = (this && this.__assign) || function () {
     };
     return __assign.apply(this, arguments);
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DialogHeaderActionsWrapper = void 0;
-var react_1 = __importDefault(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var DialogHeaderActionsWrapper = function (props) {
     var _a;
-    return (react_1.default.createElement("div", __assign({}, props, { className: 'header-actions-wrapper', style: { columnGap: "".concat((_a = props.gap) !== null && _a !== void 0 ? _a : 10, "px") } }), props.children));
+    return ((0, jsx_runtime_1.jsx)("div", __assign({}, props, { className: 'header-actions-wrapper', style: { columnGap: "".concat((_a = props.gap) !== null && _a !== void 0 ? _a : 10, "px") }, children: props.children })));
 };
 exports.DialogHeaderActionsWrapper = DialogHeaderActionsWrapper;

package/components/Futures/DialogInfoAction.d.ts

@@ -1,3 +1,2 @@
-import * as React from "react";
-declare const DialogInfoAction: () => React.JSX.Element;
+declare const DialogInfoAction: () => import("react/jsx-runtime").JSX.Element;
 export { DialogInfoAction };

package/components/Futures/DialogInfoAction.js

@@ -27,7 +27,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.DialogInfoAction = void 0;
-var React = __importStar(require("react"));
+var jsx_runtime_1 = require("react/jsx-runtime");
 var react_1 = require("react");
 var DialogBase_1 = require("../DialogBase");
 var InfoIcon_1 = __importDefault(require("../icons/InfoIcon"));
@@ -39,7 +39,7 @@ var DialogInfoAction = function () {
     var _a, _b, _c, _d;
     var dialogHeaderContext = (0, react_1.useContext)(DialogBase_1.DialogHeaderFooterContext);
     var _dialog = dialogHeaderContext.dialog;
-    return React.createElement("div", { className: 'info-icon-wrapper', onClick: function (event) {
+    return (0, jsx_runtime_1.jsx)("div", { className: 'info-icon-wrapper', onClick: function (event) {
             var closeAction = new __1.DialogAction('closeAction', {
                 label: 'Close',
                 variant: 'text',
@@ -72,23 +72,12 @@ var DialogInfoAction = function () {
             });
             dialog
                 .setHeader(function (dialog1) { return 'Info'; })
-                .setBody(function (dialog1) { return React.createElement("table", null,
-                React.createElement("tbody", null,
-                    React.createElement("tr", null,
-                        React.createElement("td", null, "Name"),
-                        React.createElement("td", null, package_json_1.default.name)),
-                    React.createElement("tr", null,
-                        React.createElement("td", null, "Varsion"),
-                        React.createElement("td", null, package_json_1.default.version)),
-                    React.createElement("tr", null,
-                        React.createElement("td", null, "Author"),
-                        React.createElement("td", null, package_json_1.default.author)))); })
+                .setBody(function (dialog1) { return (0, jsx_runtime_1.jsx)("table", { children: (0, jsx_runtime_1.jsxs)("tbody", { children: [(0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("td", { children: "Name" }), (0, jsx_runtime_1.jsx)("td", { children: package_json_1.default.name })] }), (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("td", { children: "Varsion" }), (0, jsx_runtime_1.jsx)("td", { children: package_json_1.default.version })] }), (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("td", { children: "Author" }), (0, jsx_runtime_1.jsx)("td", { children: package_json_1.default.author })] })] }) }); })
                 .addActions([
                 closeAction
             ])
                 .initialState({})
                 .show();
-        } },
-        React.createElement(InfoIcon_1.default, { size: (_b = (_a = _dialog.dialogOptions.base.headerControllerIcons) === null || _a === void 0 ? void 0 : _a.size) !== null && _b !== void 0 ? _b : 24, color: (_d = (_c = _dialog.dialogOptions.base.headerControllerIcons) === null || _c === void 0 ? void 0 : _c.color) !== null && _d !== void 0 ? _d : null }));
+        }, children: (0, jsx_runtime_1.jsx)(InfoIcon_1.default, { size: (_b = (_a = _dialog.dialogOptions.base.headerControllerIcons) === null || _a === void 0 ? void 0 : _a.size) !== null && _b !== void 0 ? _b : 24, color: (_d = (_c = _dialog.dialogOptions.base.headerControllerIcons) === null || _c === void 0 ? void 0 : _c.color) !== null && _d !== void 0 ? _d : null }) });
 };
 exports.DialogInfoAction = DialogInfoAction;

package/components/Futures/DialogProcessing.d.ts

@@ -1,3 +1,2 @@
-import * as React from "react";
-declare const DialogProcessing: () => React.JSX.Element;
+declare const DialogProcessing: () => import("react/jsx-runtime").JSX.Element;
 export { DialogProcessing };