@odoo/o-spreadsheet 18.1.0-alpha.6 → 18.1.0-alpha.7

package/dist/o-spreadsheet.iife.js

@@ -2,9 +2,9 @@
 /**
  * This file is generated by o-spreadsheet build tools. Do not edit it.
  * @see https://github.com/odoo/o-spreadsheet
- * @version 18.1.0-alpha.6
- * @date 2024-11-28T09:06:59.527Z
- * @hash 875c901
+ * @version 18.1.0-alpha.7
+ * @date 2024-12-05T10:40:26.512Z
+ * @hash 7b1c39b
  */
 
 (function (exports, owl) {
@@ -171,10 +171,13 @@
   const ALERT_INFO_BORDER = "#98DBE2";
   const ALERT_INFO_TEXT_COLOR = "#09414A";
   const BADGE_SELECTED_COLOR = "#E6F2F3";
-  const DEFAULT_CHART_PADDING = 20;
-  const DEFAULT_CHART_FONT_SIZE = 22;
-  const SCORECARD_GAUGE_CHART_PADDING = 10;
-  const SCORECARD_GAUGE_CHART_FONT_SIZE = 14;
+  const CHART_PADDING$1 = 20;
+  const CHART_PADDING_BOTTOM = 10;
+  const CHART_PADDING_TOP = 15;
+  const CHART_TITLE_FONT_SIZE = 16;
+  const CHART_AXIS_TITLE_FONT_SIZE = 12;
+  const SCORECARD_CHART_TITLE_FONT_SIZE = 14;
+  const PIVOT_TOKEN_COLOR = "#F28C28";
   // Color picker defaults as upper case HEX to match `toHex`helper
   const COLOR_PICKER_DEFAULTS = [
       "#000000",
@@ -334,8 +337,8 @@
   const DEBOUNCE_TIME = 200;
   const MESSAGE_VERSION = 1;
   // Sheets
-  const FORBIDDEN_SHEET_CHARS = ["'", "*", "?", "/", "\\", "[", "]"];
-  const FORBIDDEN_IN_EXCEL_REGEX = /'|\*|\?|\/|\\|\[|\]/;
+  const FORBIDDEN_SHEETNAME_CHARS = ["'", "*", "?", "/", "\\", "[", "]"];
+  const FORBIDDEN_SHEETNAME_CHARS_IN_EXCEL_REGEX = /'|\*|\?|\/|\\|\[|\]/;
   // Cells
   const FORMULA_REF_IDENTIFIER = "|";
   // Components
@@ -388,6 +391,7 @@
   //------------------------------------------------------------------------------
   // Miscellaneous
   //------------------------------------------------------------------------------
+  const sanitizeSheetNameRegex = new RegExp(FORBIDDEN_SHEETNAME_CHARS_IN_EXCEL_REGEX, "g");
   /**
    * Remove quotes from a quoted string
    * ```js
@@ -483,6 +487,10 @@
       }
       return symbolName;
   }
+  /** Replace the excel-excluded characters of a sheetName */
+  function sanitizeSheetName(sheetName, replacementChar = " ") {
+      return sheetName.replace(sanitizeSheetNameRegex, replacementChar);
+  }
   function clip(val, min, max) {
       return val < min ? min : val > max ? max : val;
   }
@@ -9515,6 +9523,12 @@ stores.inject(MyMetaStore, storeInstance);
       }
       return relativeLuminance(backgroundColor) < 0.3 ? "#FFFFFF" : "#000000";
   }
+  function chartMutedFontColor(backgroundColor) {
+      if (!backgroundColor) {
+          return "#666666";
+      }
+      return relativeLuminance(backgroundColor) < 0.3 ? "#C8C8C8" : "#666666";
+  }
   function checkDataset(definition) {
       if (definition.dataSets) {
           const invalidRanges = definition.dataSets.find((range) => !rangeReference.test(range.dataRange)) !== undefined;
@@ -9650,8 +9664,8 @@ stores.inject(MyMetaStore, storeInstance);
       const yMin = chart.chartArea.top;
       const textsPositions = {};
       for (const dataset of chart._metasets) {
-          if (dataset.xAxisID === TREND_LINE_XAXIS_ID) {
-              return; // ignore trend lines
+          if (dataset.xAxisID === TREND_LINE_XAXIS_ID || dataset.hidden) {
+              continue;
           }
           for (let i = 0; i < dataset._parsed.length; i++) {
               const parsedValue = dataset._parsed[i];
@@ -10098,7 +10112,7 @@ stores.inject(MyMetaStore, storeInstance);
   function drawScoreChart(structure, canvas) {
       const ctx = canvas.getContext("2d");
       canvas.width = structure.canvas.width;
-      const availableWidth = canvas.width - DEFAULT_CHART_PADDING;
+      const availableWidth = canvas.width - CHART_PADDING$1 * 2;
       canvas.height = structure.canvas.height;
       ctx.fillStyle = structure.canvas.backgroundColor;
       ctx.fillRect(0, 0, structure.canvas.width, structure.canvas.height);
@@ -10233,10 +10247,9 @@ stores.inject(MyMetaStore, storeInstance);
   }
 
   /* Padding at the border of the chart */
-  const CHART_PADDING = SCORECARD_GAUGE_CHART_PADDING;
+  const CHART_PADDING = 10;
   const BOTTOM_PADDING_RATIO = 0.05;
   /* Maximum font sizes of each element */
-  const CHART_TITLE_FONT_SIZE = SCORECARD_GAUGE_CHART_FONT_SIZE;
   const KEY_VALUE_FONT_SIZE = 32;
   const BASELINE_MAX_FONT_SIZE = 16;
   function formatBaselineDescr(baselineDescr, baseline) {
@@ -10308,7 +10321,7 @@ stores.inject(MyMetaStore, storeInstance);
                       : this.height - (this.height - titleHeight - baselineHeight) / 2 - CHART_PADDING,
               },
           };
-          const minimalBaselinePosition = baselineArrowSize + DEFAULT_CHART_PADDING;
+          const minimalBaselinePosition = baselineArrowSize + CHART_PADDING * 2;
           if (structure.baseline.position.x < minimalBaselinePosition) {
               structure.baseline.position.x = minimalBaselinePosition;
           }
@@ -10388,7 +10401,7 @@ stores.inject(MyMetaStore, storeInstance);
           return this.runtime.background;
       }
       get secondaryFontColor() {
-          return relativeLuminance(this.backgroundColor) > 0.3 ? "#525252" : "#C8C8C8";
+          return chartMutedFontColor(this.backgroundColor);
       }
       getTextDimensions(text, font) {
           this.context.font = font;
@@ -10414,7 +10427,7 @@ stores.inject(MyMetaStore, storeInstance);
           }
           return {
               title: {
-                  font: getDefaultContextFont(CHART_TITLE_FONT_SIZE, this.runtime.title.bold, this.runtime.title.italic),
+                  font: getDefaultContextFont(this.runtime.title.fontSize ?? SCORECARD_CHART_TITLE_FONT_SIZE, this.runtime.title.bold, this.runtime.title.italic),
                   color: this.runtime.title.color ?? this.secondaryFontColor,
               },
               keyValue: {
@@ -21235,7 +21248,7 @@ stores.inject(MyMetaStore, storeInstance);
 
   const PIVOT_FUNCTIONS = ["PIVOT.VALUE", "PIVOT.HEADER", "PIVOT"];
   /**
-   * Create a proposal entry for the compose autowcomplete
+   * Create a proposal entry for the composer autocomplete
    * to insert a field name string in a formula.
    */
   function makeFieldProposal(field, granularity) {
@@ -22018,14 +22031,8 @@ stores.inject(MyMetaStore, storeInstance);
   const GAUGE_LABELS_FONT_SIZE = 12;
   const GAUGE_DEFAULT_VALUE_FONT_SIZE = 80;
   const GAUGE_BACKGROUND_COLOR = "#F3F2F1";
-  const GAUGE_TEXT_COLOR = "#666666";
-  const GAUGE_TEXT_COLOR_HIGH_CONTRAST = "#C8C8C8";
-  const GAUGE_INFLECTION_MARKER_COLOR = "#666666aa";
   const GAUGE_INFLECTION_LABEL_BOTTOM_MARGIN = 6;
   const GAUGE_TITLE_SECTION_HEIGHT = 25;
-  const GAUGE_TITLE_FONT_SIZE = SCORECARD_GAUGE_CHART_FONT_SIZE;
-  const GAUGE_TITLE_PADDING_LEFT = SCORECARD_GAUGE_CHART_PADDING;
-  const GAUGE_TITLE_PADDING_TOP = SCORECARD_GAUGE_CHART_PADDING;
   function drawGaugeChart(canvas, runtime) {
       const canvasBoundingRect = canvas.getBoundingClientRect();
       canvas.width = canvasBoundingRect.width;
@@ -22084,7 +22091,7 @@ stores.inject(MyMetaStore, storeInstance);
           ctx.translate(rectX + width / 2 - 0.5, rectY + height - 0.5); // -0.5 for sharper lines. see RendererPlugin.drawBorders comment
           ctx.rotate(Math.PI / 2 - inflectionValue.rotation);
           ctx.lineWidth = 2;
-          ctx.strokeStyle = GAUGE_INFLECTION_MARKER_COLOR;
+          ctx.strokeStyle = chartMutedFontColor(config.backgroundColor) + "aa";
           ctx.beginPath();
           ctx.moveTo(0, -(height - config.gauge.arcWidth));
           ctx.lineTo(0, -height - 3);
@@ -22138,22 +22145,22 @@ stores.inject(MyMetaStore, storeInstance);
           x: gaugeRect.x + gaugeRect.width - gaugeArcWidth / 2,
           y: gaugeRect.y + gaugeRect.height + GAUGE_LABELS_FONT_SIZE,
       };
-      const textColor = getContrastedTextColor(runtime.background);
+      const textColor = chartMutedFontColor(runtime.background);
       const inflectionValues = getInflectionValues(runtime, gaugeRect, textColor, ctx);
       let x = 0, titleWidth = 0, titleHeight = 0;
       if (runtime.title.text) {
-          ({ width: titleWidth, height: titleHeight } = computeTextDimension(ctx, runtime.title.text, { ...runtime.title, fontSize: GAUGE_TITLE_FONT_SIZE }, "px"));
+          ({ width: titleWidth, height: titleHeight } = computeTextDimension(ctx, runtime.title.text, { fontSize: CHART_TITLE_FONT_SIZE, ...runtime.title }, "px"));
       }
       switch (runtime.title.align) {
           case "right":
-              x = boundingRect.width - titleWidth - GAUGE_TITLE_PADDING_LEFT;
+              x = boundingRect.width - titleWidth - CHART_PADDING$1;
               break;
           case "center":
               x = (boundingRect.width - titleWidth) / 2;
               break;
           case "left":
           default:
-              x = GAUGE_TITLE_PADDING_LEFT;
+              x = CHART_PADDING$1;
               break;
       }
       return {
@@ -22161,10 +22168,10 @@ stores.inject(MyMetaStore, storeInstance);
           height: boundingRect.height,
           title: {
               label: runtime.title.text ?? "",
-              fontSize: GAUGE_TITLE_FONT_SIZE,
+              fontSize: runtime.title.fontSize ?? CHART_TITLE_FONT_SIZE,
               textPosition: {
                   x,
-                  y: GAUGE_TITLE_PADDING_TOP + titleHeight / 2,
+                  y: CHART_PADDING_TOP + titleHeight / 2,
               },
               color: runtime.title.color ?? textColor,
               bold: runtime.title.bold,
@@ -22281,11 +22288,6 @@ stores.inject(MyMetaStore, storeInstance);
       }
       return runtime.colors.at(-1);
   }
-  function getContrastedTextColor(backgroundColor) {
-      return relativeLuminance(backgroundColor) > 0.3
-          ? GAUGE_TEXT_COLOR
-          : GAUGE_TEXT_COLOR_HIGH_CONTRAST;
-  }
   function getSegmentsOfRectangle(rectangle) {
       return [
           { start: rectangle.topLeft, end: rectangle.topRight },
@@ -26999,13 +27001,12 @@ stores.inject(MyMetaStore, storeInstance);
       versionFrom: "7",
       migrate(data) {
           const namesTaken = [];
-          const globalForbiddenInExcel = new RegExp(FORBIDDEN_IN_EXCEL_REGEX, "g");
           for (let sheet of data.sheets || []) {
               if (!sheet.name) {
                   continue;
               }
               const oldName = sheet.name;
-              const escapedName = oldName.replace(globalForbiddenInExcel, "_");
+              const escapedName = sanitizeSheetName(oldName, "_");
               let i = 1;
               let newName = escapedName;
               while (namesTaken.includes(newName)) {
@@ -28241,37 +28242,45 @@ stores.inject(MyMetaStore, storeInstance);
       const labelRange = labelMax - labelMin;
       const normalizedLabels = labels.map((v) => (v - labelMin) / labelRange);
       const normalizedNewLabels = newLabels.map((v) => (v - labelMin) / labelRange);
-      switch (config.type) {
-          case "polynomial": {
-              const order = config.order ?? 2;
-              if (order === 1) {
-                  return predictLinearValues([values], [normalizedLabels], [normalizedNewLabels], true)[0];
-              }
-              const coeffs = polynomialRegression(values, normalizedLabels, order, true).flat();
-              return normalizedNewLabels.map((v) => evaluatePolynomial(coeffs, v, order));
-          }
-          case "exponential": {
-              const positiveLogValues = [];
-              const filteredLabels = [];
-              for (let i = 0; i < values.length; i++) {
-                  if (values[i] > 0) {
-                      positiveLogValues.push(Math.log(values[i]));
-                      filteredLabels.push(normalizedLabels[i]);
+      try {
+          switch (config.type) {
+              case "polynomial": {
+                  const order = config.order;
+                  if (!order) {
+                      return Array.from({ length: newLabels.length }, () => NaN);
+                  }
+                  if (order === 1) {
+                      return predictLinearValues([values], [normalizedLabels], [normalizedNewLabels], true)[0];
+                  }
+                  const coeffs = polynomialRegression(values, normalizedLabels, order, true).flat();
+                  return normalizedNewLabels.map((v) => evaluatePolynomial(coeffs, v, order));
+              }
+              case "exponential": {
+                  const positiveLogValues = [];
+                  const filteredLabels = [];
+                  for (let i = 0; i < values.length; i++) {
+                      if (values[i] > 0) {
+                          positiveLogValues.push(Math.log(values[i]));
+                          filteredLabels.push(normalizedLabels[i]);
+                      }
                   }
+                  if (!filteredLabels.length) {
+                      return Array.from({ length: newLabels.length }, () => NaN);
+                  }
+                  return expM(predictLinearValues([positiveLogValues], [filteredLabels], [normalizedNewLabels], true))[0];
               }
-              if (!filteredLabels.length) {
-                  return [];
+              case "logarithmic": {
+                  return predictLinearValues([values], logM([normalizedLabels]), logM([normalizedNewLabels]), true)[0];
               }
-              return expM(predictLinearValues([positiveLogValues], [filteredLabels], [normalizedNewLabels], true))[0];
-          }
-          case "logarithmic": {
-              return predictLinearValues([values], logM([normalizedLabels]), logM([normalizedNewLabels]), true)[0];
-          }
-          case "trailingMovingAverage": {
-              return getMovingAverageValues(values, config.window);
+              case "trailingMovingAverage": {
+                  return getMovingAverageValues(values, config.window);
+              }
+              default:
+                  return Array.from({ length: newLabels.length }, () => NaN);
           }
-          default:
-              return [];
+      }
+      catch (e) {
+          return Array.from({ length: newLabels.length }, () => NaN);
       }
   }
   function getChartAxisType(chart, labelRange, getters) {
@@ -28742,54 +28751,16 @@ stores.inject(MyMetaStore, storeInstance);
       return new ColorGenerator(dataSetsSize, definition.dataSets?.map((ds) => ds.backgroundColor) || []);
   }
 
-  function getCommonChartLayout(definition) {
-      // TODO FIXME: this is unused ATM. All the charts should probably use this instead oh whatever padding they are using now
-      // also look into how DEFAULT_CHART_PADDING is used in scorecards, it look strange
+  function getChartLayout(definition) {
       return {
           padding: {
-              left: DEFAULT_CHART_PADDING,
-              right: DEFAULT_CHART_PADDING,
-              top: definition.title?.text ? DEFAULT_CHART_PADDING / 2 : DEFAULT_CHART_PADDING + 5,
-              bottom: DEFAULT_CHART_PADDING,
+              left: CHART_PADDING$1,
+              right: CHART_PADDING$1,
+              top: CHART_PADDING_TOP,
+              bottom: CHART_PADDING_BOTTOM,
           },
       };
   }
-  function getBarChartLayout(definition) {
-      return {
-          padding: computeChartPadding({
-              displayTitle: !!definition.title?.text,
-              displayLegend: definition.legendPosition === "top",
-          }),
-      };
-  }
-  function getLineChartLayout(definition) {
-      return {
-          padding: computeChartPadding({
-              displayTitle: !!definition.title?.text,
-              displayLegend: definition.legendPosition === "top",
-          }),
-      };
-  }
-  function getPieChartLayout(definition) {
-      return {
-          padding: { left: 20, right: 20, top: definition.title ? 10 : 25, bottom: 10 },
-      };
-  }
-  function getWaterfallChartLayout(definition) {
-      return {
-          padding: { left: 20, right: 20, top: definition.title ? 10 : 25, bottom: 10 },
-      };
-  }
-  function computeChartPadding({ displayTitle, displayLegend, }) {
-      let top = 25;
-      if (displayTitle) {
-          top = 0;
-      }
-      else if (displayLegend) {
-          top = 10;
-      }
-      return { left: 20, right: 20, top, bottom: 10 };
-  }
 
   function getLegendDisplayOptions(definition, args) {
       return {
@@ -28847,11 +28818,12 @@ stores.inject(MyMetaStore, storeInstance);
       return {
           ...INTERACTIVE_LEGEND_CONFIG,
           ...getLegendDisplayOptions(definition),
-          labels: {
-              color: chartFontColor(definition.background),
-              boxHeight: 6,
-              usePointStyle: true,
-          },
+          ...getCustomLegendLabels(chartFontColor(definition.background), {
+              pointStyle: "circle",
+              // the stroke is the border around the circle, so increasing its size with the chart's color reduce the size of the circle
+              strokeStyle: definition.background || "#ffffff",
+              lineWidth: 8,
+          }),
       };
   }
   function getComboChartLegend(definition, args) {
@@ -28940,10 +28912,10 @@ stores.inject(MyMetaStore, storeInstance);
           target.style.cursor = "default";
       },
       onClick: (event, legendItem, legend) => {
-          if (!legend.legendItems) {
+          const index = legendItem.datasetIndex;
+          if (!legend.legendItems || index === undefined) {
               return;
           }
-          const index = legend.legendItems.indexOf(legendItem);
           if (legend.chart.isDatasetVisible(index)) {
               legend.chart.hide(index);
           }
@@ -28959,15 +28931,29 @@ stores.inject(MyMetaStore, storeInstance);
           labels: {
               color: fontColor,
               usePointStyle: true,
-              generateLabels: (chart) => chart.data.datasets.map((dataset, index) => ({
-                  text: dataset.label ?? "",
-                  fontColor,
-                  strokeStyle: dataset.borderColor,
-                  fillStyle: dataset.backgroundColor,
-                  hidden: !chart.isDatasetVisible(index),
-                  pointStyle: dataset.type === "line" ? "line" : "rect",
-                  ...legendLabelConfig,
-              })),
+              generateLabels: (chart) => chart.data.datasets.map((dataset, index) => {
+                  if (dataset["xAxisID"] === TREND_LINE_XAXIS_ID) {
+                      return {
+                          text: dataset.label ?? "",
+                          fontColor,
+                          strokeStyle: dataset.borderColor,
+                          hidden: !chart.isDatasetVisible(index),
+                          pointStyle: "line",
+                          datasetIndex: index,
+                          lineWidth: 3,
+                      };
+                  }
+                  return {
+                      text: dataset.label ?? "",
+                      fontColor,
+                      strokeStyle: dataset.borderColor,
+                      fillStyle: dataset.backgroundColor,
+                      hidden: !chart.isDatasetVisible(index),
+                      pointStyle: dataset.type === "line" ? "line" : "rect",
+                      datasetIndex: index,
+                      ...legendLabelConfig,
+                  };
+              }),
           },
       };
   }
@@ -29115,6 +29101,7 @@ stores.inject(MyMetaStore, storeInstance);
               font: {
                   style: italic ? "italic" : "normal",
                   weight: bold ? "bold" : "normal",
+                  size: design.title.fontSize ?? CHART_AXIS_TITLE_FONT_SIZE,
               },
               align: align === "left" ? "start" : align === "right" ? "end" : "center",
           };
@@ -29180,17 +29167,22 @@ stores.inject(MyMetaStore, storeInstance);
 
   function getChartTitle(definition) {
       const chartTitle = definition.title;
-      const fontColor = chartFontColor(definition.background);
+      const fontColor = chartMutedFontColor(definition.background);
       return {
           display: !!chartTitle.text,
           text: _t(chartTitle.text),
           color: chartTitle?.color ?? fontColor,
           align: chartTitle.align === "center" ? "center" : chartTitle.align === "right" ? "end" : "start",
           font: {
-              size: DEFAULT_CHART_FONT_SIZE,
+              size: definition.title.fontSize ?? CHART_TITLE_FONT_SIZE,
               weight: chartTitle.bold ? "bold" : "normal",
               style: chartTitle.italic ? "italic" : "normal",
           },
+          padding: {
+              // Disable title top/left/right padding to use the chart padding instead.
+              // The legend already has a top padding, so bottom padding is useless for the title there.
+              bottom: definition.legendPosition === "top" ? 0 : CHART_PADDING$1,
+          },
       };
   }
 
@@ -29337,26 +29329,23 @@ stores.inject(MyMetaStore, storeInstance);
     canChartParseLabels: canChartParseLabels,
     getBarChartData: getBarChartData,
     getBarChartDatasets: getBarChartDatasets,
-    getBarChartLayout: getBarChartLayout,
     getBarChartLegend: getBarChartLegend,
     getBarChartScales: getBarChartScales,
     getBarChartTooltip: getBarChartTooltip,
     getChartLabelFormat: getChartLabelFormat,
+    getChartLayout: getChartLayout,
     getChartShowValues: getChartShowValues,
     getChartTitle: getChartTitle,
     getComboChartDatasets: getComboChartDatasets,
     getComboChartLegend: getComboChartLegend,
-    getCommonChartLayout: getCommonChartLayout,
     getData: getData,
     getLineChartData: getLineChartData,
     getLineChartDatasets: getLineChartDatasets,
-    getLineChartLayout: getLineChartLayout,
     getLineChartLegend: getLineChartLegend,
     getLineChartScales: getLineChartScales,
     getLineChartTooltip: getLineChartTooltip,
     getPieChartData: getPieChartData,
     getPieChartDatasets: getPieChartDatasets,
-    getPieChartLayout: getPieChartLayout,
     getPieChartLegend: getPieChartLegend,
     getPieChartTooltip: getPieChartTooltip,
     getPyramidChartData: getPyramidChartData,
@@ -29372,7 +29361,6 @@ stores.inject(MyMetaStore, storeInstance);
     getScatterChartScales: getScatterChartScales,
     getTrendDatasetForBarChart: getTrendDatasetForBarChart,
     getTrendDatasetForLineChart: getTrendDatasetForLineChart,
-    getWaterfallChartLayout: getWaterfallChartLayout,
     getWaterfallChartLegend: getWaterfallChartLegend,
     getWaterfallChartScales: getWaterfallChartScales,
     getWaterfallChartTooltip: getWaterfallChartTooltip,
@@ -29520,7 +29508,7 @@ stores.inject(MyMetaStore, storeInstance);
           options: {
               ...CHART_COMMON_OPTIONS,
               indexAxis: chart.horizontal ? "y" : "x",
-              layout: getBarChartLayout(definition),
+              layout: getChartLayout(),
               scales: getBarChartScales(definition, chartData),
               plugins: {
                   title: getChartTitle(definition),
@@ -29672,7 +29660,7 @@ stores.inject(MyMetaStore, storeInstance);
           },
           options: {
               ...CHART_COMMON_OPTIONS,
-              layout: getBarChartLayout(definition),
+              layout: getChartLayout(),
               scales: getBarChartScales(definition, chartData),
               plugins: {
                   title: getChartTitle(definition),
@@ -30073,7 +30061,7 @@ stores.inject(MyMetaStore, storeInstance);
           },
           options: {
               ...CHART_COMMON_OPTIONS,
-              layout: getLineChartLayout(definition),
+              layout: getChartLayout(),
               scales: getLineChartScales(definition, chartData),
               plugins: {
                   title: getChartTitle(definition),
@@ -30208,7 +30196,7 @@ stores.inject(MyMetaStore, storeInstance);
           },
           options: {
               ...CHART_COMMON_OPTIONS,
-              layout: getPieChartLayout(definition),
+              layout: getChartLayout(),
               plugins: {
                   title: getChartTitle(definition),
                   legend: getPieChartLegend(definition, chartData),
@@ -30345,7 +30333,7 @@ stores.inject(MyMetaStore, storeInstance);
           options: {
               ...CHART_COMMON_OPTIONS,
               indexAxis: "y",
-              layout: getBarChartLayout(definition),
+              layout: getChartLayout(),
               scales: getPyramidChartScales(definition, chartData),
               plugins: {
                   title: getChartTitle(definition),
@@ -30494,7 +30482,7 @@ stores.inject(MyMetaStore, storeInstance);
           },
           options: {
               ...CHART_COMMON_OPTIONS,
-              layout: getBarChartLayout(definition),
+              layout: getChartLayout(),
               scales: getRadarChartScales(definition, chartData),
               plugins: {
                   title: getChartTitle(definition),
@@ -30647,7 +30635,7 @@ stores.inject(MyMetaStore, storeInstance);
           },
           options: {
               ...CHART_COMMON_OPTIONS,
-              layout: getLineChartLayout(definition),
+              layout: getChartLayout(),
               scales: getScatterChartScales(definition, chartData),
               plugins: {
                   title: getChartTitle(definition),
@@ -30808,7 +30796,7 @@ stores.inject(MyMetaStore, storeInstance);
           },
           options: {
               ...CHART_COMMON_OPTIONS,
-              layout: getWaterfallChartLayout(definition),
+              layout: getChartLayout(),
               scales: getWaterfallChartScales(definition, chartData),
               plugins: {
                   title: getChartTitle(definition),
@@ -33118,6 +33106,7 @@ stores.inject(MyMetaStore, storeInstance);
     adaptChartRange: adaptChartRange,
     chartFactory: chartFactory,
     chartFontColor: chartFontColor,
+    chartMutedFontColor: chartMutedFontColor,
     chartRuntimeFactory: chartRuntimeFactory,
     chartToImage: chartToImage,
     checkDataset: checkDataset,
@@ -37410,6 +37399,95 @@ stores.inject(MyMetaStore, storeInstance);
       }
   }
 
+  css /* scss */ `
+  .o-font-size-editor {
+    height: calc(100% - 4px);
+    input.o-font-size {
+      outline-color: ${SELECTION_BORDER_COLOR};
+      height: 20px;
+      width: 23px;
+    }
+  }
+  .o-text-options > div {
+    cursor: pointer;
+    line-height: 26px;
+    padding: 3px 12px;
+    &:hover {
+      background-color: rgba(0, 0, 0, 0.08);
+    }
+  }
+`;
+  class FontSizeEditor extends owl.Component {
+      static template = "o-spreadsheet-FontSizeEditor";
+      static props = {
+          currentFontSize: Number,
+          onFontSizeChanged: Function,
+          onToggle: { type: Function, optional: true },
+          class: String,
+      };
+      static components = { Popover };
+      fontSizes = FONT_SIZES;
+      dropdown = owl.useState({ isOpen: false });
+      inputRef = owl.useRef("inputFontSize");
+      rootEditorRef = owl.useRef("FontSizeEditor");
+      fontSizeListRef = owl.useRef("fontSizeList");
+      setup() {
+          owl.useExternalListener(window, "click", this.onExternalClick, { capture: true });
+      }
+      get popoverProps() {
+          const { x, y, width, height } = this.rootEditorRef.el.getBoundingClientRect();
+          return {
+              anchorRect: { x, y, width, height },
+              positioning: "BottomLeft",
+              verticalOffset: 0,
+          };
+      }
+      onExternalClick(ev) {
+          if (!isChildEvent(this.fontSizeListRef.el, ev) && !isChildEvent(this.rootEditorRef.el, ev)) {
+              this.closeFontList();
+          }
+      }
+      toggleFontList() {
+          const isOpen = this.dropdown.isOpen;
+          if (!isOpen) {
+              this.props.onToggle?.();
+              this.inputRef.el.focus();
+          }
+          else {
+              this.closeFontList();
+          }
+      }
+      closeFontList() {
+          this.dropdown.isOpen = false;
+      }
+      setSize(fontSizeStr) {
+          const fontSize = clip(Math.floor(parseFloat(fontSizeStr)), 1, 400);
+          this.props.onFontSizeChanged(fontSize);
+          this.closeFontList();
+      }
+      setSizeFromInput(ev) {
+          this.setSize(ev.target.value);
+      }
+      setSizeFromList(fontSizeStr) {
+          this.setSize(fontSizeStr);
+      }
+      onInputFocused(ev) {
+          this.dropdown.isOpen = true;
+          ev.target.select();
+      }
+      onInputKeydown(ev) {
+          if (ev.key === "Enter" || ev.key === "Escape") {
+              this.closeFontList();
+              const target = ev.target;
+              // In the case of a ESCAPE key, we get the previous font size back
+              if (ev.key === "Escape") {
+                  target.value = `${this.props.currentFontSize}`;
+              }
+              this.props.onToggle?.();
+          }
+      }
+  }
+
   css /* scss */ `
   .o-chart-title-designer {
     > span {
@@ -37444,7 +37522,7 @@ stores.inject(MyMetaStore, storeInstance);
 `;
   class ChartTitle extends owl.Component {
       static template = "o-spreadsheet.ChartTitle";
-      static components = { Section, ColorPickerWidget };
+      static components = { Section, ColorPickerWidget, FontSizeEditor };
       static props = {
           title: { type: String, optional: true },
           updateTitle: Function,
@@ -37453,7 +37531,8 @@ stores.inject(MyMetaStore, storeInstance);
           toggleBold: { type: Function, optional: true },
           updateAlignment: { type: Function, optional: true },
           updateColor: { type: Function, optional: true },
-          style: { type: Object, optional: true },
+          style: Object,
+          onFontSizeChanged: Function,
       };
       static defaultProps = {
           title: "",
@@ -37468,6 +37547,9 @@ stores.inject(MyMetaStore, storeInstance);
       updateTitle(ev) {
           this.props.updateTitle(ev.target.value);
       }
+      updateFontSize(fontSize) {
+          this.props.onFontSizeChanged(fontSize);
+      }
       toggleDropdownTool(tool, ev) {
           const isOpen = this.state.activeTool === tool;
           this.closeMenus();
@@ -37510,6 +37592,7 @@ stores.inject(MyMetaStore, storeInstance);
           return {
               color: "",
               align: "center",
+              fontSize: CHART_AXIS_TITLE_FONT_SIZE,
               ...axisDesign.title,
           };
       }
@@ -37527,6 +37610,17 @@ stores.inject(MyMetaStore, storeInstance);
           };
           this.props.updateChart(this.props.figureId, { axesDesign });
       }
+      updateAxisTitleFontSize(fontSize) {
+          const axesDesign = this.props.definition.axesDesign ?? {};
+          axesDesign[this.state.currentAxis] = {
+              ...axesDesign[this.state.currentAxis],
+              title: {
+                  ...(axesDesign[this.state.currentAxis]?.title ?? {}),
+                  fontSize,
+              },
+          };
+          this.props.updateChart(this.props.figureId, { axesDesign });
+      }
       toggleBoldAxisTitle() {
           const axesDesign = this.props.definition.axesDesign ?? {};
           const title = axesDesign[this.state.currentAxis]?.title ?? {};
@@ -37646,8 +37740,12 @@ stores.inject(MyMetaStore, storeInstance);
           figureId: String,
           definition: Object,
           updateChart: Function,
+          defaultChartTitleFontSize: { type: Number, optional: true },
           slots: { type: Object, optional: true },
       };
+      static defaultProps = {
+          defaultChartTitleFontSize: CHART_TITLE_FONT_SIZE,
+      };
       state;
       setup() {
           this.state = owl.useState({
@@ -37673,6 +37771,7 @@ stores.inject(MyMetaStore, storeInstance);
       get titleStyle() {
           return {
               align: "left",
+              fontSize: this.props.defaultChartTitleFontSize,
               ...this.title,
           };
       }
@@ -37681,6 +37780,10 @@ stores.inject(MyMetaStore, storeInstance);
           this.props.updateChart(this.props.figureId, { title });
           this.state.activeTool = "";
       }
+      updateChartTitleFontSize(fontSize) {
+          const title = { ...this.title, fontSize };
+          this.props.updateChart(this.props.figureId, { title });
+      }
       toggleBoldChartTitle() {
           let title = this.title;
           title = { ...title, bold: !title.bold };
@@ -37888,7 +37991,7 @@ stores.inject(MyMetaStore, storeInstance);
               case "polynomial":
                   config = {
                       type: "polynomial",
-                      order: type === "linear" ? 1 : 2,
+                      order: type === "linear" ? 1 : this.getMaxPolynomialDegree(index),
                   };
                   break;
               case "exponential":
@@ -38348,6 +38451,9 @@ stores.inject(MyMetaStore, storeInstance);
       get humanizeNumbersLabel() {
           return _t("Humanize numbers");
       }
+      get defaultScorecardTitleFontSize() {
+          return SCORECARD_CHART_TITLE_FONT_SIZE;
+      }
       updateHumanizeNumbers(humanize) {
           this.props.updateChart(this.props.figureId, { humanize });
       }
@@ -39811,6 +39917,15 @@ stores.inject(MyMetaStore, storeInstance);
       confirmEdition(content) {
           this.args().onConfirm(content);
       }
+      getTokenColor(token) {
+          if (token.type === "SYMBOL") {
+              const matchedColor = this.args().getContextualColoredSymbolToken?.(token);
+              if (matchedColor) {
+                  return matchedColor;
+              }
+          }
+          return super.getTokenColor(token);
+      }
   }
 
   css /* scss */ `
@@ -39848,6 +39963,7 @@ stores.inject(MyMetaStore, storeInstance);
           placeholder: { type: String, optional: true },
           class: { type: String, optional: true },
           invalid: { type: Boolean, optional: true },
+          getContextualColoredSymbolToken: { type: Function, optional: true },
       };
       static components = { Composer };
       static defaultProps = {
@@ -39864,6 +39980,7 @@ stores.inject(MyMetaStore, storeInstance);
               content: this.props.composerContent,
               contextualAutocomplete: this.props.contextualAutocomplete,
               defaultRangeSheetId: this.props.defaultRangeSheetId,
+              getContextualColoredSymbolToken: this.props.getContextualColoredSymbolToken,
           }));
           this.standaloneComposerStore = standaloneComposerStore;
           this.composerInterface = {
@@ -43424,7 +43541,7 @@ stores.inject(MyMetaStore, storeInstance);
                   return {
                       text: text,
                       description: measure.displayName,
-                      htmlContent: [{ value: text, color: tokenColors.FUNCTION }],
+                      htmlContent: [{ value: text, color: PIVOT_TOKEN_COLOR }],
                       fuzzySearchKey: measure.displayName + text + measure.fieldName,
                   };
               });
@@ -43433,7 +43550,7 @@ stores.inject(MyMetaStore, storeInstance);
                   return {
                       text: text,
                       description: dimension.displayName,
-                      htmlContent: [{ value: text, color: tokenColors.FUNCTION }],
+                      htmlContent: [{ value: text, color: PIVOT_TOKEN_COLOR }],
                       fuzzySearchKey: dimension.displayName + text + dimension.fieldName,
                   };
               });
@@ -43513,6 +43630,18 @@ stores.inject(MyMetaStore, storeInstance);
               measure: this.props.measure,
           });
       }
+      getColoredSymbolToken(token) {
+          if (token.type !== "SYMBOL") {
+              return undefined;
+          }
+          const tokenValue = unquote(token.value, "'");
+          if (this.props.definition.columns.some((col) => col.nameWithGranularity === tokenValue) ||
+              this.props.definition.rows.some((row) => row.nameWithGranularity === tokenValue) ||
+              this.props.definition.measures.some((measure) => measure.id === tokenValue && measure.id !== this.props.measure.id)) {
+              return PIVOT_TOKEN_COLOR;
+          }
+          return undefined;
+      }
   }
 
   css /* scss */ `
@@ -51887,7 +52016,7 @@ stores.inject(MyMetaStore, storeInstance);
               for (let col = zone.left; col <= zone.right; col++) {
                   for (let row = zone.top; row <= zone.bottom; row++) {
                       const cell = this.getters.getCell({ sheetId, col, row });
-                      if (cell) {
+                      if (cell?.isFormula || cell?.content) {
                           this.dispatch("UPDATE_CELL", {
                               sheetId: sheetId,
                               content: "",
@@ -51923,7 +52052,6 @@ stores.inject(MyMetaStore, storeInstance);
           for (let zone of recomputeZones(zones)) {
               for (let col = zone.left; col <= zone.right; col++) {
                   for (let row = zone.top; row <= zone.bottom; row++) {
-                      // commandHelpers.updateCell(sheetId, col, row, { style: undefined});
                       this.dispatch("UPDATE_CELL", {
                           sheetId,
                           col,
@@ -55342,7 +55470,7 @@ stores.inject(MyMetaStore, storeInstance);
           if (orderedSheetIds.find((id) => sheets[id]?.name.toLowerCase() === name && id !== cmd.sheetId)) {
               return "DuplicatedSheetName" /* CommandResult.DuplicatedSheetName */;
           }
-          if (FORBIDDEN_IN_EXCEL_REGEX.test(name)) {
+          if (FORBIDDEN_SHEETNAME_CHARS_IN_EXCEL_REGEX.test(name)) {
               return "ForbiddenCharactersInSheetName" /* CommandResult.ForbiddenCharactersInSheetName */;
           }
           return "Success" /* CommandResult.Success */;
@@ -60750,11 +60878,13 @@ stores.inject(MyMetaStore, storeInstance);
               return EMPTY_PIVOT_CELL;
           }
           if (functionName === "PIVOT") {
-              const includeTotal = args[2] === false ? false : undefined;
-              const includeColumnHeaders = args[3] === false ? false : undefined;
+              const includeTotal = toScalar(args[2]);
+              const shouldIncludeTotal = includeTotal === undefined ? true : toBoolean(includeTotal);
+              const includeColumnHeaders = toScalar(args[3]);
+              const shouldIncludeColumnHeaders = includeColumnHeaders === undefined ? true : toBoolean(includeColumnHeaders);
               const pivotCells = pivot
                   .getTableStructure()
-                  .getPivotCells(includeTotal, includeColumnHeaders);
+                  .getPivotCells(shouldIncludeTotal, shouldIncludeColumnHeaders);
               const pivotCol = position.col - mainPosition.col;
               const pivotRow = position.row - mainPosition.row;
               return pivotCells[pivotCol][pivotRow];
@@ -62908,7 +63038,7 @@ stores.inject(MyMetaStore, storeInstance);
       getPivotDuplicateSheetName(pivotName) {
           let i = 1;
           const names = this.getters.getSheetIds().map((id) => this.getters.getSheetName(id));
-          const sanitizedName = pivotName.replace(new RegExp(FORBIDDEN_IN_EXCEL_REGEX, "g"), " ");
+          const sanitizedName = sanitizeSheetName(pivotName);
           let name = sanitizedName;
           while (names.includes(name)) {
               name = `${sanitizedName} (${i})`;
@@ -66984,7 +67114,7 @@ stores.inject(MyMetaStore, storeInstance);
           env.raiseError(_t("A sheet with the name %s already exists. Please select another name.", name), errorCallback);
       }
       else if (result.reasons.includes("ForbiddenCharactersInSheetName" /* CommandResult.ForbiddenCharactersInSheetName */)) {
-          env.raiseError(_t("Some used characters are not allowed in a sheet name (Forbidden characters are %s).", FORBIDDEN_SHEET_CHARS.join(" ")), errorCallback);
+          env.raiseError(_t("Some used characters are not allowed in a sheet name (Forbidden characters are %s).", FORBIDDEN_SHEETNAME_CHARS.join(" ")), errorCallback);
       }
   }
 
@@ -68214,7 +68344,7 @@ stores.inject(MyMetaStore, storeInstance);
       setup() {
           owl.onWillUpdateProps((nextProps) => {
               if (nextProps.action !== this.props.action) {
-                  this.actionButton = createAction(this.props.action);
+                  this.actionButton = createAction(nextProps.action);
               }
           });
       }
@@ -68550,88 +68680,6 @@ stores.inject(MyMetaStore, storeInstance);
       }
   }
 
-  css /* scss */ `
-  .o-font-size-editor {
-    height: calc(100% - 4px);
-    input.o-font-size {
-      outline-color: ${SELECTION_BORDER_COLOR};
-      height: 20px;
-      width: 23px;
-    }
-  }
-  .o-text-options > div {
-    cursor: pointer;
-    line-height: 26px;
-    padding: 3px 12px;
-    &:hover {
-      background-color: rgba(0, 0, 0, 0.08);
-    }
-  }
-`;
-  class FontSizeEditor extends owl.Component {
-      static template = "o-spreadsheet-FontSizeEditor";
-      static props = {
-          onToggle: Function,
-          dropdownStyle: String,
-          class: String,
-      };
-      static components = {};
-      fontSizes = FONT_SIZES;
-      dropdown = owl.useState({ isOpen: false });
-      inputRef = owl.useRef("inputFontSize");
-      rootEditorRef = owl.useRef("FontSizeEditor");
-      setup() {
-          owl.useExternalListener(window, "click", this.onExternalClick, { capture: true });
-      }
-      onExternalClick(ev) {
-          if (!isChildEvent(this.rootEditorRef.el, ev)) {
-              this.closeFontList();
-          }
-      }
-      get currentFontSize() {
-          return this.env.model.getters.getCurrentStyle().fontSize || DEFAULT_FONT_SIZE;
-      }
-      toggleFontList() {
-          const isOpen = this.dropdown.isOpen;
-          if (!isOpen) {
-              this.props.onToggle();
-              this.inputRef.el.focus();
-          }
-          else {
-              this.closeFontList();
-          }
-      }
-      closeFontList() {
-          this.dropdown.isOpen = false;
-      }
-      setSize(fontSizeStr) {
-          const fontSize = clip(Math.floor(parseFloat(fontSizeStr)), 1, 400);
-          setStyle(this.env, { fontSize });
-          this.closeFontList();
-      }
-      setSizeFromInput(ev) {
-          this.setSize(ev.target.value);
-      }
-      setSizeFromList(fontSizeStr) {
-          this.setSize(fontSizeStr);
-      }
-      onInputFocused(ev) {
-          this.dropdown.isOpen = true;
-          ev.target.select();
-      }
-      onInputKeydown(ev) {
-          if (ev.key === "Enter" || ev.key === "Escape") {
-              this.closeFontList();
-              const target = ev.target;
-              // In the case of a ESCAPE key, we get the previous font size back
-              if (ev.key === "Escape") {
-                  target.value = `${this.currentFontSize}`;
-              }
-              this.props.onToggle();
-          }
-      }
-  }
-
   class TableDropdownButton extends owl.Component {
       static template = "o-spreadsheet-TableDropdownButton";
       static components = { TableStylesPopover, ActionButton };
@@ -68800,9 +68848,6 @@ stores.inject(MyMetaStore, storeInstance);
           onClick: Function,
           dropdownMaxHeight: Number,
       };
-      get dropdownStyle() {
-          return `max-height:${this.props.dropdownMaxHeight}px`;
-      }
       static components = {
           ColorPickerWidget,
           ColorPicker,
@@ -68840,6 +68885,9 @@ stores.inject(MyMetaStore, storeInstance);
               .getAllOrdered()
               .filter((item) => !item.isVisible || item.isVisible(this.env));
       }
+      get currentFontSize() {
+          return this.env.model.getters.getCurrentStyle().fontSize || DEFAULT_FONT_SIZE;
+      }
       onExternalClick(ev) {
           // TODO : manage click events better. We need this piece of code
           // otherwise the event opening the menu would close it on the same frame.
@@ -68918,6 +68966,9 @@ stores.inject(MyMetaStore, storeInstance);
           setStyle(this.env, { [target]: color });
           this.onClick();
       }
+      setFontSize(fontSize) {
+          setStyle(this.env, { fontSize });
+      }
   }
 
   function instantiateClipboard() {
@@ -70918,12 +70969,11 @@ stores.inject(MyMetaStore, storeInstance);
       // <manualLayout/> to manually position the chart in the figure container
       let title = escapeXml ``;
       if (chart.data.title?.text) {
-          const color = chart.data.title.color
-              ? toXlsxHexColor(chart.data.title.color)
-              : chart.data.fontColor;
+          const titleColor = toXlsxHexColor(chartMutedFontColor(chart.data.backgroundColor));
+          const fontSize = chart.data.title.fontSize ?? CHART_TITLE_FONT_SIZE;
           title = escapeXml /*xml*/ `
       <c:title>
-        ${insertText(chart.data.title.text, color, DEFAULT_CHART_FONT_SIZE, chart.data.title)}
+        ${insertText(chart.data.title.text, titleColor, fontSize, chart.data.title)}
         <c:overlay val="0" />
       </c:title>
     `;
@@ -71013,7 +71063,7 @@ stores.inject(MyMetaStore, storeInstance);
     </a:ln>
   `;
   }
-  function insertText(text, fontColor = "000000", fontsize = DEFAULT_CHART_FONT_SIZE, style = {}) {
+  function insertText(text, fontColor = "000000", fontsize = CHART_TITLE_FONT_SIZE, style = {}) {
       return escapeXml /*xml*/ `
     <c:tx>
       <c:rich>
@@ -71514,6 +71564,7 @@ stores.inject(MyMetaStore, storeInstance);
       // Each Axis present inside a graph needs to be identified by an unsigned integer in order to be referenced by its crossAxis.
       // I.e. x-axis, will reference y-axis and vice-versa.
       const color = title?.color ? toXlsxHexColor(title.color) : defaultFontColor;
+      const fontSize = title?.fontSize ?? CHART_AXIS_TITLE_FONT_SIZE;
       return escapeXml /*xml*/ `
     <${axisName}>
       <c:axId val="${axId}"/>
@@ -71529,7 +71580,7 @@ stores.inject(MyMetaStore, storeInstance);
       <c:minorTickMark val="none" />
       <c:numFmt formatCode="General" sourceLinked="1" />
       <c:title>
-        ${insertText(title?.text ?? "", color, 10, title)}
+        ${insertText(title?.text ?? "", color, fontSize, title)}
       </c:title>
       ${insertTextProperties(10, defaultFontColor)}
     </${axisName}>
@@ -73640,6 +73691,7 @@ stores.inject(MyMetaStore, storeInstance);
       createPivotFormula,
       areDomainArgsFieldsValid,
       splitReference,
+      sanitizeSheetName,
   };
   const links = {
       isMarkdownLink,
@@ -73778,9 +73830,9 @@ stores.inject(MyMetaStore, storeInstance);
   exports.tokenize = tokenize;
 
 
-  __info__.version = "18.1.0-alpha.6";
-  __info__.date = "2024-11-28T09:06:59.527Z";
-  __info__.hash = "875c901";
+  __info__.version = "18.1.0-alpha.7";
+  __info__.date = "2024-12-05T10:40:26.512Z";
+  __info__.hash = "7b1c39b";
 
 
 })(this.o_spreadsheet = this.o_spreadsheet || {}, owl);