@odoo/o-spreadsheet 16.3.24 → 16.3.26

package/dist/o-spreadsheet.esm.js

@@ -1742,6 +1742,9 @@ function parseFormat(formatString) {
 function formatValue(value, format) {
     switch (typeof value) {
         case "string":
+            if (value.includes('\\"')) {
+                return value.replace(/\\"/g, '"');
+            }
             return value;
         case "boolean":
             return value ? "TRUE" : "FALSE";
@@ -9429,6 +9432,12 @@ const INSERT_LINK = (env) => {
     let { col, row } = env.model.getters.getActivePosition();
     env.model.dispatch("OPEN_CELL_POPOVER", { col, row, popoverType: "LinkEditor" });
 };
+const INSERT_LINK_NAME = (env) => {
+    const sheetId = env.model.getters.getActiveSheetId();
+    const { col, row } = env.model.getters.getActivePosition();
+    const cell = env.model.getters.getEvaluatedCell({ sheetId, col, row });
+    return cell && cell.link ? _lt("Edit link") : _lt("Insert link");
+};
 //------------------------------------------------------------------------------
 // Filters action
 //------------------------------------------------------------------------------
@@ -16653,7 +16662,7 @@ cellMenuRegistry
 })
     .add("insert_link", {
     ...insertLink,
-    name: _lt("Insert link"),
+    name: INSERT_LINK_NAME,
     sequence: 150,
     separator: true,
 });
@@ -20980,6 +20989,7 @@ class Composer extends Component {
     static components = { TextValueProvider, FunctionDescriptionProvider };
     static defaultProps = {
         inputStyle: "",
+        isDefaultFocus: false,
     };
     composerRef = useRef("o_composer");
     contentHelper = new ContentEditableHelper(this.composerRef.el);
@@ -21037,13 +21047,13 @@ class Composer extends Component {
     setup() {
         onMounted(() => {
             const el = this.composerRef.el;
+            if (this.props.isDefaultFocus) {
+                this.env.focusableElement.setFocusableElement(el);
+            }
             this.contentHelper.updateEl(el);
             this.processContent();
             this.contentHelper.scrollSelectionIntoView();
         });
-        onWillUnmount(() => {
-            this.props.onComposerUnmounted?.();
-        });
         onPatched(() => {
             if (!this.isKeyStillDown) {
                 this.processContent();
@@ -21054,7 +21064,8 @@ class Composer extends Component {
     // Handlers
     // ---------------------------------------------------------------------------
     processArrowKeys(ev) {
-        if (this.env.model.getters.isSelectingForComposer()) {
+        if (this.env.model.getters.isSelectingForComposer() ||
+            this.env.model.getters.getEditionMode() === "inactive") {
             this.functionDescriptionState.showDescription = false;
             // Prevent the default content editable behavior which moves the cursor
             ev.preventDefault();
@@ -21094,21 +21105,23 @@ class Composer extends Component {
     processTabKey(ev) {
         ev.preventDefault();
         ev.stopPropagation();
-        if (this.autoCompleteState.showProvider) {
-            const autoCompleteValue = this.autoCompleteState.values[this.autoCompleteState.selectedIndex]?.text;
-            if (autoCompleteValue) {
-                this.autoComplete(autoCompleteValue);
-                return;
+        if (this.env.model.getters.getEditionMode() !== "inactive") {
+            if (this.autoCompleteState.showProvider) {
+                const autoCompleteValue = this.autoCompleteState.values[this.autoCompleteState.selectedIndex]?.text;
+                if (autoCompleteValue) {
+                    this.autoComplete(autoCompleteValue);
+                    return;
+                }
             }
-        }
-        else {
-            // when completing with tab, if there is no value to complete, the active cell will be moved to the right.
-            // we can't let the model think that it is for a ref selection.
-            // todo: check if this can be removed someday
-            this.env.model.dispatch("STOP_COMPOSER_RANGE_SELECTION");
+            else {
+                // when completing with tab, if there is no value to complete, the active cell will be moved to the right.
+                // we can't let the model think that it is for a ref selection.
+                // todo: check if this can be removed someday
+                this.env.model.dispatch("STOP_COMPOSER_RANGE_SELECTION");
+            }
+            this.env.model.dispatch("STOP_EDITION");
         }
         const direction = ev.shiftKey ? "left" : "right";
-        this.env.model.dispatch("STOP_EDITION");
         this.env.model.selection.moveAnchorCell(direction, 1);
     }
     processEnterKey(ev) {
@@ -21152,6 +21165,9 @@ class Composer extends Component {
         this.compositionActive = false;
     }
     onKeydown(ev) {
+        if (this.env.model.getters.getEditionMode() === "inactive") {
+            return;
+        }
         let handler = this.keyMapping[ev.key];
         if (handler) {
             handler.call(this, ev);
@@ -21162,22 +21178,44 @@ class Composer extends Component {
         }
     }
     updateCursorIfNeeded() {
-        if (!this.env.model.getters.isSelectingForComposer()) {
+        const moveCursor = !this.env.model.getters.isSelectingForComposer() &&
+            !(this.env.model.getters.getEditionMode() === "inactive");
+        if (moveCursor) {
             const { start, end } = this.contentHelper.getCurrentSelection();
             this.env.model.dispatch("CHANGE_COMPOSER_CURSOR_SELECTION", { start, end });
             this.isKeyStillDown = true;
         }
     }
+    onPaste(ev) {
+        if (this.env.model.getters.getEditionMode() !== "inactive") {
+            ev.stopPropagation();
+        }
+    }
     /*
      * Triggered automatically by the content-editable between the keydown and key up
      * */
-    onInput() {
-        if (this.props.focus === "inactive" || !this.shouldProcessInputEvents) {
+    onInput(ev) {
+        if (!this.shouldProcessInputEvents) {
             return;
         }
+        if (ev.inputType === "insertFromPaste" &&
+            this.env.model.getters.getEditionMode() === "inactive") {
+            return;
+        }
+        ev.stopPropagation();
+        let content;
+        if (this.env.model.getters.getEditionMode() === "inactive") {
+            content = ev.data || "";
+        }
+        else {
+            content = this.contentHelper.getText();
+        }
+        if (this.props.focus === "inactive") {
+            return this.props.onComposerCellFocused?.(content);
+        }
         this.env.model.dispatch("STOP_COMPOSER_RANGE_SELECTION");
         this.env.model.dispatch("SET_CURRENT_CONTENT", {
-            content: this.contentHelper.getText(),
+            content,
             selection: this.contentHelper.getCurrentSelection(),
         });
     }
@@ -21248,9 +21286,8 @@ class Composer extends Component {
         }
         const newSelection = this.contentHelper.getCurrentSelection();
         this.env.model.dispatch("STOP_COMPOSER_RANGE_SELECTION");
-        if (this.props.focus === "inactive") {
-            this.props.onComposerContentFocused(newSelection);
-        }
+        this.props.onComposerContentFocused();
+        if (this.props.focus === "inactive") ;
         this.env.model.dispatch("CHANGE_COMPOSER_CURSOR_SELECTION", newSelection);
         this.processTokenAtCursor();
     }
@@ -21394,7 +21431,7 @@ class Composer extends Component {
         const highlights = this.env.model.getters.getHighlights();
         const refSheet = sheetName
             ? this.env.model.getters.getSheetIdByName(sheetName)
-            : this.env.model.getters.getCurrentEditedCell().sheetId;
+            : this.env.model.getters.getCurrentEditedCell()?.sheetId;
         const highlight = highlights.find((highlight) => {
             if (highlight.sheetId !== refSheet)
                 return false;
@@ -21471,12 +21508,13 @@ class Composer extends Component {
     }
 }
 Composer.props = {
-    focus: { validate: (value) => ["inactive", "cellFocus", "contentFocus"].includes(value) },
-    onComposerContentFocused: Function,
     inputStyle: { type: String, optional: true },
     rect: { type: Object, optional: true },
     delimitation: { type: Object, optional: true },
-    onComposerUnmounted: { type: Function, optional: true },
+    focus: { validate: (value) => ["inactive", "cellFocus", "contentFocus"].includes(value) },
+    onComposerCellFocused: { type: Function, optional: true },
+    onComposerContentFocused: Function,
+    isDefaultFocus: { type: Boolean, optional: true },
 };
 
 const COMPOSER_BORDER_WIDTH = 3 * 0.4 * window.devicePixelRatio || 1;
@@ -21510,51 +21548,26 @@ css /* scss */ `
 class GridComposer extends Component {
     static template = "o-spreadsheet-GridComposer";
     static components = { Composer };
-    gridComposerRef;
-    zone;
-    rect;
+    // TODORAR see if we can keep it undefined
+    rect = this.defaultRect;
+    isEditing = false;
     isCellReferenceVisible;
-    composerState;
+    get defaultRect() {
+        return { x: 0, y: 0, width: 0, height: 0 };
+    }
     setup() {
-        this.gridComposerRef = useRef("gridComposer");
-        this.composerState = useState({
-            rect: undefined,
-            delimitation: undefined,
-        });
-        const { sheetId, col, row } = this.env.model.getters.getActivePosition();
-        this.zone = this.env.model.getters.expandZone(sheetId, positionToZone({ col, row }));
-        this.rect = this.env.model.getters.getVisibleRect(this.zone);
-        this.isCellReferenceVisible = false;
-        onMounted(() => {
-            const el = this.gridComposerRef.el;
-            this.composerState.rect = {
-                x: this.rect.x,
-                y: this.rect.y,
-                width: el.clientWidth,
-                height: el.clientHeight,
-            };
-            this.composerState.delimitation = {
-                width: el.parentElement.clientWidth,
-                height: el.parentElement.clientHeight,
-            };
-        });
         onWillUpdateProps(() => {
-            if (this.isCellReferenceVisible) {
-                return;
-            }
-            const sheetId = this.env.model.getters.getActiveSheetId();
-            const zone = this.env.model.getters.getSelectedZone();
-            const rect = this.env.model.getters.getVisibleRect(zone);
-            if (!deepEquals(rect, this.rect) ||
-                sheetId !== this.env.model.getters.getCurrentEditedCell().sheetId) {
-                this.isCellReferenceVisible = true;
-            }
+            this.updateComponentPosition();
+            this.updateCellReferenceVisibility();
         });
     }
     get shouldDisplayCellReference() {
         return this.isCellReferenceVisible;
     }
     get cellReference() {
+        if (!this.env.model.getters.getCurrentEditedCell()) {
+            return "";
+        }
         const { col, row, sheetId } = this.env.model.getters.getCurrentEditedCell();
         const prefixSheet = sheetId !== this.env.model.getters.getActiveSheetId();
         return `${prefixSheet ? getCanonicalSheetName(this.env.model.getters.getSheetName(sheetId)) + "!" : ""}${toXC(col, row)}`;
@@ -21566,7 +21579,27 @@ class GridComposer extends Component {
             top: `${top - GRID_CELL_REFERENCE_TOP_OFFSET}px`,
         });
     }
+    get composerProps() {
+        const { width, height } = this.env.model.getters.getSheetViewDimensionWithHeaders();
+        return {
+            rect: { ...this.rect },
+            delimitation: {
+                width,
+                height,
+            },
+            focus: this.props.focus,
+            isDefaultFocus: true,
+            onComposerContentFocused: this.props.onComposerContentFocused,
+            onComposerCellFocused: this.props.onComposerCellFocused,
+        };
+    }
     get containerStyle() {
+        if (this.env.model.getters.getEditionMode() === "inactive" || !this.rect) {
+            return `
+        position: absolute;
+        z-index: -1000;
+      `;
+        }
         const isFormula = this.env.model.getters.getCurrentContent().startsWith("=");
         const cell = this.env.model.getters.getActiveCell();
         const position = this.env.model.getters.getActivePosition();
@@ -21586,6 +21619,8 @@ class GridComposer extends Component {
         if (!isFormula) {
             textAlign = style.align || cell.defaultAlign;
         }
+        const maxHeight = this.props.gridDims.height - this.rect.y;
+        const maxWidth = this.props.gridDims.width - this.rect.x;
         /**
          * min-size is on the container, not the composer element, because we want to have the same size as the cell by default,
          * including all the paddings/margins of the composer
@@ -21597,6 +21632,8 @@ class GridComposer extends Component {
             top: `${top}px`,
             "min-width": `${width + 1}px`,
             "min-height": `${height + 1}px`,
+            "max-width": `${maxWidth}px`,
+            "max-height": `${maxHeight}px`,
             background,
             color,
             "font-size": `${fontSizeInPixels(fontSize)}px`,
@@ -21606,20 +21643,38 @@ class GridComposer extends Component {
             "text-align": textAlign,
         });
     }
-    get composerStyle() {
-        const maxHeight = this.props.gridDims.height - this.rect.y;
-        const maxWidth = this.props.gridDims.width - this.rect.x;
-        return cssPropertiesToCss({
-            "max-width": `${maxWidth}px`,
-            "max-height": `${maxHeight}px`,
-        });
+    updateComponentPosition() {
+        const isEditing = this.env.model.getters.getEditionMode() !== "inactive";
+        if (this.isEditing !== isEditing) {
+            this.isEditing = isEditing;
+            if (!isEditing) {
+                this.rect = this.defaultRect;
+                this.env.focusableElement.focus();
+                return;
+            }
+            const position = this.env.model.getters.getActivePosition();
+            const zone = this.env.model.getters.expandZone(position.sheetId, positionToZone(position));
+            this.rect = this.env.model.getters.getVisibleRect(zone);
+        }
+    }
+    updateCellReferenceVisibility() {
+        if (this.isCellReferenceVisible || this.env.model.getters.getEditionMode() === "inactive") {
+            return;
+        }
+        const sheetId = this.env.model.getters.getActiveSheetId();
+        const zone = this.env.model.getters.getSelectedZone();
+        const rect = this.env.model.getters.getVisibleRect(zone);
+        if (!deepEquals(rect, this.rect) ||
+            sheetId !== this.env.model.getters.getCurrentEditedCell().sheetId) {
+            this.isCellReferenceVisible = true;
+        }
     }
 }
 GridComposer.props = {
     focus: { validate: (value) => ["inactive", "cellFocus", "contentFocus"].includes(value) },
-    onComposerUnmounted: Function,
     onComposerContentFocused: Function,
     gridDims: Object,
+    onComposerCellFocused: Function,
 };
 
 const CSS$1 = css /* scss */ `
@@ -22488,7 +22543,6 @@ class GridOverlay extends Component {
         this.props.onCellDoubleClicked(col, row);
     }
     onContextMenu(ev) {
-        ev.preventDefault();
         const [col, row] = this.getCartesianCoordinates(ev);
         this.props.onCellRightClicked(col, row, { x: ev.clientX, y: ev.clientY });
     }
@@ -23582,7 +23636,6 @@ class Grid extends Component {
     HEADER_WIDTH = HEADER_WIDTH;
     menuState;
     gridRef;
-    hiddenInput;
     onMouseWheel;
     canvasPosition;
     hoveredCell;
@@ -23593,17 +23646,16 @@ class Grid extends Component {
             menuItems: [],
         });
         this.gridRef = useRef("grid");
-        this.hiddenInput = useRef("hiddenInput");
         this.canvasPosition = useAbsoluteBoundingRect(this.gridRef);
         this.hoveredCell = useState({ col: undefined, row: undefined });
         useChildSubEnv({ getPopoverContainerRect: () => this.getGridRect() });
         useExternalListener(document.body, "cut", this.copy.bind(this, true));
         useExternalListener(document.body, "copy", this.copy.bind(this, false));
         useExternalListener(document.body, "paste", this.paste);
-        onMounted(() => this.focus());
-        this.props.exposeFocus(() => this.focus());
+        onMounted(() => this.focusDefaultElement());
+        this.props.exposeFocus(() => this.focusDefaultElement());
         useGridDrawing("canvas", this.env.model, () => this.env.model.getters.getSheetViewDimensionWithHeaders());
-        useEffect(() => this.focus(), () => [this.env.model.getters.getActiveSheetId()]);
+        useEffect(() => this.focusDefaultElement(), () => [this.env.model.getters.getActiveSheetId()]);
         this.onMouseWheel = useWheelHandler((deltaX, deltaY) => {
             this.moveCanvas(deltaX, deltaY);
             this.hoveredCell.col = undefined;
@@ -23626,7 +23678,7 @@ class Grid extends Component {
         if (this.env.model.getters.hasOpenedPopover()) {
             this.closeOpenedPopover();
         }
-        this.focus();
+        this.focusDefaultElement();
     }
     // this map will handle most of the actions that should happen on key down. The arrow keys are managed in the key
     // down itself
@@ -23796,10 +23848,10 @@ class Grid extends Component {
         PAGEUP: () => this.env.model.dispatch("SHIFT_VIEWPORT_UP"),
         "CTRL+K": () => INSERT_LINK(this.env),
     };
-    focus() {
+    focusDefaultElement() {
         if (!this.env.model.getters.getSelectedFigureId() &&
             this.env.model.getters.getEditionMode() === "inactive") {
-            this.hiddenInput.el?.focus();
+            this.env.focusableElement.focus();
         }
     }
     get gridEl() {
@@ -23943,19 +23995,6 @@ class Grid extends Component {
             return;
         }
     }
-    onInput(ev) {
-        // the user meant to paste in the sheet, not open the composer with the pasted content
-        if (!ev.isComposing && ev.inputType === "insertFromPaste") {
-            return;
-        }
-        if (ev.data) {
-            // if the user types a character on the grid, it means he wants to start composing the selected cell with that
-            // character
-            ev.preventDefault();
-            ev.stopPropagation();
-            this.props.onGridComposerCellFocused(ev.data);
-        }
-    }
     // ---------------------------------------------------------------------------
     // Context Menu
     // ---------------------------------------------------------------------------
@@ -24065,7 +24104,7 @@ class Grid extends Component {
     }
     closeMenu() {
         this.menuState.isOpen = false;
-        this.focus();
+        this.focusDefaultElement();
     }
 }
 Grid.props = {
@@ -28725,6 +28764,31 @@ const MIGRATIONS = [
             return data;
         },
     },
+    {
+        description: "Fix datafilter duplication",
+        from: 12,
+        to: 12.5,
+        applyMigration(data) {
+            for (let sheet of data.sheets || []) {
+                let knownDataFilterZones = [];
+                for (let filterTable of sheet.filterTables || []) {
+                    const zone = toZone(filterTable.range);
+                    // See commit message for the details
+                    const intersectZoneIndex = knownDataFilterZones.findIndex((knownZone) => overlap(knownZone, zone));
+                    if (intersectZoneIndex !== -1) {
+                        knownDataFilterZones[intersectZoneIndex] = zone;
+                    }
+                    else {
+                        knownDataFilterZones.push(zone);
+                    }
+                }
+                sheet.filterTables = knownDataFilterZones.map((zone) => ({
+                    range: zoneToXc(zone),
+                }));
+            }
+            return data;
+        },
+    },
     {
         description: "Change Border description structure",
         from: 12,
@@ -29626,9 +29690,9 @@ class CellPlugin extends CorePlugin {
     allowDispatch(cmd) {
         switch (cmd.type) {
             case "UPDATE_CELL":
-                return this.checkCellOutOfSheet(cmd);
+                return this.checkValidations(cmd, this.checkCellOutOfSheet, this.checkUselessUpdateCell);
             case "CLEAR_CELL":
-                return this.checkValidations(cmd, this.chainValidations(this.checkCellOutOfSheet, this.checkUselessClearCell));
+                return this.checkValidations(cmd, this.checkCellOutOfSheet, this.checkUselessClearCell);
             default:
                 return 0 /* CommandResult.Success */;
         }
@@ -29760,10 +29824,6 @@ class CellPlugin extends CorePlugin {
                     format: cell.format ? getItemId(cell.format, formats) : undefined,
                     content: cell.content || undefined,
                 };
-                // if there is a formula but no dependencies (maybe because the cell is in error), no need to recompute the formula text
-                if (cell.isFormula && cell.dependencies.length) {
-                    cells[xc].content = this.buildFormulaContent(_sheet.id, cell, cell.dependencies, true);
-                }
             }
             _sheet.cells = cells;
         }
@@ -29926,7 +29986,7 @@ class CellPlugin extends CorePlugin {
         else {
             style = before ? before.style : undefined;
         }
-        let format = ("format" in after ? after.format : before && before.format) || detectFormat(afterContent);
+        const format = "format" in after ? after.format : before && before.format;
         /* Read the following IF as:
          * we need to remove the cell if it is completely empty, but we can know if it completely empty if:
          * - the command says the new content is empty and has no border/format/style
@@ -29970,7 +30030,7 @@ class CellPlugin extends CorePlugin {
             id,
             content,
             style,
-            format,
+            format: format || detectFormat(content),
             isFormula: false,
         };
     }
@@ -30047,6 +30107,18 @@ class CellPlugin extends CorePlugin {
         }
         return 0 /* CommandResult.Success */;
     }
+    checkUselessUpdateCell(cmd) {
+        const cell = this.getters.getCell(cmd);
+        const hasContent = "content" in cmd || "formula" in cmd;
+        const hasStyle = "style" in cmd;
+        const hasFormat = "format" in cmd;
+        if ((!hasContent || cell?.content === cmd.content) &&
+            (!hasStyle || deepEquals(cell?.style, cmd.style)) &&
+            (!hasFormat || cell?.format === cmd.format)) {
+            return 94 /* CommandResult.NoChanges */;
+        }
+        return 0 /* CommandResult.Success */;
+    }
 }
 
 class ChartPlugin extends CorePlugin {
@@ -33838,6 +33910,10 @@ class EvaluationPlugin extends UIPlugin {
                     if (cell.format !== evaluatedCell.format) {
                         exportedCellData.computedFormat = evaluatedCell.format;
                     }
+                    // if there is a formula but no dependencies (maybe because the cell is in error), no need to recompute the formula text
+                    if (cell.isFormula && cell.dependencies.length) {
+                        exportedCellData.content = this.getters.buildFormulaContent(sheet.id, cell, cell.dependencies, true);
+                    }
                 }
             }
         }
@@ -35706,8 +35782,7 @@ class AutofillPlugin extends UIPlugin {
         let row = zone.bottom;
         if (col > 0) {
             let leftPosition = { sheetId, col: col - 1, row };
-            while (this.getters.getEvaluatedCell(leftPosition).type !== CellValueType.empty ||
-                this.getters.getCell(leftPosition)?.content) {
+            while (this.getters.getCell(leftPosition)?.content) {
                 row += 1;
                 leftPosition = { sheetId, col: col - 1, row };
             }
@@ -35716,8 +35791,7 @@ class AutofillPlugin extends UIPlugin {
             col = zone.right;
             if (col <= this.getters.getNumberCols(sheetId)) {
                 let rightPosition = { sheetId, col: col + 1, row };
-                while (this.getters.getEvaluatedCell(rightPosition).type !== CellValueType.empty ||
-                    this.getters.getCell(rightPosition)?.content) {
+                while (this.getters.getCell(rightPosition)?.content) {
                     row += 1;
                     rightPosition = { sheetId, col: col + 1, row };
                 }
@@ -41182,7 +41256,7 @@ class EditionPlugin extends UIPlugin {
     getZoneReference(zone, fixedParts = [{ colFixed: false, rowFixed: false }]) {
         const sheetId = this.getters.getActiveSheetId();
         let selectedXc = this.getters.zoneToXC(sheetId, zone, fixedParts);
-        if (this.getters.getCurrentEditedCell().sheetId !== this.getters.getActiveSheetId()) {
+        if (this.getters.getCurrentEditedCell()?.sheetId !== this.getters.getActiveSheetId()) {
             const sheetName = getCanonicalSheetName(this.getters.getSheetName(this.getters.getActiveSheetId()));
             selectedXc = `${sheetName}!${selectedXc}`;
         }
@@ -41197,7 +41271,7 @@ class EditionPlugin extends UIPlugin {
             _fixedParts.pop();
         }
         const newRange = range.clone({ parts: _fixedParts });
-        return this.getters.getSelectionRangeString(newRange, this.getters.getCurrentEditedCell().sheetId);
+        return this.getters.getSelectionRangeString(newRange, this.getters.getCurrentEditedCell()?.sheetId || this.getters.getActiveSheetId());
     }
     /**
      * Replace the current selection by a new text.
@@ -41230,7 +41304,7 @@ class EditionPlugin extends UIPlugin {
         if (!this.currentContent.startsWith("=") || this.mode === "inactive") {
             return;
         }
-        const editionSheetId = this.getters.getCurrentEditedCell().sheetId;
+        const editionSheetId = this.getters.getCurrentEditedCell()?.sheetId || this.getters.getActiveSheetId();
         const XCs = this.getReferencedRanges().map((range) => this.getters.getRangeString(range, editionSheetId));
         const colorsToKeep = {};
         for (const xc of XCs) {
@@ -41259,7 +41333,7 @@ class EditionPlugin extends UIPlugin {
         if (!this.currentContent.startsWith("=") || this.mode === "inactive") {
             return [];
         }
-        const editionSheetId = this.getters.getCurrentEditedCell().sheetId;
+        const editionSheetId = this.getters.getCurrentEditedCell()?.sheetId || this.getters.getActiveSheetId();
         const rangeColor = (rangeString) => {
             const colorIndex = this.colorIndexByRange[rangeString];
             return colors$1[colorIndex % colors$1.length];
@@ -41277,7 +41351,7 @@ class EditionPlugin extends UIPlugin {
      * Return ranges currently referenced in the composer
      */
     getReferencedRanges() {
-        const editionSheetId = this.getters.getCurrentEditedCell().sheetId;
+        const editionSheetId = this.getters.getCurrentEditedCell()?.sheetId || this.getters.getActiveSheetId();
         const referenceRanges = this.currentTokens
             .filter((token) => token.type === "REFERENCE")
             .map((token) => this.getters.getRangeFromSheetXC(editionSheetId, token.value));
@@ -42088,6 +42162,16 @@ class ImageProvider {
     }
 }
 
+class FocusableElement {
+    focusableElement = undefined;
+    setFocusableElement(element) {
+        this.focusableElement = element;
+    }
+    focus() {
+        this.focusableElement?.focus();
+    }
+}
+
 const RIPPLE_KEY_FRAMES = [
     { transform: "scale(0)" },
     { transform: "scale(0.8)", offset: 0.33 },
@@ -44116,6 +44200,7 @@ class Spreadsheet extends Component {
             _t: Spreadsheet._t,
             clipboard: this.env.clipboard || instantiateClipboard(),
             startCellEdition: (content) => this.onGridComposerCellFocused(content),
+            focusableElement: new FocusableElement(),
         });
         useExternalListener(window, "resize", () => this.render(true));
         useExternalListener(window, "beforeunload", this.unbindModelEvents.bind(this));
@@ -44222,17 +44307,18 @@ class Spreadsheet extends Component {
         this.model.dispatch("UNFOCUS_SELECTION_INPUT");
         this.composer.topBarFocus = "contentFocus";
         this.composer.gridFocusMode = "inactive";
-        this.setComposerContent({ selection } || {});
+        this.setComposerContent({ selection });
     }
-    onGridComposerContentFocused() {
+    onGridComposerContentFocused(selection) {
         if (this.model.getters.isReadonly()) {
             return;
         }
         this.model.dispatch("UNFOCUS_SELECTION_INPUT");
         this.composer.topBarFocus = "inactive";
         this.composer.gridFocusMode = "contentFocus";
-        this.setComposerContent({});
+        this.setComposerContent({ selection });
     }
+    // TODO: either both are defined or none of them. change those args to an object
     onGridComposerCellFocused(content, selection) {
         if (this.model.getters.isReadonly()) {
             return;
@@ -45630,11 +45716,10 @@ class SelectionStreamProcessorImpl {
      * next cluster if the given cell is outside a cluster or at the border of a cluster in the given direction.
      */
     getEndOfCluster(startPosition, dim, dir) {
-        const sheet = this.getters.getActiveSheet();
         let currentPosition = startPosition;
         // If both the current cell and the next cell are not empty, we want to go to the end of the cluster
         const nextCellPosition = this.getNextCellPosition(startPosition, dim, dir);
-        let mode = !this.isCellEmpty(currentPosition, sheet.id) && !this.isCellEmpty(nextCellPosition, sheet.id)
+        let mode = !this.isEvaluatedCellEmpty(currentPosition) && !this.isEvaluatedCellEmpty(nextCellPosition)
             ? "endOfCluster"
             : "nextCluster";
         while (true) {
@@ -45644,7 +45729,7 @@ class SelectionStreamProcessorImpl {
                 currentPosition.row === nextCellPosition.row) {
                 break;
             }
-            const isNextCellEmpty = this.isCellEmpty(nextCellPosition, sheet.id);
+            const isNextCellEmpty = this.isEvaluatedCellEmpty(nextCellPosition);
             if (mode === "endOfCluster" && isNextCellEmpty) {
                 break;
             }
@@ -45658,14 +45743,24 @@ class SelectionStreamProcessorImpl {
         return dim === "cols" ? currentPosition.col : currentPosition.row;
     }
     /**
-     * Check if a cell is empty or undefined in the model. If the cell is part of a merge,
-     * check if the merge containing the cell is empty.
+     * Check if a cell evaluated value is empty. If the cell is part of a merge,
+     * the check applies to the main cell of the merge.
      */
-    isCellEmpty({ col, row }, sheetId = this.getters.getActiveSheetId()) {
+    isEvaluatedCellEmpty({ col, row }) {
+        const sheetId = this.getters.getActiveSheetId();
         const position = this.getters.getMainCellPosition({ sheetId, col, row });
         const cell = this.getters.getEvaluatedCell(position);
         return cell.type === CellValueType.empty;
     }
+    /**
+     * Checks if a cell is empty (i.e. does not have a content). If the cell is part of a merge,
+     * the check applies to the main cell of the merge.
+     */
+    isCellEmpty({ col, row }) {
+        const sheetId = this.getters.getActiveSheetId();
+        const position = this.getters.getMainCellPosition({ sheetId, col, row });
+        return !this.getters.getCell(position)?.content;
+    }
     /** Computes the next cell position in the given direction by crossing through merges and skipping hidden cells.
      *
      * This has the same behaviour as getNextAvailablePosition() for certain arguments, but use this method instead
@@ -47906,6 +48001,6 @@ function addFunction(functionName, functionDescription) {
 export { AbstractChart, CommandResult, CorePlugin, 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.24';
-__info__.date = '2024-02-02T13:45:48.440Z';
-__info__.hash = '0bf5f45';
+__info__.version = '16.3.26';
+__info__.date = '2024-02-16T14:22:11.270Z';
+__info__.hash = 'ab9abb6';