feat(editor): flat block data (#9854)

Flat block data.

A new block type to flatten the block data

```typescript
// For developers
type Model = {
  blocks: Record<string, {
    flavour: string;
    cells: Record<string, {
      rowId: string;
      colId: string;
      text: Text;
    }>;
    cols: Record<string, {
      align: string;
    }>
    rows: Record<string, {
      backgroundColor: string;
    }>
  }>
}

// How it's saved in yjs
const yData = {
  blocks: {
    'blockId1': {
      flavour: 'affine:table',
      'prop:rows:row1:backgroundColor': 'white',
      'prop:cols:col1:align': 'left',
      'prop:cells:cell1:rowId': 'row1',
      'prop:cells:cell1:colId': 'col1',
      'prop:cells:cell1:text': YText,
      prop:children: []
    },
  }
}
```
This commit is contained in:
Saul-Mirone
2025-01-25 12:57:21 +00:00
parent 9c5375ca06
commit 1858947e0c
17 changed files with 1189 additions and 389 deletions
@@ -2,16 +2,12 @@ import { BlockSuiteError, ErrorCode } from '@blocksuite/global/exceptions';
import type { YArrayEvent, YMapEvent } from 'yjs';
import { Array as YArray, Map as YMap } from 'yjs';
import { BaseReactiveYData } from './base-reactive-data.js';
import { Boxed, type OnBoxedChange } from './boxed.js';
import { proxies } from './memory.js';
import { native2Y, y2Native } from './native-y.js';
import { type OnTextChange, Text } from './text.js';
import type { UnRecord } from './utils.js';
import { BaseReactiveYData, native2Y, y2Native } from './utils.js';
export type ProxyOptions<T> = {
onChange?: (data: T) => void;
};
const proxies = new WeakMap<any, BaseReactiveYData<any, any>>();
import type { ProxyOptions, TransformOptions, UnRecord } from './types.js';
export class ReactiveYArray extends BaseReactiveYData<
unknown[],
@@ -298,60 +294,34 @@ export function createYProxy<Data>(
return proxies.get(yAbstract)!.proxy as Data;
}
return y2Native(yAbstract, {
transform: (value, origin) => {
if (value instanceof Text) {
value.bind(options.onChange as OnTextChange);
return value;
}
if (Boxed.is(origin)) {
(value as Boxed).bind(options.onChange as OnBoxedChange);
return value;
}
if (origin instanceof YArray) {
const data = new ReactiveYArray(
value as unknown[],
origin,
options as ProxyOptions<unknown[]>
);
return data.proxy;
}
if (origin instanceof YMap) {
const data = new ReactiveYMap(
value as UnRecord,
origin,
options as ProxyOptions<UnRecord>
);
return data.proxy;
}
const transform: TransformOptions['transform'] = (value, origin) => {
if (value instanceof Text) {
value.bind(options.onChange as OnTextChange);
return value;
},
}) as Data;
}
}
if (Boxed.is(origin)) {
(value as Boxed).bind(options.onChange as OnBoxedChange);
return value;
}
if (origin instanceof YArray) {
const data = new ReactiveYArray(
value as unknown[],
origin,
options as ProxyOptions<unknown[]>
);
return data.proxy;
}
if (origin instanceof YMap) {
const data = new ReactiveYMap(
value as UnRecord,
origin,
options as ProxyOptions<UnRecord>
);
return data.proxy;
}
export function stashProp(yMap: YMap<unknown>, prop: string): void;
export function stashProp(yMap: YArray<unknown>, prop: number): void;
export function stashProp(yAbstract: unknown, prop: string | number) {
const proxy = proxies.get(yAbstract);
if (!proxy) {
throw new BlockSuiteError(
ErrorCode.ReactiveProxyError,
'YData is not subscribed before changes'
);
}
proxy.stash(prop);
}
return value;
};
export function popProp(yMap: YMap<unknown>, prop: string): void;
export function popProp(yMap: YArray<unknown>, prop: number): void;
export function popProp(yAbstract: unknown, prop: string | number) {
const proxy = proxies.get(yAbstract);
if (!proxy) {
throw new BlockSuiteError(
ErrorCode.ReactiveProxyError,
'YData is not subscribed before changes'
);
}
proxy.pop(prop);
return y2Native(yAbstract, { transform }) as Data;
}