From f1357e49980f5462af9783164f3fdec407d90137 Mon Sep 17 00:00:00 2001 From: Aleksander Grygier Date: Tue, 25 Aug 2026 14:34:34 +0200 Subject: [PATCH] ui: ESLint config updates (#27700) * chore: Spacing between sibling elements in html markup * chore: Formatting and linting rules --- tools/ui/eslint.config.js | 154 +++++++++++++++++- .../components/app/actions/ActionIcon.svelte | 10 +- .../actions/ActionIconCopyToClipboard.svelte | 6 +- .../ChatAttachmentsList.svelte | 4 +- .../ChatAttachmentsListItem.svelte | 34 ++-- .../ChatAttachmentsListItemMcpPrompt.svelte | 2 +- ...hatAttachmentsListItemThumbnailFile.svelte | 2 +- ...atAttachmentsListItemThumbnailImage.svelte | 2 +- .../ChatAttachmentsPreview.svelte | 22 +-- .../ChatAttachmentsPreviewCurrentItem.svelte | 4 +- ...tAttachmentsPreviewCurrentItemAudio.svelte | 2 +- ...tAttachmentsPreviewCurrentItemImage.svelte | 2 +- ...hatAttachmentsPreviewCurrentItemPdf.svelte | 22 ++- ...tAttachmentsPreviewCurrentItemVideo.svelte | 2 +- .../ChatAttachmentsPreviewNavButtons.svelte | 12 +- ...hatAttachmentsPreviewThumbnailStrip.svelte | 4 +- .../app/chat/ChatForm/ChatForm.svelte | 58 +++---- .../ChatFormActionAddButton.svelte | 2 +- .../ChatFormActionAddMcpServersSubmenu.svelte | 10 +- .../ChatFormActionAddReasoningSubmenu.svelte | 1 + .../ChatFormActionAddSheet.svelte | 36 ++-- .../ChatFormActionAddToolsSubmenu.svelte | 10 +- .../ChatFormActionModels.svelte | 4 +- .../ChatFormActionSubmit.svelte | 5 +- .../ChatFormActions/ChatFormActions.svelte | 18 +- .../ChatFormContextGauge.svelte | 8 +- .../ContextGaugeDetailRow.svelte | 1 + .../ContextGaugeDetails.svelte | 6 +- .../ContextGaugeDial.svelte | 8 +- .../ContextGaugeLoadModel.svelte | 4 +- .../ContextGaugePopup.svelte | 25 +-- .../ChatFormCurrentWorkingDirectory.svelte | 43 ++--- ...ChatFormCurrentWorkingDirectoryChip.svelte | 15 +- ...mCurrentWorkingDirectoryResultsList.svelte | 5 +- .../ChatFormInput/ChatFormInput.svelte | 4 +- .../ChatFormInput/ChatFormInputBasic.svelte | 4 +- .../ChatFormInputFileInputInvisible.svelte | 4 +- .../ChatFormInput/ChatFormInputRich.svelte | 18 +- .../ChatForm/ChatFormMcpResourcesList.svelte | 2 +- .../ChatFormPickerItemHeader.svelte | 2 +- .../ChatFormPicker/ChatFormPickerList.svelte | 10 +- .../ChatFormPickerListItem.svelte | 4 +- .../ChatFormPickerListItemSkeleton.svelte | 1 + .../ChatFormPickerPopover.svelte | 10 +- .../ChatFormPickerCommand.svelte | 16 +- .../ChatFormPickerMcpPrompts.svelte | 34 ++-- .../ChatFormPromptPickerArgumentForm.svelte | 16 +- .../ChatFormPromptPickerArgumentInput.svelte | 18 +- .../ChatFormPickerMention.svelte | 34 ++-- .../ChatFormPickers/ChatFormPickers.svelte | 14 +- .../ChatMessage/ChatMessage.svelte | 8 +- .../ChatMessageAssistant.svelte | 26 +-- .../ChatMessageAssistantProcessingInfo.svelte | 2 +- .../ChatMessageAssistantStatistics.svelte | 26 +-- .../ChatMessage/ChatMessageCwdChange.svelte | 3 + .../ChatMessageMcpPrompt.svelte | 2 +- .../ChatMessageMcpPromptContent.svelte | 2 +- .../ChatMessage/ChatMessageSynthetic.svelte | 2 +- .../ChatMessageSystem.svelte | 8 +- .../ChatMessageToolCallBlock.svelte | 30 ++-- .../ChatMessageToolCallBlockDefault.svelte | 15 +- .../ChatMessageToolCallBlockEditFile.svelte | 13 +- ...essageToolCallBlockExecShellCommand.svelte | 22 ++- ...tMessageToolCallBlockFileGlobSearch.svelte | 8 +- ...ChatMessageToolCallBlockGetDatetime.svelte | 4 + .../ChatMessageToolCallBlockGetInfo.svelte | 5 + .../ChatMessageToolCallBlockGrepSearch.svelte | 12 +- .../ChatMessageToolCallBlockReadFile.svelte | 4 +- .../ChatMessageToolCallBlockReadMedia.svelte | 8 +- ...atMessageToolCallBlockRunJavascript.svelte | 8 +- ...atMessageToolCallBlockSearchResults.svelte | 31 ++-- .../ChatMessageToolCallBlockWriteFile.svelte | 7 +- .../ChatMessageToolCall/ToolCallBlock.svelte | 8 +- .../ChatMessageUser/ChatMessageUser.svelte | 8 +- .../ChatMessageUserBubble.svelte | 2 +- .../ChatMessageUserPending.svelte | 12 +- .../ChatMessageActionCard.svelte | 2 + ...hatMessageActionCardContinueRequest.svelte | 6 +- ...tMessageActionCardPermissionRequest.svelte | 9 +- .../ChatMessageActionIcons.svelte | 45 ++--- ...MessageActionIconsBranchingControls.svelte | 12 +- .../ChatMessageAgenticContent.svelte | 32 ++-- .../ChatMessages/ChatMessageEditForm.svelte | 34 ++-- .../ChatMessageReasoningBlock.svelte | 12 +- .../ChatMessageStatistics.svelte | 28 ++-- .../ChatMessageStatisticsBadge.svelte | 1 + .../app/chat/ChatMessages/ChatMessages.svelte | 14 +- .../app/chat/ChatScreen/ChatScreen.svelte | 16 +- .../ChatScreenActionScrollDown.svelte | 10 +- .../ChatScreenDialogsAndAlerts.svelte | 12 +- .../app/chat/ChatScreen/ChatScreenForm.svelte | 8 +- .../ChatScreen/ChatScreenServerError.svelte | 4 +- .../ChatScreenStreamResumeStatus.svelte | 3 +- .../app/chat/ChatTabs/ChatTabs.svelte | 9 +- .../app/chat/ChatTabs/ChatTabsItem.svelte | 12 +- .../ChatTabs/ChatTabsNewChatButton.svelte | 2 +- .../content/CollapsibleContentBlock.svelte | 6 +- .../content/CollapsibleTerminalBlock.svelte | 6 +- .../MarkdownContent/MarkdownContent.svelte | 21 ++- .../app/content/MermaidPreview.svelte | 14 +- .../app/content/MermaidPreviewControls.svelte | 12 +- .../app/content/SyntaxHighlightedCode.svelte | 2 +- .../DialogChatAttachmentsPreview.svelte | 8 +- .../app/dialogs/DialogChatError.svelte | 2 +- .../app/dialogs/DialogCodePreview.svelte | 8 +- .../app/dialogs/DialogConfirmation.svelte | 5 +- .../dialogs/DialogConversationRename.svelte | 12 +- .../DialogConversationSelection.svelte | 2 +- .../app/dialogs/DialogEmptyFileAlert.svelte | 2 +- .../app/dialogs/DialogExportSettings.svelte | 8 +- .../app/dialogs/DialogFileUploadError.svelte | 2 +- .../dialogs/DialogMcpResourcePreview.svelte | 16 +- .../dialogs/DialogMcpResourcesBrowser.svelte | 28 ++-- .../app/dialogs/DialogMcpServerAddNew.svelte | 35 ++-- .../app/dialogs/DialogModelInformation.svelte | 12 +- .../dialogs/DialogModelNotAvailable.svelte | 6 +- .../app/forms/InputWithSuggestions.svelte | 18 +- .../components/app/forms/KeyValuePairs.svelte | 26 +-- .../components/app/forms/SearchInput.svelte | 10 +- .../app/mcp/McpActiveServersAvatars.svelte | 3 +- .../app/mcp/McpCapabilitiesBadges.svelte | 12 +- .../src/lib/components/app/mcp/McpLogo.svelte | 42 ++--- .../app/mcp/McpResourcePreview.svelte | 14 +- .../app/mcp/McpResourceTemplateForm.svelte | 20 +-- .../McpResourcesBrowser.svelte | 20 +-- .../McpResourcesBrowserHeader.svelte | 8 +- .../McpResourcesBrowserServerItem.svelte | 6 +- .../mcp/McpServerCard/McpServerCard.svelte | 25 +-- .../McpServerCard/McpServerCardActions.svelte | 18 +- .../McpServerCard/McpServerCardCompact.svelte | 4 +- .../McpServerCardEditForm.svelte | 22 +-- .../McpServerCard/McpServerCardHeader.svelte | 4 +- .../app/mcp/McpServerCardSkeleton.svelte | 8 + .../components/app/mcp/McpServerForm.svelte | 54 +++--- .../app/mcp/McpServerIdentity.svelte | 14 +- .../app/misc/CodeBlockActions.svelte | 8 +- .../app/misc/ConversationSelection.svelte | 8 +- .../components/app/misc/ScrollCarousel.svelte | 8 +- .../components/app/models/ModelBadge.svelte | 2 +- .../app/models/ModelsSelectorDropdown.svelte | 50 +++--- .../app/models/ModelsSelectorList.svelte | 16 +- .../app/models/ModelsSelectorOption.svelte | 58 +++---- .../app/models/ModelsSelectorSheet.svelte | 36 ++-- .../app/navigation/DropdownMenuActions.svelte | 6 +- .../navigation/DropdownMenuSearchable.svelte | 2 +- .../SidebarNavigation.svelte | 102 ++++++------ .../SidebarNavigationActions.svelte | 14 +- .../SidebarNavigationConversationItem.svelte | 24 +-- .../SidebarNavigationConversationList.svelte | 60 +++---- .../SidebarNavigationSearch.svelte | 2 +- .../SidebarNavigationSearchResults.svelte | 12 +- .../SidebarNavigationSelectionBar.svelte | 62 +++---- .../app/server/ServerErrorSplash.svelte | 42 +++-- .../app/server/ServerLoadingSplash.svelte | 2 +- .../components/app/server/ServerStatus.svelte | 6 +- .../settings/SettingsChat/SettingsChat.svelte | 15 +- .../SettingsChat/SettingsChatFields.svelte | 58 ++++--- .../SettingsChatImportExportTab.svelte | 48 +++--- ...ettingsChatParameterSourceIndicator.svelte | 2 +- .../SettingsChat/SettingsChatToolsTab.svelte | 17 +- .../SettingsChatDesktopSidebar.svelte | 2 + .../settings/SettingsChatMobileHeader.svelte | 4 +- .../app/settings/SettingsFooter.svelte | 5 +- .../app/settings/SettingsMcpServers.svelte | 10 +- .../src/lib/components/pwa/PwaMetaTags.svelte | 13 +- .../lib/components/pwa/PwaRefreshAlert.svelte | 2 +- .../alert-dialog/alert-dialog-action.svelte | 2 +- .../alert-dialog/alert-dialog-cancel.svelte | 2 +- .../alert-dialog/alert-dialog-content.svelte | 3 +- .../alert-dialog-description.svelte | 2 +- .../alert-dialog/alert-dialog-footer.svelte | 2 +- .../alert-dialog/alert-dialog-header.svelte | 2 +- .../alert-dialog/alert-dialog-overlay.svelte | 2 +- .../ui/alert-dialog/alert-dialog-title.svelte | 2 +- .../ui/alert/alert-description.svelte | 2 +- .../components/ui/alert/alert-title.svelte | 2 +- .../src/lib/components/ui/alert/alert.svelte | 2 +- .../src/lib/components/ui/badge/badge.svelte | 2 +- .../lib/components/ui/button/button.svelte | 10 +- .../lib/components/ui/card/card-action.svelte | 2 +- .../components/ui/card/card-content.svelte | 2 +- .../ui/card/card-description.svelte | 2 +- .../lib/components/ui/card/card-footer.svelte | 2 +- .../lib/components/ui/card/card-header.svelte | 2 +- .../lib/components/ui/card/card-title.svelte | 2 +- .../ui/src/lib/components/ui/card/card.svelte | 2 +- .../components/ui/checkbox/checkbox.svelte | 8 +- .../ui/collapsible/collapsible.svelte | 2 +- .../ui/dialog/dialog-content.svelte | 5 +- .../ui/dialog/dialog-description.svelte | 2 +- .../components/ui/dialog/dialog-footer.svelte | 2 +- .../components/ui/dialog/dialog-header.svelte | 2 +- .../ui/dialog/dialog-overlay.svelte | 2 +- .../components/ui/dialog/dialog-title.svelte | 2 +- .../dropdown-menu-checkbox-item.svelte | 5 +- .../dropdown-menu-content.svelte | 4 +- .../dropdown-menu-group-heading.svelte | 4 +- .../dropdown-menu/dropdown-menu-item.svelte | 6 +- .../dropdown-menu/dropdown-menu-label.svelte | 4 +- .../dropdown-menu-radio-item.svelte | 3 +- .../dropdown-menu-separator.svelte | 2 +- .../dropdown-menu-shortcut.svelte | 2 +- .../dropdown-menu-sub-content.svelte | 2 +- .../dropdown-menu-sub-trigger.svelte | 5 +- .../components/ui/empty/empty-content.svelte | 2 +- .../ui/empty/empty-description.svelte | 2 +- .../components/ui/empty/empty-header.svelte | 2 +- .../components/ui/empty/empty-media.svelte | 2 +- .../components/ui/empty/empty-title.svelte | 2 +- .../src/lib/components/ui/empty/empty.svelte | 2 +- .../ui/hover-card/hover-card-content.svelte | 4 +- .../src/lib/components/ui/input/input.svelte | 10 +- .../src/lib/components/ui/label/label.svelte | 2 +- .../ui/popover/popover-content.svelte | 8 +- .../ui/popover/popover-trigger.svelte | 2 +- .../ui/radio-group/radio-group-item.svelte | 4 +- .../ui/radio-group/radio-group.svelte | 2 +- .../scroll-area/scroll-area-scrollbar.svelte | 7 +- .../ui/scroll-area/scroll-area.svelte | 11 +- .../ui/select/select-content.svelte | 6 +- .../ui/select/select-group-heading.svelte | 2 +- .../components/ui/select/select-item.svelte | 5 +- .../components/ui/select/select-label.svelte | 2 +- .../select/select-scroll-down-button.svelte | 2 +- .../ui/select/select-scroll-up-button.svelte | 2 +- .../ui/select/select-separator.svelte | 2 +- .../ui/select/select-trigger.svelte | 5 +- .../components/ui/separator/separator.svelte | 2 +- .../components/ui/sheet/sheet-content.svelte | 5 +- .../ui/sheet/sheet-description.svelte | 2 +- .../components/ui/sheet/sheet-footer.svelte | 2 +- .../components/ui/sheet/sheet-header.svelte | 2 +- .../components/ui/sheet/sheet-overlay.svelte | 2 +- .../components/ui/sheet/sheet-title.svelte | 2 +- .../components/ui/skeleton/skeleton.svelte | 2 +- .../lib/components/ui/switch/switch.svelte | 6 +- .../lib/components/ui/table/table-body.svelte | 2 +- .../components/ui/table/table-caption.svelte | 2 +- .../lib/components/ui/table/table-cell.svelte | 2 +- .../components/ui/table/table-footer.svelte | 2 +- .../lib/components/ui/table/table-head.svelte | 2 +- .../components/ui/table/table-header.svelte | 2 +- .../lib/components/ui/table/table-row.svelte | 2 +- .../src/lib/components/ui/table/table.svelte | 4 +- .../components/ui/textarea/textarea.svelte | 4 +- .../ui/tooltip/tooltip-content.svelte | 7 +- .../ui/tooltip/tooltip-trigger.svelte | 2 +- tools/ui/src/routes/(chat)/+page.svelte | 2 +- .../src/routes/(chat)/chat/[id]/+page.svelte | 2 +- tools/ui/src/routes/+error.svelte | 7 +- tools/ui/src/routes/+layout.svelte | 6 +- tools/ui/src/routes/search/+page.svelte | 12 +- tools/ui/src/routes/settings/+layout.svelte | 2 +- .../components/AgenticPerfWrapper.svelte | 4 +- .../components/McpServerFormWrapper.svelte | 8 +- .../components/PickerListScrollHarness.svelte | 10 +- .../tests/stories/ChatMessage.stories.svelte | 16 +- .../stories/ChatScreenForm.stories.svelte | 8 +- .../stories/MarkdownContent.stories.svelte | 18 +- .../stories/ModelsSelector.stories.svelte | 153 +++++++++-------- .../stories/PwaRefreshAlert.stories.svelte | 8 +- .../stories/SidebarNavigation.stories.svelte | 2 +- .../a11y/ActionIcon.a11y.stories.svelte | 5 +- .../ChatMessageStatistics.a11y.stories.svelte | 4 +- .../a11y/ChatScreenForm.a11y.stories.svelte | 6 +- .../a11y/ScrollCarousel.a11y.stories.svelte | 6 +- ...gationConversationItem.a11y.stories.svelte | 4 +- 267 files changed, 1706 insertions(+), 1344 deletions(-) diff --git a/tools/ui/eslint.config.js b/tools/ui/eslint.config.js index 6ad065f5a0..9eab1734c3 100644 --- a/tools/ui/eslint.config.js +++ b/tools/ui/eslint.config.js @@ -12,6 +12,107 @@ import { fileURLToPath } from 'node:url'; import ts from 'typescript-eslint'; const gitignorePath = fileURLToPath(new URL('./.gitignore', import.meta.url)); +// Require a blank line between sibling element-like nodes in a Svelte template +// (elements, components, and the {#if} / {#each} / {#await} / {#snippet} / +// {@render} blocks) that sit on separate lines at the same nesting level. +// Whitespace between siblings is a whitespace-only SvelteText node; when it +// holds a single newline (no blank line) the fix adds one, keeping the +// indentation of the second sibling. Real text content (e.g. `foo\n\nbar`) +// is left alone. +const ELEMENT_LIKE_TYPES = new Set([ + 'SvelteAwaitBlock', + 'SvelteComponent', + 'SvelteEachBlock', + 'SvelteElement', + 'SvelteIfBlock', + 'SvelteKeyBlock', + 'SvelteRenderTag', + 'SvelteSelf', + 'SvelteSnippetBlock' +]); +const paddingLineBetweenElements = { + create(context) { + // Check one list of template children. Each children array holds the + // element-like nodes plus the whitespace/comment text between them. + function checkChildren(children) { + if (!Array.isArray(children)) return; + + let lastElement = null; + let lastWhitespace = null; + + for (const child of children) { + if (child.type === 'SvelteText' && /^\s*$/.test(child.value)) { + lastWhitespace = child; + + continue; + } + + if (!ELEMENT_LIKE_TYPES.has(child.type)) continue; + + if ( + lastElement && + lastWhitespace && + child.loc.start.line - lastElement.loc.end.line === 1 + ) { + const textNode = lastWhitespace; + + context.report({ + fix(fixer) { + // Add a second newline so the two siblings are separated by a + // blank line, keeping the trailing indentation. + return fixer.replaceText(textNode, textNode.value.replace(/\n/, '\n\n')); + }, + message: 'Expected a blank line between sibling elements.', + node: child + }); + } + + lastElement = child; + lastWhitespace = null; + } + } + + return { + SvelteAwaitBlock(node) { + checkChildren(node.children); + checkChildren(node.then?.children); + checkChildren(node.else?.children); + }, + SvelteComponent(node) { + checkChildren(node.children); + }, + SvelteEachBlock(node) { + checkChildren(node.children); + checkChildren(node.else?.children); + }, + SvelteElement(node) { + checkChildren(node.children); + }, + SvelteFragment(node) { + checkChildren(node.children); + }, + SvelteIfBlock(node) { + checkChildren(node.children); + checkChildren(node.else?.children); + }, + SvelteKeyBlock(node) { + checkChildren(node.children); + }, + SvelteProgram(node) { + checkChildren(node.children); + }, + SvelteSnippetBlock(node) { + checkChildren(node.children); + } + }; + }, + meta: { + docs: { description: 'Require a blank line between sibling elements in a Svelte template.' }, + fixable: 'whitespace', + schema: [], + type: 'layout' + } +}; // Require a blank line between consecutive class accessors (get/set). The core // `padding-line-between-statements` rule only handles statements, not class // members, so this is enforced with a small custom rule. @@ -66,7 +167,12 @@ export default ts.config( { languageOptions: { globals: { ...globals.browser, ...globals.node } }, plugins: { - local: { rules: { 'blank-line-between-accessors': blankLineBetweenAccessors } }, + local: { + rules: { + 'blank-line-between-accessors': blankLineBetweenAccessors, + 'padding-line-between-elements': paddingLineBetweenElements + } + }, perfectionist, 'simple-import-sort': simpleImportSort }, @@ -82,6 +188,8 @@ export default ts.config( 'eol-last': 'error', // Enforce a blank line between consecutive get/set accessors 'local/blank-line-between-accessors': 'error', + // Require a blank line between sibling elements in a Svelte template + 'local/padding-line-between-elements': 'error', // typescript-eslint strongly recommend that you do not use the no-undef lint rule on TypeScript projects. // see: https://typescript-eslint.io/troubleshooting/faqs/eslint/#i-get-errors-from-the-no-undef-rule-about-global-variables-not-being-defined-even-though-there-are-no-typescript-errors 'no-undef': 'off', @@ -156,9 +264,49 @@ export default ts.config( // grouping); Prettier normalizes comma spacing afterwards. 'simple-import-sort/imports': ['error', { groups: [['.*']] }], 'svelte/no-at-html-tags': 'off', - // This app uses hash-based routing (#/) where resolve() from $app/paths does not apply - 'svelte/no-navigation-without-resolve': 'off' + 'svelte/no-navigation-without-resolve': 'off', + + // Sort HTML attributes alphabetically in the markup. The Svelte directives + // (bind:/use:/animate:/style:/in:/out:/transition:/class:) sort first, + // alphabetically among themselves, then all remaining attributes sort + // alphabetically. The rule keeps spread attributes in place and does not cross + // them. `this` stays first on because Prettier forces it there + // - reordering it alphabetically would fight the formatter. + 'svelte/sort-attributes': [ + 'error', + { + order: [ + 'this', + { + match: [ + '/^bind:/u', + '/^use:/u', + '/^animate:/u', + '/^style:/u', + '/^in:/u', + '/^out:/u', + '/^transition:/u', + '/^class:/u' + ], + sort: 'alphabetical' + }, + { + match: [ + '!/^bind:/u', + '!/^use:/u', + '!/^animate:/u', + '!/^style:/u', + '!/^in:/u', + '!/^out:/u', + '!/^transition:/u', + '!/^class:/u' + ], + sort: 'alphabetical' + } + ] + } + ] } }, { diff --git a/tools/ui/src/lib/components/app/actions/ActionIcon.svelte b/tools/ui/src/lib/components/app/actions/ActionIcon.svelte index e29b5ad67d..0ed22d932c 100644 --- a/tools/ui/src/lib/components/app/actions/ActionIcon.svelte +++ b/tools/ui/src/lib/components/app/actions/ActionIcon.svelte @@ -41,17 +41,17 @@ {#snippet button(props = {})} diff --git a/tools/ui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentsPreview/ChatAttachmentsPreviewThumbnailStrip.svelte b/tools/ui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentsPreview/ChatAttachmentsPreviewThumbnailStrip.svelte index f0ea9675fb..e5ba09dba4 100644 --- a/tools/ui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentsPreview/ChatAttachmentsPreviewThumbnailStrip.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatAttachments/ChatAttachmentsPreview/ChatAttachmentsPreviewThumbnailStrip.svelte @@ -38,16 +38,16 @@ {#each items as item, index (item.id)} {/each} diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddReasoningSubmenu.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddReasoningSubmenu.svelte index a3a0b3a20f..1b6fc4b020 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddReasoningSubmenu.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddReasoningSubmenu.svelte @@ -64,6 +64,7 @@ +

Maximum reasoning effort with extended context usage

 diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte index 2e61bb07dd..2f69dc96de 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActionAdd/ChatFormActionAddSheet.svelte @@ -78,7 +78,7 @@ {@render trigger({ disabled: chatFormActions.disabled, onclick: () => (sheetOpen = true) })} - + Add to chat @@ -90,8 +90,8 @@
{#if reasoning.modelSupportsThinking} (reasoningExpanded = open)} + open={reasoningExpanded} > {#if reasoningExpanded} @@ -120,10 +120,10 @@ {#each reasoning.levels as level (level.value)} {@const tokenLabel = reasoning.tokenLabel(level)} {/each} @@ -330,9 +330,9 @@ {/if} {/snippet} diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte index 118e54a0a2..97351b3a6c 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormActions/ChatFormActions.svelte @@ -188,14 +188,14 @@ {#if showModelSelector} @@ -204,12 +204,12 @@ {#if isReasoning}
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ChatFormContextGauge.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ChatFormContextGauge.svelte index d6bad98dc9..d3bf0446c1 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ChatFormContextGauge.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ChatFormContextGauge.svelte @@ -42,16 +42,16 @@
- +
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetailRow.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetailRow.svelte index 271997b393..572d4a42dd 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetailRow.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetailRow.svelte @@ -11,6 +11,7 @@
{label} + {value}
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetails.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetails.svelte index 1153c70fdd..0de508a619 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetails.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDetails.svelte @@ -57,12 +57,13 @@ {#if cumulativeRead > 0} 0 ? `${cumulativeCacheTotal.toLocaleString()} reused from KV cache` : undefined} + value={`${cumulativeRead.toLocaleString()} tok`} /> {/if} + {#if cumulativeOutput > 0} 0} 0 ? `${currentFresh.toLocaleString()} fresh + ${currentCache.toLocaleString()} cached` : undefined} + value={`${currentRead.toLocaleString()} tok`} /> {/if} @@ -100,6 +101,7 @@
KV cache total + {kvTotal.toLocaleString()} tok
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDial.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDial.svelte index 67d705ae45..32d08323d0 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDial.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeDial.svelte @@ -18,7 +18,7 @@ const strokeWidth = $derived(size === 'md' ? 4 : 3); - + diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeLoadModel.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeLoadModel.svelte index 022e626ae9..4edc72773f 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeLoadModel.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugeLoadModel.svelte @@ -14,11 +14,13 @@ {#if modelId !== null && !isLoading}
Available context size is only visible once the model is loaded. - + +
{:else if isLoading}
+ Loading model...
{/if} diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte index 5d80ecc11b..8fa09cf704 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormContextGauge/ContextGaugePopup.svelte @@ -54,17 +54,19 @@ {#if gaugePopup.open}
Context + · + {formatParameters(gauge.contextUsed)} / {gauge.contextTotal !== null ? formatParameters(gauge.contextTotal) : '-'} @@ -73,8 +75,8 @@ {#if gauge.activeModelId !== null && !gauge.isActiveModelLoaded} {:else if showProgressBar} @@ -91,6 +93,7 @@ {gauge.contextPercent}% used + {formatParameters(gauge.contextAvailable ?? 0)} remaining @@ -101,15 +104,15 @@ {#if gauge.hasAnyUsage} {/if} diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectory.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectory.svelte index 99b7763e35..307d0e702e 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectory.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectory.svelte @@ -323,80 +323,81 @@ - + event.preventDefault()} - onCloseAutoFocus={(event) => event.preventDefault()} class="w-[var(--bits-popover-anchor-width)] max-w-none rounded-xl border-border/50 p-0 shadow-xl" + {customAnchor} + onCloseAutoFocus={(event) => event.preventDefault()} + onOpenAutoFocus={(event) => event.preventDefault()} + onkeydown={handleKeydown} + preventScroll={false} + side="top" + sideOffset={12} >
{#if !fileSearchEnabled}
{searchUnavailableMessage}
{:else if query.trim() && (search.isSearching || queryResults.length > 0 || searchError)} nav.setHover(index)} + rawQuery={query} + results={queryResults} /> {/if} {#if pickerSupported && fileSearchEnabled} {/if} {#if homeBase && fileSearchEnabled} - + Searching in: diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectoryChip.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectoryChip.svelte index 23661d223d..5a7b054cec 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectoryChip.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectoryChip.svelte @@ -29,8 +29,8 @@
@@ -42,6 +42,7 @@ {displayLabel} {/snippet} +

{displayLabelTitle}

 @@ -56,14 +57,14 @@ class="w-0 overflow-hidden opacity-0 transition-[width,opacity] duration-200 ease-out group-hover:w-auto group-hover:opacity-100" >
{/if} diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectoryResultsList.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectoryResultsList.svelte index e8087d967e..db86a4ba49 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectoryResultsList.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormCurrentWorkingDirectory/ChatFormCurrentWorkingDirectoryResultsList.svelte @@ -34,8 +34,8 @@
{#if isSearching && results.length === 0}
Searching...
@@ -48,14 +48,15 @@
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputFileInputInvisible.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputFileInputInvisible.svelte index 395ecb2011..dd90586905 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputFileInputInvisible.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputFileInputInvisible.svelte @@ -24,8 +24,8 @@ diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputRich.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputRich.svelte index 629001bb44..70251ea0cb 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputRich.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormInput/ChatFormInputRich.svelte @@ -808,25 +808,25 @@
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormMcpResourcesList.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormMcpResourcesList.svelte index 18d86bcab6..6513114a43 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormMcpResourcesList.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormMcpResourcesList.svelte @@ -27,8 +27,8 @@ {#each attachments as attachment, i (attachment.id)} handleResourceClick(attachment.resource.uri)} /> diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPicker/ChatFormPickerItemHeader.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPicker/ChatFormPickerItemHeader.svelte index d7c66f0d2d..67e2790df7 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPicker/ChatFormPickerItemHeader.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPicker/ChatFormPickerItemHeader.svelte @@ -21,12 +21,12 @@
{#if faviconUrl} { (e.currentTarget as HTMLImageElement).style.display = 'none'; }} + src={faviconUrl} /> {/if} diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPicker/ChatFormPickerList.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPicker/ChatFormPickerList.svelte index 160c14ce8e..2b3d6167a6 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPicker/ChatFormPickerList.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPicker/ChatFormPickerList.svelte @@ -1,4 +1,4 @@ - +
diff --git a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPickerMcpPrompts/ChatFormPromptPickerArgumentInput.svelte b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPickerMcpPrompts/ChatFormPromptPickerArgumentInput.svelte index 074c69b841..b20c13cdf6 100644 --- a/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPickerMcpPrompts/ChatFormPromptPickerArgumentInput.svelte +++ b/tools/ui/src/lib/components/app/chat/ChatForm/ChatFormPickers/ChatFormPickerMcpPrompts/ChatFormPromptPickerArgumentInput.svelte @@ -36,7 +36,7 @@
-