diff --git a/app/srv/ws/sync/editor/load-page.ts b/app/srv/ws/sync/editor/load-page.ts
index 8e27d967..6a56a83a 100644
--- a/app/srv/ws/sync/editor/load-page.ts
+++ b/app/srv/ws/sync/editor/load-page.ts
@@ -76,7 +76,15 @@ export const serverWalkLoad = async (
 type ArgParentMComp = EdMeta["parent_mcomp"] & {
   id: string;
   parent_ids: string[];
-  jsx_props: Record<string, { id: string; parent_ids: string[] }>;
+  jsx_props: Record<
+    string,
+    {
+      id: string;
+      mitem: MItem;
+      parent_mcomp?: ArgParentMComp;
+      parent_ids: string[];
+    }
+  >;
 };
 export const serverWalkMap = (
   p: {
@@ -88,7 +96,6 @@ export const serverWalkMap = (
     mitem: MItem;
     parent_ids: string[];
     parent_item: EdMeta["parent_item"];
-    is_jsx_prop?: boolean;
     parent_mcomp?: ArgParentMComp;
   }
 ) => {
@@ -189,27 +196,22 @@ export const serverWalkMap = (
             mcomp,
             jsx_props: {},
           };
+
           extractMItemProps({
             item_comp,
             mitem,
             mcomp,
             scope,
             mcontent(mcontent, prop_name) {
-              const parent_ids = [...arg.parent_ids, item.id];
               const id = mcontent.get("id");
               if (id) {
                 parent_mcomp.jsx_props[prop_name] = {
                   id,
-                  parent_ids,
+                  mitem: mcontent,
+                  parent_mcomp: arg.parent_mcomp,
+                  parent_ids: [...arg.parent_ids, item.id],
                 };
               }
-              serverWalkMap(p, {
-                parent_ids,
-                mitem: mcontent,
-                parent_item: { id: item.id, mitem: mitem as MItem },
-                is_jsx_prop: true,
-                parent_mcomp,
-              });
             },
           });
 
@@ -227,12 +229,11 @@ export const serverWalkMap = (
 
           if (scope) pcomp.scope[item.id].s = scope;
 
-          if (!parent_mcomp) {
+          if (!arg.parent_mcomp) {
             p.scope[item.id] = {
               p: arg.parent_ids,
               n: item.name,
               s: null,
-              c: item.component?.id,
             };
             if (scope) p.scope[item.id].s = scope;
           }
@@ -255,16 +256,7 @@ export const serverWalkMap = (
     }
   }
 
-  if (item.name.startsWith("jsx=")) {
-    console.log(
-      item.name,
-      !!arg.parent_mcomp,
-      !arg.is_jsx_prop,
-      arg.parent_item.mitem?.get("name")
-    );
-  }
-
-  if (arg.parent_mcomp && !arg.is_jsx_prop) {
+  if (arg.parent_mcomp) {
     let id = item.originalId || item.id;
     const pcomp = p.scope_comps[arg.parent_mcomp.id];
 
@@ -279,6 +271,24 @@ export const serverWalkMap = (
       const scope = parseJs(js);
       if (scope) pcomp.scope[id].s = scope;
     }
+
+    if (item.name.startsWith("jsx=")) {
+      const name = item.name.substring(4).trim();
+      if (arg.parent_mcomp.jsx_props[name]) {
+        const jsx = arg.parent_mcomp.jsx_props[name];
+        serverWalkMap(p, {
+          mitem: jsx.mitem,
+          parent_item: { id: item.id, mitem: mitem as MItem },
+          parent_mcomp: jsx.parent_mcomp
+            ? {
+                ...jsx.parent_mcomp,
+                parent_ids: [...(arg.parent_ids || []), mitem.get("id") || ""],
+              }
+            : undefined,
+          parent_ids: [...arg.parent_ids, mitem.get("id") || ""],
+        });
+      }
+    }
   } else {
     if (!(item_comp && item_comp.id)) {
       p.scope[item.id] = { p: arg.parent_ids, n: item.name, s: null };
@@ -294,7 +304,6 @@ export const serverWalkMap = (
   for (const e of childs) {
     serverWalkMap(p, {
       mitem: e,
-      is_jsx_prop: arg.is_jsx_prop,
       parent_item: { id: item.id, mitem: mitem as MItem },
       parent_mcomp: !!arg.parent_mcomp
         ? {
diff --git a/app/srv/ws/sync/editor/parser/parse-js.ts b/app/srv/ws/sync/editor/parser/parse-js.ts
index fdc974b7..b3ba8bf0 100644
--- a/app/srv/ws/sync/editor/parser/parse-js.ts
+++ b/app/srv/ws/sync/editor/parser/parse-js.ts
@@ -48,17 +48,17 @@ export const parseJs = (code: string) => {
                 attr.type === "JSXAttribute" &&
                 attr.name.type === "JSXIdentifier"
               ) {
-                if (
-                  attr.name.name === "value" &&
-                  attr.value &&
-                  attr.value.type === "JSXExpressionContainer" &&
-                  attr.value.expression.loc
-                ) {
-                  const loc = attr.value.expression.loc as any;
-                  passprop[attr.name.name] = {
-                    value: code.substring(loc.start.index, loc.end.index),
-                    index: loc.start.index,
-                  };
+                if (attr.value) {
+                  if (
+                    attr.value.type === "JSXExpressionContainer" &&
+                    attr.value.expression.loc
+                  ) {
+                    const loc = attr.value.expression.loc as any;
+                    passprop[attr.name.name] = {
+                      value: code.substring(loc.start.index, loc.end.index),
+                      index: loc.start.index,
+                    };
+                  } 
                 }
               }
             }
@@ -83,4 +83,3 @@ export const parseJs = (code: string) => {
   }
   return result;
 };
- 
\ No newline at end of file
diff --git a/app/web/src/nova/ed/logic/ed-global.ts b/app/web/src/nova/ed/logic/ed-global.ts
index ba759363..96621d19 100644
--- a/app/web/src/nova/ed/logic/ed-global.ts
+++ b/app/web/src/nova/ed/logic/ed-global.ts
@@ -27,7 +27,6 @@ export type ISingleScope = {
   p: string[];
   n: string;
   s: null | Exclude<ReturnType<typeof parseJs>, undefined>;
-  c?: string;
 };
 export type IScope = Record<string, ISingleScope>;
 
@@ -116,7 +115,6 @@ export type EdMeta = {
     id: string;
     mitem?: MItem;
   };
-  parent_comp?: { id: string; comp_id: string };
   parent_mcomp?: {
     mitem: MItem;
     mcomp: MItem;
@@ -126,7 +124,7 @@ export type EdMeta = {
   is_jsx_prop?: boolean;
   /** script related meta **/
   propval?: Record<string, any>;
-  idexed_scope: Record<string, any>;
+  indexed_scope: Record<string, any>;
   memoize?: Record<
     string,
     {
diff --git a/app/web/src/nova/ed/logic/tree/load-walk.tsx b/app/web/src/nova/ed/logic/tree/load-walk.tsx
index c199f86a..c124e106 100644
--- a/app/web/src/nova/ed/logic/tree/load-walk.tsx
+++ b/app/web/src/nova/ed/logic/tree/load-walk.tsx
@@ -1,189 +1,189 @@
-import { createId } from "@paralleldrive/cuid2";
-import { deepClone } from "web-utils";
-import { IContent } from "../../../../utils/types/general";
-import { IItem } from "../../../../utils/types/item";
-import { FNComponent } from "../../../../utils/types/meta-fn";
-import { EdMeta, PG } from "../ed-global";
+// import { createId } from "@paralleldrive/cuid2";
+// import { deepClone } from "web-utils";
+// import { IContent } from "../../../../utils/types/general";
+// import { IItem } from "../../../../utils/types/item";
+// import { FNComponent } from "../../../../utils/types/meta-fn";
+// import { EdMeta, PG } from "../ed-global";
 
-export const walkLoad = async (
-  p: { map: PG["comp"]["map"] },
-  item: IContent,
-  loaded: Set<string>,
-  loadComponent: (id: string) => Promise<boolean>
-) => {
-  if (item.type === "item" && item.component?.id) {
-    const id = item.component?.id;
-    const comp = item.component as FNComponent;
+// export const walkLoad = async (
+//   p: { map: PG["comp"]["map"] },
+//   item: IContent,
+//   loaded: Set<string>,
+//   loadComponent: (id: string) => Promise<boolean>
+// ) => {
+//   if (item.type === "item" && item.component?.id) {
+//     const id = item.component?.id;
+//     const comp = item.component as FNComponent;
 
-    if (id && comp) {
-      const isFirstLoaded = !loaded.has(id);
-      loaded.add(id);
-      if (!p.map[id]) {
-        await loadComponent(comp.id);
-      }
-      if (p.map[id] && isFirstLoaded) {
-        await walkLoad(p, p.map[id].item, loaded, loadComponent);
-      }
-    }
+//     if (id && comp) {
+//       const isFirstLoaded = !loaded.has(id);
+//       loaded.add(id);
+//       if (!p.map[id]) {
+//         await loadComponent(comp.id);
+//       }
+//       if (p.map[id] && isFirstLoaded) {
+//         await walkLoad(p, p.map[id].item, loaded, loadComponent);
+//       }
+//     }
 
-    for (const [propName, prop] of Object.entries(comp.props || {})) {
-      if (prop.meta?.type === "content-element") {
-        const mprop = comp.props[propName];
-        if (mprop) {
-          const mcontent = mprop.content;
-          if (mcontent) {
-            await walkLoad(p, mcontent, loaded, loadComponent);
-          }
-        }
-      }
-    }
-  }
+//     for (const [propName, prop] of Object.entries(comp.props || {})) {
+//       if (prop.meta?.type === "content-element") {
+//         const mprop = comp.props[propName];
+//         if (mprop) {
+//           const mcontent = mprop.content;
+//           if (mcontent) {
+//             await walkLoad(p, mcontent, loaded, loadComponent);
+//           }
+//         }
+//       }
+//     }
+//   }
 
-  if (item.type !== "text") {
-    await Promise.all(
-      item.childs.map((e) => walkLoad(p, e, loaded, loadComponent))
-    );
-  }
-};
+//   if (item.type !== "text") {
+//     await Promise.all(
+//       item.childs.map((e) => walkLoad(p, e, loaded, loadComponent))
+//     );
+//   }
+// };
 
-export const walkMap = (
-  p: {
-    meta: Record<string, EdMeta>;
-    comps: Record<string, { id: string; item: IItem }>;
-  },
-  arg: {
-    isLayout: boolean;
-    item: IContent;
-    parent_item: { id: string };
-    portal: {
-      in: Record<string, EdMeta>;
-      out: Record<string, EdMeta>;
-    };
-    each?: (meta: EdMeta) => void;
-    parent_comp?: { id: string; comp_id: string };
-  }
-) => {
-  const { parent_item, parent_comp } = arg;
+// export const walkMap = (
+//   p: {
+//     meta: Record<string, EdMeta>;
+//     comps: Record<string, { id: string; item: IItem }>;
+//   },
+//   arg: {
+//     isLayout: boolean;
+//     item: IContent;
+//     parent_item: { id: string };
+//     portal: {
+//       in: Record<string, EdMeta>;
+//       out: Record<string, EdMeta>;
+//     };
+//     each?: (meta: EdMeta) => void;
+//     parent_comp?: { id: string; comp_id: string };
+//   }
+// ) => {
+//   const { parent_item, parent_comp } = arg;
 
-  let override_id = "";
-  const id = arg.item.id;
+//   let override_id = "";
+//   const id = arg.item.id;
 
-  if (parent_comp && id) {
-    const cmeta = p.meta[parent_comp.id];
-    if (cmeta && cmeta.item.type === "item") {
-      const comp = cmeta.item.component;
-      if (comp) {
-        const ref_ids = comp.ref_ids;
-        if (ref_ids) {
-          let ref_id = ref_ids[id];
-          if (!ref_id) {
-            ref_id = createId();
-            ref_ids[id] = ref_id;
-          }
-          override_id = ref_id;
-        }
-      }
-    }
-  }
+//   if (parent_comp && id) {
+//     const cmeta = p.meta[parent_comp.id];
+//     if (cmeta && cmeta.item.type === "item") {
+//       const comp = cmeta.item.component;
+//       if (comp) {
+//         const ref_ids = comp.ref_ids;
+//         if (ref_ids) {
+//           let ref_id = ref_ids[id];
+//           if (!ref_id) {
+//             ref_id = createId();
+//             ref_ids[id] = ref_id;
+//           }
+//           override_id = ref_id;
+//         }
+//       }
+//     }
+//   }
 
-  let item = arg.item;
-  if (override_id) {
-    item.id = override_id;
-  }
+//   let item = arg.item;
+//   if (override_id) {
+//     item.id = override_id;
+//   }
 
-  const item_comp = item.type === "item" ? item.component : null;
+//   const item_comp = item.type === "item" ? item.component : null;
 
-  if (item_comp && item_comp.id && parent_item.id !== "root") {
-    const comp_ref = p.comps[item_comp.id];
+//   if (item_comp && item_comp.id && parent_item.id !== "root") {
+//     const comp_ref = p.comps[item_comp.id];
 
-    if (!comp_ref) {
-      console.error("Component failed to load: ", item_comp.id);
-      return;
-    }
-    const mcomp = comp_ref.item;
+//     if (!comp_ref) {
+//       console.error("Component failed to load: ", item_comp.id);
+//       return;
+//     }
+//     const mcomp = comp_ref.item;
 
-    if (mcomp) {
-      let ref_ids: Record<string, string> = item_comp.ref_ids;
-      if (!ref_ids) {
-        ref_ids = {};
-        item_comp.ref_ids = ref_ids;
-      }
-      const original_id = item.id;
-      item = deepClone(mcomp);
-      item.id = original_id;
+//     if (mcomp) {
+//       let ref_ids: Record<string, string> = item_comp.ref_ids;
+//       if (!ref_ids) {
+//         ref_ids = {};
+//         item_comp.ref_ids = ref_ids;
+//       }
+//       const original_id = item.id;
+//       item = deepClone(mcomp);
+//       item.id = original_id;
 
-      const meta: EdMeta = {
-        item,
-        parent_item,
-        idexed_scope: {},
-        is_layout: arg.isLayout,
-      };
-      if (item.name.startsWith("⬅")) {
-        arg.portal.in[item.name] = meta;
-      }
-      if (item.name.startsWith("⮕")) {
-        arg.portal.out[item.name] = meta;
-      }
-      if (arg.each) arg.each(meta);
-      p.meta[item.id] = meta;
+//       const meta: EdMeta = {
+//         item,
+//         parent_item,
+//         idexed_scope: {},
+//         is_layout: arg.isLayout,
+//       };
+//       if (item.name.startsWith("⬅")) {
+//         arg.portal.in[item.name] = meta;
+//       }
+//       if (item.name.startsWith("⮕")) {
+//         arg.portal.out[item.name] = meta;
+//       }
+//       if (arg.each) arg.each(meta);
+//       p.meta[item.id] = meta;
 
-      if (item_comp.props) {
-        for (const [k, mprop] of Object.entries(item_comp.props)) {
-          if (mprop.meta?.type === "content-element" && mprop.content) {
-            walkMap(p, {
-              isLayout: arg.isLayout,
-              item: mprop.content,
-              parent_item: { id: item.id },
-              portal: arg.portal,
-              parent_comp: { id: item.id, comp_id: item_comp.id },
-              each: arg.each,
-            });
-          }
-        }
-      }
+//       if (item_comp.props) {
+//         for (const [k, mprop] of Object.entries(item_comp.props)) {
+//           if (mprop.meta?.type === "content-element" && mprop.content) {
+//             walkMap(p, {
+//               isLayout: arg.isLayout,
+//               item: mprop.content,
+//               parent_item: { id: item.id },
+//               portal: arg.portal,
+//               parent_comp: { id: item.id, comp_id: item_comp.id },
+//               each: arg.each,
+//             });
+//           }
+//         }
+//       }
 
-      for (const c of mcomp.childs) {
-        walkMap(p, {
-          isLayout: arg.isLayout,
-          item: c,
-          parent_item: { id: item.id },
-          portal: arg.portal,
-          parent_comp: { id: item.id, comp_id: item_comp.id },
-          each: arg.each,
-        });
-      }
-    }
-    return;
-  }
+//       for (const c of mcomp.childs) {
+//         walkMap(p, {
+//           isLayout: arg.isLayout,
+//           item: c,
+//           parent_item: { id: item.id },
+//           portal: arg.portal,
+//           parent_comp: { id: item.id, comp_id: item_comp.id },
+//           each: arg.each,
+//         });
+//       }
+//     }
+//     return;
+//   }
 
-  const meta: EdMeta = {
-    item,
-    parent_item,
-    idexed_scope: {},
-    parent_comp,
-    is_layout: arg.isLayout,
-  };
-  if (item.name.startsWith("⬅")) {
-    arg.portal.in[item.name] = meta;
-  }
-  if (item.name.startsWith("⮕")) {
-    arg.portal.out[item.name] = meta;
-  }
-  if (arg.each) arg.each(meta);
-  p.meta[item.id] = meta;
+//   const meta: EdMeta = {
+//     item,
+//     parent_item,
+//     idexed_scope: {},
+//     parent_comp,
+//     is_layout: arg.isLayout,
+//   };
+//   if (item.name.startsWith("⬅")) {
+//     arg.portal.in[item.name] = meta;
+//   }
+//   if (item.name.startsWith("⮕")) {
+//     arg.portal.out[item.name] = meta;
+//   }
+//   if (arg.each) arg.each(meta);
+//   p.meta[item.id] = meta;
 
-  if (item.type !== "text") {
-    for (const c of item.childs) {
-      if (c) {
-        walkMap(p, {
-          isLayout: arg.isLayout,
-          item: c,
-          parent_item: { id: item.id },
-          portal: arg.portal,
-          parent_comp,
-          each: arg.each,
-        });
-      }
-    }
-  }
-};
+//   if (item.type !== "text") {
+//     for (const c of item.childs) {
+//       if (c) {
+//         walkMap(p, {
+//           isLayout: arg.isLayout,
+//           item: c,
+//           parent_item: { id: item.id },
+//           portal: arg.portal,
+//           parent_comp,
+//           each: arg.each,
+//         });
+//       }
+//     }
+//   }
+// };
diff --git a/app/web/src/nova/ed/logic/tree/sync-walk.tsx b/app/web/src/nova/ed/logic/tree/sync-walk.tsx
index 7ec9217d..ec8d4abe 100644
--- a/app/web/src/nova/ed/logic/tree/sync-walk.tsx
+++ b/app/web/src/nova/ed/logic/tree/sync-walk.tsx
@@ -1,20 +1,17 @@
 import { NodeModel } from "@minoru/react-dnd-treeview";
 import { createId } from "@paralleldrive/cuid2";
-import { compress, decompress } from "wasm-gzip";
 import { TypedArray } from "yjs-types";
 import { MContent } from "../../../../utils/types/general";
 import { IItem, MItem } from "../../../../utils/types/item";
 import { FNCompDef, FNComponent } from "../../../../utils/types/meta-fn";
-import { DComp } from "../../../../utils/types/root";
 import { MSection } from "../../../../utils/types/section";
-import { EdMeta, IScope, PG, active } from "../ed-global";
+import { EdMeta, PG } from "../ed-global";
+import { loadCompSnapshot } from "./sync-walk-comp";
 import {
   ensureMItemProps,
   ensureMProp,
   ensurePropContent,
 } from "./sync-walk-utils";
-import { treeRebuild } from "./build";
-import { loadCompSnapshot } from "./sync-walk-comp";
 
 export const syncWalkLoad = async (
   p: PG,
@@ -115,6 +112,7 @@ export const syncWalkMap = (
   mapItem(mitem, item);
 
   if (override_id) {
+    if (!item.originalId) item.originalId = item.id;
     item.id = override_id;
   }
 
@@ -157,7 +155,7 @@ export const syncWalkMap = (
           mitem: mitem as MItem,
           parent_item,
           parent_mcomp: parent_mcomp,
-          idexed_scope: {},
+          indexed_scope: {},
           is_layout: arg.is_layout,
         };
         if (item.name.startsWith("⬅")) {
@@ -201,7 +199,6 @@ export const syncWalkMap = (
                       mitem: mcontent,
                       is_jsx_prop: true,
                       parent_item: { id: item.id, mitem: mitem as MItem },
-                      parent_mcomp: { mitem: mitem as MItem, mcomp },
                       portal: arg.portal,
                       skip_add_tree: skip_tree_child,
                       each: arg.each,
@@ -241,7 +238,7 @@ export const syncWalkMap = (
     parent_item,
     is_jsx_prop: arg.is_jsx_prop,
     parent_mcomp: parent_mcomp,
-    idexed_scope: {},
+    indexed_scope: {},
   };
 
   if (item.name.startsWith("⬅")) {
@@ -269,6 +266,7 @@ export const syncWalkMap = (
       is_layout: arg.is_layout,
       tree_root_id: arg.tree_root_id,
       mitem: e,
+      is_jsx_prop: arg.is_jsx_prop,
       parent_item: { id: item.id, mitem: mitem as MItem },
       parent_mcomp: arg.parent_mcomp,
       portal: arg.portal,
@@ -299,7 +297,6 @@ export const loadComponent = async (
       resolve(true);
       return;
     }
-    console.log("loading", id_comp);
     loadcomp.pending.add(id_comp);
     clearTimeout(loadcomp.timeout);
     loadcomp.timeout = setTimeout(async () => {
diff --git a/app/web/src/nova/ed/panel/popup/script/scope.tsx b/app/web/src/nova/ed/panel/popup/script/scope.tsx
index c04e0d0c..c4daced4 100644
--- a/app/web/src/nova/ed/panel/popup/script/scope.tsx
+++ b/app/web/src/nova/ed/panel/popup/script/scope.tsx
@@ -45,6 +45,22 @@ export const declareScope = async (
     existing[name] = arg;
   });
 
+  // for (const id of s.p) {
+  //   const meta = p.page.meta[id];
+  //   const ss = p.page.scope[id];
+  //   if (meta) {
+  //     let sc = null as any;
+  //     if (meta.parent_mcomp) {
+  //       const comp_id = meta.parent_mcomp.mitem.get('component')?.get('id');
+  //       if (comp_id && p.comp.list[comp_id]) {
+  //         sc = p.comp.list[comp_id].scope
+  //       }
+  //     }
+
+  //     console.log(meta.item.name, meta.item.originalId, ss, sc);
+  //   }
+  // }
+
   spreadScope(p, s, (arg) => {
     let { prev } = arg;
     if (arg.type !== "local") {
@@ -122,37 +138,39 @@ const spreadScope = (
   const mergeScopes = (
     parents: string[],
     each: (arg: IEachArgScope) => void,
-    arg: { comp_id?: string; prev?: { comp_id: string; item_id: string } }
+    arg: { prev?: { comp_id: string; item_id: string } }
   ) => {
-    let { comp_id, prev } = arg;
+    let { prev } = arg;
     for (const parent_id of parents) {
+      if (parent_id === "root") continue;
       let item = null as null | ISingleScope;
+      const meta = p.page.meta[parent_id];
+
       if (layout && layout_scope[layout_id]) {
         const scope = layout_scope[layout_id];
-        if (scope.p.includes(parent_id) || comp_id) {
+        if (scope.p.includes(parent_id)) {
           item = layout.scope[parent_id];
         }
       }
 
-      if (!item) { 
-        if (comp_id) {
-          item = p.comp.list[comp_id].scope[parent_id];
-        } else if (active.comp_id && p.comp.list[active.comp_id]) {
-          item = p.comp.list[active.comp_id].scope[parent_id];
-        } else {
-          item = p.page.scope[parent_id];
+      let comp_id = "";
+      if (!item) {
+        if (meta) {
+          if (meta.parent_mcomp) {
+            comp_id = meta.parent_mcomp.mitem.get("component")?.get("id") || "";
+            if (comp_id) {
+              const scope = p.comp.list[comp_id].scope;
+              item = scope[meta.item.originalId || meta.item.id];
+            }
+          }
+
+          if (!item) {
+            item = p.page.scope[parent_id];
+          }
         }
       }
 
       if (item) {
-        if (item.c) {
-          comp_id = item.c;
-          mergeScopes(item.p, each, {
-            comp_id: item.c,
-            prev: { item_id: parent_id, comp_id: arg.comp_id || "" },
-          });
-        }
-
         const scope = item.s;
         if (scope) {
           if (scope.local)
@@ -201,6 +219,7 @@ const spreadScope = (
     }
   };
 
+  console.clear();
   mergeScopes(parents, each, {});
 };
 
diff --git a/app/web/src/nova/ed/panel/tree/body.tsx b/app/web/src/nova/ed/panel/tree/body.tsx
index 432590ce..a4f7cc4d 100644
--- a/app/web/src/nova/ed/panel/tree/body.tsx
+++ b/app/web/src/nova/ed/panel/tree/body.tsx
@@ -43,8 +43,17 @@ export const EdTreeBody = () => {
   useEffect(() => {
     if (local.tree) {
       let parents: string[] = [];
-      if (active.comp_id && p.comp.list[local.comp_id].scope[active.item_id]) {
-        parents = p.comp.list[local.comp_id].scope[active.item_id].p;
+      if (active.comp_id && p.comp.list[active.comp_id].scope[active.item_id]) {
+        parents = p.comp.list[active.comp_id].scope[active.item_id].p.map(
+          (e) => {
+            if (e === "root") return "root";
+            const meta = p.page.meta[e];
+            if (meta && meta.item.originalId) {
+              return meta.item.originalId;
+            }
+            return e;
+          }
+        );
       } else if (p.page.scope[active.item_id]) {
         parents = p.page.scope[active.item_id].p;
       }
diff --git a/app/web/src/nova/ed/panel/tree/node/item/name.tsx b/app/web/src/nova/ed/panel/tree/node/item/name.tsx
index ec5a79a9..7b3c0a4b 100644
--- a/app/web/src/nova/ed/panel/tree/node/item/name.tsx
+++ b/app/web/src/nova/ed/panel/tree/node/item/name.tsx
@@ -74,7 +74,7 @@ export const EdTreeName = ({
       ) : (
         <div className="flex flex-col">
           <Name name={node.text} is_jsx_prop={is_jsx_prop} />
-          {/* <div className={"text-[11px] text-gray-500 -mt-1"}>{item.id}</div> */}
+          <div className={"text-[11px] text-gray-500 -mt-1"}>{item.id}</div>
         </div>
       )}
     </div>
diff --git a/app/web/src/nova/view/render/meta/script/create-local.tsx b/app/web/src/nova/view/render/meta/script/create-local.tsx
index addd8035..660a2ac9 100644
--- a/app/web/src/nova/view/render/meta/script/create-local.tsx
+++ b/app/web/src/nova/view/render/meta/script/create-local.tsx
@@ -41,11 +41,11 @@ export const createLocal = (
       }
       scope = meta.scope;
     } else {
-      if (!meta.idexed_scope) {
-        meta.idexed_scope = {};
+      if (!meta.indexed_scope) {
+        meta.indexed_scope = {};
       }
-      if (!meta.idexed_scope[local_id]) meta.idexed_scope[local_id] = {};
-      scope = meta.idexed_scope[local_id];
+      if (!meta.indexed_scope[local_id]) meta.indexed_scope[local_id] = {};
+      scope = meta.indexed_scope[local_id];
     }
 
     const render = () => {
diff --git a/app/web/src/nova/view/render/meta/script/create-pass-prop.tsx b/app/web/src/nova/view/render/meta/script/create-pass-prop.tsx
index 97ab2528..ec2d38ec 100644
--- a/app/web/src/nova/view/render/meta/script/create-pass-prop.tsx
+++ b/app/web/src/nova/view/render/meta/script/create-pass-prop.tsx
@@ -11,11 +11,11 @@ export const createPassProp = (
     const meta = v.meta[id];
 
     if (typeof arg.idx !== "undefined" && meta && meta.item && meta.item.id) {
-      meta.idexed_scope[arg.idx] = {};
+      meta.indexed_scope[arg.idx] = {};
 
       for (const [k, v] of Object.entries(arg)) {
         if (k === "children") continue;
-        meta.idexed_scope[arg.idx][k] = v;
+        meta.indexed_scope[arg.idx][k] = v;
       }
 
       const scopeIndex = { ...existingScopeIndex, [meta.item.id]: arg.idx };
diff --git a/app/web/src/nova/view/render/meta/script/merge-upward.tsx b/app/web/src/nova/view/render/meta/script/merge-upward.tsx
index e4d3a4be..190ee3ff 100644
--- a/app/web/src/nova/view/render/meta/script/merge-upward.tsx
+++ b/app/web/src/nova/view/render/meta/script/merge-upward.tsx
@@ -21,11 +21,11 @@ export const mergeScopeUpwards = (
 
     let indexedScope = null;
 
-    if (cur.idexed_scope && scopeIndex) {
+    if (cur.indexed_scope && scopeIndex) {
       const idx = scopeIndex[cur.item.id];
 
-      if (typeof idx !== "undefined" && cur.idexed_scope[idx]) {
-        indexedScope = cur.idexed_scope[idx];
+      if (typeof idx !== "undefined" && cur.indexed_scope[idx]) {
+        indexedScope = cur.indexed_scope[idx];
       }
     }
 
diff --git a/app/web/src/utils/script/mount.tsx b/app/web/src/utils/script/mount.tsx
index 4c2f33b8..611fea2a 100644
--- a/app/web/src/utils/script/mount.tsx
+++ b/app/web/src/utils/script/mount.tsx
@@ -68,11 +68,13 @@ export const jsMount = async (editor: MonacoEditor, monaco: Monaco, p: PG) => {
             meta = p.comp.list[active.comp_id].meta[id];
           }
 
-          active.instance.comp_id = prev_comp_id;
-          active.instance.item_id = prev_item_id;
+          active.instance.comp_id = active.comp_id;
+          active.instance.item_id = active.item_id;
 
           if (meta && meta.item.originalId) {
             active.item_id = meta.item.originalId;
+          } else {
+            active.item_id = id;
           }
           active.comp_id = comp_id;
         } else {