Add isRoot to getSymbolInfo

src/dom_components/index.ts

@@ -109,6 +109,7 @@ import {
   isSymbolMain,
   isSymbolInstance,
   detachSymbolInstance,
+  isSymbolRoot,
 } from './model/SymbolUtils';
 import { SymbolInfo } from './types';
 import Symbols from './model/Symbols';
@@ -710,6 +711,10 @@ export default class ComponentManager extends ItemManagerModule<DomComponentsCon
    * // cmp.getSymbolInfo(symbol).isSymbol === true;
    */
   addSymbol(component: Component) {
+    if (isSymbol(component) && !isSymbolRoot(component)) {
+      return;
+    }
+
     const symbol = component.clone({ symbol: true });
     isSymbolMain(symbol) && this.symbols.add(symbol);
 
@@ -760,11 +765,14 @@ export default class ComponentManager extends ItemManagerModule<DomComponentsCon
     const instances = (isMain ? getSymbolInstances(component) : getSymbolInstances(mainRef)) || [];
     const main = mainRef || (isMain ? component : undefined);
     const relatives = getSymbolsToUpdate(component, { changed: opts.withChanges });
+    const isSymbol = isMain || isInstance;
+    const isRoot = isSymbol && isSymbolRoot(component);
 
     return {
-      isSymbol: isMain || isInstance,
+      isSymbol,
       isMain,
       isInstance,
+      isRoot,
       main,
       instances: instances,
       relatives: relatives || [],

src/dom_components/model/Component.ts

@@ -46,7 +46,7 @@ import {
   initSymbol,
   isSymbol,
   isSymbolMain,
-  isSymbolTop,
+  isSymbolRoot,
   updateSymbolCls,
   updateSymbolComps,
   updateSymbolProps,
@@ -1247,7 +1247,7 @@ export default class Component extends StyleableModel<ComponentProperties> {
     // @ts-ignore
     attr.traits = [];
 
-    if (isSymbolTop(this)) {
+    if (isSymbolRoot(this)) {
       opt.symbol = true;
     }
 

src/dom_components/model/SymbolUtils.ts

@@ -10,7 +10,7 @@ export const isSymbolInstance = (cmp: Component) => !!cmp.get(keySymbol);
 
 export const isSymbol = (cmp: Component) => !!(isSymbolMain(cmp) || isSymbolInstance(cmp));
 
-export const isSymbolTop = (symbol: Component) => {
+export const isSymbolRoot = (symbol: Component) => {
   const parent = symbol.parent();
   return isSymbol(symbol) && (!parent || !isSymbol(parent));
 };
@@ -236,12 +236,12 @@ export const updateSymbolComps = (symbol: Component, m: Component, c: Components
       );
 
     // Propagate remove only if the component is an inner symbol
-    if (!isSymbolTop(m)) {
+    if (!isSymbolRoot(m)) {
       const changed = 'components:remove';
       const { index } = o;
       const parent = m.parent();
       const opts = { fromInstance: m, ...o };
-      const isSymbNested = isSymbolTop(m);
+      const isSymbNested = isSymbolRoot(m);
       let toUpFn = (symb: Component) => {
         const symbPrnt = symb.parent();
         symbPrnt && !isSymbolOverride(symbPrnt, changed) && symb.remove(opts);

src/dom_components/types.ts

@@ -10,6 +10,7 @@ export interface SymbolInfo {
   isSymbol: boolean;
   isMain: boolean;
   isInstance: boolean;
+  isRoot: boolean;
   main?: Component;
   instances: Component[];
   relatives: Component[];

test/specs/dom_components/model/Symbols.ts

@@ -10,11 +10,16 @@ describe('Symbols', () => {
 
   const getSymbols = () => cmps.getSymbols();
 
-  const createSymbol = (component: Component) => cmps.addSymbol(component);
+  const createSymbol = (component: Component) => cmps.addSymbol(component)!;
 
   const detachSymbol = (component: Component) => cmps.detachSymbol(component);
 
-  const getSymbolInfo = ((comp, opts) => cmps.getSymbolInfo(comp, opts)) as Editor['Components']['getSymbolInfo'];
+  const getSymbolInfo = ((comp, opts) => {
+    const result = cmps.getSymbolInfo(comp, opts);
+    // @ts-ignore skip for now from check
+    delete result.isRoot;
+    return result;
+  }) as Editor['Components']['getSymbolInfo'];
 
   const setSymbolOverride = (comp: Component, value: Parameters<Component['setSymbolOverride']>[0]) => {
     comp.setSymbolOverride(value);