@odoo/o-spreadsheet 16.3.0-alpha.3 → 16.3.0-alpha.5

package/dist/o-spreadsheet.esm.js

@@ -1,4 +1,4 @@
-import { Component, useRef, onMounted, onPatched, onWillPatch, useState, onWillUpdateProps, useComponent, useEffect, useExternalListener, onWillUnmount, onWillStart, xml, useChildSubEnv, useSubEnv, EventBus as EventBus$1, markRaw } from '@odoo/owl';
+import { Component, useRef, onMounted, onPatched, onWillPatch, useState, onWillUpdateProps, useComponent, useEffect, useExternalListener, onWillUnmount, onWillStart, xml, useChildSubEnv, useSubEnv, markRaw } from '@odoo/owl';
 
 /*
  * usage: every string should be translated either with _lt if they are registered with a registry at
@@ -113,6 +113,7 @@ const FILTERS_COLOR = "#188038";
 const BACKGROUND_HEADER_FILTER_COLOR = "#E6F4EA";
 const BACKGROUND_HEADER_SELECTED_FILTER_COLOR = "#CEEAD6";
 const SEPARATOR_COLOR = "#E0E2E4";
+const ICONS_COLOR = "#4A4F59";
 // Color picker defaults as upper case HEX to match `toHex`helper
 const COLOR_PICKER_DEFAULTS = [
     "#000000",
@@ -219,8 +220,10 @@ const FILTER_ICON_MARGIN = 2;
 const FILTER_ICON_EDGE_LENGTH = 17;
 // Menus
 const MENU_WIDTH = 250;
-const MENU_VERTICAL_PADDING = 8;
-const MENU_ITEM_HEIGHT = 28;
+const MENU_VERTICAL_PADDING = 6;
+const MENU_ITEM_HEIGHT = 26;
+const MENU_ITEM_PADDING_HORIZONTAL = 13;
+const MENU_ITEM_PADDING_VERTICAL = 4;
 const MENU_SEPARATOR_BORDER_WIDTH = 1;
 const MENU_SEPARATOR_PADDING = 5;
 // Fonts
@@ -228,6 +231,7 @@ const DEFAULT_FONT_WEIGHT = "400";
 const DEFAULT_FONT_SIZE = 10;
 const HEADER_FONT_SIZE = 11;
 const DEFAULT_FONT = "'Roboto', arial";
+const DEFAULT_VERTICAL_ALIGN = "middle";
 // Borders
 const DEFAULT_BORDER_DESC = ["thin", "#000"];
 const DEFAULT_FILTER_BORDER_DESC = ["thin", FILTERS_COLOR];
@@ -270,15 +274,22 @@ var ComponentsImportance;
     ComponentsImportance[ComponentsImportance["Highlight"] = 5] = "Highlight";
     ComponentsImportance[ComponentsImportance["Figure"] = 10] = "Figure";
     ComponentsImportance[ComponentsImportance["ScrollBar"] = 15] = "ScrollBar";
-    ComponentsImportance[ComponentsImportance["Dropdown"] = 16] = "Dropdown";
+    ComponentsImportance[ComponentsImportance["GridPopover"] = 19] = "GridPopover";
     ComponentsImportance[ComponentsImportance["GridComposer"] = 20] = "GridComposer";
-    ComponentsImportance[ComponentsImportance["TopBarComposer"] = 21] = "TopBarComposer";
+    ComponentsImportance[ComponentsImportance["Dropdown"] = 21] = "Dropdown";
     ComponentsImportance[ComponentsImportance["IconPicker"] = 25] = "IconPicker";
-    ComponentsImportance[ComponentsImportance["Popover"] = 30] = "Popover";
+    ComponentsImportance[ComponentsImportance["TopBarComposer"] = 30] = "TopBarComposer";
+    ComponentsImportance[ComponentsImportance["Popover"] = 35] = "Popover";
     ComponentsImportance[ComponentsImportance["FigureAnchor"] = 1000] = "FigureAnchor";
     ComponentsImportance[ComponentsImportance["FigureSnapLine"] = 1001] = "FigureSnapLine";
 })(ComponentsImportance || (ComponentsImportance = {}));
-const DEFAULT_SHEETVIEW_SIZE = 1000;
+let DEFAULT_SHEETVIEW_SIZE = 0;
+function getDefaultSheetViewSize() {
+    return DEFAULT_SHEETVIEW_SIZE;
+}
+function setDefaultSheetViewSize(size) {
+    DEFAULT_SHEETVIEW_SIZE = size;
+}
 const MAXIMAL_FREEZABLE_RATIO = 0.85;
 const NEWLINE = "\n";
 const FONT_SIZES = [6, 7, 8, 9, 10, 11, 12, 14, 18, 24, 36];
@@ -1709,12 +1720,77 @@ const numberRepresentation = [];
  * - all digit stored in the decimal part of the number
  *
  * The 'maxDecimal' parameter allows to indicate the number of digits to not
- * exceed in the decimal part, in which case digits are rounded
+ * exceed in the decimal part, in which case digits are rounded.
  *
- * Intl.Numberformat is used to properly handle all the roundings.
- * e.g. 1234.7  with format ### (<> maxDecimals=0) should become 1235, not 1234
  **/
 function splitNumber(value, maxDecimals = MAX_DECIMAL_PLACES) {
+    const asString = value.toString();
+    if (asString.includes("e"))
+        return splitNumberIntl(value, maxDecimals);
+    if (Number.isInteger(value)) {
+        return { integerDigits: asString, decimalDigits: undefined };
+    }
+    const indexOfDot = asString.indexOf(".");
+    let integerDigits = asString.substring(0, indexOfDot);
+    let decimalDigits = asString.substring(indexOfDot + 1);
+    if (maxDecimals === 0) {
+        if (Number(decimalDigits[0]) >= 5) {
+            integerDigits = (Number(integerDigits) + 1).toString();
+        }
+        return { integerDigits, decimalDigits: undefined };
+    }
+    if (decimalDigits.length > maxDecimals) {
+        const { integerDigits: roundedIntegerDigits, decimalDigits: roundedDecimalDigits } = limitDecimalDigits(decimalDigits, maxDecimals);
+        decimalDigits = roundedDecimalDigits;
+        if (roundedIntegerDigits !== "0") {
+            integerDigits = (Number(integerDigits) + Number(roundedIntegerDigits)).toString();
+        }
+    }
+    return { integerDigits, decimalDigits: removeTrailingZeroes(decimalDigits || "") };
+}
+/**
+ *  Return the given string minus the trailing "0" characters.
+ *
+ * @param numberString : a string of integers
+ * @returns the numberString, minus the eventual zeroes at the end
+ */
+function removeTrailingZeroes(numberString) {
+    let i = numberString.length - 1;
+    while (i >= 0 && numberString[i] === "0") {
+        i--;
+    }
+    return numberString.slice(0, i + 1) || undefined;
+}
+/**
+ * Limit the size of the decimal part of a number to the given number of digits.
+ */
+function limitDecimalDigits(decimalDigits, maxDecimals) {
+    let integerDigits = "0";
+    let resultDecimalDigits = decimalDigits;
+    // Note : we'd want to simply use number.toFixed() to handle the max digits & rounding,
+    // but it has very strange behaviour. Ex: 12.345.toFixed(2) => "12.35", but 1.345.toFixed(2) => "1.34"
+    let slicedDecimalDigits = decimalDigits.slice(0, maxDecimals);
+    const i = maxDecimals;
+    if (Number(Number(decimalDigits[i]) < 5)) {
+        return { integerDigits, decimalDigits: slicedDecimalDigits };
+    }
+    // round up
+    const slicedRoundedUp = (Number(slicedDecimalDigits) + 1).toString();
+    if (slicedRoundedUp.length > slicedDecimalDigits.length) {
+        integerDigits = (Number(integerDigits) + 1).toString();
+        resultDecimalDigits = undefined;
+    }
+    else {
+        resultDecimalDigits = slicedRoundedUp;
+    }
+    return { integerDigits, decimalDigits: resultDecimalDigits };
+}
+/**
+ * Split numbers into decimal/integer digits using Intl.NumberFormat.
+ * Supports numbers with a lot of digits that are transformed to scientific notation by
+ * number.toString(), but is slow.
+ */
+function splitNumberIntl(value, maxDecimals = MAX_DECIMAL_PLACES) {
     let formatter = numberRepresentation[maxDecimals];
     if (!formatter) {
         formatter = new Intl.NumberFormat("en-US", {
@@ -5181,6 +5257,11 @@ class Popover extends Component {
             this.currentPosition = newPosition;
         });
     }
+    get popoverStyle() {
+        return cssPropertiesToCss({
+            "z-index": `${this.props.zIndex}`,
+        });
+    }
 }
 Popover.template = "o-spreadsheet-Popover";
 Popover.defaultProps = {
@@ -5189,6 +5270,7 @@ Popover.defaultProps = {
     onMouseWheel: () => { },
     onPopoverMoved: () => { },
     onPopoverHidden: () => { },
+    zIndex: ComponentsImportance.Popover,
 };
 Popover.props = {
     anchorRect: Object,
@@ -5200,6 +5282,7 @@ Popover.props = {
     onMouseWheel: { type: Function, optional: true },
     onPopoverHidden: { type: Function, optional: true },
     onPopoverMoved: { type: Function, optional: true },
+    zIndex: { type: Number, optional: true },
     slots: Object,
 };
 class PopoverPositionContext {
@@ -5343,7 +5426,7 @@ css /* scss */ `
       align-items: center;
       box-sizing: border-box;
       height: ${MENU_ITEM_HEIGHT}px;
-      padding: 4px 16px;
+      padding: ${MENU_ITEM_PADDING_VERTICAL}px ${MENU_ITEM_PADDING_HORIZONTAL}px;
       cursor: pointer;
       user-select: none;
 
@@ -5357,11 +5440,18 @@ css /* scss */ `
         display: flex;
         justify-content: space-between;
       }
+
       .o-menu-item-icon {
-        margin-top: auto;
-        margin-bottom: auto;
+        display: inline-block;
+        margin-right: calc(${MENU_ITEM_PADDING_HORIZONTAL}px * 3 / 5);
+        width: ${MENU_ITEM_HEIGHT - 2 * MENU_ITEM_PADDING_VERTICAL}px;
+        line-height: ${MENU_ITEM_HEIGHT - 2 * MENU_ITEM_PADDING_VERTICAL}px;
+
+        .o-icon {
+          color: ${ICONS_COLOR};
+        }
       }
-      .o-icon {
+      .o-menu-item-root {
         width: 10px;
       }
 
@@ -5441,12 +5531,22 @@ class Menu extends Component {
             onPopoverMoved: () => this.closeSubMenu(),
         };
     }
+    get childrenHaveIcon() {
+        return this.props.menuItems.some((menuItem) => !menuItem.icon && !!menuItem.isActive);
+    }
+    getIconName(menu) {
+        var _a;
+        if ((_a = menu.isActive) === null || _a === void 0 ? void 0 : _a.call(menu, this.env)) {
+            return "o-spreadsheet-Icon.CHECK";
+        }
+        return "";
+    }
     getColor(menu) {
         return menu.textColor ? `color: ${menu.textColor}` : undefined;
     }
     async activateMenu(menu) {
         var _a, _b, _c;
-        const result = await ((_a = menu.action) === null || _a === void 0 ? void 0 : _a.call(menu, this.env));
+        const result = await ((_a = menu.execute) === null || _a === void 0 ? void 0 : _a.call(menu, this.env));
         this.close();
         (_c = (_b = this.props).onMenuClicked) === null || _c === void 0 ? void 0 : _c.call(_b, { detail: result });
     }
@@ -5467,7 +5567,7 @@ class Menu extends Component {
         return menu.name(this.env);
     }
     isRoot(menu) {
-        return !menu.action;
+        return !menu.execute;
     }
     isEnabled(menu) {
         if (menu.isEnabled(this.env)) {
@@ -5514,7 +5614,7 @@ class Menu extends Component {
         }
     }
     onMouseOver(menu, position, ev) {
-        if (menu.isEnabled(this.env)) {
+        if (this.isEnabled(menu)) {
             if (this.isRoot(menu)) {
                 this.openSubMenu(menu, position, ev);
             }
@@ -5651,35 +5751,108 @@ LinkDisplay.props = {
     onClosed: { type: Function, optional: true },
 };
 
-function createMenu(menuItems) {
-    return menuItems.map(createMenuItem).sort((a, b) => a.sequence - b.sequence);
+const linkSheet = {
+    name: _lt("Link sheet"),
+    children: [
+        (env) => {
+            const sheets = env.model.getters
+                .getSheetIds()
+                .map((sheetId) => env.model.getters.getSheet(sheetId));
+            return sheets.map((sheet) => ({
+                id: sheet.id,
+                name: sheet.name,
+                execute: () => markdownLink(sheet.name, buildSheetLink(sheet.id)),
+            }));
+        },
+    ],
+};
+const deleteSheet = {
+    name: _lt("Delete"),
+    isVisible: (env) => {
+        return env.model.getters.getSheetIds().length > 1;
+    },
+    execute: (env) => env.askConfirmation(_lt("Are you sure you want to delete this sheet ?"), () => {
+        env.model.dispatch("DELETE_SHEET", { sheetId: env.model.getters.getActiveSheetId() });
+    }),
+};
+const duplicateSheet = {
+    name: _lt("Duplicate"),
+    execute: (env) => {
+        const sheetIdFrom = env.model.getters.getActiveSheetId();
+        const sheetIdTo = env.model.uuidGenerator.uuidv4();
+        env.model.dispatch("DUPLICATE_SHEET", {
+            sheetId: sheetIdFrom,
+            sheetIdTo,
+        });
+        env.model.dispatch("ACTIVATE_SHEET", { sheetIdFrom, sheetIdTo });
+    },
+};
+const renameSheet = (args) => {
+    return {
+        name: _lt("Rename"),
+        execute: args.renameSheetCallback,
+    };
+};
+const sheetMoveRight = {
+    name: _lt("Move right"),
+    isVisible: (env) => {
+        const sheetId = env.model.getters.getActiveSheetId();
+        const sheetIds = env.model.getters.getVisibleSheetIds();
+        return sheetIds.indexOf(sheetId) !== sheetIds.length - 1;
+    },
+    execute: (env) => env.model.dispatch("MOVE_SHEET", {
+        sheetId: env.model.getters.getActiveSheetId(),
+        delta: 1,
+    }),
+};
+const sheetMoveLeft = {
+    name: _lt("Move left"),
+    isVisible: (env) => {
+        const sheetId = env.model.getters.getActiveSheetId();
+        return env.model.getters.getVisibleSheetIds()[0] !== sheetId;
+    },
+    execute: (env) => env.model.dispatch("MOVE_SHEET", {
+        sheetId: env.model.getters.getActiveSheetId(),
+        delta: -1,
+    }),
+};
+const hideSheet = {
+    name: _lt("Hide sheet"),
+    isVisible: (env) => env.model.getters.getVisibleSheetIds().length !== 1,
+    execute: (env) => env.model.dispatch("HIDE_SHEET", { sheetId: env.model.getters.getActiveSheetId() }),
+};
+
+function createActions(menuItems) {
+    return menuItems.map(createAction).sort((a, b) => a.sequence - b.sequence);
 }
-const uuidGenerator$1 = new UuidGenerator();
-function createMenuItem(item) {
+const uuidGenerator$2 = new UuidGenerator();
+function createAction(item) {
     const name = item.name;
     const children = item.children;
     return {
-        id: item.id || uuidGenerator$1.uuidv4(),
+        id: item.id || uuidGenerator$2.uuidv4(),
         name: typeof name === "function" ? name : () => name,
         isVisible: item.isVisible ? item.isVisible : () => true,
         isEnabled: item.isEnabled ? item.isEnabled : () => true,
-        action: item.action,
+        isActive: item.isActive,
+        execute: item.execute,
         children: children
             ? (env) => {
                 return children
                     .map((child) => (typeof child === "function" ? child(env) : child))
                     .flat()
-                    .map(createMenuItem);
+                    .map(createAction);
             }
             : () => [],
         isReadonlyAllowed: item.isReadonlyAllowed || false,
         separator: item.separator || false,
-        icon: item.icon,
+        icon: item.icon || "",
         description: item.description || "",
         textColor: item.textColor,
         sequence: item.sequence || 0,
     };
-}
+}
+
 /**
  * The class Registry is extended in order to add the function addChild
  *
@@ -5726,7 +5899,7 @@ class MenuItemRegistry extends Registry {
         return this;
     }
     getMenuItems() {
-        return createMenu(this.getAll());
+        return createActions(this.getAll());
     }
 }
 
@@ -5734,20 +5907,9 @@ class MenuItemRegistry extends Registry {
 // Link Menu Registry
 //------------------------------------------------------------------------------
 const linkMenuRegistry = new MenuItemRegistry();
-linkMenuRegistry
-    .add("sheet", {
-    name: _lt("Link sheet"),
+linkMenuRegistry.add("sheet", {
+    ...linkSheet,
     sequence: 10,
-})
-    .addChild("sheet_list", ["sheet"], (env) => {
-    const sheets = env.model.getters
-        .getSheetIds()
-        .map((sheetId) => env.model.getters.getSheet(sheetId));
-    return sheets.map((sheet) => ({
-        id: sheet.id,
-        name: sheet.name,
-        action: () => markdownLink(sheet.name, buildSheetLink(sheet.id)),
-    }));
 });
 
 const MENU_OFFSET_X = 320;
@@ -6411,18 +6573,6 @@ const ChartTerms = {
         [43 /* CommandResult.GaugeUpperInflectionPointNaN */]: _lt("The upper inflection point value must be a number"),
     },
 };
-const NumberFormatTerms = {
-    Automatic: _lt("Automatic"),
-    Number: _lt("Number"),
-    Percent: _lt("Percent"),
-    Currency: _lt("Currency"),
-    CurrencyRounded: _lt("Currency rounded"),
-    Date: _lt("Date"),
-    Time: _lt("Time"),
-    DateTime: _lt("Date time"),
-    Duration: _lt("Duration"),
-    CustomCurrency: _lt("Custom currency"),
-};
 const CustomCurrencyTerms = {
     Custom: _lt("Custom"),
 };
@@ -7966,7 +8116,7 @@ function getChartMenu(figureId, onFigureDeleted, env) {
             id: "edit",
             name: _lt("Edit"),
             sequence: 1,
-            action: () => {
+            execute: () => {
                 env.model.dispatch("SELECT_FIGURE", { id: figureId });
                 env.openSidePanel("ChartPanel");
             },
@@ -7975,7 +8125,7 @@ function getChartMenu(figureId, onFigureDeleted, env) {
         getCutMenuItem(figureId, env),
         getDeleteMenuItem(figureId, onFigureDeleted, env),
     ];
-    return createMenu(menuItemSpecs);
+    return createActions(menuItemSpecs);
 }
 function getImageMenuRegistry(figureId, onFigureDeleted, env) {
     const menuItemSpecs = [
@@ -7985,7 +8135,7 @@ function getImageMenuRegistry(figureId, onFigureDeleted, env) {
             id: "reset_size",
             name: _lt("Reset size"),
             sequence: 4,
-            action: () => {
+            execute: () => {
                 const size = env.model.getters.getImageSize(figureId);
                 const { height, width } = getMaxFigureSize(env.model.getters, size);
                 env.model.dispatch("UPDATE_FIGURE", {
@@ -7998,7 +8148,7 @@ function getImageMenuRegistry(figureId, onFigureDeleted, env) {
         },
         getDeleteMenuItem(figureId, onFigureDeleted, env),
     ];
-    return createMenu(menuItemSpecs);
+    return createActions(menuItemSpecs);
 }
 function getCopyMenuItem(figureId, env) {
     return {
@@ -8006,7 +8156,7 @@ function getCopyMenuItem(figureId, env) {
         name: _lt("Copy"),
         sequence: 2,
         description: "Ctrl+C",
-        action: async () => {
+        execute: async () => {
             env.model.dispatch("SELECT_FIGURE", { id: figureId });
             env.model.dispatch("COPY");
             await env.clipboard.write(env.model.getters.getClipboardContent());
@@ -8019,7 +8169,7 @@ function getCutMenuItem(figureId, env) {
         name: _lt("Cut"),
         sequence: 3,
         description: "Ctrl+X",
-        action: async () => {
+        execute: async () => {
             env.model.dispatch("SELECT_FIGURE", { id: figureId });
             env.model.dispatch("CUT");
             await env.clipboard.write(env.model.getters.getClipboardContent());
@@ -8031,7 +8181,7 @@ function getDeleteMenuItem(figureId, onFigureDeleted, env) {
         id: "delete",
         name: _lt("Delete"),
         sequence: 10,
-        action: () => {
+        execute: () => {
             env.model.dispatch("DELETE_FIGURE", {
                 sheetId: env.model.getters.getActiveSheetId(),
                 id: figureId,
@@ -8138,6 +8288,22 @@ function inverseUnhideColumnsRows(cmd) {
     ];
 }
 
+const AddMergeInteractiveContent = {
+    MergeIsDestructive: _lt("Merging these cells will only preserve the top-leftmost value. Merge anyway?"),
+    MergeInFilter: _lt("You can't merge cells inside of an existing filter."),
+};
+function interactiveAddMerge(env, sheetId, target) {
+    const result = env.model.dispatch("ADD_MERGE", { sheetId, target });
+    if (result.isCancelledBecause(80 /* CommandResult.MergeInFilter */)) {
+        env.raiseError(AddMergeInteractiveContent.MergeInFilter);
+    }
+    else if (result.isCancelledBecause(3 /* CommandResult.MergeIsDestructive */)) {
+        env.askConfirmation(AddMergeInteractiveContent.MergeIsDestructive, () => {
+            env.model.dispatch("ADD_MERGE", { sheetId, target, force: true });
+        });
+    }
+}
+
 /**
  * Create a function used to create a Chart based on the definition
  */
@@ -8493,9 +8659,9 @@ const CUT_ACTION = async (env) => {
     interactiveCut(env);
     await env.clipboard.write(env.model.getters.getClipboardContent());
 };
-const PASTE_ACTION = async (env) => paste(env);
-const PASTE_VALUE_ACTION = async (env) => paste(env, "onlyValue");
-async function paste(env, pasteOption) {
+const PASTE_ACTION = async (env) => paste$1(env);
+const PASTE_VALUE_ACTION = async (env) => paste$1(env, "onlyValue");
+async function paste$1(env, pasteOption) {
     const spreadsheetClipboard = env.model.getters.getClipboardTextContent();
     const osClipboard = await env.clipboard.readText();
     switch (osClipboard.status) {
@@ -9049,365 +9215,159 @@ const IS_ONLY_ONE_RANGE = (env) => {
     return env.model.getters.getSelectedZones().length === 1;
 };
 
-//------------------------------------------------------------------------------
-// Context Menu Registry
-//------------------------------------------------------------------------------
-const cellMenuRegistry = new MenuItemRegistry();
-cellMenuRegistry
-    .add("cut", {
-    name: _lt("Cut"),
-    description: "Ctrl+X",
-    sequence: 10,
-    action: CUT_ACTION,
-})
-    .add("copy", {
+const undo = {
+    name: _lt("Undo"),
+    description: "Ctrl+Z",
+    execute: UNDO_ACTION,
+    isEnabled: (env) => env.model.getters.canUndo(),
+    icon: "o-spreadsheet-Icon.UNDO",
+};
+const redo = {
+    name: _lt("Redo"),
+    description: "Ctrl+Y",
+    execute: REDO_ACTION,
+    isEnabled: (env) => env.model.getters.canRedo(),
+    icon: "o-spreadsheet-Icon.REDO",
+};
+const copy = {
     name: _lt("Copy"),
     description: "Ctrl+C",
-    sequence: 20,
     isReadonlyAllowed: true,
-    action: COPY_ACTION,
-})
-    .add("paste", {
-    name: _lt("Paste"),
-    description: "Ctrl+V",
-    sequence: 30,
-    action: PASTE_ACTION,
-})
-    .add("paste_special", {
-    name: _lt("Paste special"),
-    sequence: 40,
-    separator: true,
-    isVisible: IS_NOT_CUT_OPERATION,
-})
-    .addChild("paste_value_only", ["paste_special"], {
-    name: _lt("Paste values only"),
-    sequence: 10,
-    action: PASTE_VALUE_ACTION,
-})
-    .addChild("paste_format_only", ["paste_special"], {
-    name: _lt("Paste format only"),
-    sequence: 20,
-    action: PASTE_FORMAT_ACTION,
-})
-    .add("add_row_before", {
-    name: CELL_INSERT_ROWS_BEFORE_NAME,
-    sequence: 70,
-    action: INSERT_ROWS_BEFORE_ACTION,
-    isVisible: IS_ONLY_ONE_RANGE,
-})
-    .add("add_column_before", {
-    name: CELL_INSERT_COLUMNS_BEFORE_NAME,
-    sequence: 90,
-    action: INSERT_COLUMNS_BEFORE_ACTION,
-    isVisible: IS_ONLY_ONE_RANGE,
-})
-    .add("insert_cell", {
-    name: _lt("Insert cells"),
-    sequence: 100,
-    isVisible: IS_ONLY_ONE_RANGE,
-    separator: true,
-})
-    .addChild("insert_cell_down", ["insert_cell"], {
-    name: _lt("Shift down"),
-    sequence: 10,
-    action: INSERT_CELL_SHIFT_DOWN,
-})
-    .addChild("insert_cell_right", ["insert_cell"], {
-    name: _lt("Shift right"),
-    sequence: 20,
-    action: INSERT_CELL_SHIFT_RIGHT,
-})
-    .add("delete_row", {
-    name: REMOVE_ROWS_NAME,
-    sequence: 110,
-    action: REMOVE_ROWS_ACTION,
-    isVisible: IS_ONLY_ONE_RANGE,
-})
-    .add("delete_column", {
-    name: REMOVE_COLUMNS_NAME,
-    sequence: 120,
-    action: REMOVE_COLUMNS_ACTION,
-    isVisible: IS_ONLY_ONE_RANGE,
-})
-    .add("delete_cell", {
-    name: _lt("Delete cells"),
-    sequence: 130,
-    isVisible: IS_ONLY_ONE_RANGE,
-})
-    .addChild("delete_cell_up", ["delete_cell"], {
-    name: _lt("Shift up"),
-    sequence: 10,
-    action: DELETE_CELL_SHIFT_UP,
-})
-    .addChild("delete_cell_down", ["delete_cell"], {
-    name: _lt("Shift left"),
-    sequence: 20,
-    action: DELETE_CELL_SHIFT_LEFT,
-})
-    .add("insert_link", {
-    name: _lt("Insert link"),
-    separator: true,
-    sequence: 150,
-    action: INSERT_LINK,
-});
-
-const colMenuRegistry = new MenuItemRegistry();
-colMenuRegistry
-    .add("cut", {
+    execute: COPY_ACTION,
+};
+const cut = {
     name: _lt("Cut"),
     description: "Ctrl+X",
-    sequence: 10,
-    action: CUT_ACTION,
-})
-    .add("copy", {
-    name: _lt("Copy"),
-    description: "Ctrl+C",
-    sequence: 20,
-    isReadonlyAllowed: true,
-    action: COPY_ACTION,
-})
-    .add("paste", {
+    execute: CUT_ACTION,
+};
+const paste = {
     name: _lt("Paste"),
     description: "Ctrl+V",
-    sequence: 30,
-    action: PASTE_ACTION,
-})
-    .add("paste_special", {
+    execute: PASTE_ACTION,
+};
+const pasteSpecial = {
     name: _lt("Paste special"),
-    sequence: 40,
-    separator: true,
     isVisible: IS_NOT_CUT_OPERATION,
-})
-    .addChild("paste_value_only", ["paste_special"], {
+};
+const pasteSpecialValue = {
     name: _lt("Paste value only"),
-    sequence: 10,
-    action: PASTE_VALUE_ACTION,
-})
-    .addChild("paste_format_only", ["paste_special"], {
+    execute: PASTE_VALUE_ACTION,
+};
+const pasteSpecialFormat = {
     name: _lt("Paste format only"),
-    sequence: 20,
-    action: PASTE_FORMAT_ACTION,
-})
-    .add("sort_columns", {
-    name: (env) => env.model.getters.getActiveCols().size > 1 ? _lt("Sort columns") : _lt("Sort column"),
-    sequence: 50,
+    execute: PASTE_FORMAT_ACTION,
+};
+const findAndReplace = {
+    name: _lt("Find and replace"),
+    description: "Ctrl+H",
+    isReadonlyAllowed: true,
+    execute: OPEN_FAR_SIDEPANEL_ACTION,
+};
+const deleteValues = {
+    name: _lt("Delete values"),
+    execute: DELETE_CONTENT_ACTION,
+};
+const deleteRows = {
+    name: REMOVE_ROWS_NAME,
+    execute: REMOVE_ROWS_ACTION,
+};
+const deleteRow = {
+    ...deleteRows,
     isVisible: IS_ONLY_ONE_RANGE,
-    separator: true,
-})
-    .addChild("sort_ascending", ["sort_columns"], {
-    name: _lt("Ascending (A ⟶ Z)"),
-    sequence: 10,
-    action: SORT_CELLS_ASCENDING,
-})
-    .addChild("sort_descending", ["sort_columns"], {
-    name: _lt("Descending (Z ⟶ A)"),
-    sequence: 20,
-    action: SORT_CELLS_DESCENDING,
-})
-    .add("add_column_before", {
-    name: COLUMN_INSERT_COLUMNS_BEFORE_NAME,
-    sequence: 70,
-    action: INSERT_COLUMNS_BEFORE_ACTION,
-})
-    .add("add_column_after", {
-    name: COLUMN_INSERT_COLUMNS_AFTER_NAME,
-    sequence: 80,
-    action: INSERT_COLUMNS_AFTER_ACTION,
-})
-    .add("delete_column", {
+};
+const clearRows = {
+    name: DELETE_CONTENT_ROWS_NAME,
+    execute: DELETE_CONTENT_ROWS_ACTION,
+};
+const deleteCols = {
     name: REMOVE_COLUMNS_NAME,
-    sequence: 90,
-    action: REMOVE_COLUMNS_ACTION,
-})
-    .add("clear_column", {
+    execute: REMOVE_COLUMNS_ACTION,
+};
+const deleteCol = {
+    ...deleteCols,
+    isVisible: IS_ONLY_ONE_RANGE,
+};
+const clearCols = {
     name: DELETE_CONTENT_COLUMNS_NAME,
-    sequence: 100,
-    action: DELETE_CONTENT_COLUMNS_ACTION,
-})
-    .add("hide_columns", {
-    name: HIDE_COLUMNS_NAME,
-    sequence: 85,
-    action: HIDE_COLUMNS_ACTION,
-    isVisible: (env) => {
-        const sheetId = env.model.getters.getActiveSheetId();
-        const hiddenCols = env.model.getters.getHiddenColsGroups(sheetId).flat();
-        return (env.model.getters.getNumberCols(sheetId) >
-            hiddenCols.length + env.model.getters.getElementsFromSelection("COL").length);
-    },
-    separator: true,
-})
-    .add("unhide_columns", {
-    name: _lt("Unhide columns"),
-    sequence: 86,
-    action: UNHIDE_COLUMNS_ACTION,
-    isVisible: (env) => {
-        const hiddenCols = env.model.getters
-            .getHiddenColsGroups(env.model.getters.getActiveSheetId())
-            .flat();
-        const currentCols = env.model.getters.getElementsFromSelection("COL");
-        return currentCols.some((col) => hiddenCols.includes(col));
-    },
-    separator: true,
-})
-    .add("conditional_formatting", {
-    name: _lt("Conditional formatting"),
-    sequence: 110,
-    action: OPEN_CF_SIDEPANEL_ACTION,
-});
+    execute: DELETE_CONTENT_COLUMNS_ACTION,
+};
+const deleteCells = {
+    name: _lt("Delete cells"),
+    isVisible: IS_ONLY_ONE_RANGE,
+};
+const deleteCellShiftUp = {
+    name: _lt("Delete cell and shift up"),
+    execute: DELETE_CELL_SHIFT_UP,
+};
+const deleteCellShiftLeft = {
+    name: _lt("Delete cell and shift left"),
+    execute: DELETE_CELL_SHIFT_LEFT,
+};
+const mergeCells = {
+    name: _lt("Merge cells"),
+    isEnabled: (env) => !cannotMerge(env),
+    isActive: (env) => isInMerge(env),
+    execute: (env) => toggleMerge(env),
+    icon: "o-spreadsheet-Icon.MERGE_CELL",
+};
+function cannotMerge(env) {
+    const zones = env.model.getters.getSelectedZones();
+    const { top, left, right, bottom } = env.model.getters.getSelectedZone();
+    const { sheetId } = env.model.getters.getActivePosition();
+    const { xSplit, ySplit } = env.model.getters.getPaneDivisions(sheetId);
+    return (zones.length > 1 ||
+        (top === bottom && left === right) ||
+        (left < xSplit && xSplit <= right) ||
+        (top < ySplit && ySplit <= bottom));
+}
+function isInMerge(env) {
+    if (!cannotMerge(env)) {
+        const zones = env.model.getters.getSelectedZones();
+        const { col, row, sheetId } = env.model.getters.getActivePosition();
+        const zone = env.model.getters.expandZone(sheetId, positionToZone({ col, row }));
+        return isEqual(zones[0], zone);
+    }
+    return false;
+}
+function toggleMerge(env) {
+    if (cannotMerge(env)) {
+        return;
+    }
+    const zones = env.model.getters.getSelectedZones();
+    const target = [zones[zones.length - 1]];
+    const sheetId = env.model.getters.getActiveSheetId();
+    if (isInMerge(env)) {
+        env.model.dispatch("REMOVE_MERGE", { sheetId, target });
+    }
+    else {
+        interactiveAddMerge(env, sheetId, target);
+    }
+}
 
-const rowMenuRegistry = new MenuItemRegistry();
-rowMenuRegistry
-    .add("cut", {
-    name: _lt("Cut"),
-    sequence: 10,
-    description: "Ctrl+X",
-    action: CUT_ACTION,
-})
-    .add("copy", {
-    name: _lt("Copy"),
-    description: "Ctrl+C",
-    sequence: 20,
-    isReadonlyAllowed: true,
-    action: COPY_ACTION,
-})
-    .add("paste", {
-    name: _lt("Paste"),
-    description: "Ctrl+V",
-    sequence: 30,
-    action: PASTE_ACTION,
-})
-    .add("paste_special", {
-    name: _lt("Paste special"),
-    sequence: 40,
-    separator: true,
-    isVisible: IS_NOT_CUT_OPERATION,
-})
-    .addChild("paste_value_only", ["paste_special"], {
-    name: _lt("Paste value only"),
-    sequence: 10,
-    action: PASTE_VALUE_ACTION,
-})
-    .addChild("paste_format_only", ["paste_special"], {
-    name: _lt("Paste format only"),
-    sequence: 20,
-    action: PASTE_FORMAT_ACTION,
-})
-    .add("add_row_before", {
-    name: ROW_INSERT_ROWS_BEFORE_NAME,
-    sequence: 50,
-    action: INSERT_ROWS_BEFORE_ACTION,
-})
-    .add("add_row_after", {
-    name: ROW_INSERT_ROWS_AFTER_NAME,
-    sequence: 60,
-    action: INSERT_ROWS_AFTER_ACTION,
-})
-    .add("delete_row", {
-    name: REMOVE_ROWS_NAME,
-    sequence: 70,
-    action: REMOVE_ROWS_ACTION,
-})
-    .add("clear_row", {
-    name: DELETE_CONTENT_ROWS_NAME,
-    sequence: 80,
-    action: DELETE_CONTENT_ROWS_ACTION,
-})
-    .add("hide_rows", {
-    name: HIDE_ROWS_NAME,
-    sequence: 85,
-    action: HIDE_ROWS_ACTION,
-    isVisible: (env) => {
-        const sheetId = env.model.getters.getActiveSheetId();
-        const hiddenRows = env.model.getters.getHiddenRowsGroups(sheetId).flat();
-        return (env.model.getters.getNumberRows(sheetId) >
-            hiddenRows.length + env.model.getters.getElementsFromSelection("ROW").length);
-    },
-    separator: true,
-})
-    .add("unhide_rows", {
-    name: _lt("Unhide rows"),
-    sequence: 86,
-    action: UNHIDE_ROWS_ACTION,
-    isVisible: (env) => {
-        const hiddenRows = env.model.getters
-            .getHiddenRowsGroups(env.model.getters.getActiveSheetId())
-            .flat();
-        const currentRows = env.model.getters.getElementsFromSelection("ROW");
-        return currentRows.some((col) => hiddenRows.includes(col));
-    },
-    separator: true,
-})
-    .add("conditional_formatting", {
-    name: _lt("Conditional formatting"),
-    sequence: 90,
-    action: OPEN_CF_SIDEPANEL_ACTION,
+var ACTION_EDIT = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  undo: undo,
+  redo: redo,
+  copy: copy,
+  cut: cut,
+  paste: paste,
+  pasteSpecial: pasteSpecial,
+  pasteSpecialValue: pasteSpecialValue,
+  pasteSpecialFormat: pasteSpecialFormat,
+  findAndReplace: findAndReplace,
+  deleteValues: deleteValues,
+  deleteRows: deleteRows,
+  deleteRow: deleteRow,
+  clearRows: clearRows,
+  deleteCols: deleteCols,
+  deleteCol: deleteCol,
+  clearCols: clearCols,
+  deleteCells: deleteCells,
+  deleteCellShiftUp: deleteCellShiftUp,
+  deleteCellShiftLeft: deleteCellShiftLeft,
+  mergeCells: mergeCells
 });
 
-function getSheetMenuRegistry(args) {
-    const sheetMenuRegistry = new MenuItemRegistry();
-    sheetMenuRegistry
-        .add("delete", {
-        name: _lt("Delete"),
-        sequence: 10,
-        isVisible: (env) => {
-            return env.model.getters.getSheetIds().length > 1;
-        },
-        action: (env) => env.askConfirmation(_lt("Are you sure you want to delete this sheet ?"), () => {
-            env.model.dispatch("DELETE_SHEET", { sheetId: env.model.getters.getActiveSheetId() });
-        }),
-    })
-        .add("duplicate", {
-        name: _lt("Duplicate"),
-        sequence: 20,
-        action: (env) => {
-            const sheetIdFrom = env.model.getters.getActiveSheetId();
-            const sheetIdTo = env.model.uuidGenerator.uuidv4();
-            env.model.dispatch("DUPLICATE_SHEET", {
-                sheetId: sheetIdFrom,
-                sheetIdTo,
-            });
-            env.model.dispatch("ACTIVATE_SHEET", { sheetIdFrom, sheetIdTo });
-        },
-    })
-        .add("rename", {
-        name: _lt("Rename"),
-        sequence: 30,
-        action: () => args.renameSheetCallback(),
-    })
-        .add("move_right", {
-        name: _lt("Move right"),
-        sequence: 40,
-        isVisible: (env) => {
-            const sheetId = env.model.getters.getActiveSheetId();
-            const sheetIds = env.model.getters.getVisibleSheetIds();
-            return sheetIds.indexOf(sheetId) !== sheetIds.length - 1;
-        },
-        action: (env) => env.model.dispatch("MOVE_SHEET", {
-            sheetId: env.model.getters.getActiveSheetId(),
-            delta: 1,
-        }),
-    })
-        .add("move_left", {
-        name: _lt("Move left"),
-        sequence: 50,
-        isVisible: (env) => {
-            const sheetId = env.model.getters.getActiveSheetId();
-            return env.model.getters.getVisibleSheetIds()[0] !== sheetId;
-        },
-        action: (env) => env.model.dispatch("MOVE_SHEET", {
-            sheetId: env.model.getters.getActiveSheetId(),
-            delta: -1,
-        }),
-    })
-        .add("hide_sheet", {
-        name: _lt("Hide sheet"),
-        sequence: 60,
-        isVisible: (env) => env.model.getters.getVisibleSheetIds().length !== 1,
-        action: (env) => env.model.dispatch("HIDE_SHEET", { sheetId: env.model.getters.getActiveSheetId() }),
-    });
-    return sheetMenuRegistry;
-}
-
 //------------------------------------------------------------------------------
 // Arg description DSL
 //------------------------------------------------------------------------------
@@ -16168,6 +16128,593 @@ for (let category of categories) {
     }
 }
 
+const rowInsertRowBefore = {
+    name: ROW_INSERT_ROWS_BEFORE_NAME,
+    execute: INSERT_ROWS_BEFORE_ACTION,
+};
+const topBarInsertRowsBefore = {
+    ...rowInsertRowBefore,
+    name: MENU_INSERT_ROWS_BEFORE_NAME,
+    isVisible: (env) => env.model.getters.getActiveCols().size === 0,
+};
+const cellInsertRowsBefore = {
+    ...rowInsertRowBefore,
+    name: CELL_INSERT_ROWS_BEFORE_NAME,
+    isVisible: IS_ONLY_ONE_RANGE,
+};
+const rowInsertRowsAfter = {
+    execute: INSERT_ROWS_AFTER_ACTION,
+    name: ROW_INSERT_ROWS_AFTER_NAME,
+};
+const topBarInsertRowsAfter = {
+    ...rowInsertRowsAfter,
+    name: MENU_INSERT_ROWS_AFTER_NAME,
+    isVisible: (env) => env.model.getters.getActiveCols().size === 0,
+};
+const colInsertColsBefore = {
+    name: COLUMN_INSERT_COLUMNS_BEFORE_NAME,
+    execute: INSERT_COLUMNS_BEFORE_ACTION,
+};
+const topBarInsertColsBefore = {
+    ...colInsertColsBefore,
+    name: MENU_INSERT_COLUMNS_BEFORE_NAME,
+    isVisible: (env) => env.model.getters.getActiveRows().size === 0,
+};
+const cellInsertColsBefore = {
+    ...colInsertColsBefore,
+    name: CELL_INSERT_COLUMNS_BEFORE_NAME,
+    isVisible: IS_ONLY_ONE_RANGE,
+};
+const colInsertColsAfter = {
+    name: COLUMN_INSERT_COLUMNS_AFTER_NAME,
+    execute: INSERT_COLUMNS_AFTER_ACTION,
+};
+const topBarInsertColsAfter = {
+    ...colInsertColsAfter,
+    name: MENU_INSERT_COLUMNS_AFTER_NAME,
+    execute: INSERT_COLUMNS_AFTER_ACTION,
+    isVisible: (env) => env.model.getters.getActiveRows().size === 0,
+};
+const insertCell = {
+    name: _lt("Insert cells"),
+    isVisible: IS_ONLY_ONE_RANGE,
+};
+const insertCellShiftDown = {
+    name: _lt("Insert cells and shift down"),
+    execute: INSERT_CELL_SHIFT_DOWN,
+};
+const insertCellShiftRight = {
+    name: _lt("Insert cells and shift right"),
+    execute: INSERT_CELL_SHIFT_RIGHT,
+};
+const insertChart = {
+    name: _lt("Chart"),
+    execute: CREATE_CHART,
+};
+const insertImage = {
+    name: _lt("Image"),
+    execute: CREATE_IMAGE,
+    isVisible: (env) => env.imageProvider !== undefined,
+};
+const insertFunction = {
+    name: _lt("Function"),
+};
+const insertFunctionSum = {
+    name: _lt("SUM"),
+    execute: (env) => env.startCellEdition(`=SUM(`),
+};
+const insertFunctionAverage = {
+    name: _lt("AVERAGE"),
+    execute: (env) => env.startCellEdition(`=AVERAGE(`),
+};
+const insertFunctionCount = {
+    name: _lt("COUNT"),
+    execute: (env) => env.startCellEdition(`=COUNT(`),
+};
+const insertFunctionMax = {
+    name: _lt("MAX"),
+    execute: (env) => env.startCellEdition(`=MAX(`),
+};
+const insertFunctionMin = {
+    name: _lt("MIN"),
+    execute: (env) => env.startCellEdition(`=MIN(`),
+};
+const categorieFunctionAll = {
+    name: _lt("All"),
+    children: allFunctionListMenuBuilder(),
+};
+function allFunctionListMenuBuilder() {
+    const fnNames = functionRegistry.getKeys();
+    return createFormulaFunctions(fnNames);
+}
+const categoriesFunctionListMenuBuilder = () => {
+    const functions = functionRegistry.content;
+    const categories = [...new Set(functionRegistry.getAll().map((fn) => fn.category))].filter(isDefined$1);
+    return categories.sort().map((category, i) => {
+        const functionsInCategory = Object.keys(functions).filter((key) => functions[key].category === category);
+        return {
+            name: category,
+            children: createFormulaFunctions(functionsInCategory),
+        };
+    });
+};
+const insertLink = {
+    name: _lt("Link"),
+    execute: INSERT_LINK,
+};
+const insertSheet = {
+    name: _lt("New sheet"),
+    execute: CREATE_SHEET_ACTION,
+};
+function createFormulaFunctions(fnNames) {
+    return fnNames.sort().map((fnName, i) => {
+        return {
+            name: fnName,
+            sequence: i * 10,
+            execute: (env) => env.startCellEdition(`=${fnName}(`),
+        };
+    });
+}
+
+//------------------------------------------------------------------------------
+// Context Menu Registry
+//------------------------------------------------------------------------------
+const cellMenuRegistry = new MenuItemRegistry();
+cellMenuRegistry
+    .add("cut", {
+    ...cut,
+    sequence: 10,
+})
+    .add("copy", {
+    ...copy,
+    sequence: 20,
+})
+    .add("paste", {
+    ...paste,
+    sequence: 30,
+})
+    .add("paste_special", {
+    ...pasteSpecial,
+    sequence: 40,
+    separator: true,
+})
+    .addChild("paste_value_only", ["paste_special"], {
+    ...pasteSpecialValue,
+    sequence: 10,
+})
+    .addChild("paste_format_only", ["paste_special"], {
+    ...pasteSpecialFormat,
+    sequence: 20,
+})
+    .add("add_row_before", {
+    ...cellInsertRowsBefore,
+    sequence: 70,
+})
+    .add("add_column_before", {
+    ...cellInsertColsBefore,
+    sequence: 90,
+})
+    .add("insert_cell", {
+    ...insertCell,
+    sequence: 100,
+    separator: true,
+})
+    .addChild("insert_cell_down", ["insert_cell"], {
+    ...insertCellShiftDown,
+    name: _lt("Shift down"),
+    sequence: 10,
+})
+    .addChild("insert_cell_right", ["insert_cell"], {
+    ...insertCellShiftRight,
+    name: _lt("Shift right"),
+    sequence: 20,
+})
+    .add("delete_row", {
+    ...deleteRow,
+    sequence: 110,
+})
+    .add("delete_column", {
+    ...deleteCol,
+    sequence: 120,
+})
+    .add("delete_cell", {
+    ...deleteCells,
+    sequence: 130,
+})
+    .addChild("delete_cell_up", ["delete_cell"], {
+    ...deleteCellShiftUp,
+    name: _lt("Shift up"),
+    sequence: 10,
+})
+    .addChild("delete_cell_left", ["delete_cell"], {
+    ...deleteCellShiftLeft,
+    name: _lt("Shift left"),
+    sequence: 20,
+})
+    .add("insert_link", {
+    ...insertLink,
+    name: _lt("Insert link"),
+    sequence: 150,
+    separator: true,
+});
+
+const sortRange = {
+    name: _lt("Sort range"),
+    isVisible: IS_ONLY_ONE_RANGE,
+};
+const sortAscending = {
+    name: _lt("Ascending (A ⟶ Z)"),
+    execute: SORT_CELLS_ASCENDING,
+};
+const sortDescending = {
+    name: _lt("Descending (Z ⟶ A)"),
+    execute: SORT_CELLS_DESCENDING,
+};
+const addDataFilter = {
+    name: _lt("Create filter"),
+    execute: FILTERS_CREATE_FILTER_TABLE,
+    isVisible: (env) => !SELECTION_CONTAINS_FILTER(env),
+    isEnabled: (env) => SELECTION_IS_CONTINUOUS(env),
+    icon: "o-spreadsheet-Icon.FILTER_ICON_INACTIVE",
+};
+const removeDataFilter = {
+    name: _lt("Remove filter"),
+    execute: FILTERS_REMOVE_FILTER_TABLE,
+    isVisible: SELECTION_CONTAINS_FILTER,
+    icon: "o-spreadsheet-Icon.FILTER_ICON_INACTIVE",
+};
+
+const formatNumberAutomatic = {
+    name: _lt("Automatic"),
+    execute: FORMAT_AUTOMATIC_ACTION,
+    isActive: (env) => isAutomaticFormatSelected(env),
+};
+const formatNumberNumber = {
+    name: _lt("Number"),
+    description: "1,000.12",
+    execute: FORMAT_NUMBER_ACTION,
+    isActive: (env) => isFormatSelected(env, "#,##0.00"),
+};
+const formatPercent = {
+    name: _lt("Format as percent"),
+    execute: FORMAT_PERCENT_ACTION,
+    icon: "o-spreadsheet-Icon.PERCENT",
+};
+const formatNumberPercent = {
+    name: _lt("Percent"),
+    description: "10.12%",
+    execute: FORMAT_PERCENT_ACTION,
+    isActive: (env) => isFormatSelected(env, "0.00%"),
+};
+const formatNumberCurrency = {
+    name: _lt("Currency"),
+    description: "$1,000.12",
+    execute: FORMAT_CURRENCY_ACTION,
+    isActive: (env) => isFormatSelected(env, "[$$]#,##0.00"),
+};
+const formatNumberCurrencyRounded = {
+    name: _lt("Currency rounded"),
+    description: "$1,000",
+    execute: FORMAT_CURRENCY_ROUNDED_ACTION,
+    isActive: (env) => isFormatSelected(env, "[$$]#,##0"),
+};
+const formatCustomCurrency = {
+    name: _lt("Custom currency"),
+    isVisible: (env) => env.loadCurrencies !== undefined,
+    execute: OPEN_CUSTOM_CURRENCY_SIDEPANEL_ACTION,
+};
+const formatNumberDate = {
+    name: _lt("Date"),
+    description: "9/26/2008",
+    execute: FORMAT_DATE_ACTION,
+    isActive: (env) => isFormatSelected(env, "m/d/yyyy"),
+};
+const formatNumberTime = {
+    name: _lt("Time"),
+    description: "10:43:00 PM",
+    execute: FORMAT_TIME_ACTION,
+    isActive: (env) => isFormatSelected(env, "hh:mm:ss a"),
+};
+const formatNumberDateTime = {
+    name: _lt("Date time"),
+    description: "9/26/2008 22:43:00",
+    execute: FORMAT_DATE_TIME_ACTION,
+    isActive: (env) => isFormatSelected(env, "m/d/yyyy hh:mm:ss"),
+};
+const formatNumberDuration = {
+    name: _lt("Duration"),
+    description: "27:51:38",
+    execute: FORMAT_DURATION_ACTION,
+    isActive: (env) => isFormatSelected(env, "hhhh:mm:ss"),
+};
+const incraseDecimalPlaces = {
+    name: _lt("Increase decimal places"),
+    icon: "o-spreadsheet-Icon.INCREASE_DECIMAL",
+    execute: (env) => env.model.dispatch("SET_DECIMAL", {
+        sheetId: env.model.getters.getActiveSheetId(),
+        target: env.model.getters.getSelectedZones(),
+        step: 1,
+    }),
+};
+const decraseDecimalPlaces = {
+    name: _lt("Decrease decimal places"),
+    icon: "o-spreadsheet-Icon.DECRASE_DECIMAL",
+    execute: (env) => env.model.dispatch("SET_DECIMAL", {
+        sheetId: env.model.getters.getActiveSheetId(),
+        target: env.model.getters.getSelectedZones(),
+        step: -1,
+    }),
+};
+const formatBold = {
+    name: _lt("Bold"),
+    description: "Ctrl+B",
+    execute: FORMAT_BOLD_ACTION,
+    icon: "o-spreadsheet-Icon.BOLD",
+    isActive: (env) => !!env.model.getters.getCurrentStyle().bold,
+};
+const formatItalic = {
+    name: _lt("Italic"),
+    description: "Ctrl+I",
+    execute: FORMAT_ITALIC_ACTION,
+    icon: "o-spreadsheet-Icon.ITALIC",
+    isActive: (env) => !!env.model.getters.getCurrentStyle().italic,
+};
+const formatUnderline = {
+    name: _lt("Underline"),
+    description: "Ctrl+U",
+    execute: FORMAT_UNDERLINE_ACTION,
+    icon: "o-spreadsheet-Icon.UNDERLINE",
+    isActive: (env) => !!env.model.getters.getCurrentStyle().underline,
+};
+const formatStrikethrough = {
+    name: _lt("Strikethrough"),
+    execute: FORMAT_STRIKETHROUGH_ACTION,
+    icon: "o-spreadsheet-Icon.STRIKE",
+    isActive: (env) => !!env.model.getters.getCurrentStyle().strikethrough,
+};
+const formatFontSize = {
+    name: _lt("Font size"),
+    children: fontSizeMenuBuilder(),
+};
+const formatAlignment = {
+    name: _lt("Alignment"),
+    icon: "o-spreadsheet-Icon.ALIGN_LEFT",
+};
+const formatAlignmentHorizontal = {
+    name: _lt("Horizontal align"),
+    icon: "o-spreadsheet-Icon.ALIGN_LEFT",
+};
+const formatAlignmentLeft = {
+    name: _lt("Left"),
+    execute: (env) => setStyle(env, { align: "left" }),
+    isActive: (env) => getHorizontalAlign(env) === "left",
+    icon: "o-spreadsheet-Icon.ALIGN_LEFT",
+};
+const formatAlignmentCenter = {
+    name: _lt("Center"),
+    execute: (env) => setStyle(env, { align: "center" }),
+    isActive: (env) => getHorizontalAlign(env) === "center",
+    icon: "o-spreadsheet-Icon.ALIGN_CENTER",
+};
+const formatAlignmentRight = {
+    name: _lt("Right"),
+    execute: (env) => setStyle(env, { align: "right" }),
+    isActive: (env) => getHorizontalAlign(env) === "right",
+    icon: "o-spreadsheet-Icon.ALIGN_RIGHT",
+};
+const formatAlignmentVertical = {
+    name: _lt("Vertical align"),
+    icon: "o-spreadsheet-Icon.ALIGN_MIDDLE",
+};
+const formatAlignmentTop = {
+    name: _lt("Top"),
+    execute: (env) => setStyle(env, { verticalAlign: "top" }),
+    isActive: (env) => (env.model.getters.getCurrentStyle().verticalAlign || DEFAULT_VERTICAL_ALIGN) === "top",
+    icon: "o-spreadsheet-Icon.ALIGN_TOP",
+};
+const formatAlignmentMiddle = {
+    name: _lt("Middle"),
+    execute: (env) => setStyle(env, { verticalAlign: "middle" }),
+    isActive: (env) => (env.model.getters.getCurrentStyle().verticalAlign || DEFAULT_VERTICAL_ALIGN) === "middle",
+    icon: "o-spreadsheet-Icon.ALIGN_MIDDLE",
+};
+const formatAlignmentBottom = {
+    name: _lt("Bottom"),
+    execute: (env) => setStyle(env, { verticalAlign: "bottom" }),
+    isActive: (env) => (env.model.getters.getCurrentStyle().verticalAlign || DEFAULT_VERTICAL_ALIGN) === "bottom",
+    icon: "o-spreadsheet-Icon.ALIGN_BOTTOM",
+};
+const formatWrapping = {
+    name: _lt("Wrapping"),
+    icon: "o-spreadsheet-Icon.WRAPPING_OVERFLOW",
+};
+const formatWrappingOverflow = {
+    name: _lt("Overflow"),
+    execute: (env) => setStyle(env, { wrapping: "overflow" }),
+    isActive: (env) => (env.model.getters.getCurrentStyle().wrapping || "overflow") === "overflow",
+    icon: "o-spreadsheet-Icon.WRAPPING_OVERFLOW",
+};
+const formatWrappingWrap = {
+    name: _lt("Wrap"),
+    execute: (env) => setStyle(env, { wrapping: "wrap" }),
+    isActive: (env) => env.model.getters.getCurrentStyle().wrapping === "wrap",
+    icon: "o-spreadsheet-Icon.WRAPPING_WRAP",
+};
+const formatWrappingClip = {
+    name: _lt("Clip"),
+    execute: (env) => setStyle(env, { wrapping: "clip" }),
+    isActive: (env) => env.model.getters.getCurrentStyle().wrapping === "clip",
+    icon: "o-spreadsheet-Icon.WRAPPING_CLIP",
+};
+const textColor = {
+    name: _lt("Text Color"),
+    icon: "o-spreadsheet-Icon.TEXT_COLOR",
+};
+const fillColor = {
+    name: _lt("Fill Color"),
+    icon: "o-spreadsheet-Icon.FILL_COLOR",
+};
+const formatCF = {
+    name: _lt("Conditional formatting"),
+    execute: OPEN_CF_SIDEPANEL_ACTION,
+};
+const paintFormat = {
+    name: _lt("Paint Format"),
+    execute: (env) => env.model.dispatch("ACTIVATE_PAINT_FORMAT", {
+        target: env.model.getters.getSelectedZones(),
+    }),
+    icon: "o-spreadsheet-Icon.PAINT_FORMAT",
+    isActive: (env) => env.model.getters.isPaintingFormat(),
+};
+const clearFormat = {
+    name: _lt("Clear formatting"),
+    execute: FORMAT_CLEARFORMAT_ACTION,
+    icon: "o-spreadsheet-Icon.CLEAR_FORMAT",
+};
+const borders = {
+    name: _lt("Borders"),
+    icon: "o-spreadsheet-Icon.BORDERS",
+};
+const bordersAll = {
+    name: _lt("All borders"),
+    execute: (env) => setBorder(env, "all"),
+    icon: "o-spreadsheet-Icon.BORDERS",
+};
+const bordersInner = {
+    name: _lt("Inner borders"),
+    execute: (env) => setBorder(env, "hv"),
+    icon: "o-spreadsheet-Icon.BORDER_HV",
+};
+const bordersHorizontal = {
+    name: _lt("Horizontal borders"),
+    execute: (env) => setBorder(env, "h"),
+    icon: "o-spreadsheet-Icon.BORDER_H",
+};
+const bordersVertical = {
+    name: _lt("Vertical borders"),
+    execute: (env) => setBorder(env, "v"),
+    icon: "o-spreadsheet-Icon.BORDER_V",
+};
+const bordersExternal = {
+    name: _lt("External borders"),
+    execute: (env) => setBorder(env, "external"),
+    icon: "o-spreadsheet-Icon.BORDER_EXTERNAL",
+};
+const bordersLeft = {
+    name: _lt("Left borders"),
+    execute: (env) => setBorder(env, "left"),
+    icon: "o-spreadsheet-Icon.BORDER_LEFT",
+};
+const bordersTop = {
+    name: _lt("Top borders"),
+    execute: (env) => setBorder(env, "top"),
+    icon: "o-spreadsheet-Icon.BORDER_TOP",
+};
+const bordersRight = {
+    name: _lt("Right borders"),
+    execute: (env) => setBorder(env, "right"),
+    icon: "o-spreadsheet-Icon.BORDER_RIGHT",
+};
+const bordersBottom = {
+    name: _lt("Bottom borders"),
+    execute: (env) => setBorder(env, "bottom"),
+    icon: "o-spreadsheet-Icon.BORDER_BOTTOM",
+};
+const bordersClear = {
+    name: _lt("Clear borders"),
+    execute: (env) => setBorder(env, "clear"),
+    icon: "o-spreadsheet-Icon.BORDER_CLEAR",
+};
+function fontSizeMenuBuilder() {
+    return FONT_SIZES.map((fs) => {
+        return {
+            name: fs.toString(),
+            sequence: fs,
+            id: `font_size_${fs}`,
+            execute: (env) => setStyle(env, { fontSize: fs }),
+            isActive: (env) => isFontSizeSelected(env, fs),
+        };
+    });
+}
+function isAutomaticFormatSelected(env) {
+    const activeCell = env.model.getters.getActiveCell();
+    return !activeCell || !activeCell.format;
+}
+function isFormatSelected(env, format) {
+    const activeCell = env.model.getters.getActiveCell();
+    return activeCell && activeCell.format === format;
+}
+function isFontSizeSelected(env, fontSize) {
+    const currentFontSize = env.model.getters.getCurrentStyle().fontSize || DEFAULT_FONT_SIZE;
+    return currentFontSize === fontSize;
+}
+function setBorder(env, command) {
+    env.model.dispatch("SET_FORMATTING", {
+        sheetId: env.model.getters.getActiveSheetId(),
+        target: env.model.getters.getSelectedZones(),
+        border: command,
+    });
+}
+function getHorizontalAlign(env) {
+    const style = env.model.getters.getCurrentStyle();
+    if (style.align) {
+        return style.align;
+    }
+    const cell = env.model.getters.getActiveCell();
+    return cell.defaultAlign;
+}
+
+var ACTION_FORMAT = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  formatNumberAutomatic: formatNumberAutomatic,
+  formatNumberNumber: formatNumberNumber,
+  formatPercent: formatPercent,
+  formatNumberPercent: formatNumberPercent,
+  formatNumberCurrency: formatNumberCurrency,
+  formatNumberCurrencyRounded: formatNumberCurrencyRounded,
+  formatCustomCurrency: formatCustomCurrency,
+  formatNumberDate: formatNumberDate,
+  formatNumberTime: formatNumberTime,
+  formatNumberDateTime: formatNumberDateTime,
+  formatNumberDuration: formatNumberDuration,
+  incraseDecimalPlaces: incraseDecimalPlaces,
+  decraseDecimalPlaces: decraseDecimalPlaces,
+  formatBold: formatBold,
+  formatItalic: formatItalic,
+  formatUnderline: formatUnderline,
+  formatStrikethrough: formatStrikethrough,
+  formatFontSize: formatFontSize,
+  formatAlignment: formatAlignment,
+  formatAlignmentHorizontal: formatAlignmentHorizontal,
+  formatAlignmentLeft: formatAlignmentLeft,
+  formatAlignmentCenter: formatAlignmentCenter,
+  formatAlignmentRight: formatAlignmentRight,
+  formatAlignmentVertical: formatAlignmentVertical,
+  formatAlignmentTop: formatAlignmentTop,
+  formatAlignmentMiddle: formatAlignmentMiddle,
+  formatAlignmentBottom: formatAlignmentBottom,
+  formatWrapping: formatWrapping,
+  formatWrappingOverflow: formatWrappingOverflow,
+  formatWrappingWrap: formatWrappingWrap,
+  formatWrappingClip: formatWrappingClip,
+  textColor: textColor,
+  fillColor: fillColor,
+  formatCF: formatCF,
+  paintFormat: paintFormat,
+  clearFormat: clearFormat,
+  borders: borders,
+  bordersAll: bordersAll,
+  bordersInner: bordersInner,
+  bordersHorizontal: bordersHorizontal,
+  bordersVertical: bordersVertical,
+  bordersExternal: bordersExternal,
+  bordersLeft: bordersLeft,
+  bordersTop: bordersTop,
+  bordersRight: bordersRight,
+  bordersBottom: bordersBottom,
+  bordersClear: bordersClear
+});
+
 function interactiveFreezeColumnsRows(env, dimension, base) {
     const sheetId = env.model.getters.getActiveSheetId();
     const cmd = dimension === "COL" ? "FREEZE_COLUMNS" : "FREEZE_ROWS";
@@ -16177,524 +16724,740 @@ function interactiveFreezeColumnsRows(env, dimension, base) {
     }
 }
 
-const topbarMenuRegistry = new MenuItemRegistry();
-topbarMenuRegistry
-    .add("file", { name: _lt("File"), sequence: 10 })
-    .add("edit", { name: _lt("Edit"), sequence: 20 })
-    .add("view", { name: _lt("View"), sequence: 30 })
-    .add("insert", { name: _lt("Insert"), sequence: 40 })
-    .add("format", { name: _lt("Format"), sequence: 50 })
-    .add("data", { name: _lt("Data"), sequence: 60 })
-    .addChild("save", ["file"], {
-    name: _lt("Save"),
-    description: "Ctrl+S",
-    sequence: 10,
-    action: () => console.log("Not implemented"),
-})
-    .addChild("undo", ["edit"], {
-    name: _lt("Undo"),
-    description: "Ctrl+Z",
+const hideCols = {
+    name: HIDE_COLUMNS_NAME,
+    execute: HIDE_COLUMNS_ACTION,
+    isVisible: (env) => {
+        const sheetId = env.model.getters.getActiveSheetId();
+        const hiddenCols = env.model.getters.getHiddenColsGroups(sheetId).flat();
+        return (env.model.getters.getNumberCols(sheetId) >
+            hiddenCols.length + env.model.getters.getElementsFromSelection("COL").length);
+    },
+};
+const unhideCols = {
+    name: _lt("Unhide columns"),
+    execute: UNHIDE_COLUMNS_ACTION,
+    isVisible: (env) => {
+        const hiddenCols = env.model.getters
+            .getHiddenColsGroups(env.model.getters.getActiveSheetId())
+            .flat();
+        const currentCols = env.model.getters.getElementsFromSelection("COL");
+        return currentCols.some((col) => hiddenCols.includes(col));
+    },
+};
+const unhideAllCols = {
+    name: _lt("Unhide all columns"),
+    execute: UNHIDE_ALL_COLUMNS_ACTION,
+    isVisible: (env) => env.model.getters.getHiddenColsGroups(env.model.getters.getActiveSheetId()).length > 0,
+};
+const hideRows = {
+    name: HIDE_ROWS_NAME,
+    execute: HIDE_ROWS_ACTION,
+    isVisible: (env) => {
+        const sheetId = env.model.getters.getActiveSheetId();
+        const hiddenRows = env.model.getters.getHiddenRowsGroups(sheetId).flat();
+        return (env.model.getters.getNumberRows(sheetId) >
+            hiddenRows.length + env.model.getters.getElementsFromSelection("ROW").length);
+    },
+};
+const unhideRows = {
+    name: _lt("Unhide rows"),
+    execute: UNHIDE_ROWS_ACTION,
+    isVisible: (env) => {
+        const hiddenRows = env.model.getters
+            .getHiddenRowsGroups(env.model.getters.getActiveSheetId())
+            .flat();
+        const currentRows = env.model.getters.getElementsFromSelection("ROW");
+        return currentRows.some((col) => hiddenRows.includes(col));
+    },
+};
+const unhideAllRows = {
+    name: _lt("Unhide all rows"),
+    execute: UNHIDE_ALL_ROWS_ACTION,
+    isVisible: (env) => env.model.getters.getHiddenRowsGroups(env.model.getters.getActiveSheetId()).length > 0,
+};
+const unFreezePane = {
+    name: _lt("Unfreeze"),
+    isVisible: (env) => {
+        const { xSplit, ySplit } = env.model.getters.getPaneDivisions(env.model.getters.getActiveSheetId());
+        return xSplit + ySplit > 0;
+    },
+    execute: (env) => env.model.dispatch("UNFREEZE_COLUMNS_ROWS", {
+        sheetId: env.model.getters.getActiveSheetId(),
+    }),
+};
+const freezePane = {
+    name: _lt("Freeze"),
+};
+const unFreezeRows = {
+    name: _lt("No rows"),
+    execute: (env) => env.model.dispatch("UNFREEZE_ROWS", {
+        sheetId: env.model.getters.getActiveSheetId(),
+    }),
+    isReadonlyAllowed: true,
+    isVisible: (env) => !!env.model.getters.getPaneDivisions(env.model.getters.getActiveSheetId()).ySplit,
+};
+const freezeFirstRow = {
+    name: _lt("1 row"),
+    execute: (env) => interactiveFreezeColumnsRows(env, "ROW", 1),
+    isReadonlyAllowed: true,
+};
+const freezeSecondRow = {
+    name: _lt("2 rows"),
+    execute: (env) => interactiveFreezeColumnsRows(env, "ROW", 2),
+    isReadonlyAllowed: true,
+};
+const freezeCurrentRow = {
+    name: _lt("Up to current row"),
+    execute: (env) => {
+        const { bottom } = env.model.getters.getSelectedZone();
+        interactiveFreezeColumnsRows(env, "ROW", bottom + 1);
+    },
+    isReadonlyAllowed: true,
+};
+const unFreezeCols = {
+    name: _lt("No columns"),
+    execute: (env) => env.model.dispatch("UNFREEZE_COLUMNS", {
+        sheetId: env.model.getters.getActiveSheetId(),
+    }),
+    isReadonlyAllowed: true,
+    isVisible: (env) => !!env.model.getters.getPaneDivisions(env.model.getters.getActiveSheetId()).xSplit,
+};
+const freezeFirstCol = {
+    name: _lt("1 column"),
+    execute: (env) => interactiveFreezeColumnsRows(env, "COL", 1),
+    isReadonlyAllowed: true,
+};
+const freezeSecondCol = {
+    name: _lt("2 columns"),
+    execute: (env) => interactiveFreezeColumnsRows(env, "COL", 2),
+    isReadonlyAllowed: true,
+};
+const freezeCurrentCol = {
+    name: _lt("Up to current column"),
+    execute: (env) => {
+        const { right } = env.model.getters.getSelectedZone();
+        interactiveFreezeColumnsRows(env, "COL", right + 1);
+    },
+    isReadonlyAllowed: true,
+};
+const viewGridlines = {
+    name: (env) => env.model.getters.getGridLinesVisibility(env.model.getters.getActiveSheetId())
+        ? _lt("Hide gridlines")
+        : _lt("Show gridlines"),
+    execute: SET_GRID_LINES_VISIBILITY_ACTION,
+};
+const viewFormulas = {
+    name: (env) => env.model.getters.shouldShowFormulas() ? _lt("Hide formulas") : _lt("Show formulas"),
+    execute: SET_FORMULA_VISIBILITY_ACTION,
+    isReadonlyAllowed: true,
+};
+const createRemoveFilter = {
+    name: (env) => selectionContainsFilter(env) ? _lt("Remove selected filters") : _lt("Create filter"),
+    isActive: (env) => selectionContainsFilter(env),
+    isEnabled: (env) => !cannotCreateFilter(env),
+    execute: (env) => createRemoveFilterAction(env),
+    icon: "o-spreadsheet-Icon.FILTER_ICON_INACTIVE",
+};
+function selectionContainsFilter(env) {
+    const sheetId = env.model.getters.getActiveSheetId();
+    const selectedZones = env.model.getters.getSelectedZones();
+    return env.model.getters.doesZonesContainFilter(sheetId, selectedZones);
+}
+function cannotCreateFilter(env) {
+    return !areZonesContinuous(...env.model.getters.getSelectedZones());
+}
+function createRemoveFilterAction(env) {
+    if (selectionContainsFilter(env)) {
+        env.model.dispatch("REMOVE_FILTER_TABLE", {
+            sheetId: env.model.getters.getActiveSheetId(),
+            target: env.model.getters.getSelectedZones(),
+        });
+        return;
+    }
+    if (cannotCreateFilter(env)) {
+        return;
+    }
+    env.model.selection.selectTableAroundSelection();
+    const sheetId = env.model.getters.getActiveSheetId();
+    const selection = env.model.getters.getSelectedZones();
+    interactiveAddFilter(env, sheetId, selection);
+}
+
+var ACTION_VIEW = /*#__PURE__*/Object.freeze({
+  __proto__: null,
+  hideCols: hideCols,
+  unhideCols: unhideCols,
+  unhideAllCols: unhideAllCols,
+  hideRows: hideRows,
+  unhideRows: unhideRows,
+  unhideAllRows: unhideAllRows,
+  unFreezePane: unFreezePane,
+  freezePane: freezePane,
+  unFreezeRows: unFreezeRows,
+  freezeFirstRow: freezeFirstRow,
+  freezeSecondRow: freezeSecondRow,
+  freezeCurrentRow: freezeCurrentRow,
+  unFreezeCols: unFreezeCols,
+  freezeFirstCol: freezeFirstCol,
+  freezeSecondCol: freezeSecondCol,
+  freezeCurrentCol: freezeCurrentCol,
+  viewGridlines: viewGridlines,
+  viewFormulas: viewFormulas,
+  createRemoveFilter: createRemoveFilter
+});
+
+const colMenuRegistry = new MenuItemRegistry();
+colMenuRegistry
+    .add("cut", {
+    ...cut,
     sequence: 10,
-    action: UNDO_ACTION,
 })
-    .addChild("redo", ["edit"], {
-    name: _lt("Redo"),
-    description: "Ctrl+Y",
+    .add("copy", {
+    ...copy,
     sequence: 20,
-    action: REDO_ACTION,
-    separator: true,
 })
-    .addChild("copy", ["edit"], {
-    name: _lt("Copy"),
-    description: "Ctrl+C",
+    .add("paste", {
+    ...paste,
     sequence: 30,
-    isReadonlyAllowed: true,
-    action: COPY_ACTION,
 })
-    .addChild("cut", ["edit"], {
-    name: _lt("Cut"),
-    description: "Ctrl+X",
+    .add("paste_special", {
+    ...pasteSpecial,
     sequence: 40,
-    action: CUT_ACTION,
+    separator: true,
 })
-    .addChild("paste", ["edit"], {
-    name: _lt("Paste"),
-    description: "Ctrl+V",
-    sequence: 50,
-    action: PASTE_ACTION,
+    .addChild("paste_value_only", ["paste_special"], {
+    ...pasteSpecialValue,
+    sequence: 10,
 })
-    .addChild("paste_special", ["edit"], {
-    name: _lt("Paste special"),
-    sequence: 60,
+    .addChild("paste_format_only", ["paste_special"], {
+    ...pasteSpecialFormat,
+    sequence: 20,
+})
+    .add("sort_columns", {
+    ...sortRange,
+    name: (env) => env.model.getters.getActiveCols().size > 1 ? _lt("Sort columns") : _lt("Sort column"),
+    sequence: 50,
     separator: true,
-    isVisible: IS_NOT_CUT_OPERATION,
 })
-    .addChild("paste_special_value", ["edit", "paste_special"], {
-    name: _lt("Paste value only"),
+    .addChild("sort_ascending", ["sort_columns"], {
+    ...sortAscending,
     sequence: 10,
-    action: PASTE_VALUE_ACTION,
 })
-    .addChild("paste_special_format", ["edit", "paste_special"], {
-    name: _lt("Paste format only"),
+    .addChild("sort_descending", ["sort_columns"], {
+    ...sortDescending,
     sequence: 20,
-    action: PASTE_FORMAT_ACTION,
 })
-    .addChild("sort_range", ["data"], {
-    name: _lt("Sort range"),
-    sequence: 20,
-    isVisible: IS_ONLY_ONE_RANGE,
+    .add("add_column_before", {
+    ...colInsertColsBefore,
+    sequence: 70,
+})
+    .add("add_column_after", {
+    ...colInsertColsAfter,
+    sequence: 80,
+})
+    .add("delete_column", {
+    ...deleteCols,
+    sequence: 90,
+})
+    .add("clear_column", {
+    ...clearCols,
+    sequence: 100,
+})
+    .add("hide_columns", {
+    ...hideCols,
+    sequence: 85,
     separator: true,
 })
-    .addChild("sort_ascending", ["data", "sort_range"], {
-    name: _lt("Ascending (A ⟶ Z)"),
+    .add("unhide_columns", {
+    ...unhideCols,
+    sequence: 86,
+    separator: true,
+})
+    .add("conditional_formatting", {
+    ...formatCF,
+    sequence: 110,
+});
+
+const numberFormatMenuRegistry = new MenuItemRegistry();
+numberFormatMenuRegistry
+    .add("format_number_automatic", {
+    ...formatNumberAutomatic,
     sequence: 10,
-    action: SORT_CELLS_ASCENDING,
+    separator: true,
 })
-    .addChild("sort_descending", ["data", "sort_range"], {
-    name: _lt("Descending (Z ⟶ A)"),
+    .add("format_number_number", {
+    ...formatNumberNumber,
     sequence: 20,
-    action: SORT_CELLS_DESCENDING,
 })
-    .addChild("find_and_replace", ["edit"], {
-    name: _lt("Find and replace"),
-    description: "Ctrl+H",
-    sequence: 65,
-    isReadonlyAllowed: true,
-    action: OPEN_FAR_SIDEPANEL_ACTION,
+    .add("format_number_percent", {
+    ...formatNumberPercent,
+    sequence: 30,
     separator: true,
 })
-    .addChild("edit_delete_cell_values", ["edit"], {
-    name: _lt("Delete values"),
-    sequence: 70,
-    action: DELETE_CONTENT_ACTION,
+    .add("format_number_currency", {
+    ...formatNumberCurrency,
+    sequence: 40,
 })
-    .addChild("edit_delete_row", ["edit"], {
-    name: REMOVE_ROWS_NAME,
-    sequence: 80,
-    action: REMOVE_ROWS_ACTION,
+    .add("format_number_currency_rounded", {
+    ...formatNumberCurrencyRounded,
+    sequence: 50,
 })
-    .addChild("edit_delete_column", ["edit"], {
-    name: REMOVE_COLUMNS_NAME,
-    sequence: 90,
-    action: REMOVE_COLUMNS_ACTION,
+    .add("format_custom_currency", {
+    ...formatCustomCurrency,
+    sequence: 60,
+    separator: true,
 })
-    .addChild("edit_delete_cell_shift_up", ["edit"], {
-    name: _lt("Delete cell and shift up"),
-    sequence: 93,
-    action: DELETE_CELL_SHIFT_UP,
+    .add("format_number_date", {
+    ...formatNumberDate,
+    sequence: 70,
 })
-    .addChild("edit_delete_cell_shift_left", ["edit"], {
-    name: _lt("Delete cell and shift left"),
-    sequence: 97,
-    action: DELETE_CELL_SHIFT_LEFT,
+    .add("format_number_time", {
+    ...formatNumberTime,
+    sequence: 80,
 })
-    .addChild("edit_unhide_columns", ["edit"], {
-    name: _lt("Unhide all columns"),
-    sequence: 100,
-    action: UNHIDE_ALL_COLUMNS_ACTION,
-    isVisible: (env) => env.model.getters.getHiddenColsGroups(env.model.getters.getActiveSheetId()).length > 0,
+    .add("format_number_date_time", {
+    ...formatNumberDateTime,
+    sequence: 90,
 })
-    .addChild("edit_unhide_rows", ["edit"], {
-    name: _lt("Unhide all rows"),
+    .add("format_number_duration", {
+    ...formatNumberDuration,
     sequence: 100,
-    action: UNHIDE_ALL_ROWS_ACTION,
-    isVisible: (env) => env.model.getters.getHiddenRowsGroups(env.model.getters.getActiveSheetId()).length > 0,
-})
-    .addChild("insert_row_before", ["insert"], {
-    name: MENU_INSERT_ROWS_BEFORE_NAME,
+    separator: true,
+});
+const formatNumberMenuItemSpec = {
+    name: _lt("More formats"),
+    icon: "o-spreadsheet-Icon.NUMBER_FORMATS",
+    children: [() => numberFormatMenuRegistry.getAll()],
+};
+
+const rowMenuRegistry = new MenuItemRegistry();
+rowMenuRegistry
+    .add("cut", {
+    ...cut,
     sequence: 10,
-    action: INSERT_ROWS_BEFORE_ACTION,
-    isVisible: (env) => env.model.getters.getActiveCols().size === 0,
 })
-    .addChild("insert_row_after", ["insert"], {
-    name: MENU_INSERT_ROWS_AFTER_NAME,
+    .add("copy", {
+    ...copy,
     sequence: 20,
-    action: INSERT_ROWS_AFTER_ACTION,
-    isVisible: (env) => env.model.getters.getActiveCols().size === 0,
-    separator: true,
 })
-    .addChild("insert_column_before", ["insert"], {
-    name: MENU_INSERT_COLUMNS_BEFORE_NAME,
+    .add("paste", {
+    ...paste,
     sequence: 30,
-    action: INSERT_COLUMNS_BEFORE_ACTION,
-    isVisible: (env) => env.model.getters.getActiveRows().size === 0,
 })
-    .addChild("insert_column_after", ["insert"], {
-    name: MENU_INSERT_COLUMNS_AFTER_NAME,
+    .add("paste_special", {
+    ...pasteSpecial,
     sequence: 40,
-    action: INSERT_COLUMNS_AFTER_ACTION,
-    isVisible: (env) => env.model.getters.getActiveRows().size === 0,
     separator: true,
 })
-    .addChild("insert_insert_cell_shift_down", ["insert"], {
-    name: _lt("Insert cells and shift down"),
-    sequence: 43,
-    action: INSERT_CELL_SHIFT_DOWN,
+    .addChild("paste_value_only", ["paste_special"], {
+    ...pasteSpecialValue,
+    sequence: 10,
 })
-    .addChild("insert_insert_cell_shift_right", ["insert"], {
-    name: _lt("Insert cells and shift right"),
-    sequence: 47,
-    action: INSERT_CELL_SHIFT_RIGHT,
-    separator: true,
+    .addChild("paste_format_only", ["paste_special"], {
+    ...pasteSpecialFormat,
+    sequence: 20,
 })
-    .addChild("insert_chart", ["insert"], {
-    name: _lt("Chart"),
+    .add("add_row_before", {
+    ...rowInsertRowBefore,
     sequence: 50,
-    action: CREATE_CHART,
-})
-    .addChild("insert_image", ["insert"], {
-    name: _lt("Image"),
-    sequence: 55,
-    action: CREATE_IMAGE,
-    isVisible: (env) => env.imageProvider !== undefined,
 })
-    .addChild("insert_function", ["insert"], {
-    name: _lt("Function"),
+    .add("add_row_after", {
+    ...rowInsertRowsAfter,
     sequence: 60,
 })
-    .addChild("insert_function_sum", ["insert", "insert_function"], {
-    name: _lt("SUM"),
-    action: (env) => env.startCellEdition(`=SUM(`),
-    sequence: 0,
+    .add("delete_row", {
+    ...deleteRows,
+    sequence: 70,
 })
-    .addChild("insert_function_average", ["insert", "insert_function"], {
-    name: _lt("AVERAGE"),
-    action: (env) => env.startCellEdition(`=AVERAGE(`),
+    .add("clear_row", {
+    ...clearRows,
+    sequence: 80,
+})
+    .add("hide_rows", {
+    ...hideRows,
+    sequence: 85,
+    separator: true,
+})
+    .add("unhide_rows", {
+    ...unhideRows,
+    sequence: 86,
+    separator: true,
+})
+    .add("conditional_formatting", {
+    ...formatCF,
+    sequence: 90,
+});
+
+function getSheetMenuRegistry(args) {
+    const sheetMenuRegistry = new MenuItemRegistry();
+    sheetMenuRegistry
+        .add("delete", {
+        ...deleteSheet,
+        sequence: 10,
+    })
+        .add("duplicate", {
+        ...duplicateSheet,
+        sequence: 20,
+    })
+        .add("rename", {
+        ...renameSheet(args),
+        sequence: 30,
+    })
+        .add("move_right", {
+        ...sheetMoveRight,
+        sequence: 40,
+    })
+        .add("move_left", {
+        ...sheetMoveLeft,
+        sequence: 50,
+    })
+        .add("hide_sheet", {
+        ...hideSheet,
+        sequence: 60,
+    });
+    return sheetMenuRegistry;
+}
+
+const topbarMenuRegistry = new MenuItemRegistry();
+topbarMenuRegistry
+    // ---------------------------------------------------------------------
+    // FILE MENU ITEMS
+    // ---------------------------------------------------------------------
+    .add("file", {
+    name: _lt("File"),
     sequence: 10,
 })
-    .addChild("insert_function_count", ["insert", "insert_function"], {
-    name: _lt("COUNT"),
-    action: (env) => env.startCellEdition(`=COUNT(`),
+    // ---------------------------------------------------------------------
+    // EDIT MENU ITEMS
+    // ---------------------------------------------------------------------
+    .add("edit", {
+    name: _lt("Edit"),
     sequence: 20,
 })
-    .addChild("insert_function_max", ["insert", "insert_function"], {
-    name: _lt("MAX"),
-    action: (env) => env.startCellEdition(`=MAX(`),
+    .addChild("undo", ["edit"], {
+    ...undo,
+    sequence: 10,
+})
+    .addChild("redo", ["edit"], {
+    ...redo,
+    sequence: 20,
+    separator: true,
+})
+    .addChild("copy", ["edit"], {
+    ...copy,
     sequence: 30,
 })
-    .addChild("insert_function_min", ["insert", "insert_function"], {
-    name: _lt("MIN"),
-    action: (env) => env.startCellEdition(`=MIN(`),
+    .addChild("cut", ["edit"], {
+    ...cut,
     sequence: 40,
-    separator: true,
 })
-    .addChild("categorie_function_all", ["insert", "insert_function"], {
-    name: _lt("All"),
+    .addChild("paste", ["edit"], {
+    ...paste,
     sequence: 50,
 })
-    .addChild("all_function_list", ["insert", "insert_function", "categorie_function_all"], () => {
-    const fnNames = functionRegistry.getKeys();
-    return createFormulaFunctionMenuItems(fnNames);
+    .addChild("paste_special", ["edit"], {
+    ...pasteSpecial,
+    sequence: 60,
+    separator: true,
 })
-    .addChild("categories_function_list", ["insert", "insert_function"], () => {
-    const functions = functionRegistry.content;
-    const categories = [...new Set(functionRegistry.getAll().map((fn) => fn.category))].filter(isDefined$1);
-    return categories.sort().map((category, i) => {
-        const functionsInCategory = Object.keys(functions).filter((key) => functions[key].category === category);
-        return {
-            name: category,
-            sequence: 60 + i * 10,
-            children: createFormulaFunctionMenuItems(functionsInCategory),
-        };
-    });
+    .addChild("paste_special_value", ["edit", "paste_special"], {
+    ...pasteSpecialValue,
+    sequence: 10,
 })
-    .addChild("insert_link", ["insert"], {
-    name: _lt("Link"),
+    .addChild("paste_special_format", ["edit", "paste_special"], {
+    ...pasteSpecialFormat,
+    sequence: 20,
+})
+    .addChild("find_and_replace", ["edit"], {
+    ...findAndReplace,
+    sequence: 65,
     separator: true,
+})
+    .addChild("edit_delete_cell_values", ["edit"], {
+    ...deleteValues,
     sequence: 70,
-    action: INSERT_LINK,
 })
-    .addChild("insert_sheet", ["insert"], {
-    name: _lt("New sheet"),
+    .addChild("edit_delete_row", ["edit"], {
+    ...deleteRows,
     sequence: 80,
-    action: CREATE_SHEET_ACTION,
-    separator: true,
+})
+    .addChild("edit_delete_column", ["edit"], {
+    ...deleteCols,
+    sequence: 90,
+})
+    .addChild("edit_delete_cell_shift_up", ["edit"], {
+    ...deleteCellShiftUp,
+    sequence: 93,
+})
+    .addChild("edit_delete_cell_shift_left", ["edit"], {
+    ...deleteCellShiftLeft,
+    sequence: 97,
+})
+    .addChild("edit_unhide_columns", ["edit"], {
+    ...unhideAllCols,
+    sequence: 100,
+})
+    .addChild("edit_unhide_rows", ["edit"], {
+    ...unhideAllRows,
+    sequence: 100,
+})
+    // ---------------------------------------------------------------------
+    // VIEW MENU ITEMS
+    // ---------------------------------------------------------------------
+    .add("view", {
+    name: _lt("View"),
+    sequence: 30,
 })
     .addChild("unfreeze_panes", ["view"], {
-    name: _lt("Unfreeze"),
+    ...unFreezePane,
     sequence: 4,
-    isVisible: (env) => {
-        const { xSplit, ySplit } = env.model.getters.getPaneDivisions(env.model.getters.getActiveSheetId());
-        return xSplit + ySplit > 0;
-    },
-    action: (env) => env.model.dispatch("UNFREEZE_COLUMNS_ROWS", {
-        sheetId: env.model.getters.getActiveSheetId(),
-    }),
 })
     .addChild("freeze_panes", ["view"], {
-    name: _lt("Freeze"),
+    ...freezePane,
     sequence: 5,
     separator: true,
 })
     .addChild("unfreeze_rows", ["view", "freeze_panes"], {
-    name: _lt("No rows"),
-    action: (env) => env.model.dispatch("UNFREEZE_ROWS", {
-        sheetId: env.model.getters.getActiveSheetId(),
-    }),
-    isReadonlyAllowed: true,
+    ...unFreezeRows,
     sequence: 5,
-    isVisible: (env) => !!env.model.getters.getPaneDivisions(env.model.getters.getActiveSheetId()).ySplit,
 })
     .addChild("freeze_first_row", ["view", "freeze_panes"], {
-    name: _lt("1 row"),
-    action: (env) => interactiveFreezeColumnsRows(env, "ROW", 1),
-    isReadonlyAllowed: true,
+    ...freezeFirstRow,
     sequence: 10,
 })
     .addChild("freeze_second_row", ["view", "freeze_panes"], {
-    name: _lt("2 rows"),
-    action: (env) => interactiveFreezeColumnsRows(env, "ROW", 2),
-    isReadonlyAllowed: true,
+    ...freezeSecondRow,
     sequence: 15,
 })
     .addChild("freeze_current_row", ["view", "freeze_panes"], {
-    name: _lt("Up to current row"),
-    action: (env) => {
-        const { bottom } = env.model.getters.getSelectedZone();
-        interactiveFreezeColumnsRows(env, "ROW", bottom + 1);
-    },
-    isReadonlyAllowed: true,
+    ...freezeCurrentRow,
     sequence: 20,
     separator: true,
 })
     .addChild("unfreeze_columns", ["view", "freeze_panes"], {
-    name: _lt("No columns"),
-    action: (env) => env.model.dispatch("UNFREEZE_COLUMNS", {
-        sheetId: env.model.getters.getActiveSheetId(),
-    }),
-    isReadonlyAllowed: true,
+    ...unFreezeCols,
     sequence: 25,
-    isVisible: (env) => !!env.model.getters.getPaneDivisions(env.model.getters.getActiveSheetId()).xSplit,
 })
     .addChild("freeze_first_col", ["view", "freeze_panes"], {
-    name: _lt("1 column"),
-    action: (env) => interactiveFreezeColumnsRows(env, "COL", 1),
-    isReadonlyAllowed: true,
+    ...freezeFirstCol,
     sequence: 30,
 })
     .addChild("freeze_second_col", ["view", "freeze_panes"], {
-    name: _lt("2 columns"),
-    action: (env) => interactiveFreezeColumnsRows(env, "COL", 2),
-    isReadonlyAllowed: true,
+    ...freezeSecondCol,
     sequence: 35,
 })
     .addChild("freeze_current_col", ["view", "freeze_panes"], {
-    name: _lt("Up to current column"),
-    action: (env) => {
-        const { right } = env.model.getters.getSelectedZone();
-        interactiveFreezeColumnsRows(env, "COL", right + 1);
-    },
-    isReadonlyAllowed: true,
+    ...freezeCurrentCol,
     sequence: 40,
 })
     .addChild("view_gridlines", ["view"], {
-    name: (env) => env.model.getters.getGridLinesVisibility(env.model.getters.getActiveSheetId())
-        ? _lt("Hide gridlines")
-        : _lt("Show gridlines"),
-    action: SET_GRID_LINES_VISIBILITY_ACTION,
+    ...viewGridlines,
     sequence: 10,
 })
     .addChild("view_formulas", ["view"], {
-    name: (env) => env.model.getters.shouldShowFormulas() ? _lt("Hide formulas") : _lt("Show formulas"),
-    action: SET_FORMULA_VISIBILITY_ACTION,
-    isReadonlyAllowed: true,
+    ...viewFormulas,
     sequence: 15,
 })
-    .addChild("format_number", ["format"], {
-    name: _lt("Numbers"),
-    sequence: 10,
-    separator: true,
+    // ---------------------------------------------------------------------
+    // INSERT MENU ITEMS
+    // ---------------------------------------------------------------------
+    .add("insert", {
+    name: _lt("Insert"),
+    sequence: 40,
 })
-    .addChild("format_number_automatic", ["format", "format_number"], {
-    name: NumberFormatTerms.Automatic,
+    .addChild("insert_row_before", ["insert"], {
+    ...topBarInsertRowsBefore,
     sequence: 10,
-    separator: true,
-    action: FORMAT_AUTOMATIC_ACTION,
 })
-    .addChild("format_number_number", ["format", "format_number"], {
-    name: NumberFormatTerms.Number,
-    description: "1,000.12",
+    .addChild("insert_row_after", ["insert"], {
+    ...topBarInsertRowsAfter,
     sequence: 20,
-    action: FORMAT_NUMBER_ACTION,
+    separator: true,
 })
-    .addChild("format_number_percent", ["format", "format_number"], {
-    name: NumberFormatTerms.Percent,
-    description: "10.12%",
+    .addChild("insert_column_before", ["insert"], {
+    ...topBarInsertColsBefore,
     sequence: 30,
-    separator: true,
-    action: FORMAT_PERCENT_ACTION,
 })
-    .addChild("format_number_currency", ["format", "format_number"], {
-    name: NumberFormatTerms.Currency,
-    description: "$1,000.12",
-    sequence: 37,
-    action: FORMAT_CURRENCY_ACTION,
+    .addChild("insert_column_after", ["insert"], {
+    ...topBarInsertColsAfter,
+    sequence: 40,
+    separator: true,
 })
-    .addChild("format_number_currency_rounded", ["format", "format_number"], {
-    name: NumberFormatTerms.CurrencyRounded,
-    description: "$1,000",
-    sequence: 38,
-    action: FORMAT_CURRENCY_ROUNDED_ACTION,
+    .addChild("insert_insert_cell_shift_down", ["insert"], {
+    ...insertCellShiftDown,
+    sequence: 43,
 })
-    .addChild("format_custom_currency", ["format", "format_number"], {
-    name: NumberFormatTerms.CustomCurrency,
-    sequence: 39,
+    .addChild("insert_insert_cell_shift_right", ["insert"], {
+    ...insertCellShiftRight,
+    sequence: 47,
     separator: true,
-    isVisible: (env) => env.loadCurrencies !== undefined,
-    action: OPEN_CUSTOM_CURRENCY_SIDEPANEL_ACTION,
 })
-    .addChild("format_number_date", ["format", "format_number"], {
-    name: NumberFormatTerms.Date,
-    description: "9/26/2008",
-    sequence: 40,
-    action: FORMAT_DATE_ACTION,
-})
-    .addChild("format_number_time", ["format", "format_number"], {
-    name: NumberFormatTerms.Time,
-    description: "10:43:00 PM",
+    .addChild("insert_chart", ["insert"], {
+    ...insertChart,
     sequence: 50,
-    action: FORMAT_TIME_ACTION,
 })
-    .addChild("format_number_date_time", ["format", "format_number"], {
-    name: NumberFormatTerms.DateTime,
-    description: "9/26/2008 22:43:00",
+    .addChild("insert_image", ["insert"], {
+    ...insertImage,
+    sequence: 55,
+})
+    .addChild("insert_function", ["insert"], {
+    ...insertFunction,
     sequence: 60,
-    action: FORMAT_DATE_TIME_ACTION,
 })
-    .addChild("format_number_duration", ["format", "format_number"], {
-    name: NumberFormatTerms.Duration,
-    description: "27:51:38",
+    .addChild("insert_function_sum", ["insert", "insert_function"], {
+    ...insertFunctionSum,
+    sequence: 0,
+})
+    .addChild("insert_function_average", ["insert", "insert_function"], {
+    ...insertFunctionAverage,
+    sequence: 10,
+})
+    .addChild("insert_function_count", ["insert", "insert_function"], {
+    ...insertFunctionCount,
+    sequence: 20,
+})
+    .addChild("insert_function_max", ["insert", "insert_function"], {
+    ...insertFunctionMax,
+    sequence: 30,
+})
+    .addChild("insert_function_min", ["insert", "insert_function"], {
+    ...insertFunctionMin,
+    sequence: 40,
+    separator: true,
+})
+    .addChild("categorie_function_all", ["insert", "insert_function"], {
+    ...categorieFunctionAll,
+    sequence: 50,
+})
+    .addChild("categories_function_list", ["insert", "insert_function"], categoriesFunctionListMenuBuilder)
+    .addChild("insert_link", ["insert"], {
+    ...insertLink,
+    separator: true,
     sequence: 70,
+})
+    .addChild("insert_sheet", ["insert"], {
+    ...insertSheet,
+    sequence: 80,
+    separator: true,
+})
+    // ---------------------------------------------------------------------
+    // FORMAT MENU ITEMS
+    // ---------------------------------------------------------------------
+    .add("format", { name: _lt("Format"), sequence: 50 })
+    .addChild("format_number", ["format"], {
+    ...formatNumberMenuItemSpec,
+    name: _lt("Number"),
+    sequence: 10,
     separator: true,
-    action: FORMAT_DURATION_ACTION,
 })
     .addChild("format_bold", ["format"], {
-    name: _lt("Bold"),
+    ...formatBold,
     sequence: 20,
-    description: "Ctrl+B",
-    action: FORMAT_BOLD_ACTION,
 })
     .addChild("format_italic", ["format"], {
-    name: _lt("Italic"),
+    ...formatItalic,
     sequence: 30,
-    description: "Ctrl+I",
-    action: FORMAT_ITALIC_ACTION,
 })
     .addChild("format_underline", ["format"], {
-    name: _lt("Underline"),
-    description: "Ctrl+U",
+    ...formatUnderline,
     sequence: 40,
-    action: FORMAT_UNDERLINE_ACTION,
 })
     .addChild("format_strikethrough", ["format"], {
-    name: _lt("Strikethrough"),
+    ...formatStrikethrough,
     sequence: 50,
-    action: FORMAT_STRIKETHROUGH_ACTION,
     separator: true,
 })
     .addChild("format_font_size", ["format"], {
-    name: _lt("Font size"),
+    ...formatFontSize,
     sequence: 60,
     separator: true,
 })
     .addChild("format_alignment", ["format"], {
-    name: _lt("Alignment"),
+    ...formatAlignment,
     sequence: 70,
 })
     .addChild("format_alignment_left", ["format", "format_alignment"], {
-    name: "Left",
+    ...formatAlignmentLeft,
     sequence: 10,
-    action: (env) => setStyle(env, { align: "left" }),
 })
     .addChild("format_alignment_center", ["format", "format_alignment"], {
-    name: "Center",
+    ...formatAlignmentCenter,
     sequence: 20,
-    action: (env) => setStyle(env, { align: "center" }),
 })
     .addChild("format_alignment_right", ["format", "format_alignment"], {
-    name: "Right",
+    ...formatAlignmentRight,
     sequence: 30,
-    action: (env) => setStyle(env, { align: "right" }),
     separator: true,
 })
     .addChild("format_alignment_top", ["format", "format_alignment"], {
-    name: "Top",
+    ...formatAlignmentTop,
     sequence: 40,
-    action: (env) => setStyle(env, { verticalAlign: "top" }),
 })
     .addChild("format_alignment_middle", ["format", "format_alignment"], {
-    name: "Middle",
+    ...formatAlignmentMiddle,
     sequence: 50,
-    action: (env) => setStyle(env, { verticalAlign: "middle" }),
 })
     .addChild("format_alignment_bottom", ["format", "format_alignment"], {
-    name: "Bottom",
+    ...formatAlignmentBottom,
     sequence: 60,
-    action: (env) => setStyle(env, { verticalAlign: "bottom" }),
     separator: true,
 })
     .addChild("format_wrapping", ["format"], {
-    name: _lt("Wrapping"),
+    ...formatWrapping,
     sequence: 80,
     separator: true,
 })
     .addChild("format_wrapping_overflow", ["format", "format_wrapping"], {
-    name: _lt("Overflow"),
+    ...formatWrappingOverflow,
     sequence: 10,
-    action: (env) => setStyle(env, { wrapping: "overflow" }),
 })
     .addChild("format_wrapping_wrap", ["format", "format_wrapping"], {
-    name: _lt("Wrap"),
+    ...formatWrappingWrap,
     sequence: 20,
-    action: (env) => setStyle(env, { wrapping: "wrap" }),
 })
     .addChild("format_wrapping_clip", ["format", "format_wrapping"], {
-    name: _lt("Clip"),
+    ...formatWrappingClip,
     sequence: 30,
-    action: (env) => setStyle(env, { wrapping: "clip" }),
 })
     .addChild("format_cf", ["format"], {
-    name: _lt("Conditional formatting"),
+    ...formatCF,
     sequence: 90,
-    action: OPEN_CF_SIDEPANEL_ACTION,
     separator: true,
 })
     .addChild("format_clearFormat", ["format"], {
-    name: _lt("Clear formatting"),
+    ...clearFormat,
     sequence: 100,
-    action: FORMAT_CLEARFORMAT_ACTION,
     separator: true,
+})
+    // ---------------------------------------------------------------------
+    // DATA MENU ITEMS
+    // ---------------------------------------------------------------------
+    .add("data", {
+    name: _lt("Data"),
+    sequence: 60,
+})
+    .addChild("sort_range", ["data"], {
+    ...sortRange,
+    sequence: 20,
+    separator: true,
+})
+    .addChild("sort_ascending", ["data", "sort_range"], {
+    ...sortAscending,
+    sequence: 10,
+})
+    .addChild("sort_descending", ["data", "sort_range"], {
+    ...sortDescending,
+    sequence: 20,
 })
     .addChild("add_data_filter", ["data"], {
-    name: _lt("Create filter"),
+    ...addDataFilter,
     sequence: 10,
-    action: FILTERS_CREATE_FILTER_TABLE,
-    isVisible: (env) => !SELECTION_CONTAINS_FILTER(env),
-    isEnabled: (env) => SELECTION_IS_CONTINUOUS(env),
 })
     .addChild("remove_data_filter", ["data"], {
-    name: _lt("Remove filter"),
+    ...removeDataFilter,
     sequence: 10,
-    action: FILTERS_REMOVE_FILTER_TABLE,
-    isVisible: SELECTION_CONTAINS_FILTER,
-});
-// Font-sizes
-for (let fs of FONT_SIZES) {
-    topbarMenuRegistry.addChild(`format_font_size_${fs}`, ["format", "format_font_size"], {
-        name: fs.toString(),
-        sequence: fs,
-        action: (env) => setStyle(env, { fontSize: fs }),
-    });
-}
-function createFormulaFunctionMenuItems(fnNames) {
-    return fnNames.sort().map((fnName, i) => {
-        return {
-            name: fnName,
-            sequence: i * 10,
-            action: (env) => env.startCellEdition(`=${fnName}(`),
-        };
-    });
-}
+});
 
 class OTRegistry extends Registry {
     /**
@@ -16737,7 +17500,7 @@ function updateSelectionWithArrowKeys(ev, selection) {
     }
 }
 
-const uuidGenerator = new UuidGenerator();
+const uuidGenerator$1 = new UuidGenerator();
 css /* scss */ `
   .o-selection {
     .o-selection-input {
@@ -16794,7 +17557,7 @@ css /* scss */ `
 class SelectionInput extends Component {
     constructor() {
         super(...arguments);
-        this.id = uuidGenerator.uuidv4();
+        this.id = uuidGenerator$1.uuidv4();
         this.previousRanges = this.props.ranges || [];
         this.originSheet = this.env.model.getters.getActiveSheetId();
         this.state = useState({
@@ -17277,8 +18040,9 @@ ColorPicker.props = {
 
 css /* scss */ `
   .o-color-picker-widget {
-    display: inline-block;
+    display: flex;
     position: relative;
+    align-items: center;
 
     .o-color-picker-button-style {
       display: flex;
@@ -17294,6 +18058,7 @@ css /* scss */ `
     }
 
     .o-color-picker-button {
+      height: 30px;
       > span {
         border-bottom: 4px solid;
         height: 16px;
@@ -20485,13 +21250,26 @@ class FilterIconsOverlay extends Component {
         const sheetId = this.env.model.getters.getActiveSheetId();
         const rowDims = this.env.model.getters.getRowDimensionsInViewport(sheetId, position.row);
         const colDims = this.env.model.getters.getColDimensionsInViewport(sheetId, position.col);
-        // TODO : change this offset when we support vertical cell align
-        const centeringOffset = Math.floor((rowDims.size - FILTER_ICON_EDGE_LENGTH) / 2);
+        const cell = this.env.model.getters.getCell({ sheetId, ...position });
+        const verticalFilterIconPosition = this.getIconVerticalPosition(rowDims, cell);
         return {
             x: colDims.end - FILTER_ICON_EDGE_LENGTH + this.props.gridPosition.x - FILTER_ICON_MARGIN - 1,
-            y: rowDims.end - FILTER_ICON_EDGE_LENGTH + this.props.gridPosition.y - centeringOffset,
+            y: verticalFilterIconPosition + this.props.gridPosition.y,
         };
     }
+    // Calculates the vertical position of the filter icon based on the row dimensions and cell styles.
+    getIconVerticalPosition(rowDims, cell) {
+        var _a;
+        const centeringOffset = Math.floor((rowDims.size - FILTER_ICON_EDGE_LENGTH) / 2);
+        switch ((_a = cell === null || cell === void 0 ? void 0 : cell.style) === null || _a === void 0 ? void 0 : _a.verticalAlign) {
+            case "bottom":
+                return rowDims.end - FILTER_ICON_MARGIN - FILTER_ICON_EDGE_LENGTH;
+            case "top":
+                return rowDims.start + FILTER_ICON_MARGIN;
+            default:
+                return rowDims.end - FILTER_ICON_EDGE_LENGTH - centeringOffset;
+        }
+    }
     isFilterActive(position) {
         const sheetId = this.env.model.getters.getActiveSheetId();
         return this.env.model.getters.isFilterActive({ sheetId, ...position });
@@ -21312,6 +22090,10 @@ GridOverlay.props = {
 };
 
 class GridPopover extends Component {
+    constructor() {
+        super(...arguments);
+        this.zIndex = ComponentsImportance.GridPopover;
+    }
     get cellPopover() {
         const popover = this.env.model.getters.getCellPopover(this.props.hoveredCell);
         if (!popover.isOpen) {
@@ -22403,6 +23185,7 @@ class Grid extends Component {
             "CTRL+A": () => this.env.model.selection.loopSelection(),
             "CTRL+Z": () => this.env.model.dispatch("REQUEST_UNDO"),
             "CTRL+Y": () => this.env.model.dispatch("REQUEST_REDO"),
+            F4: () => this.env.model.dispatch("REQUEST_REDO"),
             "CTRL+B": () => this.env.model.dispatch("SET_FORMATTING", {
                 sheetId: this.env.model.getters.getActiveSheetId(),
                 target: this.env.model.getters.getSelectedZones(),
@@ -22446,8 +23229,8 @@ class Grid extends Component {
             },
             "CTRL+END": () => {
                 const sheetId = this.env.model.getters.getActiveSheetId();
-                const col = this.env.model.getters.findVisibleHeader(sheetId, "COL", range(0, this.env.model.getters.getNumberCols(sheetId)).reverse());
-                const row = this.env.model.getters.findVisibleHeader(sheetId, "ROW", range(0, this.env.model.getters.getNumberRows(sheetId)).reverse());
+                const col = this.env.model.getters.findVisibleHeader(sheetId, "COL", this.env.model.getters.getNumberCols(sheetId) - 1, 0);
+                const row = this.env.model.getters.findVisibleHeader(sheetId, "ROW", this.env.model.getters.getNumberRows(sheetId) - 1, 0);
                 this.env.model.selection.selectCell(col, row);
             },
             "SHIFT+ ": () => {
@@ -22527,9 +23310,10 @@ class Grid extends Component {
         this.focus();
     }
     focus() {
+        var _a;
         if (!this.env.model.getters.getSelectedFigureId() &&
             this.env.model.getters.getEditionMode() === "inactive") {
-            this.hiddenInput.el.focus();
+            (_a = this.hiddenInput.el) === null || _a === void 0 ? void 0 : _a.focus();
         }
     }
     get gridEl() {
@@ -26449,7 +27233,7 @@ function load(data, verboseImport) {
             }
         }
     }
-    data = JSON.parse(JSON.stringify(data));
+    data = deepCopy(data);
     // apply migrations, if needed
     if ("version" in data) {
         if (data.version < CURRENT_VERSION) {
@@ -31567,7 +32351,7 @@ class SheetPlugin extends CorePlugin {
     duplicateSheet(fromId, toId) {
         const sheet = this.getSheet(fromId);
         const toName = this.getDuplicateSheetName(sheet.name);
-        const newSheet = JSON.parse(JSON.stringify(sheet));
+        const newSheet = deepCopy(sheet);
         newSheet.id = toId;
         newSheet.name = toName;
         for (let col = 0; col <= newSheet.numberOfCols; col++) {
@@ -31694,10 +32478,10 @@ class SheetPlugin extends CorePlugin {
         }
     }
     moveCellOnColumnsDeletion(sheet, deletedColumn) {
-        for (let [index, row] of Object.entries(sheet.rows)) {
-            const rowIndex = parseInt(index, 10);
+        for (let rowIndex = 0; rowIndex < sheet.rows.length; rowIndex++) {
+            const row = sheet.rows[rowIndex];
             for (let i in row.cells) {
-                const colIndex = parseInt(i, 10);
+                const colIndex = Number(i);
                 const cellId = row.cells[i];
                 if (cellId) {
                     if (colIndex === deletedColumn) {
@@ -31724,11 +32508,11 @@ class SheetPlugin extends CorePlugin {
      */
     moveCellsOnAddition(sheet, addedElement, quantity, dimension) {
         const commands = [];
-        for (const [index, row] of Object.entries(sheet.rows)) {
-            const rowIndex = parseInt(index, 10);
+        for (let rowIndex = 0; rowIndex < sheet.rows.length; rowIndex++) {
+            const row = sheet.rows[rowIndex];
             if (dimension !== "rows" || rowIndex >= addedElement) {
                 for (let i in row.cells) {
-                    const colIndex = parseInt(i, 10);
+                    const colIndex = Number(i);
                     const cellId = row.cells[i];
                     if (cellId) {
                         if (dimension === "rows" || colIndex >= addedElement) {
@@ -31758,11 +32542,11 @@ class SheetPlugin extends CorePlugin {
      */
     moveCellOnRowsDeletion(sheet, deleteFromRow, deleteToRow) {
         const numberRows = deleteToRow - deleteFromRow + 1;
-        for (let [index, row] of Object.entries(sheet.rows)) {
-            const rowIndex = parseInt(index, 10);
+        for (let rowIndex = 0; rowIndex < sheet.rows.length; rowIndex++) {
+            const row = sheet.rows[rowIndex];
             if (rowIndex >= deleteFromRow && rowIndex <= deleteToRow) {
                 for (let i in row.cells) {
-                    const colIndex = parseInt(i, 10);
+                    const colIndex = Number(i);
                     const cellId = row.cells[i];
                     if (cellId) {
                         this.dispatch("CLEAR_CELL", {
@@ -31775,7 +32559,7 @@ class SheetPlugin extends CorePlugin {
             }
             if (rowIndex > deleteToRow) {
                 for (let i in row.cells) {
-                    const colIndex = parseInt(i, 10);
+                    const colIndex = Number(i);
                     const cellId = row.cells[i];
                     if (cellId) {
                         this.dispatch("UPDATE_CELL_POSITION", {
@@ -31793,7 +32577,7 @@ class SheetPlugin extends CorePlugin {
         const rows = [];
         const cellsQueue = sheet.rows.map((row) => row.cells);
         for (let i in sheet.rows) {
-            if (parseInt(i, 10) === index) {
+            if (Number(i) === index) {
                 continue;
             }
             rows.push({
@@ -32964,13 +33748,11 @@ class FilterEvaluationPlugin extends UIPlugin {
         return Boolean(id && ((_b = (_a = this.filterValues[sheetId]) === null || _a === void 0 ? void 0 : _a[id]) === null || _b === void 0 ? void 0 : _b.length));
     }
     intersectZoneWithViewport(sheetId, zone) {
-        const colsRange = range(zone.left, zone.right + 1);
-        const rowsRange = range(zone.top, zone.bottom + 1);
         return {
-            left: this.getters.findVisibleHeader(sheetId, "COL", colsRange),
-            right: this.getters.findVisibleHeader(sheetId, "COL", colsRange.reverse()),
-            top: this.getters.findVisibleHeader(sheetId, "ROW", rowsRange),
-            bottom: this.getters.findVisibleHeader(sheetId, "ROW", rowsRange.reverse()),
+            left: this.getters.findVisibleHeader(sheetId, "COL", zone.left, zone.right),
+            right: this.getters.findVisibleHeader(sheetId, "COL", zone.right, zone.left),
+            top: this.getters.findVisibleHeader(sheetId, "ROW", zone.top, zone.bottom),
+            bottom: this.getters.findVisibleHeader(sheetId, "ROW", zone.bottom, zone.top),
         };
     }
     updateFilter({ col, row, values, sheetId }) {
@@ -33174,48 +33956,66 @@ class InternalViewport {
             this.adjustPositionY(row);
         }
     }
-    adjustPositionX(col) {
+    adjustPositionX(targetCol) {
         const sheetId = this.sheetId;
-        const { start, end } = this.getters.getColDimensions(sheetId, col);
-        while (end > this.offsetX + this.offsetCorrectionX + this.viewportWidth &&
-            this.offsetX + this.offsetCorrectionX < start) {
-            this.offsetX = this.getters.getColDimensions(sheetId, this.left).end - this.offsetCorrectionX;
-            this.offsetScrollbarX = this.offsetX;
-            this.adjustViewportZoneX();
-        }
-        while (col < this.left) {
-            let leftCol;
-            for (leftCol = this.left; leftCol >= 0; leftCol--) {
-                if (!this.getters.isColHidden(sheetId, leftCol)) {
+        const { end } = this.getters.getColDimensions(sheetId, targetCol);
+        const maxCol = this.getters.getNumberCols(sheetId);
+        if (this.offsetX + this.offsetCorrectionX + this.viewportWidth < end) {
+            for (let col = this.left; this.offsetX + this.offsetCorrectionX + this.viewportWidth < end; col++) {
+                if (col > maxCol) {
+                    break;
+                }
+                if (this.getters.isColHidden(sheetId, col)) {
+                    continue;
+                }
+                this.offsetX = this.getters.getColDimensions(sheetId, col).end - this.offsetCorrectionX;
+                this.offsetScrollbarX = this.offsetX;
+                this.adjustViewportZoneX();
+            }
+        }
+        else if (this.left > targetCol) {
+            for (let col = this.left; col >= targetCol; col--) {
+                if (col < 0) {
                     break;
                 }
+                if (this.getters.isColHidden(sheetId, col)) {
+                    continue;
+                }
+                this.offsetX = this.getters.getColDimensions(sheetId, col).start - this.offsetCorrectionX;
+                this.offsetScrollbarX = this.offsetX;
+                this.adjustViewportZoneX();
             }
-            this.offsetX =
-                this.getters.getColDimensions(sheetId, leftCol - 1).start - this.offsetCorrectionX;
-            this.offsetScrollbarX = this.offsetX;
-            this.adjustViewportZoneX();
         }
     }
-    adjustPositionY(row) {
+    adjustPositionY(targetRow) {
         const sheetId = this.sheetId;
-        while (this.getters.getRowDimensions(sheetId, row).end >
-            this.offsetY + this.viewportHeight + this.offsetCorrectionY &&
-            this.offsetY + this.offsetCorrectionY < this.getters.getRowDimensions(sheetId, row).start) {
-            this.offsetY = this.getters.getRowDimensions(sheetId, this.top).end - this.offsetCorrectionY;
-            this.offsetScrollbarY = this.offsetY;
-            this.adjustViewportZoneY();
-        }
-        while (row < this.top) {
-            let topRow;
-            for (topRow = this.top; topRow >= 0; topRow--) {
-                if (!this.getters.isRowHidden(sheetId, topRow)) {
+        const { end } = this.getters.getRowDimensions(sheetId, targetRow);
+        const maxRow = this.getters.getNumberRows(sheetId);
+        if (this.offsetY + this.viewportHeight + this.offsetCorrectionY < end) {
+            for (let row = this.top; this.offsetY + this.viewportHeight + this.offsetCorrectionY < end; row++) {
+                if (row > maxRow) {
+                    break;
+                }
+                if (this.getters.isRowHidden(sheetId, row)) {
+                    continue;
+                }
+                this.offsetY = this.getters.getRowDimensions(sheetId, row).end - this.offsetCorrectionY;
+                this.offsetScrollbarY = this.offsetY;
+                this.adjustViewportZoneY();
+            }
+        }
+        else if (this.top > targetRow) {
+            for (let row = this.top; row >= targetRow; row--) {
+                if (row < 0) {
                     break;
                 }
+                if (this.getters.isRowHidden(sheetId, row)) {
+                    continue;
+                }
+                this.offsetY = this.getters.getRowDimensions(sheetId, row).start - this.offsetCorrectionY;
+                this.offsetScrollbarY = this.offsetY;
+                this.adjustViewportZoneY();
             }
-            this.offsetY =
-                this.getters.getRowDimensions(sheetId, topRow - 1).start - this.offsetCorrectionY;
-            this.offsetScrollbarY = this.offsetY;
-            this.adjustViewportZoneY();
         }
     }
     setViewportOffset(offsetX, offsetY) {
@@ -33408,8 +34208,8 @@ class SheetViewPlugin extends UIPlugin {
          * In the absence of a component (standalone model), is it mandatory to set reasonable default values
          * to ensure the correct operation of this plugin.
          */
-        this.sheetViewWidth = DEFAULT_SHEETVIEW_SIZE;
-        this.sheetViewHeight = DEFAULT_SHEETVIEW_SIZE;
+        this.sheetViewWidth = getDefaultSheetViewSize();
+        this.sheetViewHeight = getDefaultSheetViewSize();
         this.gridOffsetX = 0;
         this.gridOffsetY = 0;
         this.sheetsWithDirtyViewports = new Set();
@@ -35074,13 +35874,33 @@ class HeaderVisibilityUIPlugin extends UIPlugin {
     getNextVisibleCellPosition({ sheetId, col, row }) {
         return {
             sheetId,
-            col: this.findVisibleHeader(sheetId, "COL", range(col, this.getters.getNumberCols(sheetId))),
-            row: this.findVisibleHeader(sheetId, "ROW", range(row, this.getters.getNumberRows(sheetId))),
+            col: this.findVisibleHeader(sheetId, "COL", col, this.getters.getNumberCols(sheetId) - 1),
+            row: this.findVisibleHeader(sheetId, "ROW", row, this.getters.getNumberRows(sheetId) - 1),
         };
     }
-    findVisibleHeader(sheetId, dimension, indexes) {
-        return indexes.find((index) => this.getters.doesHeaderExist(sheetId, dimension, index) &&
-            !this.isHeaderHidden(sheetId, dimension, index));
+    /**
+     * Find the first visible header in the range [`from` => `to`].
+     *
+     * Both `from` and `to` are inclusive.
+     */
+    findVisibleHeader(sheetId, dimension, from, to) {
+        if (from <= to) {
+            for (let i = from; i <= to; i++) {
+                if (this.getters.doesHeaderExist(sheetId, dimension, i) &&
+                    !this.isHeaderHidden(sheetId, dimension, i)) {
+                    return i;
+                }
+            }
+        }
+        if (from > to) {
+            for (let i = from; i >= to; i--) {
+                if (this.getters.doesHeaderExist(sheetId, dimension, i) &&
+                    !this.isHeaderHidden(sheetId, dimension, i)) {
+                    return i;
+                }
+            }
+        }
+        return undefined;
     }
     findLastVisibleColRowIndex(sheetId, dimension, { last, first }) {
         const lastVisibleIndex = range(last, first, -1).find((index) => !this.isHeaderHidden(sheetId, dimension, index));
@@ -36541,7 +37361,8 @@ class Revision {
      *  - clientId: Client who initiated the action
      *  - changes: List of changes applied on the state.
      */
-    constructor(id, clientId, commands, changes) {
+    constructor(id, clientId, commands, rootCommand, changes) {
+        this.rootCommand = rootCommand;
         this._commands = [];
         this._changes = [];
         this.id = id;
@@ -36605,10 +37426,10 @@ class Session extends EventBus {
      * Add a new revision to the collaborative session.
      * It will be transmitted to all other connected clients.
      */
-    save(commands, changes) {
+    save(rootCommand, commands, changes) {
         if (!commands.length || !changes.length || !this.canApplyOptimisticUpdate())
             return;
-        const revision = new Revision(this.uuidGenerator.uuidv4(), this.clientId, commands, changes);
+        const revision = new Revision(this.uuidGenerator.uuidv4(), this.clientId, commands, rootCommand, changes);
         this.revisions.append(revision.id, revision);
         this.trigger("new-local-state-update", { id: revision.id });
         this.sendUpdateMessage({
@@ -36709,6 +37530,22 @@ class Session extends EventBus {
     isFullySynchronized() {
         return this.pendingMessages.length === 0;
     }
+    /**
+     * Get the last local revision whose root command isn't in the given list of ignored commands
+     * */
+    getLastLocalNonEmptyRevision(ignoredRootCommands) {
+        var _a;
+        const revisions = this.revisions.getRevertedExecution();
+        for (const rev of revisions) {
+            if (rev.rootCommand === "SNAPSHOT")
+                return undefined;
+            if (!rev.rootCommand || rev.rootCommand === "REMOTE")
+                continue;
+            if (!ignoredRootCommands.includes((_a = rev.rootCommand) === null || _a === void 0 ? void 0 : _a.type) && rev.commands.length)
+                return rev;
+        }
+        return undefined;
+    }
     _move(position) {
         var _a;
         // this method is debounced and might be called after the client
@@ -36768,7 +37605,7 @@ class Session extends EventBus {
                     return;
                 }
                 const { clientId, commands } = message;
-                const revision = new Revision(message.nextRevisionId, clientId, commands);
+                const revision = new Revision(message.nextRevisionId, clientId, commands, "REMOTE");
                 if (revision.clientId !== this.clientId) {
                     this.revisions.insert(revision.id, revision, message.serverRevisionId);
                     const pendingCommands = this.pendingMessages
@@ -36781,7 +37618,7 @@ class Session extends EventBus {
                 }
                 break;
             case "SNAPSHOT_CREATED": {
-                const revision = new Revision(message.nextRevisionId, "server", []);
+                const revision = new Revision(message.nextRevisionId, "server", [], "SNAPSHOT");
                 this.revisions.insert(revision.id, revision, message.serverRevisionId);
                 this.dropPendingHistoryMessages();
                 this.trigger("snapshot");
@@ -37559,6 +38396,324 @@ SheetUIPlugin.getters = [
     "getColRowOffset",
 ];
 
+const genericRepeatsTransforms = [
+    repeatSheetDependantCommand,
+    repeatTargetDependantCommand,
+    repeatPositionDependantCommand,
+];
+function repeatSheetDependantCommand(getters, command) {
+    if (!("sheetId" in command))
+        return command;
+    return { ...deepCopy(command), sheetId: getters.getActiveSheetId() };
+}
+function repeatTargetDependantCommand(getters, command) {
+    if (!("target" in command) || !Array.isArray(command.target))
+        return command;
+    return {
+        ...deepCopy(command),
+        target: getters.getSelectedZones(),
+    };
+}
+function repeatPositionDependantCommand(getters, command) {
+    if (!("row" in command) || !("col" in command))
+        return command;
+    const { col, row } = getters.getActivePosition();
+    return { ...deepCopy(command), col, row };
+}
+
+const uuidGenerator = new UuidGenerator();
+function repeatCreateChartCommand(getters, cmd) {
+    return {
+        ...repeatSheetDependantCommand(getters, cmd),
+        id: uuidGenerator.uuidv4(),
+    };
+}
+function repeatCreateImageCommand(getters, cmd) {
+    return {
+        ...repeatSheetDependantCommand(getters, cmd),
+        figureId: uuidGenerator.uuidv4(),
+    };
+}
+function repeatCreateFigureCommand(getters, cmd) {
+    const newCmd = repeatSheetDependantCommand(getters, cmd);
+    newCmd.figure.id = uuidGenerator.uuidv4();
+    return newCmd;
+}
+function repeatCreateSheetCommand(getters, cmd) {
+    var _a;
+    const newCmd = deepCopy(cmd);
+    newCmd.sheetId = uuidGenerator.uuidv4();
+    const sheetName = cmd.name || getters.getSheet(getters.getActiveSheetId()).name;
+    // Extract the prefix of the sheet name (everything before the number at the end of the name)
+    const namePrefix = ((_a = sheetName.match(/(.+?)\d*$/)) === null || _a === void 0 ? void 0 : _a[1]) || sheetName;
+    newCmd.name = getters.getNextSheetName(namePrefix);
+    return newCmd;
+}
+function repeatAddColumnsRowsCommand(getters, cmd) {
+    const currentPosition = getters.getActivePosition();
+    return {
+        ...repeatSheetDependantCommand(getters, cmd),
+        base: cmd.dimension === "COL" ? currentPosition.col : currentPosition.row,
+    };
+}
+function repeatHeaderElementCommand(getters, cmd) {
+    const currentSelection = getters.getSelectedZone();
+    return {
+        ...repeatSheetDependantCommand(getters, cmd),
+        elements: cmd.dimension === "COL"
+            ? range(currentSelection.left, currentSelection.right + 1)
+            : range(currentSelection.top, currentSelection.bottom + 1),
+    };
+}
+function repeatInsertOrDeleteCellCommand(getters, cmd) {
+    const currentSelection = getters.getSelectedZone();
+    return {
+        ...deepCopy(cmd),
+        zone: currentSelection,
+    };
+}
+function repeatAutoResizeCommand(getters, cmd) {
+    const newCmd = deepCopy(cmd);
+    const currentSelection = getters.getSelectedZone();
+    const { top, bottom, left, right } = currentSelection;
+    if ("cols" in newCmd) {
+        newCmd.cols = range(left, right + 1);
+    }
+    else if ("rows" in newCmd) {
+        newCmd.rows = range(top, bottom + 1);
+    }
+    return newCmd;
+}
+function repeatSortCellsCommand(getters, cmd) {
+    const currentSelection = getters.getSelectedZone();
+    return {
+        ...repeatSheetDependantCommand(getters, cmd),
+        col: currentSelection.left,
+        row: currentSelection.top,
+        zone: currentSelection,
+    };
+}
+function repeatPasteCommand(getters, cmd) {
+    /**
+     * Note : we have to store the state of the clipboard in the clipboard plugin, and introduce a
+     * new command REPEAT_PASTE to be able to repeat the paste command.
+     *
+     * We cannot re-dispatch a paste, because the content of the clipboard may have changed in between.
+     *
+     * And we cannot adapt the sub-commands of the paste command, because they are dependant on the state of the sheet,
+     * and may change based on the paste location. A simple example is that paste create new col/rows for the clipboard
+     * content to fit the sheet. So there will be ADD_COL_ROW_COMMANDS in the sub-commands in the history, but repeating
+     * paste might not need them. Or they could only needed for the repeated paste, not for the original.
+     */
+    return {
+        type: "REPEAT_PASTE",
+        pasteOption: deepCopy(cmd.pasteOption),
+        target: getters.getSelectedZones(),
+    };
+}
+
+/**
+ *  Registry containing all the command that can be repeated on redo, and function to transform them
+ *  to the current state of the model.
+ *
+ * If the transform function is undefined, the command will be transformed using generic transformations.
+ * (change the sheetId, the row, the col, the target, the ranges, to the current active sheet & selection)
+ *
+ */
+const repeatCommandTransformRegistry = new Registry();
+repeatCommandTransformRegistry.add("UPDATE_CELL", genericRepeat);
+repeatCommandTransformRegistry.add("CLEAR_CELL", genericRepeat);
+repeatCommandTransformRegistry.add("DELETE_CONTENT", genericRepeat);
+repeatCommandTransformRegistry.add("ADD_MERGE", genericRepeat);
+repeatCommandTransformRegistry.add("REMOVE_MERGE", genericRepeat);
+repeatCommandTransformRegistry.add("SET_FORMATTING", genericRepeat);
+repeatCommandTransformRegistry.add("CLEAR_FORMATTING", genericRepeat);
+repeatCommandTransformRegistry.add("SET_BORDER", genericRepeat);
+repeatCommandTransformRegistry.add("CREATE_FILTER_TABLE", genericRepeat);
+repeatCommandTransformRegistry.add("REMOVE_FILTER_TABLE", genericRepeat);
+repeatCommandTransformRegistry.add("HIDE_SHEET", genericRepeat);
+repeatCommandTransformRegistry.add("ADD_COLUMNS_ROWS", repeatAddColumnsRowsCommand);
+repeatCommandTransformRegistry.add("REMOVE_COLUMNS_ROWS", repeatHeaderElementCommand);
+repeatCommandTransformRegistry.add("HIDE_COLUMNS_ROWS", repeatHeaderElementCommand);
+repeatCommandTransformRegistry.add("RESIZE_COLUMNS_ROWS", repeatHeaderElementCommand);
+repeatCommandTransformRegistry.add("CREATE_SHEET", repeatCreateSheetCommand);
+repeatCommandTransformRegistry.add("CREATE_FIGURE", repeatCreateFigureCommand);
+repeatCommandTransformRegistry.add("CREATE_CHART", repeatCreateChartCommand);
+repeatCommandTransformRegistry.add("CREATE_IMAGE", repeatCreateImageCommand);
+const repeatLocalCommandTransformRegistry = new Registry();
+repeatLocalCommandTransformRegistry.add("STOP_EDITION", repeatLocalCommandChildren);
+repeatLocalCommandTransformRegistry.add("PASTE", repeatPasteCommand);
+repeatLocalCommandTransformRegistry.add("INSERT_CELL", repeatInsertOrDeleteCellCommand);
+repeatLocalCommandTransformRegistry.add("DELETE_CELL", repeatInsertOrDeleteCellCommand);
+repeatLocalCommandTransformRegistry.add("AUTORESIZE_COLUMNS", repeatAutoResizeCommand);
+repeatLocalCommandTransformRegistry.add("AUTORESIZE_ROWS", repeatAutoResizeCommand);
+repeatLocalCommandTransformRegistry.add("SORT_CELLS", repeatSortCellsCommand);
+repeatLocalCommandTransformRegistry.add("SUM_SELECTION", genericRepeat);
+repeatLocalCommandTransformRegistry.add("SET_DECIMAL", genericRepeat);
+function genericRepeat(getters, command) {
+    let transformedCommand = deepCopy(command);
+    for (const repeatTransform of genericRepeatsTransforms) {
+        transformedCommand = repeatTransform(getters, transformedCommand);
+    }
+    return transformedCommand;
+}
+function repeatCoreCommand(getters, command) {
+    if (!command) {
+        return undefined;
+    }
+    const isRepeatable = repeatCommandTransformRegistry.contains(command.type);
+    if (!isRepeatable) {
+        return undefined;
+    }
+    const transform = repeatCommandTransformRegistry.get(command.type);
+    return transform(getters, command);
+}
+function repeatLocalCommand(getters, command, childCommands) {
+    const isRepeatable = repeatLocalCommandTransformRegistry.contains(command.type);
+    if (!isRepeatable) {
+        return undefined;
+    }
+    const repeatTransform = repeatLocalCommandTransformRegistry.get(command.type);
+    return repeatTransform(getters, command, childCommands);
+}
+function repeatLocalCommandChildren(getters, cmd, childCommands) {
+    return childCommands
+        .map((childCommand) => repeatCoreCommand(getters, childCommand))
+        .filter(isDefined$1);
+}
+
+function canRepeatRevision(revision) {
+    if (!revision || !revision.rootCommand || typeof revision.rootCommand !== "object") {
+        return false;
+    }
+    if (isCoreCommand(revision.rootCommand)) {
+        return repeatCommandTransformRegistry.contains(revision.rootCommand.type);
+    }
+    return repeatLocalCommandTransformRegistry.contains(revision.rootCommand.type);
+}
+function repeatRevision(revision, getters) {
+    if (!revision.rootCommand || typeof revision.rootCommand !== "object") {
+        return undefined;
+    }
+    if (isCoreCommand(revision.rootCommand)) {
+        return repeatCoreCommand(getters, revision.rootCommand);
+    }
+    return repeatLocalCommand(getters, revision.rootCommand, revision.commands);
+}
+
+/**
+ * Local History
+ *
+ * The local history is responsible of tracking the locally state updates
+ * It maintains the local undo and redo stack to allow to undo/redo only local
+ * changes
+ */
+class HistoryPlugin extends UIPlugin {
+    constructor(config) {
+        super(config);
+        /**
+         * Ids of the revisions which can be undone
+         */
+        this.undoStack = [];
+        /**
+         * Ids of the revisions which can be redone
+         */
+        this.redoStack = [];
+        this.session = config.session;
+        this.session.on("new-local-state-update", this, this.onNewLocalStateUpdate);
+        this.session.on("pending-revisions-dropped", this, ({ revisionIds }) => this.drop(revisionIds));
+        this.session.on("snapshot", this, () => {
+            this.undoStack = [];
+            this.redoStack = [];
+        });
+    }
+    allowDispatch(cmd) {
+        switch (cmd.type) {
+            case "REQUEST_UNDO":
+                if (!this.canUndo()) {
+                    return 6 /* CommandResult.EmptyUndoStack */;
+                }
+                break;
+            case "REQUEST_REDO":
+                if (!this.canRedo()) {
+                    return 7 /* CommandResult.EmptyRedoStack */;
+                }
+                break;
+        }
+        return 0 /* CommandResult.Success */;
+    }
+    handle(cmd) {
+        switch (cmd.type) {
+            case "REQUEST_UNDO":
+            case "REQUEST_REDO":
+                // History changes (undo & redo) are *not* applied optimistically on the local state.
+                // We wait a global confirmation from the server. The goal is to avoid handling concurrent
+                // history changes on multiple clients which are very hard to manage correctly.
+                this.requestHistoryChange(cmd.type === "REQUEST_UNDO" ? "UNDO" : "REDO");
+        }
+    }
+    finalize() { }
+    requestHistoryChange(type) {
+        const id = type === "UNDO" ? this.undoStack.pop() : this.redoStack.pop();
+        if (!id) {
+            const lastNonRedoRevision = this.getPossibleRevisionToRepeat();
+            if (!lastNonRedoRevision) {
+                return;
+            }
+            const repeatedCommands = repeatRevision(lastNonRedoRevision, this.getters);
+            if (!repeatedCommands) {
+                return;
+            }
+            if (!Array.isArray(repeatedCommands)) {
+                this.dispatch(repeatedCommands.type, repeatedCommands);
+                return;
+            }
+            for (const command of repeatedCommands) {
+                this.dispatch(command.type, command);
+            }
+            return;
+        }
+        if (type === "UNDO") {
+            this.session.undo(id);
+            this.redoStack.push(id);
+        }
+        else {
+            this.session.redo(id);
+            this.undoStack.push(id);
+        }
+    }
+    canUndo() {
+        return this.undoStack.length > 0;
+    }
+    canRedo() {
+        if (this.redoStack.length > 0)
+            return true;
+        const lastNonRedoRevision = this.getPossibleRevisionToRepeat();
+        return canRepeatRevision(lastNonRedoRevision);
+    }
+    drop(revisionIds) {
+        this.undoStack = this.undoStack.filter((id) => !revisionIds.includes(id));
+        this.redoStack = [];
+    }
+    onNewLocalStateUpdate({ id }) {
+        this.undoStack.push(id);
+        this.redoStack = [];
+        if (this.undoStack.length > MAX_HISTORY_STEPS) {
+            this.undoStack.shift();
+        }
+    }
+    /**
+     * Fetch the last revision which is not empty and not a repeated command
+     *
+     * Ignore repeated commands (REQUEST_REDO command as root command)
+     * Ignore standard undo/redo revisions (that are empty)
+     */
+    getPossibleRevisionToRepeat() {
+        return this.session.getLastLocalNonEmptyRevision(["REQUEST_REDO"]);
+    }
+}
+HistoryPlugin.getters = ["canUndo", "canRedo"];
+
 /** Abstract state of the clipboard when copying/cutting content that is pasted in cells of the sheet */
 class ClipboardCellsAbstractState {
     constructor(operation, getters, dispatch, selection) {
@@ -38268,7 +39423,7 @@ class ClipboardPlugin extends UIPlugin {
         return 0 /* CommandResult.Success */;
     }
     handle(cmd) {
-        var _a, _b;
+        var _a, _b, _c;
         switch (cmd.type) {
             case "COPY":
             case "CUT":
@@ -38286,6 +39441,7 @@ class ClipboardPlugin extends UIPlugin {
                 if (this.state.operation === "CUT") {
                     this.state = undefined;
                 }
+                this.lastPasteState = this.state;
                 this.status = "invisible";
                 break;
             case "CLEAN_CLIPBOARD_HIGHLIGHT":
@@ -38338,10 +39494,19 @@ class ClipboardPlugin extends UIPlugin {
                 break;
             }
             case "PASTE_FROM_OS_CLIPBOARD":
-                const state = new ClipboardOsState(cmd.text, this.getters, this.dispatch, this.selection);
-                state.paste(cmd.target);
+                this.state = new ClipboardOsState(cmd.text, this.getters, this.dispatch, this.selection);
+                this.state.paste(cmd.target);
+                this.lastPasteState = this.state;
                 this.status = "invisible";
                 break;
+            case "REPEAT_PASTE": {
+                (_c = this.lastPasteState) === null || _c === void 0 ? void 0 : _c.paste(cmd.target, {
+                    pasteOption: cmd.pasteOption,
+                    shouldPasteCF: true,
+                    selectTarget: true,
+                });
+                break;
+            }
             case "ACTIVATE_PAINT_FORMAT": {
                 const zones = this.getters.getSelectedZones();
                 this.state = this.getClipboardStateForCopyCells(zones, "COPY");
@@ -39822,7 +40987,8 @@ const featurePluginRegistry = new Registry()
     .add("automatic_sum", AutomaticSumPlugin)
     .add("format", FormatPlugin)
     .add("cell_popovers", CellPopoverPlugin)
-    .add("selection_multiuser", SelectionMultiUserPlugin);
+    .add("selection_multiuser", SelectionMultiUserPlugin)
+    .add("history", HistoryPlugin);
 // Plugins which have a state, but which should not be shared in collaborative
 const statefulUIPluginRegistry = new Registry()
     .add("selection", GridSelectionPlugin)
@@ -39840,7 +41006,7 @@ const coreViewsPluginRegistry = new Registry()
 const clickableCellRegistry = new Registry();
 clickableCellRegistry.add("link", {
     condition: (position, env) => !!env.model.getters.getEvaluatedCell(position).link,
-    action: (position, env) => openLink(env.model.getters.getEvaluatedCell(position).link, env),
+    execute: (position, env) => openLink(env.model.getters.getEvaluatedCell(position).link, env),
     sequence: 5,
 });
 
@@ -40297,7 +41463,7 @@ class BottomBarStatistic extends Component {
                 name: this.getComposedFnName(fnName, fnValue),
                 sequence: i,
                 isReadonlyAllowed: true,
-                action: () => {
+                execute: () => {
                     this.selectedStatisticFn = fnName;
                 },
             });
@@ -40465,10 +41631,6 @@ css /* scss */ `
     font-size: 15px;
     border-top: 1px solid lightgrey;
 
-    .o-add-sheet.disabled {
-      cursor: not-allowed;
-    }
-
     .o-sheet-item {
       cursor: pointer;
       &:hover {
@@ -40574,7 +41736,7 @@ class BottomBar extends Component {
                 sequence: i,
                 isReadonlyAllowed: true,
                 textColor: sheet.isVisible ? undefined : "grey",
-                action: (env) => {
+                execute: (env) => {
                     env.model.dispatch("ACTIVATE_SHEET", { sheetIdFrom: from, sheetIdTo: sheetId });
                 },
             });
@@ -40831,7 +41993,7 @@ class SpreadsheetDashboard extends Component {
     getClickableAction(position) {
         for (const items of clickableCellRegistry.getAll().sort((a, b) => a.sequence - b.sequence)) {
             if (items.condition(position, this.env)) {
-                return items.action;
+                return items.execute;
             }
         }
         return false;
@@ -41059,21 +42221,66 @@ SidePanel.props = {
     onCloseSidePanel: Function,
 };
 
-const AddMergeInteractiveContent = {
-    MergeIsDestructive: _lt("Merging these cells will only preserve the top-leftmost value. Merge anyway?"),
-    MergeInFilter: _lt("You can't merge cells inside of an existing filter."),
-};
-function interactiveAddMerge(env, sheetId, target) {
-    const result = env.model.dispatch("ADD_MERGE", { sheetId, target });
-    if (result.isCancelledBecause(80 /* CommandResult.MergeInFilter */)) {
-        env.raiseError(AddMergeInteractiveContent.MergeInFilter);
+css /* scss */ `
+  .o-menu-item-button {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    margin: 2px;
+    padding: 0px 3px;
+    border-radius: 2px;
+    min-width: 20px;
+  }
+  .o-disabled {
+    opacity: 0.6;
+    cursor: default;
+  }
+`;
+class ActionButton extends Component {
+    constructor() {
+        super(...arguments);
+        this.actionButton = createAction(this.props.action);
     }
-    else if (result.isCancelledBecause(3 /* CommandResult.MergeIsDestructive */)) {
-        env.askConfirmation(AddMergeInteractiveContent.MergeIsDestructive, () => {
-            env.model.dispatch("ADD_MERGE", { sheetId, target, force: true });
-        });
+    setup() {
+        onWillUpdateProps(() => (this.actionButton = createAction(this.props.action)));
     }
-}
+    get isVisible() {
+        return this.actionButton.isVisible(this.env);
+    }
+    get isEnabled() {
+        return this.actionButton.isEnabled(this.env);
+    }
+    get isActive() {
+        var _a, _b;
+        return (_b = (_a = this.actionButton).isActive) === null || _b === void 0 ? void 0 : _b.call(_a, this.env);
+    }
+    get title() {
+        const name = this.actionButton.name(this.env);
+        const description = this.actionButton.description;
+        return name + (description ? ` (${description})` : "");
+    }
+    get iconTitle() {
+        return this.actionButton.icon;
+    }
+    onClick(ev) {
+        var _a, _b, _c, _d;
+        if (this.isEnabled) {
+            (_b = (_a = this.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, ev);
+            (_d = (_c = this.actionButton).execute) === null || _d === void 0 ? void 0 : _d.call(_c, this.env);
+        }
+    }
+    get buttonStyle() {
+        if (this.props.selectedColor) {
+            return cssPropertiesToCss({
+                "border-bottom": `4px solid ${this.props.selectedColor}`,
+                height: "16px",
+                "margin-top": "2px",
+            });
+        }
+        return "";
+    }
+}
+ActionButton.template = "o-spreadsheet-ActionButton";
 
 const COMPOSER_MAX_HEIGHT = 100;
 css /* scss */ `
@@ -41135,6 +42342,14 @@ css /* scss */ `
     input::-webkit-inner-spin-button {
       -webkit-appearance: none;
     }
+
+    .o-text-options > div {
+      line-height: 26px;
+      padding: 3px 12px;
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.08);
+      }
+    }
   }
 `;
 class FontSizeEditor extends Component {
@@ -41203,41 +42418,6 @@ FontSizeEditor.props = {
     dropdownStyle: String,
 };
 
-const FORMATS = [
-    { name: "automatic", text: NumberFormatTerms.Automatic },
-    { name: "number", text: NumberFormatTerms.Number, description: "1,000.12", value: "#,##0.00" },
-    { name: "percent", text: NumberFormatTerms.Percent, description: "10.12%", value: "0.00%" },
-    {
-        name: "currency",
-        text: NumberFormatTerms.Currency,
-        description: "$1,000.12",
-        value: "[$$]#,##0.00",
-    },
-    {
-        name: "currency_rounded",
-        text: NumberFormatTerms.CurrencyRounded,
-        description: "$1,000",
-        value: "[$$]#,##0",
-    },
-    { name: "date", text: NumberFormatTerms.Date, description: "9/26/2008", value: "m/d/yyyy" },
-    { name: "time", text: NumberFormatTerms.Time, description: "10:43:00 PM", value: "hh:mm:ss a" },
-    {
-        name: "datetime",
-        text: NumberFormatTerms.DateTime,
-        description: "9/26/2008 22:43:00",
-        value: "m/d/yyyy hh:mm:ss",
-    },
-    {
-        name: "duration",
-        text: NumberFormatTerms.Duration,
-        description: "27:51:38",
-        value: "hhhh:mm:ss",
-    },
-];
-const CUSTOM_FORMATS = [
-    { name: "custom_currency", text: NumberFormatTerms.CustomCurrency, sidePanel: "CustomCurrency" },
-];
-const ICONS_COLOR = "#4A4F59";
 // If we ever change these colors, make sure the filter tool stays green to match the icon in the grid
 const ACTIVE_BG_COLOR = BACKGROUND_HEADER_FILTER_COLOR;
 const ACTIVE_FONT_COLOR = FILTERS_COLOR;
@@ -41302,23 +42482,10 @@ css /* scss */ `
 
       /* Toolbar */
       .o-toolbar-tools {
-        .o-tool {
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          margin: 2px;
-          padding: 0px 3px;
-          border-radius: 2px;
-          min-width: 20px;
-        }
-
-        .o-filter-tool {
-          margin-right: 8px;
-        }
-
-        .o-border-dropdown {
-          padding: 4px;
-        }
+        display: flex;
+        flex-shrink: 0;
+        margin: 0px 6px 0px 16px;
+        cursor: default;
 
         .o-divider {
           display: inline-block;
@@ -41332,59 +42499,28 @@ css /* scss */ `
           display: flex;
           align-items: center;
 
-          .o-dropdown-button {
+          > span {
             height: 30px;
           }
 
-          .o-text-options > div {
-            line-height: 26px;
-            padding: 3px 12px;
-            &:hover {
-              background-color: rgba(0, 0, 0, 0.08);
-            }
-          }
-
           .o-dropdown-content {
             position: absolute;
             top: 100%;
             left: 0;
             overflow-y: auto;
             overflow-x: hidden;
+            padding: 2px;
             z-index: ${ComponentsImportance.Dropdown};
             box-shadow: 1px 2px 5px 2px rgba(51, 51, 51, 0.15);
             background-color: white;
 
             .o-dropdown-line {
               display: flex;
-              margin: 1px;
 
-              .o-line-item {
+              > span {
                 padding: 4px;
-                width: 18px;
-                height: 18px;
               }
             }
-
-            &.o-format-tool {
-              padding: 5px 0;
-              width: 250px;
-              font-size: 12px;
-              > div {
-                padding: 0 20px;
-                white-space: nowrap;
-
-                &.o-dropdown-active:before {
-                  content: "✓";
-                  font-weight: bold;
-                  position: absolute;
-                  left: 5px;
-                }
-              }
-            }
-
-            .o-dropdown-align-item {
-              padding: 7px 10px;
-            }
           }
         }
       }
@@ -41394,24 +42530,20 @@ css /* scss */ `
 class TopBar extends Component {
     constructor() {
         super(...arguments);
-        this.commonFormats = FORMATS;
-        this.customFormats = CUSTOM_FORMATS;
-        this.currentFormatName = "automatic";
-        this.style = {};
         this.state = useState({
             menuState: { isOpen: false, position: null, menuItems: [] },
             activeTool: "",
+            fillColor: "#ffffff",
+            textColor: "#000000",
         });
         this.isSelectingMenu = false;
         this.openedEl = null;
-        this.inMerge = false;
-        this.cannotMerge = false;
-        this.undoTool = false;
-        this.redoTool = false;
-        this.paintFormatTool = false;
-        this.fillColor = "#ffffff";
-        this.textColor = "#000000";
         this.menus = [];
+        this.EDIT = ACTION_EDIT;
+        this.FORMAT = ACTION_FORMAT;
+        this.VIEW = ACTION_VIEW;
+        this.formatNumberMenuItemSpec = formatNumberMenuItemSpec;
+        this.isntToolbarMenu = false;
     }
     get dropdownStyle() {
         return `max-height:${this.props.dropdownMaxHeight}px`;
@@ -41441,28 +42573,8 @@ class TopBar extends Component {
         this.props.onClick();
         this.closeMenus();
     }
-    toggleStyle(style) {
-        setStyle(this.env, { [style]: !this.style[style] });
-    }
-    toggleFormat(formatName) {
-        const formatter = FORMATS.find((f) => f.name === formatName);
-        const value = (formatter && formatter.value) || "";
-        setFormatter(this.env, value);
-    }
-    toggleHorizontalAlign(align) {
-        setStyle(this.env, { align });
-        this.onClick();
-    }
-    toggleVerticalAlign(verticalAlign) {
-        setStyle(this.env, { verticalAlign });
-        this.onClick();
-    }
-    toggleTextWrapping(wrapping) {
-        setStyle(this.env, { wrapping });
-        this.onClick();
-    }
     onMenuMouseOver(menu, ev) {
-        if (this.isSelectingMenu) {
+        if (this.isSelectingMenu && this.isntToolbarMenu) {
             this.openMenu(menu, ev);
         }
     }
@@ -41473,15 +42585,27 @@ class TopBar extends Component {
         this.openedEl = isOpen ? null : ev.target;
     }
     toggleContextMenu(menu, ev) {
-        if (this.state.menuState.isOpen) {
+        if (this.state.menuState.isOpen && this.isntToolbarMenu) {
+            this.closeMenus();
+        }
+        else {
+            this.openMenu(menu, ev);
+            this.isntToolbarMenu = true;
+        }
+    }
+    toggleToolbarContextMenu(menuSpec, ev) {
+        if (this.state.menuState.isOpen && !this.isntToolbarMenu) {
             this.closeMenus();
         }
         else {
+            const menu = createAction(menuSpec);
             this.openMenu(menu, ev);
+            this.isntToolbarMenu = false;
         }
     }
     openMenu(menu, ev) {
-        const { left, top, height } = ev.target.getBoundingClientRect();
+        const { left, top, height } = ev.currentTarget.getBoundingClientRect();
+        this.state.activeTool = "";
         this.state.menuState.isOpen = true;
         this.state.menuState.position = { x: left, y: top + height };
         this.state.menuState.menuItems = menu.children(this.env);
@@ -41498,134 +42622,28 @@ class TopBar extends Component {
         this.openedEl = null;
     }
     updateCellState() {
-        const zones = this.env.model.getters.getSelectedZones();
-        const { col, row, sheetId } = this.env.model.getters.getActivePosition();
-        this.inMerge = false;
-        const { top, left, right, bottom } = this.env.model.getters.getSelectedZone();
-        const { xSplit, ySplit } = this.env.model.getters.getPaneDivisions(sheetId);
-        this.cannotMerge =
-            zones.length > 1 ||
-                (top === bottom && left === right) ||
-                (left < xSplit && xSplit <= right) ||
-                (top < ySplit && ySplit <= bottom);
-        if (!this.cannotMerge) {
-            const zone = this.env.model.getters.expandZone(sheetId, positionToZone({ col, row }));
-            this.inMerge = isEqual(zones[0], zone);
-        }
-        this.undoTool = this.env.model.getters.canUndo();
-        this.redoTool = this.env.model.getters.canRedo();
-        this.paintFormatTool = this.env.model.getters.isPaintingFormat();
-        const cell = this.env.model.getters.getActiveCell();
-        if (cell.format) {
-            const currentFormat = this.commonFormats.find((f) => f.value === cell.format);
-            this.currentFormatName = currentFormat ? currentFormat.name : "";
-        }
-        else {
-            this.currentFormatName = "automatic";
-        }
-        this.style = { ...this.env.model.getters.getCurrentStyle() };
-        this.style.align = this.style.align || cell.defaultAlign;
-        this.fillColor = this.style.fillColor || "#ffffff";
-        this.textColor = this.style.textColor || "#000000";
+        const style = this.env.model.getters.getCurrentStyle();
+        this.state.fillColor = style.fillColor || "#ffffff";
+        this.state.textColor = style.textColor || "#000000";
         this.menus = topbarMenuRegistry.getMenuItems();
     }
     getMenuName(menu) {
         return menu.name(this.env);
     }
-    toggleMerge() {
-        if (this.cannotMerge) {
-            return;
-        }
-        const zones = this.env.model.getters.getSelectedZones();
-        const target = [zones[zones.length - 1]];
-        const sheetId = this.env.model.getters.getActiveSheetId();
-        if (this.inMerge) {
-            this.env.model.dispatch("REMOVE_MERGE", { sheetId, target });
-        }
-        else {
-            interactiveAddMerge(this.env, sheetId, target);
-        }
-    }
     setColor(target, color) {
         setStyle(this.env, { [target]: color });
         this.onClick();
     }
-    setBorder(command) {
-        this.env.model.dispatch("SET_FORMATTING", {
-            sheetId: this.env.model.getters.getActiveSheetId(),
-            target: this.env.model.getters.getSelectedZones(),
-            border: command,
-        });
-        this.onClick();
-    }
-    setFormat(format, custom) {
-        if (!custom) {
-            this.toggleFormat(format);
-        }
-        else {
-            this.openCustomFormatSidePanel(format);
-        }
-        this.onClick();
-    }
-    openCustomFormatSidePanel(custom) {
-        const customFormatter = CUSTOM_FORMATS.find((c) => c.name === custom);
-        const sidePanel = (customFormatter && customFormatter.sidePanel) || "";
-        this.env.openSidePanel(sidePanel);
-    }
-    setDecimal(step) {
-        this.env.model.dispatch("SET_DECIMAL", {
-            sheetId: this.env.model.getters.getActiveSheetId(),
-            target: this.env.model.getters.getSelectedZones(),
-            step: step,
-        });
-    }
-    paintFormat() {
-        this.env.model.dispatch("ACTIVATE_PAINT_FORMAT", {
-            target: this.env.model.getters.getSelectedZones(),
-        });
-    }
-    clearFormatting() {
-        this.env.model.dispatch("CLEAR_FORMATTING", {
-            sheetId: this.env.model.getters.getActiveSheetId(),
-            target: this.env.model.getters.getSelectedZones(),
-        });
-    }
-    doAction(action) {
-        action(this.env);
-        this.closeMenus();
-    }
-    undo() {
-        this.env.model.dispatch("REQUEST_UNDO");
-    }
-    redo() {
-        this.env.model.dispatch("REQUEST_REDO");
-    }
-    get selectionContainsFilter() {
-        const sheetId = this.env.model.getters.getActiveSheetId();
-        const selectedZones = this.env.model.getters.getSelectedZones();
-        return this.env.model.getters.doesZonesContainFilter(sheetId, selectedZones);
-    }
-    get cannotCreateFilter() {
-        return !areZonesContinuous(...this.env.model.getters.getSelectedZones());
-    }
-    createFilter() {
-        if (this.cannotCreateFilter) {
-            return;
-        }
-        this.env.model.selection.selectTableAroundSelection();
-        const sheetId = this.env.model.getters.getActiveSheetId();
-        const selection = this.env.model.getters.getSelectedZones();
-        interactiveAddFilter(this.env, sheetId, selection);
-    }
-    removeFilter() {
-        this.env.model.dispatch("REMOVE_FILTER_TABLE", {
-            sheetId: this.env.model.getters.getActiveSheetId(),
-            target: this.env.model.getters.getSelectedZones(),
-        });
-    }
 }
 TopBar.template = "o-spreadsheet-TopBar";
-TopBar.components = { ColorPickerWidget, Menu, TopBarComposer, FontSizeEditor };
+TopBar.components = {
+    ColorPickerWidget,
+    ColorPicker,
+    Menu,
+    TopBarComposer,
+    FontSizeEditor,
+    ActionButton,
+};
 TopBar.props = {
     onClick: Function,
     focusComposer: String,
@@ -41735,6 +42753,10 @@ css /* scss */ `
     height: ${CF_ICON_EDGE_LENGTH}px;
     vertical-align: sub;
   }
+
+  .o-text-icon {
+    vertical-align: middle;
+  }
 `;
 // -----------------------------------------------------------------------------
 // GRID STYLE
@@ -42653,6 +43675,14 @@ class SelectiveHistory {
         this.revertBefore(operationId);
         this.tree.drop(operationId);
     }
+    getRevertedExecution() {
+        const data = [];
+        const operations = this.tree.revertedExecution(this.HEAD_BRANCH);
+        for (const { operation } of operations) {
+            data.push(operation.data);
+        }
+        return data;
+    }
     /**
      * Revert the state as it was *before* the given operation was executed.
      */
@@ -42709,12 +43739,12 @@ function buildRevisionLog(initialRevisionId, recordChanges, dispatch) {
             }
         });
         revision.setChanges(changes);
-    }, (revision) => revertChanges([revision]), (id) => new Revision(id, "empty", [], []), {
+    }, (revision) => revertChanges([revision]), (id) => new Revision(id, "empty", []), {
         with: (revision) => (toTransform) => {
-            return new Revision(toTransform.id, toTransform.clientId, transformAll(toTransform.commands, revision.commands));
+            return new Revision(toTransform.id, toTransform.clientId, transformAll(toTransform.commands, revision.commands), toTransform.rootCommand);
         },
         without: (revision) => (toTransform) => {
-            return new Revision(toTransform.id, toTransform.clientId, transformAll(toTransform.commands, revision.commands.map(inverseCommand).flat()));
+            return new Revision(toTransform.id, toTransform.clientId, transformAll(toTransform.commands, revision.commands.map(inverseCommand).flat()), toTransform.rootCommand);
         },
     });
 }
@@ -42751,101 +43781,6 @@ function applyChange(change, target) {
     }
 }
 
-/**
- * Local History
- *
- * The local history is responsible of tracking the locally state updates
- * It maintains the local undo and redo stack to allow to undo/redo only local
- * changes
- */
-class LocalHistory extends EventBus$1 {
-    constructor(dispatch, session) {
-        super();
-        this.dispatch = dispatch;
-        this.session = session;
-        /**
-         * Ids of the revisions which can be undone
-         */
-        this.undoStack = [];
-        /**
-         * Ids of the revisions which can be redone
-         */
-        this.redoStack = [];
-        this.session.on("new-local-state-update", this, this.onNewLocalStateUpdate);
-        this.session.on("revision-undone", this, ({ commands }) => this.selectiveUndo(commands));
-        this.session.on("revision-redone", this, ({ commands }) => this.selectiveRedo(commands));
-        this.session.on("pending-revisions-dropped", this, ({ revisionIds }) => this.drop(revisionIds));
-        this.session.on("snapshot", this, () => {
-            this.undoStack = [];
-            this.redoStack = [];
-        });
-    }
-    allowDispatch(cmd) {
-        switch (cmd.type) {
-            case "REQUEST_UNDO":
-                if (!this.canUndo()) {
-                    return 6 /* CommandResult.EmptyUndoStack */;
-                }
-                break;
-            case "REQUEST_REDO":
-                if (!this.canRedo()) {
-                    return 7 /* CommandResult.EmptyRedoStack */;
-                }
-                break;
-        }
-        return 0 /* CommandResult.Success */;
-    }
-    beforeHandle(cmd) { }
-    handle(cmd) {
-        switch (cmd.type) {
-            case "REQUEST_UNDO":
-            case "REQUEST_REDO":
-                // History changes (undo & redo) are *not* applied optimistically on the local state.
-                // We wait a global confirmation from the server. The goal is to avoid handling concurrent
-                // history changes on multiple clients which are very hard to manage correctly.
-                this.requestHistoryChange(cmd.type === "REQUEST_UNDO" ? "UNDO" : "REDO");
-        }
-    }
-    finalize() { }
-    requestHistoryChange(type) {
-        const id = type === "UNDO" ? this.undoStack.pop() : this.redoStack.pop();
-        if (!id) {
-            return;
-        }
-        if (type === "UNDO") {
-            this.session.undo(id);
-            this.redoStack.push(id);
-        }
-        else {
-            this.session.redo(id);
-            this.undoStack.push(id);
-        }
-    }
-    canUndo() {
-        return this.undoStack.length > 0;
-    }
-    canRedo() {
-        return this.redoStack.length > 0;
-    }
-    drop(revisionIds) {
-        this.undoStack = this.undoStack.filter((id) => !revisionIds.includes(id));
-        this.redoStack = [];
-    }
-    onNewLocalStateUpdate({ id }) {
-        this.undoStack.push(id);
-        this.redoStack = [];
-        if (this.undoStack.length > MAX_HISTORY_STEPS) {
-            this.undoStack.shift();
-        }
-    }
-    selectiveUndo(commands) {
-        this.dispatch("UNDO", { commands });
-    }
-    selectiveRedo(commands) {
-        this.dispatch("REDO", { commands });
-    }
-}
-
 /**
  * Stateless sequence of events that can be processed by consumers.
  *
@@ -43246,8 +44181,8 @@ class SelectionStreamProcessorImpl {
         }
         const { left, right, top, bottom } = zone;
         const sheetId = this.getters.getActiveSheetId();
-        const refCol = this.getters.findVisibleHeader(sheetId, "COL", range(left, right + 1));
-        const refRow = this.getters.findVisibleHeader(sheetId, "ROW", range(top, bottom + 1));
+        const refCol = this.getters.findVisibleHeader(sheetId, "COL", left, right);
+        const refRow = this.getters.findVisibleHeader(sheetId, "ROW", top, bottom);
         if (refRow === undefined || refCol === undefined) {
             return 17 /* CommandResult.SelectionOutOfBound */;
         }
@@ -43322,10 +44257,10 @@ class SelectionStreamProcessorImpl {
         const { col: anchorCol, row: anchorRow } = anchor.cell;
         return {
             col: this.getters.isColHidden(sheetId, anchorCol)
-                ? this.getters.findVisibleHeader(sheetId, "COL", range(left, right + 1)) || anchorCol
+                ? this.getters.findVisibleHeader(sheetId, "COL", left, right) || anchorCol
                 : anchorCol,
             row: this.getters.isRowHidden(sheetId, anchorRow)
-                ? this.getters.findVisibleHeader(sheetId, "ROW", range(top, bottom + 1)) || anchorRow
+                ? this.getters.findVisibleHeader(sheetId, "ROW", top, bottom) || anchorRow
                 : anchorRow,
         };
     }
@@ -45075,6 +46010,8 @@ class Model extends EventBus {
          * Internal status of the model. Important for command handling coordination
          */
         this.status = 0 /* Status.Ready */;
+        this.handlers = [];
+        this.coreHandlers = [];
         /**
          * Check if a command can be dispatched, and returns a DispatchResult object with the possible
          * reasons the dispatch failed.
@@ -45119,7 +46056,7 @@ class Model extends EventBus {
                         this.dispatchToHandlers(this.handlers, command);
                         this.finalize();
                     });
-                    this.session.save(commands, changes);
+                    this.session.save(command, commands, changes);
                     this.status = 0 /* Status.Ready */;
                     this.trigger("update");
                     break;
@@ -45151,9 +46088,7 @@ class Model extends EventBus {
             const command = { ...payload, type };
             const previousStatus = this.status;
             this.status = 2 /* Status.RunningCore */;
-            const handlers = this.isReplayingCommand
-                ? [this.range, ...this.corePlugins, ...this.coreViewsPlugins]
-                : this.handlers;
+            const handlers = this.isReplayingCommand ? this.coreHandlers : this.handlers;
             this.dispatchToHandlers(handlers, command);
             this.status = previousStatus;
             return DispatchResult.Success;
@@ -45164,7 +46099,6 @@ class Model extends EventBus {
         this.uuidGenerator = uuidGenerator;
         this.config = this.setupConfig(config);
         this.session = this.setupSession(workbookData.revisionId);
-        this.history = new LocalHistory(this.dispatchFromCorePlugin, this.session);
         this.coreGetters = {};
         this.range = new RangeAdapter(this.coreGetters);
         this.coreGetters.getRangeString = this.range.getRangeString.bind(this.range);
@@ -45177,8 +46111,6 @@ class Model extends EventBus {
         this.getters = {
             isReadonly: () => this.config.mode === "readonly" || this.config.mode === "dashboard",
             isDashboard: () => this.config.mode === "dashboard",
-            canUndo: this.history.canUndo.bind(this.history),
-            canRedo: this.history.canRedo.bind(this.history),
             getClient: this.session.getClient.bind(this.session),
             getConnectedClients: this.session.getConnectedClients.bind(this.session),
             isFullySynchronized: this.session.isFullySynchronized.bind(this.session),
@@ -45186,6 +46118,8 @@ class Model extends EventBus {
         this.uuidGenerator.setIsFastStrategy(true);
         // Initiate stream processor
         this.selection = new SelectionStreamProcessorImpl(this.getters);
+        this.coreHandlers.push(this.range);
+        this.handlers.push(this.range);
         this.corePluginConfig = this.setupCorePluginConfig();
         this.uiPluginConfig = this.setupUiPluginConfig();
         // registering plugins
@@ -45194,13 +46128,20 @@ class Model extends EventBus {
         }
         Object.assign(this.getters, this.coreGetters);
         for (let Plugin of statefulUIPluginRegistry.getAll()) {
-            this.statefulUIPlugins.push(this.setupUiPlugin(Plugin));
+            const plugin = this.setupUiPlugin(Plugin);
+            this.statefulUIPlugins.push(plugin);
+            this.handlers.push(plugin);
         }
         for (let Plugin of coreViewsPluginRegistry.getAll()) {
-            this.coreViewsPlugins.push(this.setupUiPlugin(Plugin));
+            const plugin = this.setupUiPlugin(Plugin);
+            this.coreViewsPlugins.push(plugin);
+            this.handlers.push(plugin);
+            this.coreHandlers.push(plugin);
         }
         for (let Plugin of featurePluginRegistry.getAll()) {
-            this.featurePlugins.push(this.setupUiPlugin(Plugin));
+            const plugin = this.setupUiPlugin(Plugin);
+            this.featurePlugins.push(plugin);
+            this.handlers.push(plugin);
         }
         this.uuidGenerator.setIsFastStrategy(false);
         // starting plugins
@@ -45224,15 +46165,6 @@ class Model extends EventBus {
         // by owl, since we do not rely on reactivity
         markRaw(this);
     }
-    get handlers() {
-        return [...this.coreHandlers, ...this.allUIPlugins, this.history];
-    }
-    get coreHandlers() {
-        return [this.range, ...this.corePlugins];
-    }
-    get allUIPlugins() {
-        return [...this.statefulUIPlugins, ...this.coreViewsPlugins, ...this.featurePlugins];
-    }
     joinSession() {
         this.session.join(this.config.client);
     }
@@ -45274,6 +46206,8 @@ class Model extends EventBus {
         }
         plugin.import(data);
         this.corePlugins.push(plugin);
+        this.coreHandlers.push(plugin);
+        this.handlers.push(plugin);
     }
     onRemoteRevisionReceived({ commands }) {
         for (let command of commands) {
@@ -45291,15 +46225,21 @@ class Model extends EventBus {
                 return;
             }
             this.isReplayingCommand = true;
-            this.dispatchToHandlers([this.range, ...this.corePlugins, ...this.coreViewsPlugins], command);
+            this.dispatchToHandlers(this.coreHandlers, command);
             this.isReplayingCommand = false;
         }), this.config.transportService, revisionId);
         return session;
     }
     setupSessionEvents() {
         this.session.on("remote-revision-received", this, this.onRemoteRevisionReceived);
-        this.session.on("revision-redone", this, this.finalize);
-        this.session.on("revision-undone", this, this.finalize);
+        this.session.on("revision-undone", this, ({ commands }) => {
+            this.dispatchFromCorePlugin("UNDO", { commands });
+            this.finalize();
+        });
+        this.session.on("revision-redone", this, ({ commands }) => {
+            this.dispatchFromCorePlugin("REDO", { commands });
+            this.finalize();
+        });
         // How could we improve communication between the session and UI?
         // It feels weird to have the model piping specific session events to its own bus.
         this.session.on("unexpected-revision-id", this, () => this.trigger("unexpected-revision-id"));
@@ -45347,6 +46287,7 @@ class Model extends EventBus {
             custom: this.config.custom,
             uiActions: this.config,
             lazyEvaluation: this.config.lazyEvaluation,
+            session: this.session,
         };
     }
     // ---------------------------------------------------------------------------
@@ -45362,7 +46303,8 @@ class Model extends EventBus {
         return this.checkDispatchAllowedLocalCommand(command);
     }
     checkDispatchAllowedCoreCommand(command) {
-        const results = this.coreHandlers.map((handler) => handler.allowDispatch(command));
+        const results = this.corePlugins.map((handler) => handler.allowDispatch(command));
+        results.push(this.range.allowDispatch(command));
         return new DispatchResult(results.flat());
     }
     checkDispatchAllowedLocalCommand(command) {
@@ -45426,7 +46368,7 @@ class Model extends EventBus {
             }
         }
         data.revisionId = this.session.getRevisionId() || DEFAULT_REVISION_ID;
-        data = JSON.parse(JSON.stringify(data));
+        data = deepCopy(data);
         return data;
     }
     updateMode(mode) {
@@ -45454,7 +46396,7 @@ class Model extends EventBus {
                 handler.exportForExcel(data);
             }
         }
-        data = JSON.parse(JSON.stringify(data));
+        data = deepCopy(data);
         return getXLSX(data);
     }
     garbageCollectExternalResources() {
@@ -45506,6 +46448,9 @@ const registries = {
     inverseCommandRegistry,
     urlRegistry,
     cellPopoverRegistry,
+    numberFormatMenuRegistry,
+    repeatLocalCommandTransformRegistry,
+    repeatCommandTransformRegistry,
 };
 const helpers = {
     arg,
@@ -45534,6 +46479,7 @@ const helpers = {
     positionToZone,
     isDefined: isDefined$1,
     lazy,
+    genericRepeat,
 };
 const links = {
     isMarkdownLink,
@@ -45563,9 +46509,9 @@ function addFunction(functionName, functionDescription) {
     functionRegistry.add(functionName, functionDescription);
 }
 
-export { AbstractChart, CommandResult, CorePlugin, DATETIME_FORMAT, DispatchResult, EvaluationError, Model, Registry, Revision, SPREADSHEET_DIMENSIONS, Spreadsheet, UIPlugin, __info__, addFunction, astToFormula, compile, components, convertAstNodes, coreTypes, findCellInNewZone, functionCache, helpers, invalidateEvaluationCommands, links, load, parse, readonlyAllowedCommands, registries, setTranslationMethod, tokenize };
+export { AbstractChart, CommandResult, CorePlugin, DATETIME_FORMAT, DispatchResult, EvaluationError, Model, Registry, Revision, SPREADSHEET_DIMENSIONS, Spreadsheet, UIPlugin, __info__, addFunction, astToFormula, compile, components, convertAstNodes, coreTypes, findCellInNewZone, functionCache, helpers, invalidateEvaluationCommands, links, load, parse, readonlyAllowedCommands, registries, setDefaultSheetViewSize, setTranslationMethod, tokenize };
 
 
-__info__.version = '16.3.0-alpha.3';
-__info__.date = '2023-04-13T08:30:41.165Z';
-__info__.hash = '573e679';
+__info__.version = '16.3.0-alpha.5';
+__info__.date = '2023-04-21T07:28:52.982Z';
+__info__.hash = '6304f41';