mincomk/risuai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[ref] input to components

Browse Source
This commit is contained in:
kwaroran
2023-07-18 18:18:14 +09:00
parent 26421fde03
commit c0622c4f0d
24 changed files with 291 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/lib/Setting/Pages/AdvancedSettings.svelte
View File

@@ -4,25 +4,27 @@
import { DataBase } from "src/ts/storage/database";
import { alertMd } from "src/ts/alert";
import { getRequestLog, isTauri } from "src/ts/storage/globalApi";
import NumberInput from "src/lib/UI/GUI/NumberInput.svelte";
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
</script>
<h2 class="text-2xl font-bold mt-2">{language.advancedSettings}</h2>
<span class="text-draculared text-xs mb-2">{language.advancedSettingsWarn}</span>
<span class="text-neutral-200 mt-4 mb-2">{language.loreBookDepth}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="20" bind:value={$DataBase.loreBookDepth}>
<NumberInput marginBottom={true} size={"sm"} min={0} max={20} bind:value={$DataBase.loreBookDepth}/>
<span class="text-neutral-200">{language.loreBookToken}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="4096" bind:value={$DataBase.loreBookToken}>
<NumberInput marginBottom={true} size={"sm"} min={0} max={4096} bind:value={$DataBase.loreBookToken}/>
<span class="text-neutral-200">{language.additionalPrompt}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm"bind:value={$DataBase.additionalPrompt}>
<TextInput marginBottom={true} size={"sm"} bind:value={$DataBase.additionalPrompt}/>
<span class="text-neutral-200">{language.descriptionPrefix}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm"bind:value={$DataBase.descriptionPrefix}>
<TextInput marginBottom={true} size={"sm"} bind:value={$DataBase.descriptionPrefix}/>
<span class="text-neutral-200">{language.emotionPrompt}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm"bind:value={$DataBase.emotionPrompt2} placeholder="Leave it blank to use default">
<TextInput marginBottom={true} size={"sm"} bind:value={$DataBase.emotionPrompt2} placeholder="Leave it blank to use default"/>
<span class="text-neutral-200">{language.requestretrys}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="20" bind:value={$DataBase.requestRetrys}>
<NumberInput marginBottom={true} size={"sm"} min={0} max={20} bind:value={$DataBase.requestRetrys}/>
<span class="text-neutral-200">Request Lib</span>
<select class="bg-transparent input-text text-gray-200 appearance-none text-sm" bind:value={$DataBase.requester}>
@@ -45,15 +47,6 @@
<div class="flex items-center mt-4">
<Check bind:check={$DataBase.usePlainFetch} name="Force Plain Fetch"/>
</div>
<div class="flex items-center mt-4">
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" placeholder="experimental flags" on:input={(e) => {
const v = e.currentTarget.value
if(v.endsWith("_flag!")){
localStorage.setItem(v, "able")
e.currentTarget.value = ""
}
}}>
</div>
<button
on:click={async () => {
alertMd(getRequestLog())

122
src/lib/Setting/Pages/BotSettings.svelte
View File

@@ -4,13 +4,16 @@
import Help from "src/lib/Others/Help.svelte";
import { DataBase } from "src/ts/storage/database";
import { customProviderStore, getCurrentPluginMax } from "src/ts/plugins/plugins";
import { isTauri } from "src/ts/storage/globalApi";
import { getModelMaxContext, isTauri } from "src/ts/storage/globalApi";
import { tokenize } from "src/ts/tokenizer";
import ModelList from "src/lib/UI/ModelList.svelte";
import DropList from "src/lib/SideBars/DropList.svelte";
import { PlusIcon, TrashIcon } from "lucide-svelte";
import { onDestroy } from "svelte";
import { recommendedPresetExist, setRecommended } from "src/ts/process/templates/getRecomended";
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
import NumberInput from "src/lib/UI/GUI/NumberInput.svelte";
import SliderInput from "src/lib/UI/GUI/SliderInput.svelte";
let tokens = {
mainPrompt: 0,
jailbreak: 0,
@@ -99,22 +102,22 @@
{/if}
{#if $DataBase.aiModel === 'palm2' || $DataBase.subModel === 'palm2'}
<span class="text-neutral-200">Palm2 {language.apiKey}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" placeholder="..." bind:value={$DataBase.palmAPI}>
<TextInput marginBottom={true} size={"sm"} placeholder="..." bind:value={$DataBase.palmAPI}/>
{/if}
{#if $DataBase.aiModel.startsWith('novellist') || $DataBase.subModel.startsWith('novellist')}
<span class="text-neutral-200">NovelList {language.apiKey}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" placeholder="..." bind:value={$DataBase.novellistAPI}>
<TextInput marginBottom={true} size={"sm"} placeholder="..." bind:value={$DataBase.novellistAPI}/>
{/if}
{#if $DataBase.aiModel.startsWith('claude') || $DataBase.subModel.startsWith('claude')}
<span class="text-neutral-200">Claude {language.apiKey}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" placeholder="..." bind:value={$DataBase.claudeAPIKey}>
<TextInput marginBottom={true} size={"sm"} placeholder="..." bind:value={$DataBase.claudeAPIKey}/>
{/if}
{#if $DataBase.aiModel === 'reverse_proxy' || $DataBase.subModel === 'reverse_proxy'}
<span class="text-neutral-200 mt-2">{language.forceReplaceUrl} URL <Help key="forceUrl"/></span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected text-sm"bind:value={$DataBase.forceReplaceUrl} placeholder="https//...">
<TextInput marginBottom={false} size={"sm"} bind:value={$DataBase.forceReplaceUrl} placeholder="https//..." />
<span class="text-neutral-200 mt-4"> {language.proxyAPIKey}</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected text-sm" placeholder="leave it blank if it hasn't password" bind:value={$DataBase.proxyKey}>
<TextInput marginBottom={false} size={"sm"} placeholder="leave it blank if it hasn't password" bind:value={$DataBase.proxyKey} />
<span class="text-neutral-200 mt-4"> {language.proxyRequestModel}</span>
<select class="bg-transparent input-text mt-2 mb-4 text-gray-200 appearance-none text-sm" bind:value={$DataBase.proxyRequestModel}>
<option value="" class="bg-darkbg appearance-none">None</option>
@@ -129,7 +132,8 @@
{/if}
{#if $DataBase.aiModel === 'openrouter' || $DataBase.subModel === 'openrouter'}
<span class="text-neutral-200 mt-4">Openrouter Key</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected text-sm" placeholder="leave it blank if it hasn't password" bind:value={$DataBase.openrouterKey}>
<TextInput marginBottom={false} size={"sm"} bind:value={$DataBase.openrouterKey} />
<span class="text-neutral-200 mt-4">Openrouter Model</span>
<select class="bg-transparent input-text mt-2 mb-4 text-gray-200 appearance-none text-sm" bind:value={$DataBase.openrouterRequestModel}>
<option value="openai/gpt-3.5-turbo" class="bg-darkbg appearance-none">GPT 3.5</option>
@@ -146,7 +150,8 @@
{/if}
{#if $DataBase.aiModel.startsWith('gpt') || $DataBase.subModel.startsWith('gpt')}
<span class="text-neutral-200">OpenAI {language.apiKey} <Help key="oaiapikey"/></span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected text-sm" placeholder="sk-XXXXXXXXXXXXXXXXXXXX" bind:value={$DataBase.openAIKey}>
<TextInput marginBottom={false} size={"sm"} bind:value={$DataBase.openAIKey} placeholder="sk-XXXXXXXXXXXXXXXXXXXX"/>
{/if}
{#if $DataBase.aiModel.startsWith('gpt') || $DataBase.aiModel === 'reverse_proxy' || $DataBase.aiModel === 'openrouter'}
<div class="flex items-center mt-2 mb-4">
@@ -165,26 +170,26 @@
{/if}
{#if $DataBase.aiModel === "novelai" || $DataBase.subModel === "novelai"}
<span class="text-neutral-200">NovelAI Bearer Token</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected text-sm mb-2" bind:value={$DataBase.novelai.token}>
<TextInput marginBottom={true} bind:value={$DataBase.novelai.token}/>
{/if}
{#if $DataBase.aiModel === "kobold" || $DataBase.subModel === "kobold"}
<span class="text-neutral-200">Kobold URL</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected text-sm mb-2" bind:value={$DataBase.koboldURL}>
<TextInput marginBottom={true} bind:value={$DataBase.koboldURL} />
{/if}
{#if $DataBase.aiModel.startsWith("horde") || $DataBase.subModel.startsWith("horde") }
<span class="text-neutral-200">Horde {language.apiKey}</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected text-sm mb-2" bind:value={$DataBase.hordeConfig.apiKey}>
<TextInput marginBottom={true} bind:value={$DataBase.hordeConfig.apiKey} />
{/if}
{#if $DataBase.aiModel === 'textgen_webui' || $DataBase.subModel === 'textgen_webui'}
<span class="text-neutral-200">TextGen {language.providerURL} <Help key="oogaboogaURL"/></span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected" placeholder="https://..." bind:value={$DataBase.textgenWebUIURL}>
<span class="text-draculared text-xs mb-2">You must use WebUI without agpl license or use unmodified version with agpl license to observe the contents of the agpl license.</span>
<span class="text-draculared text-xs mb-2">You must use textgen webui with --no-stream and without --cai-chat or --chat</span>
<span class="text-neutral-200 mt-2">TextGen {language.providerURL}</span>
<TextInput marginBottom={true} bind:value={$DataBase.textgenWebUIURL} placeholder="https://..."/>
<span class="text-draculared text-xs mb-2">You must use textgen webui with --api, and use api server's port (default is 5000)</span>
{#if !isTauri}
<span class="text-draculared text-xs mb-2">You are using web version. you must use ngrok or other tunnels to use your local webui.</span>
{/if}
@@ -201,53 +206,46 @@
<span class="text-gray-400 mb-6 text-sm">{tokens.globalNote} {language.tokens}</span>
<span class="text-neutral-200">{language.maxContextSize}</span>
{#if $DataBase.aiModel === 'gpt35'}
<input class="text-neutral-200 mb-4 text-sm p-2 bg-transparent input-text focus:bg-selected" type="number" min={0} max="4000" bind:value={$DataBase.maxContext}>
{:else if $DataBase.aiModel === 'gpt35_16k' || $DataBase.aiModel === 'gpt35_16k_0613'}
<input class="text-neutral-200 mb-4 text-sm p-2 bg-transparent input-text focus:bg-selected" type="number" min={0} max="16000" bind:value={$DataBase.maxContext}>
{:else if $DataBase.aiModel === 'gpt4'}
<input class="text-neutral-200 mb-4 text-sm p-2 bg-transparent input-text focus:bg-selected" type="number" min={0} max="8000" bind:value={$DataBase.maxContext}>
{:else if $DataBase.aiModel === 'custom'}
<input class="text-neutral-200 mb-4 text-sm p-2 bg-transparent input-text focus:bg-selected" type="number" min={0} max={getCurrentPluginMax($DataBase.currentPluginProvider)} bind:value={$DataBase.maxContext}>
{:else}
<input class="text-neutral-200 mb-4 text-sm p-2 bg-transparent input-text focus:bg-selected" type="number" min={0} bind:value={$DataBase.maxContext}>
{/if}
<NumberInput min={0} max={getModelMaxContext($DataBase.aiModel)} marginBottom={true} bind:value={$DataBase.maxContext}/>
<span class="text-neutral-200">{language.maxResponseSize}</span>
<NumberInput min={0} max={2048} marginBottom={true} bind:value={$DataBase.maxResponse}/>
<span class="text-neutral-200">{language.maxResponseSize}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="2048" bind:value={$DataBase.maxResponse}>
<span class="text-neutral-200">{language.temperature} <Help key="tempature"/></span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="200" bind:value={$DataBase.temperature}>
<SliderInput min={0} max={200} bind:value={$DataBase.temperature}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.temperature / 100).toFixed(2)}</span>
{#if $DataBase.aiModel === 'textgen_webui'}
<span class="text-neutral-200">Top K</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="2" step="0.01" bind:value={$DataBase.ooba.top_k}>
<SliderInput min={0} max={2} step={0.01} bind:value={$DataBase.ooba.top_k} />
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.top_k).toFixed(2)}</span>
<span class="text-neutral-200">Top P</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="2" step="0.01" bind:value={$DataBase.ooba.top_p}>
<SliderInput min={0} max={2} step={0.01} bind:value={$DataBase.ooba.top_p}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.top_p).toFixed(2)}</span>
<span class="text-neutral-200">Typical P</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="1" step="0.01" bind:value={$DataBase.ooba.typical_p}>
<SliderInput min={0} max={1} step={0.01} bind:value={$DataBase.ooba.typical_p}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.typical_p).toFixed(2)}</span>
<span class="text-neutral-200">Top A</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="1" step="0.01" bind:value={$DataBase.ooba.top_a}>
<SliderInput min={0} max={1} step={0.01} bind:value={$DataBase.ooba.top_a}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.top_a).toFixed(2)}</span>
<span class="text-neutral-200">Tail Free Sampling</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="1" step="0.01" bind:value={$DataBase.ooba.tfs}>
<SliderInput min={0} max={1} step={0.01} bind:value={$DataBase.ooba.tfs}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.tfs).toFixed(2)}</span>
<span class="text-neutral-200">Epsilon Cutoff</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="9" step="0.01" bind:value={$DataBase.ooba.epsilon_cutoff}>
<SliderInput min={0} max={9} step={0.01} bind:value={$DataBase.ooba.epsilon_cutoff}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.epsilon_cutoff).toFixed(2)}</span>
<span class="text-neutral-200">Eta Cutoff</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="20" step="0.01" bind:value={$DataBase.ooba.eta_cutoff}>
<SliderInput min={0} max={20} step={0.01} bind:value={$DataBase.ooba.eta_cutoff}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.eta_cutoff).toFixed(2)}</span>
<span class="text-neutral-200">Number of Beams</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="1" max="20" step="1" bind:value={$DataBase.ooba.num_beams}>
<SliderInput min={1} max={20} step={1} bind:value={$DataBase.ooba.num_beams}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.num_beams).toFixed(2)}</span>
<span class="text-neutral-200">Length Penalty</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min={-5} max="5" step="0.1" bind:value={$DataBase.ooba.length_penalty}>
<SliderInput min={-5} max={5} step={0.1} bind:value={$DataBase.ooba.length_penalty}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.length_penalty).toFixed(2)}</span>
<span class="text-neutral-200">Penalty Alpha</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min={0} max="5" step="0.05" bind:value={$DataBase.ooba.penalty_alpha}>
<SliderInput min={0} max={5} step={0.05} bind:value={$DataBase.ooba.penalty_alpha}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ooba.penalty_alpha).toFixed(2)}</span>
<div class="flex items-center mt-4">
<Check bind:check={$DataBase.ooba.do_sample} name={'Do Sample'}/>
@@ -267,41 +265,41 @@
{#if $DataBase.ooba.formating.custom}
<div class="flex flex-col p-3 bg-darkbg mt-4">
<span class="text-neutral-200">User Prefix</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected" bind:value={$DataBase.ooba.formating.userPrefix}>
<TextInput marginBottom bind:value={$DataBase.ooba.formating.userPrefix} />
<span class="text-neutral-200">Assistant Prefix</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected" bind:value={$DataBase.ooba.formating.assistantPrefix}>
<TextInput marginBottom bind:value={$DataBase.ooba.formating.assistantPrefix} />
<span class="text-neutral-200">Seperator</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected" bind:value={$DataBase.ooba.formating.seperator}>
<TextInput marginBottom bind:value={$DataBase.ooba.formating.seperator} />
</div>
{/if}
{:else if $DataBase.aiModel.startsWith('novellist')}
<span class="text-neutral-200">Top P</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="2" step="0.01" bind:value={$DataBase.ainconfig.top_p}>
<SliderInput min={0} max={2} step={0.01} bind:value={$DataBase.ainconfig.top_p}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ainconfig.top_p).toFixed(2)}</span>
<span class="text-neutral-200">Reputation Penalty</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="2" step="0.01" bind:value={$DataBase.ainconfig.rep_pen}>
<SliderInput min={0} max={2} step={0.01} bind:value={$DataBase.ainconfig.rep_pen}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ainconfig.rep_pen).toFixed(2)}</span>
<span class="text-neutral-200">Reputation Penalty Range</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="2048" step="1" bind:value={$DataBase.ainconfig.rep_pen_range}>
<SliderInput min={0} max={2048} step={1} bind:value={$DataBase.ainconfig.rep_pen_range}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ainconfig.rep_pen_range).toFixed(2)}</span>
<span class="text-neutral-200">Reputation Penalty Slope</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="10" step="0.1" bind:value={$DataBase.ainconfig.rep_pen_slope}>
<SliderInput min={0} max={10} step={0.1} bind:value={$DataBase.ainconfig.rep_pen_slope}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ainconfig.rep_pen_slope).toFixed(2)}</span>
<span class="text-neutral-200">Top K</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="1" max="500" step="1" bind:value={$DataBase.ainconfig.top_k}>
<SliderInput min={1} max={500} step={1} bind:value={$DataBase.ainconfig.top_k}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ainconfig.top_k).toFixed(2)}</span>
<span class="text-neutral-200">Top A</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="1" step="0.01" bind:value={$DataBase.ainconfig.top_a}>
<SliderInput min={0} max={1} step={0.01} bind:value={$DataBase.ainconfig.top_a}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ainconfig.top_a).toFixed(2)}</span>
<span class="text-neutral-200">Typical P</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="1" step="0.01" bind:value={$DataBase.ainconfig.typical_p}>
<SliderInput min={0} max={1} step={0.01} bind:value={$DataBase.ainconfig.typical_p}/>
<span class="text-gray-400 mb-6 text-sm">{($DataBase.ainconfig.typical_p).toFixed(2)}</span>
{:else}
<span class="text-neutral-200">{language.frequencyPenalty} <Help key="frequencyPenalty"/></span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="100" bind:value={$DataBase.frequencyPenalty}>
<SliderInput min={0} max={100} bind:value={$DataBase.frequencyPenalty} />
<span class="text-gray-400 mb-6 text-sm">{($DataBase.frequencyPenalty / 100).toFixed(2)}</span>
<span class="text-neutral-200">{language.presensePenalty} <Help key="presensePenalty"/></span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="0" max="100" bind:value={$DataBase.PresensePenalty}>
<SliderInput min={0} max={100} bind:value={$DataBase.PresensePenalty} />
<span class="text-gray-400 mb-6 text-sm">{($DataBase.PresensePenalty / 100).toFixed(2)}</span>
<span class="text-neutral-200 mt-2">{language.autoSuggest} <Help key="autoSuggest"/></span>
@@ -320,11 +318,13 @@
<tr>
<th class="font-medium w-1/2">Bias</th>
<th class="font-medium w-1/3">{language.value}</th>
<th class="font-medium cursor-pointer hover:text-green-500" on:click={() => {
<th>
<button class="font-medium cursor-pointer hover:text-green-500 w-full flex justify-center items-center" on:click={() => {
let bia = $DataBase.bias
bia.push(['', 0])
$DataBase.bias = bia
}}><PlusIcon /></th>
}}><PlusIcon /></button>
</th>
</tr>
{#if $DataBase.bias.length === 0}
<tr>
@@ -334,16 +334,18 @@
{#each $DataBase.bias as bias, i}
<tr>
<td class="font-medium truncate w-1/2">
<input class="text-neutral-200 mt-2 mb-4 p-2 bg-transparent input-text focus:bg-selected" bind:value={$DataBase.bias[i][0]} placeholder="string">
<TextInput marginBottom bind:value={$DataBase.bias[i][0]} fullwidth fullh/>
</td>
<td class="font-medium truncate w-1/3">
<input class="text-neutral-200 mt-2 mb-4 w-full p-2 bg-transparent input-text focus:bg-selected" bind:value={$DataBase.bias[i][1]} type="number" max="100" min="-100">
<NumberInput marginBottom bind:value={$DataBase.bias[i][1]} max={100} min={-100} fullwidth fullh/>
</td>
<td>
<button class="font-medium flex justify-center items-center h-full cursor-pointer hover:text-green-500 w-full" on:click={() => {
let bia = $DataBase.bias
bia.splice(i, 1)
$DataBase.bias = bia
}}><TrashIcon /></button>
</td>
<button class="font-medium flex justify-center items-center h-full cursor-pointer hover:text-green-500" on:click={() => {
let bia = $DataBase.bias
bia.splice(i, 1)
$DataBase.bias = bia
}}><TrashIcon /></button>
</tr>
{/each}
</table>

13
src/lib/Setting/Pages/DisplaySettings.svelte
View File

@@ -4,6 +4,7 @@
import { changeFullscreen, selectSingleFile, sleep } from "src/ts/util";
import Check from "src/lib/Others/Check.svelte";
import Help from "src/lib/Others/Help.svelte";
import SliderInput from "src/lib/UI/GUI/SliderInput.svelte";
</script>
<h2 class="mb-2 text-2xl font-bold mt-2">{language.display}</h2>
@@ -19,12 +20,12 @@
{#if $DataBase.theme === "waifu"}
<span class="text-neutral-200 mt-4">{language.waifuWidth}</span>
<input class="text-neutral-200 text-sm p-2 bg-transparent input-text focus:bg-selected" type="range" min="50" max="200" bind:value={$DataBase.waifuWidth}>
<span class="text-gray-400text-sm">{($DataBase.waifuWidth)}%</span>
<SliderInput min={50} max={200} bind:value={$DataBase.waifuWidth} />
<span class="text-gray-400 text-sm">{($DataBase.waifuWidth)}%</span>
<span class="text-neutral-200 mt-4">{language.waifuWidth2}</span>
<input class="text-neutral-200 text-sm p-2 bg-transparent input-text focus:bg-selected" type="range" min="20" max="150" bind:value={$DataBase.waifuWidth2}>
<span class="text-gray-400text-sm">{($DataBase.waifuWidth2)}%</span>
<SliderInput min={20} max={150} bind:value={$DataBase.waifuWidth2} />
<span class="text-gray-400 text-sm">{($DataBase.waifuWidth2)}%</span>
{/if}
<span class="text-neutral-200 mt-4">{language.textColor}</span>
@@ -54,11 +55,11 @@
{/if}
<span class="text-neutral-200">{language.UISize}</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="50" max="200" bind:value={$DataBase.zoomsize}>
<SliderInput min={50} max={200} bind:value={$DataBase.zoomsize} />
<span class="text-gray-400 mb-6 text-sm">{($DataBase.zoomsize)}%</span>
<span class="text-neutral-200">{language.iconSize}</span>
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="range" min="50" max="200" bind:value={$DataBase.iconsize}>
<SliderInput min={50} max={200} bind:value={$DataBase.iconsize} />
<span class="text-gray-400 mb-6 text-sm">{($DataBase.iconsize)}%</span>
<div class="flex items-center mt-2">

28
src/lib/Setting/Pages/OtherBotSettings.svelte
View File

@@ -4,6 +4,8 @@
import Help from "src/lib/Others/Help.svelte";
import { DataBase } from "src/ts/storage/database";
import { isTauri } from "src/ts/storage/globalApi";
import NumberInput from "src/lib/UI/GUI/NumberInput.svelte";
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
</script>
<h2 class="mb-2 text-2xl font-bold mt-2">{language.otherBots}</h2>
@@ -25,40 +27,40 @@
<span class="text-draculared text-xs mb-2">You are using web version. you must use ngrok or other tunnels to use your local webui.</span>
{/if}
<span class="text-neutral-200 mt-2">WebUI {language.providerURL}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" placeholder="https://..." bind:value={$DataBase.webUiUrl}>
<TextInput size="sm" marginBottom placeholder="https://..." bind:value={$DataBase.webUiUrl}/>
<span class="text-neutral-200">Steps</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="100" bind:value={$DataBase.sdSteps}>
<NumberInput size="sm" marginBottom min={0} max={100} bind:value={$DataBase.sdSteps}/>
<span class="text-neutral-200">CFG Scale</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="20" bind:value={$DataBase.sdCFG}>
<NumberInput size="sm" marginBottom min={0} max={20} bind:value={$DataBase.sdCFG}/>
<span class="text-neutral-200">Width</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="2048" bind:value={$DataBase.sdConfig.width}>
<NumberInput size="sm" marginBottom min={0} max={2048} bind:value={$DataBase.sdConfig.width}/>
<span class="text-neutral-200">Height</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="2048" bind:value={$DataBase.sdConfig.height}>
<NumberInput size="sm" marginBottom min={0} max={2048} bind:value={$DataBase.sdConfig.height}/>
<span class="text-neutral-200">Sampler</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" bind:value={$DataBase.sdConfig.sampler_name}>
<TextInput size="sm" marginBottom bind:value={$DataBase.sdConfig.sampler_name}/>
<div class="flex items-center mt-2">
<Check bind:check={$DataBase.sdConfig.enable_hr} name='Enable Hires'/>
</div>
{#if $DataBase.sdConfig.enable_hr === true}
<span class="text-neutral-200">denoising_strength</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="10" bind:value={$DataBase.sdConfig.denoising_strength}>
<NumberInput size="sm" marginBottom min={0} max={10} bind:value={$DataBase.sdConfig.denoising_strength}/>
<span class="text-neutral-200">hr_scale</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" type="number" min={0} max="10" bind:value={$DataBase.sdConfig.hr_scale}>
<NumberInput size="sm" marginBottom min={0} max={10} bind:value={$DataBase.sdConfig.hr_scale}/>
<span class="text-neutral-200">Upscaler</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" bind:value={$DataBase.sdConfig.hr_upscaler}>
<TextInput size="sm" marginBottom bind:value={$DataBase.sdConfig.hr_upscaler}/>
{/if}
{/if}
<span class="text-neutral-200 mt-4 text-lg font-bold">TTS</span>
<span class="text-neutral-200 mt-2">ElevenLabs API key</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" bind:value={$DataBase.elevenLabKey}>
<TextInput size="sm" marginBottom bind:value={$DataBase.elevenLabKey}/>
<span class="text-neutral-200 mt-2">VOICEVOX URL</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" bind:value={$DataBase.voicevoxUrl}>
<TextInput size="sm" marginBottom bind:value={$DataBase.voicevoxUrl}/>
<span class="text-neutral-200 mt-4 text-lg font-bold">{language.SuperMemory} <Help key="superMemory" /></span>
<span class="text-neutral-200 mt-4">{language.SuperMemory} {language.model}</span>
@@ -70,11 +72,11 @@
</select>
{#if $DataBase.supaMemoryType === 'davinci' || $DataBase.supaMemoryType === 'curie'}
<span class="text-neutral-200">{language.SuperMemory} OpenAI Key</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm" bind:value={$DataBase.supaMemoryKey}>
<TextInput size="sm" marginBottom bind:value={$DataBase.supaMemoryKey}/>
{/if}
{#if $DataBase.supaMemoryType !== 'none'}
<span class="text-neutral-200">{language.SuperMemory} Prompt</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-sm"bind:value={$DataBase.supaMemoryPrompt} placeholder="recommended to leave it blank to use default">
<TextInput size="sm" marginBottom bind:value={$DataBase.supaMemoryPrompt} placeholder="recommended to leave it blank to use default"/>
{/if}
{#if ($DataBase.supaMemoryType === 'davinci' || $DataBase.supaMemoryType === 'curie') && $DataBase.useExperimental}
<div class="flex">

3
src/lib/Setting/Pages/PersonaSettings.svelte
View File

@@ -1,6 +1,7 @@
<script lang="ts">
import { language } from "src/lang";
import BaseRoundedButton from "src/lib/UI/BaseRoundedButton.svelte";
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
import { alertConfirm, alertError } from "src/ts/alert";
import { changeUserPersona, getCharImage, saveUserPersona, selectUserImg } from "src/ts/characters";
import { DataBase, setDatabase } from "src/ts/storage/database";
@@ -71,7 +72,7 @@
</div>
<div class="flex flex-grow flex-col p-2 ml-4">
<span class="text-sm text-gray-500">{language.name}</span>
<input class="text-neutral-200 mb-4 p-2 bg-transparent input-text focus:bg-selected text-lg" placeholder="User" bind:value={$DataBase.username}>
<TextInput marginBottom size="lg" placeholder="User" bind:value={$DataBase.username} />
<span class="text-sm text-gray-500">{language.description}</span>
<textarea class="bg-transparent input-text mt-2 mb-2 text-gray-200 resize-none h-32 min-h-20 focus:bg-selected text-xs w-full" autocomplete="off" bind:value={$DataBase.personaPrompt} placeholder={`Put the description of this persona here.\nExample: [<user> is a 20 year old girl.]`}></textarea>
<div>

6
src/lib/Setting/Pages/PluginSettings.svelte
View File

@@ -5,6 +5,8 @@
import { DataBase } from "src/ts/storage/database";
import { importPlugin } from "src/ts/plugins/plugins";
import Check from "src/lib/Others/Check.svelte";
import TextInput from "src/lib/UI/GUI/TextInput.svelte";
import NumberInput from "src/lib/UI/GUI/NumberInput.svelte";
</script>
<h2 class="mb-2 text-2xl font-bold mt-2">{language.plugin}</h2>
@@ -48,9 +50,9 @@
{/each}
</select>
{:else if plugin.arguments[arg] === 'string'}
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" bind:value={$DataBase.plugins[i].realArg[arg]}>
<TextInput bind:value={$DataBase.plugins[i].realArg[arg]} />
{:else if plugin.arguments[arg] === 'int'}
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" type="number" bind:value={$DataBase.plugins[i].realArg[arg]}>
<NumberInput bind:value={$DataBase.plugins[i].realArg[arg]} />
{/if}
{/each}
</div>