Jayden/AFFiNE-Mirror
1
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-02-15 05:37:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat(editor): unify block props api (#10888)

Browse Source 
Closes: [BS-2707](https://linear.app/affine-design/issue/BS-2707/统一使用props获取和更新block-prop)
This commit is contained in:
Saul-Mirone
2025-03-16 05:48:34 +00:00
parent 8f9e5bf0aa
commit 26285f7dcb
193 changed files with 1019 additions and 891 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
blocksuite/affine/blocks/block-note/src/commands/change-note-display-mode.ts
View File

@@ -12,7 +12,7 @@ export const changeNoteDisplayMode: Command<{
const noteBlockModel = std.store.getBlock(noteId)?.model;
if (!noteBlockModel || !matchModels(noteBlockModel, [NoteBlockModel])) return;
const currentMode = noteBlockModel.displayMode;
const currentMode = noteBlockModel.props.displayMode;
if (currentMode === mode) return;
if (stopCapture) std.store.captureSync();
@@ -29,10 +29,10 @@ export const changeNoteDisplayMode: Command<{
matchModels(child, [NoteBlockModel])
);
const firstEdgelessOnlyNote = notes.find(
note => note.displayMode === NoteDisplayMode.EdgelessOnly
note => note.props.displayMode === NoteDisplayMode.EdgelessOnly
);
const lastPageVisibleNote = notes.findLast(
note => note.displayMode !== NoteDisplayMode.EdgelessOnly
note => note.props.displayMode !== NoteDisplayMode.EdgelessOnly
);
if (currentMode === NoteDisplayMode.EdgelessOnly) {

4
blocksuite/affine/blocks/block-note/src/commands/dedent-block.ts
View File

@@ -47,8 +47,8 @@ export const dedentBlock: Command<{
if (
matchModels(model, [ParagraphBlockModel]) &&
model.type.startsWith('h') &&
model.collapsed
model.props.type.startsWith('h') &&
model.props.collapsed
) {
const collapsedSiblings = calculateCollapsedSiblings(model);
store.moveBlocks([model, ...collapsedSiblings], grandParent, parent, false);

4
blocksuite/affine/blocks/block-note/src/commands/dedent-blocks.ts
View File

@@ -59,8 +59,8 @@ export const dedentBlocks: Command<{
if (!model) return;
if (
matchModels(model, [ParagraphBlockModel]) &&
model.type.startsWith('h') &&
model.collapsed
model.props.type.startsWith('h') &&
model.props.collapsed
) {
const collapsedSiblings = calculateCollapsedSiblings(model);
collapsedIds.push(...collapsedSiblings.map(sibling => sibling.id));

6
blocksuite/affine/blocks/block-note/src/commands/indent-block.ts
View File

@@ -51,8 +51,8 @@ export const indentBlock: Command<{
if (
matchModels(model, [ParagraphBlockModel]) &&
model.type.startsWith('h') &&
model.collapsed
model.props.type.startsWith('h') &&
model.props.collapsed
) {
const collapsedSiblings = calculateCollapsedSiblings(model);
store.moveBlocks([model, ...collapsedSiblings], previousSibling);
@@ -63,7 +63,7 @@ export const indentBlock: Command<{
// update collapsed state of affine list
if (
matchModels(previousSibling, [ListBlockModel]) &&
previousSibling.collapsed
previousSibling.props.collapsed
) {
store.updateBlock(previousSibling, {
collapsed: false,

8
blocksuite/affine/blocks/block-note/src/commands/indent-blocks.ts
View File

@@ -60,8 +60,8 @@ export const indentBlocks: Command<{
if (!model) return;
if (
matchModels(model, [ParagraphBlockModel]) &&
model.type.startsWith('h') &&
model.collapsed
model.props.type.startsWith('h') &&
model.props.collapsed
) {
const collapsedSiblings = calculateCollapsedSiblings(model);
collapsedIds.push(...collapsedSiblings.map(sibling => sibling.id));
@@ -85,7 +85,7 @@ export const indentBlocks: Command<{
if (
nearestHeading &&
matchModels(nearestHeading, [ParagraphBlockModel]) &&
nearestHeading.collapsed
nearestHeading.props.collapsed
) {
store.updateBlock(nearestHeading, { collapsed: false });
}
@@ -106,7 +106,7 @@ export const indentBlocks: Command<{
if (
nearestHeading &&
matchModels(nearestHeading, [ParagraphBlockModel]) &&
nearestHeading.collapsed
nearestHeading.props.collapsed
) {
store.updateBlock(nearestHeading, { collapsed: false });
}

4
blocksuite/affine/blocks/block-note/src/components/edgeless-note-background.ts
View File

@@ -44,13 +44,13 @@ export class EdgelessNoteBackground extends SignalWatcher(
const themeProvider = this.std.get(ThemeProvider);
const theme = themeProvider.theme$.value;
const backgroundColor = themeProvider.generateColorProperty(
this.note.background$.value,
this.note.props.background$.value,
DefaultTheme.noteBackgrounColor,
theme
);
const { borderRadius, borderSize, borderStyle, shadowType } =
this.note.edgeless$.value.style;
this.note.props.edgeless$.value.style;
return {
borderRadius: borderRadius + 'px',

6
blocksuite/affine/blocks/block-note/src/components/edgeless-note-mask.ts
View File

@@ -15,9 +15,9 @@ export class EdgelessNoteMask extends SignalWatcher(
const maskDOM = this.renderRoot!.querySelector('.affine-note-mask');
const observer = new ResizeObserver(entries => {
for (const entry of entries) {
if (!this.model.edgeless.collapse) {
if (!this.model.props.edgeless.collapse) {
const bound = Bound.deserialize(this.model.xywh);
const scale = this.model.edgeless.scale ?? 1;
const scale = this.model.props.edgeless.scale ?? 1;
const height = entry.contentRect.height * scale;
if (!height || almostEqual(bound.h, height)) {
@@ -53,7 +53,7 @@ export class EdgelessNoteMask extends SignalWatcher(
zIndex: '1',
pointerEvents: this.editing || this.disableMask ? 'none' : 'auto',
borderRadius: `${
this.model.edgeless.style.borderRadius * this.zoom
this.model.props.edgeless.style.borderRadius * this.zoom
}px`,
})}
></div>

22
blocksuite/affine/blocks/block-note/src/note-edgeless-block.ts
View File

@@ -25,7 +25,7 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
) {
private get _isShowCollapsedContent() {
return (
this.model.edgeless.collapse &&
this.model.props.edgeless.collapse &&
this.gfx.selection.has(this.model.id) &&
!this._dragging &&
(this._isResizing || this._isHover)
@@ -41,7 +41,7 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
return nothing;
}
const { xywh, edgeless } = this.model;
const { xywh, edgeless } = this.model.props;
const { borderSize } = edgeless.style;
const extraPadding = this._editing ? ACTIVE_NOTE_EXTRA_PADDING : 0;
@@ -100,19 +100,19 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
private _setCollapse(event: MouseEvent) {
event.stopImmediatePropagation();
const { collapse, collapsedHeight } = this.model.edgeless;
const { collapse, collapsedHeight } = this.model.props.edgeless;
if (collapse) {
this.model.doc.updateBlock(this.model, () => {
this.model.edgeless.collapse = false;
this.model.props.edgeless.collapse = false;
});
} else if (collapsedHeight) {
const { xywh, edgeless } = this.model;
const { xywh, edgeless } = this.model.props;
const bound = Bound.deserialize(xywh);
bound.h = collapsedHeight * (edgeless.scale ?? 1);
this.model.doc.updateBlock(this.model, () => {
this.model.edgeless.collapse = true;
this.model.xywh = bound.serialize();
this.model.props.edgeless.collapse = true;
this.model.props.xywh = bound.serialize();
});
}
@@ -164,7 +164,7 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
const rect = this._noteContent?.getBoundingClientRect();
if (!rect) return;
const zoom = this.gfx.viewport.zoom;
const scale = this.model.edgeless.scale ?? 1;
const scale = this.model.props.edgeless.scale ?? 1;
this._noteFullHeight =
rect.height / scale / zoom + 2 * EDGELESS_BLOCK_CHILD_PADDING;
});
@@ -184,7 +184,7 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
}
override getRenderingRect() {
const { xywh, edgeless } = this.model;
const { xywh, edgeless } = this.model.props;
const { collapse, scale = 1 } = edgeless;
const bound = Bound.deserialize(xywh);
@@ -202,11 +202,11 @@ export class EdgelessNoteBlockComponent extends toGfxBlockComponent(
override renderGfxBlock() {
const { model } = this;
const { displayMode } = model;
const { displayMode } = model.props;
if (!!displayMode && displayMode === NoteDisplayMode.DocOnly)
return nothing;
const { xywh, edgeless } = model;
const { xywh, edgeless } = model.props;
const { borderRadius } = edgeless.style;
const { collapse = false, collapsedHeight, scale = 1 } = edgeless;