brew-js-react 0.5.7 → 0.6.1

package/README.md

@@ -2,4 +2,4 @@
 
 Brew.js for React is a utility that allow brew.js features to be used on React App.
 
-See documentation at https://hackmd.io/@misonou/brew-js-react.
+See documentation at https://misonou.github.io.

package/dialog.d.ts

@@ -64,7 +64,7 @@ export interface DialogBaseProps<T, V = T> {
      * The dialog will be held open until the returned promise resolves.
      * When the promise rejects, the dialog will remain open.
      */
-    onCommit?: (value: V | undefined) => T | Promise<T> | void;
+    onCommit?: (value: V | undefined, context: Zeta.RunAsyncContext) => T | Promise<T> | void;
     /**
      * Callback to be invoked when dialog has opened.
      */

package/dialog.js

@@ -1,10 +1,10 @@
-import { createElement, useEffect, useState } from "react";
+import { createElement, StrictMode, useEffect, useState } from "react";
 import ReactDOM from "react-dom";
 import ReactDOMClient from "@misonou/react-dom-client";
-import { either, extend, makeAsync, noop, pick, pipe, resolve } from "zeta-dom/util";
+import { either, extend, noop, pick, resolve } from "zeta-dom/util";
 import { containsOrEquals, removeNode } from "zeta-dom/domUtil";
 import dom from "zeta-dom/dom";
-import { lock, notifyAsync, preventLeave, subscribeAsync } from "zeta-dom/domLock";
+import { lock, preventLeave, runAsync, subscribeAsync } from "zeta-dom/domLock";
 import { closeFlyout, openFlyout } from "brew-js/domAction";
 
 /**
@@ -41,25 +41,23 @@ export function createDialog(props) {
             }
             root.className = props.className || '';
             document.body.appendChild(root);
-            dom.retainFocus(dom.activeElement, root);
             if (props.modal) {
                 root.setAttribute('is-modal', '');
             }
             if (props.onRender) {
                 var dialogProps = extend({}, props, {
-                    closeDialog: function (value) {
-                        var promise = makeAsync(props.onCommit || pipe)(value);
-                        notifyAsync(dom.activeElement, promise);
-                        return promise.then(closeDialog);
-                    }
+                    closeDialog: props.onCommit ? function (value) {
+                        return runAsync(dom.activeElement, props.onCommit.bind(this, value)).then(closeDialog);
+                    } : closeDialog
                 });
                 var content = createElement(props.onRender, dialogProps);
                 if (props.wrapper) {
                     content = createElement(props.wrapper, dialogProps, content);
                 }
-                reactRoot.render(content);
+                reactRoot.render(createElement(StrictMode, null, content));
             }
             promise = resolve().then(function () {
+                dom.retainFocus(dom.activeElement, root);
                 return openFlyout(root, null, pick(props, ['focus']));
             });
             if (props.preventLeave) {