diff --git a/package-lock.json b/package-lock.json
index 6fffded..3751774 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -3991,9 +3991,9 @@
       }
     },
     "packages/config/node_modules/@mcflyjs/core": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/@mcflyjs/core/-/core-0.3.0.tgz",
-      "integrity": "sha512-tcOySS8avvY728XCX7tKrIdYaKOE4TwtUy/BMXS/kcaZaMpl4jQ93T+YKUSEOb2Rdm+lSLwJ12aCIQJRDl2Okg==",
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/@mcflyjs/core/-/core-0.3.1.tgz",
+      "integrity": "sha512-16yqHjbp+Ms9tvwm1JIUDlH64oEuCe/zT/sJa8kxoMjRNbH2pX3zW0NmjfMT/tIPJiP821/CFyqvFz/MKmDwlg==",
       "dependencies": {
         "esprima": "^4.0.1",
         "h3": "^1.8.2",
@@ -4002,7 +4002,7 @@
     },
     "packages/core": {
       "name": "@mcflyjs/core",
-      "version": "0.3.1",
+      "version": "0.3.2",
       "license": "MIT",
       "dependencies": {
         "esprima": "^4.0.1",
@@ -4066,9 +4066,9 @@
       }
     },
     "templates/basic/node_modules/@mcflyjs/core": {
-      "version": "0.3.0",
-      "resolved": "https://registry.npmjs.org/@mcflyjs/core/-/core-0.3.0.tgz",
-      "integrity": "sha512-tcOySS8avvY728XCX7tKrIdYaKOE4TwtUy/BMXS/kcaZaMpl4jQ93T+YKUSEOb2Rdm+lSLwJ12aCIQJRDl2Okg==",
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/@mcflyjs/core/-/core-0.3.1.tgz",
+      "integrity": "sha512-16yqHjbp+Ms9tvwm1JIUDlH64oEuCe/zT/sJa8kxoMjRNbH2pX3zW0NmjfMT/tIPJiP821/CFyqvFz/MKmDwlg==",
       "dependencies": {
         "esprima": "^4.0.1",
         "h3": "^1.8.2",
diff --git a/packages/core/event-handler.js b/packages/core/event-handler.js
index 61d6517..931c512 100644
--- a/packages/core/event-handler.js
+++ b/packages/core/event-handler.js
@@ -202,7 +202,17 @@ function doSetUp(html) {
   while ((match = regex.exec(html))) {
     let [key, value] = match;
     value = value.replace(/\s/g, "");
-    html = html.replace(key, setupMap[value]);
+    // nested objects
+    const keys = value.split('.');
+    let finalValue = '';
+    let setupCopy = setupMap;
+
+    keys.forEach(i => {
+      finalValue = setupCopy[i]
+      setupCopy = finalValue;
+    })
+
+    html = html.replace(key, finalValue);
   }
 
   return html;
diff --git a/packages/core/package.json b/packages/core/package.json
index 8189a1a..4678425 100644
--- a/packages/core/package.json
+++ b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@mcflyjs/core",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "description": "McFly core package",
   "type": "module",
   "main": "index.js",
diff --git a/site/src/pages/demo.html b/site/src/pages/demo.html
index d6ea9e9..788886f 100644
--- a/site/src/pages/demo.html
+++ b/site/src/pages/demo.html
@@ -5,10 +5,12 @@
     <script src="/prism.js"></script>
     <script server:setup>
       const name = "Nitro";
-      let greeting = "hello";
-      var count = sum(1, 247);
+      let greeting = {
+        url: 'https://www.google.com',
+        message: "hello"
+      };
 
-      greeting = "nope";
+      var count = sum(1, 247);
 
       function sum(x, y) {
         return x + y;
@@ -56,8 +58,7 @@
           />
         </div>
         <code-block language="js">const name = "Nitro"</code-block>
-        <p>some text: {{greeting}}</p>
-        {{greeting}} hey<br />
+        <a href="{{greeting.url}}">some text: {{greeting.message}}</a>
         <clickable-text></clickable-text>
       </section>
       <section id="breakdown">