@lerx/promise-modal 0.8.5 → 0.8.7

package/dist/core/handle/type.d.ts

@@ -1,23 +1,11 @@
 import type { ComponentType, ReactNode } from 'react';
 import type { Fn } from '../../@aileron/declare';
 import type { AlertContentProps, AlertFooterRender, BackgroundComponent, ConfirmContentProps, ConfirmFooterRender, FooterOptions, ForegroundComponent, ModalBackground, PromptContentProps, PromptFooterRender, PromptInputProps } from '../../types';
-export interface AlertProps<BackgroundValue> {
+export interface OverridableHandleProps {
     /** Modal group identifier for managing related modals */
     group?: string;
     /** Alert subtype that affects UI styling */
     subtype?: 'info' | 'success' | 'warning' | 'error';
-    /** Modal title */
-    title?: ReactNode;
-    /** Modal subtitle */
-    subtitle?: ReactNode;
-    /** Modal content. Can be a ReactNode or a component */
-    content?: ReactNode | ComponentType<AlertContentProps>;
-    /** Background layer data and configuration */
-    background?: ModalBackground<BackgroundValue>;
-    /** Footer configuration. Can be a render function, options object, or false */
-    footer?: AlertFooterRender | Pick<FooterOptions, 'confirm' | 'hideConfirm'> | false;
-    /** Abort signal to cancel the modal */
-    signal?: AbortSignal;
     /** Whether to dim the background */
     dimmed?: boolean;
     /** Modal animation duration in milliseconds */
@@ -31,45 +19,27 @@ export interface AlertProps<BackgroundValue> {
     /** Custom background component */
     BackgroundComponent?: BackgroundComponent;
 }
-export interface ConfirmProps<BackgroundValue> {
-    /** Modal group identifier for managing related modals */
-    group?: string;
-    /** Confirmation subtype that affects UI styling */
-    subtype?: 'info' | 'success' | 'warning' | 'error';
+interface BaseHandleProps<ContentProps, BackgroundValue> extends OverridableHandleProps {
     /** Modal title */
     title?: ReactNode;
     /** Modal subtitle */
     subtitle?: ReactNode;
     /** Modal content. Can be a ReactNode or a component */
-    content?: ReactNode | ComponentType<ConfirmContentProps>;
+    content?: ReactNode | ComponentType<ContentProps>;
     /** Background layer data and configuration */
     background?: ModalBackground<BackgroundValue>;
-    /** Footer configuration. Can be a render function, options object, or false */
-    footer?: ConfirmFooterRender | FooterOptions | false;
     /** Abort signal to cancel the modal */
     signal?: AbortSignal;
-    /** Whether to dim the background */
-    dimmed?: boolean;
-    /** Modal animation duration in milliseconds */
-    duration?: number;
-    /** If true, keeps modal in DOM after closing (for animations) */
-    manualDestroy?: boolean;
-    /** Whether to close modal on backdrop click */
-    closeOnBackdropClick?: boolean;
-    /** Custom foreground component */
-    ForegroundComponent?: ForegroundComponent;
-    /** Custom background component */
-    BackgroundComponent?: BackgroundComponent;
 }
-export interface PromptProps<InputValue, BackgroundValue = any> {
-    /** Modal group identifier for managing related modals */
-    group?: string;
-    /** Modal title */
-    title?: ReactNode;
-    /** Modal subtitle */
-    subtitle?: ReactNode;
-    /** Modal content. Can be a ReactNode or a component */
-    content?: ReactNode | ComponentType<PromptContentProps>;
+export interface AlertProps<BackgroundValue> extends BaseHandleProps<AlertContentProps, BackgroundValue> {
+    /** Footer configuration. Can be a render function, options object, or false */
+    footer?: AlertFooterRender | Pick<FooterOptions, 'confirm' | 'hideConfirm'> | false;
+}
+export interface ConfirmProps<BackgroundValue> extends BaseHandleProps<ConfirmContentProps, BackgroundValue> {
+    /** Footer configuration. Can be a render function, options object, or false */
+    footer?: ConfirmFooterRender | FooterOptions | false;
+}
+export interface PromptProps<InputValue, BackgroundValue = any> extends BaseHandleProps<PromptContentProps, BackgroundValue> {
     /** Initial value for the input field */
     defaultValue?: InputValue;
     /** Input component that receives value, onChange, and other props */
@@ -78,22 +48,7 @@ export interface PromptProps<InputValue, BackgroundValue = any> {
     disabled?: Fn<[value: InputValue], boolean>;
     /** If true, returns defaultValue instead of rejecting on cancel */
     returnOnCancel?: boolean;
-    /** Background layer data and configuration */
-    background?: ModalBackground<BackgroundValue>;
     /** Footer configuration. Can be a render function, options object, or false */
     footer?: PromptFooterRender<InputValue> | FooterOptions | false;
-    /** Abort signal to cancel the modal */
-    signal?: AbortSignal;
-    /** Whether to dim the background */
-    dimmed?: boolean;
-    /** Modal animation duration in milliseconds */
-    duration?: number;
-    /** If true, keeps modal in DOM after closing (for animations) */
-    manualDestroy?: boolean;
-    /** Whether to close modal on backdrop click */
-    closeOnBackdropClick?: boolean;
-    /** Custom foreground component */
-    ForegroundComponent?: ForegroundComponent;
-    /** Custom background component */
-    BackgroundComponent?: BackgroundComponent;
 }
+export {};

package/dist/hooks/useModal.d.ts

@@ -1,6 +1,7 @@
 import { type AlertProps, type ConfirmProps, type PromptProps } from '../core';
-export declare const useModal: () => {
-    readonly alert: <BackgroundValue = any>(args: AlertProps<BackgroundValue>) => Promise<void>;
-    readonly confirm: <BackgroundValue = any>(args: ConfirmProps<BackgroundValue>) => Promise<boolean>;
-    readonly prompt: <InputValue, BackgroundValue = any>(args: PromptProps<InputValue, BackgroundValue>) => Promise<InputValue>;
+import type { OverridableHandleProps } from '../core/handle/type';
+export declare const useModal: (configuration?: OverridableHandleProps) => {
+    readonly alert: <Background = any>(args: AlertProps<Background>) => Promise<void>;
+    readonly confirm: <Background = any>(args: ConfirmProps<Background>) => Promise<boolean>;
+    readonly prompt: <Value, Background = any>(args: PromptProps<Value, Background>) => Promise<Value>;
 };

package/dist/hooks/useModalDuration.d.ts

@@ -0,0 +1,5 @@
+import type { ModalNode } from '../core';
+export declare const useModalDuration: (id?: ModalNode["id"]) => {
+    duration: string;
+    milliseconds: number;
+};

package/dist/index.cjs

@@ -985,20 +985,21 @@ const useBootstrap = ({ usePathname: useExternalPathname, ForegroundComponent, B
     return { portal, initialize };
 };
 
-const useModal = () => {
+const useModal = (configuration) => {
     const modalNodesRef = react.useRef([]);
+    const baseArgsRef = react.useRef(configuration);
     const alertRef = react.useRef((args) => {
-        const { modalNode, promiseHandler } = alertHandler(args);
+        const { modalNode, promiseHandler } = alertHandler(baseArgsRef.current ? { ...baseArgsRef.current, ...args } : args);
         modalNodesRef.current.push(modalNode);
         return promiseHandler;
     });
     const confirmRef = react.useRef((args) => {
-        const { modalNode, promiseHandler } = confirmHandler(args);
+        const { modalNode, promiseHandler } = confirmHandler(baseArgsRef.current ? { ...baseArgsRef.current, ...args } : args);
         modalNodesRef.current.push(modalNode);
         return promiseHandler;
     });
     const promptRef = react.useRef((args) => {
-        const { modalNode, promiseHandler } = promptHandler(args);
+        const { modalNode, promiseHandler } = promptHandler(baseArgsRef.current ? { ...baseArgsRef.current, ...args } : args);
         modalNodesRef.current.push(modalNode);
         return promiseHandler;
     });
@@ -1057,6 +1058,17 @@ const useModalAnimation = (visible, handler) => {
     }, [visible]);
 };
 
+const useModalDuration = (id) => {
+    const globalDuration = useConfigurationDuration();
+    if (id === undefined)
+        return globalDuration;
+    const { modal } = useModalManager(id);
+    if (modal === undefined)
+        return globalDuration;
+    const milliseconds = modal.duration;
+    return { duration: milliseconds + 'ms', milliseconds };
+};
+
 exports.ModalProvider = BootstrapProvider;
 exports.alert = alert;
 exports.confirm = confirm;
@@ -1067,6 +1079,6 @@ exports.useInitializeModal = useBootstrap;
 exports.useModal = useModal;
 exports.useModalAnimation = useModalAnimation;
 exports.useModalBackdrop = useConfigurationBackdrop;
-exports.useModalDuration = useConfigurationDuration;
+exports.useModalDuration = useModalDuration;
 exports.useModalOptions = useConfigurationOptions;
 exports.useSubscribeModal = useSubscribeModal;

package/dist/index.d.ts

@@ -1,9 +1,10 @@
-export { useConfigurationOptions as useModalOptions, useConfigurationDuration as useModalDuration, useConfigurationBackdrop as useModalBackdrop, } from './providers';
+export { useConfigurationOptions as useModalOptions, useConfigurationBackdrop as useModalBackdrop, } from './providers';
 export { useBootstrap as useInitializeModal, BootstrapProvider as ModalProvider, type BootstrapProviderHandle as ModalProviderHandle, type BootstrapProviderProps as ModalProviderProps, } from './bootstrap';
 export { useModal } from './hooks/useModal';
 export { useActiveModalCount } from './hooks/useActiveModalCount';
 export { useDestroyAfter } from './hooks/useDestroyAfter';
 export { useModalAnimation } from './hooks/useModalAnimation';
+export { useModalDuration } from './hooks/useModalDuration';
 export { useSubscribeModal } from './hooks/useSubscribeModal';
 export { alert, confirm, prompt } from './core';
 export type { ModalOptions, ModalFrameProps, FooterComponentProps, ModalBackground, PromptInputProps, AlertContentProps, ConfirmContentProps, PromptContentProps, WrapperComponentProps, } from './types';

package/dist/index.mjs

@@ -983,20 +983,21 @@ const useBootstrap = ({ usePathname: useExternalPathname, ForegroundComponent, B
     return { portal, initialize };
 };
 
-const useModal = () => {
+const useModal = (configuration) => {
     const modalNodesRef = useRef([]);
+    const baseArgsRef = useRef(configuration);
     const alertRef = useRef((args) => {
-        const { modalNode, promiseHandler } = alertHandler(args);
+        const { modalNode, promiseHandler } = alertHandler(baseArgsRef.current ? { ...baseArgsRef.current, ...args } : args);
         modalNodesRef.current.push(modalNode);
         return promiseHandler;
     });
     const confirmRef = useRef((args) => {
-        const { modalNode, promiseHandler } = confirmHandler(args);
+        const { modalNode, promiseHandler } = confirmHandler(baseArgsRef.current ? { ...baseArgsRef.current, ...args } : args);
         modalNodesRef.current.push(modalNode);
         return promiseHandler;
     });
     const promptRef = useRef((args) => {
-        const { modalNode, promiseHandler } = promptHandler(args);
+        const { modalNode, promiseHandler } = promptHandler(baseArgsRef.current ? { ...baseArgsRef.current, ...args } : args);
         modalNodesRef.current.push(modalNode);
         return promiseHandler;
     });
@@ -1055,4 +1056,15 @@ const useModalAnimation = (visible, handler) => {
     }, [visible]);
 };
 
-export { BootstrapProvider as ModalProvider, alert, confirm, prompt, useActiveModalCount, useDestroyAfter, useBootstrap as useInitializeModal, useModal, useModalAnimation, useConfigurationBackdrop as useModalBackdrop, useConfigurationDuration as useModalDuration, useConfigurationOptions as useModalOptions, useSubscribeModal };
+const useModalDuration = (id) => {
+    const globalDuration = useConfigurationDuration();
+    if (id === undefined)
+        return globalDuration;
+    const { modal } = useModalManager(id);
+    if (modal === undefined)
+        return globalDuration;
+    const milliseconds = modal.duration;
+    return { duration: milliseconds + 'ms', milliseconds };
+};
+
+export { BootstrapProvider as ModalProvider, alert, confirm, prompt, useActiveModalCount, useDestroyAfter, useBootstrap as useInitializeModal, useModal, useModalAnimation, useConfigurationBackdrop as useModalBackdrop, useModalDuration, useConfigurationOptions as useModalOptions, useSubscribeModal };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lerx/promise-modal",
-  "version": "0.8.5",
+  "version": "0.8.7",
   "description": "Universal React modal utility that can be used outside React components with promise-based results for alert, confirm, and prompt modals",
   "keywords": [
     "react",