Files
risuai/src/lib/Playground/PlaygroundJinja.svelte
2024-10-23 02:31:37 +09:00

43 lines
1.2 KiB
Svelte

<script lang="ts">
import { language } from "src/lang";
import { Template } from '@huggingface/jinja';
import TextAreaInput from "../UI/GUI/TextAreaInput.svelte";
let input = $state("");
let json = $state(JSON.stringify({
"messages": [{
"role": "user",
"content": "Hello, I'm a user!"
}, {
"role": "assistant",
"content": "Hello, I'm a bot!"
}],
"eos_token": "",
"bos_token": ""
}, null, 4))
let output = $state("");
const onInput = () => {
try {
const template = new Template(input);
const values = JSON.parse(json);
output = template.render(values);
} catch (e) {
//log error stack of e
console.error(e.stack);
output = `Error: ${e}`
}
}
</script>
<h2 class="text-4xl text-textcolor my-6 font-black relative">Jinja</h2>
<span class="text-textcolor text-lg">Jinja</span>
<TextAreaInput onInput={onInput} bind:value={input} />
<span class="text-textcolor text-lg">Data (JSON)</span>
<TextAreaInput onInput={onInput} bind:value={json} />
<span class="text-textcolor text-lg">Result</span>
<TextAreaInput value={output} />