+
{#each processingDetails as detail (detail)}
- {detail}
+ {detail}
{/each}
@@ -92,7 +92,6 @@
padding: 1.5rem 1rem;
opacity: 0;
transform: translateY(50%);
- pointer-events: none;
transition:
opacity 300ms ease-out,
transform 300ms ease-out;
@@ -100,7 +99,6 @@
.chat-processing-info-container.visible {
opacity: 1;
- pointer-events: auto;
transform: translateY(0);
}
diff --git a/examples/server/webui_llamacpp/src/lib/components/app/chat/ChatSettings/ChatSettingsDialog.svelte b/examples/server/webui_llamacpp/src/lib/components/app/chat/ChatSettings/ChatSettings.svelte
similarity index 61%
rename from examples/server/webui_llamacpp/src/lib/components/app/chat/ChatSettings/ChatSettingsDialog.svelte
rename to examples/server/webui_llamacpp/src/lib/components/app/chat/ChatSettings/ChatSettings.svelte
index 20e4d3b3..204f0d75 100644
--- a/examples/server/webui_llamacpp/src/lib/components/app/chat/ChatSettings/ChatSettingsDialog.svelte
+++ b/examples/server/webui_llamacpp/src/lib/components/app/chat/ChatSettings/ChatSettings.svelte
@@ -3,7 +3,6 @@
Settings,
Funnel,
AlertTriangle,
- Brain,
Code,
Monitor,
Sun,
@@ -12,20 +11,21 @@
ChevronRight,
Database
} from '@lucide/svelte';
- import { ChatSettingsFooter, ChatSettingsFields } from '$lib/components/app';
- import ImportExportTab from './ImportExportTab.svelte';
- import * as Dialog from '$lib/components/ui/dialog';
+ import {
+ ChatSettingsFooter,
+ ChatSettingsImportExportTab,
+ ChatSettingsFields
+ } from '$lib/components/app';
import { ScrollArea } from '$lib/components/ui/scroll-area';
import { config, updateMultipleConfig } from '$lib/stores/settings.svelte';
import { setMode } from 'mode-watcher';
import type { Component } from 'svelte';
interface Props {
- onOpenChange?: (open: boolean) => void;
- open?: boolean;
+ onSave?: () => void;
}
- let { onOpenChange, open = false }: Props = $props();
+ let { onSave }: Props = $props();
const settingSections: Array<{
fields: SettingsFieldConfig[];
@@ -52,6 +52,43 @@
{ value: 'dark', label: 'Dark', icon: Moon }
]
},
+ {
+ key: 'pasteLongTextToFileLen',
+ label: 'Paste long text to file length',
+ type: 'input'
+ },
+ {
+ key: 'enableContinueGeneration',
+ label: 'Enable "Continue" button',
+ type: 'checkbox',
+ isExperimental: true
+ },
+ {
+ key: 'pdfAsImage',
+ label: 'Parse PDF as image',
+ type: 'checkbox'
+ },
+ {
+ key: 'askForTitleConfirmation',
+ label: 'Ask for confirmation before changing conversation title',
+ type: 'checkbox'
+ }
+ ]
+ },
+ {
+ title: 'Display',
+ icon: Monitor,
+ fields: [
+ {
+ key: 'showThoughtInProgress',
+ label: 'Show thought in progress',
+ type: 'checkbox'
+ },
+ {
+ key: 'showMessageStats',
+ label: 'Show message generation statistics',
+ type: 'checkbox'
+ },
{
key: 'showTokensPerSecond',
label: 'Show tokens per second',
@@ -62,26 +99,16 @@
label: 'Keep stats visible after generation',
type: 'checkbox'
},
- {
- key: 'askForTitleConfirmation',
- label: 'Ask for confirmation before changing conversation title',
- type: 'checkbox'
- },
- {
- key: 'pasteLongTextToFileLen',
- label: 'Paste long text to file length',
- type: 'input'
- },
- {
- key: 'pdfAsImage',
- label: 'Parse PDF as image',
- type: 'checkbox'
- },
{
key: 'showModelInfo',
label: 'Show model information',
type: 'checkbox'
},
+ {
+ key: 'disableAutoScroll',
+ label: 'Disable automatic scroll',
+ type: 'checkbox'
+ },
{
key: 'renderUserContentAsMarkdown',
label: 'Render user content as Markdown',
@@ -196,17 +223,6 @@
}
]
},
- {
- title: 'Reasoning',
- icon: Brain,
- fields: [
- {
- key: 'showThoughtInProgress',
- label: 'Show thought in progress',
- type: 'checkbox'
- }
- ]
- },
{
title: 'Import/Export',
icon: Database,
@@ -221,6 +237,11 @@
label: 'Enable model selector',
type: 'checkbox'
},
+ {
+ key: 'showToolCalls',
+ label: 'Show tool call labels',
+ type: 'checkbox'
+ },
{
key: 'disableReasoningFormat',
label: 'Show raw LLM output',
@@ -253,7 +274,6 @@
settingSections.find((section) => section.title === activeSection) || settingSections[0]
);
let localConfig: SettingsConfigType = $state({ ...config() });
- let originalTheme: string = $state('');
let canScrollLeft = $state(false);
let canScrollRight = $state(false);
@@ -269,18 +289,10 @@
localConfig[key] = value;
}
- function handleClose() {
- if (localConfig.theme !== originalTheme) {
- setMode(originalTheme as 'light' | 'dark' | 'system');
- }
- onOpenChange?.(false);
- }
-
function handleReset() {
localConfig = { ...config() };
setMode(localConfig.theme as 'light' | 'dark' | 'system');
- originalTheme = localConfig.theme as string;
}
function handleSave() {
@@ -331,7 +343,7 @@
}
updateMultipleConfig(processedConfig);
- onOpenChange?.(false);
+ onSave?.();
}
function scrollToCenter(element: HTMLElement) {
@@ -367,14 +379,11 @@
canScrollRight = scrollLeft < scrollWidth - clientWidth - 1; // -1 for rounding
}
- $effect(() => {
- if (open) {
- localConfig = { ...config() };
- originalTheme = config().theme as string;
+ export function reset() {
+ localConfig = { ...config() };
- setTimeout(updateScrollButtons, 100);
- }
- });
+ setTimeout(updateScrollButtons, 100);
+ }
$effect(() => {
if (scrollContainer) {
@@ -383,120 +392,106 @@
});
-
-
-
-
-
-