mirror of
https://github.com/toeverything/AFFiNE.git
synced 2026-07-21 20:16:26 +08:00
fe5f0f62ec
This PR performs a significant architectural refactoring by extracting rich text functionality into a dedicated package. Here are the key changes: 1. **New Package Creation** - Created a new package `@blocksuite/affine-rich-text` to house rich text related functionality - Moved rich text components, utilities, and types from `@blocksuite/affine-components` to this new package 2. **Dependency Updates** - Updated multiple block packages to include the new `@blocksuite/affine-rich-text` as a direct dependency: - block-callout - block-code - block-database - block-edgeless-text - block-embed - block-list - block-note - block-paragraph 3. **Import Path Updates** - Refactored all imports that previously referenced rich text functionality from `@blocksuite/affine-components/rich-text` to now use `@blocksuite/affine-rich-text` - Updated imports for components like: - DefaultInlineManagerExtension - RichText types and interfaces - Text manipulation utilities (focusTextModel, textKeymap, etc.) - Reference node components and providers 4. **Build Configuration Updates** - Added references to the new rich text package in the `tsconfig.json` files of all affected packages - Maintained workspace dependencies using the `workspace:*` version specifier The primary motivation appears to be: 1. Better separation of concerns by isolating rich text functionality 2. Improved maintainability through more modular package structure 3. Clearer dependencies between packages 4. Potential for better tree-shaking and bundle optimization This is primarily an architectural improvement that should make the codebase more maintainable and better organized.
83 lines
2.4 KiB
TypeScript
83 lines
2.4 KiB
TypeScript
import { CodeBlockSchema, ColorScheme } from '@blocksuite/affine-model';
|
|
import { textKeymap } from '@blocksuite/affine-rich-text';
|
|
import { ThemeProvider } from '@blocksuite/affine-shared/services';
|
|
import { BlockService } from '@blocksuite/block-std';
|
|
import { type Signal, signal } from '@preact/signals-core';
|
|
import {
|
|
bundledLanguagesInfo,
|
|
createHighlighterCore,
|
|
createOnigurumaEngine,
|
|
type HighlighterCore,
|
|
type MaybeGetter,
|
|
} from 'shiki';
|
|
import getWasm from 'shiki/wasm';
|
|
|
|
import { CodeBlockConfigExtension } from './code-block-config.js';
|
|
import {
|
|
CODE_BLOCK_DEFAULT_DARK_THEME,
|
|
CODE_BLOCK_DEFAULT_LIGHT_THEME,
|
|
} from './highlight/const.js';
|
|
|
|
export class CodeBlockService extends BlockService {
|
|
static override readonly flavour = CodeBlockSchema.model.flavour;
|
|
|
|
private _darkThemeKey: string | undefined;
|
|
|
|
private _lightThemeKey: string | undefined;
|
|
|
|
highlighter$: Signal<HighlighterCore | null> = signal(null);
|
|
|
|
get langs() {
|
|
return (
|
|
this.std.getOptional(CodeBlockConfigExtension.identifier)?.langs ??
|
|
bundledLanguagesInfo
|
|
);
|
|
}
|
|
|
|
get themeKey() {
|
|
const theme = this.std.get(ThemeProvider).theme$.value;
|
|
return theme === ColorScheme.Dark
|
|
? this._darkThemeKey
|
|
: this._lightThemeKey;
|
|
}
|
|
|
|
override mounted(): void {
|
|
super.mounted();
|
|
|
|
this.bindHotKey(textKeymap(this.std));
|
|
|
|
createHighlighterCore({
|
|
engine: createOnigurumaEngine(() => getWasm),
|
|
})
|
|
.then(async highlighter => {
|
|
const config = this.std.getOptional(
|
|
CodeBlockConfigExtension.identifier
|
|
);
|
|
const darkTheme = config?.theme?.dark ?? CODE_BLOCK_DEFAULT_DARK_THEME;
|
|
const lightTheme =
|
|
config?.theme?.light ?? CODE_BLOCK_DEFAULT_LIGHT_THEME;
|
|
|
|
this._darkThemeKey = (await normalizeGetter(darkTheme)).name;
|
|
this._lightThemeKey = (await normalizeGetter(lightTheme)).name;
|
|
|
|
await highlighter.loadTheme(darkTheme, lightTheme);
|
|
|
|
this.highlighter$.value = highlighter;
|
|
|
|
this.disposables.add(() => {
|
|
highlighter.dispose();
|
|
});
|
|
})
|
|
.catch(console.error);
|
|
}
|
|
}
|
|
|
|
/**
|
|
* https://github.com/shikijs/shiki/blob/933415cdc154fe74ccfb6bbb3eb6a7b7bf183e60/packages/core/src/internal.ts#L31
|
|
*/
|
|
export async function normalizeGetter<T>(p: MaybeGetter<T>): Promise<T> {
|
|
return Promise.resolve(typeof p === 'function' ? (p as any)() : p).then(
|
|
r => r.default || r
|
|
);
|
|
}
|