Univer Weekly #7

If you find Univer useful, please consider supporting us by starring our project on GitHub. Your support helps us continue to improve and maintain Univer.

Univer v0.10.0 & v0.10.1

mergeLocales: Simplifying Locale Merging

In Univer v0.10.0 & v0.10.1, we introduced the new mergeLocales method for merging multiple locale objects. This method simplifies the merging process, allowing you to focus on the locales you want to combine without worrying about the underlying details, significantly enhancing the convenience and readability of internationalization development.

For projects that previously used the merge method, we recommend updating your code as follows:

- import { merge } from '@univerjs/presets';
+ import { mergeLocales } from '@univerjs/presets';

const univer = new Univer({
  locale: LocaleType.EN_US,
  locales: {
-   [LocaleType.EN_US]: merge(
-   {},
+   [LocaleType.EN_US]: mergeLocales(
      DesignEnUS,
      UIEnUS,
      DocsUIEnUS,
      SheetsEnUS,
      SheetsUIEnUS,
      SheetsFormulaUIEnUS,
      SheetsNumfmtUIEnUS,
    ),
  },
})

- import { merge } from '@univerjs/core';
+ import { mergeLocales } from '@univerjs/core';

const univer = new Univer({
  locale: LocaleType.EN_US,
  locales: {
-   [LocaleType.EN_US]: merge(
-   {},
+   [LocaleType.EN_US]: mergeLocales(
      DesignEnUS,
      UIEnUS,
      DocsUIEnUS,
      SheetsEnUS,
      SheetsUIEnUS,
      SheetsFormulaUIEnUS,
      SheetsNumfmtUIEnUS,
    ),
  },
})

This adjustment allows you to merge multiple locale objects more clearly, without needing to manually pass an empty object as the initial parameter.

univer.registerPlugin: Support for Batch Plugin Registration

We have enhanced the univer.registerPlugin method to support batch registration of plugins, allowing you to register multiple plugins at once without the need for multiple calls, greatly improving flexibility and efficiency. For example:

univer.registerPlugin([
  UniverRenderEnginePlugin,
  UniverFormulaEnginePlugin,
  [UniverUIPlugin, {
    container: 'app',
  }],
  UniverDocsPlugin,
  UniverDocsUIPlugin,
  UniverSheetsPlugin,
  UniverSheetsUIPlugin,
  UniverSheetsFormulaPlugin,
  UniverSheetsFormulaUIPlugin,
  UniverSheetsNumfmtPlugin,
  UniverSheetsNumfmtUIPlugin,
])

This allows you to manage and maintain plugin dependencies more intuitively by passing an array of plugins.

💔 Breaking Change: Custom Permission Background and User Component Configuration Changes

In the past, developers used the customComponents property of UniverSheetsUIPlugin to implement custom permission backgrounds and user components. This approach was cumbersome and had a high learning curve. In version 0.10.0, we made a breaking change by removing customComponents and replacing it with more intuitive protectedRangeUserSelector and protectedRangeShadow.

If you previously used the customComponents property for custom permission backgrounds and user components, please refer to the following examples for migration:

Hide Permission Background Shadow

createUniver({
  presets: [
    UniverSheetsCorePreset({
-     customComponents: new Set([UNIVER_SHEET_PERMISSION_BACKGROUND]),
+     protectedRangeShadow: false,
    }),
  ],
})

univer.registerPlugin(UniverSheetsUIPlugin, {
-  customComponents: new Set([UNIVER_SHEET_PERMISSION_BACKGROUND]),
+  protectedRangeShadow: false,
})

Custom User Component

- const injector = univer.__getInjector()
- const uiPartsService = injector.get(IUIPartsService)
- uiPartsService.registerComponent(UNIVER_SHEET_PERMISSION_USER_PART, () => connectInjector(CustomPermissionDetailUserPart, injector))

createUniver({
  presets: [
    UniverSheetsCorePreset({
-     customComponents: new Set([UNIVER_SHEET_PERMISSION_USER_PART]),
+     protectedRangeUserSelector: {
+       component: CustomPermissionDetailUserPart,
+       framework: 'react',
+     },
    }),
  ],
})

- const injector = univer.__getInjector()
- const uiPartsService = injector.get(IUIPartsService)
- uiPartsService.registerComponent(UNIVER_SHEET_PERMISSION_USER_PART, () => connectInjector(CustomPermissionDetailUserPart, injector))

univer.registerPlugin(UniverSheetsUIPlugin, {
-  customComponents: new Set([UNIVER_SHEET_PERMISSION_USER_PART]),
+  protectedRangeUserSelector: {
+    component: CustomPermissionDetailUserPart,
+    framework: 'react',
+  },
})

Other Feature Enhancements and Bug Fixes

• Univer Slides now supports inserting circles. Thanks to community contributor @kenny-not-dead for this feature contribution (#5602).
• Optimized the default popup position of the custom sorting dialog to enhance user experience.
• The find and replace feature has been upgraded to allow jumping to the next match directly by pressing the Enter key in the input box.
• Fixed some issues related to table filters.
• Developers can now create Dialogs that exceed width limits.

For a full list of updates and historical release information, please visit our GitHub Releases page.

Thank you to every community developer and user for your attention and support! We will continue to optimize the product experience, and we welcome your valuable suggestions and contributions. Let's work together to make Univer even better!