Edit History

Univer SDK Pro
Server RequiredDepends on server-side capabilities

Caution

The edit history functionality requires support from the Univer server. Please ensure that you have correctly installed and configured the Univer server. For details, please refer to: Upgrading to Pro

Edit History allows users to view and restore historical versions of documents, supporting various filtering and searching methods to help users efficiently manage document content.

Preset Mode

Installation

The UniverSheetsAdvancedPreset preset from @univerjs/preset-sheets-advanced depends on the UniverSheetsDrawingPreset preset at runtime. Please install @univerjs/preset-sheets-drawing first.

Shell
pnpm add @univerjs/preset-sheets-drawing @univerjs/preset-sheets-advanced @univerjs/preset-sheets-collaboration

Usage

TypeScript
import { UniverSheetsAdvancedPreset } from '@univerjs/preset-sheets-advanced'import UniverPresetSheetsAdvancedEnUS from '@univerjs/preset-sheets-advanced/locales/en-US'import { UniverSheetsCollaborationPreset } from '@univerjs/preset-sheets-collaboration'import UniverPresetSheetsCollaborationEnUS from '@univerjs/preset-sheets-collaboration/locales/en-US'import { UniverSheetsCorePreset } from '@univerjs/preset-sheets-core'import UniverPresetSheetsCoreEnUS from '@univerjs/preset-sheets-core/locales/en-US'import { UniverSheetsDrawingPreset } from '@univerjs/preset-sheets-drawing'import UniverPresetSheetsDrawingEnUS from '@univerjs/preset-sheets-drawing/locales/en-US'import { createUniver, LocaleType, mergeLocales } from '@univerjs/presets'import '@univerjs/preset-sheets-core/lib/index.css'import '@univerjs/preset-sheets-drawing/lib/index.css'import '@univerjs/preset-sheets-advanced/lib/index.css'import '@univerjs/preset-sheets-collaboration/lib/index.css'const { univerAPI } = createUniver({  locale: LocaleType.EN_US,  locales: {    [LocaleType.EN_US]: mergeLocales(      UniverPresetSheetsCoreEnUS,      UniverPresetSheetsDrawingEnUS,       UniverPresetSheetsAdvancedEnUS,       UniverPresetSheetsCollaborationEnUS,     ),  },  collaboration: true,   presets: [    UniverSheetsCorePreset(),    UniverSheetsDrawingPreset({       collaboration: true,    }),     UniverSheetsAdvancedPreset({       // configuration for advanced features    }),     UniverSheetsCollaborationPreset({       universerEndpoint: 'http://localhost:3010',     }),   ],})

If you have a commercial license for Univer, please refer to Using License in Client for configuration.

Presets and Configuration

The UniverSheetsCollaborationPreset configuration options:

TypeScript
interface IUniverSheetsCollaborationPresetConfig {  // The endpoint of the Univer Server  universerEndpoint?: string  /**   * If the data calculation in the history requires the use of Worker (such as formulas), you can configure this field.   * 1. If historyWorkerURL is provided and historyWorkerURL is a Worker instance, it will be destroyed when the history is closed, so a new Worker instance needs to be provided each time the history is opened.   * ```typescript   * import { SHEETS_HISTORY_UI_PLUGIN_CONFIG_KEY, ToggleEditHistoryOperation } from '@univerjs-pro/sheets-history-ui';   *   * univerAPI.addEvent(univerAPI.Event.BeforeCommandExecute, (event) => {   *   if (event.id === ToggleEditHistoryOperation.id) {   *     const workerURL = new Worker(new URL('./worker.ts', import.meta.url));   *     const configService = univer.__getInjector().get(IConfigService);   *     configService.setConfig(SHEETS_HISTORY_UI_PLUGIN_CONFIG_KEY, {   *       workerURL,   *     });   *   }   * });   * 2.If the provided historyWorkerURL is not a Worker instance, no additional processing is required.   * ```   */  historyWorkerURL?: string | URL | Worker}

Plugin Mode

Installation

Shell
pnpm add @univerjs-pro/sheets-history-ui

Usage

TypeScript
import { UniverSheetsHistoryUIPlugin } from '@univerjs-pro/sheets-history-ui'import SheetsHistoryUIEnUS from '@univerjs-pro/sheets-history-ui/locale/en-US'import { LocaleType, mergeLocales, Univer } from '@univerjs/core'import '@univerjs-pro/sheets-history-ui/lib/index.css'const univer = new Univer({  locale: LocaleType.EN_US,  locales: {    [LocaleType.EN_US]: mergeLocales(      SheetsHistoryUIEnUS,     ),  },})univer.registerPlugin(UniverSheetsHistoryUIPlugin, {   univerContainerId: 'your-univer-container-id',   historyServerUrl: '/universer-api/history', }) 

If you have a commercial license for Univer, please refer to Using License in Client for configuration.

Plugins and Configuration

The UniverSheetsHistoryUIPlugin configuration options:

TypeScript
interface IUniverSheetsHistoryUIConfig {  univerContainerId?: string  // The server url of the history list  historyServerUrl?: string  /**   * If the data calculation in the history requires the use of Worker (such as formulas), you can configure this field.   * 1. If workerURL is provided and workerURL is a Worker instance, it will be destroyed when the history is closed, so a new Worker instance needs to be provided each time the history is opened.   * ```typescript   * import { SHEETS_HISTORY_UI_PLUGIN_CONFIG_KEY, ToggleEditHistoryOperation } from '@univerjs-pro/sheets-history-ui';   *   * univerAPI.addEvent(univerAPI.Event.BeforeCommandExecute, (event) => {   *   if (event.id === ToggleEditHistoryOperation.id) {   *     const workerURL = new Worker(new URL('./worker.ts', import.meta.url));   *     const configService = univer.__getInjector().get(IConfigService);   *     configService.setConfig(SHEETS_HISTORY_UI_PLUGIN_CONFIG_KEY, {   *       workerURL,   *     });   *   }   * });   * 2.If the provided workerURL is not a Worker instance, no additional processing is required.   * ```   */  workerURL?: string | URL | Worker}

When enabling edit history, the UniverSheetsHistoryUIPlugin will load a new Univer instance and mount it on the specified DOM node. Therefore, when registering, you need to provide a suitable DOM node id (such as the original Univer instance's container) to achieve the purpose of the history panel covering the original Univer panel. If the node id is not specified, it defaults to univer-container.

If you need to modify the server address for the history list, you can set it through the historyServerUrl configuration option, which defaults to /universer-api/history.

How is this guide?

© 2026 DreamNum Co., Ltd.