@rive-app/webgl2 2.26.5 → 2.26.7

package/rive.js

@@ -175,8 +175,8 @@ k.onRuntimeInitialized = function() {
     this.transform = function(u) {
       this.S.push(d.transform.bind(d, u));
     };
-    this.align = function(u, y, z, A, G = 1.0) {
-      this.S.push(d.align.bind(d, u, y, z, A, G));
+    this.align = function(u, y, z, A, H = 1.0) {
+      this.S.push(d.align.bind(d, u, y, z, A, H));
     };
     this.flush = function() {
       console.assert(0 == this.la);
@@ -203,19 +203,19 @@ k.onRuntimeInitialized = function() {
     var A = z.delete;
     z.delete = function() {
       A.call(this);
-      var G = this.Ka;
-      r === w[G] && (r = null);
-      "object" == typeof JSEvents && JSEvents.Oc(w[G].D.canvas);
-      w[G] && w[G].D.canvas && (w[G].D.canvas.zb = void 0);
-      this.Ka = this.F = this.La = this.T = w[G] = null;
+      var H = this.Ka;
+      r === w[H] && (r = null);
+      "object" == typeof JSEvents && JSEvents.Oc(w[H].D.canvas);
+      w[H] && w[H].D.canvas && (w[H].D.canvas.zb = void 0);
+      this.Ka = this.F = this.La = this.T = w[H] = null;
     };
     return z;
   }
   function c() {
     if (d) {
-      var q = d.Cb, u = 0, y = 0, z = 0, A = Array(e.size), G = 0;
+      var q = d.Cb, u = 0, y = 0, z = 0, A = Array(e.size), H = 0;
       for (var I of e) {
-        I.fa = Math.min(I.F.width, q), I.ea = Math.min(I.F.height, q), I.Ia = I.ea * I.fa, u = Math.max(u, I.fa), y = Math.max(y, I.ea), z += I.Ia, A[G++] = I;
+        I.fa = Math.min(I.F.width, q), I.ea = Math.min(I.F.height, q), I.Ia = I.ea * I.fa, u = Math.max(u, I.fa), y = Math.max(y, I.ea), z += I.Ia, A[H++] = I;
       }
       e.clear();
       if (!(0 >= z)) {
@@ -229,10 +229,10 @@ k.onRuntimeInitialized = function() {
         z = new k.DynamicRectanizer(q);
         for (I = 0; I < A.length;) {
           z.reset(u, y);
-          for (G = I; G < A.length; ++G) {
-            var L = A[G], E = z.addRect(L.fa, L.ea);
+          for (H = I; H < A.length; ++H) {
+            var L = A[H], E = z.addRect(L.fa, L.ea);
             if (0 > E) {
-              console.assert(G > I);
+              console.assert(H > I);
               break;
             }
             L.ra = E & 65535;
@@ -247,7 +247,7 @@ k.onRuntimeInitialized = function() {
           d.F.width != L && (d.F.width = L);
           d.F.height != E && (d.F.height = E);
           d.clear();
-          for (L = I; L < G; ++L) {
+          for (L = I; L < H; ++L) {
             E = A[L];
             d.saveClipRect(E.ra, E.sa, E.ra + E.fa, E.sa + E.ea);
             let ba = new k.Mat2D();
@@ -263,10 +263,10 @@ k.onRuntimeInitialized = function() {
             d.restoreClipRect();
             E.S = [];
           }
-          for (d.flush(); I < G; ++I) {
+          for (d.flush(); I < H; ++I) {
             L = A[I], E = L.Ab, E.globalCompositeOperation = "copy", E.drawImage(d.F, L.ra, L.sa, L.fa, L.ea, 0, 0, L.F.width, L.F.height);
           }
-          I = G;
+          I = H;
         }
       }
     }
@@ -363,11 +363,11 @@ var sa;
 k.wasmBinary && (sa = k.wasmBinary);
 var noExitRuntime = k.noExitRuntime || !0;
 "object" != typeof WebAssembly && ta("no native wasm support detected");
-var ua, C, va = !1, D, F, H, wa, J, K, xa, ya;
+var ua, C, va = !1, D, F, G, wa, J, K, xa, ya;
 function za() {
   var a = ua.buffer;
   k.HEAP8 = D = new Int8Array(a);
-  k.HEAP16 = H = new Int16Array(a);
+  k.HEAP16 = G = new Int16Array(a);
   k.HEAP32 = J = new Int32Array(a);
   k.HEAPU8 = F = new Uint8Array(a);
   k.HEAPU16 = wa = new Uint16Array(a);
@@ -442,7 +442,7 @@ function Oa(a, b) {
     return Na(c, a, b);
   }));
 }
-var Pa, Qa, Ua = {509966:(a, b, c, d, e) => {
+var Pa, Qa, Ua = {510302:(a, b, c, d, e) => {
   if ("undefined" === typeof window || void 0 === (window.AudioContext || window.webkitAudioContext)) {
     return 0;
   }
@@ -505,9 +505,9 @@ var Pa, Qa, Ua = {509966:(a, b, c, d, e) => {
   }
   window.h.Da += 1;
   return 1;
-}, 512144:() => {
+}, 512480:() => {
   "undefined" !== typeof window.h && (--window.h.Da, 0 === window.h.Da && delete window.h);
-}, 512308:() => void 0 !== navigator.mediaDevices && void 0 !== navigator.mediaDevices.getUserMedia, 512412:() => {
+}, 512644:() => void 0 !== navigator.mediaDevices && void 0 !== navigator.mediaDevices.getUserMedia, 512748:() => {
   try {
     var a = new (window.AudioContext || window.webkitAudioContext)(), b = a.sampleRate;
     a.close();
@@ -515,7 +515,7 @@ var Pa, Qa, Ua = {509966:(a, b, c, d, e) => {
   } catch (c) {
     return 0;
   }
-}, 512583:(a, b, c, d, e, f) => {
+}, 512919:(a, b, c, d, e, f) => {
   if ("undefined" === typeof window.h) {
     return -1;
   }
@@ -561,7 +561,7 @@ var Pa, Qa, Ua = {509966:(a, b, c, d, e) => {
   a == window.h.I.Ba && g.Z.connect(g.J.destination);
   g.lb = f;
   return window.h.oc(g);
-}, 515460:a => window.h.va(a).J.sampleRate, 515533:a => {
+}, 515796:a => window.h.va(a).J.sampleRate, 515869:a => {
   a = window.h.va(a);
   void 0 !== a.Z && (a.Z.onaudioprocess = function() {
   }, a.Z.disconnect(), a.Z = void 0);
@@ -569,13 +569,13 @@ var Pa, Qa, Ua = {509966:(a, b, c, d, e) => {
   a.J.close();
   a.J = void 0;
   a.lb = void 0;
-}, 515933:a => {
+}, 516269:a => {
   window.h.yb(a);
-}, 515983:a => {
+}, 516319:a => {
   a = window.h.va(a);
   a.J.resume();
   a.state = window.h.ia.tb;
-}, 516122:a => {
+}, 516458:a => {
   a = window.h.va(a);
   a.J.suspend();
   a.state = window.h.ia.stopped;
@@ -1684,7 +1684,7 @@ function ad(a, b, c) {
       };
     case 1:
       return function(d) {
-        return this.fromWireType((c ? H : wa)[d >> 1]);
+        return this.fromWireType((c ? G : wa)[d >> 1]);
       };
     case 2:
       return function(d) {
@@ -1725,7 +1725,7 @@ function cd(a, b, c) {
       };
     case 1:
       return c ? function(d) {
-        return H[d >> 1];
+        return G[d >> 1];
       } : function(d) {
         return wa[d >> 1];
       };
@@ -1750,7 +1750,7 @@ var dd = "undefined" != typeof TextDecoder ? new TextDecoder("utf-16le") : void
   }
   c = "";
   for (d = 0; !(d >= b / 2); ++d) {
-    var e = H[a + 2 * d >> 1];
+    var e = G[a + 2 * d >> 1];
     if (0 == e) {
       break;
     }
@@ -1766,9 +1766,9 @@ var dd = "undefined" != typeof TextDecoder ? new TextDecoder("utf-16le") : void
   var d = b;
   c = c < 2 * a.length ? c / 2 : a.length;
   for (var e = 0; e < c; ++e) {
-    H[b >> 1] = a.charCodeAt(e), b += 2;
+    G[b >> 1] = a.charCodeAt(e), b += 2;
   }
-  H[b >> 1] = 0;
+  G[b >> 1] = 0;
   return b - d;
 }, gd = a => 2 * a.length, hd = (a, b) => {
   for (var c = 0, d = ""; !(c >= b / 4);) {
@@ -2311,7 +2311,7 @@ var Yd = {__syscall_fcntl64:function(a, b, c) {
       case 4:
         return e = Yb(), d.flags |= e, 0;
       case 5:
-        return e = Yb(), H[e + 0 >> 1] = 2, 0;
+        return e = Yb(), G[e + 0 >> 1] = 2, 0;
       case 6:
       case 7:
         return 0;
@@ -2386,7 +2386,7 @@ var Yd = {__syscall_fcntl64:function(a, b, c) {
         if (!d.s) {
           return -59;
         }
-        d.s.V.Zb && (f = [24, 80], e = Yb(), H[e >> 1] = f[0], H[e + 2 >> 1] = f[1]);
+        d.s.V.Zb && (f = [24, 80], e = Yb(), G[e >> 1] = f[0], G[e + 2 >> 1] = f[1]);
         return 0;
       case 21524:
         return d.s ? 0 : -59;
@@ -2509,7 +2509,7 @@ var Yd = {__syscall_fcntl64:function(a, b, c) {
     if (1 === c) {
       var l = D;
     } else if (2 === c) {
-      l = H;
+      l = G;
     } else if (4 === c) {
       l = J;
     } else {
@@ -2554,10 +2554,10 @@ var Yd = {__syscall_fcntl64:function(a, b, c) {
     A.A && (void 0 === A.A.qa && (A.A.qa = []), A.A.qa.push(A));
     u = new Qc(t, A, !0, !1);
     y = new Qc(t + "*", A, !1, !1);
-    var G = new Qc(t + " const*", A, !1, !0);
-    tc[a] = {pointerType:y, Gb:G};
+    var H = new Qc(t + " const*", A, !1, !0);
+    tc[a] = {pointerType:y, Gb:H};
     Rc(n, q);
-    return [u, y, G];
+    return [u, y, H];
   });
 }, _embind_register_class_class_function:function(a, b, c, d, e, f, g) {
   var l = Yc(c, d);
@@ -2677,9 +2677,9 @@ var Yd = {__syscall_fcntl64:function(a, b, c) {
         p = X(l, p);
         var y = n[1];
         u.set = function(z) {
-          var A = Zc(this, t, v + " setter"), G = [];
-          p(m, A, y.toWireType(G, z));
-          Ac(G);
+          var A = Zc(this, t, v + " setter"), H = [];
+          p(m, A, y.toWireType(H, z));
+          Ac(H);
         };
       }
       Object.defineProperty(t.i.N, b, u);
@@ -3408,7 +3408,7 @@ var Yd = {__syscall_fcntl64:function(a, b, c) {
     Z.texSubImage2D(a, b, c, d, e, f, g, l, p);
   } else if (p) {
     var m = l - 5120;
-    m = 0 == m ? D : 1 == m ? F : 2 == m ? H : 4 == m ? J : 6 == m ? xa : 5 == m || 28922 == m || 28520 == m || 30779 == m || 30782 == m ? K : wa;
+    m = 0 == m ? D : 1 == m ? F : 2 == m ? G : 4 == m ? J : 6 == m ? xa : 5 == m || 28922 == m || 28520 == m || 30779 == m || 30782 == m ? K : wa;
     Z.texSubImage2D(a, b, c, d, e, f, g, l, m, p >> 31 - Math.clz32(m.BYTES_PER_ELEMENT));
   } else {
     Z.texSubImage2D(a, b, c, d, e, f, g, l, null);
@@ -3487,13 +3487,14 @@ k.dynCall_iiji = (a, b, c, d, e) => (k.dynCall_iiji = C.dynCall_iiji)(a, b, c, d
 k.dynCall_iiiji = (a, b, c, d, e, f) => (k.dynCall_iiiji = C.dynCall_iiiji)(a, b, c, d, e, f);
 k.dynCall_iij = (a, b, c, d) => (k.dynCall_iij = C.dynCall_iij)(a, b, c, d);
 k.dynCall_jii = (a, b, c) => (k.dynCall_jii = C.dynCall_jii)(a, b, c);
+k.dynCall_vijj = (a, b, c, d, e, f) => (k.dynCall_vijj = C.dynCall_vijj)(a, b, c, d, e, f);
 k.dynCall_jiji = (a, b, c, d, e) => (k.dynCall_jiji = C.dynCall_jiji)(a, b, c, d, e);
 k.dynCall_viijii = (a, b, c, d, e, f, g) => (k.dynCall_viijii = C.dynCall_viijii)(a, b, c, d, e, f, g);
 k.dynCall_iiiiij = (a, b, c, d, e, f, g) => (k.dynCall_iiiiij = C.dynCall_iiiiij)(a, b, c, d, e, f, g);
 k.dynCall_iiiiijj = (a, b, c, d, e, f, g, l, p) => (k.dynCall_iiiiijj = C.dynCall_iiiiijj)(a, b, c, d, e, f, g, l, p);
 k.dynCall_iiiiiijj = (a, b, c, d, e, f, g, l, p, m) => (k.dynCall_iiiiiijj = C.dynCall_iiiiiijj)(a, b, c, d, e, f, g, l, p, m);
-k.___start_em_js = 507532;
-k.___stop_em_js = 509966;
+k.___start_em_js = 507868;
+k.___stop_em_js = 510302;
 var Zd;
 Ha = function $d() {
   Zd || ae();
@@ -3553,7 +3554,7 @@ ae();
 /* 2 */
 /***/ ((module) => {
 
-module.exports = /*#__PURE__*/JSON.parse('{"name":"@rive-app/webgl2","version":"2.26.5","description":"Rive\'s webgl2 based web api.","main":"rive.js","homepage":"https://rive.app","repository":{"type":"git","url":"https://github.com/rive-app/rive-wasm/tree/master/js"},"keywords":["rive","animation"],"author":"Rive","contributors":["Luigi Rosso <luigi@rive.app> (https://rive.app)","Maxwell Talbot <max@rive.app> (https://rive.app)","Arthur Vivian <arthur@rive.app> (https://rive.app)","Umberto Sonnino <umberto@rive.app> (https://rive.app)","Matthew Sullivan <matt.j.sullivan@gmail.com> (mailto:matt.j.sullivan@gmail.com)","Chris Dalton <chris@rive.app> (https://rive.app)"],"license":"MIT","files":["rive.js","rive.wasm","rive.js.map","rive.d.ts","rive_advanced.mjs.d.ts"],"typings":"rive.d.ts","dependencies":{},"browser":{"fs":false,"path":false}}');
+module.exports = /*#__PURE__*/JSON.parse('{"name":"@rive-app/webgl2","version":"2.26.7","description":"Rive\'s webgl2 based web api.","main":"rive.js","homepage":"https://rive.app","repository":{"type":"git","url":"https://github.com/rive-app/rive-wasm/tree/master/js"},"keywords":["rive","animation"],"author":"Rive","contributors":["Luigi Rosso <luigi@rive.app> (https://rive.app)","Maxwell Talbot <max@rive.app> (https://rive.app)","Arthur Vivian <arthur@rive.app> (https://rive.app)","Umberto Sonnino <umberto@rive.app> (https://rive.app)","Matthew Sullivan <matt.j.sullivan@gmail.com> (mailto:matt.j.sullivan@gmail.com)","Chris Dalton <chris@rive.app> (https://rive.app)"],"license":"MIT","files":["rive.js","rive.wasm","rive.js.map","rive.d.ts","rive_advanced.mjs.d.ts"],"typings":"rive.d.ts","dependencies":{},"browser":{"fs":false,"path":false}}');
 
 /***/ }),
 /* 3 */
@@ -4103,6 +4104,15 @@ var __generator = (undefined && undefined.__generator) || function (thisArg, bod
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
+var __spreadArray = (undefined && undefined.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 
 
 
@@ -5496,6 +5506,13 @@ var Rive = /** @class */ (function () {
             useOffscreenRenderer: params.useOffscreenRenderer,
         });
     }
+    Object.defineProperty(Rive.prototype, "viewModelCount", {
+        get: function () {
+            return this.file.viewModelCount();
+        },
+        enumerable: false,
+        configurable: true
+    });
     // Alternative constructor to build a Rive instance from an interface/object
     Rive.new = function (params) {
         console.warn("This function is deprecated: please use `new Rive({})` instead");
@@ -6734,10 +6751,14 @@ var Rive = /** @class */ (function () {
                 viewModelInstance.internalIncrementReferenceCount();
                 (_a = this._viewModelInstance) === null || _a === void 0 ? void 0 : _a.cleanup();
                 this._viewModelInstance = viewModelInstance;
-                this.artboard.bindViewModelInstance(viewModelInstance.runtimeInstance);
-                this.animator.stateMachines.forEach(function (stateMachine) {
-                    return stateMachine.bindViewModelInstance(viewModelInstance);
-                });
+                if (this.animator.stateMachines.length > 0) {
+                    this.animator.stateMachines.forEach(function (stateMachine) {
+                        return stateMachine.bindViewModelInstance(viewModelInstance);
+                    });
+                }
+                else {
+                    this.artboard.bindViewModelInstance(viewModelInstance.runtimeInstance);
+                }
             }
         }
     };
@@ -6871,12 +6892,26 @@ var DataEnum = /** @class */ (function () {
     return DataEnum;
 }());
 
+var PropertyType;
+(function (PropertyType) {
+    PropertyType["Number"] = "number";
+    PropertyType["String"] = "string";
+    PropertyType["Boolean"] = "boolean";
+    PropertyType["Color"] = "color";
+    PropertyType["Trigger"] = "trigger";
+    PropertyType["Enum"] = "enum";
+})(PropertyType || (PropertyType = {}));
 var ViewModelInstance = /** @class */ (function () {
-    function ViewModelInstance(runtimeInstance, root) {
+    function ViewModelInstance(runtimeInstance, parent) {
+        this._parents = [];
+        this._children = [];
+        this._viewModelInstances = new Map();
         this._propertiesWithCallbacks = [];
         this._referenceCount = 0;
         this._runtimeInstance = runtimeInstance;
-        this._root = root || this;
+        if (parent !== null) {
+            this._parents.push(parent);
+        }
     }
     Object.defineProperty(ViewModelInstance.prototype, "runtimeInstance", {
         get: function () {
@@ -6890,6 +6925,80 @@ var ViewModelInstance = /** @class */ (function () {
             this._propertiesWithCallbacks.forEach(function (property) {
                 property.handleCallbacks();
             });
+            this._propertiesWithCallbacks.forEach(function (property) {
+                property.clearChanges();
+            });
+        }
+        this._children.forEach(function (child) { return child.handleCallbacks(); });
+    };
+    ViewModelInstance.prototype.addParent = function (parent) {
+        this._parents.push(parent);
+        if (this._propertiesWithCallbacks.length > 0 || this._children.length > 0) {
+            parent.addToViewModelCallbacks(this);
+        }
+    };
+    ViewModelInstance.prototype.removeParent = function (parent) {
+        var index = this._parents.indexOf(parent);
+        if (index !== -1) {
+            var parent_1 = this._parents[index];
+            parent_1.removeFromViewModelCallbacks(this);
+            this._parents.splice(index, 1);
+        }
+    };
+    /*
+     * method for internal use, it shouldn't be called externally
+     */
+    ViewModelInstance.prototype.addToPropertyCallbacks = function (property) {
+        var _this = this;
+        if (!this._propertiesWithCallbacks.includes(property)) {
+            this._propertiesWithCallbacks.push(property);
+            if (this._propertiesWithCallbacks.length > 0) {
+                this._parents.forEach(function (parent) {
+                    parent.addToViewModelCallbacks(_this);
+                });
+            }
+        }
+    };
+    /*
+     * method for internal use, it shouldn't be called externally
+     */
+    ViewModelInstance.prototype.removeFromPropertyCallbacks = function (property) {
+        var _this = this;
+        if (this._propertiesWithCallbacks.includes(property)) {
+            this._propertiesWithCallbacks = this._propertiesWithCallbacks.filter(function (prop) { return prop !== property; });
+            if (this._children.length === 0 &&
+                this._propertiesWithCallbacks.length === 0) {
+                this._parents.forEach(function (parent) {
+                    parent.removeFromViewModelCallbacks(_this);
+                });
+            }
+        }
+    };
+    /*
+     * method for internal use, it shouldn't be called externally
+     */
+    ViewModelInstance.prototype.addToViewModelCallbacks = function (instance) {
+        var _this = this;
+        if (!this._children.includes(instance)) {
+            this._children.push(instance);
+            this._parents.forEach(function (parent) {
+                parent.addToViewModelCallbacks(_this);
+            });
+        }
+    };
+    /*
+     * method for internal use, it shouldn't be called externally
+     */
+    ViewModelInstance.prototype.removeFromViewModelCallbacks = function (instance) {
+        var _this = this;
+        if (this._children.includes(instance)) {
+            this._children = this._children.filter(function (child) { return child !== instance; });
+            if (this._children.length === 0 &&
+                this._propertiesWithCallbacks.length === 0) {
+                this._parents.forEach(function (parent) {
+                    parent.removeFromViewModelCallbacks(_this);
+                });
+            }
         }
     };
     ViewModelInstance.prototype.clearCallbacks = function () {
@@ -6897,97 +7006,179 @@ var ViewModelInstance = /** @class */ (function () {
             property.clearCallbacks();
         });
     };
+    ViewModelInstance.prototype.propertyFromPath = function (path, type) {
+        var pathSegments = path.split("/");
+        return this.propertyFromPathSegments(pathSegments, 0, type);
+    };
+    ViewModelInstance.prototype.viewModelFromPathSegments = function (pathSegments, index) {
+        var viewModelInstance = this.internalViewModelInstance(pathSegments[index]);
+        if (viewModelInstance !== null) {
+            if (index == pathSegments.length - 1) {
+                return viewModelInstance;
+            }
+            else {
+                return viewModelInstance.viewModelFromPathSegments(pathSegments, index++);
+            }
+        }
+        return null;
+    };
+    ViewModelInstance.prototype.propertyFromPathSegments = function (pathSegments, index, type) {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+        if (index < pathSegments.length - 1) {
+            var viewModelInstance = this.internalViewModelInstance(pathSegments[index]);
+            if (viewModelInstance !== null) {
+                return viewModelInstance.propertyFromPathSegments(pathSegments, index + 1, type);
+            }
+            else {
+                return null;
+            }
+        }
+        var instance = null;
+        switch (type) {
+            case PropertyType.Number:
+                instance = (_b = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.number(pathSegments[index])) !== null && _b !== void 0 ? _b : null;
+                if (instance !== null) {
+                    return new ViewModelInstanceNumber(instance, this);
+                }
+                break;
+            case PropertyType.String:
+                instance = (_d = (_c = this._runtimeInstance) === null || _c === void 0 ? void 0 : _c.string(pathSegments[index])) !== null && _d !== void 0 ? _d : null;
+                if (instance !== null) {
+                    return new ViewModelInstanceString(instance, this);
+                }
+                break;
+            case PropertyType.Boolean:
+                instance = (_f = (_e = this._runtimeInstance) === null || _e === void 0 ? void 0 : _e.boolean(pathSegments[index])) !== null && _f !== void 0 ? _f : null;
+                if (instance !== null) {
+                    return new ViewModelInstanceBoolean(instance, this);
+                }
+                break;
+            case PropertyType.Color:
+                instance = (_h = (_g = this._runtimeInstance) === null || _g === void 0 ? void 0 : _g.color(pathSegments[index])) !== null && _h !== void 0 ? _h : null;
+                if (instance !== null) {
+                    return new ViewModelInstanceColor(instance, this);
+                }
+                break;
+            case PropertyType.Trigger:
+                instance = (_k = (_j = this._runtimeInstance) === null || _j === void 0 ? void 0 : _j.trigger(pathSegments[index])) !== null && _k !== void 0 ? _k : null;
+                if (instance !== null) {
+                    return new ViewModelInstanceTrigger(instance, this);
+                }
+                break;
+            case PropertyType.Enum:
+                instance = (_m = (_l = this._runtimeInstance) === null || _l === void 0 ? void 0 : _l.enum(pathSegments[index])) !== null && _m !== void 0 ? _m : null;
+                if (instance !== null) {
+                    return new ViewModelInstanceEnum(instance, this);
+                }
+                break;
+        }
+        return null;
+    };
+    ViewModelInstance.prototype.internalViewModelInstance = function (name) {
+        var _a;
+        if (this._viewModelInstances.has(name)) {
+            return this._viewModelInstances.get(name);
+        }
+        var viewModelRuntimeInstance = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.viewModel(name);
+        if (viewModelRuntimeInstance !== null) {
+            var viewModelInstance = new ViewModelInstance(viewModelRuntimeInstance, this);
+            viewModelInstance.internalIncrementReferenceCount();
+            this._viewModelInstances.set(name, viewModelInstance);
+            return viewModelInstance;
+        }
+        return null;
+    };
     /**
      * method to access a property instance of type number belonging
      * to the view model instance or to a nested view model instance
      * @param path - path to the number property
      */
     ViewModelInstance.prototype.number = function (path) {
-        var _a;
-        var instance = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.number(path);
-        if (instance) {
-            return new ViewModelInstanceNumber(instance, this._root);
-        }
-        return null;
+        var viewmodelInstanceValue = this.propertyFromPath(path, PropertyType.Number);
+        return viewmodelInstanceValue;
     };
     /**
      * method to access a property instance of type string belonging
      * to the view model instance or to a nested view model instance
-     * @param path - path to the number property
+     * @param path - path to the string property
      */
     ViewModelInstance.prototype.string = function (path) {
-        var _a;
-        var instance = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.string(path);
-        if (instance) {
-            return new ViewModelInstanceString(instance, this._root);
-        }
-        return null;
+        var viewmodelInstanceValue = this.propertyFromPath(path, PropertyType.String);
+        return viewmodelInstanceValue;
     };
     /**
      * method to access a property instance of type boolean belonging
      * to the view model instance or to a nested view model instance
-     * @param path - path to the number property
+     * @param path - path to the boolean property
      */
     ViewModelInstance.prototype.boolean = function (path) {
-        var _a;
-        var instance = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.boolean(path);
-        if (instance) {
-            return new ViewModelInstanceBoolean(instance, this._root);
-        }
-        return null;
+        var viewmodelInstanceValue = this.propertyFromPath(path, PropertyType.Boolean);
+        return viewmodelInstanceValue;
     };
     /**
      * method to access a property instance of type color belonging
      * to the view model instance or to a nested view model instance
-     * @param path - path to the number property
+     * @param path - path to the ttrigger property
      */
     ViewModelInstance.prototype.color = function (path) {
-        var _a;
-        var instance = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.color(path);
-        if (instance) {
-            return new ViewModelInstanceColor(instance, this._root);
-        }
-        return null;
+        var viewmodelInstanceValue = this.propertyFromPath(path, PropertyType.Color);
+        return viewmodelInstanceValue;
     };
     /**
      * method to access a property instance of type trigger belonging
      * to the view model instance or to a nested view model instance
-     * @param path - path to the number property
+     * @param path - path to the trigger property
      */
     ViewModelInstance.prototype.trigger = function (path) {
-        var _a;
-        var instance = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.trigger(path);
-        if (instance) {
-            return new ViewModelInstanceTrigger(instance, this._root);
-        }
-        return null;
+        var viewmodelInstanceValue = this.propertyFromPath(path, PropertyType.Trigger);
+        return viewmodelInstanceValue;
     };
     /**
      * method to access a property instance of type enum belonging
      * to the view model instance or to a nested view model instance
-     * @param path - path to the number property
+     * @param path - path to the enum property
      */
     ViewModelInstance.prototype.enum = function (path) {
-        var _a;
-        var instance = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.enum(path);
-        if (instance) {
-            return new ViewModelInstanceEnum(instance, this._root);
-        }
-        return null;
+        var viewmodelInstanceValue = this.propertyFromPath(path, PropertyType.Enum);
+        return viewmodelInstanceValue;
     };
     /**
      * method to access a view model property instance belonging
      * to the view model instance or to a nested view model instance
-     * @param path - path to the number property
+     * @param path - path to the view model property
      */
     ViewModelInstance.prototype.viewModel = function (path) {
-        var _a;
-        var viewModelInstance = (_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.viewModel(path);
-        if (viewModelInstance) {
-            return new ViewModelInstance(viewModelInstance, this._root);
+        var pathSegments = path.split("/");
+        var parentViewModelInstance = pathSegments.length > 1
+            ? this.viewModelFromPathSegments(pathSegments.slice(0, pathSegments.length - 1), 0)
+            : this;
+        if (parentViewModelInstance != null) {
+            return parentViewModelInstance.internalViewModelInstance(pathSegments[pathSegments.length - 1]);
         }
         return null;
     };
+    ViewModelInstance.prototype.internalReplaceViewModel = function (name, value) {
+        var _a;
+        if (value.runtimeInstance !== null) {
+            var result = ((_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.replaceViewModel(name, value.runtimeInstance)) ||
+                false;
+            if (result) {
+                value.internalIncrementReferenceCount();
+                var oldInstance_1 = this.internalViewModelInstance(name);
+                if (oldInstance_1 !== null) {
+                    oldInstance_1.removeParent(this);
+                    if (this._children.includes(oldInstance_1)) {
+                        this._children = this._children.filter(function (child) { return child !== oldInstance_1; });
+                    }
+                    oldInstance_1.cleanup();
+                }
+                this._viewModelInstances.set(name, value);
+                value.addParent(this);
+            }
+            return result;
+        }
+        return false;
+    };
     /**
      * method to replace a view model property with another view model value
      * @param path - path to the view model property
@@ -6995,27 +7186,11 @@ var ViewModelInstance = /** @class */ (function () {
      */
     ViewModelInstance.prototype.replaceViewModel = function (path, value) {
         var _a;
-        if (value.runtimeInstance !== null) {
-            return (((_a = this._runtimeInstance) === null || _a === void 0 ? void 0 : _a.replaceViewModel(path, value.runtimeInstance)) ||
-                false);
-        }
-        return false;
-    };
-    /*
-     * method for internal use, it shouldn't be called externally
-     */
-    ViewModelInstance.prototype.addToCallbacks = function (property) {
-        if (!this._propertiesWithCallbacks.includes(property)) {
-            this._propertiesWithCallbacks.push(property);
-        }
-    };
-    /*
-     * method for internal use, it shouldn't be called externally
-     */
-    ViewModelInstance.prototype.removeFromCallbacks = function (property) {
-        if (this._propertiesWithCallbacks.includes(property)) {
-            this._propertiesWithCallbacks = this._propertiesWithCallbacks.filter(function (prop) { return prop !== property; });
-        }
+        var pathSegments = path.split("/");
+        var viewModelInstance = pathSegments.length > 1
+            ? this.viewModelFromPathSegments(pathSegments.slice(0, pathSegments.length - 1), 0)
+            : this;
+        return ((_a = viewModelInstance === null || viewModelInstance === void 0 ? void 0 : viewModelInstance.internalReplaceViewModel(pathSegments[pathSegments.length - 1], value)) !== null && _a !== void 0 ? _a : false);
     };
     /*
      * method to add one to the reference counter of the instance.
@@ -7047,21 +7222,36 @@ var ViewModelInstance = /** @class */ (function () {
         this._referenceCount++;
     };
     ViewModelInstance.prototype.cleanup = function () {
+        var _this = this;
         this._referenceCount--;
         if (this._referenceCount <= 0) {
             this._runtimeInstance = null;
             this.clearCallbacks();
             this._propertiesWithCallbacks = [];
+            this._viewModelInstances.forEach(function (value) {
+                value.cleanup();
+            });
+            this._viewModelInstances.clear();
+            var children = __spreadArray([], this._children, true);
+            this._children.length = 0;
+            var parents = __spreadArray([], this._parents, true);
+            this._parents.length = 0;
+            children.forEach(function (child) {
+                child.removeParent(_this);
+            });
+            parents.forEach(function (parent) {
+                parent.removeFromViewModelCallbacks(_this);
+            });
         }
     };
     return ViewModelInstance;
 }());
 
 var ViewModelInstanceValue = /** @class */ (function () {
-    function ViewModelInstanceValue(instance, root) {
+    function ViewModelInstanceValue(instance, parent) {
         this.callbacks = [];
         this._viewModelInstanceValue = instance;
-        this._rootViewModel = root;
+        this._parentViewModel = parent;
     }
     ViewModelInstanceValue.prototype.on = function (callback) {
         // Since we don't clean the changed flag for properties that don't have listeners,
@@ -7071,7 +7261,7 @@ var ViewModelInstanceValue = /** @class */ (function () {
         }
         if (!this.callbacks.includes(callback)) {
             this.callbacks.push(callback);
-            this._rootViewModel.addToCallbacks(this);
+            this._parentViewModel.addToPropertyCallbacks(this);
         }
     };
     ViewModelInstanceValue.prototype.off = function (callback) {
@@ -7082,19 +7272,21 @@ var ViewModelInstanceValue = /** @class */ (function () {
             this.callbacks = this.callbacks.filter(function (cb) { return cb !== callback; });
         }
         if (this.callbacks.length === 0) {
-            this._rootViewModel.removeFromCallbacks(this);
+            this._parentViewModel.removeFromPropertyCallbacks(this);
         }
     };
     ViewModelInstanceValue.prototype.internalHandleCallback = function (callback) { };
     ViewModelInstanceValue.prototype.handleCallbacks = function () {
         var _this = this;
         if (this._viewModelInstanceValue.hasChanged) {
-            this._viewModelInstanceValue.clearChanges();
             this.callbacks.forEach(function (callback) {
                 _this.internalHandleCallback(callback);
             });
         }
     };
+    ViewModelInstanceValue.prototype.clearChanges = function () {
+        this._viewModelInstanceValue.clearChanges();
+    };
     ViewModelInstanceValue.prototype.clearCallbacks = function () {
         this.callbacks.length = 0;
     };
@@ -7110,8 +7302,8 @@ var ViewModelInstanceValue = /** @class */ (function () {
 
 var ViewModelInstanceString = /** @class */ (function (_super) {
     __extends(ViewModelInstanceString, _super);
-    function ViewModelInstanceString(instance, root) {
-        return _super.call(this, instance, root) || this;
+    function ViewModelInstanceString(instance, parent) {
+        return _super.call(this, instance, parent) || this;
     }
     Object.defineProperty(ViewModelInstanceString.prototype, "value", {
         get: function () {
@@ -7131,8 +7323,8 @@ var ViewModelInstanceString = /** @class */ (function (_super) {
 
 var ViewModelInstanceNumber = /** @class */ (function (_super) {
     __extends(ViewModelInstanceNumber, _super);
-    function ViewModelInstanceNumber(instance, root) {
-        return _super.call(this, instance, root) || this;
+    function ViewModelInstanceNumber(instance, parent) {
+        return _super.call(this, instance, parent) || this;
     }
     Object.defineProperty(ViewModelInstanceNumber.prototype, "value", {
         get: function () {
@@ -7152,8 +7344,8 @@ var ViewModelInstanceNumber = /** @class */ (function (_super) {
 
 var ViewModelInstanceBoolean = /** @class */ (function (_super) {
     __extends(ViewModelInstanceBoolean, _super);
-    function ViewModelInstanceBoolean(instance, root) {
-        return _super.call(this, instance, root) || this;
+    function ViewModelInstanceBoolean(instance, parent) {
+        return _super.call(this, instance, parent) || this;
     }
     Object.defineProperty(ViewModelInstanceBoolean.prototype, "value", {
         get: function () {
@@ -7173,8 +7365,8 @@ var ViewModelInstanceBoolean = /** @class */ (function (_super) {
 
 var ViewModelInstanceTrigger = /** @class */ (function (_super) {
     __extends(ViewModelInstanceTrigger, _super);
-    function ViewModelInstanceTrigger(instance, root) {
-        return _super.call(this, instance, root) || this;
+    function ViewModelInstanceTrigger(instance, parent) {
+        return _super.call(this, instance, parent) || this;
     }
     ViewModelInstanceTrigger.prototype.trigger = function () {
         return this._viewModelInstanceValue.trigger();
@@ -7187,8 +7379,8 @@ var ViewModelInstanceTrigger = /** @class */ (function (_super) {
 
 var ViewModelInstanceEnum = /** @class */ (function (_super) {
     __extends(ViewModelInstanceEnum, _super);
-    function ViewModelInstanceEnum(instance, root) {
-        return _super.call(this, instance, root) || this;
+    function ViewModelInstanceEnum(instance, parent) {
+        return _super.call(this, instance, parent) || this;
     }
     Object.defineProperty(ViewModelInstanceEnum.prototype, "value", {
         get: function () {
@@ -7226,8 +7418,8 @@ var ViewModelInstanceEnum = /** @class */ (function (_super) {
 
 var ViewModelInstanceColor = /** @class */ (function (_super) {
     __extends(ViewModelInstanceColor, _super);
-    function ViewModelInstanceColor(instance, root) {
-        return _super.call(this, instance, root) || this;
+    function ViewModelInstanceColor(instance, parent) {
+        return _super.call(this, instance, parent) || this;
     }
     Object.defineProperty(ViewModelInstanceColor.prototype, "value", {
         get: function () {