basic markdown support
This commit is contained in:
parent
191887b771
commit
7f3daf09f3
4 changed files with 71 additions and 42 deletions
|
@ -9,7 +9,7 @@ echo "download js bundle files"
|
|||
|
||||
# Note for contributors: Always pin to a specific version "maj.min.patch" to avoid breaking the CI
|
||||
|
||||
curl -L https://cdn.tailwindcss.com/3.4.14 > $PUBLIC/deps_tailwindcss.js
|
||||
curl -L https://cdn.tailwindcss.com/3.4.14?plugins=forms,typography > $PUBLIC/deps_tailwindcss.js
|
||||
echo >> $PUBLIC/deps_tailwindcss.js # add newline
|
||||
|
||||
curl -L https://cdnjs.cloudflare.com/ajax/libs/daisyui/4.12.14/styled.min.css > $PUBLIC/deps_daisyui.min.css
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -5,9 +5,19 @@
|
|||
<meta name="color-scheme" content="light dark">
|
||||
<title>🦙 llama.cpp - chat</title>
|
||||
|
||||
<!-- TODO: embed dependencies into cpp -->
|
||||
<!-- Note: dependencies can de updated using ./deps.sh script -->
|
||||
<link href="./deps_daisyui.min.css" rel="stylesheet" type="text/css" />
|
||||
<script src="./deps_tailwindcss.js"></script>
|
||||
<script>
|
||||
tailwind.config = {};
|
||||
</script>
|
||||
<style type="text/tailwindcss">
|
||||
.markdown {
|
||||
h1, h2, h3, h4, h5, h6, ul, ol, li { all: revert; }
|
||||
pre { @apply whitespace-pre-wrap; }
|
||||
/* TODO: fix table */
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
@ -53,18 +63,18 @@
|
|||
'chat-end': msg.role === 'user',
|
||||
}">
|
||||
<div :class="{
|
||||
'chat-bubble': true,
|
||||
'chat-bubble markdown': true,
|
||||
'chat-bubble-primary': msg.role === 'user',
|
||||
}">
|
||||
<p v-for="line in msg.content.split('\n')">{{ line }}</p>
|
||||
<vue-markdown :source="msg.content" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- pending assistant message -->
|
||||
<div id="pending-msg" class="chat chat-start">
|
||||
<div v-if="pendingMsg" class="chat-bubble">
|
||||
<div v-if="pendingMsg" class="chat-bubble markdown">
|
||||
<span v-if="!pendingMsg.content" class="loading loading-dots loading-md"></span>
|
||||
<p v-else v-for="line in pendingMsg.content.split('\n')">{{ line }}</p>
|
||||
<vue-markdown v-else :source="pendingMsg.content" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -84,13 +94,30 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<script src="./deps_markdown-it.js"></script>
|
||||
<script type="module">
|
||||
import { createApp } from './deps_vue.esm-browser.js';
|
||||
import { createApp, defineComponent, shallowRef, computed, h } from './deps_vue.esm-browser.js';
|
||||
import { llama } from './completion.js';
|
||||
|
||||
const BASE_URL = (new URL('.', document.baseURI).href).toString();
|
||||
|
||||
// markdown support
|
||||
const VueMarkdown = defineComponent(
|
||||
(props) => {
|
||||
const md = shallowRef(new markdownit(props.options ?? {}));
|
||||
for (const plugin of props.plugins ?? []) {
|
||||
md.value.use(plugin);
|
||||
}
|
||||
const content = computed(() => md.value.render(props.source));
|
||||
return () => h("div", { innerHTML: content.value });
|
||||
},
|
||||
{ props: ["source", "options", "plugins"] }
|
||||
);
|
||||
|
||||
createApp({
|
||||
components: {
|
||||
VueMarkdown,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
messages: [],
|
||||
|
|
|
@ -3125,7 +3125,7 @@ int main(int argc, char ** argv) {
|
|||
svr->Get("/", handle_static_file(index_html, index_html_len, "text/html; charset=utf-8"));
|
||||
svr->Get("/completion.js", handle_static_file(completion_js, completion_js_len, "text/javascript; charset=utf-8"));
|
||||
svr->Get("/deps_daisyui.min.css", handle_static_file(deps_daisyui_min_css, deps_daisyui_min_css_len, "text/css; charset=utf-8"));
|
||||
svr->Get("/deps_markdown-it.js", handle_static_file(deps_markdown_it_js, deps_daisyui_min_css_len, "text/javascript; charset=utf-8"));
|
||||
svr->Get("/deps_markdown-it.js", handle_static_file(deps_markdown_it_js, deps_markdown_it_js_len, "text/javascript; charset=utf-8"));
|
||||
svr->Get("/deps_tailwindcss.js", handle_static_file(deps_tailwindcss_js, deps_tailwindcss_js_len, "text/javascript; charset=utf-8"));
|
||||
svr->Get("/deps_vue.esm-browser.js", handle_static_file(deps_vue_esm_browser_js, deps_vue_esm_browser_js_len, "text/javascript; charset=utf-8"));
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue