brew-js-react 0.4.5 → 0.4.7

package/dist/brew-js-react.js

@@ -1,25 +1,17 @@
-/*! brew-js-react v0.4.5 | (c) misonou | https://hackmd.io/@misonou/brew-js-react */
+/*! brew-js-react v0.4.7 | (c) misonou | https://hackmd.io/@misonou/brew-js-react */
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("brew-js"), require("react"), require("react-dom"), (function webpackLoadOptionalExternalModule() { try { return require("react-dom/client"); } catch(e) {} }()), require("zeta-dom"), require("zeta-dom-react"), require("waterpipe"), require("jQuery"));
+		module.exports = factory(require("brew-js"), require("react"), require("react-dom"), (function webpackLoadOptionalExternalModule() { try { return require("react-dom/client"); } catch(e) {} }()), require("zeta-dom"), require("zeta-dom-react"), require("waterpipe"));
 	else if(typeof define === 'function' && define.amd)
-		define("brew-js-react", ["brew-js", "react", "react-dom", "react-dom/client", "zeta-dom", "zeta-dom-react", "waterpipe", "jQuery"], factory);
+		define("brew-js-react", ["brew-js", "react", "react-dom", "react-dom/client", "zeta-dom", "zeta-dom-react", "waterpipe"], factory);
 	else if(typeof exports === 'object')
-		exports["brew-js-react"] = factory(require("brew-js"), require("react"), require("react-dom"), (function webpackLoadOptionalExternalModule() { try { return require("react-dom/client"); } catch(e) {} }()), require("zeta-dom"), require("zeta-dom-react"), require("waterpipe"), require("jQuery"));
+		exports["brew-js-react"] = factory(require("brew-js"), require("react"), require("react-dom"), (function webpackLoadOptionalExternalModule() { try { return require("react-dom/client"); } catch(e) {} }()), require("zeta-dom"), require("zeta-dom-react"), require("waterpipe"));
 	else
-		root["brew-js-react"] = factory(root["brew"], root["React"], root["ReactDOM"], root["react-dom/client"], root["zeta"], root["zeta-dom-react"], root["waterpipe"], root["jQuery"]);
-})(self, function(__WEBPACK_EXTERNAL_MODULE__80__, __WEBPACK_EXTERNAL_MODULE__359__, __WEBPACK_EXTERNAL_MODULE__318__, __WEBPACK_EXTERNAL_MODULE__715__, __WEBPACK_EXTERNAL_MODULE__654__, __WEBPACK_EXTERNAL_MODULE__103__, __WEBPACK_EXTERNAL_MODULE__28__, __WEBPACK_EXTERNAL_MODULE__145__) {
+		root["brew-js-react"] = factory(root["brew"], root["React"], root["ReactDOM"], root["react-dom/client"], root["zeta"], root["zeta-dom-react"], root["waterpipe"]);
+})(self, function(__WEBPACK_EXTERNAL_MODULE__80__, __WEBPACK_EXTERNAL_MODULE__359__, __WEBPACK_EXTERNAL_MODULE__318__, __WEBPACK_EXTERNAL_MODULE__715__, __WEBPACK_EXTERNAL_MODULE__654__, __WEBPACK_EXTERNAL_MODULE__103__, __WEBPACK_EXTERNAL_MODULE__28__) {
 return /******/ (() => { // webpackBootstrap
 /******/ 	var __webpack_modules__ = ({
 
-/***/ 145:
-/***/ ((module) => {
-
-"use strict";
-module.exports = __WEBPACK_EXTERNAL_MODULE__145__;
-
-/***/ }),
-
 /***/ 715:
 /***/ ((module) => {
 
@@ -265,6 +257,7 @@ var _lib$util = external_commonjs_zeta_dom_commonjs2_zeta_dom_amd_zeta_dom_root_
     noop = _lib$util.noop,
     pipe = _lib$util.pipe,
     either = _lib$util.either,
+    sameValueZero = _lib$util.sameValueZero,
     is = _lib$util.is,
     isUndefinedOrNull = _lib$util.isUndefinedOrNull,
     isArray = _lib$util.isArray,
@@ -329,6 +322,7 @@ var _lib$util = external_commonjs_zeta_dom_commonjs2_zeta_dom_amd_zeta_dom_root_
     lcfirst = _lib$util.lcfirst,
     trim = _lib$util.trim,
     matchWord = _lib$util.matchWord,
+    matchWordMulti = _lib$util.matchWordMulti,
     htmlDecode = _lib$util.htmlDecode,
     resolve = _lib$util.resolve,
     reject = _lib$util.reject,
@@ -398,6 +392,7 @@ var _lib$dom = external_commonjs_zeta_dom_commonjs2_zeta_dom_amd_zeta_dom_root_z
     focusable = _lib$dom.focusable,
     focused = _lib$dom.focused,
     setTabRoot = _lib$dom.setTabRoot,
+    unsetTabRoot = _lib$dom.unsetTabRoot,
     setModal = _lib$dom.setModal,
     releaseModal = _lib$dom.releaseModal,
     retainFocus = _lib$dom.retainFocus,
@@ -423,7 +418,9 @@ var domLock_lib$dom = external_commonjs_zeta_dom_commonjs2_zeta_dom_amd_zeta_dom
 ;// CONCATENATED MODULE: ./tmp/brew-js/domAction.js
 
 var addAsyncAction = external_commonjs_brew_js_commonjs2_brew_js_amd_brew_js_root_brew_.addAsyncAction,
+    isFlyoutOpen = external_commonjs_brew_js_commonjs2_brew_js_amd_brew_js_root_brew_.isFlyoutOpen,
     closeFlyout = external_commonjs_brew_js_commonjs2_brew_js_amd_brew_js_root_brew_.closeFlyout,
+    toggleFlyout = external_commonjs_brew_js_commonjs2_brew_js_amd_brew_js_root_brew_.toggleFlyout,
     openFlyout = external_commonjs_brew_js_commonjs2_brew_js_amd_brew_js_root_brew_.openFlyout;
 
 ;// CONCATENATED MODULE: ./src/dialog.js
@@ -622,6 +619,24 @@ var view_event = {};
 onAppInit(function () {
   app_app.on('beforepageload', function (e) {
     view_event = e;
+    e.waitFor(new Promise(function (resolve) {
+      (function updateViewRecursive(next) {
+        if (!next[0]) {
+          return resolve();
+        }
+
+        resolveAll(map(next, function (v) {
+          return new Promise(function (resolve) {
+            v.onRender = resolve;
+            v.forceUpdate();
+          });
+        })).then(function () {
+          updateViewRecursive(map(next, function (v) {
+            return v.children;
+          }));
+        });
+      })(_(rootContext).children);
+    }));
 
     _(rootContext).setPage(app_app.page);
   });
@@ -632,6 +647,7 @@ function ViewContext(view, page) {
   defineOwnProperty(self, 'view', view, true);
 
   _(self, {
+    children: [],
     setPage: defineObservableProperty(self, 'page', page, true),
     setActive: defineObservableProperty(self, 'active', true, true)
   });
@@ -703,33 +719,27 @@ definePrototype(ErrorBoundary, external_commonjs_react_commonjs2_react_amd_react
 
 function ViewContainer() {
   external_commonjs_react_commonjs2_react_amd_react_root_React_.Component.apply(this, arguments);
-  this.stateId = history.state;
 }
 
 ViewContainer.contextType = StateContext;
 definePrototype(ViewContainer, external_commonjs_react_commonjs2_react_amd_react_root_React_.Component, {
   componentDidMount: function componentDidMount() {
-    /** @type {any} */
     var self = this;
+
+    var parent = _(self.context).children;
+
+    parent.push(self);
     self.componentWillUnmount = combineFn(watch(app_app.route, function () {
       (self.setActive || noop)(self.getViewComponent() === self.currentViewComponent);
-    }), app_app.on('beforepageload', function () {
-      self.stateId = history.state;
-
-      if (self.context === rootContext || self.updateOnNext) {
-        view_event.waitFor(new Promise(function (resolve) {
-          self.onRender = resolve;
-        }));
-        self.updateView();
-        self.forceUpdate();
-      }
-    }));
+    }), function () {
+      arrRemove(parent, self);
+    });
   },
   render: function render() {
     /** @type {any} */
     var self = this;
 
-    if (history.state === self.stateId && self.context.active) {
+    if (self.context.active) {
       self.updateView();
     }
 
@@ -739,21 +749,20 @@ definePrototype(ViewContainer, external_commonjs_react_commonjs2_react_amd_react
   updateView: function updateView() {
     var self = this;
     var V = self.getViewComponent();
-    self.updateOnNext = false;
+    var viewChanged = V !== self.currentViewComponent;
 
-    if (V) {
+    if (V && (viewChanged || !(self.children || '')[0])) {
       // ensure the current path actually corresponds to the matched view
       // when some views are not included in the list of allowed views
       var targetPath = resolvePath(V, getCurrentParams(V, true));
 
       if (targetPath !== removeQueryAndHash(app_app.path)) {
         app_app.navigate(targetPath, true);
-        self.updateOnNext = true;
         return;
       }
     }
 
-    if (V && V !== self.currentViewComponent) {
+    if (V && viewChanged) {
       var prevElement = self.currentElement;
 
       if (prevElement) {
@@ -1153,19 +1162,19 @@ if (toPrimitive) {
 }
 
 function createCallback(translate) {
-  var callback = function callback(key, data) {
-    var result = translate(key, data, true);
+  var callback = function callback(key, data, lang) {
+    var result = translate(key, data, lang, true);
     return result !== undefined ? result : key;
   };
 
   return extend(callback, {
-    html: function html(id, data) {
+    html: function html(id, data, lang) {
       return {
-        __html: translate(id, data)
+        __html: translate(id, data, lang)
       };
     },
-    lazy: function lazy(id, data) {
-      return new TString(translate.bind(0, id, data, true));
+    lazy: function lazy(id, data, lang) {
+      return new TString(translate.bind(0, id, data, lang, true));
     }
   });
 }
@@ -1195,36 +1204,38 @@ function makeTranslation(resources, defaultLang) {
     }
   }
 
-  function translate(key, data, noEncode) {
+  function translate(key, data, lang, noEncode) {
     var prefix = re.test(key) ? RegExp.$1 : '';
     var name = prefix ? key.slice(RegExp.lastMatch.length) : key;
-    return getTranslation(prefix, name, data, noEncode, app_app.language);
+    return getTranslation(prefix, name, data, noEncode, lang || app_app.language);
   }
 
   function getTranslationCallback() {
+    var currentLang = String(this);
     var prefix = makeArray(arguments);
-    var key = prefix.join(' ');
-    return cache[key] || (cache[key] = createCallback(function (key, data, noEncode) {
-      var lang = app_app.language;
+    var key = currentLang + ' ' + prefix.join(' ');
+    return cache[key] || (cache[key] = prefix[0] ? createCallback(function (key, data, lang, noEncode) {
+      lang = lang || currentLang || app_app.language;
       return single(prefix, function (v) {
         return getTranslation(v, key, data, noEncode, lang);
       });
+    }) : createCallback(function (key, data, lang, noEncode) {
+      return translate(key, data, lang || currentLang, noEncode);
     }));
   }
 
   function useTranslation() {
     var language = useLanguage();
-    var t = getTranslationCallback.apply(0, arguments);
+    var t = getTranslationCallback.apply(language, arguments);
     return {
       language: language,
       t: t
     };
   }
 
-  cache[''] = createCallback(translate);
   return {
-    translate: cache[''],
-    getTranslation: getTranslationCallback,
+    translate: createCallback(translate),
+    getTranslation: getTranslationCallback.bind(''),
     useTranslation: useTranslation,
     keys: function keys(prefix) {
       return util_keys(resources[defaultLang][prefix] || empty);
@@ -1534,13 +1545,20 @@ function AnimateSequenceMixin() {
   self.item = new AnimateSequenceItemMixin(self.className);
 }
 definePrototype(AnimateSequenceMixin, AnimateMixin, {
+  withOptions: function withOptions(options) {
+    this.selector = options;
+    return this;
+  },
   reset: function reset() {
     this.item.reset();
     return AnimateSequenceMixinSuper.reset.call(this);
   },
   getCustomAttributes: function getCustomAttributes() {
-    return extend({}, AnimateSequenceMixinSuper.getCustomAttributes.call(this), {
-      'animate-sequence': '.' + this.className
+    var self = this;
+    return extend({}, AnimateSequenceMixinSuper.getCustomAttributes.call(self), {
+      'animate-in': null,
+      'animate-sequence-type': (self.effects || []).join(' '),
+      'animate-sequence': self.selector || '.' + self.className
     });
   },
   clone: function clone() {
@@ -1570,7 +1588,7 @@ definePrototype(FlyoutToggleMixin, ClassNameMixin, {
     var self = this;
     FlyoutToggleMixinSuper.initElement.call(self, element, state);
     self.onDispose(zeta_dom_dom.on(element, 'click', function () {
-      openFlyout(self.flyoutMixin.elements()[0], null, element, true);
+      toggleFlyout(self.flyoutMixin.elements()[0], element);
     }));
   }
 });
@@ -1582,6 +1600,7 @@ definePrototype(FlyoutToggleMixin, ClassNameMixin, {
 
 var FlyoutMixinSuper = ClassNameMixin.prototype;
 var valueMap = new WeakMap();
+var aliasProps = 'animating isFlyoutOpened modal tabThrough visible'.split(' ');
 function FlyoutMixin() {
   var self = this;
   ClassNameMixin.call(self, ['open', 'closing', 'visible', 'tweening-in', 'tweening-out']);
@@ -1663,8 +1682,9 @@ definePrototype(FlyoutMixin, ClassNameMixin, {
     var mixin = extend(FlyoutMixinSuper.clone.call(self), {
       toggle: self.toggle.ref.getMixin()
     });
-    defineAliasProperty(mixin, 'isFlyoutOpened', self);
-    defineAliasProperty(mixin, 'modal', self);
+    each(aliasProps, function (i, v) {
+      defineAliasProperty(mixin, v, self);
+    });
     return mixin;
   },
   onClassNameUpdated: function onClassNameUpdated(element, prevState, state) {
@@ -1750,12 +1770,11 @@ definePrototype(LoadingStateMixin, StatefulMixin, {
     }];
   }
 });
-// EXTERNAL MODULE: external "jQuery"
-var external_jQuery_ = __webpack_require__(145);
-;// CONCATENATED MODULE: ./src/include/external/jquery.js
-// @ts-nocheck
+;// CONCATENATED MODULE: ./tmp/brew-js/directive.js
+
+var getDirectiveComponent = external_commonjs_brew_js_commonjs2_brew_js_amd_brew_js_root_brew_.getDirectiveComponent,
+    registerDirective = external_commonjs_brew_js_commonjs2_brew_js_amd_brew_js_root_brew_.registerDirective;
 
-/* harmony default export */ const jquery = (external_jQuery_);
 ;// CONCATENATED MODULE: ./src/mixins/ScrollableMixin.js
 
 
@@ -1763,6 +1782,7 @@ var external_jQuery_ = __webpack_require__(145);
 
 
 var ScrollableMixinSuper = ClassNameMixin.prototype;
+var ScrollableMixin_aliasProps = 'pageIndex scrolling'.split(' ');
 function ScrollableMixin() {
   var self = this;
   ClassNameMixin.call(self, ['scrollable-x', 'scrollable-x-l', 'scrollable-x-r', 'scrollable-y', 'scrollable-y-d', 'scrollable-y-u']);
@@ -1805,14 +1825,16 @@ definePrototype(ScrollableMixin, ClassNameMixin, {
   },
   clone: function clone() {
     var mixin = ScrollableMixinSuper.clone.call(this);
-    defineAliasProperty(mixin, 'pageIndex', this);
+    each(ScrollableMixin_aliasProps, function (i, v) {
+      defineAliasProperty(mixin, v, self);
+    });
     return mixin;
   }
 });
-each('destroy enable disable setOptions refresh scrollPadding stop scrollLeft scrollTop scrollBy scrollTo scrollByPage scrollToPage scrollToElement', function (i, v) {
+each('destroy enable disable setOptions setStickyPosition refresh scrollPadding stop scrollLeft scrollTop scrollBy scrollTo scrollByPage scrollToPage scrollToElement', function (i, v) {
   defineHiddenProperty(ScrollableMixin.prototype, v, function () {
-    var obj = jquery(this.elements());
-    return obj.scrollable.apply(obj, [v].concat(makeArray(arguments)));
+    var obj = getDirectiveComponent(this.elements()[0]);
+    return obj.scrollable[v].apply(null, arguments);
   });
 });
 ;// CONCATENATED MODULE: ./src/mixins/ScrollIntoViewMixin.js