feat(editor): show doc title in page block (#9975)

Close [BS-2392](https://linear.app/affine-design/issue/BS-2392/page-block-需要显示文章title)

### What Changes
- Add `<doc-title>` to edgeless page block (a.k.a the first page visible note block)
- Refactors:
  - Move `<doc-title>` to `@blocksuite/affine-component`, but you can aslo import it from `@blocksuite/preset`
  - Extract `<edgeless-note-mask>` and `<edgeless-note-background>` from `<affine-edgeless-note>` to a seperate file
  - Rewrite styles of `<affine-edgeless-note>` with `@vanilla-extract/css`

https://github.com/user-attachments/assets/a0c03239-803e-4bfa-b30e-33b919213b12
This commit is contained in:
L-Sun
2025-02-06 21:18:27 +00:00
parent 41107eafae
commit 891d9df0b1
33 changed files with 626 additions and 337 deletions

View File

@@ -1,15 +1,18 @@
import { EdgelessNoteBackground } from './components/edgeless-note-background';
import { EdgelessNoteMask } from './components/edgeless-note-mask';
import type { NoteConfig } from './config';
import { NoteBlockComponent } from './note-block';
import {
AFFINE_EDGELESS_NOTE,
EdgelessNoteBlockComponent,
EdgelessNoteMask,
} from './note-edgeless-block';
import type { NoteBlockService } from './note-service';
export function effects() {
customElements.define('affine-note', NoteBlockComponent);
customElements.define(AFFINE_EDGELESS_NOTE, EdgelessNoteBlockComponent);
customElements.define('edgeless-note-mask', EdgelessNoteMask);
customElements.define('affine-edgeless-note', EdgelessNoteBlockComponent);
customElements.define('edgeless-note-background', EdgelessNoteBackground);
}
declare global {