refactor(editor): extract edgeless legacy slots (#9363)

This commit is contained in:
Saul-Mirone
2024-12-27 04:22:52 +00:00
parent 71272203b0
commit 3ae3ae98c8
24 changed files with 167 additions and 113 deletions

View File

@@ -2,6 +2,7 @@ import type { EditorHost } from '@blocksuite/block-std';
import {
createButtonPopper,
DocModeProvider,
EdgelessLegacySlotIdentifier,
EdgelessRootService,
EditPropsStore,
type NavigatorMode,
@@ -134,14 +135,14 @@ export class FramePanelHeader extends WithDisposable(LitElement) {
private readonly _setEdgelessDisposables = () => {
if (!this._edgelessRootService) return;
const slots = this.editorHost.std.get(EdgelessLegacySlotIdentifier);
this._clearEdgelessDisposables();
this._edgelessDisposables = new DisposableGroup();
this._edgelessDisposables.add(
this._edgelessRootService.slots.navigatorSettingUpdated.on(
({ fillScreen }) => {
this._navigatorMode = fillScreen ? 'fill' : 'fit';
}
)
slots.navigatorSettingUpdated.on(({ fillScreen }) => {
this._navigatorMode = fillScreen ? 'fill' : 'fit';
})
);
};

View File

@@ -1,5 +1,9 @@
import type { EditorHost } from '@blocksuite/block-std';
import { EdgelessRootService, EditPropsStore } from '@blocksuite/blocks';
import {
EdgelessLegacySlotIdentifier,
EdgelessRootService,
EditPropsStore,
} from '@blocksuite/blocks';
import { WithDisposable } from '@blocksuite/global/utils';
import { css, html, LitElement, type PropertyValues } from 'lit';
import { property, state } from 'lit/decorators.js';
@@ -72,16 +76,20 @@ export const AFFINE_FRAMES_SETTING_MENU = 'affine-frames-setting-menu';
export class FramesSettingMenu extends WithDisposable(LitElement) {
static override styles = styles;
get slots() {
return this.editorHost.std.get(EdgelessLegacySlotIdentifier);
}
private readonly _onBlackBackgroundChange = (checked: boolean) => {
this.blackBackground = checked;
this._edgelessRootService?.slots.navigatorSettingUpdated.emit({
this.slots.navigatorSettingUpdated.emit({
blackBackground: this.blackBackground,
});
};
private readonly _onFillScreenChange = (checked: boolean) => {
this.fillScreen = checked;
this._edgelessRootService?.slots.navigatorSettingUpdated.emit({
this.slots.navigatorSettingUpdated.emit({
fillScreen: this.fillScreen,
});
this._editPropsStore.setStorage('presentFillScreen', this.fillScreen);
@@ -89,7 +97,7 @@ export class FramesSettingMenu extends WithDisposable(LitElement) {
private readonly _onHideToolBarChange = (checked: boolean) => {
this.hideToolbar = checked;
this._edgelessRootService?.slots.navigatorSettingUpdated.emit({
this.slots.navigatorSettingUpdated.emit({
hideToolbar: this.hideToolbar,
});
this._editPropsStore.setStorage('presentHideToolbar', this.hideToolbar);
@@ -170,7 +178,7 @@ export class FramesSettingMenu extends WithDisposable(LitElement) {
if (_changedProperties.has('editorHost')) {
if (this._edgelessRootService) {
this.disposables.add(
this._edgelessRootService.slots.navigatorSettingUpdated.on(
this.slots.navigatorSettingUpdated.on(
({ blackBackground, hideToolbar }) => {
if (
blackBackground !== undefined &&