mirror of
https://github.com/open-webui/open-webui.git
synced 2026-10-15 04:18:18 +00:00
refac
This commit is contained in:
Timothy Jaeryang Baek
parent
b704d0613f
commit
1045d74c75
20 changed files with 162 additions and 45 deletions
|
|
@ -199,7 +199,7 @@
|
|||
|
||||
<div class="flex items-center justify-end gap-2 shrink-0">
|
||||
<button
|
||||
class="px-3 py-1 text-xs text-gray-500 hover:text-gray-700 dark:hover:text-gray-200 transition"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
type="button"
|
||||
on:click={() => (show = false)}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -272,7 +272,7 @@
|
|||
{#if total > 0}
|
||||
<Dropdown align="end">
|
||||
<button
|
||||
class="flex h-8 shrink-0 items-center gap-1 px-2 py-1.5 rounded-xl hover:bg-gray-100 dark:hover:bg-gray-850 dark:text-gray-200 transition text-xs"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60"
|
||||
>
|
||||
{$i18n.t('Export')}
|
||||
<ChevronDown className="size-3" strokeWidth="2.5" />
|
||||
|
|
|
|||
|
|
@ -327,7 +327,7 @@
|
|||
<div class="flex items-center gap-0.5 flex-1 min-w-0">
|
||||
{#if event && !event.meta?.automation_id}
|
||||
<button
|
||||
class="px-3 py-1 text-xs text-gray-400 hover:text-gray-700 dark:hover:text-gray-200 transition"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
type="button"
|
||||
on:click={() => (showDeleteConfirmDialog = true)}
|
||||
disabled={loading}
|
||||
|
|
@ -339,7 +339,7 @@
|
|||
|
||||
<div class="flex items-center gap-2 shrink-0">
|
||||
<button
|
||||
class="px-3 py-1 text-xs text-gray-500 hover:text-gray-700 dark:hover:text-gray-200 transition"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
type="button"
|
||||
on:click={() => (show = false)}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -124,7 +124,7 @@
|
|||
<!-- Bottom toolbar -->
|
||||
<div class="flex items-center justify-end px-4 pb-3.5 pt-2 gap-2">
|
||||
<button
|
||||
class="px-3 py-1 text-xs text-gray-500 hover:text-gray-700 dark:hover:text-gray-200 transition"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
type="button"
|
||||
on:click={() => (show = false)}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -124,7 +124,7 @@
|
|||
<div class="">
|
||||
<button
|
||||
type="button"
|
||||
class=" px-3 py-1.5 gap-1 rounded-xl bg-gray-100/50 dark:text-white dark:bg-gray-850/50 text-black transition font-normal text-xs flex items-center justify-center"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60"
|
||||
on:click={onAdd}
|
||||
>
|
||||
<Plus className="size-3.5 " />
|
||||
|
|
|
|||
|
|
@ -108,7 +108,7 @@
|
|||
|
||||
<button
|
||||
type="button"
|
||||
class="px-3 py-1.5 gap-1 rounded-xl bg-gray-100/50 dark:bg-gray-850/50 text-black dark:text-white transition font-normal text-xs flex items-center justify-center"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60"
|
||||
on:click={createHandler}
|
||||
disabled={isSaving}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -743,7 +743,7 @@
|
|||
}
|
||||
|
||||
let chatInputContainerElement;
|
||||
let chatInputElement;
|
||||
let chatInputElement: RichTextInput;
|
||||
let modelSelector;
|
||||
|
||||
let filesInputElement;
|
||||
|
|
@ -752,6 +752,49 @@
|
|||
let inputFiles;
|
||||
|
||||
let showInputModal = false;
|
||||
let showComparison = false;
|
||||
let comparisonLoading = false;
|
||||
let ComparisonModal: typeof import('../common/DiffEditorModal.svelte').default | null = null;
|
||||
let comparisonTarget: {
|
||||
chatId: string;
|
||||
input: RichTextInput;
|
||||
content: string;
|
||||
} | null = null;
|
||||
|
||||
const openComparison = async () => {
|
||||
if (comparisonLoading) return;
|
||||
comparisonLoading = true;
|
||||
const target = { chatId, input: chatInputElement };
|
||||
try {
|
||||
ComparisonModal = (await import('../common/DiffEditorModal.svelte')).default;
|
||||
if (
|
||||
!target.input ||
|
||||
target.chatId !== chatId ||
|
||||
target.input !== chatInputElement
|
||||
)
|
||||
return;
|
||||
comparisonTarget = { chatId, input: target.input, content: prompt };
|
||||
showComparison = true;
|
||||
} catch {
|
||||
toast.error($i18n.t('Could not open comparison. Please try again.'));
|
||||
} finally {
|
||||
comparisonLoading = false;
|
||||
}
|
||||
};
|
||||
|
||||
const applyComparisonToPrompt = (text: string) => {
|
||||
|
||||
if (
|
||||
!chatInputElement ||
|
||||
comparisonTarget?.chatId !== chatId ||
|
||||
comparisonTarget?.input !== chatInputElement ||
|
||||
comparisonTarget?.content !== prompt
|
||||
)
|
||||
throw new Error($i18n.t('The prompt has changed. Reopen the comparison before applying.'));
|
||||
// The editor's literal setter preserves mentions without expanding prompt variables.
|
||||
if (text !== comparisonTarget.content) chatInputElement.setText(text);
|
||||
void tick().then(() => focus());
|
||||
};
|
||||
|
||||
export let dragged = false;
|
||||
export let dropzoneId = 'chat-pane';
|
||||
|
|
@ -1653,6 +1696,21 @@
|
|||
});
|
||||
</script>
|
||||
|
||||
{#if showComparison && ComparisonModal}
|
||||
<svelte:component
|
||||
this={ComparisonModal}
|
||||
bind:show={showComparison}
|
||||
title={$i18n.t('Compare text')}
|
||||
initialContent={comparisonTarget?.content ?? ''}
|
||||
applyLabel={$i18n.t('Use in prompt')}
|
||||
applyDescription={$i18n.t('Uses the left working copy as your prompt.')}
|
||||
discardMessage={$i18n.t(
|
||||
'Your comparison changes will be discarded. Your prompt will stay unchanged.'
|
||||
)}
|
||||
onApply={applyComparisonToPrompt}
|
||||
/>
|
||||
{/if}
|
||||
|
||||
<ToolServersModal
|
||||
bind:show={showTools}
|
||||
{selectedToolIds}
|
||||
|
|
@ -2138,8 +2196,8 @@
|
|||
text,
|
||||
history?.currentId
|
||||
? createMessagesList(history, history.currentId)
|
||||
: null,
|
||||
'general'
|
||||
: null,
|
||||
'general'
|
||||
).catch((error) => {
|
||||
console.log(error);
|
||||
|
||||
|
|
@ -2273,6 +2331,7 @@
|
|||
<div class=" flex justify-between mt-0.5 mb-2 mx-0.5 max-w-full" dir="ltr">
|
||||
<div class="ml-1 self-end flex items-center">
|
||||
<InputMenu
|
||||
onCompare={openComparison}
|
||||
bind:files
|
||||
selectedModels={selectedModelIds}
|
||||
fileUploadCapableModels={getFilesystemUploadTerminal(
|
||||
|
|
|
|||
|
|
@ -44,6 +44,7 @@
|
|||
|
||||
export let onUpload: Function;
|
||||
export let onClose: Function;
|
||||
export let onCompare: () => void = () => {};
|
||||
export let toolApprovalMode = 'full';
|
||||
export let onToolApprovalModeChange: Function = () => {};
|
||||
|
||||
|
|
@ -243,6 +244,31 @@
|
|||
</button>
|
||||
</Tooltip>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
class="flex w-full gap-2 items-center h-[1.6875rem] px-2 text-[0.8125rem] font-normal cursor-pointer hover:bg-gray-50/40 dark:hover:bg-gray-800/40 rounded-xl text-left"
|
||||
on:click={async () => {
|
||||
show = false;
|
||||
await tick();
|
||||
onCompare();
|
||||
}}
|
||||
>
|
||||
<svg
|
||||
class="size-3.5 shrink-0"
|
||||
viewBox="0 0 24 24"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
stroke-width="1.5"
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<rect x="3" y="4" width="18" height="16" rx="2" />
|
||||
<path d="M12 4v16M5.5 12h4M14.5 12h4M16.5 10v4" />
|
||||
</svg>
|
||||
<span>{$i18n.t('Compare text')}</span>
|
||||
</button>
|
||||
|
||||
<Tooltip
|
||||
content={!webUploadEnabled
|
||||
? $i18n.t('You do not have permission to upload web content.')
|
||||
|
|
|
|||
|
|
@ -473,10 +473,10 @@
|
|||
</Tooltip>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-0.5 shrink-0">
|
||||
<div class="flex max-w-full items-center gap-0.5 shrink-0 overflow-x-auto">
|
||||
{#if isDiff && edit}
|
||||
<button
|
||||
class="bg-none border-none transition rounded-md px-1.5 py-0.5 bg-white dark:bg-black"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
aria-pressed={editingDiff}
|
||||
on:click={() => {
|
||||
editingDiff = !editingDiff;
|
||||
|
|
@ -487,7 +487,7 @@
|
|||
</button>
|
||||
{/if}
|
||||
<button
|
||||
class="flex gap-1 items-center bg-none border-none transition rounded-md px-1.5 py-0.5 bg-white dark:bg-black"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
on:click={collapseCodeBlock}
|
||||
>
|
||||
<div class=" -translate-y-[0.5px]">
|
||||
|
|
@ -502,13 +502,13 @@
|
|||
{#if ($config?.features?.enable_code_execution ?? true) && (lang.toLowerCase() === 'python' || lang.toLowerCase() === 'py' || (lang === '' && checkPythonCode(code)))}
|
||||
{#if executing}
|
||||
<div
|
||||
class="run-code-button bg-none border-none p-0.5 cursor-not-allowed bg-white dark:bg-black"
|
||||
class="run-code-button flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white cursor-not-allowed opacity-60"
|
||||
>
|
||||
{$i18n.t('Running')}
|
||||
</div>
|
||||
{:else if run}
|
||||
<button
|
||||
class="flex gap-1 items-center run-code-button bg-none border-none transition rounded-md px-1.5 py-0.5 bg-white dark:bg-black"
|
||||
class="run-code-button flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
on:click={async () => {
|
||||
code = _code;
|
||||
await tick();
|
||||
|
|
@ -524,7 +524,7 @@
|
|||
|
||||
{#if save}
|
||||
<button
|
||||
class="save-code-button bg-none border-none transition rounded-md px-1.5 py-0.5 bg-white dark:bg-black"
|
||||
class="save-code-button flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-900 px-2.5 text-xs font-normal text-white transition hover:bg-black disabled:opacity-60 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-white"
|
||||
on:click={saveCode}
|
||||
>
|
||||
{saved ? $i18n.t('Saved') : $i18n.t('Save')}
|
||||
|
|
@ -532,13 +532,13 @@
|
|||
{/if}
|
||||
|
||||
<button
|
||||
class="copy-code-button bg-none border-none transition rounded-md px-1.5 py-0.5 bg-white dark:bg-black"
|
||||
class="copy-code-button flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
on:click={copyCode}>{copied ? $i18n.t('Copied') : $i18n.t('Copy')}</button
|
||||
>
|
||||
|
||||
{#if preview && ['html', 'svg'].includes(lang)}
|
||||
<button
|
||||
class="flex gap-1 items-center run-code-button bg-none border-none transition rounded-md px-1.5 py-0.5 bg-white dark:bg-black"
|
||||
class="run-code-button flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
on:click={previewCode}
|
||||
>
|
||||
<div>
|
||||
|
|
|
|||
|
|
@ -35,6 +35,9 @@
|
|||
export let proposedContent: string | undefined = undefined;
|
||||
export let filePath: string | null = null;
|
||||
export let title = '';
|
||||
export let applyLabel: string | null = null;
|
||||
export let applyDescription: string | null = null;
|
||||
export let discardMessage: string | null = null;
|
||||
export let onApply: (content: string) => void = () => {};
|
||||
export let onClose: () => void = () => {};
|
||||
|
||||
|
|
@ -523,11 +526,12 @@
|
|||
</div>
|
||||
<footer class="flex shrink-0 flex-wrap items-center gap-2 px-5 py-3">
|
||||
<p class="mr-auto text-gray-500">
|
||||
{$i18n.t('Apply uses the left working copy. Save your draft afterward.')}
|
||||
{applyDescription ??
|
||||
$i18n.t('Apply uses the left working copy. Save your draft afterward.')}
|
||||
</p>
|
||||
<button type="button" class="secondary" on:click={requestClose}>{$i18n.t('Cancel')}</button>
|
||||
<button type="button" class="primary" disabled={loading} on:click={apply}
|
||||
>{$i18n.t('Apply to draft')}</button
|
||||
>{applyLabel ?? $i18n.t('Apply to draft')}</button
|
||||
>
|
||||
</footer>
|
||||
</div>
|
||||
|
|
@ -535,9 +539,10 @@
|
|||
<ConfirmDialog
|
||||
bind:show={confirmDiscard}
|
||||
title={$i18n.t('Discard comparison changes?')}
|
||||
message={$i18n.t(
|
||||
'Your changes in this comparison will be discarded. The original draft will stay unchanged.'
|
||||
)}
|
||||
message={discardMessage ??
|
||||
$i18n.t(
|
||||
'Your changes in this comparison will be discarded. The original draft will stay unchanged.'
|
||||
)}
|
||||
confirmLabel={$i18n.t('Discard')}
|
||||
onConfirm={close}
|
||||
/>
|
||||
|
|
@ -589,32 +594,59 @@
|
|||
|
||||
.secondary,
|
||||
.primary {
|
||||
display: inline-flex;
|
||||
height: 1.75rem;
|
||||
flex-shrink: 0;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 0.375rem;
|
||||
border-radius: 0.5rem;
|
||||
padding: 0.375rem 0.625rem;
|
||||
padding: 0 0.625rem;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 400;
|
||||
transition:
|
||||
background-color 150ms,
|
||||
color 150ms;
|
||||
}
|
||||
.secondary {
|
||||
background: var(--color-gray-100);
|
||||
color: var(--color-gray-700);
|
||||
color: var(--color-gray-800);
|
||||
}
|
||||
.secondary:hover {
|
||||
background: color-mix(in oklab, var(--color-gray-100) 70%, transparent);
|
||||
}
|
||||
.primary {
|
||||
background: var(--color-gray-900);
|
||||
color: white;
|
||||
}
|
||||
.primary:hover {
|
||||
background: black;
|
||||
}
|
||||
button:disabled {
|
||||
opacity: 0.4;
|
||||
}
|
||||
.secondary:disabled,
|
||||
.primary:disabled {
|
||||
opacity: 0.6;
|
||||
}
|
||||
button:focus-visible {
|
||||
outline: 2px solid var(--color-gray-500);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
:global(.dark) .secondary {
|
||||
background: var(--color-gray-800);
|
||||
color: var(--color-gray-200);
|
||||
background: var(--color-gray-850);
|
||||
color: white;
|
||||
}
|
||||
:global(.dark) .secondary:hover {
|
||||
background: color-mix(in oklab, var(--color-gray-850) 60%, transparent);
|
||||
}
|
||||
:global(.dark) .primary {
|
||||
background: var(--color-gray-100);
|
||||
color: var(--color-gray-900);
|
||||
}
|
||||
:global(.dark) .primary:hover {
|
||||
background: white;
|
||||
}
|
||||
.merge-container :global(.cm-mergeView) {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@
|
|||
{:else}
|
||||
<button
|
||||
type="button"
|
||||
class="flex items-center gap-2 px-3 py-1.5 rounded-lg bg-gray-200/80 dark:bg-gray-700 text-gray-500 dark:text-blue-400 text-sm font-normal hover:bg-gray-300 dark:hover:bg-gray-600 transition-colors"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60"
|
||||
on:click={openInput}
|
||||
>
|
||||
<span>+</span>
|
||||
|
|
|
|||
|
|
@ -157,7 +157,7 @@
|
|||
<div slot="footer">
|
||||
<div class="flex flex-wrap text-sm font-normal gap-1.5 mt-2 m-1 justify-end w-full">
|
||||
<button
|
||||
class=" px-3.5 py-1.5 font-normal hover:bg-black/5 dark:hover:bg-white/5 outline outline-1 outline-gray-100 dark:outline-gray-800 rounded-3xl"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60"
|
||||
disabled={loading}
|
||||
on:click={() => {
|
||||
showUnshareAllConfirmDialog = true;
|
||||
|
|
|
|||
|
|
@ -470,7 +470,7 @@
|
|||
<div class="shrink-0">
|
||||
<button
|
||||
type="button"
|
||||
class="px-3.5 py-1.5 text-sm font-normal bg-gray-50 hover:bg-gray-100 text-gray-900 dark:bg-gray-850 dark:hover:bg-gray-800 dark:text-gray-200 transition rounded-lg shrink-0 {($settings?.highContrastMode ??
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60 {($settings?.highContrastMode ??
|
||||
false)
|
||||
? ''
|
||||
: 'outline-hidden'}"
|
||||
|
|
@ -521,7 +521,7 @@
|
|||
{#if !loading}
|
||||
<button
|
||||
disabled={message === ''}
|
||||
class="px-3.5 py-1.5 text-sm font-normal disabled:bg-gray-50 dark:disabled:hover:bg-gray-850 disabled:cursor-not-allowed bg-gray-50 hover:bg-gray-100 text-gray-900 dark:bg-gray-850 dark:hover:bg-gray-800 dark:text-gray-200 transition rounded-lg"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60 disabled:cursor-not-allowed"
|
||||
on:click={() => {
|
||||
addHandler();
|
||||
role = role === 'user' ? 'assistant' : 'user';
|
||||
|
|
@ -531,7 +531,7 @@
|
|||
</button>
|
||||
|
||||
<button
|
||||
class="px-3.5 py-1.5 text-sm font-normal bg-black hover:bg-gray-900 text-white dark:bg-white dark:text-black dark:hover:bg-gray-100 transition rounded-lg"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-900 px-2.5 text-xs font-normal text-white transition hover:bg-black disabled:opacity-60 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-white"
|
||||
on:click={() => {
|
||||
submitHandler();
|
||||
}}
|
||||
|
|
@ -540,7 +540,7 @@
|
|||
</button>
|
||||
{:else}
|
||||
<button
|
||||
class="px-3 py-1.5 text-sm font-normal bg-gray-300 text-black transition rounded-lg"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
on:click={() => {
|
||||
stopResponse();
|
||||
}}
|
||||
|
|
|
|||
|
|
@ -150,7 +150,7 @@
|
|||
<div class="flex gap-2 shrink-0 ml-2">
|
||||
{#if !loading}
|
||||
<button
|
||||
class="px-3.5 py-1.5 text-sm font-normal bg-black hover:bg-gray-900 text-white dark:bg-white dark:text-black dark:hover:bg-gray-100 transition rounded-lg"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-900 px-2.5 text-xs font-normal text-white transition hover:bg-black disabled:opacity-60 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-white"
|
||||
on:click={() => {
|
||||
submitHandler();
|
||||
}}
|
||||
|
|
@ -159,7 +159,7 @@
|
|||
</button>
|
||||
{:else}
|
||||
<button
|
||||
class="px-3.5 py-1.5 text-sm font-normal bg-gray-300 text-black transition rounded-lg flex items-center gap-2"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
on:click={() => {
|
||||
stopResponse();
|
||||
}}
|
||||
|
|
|
|||
|
|
@ -245,7 +245,7 @@
|
|||
/>
|
||||
<button
|
||||
type="button"
|
||||
class="px-3.5 py-1.5 text-sm font-normal bg-gray-50 hover:bg-gray-100 text-gray-900 dark:bg-gray-850 dark:hover:bg-gray-800 dark:text-gray-200 transition rounded-lg"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60"
|
||||
on:click={() => fileInputElement?.click()}
|
||||
on:dragover|preventDefault
|
||||
on:drop={handleDrop}
|
||||
|
|
@ -258,14 +258,14 @@
|
|||
{#if !loading}
|
||||
<button
|
||||
disabled={prompt.trim() === ''}
|
||||
class="px-3.5 py-1.5 text-sm font-normal bg-black hover:bg-gray-900 text-white dark:bg-white dark:text-black dark:hover:bg-gray-100 transition rounded-lg disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-900 px-2.5 text-xs font-normal text-white transition hover:bg-black disabled:opacity-60 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-white disabled:cursor-not-allowed"
|
||||
on:click={submitHandler}
|
||||
>
|
||||
{$i18n.t('Run')}
|
||||
</button>
|
||||
{:else}
|
||||
<button
|
||||
class="px-3.5 py-1.5 text-sm font-normal bg-gray-300 text-black transition rounded-lg flex items-center gap-2"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
disabled
|
||||
>
|
||||
<Spinner className="size-4" />
|
||||
|
|
|
|||
|
|
@ -159,7 +159,7 @@
|
|||
<div class="flex justify-end {modal ? 'pt-3 gap-2' : 'mt-2'}">
|
||||
{#if modal}
|
||||
<button
|
||||
class="px-3 py-1 text-xs text-gray-500 hover:text-gray-700 dark:hover:text-gray-200 transition"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
type="button"
|
||||
on:click={() => {
|
||||
onBack();
|
||||
|
|
|
|||
|
|
@ -962,7 +962,7 @@
|
|||
placeholder={$i18n.t('Ask this knowledge source a test question')}
|
||||
/>
|
||||
<button
|
||||
class="px-3 py-2 rounded-xl bg-black text-white dark:bg-white dark:text-black text-xs"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-900 px-2.5 text-xs font-normal text-white transition hover:bg-black disabled:opacity-60 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-white"
|
||||
on:click={externalTestHandler}
|
||||
>
|
||||
{$i18n.t('Test')}
|
||||
|
|
|
|||
|
|
@ -244,14 +244,14 @@
|
|||
{#if state.editing}
|
||||
<button
|
||||
type="button"
|
||||
class="shrink-0 px-1 py-0.5 text-gray-500"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
disabled={saving}
|
||||
on:click={() => (state = { ...state, draft: state.indexed ?? '', editing: false })}
|
||||
>{$i18n.t('Cancel')}</button
|
||||
>
|
||||
<button
|
||||
type="button"
|
||||
class="flex shrink-0 items-center gap-1 px-1 py-0.5"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-900 px-2.5 text-xs font-normal text-white transition hover:bg-black disabled:opacity-60 dark:bg-gray-100 dark:text-gray-900 dark:hover:bg-white"
|
||||
disabled={saving || state.indexed === null}
|
||||
on:click={save}
|
||||
>
|
||||
|
|
@ -260,7 +260,7 @@
|
|||
{:else}
|
||||
<button
|
||||
type="button"
|
||||
class="shrink-0 px-1 py-0.5 text-gray-500"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
on:click={() => {
|
||||
state = { ...state, mode: 'indexed', editing: true, draft: state.indexed ?? '' };
|
||||
}}>{$i18n.t('Edit')}</button
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
<!-- Bottom toolbar -->
|
||||
<div class="flex items-center justify-end px-4 pb-3.5 pt-2 gap-2">
|
||||
<button
|
||||
class="px-3 py-1 text-xs text-gray-500 hover:text-gray-700 dark:hover:text-gray-200 transition"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg px-2.5 text-xs font-normal text-gray-600 transition hover:bg-gray-100 hover:text-gray-900 disabled:opacity-60 dark:text-gray-400 dark:hover:bg-gray-850 dark:hover:text-white"
|
||||
type="button"
|
||||
on:click={() => (show = false)}
|
||||
>
|
||||
|
|
|
|||
|
|
@ -362,7 +362,7 @@
|
|||
<div class="flex gap-3 items-center mt-3 text-xs">
|
||||
<button
|
||||
type="button"
|
||||
class="px-3 py-2 rounded-lg bg-gray-100 dark:bg-gray-850"
|
||||
class="flex h-7 shrink-0 items-center justify-center gap-1.5 rounded-lg bg-gray-100 px-2.5 text-xs font-normal text-gray-800 transition hover:bg-gray-100/70 disabled:opacity-60 dark:bg-gray-850 dark:text-white dark:hover:bg-gray-850/60"
|
||||
on:click={() => input.click()}
|
||||
>{value ? $i18n.t('Replace avatar') : $i18n.t('Upload VRM')}</button
|
||||
>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue