react-dialogger 1.1.0

package/components/Futures/DialogCloseAction.d.ts

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

package/components/Futures/DialogCloseAction.js

@@ -0,0 +1,54 @@
+"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 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}) => {
+// const DialogCloseAction = ({dialog, newProps}:{dialog: IDialogDef | undefined, newProps?: any}) => {
+var DialogCloseAction = function () {
+    var _a, _b, _c, _d;
+    var dialogHeaderContext = (0, react_1.useContext)(DialogBase_1.DialogHeaderFooterContext);
+    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) {
+            // props.dialog.close()
+            _dialog.close();
+        } },
+        React.createElement(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 }));
+};
+exports.DialogCloseAction = DialogCloseAction;

package/components/Futures/DialogFullscreenAction.d.ts

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

package/components/Futures/DialogFullscreenAction.js

@@ -0,0 +1,60 @@
+"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 FullscreenExitIcon_1 = __importDefault(require("../icons/FullscreenExitIcon"));
+var FullscreenIcon_1 = __importDefault(require("../icons/FullscreenIcon"));
+var react_1 = require("react");
+var DialogBase_1 = require("../DialogBase");
+// const DialogFullscreenAction = ({dialog}:{dialog: React.RefObject<IDialogRef> | undefined}) => {
+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) {
+            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
+            // 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

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const DialogHeaderActionsWrapper: (props: any) => React.JSX.Element;
+export { DialogHeaderActionsWrapper };

package/components/Futures/DialogHeaderActionsWrapper.js

@@ -0,0 +1,11 @@
+"use strict";
+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 DialogHeaderActionsWrapper = function (props) {
+    return (react_1.default.createElement("div", { className: 'header-actions-wrapper' }, props.children));
+};
+exports.DialogHeaderActionsWrapper = DialogHeaderActionsWrapper;

package/components/Futures/DialogProcessing.d.ts

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

package/components/Futures/DialogProcessing.js

@@ -0,0 +1,41 @@
+"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.DialogProcessing = void 0;
+var CircularProgress_1 = __importDefault(require("../CircularProgress"));
+var React = __importStar(require("react"));
+var react_1 = require("react");
+var DialogBase_1 = require("../DialogBase");
+var DialogProcessing = function () {
+    var _a, _b, _c;
+    var dialogHeaderContext = (0, react_1.useContext)(DialogBase_1.DialogHeaderFooterContext);
+    var _dialog = dialogHeaderContext.dialog;
+    console.log('_dialog_isInProcess', _dialog.isInProcess());
+    return React.createElement(CircularProgress_1.default, { size: (_a = _dialog.dialogOptions.progress.size) !== null && _a !== void 0 ? _a : 20, inProcess: _dialog.isInProcess(), color: (_c = (_b = _dialog.dialogOptions.progress) === null || _b === void 0 ? void 0 : _b.color) !== null && _c !== void 0 ? _c : '#399aec' });
+};
+exports.DialogProcessing = DialogProcessing;

package/components/Futures/index.d.ts

@@ -0,0 +1,4 @@
+export { DialogCloseAction } from "./DialogCloseAction";
+export { DialogProcessing } from "./DialogProcessing";
+export { DialogFullscreenAction } from "./DialogFullscreenAction";
+export { DialogHeaderActionsWrapper } from "./DialogHeaderActionsWrapper";

package/components/Futures/index.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DialogHeaderActionsWrapper = exports.DialogFullscreenAction = exports.DialogProcessing = exports.DialogCloseAction = void 0;
+var DialogCloseAction_1 = require("./DialogCloseAction");
+Object.defineProperty(exports, "DialogCloseAction", { enumerable: true, get: function () { return DialogCloseAction_1.DialogCloseAction; } });
+var DialogProcessing_1 = require("./DialogProcessing");
+Object.defineProperty(exports, "DialogProcessing", { enumerable: true, get: function () { return DialogProcessing_1.DialogProcessing; } });
+var DialogFullscreenAction_1 = require("./DialogFullscreenAction");
+Object.defineProperty(exports, "DialogFullscreenAction", { enumerable: true, get: function () { return DialogFullscreenAction_1.DialogFullscreenAction; } });
+var DialogHeaderActionsWrapper_1 = require("./DialogHeaderActionsWrapper");
+Object.defineProperty(exports, "DialogHeaderActionsWrapper", { enumerable: true, get: function () { return DialogHeaderActionsWrapper_1.DialogHeaderActionsWrapper; } });

package/components/RippleButton.d.ts

@@ -0,0 +1,15 @@
+import * as React from "react";
+import { CSSProperties, ReactComponentElement } from "react";
+import { TBVariant, TBColor } from '../types/DialogActionTypes';
+declare const _default: React.ForwardRefExoticComponent<{
+    variant: TBVariant;
+    color: TBColor;
+    children: (buttonRef: HTMLButtonElement) => string | ReactComponentElement<any>;
+    disabled: boolean;
+    onClick: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
+    innerRef: React.RefObject<any>;
+    style?: CSSProperties;
+    baseStyle?: CSSProperties;
+    fontFamily?: string;
+} & React.RefAttributes<HTMLButtonElement>>;
+export default _default;

package/components/RippleButton.js

@@ -0,0 +1,81 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var React = __importStar(require("react"));
+var react_1 = require("react");
+exports.default = React.forwardRef(function (_a, ref) {
+    var variant = _a.variant, color = _a.color, children = _a.children, disabled = _a.disabled, onClick = _a.onClick, style = _a.style, baseStyle = _a.baseStyle, innerRef = _a.innerRef, fontFamily = _a.fontFamily;
+    var _b = React.useState({ x: -1, y: -1 }), coords = _b[0], setCoords = _b[1];
+    var _c = React.useState(false), isRippling = _c[0], setIsRippling = _c[1];
+    // const buttonRef = React.useRef<HTMLButtonElement>(null)
+    React.useEffect(function () {
+        if (coords.x !== -1 && coords.y !== -1) {
+            setIsRippling(true);
+            setTimeout(function () { return setIsRippling(false); }, 300);
+        }
+        else
+            setIsRippling(false);
+    }, [coords]);
+    React.useEffect(function () {
+        if (!isRippling)
+            setCoords({ x: -1, y: -1 });
+    }, [isRippling]);
+    var rippleEffect = function (refButton, x, y) {
+        // const rect = refButton.current.getBoundingClientRect();
+        refButton.current.style.opacity = '.5';
+        setTimeout(function () {
+            refButton.current.style.opacity = '1';
+        }, 150);
+        // setCoords({ x: rect.x + rect.width / 2, y: rect.y + rect.height / 2 });
+        // setCoords({ x: rect.x, y: rect.y });
+    };
+    (0, react_1.useImperativeHandle)(innerRef, function () { return ({
+        rippleEffect: rippleEffect
+    }); });
+    console.log('Ripple_button_style', style);
+    return (React.createElement("button", { 
+        // ref={buttonRef}
+        ref: ref, disabled: disabled, className: "ripple-button ripple-button-".concat(variant, " ripple-button-").concat(color, " ").concat(disabled ? 'ripple-button-disabled' : ''), onClick: function (e) {
+            //@ts-ignore
+            var rect = e.target.getBoundingClientRect();
+            setCoords({ x: e.clientX - rect.left, y: e.clientY - rect.top });
+            setTimeout(function () {
+                onClick && onClick(e);
+            }, 200);
+        }, style: __assign(__assign(__assign({}, baseStyle), style), { fontFamily: fontFamily }) },
+        isRippling && React.createElement("span", { className: "ripple", style: { left: coords.x, top: coords.y } }),
+        React.createElement("span", { className: "content" }, children(ref.current))));
+});

package/components/icons/CloseIcon.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+declare const _default: ({ size, color }: {
+    size?: number;
+    color?: string;
+}) => React.JSX.Element;
+export default _default;

package/components/icons/CloseIcon.js

@@ -0,0 +1,23 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    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 });
+var react_1 = __importDefault(require("react"));
+exports.default = (function (_a) {
+    var size = _a.size, color = _a.color;
+    return react_1.default.createElement("div", { className: 'close-icon', style: __assign({ fill: color }, size ? { width: size } : null) },
+        react_1.default.createElement("svg", { focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24", "data-testid": "CloseIcon" },
+            react_1.default.createElement("path", { d: "M19 6.41 17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" })));
+});

package/components/icons/FullscreenExitIcon.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+declare const _default: ({ size, color }: {
+    size?: number;
+    color?: string;
+}) => React.JSX.Element;
+export default _default;

package/components/icons/FullscreenExitIcon.js

@@ -0,0 +1,23 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    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 });
+var react_1 = __importDefault(require("react"));
+exports.default = (function (_a) {
+    var size = _a.size, color = _a.color;
+    return react_1.default.createElement("div", { className: 'fullscreen-exit-icon', style: __assign({ fill: color }, size ? { width: size } : null) },
+        react_1.default.createElement("svg", { focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24", "data-testid": "FullscreenExitIcon" },
+            react_1.default.createElement("path", { d: "M5 16h3v3h2v-5H5zm3-8H5v2h5V5H8zm6 11h2v-3h3v-2h-5zm2-11V5h-2v5h5V8z" })));
+});

package/components/icons/FullscreenIcon.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+declare const _default: ({ size, color }: {
+    size?: number;
+    color?: string;
+}) => React.JSX.Element;
+export default _default;

package/components/icons/FullscreenIcon.js

@@ -0,0 +1,23 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    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 });
+var react_1 = __importDefault(require("react"));
+exports.default = (function (_a) {
+    var size = _a.size, color = _a.color;
+    return react_1.default.createElement("div", { className: 'fullscreen-icon', style: __assign({ fill: color }, size ? { width: size } : null) },
+        react_1.default.createElement("svg", { focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24", "data-testid": "FullscreenIcon", color: color },
+            react_1.default.createElement("path", { d: "M7 14H5v5h5v-2H7zm-2-4h2V7h3V5H5zm12 7h-3v2h5v-5h-2zM14 5v2h3v3h2V5z" })));
+});

package/components/icons/ResizeIcon.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+declare const _default: ({ size, color }: {
+    size?: number;
+    color?: string;
+}) => React.JSX.Element;
+export default _default;

package/components/icons/ResizeIcon.js

@@ -0,0 +1,14 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+var react_1 = __importDefault(require("react"));
+exports.default = (function (_a) {
+    var size = _a.size, color = _a.color;
+    return react_1.default.createElement("div", { className: 'resizable-handle-icon', style: {
+            fill: color
+        } },
+        react_1.default.createElement("svg", { focusable: "false", "aria-hidden": "true", viewBox: "0 0 24 24", "data-testid": "ArrowBackIosNewIcon" },
+            react_1.default.createElement("path", { d: "M17.77 3.77 16 2 6 12l10 10 1.77-1.77L9.54 12z" })));
+});

package/hooks/useDialogOptions.d.ts

@@ -0,0 +1,3 @@
+import { DialogOptionsType } from "../types/DialogTypes";
+declare const useDialogOptions: (options: DialogOptionsType) => void;
+export { useDialogOptions };

package/hooks/useDialogOptions.js

@@ -0,0 +1,82 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDialogOptions = void 0;
+var initialOptions = {
+    backdrop: {
+        backgroundColor: '#282828',
+        opacity: .6,
+        hideOnClick: false
+    },
+    base: {
+        style: {
+            backgroundColor: "white",
+            boxShadow: '0 0 20px #000000'
+        },
+        closeable: false,
+        initialAnchor: { vertical: "center", horizontal: "center" },
+        draggable: false
+    },
+    progress: {
+        color: 'red',
+        size: 30
+    },
+    snackbar: {
+        anchorOrigin: { vertical: "top", horizontal: "center" },
+        autoHideDuration: 3000,
+        maxSnack: 3,
+        busyMessage: 'Please wait...'
+    },
+    slot: {
+        action: null
+    },
+    slotProps: {
+        action: {}
+    }
+};
+window["dialogOptions"] = initialOptions;
+var useDialogOptions = (function (options) {
+    var _a, _b;
+    var _dialogOptions = window["dialogOptions"];
+    if (options.backdrop) {
+        Object.keys(options.backdrop).forEach(function (objectKey) {
+            _dialogOptions.backdrop[objectKey] = options.backdrop[objectKey];
+        });
+    }
+    if (options.base) {
+        Object.keys(options.base).forEach(function (objectKey) {
+            _dialogOptions.base[objectKey] = options.base[objectKey];
+        });
+    }
+    if (options.progress) {
+        Object.keys(options.progress).forEach(function (objectKey) {
+            _dialogOptions.progress[objectKey] = options.progress[objectKey];
+        });
+    }
+    if (options.snackbar) {
+        Object.keys(options.snackbar).forEach(function (objectKey) {
+            _dialogOptions.snackbar[objectKey] = options.snackbar[objectKey];
+        });
+    }
+    if (options.slot) {
+        Object.keys((_a = options === null || options === void 0 ? void 0 : options.slot) !== null && _a !== void 0 ? _a : {}).forEach(function (objectKey) {
+            _dialogOptions.slot[objectKey] = options.slot[objectKey];
+        });
+    }
+    if (options.slotProps) {
+        console.log('options', options);
+        Object.keys((_b = options === null || options === void 0 ? void 0 : options.slotProps) !== null && _b !== void 0 ? _b : {}).forEach(function (objectKey) {
+            _dialogOptions.slotProps[objectKey] = options.slotProps[objectKey];
+        });
+    }
+    /*const existsEl = document.querySelector('script#ais_react_dialog_options');
+    if(existsEl) return;
+    const scriptElement = document.createElement('script');
+    scriptElement.id = 'ais_react_dialog_options';
+    // Set the script source or include the script content
+    scriptElement.textContent = 'const dialogOptions = ' + JSON.stringify(dialogOptions); // Or set the content: scriptElement.textContent = '...';
+    // Append the script element to the head of the document
+    document.head.appendChild(scriptElement);
+    */
+    window["dialogOptions"] = _dialogOptions;
+});
+exports.useDialogOptions = useDialogOptions;

package/index.d.ts

@@ -0,0 +1,8 @@
+import './styles/dialog.scss';
+import './styles/dialog.action.scss';
+import './styles/circular-progress.scss';
+export { default as Dialog } from "./models/Dialog";
+export { default } from "./models/Dialog";
+export { DialogProcessing, DialogCloseAction, DialogFullscreenAction, DialogHeaderActionsWrapper } from "./components/Futures";
+export { DialogAction, ActionProgress } from "./models/DialogAction";
+export { useDialogOptions } from "./hooks/useDialogOptions";

package/index.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDialogOptions = exports.ActionProgress = exports.DialogAction = exports.DialogHeaderActionsWrapper = exports.DialogFullscreenAction = exports.DialogCloseAction = exports.DialogProcessing = exports.default = exports.Dialog = void 0;
+require("./styles/dialog.css");
+require("./styles/dialog.action.css");
+require("./styles/circular-progress.css");
+// Models
+var Dialog_1 = require("./models/Dialog");
+Object.defineProperty(exports, "Dialog", { enumerable: true, get: function () { return __importDefault(Dialog_1).default; } });
+var Dialog_2 = require("./models/Dialog");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(Dialog_2).default; } });
+var Futures_1 = require("./components/Futures");
+Object.defineProperty(exports, "DialogProcessing", { enumerable: true, get: function () { return Futures_1.DialogProcessing; } });
+Object.defineProperty(exports, "DialogCloseAction", { enumerable: true, get: function () { return Futures_1.DialogCloseAction; } });
+Object.defineProperty(exports, "DialogFullscreenAction", { enumerable: true, get: function () { return Futures_1.DialogFullscreenAction; } });
+Object.defineProperty(exports, "DialogHeaderActionsWrapper", { enumerable: true, get: function () { return Futures_1.DialogHeaderActionsWrapper; } });
+var DialogAction_1 = require("./models/DialogAction");
+Object.defineProperty(exports, "DialogAction", { enumerable: true, get: function () { return DialogAction_1.DialogAction; } });
+Object.defineProperty(exports, "ActionProgress", { enumerable: true, get: function () { return DialogAction_1.ActionProgress; } });
+// Hooks
+var useDialogOptions_1 = require("./hooks/useDialogOptions");
+Object.defineProperty(exports, "useDialogOptions", { enumerable: true, get: function () { return useDialogOptions_1.useDialogOptions; } });

package/models/Dialog.d.ts

@@ -0,0 +1,44 @@
+import * as React from "react";
+import { DialogAction } from "./DialogAction";
+import DialogBase from "../components/DialogBase";
+import { TInitialHolder, TAccessFrom, ComponentOrderPositions, ISnackbarAnchor, DialogValues } from "../types/types";
+import { IDialogSize, TDialogStateListenerCallbackType, DialogOptionsType, IDialogDef, TDialogCallbackNodeFn, TDialogCallbackVoidFn } from "../types/DialogTypes";
+declare class Dialog extends DialogBase {
+    constructor(dialogRef?: React.RefObject<IDialogDef | undefined | null> | null, options?: DialogOptionsType);
+    /**
+     * @deprecated
+     * @see dialogOptions.snackbar.anchorOrigin */
+    snackbarAnchor(anchor?: ISnackbarAnchor): this;
+    set accessFrom(accessFrom: TAccessFrom);
+    get accessFrom(): TAccessFrom;
+    setHeader(header: TDialogCallbackNodeFn): this;
+    setBody(body: TDialogCallbackNodeFn): this;
+    addActions(actions: Array<DialogAction>): this;
+    addAction(action: DialogAction): this;
+    /**
+     * Only from init */
+    stateListener(listener: TDialogStateListenerCallbackType): this;
+    /** @deprecated use Dialog Options */
+    setSize: (size: IDialogSize) => this;
+    /**
+     * @deprecated
+     * @info Dialog ordering after of before Reference Dom Element
+     * This method is deprecated and will be removed in a future release.
+     * Please use an alternative approach for setting dialog ordering or layout.
+     * The dialog ordering functionality will be managed differently in future versions.
+     */
+    setOrder: (position: ComponentOrderPositions, component: HTMLElement) => this;
+    /**
+     * @deprecated
+     * @link initialValues */
+    initialState(state: {
+        [k: string]: any;
+    }): this;
+    initialValues(values: DialogValues): this;
+    initialHolder(holder: TInitialHolder): this;
+    getDom: () => HTMLDivElement;
+    onClose(callback: () => void): this;
+    keyboardListener(listener: (key: string, dialog: IDialogDef) => void): this;
+    show: (callback?: TDialogCallbackVoidFn) => void;
+}
+export default Dialog;