@odoo/o-spreadsheet 18.1.0-alpha.0 → 18.1.0-alpha.1

package/dist/o-spreadsheet.esm.js

@@ -2,13 +2,119 @@
 /**
  * This file is generated by o-spreadsheet build tools. Do not edit it.
  * @see https://github.com/odoo/o-spreadsheet
- * @version 18.1.0-alpha.0
- * @date 2024-09-25T13:17:49.636Z
- * @hash 288f0b7
+ * @version 18.1.0-alpha.1
+ * @date 2024-10-14T07:53:17.717Z
+ * @hash e9ce3aa
  */
 
 import { useEnv, useSubEnv, onWillUnmount, useComponent, status, Component, useRef, onMounted, useEffect, useState, onPatched, onWillPatch, onWillUpdateProps, useExternalListener, onWillStart, xml, useChildSubEnv, markRaw, toRaw } from '@odoo/owl';
 
+function createActions(menuItems) {
+    return menuItems.map(createAction).sort((a, b) => a.sequence - b.sequence);
+}
+let nextItemId = 1;
+function createAction(item) {
+    const name = item.name;
+    const children = item.children;
+    const description = item.description;
+    const icon = item.icon;
+    const secondaryIcon = item.secondaryIcon;
+    const itemId = item.id || nextItemId++;
+    return {
+        id: itemId.toString(),
+        name: typeof name === "function" ? name : () => name,
+        isVisible: item.isVisible ? item.isVisible : () => true,
+        isEnabled: item.isEnabled ? item.isEnabled : () => true,
+        isActive: item.isActive,
+        execute: item.execute,
+        children: children
+            ? (env) => {
+                return children
+                    .map((child) => (typeof child === "function" ? child(env) : child))
+                    .flat()
+                    .map(createAction);
+            }
+            : () => [],
+        isReadonlyAllowed: item.isReadonlyAllowed || false,
+        separator: item.separator || false,
+        icon: typeof icon === "function" ? icon : () => icon || "",
+        iconColor: item.iconColor,
+        secondaryIcon: typeof secondaryIcon === "function" ? secondaryIcon : () => secondaryIcon || "",
+        description: typeof description === "function" ? description : () => description || "",
+        textColor: item.textColor,
+        sequence: item.sequence || 0,
+        onStartHover: item.onStartHover,
+        onStopHover: item.onStopHover,
+    };
+}
+
+/**
+ * Registry
+ *
+ * The Registry class is basically just a mapping from a string key to an object.
+ * It is really not much more than an object. It is however useful for the
+ * following reasons:
+ *
+ * 1. it let us react and execute code when someone add something to the registry
+ *   (for example, the FunctionRegistry subclass this for this purpose)
+ * 2. it throws an error when the get operation fails
+ * 3. it provides a chained API to add items to the registry.
+ */
+class Registry {
+    content = {};
+    /**
+     * Add an item to the registry
+     *
+     * Note that this also returns the registry, so another add method call can
+     * be chained
+     */
+    add(key, value) {
+        this.content[key] = value;
+        return this;
+    }
+    /**
+     * Get an item from the registry
+     */
+    get(key) {
+        /**
+         * Note: key in {} is ~12 times slower than {}[key].
+         * So, we check the absence of key only when the direct access returns
+         * a falsy value. It's done to ensure that the registry can contains falsy values
+         */
+        const content = this.content[key];
+        if (!content) {
+            if (!(key in this.content)) {
+                throw new Error(`Cannot find ${key} in this registry!`);
+            }
+        }
+        return content;
+    }
+    /**
+     * Check if the key is already in the registry
+     */
+    contains(key) {
+        return key in this.content;
+    }
+    /**
+     * Get a list of all elements in the registry
+     */
+    getAll() {
+        return Object.values(this.content);
+    }
+    /**
+     * Get a list of all keys in the registry
+     */
+    getKeys() {
+        return Object.keys(this.content);
+    }
+    /**
+     * Remove an item from the registry
+     */
+    remove(key) {
+        delete this.content[key];
+    }
+}
+
 const CANVAS_SHIFT = 0.5;
 // Colors
 const HIGHLIGHT_COLOR = "#37A850";
@@ -5968,18 +6074,9 @@ function drawDecoratedText(context, text, position, underline = false, strikethr
  * https://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript
  * */
 class UuidGenerator {
-    isFastIdStrategy = false;
-    fastIdStart = 0;
-    setIsFastStrategy(isFast) {
-        this.isFastIdStrategy = isFast;
-    }
     uuidv4() {
-        if (this.isFastIdStrategy) {
-            this.fastIdStart++;
-            return String(this.fastIdStart);
-            //@ts-ignore
-        }
-        else if (window.crypto && window.crypto.getRandomValues) {
+        //@ts-ignore
+        if (window.crypto && window.crypto.getRandomValues) {
             //@ts-ignore
             return ([1e7] + -1e3 + -4e3 + -8e3 + -1e11).replace(/[018]/g, (c) => (c ^ (crypto.getRandomValues(new Uint8Array(1))[0] & (15 >> (c / 4)))).toString(16));
         }
@@ -5993,111 +6090,6 @@ class UuidGenerator {
     }
 }
 
-function createActions(menuItems) {
-    return menuItems.map(createAction).sort((a, b) => a.sequence - b.sequence);
-}
-const uuidGenerator$1 = new UuidGenerator();
-function createAction(item) {
-    const name = item.name;
-    const children = item.children;
-    const description = item.description;
-    const icon = item.icon;
-    const secondaryIcon = item.secondaryIcon;
-    return {
-        id: item.id || uuidGenerator$1.uuidv4(),
-        name: typeof name === "function" ? name : () => name,
-        isVisible: item.isVisible ? item.isVisible : () => true,
-        isEnabled: item.isEnabled ? item.isEnabled : () => true,
-        isActive: item.isActive,
-        execute: item.execute,
-        children: children
-            ? (env) => {
-                return children
-                    .map((child) => (typeof child === "function" ? child(env) : child))
-                    .flat()
-                    .map(createAction);
-            }
-            : () => [],
-        isReadonlyAllowed: item.isReadonlyAllowed || false,
-        separator: item.separator || false,
-        icon: typeof icon === "function" ? icon : () => icon || "",
-        iconColor: item.iconColor,
-        secondaryIcon: typeof secondaryIcon === "function" ? secondaryIcon : () => secondaryIcon || "",
-        description: typeof description === "function" ? description : () => description || "",
-        textColor: item.textColor,
-        sequence: item.sequence || 0,
-        onStartHover: item.onStartHover,
-        onStopHover: item.onStopHover,
-    };
-}
-
-/**
- * Registry
- *
- * The Registry class is basically just a mapping from a string key to an object.
- * It is really not much more than an object. It is however useful for the
- * following reasons:
- *
- * 1. it let us react and execute code when someone add something to the registry
- *   (for example, the FunctionRegistry subclass this for this purpose)
- * 2. it throws an error when the get operation fails
- * 3. it provides a chained API to add items to the registry.
- */
-class Registry {
-    content = {};
-    /**
-     * Add an item to the registry
-     *
-     * Note that this also returns the registry, so another add method call can
-     * be chained
-     */
-    add(key, value) {
-        this.content[key] = value;
-        return this;
-    }
-    /**
-     * Get an item from the registry
-     */
-    get(key) {
-        /**
-         * Note: key in {} is ~12 times slower than {}[key].
-         * So, we check the absence of key only when the direct access returns
-         * a falsy value. It's done to ensure that the registry can contains falsy values
-         */
-        const content = this.content[key];
-        if (!content) {
-            if (!(key in this.content)) {
-                throw new Error(`Cannot find ${key} in this registry!`);
-            }
-        }
-        return content;
-    }
-    /**
-     * Check if the key is already in the registry
-     */
-    contains(key) {
-        return key in this.content;
-    }
-    /**
-     * Get a list of all elements in the registry
-     */
-    getAll() {
-        return Object.values(this.content);
-    }
-    /**
-     * Get a list of all keys in the registry
-     */
-    getKeys() {
-        return Object.keys(this.content);
-    }
-    /**
-     * Remove an item from the registry
-     */
-    remove(key) {
-        delete this.content[key];
-    }
-}
-
 function getClipboardDataPositions(sheetId, zones) {
     const lefts = new Set(zones.map((z) => z.left));
     const rights = new Set(zones.map((z) => z.right));
@@ -8452,31 +8444,34 @@ class TableClipboardHandler extends AbstractCellClipboardHandler {
             for (let col of columnsIndexes) {
                 const position = { col, row, sheetId };
                 const table = this.getters.getTable(position);
-                if (!table || copiedTablesIds.has(table.id)) {
+                if (!table) {
                     tableCellsInRow.push({});
                     continue;
                 }
                 const coreTable = this.getters.getCoreTable(position);
                 const tableZone = coreTable?.range.zone;
+                let copiedTable = undefined;
                 // Copy whole table
-                if (coreTable && tableZone && zones.some((z) => isZoneInside(tableZone, z))) {
-                    copiedTablesIds.add(coreTable.id);
+                if (!copiedTablesIds.has(table.id) &&
+                    coreTable &&
+                    tableZone &&
+                    zones.some((z) => isZoneInside(tableZone, z))) {
+                    copiedTablesIds.add(table.id);
                     const values = [];
                     for (const col of range(tableZone.left, tableZone.right + 1)) {
                         values.push(this.getters.getFilterHiddenValues({ sheetId, col, row: tableZone.top }));
                     }
-                    tableCellsInRow.push({
-                        table: {
-                            range: coreTable.range.rangeData,
-                            config: coreTable.config,
-                            type: coreTable.type,
-                        },
-                    });
-                }
-                // Copy only style of cell
-                else if (table) {
-                    tableCellsInRow.push({ style: this.getTableStyleToCopy(position) });
+                    copiedTable = {
+                        range: coreTable.range.rangeData,
+                        config: coreTable.config,
+                        type: coreTable.type,
+                    };
                 }
+                tableCellsInRow.push({
+                    table: copiedTable,
+                    style: this.getTableStyleToCopy(position),
+                    isWholeTableCopied: copiedTablesIds.has(table.id),
+                });
             }
         }
         return {
@@ -8557,11 +8552,14 @@ class TableClipboardHandler extends AbstractCellClipboardHandler {
                 tableType: tableCell.table.type,
             });
         }
-        // Do not paste table style if we're inside another table
         // We cannot check for dynamic tables, because at this point the paste can have changed the evaluation, and the
         // dynamic tables are not yet computed
-        if (!this.getters.getCoreTable(position)) {
-            if (tableCell.style?.style && options?.pasteOption !== "asValue") {
+        if (this.getters.getCoreTable(position) || options?.pasteOption === "asValue") {
+            return;
+        }
+        if ((!options?.pasteOption && !tableCell.isWholeTableCopied) ||
+            options?.pasteOption === "onlyFormat") {
+            if (tableCell.style?.style) {
                 this.dispatch("UPDATE_CELL", { ...position, style: tableCell.style.style });
             }
             if (tableCell.style?.border) {
@@ -9281,6 +9279,49 @@ function getDefinedAxis(definition) {
     useLeftAxis ||= !useRightAxis;
     return { useLeftAxis, useRightAxis };
 }
+function getChartAxis(definition, position, type, options) {
+    const { useLeftAxis, useRightAxis } = getDefinedAxis(definition);
+    if ((position === "left" && !useLeftAxis) || (position === "right" && !useRightAxis)) {
+        return undefined;
+    }
+    const fontColor = chartFontColor(definition.background);
+    let design;
+    if (position === "bottom") {
+        design = definition.axesDesign?.x;
+    }
+    else if (position === "left") {
+        design = definition.axesDesign?.y;
+    }
+    else {
+        design = definition.axesDesign?.y1;
+    }
+    if (type === "values") {
+        const displayGridLines = position === "left" || (position === "right" && !useLeftAxis);
+        return {
+            position: position,
+            title: getChartAxisTitleRuntime(design),
+            grid: {
+                display: displayGridLines,
+            },
+            beginAtZero: true,
+            stacked: options?.stacked,
+            ticks: {
+                color: fontColor,
+                callback: formatTickValue(options),
+            },
+        };
+    }
+    else {
+        return {
+            ticks: {
+                padding: 5,
+                color: fontColor,
+            },
+            stacked: options?.stacked,
+            title: getChartAxisTitleRuntime(design),
+        };
+    }
+}
 function computeChartPadding({ displayTitle, displayLegend, }) {
     let top = 25;
     if (displayTitle) {
@@ -9367,6 +9408,12 @@ function interpolateData(config, values, labels, newLabels) {
             return [];
     }
 }
+function formatChartDatasetValue(axisFormats, locale) {
+    return (value, axisId) => {
+        const format = axisId ? axisFormats?.[axisId] : undefined;
+        return formatTickValue({ format, locale })(value);
+    };
+}
 function formatTickValue(localeFormat) {
     return (value) => {
         value = Number(value);
@@ -9429,10 +9476,12 @@ const chartShowValuesPlugin = {
                 case "bar":
                 case "line": {
                     const yOffset = dataset.type === "bar" && !options.horizontal ? 0 : 3;
+                    const horizontalChart = dataset.type === "bar" && options.horizontal;
+                    const axisId = horizontalChart ? dataset.xAxisID : dataset.yAxisID;
                     for (let i = 0; i < dataset._parsed.length; i++) {
                         const point = dataset.data[i];
                         const value = options.horizontal ? dataset._parsed[i].x : dataset._parsed[i].y;
-                        const displayedValue = options.callback(value - 0);
+                        const displayedValue = options.callback(value - 0, axisId);
                         let xPosition = 0, yPosition = 0;
                         if (options.horizontal) {
                             yPosition = point.y;
@@ -17841,7 +17890,7 @@ function assertDomainLength(domain) {
         throw new EvaluationError(_t("Function PIVOT takes an even number of arguments."));
     }
 }
-function addPivotDependencies(evalContext, coreDefinition) {
+function addPivotDependencies(evalContext, coreDefinition, forMeasures) {
     //TODO This function can be very costly when used with PIVOT.VALUE and PIVOT.HEADER
     const dependencies = [];
     if (coreDefinition.type === "SPREADSHEET" && coreDefinition.dataSet) {
@@ -17853,7 +17902,7 @@ function addPivotDependencies(evalContext, coreDefinition) {
         }
         dependencies.push(range);
     }
-    for (const measure of coreDefinition.measures) {
+    for (const measure of forMeasures) {
         if (measure.computedBy) {
             const formula = evalContext.getters.getMeasureCompiledFormula(measure);
             dependencies.push(...formula.dependencies.filter((range) => !range.invalidXc));
@@ -18286,7 +18335,7 @@ const PIVOT_VALUE = {
         assertDomainLength(domainArgs);
         const pivot = this.getters.getPivot(pivotId);
         const coreDefinition = this.getters.getPivotCoreDefinition(pivotId);
-        addPivotDependencies(this, coreDefinition);
+        addPivotDependencies(this, coreDefinition, coreDefinition.measures.filter((m) => m.id === _measure));
         pivot.init({ reload: pivot.needsReevaluation });
         const error = pivot.assertIsValid({ throwOnError: false });
         if (error) {
@@ -18316,7 +18365,7 @@ const PIVOT_HEADER = {
         assertDomainLength(domainArgs);
         const pivot = this.getters.getPivot(_pivotId);
         const coreDefinition = this.getters.getPivotCoreDefinition(_pivotId);
-        addPivotDependencies(this, coreDefinition);
+        addPivotDependencies(this, coreDefinition, []);
         pivot.init({ reload: pivot.needsReevaluation });
         const error = pivot.assertIsValid({ throwOnError: false });
         if (error) {
@@ -18367,7 +18416,7 @@ const PIVOT = {
         const pivotId = getPivotId(_pivotFormulaId, this.getters);
         const pivot = this.getters.getPivot(pivotId);
         const coreDefinition = this.getters.getPivotCoreDefinition(pivotId);
-        addPivotDependencies(this, coreDefinition);
+        addPivotDependencies(this, coreDefinition, coreDefinition.measures);
         pivot.init({ reload: pivot.needsReevaluation });
         const error = pivot.assertIsValid({ throwOnError: false });
         if (error) {
@@ -20163,7 +20212,7 @@ class ContentEditableHelper {
             let startNode = this.findChildAtCharacterIndex(start);
             let endNode = this.findChildAtCharacterIndex(end);
             range.setStart(startNode.node, startNode.offset);
-            selection.extend(endNode.node, endNode.offset);
+            range.setEnd(endNode.node, endNode.offset);
         }
     }
     /**
@@ -20661,7 +20710,7 @@ class Composer extends Component {
         "Alt+Enter": this.processNewLineEvent,
         "Ctrl+Enter": this.processNewLineEvent,
         Escape: this.processEscapeKey,
-        F2: () => console.warn("Not implemented"),
+        F2: (ev) => this.toggleEditionMode(ev),
         F4: (ev) => this.processF4Key(ev),
         Tab: (ev) => this.processTabKey(ev, "right"),
         "Shift+Tab": (ev) => this.processTabKey(ev, "left"),
@@ -20780,6 +20829,11 @@ class Composer extends Component {
         this.props.composerStore.cycleReferences();
         this.processContent();
     }
+    toggleEditionMode(ev) {
+        ev.stopPropagation();
+        this.props.composerStore.toggleEditionMode();
+        this.processContent();
+    }
     processNumpadDecimal(ev) {
         ev.stopPropagation();
         ev.preventDefault();
@@ -21005,7 +21059,13 @@ class Composer extends Component {
                     break;
                 case "REFERENCE":
                     const { xc, sheetName } = splitReference(token.value);
-                    result.push({ value: token.value, color: this.rangeColor(xc, sheetName) || "#000" });
+                    result.push({
+                        value: token.value,
+                        color: this.rangeColor(xc, sheetName) || "#000",
+                        class: tokenAtCursor === token && this.props.composerStore.editionMode === "selecting"
+                            ? "text-decoration-underline"
+                            : undefined,
+                    });
                     break;
                 case "SYMBOL":
                     const value = token.value;
@@ -21576,6 +21636,7 @@ function insertTokenAfterArgSeparator(tokenAtCursor, value) {
         // replace the whole token
         start = tokenAtCursor.start;
     }
+    this.composer.stopComposerRangeSelection();
     this.composer.changeComposerCursorSelection(start, end);
     this.composer.replaceComposerCursorSelection(value);
 }
@@ -21593,6 +21654,7 @@ function insertTokenAfterLeftParenthesis(tokenAtCursor, value) {
         // replace the whole token
         start = tokenAtCursor.start;
     }
+    this.composer.stopComposerRangeSelection();
     this.composer.changeComposerCursorSelection(start, end);
     this.composer.replaceComposerCursorSelection(value);
 }
@@ -22185,6 +22247,27 @@ autofillModifiersRegistry
             tooltip: content ? { props: { content: tooltipValue } } : undefined,
         };
     },
+})
+    .add("DATE_INCREMENT_MODIFIER", {
+    apply: (rule, data, getters) => {
+        const date = toJsDate(rule.current, getters.getLocale());
+        date.setFullYear(date.getFullYear() + rule.increment.years || 0);
+        date.setMonth(date.getMonth() + rule.increment.months || 0);
+        date.setDate(date.getDate() + rule.increment.days || 0);
+        const value = jsDateToNumber(date);
+        rule.current = value;
+        const locale = getters.getLocale();
+        const tooltipValue = formatValue(value, { format: data.cell?.format, locale });
+        return {
+            cellData: {
+                border: data.border,
+                style: data.cell && data.cell.style,
+                format: data.cell && data.cell.format,
+                content: value.toString(),
+            },
+            tooltip: value ? { props: { content: tooltipValue } } : undefined,
+        };
+    },
 })
     .add("COPY_MODIFIER", {
     apply: (rule, data, getters) => {
@@ -22265,7 +22348,9 @@ function getGroup(cell, cells, filter) {
         if (x === cell) {
             found = true;
         }
-        const cellValue = x === undefined || x.isFormula ? undefined : evaluateLiteral(x, { locale: DEFAULT_LOCALE });
+        const cellValue = x === undefined || x.isFormula
+            ? undefined
+            : evaluateLiteral(x, { locale: DEFAULT_LOCALE, format: x.format });
         if (cellValue && filter(cellValue)) {
             group.push(cellValue);
         }
@@ -22301,6 +22386,72 @@ function calculateIncrementBasedOnGroup(group) {
     }
     return increment;
 }
+/**
+ * Iterates on a list of date intervals.
+ * if every interval is the same, return the interval
+ * Otherwise return undefined
+ *
+ */
+function getEqualInterval(intervals) {
+    if (intervals.length < 2) {
+        return intervals[0] || { years: 0, months: 0, days: 0 };
+    }
+    const equal = intervals.every((interval) => interval.years === intervals[0].years &&
+        interval.months === intervals[0].months &&
+        interval.days === intervals[0].days);
+    return equal ? intervals[0] : undefined;
+}
+/**
+ * Based on a group of dates, calculate the increment that should be applied
+ * to the next date.
+ *
+ * This will compute the date difference in calendar terms (years, months, days)
+ * In order to make abstraction of leap years and months with different number of days.
+ *
+ * In case the dates are not equidistant in calendar terms, no rule can be extrapolated
+ * In case of equidistant dates, we either have in that order:
+ *  - exact date interval (e.g. +n year OR +n month OR +n day) in which case we increment by the same interval
+ *  - exact day interval (e.g. +n days) in which case we increment by the same day interval
+ *  - equidistant dates but not the same interval, in which case we return increment of the same interval
+ *
+ * */
+function calculateDateIncrementBasedOnGroup(group) {
+    if (group.length < 2) {
+        return 1;
+    }
+    const jsDates = group.map((date) => toJsDate(date, DEFAULT_LOCALE));
+    const datesIntervals = getDateIntervals(jsDates);
+    const datesEquidistantInterval = getEqualInterval(datesIntervals);
+    if (datesEquidistantInterval === undefined) {
+        // dates are not equidistant in terms of years, months or days, thus no rule can be extrapolated
+        return undefined;
+    }
+    // The dates are apart by an exact interval of years, months or days
+    // but not a combination of them
+    const exactDateInterval = Object.values(datesEquidistantInterval).filter((value) => value !== 0).length === 1;
+    const isSameDay = Object.values(datesEquidistantInterval).every((el) => el === 0); // handles time values (strict decimals)
+    if (!exactDateInterval || isSameDay) {
+        const timeIntervals = jsDates
+            .map((date, index) => {
+            if (index === 0) {
+                return 0;
+            }
+            const previous = jsDates[index - 1];
+            const days = Math.floor(date.getTime()) - Math.floor(previous.getTime());
+            return days;
+        })
+            .slice(1);
+        const equidistantDates = timeIntervals.every((interval) => interval === timeIntervals[0]);
+        if (equidistantDates) {
+            return group.length * (group[1] - group[0]);
+        }
+    }
+    return {
+        years: datesEquidistantInterval.years * group.length,
+        months: datesEquidistantInterval.months * group.length,
+        days: datesEquidistantInterval.days * group.length,
+    };
+}
 autofillRulesRegistry
     .add("simple_value_copy", {
     condition: (cell, cells) => {
@@ -22348,12 +22499,47 @@ autofillRulesRegistry
         return { type: "FORMULA_MODIFIER", increment: cells.length, current: 0 };
     },
     sequence: 30,
+})
+    .add("increment_dates", {
+    condition: (cell, cells) => {
+        return (!cell.isFormula &&
+            evaluateLiteral(cell, { locale: DEFAULT_LOCALE }).type === CellValueType.number &&
+            !!cell.format &&
+            isDateTimeFormat(cell.format));
+    },
+    generateRule: (cell, cells) => {
+        const group = getGroup(cell, cells, (evaluatedCell) => evaluatedCell.type === CellValueType.number &&
+            !!evaluatedCell.format &&
+            isDateTimeFormat(evaluatedCell.format)).map((cell) => Number(cell.value));
+        const increment = calculateDateIncrementBasedOnGroup(group);
+        if (increment === undefined) {
+            return { type: "COPY_MODIFIER" };
+        }
+        /**  requires to detect the current date (requires to be an integer value  with the right format)
+         * detect  if year  or if month or if day then extrapolate increment required (+1 month, +1 year + 1 day)
+         */
+        const evaluation = evaluateLiteral(cell, { locale: DEFAULT_LOCALE });
+        if (typeof increment === "object") {
+            return {
+                type: "DATE_INCREMENT_MODIFIER",
+                increment,
+                current: evaluation.type === CellValueType.number ? evaluation.value : 0,
+            };
+        }
+        return {
+            type: "INCREMENT_MODIFIER",
+            increment,
+            current: evaluation.type === CellValueType.number ? evaluation.value : 0,
+        };
+    },
+    sequence: 25,
 })
     .add("increment_number", {
     condition: (cell) => !cell.isFormula &&
         evaluateLiteral(cell, { locale: DEFAULT_LOCALE }).type === CellValueType.number,
     generateRule: (cell, cells) => {
-        const group = getGroup(cell, cells, (evaluatedCell) => evaluatedCell.type === CellValueType.number).map((cell) => Number(cell.value));
+        const group = getGroup(cell, cells, (evaluatedCell) => evaluatedCell.type === CellValueType.number &&
+            !isDateTimeFormat(evaluatedCell.format || "")).map((cell) => Number(cell.value));
         const increment = calculateIncrementBasedOnGroup(group);
         const evaluation = evaluateLiteral(cell, { locale: DEFAULT_LOCALE });
         return {
@@ -22364,6 +22550,37 @@ autofillRulesRegistry
     },
     sequence: 40,
 });
+/**
+ * Returns the date intervals between consecutive dates of an array
+ * in the format of { years: number, months: number, days: number }
+ *
+ * The split is necessary to make abstraction of leap years and
+ * months with different number of days.
+ *
+ * @param dates
+ */
+function getDateIntervals(dates) {
+    if (dates.length < 2) {
+        return [{ years: 0, months: 0, days: 0 }];
+    }
+    const res = dates.map((date, index) => {
+        if (index === 0) {
+            return { years: 0, months: 0, days: 0 };
+        }
+        const previous = DateTime.fromTimestamp(dates[index - 1].getTime());
+        const years = getTimeDifferenceInWholeYears(previous, date);
+        const months = getTimeDifferenceInWholeMonths(previous, date) % 12;
+        previous.setFullYear(previous.getFullYear() + years);
+        previous.setMonth(previous.getMonth() + months);
+        const days = getTimeDifferenceInWholeDays(previous, date);
+        return {
+            years,
+            months,
+            days,
+        };
+    });
+    return res.slice(1);
+}
 
 const cellPopoverRegistry = new Registry();
 
@@ -27874,9 +28091,9 @@ function truncateLabel(label) {
 /**
  * Get a default chart js configuration
  */
-function getDefaultChartJsRuntime(chart, labels, fontColor, { format, locale, truncateLabels = true, horizontalChart, }) {
+function getDefaultChartJsRuntime(chart, labels, fontColor, { axisFormats, locale, truncateLabels = true, horizontalChart }) {
     const chartTitle = chart.title.text ? chart.title : { ...chart.title, content: "" };
-    const options = {
+    const chartOptions = {
         // https://www.chartjs.org/docs/latest/general/responsive.html
         responsive: true, // will resize when its container is resized
         maintainAspectRatio: false, // doesn't maintain the aspect ration (width/height =2 by default) so the user has the choice of the exact layout
@@ -27923,8 +28140,10 @@ function getDefaultChartJsRuntime(chart, labels, fontColor, { format, locale, tr
                         if (!yLabel) {
                             yLabel = tooltipItem.parsed;
                         }
-                        const toolTipFormat = !format && Math.abs(yLabel) >= 1000 ? "#,##" : format;
-                        const yLabelStr = formatValue(yLabel, { format: toolTipFormat, locale });
+                        const axisId = horizontalChart
+                            ? tooltipItem.dataset.xAxisID
+                            : tooltipItem.dataset.yAxisID;
+                        const yLabelStr = formatChartDatasetValue(axisFormats, locale)(yLabel, axisId);
                         return xLabel ? `${xLabel}: ${yLabelStr}` : yLabelStr;
                     },
                 },
@@ -27933,7 +28152,7 @@ function getDefaultChartJsRuntime(chart, labels, fontColor, { format, locale, tr
     };
     return {
         type: chart.type,
-        options,
+        options: chartOptions,
         data: {
             labels: truncateLabels ? labels.map(truncateLabel) : labels,
             datasets: [],
@@ -27992,7 +28211,8 @@ function getChartLabelValues(getters, dataSets, labelRange) {
  * Get the format to apply to the the dataset values. This format is defined as the first format
  * found in the dataset ranges that isn't a date format.
  */
-function getChartDatasetFormat(getters, dataSets) {
+function getChartDatasetFormat(getters, allDataSets, axis) {
+    const dataSets = allDataSets.filter((ds) => (axis === "right") === !!ds.rightYAxis);
     for (const ds of dataSets) {
         const formatsInDataset = getters.getRangeFormats(ds.dataRange);
         const format = formatsInDataset.find((f) => f !== undefined && !isDateTimeFormat(f));
@@ -28246,12 +28466,16 @@ function createBarChartRuntime(chart, getters) {
     if (chart.aggregated) {
         ({ labels, dataSetsValues } = aggregateDataForLabels(labels, dataSetsValues));
     }
-    const dataSetFormat = getChartDatasetFormat(getters, chart.dataSets);
+    const leftAxisFormat = getChartDatasetFormat(getters, chart.dataSets, "left");
+    const rightAxisFormat = getChartDatasetFormat(getters, chart.dataSets, "right");
     const locale = getters.getLocale();
-    const localeFormat = { format: dataSetFormat, locale };
     const fontColor = chartFontColor(chart.background);
+    const axisFormats = chart.horizontal
+        ? { x: leftAxisFormat || rightAxisFormat }
+        : { y: leftAxisFormat, y1: rightAxisFormat };
     const config = getDefaultChartJsRuntime(chart, labels, fontColor, {
-        ...localeFormat,
+        locale,
+        axisFormats,
         horizontalChart: chart.horizontal,
     });
     const legend = {
@@ -28272,51 +28496,27 @@ function createBarChartRuntime(chart, getters) {
     };
     config.options.indexAxis = chart.horizontal ? "y" : "x";
     config.options.scales = {};
-    const labelsAxis = { ticks: { padding: 5, color: fontColor } };
-    const valuesAxis = {
-        beginAtZero: true, // the origin of the y axis is always zero
-        ticks: {
-            color: fontColor,
-            callback: formatTickValue(localeFormat),
-        },
-    };
-    const xAxis = chart.horizontal ? valuesAxis : labelsAxis;
-    const yAxis = chart.horizontal ? labelsAxis : valuesAxis;
-    const { useLeftAxis, useRightAxis } = getDefinedAxis(chart.getDefinition());
-    config.options.scales.x = { ...xAxis, title: getChartAxisTitleRuntime(chart.axesDesign?.x) };
-    if (useLeftAxis) {
-        config.options.scales.y = {
-            ...yAxis,
-            position: "left",
-            title: getChartAxisTitleRuntime(chart.axesDesign?.y),
-        };
-    }
-    if (useRightAxis) {
-        config.options.scales.y1 = {
-            ...yAxis,
-            position: "right",
-            title: getChartAxisTitleRuntime(chart.axesDesign?.y1),
-        };
+    const definition = chart.getDefinition();
+    const options = { stacked: chart.stacked, locale };
+    if (chart.horizontal) {
+        const format = leftAxisFormat || rightAxisFormat;
+        config.options.scales.x = getChartAxis(definition, "bottom", "values", { ...options, format });
+        config.options.scales.y = getChartAxis(definition, "left", "labels", options);
     }
-    if (chart.stacked) {
-        // @ts-ignore chart.js type is broken
-        config.options.scales.x.stacked = true;
-        if (useLeftAxis) {
-            // @ts-ignore chart.js type is broken
-            config.options.scales.y.stacked = true;
-        }
-        if (useRightAxis) {
-            // @ts-ignore chart.js type is broken
-            config.options.scales.y1.stacked = true;
-        }
+    else {
+        config.options.scales.x = getChartAxis(definition, "bottom", "labels", options);
+        const leftAxisOptions = { ...options, format: leftAxisFormat };
+        config.options.scales.y = getChartAxis(definition, "left", "values", leftAxisOptions);
+        const rightAxisOptions = { ...options, format: rightAxisFormat };
+        config.options.scales.y1 = getChartAxis(definition, "right", "values", rightAxisOptions);
     }
+    config.options.scales = removeFalsyAttributes(config.options.scales);
     config.options.plugins.chartShowValuesPlugin = {
         showValues: chart.showValues,
         background: chart.background,
         horizontal: chart.horizontal,
-        callback: formatTickValue(localeFormat),
+        callback: formatChartDatasetValue(axisFormats, locale),
     };
-    const definition = chart.getDefinition();
     const colors = getChartColorsGenerator(definition, dataSetsValues.length);
     const trendDatasets = [];
     for (const index in dataSetsValues) {
@@ -28334,9 +28534,8 @@ function createBarChartRuntime(chart, getters) {
             const label = definition.dataSets[index].label;
             dataset.label = label;
         }
-        if (definition.dataSets?.[index]?.yAxisId && !chart.horizontal) {
-            dataset["yAxisID"] = definition.dataSets[index].yAxisId;
-        }
+        dataset.yAxisID = chart.horizontal ? "y" : definition.dataSets[index].yAxisId || "y";
+        dataset.xAxisID = "x";
         const trend = definition.dataSets?.[index].trend;
         if (!trend?.display || chart.horizontal) {
             continue;
@@ -28352,7 +28551,7 @@ function createBarChartRuntime(chart, getters) {
          */
         const maxLength = Math.max(...trendDatasets.map((trendDataset) => trendDataset.data.length));
         config.options.scales[TREND_LINE_XAXIS_ID] = {
-            ...xAxis,
+            ...config.options.scales.x,
             labels: Array(maxLength).fill(""),
             offset: false,
             display: false,
@@ -28642,8 +28841,10 @@ function createLineOrScatterChartRuntime(chart, getters) {
     }
     const locale = getters.getLocale();
     const truncateLabels = axisType === "category";
-    const dataSetFormat = getChartDatasetFormat(getters, chart.dataSets);
-    const options = { format: dataSetFormat, locale, truncateLabels };
+    const leftAxisFormat = getChartDatasetFormat(getters, chart.dataSets, "left");
+    const rightAxisFormat = getChartDatasetFormat(getters, chart.dataSets, "right");
+    const axisFormats = { y: leftAxisFormat, y1: rightAxisFormat };
+    const options = { locale, truncateLabels, axisFormats };
     const fontColor = chartFontColor(chart.background);
     const config = getDefaultChartJsRuntime(chart, labels, fontColor, options);
     const legend = {
@@ -28673,52 +28874,18 @@ function createLineOrScatterChartRuntime(chart, getters) {
             displayLegend: chart.legendPosition === "top",
         }),
     };
-    const xAxis = {
-        ticks: {
-            padding: 5,
-            color: fontColor,
-        },
-        title: getChartAxisTitleRuntime(chart.axesDesign?.x),
-    };
+    const definition = chart.getDefinition();
+    const stacked = "stacked" in chart && chart.stacked;
     config.options.scales = {
-        x: xAxis,
-    };
-    const yAxis = {
-        beginAtZero: true, // the origin of the y axis is always zero
-        ticks: {
-            color: fontColor,
-            callback: formatTickValue(options),
-        },
+        x: getChartAxis(definition, "bottom", "labels", { locale }),
+        y: getChartAxis(definition, "left", "values", { locale, stacked, format: leftAxisFormat }),
+        y1: getChartAxis(definition, "right", "values", { locale, stacked, format: rightAxisFormat }),
     };
-    const { useLeftAxis, useRightAxis } = getDefinedAxis(chart.getDefinition());
-    if (useLeftAxis) {
-        config.options.scales.y = {
-            ...yAxis,
-            position: "left",
-            title: getChartAxisTitleRuntime(chart.axesDesign?.y),
-        };
-    }
-    if (useRightAxis) {
-        config.options.scales.y1 = {
-            ...yAxis,
-            position: "right",
-            title: getChartAxisTitleRuntime(chart.axesDesign?.y1),
-        };
-    }
-    if ("stacked" in chart && chart.stacked) {
-        if (useLeftAxis) {
-            // @ts-ignore chart.js type is broken
-            config.options.scales.y.stacked = true;
-        }
-        if (useRightAxis) {
-            // @ts-ignore chart.js type is broken
-            config.options.scales.y1.stacked = true;
-        }
-    }
+    config.options.scales = removeFalsyAttributes(config.options.scales);
     config.options.plugins.chartShowValuesPlugin = {
         showValues: chart.showValues,
         background: chart.background,
-        callback: formatTickValue(options),
+        callback: formatChartDatasetValue(axisFormats, locale),
     };
     if (chart.dataSetsHaveTitle &&
         dataSetsValues[0] &&
@@ -28745,7 +28912,7 @@ function createLineOrScatterChartRuntime(chart, getters) {
                 label = toNumber(label, locale);
             }
             const formattedX = formatValue(label, { locale, format: labelFormat });
-            const formattedY = formatValue(dataSetPoint, { locale, format: dataSetFormat });
+            const formattedY = formatValue(dataSetPoint, { locale, format: leftAxisFormat });
             const dataSetTitle = tooltipItem.dataset.label;
             return formattedX
                 ? `${dataSetTitle}: (${formattedX}, ${formattedY})`
@@ -28755,7 +28922,6 @@ function createLineOrScatterChartRuntime(chart, getters) {
     const areaChart = "fillArea" in chart ? chart.fillArea : false;
     const stackedChart = "stacked" in chart ? chart.stacked : false;
     const cumulative = "cumulative" in chart ? chart.cumulative : false;
-    const definition = chart.getDefinition();
     const colors = getChartColorsGenerator(definition, dataSetsValues.length);
     for (let [index, { label, data }] of dataSetsValues.entries()) {
         const color = colors.next();
@@ -28796,9 +28962,7 @@ function createLineOrScatterChartRuntime(chart, getters) {
             const label = definition.dataSets[index].label;
             dataset.label = label;
         }
-        if (definition.dataSets?.[index]?.yAxisId) {
-            dataset["yAxisID"] = definition.dataSets[index].yAxisId;
-        }
+        dataset["yAxisID"] = definition.dataSets[index].yAxisId || "y";
         const trend = definition.dataSets?.[index].trend;
         if (!trend?.display) {
             continue;
@@ -28815,7 +28979,7 @@ function createLineOrScatterChartRuntime(chart, getters) {
          * set so that the second axis points match the classical x axis
          */
         config.options.scales[TREND_LINE_XAXIS_ID] = {
-            ...xAxis,
+            ...config.options.scales.x,
             type: "category",
             labels: range(0, maxLength).map((x) => x.toString()),
             offset: false,
@@ -28837,10 +29001,6 @@ function createLineOrScatterChartRuntime(chart, getters) {
     return {
         chartJsConfig: config,
         background: chart.background || BACKGROUND_CHART_COLOR,
-        dataSetsValues,
-        labelValues,
-        dataSetFormat,
-        labelFormat,
     };
 }
 
@@ -28898,6 +29058,7 @@ class ComboChart extends AbstractChart {
             ranges.push({
                 ...this.dataSetDesign?.[i],
                 dataRange: this.getters.getRangeString(dataSet.dataRange, targetSheetId || this.sheetId),
+                type: this.dataSetDesign?.[i]?.type ?? (i ? "line" : "bar"),
             });
         }
         return {
@@ -28943,9 +29104,13 @@ class ComboChart extends AbstractChart {
         return new ComboChart(definition, this.sheetId, this.getters);
     }
     static getDefinitionFromContextCreation(context) {
+        const dataSets = (context.range ?? []).map((ds, index) => ({
+            ...ds,
+            type: index ? "line" : "bar",
+        }));
         return {
             background: context.background,
-            dataSets: context.range ?? [],
+            dataSets,
             dataSetsHaveTitle: context.dataSetsHaveTitle ?? false,
             aggregated: context.aggregated,
             legendPosition: context.legendPosition ?? "top",
@@ -28968,10 +29133,8 @@ class ComboChart extends AbstractChart {
     }
 }
 function createComboChartRuntime(chart, getters) {
-    const mainDataSetFormat = chart.dataSets.length
-        ? getChartDatasetFormat(getters, [chart.dataSets[0]])
-        : undefined;
-    const lineDataSetsFormat = getChartDatasetFormat(getters, chart.dataSets.slice(1));
+    const mainDataSetFormat = getChartDatasetFormat(getters, chart.dataSets, "left");
+    const lineDataSetsFormat = getChartDatasetFormat(getters, chart.dataSets, "right");
     const locale = getters.getLocale();
     const labelValues = getChartLabelValues(getters, chart.dataSets, chart.labelRange);
     let labels = labelValues.formattedValues;
@@ -28985,12 +29148,11 @@ function createComboChartRuntime(chart, getters) {
     if (chart.aggregated) {
         ({ labels, dataSetsValues } = aggregateDataForLabels(labels, dataSetsValues));
     }
-    const localeFormat = { format: mainDataSetFormat, locale };
     const fontColor = chartFontColor(chart.background);
-    const config = getDefaultChartJsRuntime(chart, labels, fontColor, localeFormat);
+    const axisFormats = { y: mainDataSetFormat, y1: lineDataSetsFormat };
+    const config = getDefaultChartJsRuntime(chart, labels, fontColor, { locale, axisFormats });
     const legend = {
         labels: { color: fontColor },
-        reverse: true,
     };
     if (chart.legendPosition === "none") {
         legend.display = false;
@@ -29005,52 +29167,17 @@ function createComboChartRuntime(chart, getters) {
             displayLegend: chart.legendPosition === "top",
         }),
     };
+    const definition = chart.getDefinition();
     config.options.scales = {
-        x: {
-            ticks: {
-                padding: 5,
-                color: fontColor,
-            },
-            title: getChartAxisTitleRuntime(chart.axesDesign?.x),
-        },
+        x: getChartAxis(definition, "bottom", "labels", { locale }),
+        y: getChartAxis(definition, "left", "values", { locale, format: mainDataSetFormat }),
+        y1: getChartAxis(definition, "right", "values", { locale, format: lineDataSetsFormat }),
     };
-    const leftVerticalAxis = {
-        beginAtZero: true, // the origin of the y axis is always zero
-        ticks: {
-            color: fontColor,
-            callback: formatTickValue({ format: mainDataSetFormat, locale }),
-        },
-    };
-    const rightVerticalAxis = {
-        beginAtZero: true, // the origin of the y axis is always zero
-        ticks: {
-            color: fontColor,
-            callback: formatTickValue({ format: lineDataSetsFormat, locale }),
-        },
-    };
-    const definition = chart.getDefinition();
-    const { useLeftAxis, useRightAxis } = getDefinedAxis(definition);
-    if (useLeftAxis) {
-        config.options.scales.y = {
-            ...leftVerticalAxis,
-            position: "left",
-            title: getChartAxisTitleRuntime(chart.axesDesign?.y),
-        };
-    }
-    if (useRightAxis) {
-        config.options.scales.y1 = {
-            ...rightVerticalAxis,
-            position: "right",
-            grid: {
-                display: false,
-            },
-            title: getChartAxisTitleRuntime(chart.axesDesign?.y1),
-        };
-    }
+    config.options.scales = removeFalsyAttributes(config.options.scales);
     config.options.plugins.chartShowValuesPlugin = {
         showValues: chart.showValues,
         background: chart.background,
-        callback: formatTickValue({ format: mainDataSetFormat, locale }),
+        callback: formatChartDatasetValue(axisFormats, locale),
     };
     const colors = getChartColorsGenerator(definition, dataSetsValues.length);
     let maxLength = 0;
@@ -29058,14 +29185,15 @@ function createComboChartRuntime(chart, getters) {
     for (let [index, { label, data }] of dataSetsValues.entries()) {
         const design = definition.dataSets[index];
         const color = colors.next();
+        const type = design?.type ?? "line";
         const dataset = {
             label: design?.label ?? label,
             data,
             borderColor: color,
             backgroundColor: color,
             yAxisID: design?.yAxisId ?? "y",
-            type: index === 0 ? "bar" : "line",
-            order: -index,
+            type,
+            order: type === "bar" ? dataSetsValues.length + index : index,
         };
         config.data.datasets.push(dataset);
         const trend = definition.dataSets?.[index].trend;
@@ -29678,7 +29806,7 @@ function createPieChartRuntime(chart, getters) {
         ({ labels, dataSetsValues } = aggregateDataForLabels(labels, dataSetsValues));
     }
     ({ dataSetsValues, labels } = filterNegativeValues(labels, dataSetsValues));
-    const dataSetFormat = getChartDatasetFormat(getters, chart.dataSets);
+    const dataSetFormat = getChartDatasetFormat(getters, chart.dataSets, "left");
     const locale = getters.getLocale();
     const config = getPieConfiguration(chart, labels, { format: dataSetFormat, locale });
     const dataSetsLength = Math.max(0, ...dataSetsValues.map((ds) => ds?.data?.length ?? 0));
@@ -29833,7 +29961,7 @@ function createPyramidChartRuntime(chart, getters) {
         return tooltipLabelCallback(tooltipItem);
     };
     const callback = config.options.plugins.chartShowValuesPlugin.callback;
-    config.options.plugins.chartShowValuesPlugin.callback = (x) => callback(Math.abs(x));
+    config.options.plugins.chartShowValuesPlugin.callback = (x, axisId) => callback(Math.abs(x), axisId);
     return { chartJsConfig: config, background: chart.background || BACKGROUND_CHART_COLOR };
 }
 
@@ -30224,7 +30352,8 @@ function createWaterfallChartRuntime(chart, getters) {
     if (chart.showSubTotals) {
         labels.push(_t("Subtotal"));
     }
-    const dataSetFormat = getChartDatasetFormat(getters, chart.dataSets);
+    const dataSetFormat = getChartDatasetFormat(getters, chart.dataSets, "left") ||
+        getChartDatasetFormat(getters, chart.dataSets, "right");
     const locale = getters.getLocale();
     const dataSeriesLabels = dataSetsValues.map((dataSet) => dataSet.label);
     const config = getWaterfallConfiguration(chart, labels, dataSeriesLabels, {
@@ -35294,6 +35423,7 @@ const CHECK_SVG = /*xml*/ `
   <path fill='none' stroke='#FFF' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/>
 </svg>
 `;
+const CHECKBOX_WIDTH = 14;
 css /* scss */ `
   label.o-checkbox {
     input {
@@ -35301,8 +35431,8 @@ css /* scss */ `
       -webkit-appearance: none;
       -moz-appearance: none;
       border-radius: 0;
-      width: 14px;
-      height: 14px;
+      width: ${CHECKBOX_WIDTH}px;
+      height: ${CHECKBOX_WIDTH}px;
       vertical-align: top;
       box-sizing: border-box;
       outline: none;
@@ -37212,6 +37342,32 @@ class ChartWithAxisDesignPanel extends Component {
     }
 }
 
+class ComboChartDesignPanel extends ChartWithAxisDesignPanel {
+    static template = "o-spreadsheet-ComboChartDesignPanel";
+    seriesTypeChoices = [
+        { value: "bar", label: _t("Bar") },
+        { value: "line", label: _t("Line") },
+    ];
+    updateDataSeriesType(type) {
+        const dataSets = [...this.props.definition.dataSets];
+        if (!dataSets?.[this.state.index]) {
+            return;
+        }
+        dataSets[this.state.index] = {
+            ...dataSets[this.state.index],
+            type,
+        };
+        this.props.updateChart(this.props.figureId, { dataSets });
+    }
+    getDataSeriesType() {
+        const dataSets = this.props.definition.dataSets;
+        if (!dataSets?.[this.state.index]) {
+            return "bar";
+        }
+        return dataSets[this.state.index].type ?? "line";
+    }
+}
+
 class GaugeChartConfigPanel extends Component {
     static template = "o-spreadsheet-GaugeChartConfigPanel";
     static components = { ChartErrorSection, ChartDataSeries };
@@ -37638,7 +37794,7 @@ chartSidePanelComponentRegistry
 })
     .add("combo", {
     configuration: GenericChartConfigPanel,
-    design: ChartWithAxisDesignPanel,
+    design: ComboChartDesignPanel,
 })
     .add("pie", {
     configuration: GenericChartConfigPanel,
@@ -37924,6 +38080,7 @@ class AbstractComposerStore extends SpreadsheetStore {
         "stopComposerRangeSelection",
         "cancelEdition",
         "cycleReferences",
+        "toggleEditionMode",
         "changeComposerCursorSelection",
         "replaceComposerCursorSelection",
     ];
@@ -38079,6 +38236,42 @@ class AbstractComposerStore extends SpreadsheetStore {
         }
         this.setCurrentContent(updated.content, updated.selection);
     }
+    toggleEditionMode() {
+        if (this.editionMode === "inactive")
+            return;
+        const start = Math.min(this.selectionStart, this.selectionEnd);
+        const end = Math.max(this.selectionStart, this.selectionEnd);
+        const refToken = [...this.currentTokens]
+            .reverse()
+            .find((tk) => tk.end >= start && end >= tk.start && tk.type === "REFERENCE");
+        if (this.editionMode === "editing" && refToken) {
+            const currentSheetId = this.getters.getActiveSheetId();
+            const { sheetName, xc } = splitReference(refToken.value);
+            const sheetId = this.getters.getSheetIdByName(sheetName);
+            if (sheetId && sheetId !== currentSheetId) {
+                this.model.dispatch("ACTIVATE_SHEET", { sheetIdFrom: currentSheetId, sheetIdTo: sheetId });
+            }
+            // move cursor to the right part of the token
+            this.selectionStart = this.selectionEnd = refToken.end;
+            const zone = this.getters.getRangeFromSheetXC(this.sheetId, xc).zone;
+            this.captureSelection(zone);
+            this.editionMode = "selecting";
+        }
+        else {
+            this.editionMode = "editing";
+        }
+    }
+    captureSelection(zone, col, row) {
+        this.model.selection.capture(this, {
+            cell: { col: col || zone.left, row: row || zone.right },
+            zone,
+        }, {
+            handleEvent: this.handleEvent.bind(this),
+            release: () => {
+                this._stopEdition();
+            },
+        });
+    }
     isSelectionValid(length, start, end) {
         return start >= 0 && start <= length && end >= 0 && end <= length;
     }
@@ -38117,12 +38310,7 @@ class AbstractComposerStore extends SpreadsheetStore {
         this.setContent(str || this.initialContent, selection);
         this.colorIndexByRange = {};
         const zone = positionToZone({ col: this.col, row: this.row });
-        this.model.selection.capture(this, { cell: { col: this.col, row: this.row }, zone }, {
-            handleEvent: this.handleEvent.bind(this),
-            release: () => {
-                this._stopEdition();
-            },
-        });
+        this.captureSelection(zone, col, row);
     }
     _stopEdition() {
         if (this.editionMode !== "inactive") {
@@ -42817,8 +43005,9 @@ const EMPTY_PIVOT_CELL = { type: "EMPTY" };
  * This function converts a list of data entry into a spreadsheet pivot table.
  */
 function dataEntriesToSpreadsheetPivotTable(dataEntries, definition) {
+    const measureIds = definition.measures.filter((measure) => !measure.isHidden).map((m) => m.id);
     const columnsTree = dataEntriesToColumnsTree(dataEntries, definition.columns, 0);
-    computeWidthOfColumnsNodes(columnsTree, definition.measures.length);
+    computeWidthOfColumnsNodes(columnsTree, measureIds.length);
     const cols = columnsTreeToColumns(columnsTree, definition);
     const rows = dataEntriesToRows(dataEntries, 0, definition.rows, [], []);
     // Add the total row
@@ -42827,7 +43016,6 @@ function dataEntriesToSpreadsheetPivotTable(dataEntries, definition) {
         values: [],
         indent: 0,
     });
-    const measureIds = definition.measures.filter((measure) => !measure.isHidden).map((m) => m.id);
     const fieldsType = {};
     for (const columns of definition.columns) {
         fieldsType[columns.fieldName] = columns.type;
@@ -43588,7 +43776,7 @@ pivotRegistry.add("SPREADSHEET", {
     onIterationEndEvaluation: (pivot) => pivot.markAsDirtyForEvaluation(),
     dateGranularities: [...dateGranularities],
     datetimeGranularities: [...dateGranularities, "hour_number", "minute_number", "second_number"],
-    isMeasureCandidate: (field) => !["date", "boolean"].includes(field.type),
+    isMeasureCandidate: (field) => !["datetime", "boolean"].includes(field.type),
     isGroupable: () => true,
 });
 
@@ -46117,13 +46305,10 @@ class GridCellIcon extends Component {
     }
 }
 
-const CHECKBOX_WIDTH = 15;
 const MARGIN = (GRID_ICON_EDGE_LENGTH - CHECKBOX_WIDTH) / 2;
 css /* scss */ `
   .o-dv-checkbox {
     box-sizing: border-box !important;
-    width: ${CHECKBOX_WIDTH}px;
-    height: ${CHECKBOX_WIDTH}px;
     accent-color: #808080;
     margin: ${MARGIN}px;
     /** required to prevent the checkbox position to be sensible to the font-size (affects Firefox) */
@@ -46132,13 +46317,15 @@ css /* scss */ `
 `;
 class DataValidationCheckbox extends Component {
     static template = "o-spreadsheet-DataValidationCheckbox";
+    static components = {
+        Checkbox,
+    };
     static props = {
         cellPosition: Object,
     };
-    onCheckboxChange(ev) {
-        const newValue = ev.target.checked;
+    onCheckboxChange(value) {
         const { sheetId, col, row } = this.props.cellPosition;
-        const cellContent = newValue ? "TRUE" : "FALSE";
+        const cellContent = value ? "TRUE" : "FALSE";
         this.env.model.dispatch("UPDATE_CELL", { sheetId, col, row, content: cellContent });
     }
     get checkBoxValue() {
@@ -46952,7 +47139,11 @@ class GridAddRowsFooter extends Component {
 class PaintFormatStore extends SpreadsheetStore {
     mutators = ["activate", "cancel", "pasteFormat"];
     highlightStore = this.get(HighlightStore);
-    cellClipboardHandler = new CellClipboardHandler(this.getters, this.model.dispatch);
+    clipboardHandlers = [
+        new CellClipboardHandler(this.getters, this.model.dispatch),
+        new BorderClipboardHandler(this.getters, this.model.dispatch),
+        new TableClipboardHandler(this.getters, this.model.dispatch),
+    ];
     status = "inactive";
     copiedData;
     constructor(get) {
@@ -46973,10 +47164,12 @@ class PaintFormatStore extends SpreadsheetStore {
     pasteFormat(target) {
         if (this.copiedData) {
             const sheetId = this.getters.getActiveSheetId();
-            this.cellClipboardHandler.paste({ zones: target, sheetId }, this.copiedData, {
-                isCutOperation: false,
-                pasteOption: "onlyFormat",
-            });
+            for (const handler of this.clipboardHandlers) {
+                handler.paste({ zones: target, sheetId }, this.copiedData, {
+                    isCutOperation: false,
+                    pasteOption: "onlyFormat",
+                });
+            }
         }
         if (this.status === "oneOff") {
             this.cancel();
@@ -46988,7 +47181,11 @@ class PaintFormatStore extends SpreadsheetStore {
     copyFormats() {
         const sheetId = this.getters.getActiveSheetId();
         const zones = this.getters.getSelectedZones();
-        return this.cellClipboardHandler.copy(getClipboardDataPositions(sheetId, zones));
+        const copiedData = {};
+        for (const handler of this.clipboardHandlers) {
+            Object.assign(copiedData, handler.copy(getClipboardDataPositions(sheetId, zones)));
+        }
+        return copiedData;
     }
     get highlights() {
         const data = this.copiedData;
@@ -49796,12 +49993,10 @@ class BasePlugin {
  */
 class CorePlugin extends BasePlugin {
     getters;
-    uuidGenerator;
-    constructor({ getters, stateObserver, range, dispatch, canDispatch, uuidGenerator, }) {
+    constructor({ getters, stateObserver, range, dispatch, canDispatch }) {
         super(stateObserver, dispatch, canDispatch);
         range.addRangeProvider(this.adaptRanges.bind(this));
         this.getters = getters;
-        this.uuidGenerator = uuidGenerator;
     }
     // ---------------------------------------------------------------------------
     // Import/Export
@@ -54299,6 +54494,7 @@ class SheetPlugin extends CorePlugin {
     }
 }
 
+let nextTableId = 1;
 class TablePlugin extends CorePlugin {
     static getters = ["getCoreTable", "getCoreTables", "getCoreTableMatchingTopLeft"];
     tables = {};
@@ -54366,7 +54562,7 @@ class TablePlugin extends CorePlugin {
                 const union = this.getters.getRangesUnion(ranges);
                 const mergesInTarget = this.getters.getMergesInZone(cmd.sheetId, union.zone);
                 this.dispatch("REMOVE_MERGE", { sheetId: cmd.sheetId, target: mergesInTarget });
-                const id = this.uuidGenerator.uuidv4();
+                const id = `${nextTableId++}`;
                 const config = cmd.config || DEFAULT_TABLE_CONFIG;
                 const newTable = cmd.tableType === "dynamic"
                     ? this.createDynamicTable(id, union, config)
@@ -54519,7 +54715,7 @@ class TablePlugin extends CorePlugin {
             filters = [];
             for (const i of range(zone.left, zone.right + 1)) {
                 const filterZone = { ...zone, left: i, right: i };
-                const uid = this.uuidGenerator.uuidv4();
+                const uid = `${nextTableId++}`;
                 filters.push(this.createFilterFromZone(uid, tableRange.sheetId, filterZone, config));
             }
         }
@@ -54584,7 +54780,7 @@ class TablePlugin extends CorePlugin {
                     ? table.filters.find((f) => f.col === i)
                     : undefined;
                 const filterZone = { ...tableZone, left: i, right: i };
-                const filterId = oldFilter?.id || this.uuidGenerator.uuidv4();
+                const filterId = oldFilter?.id || `${nextTableId++}`;
                 filters.push(this.createFilterFromZone(filterId, tableRange.sheetId, filterZone, config));
             }
         }
@@ -54685,7 +54881,7 @@ class TablePlugin extends CorePlugin {
         if (filters.length < zoneToDimension(tableZone).numberOfCols) {
             for (let col = tableZone.left; col <= tableZone.right; col++) {
                 if (!filters.find((filter) => filter.col === col)) {
-                    const uid = this.uuidGenerator.uuidv4();
+                    const uid = `${nextTableId++}`;
                     const filterZone = { ...tableZone, left: col, right: col };
                     filters.push(this.createFilterFromZone(uid, sheetId, filterZone, table.config));
                 }
@@ -54701,7 +54897,7 @@ class TablePlugin extends CorePlugin {
     import(data) {
         for (const sheet of data.sheets) {
             for (const tableData of sheet.tables || []) {
-                const uuid = this.uuidGenerator.uuidv4();
+                const uuid = `${nextTableId++}`;
                 const tableConfig = tableData.config || DEFAULT_TABLE_CONFIG;
                 const range = this.getters.getRangeFromSheetXC(sheet.id, tableData.range);
                 const tableType = tableData.type || "static";
@@ -59050,7 +59246,7 @@ function withPivotPresentationLayer (PivotClass) {
             const ranking = {};
             const mainDimension = getFieldDimensionType(this, fieldNameWithGranularity);
             const secondaryDimension = mainDimension === "row" ? "column" : "row";
-            let pivotCells = this.getPivotValueCells();
+            let pivotCells = this.getPivotValueCells(measure.id);
             if (mainDimension === "column") {
                 // Transpose the pivot cells so we can do the same operations on the columns as on the rows
                 // This means that we need to transpose back the ranking at the end
@@ -59094,7 +59290,7 @@ function withPivotPresentationLayer (PivotClass) {
             const cellsRunningTotals = {};
             const mainDimension = getFieldDimensionType(this, fieldNameWithGranularity);
             const secondaryDimension = mainDimension === "row" ? "column" : "row";
-            let pivotCells = this.getPivotValueCells();
+            let pivotCells = this.getPivotValueCells(measure.id);
             if (mainDimension === "column") {
                 // Transpose the pivot cells so we can do the same operations on the columns as on the rows
                 // This means that we need to transpose back the totals at the end
@@ -59173,10 +59369,10 @@ function withPivotPresentationLayer (PivotClass) {
             const comparedValueNumber = this.strictMeasureValueToNumber(comparedValue);
             return comparedValueNumber;
         }
-        getPivotValueCells() {
+        getPivotValueCells(measureId) {
             return this.getTableStructure()
                 .getPivotCells()
-                .map((col) => col.filter((cell) => cell.type === "VALUE"))
+                .map((col) => col.filter((cell) => cell.type === "VALUE" && cell.measure === measureId))
                 .filter((col) => col.length > 0);
         }
         measureValueToNumber(result) {
@@ -60944,6 +61140,7 @@ class Session extends EventBus {
             case "REMOTE_REVISION":
             case "REVISION_REDONE":
             case "REVISION_UNDONE":
+            case "SNAPSHOT_CREATED":
                 return this.processedRevisions.has(message.nextRevisionId);
             default:
                 return false;
@@ -61506,7 +61703,7 @@ class InsertPivotPlugin extends UIPlugin {
         const position = this.getters.getSheetIds().indexOf(activeSheetId) + 1;
         const formulaId = this.getters.getPivotFormulaId(newPivotId);
         const newPivotName = this.getters.getPivotName(newPivotId);
-        this.dispatch("CREATE_SHEET", {
+        const result = this.dispatch("CREATE_SHEET", {
             sheetId: newSheetId,
             name: this.getPivotDuplicateSheetName(_t("%(newPivotName)s (Pivot #%(formulaId)s)", {
                 newPivotName,
@@ -61514,20 +61711,19 @@ class InsertPivotPlugin extends UIPlugin {
             })),
             position,
         });
-        this.dispatch("ACTIVATE_SHEET", { sheetIdFrom: activeSheetId, sheetIdTo: newSheetId });
-        this.dispatch("UPDATE_CELL", {
-            sheetId: newSheetId,
-            col: 0,
-            row: 0,
-            content: `=PIVOT(${formulaId})`,
-        });
+        if (result.isSuccessful) {
+            this.dispatch("ACTIVATE_SHEET", { sheetIdFrom: activeSheetId, sheetIdTo: newSheetId });
+            const pivot = this.getters.getPivot(pivotId);
+            this.insertPivotWithTable(newSheetId, 0, 0, newPivotId, pivot.getTableStructure().export(), "dynamic");
+        }
     }
     getPivotDuplicateSheetName(pivotName) {
         let i = 1;
         const names = this.getters.getSheetIds().map((id) => this.getters.getSheetName(id));
-        let name = pivotName;
+        const sanitizedName = pivotName.replace(new RegExp(FORBIDDEN_IN_EXCEL_REGEX, "g"), " ");
+        let name = sanitizedName;
         while (names.includes(name)) {
-            name = `${pivotName} (${i})`;
+            name = `${sanitizedName} (${i})`;
             i++;
         }
         return name;
@@ -70880,6 +71076,15 @@ function addTableColumns(table, sheetData) {
             ["id", i + 1], // id cannot be 0
             ["name", colName],
         ];
+        if (table.config.totalRow) {
+            // Note: To be 100% complete, we could also add a `totalsRowLabel` attribute for total strings, and a tag
+            // `<totalsRowFormula>` for the formula of the total. But those doesn't seem to be mandatory for Excel.
+            const colTotalXc = toXC(tableZone.left + i, tableZone.bottom);
+            const colTotalContent = sheetData.cells[colTotalXc]?.content;
+            if (colTotalContent?.startsWith("=")) {
+                colAttributes.push(["totalsRowFunction", "custom"]);
+            }
+        }
         columns.push(escapeXml /*xml*/ `<tableColumn ${formatAttributes(colAttributes)}/>`);
     }
     return escapeXml /*xml*/ `
@@ -70974,8 +71179,9 @@ function addRows(construct, data, sheet) {
                 }
                 else if (cell.content && cell.content !== "") {
                     const isTableHeader = isCellTableHeader(c, r, sheet);
+                    const isTableTotal = isCellTableTotal(c, r, sheet);
                     const isPlainText = !!(cell.format && isTextFormat(data.formats[cell.format]));
-                    ({ attrs: additionalAttrs, node: cellNode } = addContent(cell.content, construct.sharedStrings, isTableHeader || isPlainText));
+                    ({ attrs: additionalAttrs, node: cellNode } = addContent(cell.content, construct.sharedStrings, isTableHeader || isTableTotal || isPlainText));
                 }
                 attributes.push(...additionalAttrs);
                 // prettier-ignore
@@ -71009,6 +71215,16 @@ function isCellTableHeader(col, row, sheet) {
         return isInside(col, row, headerZone);
     });
 }
+function isCellTableTotal(col, row, sheet) {
+    return sheet.tables.some((table) => {
+        if (!table.config.totalRow) {
+            return false;
+        }
+        const zone = toZone(table.range);
+        const totalZone = { ...zone, top: zone.bottom };
+        return isInside(col, row, totalZone);
+    });
+}
 function addHyperlinks(construct, data, sheetIndex) {
     const sheet = data.sheets[sheetIndex];
     const cells = sheet.cells;
@@ -71499,7 +71715,6 @@ class Model extends EventBus {
             isReadonly: () => this.config.mode === "readonly" || this.config.mode === "dashboard",
             isDashboard: () => this.config.mode === "dashboard",
         };
-        this.uuidGenerator.setIsFastStrategy(true);
         // Initiate stream processor
         this.selection = new SelectionStreamProcessorImpl(this.getters);
         this.coreHandlers.push(this.range);
@@ -71531,7 +71746,6 @@ class Model extends EventBus {
             this.handlers.push(plugin);
             this.uiHandlers.push(plugin);
         }
-        this.uuidGenerator.setIsFastStrategy(false);
         // starting plugins
         this.dispatch("START");
         // Model should be the last permanent subscriber in the list since he should render
@@ -71679,7 +71893,6 @@ class Model extends EventBus {
             range: this.range,
             dispatch: this.dispatchFromCorePlugin,
             canDispatch: this.canDispatch,
-            uuidGenerator: this.uuidGenerator,
             custom: this.config.custom,
             external: this.config.external,
         };
@@ -72130,6 +72343,6 @@ const constants = {
 export { AbstractCellClipboardHandler, AbstractChart, AbstractFigureClipboardHandler, CellErrorType, CommandResult, CorePlugin, DispatchResult, EvaluationError, Model, PivotRuntimeDefinition, Registry, Revision, SPREADSHEET_DIMENSIONS, Spreadsheet, SpreadsheetPivotTable, UIPlugin, __info__, addFunction, addRenderingLayer, astToFormula, compile, compileTokens, components, constants, convertAstNodes, coreTypes, findCellInNewZone, functionCache, helpers, hooks, invalidateCFEvaluationCommands, invalidateDependenciesCommands, invalidateEvaluationCommands, iterateAstNodes, links, load, parse, parseTokens, readonlyAllowedCommands, registries, setDefaultSheetViewSize, setTranslationMethod, stores, tokenColors, tokenize };
 
 
-__info__.version = "18.1.0-alpha.0";
-__info__.date = "2024-09-25T13:17:49.636Z";
-__info__.hash = "288f0b7";
+__info__.version = "18.1.0-alpha.1";
+__info__.date = "2024-10-14T07:53:17.717Z";
+__info__.hash = "e9ce3aa";