react-confirm 0.5.0-4 → 0.5.0-5

package/README.md

@@ -72,19 +72,40 @@ const handleDelete = async (): Promise<void> => {
 
 ## External Control
 
-You can close pending confirmation dialogs from outside using the `proceed` function. This is useful when you need to close a dialog from a different part of your application.
+You can control pending confirmation dialogs from outside using the `proceed` and `dismiss` functions.
+
+### proceed
+
+Resolves the promise with a value and closes the dialog.
 
 ```typescript
 import { proceed } from 'react-confirm';
 
 const p = confirm({ message: 'Continue?' });
 
-// Auto-close after 10 seconds
+// Auto-close after 10 seconds with a result
 setTimeout(() => {
   proceed(p, false);
 }, 10000);
 
-const result = await p;
+const result = await p; // false
+```
+
+### dismiss
+
+Closes the dialog without resolving or rejecting the promise. The promise remains pending.
+
+```typescript
+import { dismiss } from 'react-confirm';
+
+const p = confirm({ message: 'Continue?' });
+
+// Close dialog after 10 seconds without resolving
+setTimeout(() => {
+  dismiss(p);
+}, 10000);
+
+// Note: await p will never complete since the promise is not resolved
 ```
 
 ## Using with React Context

package/dist/mounter/domTree.js

@@ -21,17 +21,20 @@ function createDomTreeMounter(defaultMountNode) {
         var key = Math.floor(Math.random() * (1 << 30)).toString(16);
         var parent = (mountNode || defaultMountNode || document.body);
         var wrapper = parent.appendChild(document.createElement('div'));
-        confirms[key] = wrapper;
         var root = (0, client_1.createRoot)(wrapper);
         root.render((0, jsx_runtime_1.jsx)(Component, __assign({}, props)));
+        confirms[key] = { wrapper: wrapper, root: root };
         callbacks.mounted && callbacks.mounted();
         return key;
     }
     function unmount(key) {
-        var wrapper = confirms[key];
+        var entry = confirms[key];
         delete confirms[key];
-        if (wrapper && wrapper.parentNode) {
-            wrapper.parentNode.removeChild(wrapper);
+        if (entry) {
+            entry.root.unmount();
+            if (entry.wrapper.parentNode) {
+                entry.wrapper.parentNode.removeChild(entry.wrapper);
+            }
         }
     }
     return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-confirm",
-  "version": "0.5.0-4",
+  "version": "0.5.0-5",
   "description": "A lightweight React library that simplifies confirmation dialogs with a Promise-based API — like window.confirm(), but fully customizable.",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

package/src/mounter/domTree.tsx

@@ -3,27 +3,31 @@ import { createRoot } from 'react-dom/client';
 import type { Mounter } from '../types';
 
 export function createDomTreeMounter(defaultMountNode?: Element | DocumentFragment | HTMLElement): Mounter {
-  const confirms: Record<string, HTMLElement> = {};
+  const confirms: Record<string, { wrapper: HTMLElement; root: ReturnType<typeof createRoot> }> = {};
   const callbacks: { mounted?: () => void } = {};
 
   function mount(Component: React.ComponentType<any>, props: any, mountNode?: HTMLElement) {
     const key = Math.floor(Math.random() * (1 << 30)).toString(16);
     const parent = (mountNode || (defaultMountNode as Element | DocumentFragment) || document.body) as Element | DocumentFragment;
     const wrapper = parent.appendChild(document.createElement('div'));
-    confirms[key] = wrapper;
 
     const root = createRoot(wrapper);
     root.render(<Component {...props} />);
+
+    confirms[key] = { wrapper, root };
     callbacks.mounted && callbacks.mounted();
     return key;
   }
 
   function unmount(key: string) {
-    const wrapper = confirms[key];
+    const entry = confirms[key];
     delete confirms[key];
 
-    if (wrapper && wrapper.parentNode) {
-      wrapper.parentNode.removeChild(wrapper);
+    if (entry) {
+      entry.root.unmount();
+      if (entry.wrapper.parentNode) {
+        entry.wrapper.parentNode.removeChild(entry.wrapper);
+      }
     }
   }