@frui.ts/views - npm Package Compare versions

Comparing version 1.0.0-beta.6 to 1.0.0-rc.1

dist/errorBoundary.d.ts

@@ -21,4 +21,4 @@ import React from "react";
     componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void;
-    render(): string | number | true | React.ReactFragment | JSX.Element;
+    render(): string | number | true | Iterable<React.ReactNode> | React.JSX.Element;
 }
 export {};

dist/fruits-views.es.js

@@ -1,64 +0,76 @@
-var B = Object.defineProperty;
-var C = (i, e, t) => e in i ? B(i, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : i[e] = t;
-var d = (i, e, t) => (C(i, typeof e != "symbol" ? e + "" : e, t), t), E = (i, e, t) => {
-  if (!e.has(i))
-    throw TypeError("Cannot " + t);
+var C = Object.defineProperty;
+var M = (t, e, n) => e in t ? C(t, e, { enumerable: !0, configurable: !0, writable: !0, value: n }) : t[e] = n;
+var l = (t, e, n) => (M(t, typeof e != "symbol" ? e + "" : e, n), n), y = (t, e, n) => {
+  if (!e.has(t))
+    throw TypeError("Cannot " + n);
 };
-var c = (i, e, t) => (E(i, e, "read from private field"), t ? t.call(i) : e.get(i)), l = (i, e, t) => {
-  if (e.has(i))
+var o = (t, e, n) => (y(t, e, "read from private field"), n ? n.call(t) : e.get(t)), h = (t, e, n) => {
+  if (e.has(t))
     throw TypeError("Cannot add the same private member more than once");
-  e instanceof WeakSet ? e.add(i) : e.set(i, t);
-}, o = (i, e, t, n) => (E(i, e, "write to private field"), n ? n.call(i, t) : e.set(i, t), t);
-import { isObservableMap as N, isObservable as T, isObservableProp as M, action as g, get as j, makeObservable as F } from "mobx";
-import s, { useEffect as L } from "react";
-import { isMap as $, ensureObservableProperty as I } from "@frui.ts/helpers";
+  e instanceof WeakSet ? e.add(t) : e.set(t, n);
+}, m = (t, e, n, r) => (y(t, e, "write to private field"), r ? r.call(t, n) : e.set(t, n), n);
+import { isObservableMap as B, isObservable as N, isObservableProp as T, action as w, get as j, makeObservable as F } from "mobx";
+import s, { useRef as E, useEffect as v } from "react";
+import { isMap as L, ensureObservableProperty as I } from "@frui.ts/helpers";
 import { memoize as O } from "lodash-es";
+import { Mutex as $ } from "async-mutex";
 import { Route as H, RootRoute as S, Outlet as W } from "@tanstack/react-router";
 import { observer as G } from "mobx-react-lite";
-function U(i) {
-  const { target: e, property: t, onValueChanged: n, ...r } = i;
-  return r;
+function U(t) {
+  const { target: e, property: n, onValueChanged: r, ...i } = t;
+  return i;
 }
-function _(i, e, t = !0) {
-  if (!i)
+function _(t, e, n = !0) {
+  if (!t)
     throw new Error(`Cannot read property '${e}', because target has not been set`);
   if (e === void 0)
-    throw new Error(`'property' prop has not been set for target '${i}'`);
-  if (N(i))
-    return i.get(e);
-  if (!T(i) || !M(i, e)) {
-    if ($(i))
-      return i.get(e);
+    throw new Error(`'property' prop has not been set for target '${t}'`);
+  if (B(t))
+    return t.get(e);
+  if (!N(t) || !T(t, e)) {
+    if (L(t))
+      return t.get(e);
     {
-      const n = i[e];
-      if (t)
-        g(I)(i, e, n);
+      const r = t[e];
+      if (n)
+        w(I)(t, e, r);
       else
-        return n;
+        return r;
     }
   }
-  return j(i, e);
+  return j(t, e);
 }
-function z(i, e, t) {
-  i && e && g(I)(i, e, t);
+function P(t, e, n) {
+  t && e && w(I)(t, e, n);
 }
-function le(i) {
-  return [_(i.target, i.property), (n) => {
+function ue(t) {
+  return [_(t.target, t.property), (r) => {
     var a;
-    const r = n;
-    z(i.target, i.property, r), i.target && i.property && ((a = i.onValueChanged) == null || a.call(i, r, i.property, i.target));
+    const i = r;
+    P(t.target, t.property, i), t.target && t.property && ((a = t.onValueChanged) == null || a.call(t, i, t.property, t.target));
   }];
 }
-var X = Object.defineProperty, q = Object.getOwnPropertyDescriptor, J = (i, e, t, n) => {
-  for (var r = n > 1 ? void 0 : n ? q(e, t) : e, a = i.length - 1, w; a >= 0; a--)
-    (w = i[a]) && (r = (n ? w(e, t, r) : w(r)) || r);
-  return n && r && X(e, t, r), r;
+var X = Object.defineProperty, k = Object.getOwnPropertyDescriptor, q = (t, e, n, r) => {
+  for (var i = r > 1 ? void 0 : r ? k(e, n) : e, a = t.length - 1, d; a >= 0; a--)
+    (d = t[a]) && (i = (r ? d(e, n, i) : d(i)) || i);
+  return r && i && X(e, n, i), i;
 };
-class K extends s.Component {
+class J extends s.Component {
   constructor(e) {
     super(e), F(this);
   }
+  /**
+   * Returns `props` excluding properties required for binding.
+   *
+   * This makes it easy to pass the props to the inner user control:
+   * ```ts
+   * render() {
+   *  return <input {...this.inheritedProps} />;
+   * }
+   * ```
+   */
   get inheritedProps() {
     return U(this.props);
   }
+  /** Returns value of the bound property */
   get value() {
@@ -72,55 +84,121 @@ if (!this.props.target) {
   setValue(e) {
-    const { target: t, property: n, onValueChanged: r } = this.props, a = e;
-    z(t, n, a), r == null || r(a, n, t);
+    const { target: n, property: r, onValueChanged: i } = this.props, a = e;
+    P(n, r, a), i == null || i(a, r, n);
   }
 }
-J([
-  g.bound
-], K.prototype, "setValue", 1);
-function ue(i, e) {
-  const t = i;
-  t.defaultProps ? Object.assign(t.defaultProps, e) : t.defaultProps = e;
+q([
+  w.bound
+], J.prototype, "setValue", 1);
+function le(t, e) {
+  const n = t;
+  n.defaultProps ? Object.assign(n.defaultProps, e) : n.defaultProps = e;
 }
-function Q(i) {
+function K(t) {
   return (e) => {
-    const t = e.currentTarget.dataset.id;
-    t !== void 0 && i(+t);
+    const n = e.currentTarget.dataset.id;
+    n !== void 0 && t(+n);
   };
 }
-const fe = O(Q);
-function he(i) {
-  return O((t) => (n) => {
-    const r = n.currentTarget.dataset[i];
-    r !== void 0 && t(r);
+const fe = O(K);
+function de(t) {
+  return O((n) => (r) => {
+    const i = r.currentTarget.dataset[t];
+    i !== void 0 && n(i);
   });
 }
-function de(i) {
+function he(t) {
   return function(e) {
-    e.preventDefault(), e.stopPropagation(), i();
+    e.preventDefault(), e.stopPropagation(), t();
   };
 }
-const V = Object.freeze({
+var u, c;
+class z {
+  constructor(e) {
+    h(this, u, void 0);
+    h(this, c, new $());
+    l(this, "_isInitialized", !1);
+    l(this, "_isActive", !1);
+    this.factory = e;
+  }
+  get instance() {
+    return o(this, u) ?? m(this, u, this.factory()), o(this, u);
+  }
+  resetInstance() {
+    m(this, u, void 0), this._isInitialized = !1, this._isActive = !1;
+  }
+  async initialize(e) {
+    await o(this, c).runExclusive(async () => {
+      await this.callInitialize(e);
+    });
+  }
+  async callInitialize(e) {
+    var n, r;
+    this._isInitialized || (await ((r = (n = this.instance).onInitialize) == null ? void 0 : r.call(n, e)), this._isInitialized = !0);
+  }
+  async activate(e) {
+    await o(this, c).runExclusive(async () => {
+      await this.callInitialize(e), await this.callActivate(e);
+    });
+  }
+  async callActivate(e) {
+    var n, r;
+    this._isActive || (await ((r = (n = this.instance).onActivate) == null ? void 0 : r.call(n, e)), this._isActive = !0);
+  }
+  async navigate(e) {
+    await o(this, c).runExclusive(async () => {
+      await this.callInitialize(e), await this.callActivate(e), await this.callNavigate(e);
+    });
+  }
+  async callNavigate(e) {
+    var n, r;
+    await ((r = (n = this.instance).onNavigate) == null ? void 0 : r.call(n, e));
+  }
+  async deactivate(e) {
+    await o(this, c).runExclusive(async () => {
+      await this.callDeactivate(e);
+    });
+  }
+  async callDeactivate(e) {
+    var n, r;
+    this._isActive && (await ((r = (n = this.instance).onDeactivate) == null ? void 0 : r.call(n, e)), this._isActive = !1);
+  }
+  async close(e) {
+    await o(this, c).runExclusive(async () => {
+      await this.callDeactivate(e), this.resetInstance();
+    });
+  }
+}
+u = new WeakMap(), c = new WeakMap();
+function me(t, e, n) {
+  const r = E(new z(t)), i = E(e);
+  return i.current = e, v(() => (r.current.initialize(i.current), () => {
+    r.current.close(i.current);
+  }), []), v(() => {
+    r.current.navigate(i.current);
+  }, n ?? [e]), r.current.instance;
+}
+const b = Object.freeze({
   errorInfo: null,
   error: null
 });
-class Y extends s.PureComponent {
+class Q extends s.PureComponent {
   constructor() {
     super(...arguments);
-    d(this, "state", V);
-    d(this, "resetErrorBoundary", () => {
-      const { onReset: t } = this.props;
-      if (t) {
-        const { error: n, errorInfo: r } = this.state;
-        t(n, r);
+    l(this, "state", b);
+    l(this, "resetErrorBoundary", () => {
+      const { onReset: n } = this.props;
+      if (n) {
+        const { error: r, errorInfo: i } = this.state;
+        n(r, i);
       }
-      this.setState(V);
+      this.setState(b);
     });
   }
-  componentDidCatch(t, n) {
-    var r, a;
-    (a = (r = this.props).onError) == null || a.call(r, t, n), this.setState({ error: t, errorInfo: n });
+  componentDidCatch(n, r) {
+    var i, a;
+    (a = (i = this.props).onError) == null || a.call(i, n, r), this.setState({ error: n, errorInfo: r });
   }
   render() {
     if (this.state.error) {
-      const { error: t, errorInfo: n } = this.state, { fallback: r } = this.props, a = typeof r == "function" ? r({ error: t, errorInfo: n, resetError: this.resetErrorBoundary }) : r;
+      const { error: n, errorInfo: r } = this.state, { fallback: i } = this.props, a = typeof i == "function" ? i({ error: n, errorInfo: r, resetError: this.resetErrorBoundary }) : i;
       return a || /* @__PURE__ */ s.createElement("p", null, "Something went wrong :-(");
@@ -131,153 +209,79 @@ }
 }
-const y = "default", p = /* @__PURE__ */ new Map();
-function Z(i, e, t = y) {
-  const n = p.get(e);
-  return n ? n[t] = i : p.set(e, { [t]: i }), i;
+const p = "default", f = /* @__PURE__ */ new Map();
+function Y(t, e, n = p) {
+  const r = f.get(e);
+  return r ? r[n] = t : f.set(e, { [n]: t }), t;
 }
-function k(i, e = y) {
-  const t = p.get(i);
-  if (!t)
-    throw new Error("No view has been registered for view model " + i.name);
-  const n = t[e];
+function Z(t, e = p) {
+  const n = f.get(t);
   if (!n)
-    throw new Error(`No view has been registered for view model ${i.name} and context ${e}`);
-  return n;
+    throw new Error("No view has been registered for view model " + t.name);
+  const r = n[e];
+  if (!r)
+    throw new Error(`No view has been registered for view model ${t.name} and context ${e}`);
+  return r;
 }
-function x(i, e = y) {
-  const t = p.get(i);
-  if (!t)
+function x(t, e = p) {
+  const n = f.get(t);
+  if (!n)
     return null;
-  const n = t[e];
-  return n || null;
+  const r = n[e];
+  return r || null;
 }
-const b = (i) => {
-  const { vm: e, children: t, context: n } = i;
+const g = (t) => {
+  const { vm: e, children: n, context: r } = t;
   if (!e)
-    return /* @__PURE__ */ s.createElement(s.Fragment, null, t);
-  const r = e.constructor, a = t === void 0 ? k(r, n) : x(r, n);
-  return a ? /* @__PURE__ */ s.createElement(a, {
-    vm: e
-  }) : /* @__PURE__ */ s.createElement(s.Fragment, null, t);
+    return /* @__PURE__ */ s.createElement(s.Fragment, null, n);
+  const i = e.constructor, a = n === void 0 ? Z(i, r) : x(i, r);
+  return a ? /* @__PURE__ */ s.createElement(a, { vm: e }) : /* @__PURE__ */ s.createElement(s.Fragment, null, n);
 };
-b.displayName = "View";
-const D = (i) => {
-  const { onError: e, onReset: t, fallback: n, ...r } = i;
-  return /* @__PURE__ */ s.createElement(Y, {
-    onError: e,
-    onReset: t,
-    fallback: n
-  }, /* @__PURE__ */ s.createElement(b, {
-    ...r
-  }));
+g.displayName = "View";
+const D = (t) => {
+  const { onError: e, onReset: n, fallback: r, ...i } = t;
+  return /* @__PURE__ */ s.createElement(Q, { onError: e, onReset: n, fallback: r }, /* @__PURE__ */ s.createElement(g, { ...i }));
 };
 D.displayName = "View.ErrorBoundary";
-const A = b;
+const A = g;
 A.ErrorBoundary = D;
-var u, f, h, m, v;
-class ee {
-  constructor(e) {
-    l(this, u, void 0);
-    d(this, "_isInitialized", !1);
-    l(this, f, void 0);
-    d(this, "_isActive", !1);
-    l(this, h, void 0);
-    l(this, m, void 0);
-    l(this, v, void 0);
-    this.factory = e;
-  }
-  get instance() {
-    var e;
-    return (e = c(this, u)) != null || o(this, u, this.factory()), c(this, u);
-  }
-  resetInstance() {
-    o(this, u, void 0), this._isInitialized = !1, this._isActive = !1;
-  }
-  async initialize(e) {
-    var t;
-    await ((t = c(this, f)) != null ? t : o(this, f, new Promise(
-      (n, r) => void this.callInitialize(e).then(n, r).finally(() => o(this, f, void 0))
-    )));
-  }
-  async callInitialize(e) {
-    var t, n;
-    this._isInitialized || (await ((n = (t = this.instance).onInitialize) == null ? void 0 : n.call(t, e)), this._isInitialized = !0);
-  }
-  async activate(e) {
-    var t;
-    await this.initialize(e), await ((t = c(this, h)) != null ? t : o(this, h, new Promise(
-      (n, r) => void this.callActivate(e).then(n, r).finally(() => o(this, h, void 0))
-    )));
-  }
-  async callActivate(e) {
-    var t, n;
-    this._isActive || (await ((n = (t = this.instance).onActivate) == null ? void 0 : n.call(t, e)), this._isActive = !0);
-  }
-  async navigate(e) {
-    var t;
-    await this.activate(e), await ((t = c(this, m)) != null ? t : o(this, m, new Promise(
-      (n, r) => void this.callNavigate(e).then(n, r).finally(() => o(this, m, void 0))
-    )));
-  }
-  async callNavigate(e) {
-    var t, n;
-    await ((n = (t = this.instance).onNavigate) == null ? void 0 : n.call(t, e));
-  }
-  async deactivate(e) {
-    var t;
-    await c(this, f), await c(this, h), await ((t = c(this, v)) != null ? t : o(this, v, new Promise(
-      (n, r) => void this.callDeactivate(e).then(n, r).finally(() => o(this, v, void 0))
-    )));
-  }
-  async callDeactivate(e) {
-    var t, n;
-    this._isActive && (await ((n = (t = this.instance).onDeactivate) == null ? void 0 : n.call(t, e)), this._isActive = !1);
-  }
-  async close(e) {
-    await this.deactivate(e), this.resetInstance();
-  }
-}
-u = new WeakMap(), f = new WeakMap(), h = new WeakMap(), m = new WeakMap(), v = new WeakMap();
-function R(i) {
-  const e = new ee(i);
-  let t = 0;
+function R(t) {
+  const e = new z(t);
+  let n = 0;
   return {
-    async onLoad(n) {
+    async onLoad(r) {
       await e.initialize({
-        isPreload: n.preload,
-        params: n.params,
-        search: n.search
-      }), n.preload || (t++, e.navigate({ params: n.params, search: n.search }));
+        isPreload: r.preload,
+        params: r.params,
+        search: r.search
+      }), r.preload || (n++, e.navigate({ params: r.params, search: r.search }));
     },
     onLoaded() {
-      return (n) => {
-        --t === 0 && e.close({ params: n.params, search: n.search });
+      return (r) => {
+        --n === 0 && e.close({ params: r.params, search: r.search });
       };
     },
-    component: () => /* @__PURE__ */ s.createElement(A, {
-      vm: e.instance
-    }, /* @__PURE__ */ s.createElement(W, null))
+    component: () => /* @__PURE__ */ s.createElement(A, { vm: e.instance }, /* @__PURE__ */ s.createElement(W, null))
   };
 }
-function me(i, e) {
-  const t = R(i), n = Object.assign(e, t);
-  return new H(n);
+function ve(t, e) {
+  const n = R(t), r = Object.assign(e, n);
+  return new H(r);
 }
-function ve(i, e) {
-  const t = R(i), n = Object.assign(e, t);
-  return new S(n);
+function we(t, e) {
+  const n = R(t), r = Object.assign(e, n);
+  return new S(r);
 }
-function te(i) {
-  return G(({ vm: e }) => i(e));
+function ee(t) {
+  return G(({ vm: e }) => t(e));
 }
-function pe(i, e, t) {
-  return t ? P(i, e, t) : P(i, void 0, e);
+function pe(t, e, n) {
+  return n ? V(t, e, n) : V(t, void 0, e);
 }
-function P(i, e, t) {
-  const n = te(t);
-  return Z(n, i, e), n;
+function V(t, e, n) {
+  const r = ee(n);
+  return Y(r, t, e), r;
 }
-function we(...i) {
-  L(
+function ge(...t) {
+  v(
     () => () => {
-      i.forEach((e) => e.dispose());
+      t.forEach((e) => e.dispose());
     },
@@ -288,21 +292,22 @@ []
 export {
-  K as BindingComponent,
+  J as BindingComponent,
   A as View,
-  ue as assignDefaultProps,
-  ve as buildRootRoute,
-  me as buildRoute,
+  le as assignDefaultProps,
+  we as buildRootRoute,
+  ve as buildRoute,
   fe as createDataIdHandler,
-  he as createMemoizedHandler,
-  te as createViewComponent,
+  de as createMemoizedHandler,
+  ee as createViewComponent,
   _ as getValue,
-  k as getView,
+  Z as getView,
   U as omitBindingProps,
-  de as preventDefault,
-  Z as registerView,
+  he as preventDefault,
+  Y as registerView,
   pe as registerViewComponent,
-  z as setValue,
+  P as setValue,
   x as tryGetView,
-  le as useBinding,
-  we as useDisposable
+  ue as useBinding,
+  ge as useDisposable,
+  me as useViewModel
 };
 //# sourceMappingURL=fruits-views.es.js.map

dist/fruits-views.umd.js

@@ -1,2 +0,2 @@
-var ie=Object.defineProperty;var ne=(a,s,o)=>s in a?ie(a,s,{enumerable:!0,configurable:!0,writable:!0,value:o}):a[s]=o;var y=(a,s,o)=>(ne(a,typeof s!="symbol"?s+"":s,o),o),S=(a,s,o)=>{if(!s.has(a))throw TypeError("Cannot "+o)};var f=(a,s,o)=>(S(a,s,"read from private field"),o?o.call(a):s.get(a)),m=(a,s,o)=>{if(s.has(a))throw TypeError("Cannot add the same private member more than once");s instanceof WeakSet?s.add(a):s.set(a,o)},l=(a,s,o,d)=>(S(a,s,"write to private field"),d?d.call(a,o):s.set(a,o),o);(function(a,s){typeof exports=="object"&&typeof module<"u"?s(exports,require("mobx"),require("react"),require("@frui.ts/helpers"),require("lodash-es"),require("@tanstack/react-router"),require("mobx-react-lite")):typeof define=="function"&&define.amd?define(["exports","mobx","react","@frui.ts/helpers","lodash-es","@tanstack/react-router","mobx-react-lite"],s):(a=typeof globalThis<"u"?globalThis:a||self,s(a["fruits-views"]={},a.mobx,a.React,a.helpers,a.lodashEs,a.reactRouter,a.mobxReactLite))})(this,function(a,s,o,d,z,b,F){var h,v,w,p,g;"use strict";const u=(i=>i&&typeof i=="object"&&"default"in i?i:{default:i})(o);function R(i){const{target:e,property:t,onValueChanged:n,...r}=i;return r}function P(i,e,t=!0){if(!i)throw new Error(`Cannot read property '${e}', because target has not been set`);if(e===void 0)throw new Error(`'property' prop has not been set for target '${i}'`);if(s.isObservableMap(i))return i.get(e);if(!s.isObservable(i)||!s.isObservableProp(i,e)){if(d.isMap(i))return i.get(e);{const n=i[e];if(t)s.action(d.ensureObservableProperty)(i,e,n);else return n}}return s.get(i,e)}function E(i,e,t){i&&e&&s.action(d.ensureObservableProperty)(i,e,t)}function H(i){return[P(i.target,i.property),n=>{var c;const r=n;E(i.target,i.property,r),i.target&&i.property&&((c=i.onValueChanged)==null||c.call(i,r,i.property,i.target))}]}var $=Object.defineProperty,G=Object.getOwnPropertyDescriptor,W=(i,e,t,n)=>{for(var r=n>1?void 0:n?G(e,t):e,c=i.length-1,D;c>=0;c--)(D=i[c])&&(r=(n?D(e,t,r):D(r))||r);return n&&r&&$(e,t,r),r};class A extends u.default.Component{constructor(e){super(e),s.makeObservable(this)}get inheritedProps(){return R(this.props)}get value(){if(!this.props.target){console.warn("'target' has not been set");return}return P(this.props.target,this.props.property)}setValue(e){const{target:t,property:n,onValueChanged:r}=this.props,c=e;E(t,n,c),r==null||r(c,n,t)}}W([s.action.bound],A.prototype,"setValue",1);function k(i,e){const t=i;t.defaultProps?Object.assign(t.defaultProps,e):t.defaultProps=e}function U(i){return e=>{const t=e.currentTarget.dataset.id;t!==void 0&&i(+t)}}const X=z.memoize(U);function J(i){const e=t=>n=>{const r=n.currentTarget.dataset[i];r!==void 0&&t(r)};return z.memoize(e)}function K(i){return function(e){e.preventDefault(),e.stopPropagation(),i()}}const B=Object.freeze({errorInfo:null,error:null});class Q extends u.default.PureComponent{constructor(){super(...arguments);y(this,"state",B);y(this,"resetErrorBoundary",()=>{const{onReset:t}=this.props;if(t){const{error:n,errorInfo:r}=this.state;t(n,r)}this.setState(B)})}componentDidCatch(t,n){var r,c;(c=(r=this.props).onError)==null||c.call(r,t,n),this.setState({error:t,errorInfo:n})}render(){if(this.state.error){const{error:t,errorInfo:n}=this.state,{fallback:r}=this.props,c=typeof r=="function"?r({error:t,errorInfo:n,resetError:this.resetErrorBoundary}):r;return c||u.default.createElement("p",null,"Something went wrong :-(")}return u.default.createElement(u.default.Fragment,null,this.props.children)}}const _="default",V=new Map;function C(i,e,t=_){const n=V.get(e);return n?n[t]=i:V.set(e,{[t]:i}),i}function T(i,e=_){const t=V.get(i);if(!t)throw new Error("No view has been registered for view model "+i.name);const n=t[e];if(!n)throw new Error(`No view has been registered for view model ${i.name} and context ${e}`);return n}function M(i,e=_){const t=V.get(i);if(!t)return null;const n=t[e];return n||null}const O=i=>{const{vm:e,children:t,context:n}=i;if(!e)return u.default.createElement(u.default.Fragment,null,t);const r=e.constructor,c=t===void 0?T(r,n):M(r,n);return c?u.default.createElement(c,{vm:e}):u.default.createElement(u.default.Fragment,null,t)};O.displayName="View";const j=i=>{const{onError:e,onReset:t,fallback:n,...r}=i;return u.default.createElement(Q,{onError:e,onReset:t,fallback:n},u.default.createElement(O,{...r}))};j.displayName="View.ErrorBoundary";const I=O;I.ErrorBoundary=j;class Y{constructor(e){m(this,h,void 0);y(this,"_isInitialized",!1);m(this,v,void 0);y(this,"_isActive",!1);m(this,w,void 0);m(this,p,void 0);m(this,g,void 0);this.factory=e}get instance(){var e;return(e=f(this,h))!=null||l(this,h,this.factory()),f(this,h)}resetInstance(){l(this,h,void 0),this._isInitialized=!1,this._isActive=!1}async initialize(e){var t;await((t=f(this,v))!=null?t:l(this,v,new Promise((n,r)=>void this.callInitialize(e).then(n,r).finally(()=>l(this,v,void 0)))))}async callInitialize(e){var t,n;this._isInitialized||(await((n=(t=this.instance).onInitialize)==null?void 0:n.call(t,e)),this._isInitialized=!0)}async activate(e){var t;await this.initialize(e),await((t=f(this,w))!=null?t:l(this,w,new Promise((n,r)=>void this.callActivate(e).then(n,r).finally(()=>l(this,w,void 0)))))}async callActivate(e){var t,n;this._isActive||(await((n=(t=this.instance).onActivate)==null?void 0:n.call(t,e)),this._isActive=!0)}async navigate(e){var t;await this.activate(e),await((t=f(this,p))!=null?t:l(this,p,new Promise((n,r)=>void this.callNavigate(e).then(n,r).finally(()=>l(this,p,void 0)))))}async callNavigate(e){var t,n;await((n=(t=this.instance).onNavigate)==null?void 0:n.call(t,e))}async deactivate(e){var t;await f(this,v),await f(this,w),await((t=f(this,g))!=null?t:l(this,g,new Promise((n,r)=>void this.callDeactivate(e).then(n,r).finally(()=>l(this,g,void 0)))))}async callDeactivate(e){var t,n;this._isActive&&(await((n=(t=this.instance).onDeactivate)==null?void 0:n.call(t,e)),this._isActive=!1)}async close(e){await this.deactivate(e),this.resetInstance()}}h=new WeakMap,v=new WeakMap,w=new WeakMap,p=new WeakMap,g=new WeakMap;function N(i){const e=new Y(i);let t=0;return{async onLoad(n){await e.initialize({isPreload:n.preload,params:n.params,search:n.search}),n.preload||(t++,e.navigate({params:n.params,search:n.search}))},onLoaded(){return n=>{--t===0&&e.close({params:n.params,search:n.search})}},component:()=>u.default.createElement(I,{vm:e.instance},u.default.createElement(b.Outlet,null))}}function Z(i,e){const t=N(i),n=Object.assign(e,t);return new b.Route(n)}function x(i,e){const t=N(i),n=Object.assign(e,t);return new b.RootRoute(n)}function L(i){return F.observer(({vm:e})=>i(e))}function ee(i,e,t){return t?q(i,e,t):q(i,void 0,e)}function q(i,e,t){const n=L(t);return C(n,i,e),n}function te(...i){o.useEffect(()=>()=>{i.forEach(e=>e.dispose())},[])}a.BindingComponent=A,a.View=I,a.assignDefaultProps=k,a.buildRootRoute=x,a.buildRoute=Z,a.createDataIdHandler=X,a.createMemoizedHandler=J,a.createViewComponent=L,a.getValue=P,a.getView=T,a.omitBindingProps=R,a.preventDefault=K,a.registerView=C,a.registerViewComponent=ee,a.setValue=E,a.tryGetView=M,a.useBinding=H,a.useDisposable=te,Object.defineProperties(a,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+(function(r,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("mobx"),require("react"),require("@frui.ts/helpers"),require("lodash-es"),require("async-mutex"),require("@tanstack/react-router"),require("mobx-react-lite")):typeof define=="function"&&define.amd?define(["exports","mobx","react","@frui.ts/helpers","lodash-es","async-mutex","@tanstack/react-router","mobx-react-lite"],o):(r=typeof globalThis<"u"?globalThis:r||self,o(r["fruits-views"]={},r.mobx,r.React,r.helpers,r.lodashEs,r.asyncMutex,r.reactRouter,r.mobxReactLite))})(this,function(r,o,a,f,I,L,v,S){var d,c;"use strict";var ee=Object.defineProperty;var te=(r,o,a)=>o in r?ee(r,o,{enumerable:!0,configurable:!0,writable:!0,value:a}):r[o]=a;var h=(r,o,a)=>(te(r,typeof o!="symbol"?o+"":o,a),a),q=(r,o,a)=>{if(!o.has(r))throw TypeError("Cannot "+a)};var l=(r,o,a)=>(q(r,o,"read from private field"),a?a.call(r):o.get(r)),b=(r,o,a)=>{if(o.has(r))throw TypeError("Cannot add the same private member more than once");o instanceof WeakSet?o.add(r):o.set(r,a)},O=(r,o,a,f)=>(q(r,o,"write to private field"),f?f.call(r,a):o.set(r,a),a);function P(t){const{target:e,property:n,onValueChanged:i,...s}=t;return s}function m(t,e,n=!0){if(!t)throw new Error(`Cannot read property '${e}', because target has not been set`);if(e===void 0)throw new Error(`'property' prop has not been set for target '${t}'`);if(o.isObservableMap(t))return t.get(e);if(!o.isObservable(t)||!o.isObservableProp(t,e)){if(f.isMap(t))return t.get(e);{const i=t[e];if(n)o.action(f.ensureObservableProperty)(t,e,i);else return i}}return o.get(t,e)}function p(t,e,n){t&&e&&o.action(f.ensureObservableProperty)(t,e,n)}function F(t){return[m(t.target,t.property),i=>{var u;const s=i;p(t.target,t.property,s),t.target&&t.property&&((u=t.onValueChanged)==null||u.call(t,s,t.property,t.target))}]}var H=Object.defineProperty,$=Object.getOwnPropertyDescriptor,k=(t,e,n,i)=>{for(var s=i>1?void 0:i?$(e,n):e,u=t.length-1,E;u>=0;u--)(E=t[u])&&(s=(i?E(e,n,s):E(s))||s);return i&&s&&H(e,n,s),s};class _ extends a.Component{constructor(e){super(e),o.makeObservable(this)}get inheritedProps(){return P(this.props)}get value(){if(!this.props.target){console.warn("'target' has not been set");return}return m(this.props.target,this.props.property)}setValue(e){const{target:n,property:i,onValueChanged:s}=this.props,u=e;p(n,i,u),s==null||s(u,i,n)}}k([o.action.bound],_.prototype,"setValue",1);function G(t,e){const n=t;n.defaultProps?Object.assign(n.defaultProps,e):n.defaultProps=e}function W(t){return e=>{const n=e.currentTarget.dataset.id;n!==void 0&&t(+n)}}const U=I.memoize(W);function X(t){const e=n=>i=>{const s=i.currentTarget.dataset[t];s!==void 0&&n(s)};return I.memoize(e)}function J(t){return function(e){e.preventDefault(),e.stopPropagation(),t()}}class z{constructor(e){b(this,d,void 0);b(this,c,new L.Mutex);h(this,"_isInitialized",!1);h(this,"_isActive",!1);this.factory=e}get instance(){return l(this,d)??O(this,d,this.factory()),l(this,d)}resetInstance(){O(this,d,void 0),this._isInitialized=!1,this._isActive=!1}async initialize(e){await l(this,c).runExclusive(async()=>{await this.callInitialize(e)})}async callInitialize(e){var n,i;this._isInitialized||(await((i=(n=this.instance).onInitialize)==null?void 0:i.call(n,e)),this._isInitialized=!0)}async activate(e){await l(this,c).runExclusive(async()=>{await this.callInitialize(e),await this.callActivate(e)})}async callActivate(e){var n,i;this._isActive||(await((i=(n=this.instance).onActivate)==null?void 0:i.call(n,e)),this._isActive=!0)}async navigate(e){await l(this,c).runExclusive(async()=>{await this.callInitialize(e),await this.callActivate(e),await this.callNavigate(e)})}async callNavigate(e){var n,i;await((i=(n=this.instance).onNavigate)==null?void 0:i.call(n,e))}async deactivate(e){await l(this,c).runExclusive(async()=>{await this.callDeactivate(e)})}async callDeactivate(e){var n,i;this._isActive&&(await((i=(n=this.instance).onDeactivate)==null?void 0:i.call(n,e)),this._isActive=!1)}async close(e){await l(this,c).runExclusive(async()=>{await this.callDeactivate(e),this.resetInstance()})}}d=new WeakMap,c=new WeakMap;function K(t,e,n){const i=a.useRef(new z(t)),s=a.useRef(e);return s.current=e,a.useEffect(()=>(i.current.initialize(s.current),()=>{i.current.close(s.current)}),[]),a.useEffect(()=>{i.current.navigate(s.current)},n??[e]),i.current.instance}const D=Object.freeze({errorInfo:null,error:null});class Q extends a.PureComponent{constructor(){super(...arguments);h(this,"state",D);h(this,"resetErrorBoundary",()=>{const{onReset:n}=this.props;if(n){const{error:i,errorInfo:s}=this.state;n(i,s)}this.setState(D)})}componentDidCatch(n,i){var s,u;(u=(s=this.props).onError)==null||u.call(s,n,i),this.setState({error:n,errorInfo:i})}render(){if(this.state.error){const{error:n,errorInfo:i}=this.state,{fallback:s}=this.props,u=typeof s=="function"?s({error:n,errorInfo:i,resetError:this.resetErrorBoundary}):s;return u||a.createElement("p",null,"Something went wrong :-(")}return a.createElement(a.Fragment,null,this.props.children)}}const g="default",w=new Map;function M(t,e,n=g){const i=w.get(e);return i?i[n]=t:w.set(e,{[n]:t}),t}function A(t,e=g){const n=w.get(t);if(!n)throw new Error("No view has been registered for view model "+t.name);const i=n[e];if(!i)throw new Error(`No view has been registered for view model ${t.name} and context ${e}`);return i}function C(t,e=g){const n=w.get(t);if(!n)return null;const i=n[e];return i||null}const y=t=>{const{vm:e,children:n,context:i}=t;if(!e)return a.createElement(a.Fragment,null,n);const s=e.constructor,u=n===void 0?A(s,i):C(s,i);return u?a.createElement(u,{vm:e}):a.createElement(a.Fragment,null,n)};y.displayName="View";const B=t=>{const{onError:e,onReset:n,fallback:i,...s}=t;return a.createElement(Q,{onError:e,onReset:n,fallback:i},a.createElement(y,{...s}))};B.displayName="View.ErrorBoundary";const V=y;V.ErrorBoundary=B;function T(t){const e=new z(t);let n=0;return{async onLoad(i){await e.initialize({isPreload:i.preload,params:i.params,search:i.search}),i.preload||(n++,e.navigate({params:i.params,search:i.search}))},onLoaded(){return i=>{--n===0&&e.close({params:i.params,search:i.search})}},component:()=>a.createElement(V,{vm:e.instance},a.createElement(v.Outlet,null))}}function Y(t,e){const n=T(t),i=Object.assign(e,n);return new v.Route(i)}function Z(t,e){const n=T(t),i=Object.assign(e,n);return new v.RootRoute(i)}function N(t){return S.observer(({vm:e})=>t(e))}function R(t,e,n){return n?j(t,e,n):j(t,void 0,e)}function j(t,e,n){const i=N(n);return M(i,t,e),i}function x(...t){a.useEffect(()=>()=>{t.forEach(e=>e.dispose())},[])}r.BindingComponent=_,r.View=V,r.assignDefaultProps=G,r.buildRootRoute=Z,r.buildRoute=Y,r.createDataIdHandler=U,r.createMemoizedHandler=X,r.createViewComponent=N,r.getValue=m,r.getView=A,r.omitBindingProps=P,r.preventDefault=J,r.registerView=M,r.registerViewComponent=R,r.setValue=p,r.tryGetView=C,r.useBinding=F,r.useDisposable=x,r.useViewModel=K,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})});
 //# sourceMappingURL=fruits-views.umd.js.map

dist/index.d.ts

@@ -8,2 +8,3 @@ export * from "./binding/bindingComponent";
 export { default as preventDefault } from "./helpers/preventDefault";
+export * from "./hooks/useViewModel";
 export * from "./router/router";
@@ -13,4 +14,4 @@ export * from "./router/types";
 export * from "./view/helpers";
-export { default as useDisposable } from "./view/useDisposable";
+export * from "./hooks/useDisposable";
 export { default as View } from "./view/view";
 export * from "./view/viewLocator";

dist/router/types.d.ts

@@ -0,1 +1,2 @@
+import type { IViewModel } from "../types";
 export type NoParams = Record<never, string>;
@@ -7,8 +8,2 @@ export interface NavigationContext<TParams extends Record<string, string> = NoParams, TSearch = unknown> {
 }
-export interface IViewModel<TParams extends Record<string, string> = NoParams, TSearch = unknown> {
-    onInitialize?(context: NavigationContext<TParams, TSearch>): Promise<unknown> | unknown;
-    onActivate?(context: NavigationContext<TParams, TSearch>): Promise<unknown> | unknown;
-    onNavigate?(context: NavigationContext<TParams, TSearch>): Promise<unknown> | unknown;
-    onSearchChanged?(context: NavigationContext<TParams, TSearch>): Promise<unknown> | unknown;
-    onDeactivate?(context: NavigationContext<TParams, TSearch>): Promise<unknown> | unknown;
-}
+export type IRouteViewModel<TParams extends Record<string, string> = NoParams, TSearch = unknown> = IViewModel<NavigationContext<TParams, TSearch>>;

dist/types.d.ts

@@ -10,1 +10,8 @@ import type React from "react";
 export type ViewComponent<TViewModel> = React.FunctionComponent<ViewProps<TViewModel>>;
+export interface IViewModel<TContext> {
+    onInitialize?(context: TContext): Promise<unknown> | unknown;
+    onActivate?(context: TContext): Promise<unknown> | unknown;
+    onNavigate?(context: TContext): Promise<unknown> | unknown;
+    onSearchChanged?(context: TContext): Promise<unknown> | unknown;
+    onDeactivate?(context: TContext): Promise<unknown> | unknown;
+}

package.json

@@ -6,3 +6,3 @@ {
   },
-  "version": "1.0.0-beta.6",
+  "version": "1.0.0-rc.1",
   "description": "Frui.ts presentation related components based on React",
@@ -43,9 +43,10 @@ "keywords": [
   "devDependencies": {
-    "@types/lodash": "4.14.190",
-    "@types/lodash-es": "4.17.6",
-    "@types/react": "^18.0.25"
+    "@types/lodash": "4.14.195",
+    "@types/lodash-es": "4.17.7",
+    "@types/react": "^18.2.11"
   },
   "dependencies": {
-    "@frui.ts/helpers": "^1.0.0-beta.6",
+    "@frui.ts/helpers": "^1.0.0-rc.1",
     "@tanstack/react-router": "^0.0.1-beta.82",
+    "async-mutex": "^0.4.0",
     "inversify": "^6.0.1",
@@ -60,3 +61,3 @@ "lodash-es": "^4.17.21"
   },
-  "gitHead": "adf52b1d60660fc686182547cca34af079bdecf4"
+  "gitHead": "c17e77c7246207827d09d34cadbb54b07ebbd82e"
 }

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Number of package files

25

increased by4.17%

Lines of code

1126

increased by0.9%

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

301570

decreased by-0.08%

Dependency count

9

increased by12.5%

Dependency changes

• + Addedasync-mutex@^0.4.0

• + Addedasync-mutex@0.4.1(transitive)

• + Addedtslib@2.8.1(transitive)

• [e-mail]/helpers@^1.0.0-rc.1