Conditional Formatting
Facade API | Has Paid Plan | Univer Server | Univer on Node.js | Preset |
---|---|---|---|---|
- | - | - | ✅ | UniverSheetsConditionalFormattingPreset |
Conditional formatting is a feature that sets rules in cells to automatically set cell formats based on the value of the data.
This feature includes the following plugin packages:
@univerjs/sheets-conditional-formatting
- fundamental conditional formatting plugin@univerjs/sheets-conditional-formatting-ui
- UI plugin for conditional formatting
Presets Installation
import { createUniver, defaultTheme, LocaleType, merge } from '@univerjs/presets';
import { UniverSheetsCorePreset } from '@univerjs/presets/preset-sheets-core';
import UniverPresetSheetsCoreEnUS from '@univerjs/presets/preset-sheets-core/locales/en-US';
import { UniverSheetsConditionalFormattingPreset } from '@univerjs/presets/preset-sheets-conditional-formatting';
import UniverPresetSheetsConditionalFormattingEnUS from '@univerjs/presets/preset-sheets-conditional-formatting/locales/en-US';
import '@univerjs/presets/lib/styles/preset-sheets-core.css'
import '@univerjs/presets/lib/styles/preset-sheets-conditional-formatting.css'
const { univerAPI } = createUniver({
locale: LocaleType.EN_US,
locales: {
[LocaleType.EN_US]: merge(
{},
UniverPresetSheetsCoreEnUS,
UniverPresetSheetsConditionalFormattingEnUS
),
},
theme: defaultTheme,
presets: [
UniverSheetsCorePreset(),
UniverSheetsConditionalFormattingPreset(),
],
});
Piecemeal Installation
npm install @univerjs/sheets-conditional-formatting @univerjs/sheets-conditional-formatting-ui
import { LocaleType, merge, Univer } from '@univerjs/core';
import { defaultTheme } from "@univerjs/design";
import { UniverSheetsConditionalFormattingPlugin } from '@univerjs/sheets-conditional-formatting';
import { UniverSheetsConditionalFormattingUIPlugin } from '@univerjs/sheets-conditional-formatting-ui';
import SheetsConditionalFormattingUIEnUS from '@univerjs/sheets-conditional-formatting-ui/locale/en-US';
import '@univerjs/sheets-conditional-formatting-ui/lib/index.css';
const univer = new Univer({
theme: defaultTheme,
locale: LocaleType.EN_US,
locales: {
[LocaleType.EN_US]: merge(
SheetsConditionalFormattingUIEnUS
),
},
});
univer.registerPlugin(UniverSheetsConditionalFormattingPlugin);
univer.registerPlugin(UniverSheetsConditionalFormattingUIPlugin);
Univer on Node.js Piecemeal Installation
npm install @univerjs/sheets-conditional-formatting
import { LocaleType, Univer } from '@univerjs/core';
import { defaultTheme } from "@univerjs/design";
import { UniverSheetsConditionalFormattingPlugin } from '@univerjs/sheets-conditional-formatting';
const univer = new Univer({
theme: defaultTheme,
locale: LocaleType.EN_US,
});
univer.registerPlugin(UniverSheetsConditionalFormattingPlugin);
Links
- @univerjs/sheets-conditional-formatting API reference
- @univerjs/sheets-conditional-formatting-ui API reference