Merged PR 162: Implement symbols and other stuff (see desc)

Implement symbols
- Add, Remove, Select Container
- Form
- Link with container
- Symbol behavior application to container (move to x with xpositionreference)

Important changes
- Remove SelectedContainer from HistoryState, meaning that it will be slower for each load but will be faster for each operations* (SetHistory, SelectContainer, DeleteContainer, SymbolOperations)
- ElementsSidebar now opens with isSidebarOpen meaning that both sidebar will open on toggle
- Moved camelize, transformX, restoreX to different modules (stringtools.ts, svg.ts)

src/Components/SVG/SVG.tsx

@@ -4,15 +4,17 @@ import { Container } from './Elements/Container';
 import { ContainerModel } from '../../Interfaces/IContainerModel';
 import { Selector } from './Elements/Selector';
 import { BAR_WIDTH } from '../Bar/Bar';
-import { DimensionLayer } from './Elements/DimensionLayer';
 import { DepthDimensionLayer } from './Elements/DepthDimensionLayer';
 import { SHOW_DIMENSIONS_PER_DEPTH } from '../../utils/default';
+import { SymbolLayer } from './Elements/SymbolLayer';
+import { ISymbolModel } from '../../Interfaces/ISymbolModel';
 
 interface ISVGProps {
   width: number
   height: number
   children: ContainerModel | ContainerModel[] | null
-  selected: ContainerModel | null
+  selected?: ContainerModel
+  symbols: Map<string, ISymbolModel>
 }
 
 interface Viewer {
@@ -81,6 +83,7 @@ export const SVG: React.FC<ISVGProps> = (props: ISVGProps) => {
               ? <DepthDimensionLayer roots={props.children}/>
               : null
           }
+          <SymbolLayer symbols={props.symbols} />
           <Selector selected={props.selected} /> {/* leave this at the end so it can be removed during the svg export */}
         </svg>
       </UncontrolledReactSVGPanZoom>