feat(core): remove scrollable-text-renderer's dependency on editor host (#13123)

[AI-260](https://linear.app/affine-design/issue/AI-260)

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

* **Refactor**
* Improved integration of theme support in AI-generated answer
rendering, allowing the renderer to adapt to theme changes dynamically.
* Simplified component interfaces by removing unnecessary dependencies.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
Wu Yue
2025-07-10 11:31:52 +08:00
committed by GitHub
parent 899585ba7f
commit 11a9e67bc1
3 changed files with 17 additions and 9 deletions

View File

@@ -1,5 +1,6 @@
import type { MindmapElementModel } from '@blocksuite/affine/model'; import type { MindmapElementModel } from '@blocksuite/affine/model';
import type { EditorHost } from '@blocksuite/affine/std'; import type { EditorHost } from '@blocksuite/affine/std';
import { ThemeProvider } from '@blocksuite/affine-shared/services';
import { createAIScrollableTextRenderer } from '../components/ai-scrollable-text-renderer'; import { createAIScrollableTextRenderer } from '../components/ai-scrollable-text-renderer';
import { import {
@@ -52,5 +53,11 @@ export function actionToAnswerRenderer<
return createImageRenderer(host, { height: 300 }); return createImageRenderer(host, { height: 300 });
} }
return createAIScrollableTextRenderer(host, {}, 320, true); return createAIScrollableTextRenderer(
{
theme: host.std.get(ThemeProvider).app$,
},
320,
true
);
} }

View File

@@ -11,6 +11,7 @@ import {
} from '@blocksuite/affine/shared/utils'; } from '@blocksuite/affine/shared/utils';
import type { EditorHost } from '@blocksuite/affine/std'; import type { EditorHost } from '@blocksuite/affine/std';
import { GfxControllerIdentifier } from '@blocksuite/affine/std/gfx'; import { GfxControllerIdentifier } from '@blocksuite/affine/std/gfx';
import { ThemeProvider } from '@blocksuite/affine-shared/services';
import { import {
ChatWithAiIcon, ChatWithAiIcon,
DeleteIcon, DeleteIcon,
@@ -306,7 +307,13 @@ export function buildAIPanelConfig(
const ctx = new AIContext(); const ctx = new AIContext();
const searchService = framework.get(AINetworkSearchService); const searchService = framework.get(AINetworkSearchService);
return { return {
answerRenderer: createAIScrollableTextRenderer(panel.host, {}, 320, true), answerRenderer: createAIScrollableTextRenderer(
{
theme: panel.host.std.get(ThemeProvider).app$,
},
320,
true
),
finishStateConfig: buildFinishConfig(panel, 'chat', ctx), finishStateConfig: buildFinishConfig(panel, 'chat', ctx),
generatingStateConfig: buildGeneratingConfig(), generatingStateConfig: buildGeneratingConfig(),
errorStateConfig: buildErrorConfig(panel), errorStateConfig: buildErrorConfig(panel),

View File

@@ -1,6 +1,6 @@
import { WithDisposable } from '@blocksuite/affine/global/lit'; import { WithDisposable } from '@blocksuite/affine/global/lit';
import { scrollbarStyle } from '@blocksuite/affine/shared/styles'; import { scrollbarStyle } from '@blocksuite/affine/shared/styles';
import { type EditorHost, ShadowlessElement } from '@blocksuite/affine/std'; import { ShadowlessElement } from '@blocksuite/affine/std';
import type { PropertyValues } from 'lit'; import type { PropertyValues } from 'lit';
import { css, html } from 'lit'; import { css, html } from 'lit';
import { property, query } from 'lit/decorators.js'; import { property, query } from 'lit/decorators.js';
@@ -81,9 +81,6 @@ export class AIScrollableTextRenderer extends WithDisposable(
@property({ attribute: false }) @property({ attribute: false })
accessor answer!: string; accessor answer!: string;
@property({ attribute: false })
accessor host!: EditorHost;
@property({ attribute: false }) @property({ attribute: false })
accessor state: AffineAIPanelState | undefined; accessor state: AffineAIPanelState | undefined;
@@ -101,19 +98,16 @@ export class AIScrollableTextRenderer extends WithDisposable(
} }
export const createAIScrollableTextRenderer: ( export const createAIScrollableTextRenderer: (
host: EditorHost,
textRendererOptions: TextRendererOptions, textRendererOptions: TextRendererOptions,
maxHeight: number, maxHeight: number,
autoScroll: boolean autoScroll: boolean
) => AffineAIPanelWidgetConfig['answerRenderer'] = ( ) => AffineAIPanelWidgetConfig['answerRenderer'] = (
host,
textRendererOptions, textRendererOptions,
maxHeight, maxHeight,
autoScroll autoScroll
) => { ) => {
return (answer: string, state: AffineAIPanelState | undefined) => { return (answer: string, state: AffineAIPanelState | undefined) => {
return html`<ai-scrollable-text-renderer return html`<ai-scrollable-text-renderer
.host=${host}
.answer=${answer} .answer=${answer}
.state=${state} .state=${state}
.textRendererOptions=${textRendererOptions} .textRendererOptions=${textRendererOptions}