@odoo/o-spreadsheet 17.1.3 → 17.1.4

package/dist/o-spreadsheet.esm.js

@@ -2,9 +2,9 @@
 /**
  * This file is generated by o-spreadsheet build tools. Do not edit it.
  * @see https://github.com/odoo/o-spreadsheet
- * @version 17.1.3
- * @date 2024-02-02T13:46:54.332Z
- * @hash 798f979
+ * @version 17.1.4
+ * @date 2024-02-09T13:09:13.430Z
+ * @hash 16d3ece
  */
 
 import { Component, useRef, onMounted, useEffect, onWillPatch, useState, onWillUpdateProps, onPatched, useComponent, useExternalListener, onWillUnmount, onWillStart, xml, useChildSubEnv, useSubEnv, markRaw } from '@odoo/owl';
@@ -2938,6 +2938,9 @@ function formatValue(value, { format, locale }) {
     }
     switch (typeof value) {
         case "string":
+            if (value.includes('\\"')) {
+                return value.replace(/\\"/g, '"');
+            }
             return value;
         case "boolean":
             return value ? "TRUE" : "FALSE";
@@ -4991,14 +4994,8 @@ function createDataSets(getters, dataSetsString, sheetId, dataSetsHaveTitle) {
                     : undefined));
             }
         }
-        else if (zone.left === zone.right && zone.top === zone.bottom) {
-            // A single cell. If it's only the title, the dataset is not added.
-            if (!dataSetsHaveTitle) {
-                dataSets.push(createDataSet(getters, dataSetSheetId, zone, undefined));
-            }
-        }
         else {
-            /* 1 row or 1 column */
+            /* 1 cell, 1 row or 1 column */
             dataSets.push(createDataSet(getters, dataSetSheetId, zone, dataSetsHaveTitle
                 ? {
                     top: zone.top,
@@ -7441,7 +7438,7 @@ function tokenize(str, locale = DEFAULT_LOCALE) {
     while (!chars.isOver()) {
         let token = tokenizeSpace(chars) ||
             tokenizeArgsSeparator(chars, locale) ||
-            tokenizeMisc(chars) ||
+            tokenizeParenthesis(chars) ||
             tokenizeOperator(chars) ||
             tokenizeString(chars) ||
             tokenizeDebugger(chars) ||
@@ -7462,15 +7459,14 @@ function tokenizeDebugger(chars) {
     }
     return null;
 }
-const misc$1 = {
-    "(": "LEFT_PAREN",
-    ")": "RIGHT_PAREN",
+const parenthesis = {
+    "(": { type: "LEFT_PAREN", value: "(" },
+    ")": { type: "RIGHT_PAREN", value: ")" },
 };
-function tokenizeMisc(chars) {
-    if (chars.current in misc$1) {
+function tokenizeParenthesis(chars) {
+    if (chars.current === "(" || chars.current === ")") {
         const value = chars.shift();
-        const type = misc$1[value];
-        return { type, value };
+        return parenthesis[value];
     }
     return null;
 }
@@ -7491,7 +7487,12 @@ function tokenizeOperator(chars) {
     }
     return null;
 }
+const FIRST_POSSIBLE_NUMBER_CHARS = new Set("0123456789");
 function tokenizeNumber(chars, locale) {
+    if (!FIRST_POSSIBLE_NUMBER_CHARS.has(chars.current) &&
+        chars.current !== locale.decimalSeparator) {
+        return null;
+    }
     const match = chars.remaining().match(getFormulaNumberRegex(locale.decimalSeparator));
     if (match) {
         chars.advanceBy(match[0].length);
@@ -7516,7 +7517,7 @@ function tokenizeString(chars) {
     }
     return null;
 }
-const separatorRegexp = /\w|\.|!|\$/;
+const separatorRegexp = /^[\w\.!\$]+/;
 /**
  * A "Symbol" is just basically any word-like element that can appear in a
  * formula, which is not a string. So:
@@ -7556,8 +7557,11 @@ function tokenizeSymbol(chars) {
             };
         }
     }
-    while (chars.current && separatorRegexp.test(chars.current)) {
-        result += chars.shift();
+    const match = chars.remaining().match(separatorRegexp);
+    if (match) {
+        const value = match[0];
+        result += value;
+        chars.advanceBy(value.length);
     }
     if (result.length) {
         const value = result;
@@ -7619,7 +7623,10 @@ class TokenizingChars {
         return this.text.substring(this.currentIndex);
     }
     currentStartsWith(str) {
-        for (let j = 0; j < str.length; j++) {
+        if (this.current !== str[0]) {
+            return false;
+        }
+        for (let j = 1; j < str.length; j++) {
             if (this.text[this.currentIndex + j] !== str[j]) {
                 return false;
             }
@@ -8651,7 +8658,7 @@ class BarChart extends AbstractChart {
             return undefined;
         const dataSets = this.dataSets
             .map((ds) => toExcelDataset(this.getters, ds))
-            .filter((ds) => ds.range !== ""); // && range !== CellErrorType.InvalidReference ? show incorrect #ref ?
+            .filter((ds) => ds.range !== "" && ds.range !== CellErrorType.InvalidReference);
         const labelRange = toExcelLabelRange(this.getters, this.labelRange, shouldRemoveFirstLabel(this.labelRange, this.dataSets[0], this.dataSetsHaveTitle));
         return {
             ...this.getDefinition(),
@@ -9229,7 +9236,7 @@ class LineChart extends AbstractChart {
             return undefined;
         const dataSets = this.dataSets
             .map((ds) => toExcelDataset(this.getters, ds))
-            .filter((ds) => ds.range !== ""); // && range !== CellErrorType.InvalidReference ? show incorrect #ref ?
+            .filter((ds) => ds.range !== "" && ds.range !== CellErrorType.InvalidReference);
         const labelRange = toExcelLabelRange(this.getters, this.labelRange, shouldRemoveFirstLabel(this.labelRange, this.dataSets[0], this.dataSetsHaveTitle));
         return {
             ...this.getDefinition(),
@@ -9535,7 +9542,7 @@ class PieChart extends AbstractChart {
             return undefined;
         const dataSets = this.dataSets
             .map((ds) => toExcelDataset(this.getters, ds))
-            .filter((ds) => ds.range !== ""); // && range !== CellErrorType.InvalidReference ? show incorrect #ref ?
+            .filter((ds) => ds.range !== "" && ds.range !== CellErrorType.InvalidReference);
         const labelRange = toExcelLabelRange(this.getters, this.labelRange, shouldRemoveFirstLabel(this.labelRange, this.dataSets[0], this.dataSetsHaveTitle));
         return {
             ...this.getDefinition(),
@@ -18682,6 +18689,9 @@ const HLOOKUP = {
     compute: function (searchKey, range, index, isSorted = { value: DEFAULT_IS_SORTED }) {
         const _index = Math.trunc(toNumber(index?.value, this.locale));
         assert(() => 1 <= _index && _index <= range[0].length, _t("[[FUNCTION_NAME]] evaluates to an out of bounds range."));
+        if (searchKey && isEvaluationError(searchKey.value)) {
+            return searchKey;
+        }
         const getValueFromRange = (range, index) => range[index][0].value;
         const _isSorted = toBoolean(isSorted.value);
         const colIndex = _isSorted
@@ -18849,6 +18859,9 @@ const VLOOKUP = {
     compute: function (searchKey, range, index, isSorted = { value: DEFAULT_IS_SORTED }) {
         const _index = Math.trunc(toNumber(index?.value, this.locale));
         assert(() => 1 <= _index && _index <= range.length, _t("[[FUNCTION_NAME]] evaluates to an out of bounds range."));
+        if (searchKey && isEvaluationError(searchKey.value)) {
+            return searchKey;
+        }
         const getValueFromRange = (range, index) => range[0][index].value;
         const _isSorted = toBoolean(isSorted.value);
         const rowIndex = _isSorted
@@ -18888,6 +18901,9 @@ const XLOOKUP = {
         assert(() => lookupDirection === "col"
             ? returnRange[0].length === lookupRange[0].length
             : returnRange.length === lookupRange.length, _t("return_range should have the same dimensions as lookup_range."));
+        if (searchKey && isEvaluationError(searchKey.value)) {
+            return [[searchKey]];
+        }
         const getElement = lookupDirection === "col"
             ? (range, index) => range[0][index].value
             : (range, index) => range[index][0].value;
@@ -26969,15 +26985,17 @@ class Composer extends Component {
         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 },
+        onComposerCellFocused: { type: Function, optional: true },
+        onComposerContentFocused: Function,
+        isDefaultFocus: { type: Boolean, optional: true },
     };
     static components = { TextValueProvider, FunctionDescriptionProvider };
     static defaultProps = {
         inputStyle: "",
+        isDefaultFocus: false,
     };
     composerRef = useRef("o_composer");
     contentHelper = new ContentEditableHelper(this.composerRef.el);
@@ -27034,7 +27052,6 @@ class Composer extends Component {
         F4: this.processF4Key,
         Tab: (ev) => this.processTabKey(ev, "right"),
         "Shift+Tab": (ev) => this.processTabKey(ev, "left"),
-        "Ctrl+ ": this.processSpaceKey,
     };
     keyCodeMapping = {
         NumpadDecimal: this.processNumpadDecimal,
@@ -27042,12 +27059,12 @@ 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.processTokenAtCursor();
         });
-        onWillUnmount(() => {
-            this.props.onComposerUnmounted?.();
-        });
         useEffect(() => {
             this.processContent();
         });
@@ -27056,7 +27073,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();
@@ -27099,23 +27117,19 @@ class Composer extends Component {
     processTabKey(ev, direction) {
         ev.preventDefault();
         ev.stopPropagation();
-        const state = this.autoCompleteState;
-        if (state.showProvider && state.selectedIndex !== undefined) {
-            const autoCompleteValue = this.autoCompleteState.values[state.selectedIndex]?.text;
-            if (autoCompleteValue) {
-                this.autoComplete(autoCompleteValue);
-                return;
+        if (this.env.model.getters.getEditionMode() !== "inactive") {
+            const state = this.autoCompleteState;
+            if (state.showProvider && state.selectedIndex !== undefined) {
+                const autoCompleteValue = this.autoCompleteState.values[state.selectedIndex]?.text;
+                if (autoCompleteValue) {
+                    this.autoComplete(autoCompleteValue);
+                    return;
+                }
             }
+            interactiveStopEdition(this.env);
         }
-        interactiveStopEdition(this.env);
         this.env.model.selection.moveAnchorCell(direction, 1);
     }
-    processSpaceKey(ev) {
-        ev.preventDefault();
-        ev.stopPropagation();
-        this.showFunctionAutocomplete("");
-        this.env.model.dispatch("STOP_COMPOSER_RANGE_SELECTION");
-    }
     processEnterKey(ev, direction) {
         ev.preventDefault();
         ev.stopPropagation();
@@ -27177,6 +27191,9 @@ class Composer extends Component {
         this.compositionActive = false;
     }
     onKeydown(ev) {
+        if (this.env.model.getters.getEditionMode() === "inactive") {
+            return;
+        }
         if (ev.key.startsWith("Arrow")) {
             this.processArrowKeys(ev);
             return;
@@ -27190,14 +27207,33 @@ class Composer extends Component {
             ev.stopPropagation();
         }
     }
+    onPaste(ev) {
+        if (this.env.model.getters.getEditionMode() !== "inactive") {
+            ev.stopPropagation();
+        }
+    }
     /*
      * Triggered automatically by the content-editable between the keydown and key up
      * */
     onInput(ev) {
-        if (this.props.focus === "inactive" || !this.shouldProcessInputEvents) {
+        if (!this.shouldProcessInputEvents) {
+            return;
+        }
+        if (ev.inputType === "insertFromPaste" &&
+            this.env.model.getters.getEditionMode() === "inactive") {
             return;
         }
-        let content = this.contentHelper.getText();
+        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);
+        }
         let selection = this.contentHelper.getCurrentSelection();
         this.env.model.dispatch("STOP_COMPOSER_RANGE_SELECTION");
         this.env.model.dispatch("SET_CURRENT_CONTENT", {
@@ -27273,9 +27309,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();
     }
@@ -27442,7 +27477,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;
@@ -27569,56 +27604,30 @@ class GridComposer extends Component {
         focus: {
             validate: (value) => ["inactive", "cellFocus", "contentFocus"].includes(value),
         },
-        onComposerUnmounted: Function,
+        onComposerCellFocused: Function,
         onComposerContentFocused: Function,
         gridDims: Object,
     };
     static components = { Composer };
-    gridComposerRef;
-    zone;
-    rect;
+    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: this.props.gridDims.width,
-                height: this.props.gridDims.height,
-            };
-        });
         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 getFullReference(prefixSheet ? this.env.model.getters.getSheetName(sheetId) : undefined, toXC(col, row));
@@ -27630,7 +27639,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();
@@ -27650,6 +27679,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
@@ -27661,6 +27692,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`,
@@ -27670,13 +27703,31 @@ 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;
+        }
     }
 }
 
@@ -28776,7 +28827,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 });
     }
@@ -29841,7 +29891,6 @@ class Grid extends Component {
     HEADER_WIDTH = HEADER_WIDTH;
     menuState;
     gridRef;
-    hiddenInput;
     onMouseWheel;
     canvasPosition;
     hoveredCell;
@@ -29852,15 +29901,14 @@ 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());
         this.onMouseWheel = useWheelHandler((deltaX, deltaY) => {
             this.moveCanvas(deltaX, deltaY);
@@ -29884,7 +29932,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
@@ -30063,10 +30111,10 @@ class Grid extends Component {
         "Alt+Shift+ArrowUp": () => this.processHeaderGroupingKey("up"),
         "Alt+Shift+ArrowDown": () => this.processHeaderGroupingKey("down"),
     };
-    focus() {
+    focusDefaultElement() {
         if (!this.env.model.getters.getSelectedFigureId() &&
             this.env.model.getters.getEditionMode() === "inactive") {
-            this.hiddenInput.el?.focus();
+            this.env.focusableElement.focus();
         }
     }
     get gridEl() {
@@ -30202,19 +30250,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
     // ---------------------------------------------------------------------------
@@ -30329,7 +30364,7 @@ class Grid extends Component {
     }
     closeMenu() {
         this.menuState.isOpen = false;
-        this.focus();
+        this.focusDefaultElement();
     }
     processHeaderGroupingKey(direction) {
         if (this.env.model.getters.getSelectedZones().length !== 1) {
@@ -34246,6 +34281,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,
@@ -36032,9 +36092,6 @@ class CellPlugin extends CorePlugin {
                     format: cell.format ? getItemId(cell.format, formats) : undefined,
                     content: cell.content || undefined,
                 };
-                if (cell instanceof FormulaCellWithDependencies) {
-                    cells[xc].content = cell.contentWithFixedReferences || undefined;
-                }
             }
             _sheet.cells = cells;
         }
@@ -36286,8 +36343,11 @@ class CellPlugin extends CorePlugin {
      * being a computed property to rebuild the dependencies XC.
      */
     createFormulaCellWithDependencies(id, compiledFormula, format, style, sheetId) {
-        const dependencies = compiledFormula.dependencies.map((xc) => this.getters.getRangeFromSheetXC(sheetId, xc));
-        return new FormulaCellWithDependencies(id, compiledFormula, format, style, dependencies, sheetId, this.getters.getRangeString.bind(this));
+        const dependencies = [];
+        for (const xc of compiledFormula.dependencies) {
+            dependencies.push(this.getters.getRangeFromSheetXC(sheetId, xc));
+        }
+        return new FormulaCellWithDependencies(id, compiledFormula, format, style, dependencies, sheetId, this.getters.getRangeString);
     }
     createErrorFormula(id, content, format, style, error) {
         return {
@@ -36341,7 +36401,7 @@ class FormulaCellWithDependencies {
         const tokens = compiledFormula.tokens.map((token) => {
             if (token.type === "REFERENCE") {
                 const index = rangeIndex++;
-                return new RangeReferenceToken(() => this.getRangeString(dependencies[index], this.sheetId));
+                return new RangeReferenceToken(dependencies, index, this.sheetId, this.getRangeString);
             }
             return token;
         });
@@ -36368,13 +36428,20 @@ class FormulaCellWithDependencies {
     }
 }
 class RangeReferenceToken {
-    getValue;
+    ranges;
+    rangeIndex;
+    sheetId;
+    getRangeString;
     type = "REFERENCE";
-    constructor(getValue) {
-        this.getValue = getValue;
+    constructor(ranges, rangeIndex, sheetId, getRangeString) {
+        this.ranges = ranges;
+        this.rangeIndex = rangeIndex;
+        this.sheetId = sheetId;
+        this.getRangeString = getRangeString;
     }
     get value() {
-        return this.getValue();
+        const range = this.ranges[this.rangeIndex];
+        return this.getRangeString(range, this.sheetId);
     }
 }
 
@@ -41909,7 +41976,13 @@ class EvaluationPlugin extends UIPlugin {
             const format = newFormat
                 ? getItemId(newFormat, data.formats)
                 : exportedCellData.format;
-            const content = !isExported ? newContent : exportedCellData.content;
+            let content;
+            if (formulaCell instanceof FormulaCellWithDependencies) {
+                content = formulaCell.contentWithFixedReferences;
+            }
+            else {
+                content = !isExported ? newContent : exportedCellData.content;
+            }
             exportedSheetData.cells[xc] = { ...exportedCellData, value, isFormula, content, format };
         }
     }
@@ -51093,6 +51166,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 },
@@ -53247,6 +53330,7 @@ class Spreadsheet extends Component {
             toggleSidePanel: this.toggleSidePanel.bind(this),
             clipboard: this.env.clipboard || instantiateClipboard(),
             startCellEdition: (content) => this.onGridComposerCellFocused(content),
+            focusableElement: new FocusableElement(),
         });
         useEffect(() => {
             /**
@@ -53365,16 +53449,17 @@ class Spreadsheet extends Component {
         }
         this.composer.topBarFocus = "contentFocus";
         this.composer.gridFocusMode = "inactive";
-        this.setComposerContent({ selection } || {});
+        this.setComposerContent({ selection });
     }
-    onGridComposerContentFocused() {
+    onGridComposerContentFocused(selection) {
         if (this.model.getters.isReadonly()) {
             return;
         }
         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;
@@ -57062,6 +57147,6 @@ const constants = {
 export { AbstractChart, CellErrorType, CommandResult, CorePlugin, DispatchResult, EvaluationError, Model, Registry, Revision, SPREADSHEET_DIMENSIONS, Spreadsheet, UIPlugin, __info__, addFunction, astToFormula, compile, compileTokens, components, constants, convertAstNodes, coreTypes, findCellInNewZone, functionCache, helpers, hooks, invalidateCFEvaluationCommands, invalidateDependenciesCommands, invalidateEvaluationCommands, iterateAstNodes, links, load, parse, parseTokens, readonlyAllowedCommands, registries, setDefaultSheetViewSize, setTranslationMethod, tokenize };
 
 
-__info__.version = "17.1.3";
-__info__.date = "2024-02-02T13:46:54.332Z";
-__info__.hash = "798f979";
+__info__.version = "17.1.4";
+__info__.date = "2024-02-09T13:09:13.430Z";
+__info__.hash = "16d3ece";