From 655e324c88bff07bb58c8bb295ddf11412602408 Mon Sep 17 00:00:00 2001
From: Michael Mainguy <mike.mainguy@gmail.com>
Date: Thu, 21 Aug 2025 20:43:26 -0500
Subject: [PATCH] Add secure markdown support to slide templates
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Implement safe markdown processing with marked and DOMPurify
- Add markdown-slide layout template with dedicated markdown slots
- Support auto-detection of markdown content in text slots
- Include comprehensive markdown styling (lists, headers, code, quotes, tables)
- Maintain security with HTML sanitization and safe element filtering
- Add markdown documentation to theme creation guidelines

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
---
 package-lock.json                             | 1318 ++++++++++++++++-
 package.json                                  |    4 +
 public/themes-manifest.json                   |    4 +-
 public/themes/CLAUDE.md                       |   69 +
 .../default/layouts/2-content-blocks.html     |    7 +-
 public/themes/default/layouts/code-slide.html |    8 +
 .../themes/default/layouts/content-slide.html |    5 +-
 .../themes/default/layouts/image-slide.html   |    2 +-
 .../default/layouts/markdown-slide.html       |   17 +
 .../themes/default/layouts/title-slide.html   |    5 +-
 public/themes/default/master-slide.html       |    2 +-
 public/themes/default/style.css               |  437 ++++--
 .../presentations/PresentationMode.tsx        |  164 +-
 .../hooks/useKeyboardNavigation.ts            |   71 +
 .../hooks/usePresentationLoader.ts            |   75 +
 src/components/slide-editor/ContentEditor.tsx |   10 +-
 src/components/slide-editor/utils.ts          |   12 +-
 src/utils/markdownProcessor.ts                |  194 +++
 src/utils/templateRenderer.ts                 |   24 +-
 19 files changed, 2124 insertions(+), 304 deletions(-)
 create mode 100644 public/themes/default/layouts/code-slide.html
 create mode 100644 public/themes/default/layouts/markdown-slide.html
 create mode 100644 src/components/presentations/hooks/useKeyboardNavigation.ts
 create mode 100644 src/components/presentations/hooks/usePresentationLoader.ts
 create mode 100644 src/utils/markdownProcessor.ts

diff --git a/package-lock.json b/package-lock.json
index 1859a62..2a2a194 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,9 +8,13 @@
       "name": "slideshare",
       "version": "0.0.0",
       "dependencies": {
+        "@types/prismjs": "^1.26.5",
         "dompurify": "^3.2.6",
         "loglevel": "^1.9.2",
+        "marked": "^16.2.0",
+        "mermaid": "^11.10.0",
         "postcss": "^8.5.6",
+        "prismjs": "^1.30.0",
         "react": "^19.1.1",
         "react-dom": "^19.1.1",
         "react-router-dom": "^7.8.1"
@@ -45,6 +49,28 @@
         "node": ">=6.0.0"
       }
     },
+    "node_modules/@antfu/install-pkg": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@antfu/install-pkg/-/install-pkg-1.1.0.tgz",
+      "integrity": "sha512-MGQsmw10ZyI+EJo45CdSER4zEb+p31LpDAFp2Z3gkSd1yqVZGi0Ebx++YTEMonJy4oChEMLsxZ64j8FH6sSqtQ==",
+      "license": "MIT",
+      "dependencies": {
+        "package-manager-detector": "^1.3.0",
+        "tinyexec": "^1.0.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
+    "node_modules/@antfu/utils": {
+      "version": "8.1.1",
+      "resolved": "https://registry.npmjs.org/@antfu/utils/-/utils-8.1.1.tgz",
+      "integrity": "sha512-Mex9nXf9vR6AhcXmMrlz/HVgYYZpVGJ6YlPgwl7UnaFpnshXs6EK/oa5Gpf3CzENMjkvEx2tQtntGnb7UtSTOQ==",
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
     "node_modules/@babel/code-frame": {
       "version": "7.27.1",
       "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.27.1.tgz",
@@ -327,6 +353,51 @@
         "node": ">=6.9.0"
       }
     },
+    "node_modules/@braintree/sanitize-url": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/@braintree/sanitize-url/-/sanitize-url-7.1.1.tgz",
+      "integrity": "sha512-i1L7noDNxtFyL5DmZafWy1wRVhGehQmzZaz1HiN5e7iylJMSZR7ekOV7NsIqa5qBldlLrsKv4HbgFUVlQrz8Mw==",
+      "license": "MIT"
+    },
+    "node_modules/@chevrotain/cst-dts-gen": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/cst-dts-gen/-/cst-dts-gen-11.0.3.tgz",
+      "integrity": "sha512-BvIKpRLeS/8UbfxXxgC33xOumsacaeCKAjAeLyOn7Pcp95HiRbrpl14S+9vaZLolnbssPIUuiUd8IvgkRyt6NQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/gast": "11.0.3",
+        "@chevrotain/types": "11.0.3",
+        "lodash-es": "4.17.21"
+      }
+    },
+    "node_modules/@chevrotain/gast": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/gast/-/gast-11.0.3.tgz",
+      "integrity": "sha512-+qNfcoNk70PyS/uxmj3li5NiECO+2YKZZQMbmjTqRI3Qchu8Hig/Q9vgkHpI3alNjr7M+a2St5pw5w5F6NL5/Q==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/types": "11.0.3",
+        "lodash-es": "4.17.21"
+      }
+    },
+    "node_modules/@chevrotain/regexp-to-ast": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/regexp-to-ast/-/regexp-to-ast-11.0.3.tgz",
+      "integrity": "sha512-1fMHaBZxLFvWI067AVbGJav1eRY7N8DDvYCTwGBiE/ytKBgP8azTdgyrKyWZ9Mfh09eHWb5PgTSO8wi7U824RA==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@chevrotain/types": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/types/-/types-11.0.3.tgz",
+      "integrity": "sha512-gsiM3G8b58kZC2HaWR50gu6Y1440cHiJ+i3JUvcp/35JchYejb2+5MVeJK0iKThYpAa/P2PYFV4hoi44HD+aHQ==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@chevrotain/utils": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/@chevrotain/utils/-/utils-11.0.3.tgz",
+      "integrity": "sha512-YslZMgtJUyuMbZ+aKvfF3x1f5liK4mWNxghFRv7jqRR9C3R3fAOGTTKvxXDa2Y1s9zSbcpuO0cAxDYsc9SrXoQ==",
+      "license": "Apache-2.0"
+    },
     "node_modules/@esbuild/aix-ppc64": {
       "version": "0.25.9",
       "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.25.9.tgz",
@@ -989,6 +1060,40 @@
         "url": "https://github.com/sponsors/nzakas"
       }
     },
+    "node_modules/@iconify/types": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+      "integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==",
+      "license": "MIT"
+    },
+    "node_modules/@iconify/utils": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@iconify/utils/-/utils-2.3.0.tgz",
+      "integrity": "sha512-GmQ78prtwYW6EtzXRU1rY+KwOKfz32PD7iJh6Iyqw68GiKuoZ2A6pRtzWONz5VQJbp50mEjXh/7NkumtrAgRKA==",
+      "license": "MIT",
+      "dependencies": {
+        "@antfu/install-pkg": "^1.0.0",
+        "@antfu/utils": "^8.1.0",
+        "@iconify/types": "^2.0.0",
+        "debug": "^4.4.0",
+        "globals": "^15.14.0",
+        "kolorist": "^1.8.0",
+        "local-pkg": "^1.0.0",
+        "mlly": "^1.7.4"
+      }
+    },
+    "node_modules/@iconify/utils/node_modules/globals": {
+      "version": "15.15.0",
+      "resolved": "https://registry.npmjs.org/globals/-/globals-15.15.0.tgz",
+      "integrity": "sha512-7ACyT3wmyp3I61S4fG682L0VA2RGD9otkqGJIwNUMF1SWUombIIk+af1unuDYgMm082aHYwD+mzJvv9Iu8dsgg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
     "node_modules/@jridgewell/gen-mapping": {
       "version": "0.3.13",
       "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
@@ -1028,6 +1133,15 @@
         "@jridgewell/sourcemap-codec": "^1.4.14"
       }
     },
+    "node_modules/@mermaid-js/parser": {
+      "version": "0.6.2",
+      "resolved": "https://registry.npmjs.org/@mermaid-js/parser/-/parser-0.6.2.tgz",
+      "integrity": "sha512-+PO02uGF6L6Cs0Bw8RpGhikVvMWEysfAyl27qTlroUB8jSWr1lL0Sf6zi78ZxlSnmgSY2AMMKVgghnN9jTtwkQ==",
+      "license": "MIT",
+      "dependencies": {
+        "langium": "3.3.1"
+      }
+    },
     "node_modules/@nodelib/fs.scandir": {
       "version": "2.1.5",
       "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz",
@@ -1398,6 +1512,259 @@
         "@babel/types": "^7.28.2"
       }
     },
+    "node_modules/@types/d3": {
+      "version": "7.4.3",
+      "resolved": "https://registry.npmjs.org/@types/d3/-/d3-7.4.3.tgz",
+      "integrity": "sha512-lZXZ9ckh5R8uiFVt8ogUNf+pIrK4EsWrx2Np75WvF/eTpJ0FMHNhjXk8CKEx/+gpHbNQyJWehbFaTvqmHWB3ww==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-array": "*",
+        "@types/d3-axis": "*",
+        "@types/d3-brush": "*",
+        "@types/d3-chord": "*",
+        "@types/d3-color": "*",
+        "@types/d3-contour": "*",
+        "@types/d3-delaunay": "*",
+        "@types/d3-dispatch": "*",
+        "@types/d3-drag": "*",
+        "@types/d3-dsv": "*",
+        "@types/d3-ease": "*",
+        "@types/d3-fetch": "*",
+        "@types/d3-force": "*",
+        "@types/d3-format": "*",
+        "@types/d3-geo": "*",
+        "@types/d3-hierarchy": "*",
+        "@types/d3-interpolate": "*",
+        "@types/d3-path": "*",
+        "@types/d3-polygon": "*",
+        "@types/d3-quadtree": "*",
+        "@types/d3-random": "*",
+        "@types/d3-scale": "*",
+        "@types/d3-scale-chromatic": "*",
+        "@types/d3-selection": "*",
+        "@types/d3-shape": "*",
+        "@types/d3-time": "*",
+        "@types/d3-time-format": "*",
+        "@types/d3-timer": "*",
+        "@types/d3-transition": "*",
+        "@types/d3-zoom": "*"
+      }
+    },
+    "node_modules/@types/d3-array": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/@types/d3-array/-/d3-array-3.2.1.tgz",
+      "integrity": "sha512-Y2Jn2idRrLzUfAKV2LyRImR+y4oa2AntrgID95SHJxuMUrkNXmanDSed71sRNZysveJVt1hLLemQZIady0FpEg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-axis": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-axis/-/d3-axis-3.0.6.tgz",
+      "integrity": "sha512-pYeijfZuBd87T0hGn0FO1vQ/cgLk6E1ALJjfkC0oJ8cbwkZl3TpgS8bVBLZN+2jjGgg38epgxb2zmoGtSfvgMw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-brush": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-brush/-/d3-brush-3.0.6.tgz",
+      "integrity": "sha512-nH60IZNNxEcrh6L1ZSMNA28rj27ut/2ZmI3r96Zd+1jrZD++zD3LsMIjWlvg4AYrHn/Pqz4CF3veCxGjtbqt7A==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-chord": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-chord/-/d3-chord-3.0.6.tgz",
+      "integrity": "sha512-LFYWWd8nwfwEmTZG9PfQxd17HbNPksHBiJHaKuY1XeqscXacsS2tyoo6OdRsjf+NQYeB6XrNL3a25E3gH69lcg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-color": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-color/-/d3-color-3.1.3.tgz",
+      "integrity": "sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-contour": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-contour/-/d3-contour-3.0.6.tgz",
+      "integrity": "sha512-BjzLgXGnCWjUSYGfH1cpdo41/hgdWETu4YxpezoztawmqsvCeep+8QGfiY6YbDvfgHz/DkjeIkkZVJavB4a3rg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-array": "*",
+        "@types/geojson": "*"
+      }
+    },
+    "node_modules/@types/d3-delaunay": {
+      "version": "6.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-delaunay/-/d3-delaunay-6.0.4.tgz",
+      "integrity": "sha512-ZMaSKu4THYCU6sV64Lhg6qjf1orxBthaC161plr5KuPHo3CNm8DTHiLw/5Eq2b6TsNP0W0iJrUOFscY6Q450Hw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-dispatch": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-dispatch/-/d3-dispatch-3.0.7.tgz",
+      "integrity": "sha512-5o9OIAdKkhN1QItV2oqaE5KMIiXAvDWBDPrD85e58Qlz1c1kI/J0NcqbEG88CoTwJrYe7ntUCVfeUl2UJKbWgA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-drag": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-drag/-/d3-drag-3.0.7.tgz",
+      "integrity": "sha512-HE3jVKlzU9AaMazNufooRJ5ZpWmLIoc90A37WU2JMmeq28w1FQqCZswHZ3xR+SuxYftzHq6WU6KJHvqxKzTxxQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-dsv": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-dsv/-/d3-dsv-3.0.7.tgz",
+      "integrity": "sha512-n6QBF9/+XASqcKK6waudgL0pf/S5XHPPI8APyMLLUHd8NqouBGLsU8MgtO7NINGtPBtk9Kko/W4ea0oAspwh9g==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-ease": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-ease/-/d3-ease-3.0.2.tgz",
+      "integrity": "sha512-NcV1JjO5oDzoK26oMzbILE6HW7uVXOHLQvHshBUW4UMdZGfiY6v5BeQwh9a9tCzv+CeefZQHJt5SRgK154RtiA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-fetch": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-fetch/-/d3-fetch-3.0.7.tgz",
+      "integrity": "sha512-fTAfNmxSb9SOWNB9IoG5c8Hg6R+AzUHDRlsXsDZsNp6sxAEOP0tkP3gKkNSO/qmHPoBFTxNrjDprVHDQDvo5aA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-dsv": "*"
+      }
+    },
+    "node_modules/@types/d3-force": {
+      "version": "3.0.10",
+      "resolved": "https://registry.npmjs.org/@types/d3-force/-/d3-force-3.0.10.tgz",
+      "integrity": "sha512-ZYeSaCF3p73RdOKcjj+swRlZfnYpK1EbaDiYICEEp5Q6sUiqFaFQ9qgoshp5CzIyyb/yD09kD9o2zEltCexlgw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-format": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-format/-/d3-format-3.0.4.tgz",
+      "integrity": "sha512-fALi2aI6shfg7vM5KiR1wNJnZ7r6UuggVqtDA+xiEdPZQwy/trcQaHnwShLuLdta2rTymCNpxYTiMZX/e09F4g==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-geo": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@types/d3-geo/-/d3-geo-3.1.0.tgz",
+      "integrity": "sha512-856sckF0oP/diXtS4jNsiQw/UuK5fQG8l/a9VVLeSouf1/PPbBE1i1W852zVwKwYCBkFJJB7nCFTbk6UMEXBOQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/geojson": "*"
+      }
+    },
+    "node_modules/@types/d3-hierarchy": {
+      "version": "3.1.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-hierarchy/-/d3-hierarchy-3.1.7.tgz",
+      "integrity": "sha512-tJFtNoYBtRtkNysX1Xq4sxtjK8YgoWUNpIiUee0/jHGRwqvzYxkq0hGVbbOGSz+JgFxxRu4K8nb3YpG3CMARtg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-interpolate": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-interpolate/-/d3-interpolate-3.0.4.tgz",
+      "integrity": "sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-color": "*"
+      }
+    },
+    "node_modules/@types/d3-path": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@types/d3-path/-/d3-path-3.1.1.tgz",
+      "integrity": "sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-polygon": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-polygon/-/d3-polygon-3.0.2.tgz",
+      "integrity": "sha512-ZuWOtMaHCkN9xoeEMr1ubW2nGWsp4nIql+OPQRstu4ypeZ+zk3YKqQT0CXVe/PYqrKpZAi+J9mTs05TKwjXSRA==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-quadtree": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@types/d3-quadtree/-/d3-quadtree-3.0.6.tgz",
+      "integrity": "sha512-oUzyO1/Zm6rsxKRHA1vH0NEDG58HrT5icx/azi9MF1TWdtttWl0UIUsjEQBBh+SIkrpd21ZjEv7ptxWys1ncsg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-random": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-random/-/d3-random-3.0.3.tgz",
+      "integrity": "sha512-Imagg1vJ3y76Y2ea0871wpabqp613+8/r0mCLEBfdtqC7xMSfj9idOnmBYyMoULfHePJyxMAw3nWhJxzc+LFwQ==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-scale": {
+      "version": "4.0.9",
+      "resolved": "https://registry.npmjs.org/@types/d3-scale/-/d3-scale-4.0.9.tgz",
+      "integrity": "sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-time": "*"
+      }
+    },
+    "node_modules/@types/d3-scale-chromatic": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/@types/d3-scale-chromatic/-/d3-scale-chromatic-3.1.0.tgz",
+      "integrity": "sha512-iWMJgwkK7yTRmWqRB5plb1kadXyQ5Sj8V/zYlFGMUBbIPKQScw+Dku9cAAMgJG+z5GYDoMjWGLVOvjghDEFnKQ==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-selection": {
+      "version": "3.0.11",
+      "resolved": "https://registry.npmjs.org/@types/d3-selection/-/d3-selection-3.0.11.tgz",
+      "integrity": "sha512-bhAXu23DJWsrI45xafYpkQ4NtcKMwWnAC/vKrd2l+nxMFuvOT3XMYTIj2opv8vq8AO5Yh7Qac/nSeP/3zjTK0w==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-shape": {
+      "version": "3.1.7",
+      "resolved": "https://registry.npmjs.org/@types/d3-shape/-/d3-shape-3.1.7.tgz",
+      "integrity": "sha512-VLvUQ33C+3J+8p+Daf+nYSOsjB4GXp19/S/aGo60m9h1v6XaxjiT82lKVWJCfzhtuZ3yD7i/TPeC/fuKLLOSmg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-path": "*"
+      }
+    },
+    "node_modules/@types/d3-time": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@types/d3-time/-/d3-time-3.0.4.tgz",
+      "integrity": "sha512-yuzZug1nkAAaBlBBikKZTgzCeA+k1uy4ZFwWANOfKw5z5LRhV0gNA7gNkKm7HoK+HRN0wX3EkxGk0fpbWhmB7g==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-time-format": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/@types/d3-time-format/-/d3-time-format-4.0.3.tgz",
+      "integrity": "sha512-5xg9rC+wWL8kdDj153qZcsJ0FWiFt0J5RB6LYUNZjwSnesfblqrI/bJ1wBdJ8OQfncgbJG5+2F+qfqnqyzYxyg==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-timer": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/@types/d3-timer/-/d3-timer-3.0.2.tgz",
+      "integrity": "sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/d3-transition": {
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/@types/d3-transition/-/d3-transition-3.0.9.tgz",
+      "integrity": "sha512-uZS5shfxzO3rGlu0cC3bjmMFKsXv+SmZZcgp0KD22ts4uGXp5EVYGzu/0YdwZeKmddhcAccYtREJKkPfXkZuCg==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-selection": "*"
+      }
+    },
+    "node_modules/@types/d3-zoom": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/@types/d3-zoom/-/d3-zoom-3.0.8.tgz",
+      "integrity": "sha512-iqMC4/YlFCSlO8+2Ii1GGGliCAY4XdeG748w5vQUbevlbDu0zSjH/+jojorQVBK/se0j6DUFNPBGSqD3YWYnDw==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/d3-interpolate": "*",
+        "@types/d3-selection": "*"
+      }
+    },
     "node_modules/@types/dompurify": {
       "version": "3.0.5",
       "resolved": "https://registry.npmjs.org/@types/dompurify/-/dompurify-3.0.5.tgz",
@@ -1415,6 +1782,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/@types/geojson": {
+      "version": "7946.0.16",
+      "resolved": "https://registry.npmjs.org/@types/geojson/-/geojson-7946.0.16.tgz",
+      "integrity": "sha512-6C8nqWur3j98U6+lXDfTUWIfgvZU+EumvpHKcYjujKH7woYyLj2sUmff0tRhrqM7BohUw7Pz3ZB1jj2gW9Fvmg==",
+      "license": "MIT"
+    },
     "node_modules/@types/json-schema": {
       "version": "7.0.15",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
@@ -1432,6 +1805,12 @@
         "undici-types": "~7.10.0"
       }
     },
+    "node_modules/@types/prismjs": {
+      "version": "1.26.5",
+      "resolved": "https://registry.npmjs.org/@types/prismjs/-/prismjs-1.26.5.tgz",
+      "integrity": "sha512-AUZTa7hQ2KY5L7AmtSiqxlhWxb4ina0yd8hNbl4TWuqnv/pFP0nDMb3YrfSBf4hJVGLh2YEIBfKaBW/9UEl6IQ==",
+      "license": "MIT"
+    },
     "node_modules/@types/react": {
       "version": "19.1.10",
       "resolved": "https://registry.npmjs.org/@types/react/-/react-19.1.10.tgz",
@@ -1755,7 +2134,6 @@
       "version": "8.15.0",
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
-      "dev": true,
       "license": "MIT",
       "bin": {
         "acorn": "bin/acorn"
@@ -1926,6 +2304,32 @@
         "url": "https://github.com/chalk/chalk?sponsor=1"
       }
     },
+    "node_modules/chevrotain": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/chevrotain/-/chevrotain-11.0.3.tgz",
+      "integrity": "sha512-ci2iJH6LeIkvP9eJW6gpueU8cnZhv85ELY8w8WiFtNjMHA5ad6pQLaJo9mEly/9qUyCpvqX8/POVUTf18/HFdw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@chevrotain/cst-dts-gen": "11.0.3",
+        "@chevrotain/gast": "11.0.3",
+        "@chevrotain/regexp-to-ast": "11.0.3",
+        "@chevrotain/types": "11.0.3",
+        "@chevrotain/utils": "11.0.3",
+        "lodash-es": "4.17.21"
+      }
+    },
+    "node_modules/chevrotain-allstar": {
+      "version": "0.3.1",
+      "resolved": "https://registry.npmjs.org/chevrotain-allstar/-/chevrotain-allstar-0.3.1.tgz",
+      "integrity": "sha512-b7g+y9A0v4mxCW1qUhf3BSVPg+/NvGErk/dOkrDaHA0nQIQGAtrOjlX//9OQtRlSCy+x9rfB5N8yC71lH1nvMw==",
+      "license": "MIT",
+      "dependencies": {
+        "lodash-es": "^4.17.21"
+      },
+      "peerDependencies": {
+        "chevrotain": "^11.0.0"
+      }
+    },
     "node_modules/color-convert": {
       "version": "2.0.1",
       "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -1946,6 +2350,15 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/commander": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
+      "integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10"
+      }
+    },
     "node_modules/concat-map": {
       "version": "0.0.1",
       "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
@@ -1953,6 +2366,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/confbox": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.2.2.tgz",
+      "integrity": "sha512-1NB+BKqhtNipMsov4xI/NnhCKp9XG9NamYp5PVm9klAT0fsrNPjaFICsCFhNhwZJKNh7zB/3q8qXz0E9oaMNtQ==",
+      "license": "MIT"
+    },
     "node_modules/convert-source-map": {
       "version": "2.0.0",
       "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
@@ -1969,6 +2388,15 @@
         "node": ">=18"
       }
     },
+    "node_modules/cose-base": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/cose-base/-/cose-base-1.0.3.tgz",
+      "integrity": "sha512-s9whTXInMSgAp/NVXVNuVxVKzGH2qck3aQlVHxDCdAEPgtMKwc4Wq6/QKhgdEdgbLSi9rBTAcPoRa6JpiG4ksg==",
+      "license": "MIT",
+      "dependencies": {
+        "layout-base": "^1.0.0"
+      }
+    },
     "node_modules/cross-spawn": {
       "version": "7.0.6",
       "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
@@ -1991,11 +2419,515 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/cytoscape": {
+      "version": "3.33.1",
+      "resolved": "https://registry.npmjs.org/cytoscape/-/cytoscape-3.33.1.tgz",
+      "integrity": "sha512-iJc4TwyANnOGR1OmWhsS9ayRS3s+XQ185FmuHObThD+5AeJCakAAbWv8KimMTt08xCCLNgneQwFp+JRJOr9qGQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
+    "node_modules/cytoscape-cose-bilkent": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/cytoscape-cose-bilkent/-/cytoscape-cose-bilkent-4.1.0.tgz",
+      "integrity": "sha512-wgQlVIUJF13Quxiv5e1gstZ08rnZj2XaLHGoFMYXz7SkNfCDOOteKBE6SYRfA9WxxI/iBc3ajfDoc6hb/MRAHQ==",
+      "license": "MIT",
+      "dependencies": {
+        "cose-base": "^1.0.0"
+      },
+      "peerDependencies": {
+        "cytoscape": "^3.2.0"
+      }
+    },
+    "node_modules/cytoscape-fcose": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/cytoscape-fcose/-/cytoscape-fcose-2.2.0.tgz",
+      "integrity": "sha512-ki1/VuRIHFCzxWNrsshHYPs6L7TvLu3DL+TyIGEsRcvVERmxokbf5Gdk7mFxZnTdiGtnA4cfSmjZJMviqSuZrQ==",
+      "license": "MIT",
+      "dependencies": {
+        "cose-base": "^2.2.0"
+      },
+      "peerDependencies": {
+        "cytoscape": "^3.2.0"
+      }
+    },
+    "node_modules/cytoscape-fcose/node_modules/cose-base": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/cose-base/-/cose-base-2.2.0.tgz",
+      "integrity": "sha512-AzlgcsCbUMymkADOJtQm3wO9S3ltPfYOFD5033keQn9NJzIbtnZj+UdBJe7DYml/8TdbtHJW3j58SOnKhWY/5g==",
+      "license": "MIT",
+      "dependencies": {
+        "layout-base": "^2.0.0"
+      }
+    },
+    "node_modules/cytoscape-fcose/node_modules/layout-base": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/layout-base/-/layout-base-2.0.1.tgz",
+      "integrity": "sha512-dp3s92+uNI1hWIpPGH3jK2kxE2lMjdXdr+DH8ynZHpd6PUlH6x6cbuXnoMmiNumznqaNO31xu9e79F0uuZ0JFg==",
+      "license": "MIT"
+    },
+    "node_modules/d3": {
+      "version": "7.9.0",
+      "resolved": "https://registry.npmjs.org/d3/-/d3-7.9.0.tgz",
+      "integrity": "sha512-e1U46jVP+w7Iut8Jt8ri1YsPOvFpg46k+K8TpCb0P+zjCkjkPnV7WzfDJzMHy1LnA+wj5pLT1wjO901gLXeEhA==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "3",
+        "d3-axis": "3",
+        "d3-brush": "3",
+        "d3-chord": "3",
+        "d3-color": "3",
+        "d3-contour": "4",
+        "d3-delaunay": "6",
+        "d3-dispatch": "3",
+        "d3-drag": "3",
+        "d3-dsv": "3",
+        "d3-ease": "3",
+        "d3-fetch": "3",
+        "d3-force": "3",
+        "d3-format": "3",
+        "d3-geo": "3",
+        "d3-hierarchy": "3",
+        "d3-interpolate": "3",
+        "d3-path": "3",
+        "d3-polygon": "3",
+        "d3-quadtree": "3",
+        "d3-random": "3",
+        "d3-scale": "4",
+        "d3-scale-chromatic": "3",
+        "d3-selection": "3",
+        "d3-shape": "3",
+        "d3-time": "3",
+        "d3-time-format": "4",
+        "d3-timer": "3",
+        "d3-transition": "3",
+        "d3-zoom": "3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-array": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-3.2.4.tgz",
+      "integrity": "sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==",
+      "license": "ISC",
+      "dependencies": {
+        "internmap": "1 - 2"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-axis": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-axis/-/d3-axis-3.0.0.tgz",
+      "integrity": "sha512-IH5tgjV4jE/GhHkRV0HiVYPDtvfjHQlQfJHs0usq7M30XcSBvOotpmH1IgkcXsO/5gEQZD43B//fc7SRT5S+xw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-brush": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-brush/-/d3-brush-3.0.0.tgz",
+      "integrity": "sha512-ALnjWlVYkXsVIGlOsuWH1+3udkYFI48Ljihfnh8FZPF2QS9o+PzGLBslO0PjzVoHLZ2KCVgAM8NVkXPJB2aNnQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-drag": "2 - 3",
+        "d3-interpolate": "1 - 3",
+        "d3-selection": "3",
+        "d3-transition": "3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-chord": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-chord/-/d3-chord-3.0.1.tgz",
+      "integrity": "sha512-VE5S6TNa+j8msksl7HwjxMHDM2yNK3XCkusIlpX5kwauBfXuyLAtNg9jCp/iHH61tgI4sb6R/EIMWCqEIdjT/g==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-path": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-color": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-color/-/d3-color-3.1.0.tgz",
+      "integrity": "sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-contour": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/d3-contour/-/d3-contour-4.0.2.tgz",
+      "integrity": "sha512-4EzFTRIikzs47RGmdxbeUvLWtGedDUNkTcmzoeyg4sP/dvCexO47AaQL7VKy/gul85TOxw+IBgA8US2xwbToNA==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "^3.2.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-delaunay": {
+      "version": "6.0.4",
+      "resolved": "https://registry.npmjs.org/d3-delaunay/-/d3-delaunay-6.0.4.tgz",
+      "integrity": "sha512-mdjtIZ1XLAM8bm/hx3WwjfHt6Sggek7qH043O8KEjDXN40xi3vx/6pYSVTwLjEgiXQTbvaouWKynLBiUZ6SK6A==",
+      "license": "ISC",
+      "dependencies": {
+        "delaunator": "5"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-dispatch": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-dispatch/-/d3-dispatch-3.0.1.tgz",
+      "integrity": "sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-drag": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-drag/-/d3-drag-3.0.0.tgz",
+      "integrity": "sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-selection": "3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-dsv": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-dsv/-/d3-dsv-3.0.1.tgz",
+      "integrity": "sha512-UG6OvdI5afDIFP9w4G0mNq50dSOsXHJaRE8arAS5o9ApWnIElp8GZw1Dun8vP8OyHOZ/QJUKUJwxiiCCnUwm+Q==",
+      "license": "ISC",
+      "dependencies": {
+        "commander": "7",
+        "iconv-lite": "0.6",
+        "rw": "1"
+      },
+      "bin": {
+        "csv2json": "bin/dsv2json.js",
+        "csv2tsv": "bin/dsv2dsv.js",
+        "dsv2dsv": "bin/dsv2dsv.js",
+        "dsv2json": "bin/dsv2json.js",
+        "json2csv": "bin/json2dsv.js",
+        "json2dsv": "bin/json2dsv.js",
+        "json2tsv": "bin/json2dsv.js",
+        "tsv2csv": "bin/dsv2dsv.js",
+        "tsv2json": "bin/dsv2json.js"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-ease": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-ease/-/d3-ease-3.0.1.tgz",
+      "integrity": "sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-fetch": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-fetch/-/d3-fetch-3.0.1.tgz",
+      "integrity": "sha512-kpkQIM20n3oLVBKGg6oHrUchHM3xODkTzjMoj7aWQFq5QEM+R6E4WkzT5+tojDY7yjez8KgCBRoj4aEr99Fdqw==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dsv": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-force": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-force/-/d3-force-3.0.0.tgz",
+      "integrity": "sha512-zxV/SsA+U4yte8051P4ECydjD/S+qeYtnaIyAs9tgHCqfguma/aAQDjo85A9Z6EKhBirHRJHXIgJUlffT4wdLg==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-quadtree": "1 - 3",
+        "d3-timer": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-format": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-format/-/d3-format-3.1.0.tgz",
+      "integrity": "sha512-YyUI6AEuY/Wpt8KWLgZHsIU86atmikuoOmCfommt0LYHiQSPjvX2AcFc38PX0CBpr2RCyZhjex+NS/LPOv6YqA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-geo": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/d3-geo/-/d3-geo-3.1.1.tgz",
+      "integrity": "sha512-637ln3gXKXOwhalDzinUgY83KzNWZRKbYubaG+fGVuc/dxO64RRljtCTnf5ecMyE1RIdtqpkVcq0IbtU2S8j2Q==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2.5.0 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-hierarchy": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/d3-hierarchy/-/d3-hierarchy-3.1.2.tgz",
+      "integrity": "sha512-FX/9frcub54beBdugHjDCdikxThEqjnR93Qt7PvQTOHxyiNCAlvMrHhclk3cD5VeAaq9fxmfRp+CnWw9rEMBuA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-interpolate": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-interpolate/-/d3-interpolate-3.0.1.tgz",
+      "integrity": "sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-path": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-3.1.0.tgz",
+      "integrity": "sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-polygon": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-polygon/-/d3-polygon-3.0.1.tgz",
+      "integrity": "sha512-3vbA7vXYwfe1SYhED++fPUQlWSYTTGmFmQiany/gdbiWgU/iEyQzyymwL9SkJjFFuCS4902BSzewVGsHHmHtXg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-quadtree": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-quadtree/-/d3-quadtree-3.0.1.tgz",
+      "integrity": "sha512-04xDrxQTDTCFwP5H6hRhsRcb9xxv2RzkcsygFzmkSIOJy3PeRJP7sNk3VRIbKXcog561P9oU0/rVH6vDROAgUw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-random": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-random/-/d3-random-3.0.1.tgz",
+      "integrity": "sha512-FXMe9GfxTxqd5D6jFsQ+DJ8BJS4E/fT5mqqdjovykEB2oFbTMDVdg1MGFxfQW+FBOGoB++k8swBrgwSHT1cUXQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-sankey": {
+      "version": "0.12.3",
+      "resolved": "https://registry.npmjs.org/d3-sankey/-/d3-sankey-0.12.3.tgz",
+      "integrity": "sha512-nQhsBRmM19Ax5xEIPLMY9ZmJ/cDvd1BG3UVvt5h3WRxKg5zGRbvnteTyWAbzeSvlh3tW7ZEmq4VwR5mB3tutmQ==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "d3-array": "1 - 2",
+        "d3-shape": "^1.2.0"
+      }
+    },
+    "node_modules/d3-sankey/node_modules/d3-array": {
+      "version": "2.12.1",
+      "resolved": "https://registry.npmjs.org/d3-array/-/d3-array-2.12.1.tgz",
+      "integrity": "sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "internmap": "^1.0.0"
+      }
+    },
+    "node_modules/d3-sankey/node_modules/d3-path": {
+      "version": "1.0.9",
+      "resolved": "https://registry.npmjs.org/d3-path/-/d3-path-1.0.9.tgz",
+      "integrity": "sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/d3-sankey/node_modules/d3-shape": {
+      "version": "1.3.7",
+      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-1.3.7.tgz",
+      "integrity": "sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "d3-path": "1"
+      }
+    },
+    "node_modules/d3-sankey/node_modules/internmap": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/internmap/-/internmap-1.0.1.tgz",
+      "integrity": "sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw==",
+      "license": "ISC"
+    },
+    "node_modules/d3-scale": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/d3-scale/-/d3-scale-4.0.2.tgz",
+      "integrity": "sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2.10.0 - 3",
+        "d3-format": "1 - 3",
+        "d3-interpolate": "1.2.0 - 3",
+        "d3-time": "2.1.1 - 3",
+        "d3-time-format": "2 - 4"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-scale-chromatic": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-scale-chromatic/-/d3-scale-chromatic-3.1.0.tgz",
+      "integrity": "sha512-A3s5PWiZ9YCXFye1o246KoscMWqf8BsD9eRiJ3He7C9OBaxKhAd5TFCdEx/7VbKtxxTsu//1mMJFrEt572cEyQ==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3",
+        "d3-interpolate": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-selection": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-selection/-/d3-selection-3.0.0.tgz",
+      "integrity": "sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-shape": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/d3-shape/-/d3-shape-3.2.0.tgz",
+      "integrity": "sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-path": "^3.1.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-time": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/d3-time/-/d3-time-3.1.0.tgz",
+      "integrity": "sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-array": "2 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-time-format": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/d3-time-format/-/d3-time-format-4.1.0.tgz",
+      "integrity": "sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-time": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-timer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-timer/-/d3-timer-3.0.1.tgz",
+      "integrity": "sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/d3-transition": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/d3-transition/-/d3-transition-3.0.1.tgz",
+      "integrity": "sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-color": "1 - 3",
+        "d3-dispatch": "1 - 3",
+        "d3-ease": "1 - 3",
+        "d3-interpolate": "1 - 3",
+        "d3-timer": "1 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "peerDependencies": {
+        "d3-selection": "2 - 3"
+      }
+    },
+    "node_modules/d3-zoom": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/d3-zoom/-/d3-zoom-3.0.0.tgz",
+      "integrity": "sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw==",
+      "license": "ISC",
+      "dependencies": {
+        "d3-dispatch": "1 - 3",
+        "d3-drag": "2 - 3",
+        "d3-interpolate": "1 - 3",
+        "d3-selection": "2 - 3",
+        "d3-transition": "2 - 3"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/dagre-d3-es": {
+      "version": "7.0.11",
+      "resolved": "https://registry.npmjs.org/dagre-d3-es/-/dagre-d3-es-7.0.11.tgz",
+      "integrity": "sha512-tvlJLyQf834SylNKax8Wkzco/1ias1OPw8DcUMDE7oUIoSEW25riQVuiu/0OWEFqT0cxHT3Pa9/D82Jr47IONw==",
+      "license": "MIT",
+      "dependencies": {
+        "d3": "^7.9.0",
+        "lodash-es": "^4.17.21"
+      }
+    },
+    "node_modules/dayjs": {
+      "version": "1.11.13",
+      "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.13.tgz",
+      "integrity": "sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==",
+      "license": "MIT"
+    },
     "node_modules/debug": {
       "version": "4.4.1",
       "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.1.tgz",
       "integrity": "sha512-KcKCqiftBJcZr++7ykoDIEwSa3XWowTfNPo92BYxjXiyYEVrUQh2aLyhxBCwww+heortUFxEJYcRzosstTEBYQ==",
-      "dev": true,
       "license": "MIT",
       "dependencies": {
         "ms": "^2.1.3"
@@ -2016,6 +2948,15 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/delaunator": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/delaunator/-/delaunator-5.0.1.tgz",
+      "integrity": "sha512-8nvh+XBe96aCESrGOqMp/84b13H9cdKbG5P2ejQCh4d4sK9RL4371qou9drQjMhvnPmhWl5hnmqbEE0fXr9Xnw==",
+      "license": "ISC",
+      "dependencies": {
+        "robust-predicates": "^3.0.2"
+      }
+    },
     "node_modules/dompurify": {
       "version": "3.2.6",
       "resolved": "https://registry.npmjs.org/dompurify/-/dompurify-3.2.6.tgz",
@@ -2275,6 +3216,12 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/exsolve": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/exsolve/-/exsolve-1.0.7.tgz",
+      "integrity": "sha512-VO5fQUzZtI6C+vx4w/4BWJpg3s/5l+6pRQEHzFRM8WFi4XffSP1Z+4qi7GbjWbvRQEbdIco5mIMq+zX4rPuLrw==",
+      "license": "MIT"
+    },
     "node_modules/fast-deep-equal": {
       "version": "3.1.3",
       "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
@@ -2458,6 +3405,12 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/hachure-fill": {
+      "version": "0.5.2",
+      "resolved": "https://registry.npmjs.org/hachure-fill/-/hachure-fill-0.5.2.tgz",
+      "integrity": "sha512-3GKBOn+m2LX9iq+JC1064cSFprJY4jL1jCXTcpnfER5HYE2l/4EfWSGzkPa/ZDBmYI0ZOEj5VHV/eKnPGkHuOg==",
+      "license": "MIT"
+    },
     "node_modules/has-flag": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
@@ -2468,6 +3421,18 @@
         "node": ">=8"
       }
     },
+    "node_modules/iconv-lite": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz",
+      "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==",
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
     "node_modules/ignore": {
       "version": "5.3.2",
       "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
@@ -2505,6 +3470,15 @@
         "node": ">=0.8.19"
       }
     },
+    "node_modules/internmap": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/internmap/-/internmap-2.0.3.tgz",
+      "integrity": "sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
     "node_modules/is-extglob": {
       "version": "2.1.1",
       "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
@@ -2612,6 +3586,31 @@
         "node": ">=6"
       }
     },
+    "node_modules/katex": {
+      "version": "0.16.22",
+      "resolved": "https://registry.npmjs.org/katex/-/katex-0.16.22.tgz",
+      "integrity": "sha512-XCHRdUw4lf3SKBaJe4EvgqIuWwkPSo9XoeO8GjQW94Bp7TWv9hNhzZjZ+OH9yf1UmLygb7DIT5GSFQiyt16zYg==",
+      "funding": [
+        "https://opencollective.com/katex",
+        "https://github.com/sponsors/katex"
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "commander": "^8.3.0"
+      },
+      "bin": {
+        "katex": "cli.js"
+      }
+    },
+    "node_modules/katex/node_modules/commander": {
+      "version": "8.3.0",
+      "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz",
+      "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
     "node_modules/keyv": {
       "version": "4.5.4",
       "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
@@ -2622,6 +3621,39 @@
         "json-buffer": "3.0.1"
       }
     },
+    "node_modules/khroma": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/khroma/-/khroma-2.1.0.tgz",
+      "integrity": "sha512-Ls993zuzfayK269Svk9hzpeGUKob/sIgZzyHYdjQoAdQetRKpOLj+k/QQQ/6Qi0Yz65mlROrfd+Ev+1+7dz9Kw=="
+    },
+    "node_modules/kolorist": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/kolorist/-/kolorist-1.8.0.tgz",
+      "integrity": "sha512-Y+60/zizpJ3HRH8DCss+q95yr6145JXZo46OTpFvDZWLfRCE4qChOyk1b26nMaNpfHHgxagk9dXT5OP0Tfe+dQ==",
+      "license": "MIT"
+    },
+    "node_modules/langium": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/langium/-/langium-3.3.1.tgz",
+      "integrity": "sha512-QJv/h939gDpvT+9SiLVlY7tZC3xB2qK57v0J04Sh9wpMb6MP1q8gB21L3WIo8T5P1MSMg3Ep14L7KkDCFG3y4w==",
+      "license": "MIT",
+      "dependencies": {
+        "chevrotain": "~11.0.3",
+        "chevrotain-allstar": "~0.3.0",
+        "vscode-languageserver": "~9.0.1",
+        "vscode-languageserver-textdocument": "~1.0.11",
+        "vscode-uri": "~3.0.8"
+      },
+      "engines": {
+        "node": ">=16.0.0"
+      }
+    },
+    "node_modules/layout-base": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/layout-base/-/layout-base-1.0.2.tgz",
+      "integrity": "sha512-8h2oVEZNktL4BH2JCOI90iD1yXwL6iNW7KcCKT2QZgQJR2vbqDsldCTPRU9NifTCqHZci57XvQQ15YTu+sTYPg==",
+      "license": "MIT"
+    },
     "node_modules/levn": {
       "version": "0.4.1",
       "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
@@ -2636,6 +3668,23 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/local-pkg": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/local-pkg/-/local-pkg-1.1.2.tgz",
+      "integrity": "sha512-arhlxbFRmoQHl33a0Zkle/YWlmNwoyt6QNZEIJcqNbdrsix5Lvc4HyyI3EnwxTYlZYc32EbYrQ8SzEZ7dqgg9A==",
+      "license": "MIT",
+      "dependencies": {
+        "mlly": "^1.7.4",
+        "pkg-types": "^2.3.0",
+        "quansync": "^0.2.11"
+      },
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antfu"
+      }
+    },
     "node_modules/locate-path": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
@@ -2652,6 +3701,12 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/lodash-es": {
+      "version": "4.17.21",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz",
+      "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==",
+      "license": "MIT"
+    },
     "node_modules/lodash.merge": {
       "version": "4.6.2",
       "resolved": "https://registry.npmjs.org/lodash.merge/-/lodash.merge-4.6.2.tgz",
@@ -2682,6 +3737,18 @@
         "yallist": "^3.0.2"
       }
     },
+    "node_modules/marked": {
+      "version": "16.2.0",
+      "resolved": "https://registry.npmjs.org/marked/-/marked-16.2.0.tgz",
+      "integrity": "sha512-LbbTuye+0dWRz2TS9KJ7wsnD4KAtpj0MVkWc90XvBa6AslXsT0hTBVH5k32pcSyHH1fst9XEFJunXHktVy0zlg==",
+      "license": "MIT",
+      "bin": {
+        "marked": "bin/marked.js"
+      },
+      "engines": {
+        "node": ">= 20"
+      }
+    },
     "node_modules/merge2": {
       "version": "1.4.1",
       "resolved": "https://registry.npmjs.org/merge2/-/merge2-1.4.1.tgz",
@@ -2692,6 +3759,34 @@
         "node": ">= 8"
       }
     },
+    "node_modules/mermaid": {
+      "version": "11.10.0",
+      "resolved": "https://registry.npmjs.org/mermaid/-/mermaid-11.10.0.tgz",
+      "integrity": "sha512-oQsFzPBy9xlpnGxUqLbVY8pvknLlsNIJ0NWwi8SUJjhbP1IT0E0o1lfhU4iYV3ubpy+xkzkaOyDUQMn06vQElQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@braintree/sanitize-url": "^7.0.4",
+        "@iconify/utils": "^2.1.33",
+        "@mermaid-js/parser": "^0.6.2",
+        "@types/d3": "^7.4.3",
+        "cytoscape": "^3.29.3",
+        "cytoscape-cose-bilkent": "^4.1.0",
+        "cytoscape-fcose": "^2.2.0",
+        "d3": "^7.9.0",
+        "d3-sankey": "^0.12.3",
+        "dagre-d3-es": "7.0.11",
+        "dayjs": "^1.11.13",
+        "dompurify": "^3.2.5",
+        "katex": "^0.16.22",
+        "khroma": "^2.1.0",
+        "lodash-es": "^4.17.21",
+        "marked": "^16.0.0",
+        "roughjs": "^4.6.6",
+        "stylis": "^4.3.6",
+        "ts-dedent": "^2.2.0",
+        "uuid": "^11.1.0"
+      }
+    },
     "node_modules/micromatch": {
       "version": "4.0.8",
       "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
@@ -2719,11 +3814,39 @@
         "node": "*"
       }
     },
+    "node_modules/mlly": {
+      "version": "1.7.4",
+      "resolved": "https://registry.npmjs.org/mlly/-/mlly-1.7.4.tgz",
+      "integrity": "sha512-qmdSIPC4bDJXgZTCR7XosJiNKySV7O215tsPtDN9iEO/7q/76b/ijtgRu/+epFXSJhijtTCCGp3DWS549P3xKw==",
+      "license": "MIT",
+      "dependencies": {
+        "acorn": "^8.14.0",
+        "pathe": "^2.0.1",
+        "pkg-types": "^1.3.0",
+        "ufo": "^1.5.4"
+      }
+    },
+    "node_modules/mlly/node_modules/confbox": {
+      "version": "0.1.8",
+      "resolved": "https://registry.npmjs.org/confbox/-/confbox-0.1.8.tgz",
+      "integrity": "sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==",
+      "license": "MIT"
+    },
+    "node_modules/mlly/node_modules/pkg-types": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-1.3.1.tgz",
+      "integrity": "sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==",
+      "license": "MIT",
+      "dependencies": {
+        "confbox": "^0.1.8",
+        "mlly": "^1.7.4",
+        "pathe": "^2.0.1"
+      }
+    },
     "node_modules/ms": {
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
       "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
-      "dev": true,
       "license": "MIT"
     },
     "node_modules/nanoid": {
@@ -2808,6 +3931,12 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/package-manager-detector": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/package-manager-detector/-/package-manager-detector-1.3.0.tgz",
+      "integrity": "sha512-ZsEbbZORsyHuO00lY1kV3/t72yp6Ysay6Pd17ZAlNGuGwmWDLCJxFpRs0IzfXfj1o4icJOkUEioexFHzyPurSQ==",
+      "license": "MIT"
+    },
     "node_modules/parent-module": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz",
@@ -2821,6 +3950,12 @@
         "node": ">=6"
       }
     },
+    "node_modules/path-data-parser": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/path-data-parser/-/path-data-parser-0.1.0.tgz",
+      "integrity": "sha512-NOnmBpt5Y2RWbuv0LMzsayp3lVylAHLPUTut412ZA3l+C4uw4ZVkQbjShYCQ8TCpUMdPapr4YjUqLYD6v68j+w==",
+      "license": "MIT"
+    },
     "node_modules/path-exists": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -2841,6 +3976,12 @@
         "node": ">=8"
       }
     },
+    "node_modules/pathe": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
+      "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==",
+      "license": "MIT"
+    },
     "node_modules/picocolors": {
       "version": "1.1.1",
       "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
@@ -2860,6 +4001,33 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/pkg-types": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/pkg-types/-/pkg-types-2.3.0.tgz",
+      "integrity": "sha512-SIqCzDRg0s9npO5XQ3tNZioRY1uK06lA41ynBC1YmFTmnY6FjUjVt6s4LoADmwoig1qqD0oK8h1p/8mlMx8Oig==",
+      "license": "MIT",
+      "dependencies": {
+        "confbox": "^0.2.2",
+        "exsolve": "^1.0.7",
+        "pathe": "^2.0.3"
+      }
+    },
+    "node_modules/points-on-curve": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/points-on-curve/-/points-on-curve-0.2.0.tgz",
+      "integrity": "sha512-0mYKnYYe9ZcqMCWhUjItv/oHjvgEsfKvnUTg8sAtnHr3GVy7rGkXCb6d5cSyqrWqL4k81b9CPg3urd+T7aop3A==",
+      "license": "MIT"
+    },
+    "node_modules/points-on-path": {
+      "version": "0.2.1",
+      "resolved": "https://registry.npmjs.org/points-on-path/-/points-on-path-0.2.1.tgz",
+      "integrity": "sha512-25ClnWWuw7JbWZcgqY/gJ4FQWadKxGWk+3kR/7kD0tCaDtPPMj7oHu2ToLaVhfpnHrZzYby2w6tUA0eOIuUg8g==",
+      "license": "MIT",
+      "dependencies": {
+        "path-data-parser": "0.1.0",
+        "points-on-curve": "0.2.0"
+      }
+    },
     "node_modules/postcss": {
       "version": "8.5.6",
       "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.6.tgz",
@@ -2898,6 +4066,15 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/prismjs": {
+      "version": "1.30.0",
+      "resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.30.0.tgz",
+      "integrity": "sha512-DEvV2ZF2r2/63V+tK8hQvrR2ZGn10srHbXviTlcv7Kpzw8jWiNTqbVgjO3IY8RxrrOUF8VPMQQFysYYYv0YZxw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
     "node_modules/punycode": {
       "version": "2.3.1",
       "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
@@ -2908,6 +4085,22 @@
         "node": ">=6"
       }
     },
+    "node_modules/quansync": {
+      "version": "0.2.11",
+      "resolved": "https://registry.npmjs.org/quansync/-/quansync-0.2.11.tgz",
+      "integrity": "sha512-AifT7QEbW9Nri4tAwR5M/uzpBuqfZf+zwaEM/QkzEjj7NBuFD2rBuy0K3dE+8wltbezDV7JMA0WfnCPYRSYbXA==",
+      "funding": [
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/antfu"
+        },
+        {
+          "type": "individual",
+          "url": "https://github.com/sponsors/sxzz"
+        }
+      ],
+      "license": "MIT"
+    },
     "node_modules/queue-microtask": {
       "version": "1.2.3",
       "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz",
@@ -3019,6 +4212,12 @@
         "node": ">=0.10.0"
       }
     },
+    "node_modules/robust-predicates": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/robust-predicates/-/robust-predicates-3.0.2.tgz",
+      "integrity": "sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==",
+      "license": "Unlicense"
+    },
     "node_modules/rollup": {
       "version": "4.46.4",
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.46.4.tgz",
@@ -3059,6 +4258,18 @@
         "fsevents": "~2.3.2"
       }
     },
+    "node_modules/roughjs": {
+      "version": "4.6.6",
+      "resolved": "https://registry.npmjs.org/roughjs/-/roughjs-4.6.6.tgz",
+      "integrity": "sha512-ZUz/69+SYpFN/g/lUlo2FXcIjRkSu3nDarreVdGGndHEBJ6cXPdKguS8JGxwj5HA5xIbVKSmLgr5b3AWxtRfvQ==",
+      "license": "MIT",
+      "dependencies": {
+        "hachure-fill": "^0.5.2",
+        "path-data-parser": "^0.1.0",
+        "points-on-curve": "^0.2.0",
+        "points-on-path": "^0.2.1"
+      }
+    },
     "node_modules/run-parallel": {
       "version": "1.2.0",
       "resolved": "https://registry.npmjs.org/run-parallel/-/run-parallel-1.2.0.tgz",
@@ -3083,6 +4294,18 @@
         "queue-microtask": "^1.2.2"
       }
     },
+    "node_modules/rw": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/rw/-/rw-1.3.3.tgz",
+      "integrity": "sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/safer-buffer": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "license": "MIT"
+    },
     "node_modules/scheduler": {
       "version": "0.26.0",
       "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.26.0.tgz",
@@ -3150,6 +4373,12 @@
         "url": "https://github.com/sponsors/sindresorhus"
       }
     },
+    "node_modules/stylis": {
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.3.6.tgz",
+      "integrity": "sha512-yQ3rwFWRfwNUY7H5vpU0wfdkNSnvnJinhF9830Swlaxl03zsOjCfmX0ugac+3LtK0lYSgwL/KXc8oYL3mG4YFQ==",
+      "license": "MIT"
+    },
     "node_modules/supports-color": {
       "version": "7.2.0",
       "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
@@ -3163,6 +4392,12 @@
         "node": ">=8"
       }
     },
+    "node_modules/tinyexec": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.0.1.tgz",
+      "integrity": "sha512-5uC6DDlmeqiOwCPmK9jMSdOuZTh8bU39Ys6yidB+UTt5hfZUPGAypSgFRiEp+jbi9qH40BLDvy85jIU88wKSqw==",
+      "license": "MIT"
+    },
     "node_modules/tinyglobby": {
       "version": "0.2.14",
       "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.14.tgz",
@@ -3237,6 +4472,15 @@
         "typescript": ">=4.8.4"
       }
     },
+    "node_modules/ts-dedent": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/ts-dedent/-/ts-dedent-2.2.0.tgz",
+      "integrity": "sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.10"
+      }
+    },
     "node_modules/type-check": {
       "version": "0.4.0",
       "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
@@ -3288,6 +4532,12 @@
         "typescript": ">=4.8.4 <6.0.0"
       }
     },
+    "node_modules/ufo": {
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/ufo/-/ufo-1.6.1.tgz",
+      "integrity": "sha512-9a4/uxlTWJ4+a5i0ooc1rU7C7YOw3wT+UGqdeNNHWnOF9qcMBgLRS+4IYUqbczewFx4mLEig6gawh7X6mFlEkA==",
+      "license": "MIT"
+    },
     "node_modules/undici-types": {
       "version": "7.10.0",
       "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.10.0.tgz",
@@ -3336,6 +4586,19 @@
         "punycode": "^2.1.0"
       }
     },
+    "node_modules/uuid": {
+      "version": "11.1.0",
+      "resolved": "https://registry.npmjs.org/uuid/-/uuid-11.1.0.tgz",
+      "integrity": "sha512-0/A9rDy9P7cJ+8w1c9WD9V//9Wj15Ce2MPz8Ri6032usz+NfePxx5AcN3bN+r6ZL6jEo066/yNYB3tn4pQEx+A==",
+      "funding": [
+        "https://github.com/sponsors/broofa",
+        "https://github.com/sponsors/ctavan"
+      ],
+      "license": "MIT",
+      "bin": {
+        "uuid": "dist/esm/bin/uuid"
+      }
+    },
     "node_modules/vite": {
       "version": "7.1.3",
       "resolved": "https://registry.npmjs.org/vite/-/vite-7.1.3.tgz",
@@ -3442,6 +4705,55 @@
         "url": "https://github.com/sponsors/jonschlinkert"
       }
     },
+    "node_modules/vscode-jsonrpc": {
+      "version": "8.2.0",
+      "resolved": "https://registry.npmjs.org/vscode-jsonrpc/-/vscode-jsonrpc-8.2.0.tgz",
+      "integrity": "sha512-C+r0eKJUIfiDIfwJhria30+TYWPtuHJXHtI7J0YlOmKAo7ogxP20T0zxB7HZQIFhIyvoBPwWskjxrvAtfjyZfA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/vscode-languageserver": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/vscode-languageserver/-/vscode-languageserver-9.0.1.tgz",
+      "integrity": "sha512-woByF3PDpkHFUreUa7Hos7+pUWdeWMXRd26+ZX2A8cFx6v/JPTtd4/uN0/jB6XQHYaOlHbio03NTHCqrgG5n7g==",
+      "license": "MIT",
+      "dependencies": {
+        "vscode-languageserver-protocol": "3.17.5"
+      },
+      "bin": {
+        "installServerIntoExtension": "bin/installServerIntoExtension"
+      }
+    },
+    "node_modules/vscode-languageserver-protocol": {
+      "version": "3.17.5",
+      "resolved": "https://registry.npmjs.org/vscode-languageserver-protocol/-/vscode-languageserver-protocol-3.17.5.tgz",
+      "integrity": "sha512-mb1bvRJN8SVznADSGWM9u/b07H7Ecg0I3OgXDuLdn307rl/J3A9YD6/eYOssqhecL27hK1IPZAsaqh00i/Jljg==",
+      "license": "MIT",
+      "dependencies": {
+        "vscode-jsonrpc": "8.2.0",
+        "vscode-languageserver-types": "3.17.5"
+      }
+    },
+    "node_modules/vscode-languageserver-textdocument": {
+      "version": "1.0.12",
+      "resolved": "https://registry.npmjs.org/vscode-languageserver-textdocument/-/vscode-languageserver-textdocument-1.0.12.tgz",
+      "integrity": "sha512-cxWNPesCnQCcMPeenjKKsOCKQZ/L6Tv19DTRIGuLWe32lyzWhihGVJ/rcckZXJxfdKCFvRLS3fpBIsV/ZGX4zA==",
+      "license": "MIT"
+    },
+    "node_modules/vscode-languageserver-types": {
+      "version": "3.17.5",
+      "resolved": "https://registry.npmjs.org/vscode-languageserver-types/-/vscode-languageserver-types-3.17.5.tgz",
+      "integrity": "sha512-Ld1VelNuX9pdF39h2Hgaeb5hEZM2Z3jUrrMgWQAu82jMtZp7p3vJT3BzToKtZI7NgQssZje5o0zryOrhQvzQAg==",
+      "license": "MIT"
+    },
+    "node_modules/vscode-uri": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/vscode-uri/-/vscode-uri-3.0.8.tgz",
+      "integrity": "sha512-AyFQ0EVmsOZOlAnxoFOGOq1SQDWAB7C6aqMGS23svWAllfOaxbuFvcT8D1i8z3Gyn8fraVeZNNmN6e9bxxXkKw==",
+      "license": "MIT"
+    },
     "node_modules/which": {
       "version": "2.0.2",
       "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
diff --git a/package.json b/package.json
index a5efae2..ce2e6e2 100644
--- a/package.json
+++ b/package.json
@@ -11,9 +11,13 @@
     "generate-manifest": "node scripts/generate-themes-manifest.js"
   },
   "dependencies": {
+    "@types/prismjs": "^1.26.5",
     "dompurify": "^3.2.6",
     "loglevel": "^1.9.2",
+    "marked": "^16.2.0",
+    "mermaid": "^11.10.0",
     "postcss": "^8.5.6",
+    "prismjs": "^1.30.0",
     "react": "^19.1.1",
     "react-dom": "^19.1.1",
     "react-router-dom": "^7.8.1"
diff --git a/public/themes-manifest.json b/public/themes-manifest.json
index 56dc8f2..9535be5 100644
--- a/public/themes-manifest.json
+++ b/public/themes-manifest.json
@@ -5,12 +5,14 @@
       "cssFile": "style.css",
       "layouts": [
         "2-content-blocks",
+        "code-slide",
         "content-slide",
         "image-slide",
+        "markdown-slide",
         "title-slide"
       ],
       "hasMasterSlide": true
     }
   },
-  "generated": "2025-08-21T21:35:36.361Z"
+  "generated": "2025-08-22T01:40:33.956Z"
 }
\ No newline at end of file
diff --git a/public/themes/CLAUDE.md b/public/themes/CLAUDE.md
index 0494c5d..b3ed4d6 100644
--- a/public/themes/CLAUDE.md
+++ b/public/themes/CLAUDE.md
@@ -114,6 +114,7 @@ Slots are editable areas defined with specific data attributes:
 - **Text content**: `data-slot="content"`
 - **Images**: `data-slot="image"` with `data-accept="image/*"`
 - **Subtitles**: `data-slot="subtitle"`
+- **Markdown content**: `data-slot="content" data-type="markdown"`
 
 ### Layout CSS Naming Convention
 Style layouts using the pattern: `.layout-[layout-name]`
@@ -335,6 +336,73 @@ Include print styles for presentation export:
 }
 ```
 
+## Markdown Support
+
+### Markdown Slots
+Themes can include slots that automatically process markdown content. This enables rich text formatting while maintaining security.
+
+#### Creating Markdown Slots
+```html
+<div class="slot markdown-content" 
+     data-slot="content" 
+     data-type="markdown"
+     data-placeholder="Enter markdown content..." 
+     data-multiline="true">
+  {{content}}
+</div>
+```
+
+#### Supported Markdown Features
+- **Headers**: `# H1`, `## H2`, `### H3`
+- **Text formatting**: `**bold**`, `*italic*`, `~~strikethrough~~`
+- **Lists**: Unordered (`-`, `*`) and ordered (`1.`)
+- **Links**: `[text](url)`
+- **Inline code**: `` `code` ``
+- **Code blocks**: ````markdown```language````
+- **Blockquotes**: `> quote`
+- **Tables**: GitHub-flavored markdown tables
+
+#### Security Features
+- **DOMPurify sanitization**: All HTML is sanitized to prevent XSS
+- **No script execution**: JavaScript and dangerous attributes are stripped
+- **Safe HTML subset**: Only presentation-safe HTML elements allowed
+- **URL filtering**: Only safe URL schemes (http, https, mailto) permitted
+
+#### Styling Markdown Content
+```css
+.markdown-content h1,
+.markdown-content h2,
+.markdown-content h3 {
+  font-family: var(--theme-font-heading);
+  color: var(--theme-primary);
+  margin: 1.5em 0 0.5em 0;
+}
+
+.markdown-content strong {
+  color: var(--theme-accent);
+  font-weight: 600;
+}
+
+.markdown-content code {
+  background: rgba(255, 255, 255, 0.1);
+  padding: 0.2em 0.4em;
+  border-radius: 3px;
+  font-family: var(--theme-font-code);
+}
+
+.markdown-content blockquote {
+  border-left: 4px solid var(--theme-accent);
+  padding-left: 1rem;
+  font-style: italic;
+}
+```
+
+#### Auto-Detection
+Text slots automatically detect markdown patterns and apply markdown rendering:
+- Content with `#`, `**`, `*`, `-`, `>`, etc. is processed as markdown
+- Set `data-type="markdown"` to force markdown processing
+- Set `data-type="text"` to disable auto-detection
+
 ## Best Practices
 
 1. **Use clamp() for responsive typography**: `font-size: clamp(min, preferred, max)`
@@ -344,6 +412,7 @@ Include print styles for presentation export:
 5. **Consider accessibility**: Use sufficient color contrast and readable fonts
 6. **Use semantic HTML**: Proper heading hierarchy and meaningful class names
 7. **Keep layouts flexible**: Use flexbox/grid for responsive behavior
+8. **Use markdown for rich content**: Enable `data-type="markdown"` for formatted text slots
 
 ## Template Variables (Handlebars)
 
diff --git a/public/themes/default/layouts/2-content-blocks.html b/public/themes/default/layouts/2-content-blocks.html
index c910bd5..ac3facc 100644
--- a/public/themes/default/layouts/2-content-blocks.html
+++ b/public/themes/default/layouts/2-content-blocks.html
@@ -1,5 +1,5 @@
-<div class="slide layout-2-content-blocks">
-    <h1 class="slot title-slot" data-slot="title" data-placeholder="Slide Title" data-required>
+<div class="fade-in slide layout-2-content-blocks">
+    <h1 class=" slot title-slot" data-slot="title" data-placeholder="Slide Title" data-required>
         {{title}}
     </h1>
     <div class="content-blocks-container">
@@ -7,7 +7,10 @@
             {{content1}}
         </div>
         <div class="slot content-slot" data-slot="content2" data-placeholder="Second content block" data-required>
+            <span class="fade-in-slow">
             {{content2}}
+            </span>
+
         </div>
     </div>
 </div>
\ No newline at end of file
diff --git a/public/themes/default/layouts/code-slide.html b/public/themes/default/layouts/code-slide.html
new file mode 100644
index 0000000..d4945d9
--- /dev/null
+++ b/public/themes/default/layouts/code-slide.html
@@ -0,0 +1,8 @@
+<div class="fade-in layout-content-slide">
+    <h1 class="slot title-slot" data-slot="title" data-placeholder="Slide Title" data-required>
+        {{title}}
+    </h1>
+    <div id="code" class="slot content-area" data-slot="content" data-placeholder="Your content here..." data-multiline="true">
+
+    </div>
+</div>
\ No newline at end of file
diff --git a/public/themes/default/layouts/content-slide.html b/public/themes/default/layouts/content-slide.html
index f3d443e..7728684 100644
--- a/public/themes/default/layouts/content-slide.html
+++ b/public/themes/default/layouts/content-slide.html
@@ -1,10 +1,7 @@
-<div class="slide layout-content-slide">
+<div class="fade-in layout-content-slide">
   <h1 class="slot title-slot" data-slot="title" data-placeholder="Slide Title" data-required>
     {{title}}
   </h1>
-  <h1 class="slot subtitle-slot" data-slot="subtitle" data-placeholder="Slide Subtitle" data-required>
-    {{subtitle}}
-  </h1>
   <div class="slot content-area" data-slot="content" data-placeholder="Your content here..." data-multiline="true">
     {{content}}
   </div>
diff --git a/public/themes/default/layouts/image-slide.html b/public/themes/default/layouts/image-slide.html
index 859b9c8..8a01ed7 100644
--- a/public/themes/default/layouts/image-slide.html
+++ b/public/themes/default/layouts/image-slide.html
@@ -1,4 +1,4 @@
-<div class="slide layout-image-slide">
+<div class="fade-in slide layout-image-slide">
   <h1 class="slot title-slot" data-slot="title" data-placeholder="Slide Title" data-required>
     {{title}}
   </h1>
diff --git a/public/themes/default/layouts/markdown-slide.html b/public/themes/default/layouts/markdown-slide.html
new file mode 100644
index 0000000..e79275a
--- /dev/null
+++ b/public/themes/default/layouts/markdown-slide.html
@@ -0,0 +1,17 @@
+<div class="slide layout-markdown-slide">
+  <h1 class="slot title-slot" 
+      data-slot="title" 
+      data-type="title"
+      data-placeholder="Slide Title" 
+      data-required>
+    {{title}}
+  </h1>
+  
+  <div class="slot markdown-content" 
+       data-slot="content" 
+       data-type="markdown"
+       data-placeholder="Enter your markdown content here..." 
+       data-multiline="true">
+    {{content}}
+  </div>
+</div>
\ No newline at end of file
diff --git a/public/themes/default/layouts/title-slide.html b/public/themes/default/layouts/title-slide.html
index b7225b4..d416256 100644
--- a/public/themes/default/layouts/title-slide.html
+++ b/public/themes/default/layouts/title-slide.html
@@ -1,8 +1,5 @@
-<div class="slide layout-title-slide">
+<div class="fade-in slide layout-title-slide">
   <h1 class="slot title-slot" data-slot="title" data-placeholder="Presentation Title" data-required>
     {{title}}
   </h1>
-  <div class="slot diagram-slot" data-slot="diagram" data-placeholder="Diagram or Image" data-required>
-    {{diagram}}
-  </div>
 </div>
\ No newline at end of file
diff --git a/public/themes/default/master-slide.html b/public/themes/default/master-slide.html
index ffa4da2..0f12bbc 100644
--- a/public/themes/default/master-slide.html
+++ b/public/themes/default/master-slide.html
@@ -1,3 +1,3 @@
 <div class="master-slide footer">
-  {{footerText}}
+  Here is some data
 </div>
\ No newline at end of file
diff --git a/public/themes/default/style.css b/public/themes/default/style.css
index b840049..3f017e9 100644
--- a/public/themes/default/style.css
+++ b/public/themes/default/style.css
@@ -27,7 +27,7 @@
   width: 100%;
   height: 100%;
   background: var(--theme-background);
-  color: var(--theme-text);
+  color: var(--theme-primary);
   font-family: var(--theme-font-body);
   padding: var(--slide-padding);
   box-sizing: border-box;
@@ -35,8 +35,6 @@
   flex-direction: column;
   position: relative;
   overflow: hidden;
-  justify-content: center;
-  align-items: center;
   /* Ensure content is properly centered within container */
   text-align: center;
 }
@@ -69,10 +67,13 @@
   /* Ensure slot content inherits proper centering */
   text-align: inherit;
 }
-#main-image {
-  scale: .7;
+
+.slot[data-slot="image"] {
+  width: 100%;
+}
+.slot[data-slot="image"] img {
+    width: 100%;
 }
-.slot:hover,
 .slot.editing {
   border-color: var(--theme-accent);
   border-radius: 4px;
@@ -92,20 +93,6 @@
   font-style: italic;
 }
 
-/* Text slots */
-.slot[data-type="title"] {
-  font-family: var(--theme-font-heading);
-  font-weight: bold;
-  line-height: 1.2;
-  text-align: center;
-}
-
-.slot[data-type="subtitle"] {
-  font-family: var(--theme-font-heading);
-  line-height: 1.4;
-  opacity: 0.8;
-  text-align: center;
-}
 .content-slot {
   color: var(--theme-text-secondary);
   background-color: var(--theme-background);
@@ -115,101 +102,34 @@
   /* Text content can be left-aligned for readability */
   text-align: left;
 }
-
-/* Image slots */
 .slot[data-type="image"] {
   display: flex;
   align-items: center;
   justify-content: center;
-  background: #f8fafc;
+  background: #fffffd;
   border-radius: 8px;
 }
 
 .slot[data-type="image"] img {
-  max-width: 100%;
-  max-height: 100%;
-  object-fit: contain;
+  max-width: 100px;
+  max-height: 100px;
   border-radius: 4px;
 }
 
-/* Layout-specific styles */
-
-/* Title slide layout */
-.layout-title-slide,
-.slide-container .layout-title-slide {
-  justify-content: center;
-  align-items: center;
-  text-align: center;
-}
-
-.layout-title-slide .slot[data-slot="title"] {
-  font-size: clamp(2rem, 8vw, 4rem);
+.slot[data-slot="title"] {
+  font-size: clamp(5rem, 8vw, 4rem);
   margin-bottom: 2rem;
-  width: 100%;
-  max-width: 80%;
-  color: var(--theme-primary);
+  width: 80%;
   text-align: center;
 }
 
-.layout-title-slide .slot[data-slot="subtitle"] {
+.slot[data-slot="subtitle"] {
   font-size: clamp(1rem, 4vw, 2rem);
   color: var(--theme-text-secondary);
   width: 100%;
   max-width: 80%;
   text-align: center;
 }
-/* Content slide layout */
-.layout-content-slide,
-.slide-container .layout-content-slide {
-  justify-content: flex-start;
-  align-items: stretch;
-  /* Reset text alignment for content slides */
-  text-align: initial;
-}
-
-.layout-content-slide .slot[data-slot="title"] {
-  font-size: clamp(1.5rem, 6vw, 2.5rem);
-  margin-bottom: 2rem;
-  padding-bottom: 1rem;
-  border-bottom: 2px solid var(--theme-primary);
-  text-align: center;
-  width: 100%;
-}
-
-.layout-content-slide .slot[data-slot="subtitle"] {
-  font-size: clamp(1rem, 2vw, .5rem);
-  text-align: right;
-  width: 50%;
-}
-
-.layout-content-slide .slot[data-slot="content"] {
-  font-size: clamp(1rem, 2.5vw, 1.25rem);
-  flex: 1;
-  text-align: left;
-  width: 100%;
-  line-height: 1.6;
-  /* Ensure content doesn't get too wide */
-  max-width: 100%;
-  margin: 0 auto;
-}
-
-/* Two content blocks layout */
-.layout-2-content-blocks,
-.slide-container .layout-2-content-blocks {
-  justify-content: flex-start;
-  align-items: stretch;
-  /* Reset text alignment for two-column slides */
-  text-align: initial;
-}
-
-.layout-2-content-blocks .slot[data-slot="title"] {
-  font-size: clamp(1.5rem, 5vw, 2.5rem);
-  margin-bottom: 2rem;
-  padding-bottom: 1rem;
-  border-bottom: 2px solid var(--theme-primary);
-  text-align: center;
-  width: 100%;
-}
 
 .content-blocks-container {
   display: grid;
@@ -219,41 +139,17 @@
   align-items: stretch;
   width: 100%;
 }
-
-.layout-2-content-blocks .slot[data-slot="content1"],
-.layout-2-content-blocks .slot[data-slot="content2"] {
+.slot[data-slot="content"],
+.slot[data-slot="content1"],
+.slot[data-slot="content2"] {
   font-size: clamp(0.9rem, 2.2vw, 1.1rem);
   text-align: left;
   width: 100%;
   line-height: 1.6;
-  padding: 1rem;
-  background: rgba(255, 255, 255, 0.05);
-  border-radius: 0.5rem;
-  border: 1px solid rgba(255, 255, 255, 0.1);
+  padding: 2rem;
+  color: var(--theme-text-secondary);
 }
 
-/* Image slide layout */
-.layout-image-slide,
-.slide-container .layout-image-slide {
-  justify-content: flex-start;
-  align-items: stretch;
-}
-
-.layout-image-slide .slot[data-slot="title"] {
-  font-size: clamp(1.5rem, 6vw, 2.5rem);
-  margin-bottom: 2rem;
-  text-align: center;
-  width: 100%;
-}
-
-.layout-image-slide .slot[data-slot="image"] {
-  flex: 1;
-  margin-top: 1rem;
-  width: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
 
 /* Aspect ratio specific adjustments */
 .slide-container.aspect-16-9 .slide-content,
@@ -281,20 +177,7 @@
     --content-max-width: 95%;
   }
   
-  .layout-title-slide .slot[data-slot="title"] {
-    margin-bottom: 1rem;
-    font-size: clamp(1.5rem, 6vw, 3rem);
-  }
-  
-  .layout-content-slide .slot[data-slot="title"] {
-    margin-bottom: 1rem;
-    font-size: clamp(1.2rem, 5vw, 2rem);
-  }
-  
-  .layout-image-slide .slot[data-slot="title"] {
-    font-size: clamp(1.2rem, 5vw, 2rem);
-  }
-  
+
   /* Two content blocks responsive adjustments */
   .content-blocks-container {
     grid-template-columns: 1fr;
@@ -307,20 +190,274 @@
     padding: 0.75rem;
   }
 }
+.fade-in {
+  opacity: 1;
+  animation-name: fadeInOpacity;
+  animation-iteration-count: 1;
+  animation-timing-function: ease-in;
+  animation-duration: 1s;
+}
 
-/* Print styles for presentations */
-@media print {
-  .slide {
-    page-break-after: always;
-    width: 100%;
-    height: 100vh;
+.fade-in-slow {
+  opacity: 0;
+  animation-name: fadeInOpacity;
+  animation-iteration-count: 1;
+  animation-timing-function: ease-in;
+  animation-duration: 2s;
+  animation-delay: 1s;
+  animation-fill-mode: forwards;
+}
+
+
+@keyframes fadeInOpacity {
+  0% {
+    opacity: 0;
   }
-  
-  .slot {
-    border: none !important;
-  }
-  
-  .slot.empty::before {
-    display: none;
+  100% {
+    opacity: 1;
   }
 }
+
+/* Enhanced code blocks with syntax highlighting */
+.slide-code {
+  background: #1e1e1e !important;
+  border: 1px solid var(--theme-secondary);
+  border-radius: 8px;
+  padding: 1.5rem;
+  margin: 1.5em 0;
+  overflow-x: auto;
+  font-family: var(--theme-font-code);
+  font-size: clamp(0.75rem, 1.5vw, 0.9rem);
+  line-height: 1.4;
+  position: relative;
+}
+
+.slide-code code {
+  background: none !important;
+  padding: 0 !important;
+  color: #e6e6e6;
+  font-family: inherit;
+}
+
+/* Prism.js syntax highlighting theme for slides */
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: #6a9955;
+  font-style: italic;
+}
+
+.token.punctuation {
+  color: #d4d4d4;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: #b5cea8;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  color: #ce9178;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: #d4d4d4;
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+  color: #569cd6;
+}
+
+.token.function,
+.token.class-name {
+  color: #dcdcaa;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+  color: #d16969;
+}
+
+.token.important,
+.token.bold {
+  font-weight: bold;
+}
+
+.token.italic {
+  font-style: italic;
+}
+
+/* Language labels for code blocks */
+.slide-code::before {
+  content: attr(class);
+  position: absolute;
+  top: 0.5rem;
+  right: 1rem;
+  font-size: 0.75rem;
+  color: var(--theme-text-secondary);
+  text-transform: uppercase;
+  letter-spacing: 0.5px;
+  opacity: 0.7;
+}
+
+.slide-code.language-javascript::before { content: 'JavaScript'; }
+.slide-code.language-typescript::before { content: 'TypeScript'; }
+.slide-code.language-python::before { content: 'Python'; }
+.slide-code.language-bash::before { content: 'Bash'; }
+.slide-code.language-json::before { content: 'JSON'; }
+.slide-code.language-css::before { content: 'CSS'; }
+.slide-code.language-markup::before { content: 'HTML'; }
+.slide-code.language-html::before { content: 'HTML'; }
+.slide-code.language-sql::before { content: 'SQL'; }
+.slide-code.language-yaml::before { content: 'YAML'; }
+
+/* Mermaid diagram styling */
+.mermaid-container {
+  margin: 2rem 0;
+  padding: 1rem;
+  background: rgba(255, 255, 255, 0.05);
+  border-radius: 8px;
+  border: 1px solid var(--theme-secondary);
+  text-align: center;
+  overflow-x: auto;
+}
+
+.mermaid-diagram {
+  max-width: 100%;
+  height: auto;
+}
+
+.mermaid-diagram svg {
+  max-width: 100%;
+  height: auto;
+  background: transparent;
+}
+
+.mermaid-error {
+  color: #ff6b6b;
+  background: rgba(255, 107, 107, 0.1);
+  padding: 1rem;
+  border-radius: 4px;
+  border: 1px solid #ff6b6b;
+  font-family: var(--theme-font-code);
+  font-size: 0.9rem;
+}
+
+/* Enhanced slide callouts */
+.slide-callout {
+  background: rgba(149, 116, 235, 0.15);
+  border-left: 4px solid var(--theme-primary);
+  padding: 1rem 1.5rem;
+  margin: 1.5em 0;
+  border-radius: 0 8px 8px 0;
+  font-style: italic;
+  color: var(--theme-text);
+  position: relative;
+}
+
+.slide-callout::before {
+  content: '💡';
+  position: absolute;
+  left: -12px;
+  top: 50%;
+  transform: translateY(-50%);
+  background: var(--theme-background);
+  padding: 0.25rem;
+  border-radius: 50%;
+  font-style: normal;
+}
+
+/* Enhanced slide lists */
+.slide-list {
+  margin: 1.5em 0;
+  padding-left: 2rem;
+}
+
+.slide-list li {
+  margin: 0.75em 0;
+  color: var(--theme-text);
+  line-height: 1.6;
+  position: relative;
+}
+
+.slide-list li::marker {
+  color: var(--theme-accent);
+  font-weight: 600;
+}
+
+/* Enhanced slide tables */
+.slide-table-wrapper {
+  margin: 2rem 0;
+  overflow-x: auto;
+  border-radius: 8px;
+  border: 1px solid var(--theme-secondary);
+}
+
+.slide-table {
+  width: 100%;
+  border-collapse: collapse;
+  background: rgba(255, 255, 255, 0.02);
+}
+
+.slide-table th,
+.slide-table td {
+  padding: 0.75rem 1rem;
+  text-align: left;
+  border-bottom: 1px solid var(--theme-secondary);
+}
+
+.slide-table th {
+  background: rgba(149, 116, 235, 0.2);
+  font-weight: 600;
+  color: var(--theme-primary);
+  border-bottom: 2px solid var(--theme-primary);
+}
+
+.slide-table tr:nth-child(even) {
+  background: rgba(255, 255, 255, 0.03);
+}
+
+.slide-table tr:hover {
+  background: rgba(149, 116, 235, 0.1);
+}
+
+/* Responsive adjustments for enhanced features */
+@media (max-width: 768px) {
+  .slide-code {
+    padding: 1rem;
+    font-size: 0.8rem;
+  }
+  
+  .slide-code::before {
+    font-size: 0.7rem;
+  }
+  
+  .mermaid-container {
+    padding: 0.5rem;
+    margin: 1rem 0;
+  }
+  
+  .slide-callout {
+    padding: 0.75rem 1rem;
+    margin: 1rem 0;
+  }
+}
+
diff --git a/src/components/presentations/PresentationMode.tsx b/src/components/presentations/PresentationMode.tsx
index f88608c..4abfd96 100644
--- a/src/components/presentations/PresentationMode.tsx
+++ b/src/components/presentations/PresentationMode.tsx
@@ -1,13 +1,14 @@
-import React, { useState, useEffect, useCallback } from 'react';
+import React, { useState, useEffect} from 'react';
 import { useParams, useNavigate } from 'react-router-dom';
-import type { Presentation, SlideContent } from '../../types/presentation.ts';
-import type { Theme } from '../../types/theme.ts';
-import { getPresentationById } from '../../utils/presentationStorage.ts';
-import { loadTheme } from '../../utils/themeLoader.ts';
+
 import { renderTemplateWithSampleData } from '../../utils/templateRenderer.ts';
 import { sanitizeSlideTemplate } from '../../utils/htmlSanitizer.ts';
+import { renderSlideMarkdown, isMarkdownContent } from '../../utils/markdownProcessor.ts';
 import { loggers } from '../../utils/logger.ts';
 import './PresentationMode.css';
+import {usePresentationLoader} from "./hooks/usePresentationLoader.ts";
+import type { SlideContent } from '../../types/presentation.ts';
+import {useKeyboardNavigation} from "./hooks/useKeyboardNavigation.ts";
 
 export const PresentationMode: React.FC = () => {
   const { presentationId, slideNumber } = useParams<{ 
@@ -15,15 +16,13 @@ export const PresentationMode: React.FC = () => {
     slideNumber: string; 
   }>();
   const navigate = useNavigate();
-  
-  const [presentation, setPresentation] = useState<Presentation | null>(null);
-  const [theme, setTheme] = useState<Theme | null>(null);
+
   const [currentSlideIndex, setCurrentSlideIndex] = useState(
     slideNumber ? parseInt(slideNumber, 10) - 1 : 0
   );
-  const [loading, setLoading] = useState(true);
-  const [error, setError] = useState<string | null>(null);
-  
+
+  // Load presentation and theme
+  const { presentation, theme, loading, error } = usePresentationLoader(presentationId);
   // Navigate to specific slide and update URL
   const goToSlide = (slideIndex: number) => {
     if (!presentation) return;
@@ -32,50 +31,16 @@ export const PresentationMode: React.FC = () => {
     setCurrentSlideIndex(clampedIndex);
     navigate(`/presentations/${presentationId}/present/${clampedIndex + 1}`, { replace: true });
   };
-  
+
+
   // Keyboard navigation handler
-  const handleKeyPress = useCallback((event: KeyboardEvent) => {
-    if (!presentation || presentation.slides.length === 0) return;
-    
-    switch (event.key) {
-      case 'ArrowRight':
-      case 'Space':
-      case 'Enter':
-        event.preventDefault();
-        goToSlide(currentSlideIndex + 1);
-        break;
-        
-      case 'ArrowLeft':
-        event.preventDefault();
-        goToSlide(currentSlideIndex - 1);
-        break;
-        
-      case 'Home':
-        event.preventDefault();
-        goToSlide(0);
-        break;
-        
-      case 'End':
-        event.preventDefault();
-        goToSlide(presentation.slides.length - 1);
-        break;
-        
-      case 'Escape':
-        event.preventDefault();
-        exitPresentationMode();
-        break;
-        
-      default:
-        // Handle number keys for direct slide navigation
-        const slideNum = parseInt(event.key);
-        if (slideNum >= 1 && slideNum <= presentation.slides.length) {
-          event.preventDefault();
-          goToSlide(slideNum - 1);
-        }
-        break;
-    }
-  }, [presentation, currentSlideIndex, goToSlide]);
-  
+
+  useKeyboardNavigation({
+    totalSlides: presentation?.slides.length || 0,
+    currentSlideIndex,
+    onNavigate: goToSlide
+  });
+
   // Sync current slide index with URL parameter
   useEffect(() => {
     if (slideNumber) {
@@ -85,81 +50,7 @@ export const PresentationMode: React.FC = () => {
       }
     }
   }, [slideNumber]);
-  
-  // Set up keyboard listeners
-  useEffect(() => {
-    document.addEventListener('keydown', handleKeyPress);
-    return () => {
-      document.removeEventListener('keydown', handleKeyPress);
-    };
-  }, [handleKeyPress]);
-  
-  // Load presentation and theme
-  useEffect(() => {
-    const loadPresentationAndTheme = async () => {
-      if (!presentationId) {
-        setError('No presentation ID provided');
-        setLoading(false);
-        return;
-      }
 
-      try {
-        setLoading(true);
-        
-        // Load presentation
-        const presentationData = await getPresentationById(presentationId);
-        if (!presentationData) {
-          setError(`Presentation not found: ${presentationId}`);
-          return;
-        }
-        
-        setPresentation(presentationData);
-        
-        // Load theme
-        const themeData = await loadTheme(presentationData.metadata.theme, false);
-        if (!themeData) {
-          setError(`Theme not found: ${presentationData.metadata.theme}`);
-          return;
-        }
-        
-        setTheme(themeData);
-        
-        // Load theme CSS
-        const cssLink = document.getElementById('presentation-theme-css') as HTMLLinkElement;
-        const cssPath = `${themeData.basePath}/${themeData.cssFile}`;
-        if (cssLink) {
-          cssLink.href = cssPath;
-        } else {
-          const newCssLink = document.createElement('link');
-          newCssLink.id = 'presentation-theme-css';
-          newCssLink.rel = 'stylesheet';
-          newCssLink.href = cssPath;
-          document.head.appendChild(newCssLink);
-        }
-        
-      } catch (err) {
-        setError(err instanceof Error ? err.message : 'Failed to load presentation');
-      } finally {
-        setLoading(false);
-      }
-    };
-
-    loadPresentationAndTheme();
-    
-    // Cleanup theme CSS on unmount
-    return () => {
-      const cssLink = document.getElementById('presentation-theme-css');
-      if (cssLink) {
-        cssLink.remove();
-      }
-    };
-  }, [presentationId]);
-  
-  const exitPresentationMode = () => {
-    // Navigate back to the previous page in history
-    navigate(-1);
-  };
-  
   const renderSlideContent = (slide: SlideContent): string => {
     if (!theme) return '';
     
@@ -174,7 +65,16 @@ export const PresentationMode: React.FC = () => {
     // Replace template variables with slide content
     Object.entries(slide.content).forEach(([slotId, content]) => {
       const regex = new RegExp(`\\{\\{${slotId}\\}\\}`, 'g');
-      renderedTemplate = renderedTemplate.replace(regex, content);
+      
+      // Find the corresponding slot to determine if it should be processed as markdown
+      const slot = layout.slots.find(s => s.id === slotId);
+      const shouldProcessAsMarkdown = slot?.type === 'markdown' || 
+        (slot?.type === 'text' && isMarkdownContent(content));
+      
+      const processedContent = shouldProcessAsMarkdown ? 
+        renderSlideMarkdown(content, slot?.type) : content;
+      
+      renderedTemplate = renderedTemplate.replace(regex, processedContent);
     });
     
     // Handle conditional blocks and clean up remaining variables
@@ -197,7 +97,7 @@ export const PresentationMode: React.FC = () => {
         <div className="error-content">
           <h2>Error Loading Presentation</h2>
           <p>{error}</p>
-          <button onClick={exitPresentationMode} className="exit-button">
+          <button onClick={() => navigate(-1)} className="exit-button">
             Exit Presentation Mode
           </button>
         </div>
@@ -210,7 +110,7 @@ export const PresentationMode: React.FC = () => {
       <div className="presentation-mode error">
         <div className="error-content">
           <h2>Presentation Not Found</h2>
-          <button onClick={exitPresentationMode} className="exit-button">
+          <button onClick={() => navigate(-1)} className="exit-button">
             Exit Presentation Mode
           </button>
         </div>
@@ -224,7 +124,7 @@ export const PresentationMode: React.FC = () => {
         <div className="error-content">
           <h2>No Slides Available</h2>
           <p>This presentation is empty.</p>
-          <button onClick={exitPresentationMode} className="exit-button">
+          <button onClick={() => navigate(-1)} className="exit-button">
             Exit Presentation Mode
           </button>
         </div>
diff --git a/src/components/presentations/hooks/useKeyboardNavigation.ts b/src/components/presentations/hooks/useKeyboardNavigation.ts
new file mode 100644
index 0000000..a520d8f
--- /dev/null
+++ b/src/components/presentations/hooks/useKeyboardNavigation.ts
@@ -0,0 +1,71 @@
+import { useCallback, useEffect } from 'react';
+import {useNavigate} from "react-router-dom";
+
+interface KeyboardNavigationOptions {
+    totalSlides: number;
+    currentSlideIndex: number;
+    onNavigate: (slideIndex: number) => void;
+    onExit?: () => void;
+}
+
+
+export function useKeyboardNavigation({
+                                          totalSlides,
+                                          currentSlideIndex,
+                                          onNavigate
+                                      }: KeyboardNavigationOptions) {
+
+    // Keyboard navigation handler
+    const navigate = useNavigate();
+    const handleKeyPress = useCallback((event: KeyboardEvent) => {
+        if (totalSlides === 0) return;
+
+        switch (event.key) {
+            case 'ArrowRight':
+            case 'Space':
+            case 'Enter':
+                event.preventDefault();
+                onNavigate(Math.min(currentSlideIndex + 1, totalSlides - 1));
+                break;
+
+            case 'ArrowLeft':
+                event.preventDefault();
+                onNavigate(Math.max(currentSlideIndex - 1, 0));
+                break;
+
+            case 'Home':
+                event.preventDefault();
+                onNavigate(0);
+                break;
+
+            case 'End':
+                event.preventDefault();
+                onNavigate(totalSlides - 1);
+                break;
+
+            case 'Escape':
+                event.preventDefault();
+                navigate(-1);
+                break;
+
+            default:
+                // Handle number keys for direct slide navigation
+                const slideNum = parseInt(event.key);
+                if (slideNum >= 1 && slideNum <= totalSlides) {
+                    event.preventDefault();
+                    onNavigate(slideNum - 1);
+                }
+                break;
+        }
+    }, [totalSlides, currentSlideIndex, onNavigate]);
+
+    // Set up keyboard listeners
+    useEffect(() => {
+        document.addEventListener('keydown', handleKeyPress);
+        return () => {
+            document.removeEventListener('keydown', handleKeyPress);
+        };
+    }, [handleKeyPress]);
+
+    return { handleKeyPress };
+}
diff --git a/src/components/presentations/hooks/usePresentationLoader.ts b/src/components/presentations/hooks/usePresentationLoader.ts
new file mode 100644
index 0000000..766a224
--- /dev/null
+++ b/src/components/presentations/hooks/usePresentationLoader.ts
@@ -0,0 +1,75 @@
+import { useState, useEffect } from 'react';
+import type {Presentation} from "../../../types/presentation.ts";
+import {getPresentationById} from "../../../utils/presentationStorage.ts";
+import type {Theme} from "../../../types/theme.ts";
+import {loadTheme} from "../../../utils/themeLoader.ts";
+
+export function usePresentationLoader(presentationId: string | undefined) {
+    const [presentation, setPresentation] = useState<Presentation | null>(null);
+    const [theme, setTheme] = useState<Theme | null>(null);
+
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState<string | null>(null);
+
+    useEffect(() => {
+        const loadPresentationAndTheme = async () => {
+            if (!presentationId) {
+                setError('No presentation ID provided');
+                setLoading(false);
+                return;
+            }
+
+            try {
+                setLoading(true);
+
+                // Load presentation
+                const presentationData = await getPresentationById(presentationId);
+                if (!presentationData) {
+                    setError(`Presentation not found: ${presentationId}`);
+                    return;
+                }
+
+                setPresentation(presentationData);
+
+                // Load theme
+                const themeData = await loadTheme(presentationData.metadata.theme, false);
+                if (!themeData) {
+                    setError(`Theme not found: ${presentationData.metadata.theme}`);
+                    return;
+                }
+
+                setTheme(themeData);
+
+                // Load theme CSS
+                const cssLink = document.getElementById('presentation-theme-css') as HTMLLinkElement;
+                const cssPath = `${themeData.basePath}/${themeData.cssFile}`;
+                if (cssLink) {
+                    cssLink.href = cssPath;
+                } else {
+                    const newCssLink = document.createElement('link');
+                    newCssLink.id = 'presentation-theme-css';
+                    newCssLink.rel = 'stylesheet';
+                    newCssLink.href = cssPath;
+                    document.head.appendChild(newCssLink);
+                }
+
+            } catch (err) {
+                setError(err instanceof Error ? err.message : 'Failed to load presentation');
+            } finally {
+                setLoading(false);
+            }
+        };
+
+        loadPresentationAndTheme();
+
+        // Cleanup theme CSS on unmount
+        return () => {
+            const cssLink = document.getElementById('presentation-theme-css');
+            if (cssLink) {
+                cssLink.remove();
+            }
+        };
+    }, [presentationId]);
+
+    return { presentation, theme, loading, error };
+}
diff --git a/src/components/slide-editor/ContentEditor.tsx b/src/components/slide-editor/ContentEditor.tsx
index 416b4b3..dc26602 100644
--- a/src/components/slide-editor/ContentEditor.tsx
+++ b/src/components/slide-editor/ContentEditor.tsx
@@ -45,15 +45,17 @@ export const ContentEditor: React.FC<ContentEditorProps> = ({
       );
     }
     
-    if (slot.type === 'text' && slot.id.includes('content')) {
+    if (slot.type === 'markdown' || (slot.type === 'text' && slot.id.includes('content'))) {
       return (
         <textarea
           id={slot.id}
           value={slideContent[slot.id] || ''}
           onChange={(e) => onSlotContentChange(slot.id, e.target.value)}
-          placeholder={slot.placeholder || `Enter ${slot.id}`}
-          className="field-textarea"
-          rows={4}
+          placeholder={slot.type === 'markdown' 
+            ? slot.placeholder || 'Enter markdown content (e.g., **bold**, *italic*, - list items)' 
+            : slot.placeholder || `Enter ${slot.id}`}
+          className={`field-textarea ${slot.type === 'markdown' ? 'markdown-field' : ''}`}
+          rows={slot.type === 'markdown' ? 6 : 4}
         />
       );
     }
diff --git a/src/components/slide-editor/utils.ts b/src/components/slide-editor/utils.ts
index 5966de1..c751eae 100644
--- a/src/components/slide-editor/utils.ts
+++ b/src/components/slide-editor/utils.ts
@@ -1,4 +1,5 @@
 import type { SlideLayout } from '../../types/theme.ts';
+import { renderSlideMarkdown, isMarkdownContent } from '../../utils/markdownProcessor.ts';
 
 // Helper function to render template with actual content
 export const renderTemplateWithContent = (layout: SlideLayout, content: Record<string, string>): string => {
@@ -7,7 +8,16 @@ export const renderTemplateWithContent = (layout: SlideLayout, content: Record<s
   // Replace content placeholders
   Object.entries(content).forEach(([slotId, value]) => {
     const placeholder = new RegExp(`\\{\\{${slotId}\\}\\}`, 'g');
-    rendered = rendered.replace(placeholder, value || '');
+    
+    // Find the corresponding slot to determine if it should be processed as markdown
+    const slot = layout.slots.find(s => s.id === slotId);
+    const shouldProcessAsMarkdown = slot?.type === 'markdown' || 
+      (slot?.type === 'text' && isMarkdownContent(value || ''));
+    
+    const processedValue = shouldProcessAsMarkdown ? 
+      renderSlideMarkdown(value || '', slot?.type) : (value || '');
+    
+    rendered = rendered.replace(placeholder, processedValue);
   });
   
   // Clean up any remaining placeholders
diff --git a/src/utils/markdownProcessor.ts b/src/utils/markdownProcessor.ts
new file mode 100644
index 0000000..a014c70
--- /dev/null
+++ b/src/utils/markdownProcessor.ts
@@ -0,0 +1,194 @@
+import { marked } from 'marked';
+import DOMPurify from 'dompurify';
+
+/**
+ * Secure markdown processor for slide content
+ * Uses marked for parsing and DOMPurify for sanitization
+ */
+
+// Configure marked for slide-safe markdown
+marked.setOptions({
+  // Disable HTML rendering for security
+  sanitize: false, // We'll handle sanitization with DOMPurify
+  gfm: true, // GitHub Flavored Markdown
+  breaks: true, // Convert line breaks to <br>
+  headerIds: false, // Don't generate header IDs
+  mangle: false, // Don't mangle email addresses
+});
+
+/**
+ * DOMPurify configuration for slides
+ * Allows safe HTML elements commonly used in presentations
+ */
+const PURIFY_CONFIG = {
+  ALLOWED_TAGS: [
+    // Text formatting
+    'p', 'br', 'strong', 'em', 'b', 'i', 'u', 's', 'mark', 'small', 'sub', 'sup',
+    // Headers
+    'h1', 'h2', 'h3', 'h4', 'h5', 'h6',
+    // Lists
+    'ul', 'ol', 'li',
+    // Links (without javascript: or data: schemes)
+    'a',
+    // Code
+    'code', 'pre',
+    // Tables
+    'table', 'thead', 'tbody', 'tr', 'th', 'td',
+    // Quotes
+    'blockquote', 'cite',
+    // Semantic elements
+    'span', 'div',
+  ],
+  ALLOWED_ATTR: [
+    'href', 'title', 'class', 'id', 'data-*',
+    // Table attributes
+    'colspan', 'rowspan',
+    // Link attributes (but we'll filter URLs)
+    'target', 'rel'
+  ],
+  ALLOWED_URI_REGEXP: /^(?:(?:(?:f|ht)tps?|mailto|tel|callto|sms|cid|xmpp):|[^a-z]|[a-z+.\-]+(?:[^a-z+.\-:]|$))/i,
+  FORBID_TAGS: ['script', 'style', 'iframe', 'object', 'embed', 'applet', 'form', 'input', 'button'],
+  FORBID_ATTR: ['onclick', 'onload', 'onerror', 'onmouseover', 'onfocus', 'onblur', 'onchange', 'onsubmit'],
+  KEEP_CONTENT: true,
+  RETURN_DOM: false,
+  RETURN_DOM_FRAGMENT: false,
+  SANITIZE_DOM: true,
+};
+
+/**
+ * Safely renders markdown to HTML
+ * @param markdown - The markdown content to render
+ * @param options - Additional rendering options
+ * @returns Sanitized HTML string
+ */
+export const renderMarkdown = (
+  markdown: string, 
+  options: {
+    allowImages?: boolean;
+    maxHeadingLevel?: number;
+    className?: string;
+  } = {}
+): string => {
+  if (!markdown || typeof markdown !== 'string') {
+    return '';
+  }
+
+  try {
+    // Parse markdown to HTML
+    let html = marked.parse(markdown) as string;
+
+    // Apply heading level restrictions
+    if (options.maxHeadingLevel && options.maxHeadingLevel < 6) {
+      for (let level = options.maxHeadingLevel + 1; level <= 6; level++) {
+        const regex = new RegExp(`<h${level}([^>]*)>`, 'g');
+        html = html.replace(regex, `<h${options.maxHeadingLevel}$1>`);
+        html = html.replace(new RegExp(`</h${level}>`, 'g'), `</h${options.maxHeadingLevel}>`);
+      }
+    }
+
+    // Configure DOMPurify for this render
+    const config = { ...PURIFY_CONFIG };
+    
+    // Conditionally allow images
+    if (options.allowImages) {
+      config.ALLOWED_TAGS = [...config.ALLOWED_TAGS, 'img'];
+      config.ALLOWED_ATTR = [...config.ALLOWED_ATTR, 'src', 'alt', 'width', 'height'];
+    }
+
+    // Sanitize the HTML
+    const sanitized = DOMPurify.sanitize(html, config);
+
+    // Wrap in container if className provided
+    if (options.className) {
+      return `<div class="${options.className}">${sanitized}</div>`;
+    }
+
+    return sanitized;
+  } catch (error) {
+    console.warn('Markdown rendering failed:', error);
+    // Return escaped plain text as fallback
+    return DOMPurify.sanitize(markdown.replace(/[<>&"']/g, (char) => {
+      const escapeMap: Record<string, string> = {
+        '<': '&lt;',
+        '>': '&gt;',
+        '&': '&amp;',
+        '"': '&quot;',
+        "'": '&#x27;'
+      };
+      return escapeMap[char];
+    }));
+  }
+};
+
+
+/**
+ * Renders markdown specifically for slide content
+ * Applies slide-appropriate restrictions and styling
+ */
+export const renderSlideMarkdown = (markdown: string, slotType?: string): string => {
+  const options = {
+    allowImages: slotType === 'image' || slotType === 'content',
+    maxHeadingLevel: 3, // Limit to h1, h2, h3 for slides
+    className: `markdown-content slot-${slotType || 'text'}`
+  };
+
+  return renderMarkdown(markdown, options);
+};
+
+/**
+ * Checks if content appears to be markdown
+ * Used to determine whether to process content as markdown
+ */
+export const isMarkdownContent = (content: string): boolean => {
+  if (!content || typeof content !== 'string') {
+    return false;
+  }
+
+  // Common markdown patterns
+  const markdownPatterns = [
+    /^#{1,6}\s/m, // Headers
+    /\*\*.*\*\*/, // Bold
+    /\*.*\*/, // Italic  
+    /^\s*[-*+]\s/m, // Unordered lists
+    /^\s*\d+\.\s/m, // Ordered lists
+    /```/, // Code blocks
+    /`[^`]+`/, // Inline code
+    /\[.*\]\(.*\)/, // Links
+    /!\[.*\]\(.*\)/, // Images
+    /^>\s/m, // Blockquotes
+  ];
+
+  return markdownPatterns.some(pattern => pattern.test(content));
+};
+
+/**
+ * Sample markdown content for testing and previews
+ */
+export const SAMPLE_MARKDOWN_CONTENT = {
+  title: '# Quarterly **Sales** Review',
+  subtitle: '## Q4 Results and *Future Outlook*',
+  content: `
+## Key Highlights
+
+- **Revenue Growth**: 25% increase over last quarter
+- **Customer Satisfaction**: 94% positive feedback
+- **Market Expansion**: 3 new regions launched
+
+### Action Items
+
+1. Finalize Q1 budget allocation
+2. Launch customer feedback program
+3. Prepare expansion strategy
+
+> "Our team's dedication to excellence continues to drive exceptional results."
+
+[View Full Report](https://example.com/report)
+  `.trim(),
+  list: `
+- Increase market share by **15%**
+- Launch *3 new products*
+- Expand to **5 new regions**
+- Improve customer satisfaction
+- \`Optimize\` operational efficiency
+  `.trim()
+};
\ No newline at end of file
diff --git a/src/utils/templateRenderer.ts b/src/utils/templateRenderer.ts
index 0c50bc8..fe83afe 100644
--- a/src/utils/templateRenderer.ts
+++ b/src/utils/templateRenderer.ts
@@ -1,4 +1,5 @@
 import type { SlideLayout, SlotConfig } from '../types/theme.ts';
+import { renderSlideMarkdown, isMarkdownContent, SAMPLE_MARKDOWN_CONTENT } from './markdownProcessor.ts';
 
 /**
  * Creates a simple SVG pattern for image slots
@@ -59,6 +60,13 @@ const SAMPLE_CONTENT = {
     '• Increase market share by 15%\n• Launch 3 new products\n• Expand to 5 new regions',
     '• Improve customer satisfaction\n• Reduce operational costs\n• Enhance digital capabilities',
     '• Strengthen brand recognition\n• Optimize supply chain\n• Invest in talent development'
+  ],
+  markdown: [
+    SAMPLE_MARKDOWN_CONTENT.content,
+    SAMPLE_MARKDOWN_CONTENT.list,
+    SAMPLE_MARKDOWN_CONTENT.codeExample,
+    SAMPLE_MARKDOWN_CONTENT.diagramExample,
+    '## Key Points\n\n- **Important**: Focus on *customer needs*\n- Use `data-driven` decisions\n- > Success comes from teamwork'
   ]
 };
 
@@ -118,6 +126,11 @@ export const generateSampleDataForSlot = (slot: SlotConfig): string => {
     case 'table':
       return `${slotDisplayName} Col 1 | ${slotDisplayName} Col 2\n--- | ---\nRow 1 Data | Row 1 Data\nRow 2 Data | Row 2 Data`;
       
+    case 'markdown': {
+      const markdownSamples = SAMPLE_CONTENT.markdown;
+      return markdownSamples[Math.floor(Math.random() * markdownSamples.length)];
+    }
+      
     default:
       return slotDisplayName;
   }
@@ -163,7 +176,16 @@ export const renderTemplateWithSampleData = (
   // Handle Handlebars-style templates: {{variable}}
   Object.entries(sampleData).forEach(([key, value]) => {
     const simpleRegex = new RegExp(`\\{\\{${key}\\}\\}`, 'g');
-    rendered = rendered.replace(simpleRegex, value);
+    
+    // Find the corresponding slot to determine if it should be processed as markdown
+    const slot = layout.slots.find(s => s.id === key);
+    const shouldProcessAsMarkdown = slot?.type === 'markdown' || 
+      (slot?.type === 'text' && isMarkdownContent(value));
+    
+    const processedValue = shouldProcessAsMarkdown ? 
+      renderSlideMarkdown(value, slot?.type) : value;
+    
+    rendered = rendered.replace(simpleRegex, processedValue);
   });
   
   // Handle conditional blocks: {{#variable}}...{{/variable}}