@likec4/core 1.43.0 → 1.44.0

package/dist/shared/{core.DyToofsP.mjs → core.h4TqqSC0.mjs}

@@ -1,35 +1,43 @@
-import { n as n$4, e as e$4, a as DeploymentNodeModel, b as DeployedInstanceModel, c as DeploymentRelationModel, N as NestedElementOfDeployedInstanceModel } from './core.Be05qJwN.mjs';
-import { t as t$8, a as t$9 } from './core.BsSXS-_R.mjs';
+import { n as n$6, t as t$b, e as e$4, a as DeploymentNodeModel, b as DeployedInstanceModel, c as DeploymentRelationModel, N as NestedElementOfDeployedInstanceModel } from './core.CHwVhuc9.mjs';
 import { e as e$3 } from './core.BKlholso.mjs';
 import { c as splitGlobalFqn, g as extractStep, e as isStepEdgeId, i as isGroupElementKind, b as isGlobalFqn, a as GlobalFqn } from './core.C_Ni6yHl.mjs';
-import { q as hierarchyLevel, n as nameFromFqn, i as isAncestor, k as commonAncestor, s as sortNaturalByFqn, f as sortParentsFirst, p as parentFqn, a as ancestorsFqn, j as compareNaturalHierarchically, g as compareNatural } from './core.727Qoh_W.mjs';
+import { m as hierarchyLevel, n as nameFromFqn, i as isAncestor, g as commonAncestor, s as sortNaturalByFqn, f as sortParentsFirst, p as parentFqn, a as ancestorsFqn } from './core.6VsRBhGY.mjs';
 import { m as memoizeProp } from './core.BR4zXDH-.mjs';
-import { R as RichText, e as exact } from './core.01VTr9qu.mjs';
-import { a as preferSummary, p as preferDescription } from './core.BazD6cot.mjs';
-import { a as ihead, i as ifind } from './core.QJD_fcrc.mjs';
-import { t as t$a } from './core.OHD4KXm9.mjs';
-import { t as t$b } from './core.CbT8JVYL.mjs';
-import { L as LikeC4Styles } from './core.DNbUPnve.mjs';
+import { R as RichText, e as exact } from './core.M9ayqQZa.mjs';
+import { preferSummary, preferDescription } from '../types/_aux.mjs';
+import { i as ihead } from './core.uFk_o9X6.mjs';
+import { a as t$9, t as t$a } from './core.OHD4KXm9.mjs';
+import { t as t$8, a as t$c } from './core.BsSXS-_R.mjs';
+import { e as e$5, t as t$d, a as t$g } from './core.B9BjmjuH.mjs';
+import { t as t$e } from './core.CbT8JVYL.mjs';
+import { a as t$f, L as LikeC4Styles } from './core.DEieYfbG.mjs';
 import { g as getOrCreate } from './core.DcS-0zys.mjs';
-import { i as invariant, a as nonNullable } from './core.D4npX2q8.mjs';
 import { D as DefaultMap } from './core.BbE4y-yl.mjs';
+import { i as invariant, a as nonNullable } from './core.D4npX2q8.mjs';
 import { FqnRef } from '../types/fqnRef.mjs';
-import { b as isDeploymentNode, a as _type, _ as _stage, i as isOnStage, w as whereOperatorAsPredicate } from './core.BYNkXQ8A.mjs';
+import { c as isDeploymentNode, b as _layout, u as e$6, t as isDynamicView, a as _type, _ as _stage, i as isOnStage, w as whereOperatorAsPredicate } from './core.DH7TXqXf.mjs';
+import { s as symmetricDifference } from './core.CbsSAn1j.mjs';
+import { i as ifind } from './core.CmPXpJ8l.mjs';
 import { i as ifilter } from './core.DRJma0Ol.mjs';
-import './core.BouyJs63.mjs';
-import './core.2N_9BzyD.mjs';
+import { a as compareNaturalHierarchically, c as compareNatural } from './core.Bv3cd-jC.mjs';
+import './core.C0Ye2OCr.mjs';
+import './core.bKIs4oDO.mjs';
+
+const e$2={asc:(e,t)=>e>t,desc:(e,t)=>e<t};function t$7(e,t){let[n,...a]=t;if(!i$1(n)){let t=r$2(...a);return e(n,t)}let o=r$2(n,...a);return t=>e(t,o)}function r$2(t,n,...i){let a=typeof t==`function`?t:t[0],o=typeof t==`function`?`asc`:t[1],{[o]:s}=e$2,c=n===void 0?void 0:r$2(n,...i);return (e,t)=>{let n=a(e),r=a(t);return s(n,r)?1:s(r,n)?-1:c?.(e,t)??0}}function i$1(t){if(a(t))return  true;if(typeof t!=`object`||!Array.isArray(t))return  false;let[n,r,...i]=t;return a(n)&&typeof r==`string`&&r in e$2&&i.length===0}const a=e=>typeof e==`function`&&e.length===1;
 
-const e$2={asc:(e,t)=>e>t,desc:(e,t)=>e<t};function t$7(e,t){let[n,...a]=t;if(!i$1(n)){let t=r$1(...a);return e(n,t)}let o=r$1(n,...a);return t=>e(t,o)}function r$1(t,n,...i){let a=typeof t==`function`?t:t[0],o=typeof t==`function`?`asc`:t[1],{[o]:s}=e$2,c=n===void 0?void 0:r$1(n,...i);return (e,t)=>{let n=a(e),r=a(t);return s(n,r)?1:s(r,n)?-1:c?.(e,t)??0}}function i$1(t){if(a(t))return  true;if(typeof t!=`object`||!Array.isArray(t))return  false;let[n,r,...i]=t;return a(n)&&typeof r==`string`&&r in e$2&&i.length===0}const a=e=>typeof e==`function`&&e.length===1;
+function n$5(...t){return t$8(r$1,t,i)}const r$1=(e,t)=>e.filter(t),i=e=>(n,r,i)=>e(n,r,i)?{done:false,hasNext:true,next:n}:t$9;
 
-function t$6(...t){return t$8(Object.entries,t)}
+function t$6(...t){return t$8(n$4,t,r)}const n$4=(e,t)=>e.flatMap(t),r=e=>(t,n,r)=>{let i=e(t,n,r);return Array.isArray(i)?{done:false,hasNext:true,hasMany:true,next:i}:{done:false,hasNext:true,next:i}};
 
-function t$5(...t){return t$8(n$3,t)}function n$3(e,t){if(e===t||Object.is(e,t))return  true;if(typeof e!=`object`||!e||typeof t!=`object`||!t)return  false;if(e instanceof Map&&t instanceof Map)return r(e,t);if(e instanceof Set&&t instanceof Set)return i(e,t);let n=Object.keys(e);if(n.length!==Object.keys(t).length)return  false;for(let r of n){if(!Object.hasOwn(t,r))return  false;let{[r]:n}=e,{[r]:i}=t;if(n!==i||!Object.is(n,i))return  false}return  true}function r(e,t){if(e.size!==t.size)return  false;for(let[n,r]of e){let e=t.get(n);if(r!==e||!Object.is(r,e))return  false}return  true}function i(e,t){if(e.size!==t.size)return  false;for(let n of e)if(!t.has(n))return  false;return  true}
+function t$5(...t){return t$8(n$3,t)}const n$3=(e,t)=>{let n=Object.create(null);for(let r=0;r<e.length;r++){let i=e[r],a=t(i,r,e);if(a!==void 0){let e=n[a];e===void 0?n[a]=[i]:e.push(i);}}return Object.setPrototypeOf(n,Object.prototype),n};
+
+function e$1(e){return typeof e==`number`&&!Number.isNaN(e)}
 
 function t$4(...t){return t$8(n$2,t)}const n$2=e=>e.at(-1);
 
-function e$1(e,...n){return typeof e==`string`||typeof e==`number`||typeof e==`symbol`?r=>t$3(r,e,...n):t$3(e,...n)}function t$3(e,...t){let n=e;for(let e of t){if(n==null)return;n=n[e];}return n}
+function t$3(...t){return t$8(n$1,t)}function n$1(e,t){let n={};for(let[r,i]of Object.entries(e))n[r]=t(i,r,e);return n}
 
-function t$2(...t){return t$8(n$1,t)}function n$1(e,t){let n=[...e];return n.sort(t),n}
+function t$2(...t){return n=>t$a(n,...t)}
 
 function t$1(...t){return t$7(n,t)}const n=(e,t)=>[...e].sort(t);
 
@@ -55,6 +63,10 @@ class ElementModel {
       this.hierarchyLevel = hierarchyLevel(this.id);
     }
   }
+  /**
+   * Don't use in runtime, only for type inference
+   */
+  Aux;
   id;
   _literalId;
   hierarchyLevel;
@@ -83,7 +95,7 @@ class ElementModel {
    */
   get tags() {
     return memoizeProp(this, Symbol.for("tags"), () => {
-      return n$4([
+      return n$6([
         ...this.$element.tags ?? [],
         ...this.$model.specification.elements[this.$element.kind]?.tags ?? []
       ]);
@@ -97,7 +109,7 @@ class ElementModel {
    * (if one is missing - it falls back to another)
    */
   get hasSummary() {
-    return !!this.$element.summary && !!this.$element.description && !t$5(this.$element.summary, this.$element.description);
+    return !!this.$element.summary && !!this.$element.description && !t$b(this.$element.summary, this.$element.description);
   }
   /**
    * Short description of the element.
@@ -290,12 +302,13 @@ class ElementModel {
 const getId = (element) => {
   return typeof element === "string" ? element : element.id;
 };
+
 const VIEW_FOLDERS_SEPARATOR = "/";
 const splitViewTitle = (title) => {
   invariant(!title.includes("\n"), "View title cannot contain newlines");
   if (title.includes(VIEW_FOLDERS_SEPARATOR)) {
     const segments = title.split(VIEW_FOLDERS_SEPARATOR).map((s) => s.trim()).filter((s) => s.length > 0);
-    if (t$9(segments, 1)) {
+    if (t$c(segments, 1)) {
       return segments;
     }
     return [""];
@@ -307,7 +320,7 @@ const normalizeViewPath = (title) => {
 };
 const getViewFolderPath = (title) => {
   const segments = splitViewTitle(title);
-  if (!t$9(segments, 2)) {
+  if (!t$c(segments, 2)) {
     return null;
   }
   return segments.slice(0, -1).join(VIEW_FOLDERS_SEPARATOR);
@@ -660,8 +673,26 @@ class RelationshipModel {
     }
     return this.$relationship.technology;
   }
+  /**
+   * Returns true if the relationship has a summary and a description
+   * (if one is missing - it falls back to another)
+   */
+  get hasSummary() {
+    return !!this.$relationship.summary && !!this.$relationship.description && !t$b(this.$relationship.summary, this.$relationship.description);
+  }
+  /**
+   * Short description of the relationship.
+   * Falls back to description if summary is not provided.
+   */
+  get summary() {
+    return RichText.memoize(this, "summary", preferSummary(this.$relationship));
+  }
+  /**
+   * Long description of the relationship.
+   * Falls back to summary if description is not provided.
+   */
   get description() {
-    return RichText.memoize(this, "description", this.$relationship.description);
+    return RichText.memoize(this, "description", preferDescription(this.$relationship));
   }
   get navigateTo() {
     return this.$relationship.navigateTo ? this.model.view(this.$relationship.navigateTo) : null;
@@ -721,73 +752,1173 @@ class RelationshipModel {
   }
 }
 
+// src/utils/env.ts
+var NOTHING = Symbol.for("immer-nothing");
+var DRAFTABLE = Symbol.for("immer-draftable");
+var DRAFT_STATE = Symbol.for("immer-state");
+
+// src/utils/errors.ts
+var errors = process.env.NODE_ENV !== "production" ? [
+  // All error codes, starting by 0:
+  function(plugin) {
+    return `The plugin for '${plugin}' has not been loaded into Immer. To enable the plugin, import and call \`enable${plugin}()\` when initializing your application.`;
+  },
+  function(thing) {
+    return `produce can only be called on things that are draftable: plain objects, arrays, Map, Set or classes that are marked with '[immerable]: true'. Got '${thing}'`;
+  },
+  "This object has been frozen and should not be mutated",
+  function(data) {
+    return "Cannot use a proxy that has been revoked. Did you pass an object from inside an immer function to an async process? " + data;
+  },
+  "An immer producer returned a new value *and* modified its draft. Either return a new value *or* modify the draft.",
+  "Immer forbids circular references",
+  "The first or second argument to `produce` must be a function",
+  "The third argument to `produce` must be a function or undefined",
+  "First argument to `createDraft` must be a plain object, an array, or an immerable object",
+  "First argument to `finishDraft` must be a draft returned by `createDraft`",
+  function(thing) {
+    return `'current' expects a draft, got: ${thing}`;
+  },
+  "Object.defineProperty() cannot be used on an Immer draft",
+  "Object.setPrototypeOf() cannot be used on an Immer draft",
+  "Immer only supports deleting array indices",
+  "Immer only supports setting array indices and the 'length' property",
+  function(thing) {
+    return `'original' expects a draft, got: ${thing}`;
+  }
+  // Note: if more errors are added, the errorOffset in Patches.ts should be increased
+  // See Patches.ts for additional errors
+] : [];
+function die(error, ...args) {
+  if (process.env.NODE_ENV !== "production") {
+    const e = errors[error];
+    const msg = typeof e === "function" ? e.apply(null, args) : e;
+    throw new Error(`[Immer] ${msg}`);
+  }
+  throw new Error(
+    `[Immer] minified error nr: ${error}. Full error at: https://bit.ly/3cXEKWf`
+  );
+}
+
+// src/utils/common.ts
+var getPrototypeOf = Object.getPrototypeOf;
+function isDraft(value) {
+  return !!value && !!value[DRAFT_STATE];
+}
+function isDraftable(value) {
+  if (!value)
+    return false;
+  return isPlainObject(value) || Array.isArray(value) || !!value[DRAFTABLE] || !!value.constructor?.[DRAFTABLE] || isMap(value) || isSet(value);
+}
+var objectCtorString = Object.prototype.constructor.toString();
+var cachedCtorStrings = /* @__PURE__ */ new WeakMap();
+function isPlainObject(value) {
+  if (!value || typeof value !== "object")
+    return false;
+  const proto = Object.getPrototypeOf(value);
+  if (proto === null || proto === Object.prototype)
+    return true;
+  const Ctor = Object.hasOwnProperty.call(proto, "constructor") && proto.constructor;
+  if (Ctor === Object)
+    return true;
+  if (typeof Ctor !== "function")
+    return false;
+  let ctorString = cachedCtorStrings.get(Ctor);
+  if (ctorString === void 0) {
+    ctorString = Function.toString.call(Ctor);
+    cachedCtorStrings.set(Ctor, ctorString);
+  }
+  return ctorString === objectCtorString;
+}
+function each(obj, iter, strict = true) {
+  if (getArchtype(obj) === 0 /* Object */) {
+    const keys = strict ? Reflect.ownKeys(obj) : Object.keys(obj);
+    keys.forEach((key) => {
+      iter(key, obj[key], obj);
+    });
+  } else {
+    obj.forEach((entry, index) => iter(index, entry, obj));
+  }
+}
+function getArchtype(thing) {
+  const state = thing[DRAFT_STATE];
+  return state ? state.type_ : Array.isArray(thing) ? 1 /* Array */ : isMap(thing) ? 2 /* Map */ : isSet(thing) ? 3 /* Set */ : 0 /* Object */;
+}
+function has(thing, prop) {
+  return getArchtype(thing) === 2 /* Map */ ? thing.has(prop) : Object.prototype.hasOwnProperty.call(thing, prop);
+}
+function set(thing, propOrOldValue, value) {
+  const t = getArchtype(thing);
+  if (t === 2 /* Map */)
+    thing.set(propOrOldValue, value);
+  else if (t === 3 /* Set */) {
+    thing.add(value);
+  } else
+    thing[propOrOldValue] = value;
+}
+function is(x, y) {
+  if (x === y) {
+    return x !== 0 || 1 / x === 1 / y;
+  } else {
+    return x !== x && y !== y;
+  }
+}
+function isMap(target) {
+  return target instanceof Map;
+}
+function isSet(target) {
+  return target instanceof Set;
+}
+function latest(state) {
+  return state.copy_ || state.base_;
+}
+function shallowCopy(base, strict) {
+  if (isMap(base)) {
+    return new Map(base);
+  }
+  if (isSet(base)) {
+    return new Set(base);
+  }
+  if (Array.isArray(base))
+    return Array.prototype.slice.call(base);
+  const isPlain = isPlainObject(base);
+  if (strict === true || strict === "class_only" && !isPlain) {
+    const descriptors = Object.getOwnPropertyDescriptors(base);
+    delete descriptors[DRAFT_STATE];
+    let keys = Reflect.ownKeys(descriptors);
+    for (let i = 0; i < keys.length; i++) {
+      const key = keys[i];
+      const desc = descriptors[key];
+      if (desc.writable === false) {
+        desc.writable = true;
+        desc.configurable = true;
+      }
+      if (desc.get || desc.set)
+        descriptors[key] = {
+          configurable: true,
+          writable: true,
+          // could live with !!desc.set as well here...
+          enumerable: desc.enumerable,
+          value: base[key]
+        };
+    }
+    return Object.create(getPrototypeOf(base), descriptors);
+  } else {
+    const proto = getPrototypeOf(base);
+    if (proto !== null && isPlain) {
+      return { ...base };
+    }
+    const obj = Object.create(proto);
+    return Object.assign(obj, base);
+  }
+}
+function freeze(obj, deep = false) {
+  if (isFrozen(obj) || isDraft(obj) || !isDraftable(obj))
+    return obj;
+  if (getArchtype(obj) > 1) {
+    Object.defineProperties(obj, {
+      set: dontMutateMethodOverride,
+      add: dontMutateMethodOverride,
+      clear: dontMutateMethodOverride,
+      delete: dontMutateMethodOverride
+    });
+  }
+  Object.freeze(obj);
+  if (deep)
+    Object.values(obj).forEach((value) => freeze(value, true));
+  return obj;
+}
+function dontMutateFrozenCollections() {
+  die(2);
+}
+var dontMutateMethodOverride = {
+  value: dontMutateFrozenCollections
+};
+function isFrozen(obj) {
+  if (obj === null || typeof obj !== "object")
+    return true;
+  return Object.isFrozen(obj);
+}
+
+// src/utils/plugins.ts
+var plugins = {};
+function getPlugin(pluginKey) {
+  const plugin = plugins[pluginKey];
+  if (!plugin) {
+    die(0, pluginKey);
+  }
+  return plugin;
+}
+
+// src/core/scope.ts
+var currentScope;
+function getCurrentScope() {
+  return currentScope;
+}
+function createScope(parent_, immer_) {
+  return {
+    drafts_: [],
+    parent_,
+    immer_,
+    // Whenever the modified draft contains a draft from another scope, we
+    // need to prevent auto-freezing so the unowned draft can be finalized.
+    canAutoFreeze_: true,
+    unfinalizedDrafts_: 0
+  };
+}
+function usePatchesInScope(scope, patchListener) {
+  if (patchListener) {
+    getPlugin("Patches");
+    scope.patches_ = [];
+    scope.inversePatches_ = [];
+    scope.patchListener_ = patchListener;
+  }
+}
+function revokeScope(scope) {
+  leaveScope(scope);
+  scope.drafts_.forEach(revokeDraft);
+  scope.drafts_ = null;
+}
+function leaveScope(scope) {
+  if (scope === currentScope) {
+    currentScope = scope.parent_;
+  }
+}
+function enterScope(immer2) {
+  return currentScope = createScope(currentScope, immer2);
+}
+function revokeDraft(draft) {
+  const state = draft[DRAFT_STATE];
+  if (state.type_ === 0 /* Object */ || state.type_ === 1 /* Array */)
+    state.revoke_();
+  else
+    state.revoked_ = true;
+}
+
+// src/core/finalize.ts
+function processResult(result, scope) {
+  scope.unfinalizedDrafts_ = scope.drafts_.length;
+  const baseDraft = scope.drafts_[0];
+  const isReplaced = result !== void 0 && result !== baseDraft;
+  if (isReplaced) {
+    if (baseDraft[DRAFT_STATE].modified_) {
+      revokeScope(scope);
+      die(4);
+    }
+    if (isDraftable(result)) {
+      result = finalize(scope, result);
+      if (!scope.parent_)
+        maybeFreeze(scope, result);
+    }
+    if (scope.patches_) {
+      getPlugin("Patches").generateReplacementPatches_(
+        baseDraft[DRAFT_STATE].base_,
+        result,
+        scope.patches_,
+        scope.inversePatches_
+      );
+    }
+  } else {
+    result = finalize(scope, baseDraft, []);
+  }
+  revokeScope(scope);
+  if (scope.patches_) {
+    scope.patchListener_(scope.patches_, scope.inversePatches_);
+  }
+  return result !== NOTHING ? result : void 0;
+}
+function finalize(rootScope, value, path) {
+  if (isFrozen(value))
+    return value;
+  const useStrictIteration = rootScope.immer_.shouldUseStrictIteration();
+  const state = value[DRAFT_STATE];
+  if (!state) {
+    each(
+      value,
+      (key, childValue) => finalizeProperty(rootScope, state, value, key, childValue, path),
+      useStrictIteration
+    );
+    return value;
+  }
+  if (state.scope_ !== rootScope)
+    return value;
+  if (!state.modified_) {
+    maybeFreeze(rootScope, state.base_, true);
+    return state.base_;
+  }
+  if (!state.finalized_) {
+    state.finalized_ = true;
+    state.scope_.unfinalizedDrafts_--;
+    const result = state.copy_;
+    let resultEach = result;
+    let isSet2 = false;
+    if (state.type_ === 3 /* Set */) {
+      resultEach = new Set(result);
+      result.clear();
+      isSet2 = true;
+    }
+    each(
+      resultEach,
+      (key, childValue) => finalizeProperty(
+        rootScope,
+        state,
+        result,
+        key,
+        childValue,
+        path,
+        isSet2
+      ),
+      useStrictIteration
+    );
+    maybeFreeze(rootScope, result, false);
+    if (path && rootScope.patches_) {
+      getPlugin("Patches").generatePatches_(
+        state,
+        path,
+        rootScope.patches_,
+        rootScope.inversePatches_
+      );
+    }
+  }
+  return state.copy_;
+}
+function finalizeProperty(rootScope, parentState, targetObject, prop, childValue, rootPath, targetIsSet) {
+  if (childValue == null) {
+    return;
+  }
+  if (typeof childValue !== "object" && !targetIsSet) {
+    return;
+  }
+  const childIsFrozen = isFrozen(childValue);
+  if (childIsFrozen && !targetIsSet) {
+    return;
+  }
+  if (process.env.NODE_ENV !== "production" && childValue === targetObject)
+    die(5);
+  if (isDraft(childValue)) {
+    const path = rootPath && parentState && parentState.type_ !== 3 /* Set */ && // Set objects are atomic since they have no keys.
+    !has(parentState.assigned_, prop) ? rootPath.concat(prop) : void 0;
+    const res = finalize(rootScope, childValue, path);
+    set(targetObject, prop, res);
+    if (isDraft(res)) {
+      rootScope.canAutoFreeze_ = false;
+    } else
+      return;
+  } else if (targetIsSet) {
+    targetObject.add(childValue);
+  }
+  if (isDraftable(childValue) && !childIsFrozen) {
+    if (!rootScope.immer_.autoFreeze_ && rootScope.unfinalizedDrafts_ < 1) {
+      return;
+    }
+    if (parentState && parentState.base_ && parentState.base_[prop] === childValue && childIsFrozen) {
+      return;
+    }
+    finalize(rootScope, childValue);
+    if ((!parentState || !parentState.scope_.parent_) && typeof prop !== "symbol" && (isMap(targetObject) ? targetObject.has(prop) : Object.prototype.propertyIsEnumerable.call(targetObject, prop)))
+      maybeFreeze(rootScope, childValue);
+  }
+}
+function maybeFreeze(scope, value, deep = false) {
+  if (!scope.parent_ && scope.immer_.autoFreeze_ && scope.canAutoFreeze_) {
+    freeze(value, deep);
+  }
+}
+
+// src/core/proxy.ts
+function createProxyProxy(base, parent) {
+  const isArray = Array.isArray(base);
+  const state = {
+    type_: isArray ? 1 /* Array */ : 0 /* Object */,
+    // Track which produce call this is associated with.
+    scope_: parent ? parent.scope_ : getCurrentScope(),
+    // True for both shallow and deep changes.
+    modified_: false,
+    // Used during finalization.
+    finalized_: false,
+    // Track which properties have been assigned (true) or deleted (false).
+    assigned_: {},
+    // The parent draft state.
+    parent_: parent,
+    // The base state.
+    base_: base,
+    // The base proxy.
+    draft_: null,
+    // set below
+    // The base copy with any updated values.
+    copy_: null,
+    // Called by the `produce` function.
+    revoke_: null,
+    isManual_: false
+  };
+  let target = state;
+  let traps = objectTraps;
+  if (isArray) {
+    target = [state];
+    traps = arrayTraps;
+  }
+  const { revoke, proxy } = Proxy.revocable(target, traps);
+  state.draft_ = proxy;
+  state.revoke_ = revoke;
+  return proxy;
+}
+var objectTraps = {
+  get(state, prop) {
+    if (prop === DRAFT_STATE)
+      return state;
+    const source = latest(state);
+    if (!has(source, prop)) {
+      return readPropFromProto(state, source, prop);
+    }
+    const value = source[prop];
+    if (state.finalized_ || !isDraftable(value)) {
+      return value;
+    }
+    if (value === peek(state.base_, prop)) {
+      prepareCopy(state);
+      return state.copy_[prop] = createProxy(value, state);
+    }
+    return value;
+  },
+  has(state, prop) {
+    return prop in latest(state);
+  },
+  ownKeys(state) {
+    return Reflect.ownKeys(latest(state));
+  },
+  set(state, prop, value) {
+    const desc = getDescriptorFromProto(latest(state), prop);
+    if (desc?.set) {
+      desc.set.call(state.draft_, value);
+      return true;
+    }
+    if (!state.modified_) {
+      const current2 = peek(latest(state), prop);
+      const currentState = current2?.[DRAFT_STATE];
+      if (currentState && currentState.base_ === value) {
+        state.copy_[prop] = value;
+        state.assigned_[prop] = false;
+        return true;
+      }
+      if (is(value, current2) && (value !== void 0 || has(state.base_, prop)))
+        return true;
+      prepareCopy(state);
+      markChanged(state);
+    }
+    if (state.copy_[prop] === value && // special case: handle new props with value 'undefined'
+    (value !== void 0 || prop in state.copy_) || // special case: NaN
+    Number.isNaN(value) && Number.isNaN(state.copy_[prop]))
+      return true;
+    state.copy_[prop] = value;
+    state.assigned_[prop] = true;
+    return true;
+  },
+  deleteProperty(state, prop) {
+    if (peek(state.base_, prop) !== void 0 || prop in state.base_) {
+      state.assigned_[prop] = false;
+      prepareCopy(state);
+      markChanged(state);
+    } else {
+      delete state.assigned_[prop];
+    }
+    if (state.copy_) {
+      delete state.copy_[prop];
+    }
+    return true;
+  },
+  // Note: We never coerce `desc.value` into an Immer draft, because we can't make
+  // the same guarantee in ES5 mode.
+  getOwnPropertyDescriptor(state, prop) {
+    const owner = latest(state);
+    const desc = Reflect.getOwnPropertyDescriptor(owner, prop);
+    if (!desc)
+      return desc;
+    return {
+      writable: true,
+      configurable: state.type_ !== 1 /* Array */ || prop !== "length",
+      enumerable: desc.enumerable,
+      value: owner[prop]
+    };
+  },
+  defineProperty() {
+    die(11);
+  },
+  getPrototypeOf(state) {
+    return getPrototypeOf(state.base_);
+  },
+  setPrototypeOf() {
+    die(12);
+  }
+};
+var arrayTraps = {};
+each(objectTraps, (key, fn) => {
+  arrayTraps[key] = function() {
+    arguments[0] = arguments[0][0];
+    return fn.apply(this, arguments);
+  };
+});
+arrayTraps.deleteProperty = function(state, prop) {
+  if (process.env.NODE_ENV !== "production" && isNaN(parseInt(prop)))
+    die(13);
+  return arrayTraps.set.call(this, state, prop, void 0);
+};
+arrayTraps.set = function(state, prop, value) {
+  if (process.env.NODE_ENV !== "production" && prop !== "length" && isNaN(parseInt(prop)))
+    die(14);
+  return objectTraps.set.call(this, state[0], prop, value, state[0]);
+};
+function peek(draft, prop) {
+  const state = draft[DRAFT_STATE];
+  const source = state ? latest(state) : draft;
+  return source[prop];
+}
+function readPropFromProto(state, source, prop) {
+  const desc = getDescriptorFromProto(source, prop);
+  return desc ? `value` in desc ? desc.value : (
+    // This is a very special case, if the prop is a getter defined by the
+    // prototype, we should invoke it with the draft as context!
+    desc.get?.call(state.draft_)
+  ) : void 0;
+}
+function getDescriptorFromProto(source, prop) {
+  if (!(prop in source))
+    return void 0;
+  let proto = getPrototypeOf(source);
+  while (proto) {
+    const desc = Object.getOwnPropertyDescriptor(proto, prop);
+    if (desc)
+      return desc;
+    proto = getPrototypeOf(proto);
+  }
+  return void 0;
+}
+function markChanged(state) {
+  if (!state.modified_) {
+    state.modified_ = true;
+    if (state.parent_) {
+      markChanged(state.parent_);
+    }
+  }
+}
+function prepareCopy(state) {
+  if (!state.copy_) {
+    state.copy_ = shallowCopy(
+      state.base_,
+      state.scope_.immer_.useStrictShallowCopy_
+    );
+  }
+}
+
+// src/core/immerClass.ts
+var Immer2 = class {
+  constructor(config) {
+    this.autoFreeze_ = true;
+    this.useStrictShallowCopy_ = false;
+    this.useStrictIteration_ = true;
+    /**
+     * The `produce` function takes a value and a "recipe function" (whose
+     * return value often depends on the base state). The recipe function is
+     * free to mutate its first argument however it wants. All mutations are
+     * only ever applied to a __copy__ of the base state.
+     *
+     * Pass only a function to create a "curried producer" which relieves you
+     * from passing the recipe function every time.
+     *
+     * Only plain objects and arrays are made mutable. All other objects are
+     * considered uncopyable.
+     *
+     * Note: This function is __bound__ to its `Immer` instance.
+     *
+     * @param {any} base - the initial state
+     * @param {Function} recipe - function that receives a proxy of the base state as first argument and which can be freely modified
+     * @param {Function} patchListener - optional function that will be called with all the patches produced here
+     * @returns {any} a new state, or the initial state if nothing was modified
+     */
+    this.produce = (base, recipe, patchListener) => {
+      if (typeof base === "function" && typeof recipe !== "function") {
+        const defaultBase = recipe;
+        recipe = base;
+        const self = this;
+        return function curriedProduce(base2 = defaultBase, ...args) {
+          return self.produce(base2, (draft) => recipe.call(this, draft, ...args));
+        };
+      }
+      if (typeof recipe !== "function")
+        die(6);
+      if (patchListener !== void 0 && typeof patchListener !== "function")
+        die(7);
+      let result;
+      if (isDraftable(base)) {
+        const scope = enterScope(this);
+        const proxy = createProxy(base, void 0);
+        let hasError = true;
+        try {
+          result = recipe(proxy);
+          hasError = false;
+        } finally {
+          if (hasError)
+            revokeScope(scope);
+          else
+            leaveScope(scope);
+        }
+        usePatchesInScope(scope, patchListener);
+        return processResult(result, scope);
+      } else if (!base || typeof base !== "object") {
+        result = recipe(base);
+        if (result === void 0)
+          result = base;
+        if (result === NOTHING)
+          result = void 0;
+        if (this.autoFreeze_)
+          freeze(result, true);
+        if (patchListener) {
+          const p = [];
+          const ip = [];
+          getPlugin("Patches").generateReplacementPatches_(base, result, p, ip);
+          patchListener(p, ip);
+        }
+        return result;
+      } else
+        die(1, base);
+    };
+    this.produceWithPatches = (base, recipe) => {
+      if (typeof base === "function") {
+        return (state, ...args) => this.produceWithPatches(state, (draft) => base(draft, ...args));
+      }
+      let patches, inversePatches;
+      const result = this.produce(base, recipe, (p, ip) => {
+        patches = p;
+        inversePatches = ip;
+      });
+      return [result, patches, inversePatches];
+    };
+    if (typeof config?.autoFreeze === "boolean")
+      this.setAutoFreeze(config.autoFreeze);
+    if (typeof config?.useStrictShallowCopy === "boolean")
+      this.setUseStrictShallowCopy(config.useStrictShallowCopy);
+    if (typeof config?.useStrictIteration === "boolean")
+      this.setUseStrictIteration(config.useStrictIteration);
+  }
+  createDraft(base) {
+    if (!isDraftable(base))
+      die(8);
+    if (isDraft(base))
+      base = current(base);
+    const scope = enterScope(this);
+    const proxy = createProxy(base, void 0);
+    proxy[DRAFT_STATE].isManual_ = true;
+    leaveScope(scope);
+    return proxy;
+  }
+  finishDraft(draft, patchListener) {
+    const state = draft && draft[DRAFT_STATE];
+    if (!state || !state.isManual_)
+      die(9);
+    const { scope_: scope } = state;
+    usePatchesInScope(scope, patchListener);
+    return processResult(void 0, scope);
+  }
+  /**
+   * Pass true to automatically freeze all copies created by Immer.
+   *
+   * By default, auto-freezing is enabled.
+   */
+  setAutoFreeze(value) {
+    this.autoFreeze_ = value;
+  }
+  /**
+   * Pass true to enable strict shallow copy.
+   *
+   * By default, immer does not copy the object descriptors such as getter, setter and non-enumrable properties.
+   */
+  setUseStrictShallowCopy(value) {
+    this.useStrictShallowCopy_ = value;
+  }
+  /**
+   * Pass false to use faster iteration that skips non-enumerable properties
+   * but still handles symbols for compatibility.
+   *
+   * By default, strict iteration is enabled (includes all own properties).
+   */
+  setUseStrictIteration(value) {
+    this.useStrictIteration_ = value;
+  }
+  shouldUseStrictIteration() {
+    return this.useStrictIteration_;
+  }
+  applyPatches(base, patches) {
+    let i;
+    for (i = patches.length - 1; i >= 0; i--) {
+      const patch = patches[i];
+      if (patch.path.length === 0 && patch.op === "replace") {
+        base = patch.value;
+        break;
+      }
+    }
+    if (i > -1) {
+      patches = patches.slice(i + 1);
+    }
+    const applyPatchesImpl = getPlugin("Patches").applyPatches_;
+    if (isDraft(base)) {
+      return applyPatchesImpl(base, patches);
+    }
+    return this.produce(
+      base,
+      (draft) => applyPatchesImpl(draft, patches)
+    );
+  }
+};
+function createProxy(value, parent) {
+  const draft = isMap(value) ? getPlugin("MapSet").proxyMap_(value, parent) : isSet(value) ? getPlugin("MapSet").proxySet_(value, parent) : createProxyProxy(value, parent);
+  const scope = parent ? parent.scope_ : getCurrentScope();
+  scope.drafts_.push(draft);
+  return draft;
+}
+
+// src/core/current.ts
+function current(value) {
+  if (!isDraft(value))
+    die(10, value);
+  return currentImpl(value);
+}
+function currentImpl(value) {
+  if (!isDraftable(value) || isFrozen(value))
+    return value;
+  const state = value[DRAFT_STATE];
+  let copy;
+  let strict = true;
+  if (state) {
+    if (!state.modified_)
+      return state.base_;
+    state.finalized_ = true;
+    copy = shallowCopy(value, state.scope_.immer_.useStrictShallowCopy_);
+    strict = state.scope_.immer_.shouldUseStrictIteration();
+  } else {
+    copy = shallowCopy(value, true);
+  }
+  each(
+    copy,
+    (key, childValue) => {
+      set(copy, key, currentImpl(childValue));
+    },
+    strict
+  );
+  if (state) {
+    state.finalized_ = false;
+  }
+  return copy;
+}
+
+// src/immer.ts
+var immer = new Immer2();
+var produce = immer.produce;
+
+function buildElementNotations(nodes) {
+  return t$a(
+    nodes,
+    n$5((n) => !!n.notation),
+    t$5(e$5("notation")),
+    t$3(
+      t$2(
+        t$5(e$5("shape")),
+        t$3(
+          t$2(
+            t$5(e$5("color")),
+            t$3(
+              t$2(
+                t$e(e$5("kind")),
+                n$6()
+              )
+            ),
+            t$d(),
+            t$e(([color, kinds]) => ({
+              kinds,
+              color
+            }))
+          )
+        ),
+        t$d(),
+        t$6(
+          ([shape, colors]) => colors.map(({ color, kinds }) => ({
+            shape,
+            color,
+            kinds
+          }))
+        )
+      )
+    ),
+    t$d(),
+    t$6(
+      ([title, shapes]) => shapes.map(({ shape, color, kinds }) => ({
+        title,
+        shape,
+        color,
+        kinds
+      }))
+    ),
+    t$1(
+      e$5("shape"),
+      e$5("title"),
+      [
+        (n) => n.kinds.length,
+        "desc"
+      ]
+    )
+  );
+}
+
+const changed = (a, b) => {
+  if (a === b || e$6(a) && e$6(b)) {
+    return false;
+  }
+  return !t$f(a, b);
+};
+const MAX_ALLOWED_DRIFT = 5;
+function autoApplyMetaAndStyles(draft, next) {
+  draft.color = next.color;
+  draft.kind = next.kind;
+  draft.navigateTo = next.navigateTo ?? null;
+  draft.links = next.links ? [...next.links] : null;
+  draft.tags = [...next.tags];
+  if (e$6(next.style.border)) {
+    delete draft.style.border;
+  } else {
+    draft.style.border = next.style.border;
+  }
+  if (e$1(next.style.opacity)) {
+    draft.style.opacity = next.style.opacity;
+  } else {
+    delete draft.style.opacity;
+  }
+  if (e$6(next.style.multiple)) {
+    delete draft.style.multiple;
+  } else {
+    draft.style.multiple = next.style.multiple;
+  }
+}
+function autoApplyIcon(draft, next, sizeNotChanged) {
+  if (changed(next.icon ?? "none", draft.icon ?? "none")) {
+    const iconWasSet = e$3(draft.icon) && draft.icon !== "none";
+    switch (true) {
+      // Icon was set before and changed, auto-apply
+      case (iconWasSet && e$3(next.icon) && next.icon !== "none"): {
+        draft.icon = next.icon;
+        return true;
+      }
+      // Icon was set before and now removed, auto-apply
+      case (iconWasSet && (e$6(next.icon) || next.icon === "none")): {
+        draft.icon = "none";
+        return true;
+      }
+      // Icon was added
+      case (!iconWasSet && e$3(next.icon) && next.icon !== "none"): {
+        if (sizeNotChanged) {
+          draft.icon = next.icon;
+          return true;
+        } else {
+          return false;
+        }
+      }
+    }
+  }
+  return true;
+}
+function autoApplyLabelsToLeaf(draft, next, sizeNotChanged) {
+  let applied = true;
+  if (changed(draft.title, next.title)) {
+    if (sizeNotChanged) {
+      draft.title = next.title;
+    } else {
+      applied = false;
+    }
+  }
+  if (changed(draft.description, next.description)) {
+    if (e$6(next.description)) {
+      delete draft.description;
+    } else if (sizeNotChanged) {
+      draft.description = next.description;
+    } else {
+      applied = false;
+    }
+  }
+  if (changed(draft.technology, next.technology)) {
+    if (e$6(next.technology)) {
+      delete draft.technology;
+    } else if (sizeNotChanged) {
+      draft.technology = next.technology;
+    } else {
+      applied = false;
+    }
+  }
+  return applied;
+}
+function autoApplyLabelsToCompound(draft, next, _sizeNotChanged) {
+  draft.title = next.title;
+  if (e$6(next.description)) {
+    delete draft.description;
+  } else {
+    draft.description = next.description;
+  }
+  if (e$6(next.technology)) {
+    delete draft.technology;
+  } else {
+    draft.technology = next.technology;
+  }
+  return true;
+}
+function applyManualLayout(autoLayouted, snapshot) {
+  invariant(autoLayouted.id === snapshot.id, "applyManualLayout: view ids do not match");
+  invariant(autoLayouted._stage === "layouted", "applyManualLayout: expected layouted view");
+  invariant(snapshot._stage === "layouted", "applyManualLayout: expected layouted snapshot");
+  invariant(autoLayouted._layout !== "manual", "applyManualLayout: expected auto-layouted view");
+  const viewDrifts = /* @__PURE__ */ new Set();
+  if (autoLayouted._type !== snapshot._type) {
+    viewDrifts.add("type-changed");
+  }
+  const nextNodes = new Map(autoLayouted.nodes.map((n) => [n.id, n]));
+  const nextEdges = new Map(autoLayouted.edges.map((e) => [e.id, e]));
+  const nextNodeIds = new Set(nextNodes.keys());
+  const nextEdgeIds = new Set(nextEdges.keys());
+  const snapshotNodeIds = new Set(snapshot.nodes.map((n) => n.id));
+  const snapshotEdgeIds = new Set(snapshot.edges.map((e) => e.id));
+  if (symmetricDifference(nextNodeIds, snapshotNodeIds).size > 0) {
+    viewDrifts.add("nodes-mismatch");
+  }
+  if (symmetricDifference(nextEdgeIds, snapshotEdgeIds).size > 0) {
+    viewDrifts.add("edges-mismatch");
+  }
+  const nodes = snapshot.nodes.map((node) => {
+    const next = nextNodes.get(node.id);
+    return produce(node, (draft) => {
+      if (!next) {
+        draft.drifts = ["missing"];
+        return;
+      }
+      autoApplyMetaAndStyles(draft, next);
+      const nodeDrifts = /* @__PURE__ */ new Set();
+      const wasCompound = node.children.length > 0;
+      const willBeCompound = next.children.length > 0;
+      if (changed(draft.modelRef, next.modelRef) || changed(draft.deploymentRef, next.deploymentRef)) {
+        nodeDrifts.add("modelRef-changed");
+      }
+      if (willBeCompound && !wasCompound) {
+        nodeDrifts.add("became-compound");
+      }
+      if (!willBeCompound && wasCompound) {
+        nodeDrifts.add("became-leaf");
+      }
+      if (changed(draft.parent, next.parent)) {
+        nodeDrifts.add("parent-changed");
+      }
+      const sizeNotChanged = draft.width + MAX_ALLOWED_DRIFT >= next.width && draft.height + MAX_ALLOWED_DRIFT >= next.height;
+      if (changed(draft.shape, next.shape)) {
+        if (sizeNotChanged) {
+          draft.shape = next.shape;
+        } else {
+          nodeDrifts.add("shape-changed");
+        }
+      }
+      if (!autoApplyIcon(draft, next, sizeNotChanged && willBeCompound === wasCompound)) {
+        nodeDrifts.add("label-changed");
+      }
+      const autoApplyLabels = wasCompound ? autoApplyLabelsToCompound : autoApplyLabelsToLeaf;
+      if (!autoApplyLabels(draft, next, sizeNotChanged)) {
+        nodeDrifts.add("label-changed");
+      }
+      if (changed(node.notation, next.notation)) {
+        draft.notation = next.notation ?? null;
+      }
+      if (wasCompound && willBeCompound && symmetricDifference(new Set(node.children), new Set(next.children)).size > 0) {
+        nodeDrifts.add("children-changed");
+      }
+      const _drifts = [...nodeDrifts];
+      if (t$c(_drifts, 1)) {
+        viewDrifts.add("nodes-mismatch");
+        draft.drifts = _drifts;
+      }
+    });
+  });
+  const edges = snapshot.edges.map((edge) => {
+    const next = nextEdges.get(edge.id);
+    return produce(edge, (draft) => {
+      if (!next) {
+        draft.drifts = ["missing"];
+        return;
+      }
+      const edgeDrifts = /* @__PURE__ */ new Set();
+      if (draft.source === next.target && draft.target === next.source) {
+        edgeDrifts.add("direction-changed");
+      } else {
+        if (draft.source !== next.source) {
+          edgeDrifts.add("source-changed");
+        }
+        if (draft.target !== next.target) {
+          edgeDrifts.add("target-changed");
+        }
+      }
+      if (edgeDrifts.size === 0 && changed(draft.dir ?? "forward", next.dir ?? "forward")) {
+        edgeDrifts.add("direction-changed");
+      }
+      draft.color = next.color;
+      draft.line = next.line;
+      draft.navigateTo = next.navigateTo ?? null;
+      draft.tags = next.tags ? [...next.tags] : null;
+      if (e$6(next.notes)) {
+        delete draft.notes;
+      } else {
+        draft.notes = next.notes;
+      }
+      if (next.astPath) {
+        draft.astPath = next.astPath;
+      }
+      if (next.labelBBox) {
+        if (!draft.labelBBox || !e$3(draft.label) && e$3(next.label)) {
+          edgeDrifts.add("label-changed");
+        }
+        draft.labelBBox = {
+          // Preserve x,y if possible
+          x: draft.labelBBox?.x ?? next.labelBBox.x,
+          y: draft.labelBBox?.y ?? next.labelBBox.y,
+          // Take width/height from next
+          width: next.labelBBox.width,
+          height: next.labelBBox.height
+        };
+        draft.label = next.label;
+        draft.description = next.description ?? null;
+        draft.technology = next.technology ?? null;
+      } else if (edge.labelBBox) {
+        edgeDrifts.add("label-changed");
+      }
+      const _drifts = [...edgeDrifts];
+      if (t$c(_drifts, 1)) {
+        viewDrifts.add("edges-mismatch");
+        draft.drifts = _drifts;
+      }
+    });
+  });
+  const nodeNotations = buildElementNotations(nodes);
+  const result = { ...snapshot };
+  Object.assign(
+    result,
+    {
+      // Auto-layouted properties
+      title: autoLayouted.title ?? snapshot.title,
+      description: autoLayouted.description ?? snapshot.description,
+      tags: autoLayouted.tags ? [...autoLayouted.tags] : null,
+      links: autoLayouted.links ? [...autoLayouted.links] : null,
+      [_layout]: "manual",
+      ...nodeNotations && nodeNotations.length > 0 ? { notation: { nodes: nodeNotations } } : {},
+      nodes,
+      edges
+    }
+  );
+  if (isDynamicView(autoLayouted) && result._type === "dynamic") {
+    Object.assign(
+      result,
+      {
+        variant: autoLayouted.variant
+      }
+    );
+  }
+  const drifts = [...viewDrifts];
+  if (t$c(drifts, 1)) {
+    result.drifts = drifts;
+  } else {
+    if ("drifts" in result) {
+      delete result.drifts;
+    }
+  }
+  return result;
+}
+function applyLayoutDriftReasons(autoLayouted, snapshot) {
+  const { drifts } = applyManualLayout(autoLayouted, snapshot);
+  if (drifts) {
+    Object.assign(
+      autoLayouted,
+      {
+        [_layout]: "auto",
+        drifts
+      }
+    );
+  } else {
+    const mutable = autoLayouted;
+    if ("drifts" in autoLayouted) {
+      delete mutable.drifts;
+    }
+  }
+  return autoLayouted;
+}
+
 class EdgeModel {
-  constructor(view, $edge, source, target) {
-    this.view = view;
-    this.$edge = $edge;
+  constructor($viewModel, $edge, source, target) {
     this.source = source;
     this.target = target;
-    this.#edge = $edge;
+    this.$viewModel = $viewModel;
+    this.$view = $viewModel.$view;
+    this.$edge = $edge;
   }
-  #edge;
+  Aux;
+  $viewModel;
+  $view;
+  $edge;
   get id() {
-    return this.#edge.id;
+    return this.$edge.id;
   }
   get parent() {
-    return this.#edge.parent ? this.view.node(this.#edge.parent) : null;
+    return this.$edge.parent ? this.$viewModel.node(this.$edge.parent) : null;
   }
   get label() {
-    return this.#edge.label ?? null;
+    return this.$edge.label ?? null;
   }
   get description() {
-    return RichText.memoize(this, "description", this.#edge.description);
+    return RichText.memoize(this, "description", this.$edge.description);
   }
   get technology() {
-    return this.#edge.technology ?? null;
+    return this.$edge.technology ?? null;
   }
   hasParent() {
-    return this.#edge.parent !== null;
+    return this.$edge.parent !== null;
   }
   get tags() {
-    return this.#edge.tags ?? [];
+    return this.$edge.tags ?? [];
   }
   get stepNumber() {
     return this.isStep() ? extractStep(this.id) : null;
   }
   get navigateTo() {
-    return this.#edge.navigateTo ? this.view.$model.view(this.#edge.navigateTo) : null;
+    return this.$edge.navigateTo ? this.$viewModel.$model.view(this.$edge.navigateTo) : null;
   }
   get color() {
-    return this.#edge.color;
+    return this.$edge.color;
   }
   get line() {
-    return this.#edge.line ?? this.view.$model.$styles.defaults.relationship.line;
+    return this.$edge.line ?? this.$viewModel.$styles.defaults.relationship.line;
   }
   get head() {
-    return this.#edge.head ?? this.view.$model.$styles.defaults.relationship.arrow;
+    return this.$edge.head ?? this.$viewModel.$styles.defaults.relationship.arrow;
   }
   get tail() {
-    return this.#edge.tail;
+    return this.$edge.tail;
   }
   isStep() {
     return isStepEdgeId(this.id);
   }
   *relationships(type) {
-    for (const id of this.#edge.relations) {
+    for (const id of this.$edge.relations) {
       if (type) {
-        const rel = this.view.$model.findRelationship(id, type);
+        const rel = this.$viewModel.$model.findRelationship(id, type);
         if (rel) {
           yield rel;
         }
       } else {
-        yield this.view.$model.relationship(id);
+        yield this.$viewModel.$model.relationship(id);
       }
     }
     return;
   }
   includesRelation(rel) {
     const id = typeof rel === "string" ? rel : rel.id;
-    return this.#edge.relations.includes(id);
+    return this.$edge.relations.includes(id);
   }
   isTagged(tag) {
     return this.tags.includes(tag);
@@ -795,61 +1926,76 @@ class EdgeModel {
 }
 
 class NodeModel {
-  constructor($view, $node) {
-    this.$view = $view;
+  Aux;
+  $viewModel;
+  $view;
+  $node;
+  constructor($viewModel, $node) {
+    this.$viewModel = $viewModel;
+    this.$view = $viewModel.$view;
     this.$node = $node;
-    this.#node = $node;
   }
-  #node;
   get id() {
-    return this.#node.id;
+    return this.$node.id;
   }
   get title() {
-    return this.#node.title;
+    return this.$node.title;
   }
   get kind() {
-    return this.#node.kind;
+    return this.$node.kind;
   }
   get description() {
-    return RichText.memoize(this, "description", this.#node.description);
+    return RichText.memoize(this, "description", this.$node.description);
   }
   get technology() {
-    return this.#node.technology ?? null;
+    return this.$node.technology ?? null;
   }
   get parent() {
-    return this.#node.parent ? this.$view.node(this.#node.parent) : null;
+    return this.$node.parent ? this.$viewModel.node(this.$node.parent) : null;
   }
   get element() {
-    const modelRef = this.#node.modelRef;
-    return modelRef ? this.$view.$model.element(modelRef) : null;
+    const modelRef = this.$node.modelRef;
+    return modelRef ? this.$viewModel.$model.element(modelRef) : null;
   }
   get deployment() {
-    const modelRef = this.#node.deploymentRef;
-    return modelRef ? this.$view.$model.deployment.element(modelRef) : null;
+    const modelRef = this.$node.deploymentRef;
+    return modelRef ? this.$viewModel.$model.deployment.element(modelRef) : null;
   }
   get shape() {
-    return this.#node.shape;
+    return this.$node.shape;
   }
   get color() {
-    return this.#node.color;
+    return this.$node.color;
   }
   get icon() {
-    return this.#node.icon ?? null;
+    return this.$node.icon ?? null;
   }
   get tags() {
-    return this.#node.tags;
+    return this.$node.tags;
   }
   get links() {
-    return this.#node.links ?? [];
+    return this.$node.links ?? [];
   }
   get navigateTo() {
-    return this.#node.navigateTo ? this.$view.$model.view(this.#node.navigateTo) : null;
+    return this.$node.navigateTo ? this.$viewModel.$model.view(this.$node.navigateTo) : null;
   }
   get style() {
-    return this.#node.style;
+    return this.$node.style;
+  }
+  get x() {
+    return "x" in this.$node ? this.$node.x : void 0;
+  }
+  get y() {
+    return "y" in this.$node ? this.$node.y : void 0;
+  }
+  get width() {
+    return "width" in this.$node ? this.$node.width : void 0;
+  }
+  get height() {
+    return "height" in this.$node ? this.$node.height : void 0;
   }
   children() {
-    return memoizeProp(this, "children", () => new Set(this.#node.children.map((child) => this.$view.node(child))));
+    return memoizeProp(this, "children", () => new Set(this.$node.children.map((child) => this.$viewModel.node(child))));
   }
   /**
    * Get all ancestor elements (i.e. parent, parent’s parent, etc.)
@@ -864,7 +2010,7 @@ class NodeModel {
     return;
   }
   *siblings() {
-    const siblings = this.parent?.children() ?? this.$view.roots();
+    const siblings = this.parent?.children() ?? this.$viewModel.roots();
     for (const sibling of siblings) {
       if (sibling.id !== this.id) {
         yield sibling;
@@ -873,8 +2019,8 @@ class NodeModel {
     return;
   }
   *incoming(filter = "all") {
-    for (const edgeId of this.#node.inEdges) {
-      const edge = this.$view.edge(edgeId);
+    for (const edgeId of this.$node.inEdges) {
+      const edge = this.$viewModel.edge(edgeId);
       switch (true) {
         case filter === "all":
         case (filter === "direct" && edge.target.id === this.id):
@@ -897,8 +2043,8 @@ class NodeModel {
     return;
   }
   *outgoing(filter = "all") {
-    for (const edgeId of this.#node.outEdges) {
-      const edge = this.$view.edge(edgeId);
+    for (const edgeId of this.$node.outEdges) {
+      const edge = this.$viewModel.edge(edgeId);
       switch (true) {
         case filter === "all":
         case (filter === "direct" && edge.source.id === this.id):
@@ -920,26 +2066,26 @@ class NodeModel {
     }
     return;
   }
-  isDiagramNode() {
-    return "width" in this.#node && "height" in this.#node;
+  isLayouted() {
+    return "width" in this.$node && "height" in this.$node;
   }
   hasChildren() {
-    return this.#node.children.length > 0;
+    return this.$node.children.length > 0;
   }
   hasParent() {
-    return this.#node.parent !== null;
+    return this.$node.parent !== null;
   }
   /**
    * Check if this node references to logical model element.
    */
   hasElement() {
-    return e$3(this.#node.modelRef);
+    return e$3(this.$node.modelRef);
   }
   /**
    * Check if this node references to deployment element (Node or Instance).
    */
   hasDeployment() {
-    return e$3(this.#node.deploymentRef);
+    return e$3(this.$node.deploymentRef);
   }
   /**
    * Check if this node references to deployed instance
@@ -949,7 +2095,7 @@ class NodeModel {
     return this.hasElement() && this.hasDeployment();
   }
   isGroup() {
-    return isGroupElementKind(this.#node);
+    return isGroupElementKind(this.$node);
   }
   /**
    * Checks if the node has the given tag.
@@ -964,6 +2110,7 @@ class LikeC4ViewModel {
    * Don't use in runtime, only for type inference
    */
   Aux;
+  #view;
   #rootnodes = /* @__PURE__ */ new Set();
   #nodes = /* @__PURE__ */ new Map();
   #edges = /* @__PURE__ */ new Map();
@@ -971,8 +2118,15 @@ class LikeC4ViewModel {
   #includeDeployments = /* @__PURE__ */ new Set();
   #includeRelations = /* @__PURE__ */ new Set();
   #allTags = new DefaultMap((_key) => /* @__PURE__ */ new Set());
-  $view;
+  #manualLayoutSnapshot;
+  id;
+  /**
+   * The model this view belongs to
+   */
   $model;
+  /**
+   * The title of the view
+   */
   title;
   /**
    * View folder this view belongs to.
@@ -986,27 +2140,29 @@ class LikeC4ViewModel {
    * "Group 1/Group 2/View"
    */
   viewPath;
-  constructor(model, view, folder) {
+  constructor(model, folder, view, manualLayoutSnapshot) {
     this.$model = model;
-    this.$view = view;
+    this.#view = view;
+    this.id = view.id;
     this.folder = folder;
-    for (const node of view.nodes) {
+    this.#manualLayoutSnapshot = manualLayoutSnapshot;
+    for (const node of this.#view.nodes) {
       const el = new NodeModel(this, Object.freeze(node));
       this.#nodes.set(node.id, el);
       if (!node.parent) {
         this.#rootnodes.add(el);
       }
-      if (el.hasDeployment()) {
-        this.#includeDeployments.add(el.deployment.id);
+      if (node.deploymentRef) {
+        this.#includeDeployments.add(node.deploymentRef);
       }
-      if (el.hasElement()) {
-        this.#includeElements.add(el.element.id);
+      if (node.modelRef) {
+        this.#includeElements.add(node.modelRef);
       }
       for (const tag of el.tags) {
         this.#allTags.get(tag).add(el);
       }
     }
-    for (const edge of view.edges) {
+    for (const edge of this.#view.edges) {
       const edgeModel = new EdgeModel(
         this,
         Object.freeze(edge),
@@ -1021,14 +2177,29 @@ class LikeC4ViewModel {
       }
       this.#edges.set(edge.id, edgeModel);
     }
-    this.title = this.$view.title ? extractViewTitleFromPath(this.$view.title) : null;
-    this.viewPath = this.$view.title ? normalizeViewPath(this.$view.title) : this.$view.id;
+    this.title = view.title ? extractViewTitleFromPath(view.title) : null;
+    this.viewPath = view.title ? normalizeViewPath(view.title) : view.id;
+  }
+  /**
+   * Returns the styles configuration for the project.
+   */
+  get $styles() {
+    return this.$model.$styles;
   }
   get _type() {
-    return this.$view[_type];
+    return this.#view[_type];
   }
-  get id() {
-    return this.$view.id;
+  get stage() {
+    return this.#view[_stage];
+  }
+  get bounds() {
+    if ("bounds" in this.#view) {
+      return this.#view.bounds;
+    }
+    if (this.#manualLayoutSnapshot) {
+      return this.#manualLayoutSnapshot.bounds;
+    }
+    throw new Error("View is not layouted");
   }
   /**
    * Returns title if defined, otherwise returns title of the element it is based on, otherwise returns its {@link id}
@@ -1064,17 +2235,17 @@ class LikeC4ViewModel {
     });
   }
   get description() {
-    return RichText.memoize(this, "description", this.$view.description);
+    return RichText.memoize(this, "description", this.#view.description);
   }
   get tags() {
-    return this.$view.tags ?? [];
+    return this.#view.tags ?? [];
   }
   get links() {
-    return this.$view.links ?? [];
+    return this.#view.links ?? [];
   }
   get viewOf() {
     if (this.isElementView()) {
-      const viewOf = this.$view.viewOf;
+      const viewOf = this.#view.viewOf;
       return viewOf ? this.$model.element(viewOf) : null;
     }
     return null;
@@ -1085,9 +2256,9 @@ class LikeC4ViewModel {
    */
   get mode() {
     if (this.isDynamicView()) {
-      return this.$view.variant ?? "diagram";
+      return this.#view.variant ?? "diagram";
     }
-    throw new Error("View is not dynamic");
+    return null;
   }
   /**
    * All tags from nodes and edges.
@@ -1095,6 +2266,60 @@ class LikeC4ViewModel {
   get includedTags() {
     return [...this.#allTags.keys()];
   }
+  /**
+   * The original view (auto-layouted).
+   * @see {@link $layouted} should be used for rendering in the UI
+   */
+  get $view() {
+    if (!this.isLayouted() || "drifts" in this.#view) {
+      return this.#view;
+    }
+    const snapshot = this.#manualLayoutSnapshot;
+    if (snapshot) {
+      return memoizeProp(this, "withDriftReasons", () => {
+        return applyLayoutDriftReasons(this.#view, snapshot);
+      });
+    }
+    return this.#view;
+  }
+  /**
+   * Returns the view with manual layout applied if it exists, otherwise returns the original view
+   * This should be used for rendering in the UI
+   */
+  get $layouted() {
+    if (!this.isLayouted()) {
+      throw new Error("View is not layouted");
+    }
+    return this.manualLayouted ?? this.#view;
+  }
+  get hasManualLayout() {
+    return this.#manualLayoutSnapshot !== void 0;
+  }
+  /**
+   * If view has manual layout, returns it with manual layout applied
+   */
+  get manualLayouted() {
+    if (!this.isLayouted()) {
+      return null;
+    }
+    const snapshot = this.#manualLayoutSnapshot;
+    if (snapshot) {
+      return memoizeProp(this, "snapshotWithManualLayout", () => {
+        return applyManualLayout(this.#view, snapshot);
+      });
+    }
+    return null;
+  }
+  /**
+   * Returns the layout drift reasons, if any
+   * (Only for layouted views with manual layout)
+   */
+  get driftReasons() {
+    if (!this.isLayouted()) {
+      return [];
+    }
+    return this.$view.drifts ?? [];
+  }
   roots() {
     return this.#rootnodes.values();
   }
@@ -1115,7 +2340,7 @@ class LikeC4ViewModel {
    */
   node(node) {
     const nodeId = getId(node);
-    return nonNullable(this.#nodes.get(nodeId), `Node ${nodeId} not found in view ${this.$view.id}`);
+    return nonNullable(this.#nodes.get(nodeId), `Node ${nodeId} not found in view ${this.#view.id}`);
   }
   /**
    * Find node by id.
@@ -1125,6 +2350,9 @@ class LikeC4ViewModel {
   }
   findNodeWithElement(element) {
     const id = getId(element);
+    if (!this.#includeElements.has(id)) {
+      return null;
+    }
     return ifind(
       this.#nodes.values(),
       (node) => node.hasElement() && node.element.id === id
@@ -1145,7 +2373,7 @@ class LikeC4ViewModel {
    */
   edge(edge) {
     const edgeId = getId(edge);
-    return nonNullable(this.#edges.get(edgeId), `Edge ${edgeId} not found in view ${this.$view.id}`);
+    return nonNullable(this.#edges.get(edgeId), `Edge ${edgeId} not found in view ${this.#view.id}`);
   }
   /**
    * Find edge by id.
@@ -1202,22 +2430,28 @@ class LikeC4ViewModel {
    * Below are type guards.
    */
   isComputed() {
-    return this.$view[_stage] === "computed";
+    return this.#view[_stage] === "computed";
+  }
+  isLayouted() {
+    return this.#view[_stage] === "layouted";
   }
+  /**
+   * @deprecated Use {@link isLayouted} instead
+   */
   isDiagram() {
-    return this.$view[_stage] === "layouted";
+    return this.#view[_stage] === "layouted";
   }
   isElementView() {
-    return this.$view[_type] === "element";
+    return this.#view[_type] === "element";
   }
   isScopedElementView() {
-    return this.$view[_type] === "element" && e$3(this.$view.viewOf);
+    return this.#view[_type] === "element" && e$3(this.#view.viewOf);
   }
   isDeploymentView() {
-    return this.$view[_type] === "deployment";
+    return this.#view[_type] === "deployment";
   }
   isDynamicView() {
-    return this.$view[_type] === "dynamic";
+    return this.#view[_type] === "dynamic";
   }
 }
 
@@ -1372,14 +2606,10 @@ class LikeC4Model {
   _views = /* @__PURE__ */ new Map();
   _rootViewFolder;
   _viewFolders = /* @__PURE__ */ new Map();
-  _viewFolderItems = new DefaultMap(
-    () => /* @__PURE__ */ new Set()
-  );
-  _allTags = new DefaultMap(
-    () => /* @__PURE__ */ new Set()
-  );
+  _viewFolderItems = new DefaultMap(() => /* @__PURE__ */ new Set());
+  _allTags = new DefaultMap(() => /* @__PURE__ */ new Set());
   static fromParsed(model) {
-    return new LikeC4Model(model).asParsed;
+    return new LikeC4Model(model);
   }
   static create(model) {
     return new LikeC4Model(model);
@@ -1429,13 +2659,13 @@ class LikeC4Model {
   $data;
   constructor($data) {
     this.$data = $data;
-    for (const [, element] of t$6($data.elements)) {
+    for (const [, element] of t$d($data.elements)) {
       const el = this.addElement(element);
       for (const tag of el.tags) {
         this._allTags.get(tag).add(el);
       }
     }
-    for (const [projectId, elements] of t$6($data.imports ?? {})) {
+    for (const [projectId, elements] of t$d($data.imports ?? {})) {
       for (const element of sortParentsFirst(elements)) {
         const el = this.addImportedElement(projectId, element);
         for (const tag of el.tags) {
@@ -1452,21 +2682,22 @@ class LikeC4Model {
     this.deployment = new LikeC4DeploymentModel(this);
     if (isOnStage($data, "computed") || isOnStage($data, "layouted")) {
       const compare = compareNaturalHierarchically(VIEW_FOLDERS_SEPARATOR);
+      t($data.views);
       const views = t$a(
         t($data.views),
-        t$b((view) => ({
+        t$e((view) => ({
           view,
           path: normalizeViewPath(view.title ?? view.id),
           folderPath: view.title && getViewFolderPath(view.title) || ""
         })),
         // Sort hierarchically by groups, but keep same order within groups
-        t$2((a, b) => compare(a.folderPath, b.folderPath))
+        t$g((a, b) => compare(a.folderPath, b.folderPath))
       );
       const getOrCreateFolder = (path) => {
         let folder = this._viewFolders.get(path);
         if (!folder) {
           const segments = e(path, VIEW_FOLDERS_SEPARATOR);
-          invariant(t$9(segments, 1), `View group path "${path}" must have at least one element`);
+          invariant(t$c(segments, 1), `View group path "${path}" must have at least one element`);
           let defaultView;
           if (path === "") {
             defaultView = views.find((view) => view.view.id === "index");
@@ -1493,7 +2724,12 @@ class LikeC4Model {
         }, []);
       }
       for (const { view, folderPath } of views) {
-        const vm = new LikeC4ViewModel(this, view, getOrCreateFolder(folderPath));
+        const vm = new LikeC4ViewModel(
+          this,
+          getOrCreateFolder(folderPath),
+          view,
+          $data.manualLayouts?.[view.id]
+        );
         this._viewFolderItems.get(folderPath).add(vm);
         this._views.set(view.id, vm);
         for (const tag of vm.tags) {
@@ -1832,7 +3068,7 @@ class LikeC4Model {
    * Use {@link specification.tags} to get all defined tags
    */
   get tags() {
-    return memoizeProp(this, "tags", () => t$2([...this._allTags.keys()], compareNatural));
+    return memoizeProp(this, "tags", () => t$g([...this._allTags.keys()], compareNatural));
   }
   /**
    * Returns all tags used in the model, sorted by usage count (descending).
@@ -1840,14 +3076,14 @@ class LikeC4Model {
   get tagsSortedByUsage() {
     return memoizeProp(this, "tagsSortedByUsage", () => t$a(
       [...this._allTags.entries()],
-      t$b(([tag, tagged]) => ({
+      t$e(([tag, tagged]) => ({
         tag,
         count: tagged.size,
         tagged
       })),
-      t$2((a, b) => compareNatural(a.tag, b.tag)),
+      t$g((a, b) => compareNatural(a.tag, b.tag)),
       t$1(
-        [e$1("count"), "desc"]
+        [e$5("count"), "desc"]
       )
     ));
   }
@@ -2063,4 +3299,4 @@ function isEdgeModel(edge) {
   return edge instanceof EdgeModel;
 }
 
-export { ElementModel as E, LikeC4Model as L, NodeModel as N, RelationshipModel as R, VIEW_FOLDERS_SEPARATOR as V, t$6 as a, t$1 as b, t$4 as c, isNestedElementOfDeployedInstanceModel as d, e$1 as e, isDeployedInstanceModel as f, isDeploymentNodeModel as g, isDeploymentElementModel as h, isElementModel as i, LikeC4DeploymentModel as j, EdgeModel as k, LikeC4ViewModel as l, LikeC4ViewsFolder as m, extractViewTitleFromPath as n, getViewFolderPath as o, normalizeViewPath as p, isDeploymentRelationModel as q, isRelationModel as r, isLikeC4ViewModel as s, t, isNodeModel as u, isEdgeModel as v };
+export { isEdgeModel as A, ElementModel as E, LikeC4Model as L, NodeModel as N, RelationshipModel as R, VIEW_FOLDERS_SEPARATOR as V, t$3 as a, t$4 as b, t$2 as c, t$5 as d, t$6 as e, isNestedElementOfDeployedInstanceModel as f, isDeployedInstanceModel as g, isDeploymentNodeModel as h, isElementModel as i, isDeploymentElementModel as j, buildElementNotations as k, LikeC4DeploymentModel as l, EdgeModel as m, n$5 as n, LikeC4ViewModel as o, LikeC4ViewsFolder as p, extractViewTitleFromPath as q, getViewFolderPath as r, normalizeViewPath as s, t, applyLayoutDriftReasons as u, applyManualLayout as v, isDeploymentRelationModel as w, isRelationModel as x, isLikeC4ViewModel as y, isNodeModel as z };