refactor(editor): extract frame block (#9322)

This commit is contained in:
Saul-Mirone
2024-12-26 04:45:11 +00:00
parent fad0237d94
commit fc5999a482
16 changed files with 130 additions and 14 deletions
@@ -0,0 +1,42 @@
{
"name": "@blocksuite/affine-block-frame",
"description": "Frame block for BlockSuite.",
"type": "module",
"scripts": {
"build": "tsc",
"test:unit": "nx vite:test --run --passWithNoTests",
"test:unit:coverage": "nx vite:test --run --coverage",
"test:e2e": "playwright test"
},
"sideEffects": false,
"keywords": [],
"author": "toeverything",
"license": "MIT",
"dependencies": {
"@blocksuite/affine-components": "workspace:*",
"@blocksuite/affine-model": "workspace:*",
"@blocksuite/affine-shared": "workspace:*",
"@blocksuite/block-std": "workspace:*",
"@blocksuite/global": "workspace:*",
"@blocksuite/inline": "workspace:*",
"@blocksuite/store": "workspace:*",
"@floating-ui/dom": "^1.6.10",
"@lit/context": "^1.1.2",
"@preact/signals-core": "^1.8.0",
"@toeverything/theme": "^1.1.1",
"@types/mdast": "^4.0.4",
"lit": "^3.2.0",
"minimatch": "^10.0.1",
"zod": "^3.23.8"
},
"exports": {
".": "./src/index.ts",
"./effects": "./src/effects.ts"
},
"files": [
"src",
"dist",
"!src/__tests__",
"!dist/__tests__"
]
}
@@ -0,0 +1,5 @@
import { FrameBlockComponent } from './frame-block';
export function effects() {
customElements.define('affine-frame', FrameBlockComponent);
}
@@ -7,13 +7,7 @@ import { html } from 'lit';
import { state } from 'lit/decorators.js';
import { styleMap } from 'lit/directives/style-map.js';
import type { EdgelessRootService } from '../root-block/index.js';
export class FrameBlockComponent extends GfxBlockComponent<FrameBlockModel> {
get rootService() {
return this.std.getService('affine:page') as EdgelessRootService;
}
override connectedCallback() {
super.connectedCallback();
@@ -59,13 +53,13 @@ export class FrameBlockComponent extends GfxBlockComponent<FrameBlockModel> {
}
override renderGfxBlock() {
const { model, showBorder, rootService, std } = this;
const { model, showBorder, std } = this;
const backgroundColor = std
.get(ThemeProvider)
.generateColorProperty(model.background, '--affine-platte-transparent');
const _isNavigator =
this.gfx.tool.currentToolName$.value === 'frameNavigator';
const frameIndex = rootService.layer.getZIndex(model);
const frameIndex = this.gfx.layer.getZIndex(model);
return html`
<div
@@ -0,0 +1,32 @@
{
"extends": "../../tsconfig.json",
"compilerOptions": {
"rootDir": "./src/",
"outDir": "./dist/",
"noEmit": false
},
"include": ["./src"],
"references": [
{
"path": "../../framework/global"
},
{
"path": "../../framework/store"
},
{
"path": "../../framework/block-std"
},
{
"path": "../../framework/inline"
},
{
"path": "../model"
},
{
"path": "../components"
},
{
"path": "../shared"
}
]
}
+1
View File
@@ -17,6 +17,7 @@
"@blocksuite/affine-block-attachment": "workspace:*",
"@blocksuite/affine-block-bookmark": "workspace:*",
"@blocksuite/affine-block-embed": "workspace:*",
"@blocksuite/affine-block-frame": "workspace:*",
"@blocksuite/affine-block-image": "workspace:*",
"@blocksuite/affine-block-list": "workspace:*",
"@blocksuite/affine-block-note": "workspace:*",
@@ -1,7 +1,7 @@
import { FrameBlockSpec } from '@blocksuite/affine-block-frame';
import { EdgelessSurfaceBlockSpec } from '@blocksuite/affine-block-surface';
import { EdgelessTextBlockSpec } from '../../edgeless-text-block/index.js';
import { FrameBlockSpec } from '../../frame-block/frame-spec.js';
import { LatexBlockSpec } from '../../latex-block/latex-spec.js';
import { EdgelessRootBlockSpec } from '../../root-block/edgeless/edgeless-root-spec.js';
import { EdgelessSurfaceRefBlockSpec } from '../../surface-ref-block/surface-ref-spec.js';
@@ -1,3 +1,4 @@
import { FrameBlockSpec } from '@blocksuite/affine-block-frame';
import {
ConnectionOverlay,
EdgelessSurfaceBlockSpec,
@@ -6,7 +7,6 @@ import { FontLoaderService } from '@blocksuite/affine-shared/services';
import type { ExtensionType } from '@blocksuite/block-std';
import { EdgelessTextBlockSpec } from '../../edgeless-text-block/edgeless-text-spec.js';
import { FrameBlockSpec } from '../../frame-block/frame-spec.js';
import { LatexBlockSpec } from '../../latex-block/latex-spec.js';
import { EdgelessRootBlockSpec } from '../../root-block/edgeless/edgeless-root-spec.js';
import {
@@ -1,3 +1,4 @@
import { FrameBlockSpec } from '@blocksuite/affine-block-frame';
import {
EdgelessSurfaceBlockSpec,
PageSurfaceBlockSpec,
@@ -18,7 +19,6 @@ import {
import { literal } from 'lit/static-html.js';
import { EdgelessTextBlockSpec } from '../../edgeless-text-block/index.js';
import { FrameBlockSpec } from '../../frame-block/frame-spec.js';
import { LatexBlockSpec } from '../../latex-block/latex-spec.js';
import { PreviewEdgelessRootBlockSpec } from '../../root-block/edgeless/edgeless-root-spec.js';
import { PageRootService } from '../../root-block/page/page-root-service.js';
+2 -2
View File
@@ -1,6 +1,7 @@
import { effects as blockAttachmentEffects } from '@blocksuite/affine-block-attachment/effects';
import { effects as blockBookmarkEffects } from '@blocksuite/affine-block-bookmark/effects';
import { effects as blockEmbedEffects } from '@blocksuite/affine-block-embed/effects';
import { effects as blockFrameEffects } from '@blocksuite/affine-block-frame/effects';
import { effects as blockImageEffects } from '@blocksuite/affine-block-image/effects';
import { effects as blockListEffects } from '@blocksuite/affine-block-list/effects';
import { effects as blockNoteEffects } from '@blocksuite/affine-block-note/effects';
@@ -64,7 +65,6 @@ import {
import { DividerBlockComponent } from './divider-block/index.js';
import type { insertEdgelessTextCommand } from './edgeless-text-block/commands/insert-edgeless-text.js';
import { EdgelessTextBlockComponent } from './edgeless-text-block/index.js';
import { FrameBlockComponent } from './frame-block/index.js';
import { effects as blockLatexEffects } from './latex-block/effects.js';
import { LatexBlockComponent } from './latex-block/index.js';
import { EdgelessAutoCompletePanel } from './root-block/edgeless/components/auto-complete/auto-complete-panel.js';
@@ -251,6 +251,7 @@ export function effects() {
blockNoteEffects();
blockAttachmentEffects();
blockBookmarkEffects();
blockFrameEffects();
blockListEffects();
blockParagraphEffects();
blockEmbedEffects();
@@ -302,7 +303,6 @@ export function effects() {
customElements.define('affine-preview-root', PreviewRootBlockComponent);
customElements.define('affine-code', CodeBlockComponent);
customElements.define('mini-mindmap-preview', MiniMindmapPreview);
customElements.define('affine-frame', FrameBlockComponent);
customElements.define('mini-mindmap-surface-block', MindmapSurfaceBlock);
customElements.define('affine-data-view', DataViewBlockComponent);
customElements.define('affine-edgeless-root', EdgelessRootBlockComponent);
+1 -1
View File
@@ -21,7 +21,6 @@ export * from './data-view-block/index.js';
export * from './database-block/index.js';
export * from './divider-block/index.js';
export * from './edgeless-text-block/index.js';
export * from './frame-block/index.js';
export * from './latex-block/index.js';
export { EdgelessTemplatePanel } from './root-block/edgeless/components/toolbar/template/template-panel.js';
export type {
@@ -49,6 +48,7 @@ export * from './surface-ref-block/index.js';
export * from '@blocksuite/affine-block-attachment';
export * from '@blocksuite/affine-block-bookmark';
export * from '@blocksuite/affine-block-embed';
export * from '@blocksuite/affine-block-frame';
export * from '@blocksuite/affine-block-image';
export * from '@blocksuite/affine-block-list';
export * from '@blocksuite/affine-block-note';
+3
View File
@@ -37,6 +37,9 @@
{
"path": "../affine/block-embed"
},
{
"path": "../affine/block-frame"
},
{
"path": "../affine/block-note"
},
+15
View File
@@ -55,6 +55,19 @@ export const PackageList = [
'blocksuite/framework/store',
],
},
{
location: 'blocksuite/affine/block-frame',
name: '@blocksuite/affine-block-frame',
workspaceDependencies: [
'blocksuite/affine/components',
'blocksuite/affine/model',
'blocksuite/affine/shared',
'blocksuite/framework/block-std',
'blocksuite/framework/global',
'blocksuite/framework/inline',
'blocksuite/framework/store',
],
},
{
location: 'blocksuite/affine/block-image',
name: '@blocksuite/affine-block-image',
@@ -182,6 +195,7 @@ export const PackageList = [
'blocksuite/affine/block-attachment',
'blocksuite/affine/block-bookmark',
'blocksuite/affine/block-embed',
'blocksuite/affine/block-frame',
'blocksuite/affine/block-image',
'blocksuite/affine/block-list',
'blocksuite/affine/block-note',
@@ -519,6 +533,7 @@ export type PackageName =
| '@blocksuite/affine-block-attachment'
| '@blocksuite/affine-block-bookmark'
| '@blocksuite/affine-block-embed'
| '@blocksuite/affine-block-frame'
| '@blocksuite/affine-block-image'
| '@blocksuite/affine-block-list'
| '@blocksuite/affine-block-note'
+1
View File
@@ -10,6 +10,7 @@
{ "path": "./blocksuite/affine/block-attachment" },
{ "path": "./blocksuite/affine/block-bookmark" },
{ "path": "./blocksuite/affine/block-embed" },
{ "path": "./blocksuite/affine/block-frame" },
{ "path": "./blocksuite/affine/block-image" },
{ "path": "./blocksuite/affine/block-list" },
{ "path": "./blocksuite/affine/block-note" },
+23
View File
@@ -3295,6 +3295,28 @@ __metadata:
languageName: unknown
linkType: soft
"@blocksuite/affine-block-frame@workspace:*, @blocksuite/affine-block-frame@workspace:blocksuite/affine/block-frame":
version: 0.0.0-use.local
resolution: "@blocksuite/affine-block-frame@workspace:blocksuite/affine/block-frame"
dependencies:
"@blocksuite/affine-components": "workspace:*"
"@blocksuite/affine-model": "workspace:*"
"@blocksuite/affine-shared": "workspace:*"
"@blocksuite/block-std": "workspace:*"
"@blocksuite/global": "workspace:*"
"@blocksuite/inline": "workspace:*"
"@blocksuite/store": "workspace:*"
"@floating-ui/dom": "npm:^1.6.10"
"@lit/context": "npm:^1.1.2"
"@preact/signals-core": "npm:^1.8.0"
"@toeverything/theme": "npm:^1.1.1"
"@types/mdast": "npm:^4.0.4"
lit: "npm:^3.2.0"
minimatch: "npm:^10.0.1"
zod: "npm:^3.23.8"
languageName: unknown
linkType: soft
"@blocksuite/affine-block-image@workspace:*, @blocksuite/affine-block-image@workspace:blocksuite/affine/block-image":
version: 0.0.0-use.local
resolution: "@blocksuite/affine-block-image@workspace:blocksuite/affine/block-image"
@@ -3535,6 +3557,7 @@ __metadata:
"@blocksuite/affine-block-attachment": "workspace:*"
"@blocksuite/affine-block-bookmark": "workspace:*"
"@blocksuite/affine-block-embed": "workspace:*"
"@blocksuite/affine-block-frame": "workspace:*"
"@blocksuite/affine-block-image": "workspace:*"
"@blocksuite/affine-block-list": "workspace:*"
"@blocksuite/affine-block-note": "workspace:*"