@odoo/o-spreadsheet 17.2.0-alpha.1 → 17.2.0-alpha.2

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 17.2.0-alpha.1
- * @date 2024-01-17T10:27:26.763Z
- * @hash 296f467
+ * @version 17.2.0-alpha.2
+ * @date 2024-01-29T13:55:57.132Z
+ * @hash 03c1335
  */
 
 (function (exports, owl) {
@@ -2061,6 +2061,7 @@
       CommandResult["BlockingValidationRule"] = "BlockingValidationRule";
       CommandResult["InvalidCopyPasteSelection"] = "InvalidCopyPasteSelection";
       CommandResult["NoChanges"] = "NoChanges";
+      CommandResult["InvalidInputId"] = "InvalidInputId";
   })(exports.CommandResult || (exports.CommandResult = {}));
 
   const PLAIN_TEXT_FORMAT = "@"; // see OpenXML spec §18.8.31
@@ -2122,34 +2123,34 @@
   const errorTypes = new Set(Object.values(CellErrorType));
   class EvaluationError extends Error {
       value;
-      constructor(message, value = CellErrorType.GenericError) {
-          super(message || _t("Error"));
+      constructor(message = _t("Error"), value = CellErrorType.GenericError) {
+          super(message);
           this.value = value;
       }
   }
   class BadExpressionError extends EvaluationError {
-      constructor(message) {
-          super(message || _t("Invalid expression"), CellErrorType.BadExpression);
+      constructor(message = _t("Invalid expression")) {
+          super(message, CellErrorType.BadExpression);
       }
   }
   class CircularDependencyError extends EvaluationError {
-      constructor(message) {
-          super(message || _t("Circular reference"), CellErrorType.CircularDependency);
+      constructor(message = _t("Circular reference")) {
+          super(message, CellErrorType.CircularDependency);
       }
   }
   class InvalidReferenceError extends EvaluationError {
-      constructor(message) {
-          super(message || _t("Invalid reference"), CellErrorType.InvalidReference);
+      constructor(message = _t("Invalid reference")) {
+          super(message, CellErrorType.InvalidReference);
       }
   }
   class NotAvailableError extends EvaluationError {
-      constructor(message) {
-          super(message || _t("Data not available"), CellErrorType.NotAvailable);
+      constructor(message = _t("Data not available")) {
+          super(message, CellErrorType.NotAvailable);
       }
   }
   class UnknownFunctionError extends EvaluationError {
-      constructor(message) {
-          super(message || _t("Unknown function"), CellErrorType.UnknownFunction);
+      constructor(message = _t("Unknown function")) {
+          super(message, CellErrorType.UnknownFunction);
       }
   }
 
@@ -3315,27 +3316,30 @@
   }
   function createLargeNumberFormat(format, magnitude, postFix, locale) {
       const internalFormat = parseFormat(format || "#,##0");
-      const largeNumberFormat = internalFormat
-          .map((formatPart) => {
-          if (formatPart.type === "NUMBER") {
-              return [
-                  {
-                      ...formatPart,
-                      format: {
-                          ...formatPart.format,
-                          magnitude,
-                          decimalPart: undefined,
-                      },
-                  },
-                  {
-                      type: "STRING",
-                      format: postFix,
-                  },
-              ];
+      const largeNumberFormat = [];
+      for (let i = 0; i < internalFormat.length; i++) {
+          const formatPart = internalFormat[i];
+          if (formatPart.type !== "NUMBER") {
+              largeNumberFormat.push(formatPart);
+              continue;
           }
-          return formatPart;
-      })
-          .flat();
+          largeNumberFormat.push({
+              ...formatPart,
+              format: {
+                  ...formatPart.format,
+                  magnitude,
+                  decimalPart: undefined,
+              },
+          });
+          largeNumberFormat.push({
+              type: "STRING",
+              format: postFix,
+          });
+          const nextFormatPart = internalFormat[i + 1];
+          if (nextFormatPart?.type === "STRING" && ["k", "m", "b"].includes(nextFormatPart.format)) {
+              i++;
+          }
+      }
       return convertInternalFormatToFormat(largeNumberFormat);
   }
   function changeDecimalPlaces(format, step, locale) {
@@ -6692,170 +6696,852 @@
       },
   };
 
-  const macRegex = /Mac/i;
-  /**
-   * Return true if the event was triggered from
-   * a child element.
-   */
-  function isChildEvent(parent, ev) {
-      return !!ev.target && parent.contains(ev.target);
+  const LINK_TOOLTIP_HEIGHT = 32;
+  const LINK_TOOLTIP_WIDTH = 220;
+  css /* scss */ `
+  .o-link-tool {
+    font-size: 13px;
+    background-color: white;
+    box-shadow: 0 1px 4px 3px rgba(60, 64, 67, 0.15);
+    padding: 6px 12px;
+    border-radius: 4px;
+    display: flex;
+    justify-content: space-between;
+    height: ${LINK_TOOLTIP_HEIGHT}px;
+    width: ${LINK_TOOLTIP_WIDTH}px;
+    box-sizing: border-box !important;
+
+    img {
+      margin-right: 3px;
+      width: 16px;
+      height: 16px;
+    }
+
+    a.o-link {
+      color: #01666b;
+      text-decoration: none;
+      flex-grow: 2;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+    a.o-link:hover {
+      text-decoration: none;
+      color: #001d1f;
+      cursor: pointer;
+    }
   }
-  function gridOverlayPosition() {
-      const spreadsheetElement = document.querySelector(".o-grid-overlay");
-      if (spreadsheetElement) {
-          const { top, left } = spreadsheetElement?.getBoundingClientRect();
-          return { top, left };
-      }
-      throw new Error("Can't find spreadsheet position");
+  .o-link-icon {
+    float: right;
+    padding-left: 5px;
+    .o-icon {
+      height: 16px;
+    }
   }
-  function getBoundingRectAsPOJO(el) {
-      const rect = el.getBoundingClientRect();
-      return {
-          x: rect.x,
-          y: rect.y,
-          width: rect.width,
-          height: rect.height,
-      };
+  .o-link-icon .o-icon {
+    height: 13px;
   }
-  /**
-   * Iterate over all the children of `el` in the dom tree starting at `el`, depth first.
-   */
-  function* iterateChildren(el) {
-      yield el;
-      if (el.hasChildNodes()) {
-          for (let child of el.childNodes) {
-              yield* iterateChildren(child);
+  .o-link-icon:hover {
+    cursor: pointer;
+    color: #000;
+  }
+`;
+  class LinkDisplay extends owl.Component {
+      static template = "o-spreadsheet-LinkDisplay";
+      static props = {
+          cellPosition: Object,
+          onClosed: { type: Function, optional: true },
+      };
+      get cell() {
+          const { col, row } = this.props.cellPosition;
+          const sheetId = this.env.model.getters.getActiveSheetId();
+          return this.env.model.getters.getEvaluatedCell({ sheetId, col, row });
+      }
+      get link() {
+          if (this.cell.link) {
+              return this.cell.link;
           }
+          const { col, row } = this.props.cellPosition;
+          throw new Error(`LinkDisplay Component can only be used with link cells. ${toXC(col, row)} is not a link.`);
+      }
+      getUrlRepresentation(link) {
+          return urlRepresentation(link, this.env.model.getters);
+      }
+      openLink() {
+          openLink(this.link, this.env);
+      }
+      edit() {
+          const { col, row } = this.props.cellPosition;
+          this.env.model.dispatch("OPEN_CELL_POPOVER", {
+              col,
+              row,
+              popoverType: "LinkEditor",
+          });
+      }
+      unlink() {
+          const sheetId = this.env.model.getters.getActiveSheetId();
+          const { col, row } = this.props.cellPosition;
+          const style = this.env.model.getters.getCellComputedStyle({ sheetId, col, row });
+          const textColor = style?.textColor === LINK_COLOR ? undefined : style?.textColor;
+          this.env.model.dispatch("UPDATE_CELL", {
+              col,
+              row,
+              sheetId,
+              content: this.link.label,
+              style: { ...style, textColor, underline: undefined },
+          });
       }
   }
-  function getOpenedMenus() {
-      return Array.from(document.querySelectorAll(".o-spreadsheet .o-menu"));
-  }
-  const letterRegex = /^[a-zA-Z]$/;
+  const LinkCellPopoverBuilder = {
+      onHover: (position, getters) => {
+          const cell = getters.getEvaluatedCell(position);
+          const shouldDisplayLink = !getters.isDashboard() && cell.link && getters.isVisibleInViewport(position);
+          if (!shouldDisplayLink)
+              return { isOpen: false };
+          return {
+              isOpen: true,
+              Component: LinkDisplay,
+              props: { cellPosition: position },
+              cellCorner: "BottomLeft",
+          };
+      },
+  };
+
   /**
-   * Transform a keyboard event into a shortcut string that represent this event. The letters keys will be uppercased.
+   * Tokenizer
    *
-   * @argument ev - The keyboard event to transform
-   * @argument mode - Use either ev.key of ev.code to get the string shortcut
+   * A tokenizer is a piece of code whose job is to transform a string into a list
+   * of "tokens". For example, "(12+" is converted into:
+   *   [{type: "LEFT_PAREN", value: "("},
+   *    {type: "NUMBER", value: "12"},
+   *    {type: "OPERATOR", value: "+"}]
    *
-   * @example
-   * event : { ctrlKey: true, key: "a" } => "Ctrl+A"
-   * event : { shift: true, alt: true, key: "Home" } => "Alt+Shift+Home"
+   * As the example shows, a tokenizer does not care about the meaning behind those
+   * tokens. It only cares about the structure.
+   *
+   * The tokenizer is usually the first step in a compilation pipeline.  Also, it
+   * is useful for the composer, which needs to be able to work with incomplete
+   * formulas.
    */
-  function keyboardEventToShortcutString(ev, mode = "key") {
-      let keyDownString = "";
-      if (isCtrlKey(ev) && ev.key !== "Ctrl")
-          keyDownString += "Ctrl+";
-      if (ev.metaKey)
-          keyDownString += "Ctrl+";
-      if (ev.altKey && ev.key !== "Alt")
-          keyDownString += "Alt+";
-      if (ev.shiftKey && ev.key !== "Shift")
-          keyDownString += "Shift+";
-      const key = mode === "key" ? ev.key : ev.code;
-      keyDownString += letterRegex.test(key) ? key.toUpperCase() : key;
-      return keyDownString;
+  const POSTFIX_UNARY_OPERATORS = ["%"];
+  const OPERATORS = "+,-,*,/,:,=,<>,>=,>,<=,<,^,&".split(",").concat(POSTFIX_UNARY_OPERATORS);
+  function tokenize(str, locale = DEFAULT_LOCALE) {
+      str = replaceSpecialSpaces(str);
+      const chars = new TokenizingChars(str);
+      const result = [];
+      while (!chars.isOver()) {
+          let token = tokenizeSpace(chars) ||
+              tokenizeArgsSeparator(chars, locale) ||
+              tokenizeMisc(chars) ||
+              tokenizeOperator(chars) ||
+              tokenizeString(chars) ||
+              tokenizeDebugger(chars) ||
+              tokenizeInvalidRange(chars) ||
+              tokenizeNumber(chars, locale) ||
+              tokenizeSymbol(chars);
+          if (!token) {
+              token = { type: "UNKNOWN", value: chars.shift() };
+          }
+          result.push(token);
+      }
+      return result;
   }
-  function isMacOS() {
-      return Boolean(macRegex.test(navigator.userAgent));
+  function tokenizeDebugger(chars) {
+      if (chars.current === "?") {
+          chars.shift();
+          return { type: "DEBUGGER", value: "?" };
+      }
+      return null;
   }
-  /**
-   * @param {KeyboardEvent | MouseEvent} ev
-   * @returns Returns true if the event was triggered with the "ctrl" modifier pressed.
-   * On Mac, this is the "meta" or "command" key.
-   */
-  function isCtrlKey(ev) {
-      return isMacOS() ? ev.metaKey : ev.ctrlKey;
+  const misc$1 = {
+      "(": "LEFT_PAREN",
+      ")": "RIGHT_PAREN",
+  };
+  function tokenizeMisc(chars) {
+      if (chars.current in misc$1) {
+          const value = chars.shift();
+          const type = misc$1[value];
+          return { type, value };
+      }
+      return null;
   }
-
-  /**
-   * Return the o-spreadsheet element position relative
-   * to the browser viewport.
-   */
-  function useSpreadsheetRect() {
-      const position = owl.useState({ x: 0, y: 0, width: 0, height: 0 });
-      let spreadsheetElement = document.querySelector(".o-spreadsheet");
-      updatePosition();
-      function updatePosition() {
-          if (!spreadsheetElement) {
-              spreadsheetElement = document.querySelector(".o-spreadsheet");
+  function tokenizeArgsSeparator(chars, locale) {
+      if (chars.current === locale.formulaArgSeparator) {
+          const value = chars.shift();
+          const type = "ARG_SEPARATOR";
+          return { type, value };
+      }
+      return null;
+  }
+  function tokenizeOperator(chars) {
+      for (let op of OPERATORS) {
+          if (chars.currentStartsWith(op)) {
+              chars.advanceBy(op.length);
+              return { type: "OPERATOR", value: op };
           }
-          if (spreadsheetElement) {
-              const { top, left, width, height } = spreadsheetElement.getBoundingClientRect();
-              position.x = left;
-              position.y = top;
-              position.width = width;
-              position.height = height;
+      }
+      return null;
+  }
+  function tokenizeNumber(chars, locale) {
+      const match = chars.remaining().match(getFormulaNumberRegex(locale.decimalSeparator));
+      if (match) {
+          chars.advanceBy(match[0].length);
+          return { type: "NUMBER", value: match[0] };
+      }
+      return null;
+  }
+  function tokenizeString(chars) {
+      if (chars.current === '"') {
+          const startChar = chars.shift();
+          let letters = startChar;
+          while (chars.current && (chars.current !== startChar || letters[letters.length - 1] === "\\")) {
+              letters += chars.shift();
           }
+          if (chars.current === '"') {
+              letters += chars.shift();
+          }
+          return {
+              type: "STRING",
+              value: letters,
+          };
       }
-      owl.onMounted(updatePosition);
-      owl.onPatched(updatePosition);
-      return position;
+      return null;
   }
+  const separatorRegexp = /\w|\.|!|\$/;
   /**
-   * Return the component (or ref's component) BoundingRect, relative
-   * to the upper left corner of the screen (<body> element).
+   * A "Symbol" is just basically any word-like element that can appear in a
+   * formula, which is not a string. So:
+   *   A1
+   *   SUM
+   *   CEILING.MATH
+   *   A$1
+   *   Sheet2!A2
+   *   'Sheet 2'!A2
    *
-   * Note: when used with a <Portal/> component, it will
-   * return the portal position, not the teleported position.
+   * are examples of symbols
    */
-  function useAbsoluteBoundingRect(ref) {
-      const rect = owl.useState({ x: 0, y: 0, width: 0, height: 0 });
-      function updateElRect() {
-          const el = ref.el;
-          if (el === null) {
-              return;
+  function tokenizeSymbol(chars) {
+      let result = "";
+      // there are two main cases to manage: either something which starts with
+      // a ', like 'Sheet 2'A2, or a word-like element.
+      if (chars.current === "'") {
+          let lastChar = chars.shift();
+          result += lastChar;
+          while (chars.current) {
+              lastChar = chars.shift();
+              result += lastChar;
+              if (lastChar === "'") {
+                  if (chars.current && chars.current === "'") {
+                      lastChar = chars.shift();
+                      result += lastChar;
+                  }
+                  else {
+                      break;
+                  }
+              }
+          }
+          if (lastChar !== "'") {
+              return {
+                  type: "UNKNOWN",
+                  value: result,
+              };
           }
-          const { top, left, width, height } = el.getBoundingClientRect();
-          rect.x = left;
-          rect.y = top;
-          rect.width = width;
-          rect.height = height;
       }
-      owl.onMounted(updateElRect);
-      owl.onPatched(updateElRect);
-      return rect;
+      while (chars.current && separatorRegexp.test(chars.current)) {
+          result += chars.shift();
+      }
+      if (result.length) {
+          const value = result;
+          const isReference = rangeReference.test(value);
+          if (isReference) {
+              return { type: "REFERENCE", value };
+          }
+          return { type: "SYMBOL", value };
+      }
+      return null;
+  }
+  function tokenizeSpace(chars) {
+      let length = 0;
+      while (chars.current === NEWLINE) {
+          length++;
+          chars.shift();
+      }
+      if (length) {
+          return { type: "SPACE", value: NEWLINE.repeat(length) };
+      }
+      while (chars.current === " ") {
+          length++;
+          chars.shift();
+      }
+      if (length) {
+          return { type: "SPACE", value: " ".repeat(length) };
+      }
+      return null;
+  }
+  function tokenizeInvalidRange(chars) {
+      if (chars.currentStartsWith(CellErrorType.InvalidReference)) {
+          chars.advanceBy(CellErrorType.InvalidReference.length);
+          return { type: "INVALID_REFERENCE", value: CellErrorType.InvalidReference };
+      }
+      return null;
+  }
+  class TokenizingChars {
+      text;
+      currentIndex = 0;
+      current;
+      constructor(text) {
+          this.text = text;
+          this.current = text[0];
+      }
+      shift() {
+          const current = this.current;
+          const next = this.text[++this.currentIndex];
+          this.current = next;
+          return current;
+      }
+      advanceBy(length) {
+          this.currentIndex += length;
+          this.current = this.text[this.currentIndex];
+      }
+      isOver() {
+          return this.currentIndex >= this.text.length;
+      }
+      remaining() {
+          return this.text.substring(this.currentIndex);
+      }
+      currentStartsWith(str) {
+          for (let j = 0; j < str.length; j++) {
+              if (this.text[this.currentIndex + j] !== str[j]) {
+                  return false;
+              }
+          }
+          return true;
+      }
+  }
+
+  function isValidLocale(locale) {
+      if (!(locale &&
+          typeof locale === "object" &&
+          typeof locale.name === "string" &&
+          typeof locale.code === "string" &&
+          typeof locale.thousandsSeparator === "string" &&
+          typeof locale.decimalSeparator === "string" &&
+          typeof locale.dateFormat === "string" &&
+          typeof locale.timeFormat === "string" &&
+          typeof locale.formulaArgSeparator === "string")) {
+          return false;
+      }
+      if (!Object.values(locale).every((v) => v)) {
+          return false;
+      }
+      if (locale.formulaArgSeparator === locale.decimalSeparator) {
+          return false;
+      }
+      try {
+          formatValue(1, { locale, format: "#,##0.00" });
+          formatValue(1, { locale, format: locale.dateFormat });
+          formatValue(1, { locale, format: locale.timeFormat });
+      }
+      catch {
+          return false;
+      }
+      return true;
   }
   /**
-   * Get the rectangle inside which a popover should stay when being displayed.
-   * It's the value defined in `env.getPopoverContainerRect`, or the Rect of the "o-spreadsheet"
-   * element by default.
+   * Change a content string from the given locale to its canonical form (en_US locale). Don't convert date string.
    *
-   * Coordinates are expressed expressed as absolute DOM position.
+   * @example
+   * canonicalizeNumberContent("=SUM(1,5; 02/12/2012)", FR_LOCALE) // "=SUM(1.5, 02/12/2012)"
+   * canonicalizeNumberContent("125,9", FR_LOCALE) // "125.9"
+   * canonicalizeNumberContent("02/12/2012", FR_LOCALE) // "02/12/2012"
    */
-  function usePopoverContainer() {
-      const container = owl.useState({ x: 0, y: 0, width: 0, height: 0 });
-      const component = owl.useComponent();
-      const spreadsheetRect = useSpreadsheetRect();
-      function updateRect() {
-          const env = component.env;
-          const newRect = "getPopoverContainerRect" in env ? env.getPopoverContainerRect() : spreadsheetRect;
-          container.x = newRect.x;
-          container.y = newRect.y;
-          container.width = newRect.width;
-          container.height = newRect.height;
-      }
-      updateRect();
-      owl.onMounted(updateRect);
-      owl.onPatched(updateRect);
-      return container;
+  function canonicalizeNumberContent(content, locale) {
+      return content.startsWith("=")
+          ? canonicalizeFormula$1(content, locale)
+          : canonicalizeNumberLiteral(content, locale);
   }
-
   /**
-   * Compute the intersection of two rectangles. Returns nothing if the two rectangles don't overlap
+   * Change a content string from the given locale to its canonical form (en_US locale). Also convert date string.
+   * This is destructive and won't preserve the original format.
+   *
+   * @example
+   * canonicalizeContent("=SUM(1,5; 5)", FR_LOCALE) // "=SUM(1.5, 5)"
+   * canonicalizeContent("125,9", FR_LOCALE) // "125.9"
+   * canonicalizeContent("02/12/2012", FR_LOCALE) // "12/02/2012"
+   * canonicalizeContent("02-12-2012", FR_LOCALE) // "12/02/2012"
    */
-  function rectIntersection(rect1, rect2) {
-      return zoneToRect(intersection(rectToZone(rect1), rectToZone(rect2)));
+  function canonicalizeContent(content, locale) {
+      return content.startsWith("=")
+          ? canonicalizeFormula$1(content, locale)
+          : canonicalizeLiteral(content, locale);
   }
-  /** Compute the union of the rectangles, ie. the smallest rectangle that contain them all */
-  function rectUnion(...rects) {
-      return zoneToRect(union(...rects.map(rectToZone)));
+  /**
+   * Change a content string from its canonical form (en_US locale) to the given locale. Also convert date string.
+   *
+   * @example
+   * localizeContent("=SUM(1.5, 5)", FR_LOCALE) // "=SUM(1,5; 5)"
+   * localizeContent("125.9", FR_LOCALE) // "125,9"
+   * localizeContent("12/02/2012", FR_LOCALE) // "02/12/2012"
+   */
+  function localizeContent(content, locale) {
+      return content.startsWith("=")
+          ? localizeFormula(content, locale)
+          : localizeLiteral(content, locale);
   }
-  function rectToZone(rect) {
-      return {
-          left: rect.x,
-          top: rect.y,
-          right: rect.x + rect.width,
+  /** Change a formula to its canonical form (en_US locale) */
+  function canonicalizeFormula$1(formula, locale) {
+      return _localizeFormula$1(formula, locale, DEFAULT_LOCALE);
+  }
+  /** Change a formula from the canonical form to the given locale */
+  function localizeFormula(formula, locale) {
+      return _localizeFormula$1(formula, DEFAULT_LOCALE, locale);
+  }
+  function _localizeFormula$1(formula, fromLocale, toLocale) {
+      if (fromLocale.formulaArgSeparator === toLocale.formulaArgSeparator &&
+          fromLocale.decimalSeparator === toLocale.decimalSeparator) {
+          return formula;
+      }
+      const tokens = tokenize(formula, fromLocale);
+      let localizedFormula = "";
+      for (const token of tokens) {
+          if (token.type === "NUMBER") {
+              localizedFormula += token.value.replace(fromLocale.decimalSeparator, toLocale.decimalSeparator);
+          }
+          else if (token.type === "ARG_SEPARATOR") {
+              localizedFormula += toLocale.formulaArgSeparator;
+          }
+          else {
+              localizedFormula += token.value;
+          }
+      }
+      return localizedFormula;
+  }
+  /**
+   * Change a literal string from the given locale to its canonical form (en_US locale). Don't convert date string.
+   *
+   * @example
+   * canonicalizeNumberLiteral("125,9", FR_LOCALE) // "125.9"
+   * canonicalizeNumberLiteral("02/12/2012", FR_LOCALE) // "02/12/2012"
+   */
+  function canonicalizeNumberLiteral(content, locale) {
+      if (locale.decimalSeparator === "." || !isNumber(content, locale)) {
+          return content;
+      }
+      return content.replace(locale.decimalSeparator, ".");
+  }
+  /**
+   * Change a content string from the given locale to its canonical form (en_US locale). Also convert date string.
+   * This is destructive and won't preserve the original format.
+   *
+   * @example
+   * canonicalizeLiteral("125,9", FR_LOCALE) // "125.9"
+   * canonicalizeLiteral("02/12/2012", FR_LOCALE) // "12/02/2012"
+   * canonicalizeLiteral("02-12-2012", FR_LOCALE) // "12/02/2012"
+   */
+  function canonicalizeLiteral(content, locale) {
+      if (isDateTime(content, locale)) {
+          const dateNumber = toNumber(content, locale);
+          let format = DEFAULT_LOCALE.dateFormat;
+          if (!Number.isInteger(dateNumber)) {
+              format += " " + DEFAULT_LOCALE.timeFormat;
+          }
+          return formatValue(dateNumber, { locale: DEFAULT_LOCALE, format });
+      }
+      return canonicalizeNumberLiteral(content, locale);
+  }
+  /**
+   * Change a literal string from its canonical form (en_US locale) to the given locale. Don't convert date string.
+   * This is destructive and won't preserve the original format.
+   *
+   * @example
+   * localizeNumberLiteral("125.9", FR_LOCALE) // "125,9"
+   * localizeNumberLiteral("12/02/2012", FR_LOCALE) // "12/02/2012"
+   * localizeNumberLiteral("12-02-2012", FR_LOCALE) // "12/02/2012"
+   */
+  function localizeNumberLiteral(literal, locale) {
+      if (locale.decimalSeparator === "." || !isNumber(literal, DEFAULT_LOCALE)) {
+          return literal;
+      }
+      const decimalNumberRegex = getDecimalNumberRegex(DEFAULT_LOCALE);
+      const localized = literal.replace(decimalNumberRegex, (match) => {
+          return match.replace(".", locale.decimalSeparator);
+      });
+      return localized;
+  }
+  /**
+   * Change a literal string from its canonical form (en_US locale) to the given locale. Also convert date string.
+   *
+   * @example
+   * localizeLiteral("125.9", FR_LOCALE) // "125,9"
+   * localizeLiteral("12/02/2012", FR_LOCALE) // "02/12/2012"
+   */
+  function localizeLiteral(literal, locale) {
+      if (isDateTime(literal, DEFAULT_LOCALE)) {
+          const dateNumber = toNumber(literal, DEFAULT_LOCALE);
+          let format = locale.dateFormat;
+          if (!Number.isInteger(dateNumber)) {
+              format += " " + locale.timeFormat;
+          }
+          return formatValue(dateNumber, { locale, format });
+      }
+      return localizeNumberLiteral(literal, locale);
+  }
+  function canonicalizeCFRule(cf, locale) {
+      return changeCFRuleLocale(cf, (content) => canonicalizeContent(content, locale));
+  }
+  function localizeCFRule(cf, locale) {
+      return changeCFRuleLocale(cf, (content) => localizeContent(content, locale));
+  }
+  function localizeDataValidationRule(rule, locale) {
+      const localizedDVRule = deepCopy(rule);
+      localizedDVRule.criterion.values = localizedDVRule.criterion.values.map((content) => localizeContent(content, locale));
+      return localizedDVRule;
+  }
+  function changeCFRuleLocale(rule, changeContentLocale) {
+      rule = deepCopy(rule);
+      switch (rule.type) {
+          case "CellIsRule":
+              // Only change value for number operators
+              switch (rule.operator) {
+                  case "Between":
+                  case "NotBetween":
+                  case "Equal":
+                  case "NotEqual":
+                  case "GreaterThan":
+                  case "GreaterThanOrEqual":
+                  case "LessThan":
+                  case "LessThanOrEqual":
+                      rule.values = rule.values.map((v) => changeContentLocale(v));
+                      return rule;
+                  case "BeginsWith":
+                  case "ContainsText":
+                  case "EndsWith":
+                  case "NotContains":
+                  case "IsEmpty":
+                  case "IsNotEmpty":
+                      return rule;
+              }
+              break;
+          case "ColorScaleRule":
+              rule.minimum = changeCFRuleThresholdLocale(rule.minimum, changeContentLocale);
+              rule.maximum = changeCFRuleThresholdLocale(rule.maximum, changeContentLocale);
+              if (rule.midpoint) {
+                  rule.midpoint = changeCFRuleThresholdLocale(rule.midpoint, changeContentLocale);
+              }
+              return rule;
+          case "IconSetRule":
+              rule.lowerInflectionPoint.value = changeContentLocale(rule.lowerInflectionPoint.value);
+              rule.upperInflectionPoint.value = changeContentLocale(rule.upperInflectionPoint.value);
+              return rule;
+      }
+  }
+  function changeCFRuleThresholdLocale(threshold, changeContentLocale) {
+      if (!threshold?.value) {
+          return threshold;
+      }
+      const value = threshold.type === "formula" ? "=" + threshold.value : threshold.value;
+      const modified = changeContentLocale(value);
+      const newValue = threshold.type === "formula" ? modified.slice(1) : modified;
+      return { ...threshold, value: newValue };
+  }
+  function getDateTimeFormat(locale) {
+      return locale.dateFormat + " " + locale.timeFormat;
+  }
+
+  const linkSheet = {
+      name: _t("Link sheet"),
+      children: [
+          (env) => {
+              const sheets = env.model.getters
+                  .getSheetIds()
+                  .map((sheetId) => env.model.getters.getSheet(sheetId));
+              return sheets.map((sheet) => ({
+                  id: sheet.id,
+                  name: sheet.name,
+                  execute: () => markdownLink(sheet.name, buildSheetLink(sheet.id)),
+              }));
+          },
+      ],
+  };
+  const deleteSheet = {
+      name: _t("Delete"),
+      isVisible: (env) => {
+          return env.model.getters.getSheetIds().length > 1;
+      },
+      execute: (env) => env.askConfirmation(_t("Are you sure you want to delete this sheet?"), () => {
+          env.model.dispatch("DELETE_SHEET", { sheetId: env.model.getters.getActiveSheetId() });
+      }),
+  };
+  const duplicateSheet = {
+      name: _t("Duplicate"),
+      execute: (env) => {
+          const sheetIdFrom = env.model.getters.getActiveSheetId();
+          const sheetIdTo = env.model.uuidGenerator.uuidv4();
+          env.model.dispatch("DUPLICATE_SHEET", {
+              sheetId: sheetIdFrom,
+              sheetIdTo,
+          });
+          env.model.dispatch("ACTIVATE_SHEET", { sheetIdFrom, sheetIdTo });
+      },
+  };
+  const renameSheet = (args) => {
+      return {
+          name: _t("Rename"),
+          execute: args.renameSheetCallback,
+      };
+  };
+  const sheetMoveRight = {
+      name: _t("Move right"),
+      isVisible: (env) => {
+          const sheetId = env.model.getters.getActiveSheetId();
+          const sheetIds = env.model.getters.getVisibleSheetIds();
+          return sheetIds.indexOf(sheetId) !== sheetIds.length - 1;
+      },
+      execute: (env) => env.model.dispatch("MOVE_SHEET", {
+          sheetId: env.model.getters.getActiveSheetId(),
+          delta: 1,
+      }),
+  };
+  const sheetMoveLeft = {
+      name: _t("Move left"),
+      isVisible: (env) => {
+          const sheetId = env.model.getters.getActiveSheetId();
+          return env.model.getters.getVisibleSheetIds()[0] !== sheetId;
+      },
+      execute: (env) => env.model.dispatch("MOVE_SHEET", {
+          sheetId: env.model.getters.getActiveSheetId(),
+          delta: -1,
+      }),
+  };
+  const hideSheet = {
+      name: _t("Hide sheet"),
+      isVisible: (env) => env.model.getters.getVisibleSheetIds().length !== 1,
+      execute: (env) => env.model.dispatch("HIDE_SHEET", { sheetId: env.model.getters.getActiveSheetId() }),
+  };
+
+  /**
+   * The class Registry is extended in order to add the function addChild
+   *
+   */
+  class MenuItemRegistry extends Registry {
+      /**
+       * @override
+       */
+      add(key, value) {
+          if (value.id === undefined) {
+              value.id = key;
+          }
+          this.content[key] = value;
+          return this;
+      }
+      /**
+       * Add a subitem to an existing item
+       * @param path Path of items to add this subitem
+       * @param value Subitem to add
+       */
+      addChild(key, path, value) {
+          if (typeof value !== "function" && value.id === undefined) {
+              value.id = key;
+          }
+          const root = path.splice(0, 1)[0];
+          let node = this.content[root];
+          if (!node) {
+              throw new Error(`Path ${root + ":" + path.join(":")} not found`);
+          }
+          for (let p of path) {
+              const children = node.children;
+              if (!children || typeof children === "function") {
+                  throw new Error(`${p} is either not a node or it's dynamically computed`);
+              }
+              node = children.find((elt) => elt.id === p);
+              if (!node) {
+                  throw new Error(`Path ${root + ":" + path.join(":")} not found`);
+              }
+          }
+          if (!node.children) {
+              node.children = [];
+          }
+          node.children.push(value);
+          return this;
+      }
+      getMenuItems() {
+          return createActions(this.getAll());
+      }
+  }
+
+  //------------------------------------------------------------------------------
+  // Link Menu Registry
+  //------------------------------------------------------------------------------
+  const linkMenuRegistry = new MenuItemRegistry();
+  linkMenuRegistry.add("sheet", {
+      ...linkSheet,
+      sequence: 10,
+  });
+
+  /**
+   * Return the o-spreadsheet element position relative
+   * to the browser viewport.
+   */
+  function useSpreadsheetRect() {
+      const position = owl.useState({ x: 0, y: 0, width: 0, height: 0 });
+      let spreadsheetElement = document.querySelector(".o-spreadsheet");
+      updatePosition();
+      function updatePosition() {
+          if (!spreadsheetElement) {
+              spreadsheetElement = document.querySelector(".o-spreadsheet");
+          }
+          if (spreadsheetElement) {
+              const { top, left, width, height } = spreadsheetElement.getBoundingClientRect();
+              position.x = left;
+              position.y = top;
+              position.width = width;
+              position.height = height;
+          }
+      }
+      owl.onMounted(updatePosition);
+      owl.onPatched(updatePosition);
+      return position;
+  }
+  /**
+   * Return the component (or ref's component) BoundingRect, relative
+   * to the upper left corner of the screen (<body> element).
+   *
+   * Note: when used with a <Portal/> component, it will
+   * return the portal position, not the teleported position.
+   */
+  function useAbsoluteBoundingRect(ref) {
+      const rect = owl.useState({ x: 0, y: 0, width: 0, height: 0 });
+      function updateElRect() {
+          const el = ref.el;
+          if (el === null) {
+              return;
+          }
+          const { top, left, width, height } = el.getBoundingClientRect();
+          rect.x = left;
+          rect.y = top;
+          rect.width = width;
+          rect.height = height;
+      }
+      owl.onMounted(updateElRect);
+      owl.onPatched(updateElRect);
+      return rect;
+  }
+  /**
+   * Get the rectangle inside which a popover should stay when being displayed.
+   * It's the value defined in `env.getPopoverContainerRect`, or the Rect of the "o-spreadsheet"
+   * element by default.
+   *
+   * Coordinates are expressed expressed as absolute DOM position.
+   */
+  function usePopoverContainer() {
+      const container = owl.useState({ x: 0, y: 0, width: 0, height: 0 });
+      const component = owl.useComponent();
+      const spreadsheetRect = useSpreadsheetRect();
+      function updateRect() {
+          const env = component.env;
+          const newRect = "getPopoverContainerRect" in env ? env.getPopoverContainerRect() : spreadsheetRect;
+          container.x = newRect.x;
+          container.y = newRect.y;
+          container.width = newRect.width;
+          container.height = newRect.height;
+      }
+      updateRect();
+      owl.onMounted(updateRect);
+      owl.onPatched(updateRect);
+      return container;
+  }
+
+  const macRegex = /Mac/i;
+  /**
+   * Return true if the event was triggered from
+   * a child element.
+   */
+  function isChildEvent(parent, ev) {
+      return !!ev.target && parent.contains(ev.target);
+  }
+  function gridOverlayPosition() {
+      const spreadsheetElement = document.querySelector(".o-grid-overlay");
+      if (spreadsheetElement) {
+          const { top, left } = spreadsheetElement?.getBoundingClientRect();
+          return { top, left };
+      }
+      throw new Error("Can't find spreadsheet position");
+  }
+  function getBoundingRectAsPOJO(el) {
+      const rect = el.getBoundingClientRect();
+      return {
+          x: rect.x,
+          y: rect.y,
+          width: rect.width,
+          height: rect.height,
+      };
+  }
+  /**
+   * Iterate over all the children of `el` in the dom tree starting at `el`, depth first.
+   */
+  function* iterateChildren(el) {
+      yield el;
+      if (el.hasChildNodes()) {
+          for (let child of el.childNodes) {
+              yield* iterateChildren(child);
+          }
+      }
+  }
+  function getOpenedMenus() {
+      return Array.from(document.querySelectorAll(".o-spreadsheet .o-menu"));
+  }
+  const letterRegex = /^[a-zA-Z]$/;
+  /**
+   * Transform a keyboard event into a shortcut string that represent this event. The letters keys will be uppercased.
+   *
+   * @argument ev - The keyboard event to transform
+   * @argument mode - Use either ev.key of ev.code to get the string shortcut
+   *
+   * @example
+   * event : { ctrlKey: true, key: "a" } => "Ctrl+A"
+   * event : { shift: true, alt: true, key: "Home" } => "Alt+Shift+Home"
+   */
+  function keyboardEventToShortcutString(ev, mode = "key") {
+      let keyDownString = "";
+      if (isCtrlKey(ev) && ev.key !== "Ctrl")
+          keyDownString += "Ctrl+";
+      if (ev.metaKey)
+          keyDownString += "Ctrl+";
+      if (ev.altKey && ev.key !== "Alt")
+          keyDownString += "Alt+";
+      if (ev.shiftKey && ev.key !== "Shift")
+          keyDownString += "Shift+";
+      const key = mode === "key" ? ev.key : ev.code;
+      keyDownString += letterRegex.test(key) ? key.toUpperCase() : key;
+      return keyDownString;
+  }
+  function isMacOS() {
+      return Boolean(macRegex.test(navigator.userAgent));
+  }
+  /**
+   * @param {KeyboardEvent | MouseEvent} ev
+   * @returns Returns true if the event was triggered with the "ctrl" modifier pressed.
+   * On Mac, this is the "meta" or "command" key.
+   */
+  function isCtrlKey(ev) {
+      return isMacOS() ? ev.metaKey : ev.ctrlKey;
+  }
+
+  /**
+   * Compute the intersection of two rectangles. Returns nothing if the two rectangles don't overlap
+   */
+  function rectIntersection(rect1, rect2) {
+      return zoneToRect(intersection(rectToZone(rect1), rectToZone(rect2)));
+  }
+  /** Compute the union of the rectangles, ie. the smallest rectangle that contain them all */
+  function rectUnion(...rects) {
+      return zoneToRect(union(...rects.map(rectToZone)));
+  }
+  function rectToZone(rect) {
+      return {
+          left: rect.x,
+          top: rect.y,
+          right: rect.x + rect.width,
           bottom: rect.y + rect.height,
       };
   }
@@ -7146,841 +7832,158 @@
           depth: 1,
       };
       subMenu = owl.useState({
-          isOpen: false,
-          position: null,
-          scrollOffset: 0,
-          menuItems: [],
-      });
-      menuRef = owl.useRef("menu");
-      position = useAbsoluteBoundingRect(this.menuRef);
-      setup() {
-          owl.useExternalListener(window, "click", this.onExternalClick, { capture: true });
-          owl.useExternalListener(window, "contextmenu", this.onExternalClick, { capture: true });
-          owl.onWillUpdateProps((nextProps) => {
-              if (nextProps.menuItems !== this.props.menuItems) {
-                  this.closeSubMenu();
-              }
-          });
-      }
-      get menuItemsAndSeparators() {
-          const menuItemsAndSeparators = [];
-          for (let i = 0; i < this.props.menuItems.length; i++) {
-              const menuItem = this.props.menuItems[i];
-              if (menuItem.isVisible(this.env)) {
-                  menuItemsAndSeparators.push(menuItem);
-              }
-              if (menuItem.separator &&
-                  i !== this.props.menuItems.length - 1 && // no separator at the end
-                  menuItemsAndSeparators[menuItemsAndSeparators.length - 1] !== "separator" // no double separator
-              ) {
-                  menuItemsAndSeparators.push("separator");
-              }
-          }
-          if (menuItemsAndSeparators[menuItemsAndSeparators.length - 1] === "separator") {
-              menuItemsAndSeparators.pop();
-          }
-          if (menuItemsAndSeparators.length === 1 && menuItemsAndSeparators[0] === "separator") {
-              return [];
-          }
-          return menuItemsAndSeparators;
-      }
-      get subMenuPosition() {
-          const position = Object.assign({}, this.subMenu.position);
-          position.y -= this.subMenu.scrollOffset || 0;
-          return position;
-      }
-      get popoverProps() {
-          const isRoot = this.props.depth === 1;
-          return {
-              anchorRect: {
-                  x: this.props.position.x - MENU_WIDTH * (this.props.depth - 1),
-                  y: this.props.position.y,
-                  width: isRoot ? 0 : MENU_WIDTH,
-                  height: isRoot ? 0 : MENU_ITEM_HEIGHT,
-              },
-              positioning: "TopRight",
-              verticalOffset: isRoot ? 0 : MENU_VERTICAL_PADDING,
-              onPopoverHidden: () => this.closeSubMenu(),
-              onPopoverMoved: () => this.closeSubMenu(),
-          };
-      }
-      get childrenHaveIcon() {
-          return this.props.menuItems.some((menuItem) => !!this.getIconName(menuItem));
-      }
-      getIconName(menu) {
-          if (menu.icon(this.env)) {
-              return menu.icon(this.env);
-          }
-          if (menu.isActive?.(this.env)) {
-              return "o-spreadsheet-Icon.CHECK";
-          }
-          return "";
-      }
-      getColor(menu) {
-          return menu.textColor ? `color: ${menu.textColor}` : undefined;
-      }
-      async activateMenu(menu) {
-          const result = await menu.execute?.(this.env);
-          this.close();
-          this.props.onMenuClicked?.({ detail: result });
-      }
-      close() {
-          this.closeSubMenu();
-          this.props.onClose();
-      }
-      onExternalClick(ev) {
-          // Don't close a root menu when clicked to open the submenus.
-          const el = this.menuRef.el;
-          if (el && getOpenedMenus().some((el) => isChildEvent(el, ev))) {
-              return;
-          }
-          ev.closedMenuId = this.props.menuId;
-          this.close();
-      }
-      getName(menu) {
-          return menu.name(this.env);
-      }
-      isRoot(menu) {
-          return !menu.execute;
-      }
-      isEnabled(menu) {
-          if (menu.isEnabled(this.env)) {
-              return this.env.model.getters.isReadonly() ? menu.isReadonlyAllowed : true;
-          }
-          return false;
-      }
-      onScroll(ev) {
-          this.subMenu.scrollOffset = ev.target.scrollTop;
-      }
-      /**
-       * If the given menu is not disabled, open it's submenu at the
-       * correct position according to available surrounding space.
-       */
-      openSubMenu(menu, menuIndex, ev) {
-          const parentMenuEl = ev.currentTarget;
-          if (!parentMenuEl)
-              return;
-          const y = parentMenuEl.getBoundingClientRect().top;
-          this.subMenu.position = {
-              x: this.position.x + this.props.depth * MENU_WIDTH,
-              y: y - (this.subMenu.scrollOffset || 0),
-          };
-          this.subMenu.menuItems = menu.children(this.env);
-          this.subMenu.isOpen = true;
-          this.subMenu.parentMenu = menu;
-      }
-      isParentMenu(subMenu, menuItem) {
-          return subMenu.parentMenu?.id === menuItem.id;
-      }
-      closeSubMenu() {
-          this.subMenu.isOpen = false;
-          this.subMenu.parentMenu = undefined;
-      }
-      onClickMenu(menu, menuIndex, ev) {
-          if (this.isEnabled(menu)) {
-              if (this.isRoot(menu)) {
-                  this.openSubMenu(menu, menuIndex, ev);
-              }
-              else {
-                  this.activateMenu(menu);
-              }
-          }
-      }
-      onMouseOver(menu, position, ev) {
-          if (this.isEnabled(menu)) {
-              if (this.isRoot(menu)) {
-                  this.openSubMenu(menu, position, ev);
-              }
-              else {
-                  this.closeSubMenu();
-              }
-          }
-      }
-  }
-
-  const LINK_TOOLTIP_HEIGHT = 32;
-  const LINK_TOOLTIP_WIDTH = 220;
-  css /* scss */ `
-  .o-link-tool {
-    font-size: 13px;
-    background-color: white;
-    box-shadow: 0 1px 4px 3px rgba(60, 64, 67, 0.15);
-    padding: 6px 12px;
-    border-radius: 4px;
-    display: flex;
-    justify-content: space-between;
-    height: ${LINK_TOOLTIP_HEIGHT}px;
-    width: ${LINK_TOOLTIP_WIDTH}px;
-    box-sizing: border-box !important;
-
-    img {
-      margin-right: 3px;
-      width: 16px;
-      height: 16px;
-    }
-
-    a.o-link {
-      color: #01666b;
-      text-decoration: none;
-      flex-grow: 2;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-    a.o-link:hover {
-      text-decoration: none;
-      color: #001d1f;
-      cursor: pointer;
-    }
-  }
-  .o-link-icon {
-    float: right;
-    padding-left: 5px;
-    .o-icon {
-      height: 16px;
-    }
-  }
-  .o-link-icon .o-icon {
-    height: 13px;
-  }
-  .o-link-icon:hover {
-    cursor: pointer;
-    color: #000;
-  }
-`;
-  class LinkDisplay extends owl.Component {
-      static template = "o-spreadsheet-LinkDisplay";
-      static props = {
-          cellPosition: Object,
-          onClosed: { type: Function, optional: true },
-      };
-      static components = { Menu };
-      get cell() {
-          const { col, row } = this.props.cellPosition;
-          const sheetId = this.env.model.getters.getActiveSheetId();
-          return this.env.model.getters.getEvaluatedCell({ sheetId, col, row });
-      }
-      get link() {
-          if (this.cell.link) {
-              return this.cell.link;
-          }
-          const { col, row } = this.props.cellPosition;
-          throw new Error(`LinkDisplay Component can only be used with link cells. ${toXC(col, row)} is not a link.`);
-      }
-      getUrlRepresentation(link) {
-          return urlRepresentation(link, this.env.model.getters);
-      }
-      openLink() {
-          openLink(this.link, this.env);
-      }
-      edit() {
-          const { col, row } = this.props.cellPosition;
-          this.env.model.dispatch("OPEN_CELL_POPOVER", {
-              col,
-              row,
-              popoverType: "LinkEditor",
-          });
-      }
-      unlink() {
-          const sheetId = this.env.model.getters.getActiveSheetId();
-          const { col, row } = this.props.cellPosition;
-          const style = this.env.model.getters.getCellComputedStyle({ sheetId, col, row });
-          const textColor = style?.textColor === LINK_COLOR ? undefined : style?.textColor;
-          this.env.model.dispatch("UPDATE_CELL", {
-              col,
-              row,
-              sheetId,
-              content: this.link.label,
-              style: { ...style, textColor, underline: undefined },
-          });
-      }
-  }
-  const LinkCellPopoverBuilder = {
-      onHover: (position, getters) => {
-          const cell = getters.getEvaluatedCell(position);
-          const shouldDisplayLink = !getters.isDashboard() && cell.link && getters.isVisibleInViewport(position);
-          if (!shouldDisplayLink)
-              return { isOpen: false };
-          return {
-              isOpen: true,
-              Component: LinkDisplay,
-              props: { cellPosition: position },
-              cellCorner: "BottomLeft",
-          };
-      },
-  };
-
-  /**
-   * Tokenizer
-   *
-   * A tokenizer is a piece of code whose job is to transform a string into a list
-   * of "tokens". For example, "(12+" is converted into:
-   *   [{type: "LEFT_PAREN", value: "("},
-   *    {type: "NUMBER", value: "12"},
-   *    {type: "OPERATOR", value: "+"}]
-   *
-   * As the example shows, a tokenizer does not care about the meaning behind those
-   * tokens. It only cares about the structure.
-   *
-   * The tokenizer is usually the first step in a compilation pipeline.  Also, it
-   * is useful for the composer, which needs to be able to work with incomplete
-   * formulas.
-   */
-  const POSTFIX_UNARY_OPERATORS = ["%"];
-  const OPERATORS = "+,-,*,/,:,=,<>,>=,>,<=,<,^,&".split(",").concat(POSTFIX_UNARY_OPERATORS);
-  function tokenize(str, locale = DEFAULT_LOCALE) {
-      str = replaceSpecialSpaces(str);
-      const chars = new TokenizingChars(str);
-      const result = [];
-      while (!chars.isOver()) {
-          let token = tokenizeSpace(chars) ||
-              tokenizeArgsSeparator(chars, locale) ||
-              tokenizeMisc(chars) ||
-              tokenizeOperator(chars) ||
-              tokenizeString(chars) ||
-              tokenizeDebugger(chars) ||
-              tokenizeInvalidRange(chars) ||
-              tokenizeNumber(chars, locale) ||
-              tokenizeSymbol(chars);
-          if (!token) {
-              token = { type: "UNKNOWN", value: chars.shift() };
-          }
-          result.push(token);
-      }
-      return result;
-  }
-  function tokenizeDebugger(chars) {
-      if (chars.current === "?") {
-          chars.shift();
-          return { type: "DEBUGGER", value: "?" };
-      }
-      return null;
-  }
-  const misc$1 = {
-      "(": "LEFT_PAREN",
-      ")": "RIGHT_PAREN",
-  };
-  function tokenizeMisc(chars) {
-      if (chars.current in misc$1) {
-          const value = chars.shift();
-          const type = misc$1[value];
-          return { type, value };
-      }
-      return null;
-  }
-  function tokenizeArgsSeparator(chars, locale) {
-      if (chars.current === locale.formulaArgSeparator) {
-          const value = chars.shift();
-          const type = "ARG_SEPARATOR";
-          return { type, value };
-      }
-      return null;
-  }
-  function tokenizeOperator(chars) {
-      for (let op of OPERATORS) {
-          if (chars.currentStartsWith(op)) {
-              chars.advanceBy(op.length);
-              return { type: "OPERATOR", value: op };
-          }
-      }
-      return null;
-  }
-  function tokenizeNumber(chars, locale) {
-      const match = chars.remaining().match(getFormulaNumberRegex(locale.decimalSeparator));
-      if (match) {
-          chars.advanceBy(match[0].length);
-          return { type: "NUMBER", value: match[0] };
-      }
-      return null;
-  }
-  function tokenizeString(chars) {
-      if (chars.current === '"') {
-          const startChar = chars.shift();
-          let letters = startChar;
-          while (chars.current && (chars.current !== startChar || letters[letters.length - 1] === "\\")) {
-              letters += chars.shift();
-          }
-          if (chars.current === '"') {
-              letters += chars.shift();
-          }
-          return {
-              type: "STRING",
-              value: letters,
-          };
-      }
-      return null;
-  }
-  const separatorRegexp = /\w|\.|!|\$/;
-  /**
-   * A "Symbol" is just basically any word-like element that can appear in a
-   * formula, which is not a string. So:
-   *   A1
-   *   SUM
-   *   CEILING.MATH
-   *   A$1
-   *   Sheet2!A2
-   *   'Sheet 2'!A2
-   *
-   * are examples of symbols
-   */
-  function tokenizeSymbol(chars) {
-      let result = "";
-      // there are two main cases to manage: either something which starts with
-      // a ', like 'Sheet 2'A2, or a word-like element.
-      if (chars.current === "'") {
-          let lastChar = chars.shift();
-          result += lastChar;
-          while (chars.current) {
-              lastChar = chars.shift();
-              result += lastChar;
-              if (lastChar === "'") {
-                  if (chars.current && chars.current === "'") {
-                      lastChar = chars.shift();
-                      result += lastChar;
-                  }
-                  else {
-                      break;
-                  }
-              }
-          }
-          if (lastChar !== "'") {
-              return {
-                  type: "UNKNOWN",
-                  value: result,
-              };
-          }
-      }
-      while (chars.current && separatorRegexp.test(chars.current)) {
-          result += chars.shift();
-      }
-      if (result.length) {
-          const value = result;
-          const isReference = rangeReference.test(value);
-          if (isReference) {
-              return { type: "REFERENCE", value };
-          }
-          return { type: "SYMBOL", value };
-      }
-      return null;
-  }
-  function tokenizeSpace(chars) {
-      let length = 0;
-      while (chars.current === NEWLINE) {
-          length++;
-          chars.shift();
-      }
-      if (length) {
-          return { type: "SPACE", value: NEWLINE.repeat(length) };
-      }
-      while (chars.current === " ") {
-          length++;
-          chars.shift();
-      }
-      if (length) {
-          return { type: "SPACE", value: " ".repeat(length) };
-      }
-      return null;
-  }
-  function tokenizeInvalidRange(chars) {
-      if (chars.currentStartsWith(CellErrorType.InvalidReference)) {
-          chars.advanceBy(CellErrorType.InvalidReference.length);
-          return { type: "INVALID_REFERENCE", value: CellErrorType.InvalidReference };
-      }
-      return null;
-  }
-  class TokenizingChars {
-      text;
-      currentIndex = 0;
-      current;
-      constructor(text) {
-          this.text = text;
-          this.current = text[0];
-      }
-      shift() {
-          const current = this.current;
-          const next = this.text[++this.currentIndex];
-          this.current = next;
-          return current;
-      }
-      advanceBy(length) {
-          this.currentIndex += length;
-          this.current = this.text[this.currentIndex];
-      }
-      isOver() {
-          return this.currentIndex >= this.text.length;
-      }
-      remaining() {
-          return this.text.substring(this.currentIndex);
-      }
-      currentStartsWith(str) {
-          for (let j = 0; j < str.length; j++) {
-              if (this.text[this.currentIndex + j] !== str[j]) {
-                  return false;
-              }
-          }
-          return true;
-      }
-  }
-
-  function isValidLocale(locale) {
-      if (!(locale &&
-          typeof locale === "object" &&
-          typeof locale.name === "string" &&
-          typeof locale.code === "string" &&
-          typeof locale.thousandsSeparator === "string" &&
-          typeof locale.decimalSeparator === "string" &&
-          typeof locale.dateFormat === "string" &&
-          typeof locale.timeFormat === "string" &&
-          typeof locale.formulaArgSeparator === "string")) {
-          return false;
-      }
-      if (!Object.values(locale).every((v) => v)) {
-          return false;
-      }
-      if (locale.formulaArgSeparator === locale.decimalSeparator) {
-          return false;
-      }
-      try {
-          formatValue(1, { locale, format: "#,##0.00" });
-          formatValue(1, { locale, format: locale.dateFormat });
-          formatValue(1, { locale, format: locale.timeFormat });
-      }
-      catch {
-          return false;
-      }
-      return true;
-  }
-  /**
-   * Change a content string from the given locale to its canonical form (en_US locale). Don't convert date string.
-   *
-   * @example
-   * canonicalizeNumberContent("=SUM(1,5; 02/12/2012)", FR_LOCALE) // "=SUM(1.5, 02/12/2012)"
-   * canonicalizeNumberContent("125,9", FR_LOCALE) // "125.9"
-   * canonicalizeNumberContent("02/12/2012", FR_LOCALE) // "02/12/2012"
-   */
-  function canonicalizeNumberContent(content, locale) {
-      return content.startsWith("=")
-          ? canonicalizeFormula$1(content, locale)
-          : canonicalizeNumberLiteral(content, locale);
-  }
-  /**
-   * Change a content string from the given locale to its canonical form (en_US locale). Also convert date string.
-   * This is destructive and won't preserve the original format.
-   *
-   * @example
-   * canonicalizeContent("=SUM(1,5; 5)", FR_LOCALE) // "=SUM(1.5, 5)"
-   * canonicalizeContent("125,9", FR_LOCALE) // "125.9"
-   * canonicalizeContent("02/12/2012", FR_LOCALE) // "12/02/2012"
-   * canonicalizeContent("02-12-2012", FR_LOCALE) // "12/02/2012"
-   */
-  function canonicalizeContent(content, locale) {
-      return content.startsWith("=")
-          ? canonicalizeFormula$1(content, locale)
-          : canonicalizeLiteral(content, locale);
-  }
-  /**
-   * Change a content string from its canonical form (en_US locale) to the given locale. Also convert date string.
-   *
-   * @example
-   * localizeContent("=SUM(1.5, 5)", FR_LOCALE) // "=SUM(1,5; 5)"
-   * localizeContent("125.9", FR_LOCALE) // "125,9"
-   * localizeContent("12/02/2012", FR_LOCALE) // "02/12/2012"
-   */
-  function localizeContent(content, locale) {
-      return content.startsWith("=")
-          ? localizeFormula(content, locale)
-          : localizeLiteral(content, locale);
-  }
-  /** Change a formula to its canonical form (en_US locale) */
-  function canonicalizeFormula$1(formula, locale) {
-      return _localizeFormula$1(formula, locale, DEFAULT_LOCALE);
-  }
-  /** Change a formula from the canonical form to the given locale */
-  function localizeFormula(formula, locale) {
-      return _localizeFormula$1(formula, DEFAULT_LOCALE, locale);
-  }
-  function _localizeFormula$1(formula, fromLocale, toLocale) {
-      if (fromLocale.formulaArgSeparator === toLocale.formulaArgSeparator &&
-          fromLocale.decimalSeparator === toLocale.decimalSeparator) {
-          return formula;
+          isOpen: false,
+          position: null,
+          scrollOffset: 0,
+          menuItems: [],
+      });
+      menuRef = owl.useRef("menu");
+      position = useAbsoluteBoundingRect(this.menuRef);
+      setup() {
+          owl.useExternalListener(window, "click", this.onExternalClick, { capture: true });
+          owl.useExternalListener(window, "contextmenu", this.onExternalClick, { capture: true });
+          owl.onWillUpdateProps((nextProps) => {
+              if (nextProps.menuItems !== this.props.menuItems) {
+                  this.closeSubMenu();
+              }
+          });
       }
-      const tokens = tokenize(formula, fromLocale);
-      let localizedFormula = "";
-      for (const token of tokens) {
-          if (token.type === "NUMBER") {
-              localizedFormula += token.value.replace(fromLocale.decimalSeparator, toLocale.decimalSeparator);
+      get menuItemsAndSeparators() {
+          const menuItemsAndSeparators = [];
+          for (let i = 0; i < this.props.menuItems.length; i++) {
+              const menuItem = this.props.menuItems[i];
+              if (menuItem.isVisible(this.env)) {
+                  menuItemsAndSeparators.push(menuItem);
+              }
+              if (menuItem.separator &&
+                  i !== this.props.menuItems.length - 1 && // no separator at the end
+                  menuItemsAndSeparators[menuItemsAndSeparators.length - 1] !== "separator" // no double separator
+              ) {
+                  menuItemsAndSeparators.push("separator");
+              }
           }
-          else if (token.type === "ARG_SEPARATOR") {
-              localizedFormula += toLocale.formulaArgSeparator;
+          if (menuItemsAndSeparators[menuItemsAndSeparators.length - 1] === "separator") {
+              menuItemsAndSeparators.pop();
           }
-          else {
-              localizedFormula += token.value;
+          if (menuItemsAndSeparators.length === 1 && menuItemsAndSeparators[0] === "separator") {
+              return [];
           }
+          return menuItemsAndSeparators;
       }
-      return localizedFormula;
-  }
-  /**
-   * Change a literal string from the given locale to its canonical form (en_US locale). Don't convert date string.
-   *
-   * @example
-   * canonicalizeNumberLiteral("125,9", FR_LOCALE) // "125.9"
-   * canonicalizeNumberLiteral("02/12/2012", FR_LOCALE) // "02/12/2012"
-   */
-  function canonicalizeNumberLiteral(content, locale) {
-      if (locale.decimalSeparator === "." || !isNumber(content, locale)) {
-          return content;
+      get subMenuPosition() {
+          const position = Object.assign({}, this.subMenu.position);
+          position.y -= this.subMenu.scrollOffset || 0;
+          return position;
       }
-      return content.replace(locale.decimalSeparator, ".");
-  }
-  /**
-   * Change a content string from the given locale to its canonical form (en_US locale). Also convert date string.
-   * This is destructive and won't preserve the original format.
-   *
-   * @example
-   * canonicalizeLiteral("125,9", FR_LOCALE) // "125.9"
-   * canonicalizeLiteral("02/12/2012", FR_LOCALE) // "12/02/2012"
-   * canonicalizeLiteral("02-12-2012", FR_LOCALE) // "12/02/2012"
-   */
-  function canonicalizeLiteral(content, locale) {
-      if (isDateTime(content, locale)) {
-          const dateNumber = toNumber(content, locale);
-          let format = DEFAULT_LOCALE.dateFormat;
-          if (!Number.isInteger(dateNumber)) {
-              format += " " + DEFAULT_LOCALE.timeFormat;
+      get popoverProps() {
+          const isRoot = this.props.depth === 1;
+          return {
+              anchorRect: {
+                  x: this.props.position.x - MENU_WIDTH * (this.props.depth - 1),
+                  y: this.props.position.y,
+                  width: isRoot ? 0 : MENU_WIDTH,
+                  height: isRoot ? 0 : MENU_ITEM_HEIGHT,
+              },
+              positioning: "TopRight",
+              verticalOffset: isRoot ? 0 : MENU_VERTICAL_PADDING,
+              onPopoverHidden: () => this.closeSubMenu(),
+              onPopoverMoved: () => this.closeSubMenu(),
+          };
+      }
+      get childrenHaveIcon() {
+          return this.props.menuItems.some((menuItem) => !!this.getIconName(menuItem));
+      }
+      getIconName(menu) {
+          if (menu.icon(this.env)) {
+              return menu.icon(this.env);
           }
-          return formatValue(dateNumber, { locale: DEFAULT_LOCALE, format });
+          if (menu.isActive?.(this.env)) {
+              return "o-spreadsheet-Icon.CHECK";
+          }
+          return "";
       }
-      return canonicalizeNumberLiteral(content, locale);
-  }
-  /**
-   * Change a literal string from its canonical form (en_US locale) to the given locale. Don't convert date string.
-   * This is destructive and won't preserve the original format.
-   *
-   * @example
-   * localizeNumberLiteral("125.9", FR_LOCALE) // "125,9"
-   * localizeNumberLiteral("12/02/2012", FR_LOCALE) // "12/02/2012"
-   * localizeNumberLiteral("12-02-2012", FR_LOCALE) // "12/02/2012"
-   */
-  function localizeNumberLiteral(literal, locale) {
-      if (locale.decimalSeparator === "." || !isNumber(literal, DEFAULT_LOCALE)) {
-          return literal;
+      getColor(menu) {
+          return menu.textColor ? `color: ${menu.textColor}` : undefined;
       }
-      const decimalNumberRegex = getDecimalNumberRegex(DEFAULT_LOCALE);
-      const localized = literal.replace(decimalNumberRegex, (match) => {
-          return match.replace(".", locale.decimalSeparator);
-      });
-      return localized;
-  }
-  /**
-   * Change a literal string from its canonical form (en_US locale) to the given locale. Also convert date string.
-   *
-   * @example
-   * localizeLiteral("125.9", FR_LOCALE) // "125,9"
-   * localizeLiteral("12/02/2012", FR_LOCALE) // "02/12/2012"
-   */
-  function localizeLiteral(literal, locale) {
-      if (isDateTime(literal, DEFAULT_LOCALE)) {
-          const dateNumber = toNumber(literal, DEFAULT_LOCALE);
-          let format = locale.dateFormat;
-          if (!Number.isInteger(dateNumber)) {
-              format += " " + locale.timeFormat;
+      async activateMenu(menu) {
+          const result = await menu.execute?.(this.env);
+          this.close();
+          this.props.onMenuClicked?.({ detail: result });
+      }
+      close() {
+          this.closeSubMenu();
+          this.props.onClose();
+      }
+      onExternalClick(ev) {
+          // Don't close a root menu when clicked to open the submenus.
+          const el = this.menuRef.el;
+          if (el && getOpenedMenus().some((el) => isChildEvent(el, ev))) {
+              return;
           }
-          return formatValue(dateNumber, { locale, format });
+          ev.closedMenuId = this.props.menuId;
+          this.close();
       }
-      return localizeNumberLiteral(literal, locale);
-  }
-  function canonicalizeCFRule(cf, locale) {
-      return changeCFRuleLocale(cf, (content) => canonicalizeContent(content, locale));
-  }
-  function localizeCFRule(cf, locale) {
-      return changeCFRuleLocale(cf, (content) => localizeContent(content, locale));
-  }
-  function localizeDataValidationRule(rule, locale) {
-      const localizedDVRule = deepCopy(rule);
-      localizedDVRule.criterion.values = localizedDVRule.criterion.values.map((content) => localizeContent(content, locale));
-      return localizedDVRule;
-  }
-  function changeCFRuleLocale(rule, changeContentLocale) {
-      rule = deepCopy(rule);
-      switch (rule.type) {
-          case "CellIsRule":
-              // Only change value for number operators
-              switch (rule.operator) {
-                  case "Between":
-                  case "NotBetween":
-                  case "Equal":
-                  case "NotEqual":
-                  case "GreaterThan":
-                  case "GreaterThanOrEqual":
-                  case "LessThan":
-                  case "LessThanOrEqual":
-                      rule.values = rule.values.map((v) => changeContentLocale(v));
-                      return rule;
-                  case "BeginsWith":
-                  case "ContainsText":
-                  case "EndsWith":
-                  case "NotContains":
-                  case "IsEmpty":
-                  case "IsNotEmpty":
-                      return rule;
-              }
-              break;
-          case "ColorScaleRule":
-              rule.minimum = changeCFRuleThresholdLocale(rule.minimum, changeContentLocale);
-              rule.maximum = changeCFRuleThresholdLocale(rule.maximum, changeContentLocale);
-              if (rule.midpoint) {
-                  rule.midpoint = changeCFRuleThresholdLocale(rule.midpoint, changeContentLocale);
-              }
-              return rule;
-          case "IconSetRule":
-              rule.lowerInflectionPoint.value = changeContentLocale(rule.lowerInflectionPoint.value);
-              rule.upperInflectionPoint.value = changeContentLocale(rule.upperInflectionPoint.value);
-              return rule;
+      getName(menu) {
+          return menu.name(this.env);
       }
-  }
-  function changeCFRuleThresholdLocale(threshold, changeContentLocale) {
-      if (!threshold?.value) {
-          return threshold;
+      isRoot(menu) {
+          return !menu.execute;
       }
-      const value = threshold.type === "formula" ? "=" + threshold.value : threshold.value;
-      const modified = changeContentLocale(value);
-      const newValue = threshold.type === "formula" ? modified.slice(1) : modified;
-      return { ...threshold, value: newValue };
-  }
-  function getDateTimeFormat(locale) {
-      return locale.dateFormat + " " + locale.timeFormat;
-  }
-
-  const linkSheet = {
-      name: _t("Link sheet"),
-      children: [
-          (env) => {
-              const sheets = env.model.getters
-                  .getSheetIds()
-                  .map((sheetId) => env.model.getters.getSheet(sheetId));
-              return sheets.map((sheet) => ({
-                  id: sheet.id,
-                  name: sheet.name,
-                  execute: () => markdownLink(sheet.name, buildSheetLink(sheet.id)),
-              }));
-          },
-      ],
-  };
-  const deleteSheet = {
-      name: _t("Delete"),
-      isVisible: (env) => {
-          return env.model.getters.getSheetIds().length > 1;
-      },
-      execute: (env) => env.askConfirmation(_t("Are you sure you want to delete this sheet?"), () => {
-          env.model.dispatch("DELETE_SHEET", { sheetId: env.model.getters.getActiveSheetId() });
-      }),
-  };
-  const duplicateSheet = {
-      name: _t("Duplicate"),
-      execute: (env) => {
-          const sheetIdFrom = env.model.getters.getActiveSheetId();
-          const sheetIdTo = env.model.uuidGenerator.uuidv4();
-          env.model.dispatch("DUPLICATE_SHEET", {
-              sheetId: sheetIdFrom,
-              sheetIdTo,
-          });
-          env.model.dispatch("ACTIVATE_SHEET", { sheetIdFrom, sheetIdTo });
-      },
-  };
-  const renameSheet = (args) => {
-      return {
-          name: _t("Rename"),
-          execute: args.renameSheetCallback,
-      };
-  };
-  const sheetMoveRight = {
-      name: _t("Move right"),
-      isVisible: (env) => {
-          const sheetId = env.model.getters.getActiveSheetId();
-          const sheetIds = env.model.getters.getVisibleSheetIds();
-          return sheetIds.indexOf(sheetId) !== sheetIds.length - 1;
-      },
-      execute: (env) => env.model.dispatch("MOVE_SHEET", {
-          sheetId: env.model.getters.getActiveSheetId(),
-          delta: 1,
-      }),
-  };
-  const sheetMoveLeft = {
-      name: _t("Move left"),
-      isVisible: (env) => {
-          const sheetId = env.model.getters.getActiveSheetId();
-          return env.model.getters.getVisibleSheetIds()[0] !== sheetId;
-      },
-      execute: (env) => env.model.dispatch("MOVE_SHEET", {
-          sheetId: env.model.getters.getActiveSheetId(),
-          delta: -1,
-      }),
-  };
-  const hideSheet = {
-      name: _t("Hide sheet"),
-      isVisible: (env) => env.model.getters.getVisibleSheetIds().length !== 1,
-      execute: (env) => env.model.dispatch("HIDE_SHEET", { sheetId: env.model.getters.getActiveSheetId() }),
-  };
-
-  /**
-   * The class Registry is extended in order to add the function addChild
-   *
-   */
-  class MenuItemRegistry extends Registry {
-      /**
-       * @override
-       */
-      add(key, value) {
-          if (value.id === undefined) {
-              value.id = key;
+      isEnabled(menu) {
+          if (menu.isEnabled(this.env)) {
+              return this.env.model.getters.isReadonly() ? menu.isReadonlyAllowed : true;
           }
-          this.content[key] = value;
-          return this;
+          return false;
+      }
+      onScroll(ev) {
+          this.subMenu.scrollOffset = ev.target.scrollTop;
       }
       /**
-       * Add a subitem to an existing item
-       * @param path Path of items to add this subitem
-       * @param value Subitem to add
+       * If the given menu is not disabled, open it's submenu at the
+       * correct position according to available surrounding space.
        */
-      addChild(key, path, value) {
-          if (typeof value !== "function" && value.id === undefined) {
-              value.id = key;
-          }
-          const root = path.splice(0, 1)[0];
-          let node = this.content[root];
-          if (!node) {
-              throw new Error(`Path ${root + ":" + path.join(":")} not found`);
-          }
-          for (let p of path) {
-              const children = node.children;
-              if (!children || typeof children === "function") {
-                  throw new Error(`${p} is either not a node or it's dynamically computed`);
+      openSubMenu(menu, menuIndex, ev) {
+          const parentMenuEl = ev.currentTarget;
+          if (!parentMenuEl)
+              return;
+          const y = parentMenuEl.getBoundingClientRect().top;
+          this.subMenu.position = {
+              x: this.position.x + this.props.depth * MENU_WIDTH,
+              y: y - (this.subMenu.scrollOffset || 0),
+          };
+          this.subMenu.menuItems = menu.children(this.env);
+          this.subMenu.isOpen = true;
+          this.subMenu.parentMenu = menu;
+      }
+      isParentMenu(subMenu, menuItem) {
+          return subMenu.parentMenu?.id === menuItem.id;
+      }
+      closeSubMenu() {
+          this.subMenu.isOpen = false;
+          this.subMenu.parentMenu = undefined;
+      }
+      onClickMenu(menu, menuIndex, ev) {
+          if (this.isEnabled(menu)) {
+              if (this.isRoot(menu)) {
+                  this.openSubMenu(menu, menuIndex, ev);
               }
-              node = children.find((elt) => elt.id === p);
-              if (!node) {
-                  throw new Error(`Path ${root + ":" + path.join(":")} not found`);
+              else {
+                  this.activateMenu(menu);
               }
           }
-          if (!node.children) {
-              node.children = [];
-          }
-          node.children.push(value);
-          return this;
       }
-      getMenuItems() {
-          return createActions(this.getAll());
+      onMouseOver(menu, position, ev) {
+          if (this.isEnabled(menu)) {
+              if (this.isRoot(menu)) {
+                  this.openSubMenu(menu, position, ev);
+              }
+              else {
+                  this.closeSubMenu();
+              }
+          }
       }
   }
 
-  //------------------------------------------------------------------------------
-  // Link Menu Registry
-  //------------------------------------------------------------------------------
-  const linkMenuRegistry = new MenuItemRegistry();
-  linkMenuRegistry.add("sheet", {
-      ...linkSheet,
-      sequence: 10,
-  });
-
   const MENU_OFFSET_X = 320;
   const MENU_OFFSET_Y = 100;
   const PADDING = 12;
@@ -9131,119 +9134,6 @@
       return "year";
   }
 
-  class LineChart extends AbstractChart {
-      dataSets;
-      labelRange;
-      background;
-      verticalAxisPosition;
-      legendPosition;
-      labelsAsText;
-      stacked;
-      aggregated;
-      type = "line";
-      dataSetsHaveTitle;
-      cumulative;
-      constructor(definition, sheetId, getters) {
-          super(definition, sheetId, getters);
-          this.dataSets = createDataSets(this.getters, definition.dataSets, sheetId, definition.dataSetsHaveTitle);
-          this.labelRange = createRange(this.getters, sheetId, definition.labelRange);
-          this.background = definition.background;
-          this.verticalAxisPosition = definition.verticalAxisPosition;
-          this.legendPosition = definition.legendPosition;
-          this.labelsAsText = definition.labelsAsText;
-          this.stacked = definition.stacked;
-          this.aggregated = definition.aggregated;
-          this.dataSetsHaveTitle = definition.dataSetsHaveTitle;
-          this.cumulative = definition.cumulative;
-      }
-      static validateChartDefinition(validator, definition) {
-          return validator.checkValidations(definition, checkDataset, checkLabelRange);
-      }
-      static transformDefinition(definition, executed) {
-          return transformChartDefinitionWithDataSetsWithZone(definition, executed);
-      }
-      static getDefinitionFromContextCreation(context) {
-          return {
-              background: context.background,
-              dataSets: context.range ? context.range : [],
-              dataSetsHaveTitle: false,
-              labelsAsText: false,
-              legendPosition: "top",
-              title: context.title || "",
-              type: "line",
-              verticalAxisPosition: "left",
-              labelRange: context.auxiliaryRange || undefined,
-              stacked: false,
-              aggregated: false,
-              cumulative: false,
-          };
-      }
-      getDefinition() {
-          return this.getDefinitionWithSpecificDataSets(this.dataSets, this.labelRange);
-      }
-      getDefinitionWithSpecificDataSets(dataSets, labelRange, targetSheetId) {
-          return {
-              type: "line",
-              dataSetsHaveTitle: dataSets.length ? Boolean(dataSets[0].labelCell) : false,
-              background: this.background,
-              dataSets: dataSets.map((ds) => this.getters.getRangeString(ds.dataRange, targetSheetId || this.sheetId)),
-              legendPosition: this.legendPosition,
-              verticalAxisPosition: this.verticalAxisPosition,
-              labelRange: labelRange
-                  ? this.getters.getRangeString(labelRange, targetSheetId || this.sheetId)
-                  : undefined,
-              title: this.title,
-              labelsAsText: this.labelsAsText,
-              stacked: this.stacked,
-              aggregated: this.aggregated,
-              cumulative: this.cumulative,
-          };
-      }
-      getContextCreation() {
-          return {
-              background: this.background,
-              title: this.title,
-              range: this.dataSets.map((ds) => this.getters.getRangeString(ds.dataRange, this.sheetId)),
-              auxiliaryRange: this.labelRange
-                  ? this.getters.getRangeString(this.labelRange, this.sheetId)
-                  : undefined,
-          };
-      }
-      updateRanges(applyChange) {
-          const { dataSets, labelRange, isStale } = updateChartRangesWithDataSets(this.getters, applyChange, this.dataSets, this.labelRange);
-          if (!isStale) {
-              return this;
-          }
-          const definition = this.getDefinitionWithSpecificDataSets(dataSets, labelRange);
-          return new LineChart(definition, this.sheetId, this.getters);
-      }
-      getDefinitionForExcel() {
-          // Excel does not support aggregating labels
-          if (this.aggregated)
-              return undefined;
-          const dataSets = this.dataSets
-              .map((ds) => toExcelDataset(this.getters, ds))
-              .filter((ds) => ds.range !== ""); // && range !== CellErrorType.InvalidReference ? show incorrect #ref ?
-          const labelRange = toExcelLabelRange(this.getters, this.labelRange, shouldRemoveFirstLabel(this.labelRange, this.dataSets[0], this.dataSetsHaveTitle));
-          return {
-              ...this.getDefinition(),
-              backgroundColor: toXlsxHexColor(this.background || BACKGROUND_CHART_COLOR),
-              fontColor: toXlsxHexColor(chartFontColor(this.background)),
-              dataSets,
-              labelRange,
-          };
-      }
-      copyForSheetId(sheetId) {
-          const dataSets = copyDataSetsWithNewSheetId(this.sheetId, sheetId, this.dataSets);
-          const labelRange = copyLabelRangeWithNewSheetId(this.sheetId, sheetId, this.labelRange);
-          const definition = this.getDefinitionWithSpecificDataSets(dataSets, labelRange, sheetId);
-          return new LineChart(definition, sheetId, this.getters);
-      }
-      copyInSheetId(sheetId) {
-          const definition = this.getDefinitionWithSpecificDataSets(this.dataSets, this.labelRange, sheetId);
-          return new LineChart(definition, sheetId, this.getters);
-      }
-  }
   function fixEmptyLabelsForDateCharts(labels, dataSetsValues) {
       if (labels.length === 0 || labels.every((label) => !label)) {
           return { labels, dataSetsValues };
@@ -9302,7 +9192,23 @@
       }
       return true;
   }
-  function getLineConfiguration(chart, labels, localeFormat) {
+  let missingTimeAdapterAlreadyWarned = false;
+  function isLuxonTimeAdapterInstalled() {
+      // @ts-ignore
+      if (!window.Chart) {
+          return false;
+      }
+      // @ts-ignore
+      const adapter = new window.Chart._adapters._date({});
+      // @ts-ignore
+      const isInstalled = adapter._id === "luxon";
+      if (!isInstalled && !missingTimeAdapterAlreadyWarned) {
+          missingTimeAdapterAlreadyWarned = true;
+          console.warn("'chartjs-adapter-luxon' time adapter is not installed. Time scale axes are disabled.");
+      }
+      return isInstalled;
+  }
+  function getLineOrScatterConfiguration(chart, labels, localeFormat) {
       const fontColor = chartFontColor(chart.background);
       const config = getDefaultChartJsRuntime(chart, labels, fontColor, localeFormat);
       const legend = {
@@ -9353,13 +9259,13 @@
               },
           },
       };
-      if (chart.stacked && config.options?.scales?.y) {
+      if ("stacked" in chart && chart.stacked && config.options?.scales?.y) {
           // @ts-ignore chart.js type is wrong
           config.options.scales.y.stacked = true;
       }
       return config;
   }
-  function createLineChartRuntime(chart, getters) {
+  function createLineOrScatterChartRuntime(chart, getters) {
       const axisType = getChartAxisType(chart, getters);
       const labelValues = getChartLabelValues(getters, chart.dataSets, chart.labelRange);
       let labels = axisType === "linear" ? labelValues.values : labelValues.formattedValues;
@@ -9379,7 +9285,7 @@
       const locale = getters.getLocale();
       const dataSetFormat = getChartDatasetFormat(getters, chart.dataSets);
       const localeFormat = { format: dataSetFormat, locale };
-      const config = getLineConfiguration(chart, labels, localeFormat);
+      const config = getLineOrScatterConfiguration(chart, labels, localeFormat);
       const labelFormat = getChartLabelFormat(getters, chart.labelRange);
       if (axisType === "time") {
           const axis = {
@@ -9399,6 +9305,8 @@
               });
           };
       }
+      const stacked = "stacked" in chart ? chart.stacked : false;
+      const cumulative = "cumulative" in chart ? chart.cumulative : false;
       const colors = new ChartColors();
       for (let [index, { label, data }] of dataSetsValues.entries()) {
           if (["linear", "time"].includes(axisType)) {
@@ -9407,10 +9315,10 @@
           }
           const color = colors.next();
           let backgroundRGBA = colorToRGBA(color);
-          if (chart.stacked) {
+          if (stacked) {
               backgroundRGBA.a = LINE_FILL_TRANSPARENCY;
           }
-          if (chart.cumulative) {
+          if (cumulative) {
               let accumulator = 0;
               data = data.map((value) => {
                   if (!isNaN(value)) {
@@ -9428,27 +9336,136 @@
               borderColor: color,
               backgroundColor,
               pointBackgroundColor: color,
-              fill: chart.stacked ? getFillingMode(index) : false,
+              fill: stacked ? getFillingMode(index) : false,
           };
           config.data.datasets.push(dataset);
       }
-      return { chartJsConfig: config, background: chart.background || BACKGROUND_CHART_COLOR };
+      return {
+          chartJsConfig: config,
+          background: chart.background || BACKGROUND_CHART_COLOR,
+          dataSetsValues,
+          labelValues,
+          dataSetFormat,
+          labelFormat,
+      };
   }
-  let missingTimeAdapterAlreadyWarned = false;
-  function isLuxonTimeAdapterInstalled() {
-      // @ts-ignore
-      if (!window.Chart) {
-          return false;
+
+  class LineChart extends AbstractChart {
+      dataSets;
+      labelRange;
+      background;
+      verticalAxisPosition;
+      legendPosition;
+      labelsAsText;
+      stacked;
+      aggregated;
+      type = "line";
+      dataSetsHaveTitle;
+      cumulative;
+      constructor(definition, sheetId, getters) {
+          super(definition, sheetId, getters);
+          this.dataSets = createDataSets(this.getters, definition.dataSets, sheetId, definition.dataSetsHaveTitle);
+          this.labelRange = createRange(this.getters, sheetId, definition.labelRange);
+          this.background = definition.background;
+          this.verticalAxisPosition = definition.verticalAxisPosition;
+          this.legendPosition = definition.legendPosition;
+          this.labelsAsText = definition.labelsAsText;
+          this.stacked = definition.stacked;
+          this.aggregated = definition.aggregated;
+          this.dataSetsHaveTitle = definition.dataSetsHaveTitle;
+          this.cumulative = definition.cumulative;
       }
-      // @ts-ignore
-      const adapter = new window.Chart._adapters._date({});
-      // @ts-ignore
-      const isInstalled = adapter._id === "luxon";
-      if (!isInstalled && !missingTimeAdapterAlreadyWarned) {
-          missingTimeAdapterAlreadyWarned = true;
-          console.warn("'chartjs-adapter-luxon' time adapter is not installed. Time scale axes are disabled.");
+      static validateChartDefinition(validator, definition) {
+          return validator.checkValidations(definition, checkDataset, checkLabelRange);
+      }
+      static transformDefinition(definition, executed) {
+          return transformChartDefinitionWithDataSetsWithZone(definition, executed);
+      }
+      static getDefinitionFromContextCreation(context) {
+          return {
+              background: context.background,
+              dataSets: context.range ? context.range : [],
+              dataSetsHaveTitle: false,
+              labelsAsText: false,
+              legendPosition: "top",
+              title: context.title || "",
+              type: "line",
+              verticalAxisPosition: "left",
+              labelRange: context.auxiliaryRange || undefined,
+              stacked: false,
+              aggregated: false,
+              cumulative: false,
+          };
+      }
+      getDefinition() {
+          return this.getDefinitionWithSpecificDataSets(this.dataSets, this.labelRange);
+      }
+      getDefinitionWithSpecificDataSets(dataSets, labelRange, targetSheetId) {
+          return {
+              type: "line",
+              dataSetsHaveTitle: dataSets.length ? Boolean(dataSets[0].labelCell) : false,
+              background: this.background,
+              dataSets: dataSets.map((ds) => this.getters.getRangeString(ds.dataRange, targetSheetId || this.sheetId)),
+              legendPosition: this.legendPosition,
+              verticalAxisPosition: this.verticalAxisPosition,
+              labelRange: labelRange
+                  ? this.getters.getRangeString(labelRange, targetSheetId || this.sheetId)
+                  : undefined,
+              title: this.title,
+              labelsAsText: this.labelsAsText,
+              stacked: this.stacked,
+              aggregated: this.aggregated,
+              cumulative: this.cumulative,
+          };
+      }
+      getContextCreation() {
+          return {
+              background: this.background,
+              title: this.title,
+              range: this.dataSets.map((ds) => this.getters.getRangeString(ds.dataRange, this.sheetId)),
+              auxiliaryRange: this.labelRange
+                  ? this.getters.getRangeString(this.labelRange, this.sheetId)
+                  : undefined,
+          };
+      }
+      updateRanges(applyChange) {
+          const { dataSets, labelRange, isStale } = updateChartRangesWithDataSets(this.getters, applyChange, this.dataSets, this.labelRange);
+          if (!isStale) {
+              return this;
+          }
+          const definition = this.getDefinitionWithSpecificDataSets(dataSets, labelRange);
+          return new LineChart(definition, this.sheetId, this.getters);
+      }
+      getDefinitionForExcel() {
+          // Excel does not support aggregating labels
+          if (this.aggregated)
+              return undefined;
+          const dataSets = this.dataSets
+              .map((ds) => toExcelDataset(this.getters, ds))
+              .filter((ds) => ds.range !== ""); // && range !== CellErrorType.InvalidReference ? show incorrect #ref ?
+          const labelRange = toExcelLabelRange(this.getters, this.labelRange, shouldRemoveFirstLabel(this.labelRange, this.dataSets[0], this.dataSetsHaveTitle));
+          return {
+              ...this.getDefinition(),
+              backgroundColor: toXlsxHexColor(this.background || BACKGROUND_CHART_COLOR),
+              fontColor: toXlsxHexColor(chartFontColor(this.background)),
+              dataSets,
+              labelRange,
+          };
+      }
+      copyForSheetId(sheetId) {
+          const dataSets = copyDataSetsWithNewSheetId(this.sheetId, sheetId, this.dataSets);
+          const labelRange = copyLabelRangeWithNewSheetId(this.sheetId, sheetId, this.labelRange);
+          const definition = this.getDefinitionWithSpecificDataSets(dataSets, labelRange, sheetId);
+          return new LineChart(definition, sheetId, this.getters);
+      }
+      copyInSheetId(sheetId) {
+          const definition = this.getDefinitionWithSpecificDataSets(this.dataSets, this.labelRange, sheetId);
+          return new LineChart(definition, sheetId, this.getters);
       }
-      return isInstalled;
+  }
+  function createLineChartRuntime(chart, getters) {
+      const { chartJsConfig, background } = createLineOrScatterChartRuntime(chart, getters);
+      return { chartJsConfig, background };
   }
 
   class PieChart extends AbstractChart {
@@ -9650,6 +9667,132 @@
       return { chartJsConfig: config, background: chart.background || BACKGROUND_CHART_COLOR };
   }
 
+  class ScatterChart extends AbstractChart {
+      dataSets;
+      labelRange;
+      background;
+      verticalAxisPosition;
+      legendPosition;
+      labelsAsText;
+      aggregated;
+      type = "scatter";
+      dataSetsHaveTitle;
+      constructor(definition, sheetId, getters) {
+          super(definition, sheetId, getters);
+          this.dataSets = createDataSets(this.getters, definition.dataSets, sheetId, definition.dataSetsHaveTitle);
+          this.labelRange = createRange(this.getters, sheetId, definition.labelRange);
+          this.background = definition.background;
+          this.verticalAxisPosition = definition.verticalAxisPosition;
+          this.legendPosition = definition.legendPosition;
+          this.labelsAsText = definition.labelsAsText;
+          this.aggregated = definition.aggregated;
+          this.dataSetsHaveTitle = definition.dataSetsHaveTitle;
+      }
+      static validateChartDefinition(validator, definition) {
+          return validator.checkValidations(definition, checkDataset, checkLabelRange);
+      }
+      static transformDefinition(definition, executed) {
+          return transformChartDefinitionWithDataSetsWithZone(definition, executed);
+      }
+      static getDefinitionFromContextCreation(context) {
+          return {
+              background: context.background,
+              dataSets: context.range ? context.range : [],
+              dataSetsHaveTitle: false,
+              labelsAsText: false,
+              legendPosition: "top",
+              title: context.title || "",
+              type: "scatter",
+              verticalAxisPosition: "left",
+              labelRange: context.auxiliaryRange || undefined,
+              aggregated: false,
+          };
+      }
+      getDefinition() {
+          return this.getDefinitionWithSpecificDataSets(this.dataSets, this.labelRange);
+      }
+      getDefinitionWithSpecificDataSets(dataSets, labelRange, targetSheetId) {
+          return {
+              type: "scatter",
+              dataSetsHaveTitle: dataSets.length ? Boolean(dataSets[0].labelCell) : false,
+              background: this.background,
+              dataSets: dataSets.map((ds) => this.getters.getRangeString(ds.dataRange, targetSheetId || this.sheetId)),
+              legendPosition: this.legendPosition,
+              verticalAxisPosition: this.verticalAxisPosition,
+              labelRange: labelRange
+                  ? this.getters.getRangeString(labelRange, targetSheetId || this.sheetId)
+                  : undefined,
+              title: this.title,
+              labelsAsText: this.labelsAsText,
+              aggregated: this.aggregated,
+          };
+      }
+      getContextCreation() {
+          return {
+              background: this.background,
+              title: this.title,
+              range: this.dataSets.map((ds) => this.getters.getRangeString(ds.dataRange, this.sheetId)),
+              auxiliaryRange: this.labelRange
+                  ? this.getters.getRangeString(this.labelRange, this.sheetId)
+                  : undefined,
+          };
+      }
+      updateRanges(applyChange) {
+          const { dataSets, labelRange, isStale } = updateChartRangesWithDataSets(this.getters, applyChange, this.dataSets, this.labelRange);
+          if (!isStale) {
+              return this;
+          }
+          const definition = this.getDefinitionWithSpecificDataSets(dataSets, labelRange);
+          return new ScatterChart(definition, this.sheetId, this.getters);
+      }
+      getDefinitionForExcel() {
+          return undefined; // TODO
+      }
+      copyForSheetId(sheetId) {
+          const dataSets = copyDataSetsWithNewSheetId(this.sheetId, sheetId, this.dataSets);
+          const labelRange = copyLabelRangeWithNewSheetId(this.sheetId, sheetId, this.labelRange);
+          const definition = this.getDefinitionWithSpecificDataSets(dataSets, labelRange, sheetId);
+          return new ScatterChart(definition, sheetId, this.getters);
+      }
+      copyInSheetId(sheetId) {
+          const definition = this.getDefinitionWithSpecificDataSets(this.dataSets, this.labelRange, sheetId);
+          return new ScatterChart(definition, sheetId, this.getters);
+      }
+  }
+  function createScatterChartRuntime(chart, getters) {
+      const { chartJsConfig, background, dataSetsValues, dataSetFormat, labelValues, labelFormat } = createLineOrScatterChartRuntime(chart, getters);
+      // use chartJS line chart and disable the lines instead of chartJS scatter chart. This is because the scatter chart
+      // have less options than the line chart (it only works with linear labels)
+      chartJsConfig.type = "line";
+      const configOptions = chartJsConfig.options;
+      configOptions.elements = {
+          point: {
+              radius: 3,
+              hoverRadius: 3,
+              hitRadius: 8,
+          },
+      };
+      const locale = getters.getLocale();
+      configOptions.plugins.tooltip.callbacks.title = () => "";
+      configOptions.plugins.tooltip.callbacks.label = (tooltipItem) => {
+          const dataSetPoint = dataSetsValues[tooltipItem.datasetIndex].data[tooltipItem.dataIndex];
+          let label = tooltipItem.label || labelValues.values[tooltipItem.dataIndex];
+          if (isNumber(label, locale)) {
+              label = toNumber(label, locale);
+          }
+          const formattedX = formatValue(label, { locale, format: labelFormat });
+          const formattedY = formatValue(dataSetPoint, { locale, format: dataSetFormat });
+          const dataSetTitle = tooltipItem.dataset.label;
+          return formattedX
+              ? `${dataSetTitle}: (${formattedX}, ${formattedY})`
+              : `${dataSetTitle}: ${formattedY}`;
+      };
+      for (const dataSet of chartJsConfig.data.datasets) {
+          dataSet.showLine = false;
+      }
+      return { chartJsConfig, background };
+  }
+
   /**
    * This registry is intended to map a cell content (raw string) to
    * an instance of a cell.
@@ -9705,11 +9848,22 @@
       name: _t("Gauge"),
       sequence: 50,
   });
+  chartRegistry.add("scatter", {
+      match: (type) => type === "scatter",
+      createChart: (definition, sheetId, getters) => new ScatterChart(definition, sheetId, getters),
+      getChartRuntime: createScatterChartRuntime,
+      validateChartDefinition: (validator, definition) => ScatterChart.validateChartDefinition(validator, definition),
+      transformDefinition: (definition, executed) => ScatterChart.transformDefinition(definition, executed),
+      getChartDefinitionFromContextCreation: (context) => ScatterChart.getDefinitionFromContextCreation(context),
+      name: _t("Scatter"),
+      sequence: 60,
+  });
   const chartComponentRegistry = new Registry();
   chartComponentRegistry.add("line", ChartJsComponent);
   chartComponentRegistry.add("bar", ChartJsComponent);
   chartComponentRegistry.add("pie", ChartJsComponent);
   chartComponentRegistry.add("gauge", ChartJsComponent);
+  chartComponentRegistry.add("scatter", ChartJsComponent);
   chartComponentRegistry.add("scorecard", ScorecardChart);
 
   /**
@@ -19648,9 +19802,6 @@
       { name: _t("Web"), functions: web },
   ];
   const functionNameRegex = /^[A-Z0-9\_\.]+$/;
-  //------------------------------------------------------------------------------
-  // Function registry
-  //------------------------------------------------------------------------------
   class FunctionRegistry extends Registry {
       mapping = {};
       add(name, addDescr) {
@@ -19936,6 +20087,58 @@
       execute: INSERT_LINK,
       icon: "o-spreadsheet-Icon.INSERT_LINK",
   };
+  const insertCheckbox = {
+      name: _t("Checkbox"),
+      execute: (env) => {
+          const zones = env.model.getters.getSelectedZones();
+          const sheetId = env.model.getters.getActiveSheetId();
+          const ranges = zones.map((zone) => env.model.getters.getRangeDataFromZone(sheetId, zone));
+          env.model.dispatch("ADD_DATA_VALIDATION_RULE", {
+              ranges,
+              sheetId,
+              rule: {
+                  id: env.model.uuidGenerator.uuidv4(),
+                  criterion: {
+                      type: "isBoolean",
+                      values: [],
+                  },
+              },
+          });
+      },
+      icon: "o-spreadsheet-Icon.INSERT_CHECKBOX",
+  };
+  const insertDropdown = {
+      name: _t("Dropdown list"),
+      execute: (env) => {
+          const zones = env.model.getters.getSelectedZones();
+          const sheetId = env.model.getters.getActiveSheetId();
+          const ranges = zones.map((zone) => env.model.getters.getRangeDataFromZone(sheetId, zone));
+          const ruleID = env.model.uuidGenerator.uuidv4();
+          env.model.dispatch("ADD_DATA_VALIDATION_RULE", {
+              ranges,
+              sheetId,
+              rule: {
+                  id: ruleID,
+                  criterion: {
+                      type: "isValueInList",
+                      values: [],
+                      displayStyle: "arrow",
+                  },
+              },
+          });
+          const rule = env.model.getters.getDataValidationRule(sheetId, ruleID);
+          if (!rule) {
+              return;
+          }
+          env.openSidePanel("DataValidationEditor", {
+              rule: localizeDataValidationRule(rule, env.model.getters.getLocale()),
+              onExit: () => {
+                  env.openSidePanel("DataValidation");
+              },
+          });
+      },
+      icon: "o-spreadsheet-Icon.INSERT_DROPDOWN",
+  };
   const insertSheet = {
       name: _t("Insert sheet"),
       execute: (env) => {
@@ -21338,7 +21541,7 @@
   })
       .addChild("insert_cell", ["insert"], {
       ...insertCell,
-      sequence: 43,
+      sequence: 30,
   })
       .addChild("insert_cell_down", ["insert", "insert_cell"], {
       ...insertCellShiftDown,
@@ -21352,7 +21555,7 @@
   })
       .addChild("insert_sheet", ["insert"], {
       ...insertSheet,
-      sequence: 80,
+      sequence: 40,
       separator: true,
   })
       .addChild("insert_chart", ["insert"], {
@@ -21397,6 +21600,15 @@
       ...insertLink,
       separator: true,
       sequence: 70,
+  })
+      .addChild("insert_checkbox", ["insert"], {
+      ...insertCheckbox,
+      sequence: 80,
+  })
+      .addChild("insert_dropdown", ["insert"], {
+      ...insertDropdown,
+      separator: true,
+      sequence: 90,
   })
       // ---------------------------------------------------------------------
       // FORMAT MENU ITEMS
@@ -22605,7 +22817,7 @@
 
   class ChartTitle extends owl.Component {
       static template = "o-spreadsheet.ChartTitle";
-      static components = { ColorPickerWidget, Section };
+      static components = { Section };
       static props = { title: String, update: Function };
       updateTitle(ev) {
           this.props.update(ev.target.value);
@@ -22614,7 +22826,7 @@
 
   class LineBarPieDesignPanel extends owl.Component {
       static template = "o-spreadsheet-LineBarPieDesignPanel";
-      static components = { ChartColor, ColorPickerWidget, ChartTitle, Section };
+      static components = { ChartColor, ChartTitle, Section };
       static props = {
           figureId: String,
           definition: Object,
@@ -22645,7 +22857,7 @@
 
   class GaugeChartConfigPanel extends owl.Component {
       static template = "o-spreadsheet-GaugeChartConfigPanel";
-      static components = { SelectionInput, ChartErrorSection, ChartDataSeries };
+      static components = { ChartErrorSection, ChartDataSeries };
       static props = {
           figureId: String,
           definition: Object,
@@ -22844,9 +23056,37 @@
       static template = "o-spreadsheet-LineChartDesignPanel";
   }
 
+  class ScatterConfigPanel extends LineBarPieConfigPanel {
+      static template = "o-spreadsheet-ScatterConfigPanel";
+      get canTreatLabelsAsText() {
+          const chart = this.env.model.getters.getChart(this.props.figureId);
+          if (chart && chart instanceof ScatterChart) {
+              return canChartParseLabels(chart.labelRange, this.env.model.getters);
+          }
+          return false;
+      }
+      onUpdateLabelsAsText(labelsAsText) {
+          this.props.updateChart(this.props.figureId, {
+              labelsAsText,
+          });
+      }
+      getLabelRangeOptions() {
+          const options = super.getLabelRangeOptions();
+          if (this.canTreatLabelsAsText) {
+              options.push({
+                  name: "labelsAsText",
+                  value: this.props.definition.labelsAsText,
+                  label: _t("Treat labels as text"),
+                  onChange: this.onUpdateLabelsAsText.bind(this),
+              });
+          }
+          return options;
+      }
+  }
+
   class ScorecardChartConfigPanel extends owl.Component {
       static template = "o-spreadsheet-ScorecardChartConfigPanel";
-      static components = { SelectionInput, ValidationMessages, ChartErrorSection, Section };
+      static components = { SelectionInput, ChartErrorSection, Section };
       static props = {
           figureId: String,
           definition: Object,
@@ -22964,6 +23204,10 @@
       .add("line", {
       configuration: LineConfigPanel,
       design: LineChartDesignPanel,
+  })
+      .add("scatter", {
+      configuration: ScatterConfigPanel,
+      design: LineChartDesignPanel,
   })
       .add("bar", {
       configuration: BarConfigPanel,
@@ -24297,377 +24541,6 @@
       }
   }
 
-  css /* scss */ `
-  .o-find-and-replace {
-    outline: none;
-    height: 100%;
-    .o-input-search-container {
-      display: flex;
-      .o-input-with-count {
-        flex-grow: 1;
-        width: auto;
-      }
-      .o-input-without-count {
-        width: 100%;
-      }
-      .o-input-count {
-        width: fit-content;
-        padding: 4px 0 4px 4px;
-      }
-    }
-
-    .o-matches-count div {
-      text-overflow: ellipsis;
-      overflow: hidden;
-      white-space: nowrap;
-    }
-  }
-`;
-  class FindAndReplacePanel extends owl.Component {
-      static template = "o-spreadsheet-FindAndReplacePanel";
-      static components = { SelectionInput, Section, Checkbox };
-      static props = {
-          onCloseSidePanel: Function,
-      };
-      debounceTimeoutId;
-      initialShowFormulaState = false;
-      dataRange = "";
-      searchInput = owl.useRef("searchInput");
-      replaceInput = owl.useRef("replaceInput");
-      get hasSearchResult() {
-          return this.env.model.getters.getCurrentSelectedMatchIndex() !== null;
-      }
-      get pendingSearch() {
-          return this.debounceTimeoutId !== undefined;
-      }
-      get searchOptions() {
-          return this.env.model.getters.getSearchOptions();
-      }
-      get toSearch() {
-          return this.searchInput.el?.value || "";
-      }
-      get toReplace() {
-          return this.replaceInput.el?.value || "";
-      }
-      get allSheetsMatchesCount() {
-          return _t("%s in all sheets", this.env.model.getters.getAllSheetMatchesCount());
-      }
-      get currentSheetMatchesCount() {
-          return _t("%(matches)s in sheet %(sheetName)s", {
-              matches: this.env.model.getters.getActiveSheetMatchesCount(),
-              sheetName: this.env.model.getters.getSheetName(this.env.model.getters.getActiveSheetId()),
-          });
-      }
-      get specificRangeMatchesCount() {
-          const range = this.searchOptions.specificRange;
-          if (!range) {
-              return "";
-          }
-          const { _sheetId, _zone } = range;
-          return _t("%(matches)s in range %(range)s of sheet %(sheetName)s", {
-              matches: this.env.model.getters.getSpecificRangeMatchesCount().toString(),
-              range: zoneToXc(_zone),
-              sheetName: this.env.model.getters.getSheetName(_sheetId),
-          });
-      }
-      setup() {
-          this.initialShowFormulaState = this.env.model.getters.shouldShowFormulas();
-          owl.onMounted(() => this.searchInput.el?.focus());
-          owl.onWillUnmount(() => {
-              clearTimeout(this.debounceTimeoutId);
-              this.env.model.dispatch("CLEAR_SEARCH");
-              this.env.model.dispatch("SET_FORMULA_VISIBILITY", { show: this.initialShowFormulaState });
-          });
-          owl.useEffect(() => {
-              const showFormula = this.env.model.getters.shouldShowFormulas();
-              this.updateSearch({ searchFormulas: showFormula });
-          }, () => [this.env.model.getters.shouldShowFormulas()]);
-      }
-      onFocusSearch() {
-          this.updateDataRange();
-      }
-      onInput() {
-          this.debouncedUpdateSearch();
-      }
-      onKeydownSearch(ev) {
-          if (ev.key === "Enter") {
-              ev.preventDefault();
-              ev.stopPropagation();
-              this.onSelectNextCell();
-          }
-      }
-      onKeydownReplace(ev) {
-          if (ev.key === "Enter") {
-              ev.preventDefault();
-              ev.stopPropagation();
-              this.replace();
-          }
-      }
-      searchFormulas(showFormula) {
-          this.env.model.dispatch("SET_FORMULA_VISIBILITY", {
-              show: showFormula,
-          });
-          this.updateSearch({ searchFormulas: showFormula });
-      }
-      searchExactMatch(exactMatch) {
-          this.updateSearch({ exactMatch });
-      }
-      searchMatchCase(matchCase) {
-          this.updateSearch({ matchCase });
-      }
-      changeSearchScope(ev) {
-          const searchScope = ev.target.value;
-          this.updateSearch({ searchScope });
-      }
-      onSearchRangeChanged(ranges) {
-          this.dataRange = ranges[0];
-      }
-      updateDataRange() {
-          if (!this.dataRange) {
-              return;
-          }
-          if (this.searchOptions.searchScope === "specificRange") {
-              const specificRange = this.env.model.getters.getRangeFromSheetXC(this.env.model.getters.getActiveSheetId(), this.dataRange).rangeData;
-              this.updateSearch({ specificRange });
-          }
-      }
-      onSelectPreviousCell() {
-          this.env.model.dispatch("SELECT_SEARCH_PREVIOUS_MATCH");
-      }
-      onSelectNextCell() {
-          this.env.model.dispatch("SELECT_SEARCH_NEXT_MATCH");
-      }
-      updateSearch(updateSearchOptions) {
-          const searchOptions = {
-              ...this.env.model.getters.getSearchOptions(),
-              ...updateSearchOptions,
-          };
-          this.env.model.dispatch("UPDATE_SEARCH", {
-              toSearch: this.toSearch,
-              searchOptions,
-          });
-      }
-      debouncedUpdateSearch() {
-          clearTimeout(this.debounceTimeoutId);
-          this.debounceTimeoutId = setTimeout(() => {
-              this.updateSearch();
-              this.debounceTimeoutId = undefined;
-          }, 200);
-      }
-      replace() {
-          this.env.model.dispatch("REPLACE_SEARCH", {
-              replaceWith: this.toReplace,
-          });
-      }
-      replaceAll() {
-          this.env.model.dispatch("REPLACE_ALL_SEARCH", {
-              replaceWith: this.toReplace,
-          });
-      }
-  }
-
-  css /* scss */ `
-  .o-more-formats-panel {
-    .format-preview {
-      height: 48px;
-      background-color: white;
-
-      &:hover {
-        background-color: rgba(0, 0, 0, 0.08);
-      }
-    }
-    .check-icon {
-      width: 24px;
-    }
-  }
-`;
-  const DATE_FORMAT_ACTIONS = createActions([
-      formatNumberFullDateTime,
-      formatNumberFullWeekDayAndMonth,
-      formatNumberDayAndFullMonth,
-      formatNumberShortWeekDay,
-      formatNumberDayAndShortMonth,
-      formatNumberFullMonth,
-      formatNumberShortMonth,
-      formatNumberDate,
-      formatNumberTime,
-      formatNumberDateTime,
-      formatNumberDuration,
-  ]);
-  class MoreFormatsPanel extends owl.Component {
-      static template = "o-spreadsheet-MoreFormatsPanel";
-      static props = {
-          onCloseSidePanel: Function,
-      };
-      get dateFormatsActions() {
-          return DATE_FORMAT_ACTIONS;
-      }
-  }
-
-  css /* scss */ `
-  .o-checkbox-selection {
-    height: 150px;
-  }
-`;
-  class RemoveDuplicatesPanel extends owl.Component {
-      static template = "o-spreadsheet-RemoveDuplicatesPanel";
-      static components = { ValidationMessages, Section, Checkbox };
-      state = owl.useState({
-          hasHeader: false,
-          columns: {},
-      });
-      setup() {
-          owl.onWillUpdateProps(() => this.updateColumns());
-      }
-      toggleHasHeader() {
-          this.state.hasHeader = !this.state.hasHeader;
-      }
-      toggleAllColumns() {
-          const newState = !this.isEveryColumnSelected;
-          for (const index in this.state.columns) {
-              this.state.columns[index] = newState;
-          }
-      }
-      toggleColumn(colIndex) {
-          this.state.columns[colIndex] = !this.state.columns[colIndex];
-      }
-      onRemoveDuplicates() {
-          this.env.model.dispatch("REMOVE_DUPLICATES", {
-              hasHeader: this.state.hasHeader,
-              columns: this.getColsToAnalyze(),
-          });
-      }
-      getColLabel(colKey) {
-          const col = parseInt(colKey);
-          let colLabel = _t("Column %s", numberToLetters(col));
-          if (this.state.hasHeader) {
-              const sheetId = this.env.model.getters.getActiveSheetId();
-              const row = this.env.model.getters.getSelectedZone().top;
-              const colHeader = this.env.model.getters.getEvaluatedCell({ sheetId, col, row });
-              if (colHeader.type !== "empty") {
-                  colLabel += ` - ${colHeader.value}`;
-              }
-          }
-          return colLabel;
-      }
-      get isEveryColumnSelected() {
-          return Object.values(this.state.columns).every((value) => value === true);
-      }
-      get errorMessages() {
-          const cancelledReasons = this.env.model.canDispatch("REMOVE_DUPLICATES", {
-              hasHeader: this.state.hasHeader,
-              columns: this.getColsToAnalyze(),
-          }).reasons;
-          const errors = new Set();
-          for (const reason of cancelledReasons) {
-              errors.add(RemoveDuplicateTerms.Errors[reason] || RemoveDuplicateTerms.Errors.Unexpected);
-          }
-          return Array.from(errors);
-      }
-      get selectionStatisticalInformation() {
-          const dimension = zoneToDimension(this.env.model.getters.getSelectedZone());
-          return _t("%(row_count)s rows and %(column_count)s columns selected", {
-              row_count: dimension.numberOfRows,
-              column_count: dimension.numberOfCols,
-          });
-      }
-      get canConfirm() {
-          return this.errorMessages.length === 0;
-      }
-      // ---------------------------------------------------------------------------
-      // Private
-      // ---------------------------------------------------------------------------
-      updateColumns() {
-          const zone = this.env.model.getters.getSelectedZone();
-          const oldColumns = this.state.columns;
-          const newColumns = {};
-          for (let i = zone.left; i <= zone.right; i++) {
-              newColumns[i] = i in oldColumns ? oldColumns[i] : true;
-          }
-          this.state.columns = newColumns;
-      }
-      getColsToAnalyze() {
-          return Object.keys(this.state.columns)
-              .filter((colIndex) => this.state.columns[colIndex])
-              .map((colIndex) => parseInt(colIndex));
-      }
-  }
-
-  css /* scss */ `
-  .o-locale-preview {
-    color: dimgrey;
-  }
-`;
-  class SettingsPanel extends owl.Component {
-      static template = "o-spreadsheet-SettingsPanel";
-      static components = { Section };
-      static props = { onCloseSidePanel: Function };
-      loadedLocales = [];
-      setup() {
-          owl.onWillStart(() => this.loadLocales());
-      }
-      onLocaleChange(code) {
-          const locale = this.loadedLocales.find((l) => l.code === code);
-          if (!locale)
-              return;
-          this.env.model.dispatch("UPDATE_LOCALE", { locale });
-      }
-      async loadLocales() {
-          this.loadedLocales = (await this.env.loadLocales())
-              .filter(isValidLocale)
-              .sort((a, b) => a.name.localeCompare(b.name));
-      }
-      get numberFormatPreview() {
-          const locale = this.env.model.getters.getLocale();
-          return formatValue(1234567.89, { format: "#,##0.00", locale });
-      }
-      get dateFormatPreview() {
-          const locale = this.env.model.getters.getLocale();
-          return formatValue(1.6, { format: locale.dateFormat, locale });
-      }
-      get dateTimeFormatPreview() {
-          const locale = this.env.model.getters.getLocale();
-          const dateTimeFormat = getDateTimeFormat(locale);
-          return formatValue(1.6, { format: dateTimeFormat, locale });
-      }
-      get currentLocale() {
-          return this.env.model.getters.getLocale();
-      }
-      get supportedLocales() {
-          const currentLocale = this.currentLocale;
-          const localeInLoadedLocales = this.loadedLocales.find((l) => l.code === currentLocale.code);
-          if (!localeInLoadedLocales) {
-              const locales = [...this.loadedLocales, currentLocale].sort((a, b) => a.name.localeCompare(b.name));
-              return locales;
-          }
-          else if (!deepEquals(currentLocale, localeInLoadedLocales)) {
-              const index = this.loadedLocales.indexOf(localeInLoadedLocales);
-              const locales = [...this.loadedLocales];
-              locales[index] = currentLocale;
-              locales.sort((a, b) => a.name.localeCompare(b.name));
-              return locales;
-          }
-          return this.loadedLocales;
-      }
-  }
-
-  const SplitToColumnsInteractiveContent = {
-      SplitIsDestructive: _t("This will overwrite data in the subsequent columns. Split anyway?"),
-  };
-  function interactiveSplitToColumns(env, separator, addNewColumns) {
-      let result = env.model.dispatch("SPLIT_TEXT_INTO_COLUMNS", { separator, addNewColumns });
-      if (result.isCancelledBecause("SplitWillOverwriteContent" /* CommandResult.SplitWillOverwriteContent */)) {
-          env.askConfirmation(SplitToColumnsInteractiveContent.SplitIsDestructive, () => {
-              result = env.model.dispatch("SPLIT_TEXT_INTO_COLUMNS", {
-                  separator,
-                  addNewColumns,
-                  force: true,
-              });
-          });
-      }
-      return result;
-  }
-
   const dataValidationEvaluatorRegistry = new Registry();
   dataValidationEvaluatorRegistry.add("textContains", {
       type: "textContains",
@@ -25211,111 +25084,6 @@
       });
   }
 
-  function interactiveStopEdition(env) {
-      const result = env.model.dispatch("STOP_EDITION");
-      if (result.isCancelledBecause("BlockingValidationRule" /* CommandResult.BlockingValidationRule */)) {
-          const editedCell = env.model.getters.getCurrentEditedCell();
-          const cellXc = toXC(editedCell.col, editedCell.row);
-          const rule = env.model.getters.getValidationRuleForCell(editedCell);
-          if (!rule) {
-              return;
-          }
-          const evaluator = dataValidationEvaluatorRegistry.get(rule.criterion.type);
-          const errorStr = evaluator.getErrorString(rule.criterion, env.model.getters, editedCell.sheetId);
-          env.raiseError(_t("The data you entered in %s violates the data validation rule set on the cell:\n%s", cellXc, errorStr));
-          env.model.dispatch("CANCEL_EDITION");
-      }
-  }
-
-  const SEPARATORS = [
-      { name: _t("Detect automatically"), value: "auto" },
-      { name: _t("Custom separator"), value: "custom" },
-      { name: _t("Space"), value: " " },
-      { name: _t("Comma"), value: "," },
-      { name: _t("Semicolon"), value: ";" },
-      { name: _t("Line Break"), value: NEWLINE },
-  ];
-  class SplitIntoColumnsPanel extends owl.Component {
-      static template = "o-spreadsheet-SplitIntoColumnsPanel";
-      static components = { ValidationMessages, Section, Checkbox };
-      static props = { onCloseSidePanel: Function };
-      state = owl.useState({ separatorValue: "auto", addNewColumns: false, customSeparator: "" });
-      setup() {
-          owl.onWillUpdateProps(() => {
-              // The feature makes no sense if we are editing a cell, because then the selection isn't active
-              // Stop the edition when the panel is mounted, and close the panel if the user start editing a cell
-              if (this.env.model.getters.getEditionMode() !== "inactive") {
-                  this.props.onCloseSidePanel();
-              }
-          });
-          owl.onMounted(() => {
-              interactiveStopEdition(this.env);
-          });
-      }
-      onSeparatorChange(value) {
-          this.state.separatorValue = value;
-      }
-      updateCustomSeparator(ev) {
-          if (!ev.target)
-              return;
-          this.state.customSeparator = ev.target.value;
-      }
-      updateAddNewColumnsCheckbox(addNewColumns) {
-          this.state.addNewColumns = addNewColumns;
-      }
-      confirm() {
-          const result = interactiveSplitToColumns(this.env, this.separatorValue, this.state.addNewColumns);
-          if (result.isSuccessful) {
-              this.props.onCloseSidePanel();
-          }
-      }
-      get errorMessages() {
-          const cancelledReasons = this.env.model.canDispatch("SPLIT_TEXT_INTO_COLUMNS", {
-              separator: this.separatorValue,
-              addNewColumns: this.state.addNewColumns,
-              force: true,
-          }).reasons;
-          const errors = new Set();
-          for (const reason of cancelledReasons) {
-              switch (reason) {
-                  case "SplitWillOverwriteContent" /* CommandResult.SplitWillOverwriteContent */:
-                  case "EmptySplitSeparator" /* CommandResult.EmptySplitSeparator */:
-                      break;
-                  default:
-                      errors.add(SplitToColumnsTerms.Errors[reason] || SplitToColumnsTerms.Errors.Unexpected);
-              }
-          }
-          return Array.from(errors);
-      }
-      get warningMessages() {
-          const warnings = [];
-          const cancelledReasons = this.env.model.canDispatch("SPLIT_TEXT_INTO_COLUMNS", {
-              separator: this.separatorValue,
-              addNewColumns: this.state.addNewColumns,
-              force: false,
-          }).reasons;
-          if (cancelledReasons.includes("SplitWillOverwriteContent" /* CommandResult.SplitWillOverwriteContent */)) {
-              warnings.push(SplitToColumnsTerms.Errors["SplitWillOverwriteContent" /* CommandResult.SplitWillOverwriteContent */]);
-          }
-          return warnings;
-      }
-      get separatorValue() {
-          if (this.state.separatorValue === "custom") {
-              return this.state.customSeparator;
-          }
-          else if (this.state.separatorValue === "auto") {
-              return this.env.model.getters.getAutomaticSeparator();
-          }
-          return this.state.separatorValue;
-      }
-      get separators() {
-          return SEPARATORS;
-      }
-      get isConfirmDisabled() {
-          return !this.separatorValue || this.errorMessages.length > 0;
-      }
-  }
-
   /** This component looks like a select input, but on click it opens a Menu with the items given as props instead of a dropdown */
   class SelectMenu extends owl.Component {
       static template = "o-spreadsheet-SelectMenu";
@@ -25344,6 +25112,22 @@
       }
   }
 
+  function interactiveStopEdition(env) {
+      const result = env.model.dispatch("STOP_EDITION");
+      if (result.isCancelledBecause("BlockingValidationRule" /* CommandResult.BlockingValidationRule */)) {
+          const editedCell = env.model.getters.getCurrentEditedCell();
+          const cellXc = toXC(editedCell.col, editedCell.row);
+          const rule = env.model.getters.getValidationRuleForCell(editedCell);
+          if (!rule) {
+              return;
+          }
+          const evaluator = dataValidationEvaluatorRegistry.get(rule.criterion.type);
+          const errorStr = evaluator.getErrorString(rule.criterion, env.model.getters, editedCell.sheetId);
+          env.raiseError(_t("The data you entered in %s violates the data validation rule set on the cell:\n%s", cellXc, errorStr));
+          env.model.dispatch("CANCEL_EDITION");
+      }
+  }
+
   class DataValidationCriterionForm extends owl.Component {
       static props = {
           criterion: Object,
@@ -25750,92 +25534,552 @@
   }
 
   css /* scss */ `
-  .o-sidePanel .o-sidePanelBody .o-dv-form {
-    .o-section {
-      padding: 16px 16px 0 16px;
+  .o-sidePanel .o-sidePanelBody .o-dv-form {
+    .o-section {
+      padding: 16px 16px 0 16px;
+    }
+  }
+`;
+  class DataValidationEditor extends owl.Component {
+      static template = "o-spreadsheet-DataValidationEditor";
+      static components = { SelectionInput, SelectMenu, Section };
+      static props = {
+          rule: { type: Object, optional: true },
+          onExit: Function,
+      };
+      state = owl.useState({ rule: this.defaultDataValidationRule });
+      setup() {
+          if (this.props.rule) {
+              const sheetId = this.env.model.getters.getActiveSheetId();
+              this.state.rule = {
+                  ...this.props.rule,
+                  ranges: this.props.rule.ranges.map((range) => this.env.model.getters.getRangeString(range, sheetId)),
+              };
+              this.state.rule.criterion.type = this.props.rule.criterion.type;
+          }
+      }
+      onCriterionTypeChanged(type) {
+          this.state.rule.criterion.type = type;
+      }
+      onRangesChanged(ranges) {
+          this.state.rule.ranges = ranges;
+      }
+      onCriterionChanged(criterion) {
+          this.state.rule.criterion = criterion;
+      }
+      changeRuleIsBlocking(ev) {
+          const isBlocking = ev.target.value;
+          this.state.rule.isBlocking = isBlocking === "true";
+      }
+      onSave() {
+          if (!this.canSave) {
+              return;
+          }
+          this.env.model.dispatch("ADD_DATA_VALIDATION_RULE", this.dispatchPayload);
+          this.props.onExit();
+      }
+      get canSave() {
+          return this.env.model.canDispatch("ADD_DATA_VALIDATION_RULE", this.dispatchPayload)
+              .isSuccessful;
+      }
+      get dispatchPayload() {
+          const rule = { ...this.state.rule, ranges: undefined };
+          const locale = this.env.model.getters.getLocale();
+          const criterion = rule.criterion;
+          const criterionEvaluator = dataValidationEvaluatorRegistry.get(criterion.type);
+          const sheetId = this.env.model.getters.getActiveSheetId();
+          const values = criterion.values
+              .slice(0, criterionEvaluator.numberOfValues(criterion))
+              .map((value) => value?.trim())
+              .filter((value) => value !== "" && value !== undefined)
+              .map((value) => canonicalizeContent(value, locale));
+          rule.criterion = { ...criterion, values };
+          return {
+              sheetId,
+              ranges: this.state.rule.ranges.map((xc) => this.env.model.getters.getRangeDataFromXc(sheetId, xc)),
+              rule,
+          };
+      }
+      get dvCriterionMenuItems() {
+          return getDataValidationCriterionMenuItems((type) => this.onCriterionTypeChanged(type));
+      }
+      get selectedCriterionName() {
+          const selectedType = this.state.rule.criterion.type;
+          return dataValidationEvaluatorRegistry.get(selectedType).name;
+      }
+      get defaultDataValidationRule() {
+          const sheetId = this.env.model.getters.getActiveSheetId();
+          const ranges = this.env.model.getters
+              .getSelectedZones()
+              .map((zone) => zoneToXc(this.env.model.getters.getUnboundedZone(sheetId, zone)));
+          return {
+              id: this.env.model.uuidGenerator.uuidv4(),
+              criterion: { type: "textContains", values: [""] },
+              ranges,
+          };
+      }
+      get criterionComponent() {
+          return dataValidationPanelCriteriaRegistry.get(this.state.rule.criterion.type).component;
+      }
+  }
+
+  css /* scss */ `
+  .o-find-and-replace {
+    outline: none;
+    height: 100%;
+    .o-input-search-container {
+      display: flex;
+      .o-input-with-count {
+        flex-grow: 1;
+        width: auto;
+      }
+      .o-input-without-count {
+        width: 100%;
+      }
+      .o-input-count {
+        width: fit-content;
+        padding: 4px 0 4px 4px;
+      }
+    }
+
+    .o-matches-count div {
+      text-overflow: ellipsis;
+      overflow: hidden;
+      white-space: nowrap;
+    }
+  }
+`;
+  class FindAndReplacePanel extends owl.Component {
+      static template = "o-spreadsheet-FindAndReplacePanel";
+      static components = { SelectionInput, Section, Checkbox };
+      static props = {
+          onCloseSidePanel: Function,
+      };
+      debounceTimeoutId;
+      initialShowFormulaState = false;
+      dataRange = "";
+      searchInput = owl.useRef("searchInput");
+      replaceInput = owl.useRef("replaceInput");
+      get hasSearchResult() {
+          return this.env.model.getters.getCurrentSelectedMatchIndex() !== null;
+      }
+      get pendingSearch() {
+          return this.debounceTimeoutId !== undefined;
+      }
+      get searchOptions() {
+          return this.env.model.getters.getSearchOptions();
+      }
+      get toSearch() {
+          return this.searchInput.el?.value || "";
+      }
+      get toReplace() {
+          return this.replaceInput.el?.value || "";
+      }
+      get allSheetsMatchesCount() {
+          return _t("%s in all sheets", this.env.model.getters.getAllSheetMatchesCount());
+      }
+      get currentSheetMatchesCount() {
+          return _t("%(matches)s in sheet %(sheetName)s", {
+              matches: this.env.model.getters.getActiveSheetMatchesCount(),
+              sheetName: this.env.model.getters.getSheetName(this.env.model.getters.getActiveSheetId()),
+          });
+      }
+      get specificRangeMatchesCount() {
+          const range = this.searchOptions.specificRange;
+          if (!range) {
+              return "";
+          }
+          const { _sheetId, _zone } = range;
+          return _t("%(matches)s in range %(range)s of sheet %(sheetName)s", {
+              matches: this.env.model.getters.getSpecificRangeMatchesCount().toString(),
+              range: zoneToXc(_zone),
+              sheetName: this.env.model.getters.getSheetName(_sheetId),
+          });
+      }
+      setup() {
+          this.initialShowFormulaState = this.env.model.getters.shouldShowFormulas();
+          owl.onMounted(() => this.searchInput.el?.focus());
+          owl.onWillUnmount(() => {
+              clearTimeout(this.debounceTimeoutId);
+              this.env.model.dispatch("CLEAR_SEARCH");
+              this.env.model.dispatch("SET_FORMULA_VISIBILITY", { show: this.initialShowFormulaState });
+          });
+          owl.useEffect(() => {
+              const showFormula = this.env.model.getters.shouldShowFormulas();
+              this.updateSearch({ searchFormulas: showFormula });
+          }, () => [this.env.model.getters.shouldShowFormulas()]);
+      }
+      onFocusSearch() {
+          this.updateDataRange();
+      }
+      onInput() {
+          this.debouncedUpdateSearch();
+      }
+      onKeydownSearch(ev) {
+          if (ev.key === "Enter") {
+              ev.preventDefault();
+              ev.stopPropagation();
+              this.onSelectNextCell();
+          }
+      }
+      onKeydownReplace(ev) {
+          if (ev.key === "Enter") {
+              ev.preventDefault();
+              ev.stopPropagation();
+              this.replace();
+          }
+      }
+      searchFormulas(showFormula) {
+          this.env.model.dispatch("SET_FORMULA_VISIBILITY", {
+              show: showFormula,
+          });
+          this.updateSearch({ searchFormulas: showFormula });
+      }
+      searchExactMatch(exactMatch) {
+          this.updateSearch({ exactMatch });
+      }
+      searchMatchCase(matchCase) {
+          this.updateSearch({ matchCase });
+      }
+      changeSearchScope(ev) {
+          const searchScope = ev.target.value;
+          this.updateSearch({ searchScope });
+      }
+      onSearchRangeChanged(ranges) {
+          this.dataRange = ranges[0];
+      }
+      updateDataRange() {
+          if (!this.dataRange) {
+              return;
+          }
+          if (this.searchOptions.searchScope === "specificRange") {
+              const specificRange = this.env.model.getters.getRangeFromSheetXC(this.env.model.getters.getActiveSheetId(), this.dataRange).rangeData;
+              this.updateSearch({ specificRange });
+          }
+      }
+      onSelectPreviousCell() {
+          this.env.model.dispatch("SELECT_SEARCH_PREVIOUS_MATCH");
+      }
+      onSelectNextCell() {
+          this.env.model.dispatch("SELECT_SEARCH_NEXT_MATCH");
+      }
+      updateSearch(updateSearchOptions) {
+          const searchOptions = {
+              ...this.env.model.getters.getSearchOptions(),
+              ...updateSearchOptions,
+          };
+          this.env.model.dispatch("UPDATE_SEARCH", {
+              toSearch: this.toSearch,
+              searchOptions,
+          });
+      }
+      debouncedUpdateSearch() {
+          clearTimeout(this.debounceTimeoutId);
+          this.debounceTimeoutId = setTimeout(() => {
+              this.updateSearch();
+              this.debounceTimeoutId = undefined;
+          }, 200);
+      }
+      replace() {
+          this.env.model.dispatch("REPLACE_SEARCH", {
+              replaceWith: this.toReplace,
+          });
+      }
+      replaceAll() {
+          this.env.model.dispatch("REPLACE_ALL_SEARCH", {
+              replaceWith: this.toReplace,
+          });
+      }
+  }
+
+  css /* scss */ `
+  .o-more-formats-panel {
+    .format-preview {
+      height: 48px;
+      background-color: white;
+
+      &:hover {
+        background-color: rgba(0, 0, 0, 0.08);
+      }
+    }
+    .check-icon {
+      width: 24px;
     }
   }
 `;
-  class DataValidationEditor extends owl.Component {
-      static template = "o-spreadsheet-DataValidationEditor";
-      static components = { SelectionInput, SelectMenu, Section };
+  const DATE_FORMAT_ACTIONS = createActions([
+      formatNumberFullDateTime,
+      formatNumberFullWeekDayAndMonth,
+      formatNumberDayAndFullMonth,
+      formatNumberShortWeekDay,
+      formatNumberDayAndShortMonth,
+      formatNumberFullMonth,
+      formatNumberShortMonth,
+      formatNumberDate,
+      formatNumberTime,
+      formatNumberDateTime,
+      formatNumberDuration,
+  ]);
+  class MoreFormatsPanel extends owl.Component {
+      static template = "o-spreadsheet-MoreFormatsPanel";
       static props = {
-          rule: { type: Object, optional: true },
-          onExit: Function,
+          onCloseSidePanel: Function,
       };
-      state = owl.useState({ rule: this.defaultDataValidationRule });
+      get dateFormatsActions() {
+          return DATE_FORMAT_ACTIONS;
+      }
+  }
+
+  css /* scss */ `
+  .o-checkbox-selection {
+    height: 150px;
+  }
+`;
+  class RemoveDuplicatesPanel extends owl.Component {
+      static template = "o-spreadsheet-RemoveDuplicatesPanel";
+      static components = { ValidationMessages, Section, Checkbox };
+      state = owl.useState({
+          hasHeader: false,
+          columns: {},
+      });
       setup() {
-          if (this.props.rule) {
+          owl.onWillUpdateProps(() => this.updateColumns());
+      }
+      toggleHasHeader() {
+          this.state.hasHeader = !this.state.hasHeader;
+      }
+      toggleAllColumns() {
+          const newState = !this.isEveryColumnSelected;
+          for (const index in this.state.columns) {
+              this.state.columns[index] = newState;
+          }
+      }
+      toggleColumn(colIndex) {
+          this.state.columns[colIndex] = !this.state.columns[colIndex];
+      }
+      onRemoveDuplicates() {
+          this.env.model.dispatch("REMOVE_DUPLICATES", {
+              hasHeader: this.state.hasHeader,
+              columns: this.getColsToAnalyze(),
+          });
+      }
+      getColLabel(colKey) {
+          const col = parseInt(colKey);
+          let colLabel = _t("Column %s", numberToLetters(col));
+          if (this.state.hasHeader) {
               const sheetId = this.env.model.getters.getActiveSheetId();
-              this.state.rule = {
-                  ...this.props.rule,
-                  ranges: this.props.rule.ranges.map((range) => this.env.model.getters.getRangeString(range, sheetId)),
-              };
-              this.state.rule.criterion.type = this.props.rule.criterion.type;
+              const row = this.env.model.getters.getSelectedZone().top;
+              const colHeader = this.env.model.getters.getEvaluatedCell({ sheetId, col, row });
+              if (colHeader.type !== "empty") {
+                  colLabel += ` - ${colHeader.value}`;
+              }
           }
+          return colLabel;
       }
-      onCriterionTypeChanged(type) {
-          this.state.rule.criterion.type = type;
+      get isEveryColumnSelected() {
+          return Object.values(this.state.columns).every((value) => value === true);
       }
-      onRangesChanged(ranges) {
-          this.state.rule.ranges = ranges;
+      get errorMessages() {
+          const cancelledReasons = this.env.model.canDispatch("REMOVE_DUPLICATES", {
+              hasHeader: this.state.hasHeader,
+              columns: this.getColsToAnalyze(),
+          }).reasons;
+          const errors = new Set();
+          for (const reason of cancelledReasons) {
+              errors.add(RemoveDuplicateTerms.Errors[reason] || RemoveDuplicateTerms.Errors.Unexpected);
+          }
+          return Array.from(errors);
       }
-      onCriterionChanged(criterion) {
-          this.state.rule.criterion = criterion;
+      get selectionStatisticalInformation() {
+          const dimension = zoneToDimension(this.env.model.getters.getSelectedZone());
+          return _t("%(row_count)s rows and %(column_count)s columns selected", {
+              row_count: dimension.numberOfRows,
+              column_count: dimension.numberOfCols,
+          });
       }
-      changeRuleIsBlocking(ev) {
-          const isBlocking = ev.target.value;
-          this.state.rule.isBlocking = isBlocking === "true";
+      get canConfirm() {
+          return this.errorMessages.length === 0;
       }
-      onSave() {
-          if (!this.canSave) {
-              return;
+      // ---------------------------------------------------------------------------
+      // Private
+      // ---------------------------------------------------------------------------
+      updateColumns() {
+          const zone = this.env.model.getters.getSelectedZone();
+          const oldColumns = this.state.columns;
+          const newColumns = {};
+          for (let i = zone.left; i <= zone.right; i++) {
+              newColumns[i] = i in oldColumns ? oldColumns[i] : true;
           }
-          this.env.model.dispatch("ADD_DATA_VALIDATION_RULE", this.dispatchPayload);
-          this.props.onExit();
+          this.state.columns = newColumns;
       }
-      get canSave() {
-          return this.env.model.canDispatch("ADD_DATA_VALIDATION_RULE", this.dispatchPayload)
-              .isSuccessful;
+      getColsToAnalyze() {
+          return Object.keys(this.state.columns)
+              .filter((colIndex) => this.state.columns[colIndex])
+              .map((colIndex) => parseInt(colIndex));
       }
-      get dispatchPayload() {
-          const rule = { ...this.state.rule, ranges: undefined };
+  }
+
+  css /* scss */ `
+  .o-locale-preview {
+    color: dimgrey;
+  }
+`;
+  class SettingsPanel extends owl.Component {
+      static template = "o-spreadsheet-SettingsPanel";
+      static components = { Section };
+      static props = { onCloseSidePanel: Function };
+      loadedLocales = [];
+      setup() {
+          owl.onWillStart(() => this.loadLocales());
+      }
+      onLocaleChange(code) {
+          const locale = this.loadedLocales.find((l) => l.code === code);
+          if (!locale)
+              return;
+          this.env.model.dispatch("UPDATE_LOCALE", { locale });
+      }
+      async loadLocales() {
+          this.loadedLocales = (await this.env.loadLocales())
+              .filter(isValidLocale)
+              .sort((a, b) => a.name.localeCompare(b.name));
+      }
+      get numberFormatPreview() {
           const locale = this.env.model.getters.getLocale();
-          const criterion = rule.criterion;
-          const criterionEvaluator = dataValidationEvaluatorRegistry.get(criterion.type);
-          const sheetId = this.env.model.getters.getActiveSheetId();
-          const values = criterion.values
-              .slice(0, criterionEvaluator.numberOfValues(criterion))
-              .map((value) => value?.trim())
-              .filter((value) => value !== "" && value !== undefined)
-              .map((value) => canonicalizeContent(value, locale));
-          rule.criterion = { ...criterion, values };
-          return {
-              sheetId,
-              ranges: this.state.rule.ranges.map((xc) => this.env.model.getters.getRangeDataFromXc(sheetId, xc)),
-              rule,
-          };
+          return formatValue(1234567.89, { format: "#,##0.00", locale });
       }
-      get dvCriterionMenuItems() {
-          return getDataValidationCriterionMenuItems((type) => this.onCriterionTypeChanged(type));
+      get dateFormatPreview() {
+          const locale = this.env.model.getters.getLocale();
+          return formatValue(1.6, { format: locale.dateFormat, locale });
       }
-      get selectedCriterionName() {
-          const selectedType = this.state.rule.criterion.type;
-          return dataValidationEvaluatorRegistry.get(selectedType).name;
+      get dateTimeFormatPreview() {
+          const locale = this.env.model.getters.getLocale();
+          const dateTimeFormat = getDateTimeFormat(locale);
+          return formatValue(1.6, { format: dateTimeFormat, locale });
       }
-      get defaultDataValidationRule() {
-          const sheetId = this.env.model.getters.getActiveSheetId();
-          const ranges = this.env.model.getters
-              .getSelectedZones()
-              .map((zone) => zoneToXc(this.env.model.getters.getUnboundedZone(sheetId, zone)));
-          return {
-              id: this.env.model.uuidGenerator.uuidv4(),
-              criterion: { type: "textContains", values: [""] },
-              ranges,
-          };
+      get currentLocale() {
+          return this.env.model.getters.getLocale();
       }
-      get criterionComponent() {
-          return dataValidationPanelCriteriaRegistry.get(this.state.rule.criterion.type).component;
+      get supportedLocales() {
+          const currentLocale = this.currentLocale;
+          const localeInLoadedLocales = this.loadedLocales.find((l) => l.code === currentLocale.code);
+          if (!localeInLoadedLocales) {
+              const locales = [...this.loadedLocales, currentLocale].sort((a, b) => a.name.localeCompare(b.name));
+              return locales;
+          }
+          else if (!deepEquals(currentLocale, localeInLoadedLocales)) {
+              const index = this.loadedLocales.indexOf(localeInLoadedLocales);
+              const locales = [...this.loadedLocales];
+              locales[index] = currentLocale;
+              locales.sort((a, b) => a.name.localeCompare(b.name));
+              return locales;
+          }
+          return this.loadedLocales;
+      }
+  }
+
+  const SplitToColumnsInteractiveContent = {
+      SplitIsDestructive: _t("This will overwrite data in the subsequent columns. Split anyway?"),
+  };
+  function interactiveSplitToColumns(env, separator, addNewColumns) {
+      let result = env.model.dispatch("SPLIT_TEXT_INTO_COLUMNS", { separator, addNewColumns });
+      if (result.isCancelledBecause("SplitWillOverwriteContent" /* CommandResult.SplitWillOverwriteContent */)) {
+          env.askConfirmation(SplitToColumnsInteractiveContent.SplitIsDestructive, () => {
+              result = env.model.dispatch("SPLIT_TEXT_INTO_COLUMNS", {
+                  separator,
+                  addNewColumns,
+                  force: true,
+              });
+          });
+      }
+      return result;
+  }
+
+  const SEPARATORS = [
+      { name: _t("Detect automatically"), value: "auto" },
+      { name: _t("Custom separator"), value: "custom" },
+      { name: _t("Space"), value: " " },
+      { name: _t("Comma"), value: "," },
+      { name: _t("Semicolon"), value: ";" },
+      { name: _t("Line Break"), value: NEWLINE },
+  ];
+  class SplitIntoColumnsPanel extends owl.Component {
+      static template = "o-spreadsheet-SplitIntoColumnsPanel";
+      static components = { ValidationMessages, Section, Checkbox };
+      static props = { onCloseSidePanel: Function };
+      state = owl.useState({ separatorValue: "auto", addNewColumns: false, customSeparator: "" });
+      setup() {
+          owl.onWillUpdateProps(() => {
+              // The feature makes no sense if we are editing a cell, because then the selection isn't active
+              // Stop the edition when the panel is mounted, and close the panel if the user start editing a cell
+              if (this.env.model.getters.getEditionMode() !== "inactive") {
+                  this.props.onCloseSidePanel();
+              }
+          });
+          owl.onMounted(() => {
+              interactiveStopEdition(this.env);
+          });
+      }
+      onSeparatorChange(value) {
+          this.state.separatorValue = value;
+      }
+      updateCustomSeparator(ev) {
+          if (!ev.target)
+              return;
+          this.state.customSeparator = ev.target.value;
+      }
+      updateAddNewColumnsCheckbox(addNewColumns) {
+          this.state.addNewColumns = addNewColumns;
+      }
+      confirm() {
+          const result = interactiveSplitToColumns(this.env, this.separatorValue, this.state.addNewColumns);
+          if (result.isSuccessful) {
+              this.props.onCloseSidePanel();
+          }
+      }
+      get errorMessages() {
+          const cancelledReasons = this.env.model.canDispatch("SPLIT_TEXT_INTO_COLUMNS", {
+              separator: this.separatorValue,
+              addNewColumns: this.state.addNewColumns,
+              force: true,
+          }).reasons;
+          const errors = new Set();
+          for (const reason of cancelledReasons) {
+              switch (reason) {
+                  case "SplitWillOverwriteContent" /* CommandResult.SplitWillOverwriteContent */:
+                  case "EmptySplitSeparator" /* CommandResult.EmptySplitSeparator */:
+                      break;
+                  default:
+                      errors.add(SplitToColumnsTerms.Errors[reason] || SplitToColumnsTerms.Errors.Unexpected);
+              }
+          }
+          return Array.from(errors);
+      }
+      get warningMessages() {
+          const warnings = [];
+          const cancelledReasons = this.env.model.canDispatch("SPLIT_TEXT_INTO_COLUMNS", {
+              separator: this.separatorValue,
+              addNewColumns: this.state.addNewColumns,
+              force: false,
+          }).reasons;
+          if (cancelledReasons.includes("SplitWillOverwriteContent" /* CommandResult.SplitWillOverwriteContent */)) {
+              warnings.push(SplitToColumnsTerms.Errors["SplitWillOverwriteContent" /* CommandResult.SplitWillOverwriteContent */]);
+          }
+          return warnings;
+      }
+      get separatorValue() {
+          if (this.state.separatorValue === "custom") {
+              return this.state.customSeparator;
+          }
+          else if (this.state.separatorValue === "auto") {
+              return this.env.model.getters.getAutomaticSeparator();
+          }
+          return this.state.separatorValue;
+      }
+      get separators() {
+          return SEPARATORS;
+      }
+      get isConfirmDisabled() {
+          return !this.separatorValue || this.errorMessages.length > 0;
       }
   }
 
@@ -25956,6 +26200,10 @@
       title: _t("Data validation"),
       Body: DataValidationPanel,
   });
+  sidePanelRegistry.add("DataValidationEditor", {
+      title: _t("Data validation"),
+      Body: DataValidationEditor,
+  });
   sidePanelRegistry.add("MoreFormats", {
       title: _t("More date formats"),
       Body: MoreFormatsPanel,
@@ -27287,6 +27535,9 @@
               const token = tokens.filter((token) => token.value.includes(currentSelectedText) &&
                   token.start <= currentSelection.start &&
                   token.end >= currentSelection.end)[0];
+              if (!token) {
+                  return;
+              }
               if (token.type === "REFERENCE") {
                   this.env.model.dispatch("CHANGE_COMPOSER_CURSOR_SELECTION", {
                       start: token.start,
@@ -31180,6 +31431,19 @@
           return String.fromCharCode(parseInt(code, 16));
       });
   }
+  /** Get a header in the SheetData. Create the header if it doesn't exist in the SheetData */
+  function getSheetDataHeader(sheetData, dimension, index) {
+      if (dimension === "COL") {
+          if (!sheetData.cols[index]) {
+              sheetData.cols[index] = {};
+          }
+          return sheetData.cols[index];
+      }
+      if (!sheetData.rows[index]) {
+          sheetData.rows[index] = {};
+      }
+      return sheetData.rows[index];
+  }
 
   const XLSX_DATE_FORMAT_REGEX = /^(yy|yyyy|m{1,5}|d{1,4}|h{1,2}|s{1,2}|am\/pm|a\/m|\s|-|\/|\.|:)+$/i;
   /**
@@ -32036,6 +32300,8 @@
           convertFormulasContent(sheet, data);
           const sheetDims = getSheetDims(sheet);
           const sheetOptions = sheet.sheetViews[0];
+          const rowHeaderGroups = convertHeaderGroup(sheet, "ROW", sheetDims[1]);
+          const colHeaderGroups = convertHeaderGroup(sheet, "COL", sheetDims[0]);
           return {
               id: sheet.sheetName,
               areGridLinesVisible: sheetOptions ? sheetOptions.showGridLines : true,
@@ -32044,8 +32310,8 @@
               rowNumber: sheetDims[1],
               cells: convertCells(sheet, data, sheetDims, warningManager),
               merges: sheet.merges,
-              cols: convertCols(sheet, sheetDims[0]),
-              rows: convertRows(sheet, sheetDims[1]),
+              cols: convertCols(sheet, sheetDims[0], colHeaderGroups),
+              rows: convertRows(sheet, sheetDims[1], rowHeaderGroups),
               conditionalFormats: convertConditionalFormats(sheet.cfs, data.dxfs, warningManager),
               figures: convertFigures(sheet),
               isVisible: sheet.isVisible,
@@ -32053,10 +32319,11 @@
                   ? { xSplit: sheetOptions.pane.xSplit, ySplit: sheetOptions.pane.ySplit }
                   : { xSplit: 0, ySplit: 0 },
               filterTables: [],
+              headerGroups: { COL: colHeaderGroups, ROW: rowHeaderGroups },
           };
       });
   }
-  function convertCols(sheet, numberOfCols) {
+  function convertCols(sheet, numberOfCols, headerGroups) {
       const cols = {};
       // Excel begins indexes at 1
       for (let i = 1; i < numberOfCols + 1; i++) {
@@ -32068,11 +32335,18 @@
               colSize = sheet.sheetFormat.defaultColWidth;
           else
               colSize = EXCEL_DEFAULT_COL_WIDTH;
-          cols[i - 1] = { size: convertWidthFromExcel(colSize), isHidden: col?.hidden };
+          // In xlsx there is no difference between hidden columns and columns inside a folded group.
+          // But in o-spreadsheet folded columns are not considered hidden.
+          const colIndex = i - 1;
+          const isColFolded = headerGroups.some((group) => group.isFolded && group.start <= colIndex && colIndex <= group.end);
+          cols[colIndex] = {
+              size: convertWidthFromExcel(colSize),
+              isHidden: !isColFolded && col?.hidden,
+          };
       }
       return cols;
   }
-  function convertRows(sheet, numberOfRows) {
+  function convertRows(sheet, numberOfRows, headerGroups) {
       const rows = {};
       // Excel begins indexes at 1
       for (let i = 1; i < numberOfRows + 1; i++) {
@@ -32084,7 +32358,14 @@
               rowSize = sheet.sheetFormat.defaultRowHeight;
           else
               rowSize = EXCEL_DEFAULT_ROW_HEIGHT;
-          rows[i - 1] = { size: convertHeightFromExcel(rowSize), isHidden: row?.hidden };
+          // In xlsx there is no difference between hidden rows and rows inside a folded group.
+          // But in o-spreadsheet folded rows are not considered hidden.
+          const rowIndex = i - 1;
+          const isRowFolded = headerGroups.some((group) => group.isFolded && group.start <= rowIndex && rowIndex <= group.end);
+          rows[rowIndex] = {
+              size: convertHeightFromExcel(rowSize),
+              isHidden: !isRowFolded && row?.hidden,
+          };
       }
       return rows;
   }
@@ -32188,6 +32469,57 @@
       dims[1] = Math.max(dims[1], EXCEL_IMPORT_DEFAULT_NUMBER_OF_ROWS);
       return dims;
   }
+  /**
+   * Get the header groups from the XLS file.
+   *
+   * See ASCII art in HeaderGroupingPlugin.exportForExcel() for details on how the groups are defined in the xlsx.
+   */
+  function convertHeaderGroup(sheet, dim, numberOfHeaders) {
+      const outlineProperties = sheet?.sheetProperties?.outlinePr;
+      const headerGroups = [];
+      let currentLayer = 0;
+      for (let i = 0; i < numberOfHeaders; i++) {
+          const header = getHeader(sheet, dim, i);
+          const headerLayer = header?.outlineLevel || 0;
+          if (headerLayer > currentLayer) {
+              // Whether the flag indicating if the group is collapsed is on the header before or after the group. Default is after.
+              const collapseFlagAfter = (dim === "ROW" ? outlineProperties?.summaryBelow : outlineProperties?.summaryRight) ?? true;
+              const group = computeHeaderGroup(sheet, dim, i, collapseFlagAfter);
+              if (group) {
+                  headerGroups.push(group);
+              }
+          }
+          currentLayer = headerLayer;
+      }
+      return headerGroups;
+  }
+  function computeHeaderGroup(sheet, dim, startIndex, collapseFlagAfter) {
+      const startHeader = getHeader(sheet, dim, startIndex);
+      const startLayer = startHeader?.outlineLevel;
+      if (!startLayer || !startLayer) {
+          return undefined;
+      }
+      let currentLayer = startLayer;
+      let currentIndex = startIndex;
+      let currentHeader = startHeader;
+      while (currentHeader && currentLayer >= startLayer) {
+          currentIndex++;
+          currentHeader = getHeader(sheet, dim, currentIndex);
+          currentLayer = currentHeader?.outlineLevel || 0;
+      }
+      const start = startIndex;
+      const end = currentIndex - 1;
+      const collapseFlagHeader = collapseFlagAfter
+          ? getHeader(sheet, dim, end + 1)
+          : getHeader(sheet, dim, start - 1);
+      const isFolded = collapseFlagHeader?.collapsed || false;
+      return { start: start - 1, end: end - 1, isFolded }; // -1 because indices start at 1 in excel and 0 in o-spreadsheet
+  }
+  function getHeader(sheet, dim, index) {
+      return "COL" === dim
+          ? sheet.cols.find((col) => col.min <= index && index <= col.max)
+          : sheet.rows.find((row) => row.index === index);
+  }
 
   const TABLE_HEADER_STYLE = {
       fillColor: "#000000",
@@ -33248,6 +33580,7 @@
                   sheetName: this.extractSheetName(),
                   sheetViews: this.extractSheetViews(sheetElement),
                   sheetFormat: this.extractSheetFormat(sheetElement),
+                  sheetProperties: this.extractSheetProperties(sheetElement),
                   cols: this.extractCols(sheetElement),
                   rows: this.extractRows(sheetElement),
                   sharedFormulas: this.extractSharedFormulas(sheetElement),
@@ -33373,6 +33706,23 @@
               }).asNum(),
           };
       }
+      extractSheetProperties(worksheet) {
+          const propertiesElement = this.querySelector(worksheet, "sheetPr");
+          if (!propertiesElement)
+              return undefined;
+          return {
+              outlinePr: this.extractSheetOutlineProperties(propertiesElement),
+          };
+      }
+      extractSheetOutlineProperties(sheetProperties) {
+          const properties = this.querySelector(sheetProperties, "outlinePr");
+          if (!properties)
+              return undefined;
+          return {
+              summaryBelow: this.extractAttr(properties, "summaryBelow", { default: true }).asBool(),
+              summaryRight: this.extractAttr(properties, "summaryRight", { default: true }).asBool(),
+          };
+      }
       extractCols(worksheet) {
           return this.mapOnElements({ parent: worksheet, query: "cols col" }, (colElement) => {
               return {
@@ -33383,6 +33733,8 @@
                   min: this.extractAttr(colElement, "min", { required: true })?.asNum(),
                   max: this.extractAttr(colElement, "max", { required: true })?.asNum(),
                   styleIndex: this.extractAttr(colElement, "style")?.asNum(),
+                  outlineLevel: this.extractAttr(colElement, "outlineLevel")?.asNum(),
+                  collapsed: this.extractAttr(colElement, "collapsed")?.asBool(),
               };
           });
       }
@@ -33395,6 +33747,8 @@
                   customHeight: this.extractAttr(rowElement, "customHeight")?.asBool(),
                   hidden: this.extractAttr(rowElement, "hidden")?.asBool(),
                   styleIndex: this.extractAttr(rowElement, "s")?.asNum(),
+                  outlineLevel: this.extractAttr(rowElement, "outlineLevel")?.asNum(),
+                  collapsed: this.extractAttr(rowElement, "collapsed")?.asBool(),
               };
           });
       }
@@ -35928,6 +36282,26 @@
                       format: "",
                   });
                   break;
+              case "DELETE_CONTENT":
+                  this.clearZones(cmd.sheetId, cmd.target);
+                  break;
+          }
+      }
+      clearZones(sheetId, zones) {
+          for (let zone of zones) {
+              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) {
+                          this.dispatch("UPDATE_CELL", {
+                              sheetId: sheetId,
+                              content: "",
+                              col,
+                              row,
+                          });
+                      }
+                  }
+              }
           }
       }
       /**
@@ -36989,6 +37363,28 @@
                   this.addDataValidationRule(cmd.sheetId, { ...cmd.rule, ranges });
                   break;
               }
+              case "DELETE_CONTENT": {
+                  const zones = cmd.target;
+                  const sheetId = cmd.sheetId;
+                  for (const zone of zones) {
+                      for (let row = zone.top; row <= zone.bottom; row++) {
+                          for (let col = zone.left; col <= zone.right; col++) {
+                              const dataValidation = this.getValidationRuleForCell({ sheetId, col, row });
+                              if (!dataValidation) {
+                                  continue;
+                              }
+                              if (dataValidation.criterion.type === "isBoolean" ||
+                                  (dataValidation.criterion.type === "isValueInList" &&
+                                      !this.getters.getCell({ sheetId, col, row })?.content)) {
+                                  const rules = this.rules[sheetId];
+                                  const ranges = [this.getters.getRangeFromSheetXC(sheetId, toXC(col, row))];
+                                  const adaptedRules = this.removeRangesFromRules(sheetId, ranges, rules);
+                                  this.history.update("rules", sheetId, adaptedRules);
+                              }
+                          }
+                      }
+                  }
+              }
           }
       }
       getDataValidationRules(sheetId) {
@@ -37049,13 +37445,12 @@
       setCenterStyleToBooleanCells(rule) {
           for (const position of getCellPositionsInRanges(rule.ranges)) {
               const cell = this.getters.getCell(position);
-              const { sheetId, col, row } = position;
               const style = {
                   ...cell?.style,
                   align: cell?.style?.align ?? "center",
                   verticalAlign: cell?.style?.verticalAlign ?? "middle",
               };
-              this.dispatch("UPDATE_CELL", { sheetId, col, row, style });
+              this.dispatch("UPDATE_CELL", { ...position, style });
           }
       }
       import(data) {
@@ -37893,7 +38288,7 @@
                       if (sheet.rows[row] === undefined) {
                           sheet.rows[row] = {};
                       }
-                      sheet.rows[row].isHidden = this.hiddenHeaders[sheet.id]["ROW"][row];
+                      sheet.rows[row].isHidden ||= this.hiddenHeaders[sheet.id]["ROW"][row];
                   }
               }
               if (sheet.cols === undefined) {
@@ -37904,7 +38299,7 @@
                       if (sheet.cols[col] === undefined) {
                           sheet.cols[col] = {};
                       }
-                      sheet.cols[col].isHidden = this.hiddenHeaders[sheet.id]["COL"][col];
+                      sheet.cols[col].isHidden ||= this.hiddenHeaders[sheet.id]["COL"][col];
                   }
               }
           }
@@ -38862,9 +39257,9 @@
        * Get a Xc string that represent a part of a range
        */
       getRangePartString(range, part) {
-          const colFixed = range.parts && range.parts[part].colFixed ? "$" : "";
+          const colFixed = range.parts && range.parts[part]?.colFixed ? "$" : "";
           const col = part === 0 ? numberToLetters(range.zone.left) : numberToLetters(range.zone.right);
-          const rowFixed = range.parts && range.parts[part].rowFixed ? "$" : "";
+          const rowFixed = range.parts && range.parts[part]?.rowFixed ? "$" : "";
           const row = part === 0 ? String(range.zone.top + 1) : String(range.zone.bottom + 1);
           let str = "";
           if (range.isFullCol) {
@@ -39004,9 +39399,6 @@
               case "SET_GRID_LINES_VISIBILITY":
                   this.setGridLinesVisibility(cmd.sheetId, cmd.areGridLinesVisible);
                   break;
-              case "DELETE_CONTENT":
-                  this.clearZones(cmd.sheetId, cmd.target);
-                  break;
               case "CREATE_SHEET":
                   const sheet = this.createSheet(cmd.sheetId, cmd.name || this.getNextSheetName(), cmd.cols || 26, cmd.rows || 100, cmd.position);
                   this.history.update("sheetIdsMapName", sheet.name, sheet.id);
@@ -39373,23 +39765,6 @@
       setGridLinesVisibility(sheetId, areGridLinesVisible) {
           this.history.update("sheets", sheetId, "areGridLinesVisible", areGridLinesVisible);
       }
-      clearZones(sheetId, zones) {
-          for (let zone of zones) {
-              for (let col = zone.left; col <= zone.right; col++) {
-                  for (let row = zone.top; row <= zone.bottom; row++) {
-                      const cell = this.sheets[sheetId].rows[row].cells[col];
-                      if (cell) {
-                          this.dispatch("UPDATE_CELL", {
-                              sheetId: sheetId,
-                              content: "",
-                              col,
-                              row,
-                          });
-                      }
-                  }
-              }
-          }
-      }
       createSheet(id, name, colNumber, rowNumber, position) {
           const sheet = {
               id,
@@ -40179,6 +40554,41 @@
               sheet.headerGroups = this.groups[sheet.id];
           }
       }
+      exportForExcel(data) {
+          /**
+           * Example of header groups in the XLSX file:
+           *
+           * 0. |        <row index="1" outlineLevel="1">
+           * 1. | |      <row index="2" outlineLevel="2">
+           * 2. | |      <row index="3" outlineLevel="2">
+           * 3. | |_     <row index="4" outlineLevel="2">
+           * 4. |_       <row index="5" outlineLevel="1" collapsed="0">
+           * 5.          <row index="6" collapsed="0">
+           *
+           * The collapsed flag can be on the header before or after the group (or can be missing). Default is after.
+           */
+          for (const sheet of data.sheets) {
+              for (const dim of ["ROW", "COL"]) {
+                  const layers = this.getGroupsLayers(sheet.id, dim);
+                  for (let layerIndex = 0; layerIndex < layers.length; layerIndex++) {
+                      const layer = layers[layerIndex];
+                      for (const group of layer) {
+                          for (let headerIndex = group.start; headerIndex <= group.end; headerIndex++) {
+                              const header = getSheetDataHeader(sheet, dim, headerIndex);
+                              header.outlineLevel = layerIndex + 1;
+                              if (group.isFolded) {
+                                  header.isHidden = true;
+                              }
+                          }
+                          if (group.isFolded) {
+                              const header = getSheetDataHeader(sheet, dim, group.end + 1);
+                              header.collapsed = true;
+                          }
+                      }
+                  }
+              }
+          }
+      }
   }
 
   class SettingsPlugin extends CorePlugin {
@@ -40296,23 +40706,18 @@
        *        The `compute` of the formula's function must process it completely
        */
       refFn(range, isMeta, functionName, paramNumber) {
+          this.assertRangeValid(range);
           if (isMeta) {
               // Use zoneToXc of zone instead of getRangeString to avoid sending unbounded ranges
               const sheetName = this.getters.getSheetName(range.sheetId);
               return { value: getFullReference(sheetName, zoneToXc(range.zone)) };
           }
-          if (!isZoneValid(range.zone)) {
-              throw new InvalidReferenceError();
-          }
           // if the formula definition could have accepted a range, we would pass through the _range function and not here
           if (range.zone.bottom !== range.zone.top || range.zone.left !== range.zone.right) {
               throw new EvaluationError(paramNumber
                   ? _t("Function %s expects the parameter %s to be a single value or a single cell reference, not a range.", functionName.toString(), paramNumber.toString())
                   : _t("Function %s expects its parameters to be single values or single cell references, not ranges.", functionName.toString()));
           }
-          if (range.invalidSheetName) {
-              throw new EvaluationError(_t("Invalid sheet name: %s", range.invalidSheetName));
-          }
           const position = { sheetId: range.sheetId, col: range.zone.left, row: range.zone.top };
           return this.readCell(position);
       }
@@ -40344,10 +40749,10 @@
        * Note that each col is possibly sparse: it only contain the values of cells
        * that are actually present in the grid.
        */
-      range({ sheetId, zone }) {
-          if (!isZoneValid(zone)) {
-              throw new InvalidReferenceError();
-          }
+      range(range) {
+          this.assertRangeValid(range);
+          const sheetId = range.sheetId;
+          const zone = range.zone;
           // Performance issue: Avoid fetching data on positions that are out of the spreadsheet
           // e.g. A1:ZZZ9999 in a sheet with 10 cols and 10 rows should ignore everything past J10 and return a 10x10 array
           const sheetZone = this.getters.getSheetZone(sheetId);
@@ -40375,6 +40780,14 @@
           this.rangeCache[cacheKey] = matrix;
           return matrix;
       }
+      assertRangeValid(range) {
+          if (!isZoneValid(range.zone)) {
+              throw new InvalidReferenceError();
+          }
+          if (range.invalidSheetName) {
+              throw new EvaluationError(_t("Invalid sheet name: %s", range.invalidSheetName));
+          }
+      }
   }
 
   function quickselect(arr, k, left, right, compare) {
@@ -42505,11 +42918,25 @@
           }
           switch (cmd.type) {
               case "ADD_DATA_VALIDATION_RULE":
+                  const ranges = cmd.ranges.map((range) => this.getters.getRangeFromRangeData(range));
+                  if (cmd.rule.criterion.type === "isBoolean") {
+                      this.setContentToBooleanCells({ ...cmd.rule, ranges });
+                  }
+                  delete this.validationResults[cmd.sheetId];
+                  break;
               case "REMOVE_DATA_VALIDATION_RULE":
                   delete this.validationResults[cmd.sheetId];
                   break;
           }
       }
+      setContentToBooleanCells(rule) {
+          for (const position of getCellPositionsInRanges(rule.ranges)) {
+              const evaluatedCell = this.getters.getEvaluatedCell(position);
+              if (evaluatedCell.type !== CellValueType.boolean) {
+                  this.dispatch("UPDATE_CELL", { ...position, content: "FALSE" });
+              }
+          }
+      }
       isDataValidationInvalid(cellPosition) {
           return !this.getValidationResultForCell(cellPosition).isValid;
       }
@@ -45062,6 +45489,11 @@
       pasteDataValidation(origin, target) {
           const rule = this.getters.getValidationRuleForCell(origin);
           if (!rule) {
+              const targetRule = this.getters.getValidationRuleForCell(target);
+              if (targetRule) {
+                  // Remove the data validation rule on the target cell
+                  this.adaptDataValidationRule(target.sheetId, targetRule, [], [toXC(target.col, target.row)]);
+              }
               return;
           }
           const xc = toXC(target.col, target.row);
@@ -45367,12 +45799,8 @@
               case "ADD_COLUMNS_ROWS":
               case "EVALUATE_CELLS":
               case "UPDATE_CELL":
-                  this.isSearchDirty = true;
-                  break;
               case "ACTIVATE_SHEET":
-                  if (this.searchOptions.searchScope === "activeSheet") {
-                      this.isSearchDirty = true;
-                  }
+                  this.isSearchDirty = true;
                   break;
           }
       }
@@ -46536,27 +46964,6 @@
       // ---------------------------------------------------------------------------
       // Command Handling
       // ---------------------------------------------------------------------------
-      allowDispatch(cmd) {
-          switch (cmd.type) {
-              case "ADD_RANGE":
-              case "ADD_EMPTY_RANGE":
-                  if (this.inputHasSingleRange && this.ranges.length === 1) {
-                      return "MaximumRangesReached" /* CommandResult.MaximumRangesReached */;
-                  }
-                  break;
-              case "REMOVE_RANGE":
-                  if (this.ranges.length === 1) {
-                      return "MinimumRangesReached" /* CommandResult.MinimumRangesReached */;
-                  }
-                  break;
-              case "CHANGE_RANGE":
-                  if (this.inputHasSingleRange && cmd.value.split(",").length > 1) {
-                      return "MaximumRangesReached" /* CommandResult.MaximumRangesReached */;
-                  }
-                  break;
-          }
-          return "Success" /* CommandResult.Success */;
-      }
       handleEvent(event) {
           if (this.focusedRangeIndex === null) {
               return;
@@ -46794,6 +47201,15 @@
       // Command Handling
       // ---------------------------------------------------------------------------
       allowDispatch(cmd) {
+          switch (cmd.type) {
+              case "FOCUS_RANGE":
+              case "CHANGE_RANGE":
+              case "ADD_EMPTY_RANGE":
+              case "REMOVE_RANGE":
+                  if (!this.inputs[cmd.id]) {
+                      return "InvalidInputId" /* CommandResult.InvalidInputId */;
+                  }
+          }
           switch (cmd.type) {
               case "FOCUS_RANGE":
                   const index = this.currentInput?.getIndex(cmd.rangeId);
@@ -46801,9 +47217,25 @@
                       return "InputAlreadyFocused" /* CommandResult.InputAlreadyFocused */;
                   }
                   break;
-          }
-          if (this.currentInput) {
-              return this.currentInput.allowDispatch(cmd);
+              case "ADD_RANGE":
+              case "ADD_EMPTY_RANGE":
+                  const input = this.inputs[cmd.id];
+                  if (input.inputHasSingleRange && input.ranges.length === 1) {
+                      return "MaximumRangesReached" /* CommandResult.MaximumRangesReached */;
+                  }
+                  break;
+              case "REMOVE_RANGE":
+                  if (this.inputs[cmd.id].ranges.length === 1) {
+                      return "MinimumRangesReached" /* CommandResult.MinimumRangesReached */;
+                  }
+                  break;
+              case "CHANGE_RANGE": {
+                  const input = this.inputs[cmd.id];
+                  if (input.inputHasSingleRange && cmd.value.split(",").length > 1) {
+                      return "MaximumRangesReached" /* CommandResult.MaximumRangesReached */;
+                  }
+                  break;
+              }
           }
           return "Success" /* CommandResult.Success */;
       }
@@ -48933,9 +49365,10 @@
        */
       getReferencedRanges() {
           const editionSheetId = this.getters.getCurrentEditedCell().sheetId;
-          return this.currentTokens
+          const referenceRanges = this.currentTokens
               .filter((token) => token.type === "REFERENCE")
               .map((token) => this.getters.getRangeFromSheetXC(editionSheetId, token.value));
+          return referenceRanges.filter((range) => !range.invalidSheetName && !range.invalidXc);
       }
       getAutoCompleteDataValidationValues() {
           if (this.mode === "inactive") {
@@ -50965,6 +51398,7 @@
       .add("header grouping", HeaderGroupingPlugin)
       .add("header visibility", HeaderVisibilityPlugin)
       .add("filters", FiltersPlugin)
+      .add("dataValidation", DataValidationPlugin)
       .add("cell", CellPlugin)
       .add("merge", MergePlugin)
       .add("headerSize", HeaderSizePlugin)
@@ -50972,8 +51406,7 @@
       .add("conditional formatting", ConditionalFormatPlugin)
       .add("figures", FigurePlugin)
       .add("chart", ChartPlugin)
-      .add("image", ImagePlugin)
-      .add("dataValidation", DataValidationPlugin);
+      .add("image", ImagePlugin);
   // Plugins which handle a specific feature, without handling any core commands
   const featurePluginRegistry = new Registry()
       .add("ui_sheet", SheetUIPlugin)
@@ -56006,6 +56439,12 @@
               ["customWidth", 1],
               ["hidden", col.isHidden ? 1 : 0],
           ];
+          if (col.outlineLevel) {
+              attributes.push(["outlineLevel", col.outlineLevel]);
+          }
+          if (col.collapsed) {
+              attributes.push(["collapsed", 1]);
+          }
           colNodes.push(escapeXml /*xml*/ `
       <col ${formatAttributes(attributes)}/>
     `);
@@ -56021,8 +56460,18 @@
       for (let r = 0; r < sheet.rowNumber; r++) {
           const rowAttrs = [["r", r + 1]];
           const row = sheet.rows[r] || {};
-          // Always force our own row height
-          rowAttrs.push(["ht", convertHeightToExcel(row.size || DEFAULT_CELL_HEIGHT)], ["customHeight", 1], ["hidden", row.isHidden ? 1 : 0]);
+          if (row.size && row.size !== DEFAULT_CELL_HEIGHT) {
+              rowAttrs.push(["ht", convertHeightToExcel(row.size)], ["customHeight", 1]);
+          }
+          if (row.isHidden) {
+              rowAttrs.push(["hidden", 1]);
+          }
+          if (row.outlineLevel) {
+              rowAttrs.push(["outlineLevel", row.outlineLevel]);
+          }
+          if (row.collapsed) {
+              rowAttrs.push(["collapsed", 1]);
+          }
           const cellNodes = [];
           for (let c = 0; c < sheet.colNumber; c++) {
               const xc = toXC(c, r);
@@ -56055,7 +56504,11 @@
         `);
               }
           }
-          if (cellNodes.length || row.size !== DEFAULT_CELL_HEIGHT || row.isHidden) {
+          if (cellNodes.length ||
+              row.size !== DEFAULT_CELL_HEIGHT ||
+              row.isHidden ||
+              row.outlineLevel ||
+              row.collapsed) {
               rowNodes.push(escapeXml /*xml*/ `
         <row ${formatAttributes(rowAttrs)}>
           ${joinXmlNodes(cellNodes)}
@@ -56989,6 +57442,13 @@
       urlRepresentation,
   };
   const components = {
+      Checkbox,
+      Section,
+      ChartColor,
+      ChartDataSeries,
+      ChartErrorSection,
+      ChartLabelRange,
+      ChartTitle,
       ChartPanel,
       ChartFigure,
       ChartJsComponent,
@@ -57060,9 +57520,9 @@
   exports.tokenize = tokenize;
 
 
-  __info__.version = "17.2.0-alpha.1";
-  __info__.date = "2024-01-17T10:27:26.763Z";
-  __info__.hash = "296f467";
+  __info__.version = "17.2.0-alpha.2";
+  __info__.date = "2024-01-29T13:55:57.132Z";
+  __info__.hash = "03c1335";
 
 
 })(this.o_spreadsheet = this.o_spreadsheet || {}, owl);