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

package/dist/o-spreadsheet.iife.js

@@ -2,14 +2,120 @@
 /**
  * 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
  */
 
 (function (exports, owl) {
   'use strict';
 
+  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";
@@ -5969,18 +6075,9 @@
    * 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));
           }
@@ -5994,111 +6091,6 @@
       }
   }
 
-  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));
@@ -8453,31 +8445,34 @@
               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 {
@@ -8558,11 +8553,14 @@
                   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) {
@@ -9282,6 +9280,49 @@ stores.inject(MyMetaStore, storeInstance);
       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) {
@@ -9368,6 +9409,12 @@ stores.inject(MyMetaStore, storeInstance);
               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);
@@ -9430,10 +9477,12 @@ stores.inject(MyMetaStore, storeInstance);
                   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;
@@ -17842,7 +17891,7 @@ stores.inject(MyMetaStore, storeInstance);
           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) {
@@ -17854,7 +17903,7 @@ stores.inject(MyMetaStore, storeInstance);
           }
           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));
@@ -18287,7 +18336,7 @@ stores.inject(MyMetaStore, storeInstance);
           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) {
@@ -18317,7 +18366,7 @@ stores.inject(MyMetaStore, storeInstance);
           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) {
@@ -18368,7 +18417,7 @@ stores.inject(MyMetaStore, storeInstance);
           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) {
@@ -20164,7 +20213,7 @@ stores.inject(MyMetaStore, storeInstance);
               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);
           }
       }
       /**
@@ -20662,7 +20711,7 @@ stores.inject(MyMetaStore, storeInstance);
           "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"),
@@ -20781,6 +20830,11 @@ stores.inject(MyMetaStore, storeInstance);
           this.props.composerStore.cycleReferences();
           this.processContent();
       }
+      toggleEditionMode(ev) {
+          ev.stopPropagation();
+          this.props.composerStore.toggleEditionMode();
+          this.processContent();
+      }
       processNumpadDecimal(ev) {
           ev.stopPropagation();
           ev.preventDefault();
@@ -21006,7 +21060,13 @@ stores.inject(MyMetaStore, storeInstance);
                       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;
@@ -21577,6 +21637,7 @@ stores.inject(MyMetaStore, storeInstance);
           // replace the whole token
           start = tokenAtCursor.start;
       }
+      this.composer.stopComposerRangeSelection();
       this.composer.changeComposerCursorSelection(start, end);
       this.composer.replaceComposerCursorSelection(value);
   }
@@ -21594,6 +21655,7 @@ stores.inject(MyMetaStore, storeInstance);
           // replace the whole token
           start = tokenAtCursor.start;
       }
+      this.composer.stopComposerRangeSelection();
       this.composer.changeComposerCursorSelection(start, end);
       this.composer.replaceComposerCursorSelection(value);
   }
@@ -22186,6 +22248,27 @@ stores.inject(MyMetaStore, storeInstance);
               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) => {
@@ -22266,7 +22349,9 @@ stores.inject(MyMetaStore, storeInstance);
           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);
           }
@@ -22302,6 +22387,72 @@ stores.inject(MyMetaStore, storeInstance);
       }
       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) => {
@@ -22349,12 +22500,47 @@ stores.inject(MyMetaStore, storeInstance);
           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 {
@@ -22365,6 +22551,37 @@ stores.inject(MyMetaStore, storeInstance);
       },
       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();
 
@@ -27875,9 +28092,9 @@ stores.inject(MyMetaStore, storeInstance);
   /**
    * 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
@@ -27924,8 +28141,10 @@ stores.inject(MyMetaStore, storeInstance);
                           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;
                       },
                   },
@@ -27934,7 +28153,7 @@ stores.inject(MyMetaStore, storeInstance);
       };
       return {
           type: chart.type,
-          options,
+          options: chartOptions,
           data: {
               labels: truncateLabels ? labels.map(truncateLabel) : labels,
               datasets: [],
@@ -27993,7 +28212,8 @@ stores.inject(MyMetaStore, storeInstance);
    * 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));
@@ -28247,12 +28467,16 @@ stores.inject(MyMetaStore, storeInstance);
       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 = {
@@ -28273,51 +28497,27 @@ stores.inject(MyMetaStore, storeInstance);
       };
       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) {
@@ -28335,9 +28535,8 @@ stores.inject(MyMetaStore, storeInstance);
               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;
@@ -28353,7 +28552,7 @@ stores.inject(MyMetaStore, storeInstance);
            */
           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,
@@ -28643,8 +28842,10 @@ stores.inject(MyMetaStore, storeInstance);
       }
       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 = {
@@ -28674,52 +28875,18 @@ stores.inject(MyMetaStore, storeInstance);
               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] &&
@@ -28746,7 +28913,7 @@ stores.inject(MyMetaStore, storeInstance);
                   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})`
@@ -28756,7 +28923,6 @@ stores.inject(MyMetaStore, storeInstance);
       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();
@@ -28797,9 +28963,7 @@ stores.inject(MyMetaStore, storeInstance);
               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;
@@ -28816,7 +28980,7 @@ stores.inject(MyMetaStore, storeInstance);
            * 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,
@@ -28838,10 +29002,6 @@ stores.inject(MyMetaStore, storeInstance);
       return {
           chartJsConfig: config,
           background: chart.background || BACKGROUND_CHART_COLOR,
-          dataSetsValues,
-          labelValues,
-          dataSetFormat,
-          labelFormat,
       };
   }
 
@@ -28899,6 +29059,7 @@ stores.inject(MyMetaStore, storeInstance);
               ranges.push({
                   ...this.dataSetDesign?.[i],
                   dataRange: this.getters.getRangeString(dataSet.dataRange, targetSheetId || this.sheetId),
+                  type: this.dataSetDesign?.[i]?.type ?? (i ? "line" : "bar"),
               });
           }
           return {
@@ -28944,9 +29105,13 @@ stores.inject(MyMetaStore, storeInstance);
           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",
@@ -28969,10 +29134,8 @@ stores.inject(MyMetaStore, storeInstance);
       }
   }
   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;
@@ -28986,12 +29149,11 @@ stores.inject(MyMetaStore, storeInstance);
       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;
@@ -29006,52 +29168,17 @@ stores.inject(MyMetaStore, storeInstance);
               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;
@@ -29059,14 +29186,15 @@ stores.inject(MyMetaStore, storeInstance);
       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;
@@ -29679,7 +29807,7 @@ stores.inject(MyMetaStore, storeInstance);
           ({ 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));
@@ -29834,7 +29962,7 @@ stores.inject(MyMetaStore, storeInstance);
           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 };
   }
 
@@ -30225,7 +30353,8 @@ stores.inject(MyMetaStore, storeInstance);
       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, {
@@ -35295,6 +35424,7 @@ stores.inject(MyMetaStore, storeInstance);
   <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 {
@@ -35302,8 +35432,8 @@ stores.inject(MyMetaStore, storeInstance);
       -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;
@@ -37213,6 +37343,32 @@ stores.inject(MyMetaStore, storeInstance);
       }
   }
 
+  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 owl.Component {
       static template = "o-spreadsheet-GaugeChartConfigPanel";
       static components = { ChartErrorSection, ChartDataSeries };
@@ -37639,7 +37795,7 @@ stores.inject(MyMetaStore, storeInstance);
   })
       .add("combo", {
       configuration: GenericChartConfigPanel,
-      design: ChartWithAxisDesignPanel,
+      design: ComboChartDesignPanel,
   })
       .add("pie", {
       configuration: GenericChartConfigPanel,
@@ -37925,6 +38081,7 @@ stores.inject(MyMetaStore, storeInstance);
           "stopComposerRangeSelection",
           "cancelEdition",
           "cycleReferences",
+          "toggleEditionMode",
           "changeComposerCursorSelection",
           "replaceComposerCursorSelection",
       ];
@@ -38080,6 +38237,42 @@ stores.inject(MyMetaStore, storeInstance);
           }
           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;
       }
@@ -38118,12 +38311,7 @@ stores.inject(MyMetaStore, storeInstance);
           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") {
@@ -42818,8 +43006,9 @@ stores.inject(MyMetaStore, storeInstance);
    * 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
@@ -42828,7 +43017,6 @@ stores.inject(MyMetaStore, storeInstance);
           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;
@@ -43589,7 +43777,7 @@ stores.inject(MyMetaStore, storeInstance);
       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,
   });
 
@@ -46118,13 +46306,10 @@ stores.inject(MyMetaStore, storeInstance);
       }
   }
 
-  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) */
@@ -46133,13 +46318,15 @@ stores.inject(MyMetaStore, storeInstance);
 `;
   class DataValidationCheckbox extends owl.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() {
@@ -46953,7 +47140,11 @@ stores.inject(MyMetaStore, storeInstance);
   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) {
@@ -46974,10 +47165,12 @@ stores.inject(MyMetaStore, storeInstance);
       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();
@@ -46989,7 +47182,11 @@ stores.inject(MyMetaStore, storeInstance);
       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;
@@ -49797,12 +49994,10 @@ stores.inject(MyMetaStore, storeInstance);
    */
   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
@@ -54300,6 +54495,7 @@ stores.inject(MyMetaStore, storeInstance);
       }
   }
 
+  let nextTableId = 1;
   class TablePlugin extends CorePlugin {
       static getters = ["getCoreTable", "getCoreTables", "getCoreTableMatchingTopLeft"];
       tables = {};
@@ -54367,7 +54563,7 @@ stores.inject(MyMetaStore, storeInstance);
                   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)
@@ -54520,7 +54716,7 @@ stores.inject(MyMetaStore, storeInstance);
               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));
               }
           }
@@ -54585,7 +54781,7 @@ stores.inject(MyMetaStore, storeInstance);
                       ? 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));
               }
           }
@@ -54686,7 +54882,7 @@ stores.inject(MyMetaStore, storeInstance);
           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));
                   }
@@ -54702,7 +54898,7 @@ stores.inject(MyMetaStore, storeInstance);
       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";
@@ -59051,7 +59247,7 @@ stores.inject(MyMetaStore, storeInstance);
               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
@@ -59095,7 +59291,7 @@ stores.inject(MyMetaStore, storeInstance);
               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
@@ -59174,10 +59370,10 @@ stores.inject(MyMetaStore, storeInstance);
               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) {
@@ -60945,6 +61141,7 @@ stores.inject(MyMetaStore, storeInstance);
               case "REMOTE_REVISION":
               case "REVISION_REDONE":
               case "REVISION_UNDONE":
+              case "SNAPSHOT_CREATED":
                   return this.processedRevisions.has(message.nextRevisionId);
               default:
                   return false;
@@ -61507,7 +61704,7 @@ stores.inject(MyMetaStore, storeInstance);
           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,
@@ -61515,20 +61712,19 @@ stores.inject(MyMetaStore, storeInstance);
               })),
               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;
@@ -70881,6 +71077,15 @@ stores.inject(MyMetaStore, storeInstance);
               ["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*/ `
@@ -70975,8 +71180,9 @@ stores.inject(MyMetaStore, storeInstance);
                   }
                   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
@@ -71010,6 +71216,16 @@ stores.inject(MyMetaStore, storeInstance);
           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;
@@ -71500,7 +71716,6 @@ stores.inject(MyMetaStore, storeInstance);
               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);
@@ -71532,7 +71747,6 @@ stores.inject(MyMetaStore, storeInstance);
               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
@@ -71680,7 +71894,6 @@ stores.inject(MyMetaStore, storeInstance);
               range: this.range,
               dispatch: this.dispatchFromCorePlugin,
               canDispatch: this.canDispatch,
-              uuidGenerator: this.uuidGenerator,
               custom: this.config.custom,
               external: this.config.external,
           };
@@ -72174,9 +72387,9 @@ stores.inject(MyMetaStore, storeInstance);
   exports.tokenize = 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";
 
 
 })(this.o_spreadsheet = this.o_spreadsheet || {}, owl);