dry-ux 1.51.0 → 1.53.0

package/dist/dajaxice/DajaxiceProxy.test.d.ts

@@ -1,6 +1,6 @@
 import { DajaxiceFn } from "./Proxy.interface";
 export declare const modules: DajaxiceModules;
-export type DajaxiceModules = {
+export declare type DajaxiceModules = {
     employee?: {
         getDetails: DajaxiceFn<{
             id: number;

package/dist/dajaxice/Proxy.interface.d.ts

@@ -1,4 +1,4 @@
-export type Args<T = void> = {
+export declare type Args<T = void> = {
     args: T;
     /**
      * If true, it will show a loader when a Dajaxice function is called. Defaults to false.
@@ -27,9 +27,9 @@ export type Args<T = void> = {
         loader?: boolean;
     };
 };
-type ArgType<T> = T extends void ? Omit<Args, "args"> | void : Args<T>;
+declare type ArgType<T> = T extends void ? Omit<Args, "args"> | void : Args<T>;
 export declare type DajaxiceFn<TArgs = void> = <TResult = any>(args: ArgType<TArgs>) => Promise<TResult>;
-export type MethodArgs = Partial<Args<any>>;
+export declare type MethodArgs = Partial<Args<any>>;
 export interface IDajaxiceProxy<TModule> {
     modules: TModule;
     authCheck?: {

package/dist/error/ErrorBoundary.d.ts

@@ -15,7 +15,7 @@ export declare class ErrorBoundary extends React.PureComponent<IErrorBoundaryPro
         error: Error;
     };
     componentDidCatch(error: Error, info: React.ErrorInfo): void;
-    render: () => React.JSX.Element;
+    render: () => JSX.Element & React.ReactNode;
     private handleError;
     private resetError;
 }

package/dist/error/ErrorScreen.d.ts

@@ -1,2 +1,2 @@
 import * as React from "react";
-export declare const ErrorScreen: React.MemoExoticComponent<() => React.JSX.Element>;
+export declare const ErrorScreen: React.MemoExoticComponent<() => JSX.Element>;

package/dist/helpers/flat.d.ts

@@ -1,4 +1,4 @@
-type FlattenOptions = {
+declare type FlattenOptions = {
     delimiter?: string;
     maxDepth?: number;
     transformKey?: (key: any) => any;
@@ -12,7 +12,7 @@ type FlattenOptions = {
 export declare function flatten(target: any, opts?: FlattenOptions): {
     [key: string]: any;
 };
-type UnflattenOptions = Pick<FlattenOptions, "delimiter" | "transformKey"> & {
+declare type UnflattenOptions = Pick<FlattenOptions, "delimiter" | "transformKey"> & {
     overwrite?: boolean;
     object?: boolean;
 };

package/dist/helpers/flat.js

@@ -1,7 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.flatten = flatten;
-exports.unflatten = unflatten;
+exports.unflatten = exports.flatten = void 0;
 function isBuffer(obj) {
     return obj && obj.constructor && typeof obj.constructor.isBuffer === "function" && obj.constructor.isBuffer(obj);
 }
@@ -41,6 +40,7 @@ function flatten(target, opts) {
     step(target, null, null);
     return output;
 }
+exports.flatten = flatten;
 /**
  * Unflattens an object with the paths for keys.
  * @param target The object to unflatten.
@@ -122,3 +122,4 @@ function unflatten(target, opts) {
     });
     return result;
 }
+exports.unflatten = unflatten;

package/dist/helpers/utilities.d.ts

@@ -48,8 +48,8 @@ export declare const insertUrlParams: (params: {
 }) => void;
 export declare const getUrlParams: <T>() => T;
 export declare class Deferred<T> {
-    _resolve: (result: T) => void;
-    _reject: (error: any) => void;
+    private _resolve;
+    private _reject;
     readonly promise: Promise<T>;
     constructor();
     get resolve(): (result: T) => void;
@@ -59,5 +59,5 @@ export declare const tryParseJson: <T = any>(json: string, errorValue?: {}) => {
 export declare const useIsVisible: (ref: React.MutableRefObject<any>) => boolean;
 export declare const usePubSub: <T>() => {
     usePub: () => <TName extends keyof T, TPayload extends T[TName]>(event: TName, data?: TPayload) => void;
-    useSub: <TName extends keyof T, TPayload_1 extends T[TName]>(event: TName, callback: (data: TPayload_1) => void) => () => void;
+    useSub: <TName_1 extends keyof T, TPayload_1 extends T[TName_1]>(event: TName_1, callback: (data: TPayload_1) => void) => () => void;
 };

package/dist/index.d.ts

@@ -1,7 +1,7 @@
 export { useUIUtilContext as useDryUxContext, UIUtilContext as DryUXContext } from "./ui-utils/UIUtilProvider";
 export { UIUtilRenderer as DryUXRenderer } from "./ui-utils/UIUtilRenderer";
 export { Money as Money } from "./ui-utils/Money";
-export * from "./ui-utils/uiUtil.interface";
+export * from "./ui-utils/UIUtil.interface";
 export { DryUXProvider } from "./provider";
 export * from "./helpers/utilities";
 export * from "./helpers/logger";

package/dist/index.js

@@ -22,7 +22,7 @@ var UIUtilRenderer_1 = require("./ui-utils/UIUtilRenderer");
 Object.defineProperty(exports, "DryUXRenderer", { enumerable: true, get: function () { return UIUtilRenderer_1.UIUtilRenderer; } });
 var Money_1 = require("./ui-utils/Money");
 Object.defineProperty(exports, "Money", { enumerable: true, get: function () { return Money_1.Money; } });
-__exportStar(require("./ui-utils/uiUtil.interface"), exports);
+__exportStar(require("./ui-utils/UIUtil.interface"), exports);
 var provider_1 = require("./provider");
 Object.defineProperty(exports, "DryUXProvider", { enumerable: true, get: function () { return provider_1.DryUXProvider; } });
 __exportStar(require("./helpers/utilities"), exports);

package/dist/ui-utils/Modal.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
-import { ModalOptions } from "./uiUtil.interface";
+import { PopUpOptions } from "./UIUtil.interface";
 export interface IModalProps {
-    options: ModalOptions;
+    options: PopUpOptions;
     handleClose: () => void;
     shown: boolean;
     config: {
@@ -10,6 +10,7 @@ export interface IModalProps {
         };
         defaultModalStyles?: boolean;
         setBackdropHeight?: boolean;
+        centered?: boolean;
     };
 }
 declare const Modal: React.FC<IModalProps & {

package/dist/ui-utils/Modal.js

@@ -2,7 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const React = require("react");
 const react_bootstrap_1 = require("react-bootstrap");
-const Modal = React.memo(({ handleClose, shown, options: { content, footerContent, cssClass, closeBtn, title, width, onClose, titleCloseBtn = true }, config: { defaultModalStyles = false, styles = {}, setBackdropHeight = true }, }) => {
+const Modal = React.memo(({ handleClose, shown, options: { content, footerContent, cssClass, closeBtn, title, width, onClose, titleCloseBtn = true, centered }, config: { defaultModalStyles = false, styles = {}, setBackdropHeight = true, centered: globalCentered }, }) => {
+    const isCentered = centered !== null && centered !== void 0 ? centered : globalCentered;
     const applyStyles = React.useCallback(() => {
         document.querySelectorAll(".modal-dialog").forEach((el) => {
             el.style.width = typeof width == "number" ? `${width}px` : width;
@@ -12,6 +13,13 @@ const Modal = React.memo(({ handleClose, shown, options: { content, footerConten
                 el.querySelectorAll(".modal-header").forEach((el) => (el.style.display = "block"));
                 el.querySelectorAll(".modal-title").forEach((el) => (el.style.marginTop = "0"));
             }
+            if (isCentered) {
+                el.style.position = "absolute";
+                el.style.transform = "translate(-50%, -50%)";
+                el.style.top = "50%";
+                el.style.left = "50%";
+                el.style.marginTop = "unset";
+            }
         });
         document.querySelectorAll("[role=dialog]").forEach((el) => (el.style.opacity = "1"));
         if (setBackdropHeight) {
@@ -26,24 +34,24 @@ const Modal = React.memo(({ handleClose, shown, options: { content, footerConten
                 });
             });
         });
-    }, [width, defaultModalStyles]);
+    }, [width, defaultModalStyles, isCentered, styles, setBackdropHeight]);
     React.useEffect(() => {
         if (shown) {
             applyStyles();
         }
     }, [shown, width, defaultModalStyles]);
-    const hide = () => {
+    const onHide = () => {
         handleClose();
         onClose && onClose();
     };
     const contentToRender = typeof content == "string" ? React.createElement("div", { dangerouslySetInnerHTML: { __html: content } }) : content;
     const showFooter = closeBtn || footerContent;
-    return (React.createElement(react_bootstrap_1.Modal, { onHide: hide, show: shown, animation: true, autoFocus: true, keyboard: false, className: cssClass, backdropStyle: { zIndex: 1040, opacity: 0.5 }, backdrop: "static" },
-        !!title && (React.createElement(react_bootstrap_1.Modal.Header, { closeButton: titleCloseBtn, onHide: hide },
+    return (React.createElement(react_bootstrap_1.Modal, { onHide: onHide, show: shown, animation: true, autoFocus: true, keyboard: false, className: cssClass, backdropStyle: { zIndex: 1040, opacity: 0.5 }, backdrop: "static" },
+        !!title && (React.createElement(react_bootstrap_1.Modal.Header, { closeButton: titleCloseBtn, onHide: onHide },
             React.createElement(react_bootstrap_1.Modal.Title, null, title))),
         React.createElement(react_bootstrap_1.Modal.Body, null, contentToRender),
         showFooter && (React.createElement(react_bootstrap_1.Modal.Footer, null,
             footerContent,
-            closeBtn && (React.createElement(react_bootstrap_1.Button, { bsClass: "btn btn-danger", onClick: hide }, "Close"))))));
+            closeBtn && (React.createElement(react_bootstrap_1.Button, { bsClass: "btn btn-danger", onClick: onHide }, "Close"))))));
 });
 exports.default = Modal;

package/dist/ui-utils/RenderWhenVisible.d.ts

@@ -1,4 +1,6 @@
 import * as React from "react";
 export declare const RenderWhenVisible: React.FC<{
-    content: string | JSX.Element;
+    children: JSX.Element;
+    onLoad?: () => void;
+    minHeight?: number;
 }>;

package/dist/ui-utils/RenderWhenVisible.js

@@ -3,14 +3,15 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.RenderWhenVisible = void 0;
 const React = require("react");
 const utilities_1 = require("../helpers/utilities");
-exports.RenderWhenVisible = React.memo(({ content }) => {
+exports.RenderWhenVisible = React.memo(({ children, minHeight, onLoad }) => {
     const [isLoaded, setIsLoaded] = React.useState(false);
     const ref = React.useRef(null);
     const isVisible = (0, utilities_1.useIsVisible)(ref);
     React.useEffect(() => {
         if (!isLoaded && isVisible) {
             setIsLoaded(true);
+            onLoad === null || onLoad === void 0 ? void 0 : onLoad();
         }
     }, [isVisible]);
-    return React.createElement("div", { ref: ref }, isLoaded && content);
+    return (React.createElement("div", { style: { minHeight }, ref: ref }, isLoaded && children));
 });

package/dist/ui-utils/Spinner.d.ts

@@ -1,2 +1,2 @@
 import * as React from "react";
-export declare const Spinner: React.MemoExoticComponent<() => React.JSX.Element>;
+export declare const Spinner: React.MemoExoticComponent<() => JSX.Element>;

package/dist/ui-utils/{uiUtil.interface.d.ts → UIUtil.interface.d.ts}

@@ -1,4 +1,5 @@
-export interface IModalCreate {
+/// <reference types="react" />
+export declare type PopUp = {
     /**
      * Hides the modal.
      */
@@ -11,8 +12,8 @@ export interface IModalCreate {
      * Removes the modal.
      */
     remove: () => void;
-}
-export type ModalOptions = {
+};
+export declare type PopUpOptions = {
     /**
      * The content of the modal.
      */
@@ -49,10 +50,13 @@ export type ModalOptions = {
      * If true, the modal will be destroyed when it is closed.
      */
     destroyOnClose?: boolean;
+    /**
+     * If true, the modal will be centered vertically.
+     */
+    centered?: boolean;
 };
-export type AlertType = "success" | "warning" | "error";
-export type ButtonType = "primary" | "info" | "success" | "warning" | "danger";
-export interface IUtilModalAction {
+export declare type ButtonType = "primary" | "info" | "success" | "warning" | "danger";
+export declare type PopUpAction = {
     /**
      * The content to display in the modal.
      */
@@ -69,25 +73,25 @@ export interface IUtilModalAction {
      * If true, the modal will be closed when the button is clicked.
      */
     closeOnClick?: boolean;
-}
-export interface IUIUtilModal {
+};
+export declare type UIUtilModal = {
     /**
      * Creates a non-unique modal.
      * @param options The options for the modal.
      */
-    show: (options: ModalOptions) => IModalCreate;
+    show: (options: PopUpOptions) => PopUp;
     /**
      * Creates a unique (by id) modal
      * @param id The id of the modal.
      * @param options The options for the modal.
      */
-    create: (id: string, options: ModalOptions) => IModalCreate;
+    create: (id: string, options: PopUpOptions) => PopUp;
     /**
      * Dictionary of modal instances in memory.
      */
     instances: {
         [id: string]: {
-            options: ModalOptions;
+            options: PopUpOptions;
             shown: boolean;
             handleClose: (id: string, shown: boolean, destroyOnClose: boolean) => void;
         };
@@ -95,26 +99,26 @@ export interface IUIUtilModal {
     /**
      * Gets the current modal instance.
      */
-    getCurrent: () => IModalCreate;
+    getCurrent: () => PopUp;
     /**
      * Shows an alert style modal.
      * @param content The content to display in the modal.
      */
-    showAlert: (content: ModalOptions["content"], onClose?: ModalOptions["onClose"]) => IModalCreate;
+    showAlert: (content: PopUpOptions["content"], onClose?: PopUpOptions["onClose"]) => PopUp;
     /**
      * Shows a confirm style modal.
      * @param options The options for the modal.
      * @param onYes The function to call when the yes button is clicked.
      * @param onNo The function to call when the no button is clicked.
      */
-    showConfirm: (options: ModalOptions, onYes: () => void, onNo?: () => void) => IModalCreate;
+    showConfirm: (options: PopUpOptions, onYes: () => void, onNo?: () => void) => PopUp;
     /**
      * Shows a modal with custom actions.
      * @param options The options for the modal.
      * @param actions The actions to display in the modal.
      */
-    showActions: (options: ModalOptions, actions: IUtilModalAction[]) => IModalCreate;
-}
+    showActions: (options: PopUpOptions, actions: PopUpAction[]) => PopUp;
+};
 export interface IUIUtilLoader {
     /**
      * Status of the loader.
@@ -129,19 +133,4 @@ export interface IUIUtilLoader {
      */
     hide: () => void;
 }
-export interface IUIUtilAlert {
-    /**
-     * Shows an alert.
-     * @param message The message to display in the alert.
-     * @param alertType The type of alert to display.
-     * @param position The position of the alert.
-     * @param bindToElement The element to bind the alert to.
-     */
-    show: (message: string, alertType?: AlertType, position?: string, bindToElement?: any) => void;
-    /**
-     * Shows an alert using Noty library.
-     * @param message The message to display in the alert.
-     * @param alertType The type of alert to display.
-     */
-    showNoty: (message: string, alertType: AlertType) => void;
-}
+export declare type UIUtilPrompt = Pick<UIUtilModal, "showConfirm" | "showActions" | "instances" | "getCurrent">;

package/dist/ui-utils/UIUtilProvider.d.ts

@@ -1,9 +1,9 @@
 import * as React from "react";
-import { AlertType, IModalCreate, IUIUtilAlert, IUIUtilLoader, IUIUtilModal, IUtilModalAction, ModalOptions } from "./uiUtil.interface";
+import { IUIUtilLoader, UIUtilModal, PopUp, PopUpAction, PopUpOptions, UIUtilPrompt } from "./UIUtil.interface";
 import "../types";
 export interface IUIUtilProviderState {
-    modal: IUIUtilModal;
-    alert: IUIUtilAlert;
+    modal: UIUtilModal;
+    prompt: UIUtilPrompt;
     customLoader: IUIUtilLoader;
     loader: Pick<IUIUtilLoader, "show" | "hide">;
 }
@@ -14,23 +14,19 @@ export declare class UIUtilProvider extends React.PureComponent<{}, IUIUtilProvi
     constructor(props: any);
     get modalDefaults(): {
         create: any;
-        show: (options: ModalOptions) => IModalCreate;
-        getCurrent: () => IModalCreate;
-        showAlert: (content: ModalOptions["content"], onClose?: ModalOptions["onClose"]) => IModalCreate;
-        showConfirm: (options: ModalOptions, onYes: () => void, onNo?: () => void) => IModalCreate;
-        showActions: (options: ModalOptions, actions: IUtilModalAction[]) => IModalCreate;
+        show: (options: PopUpOptions) => PopUp;
+        getCurrent: () => PopUp;
+        showAlert: (content: PopUpOptions["content"], onClose?: PopUpOptions["onClose"]) => PopUp;
+        showConfirm: (options: PopUpOptions, onYes: () => void, onNo?: () => void) => PopUp;
+        showActions: (options: PopUpOptions, actions: PopUpAction[]) => PopUp;
         instances: {
             [id: string]: {
-                options: ModalOptions;
+                options: PopUpOptions;
                 shown: boolean;
                 handleClose: (id: string, shown: boolean, destroyOnClose: boolean) => void;
             };
         };
     };
-    get alertDefaults(): {
-        show: any;
-        showNoty: any;
-    };
     get customLoaderDefaults(): {
         show: () => void;
         hide: () => void;
@@ -40,11 +36,21 @@ export declare class UIUtilProvider extends React.PureComponent<{}, IUIUtilProvi
         show: () => void;
         hide: () => void;
     };
-    showNotifyAlert(message: string, alertType: AlertType, position?: string, bindToElement?: any): void;
-    showNoty(message: string, alertType: AlertType): void;
+    get promptDefaults(): {
+        getCurrent: () => PopUp;
+        showConfirm: (options: PopUpOptions, onYes: () => void, onNo?: () => void) => PopUp;
+        showActions: (options: PopUpOptions, actions: PopUpAction[]) => PopUp;
+        instances: {
+            [id: string]: {
+                options: PopUpOptions;
+                shown: boolean;
+                handleClose: (id: string, shown: boolean, destroyOnClose: boolean) => void;
+            };
+        };
+    };
     toggleModalInstance(id: string, shown: boolean, destroyOnClose?: boolean): void;
     removeModalInstance(id: string): void;
-    getCurrentModal(id: string): IModalCreate;
-    createModal(id: string, options: ModalOptions): IModalCreate;
-    render(): React.JSX.Element;
+    getCurrentModal(id: string): PopUp;
+    createModal(id: string, options: PopUpOptions): PopUp;
+    render(): JSX.Element;
 }

package/dist/ui-utils/UIUtilProvider.js

@@ -15,9 +15,11 @@ const defaultState = {
         showConfirm: null,
         showActions: null,
     },
-    alert: {
-        show: null,
-        showNoty: null,
+    prompt: {
+        showConfirm: null,
+        showActions: null,
+        instances: {},
+        getCurrent: null,
     },
     customLoader: {
         shown: false,
@@ -36,7 +38,7 @@ class UIUtilProvider extends React.PureComponent {
     constructor(props) {
         super(props);
         this.loader = Loader_1.Loader.getInstance();
-        this.state = Object.assign(Object.assign({}, defaultState), { modal: this.modalDefaults, alert: this.alertDefaults, customLoader: this.customLoaderDefaults, loader: this.loaderDefaults });
+        this.state = Object.assign(Object.assign({}, defaultState), { modal: this.modalDefaults, customLoader: this.customLoaderDefaults, loader: this.loaderDefaults, prompt: this.promptDefaults });
     }
     get modalDefaults() {
         return Object.assign(Object.assign({}, defaultState.modal), { create: this.createModal.bind(this), show: (options) => this.createModal(null, options), getCurrent: () => {
@@ -59,12 +61,6 @@ class UIUtilProvider extends React.PureComponent {
                             closeOnClick && this.toggleModalInstance("actions", false, true);
                         } }, content))))) })) });
     }
-    get alertDefaults() {
-        return {
-            show: this.showNotifyAlert.bind(this),
-            showNoty: this.showNoty.bind(this),
-        };
-    }
     get customLoaderDefaults() {
         return Object.assign(Object.assign({}, defaultState.customLoader), { show: () => this.setState({
                 customLoader: Object.assign(Object.assign({}, this.state.customLoader), { shown: true }),
@@ -75,11 +71,12 @@ class UIUtilProvider extends React.PureComponent {
     get loaderDefaults() {
         return Object.assign(Object.assign({}, defaultState.loader), { show: () => this.loader.show(), hide: () => this.loader.hide() });
     }
-    showNotifyAlert(message, alertType, position, bindToElement) {
-        alert("Starting with 1.49.1, this is deprecated. Please use Notyf package directly.");
-    }
-    showNoty(message, alertType) {
-        alert("Starting with 1.49.1, this is deprecated. Please use Notyf package directly.");
+    get promptDefaults() {
+        return Object.assign(Object.assign({}, defaultState.prompt), { getCurrent: () => {
+                const { prompt: { instances }, } = this.state;
+                const id = Object.keys(instances).find(id => instances[id].shown);
+                return this.getCurrentModal(id);
+            } });
     }
     toggleModalInstance(id, shown, destroyOnClose = false) {
         const { modal: { instances }, } = this.state;

package/dist/ui-utils/UIUtilRenderer.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { IModalProps } from "./Modal";
-export type UIUtilRendererProps = {
+export declare type UIUtilRendererProps = {
     modalConfig?: IModalProps["config"];
 };
 export declare const UIUtilRenderer: React.FC<UIUtilRendererProps>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dry-ux",
-  "version": "1.51.0",
+  "version": "1.53.0",
   "description": "",
   "main": "dist/index",
   "scripts": {