refactor(docs-ui): remove unused files and update configuration structure (#6675)

examples/src/docs/main.ts

@@ -57,11 +57,6 @@ univer.registerPlugin(UniverUIPlugin, {
 univer.registerPlugin(UniverDocsPlugin);
 univer.registerPlugin(UniverDocsUIPlugin, {
     container: 'univerdoc',
-    layout: {
-        docContainerConfig: {
-            innerLeft: false,
-        },
-    },
 });
 
 univer.registerPlugin(UniverDocsDrawingUIPlugin);

packages/docs-ui/src/basics/const/default-univer-doc-config.ts

@@ -1,47 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export const DefaultToolbarConfig = {
-    undo: true,
-    redo: true, // Undo redo
-    font: true, // 'font'
-    fontSize: true, // 'Font size'
-    bold: true, // 'Bold (Ctrl+B)'
-    italic: true, // 'Italic (Ctrl+I)'
-    strikethrough: true, // 'Strikethrough (Alt+Shift+5)'
-    underline: true, // 'Underline (Alt+Shift+6)'
-    textColor: true, // 'Text color'
-    fillColor: true, // 'Cell color'
-    horizontalAlignMode: true, // 'Horizontal alignment'
-    verticalAlignMode: true, // 'Vertical alignment'
-    textWrapMode: true, // 'Wrap mode'
-    textRotateMode: true, // 'Text Rotation Mode'
-};
-
-export const DefaultDocContainerConfig = {
-    outerLeft: false,
-    outerRight: false,
-    header: true,
-    footer: true,
-    innerLeft: false,
-    innerRight: false,
-    frozenHeaderLT: false,
-    frozenHeaderRT: false,
-    frozenHeaderLM: false,
-    frozenContent: false,
-    infoBar: true,
-    toolbar: true,
-};

packages/docs-ui/src/basics/const/index.ts

@@ -1,18 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export * from './default-univer-doc-config';
-export * from './plugin-name';

packages/docs-ui/src/basics/const/plugin-name.ts

@@ -1,17 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export const DOC_UI_PLUGIN_NAME = 'DOC_UI_PLUGIN';

packages/docs-ui/src/basics/index.ts

@@ -1,18 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export * from './const';
-export * from './interfaces';

packages/docs-ui/src/basics/interfaces/component-config/i-doc-ui-plugin-config.ts

@@ -1,76 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export interface ILayout {
-    docContainerConfig?: DocContainerConfig;
-    toolbarConfig?: DocToolbarConfig;
-}
-
-export interface DocContainerConfig {
-    outerLeft?: boolean;
-
-    outerRight?: boolean;
-
-    header?: boolean;
-
-    footer?: boolean;
-
-    sideMenu?: boolean;
-
-    innerLeft?: boolean;
-
-    innerRight?: boolean;
-
-    frozenHeaderLT?: boolean;
-
-    frozenHeaderRT?: boolean;
-
-    frozenHeaderLM?: boolean;
-
-    frozenContent?: boolean;
-
-    infoBar?: boolean;
-
-    toolbar?: boolean;
-
-    contentSplit?: boolean | string;
-}
-
-// doc工具栏配置
-export interface DocToolbarConfig {
-    undo?: boolean; // Undo redo
-    redo?: boolean; // Undo redo
-    paintFormat?: boolean; // Format brush
-    currencyFormat?: boolean; // currency format
-    percentageFormat?: boolean; // Percentage format
-    numberDecrease?: boolean; // 'Decrease the number of decimal places'
-    numberIncrease?: boolean; // 'Increase the number of decimal places
-    font?: boolean; // 'font'
-    moreFormats?: boolean;
-    fontSize?: boolean; // 'Font size'
-    bold?: boolean; // 'Bold (Ctrl+B)'
-    italic?: boolean; // 'Italic (Ctrl+I)'
-    strikethrough?: boolean; // 'Strikethrough (Alt+Shift+5)'
-    underline?: boolean; // 'Underline (Alt+Shift+6)'
-    textColor?: boolean; // 'Text color'
-    fillColor?: boolean; // 'Cell color'
-    border?: boolean; // 'border'
-    horizontalAlignMode?: boolean; // 'Horizontal alignment'
-    verticalAlignMode?: boolean; // 'Vertical alignment'
-    textWrapMode?: boolean; // 'Wrap mode'
-    textRotateMode?: boolean; // 'Text Rotation Mode'
-    mergeCell?: boolean; // 'Merge cells'
-}

packages/docs-ui/src/basics/interfaces/component-config/index.ts

@@ -1,17 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export * from './i-doc-ui-plugin-config';

packages/docs-ui/src/basics/interfaces/index.ts

@@ -1,17 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export * from './component-config';

packages/docs-ui/src/config/config.ts

@@ -16,8 +16,6 @@
 
 import type { DependencyOverride } from '@univerjs/core';
 import type { MenuConfig } from '@univerjs/ui';
-import type { ILayout } from '../basics';
-import { DefaultDocContainerConfig, DefaultToolbarConfig } from '../basics';
 
 export const DOCS_UI_PLUGIN_CONFIG_KEY = 'docs-ui.config';
 
@@ -26,13 +24,12 @@ export const configSymbol = Symbol(DOCS_UI_PLUGIN_CONFIG_KEY);
 export interface IUniverDocsUIConfig {
     menu?: MenuConfig;
     container?: HTMLElement | string;
-    layout?: ILayout;
+    toc?: boolean;
+    footer?: boolean;
     override?: DependencyOverride;
 }
 
 export const defaultPluginConfig: IUniverDocsUIConfig = {
-    layout: {
-        docContainerConfig: DefaultDocContainerConfig,
-        toolbarConfig: DefaultToolbarConfig,
-    },
+    toc: false,
+    footer: true,
 };

packages/docs-ui/src/controllers/__tests__/ui-controllers.spec.ts

@@ -1,178 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { BuiltInUIPart } from '@univerjs/ui';
-import { describe, expect, it, vi } from 'vitest';
-import { AppUIController } from '../app-ui-controller';
-import { DocContainerUIController } from '../doc-container-ui-controller';
-import { DocParagraphSettingController } from '../doc-paragraph-setting.controller';
-import { DocUIController } from '../doc-ui.controller';
-
-function createDisposable() {
-    return {
-        dispose: vi.fn(),
-    };
-}
-
-describe('docs ui controllers', () => {
-    it('creates the doc container controller through the injector in app ui controller', () => {
-        const docContainerController = {};
-        const injector = {
-            createInstance: vi.fn(() => docContainerController),
-        };
-
-        const controller = new AppUIController(injector as never);
-
-        expect(controller).toBeInstanceOf(AppUIController);
-        expect(injector.createInstance).toHaveBeenCalledWith(DocContainerUIController);
-    });
-
-    it('stores the mounted doc container and exposes locale/config helpers', () => {
-        const contentRef = { current: { id: 'content' } };
-        const docContainer = {
-            getContentRef: vi.fn(() => contentRef),
-        };
-        const localeService = {
-            setLocale: vi.fn(),
-        };
-        const injector = { id: 'injector' };
-        const configService = {
-            getConfig: vi.fn(() => ({ toolbar: true })),
-        };
-
-        const controller = new DocContainerUIController(
-            localeService as never,
-            injector as never,
-            configService as never
-        );
-        const uiConfig = controller.getUIConfig();
-
-        expect(uiConfig.injector).toBe(injector);
-        expect(uiConfig.config).toEqual({ toolbar: true });
-
-        uiConfig.changeLocale('zhCN');
-        uiConfig.getComponent(docContainer as never);
-
-        expect(localeService.setLocale).toHaveBeenCalledWith('zhCN');
-        expect(controller.getDocContainer()).toBe(docContainer);
-        expect(controller.getContentRef()).toBe(contentRef);
-        expect(controller.UIDidMount((mounted: unknown) => mounted)).toBe(docContainer);
-    });
-
-    it('throws when the doc container content ref is not ready', () => {
-        const controller = new DocContainerUIController(
-            { setLocale: vi.fn() } as never,
-            {} as never,
-            { getConfig: vi.fn() } as never
-        );
-
-        expect(() => controller.getComponent({
-            getContentRef: () => ({ current: null }),
-        } as never)).toThrowError('container is not ready');
-    });
-
-    it('registers the paragraph setting view and controls the sidebar panel', () => {
-        const componentManager = {
-            register: vi.fn(() => createDisposable()),
-        };
-        const sidebarService = {
-            open: vi.fn(),
-            close: vi.fn(),
-        };
-
-        const controller = new DocParagraphSettingController(
-            {} as never,
-            componentManager as never,
-            sidebarService as never
-        );
-
-        controller.openPanel();
-        controller.closePanel();
-
-        expect(componentManager.register).toHaveBeenCalledTimes(1);
-        expect(componentManager.register).toHaveBeenCalledWith('doc_ui_paragraph-setting-panel', expect.anything());
-        expect(sidebarService.open).toHaveBeenCalledWith(expect.objectContaining({
-            header: { title: 'doc.slider.paragraphSetting' },
-            children: { label: 'doc_ui_paragraph-setting-panel' },
-            width: 300,
-        }));
-        expect(sidebarService.close).toHaveBeenCalledWith(undefined);
-    });
-
-    it('registers doc ui components, commands, shortcuts, ui parts, and focus handlers', () => {
-        const componentManager = {
-            register: vi.fn(() => createDisposable()),
-        };
-        const registeredFocusHandlers: Array<(unitId: string) => void> = [];
-        const commandService = {
-            registerCommand: vi.fn(() => createDisposable()),
-        };
-        const layoutService = {
-            registerFocusHandler: vi.fn((_type, handler) => {
-                registeredFocusHandlers.push(handler);
-                return createDisposable();
-            }),
-        };
-        const menuManagerService = {
-            mergeMenu: vi.fn(),
-        };
-        const uiPartsService = {
-            registerComponent: vi.fn(() => createDisposable()),
-        };
-        const shortcutService = {
-            registerShortcut: vi.fn(() => createDisposable()),
-        };
-        const selectionRenderService = {
-            focus: vi.fn(),
-        };
-        const renderManagerService = {
-            getRenderById: vi.fn(() => ({
-                with: vi.fn(() => selectionRenderService),
-            })),
-        };
-        const injector = {
-            get: vi.fn(() => renderManagerService),
-        };
-
-        const controller = new DocUIController(
-            injector as never,
-            componentManager as never,
-            commandService as never,
-            layoutService as never,
-            menuManagerService as never,
-            uiPartsService as never,
-            {} as never,
-            shortcutService as never,
-            {} as never
-        );
-
-        expect(controller).toBeInstanceOf(DocUIController);
-        expect(componentManager.register).toHaveBeenCalledTimes(7);
-        expect(commandService.registerCommand).toHaveBeenCalledTimes(3);
-        expect(menuManagerService.mergeMenu).toHaveBeenCalledTimes(1);
-        expect(uiPartsService.registerComponent).toHaveBeenCalledTimes(2);
-        expect(uiPartsService.registerComponent).toHaveBeenNthCalledWith(1, BuiltInUIPart.FOOTER, expect.any(Function));
-        expect(uiPartsService.registerComponent).toHaveBeenNthCalledWith(2, BuiltInUIPart.CONTENT, expect.any(Function));
-        expect(shortcutService.registerShortcut).toHaveBeenCalledTimes(13);
-        expect(layoutService.registerFocusHandler).toHaveBeenCalledTimes(1);
-
-        expect(registeredFocusHandlers).toHaveLength(1);
-        registeredFocusHandlers.at(0)?.('doc-1');
-
-        expect(renderManagerService.getRenderById).toHaveBeenCalledWith('doc-1');
-        expect(selectionRenderService.focus).toHaveBeenCalledTimes(1);
-    });
-});

packages/docs-ui/src/controllers/app-ui-controller.ts

@@ -1,30 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { Inject, Injector, RxDisposable } from '@univerjs/core';
-
-import { DocContainerUIController } from './doc-container-ui-controller';
-
-export class AppUIController extends RxDisposable {
-    private _docContainerController: DocContainerUIController;
-
-    constructor(
-        @Inject(Injector) private readonly _injector: Injector
-    ) {
-        super();
-        this._docContainerController = this._injector.createInstance(DocContainerUIController);
-    }
-}

packages/docs-ui/src/controllers/doc-container-ui-controller.ts

@@ -1,79 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import type { LocaleType } from '@univerjs/core';
-import type { IUniverDocsUIConfig } from '../config/config';
-import type { DocContainer } from '../views/doc-container/DocContainer';
-import { IConfigService, Inject, Injector, LocaleService } from '@univerjs/core';
-import { DOCS_UI_PLUGIN_CONFIG_KEY } from '../config/config';
-
-export class DocContainerUIController {
-    private _docContainer?: DocContainer;
-
-    constructor(
-        @Inject(LocaleService) private readonly _localeService: LocaleService,
-        @Inject(Injector) private readonly _injector: Injector,
-        @IConfigService private readonly _configService: IConfigService
-    ) {
-        // empty
-    }
-
-    getUIConfig() {
-        const config = {
-            injector: this._injector,
-            config: this._configService.getConfig<IUniverDocsUIConfig>(DOCS_UI_PLUGIN_CONFIG_KEY),
-            changeLocale: this.changeLocale,
-            getComponent: this.getComponent,
-        };
-        return config;
-    }
-
-    // 获取SheetContainer组件
-    getComponent = (ref: DocContainer) => {
-        this._docContainer = ref;
-
-        const container = ref.getContentRef().current;
-
-        if (!container) {
-            throw new Error('container is not ready');
-        }
-    };
-
-    /**
-     * Change language
-     * @param {string} lang new language
-     *
-     * e: {target: HTMLSelectElement } reference from  https://stackoverflow.com/a/48443771
-     *
-     */
-    changeLocale = (locale: string) => {
-        this._localeService.setLocale(locale as LocaleType);
-    };
-
-    getContentRef() {
-        return this._docContainer!.getContentRef();
-    }
-
-    UIDidMount(cb: Function) {
-        if (this._docContainer) {
-            return cb(this._docContainer);
-        }
-    }
-
-    getDocContainer() {
-        return this._docContainer;
-    }
-}

packages/docs-ui/src/controllers/index.ts

@@ -1,18 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-export * from './app-ui-controller';
-export * from './doc-container-ui-controller';

packages/docs-ui/src/index.ts

@@ -16,7 +16,6 @@
 
 import './global.css';
 
-export * from './basics';
 export type { IDocObjectParam } from './basics/component-tools';
 export { getDocObject, getDocObjectById, neoGetDocObject } from './basics/component-tools';
 export { addCustomDecorationBySelectionFactory, addCustomDecorationFactory, deleteCustomDecorationFactory } from './basics/custom-decoration-factory';

packages/docs-ui/src/plugin.ts

@@ -34,7 +34,6 @@ import { DocInterceptorService, DocSkeletonManagerService } from '@univerjs/docs
 import { IRenderManagerService, UniverRenderEnginePlugin } from '@univerjs/engine-render';
 import { IShortcutService } from '@univerjs/ui';
 import pkg from '../package.json';
-import { DOC_UI_PLUGIN_NAME } from './basics/const/plugin-name';
 import { AfterSpaceCommand, EnterCommand, TabCommand } from './commands/commands/auto-format.command';
 import { BreakLineCommand } from './commands/commands/break-line.command';
 import { DocCopyCommand, DocCopyCurrentParagraphCommand, DocCutCommand, DocCutCurrentParagraphCommand, DocPasteCommand } from './commands/commands/clipboard.command';
@@ -96,7 +95,6 @@ import { DocParagraphSettingPanelOperation } from './commands/operations/doc-par
 import { DocOpenPageSettingCommand } from './commands/operations/open-page-setting.operation';
 import { SetDocZoomRatioOperation } from './commands/operations/set-doc-zoom-ratio.operation';
 import { defaultPluginConfig, DOCS_UI_PLUGIN_CONFIG_KEY } from './config/config';
-import { AppUIController } from './controllers';
 import { DocAutoFormatController } from './controllers/doc-auto-format.controller';
 import { DocHeaderFooterController } from './controllers/doc-header-footer.controller';
 import { DocMoveCursorController } from './controllers/doc-move-cursor.controller';
@@ -144,7 +142,7 @@ import { ShiftTabShortCut } from './shortcuts/format.shortcut';
 
 @DependentOn(UniverRenderEnginePlugin)
 export class UniverDocsUIPlugin extends Plugin {
-    static override pluginName = DOC_UI_PLUGIN_NAME;
+    static override pluginName = 'DOC_UI_PLUGIN';
     static override packageName = pkg.name;
     static override version = pkg.version;
     // static override type = UniverInstanceType.UNIVER_DOC;
@@ -187,7 +185,6 @@ export class UniverDocsUIPlugin extends Plugin {
     }
 
     override onRendered(): void {
-        this._initUI();
         this._initRenderModules();
 
         touchDependencies(this._injector, [
@@ -327,7 +324,6 @@ export class UniverDocsUIPlugin extends Plugin {
             [DocAutoFormatController],
             [DocTableController],
             [DocMoveCursorController],
-            [AppUIController],
             [DocParagraphSettingController],
             [IEditorService, { useClass: EditorService }],
             [IDocClipboardService, { useClass: DocClipboardService }],
@@ -357,10 +353,6 @@ export class UniverDocsUIPlugin extends Plugin {
         }
     }
 
-    private _initUI(): void {
-        this._injector.get(AppUIController);
-    }
-
     private _initRenderBasics(): void {
         ([
             [DocSkeletonManagerService],

packages/docs-ui/src/views/doc-container/DocContainer.tsx

@@ -1,153 +0,0 @@
-/**
- * Copyright 2023-present DreamNum Co., Ltd.
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import type * as React from 'react';
-import type { IUniverDocsUIConfig } from '../../config/config';
-import { Component, createRef } from 'react';
-
-interface IBaseDocContainerProps {
-    config: IUniverDocsUIConfig;
-    changeLocale: (locale: string) => void;
-    methods?: any;
-}
-
-/**
- * One univerdoc instance DOM container
- */
-export class DocContainer extends Component<IBaseDocContainerProps> {
-    leftContentLeft: number = 0;
-
-    leftContentTop: number = 0;
-
-    rightBorderX: number = 0;
-
-    rightBorderY: number = 0;
-
-    splitLeftRef = createRef<HTMLDivElement>();
-
-    contentRef = createRef<HTMLDivElement>();
-
-    constructor(props: IBaseDocContainerProps) {
-        super(props);
-
-        this.changeSkin(props.config.container as string, 'default');
-    }
-
-    /**
-     * split mouse down
-     * @param e
-     */
-    handleSplitBarMouseDown = (e: React.MouseEvent) => {
-        e = e || window.event; // Compatible with IE browser
-        // Store the current mouse position
-        this.leftContentLeft = this.splitLeftRef.current?.getBoundingClientRect().left!;
-        this.leftContentTop = this.splitLeftRef.current?.getBoundingClientRect().top!;
-        const mainContainer = this.splitLeftRef.current?.parentElement;
-        this.rightBorderX = mainContainer?.getBoundingClientRect()?.width!;
-        this.rightBorderY = mainContainer?.getBoundingClientRect()?.height!;
-        document.addEventListener('mousemove', this.handleSplitBarMouseMove, false);
-        document.addEventListener('mouseup', this.handleSplitBarMouseUp, false);
-    };
-
-    /**
-     * split mouse move
-     * @param e
-     */
-    handleSplitBarMouseMove = (e: MouseEvent) => {
-        const layout = this.props.config.layout?.docContainerConfig!;
-        e = e || window.event; // Compatible with IE browser
-        let diffLeft = e.clientX - this.leftContentLeft;
-        let diffTop = e.clientY - this.leftContentTop;
-        // Prevent crossing borders
-        diffLeft = diffLeft >= this.rightBorderX ? this.rightBorderX : diffLeft;
-        diffTop = diffTop >= this.rightBorderY ? this.rightBorderY : diffTop;
-        // set new width
-        if (layout.contentSplit === 'vertical') {
-            this.splitLeftRef.current!.style.height = `${diffTop}px`;
-        } else {
-            this.splitLeftRef.current!.style.width = `${diffLeft}px`;
-        }
-    };
-
-    /**
-     * split mouse up
-     * @param e
-     */
-    handleSplitBarMouseUp = (e: MouseEvent) => {
-        document.removeEventListener('mousemove', this.handleSplitBarMouseMove, false);
-        document.removeEventListener('mouseup', this.handleSplitBarMouseUp, false);
-    };
-
-    getContentRef() {
-        return this.contentRef;
-    }
-
-    getSplitLeftRef() {
-        return this.splitLeftRef;
-    }
-
-    /**
-     * Modify Dom Skin
-     */
-    changeSkin(container: HTMLElement | string, skin: string) {
-        // Collect all  skins
-        const root = document.documentElement;
-
-        const id = typeof container === 'string' ? container : container.id;
-
-        /**
-         * get skin style doc
-         * @param id
-         * @returns
-         */
-
-        function getSkinStyleDoc(id: string) {
-            const title = 'universheet-skin-style';
-            // avoid duplicates
-            for (let i = 0; i < document.styleSheets.length; i++) {
-                if (document.styleSheets[i].title === title) {
-                    deleteStyleRuleIndexBySelector(document.styleSheets[i], id);
-
-                    return document.styleSheets[i];
-                }
-            }
-            const head = document.head || document.getElementsByTagName('head')[0];
-            const styleEle = document.createElement('style');
-            styleEle.title = title;
-            head.appendChild(styleEle);
-
-            return document.styleSheets[document.styleSheets.length - 1];
-        }
-
-        /**
-         * delete style rule in univerdoc-skin-style
-         * @param skinStyleDoc
-         * @param id
-         */
-        function deleteStyleRuleIndexBySelector(skinStyleSheet: CSSStyleSheet, id: string) {
-            let index = 0;
-            for (let i = 0; i < skinStyleSheet.cssRules.length; i++) {
-                const rule = skinStyleSheet.cssRules[i];
-
-                if (rule instanceof CSSStyleRule && rule.selectorText === `#${id}`) {
-                    index = i;
-                    skinStyleSheet.deleteRule(index);
-                    break;
-                }
-            }
-        }
-    }
-}

packages/docs-ui/src/views/doc-footer/DocFooter.tsx

@@ -21,22 +21,29 @@ import { useConfigValue, useDependency, useObservable } from '@univerjs/ui';
 import { DOCS_UI_PLUGIN_CONFIG_KEY } from '../../config/config';
 import { CountBar } from '../count-bar';
 
+function DocFooterContent() {
+    const config = useConfigValue<IUniverDocsUIConfig>(DOCS_UI_PLUGIN_CONFIG_KEY);
+    const isShow = config?.footer ?? true;
+
+    return isShow && (
+        <div
+            className={`
+              univer-box-border univer-flex univer-items-center univer-justify-between univer-px-5 univer-py-1.5
+            `}
+        >
+            <div />
+            <CountBar />
+        </div>
+    );
+}
+
 export function DocFooter() {
     const univerInstanceService = useDependency(IUniverInstanceService);
-    const config = useConfigValue<IUniverDocsUIConfig>(DOCS_UI_PLUGIN_CONFIG_KEY);
     const workbook = useObservable(() => univerInstanceService.getCurrentTypeOfUnit$<Workbook>(UniverInstanceType.UNIVER_SHEET), undefined, undefined, []);
-    const isShow = config?.layout?.docContainerConfig?.footer ?? true;
 
-    return workbook
-        ? null
-        : isShow && (
-            <div
-                className={`
-                  univer-box-border univer-flex univer-items-center univer-justify-between univer-px-5 univer-py-1.5
-                `}
-            >
-                <div />
-                <CountBar />
-            </div>
-        );
+    if (workbook) {
+        return null;
+    }
+
+    return <DocFooterContent />;
 };

packages/docs-ui/src/views/side-menu/index.tsx

@@ -81,7 +81,7 @@ const TITLE_ID = '__title';
 export function DocSideMenu() {
     const config = useConfigValue<IUniverDocsUIConfig>(DOCS_UI_PLUGIN_CONFIG_KEY);
 
-    if (config?.layout?.docContainerConfig?.sideMenu ?? true) {
+    if (config?.toc) {
         return <DocSideMenuContent />;
     }