Spaces:
Sleeping
Sleeping
File size: 2,874 Bytes
8000347 5213b80 877b369 38434c2 8000347 38434c2 6bcbb4b 877b369 bdc9315 8000347 bdc9315 8000347 e1cf22b 8000347 e1cf22b 8000347 e1cf22b 8000347 e1cf22b 6fdab00 bdc9315 e1cf22b bdc9315 877b369 8000347 bdc9315 8000347 bdc9315 8000347 967ff1b 877b369 8000347 e1cf22b |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 |
<script lang="ts">
import { type ChatCompletionInputMessage } from '@huggingface/tasks';
import hljs from 'highlight.js/lib/core';
import javascript from 'highlight.js/lib/languages/javascript';
import python from 'highlight.js/lib/languages/python';
import bash from 'highlight.js/lib/languages/bash';
export let model: string;
export let streaming: Boolean;
export let temperature: number;
export let maxTokens: number;
export let messages: ChatCompletionInputMessage[];
type Langauge = 'javascript' | 'python' | 'bash';
hljs.registerLanguage('javascript', javascript);
hljs.registerLanguage('python', python);
hljs.registerLanguage('bash', bash);
function highlight(code: string, language: Langauge) {
return hljs.highlight(code, { language }).value;
}
const npmSnippet = `import { HfInference } from '@huggingface/inference'
const hf = new HfInference('your access token')`;
$: nonStreamingSnippet = `await hf.chatCompletion({
model: "${model}",
messages: [
{ role: "user", content: "Complete the this sentence with words one plus one is equal " }
],
max_tokens: ${maxTokens},
temperature: ${temperature},
seed: 0,
});`;
$: streamingSnippet = `let out = "";
for await (const chunk of hf.chatCompletionStream({
model: "${model}",
messages: [
{ role: "user", content: "Complete the equation 1+1= ,just the answer" },
],
max_tokens: ${maxTokens},
temperature: ${temperature},
seed: 0,
})) {
if (chunk.choices && chunk.choices.length > 0) {
out += chunk.choices[0].delta.content;
}
}`;
</script>
<div class="px-2 pt-2">
<div
class="border-b border-gray-200 text-center text-sm font-medium text-gray-500 dark:border-gray-700 dark:text-gray-400"
>
<ul class="-mb-px flex flex-wrap">
<li>
<a
href="#"
class="active inline-block rounded-t-lg border-b-2 border-black p-4 text-black dark:border-blue-500 dark:text-blue-500"
aria-current="page">Huggingface.js</a
>
</li>
<li>
<a
href="#"
class="inline-block rounded-t-lg border-b-2 border-transparent p-4 hover:border-gray-300 hover:text-gray-600 dark:hover:text-gray-300"
>Curl</a
>
</li>
</ul>
</div>
<div class="px-4 pb-4 pt-6">
<h2 class="font-semibold">Install and instantiate</h2>
</div>
<pre
class="overflow-x-auto rounded-lg border border-gray-200/80 bg-white px-4 py-6 text-sm shadow-sm dark:border-gray-800 dark:bg-gray-800/50">{@html highlight(
npmSnippet,
'javascript'
)}</pre>
<div class="px-4 pb-4 pt-6">
<h2 class="font-semibold">{streaming ? 'Streaming API' : 'Non-Streaming API'}</h2>
</div>
<pre
class="overflow-x-auto rounded-lg border border-gray-200/80 bg-white px-4 py-6 text-sm shadow-sm dark:border-gray-800 dark:bg-gray-800/50">{@html highlight(
streaming ? streamingSnippet : nonStreamingSnippet,
'javascript'
)}
</pre>
</div>
|