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:
@@ -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
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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),
|
||||||
|
|||||||
@@ -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}
|
||||||
|
|||||||
Reference in New Issue
Block a user