brew-js-react 0.6.7 → 0.7.0

package/dialog.d.ts

@@ -14,7 +14,7 @@ export type DialogBaseProps<T, V = T> = Omit<DialogOptions<T, V | undefined>, 'o
 /** @deprecated */
 export type DialogRenderComponentProps<T, V = T> = DialogOptions<T, V | undefined> & DialogContext<V | undefined>;
 
-export type DialogControllerOptions = Pick<DialogOptions<any>, 'container' | 'className' | 'focus' | 'modal'>;
+export type DialogControllerOptions = Omit<DialogOptions<any>, 'onRender' | 'onCommit' | 'onOpen' | 'onClose' | 'controller'>;
 
 export interface DialogControllerAdvancedOptions extends DialogControllerOptions, Pick<DialogOptions<any>, 'onClose' | 'onOpen' | 'preventLeave' | 'preventNavigation'> {
     /**
@@ -203,6 +203,20 @@ export function createDialog<P extends DialogOptionsStrict<any, any>>(props: P):
 
 export function createDialog<P extends DialogOptions<any, any>>(props: P): DialogState<VoidOrOptional<P extends DialogOptions<infer T, infer V> ? T | V : unknown>>;
 
+/**
+ * Opens a dialog.
+ * @param props A dictionary containing options.
+ */
+export function openDialog<T, V>(props: DialogOptionsStrict<T, V>): Promise<DialogResult<VoidOrOptional<T>>>;
+
+export function openDialog<T, V>(props: DialogOptions<T, V>): Promise<DialogResult<VoidOrOptional<T | V>>>;
+
+export function openDialog<T, V = T>(props: DialogOptions<T, V | undefined>): Promise<DialogResult<VoidOrOptional<T | V>>>;
+
+export function openDialog<P extends DialogOptionsStrict<any, any>>(props: P): Promise<DialogResult<VoidOrOptional<P extends DialogOptionsStrict<infer T, any> ? T : unknown>>>;
+
+export function openDialog<P extends DialogOptions<any, any>>(props: P): Promise<DialogResult<VoidOrOptional<P extends DialogOptions<infer T, infer V> ? T | V : unknown>>>;
+
 /**
  * Renders a dialog declaratively.
  */

package/dialog.js

@@ -2,10 +2,10 @@ import { createElement, StrictMode, useEffect, useState } from "react";
 import ReactDOM from "react-dom";
 import ReactDOMClient from "@misonou/react-dom-client";
 import { createAsyncScope } from "zeta-dom-react";
-import { always, arrRemove, combineFn, createPrivateStore, defineObservableProperty, either, extend, noop, pick, resolve, setImmediate } from "zeta-dom/util";
+import { always, arrRemove, combineFn, createPrivateStore, defineObservableProperty, either, exclude, extend, noop, pick, resolve, setImmediate } from "zeta-dom/util";
 import { containsOrEquals, removeNode } from "zeta-dom/domUtil";
 import dom from "zeta-dom/dom";
-import { lock, preventLeave, runAsync, subscribeAsync } from "zeta-dom/domLock";
+import { runAsync, subscribeAsync } from "zeta-dom/domLock";
 import { closeFlyout, isFlyoutOpen, openFlyout } from "brew-js/domAction";
 
 const _ = createPrivateStore();
@@ -40,24 +40,19 @@ function createDialogElement(props, unmountAfterUse) {
     return root;
 }
 
-function openDialog(element, props, container) {
+function showDialog(element, props, container) {
     if (!containsOrEquals(dom.root, element)) {
         element.className = props.className || '';
-        (container || props.container || document.body).appendChild(element);
         if (props.modal) {
             element.setAttribute('is-modal', '');
         }
-        setImmediate(function () {
-            dom.retainFocus(dom.activeElement, element);
-        });
-    }
-    var promise = openFlyout(element, null, pick(props, ['focus', 'closeOnBlur']));
-    if (props.preventLeave) {
-        preventLeave(element, promise);
-    } else if (props.preventNavigation) {
-        lock(element, promise);
+        (container || props.container || document.body).appendChild(element);
     }
-    return promise;
+    return openFlyout(element, null, pick(props, ['focus', 'closeOnBlur', 'preventLeave', 'preventNavigation']));
+}
+
+export function openDialog(props) {
+    return createDialog(props).open();
 }
 
 /**
@@ -89,7 +84,7 @@ export function createDialog(props) {
             content = createElement(props.wrapper, dialogProps, content);
         }
         reactRoot.render(createElement(StrictMode, null, createElement(scope.Provider, null, content)));
-        return shared ? { then: noop } : openDialog(root, props, container);
+        return shared ? { then: noop } : showDialog(root, props, container);
     }
 
     return {
@@ -153,7 +148,7 @@ export function createDialogQueue(props) {
         childProps = { closeOnBlur: false };
         props = extend({}, props, childProps);
     } else {
-        childProps = props && pick(props, ['className', 'focus', 'modal', 'container']);
+        childProps = props && exclude(props, ['onCommit', 'onRender', 'onOpen', 'onClose']);
     }
     _(controller, {
         root: root,
@@ -161,7 +156,7 @@ export function createDialogQueue(props) {
         props: childProps,
         enqueue: function (callback) {
             if (root && !isFlyoutOpen(root)) {
-                openDialog(root, props).then(dismissAll);
+                showDialog(root, props).then(dismissAll);
             }
             if (queue.length || active.length >= (multiple ? props.concurrent || Infinity : 1)) {
                 return new Promise(function (resolve) {
@@ -189,7 +184,7 @@ export function Dialog(props) {
         var opened = isFlyoutOpen(element);
         if (either(opened, _props.isOpen)) {
             if (!opened) {
-                openDialog(element, _props);
+                showDialog(element, _props);
             } else {
                 closeFlyout(element);
             }

package/dist/brew-js-react.js

@@ -1,4 +1,4 @@
-/*! brew-js-react v0.6.7 | (c) misonou | https://misonou.github.io */
+/*! brew-js-react v0.7.0 | (c) misonou | https://misonou.github.io */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
 		module.exports = factory(require("zeta-dom"), require("brew-js"), require("react"), require("react-dom"), require("zeta-dom-react"), require("waterpipe"), require("jquery"));
@@ -192,6 +192,7 @@ __webpack_require__.d(__webpack_exports__, {
   makeTranslation: () => (/* reexport */ makeTranslation),
   matchView: () => (/* reexport */ matchView),
   navigateTo: () => (/* reexport */ navigateTo),
+  openDialog: () => (/* reexport */ openDialog),
   redirectTo: () => (/* reexport */ redirectTo),
   registerErrorView: () => (/* reexport */ registerErrorView),
   registerView: () => (/* reexport */ registerView),
@@ -351,8 +352,6 @@ var reportError = dom.reportError;
 ;// CONCATENATED MODULE: ./|umd|/zeta-dom/domLock.js
 
 var _lib$dom = external_commonjs_zeta_dom_commonjs2_zeta_dom_amd_zeta_dom_root_zeta_.dom,
-  lock = _lib$dom.lock,
-  preventLeave = _lib$dom.preventLeave,
   runAsync = _lib$dom.runAsync,
   subscribeAsync = _lib$dom.subscribeAsync;
 
@@ -402,24 +401,18 @@ function createDialogElement(props, unmountAfterUse) {
   subscribeAsync(root, true);
   return root;
 }
-function openDialog(element, props, container) {
+function showDialog(element, props, container) {
   if (!containsOrEquals(zeta_dom_dom.root, element)) {
     element.className = props.className || '';
-    (container || props.container || document.body).appendChild(element);
     if (props.modal) {
       element.setAttribute('is-modal', '');
     }
-    setImmediate(function () {
-      zeta_dom_dom.retainFocus(zeta_dom_dom.activeElement, element);
-    });
-  }
-  var promise = openFlyout(element, null, pick(props, ['focus', 'closeOnBlur']));
-  if (props.preventLeave) {
-    preventLeave(element, promise);
-  } else if (props.preventNavigation) {
-    lock(element, promise);
+    (container || props.container || document.body).appendChild(element);
   }
-  return promise;
+  return openFlyout(element, null, pick(props, ['focus', 'closeOnBlur', 'preventLeave', 'preventNavigation']));
+}
+function openDialog(props) {
+  return createDialog(props).open();
 }
 
 /**
@@ -452,7 +445,7 @@ function createDialog(props) {
     reactRoot.render( /*#__PURE__*/createElement(StrictMode, null, /*#__PURE__*/createElement(scope.Provider, null, content)));
     return shared ? {
       then: noop
-    } : openDialog(root, props, container);
+    } : showDialog(root, props, container);
   }
   return {
     root: root,
@@ -513,7 +506,7 @@ function createDialogQueue(props) {
     };
     props = extend({}, props, childProps);
   } else {
-    childProps = props && pick(props, ['className', 'focus', 'modal', 'container']);
+    childProps = props && exclude(props, ['onCommit', 'onRender', 'onOpen', 'onClose']);
   }
   _(controller, {
     root: root,
@@ -521,7 +514,7 @@ function createDialogQueue(props) {
     props: childProps,
     enqueue: function enqueue(callback) {
       if (root && !isFlyoutOpen(root)) {
-        openDialog(root, props).then(dismissAll);
+        showDialog(root, props).then(dismissAll);
       }
       if (queue.length || active.length >= (multiple ? props.concurrent || Infinity : 1)) {
         return new Promise(function (resolve) {
@@ -552,7 +545,7 @@ function Dialog(props) {
     var opened = isFlyoutOpen(element);
     if (either(opened, _props.isOpen)) {
       if (!opened) {
-        openDialog(element, _props);
+        showDialog(element, _props);
       } else {
         closeFlyout(element);
       }
@@ -1330,37 +1323,31 @@ util_define(Mixin, {
   },
   use: function use() {
     var args = makeArray(arguments);
-    var ref = args[0];
     var props = {};
-    var mixins = args.filter(function (v) {
-      return v instanceof Mixin;
-    });
-    var refs = mixins.map(function (v) {
-      return v.getRef();
-    });
-    if (ref && !(ref instanceof Mixin)) {
-      if (typeof ref !== 'function') {
-        refs.push(function (v) {
-          ref.current = v;
-        });
-      } else {
-        refs.push(ref);
-      }
+    var refs = [];
+    var ref = args[0];
+    if (!ref) {
       args.shift();
-    } else if (!ref) {
+    } else if (typeof ref === 'function') {
+      refs.push(ref);
+      args.shift();
+    } else if (typeof ref !== 'string' && !(ref instanceof Mixin)) {
+      refs.push(function (w) {
+        ref.current = w;
+      });
       args.shift();
     }
-    each(mixins, function (i, v) {
-      extend(props, v.getCustomAttributes());
+    each(args, function (i, v) {
+      if (v instanceof Mixin) {
+        refs.push(v.getRef());
+        extend(props, v.getCustomAttributes());
+        v.next();
+      }
     });
-    extend(props, {
+    return extend(props, {
       ref: combineFn(refs),
       className: classNames.apply(null, args)
     });
-    each(mixins, function (i, v) {
-      v.next();
-    });
-    return props;
   }
 });
 ;// CONCATENATED MODULE: ./|umd|/zeta-dom/observe.js