diff --git a/ESPD/examples/startComponent.js b/ESPD/examples/startComponent.js
index b5b2dad..8e8ec67 100644
--- a/ESPD/examples/startComponent.js
+++ b/ESPD/examples/startComponent.js
@@ -3,9 +3,11 @@ Vue.component("startComponent", {
         return {
             raw_data: null,
             versions: [{ value: null, text: 'Select an option' }],
-            espd_version: null,
-            role: null,
-            country: null,
+            exp: {
+                espd_version: null,
+                role: null,
+                country: null
+            },
             role_opt: [
                 { value: 'ca', text: 'Contracting authority - ESPD Request' },
                 { value: 'eo', text: 'Economic operator - ESPD Response' }
@@ -17,22 +19,10 @@ Vue.component("startComponent", {
         }
     },
 
-    watch: {
-        espd_version: function (oldV, newV) {
-            window.espd_doc.espd_version = oldV
-        },
-        country: function (oldV, newV) {
-            window.espd_doc.country = oldV
-        },
-        role: function (oldV, newV) {
-            window.espd_doc.role = oldV
-        }
-    },
-
     methods: {
         selectVersion(event){
-            this.espd_version = event
-            window.espd_doc.espd_version = this.espd_version
+            this.exp.espd_version = event
+            window.espd_doc.espd_version = this.exp.espd_version
 
             const getData = async () => {
                 try {
@@ -51,7 +41,7 @@ Vue.component("startComponent", {
     },
 
     beforeDestroy(){
-        console.log(this.espd_version);
+        console.log(this.exp);
         
     },
 
@@ -68,12 +58,12 @@ Vue.component("startComponent", {
                     for (const key in window.raw_data) {
                         if (Object.hasOwn(window.raw_data, key)) {
                             this.versions.push(key)
-                            this.espd_version = this.versions[0]
-                            window.espd_doc.espd_version = this.espd_version
+                            this.exp.espd_version = this.versions[0]
+                            window.espd_doc.espd_version = this.exp.espd_version
                         }
                     }
-                    this.role = 'ca'
-                    this.country = 'EUR'
+                    this.exp.role = 'ca'
+                    this.exp.country = 'EUR'
 
                     //load the model too
                     thecall = await fetch(`${window.raw_data[window.espd_doc.espd_version].model.source}`)
@@ -111,15 +101,15 @@ Vue.component("startComponent", {
         <b-collapse id="accordion-st1" visible accordion="my-accordion" role="tabpanel">
             <b-card-body>
                 <b-form-group id="fieldset-espd" label-cols-sm="4" label-cols-lg="3" description="Select ESPD version" label="ESPD version" label-for="sel-espd">
-                    <b-form-select id="sel-espd" v-model="espd_version" :options="versions" @change="selectVersion($event)"></b-form-select>
+                    <b-form-select id="sel-espd" v-model="exp.espd_version" :options="versions" @change="selectVersion($event)"></b-form-select>
                 </b-form-group>
                 
                 <b-form-group id="fieldset-role" label-cols-sm="4" label-cols-lg="3" description="Select your role" label="Select your role" label-for="sel-role">
-                    <b-form-select id="sel-role" v-model="role" :options="role_opt"></b-form-select>
+                    <b-form-select id="sel-role" v-model="exp.role" :options="role_opt"></b-form-select>
                 </b-form-group>
 
                 <b-form-group id="fieldset-country" label-cols-sm="4" label-cols-lg="3" description="Select your country" label="Country" label-for="sel-country">
-                <b-form-select id="sel-country" v-model="country" :options="country_list"></b-form-select>
+                <b-form-select id="sel-country" v-model="exp.country" :options="country_list"></b-form-select>
                 </b-form-group>  
             </b-card-body>
         </b-collapse>
diff --git a/index.html b/index.html
index 427a375..0ad8650 100644
--- a/index.html
+++ b/index.html
@@ -48,20 +48,12 @@
     <link rel="stylesheet" href="src/css/footer.css" />
 
     <!-- PDFMake framework -->
-    <!--
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/pdfmake.min.js"
-        integrity="sha512-a9NgEEK7tsCvABL7KqtUTQjl69z7091EVPpw5KxPlZ93T141ffe1woLtbXTX+r2/8TtTvRX/v4zTL2UlMUPgwg=="
-        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.7/vfs_fonts.min.js"
-        integrity="sha512-P0bOMePRS378NwmPDVPU455C/TuxDS+8QwJozdc7PGgN8kLqR4ems0U/3DeJkmiE31749vYWHvBOtR+37qDCZQ=="
-        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
-    -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.12/pdfmake.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.2.12/vfs_fonts.min.js"></script>
+    
     <!-- Handlebars famework -->
-    <!--
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.7/handlebars.min.js"
-        integrity="sha512-RNLkV3d+aLtfcpEyFG8jRbnWHxUqVZozacROI4J2F1sTaDqo1dPQYs01OMi1t1w9Y2FdbSCDSQ2ZVdAC8bzgAg=="
-        crossorigin="anonymous" referrerpolicy="no-referrer"></script>
-    -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.7.8/handlebars.min.js"></script>
+
     <!-- SheetJS framework -->
     <script src="https://cdn.sheetjs.com/xlsx-0.20.3/package/dist/xlsx.full.min.js"></script>
 
diff --git a/src/js/utils.js b/src/js/utils.js
index 840caf8..05d7b5b 100644
--- a/src/js/utils.js
+++ b/src/js/utils.js
@@ -753,3 +753,11 @@ function deleteHTML(part) {
   console.log(part);
   window.app.$children[6].$refs['procedureComponent'].$refs['v4.0.0-C61'][0]._data[`html_${stringToProperty(part)}`]=''
 }
+
+
+/**
+ * Save global state for ESPD Example
+ */
+function saveData(data){
+  
+}
\ No newline at end of file