diff --git a/public/smartcomponent/svg-layout-designer.ts b/public/smartcomponent/svg-layout-designer.ts
index 36fb417..f345089 100644
--- a/public/smartcomponent/svg-layout-designer.ts
+++ b/public/smartcomponent/svg-layout-designer.ts
@@ -4,6 +4,7 @@
      */
     type IHistoryState = SVGLD.IHistoryState;
     type IEditorState = SVGLD.IEditorState;
+    type IConfiguration = SVGLD.IConfiguration;
 
     export class SVGLayoutDesigner extends Components.ComponentBase {
 
@@ -178,6 +179,20 @@
             const component = this.GetAppComponent();
             component.dispatchEvent(new CustomEvent(eventType, { detail: history }));
         }
+
+        /**
+         * Construct a default EditorState from a given configuration.
+         * This is the same method used when loading the editor
+         * for the first time after fetch the configuration from the API.
+         * @param configuration History to revive
+         * @param callback Callback with the revived state
+         */
+        public GetDefaultEditorState(configuration: IConfiguration, callback: (state: IEditorState) => void) {
+            const eventType = 'getDefaultEditorState';
+            this.app.AddEventListener(eventType, callback);
+            const component = this.GetAppComponent();
+            component.dispatchEvent(new CustomEvent(eventType, { detail: configuration }));
+        }
     }
 
 
diff --git a/src/Events/AppEvents.ts b/src/Events/AppEvents.ts
index de1e45a..6cb2529 100644
--- a/src/Events/AppEvents.ts
+++ b/src/Events/AppEvents.ts
@@ -1,5 +1,7 @@
+import { IConfiguration } from '../Interfaces/IConfiguration';
 import { IEditorState } from '../Interfaces/IEditorState';
 import { IHistoryState } from '../Interfaces/IHistoryState';
+import { GetDefaultEditorState as GetDefaultEditorStateAction } from '../utils/default';
 import { Revive, ReviveHistory as ReviveHistoryAction } from '../utils/saveload';
 
 export interface IAppEvent {
@@ -16,7 +18,8 @@ export const events: IAppEvent[] = [
   { name: 'setEditor', func: SetEditor },
   { name: 'setLoaded', func: SetLoaded },
   { name: 'reviveEditorState', func: ReviveEditorState },
-  { name: 'reviveHistory', func: ReviveHistory }
+  { name: 'reviveHistory', func: ReviveHistory },
+  { name: 'getDefaultEditorState', func: GetDefaultEditorState }
 ];
 
 function SetEditor(
@@ -62,3 +65,14 @@ function ReviveHistory(
   const customEvent = new CustomEvent<IHistoryState[]>('reviveHistory', { detail: history });
   root.dispatchEvent(customEvent);
 }
+
+function GetDefaultEditorState(
+  root: Element | Document,
+  setEditor: (newState: IEditorState) => void,
+  setLoaded: (loaded: boolean) => void,
+  eventInitDict?: CustomEventInit): void {
+  const configuration: IConfiguration = eventInitDict?.detail;
+  const editorState = GetDefaultEditorStateAction(configuration);
+  const customEvent = new CustomEvent<IEditorState>('reviveHistory', { detail: editorState });
+  root.dispatchEvent(customEvent);
+}