2 files changed, 39 insertions, 21 deletions

diff --git a/src/new_fields/Doc.ts b/src/new_fields/Doc.ts
index 529634990..69717e612 100644
--- a/src/new_fields/Doc.ts
+++ b/src/new_fields/Doc.ts
@@ -1,4 +1,4 @@
-import { observable, ObservableMap, runInAction, action } from "mobx";
+import { observable, ObservableMap, runInAction, action, computed } from "mobx";
 import { alias, map, serializable } from "serializr";
 import { DocServer } from "../client/DocServer";
 import { DocumentType } from "../client/documents/DocumentTypes";
@@ -90,6 +90,7 @@ export function DocListCast(field: FieldResult): Doc[] {
 export const WidthSym = Symbol("Width");
 export const HeightSym = Symbol("Height");
 export const DataSym = Symbol("Data");
+export const LayoutSym = Symbol("Layout");
 export const UpdatingFromServer = Symbol("UpdatingFromServer");
 const CachedUpdates = Symbol("Cached updates");
 
@@ -168,6 +169,17 @@ export class Doc extends RefField {
     public [WidthSym] = () => NumCast(this[SelfProxy]._width);
     public [HeightSym] = () => NumCast(this[SelfProxy]._height);
     public get [DataSym]() { return Cast(this[SelfProxy].resolvedDataDoc, Doc, null) || this[SelfProxy]; }
+    @computed public get __LAYOUT__() {
+        const layoutKey = StrCast(this[SelfProxy].layoutKey);
+        const resolvedLayout = Cast(this[SelfProxy][layoutKey], Doc);
+        if (resolvedLayout instanceof Doc) {
+            let x = resolvedLayout[Id];
+            let layout = (resolvedLayout.layout as string).split("'")[1];
+            const layoutDoc = this[SelfProxy][layout + "-layout[" + x + "]"];
+            return layoutDoc || this[SelfProxy];
+        }
+        return undefined;
+    }
 
     [ToScriptString]() {
         return "invalid";
diff --git a/src/new_fields/util.ts b/src/new_fields/util.ts
index 45ec676b2..26c10525e 100644
--- a/src/new_fields/util.ts
+++ b/src/new_fields/util.ts
@@ -1,5 +1,5 @@
 import { UndoManager } from "../client/util/UndoManager";
-import { Doc, Field, FieldResult, UpdatingFromServer } from "./Doc";
+import { Doc, Field, FieldResult, UpdatingFromServer, LayoutSym } from "./Doc";
 import { SerializationHelper } from "../client/util/SerializationHelper";
 import { ProxyField, PrefetchProxy } from "./Proxy";
 import { RefField } from "./RefField";
@@ -104,41 +104,47 @@ let layoutProps = ["panX", "panY", "width", "height", "nativeWidth", "nativeHeig
     "LODdisable", "chromeStatus", "viewType", "gridGap", "xMargin", "yMargin", "autoHeight"];
 export function setter(target: any, in_prop: string | symbol | number, value: any, receiver: any): boolean {
     let prop = in_prop;
-    if (typeof prop === "string" && prop !== "__id" && prop !== "__fields" &&
+    if (typeof prop === "string" && prop !== "__id" && prop !== "__LAYOUT__" && prop !== "__fields" &&
         ((prop as string).startsWith("_") || layoutProps.includes(prop))) {
         if (!prop.startsWith("_")) {
             console.log(prop + " is deprecated - switch to _" + prop);
             prop = "_" + prop;
         }
-        const resolvedLayout = getFieldImpl(target, getFieldImpl(target, "layoutKey", receiver), receiver);
-        if (resolvedLayout instanceof Doc) {
-            let x = resolvedLayout[Id];
-            let layout = (resolvedLayout.layout as string).split("'")[1];
-            let expanded = getFieldImpl(target, layout + "-layout[" + x + "]", receiver);
-            expanded && (expanded[prop] = value);
-            // resolvedLayout[prop] = value;
-            return true;
-        }
+        const self = target[Self];
+        const layoutDoc = (self || target).__LAYOUT__;
+        if (layoutDoc) layoutDoc[prop] = value;
+        // const resolvedLayout = getFieldImpl(target, getFieldImpl(target, "layoutKey", receiver), receiver);
+        // if (resolvedLayout instanceof Doc) {
+        //     let x = resolvedLayout[Id];
+        //     let layout = (resolvedLayout.layout as string).split("'")[1];
+        //     let expanded = getFieldImpl(target, layout + "-layout[" + x + "]", receiver);
+        //     expanded && (expanded[prop] = value);
+        //     // resolvedLayout[prop] = value;
+        //     return true;
+        // }
     }
     return _setter(target, prop, value, receiver);
 }
 
 export function getter(target: any, in_prop: string | symbol | number, receiver: any): any {
     let prop = in_prop;
-    if (typeof prop === "string" && prop !== "__id" && prop !== "__fields" &&
+    if (typeof prop === "string" && prop !== "__id" && prop !== "__LAYOUT__" && prop !== "__fields" &&
         ((prop as string).startsWith("_") || layoutProps.includes(prop))) {
         if (!prop.startsWith("_")) {
             console.log(prop + " is deprecated - switch to _" + prop);
             prop = "_" + prop;
         }
-        const resolvedLayout = getFieldImpl(target, getFieldImpl(target, "layoutKey", receiver), receiver);
-        if (resolvedLayout instanceof Doc) {
-            let x = resolvedLayout[Id];
-            let layout = (resolvedLayout.layout as string).split("'")[1];
-            let expanded = getFieldImpl(target, layout + "-layout[" + x + "]", receiver);
-            return (expanded || resolvedLayout)?.[prop];
-            //return resolvedLayout[prop];
-        }
+        const self = target[Self];
+        const layoutDoc = (self || target).__LAYOUT__;
+        if (layoutDoc) return layoutDoc[prop];
+        // const resolvedLayout = getFieldImpl(target, getFieldImpl(target, "layoutKey", receiver), receiver);
+        // if (resolvedLayout instanceof Doc) {
+        //     let x = resolvedLayout[Id];
+        //     let layout = (resolvedLayout.layout as string).split("'")[1];
+        //     let expanded = getFieldImpl(target, layout + "-layout[" + x + "]", receiver);
+        //     return (expanded || resolvedLayout)?.[prop];
+        //     //return resolvedLayout[prop];
+        // }
     }
     if (prop === "then") {//If we're being awaited
         return undefined;