@odoo/o-spreadsheet 18.0.82 → 18.0.84

package/dist/o-spreadsheet.esm.js

@@ -2,9 +2,9 @@
 /**
  * This file is generated by o-spreadsheet build tools. Do not edit it.
  * @see https://github.com/odoo/o-spreadsheet
- * @version 18.0.82
- * @date 2026-09-10T05:35:40.438Z
- * @hash d0329aa
+ * @version 18.0.84
+ * @date 2026-10-14T06:49:38.664Z
+ * @hash 56a1fca
  */
 
 import { Component, markRaw, onMounted, onPatched, onWillPatch, onWillStart, onWillUnmount, onWillUpdateProps, status, toRaw, useChildSubEnv, useComponent, useEffect, useEnv, useExternalListener, useRef, useState, useSubEnv, xml } from "@odoo/owl";
@@ -207,6 +207,10 @@ const ALERT_INFO_BG = "#CDEDF1";
 const ALERT_INFO_BORDER = "#98DBE2";
 const ALERT_INFO_TEXT_COLOR = "#09414A";
 const BADGE_SELECTED_COLOR = "#E6F2F3";
+const DEFAULT_CHART_PADDING = 20;
+const DEFAULT_CHART_FONT_SIZE = 22;
+const SCORECARD_GAUGE_CHART_PADDING = 10;
+const SCORECARD_GAUGE_CHART_FONT_SIZE = 14;
 const COLOR_PICKER_DEFAULTS = [
 	"#000000",
 	"#434343",
@@ -289,8 +293,34 @@ const COLOR_PICKER_DEFAULTS = [
 	"#20124D",
 	"#4C1130"
 ];
+const MIN_ROW_HEIGHT = 10;
+const MIN_COL_WIDTH = 5;
+const HEADER_HEIGHT = 26;
+const HEADER_WIDTH = 48;
+const TOPBAR_HEIGHT = 63;
+const TOPBAR_TOOLBAR_HEIGHT = 34;
+const BOTTOMBAR_HEIGHT = 36;
+const DEFAULT_CELL_WIDTH = 96;
 const DEFAULT_CELL_HEIGHT = 23;
-const FOOTER_HEIGHT = 2 * 23;
+const SCROLLBAR_WIDTH = 15;
+const AUTOFILL_EDGE_LENGTH = 8;
+const ICON_EDGE_LENGTH = 18;
+const MIN_CF_ICON_MARGIN = 4;
+const MIN_CELL_TEXT_MARGIN = 4;
+const CF_ICON_EDGE_LENGTH = 15;
+const PADDING_AUTORESIZE_VERTICAL = 3;
+const PADDING_AUTORESIZE_HORIZONTAL = MIN_CELL_TEXT_MARGIN;
+const GROUP_LAYER_WIDTH = 21;
+const GRID_ICON_MARGIN = 2;
+const GRID_ICON_EDGE_LENGTH = 17;
+const FOOTER_HEIGHT = 2 * DEFAULT_CELL_HEIGHT;
+const MENU_WIDTH = 250;
+const MENU_VERTICAL_PADDING = 6;
+const MENU_ITEM_HEIGHT = 26;
+const MENU_ITEM_PADDING_HORIZONTAL = 11;
+const MENU_ITEM_PADDING_VERTICAL = 4;
+const MENU_SEPARATOR_BORDER_WIDTH = 1;
+const MENU_SEPARATOR_PADDING = 5;
 const DEFAULT_STYLE = {
 	align: "left",
 	verticalAlign: "bottom",
@@ -309,13 +339,22 @@ const DEFAULT_NUMBER_STYLE = {
 };
 const DEFAULT_VERTICAL_ALIGN = DEFAULT_STYLE.verticalAlign;
 const DEFAULT_WRAPPING_MODE = DEFAULT_STYLE.wrapping;
+const DEFAULT_FONT_WEIGHT = "400";
 const DEFAULT_FONT_SIZE = DEFAULT_STYLE.fontSize;
+const HEADER_FONT_SIZE = 11;
 const DEFAULT_FONT = "'Roboto', arial, 'Liberation Sans'";
 const DEFAULT_BORDER_DESC = {
 	style: "thin",
 	color: "#000000"
 };
+const MAX_HISTORY_STEPS = 99;
 const DEFAULT_REVISION_ID = "START_REVISION";
+const DEFAULT_FIGURE_HEIGHT = 335;
+const DEFAULT_FIGURE_WIDTH = 536;
+const FIGURE_BORDER_WIDTH = 1;
+const MIN_FIG_SIZE = 80;
+const MAX_CHAR_LABEL = 20;
+const FIGURE_ID_SPLITTER = "??";
 const DEFAULT_GAUGE_LOWER_COLOR = "#EA6175";
 const DEFAULT_GAUGE_MIDDLE_COLOR = "#FFD86D";
 const DEFAULT_GAUGE_UPPER_COLOR = "#43C5B1";
@@ -323,6 +362,8 @@ const DEFAULT_SCORECARD_BASELINE_MODE = "difference";
 const DEFAULT_SCORECARD_BASELINE_COLOR_UP = "#43C5B1";
 const DEFAULT_SCORECARD_BASELINE_COLOR_DOWN = "#EA6175";
 const LINE_FILL_TRANSPARENCY = .4;
+const DEBOUNCE_TIME = 200;
+const MESSAGE_VERSION = 1;
 const FORBIDDEN_SHEETNAME_CHARS = [
 	"'",
 	"*",
@@ -333,6 +374,7 @@ const FORBIDDEN_SHEETNAME_CHARS = [
 	"]"
 ];
 const FORBIDDEN_SHEETNAME_CHARS_IN_EXCEL_REGEX = /'|\*|\?|\/|\\|\[|\]/;
+const FORMULA_REF_IDENTIFIER = "|";
 let DEFAULT_SHEETVIEW_SIZE = 0;
 function getDefaultSheetViewSize() {
 	return DEFAULT_SHEETVIEW_SIZE;
@@ -341,6 +383,7 @@ function setDefaultSheetViewSize(size) {
 	DEFAULT_SHEETVIEW_SIZE = size;
 }
 const MAXIMAL_FREEZABLE_RATIO = .85;
+const NEWLINE = "\n";
 const FONT_SIZES = [
 	6,
 	7,
@@ -725,7 +768,7 @@ const whiteSpaceCharacters = specialWhiteSpaceSpecialCharacters.concat([" "]);
 */
 function replaceNewLines(text) {
 	if (!text) return "";
-	return text.replace(newLineRegexp, "\n");
+	return text.replace(newLineRegexp, NEWLINE);
 }
 /**
 * Determine if the numbers are consecutive.
@@ -1333,7 +1376,7 @@ function toCartesian(xc) {
 	consumeSpaces(chars);
 	const col = letterPart - 1;
 	const row = num - 1;
-	if (!chars.isOver() || col > MAX_COL || row > 9999998) throw new Error(`Invalid cell description: ${xc}`);
+	if (!chars.isOver() || col > MAX_COL || row > MAX_ROW) throw new Error(`Invalid cell description: ${xc}`);
 	return {
 		col,
 		row
@@ -1771,7 +1814,7 @@ function toUnboundedZone(xc) {
 	const orderedZone = reorderZone(toZoneWithoutBoundaryChanges(xc));
 	const bottom = orderedZone.bottom;
 	const right = orderedZone.right;
-	if (bottom !== void 0 && bottom > 9999998 || right !== void 0 && right > MAX_COL) throw new Error(`Range string out of bounds: ${xc}`);
+	if (bottom !== void 0 && bottom > MAX_ROW || right !== void 0 && right > MAX_COL) throw new Error(`Range string out of bounds: ${xc}`);
 	if (bottom === void 0 && right === void 0) throw new Error("Wrong zone xc. The zone cannot be at the same time a full column and a full row");
 	return orderedZone;
 }
@@ -2168,7 +2211,8 @@ const globalIdCounter = /* @__PURE__ */ new WeakMap();
 function getItemId(item, itemsDic) {
 	if (!globalReverseLookup$1.has(itemsDic)) {
 		globalReverseLookup$1.set(itemsDic, /* @__PURE__ */ new Map());
-		globalIdCounter.set(itemsDic, 0);
+		const maxId = Math.max(...Object.keys(itemsDic).map(Number), 0);
+		globalIdCounter.set(itemsDic, maxId);
 	}
 	const reverseLookup = globalReverseLookup$1.get(itemsDic);
 	const canonical = getCanonicalRepresentation(item);
@@ -2210,6 +2254,26 @@ function getCanonicalRepresentation(item) {
 	repr += "}";
 	return repr;
 }
+/**
+* This adds a border/style/format to the cell position in the workbook data, updating the zonified structure accordingly.
+*/
+function addStyleToWorkbookData(workbookData, key, position, newItem) {
+	const sheetData = workbookData.sheets.find((sheet) => sheet.id === position.sheetId);
+	if (!sheetData) throw new Error(`Sheet with id ${position.sheetId} not found`);
+	const id = getItemId(newItem, workbookData[key]);
+	const zonifiedData = sheetData[key];
+	const zone = positionToZone(position);
+	const styleXc = Object.keys(zonifiedData).find((styleXc) => isZoneInside(zone, toZone(styleXc)));
+	if (!styleXc) {
+		zonifiedData[zoneToXc(zone)] = id;
+		return;
+	}
+	const existingStyle = zonifiedData[styleXc];
+	const remainingZones = recomputeZones([toZone(styleXc)], [zone]);
+	delete zonifiedData[styleXc];
+	for (const remainingZone of remainingZones) zonifiedData[zoneToXc(remainingZone)] = existingStyle;
+	zonifiedData[zoneToXc(zone)] = id;
+}
 
 //#endregion
 //#region src/helpers/dates.ts
@@ -3668,7 +3732,7 @@ function visitMatchingRanges(args, cb, locale, isQuery = false) {
 	for (let i = 0; i < countArg - 1; i += 2) {
 		const criteriaRange = toMatrix(args[i]);
 		if (criteriaRange.length !== dimRow || criteriaRange[0].length !== dimCol) throw new EvaluationError(_t("Function [[FUNCTION_NAME]] expects criteria_range to have the same dimension"));
-		const predicate = getPredicate(toString(args[i + 1]), locale);
+		const predicate = getPredicate(toLocaleString(args[i + 1], locale), locale);
 		if (isQuery && typeof predicate.operand === "string") predicate.operand += "*";
 		predicates.push(predicate);
 	}
@@ -4124,7 +4188,7 @@ function parseNumberFormatTokens(tokens) {
 		switch (token.type) {
 			case "DIGIT":
 				if (parsedPart === integerPart) parsedPart.push(token);
-				else if (numberOfDecimalsDigits < 20) {
+				else if (numberOfDecimalsDigits < MAX_DECIMAL_PLACES) {
 					parsedPart.push(token);
 					numberOfDecimalsDigits++;
 				}
@@ -4441,7 +4505,7 @@ const numberRepresentation = [];
 * exceed in the decimal part, in which case digits are rounded.
 *
 **/
-function splitNumber(value, maxDecimals = 20) {
+function splitNumber(value, maxDecimals = MAX_DECIMAL_PLACES) {
 	const asString = value.toString();
 	if (asString.includes("e")) return splitNumberIntl(value, maxDecimals);
 	if (Number.isInteger(value)) return {
@@ -4510,7 +4574,7 @@ function limitDecimalDigits(decimalDigits, maxDecimals) {
 * Supports numbers with a lot of digits that are transformed to scientific notation by
 * number.toString(), but is slow.
 */
-function splitNumberIntl(value, maxDecimals = 20) {
+function splitNumberIntl(value, maxDecimals = MAX_DECIMAL_PLACES) {
 	let formatter = numberRepresentation[maxDecimals];
 	if (!formatter) {
 		formatter = new Intl.NumberFormat("en-US", {
@@ -4997,7 +5061,7 @@ const MIN_DELAY = 20;
 * Returns a timeout delay in milliseconds.
 */
 function scrollDelay(value) {
-	return 20 + (140 - 20) * Math.exp(-.035 * (value - 1));
+	return MIN_DELAY + (MAX_DELAY - MIN_DELAY) * Math.exp(-.035 * (value - 1));
 }
 
 //#endregion
@@ -5365,13 +5429,13 @@ function isSheetNameEqual(name1, name2) {
 //#endregion
 //#region src/helpers/text_helper.ts
 function computeTextLinesHeight(textLineHeight, numberOfLines = 1) {
-	return numberOfLines * (textLineHeight + 4) - 4;
+	return numberOfLines * (textLineHeight + MIN_CELL_TEXT_MARGIN) - MIN_CELL_TEXT_MARGIN;
 }
 /**
 * Get the default height of the cell given its style.
 */
 function getDefaultCellHeight(ctx, cell, locale, colSize) {
-	if (!cell || !cell.isFormula && !cell.content) return 23;
+	if (!cell || !cell.isFormula && !cell.content) return DEFAULT_CELL_HEIGHT;
 	let content = "";
 	try {
 		if (!cell.isFormula) {
@@ -5387,8 +5451,8 @@ function getDefaultCellHeight(ctx, cell, locale, colSize) {
 	return getCellContentHeight(ctx, content, cell.style, colSize);
 }
 function getCellContentHeight(ctx, content, style, colSize) {
-	const numberOfLines = splitTextToWidth(ctx, content, style, style?.wrapping === "wrap" ? colSize - 2 * 4 : void 0).length;
-	return computeTextLinesHeight(computeTextFontSizeInPixels(style), numberOfLines) + 2 * 3;
+	const numberOfLines = splitTextToWidth(ctx, content, style, style?.wrapping === "wrap" ? colSize - 2 * MIN_CELL_TEXT_MARGIN : void 0).length;
+	return computeTextLinesHeight(computeTextFontSizeInPixels(style), numberOfLines) + 2 * PADDING_AUTORESIZE_VERTICAL;
 }
 function getDefaultContextFont(fontSize, bold = false, italic = false) {
 	return `${italic ? "italic" : ""} ${bold ? "bold" : ""} ${fontSize}px ${DEFAULT_FONT}`;
@@ -5438,7 +5502,7 @@ function fontSizeInPixels(fontSize) {
 	return Math.round(fontSize * 96 / 72);
 }
 function computeTextFont(style, fontUnit = "pt") {
-	return `${style.italic ? "italic " : ""}${style.bold ? "bold" : "400"} ${(fontUnit === "pt" ? computeTextFontSizeInPixels(style) : style.fontSize) ?? DEFAULT_FONT_SIZE}px ${DEFAULT_FONT}`;
+	return `${style.italic ? "italic " : ""}${style.bold ? "bold" : DEFAULT_FONT_WEIGHT} ${(fontUnit === "pt" ? computeTextFontSizeInPixels(style) : style.fontSize) ?? DEFAULT_FONT_SIZE}px ${DEFAULT_FONT}`;
 }
 function computeTextFontSizeInPixels(style) {
 	return fontSizeInPixels(style?.fontSize || DEFAULT_FONT_SIZE);
@@ -5462,7 +5526,7 @@ function splitTextToWidth(ctx, text, style, width) {
 	if (!style) style = {};
 	if (isMarkdownLink(text)) text = parseMarkdownLink(text).label;
 	const brokenText = [];
-	const lines = text.includes("\n") ? text.split("\n") : [text];
+	const lines = text.includes(NEWLINE) ? text.split(NEWLINE) : [text];
 	for (const line of lines) {
 		const words = line.includes(" ") ? line.split(" ") : [line];
 		if (!width) {
@@ -5526,7 +5590,7 @@ function getFontSizeMatchingWidth(lineWidth, maxFontSize, getTextWidth, precisio
 	return fontSize;
 }
 function computeIconWidth(style) {
-	return computeTextFontSizeInPixels(style) + 2 * 4;
+	return computeTextFontSizeInPixels(style) + 2 * MIN_CF_ICON_MARGIN;
 }
 /** Transform a string to lower case. If the string is undefined, return an empty string */
 function toLowerCase(str) {
@@ -6045,13 +6109,13 @@ function tokenizeSimpleSpace(chars) {
 }
 function tokenizeNewLine(chars) {
 	let length = 0;
-	while (chars.current === "\n") {
+	while (chars.current === NEWLINE) {
 		length++;
 		chars.shift();
 	}
 	if (length) return {
 		type: "SPACE",
-		value: "\n".repeat(length)
+		value: NEWLINE.repeat(length)
 	};
 	return null;
 }
@@ -6705,7 +6769,7 @@ function getPreviousOrNextValueDomain(pivot, domain, fieldNameWithGranularity, d
 	if (value === void 0) return;
 	const valueIndex = values.indexOf(value);
 	if (value === void 0 || valueIndex === -1) return;
-	return replaceFieldValueInDomain(domain, fieldNameWithGranularity, values[clip(valueIndex + (direction === "(previous)" ? -1 : 1), 0, values.length - 1)]);
+	return replaceFieldValueInDomain(domain, fieldNameWithGranularity, values[clip(valueIndex + (direction === PREVIOUS_VALUE ? -1 : 1), 0, values.length - 1)]);
 }
 function domainToString(domain) {
 	return domain ? domain.map(domainNodeToString).join(", ") : "";
@@ -8658,7 +8722,7 @@ function getFullTrendingLineDataSet(dataset, config, data, labels) {
 	const borderColor = config.color || lightenColor(rgbaToHex(defaultBorderColor), .5);
 	return {
 		type: "line",
-		xAxisID: "x1",
+		xAxisID: TREND_LINE_XAXIS_ID,
 		yAxisID: dataset.yAxisID,
 		label: dataset.label ? _t("Trend line for %s", dataset.label) : "",
 		data: data.map((v, i) => ({
@@ -8781,7 +8845,7 @@ function drawTextWithBackground(text, x, y, ctx) {
 function drawLineOrBarChartValues(chart, options, ctx) {
 	const textsPositions = {};
 	for (const dataset of chart._metasets) {
-		if (dataset.xAxisID === "x1") return;
+		if (dataset.xAxisID === TREND_LINE_XAXIS_ID) return;
 		for (let i = 0; i < dataset._parsed.length; i++) {
 			const value = dataset._parsed[i].y;
 			const point = dataset.data[i];
@@ -8801,7 +8865,7 @@ function drawLineOrBarChartValues(chart, options, ctx) {
 function drawHorizontalBarChartValues(chart, options, ctx) {
 	const textsPositions = {};
 	for (const dataset of chart._metasets) {
-		if (dataset.xAxisID === "x1") return;
+		if (dataset.xAxisID === TREND_LINE_XAXIS_ID) return;
 		for (let i = 0; i < dataset._parsed.length; i++) {
 			const value = dataset._parsed[i].x;
 			const displayValue = options.callback(value, dataset, i);
@@ -8988,6 +9052,9 @@ const WIDTH_FACTOR = .143;
 const EXCEL_DEFAULT_COL_WIDTH = 8.43;
 /** unit : points */
 const EXCEL_DEFAULT_ROW_HEIGHT = 12.75;
+const EXCEL_IMPORT_DEFAULT_NUMBER_OF_COLS = 30;
+const EXCEL_IMPORT_DEFAULT_NUMBER_OF_ROWS = 100;
+const FIRST_NUMFMT_ID = 164;
 const FORCE_DEFAULT_ARGS_FUNCTIONS = {
 	FLOOR: [{
 		type: "NUMBER",
@@ -9305,9 +9372,9 @@ css`
       display: flex;
       align-items: center;
       justify-content: center;
-      width: ${18}px;
-      height: ${18}px;
-      font-size: ${18}px;
+      width: ${ICON_EDGE_LENGTH}px;
+      height: ${ICON_EDGE_LENGTH}px;
+      font-size: ${ICON_EDGE_LENGTH}px;
       vertical-align: middle;
 
       .small-text {
@@ -10279,7 +10346,7 @@ function extractStyle(cell, data) {
 		alignment: {
 			horizontal: style.align,
 			vertical: style.verticalAlign ? V_ALIGNMENT_EXPORT_CONVERSION_MAP[style.verticalAlign] : void 0,
-			wrapText: style.wrapping === "wrap" || cell.content?.includes("\n") ? true : void 0,
+			wrapText: style.wrapping === "wrap" || cell.content?.includes(NEWLINE) ? true : void 0,
 			shrinkToFit: style.wrapping === "clip" ? true : void 0
 		}
 	};
@@ -10310,7 +10377,7 @@ function normalizeStyle(construct, styles) {
 function convertFormat(format, numFmtStructure) {
 	if (!format) return 0;
 	let formatId = XLSX_FORMAT_MAP[format.format];
-	if (!formatId) formatId = pushElement(format, numFmtStructure) + 164;
+	if (!formatId) formatId = pushElement(format, numFmtStructure) + FIRST_NUMFMT_ID;
 	return formatId;
 }
 /**
@@ -10892,8 +10959,8 @@ function getSheetDims(sheet) {
 		dims[0] = Math.max(dims[0], largeMax(row.cells.map((cell) => toCartesian(cell.xc).col)));
 		dims[1] = Math.max(dims[1], row.index);
 	}
-	dims[0] = Math.max(dims[0], 30);
-	dims[1] = Math.max(dims[1], 100);
+	dims[0] = Math.max(dims[0], EXCEL_IMPORT_DEFAULT_NUMBER_OF_COLS);
+	dims[1] = Math.max(dims[1], EXCEL_IMPORT_DEFAULT_NUMBER_OF_ROWS);
 	return dims;
 }
 /**
@@ -11998,7 +12065,7 @@ var XlsxBaseExtractor = class {
 			rgb = this.getThemeColor(themeIndex, theme.clrScheme);
 		} else {
 			rgb = this.extractAttr(colorElement, "rgb")?.asString();
-			rgb = rgb === "FF000000" ? void 0 : rgb;
+			rgb = rgb === DEFAULT_SYSTEM_COLOR ? void 0 : rgb;
 		}
 		return {
 			rgb: rgb || defaultColor,
@@ -13076,7 +13143,7 @@ function getPathsOfContent(contentType, xmls) {
 * Get the corresponding relationship file for a given xml file in a XLSX directory.
 */
 function getRelationFile(file, xmls) {
-	if (file === "[Content_Types].xml") return "_rels/.rels";
+	if (file === CONTENT_TYPES_FILE) return "_rels/.rels";
 	let relsFile = "";
 	const pathParts = file.split("/");
 	for (let i = 0; i < pathParts.length - 1; i++) relsFile += pathParts[i] + "/";
@@ -13276,7 +13343,7 @@ function normalizeV9(formula) {
 			if (token.type === "REFERENCE" && cellReference.test(token.value)) {
 				const value = token.value.trim();
 				if (!dependencies.includes(value)) dependencies.push(value);
-				return `${"|"}${dependencies.indexOf(value)}${"|"}`;
+				return `${FORMULA_REF_IDENTIFIER}${dependencies.indexOf(value)}${FORMULA_REF_IDENTIFIER}`;
 			} else return token.value;
 		})),
 		dependencies
@@ -13504,7 +13571,7 @@ migrationStepRegistry.add("migration_1", {
 			if (cell.formula) {
 				let { text, dependencies } = cell.formula;
 				for (const [index, d] of Object.entries(dependencies)) {
-					const stringPosition = `\\${"|"}${index}\\${"|"}`;
+					const stringPosition = `\\${FORMULA_REF_IDENTIFIER}${index}\\${FORMULA_REF_IDENTIFIER}`;
 					text = text.replace(new RegExp(stringPosition, "g"), d);
 				}
 				cell.content = text;
@@ -13700,7 +13767,7 @@ function load(data, verboseImport) {
 		if (verboseImport) for (const parsingError of reader.warningManager.warnings.sort()) console.warn(parsingError);
 	}
 	if ("version" in data) {
-		if (data.version < 22) {
+		if (data.version < CURRENT_VERSION) {
 			console.debug("Migrating data from version", data.version);
 			data = migrate(data);
 		}
@@ -13756,7 +13823,7 @@ function forceUnicityOfFigure(data) {
 * sensible default values
 */
 function setDefaults(partialData) {
-	const data = Object.assign(createEmptyWorkbookData(), partialData, { version: 22 });
+	const data = Object.assign(createEmptyWorkbookData(), partialData, { version: CURRENT_VERSION });
 	data.sheets = data.sheets ? data.sheets.map((s, i) => Object.assign(createEmptySheet(`Sheet${i + 1}`, `Sheet${i + 1}`), s)) : [];
 	if (data.sheets.length === 0) data.sheets.push(createEmptySheet(INITIAL_SHEET_ID, "Sheet1"));
 	if (!isValidLocale(data.settings.locale)) data.settings.locale = DEFAULT_LOCALE;
@@ -13898,7 +13965,7 @@ function createEmptySheet(sheetId, name) {
 }
 function createEmptyWorkbookData(sheetName = "Sheet1") {
 	return {
-		version: 22,
+		version: CURRENT_VERSION,
 		sheets: [createEmptySheet(INITIAL_SHEET_ID, sheetName)],
 		styles: {},
 		formats: {},
@@ -13948,7 +14015,7 @@ function interactivePaste(env, target, pasteOption) {
 	}));
 }
 function interactivePasteFromOS(env, target, clipboardContent, pasteOption) {
-	if (clipboardContent.data && clipboardContent.data.version !== 22) env.notifyUser({
+	if (clipboardContent.data && clipboardContent.data.version !== CURRENT_VERSION) env.notifyUser({
 		type: "warning",
 		text: _t("You copied content from a different version of the application. Only text content will be pasted."),
 		sticky: false
@@ -14161,9 +14228,9 @@ const GAUGE_TEXT_COLOR_HIGH_CONTRAST = "#C8C8C8";
 const GAUGE_INFLECTION_MARKER_COLOR = "#666666aa";
 const GAUGE_INFLECTION_LABEL_BOTTOM_MARGIN = 6;
 const GAUGE_TITLE_SECTION_HEIGHT = 25;
-const GAUGE_TITLE_FONT_SIZE = 14;
-const GAUGE_TITLE_PADDING_LEFT = 10;
-const GAUGE_TITLE_PADDING_TOP = 10;
+const GAUGE_TITLE_FONT_SIZE = SCORECARD_GAUGE_CHART_FONT_SIZE;
+const GAUGE_TITLE_PADDING_LEFT = SCORECARD_GAUGE_CHART_PADDING;
+const GAUGE_TITLE_PADDING_TOP = SCORECARD_GAUGE_CHART_PADDING;
 function drawGaugeChart(canvas, runtime) {
 	const canvasBoundingRect = canvas.getBoundingClientRect();
 	const dpr = window.devicePixelRatio || 1;
@@ -14257,18 +14324,18 @@ function getGaugeRenderingConfig(boundingRect, runtime, ctx) {
 		x: boundingRect.width / 2,
 		y: gaugeRect.y + gaugeRect.height - gaugeRect.height / 12
 	};
-	let gaugeValueFontSize = 80;
+	let gaugeValueFontSize = GAUGE_DEFAULT_VALUE_FONT_SIZE;
 	if (gaugeRect.height < 300) gaugeValueFontSize = gaugeValueFontSize * (gaugeRect.height / 300);
 	const maxTextWidth = gaugeRect.width / 2;
 	const gaugeLabel = gaugeValue?.label || "-";
 	if (computeTextWidth(ctx, gaugeLabel, { fontSize: gaugeValueFontSize }, "px") > maxTextWidth) gaugeValueFontSize = getFontSizeMatchingWidth(maxTextWidth, gaugeValueFontSize, (fontSize) => computeTextWidth(ctx, gaugeLabel, { fontSize }, "px"));
 	const minLabelPosition = {
 		x: gaugeRect.x + gaugeArcWidth / 2,
-		y: gaugeRect.y + gaugeRect.height + 12
+		y: gaugeRect.y + gaugeRect.height + GAUGE_LABELS_FONT_SIZE
 	};
 	const maxLabelPosition = {
 		x: gaugeRect.x + gaugeRect.width - gaugeArcWidth / 2,
-		y: gaugeRect.y + gaugeRect.height + 12
+		y: gaugeRect.y + gaugeRect.height + GAUGE_LABELS_FONT_SIZE
 	};
 	const textColor = getContrastedTextColor(runtime.background);
 	const inflectionValues = getInflectionValues(runtime, gaugeRect, textColor, ctx);
@@ -14319,13 +14386,13 @@ function getGaugeRenderingConfig(boundingRect, runtime, ctx) {
 		minLabel: {
 			label: runtime.minValue.label,
 			textPosition: minLabelPosition,
-			fontSize: 12,
+			fontSize: GAUGE_LABELS_FONT_SIZE,
 			color: textColor
 		},
 		maxLabel: {
 			label: runtime.maxValue.label,
 			textPosition: maxLabelPosition,
-			fontSize: 12,
+			fontSize: GAUGE_LABELS_FONT_SIZE,
 			color: textColor
 		}
 	};
@@ -14335,9 +14402,9 @@ function getGaugeRenderingConfig(boundingRect, runtime, ctx) {
 * space for the title and labels.
 */
 function getGaugeRect(boundingRect, title) {
-	const titleHeight = title ? 25 : 0;
-	const drawHeight = boundingRect.height - 20 - titleHeight - 10;
-	const drawWidth = boundingRect.width - 30 * 2;
+	const titleHeight = title ? GAUGE_TITLE_SECTION_HEIGHT : 0;
+	const drawHeight = boundingRect.height - GAUGE_PADDING_BOTTOM - titleHeight - GAUGE_PADDING_TOP;
+	const drawWidth = boundingRect.width - GAUGE_PADDING_SIDE * 2;
 	let gaugeWidth;
 	let gaugeHeight;
 	if (drawWidth > 2 * drawHeight) {
@@ -14348,8 +14415,8 @@ function getGaugeRect(boundingRect, title) {
 		gaugeHeight = drawWidth / 2;
 	}
 	return {
-		x: 30 + (drawWidth - gaugeWidth) / 2,
-		y: titleHeight + 10 + (drawHeight - gaugeHeight) / 2,
+		x: GAUGE_PADDING_SIDE + (drawWidth - gaugeWidth) / 2,
+		y: titleHeight + GAUGE_PADDING_TOP + (drawHeight - gaugeHeight) / 2,
 		width: gaugeWidth,
 		height: gaugeHeight
 	};
@@ -14366,20 +14433,20 @@ function getInflectionValues(runtime, gaugeRect, textColor, ctx) {
 		x: gaugeRect.x + gaugeRect.width / 2,
 		y: gaugeRect.y + gaugeRect.height
 	};
-	const textStyle = { fontSize: 12 };
+	const textStyle = { fontSize: GAUGE_LABELS_FONT_SIZE };
 	const inflectionValues = [];
 	const inflectionValuesTextRects = [];
 	for (const inflectionValue of runtime.inflectionValues) {
 		const percentage = (inflectionValue.value - minValue.value) / (maxValue.value - minValue.value);
 		const labelWidth = computeTextWidth(ctx, inflectionValue.label, textStyle, "px");
 		const angle = Math.PI - Math.PI * percentage;
-		const textRect = getRectangleTangentToCircle(angle, gaugeRect.height + GAUGE_INFLECTION_LABEL_BOTTOM_MARGIN, gaugeCircleCenter.x, gaugeCircleCenter.y, labelWidth + 2, 12);
-		const offset = inflectionValuesTextRects.some((rect) => doRectanglesIntersect(rect, textRect)) ? 12 : 0;
+		const textRect = getRectangleTangentToCircle(angle, gaugeRect.height + GAUGE_INFLECTION_LABEL_BOTTOM_MARGIN, gaugeCircleCenter.x, gaugeCircleCenter.y, labelWidth + 2, GAUGE_LABELS_FONT_SIZE);
+		const offset = inflectionValuesTextRects.some((rect) => doRectanglesIntersect(rect, textRect)) ? GAUGE_LABELS_FONT_SIZE : 0;
 		inflectionValuesTextRects.push(textRect);
 		inflectionValues.push({
 			rotation: angle,
 			label: inflectionValue.label,
-			fontSize: 12,
+			fontSize: GAUGE_LABELS_FONT_SIZE,
 			color: textColor,
 			offset
 		});
@@ -14589,8 +14656,8 @@ var ScorecardChart$1 = class ScorecardChart$1 extends AbstractChart {
 		this.baselineMode = definition.baselineMode;
 		this.baselineDescr = definition.baselineDescr;
 		this.background = definition.background;
-		this.baselineColorUp = definition.baselineColorUp ?? "#43C5B1";
-		this.baselineColorDown = definition.baselineColorDown ?? "#EA6175";
+		this.baselineColorUp = definition.baselineColorUp ?? DEFAULT_SCORECARD_BASELINE_COLOR_UP;
+		this.baselineColorDown = definition.baselineColorDown ?? DEFAULT_SCORECARD_BASELINE_COLOR_DOWN;
 		this.humanize = definition.humanize ?? false;
 	}
 	static validateChartDefinition(validator, definition) {
@@ -14665,7 +14732,7 @@ function drawScoreChart(structure, canvas) {
 	canvas.width = dpr * structure.canvas.width;
 	canvas.height = dpr * structure.canvas.height;
 	ctx.scale(dpr, dpr);
-	const availableWidth = structure.canvas.width - 20;
+	const availableWidth = structure.canvas.width - DEFAULT_CHART_PADDING;
 	ctx.fillStyle = structure.canvas.backgroundColor;
 	ctx.fillRect(0, 0, structure.canvas.width, structure.canvas.height);
 	if (structure.title) {
@@ -14780,9 +14847,9 @@ function createScorecardChartRuntime(chart, getters) {
 
 //#endregion
 //#region src/helpers/figures/charts/scorecard_chart_config_builder.ts
-const CHART_PADDING = 10;
+const CHART_PADDING = SCORECARD_GAUGE_CHART_PADDING;
 const BOTTOM_PADDING_RATIO = .05;
-const CHART_TITLE_FONT_SIZE = 14;
+const CHART_TITLE_FONT_SIZE = SCORECARD_GAUGE_CHART_FONT_SIZE;
 const KEY_VALUE_FONT_SIZE = 32;
 const BASELINE_MAX_FONT_SIZE = 16;
 function formatBaselineDescr(baselineDescr, baseline) {
@@ -14848,7 +14915,7 @@ var ScorecardChartConfigBuilder = class {
 				y: this.keyValue ? this.height * (1 - BOTTOM_PADDING_RATIO * (this.runtime.progressBar ? 1 : 2)) : this.height - (this.height - titleHeight - baselineHeight) / 2 - CHART_PADDING
 			}
 		};
-		const minimalBaselinePosition = baselineArrowSize + 20;
+		const minimalBaselinePosition = baselineArrowSize + DEFAULT_CHART_PADDING;
 		if (structure.baseline.position.x < minimalBaselinePosition) structure.baseline.position.x = minimalBaselinePosition;
 		if (style.baselineArrow && !this.runtime.progressBar) structure.baselineArrow = {
 			direction: this.baselineArrow,
@@ -15026,7 +15093,7 @@ function aggregateDataForLabels(labels, datasets) {
 }
 function truncateLabel(label) {
 	if (!label) return "";
-	if (label.length > 20) return label.substring(0, 20) + "…";
+	if (label.length > MAX_CHAR_LABEL) return label.substring(0, MAX_CHAR_LABEL) + "…";
 	return label;
 }
 /**
@@ -15041,10 +15108,10 @@ function getDefaultChartJsRuntime(chart, labels, fontColor, { format, locale, tr
 		responsive: true,
 		maintainAspectRatio: false,
 		layout: { padding: {
-			left: 20,
-			right: 20,
-			top: chartTitle.text ? 20 / 2 : 20 + 5,
-			bottom: 20
+			left: DEFAULT_CHART_PADDING,
+			right: DEFAULT_CHART_PADDING,
+			top: chartTitle.text ? DEFAULT_CHART_PADDING / 2 : DEFAULT_CHART_PADDING + 5,
+			bottom: DEFAULT_CHART_PADDING
 		} },
 		elements: {
 			line: { fill: false },
@@ -15058,7 +15125,7 @@ function getDefaultChartJsRuntime(chart, labels, fontColor, { format, locale, tr
 				color: chartTitle?.color ?? fontColor,
 				align: chartTitle.align === "center" ? "center" : chartTitle.align === "right" ? "end" : "start",
 				font: {
-					size: 22,
+					size: DEFAULT_CHART_FONT_SIZE,
 					weight: chartTitle.bold ? "bold" : "normal",
 					style: chartTitle.italic ? "italic" : "normal"
 				}
@@ -23492,7 +23559,7 @@ var ContentEditableHelper = class {
 		while (!current.done) {
 			if (!current.value.hasChildNodes()) text += current.value.textContent;
 			if (current.value.nodeName === "P" || current.value.nodeName === "DIV" && current.value !== this.el) if (isFirstParagraph) isFirstParagraph = false;
-			else text += "\n";
+			else text += NEWLINE;
 			current = it.next();
 		}
 		return text;
@@ -23719,7 +23786,7 @@ var Composer = class extends Component {
 			if (cellX + ASSISTANT_WIDTH > this.props.delimitation.width) assistantStyle.right = `0px`;
 		} else {
 			assistantStyle["max-height"] = `${this.spreadsheetRect.height - composerRect.bottom - 1}px`;
-			if (composerRect.left + ASSISTANT_WIDTH + 15 + CLOSE_ICON_RADIUS > this.spreadsheetRect.width) assistantStyle.right = `${CLOSE_ICON_RADIUS}px`;
+			if (composerRect.left + ASSISTANT_WIDTH + SCROLLBAR_WIDTH + CLOSE_ICON_RADIUS > this.spreadsheetRect.width) assistantStyle.right = `${CLOSE_ICON_RADIUS}px`;
 		}
 		return assistantStyle;
 	}
@@ -23833,7 +23900,7 @@ var Composer = class extends Component {
 		const start = Math.min(selection.start, selection.end);
 		const end = Math.max(selection.start, selection.end);
 		this.props.composerStore.stopComposerRangeSelection();
-		this.props.composerStore.setCurrentContent(content.slice(0, start) + "\n" + content.slice(end), {
+		this.props.composerStore.setCurrentContent(content.slice(0, start) + NEWLINE + content.slice(end), {
 			start: start + 1,
 			end: start + 1
 		});
@@ -24062,8 +24129,8 @@ var Composer = class extends Component {
 	splitHtmlContentIntoLines(contents) {
 		const contentSplitInLines = [];
 		let currentLine = [];
-		for (const content of contents) if (content.value.includes("\n")) {
-			const lines = content.value.split("\n");
+		for (const content of contents) if (content.value.includes(NEWLINE)) {
+			const lines = content.value.split(NEWLINE);
 			const lastLine = lines.pop();
 			for (const line of lines) {
 				currentLine.push({
@@ -25284,7 +25351,7 @@ var BarChart = class BarChart extends AbstractChart {
 		const definition = this.getDefinition();
 		return {
 			...definition,
-			backgroundColor: toXlsxHexColor(this.background || "#FFFFFF"),
+			backgroundColor: toXlsxHexColor(this.background || BACKGROUND_CHART_COLOR),
 			fontColor: toXlsxHexColor(chartFontColor(this.background)),
 			dataSets,
 			labelRange,
@@ -25374,7 +25441,7 @@ function createBarChartRuntime(chart, getters) {
 			label,
 			data,
 			hidden,
-			borderColor: definition.background || "#FFFFFF",
+			borderColor: definition.background || BACKGROUND_CHART_COLOR,
 			borderWidth: definition.stacked ? 1 : 0,
 			backgroundColor: color
 		};
@@ -25388,7 +25455,7 @@ function createBarChartRuntime(chart, getters) {
 	}
 	if (trendDatasets.length) {
 		const maxLength = Math.max(...trendDatasets.map((trendDataset) => trendDataset.data.length));
-		config.options.scales["x1"] = {
+		config.options.scales[TREND_LINE_XAXIS_ID] = {
 			...xAxis,
 			labels: Array(maxLength).fill(""),
 			offset: false,
@@ -25396,12 +25463,12 @@ function createBarChartRuntime(chart, getters) {
 		};
 		trendDatasets.forEach((x) => config.data.datasets.push(x));
 		config.options.plugins.tooltip.callbacks.title = function(tooltipItems) {
-			return tooltipItems.some((item) => item.dataset.xAxisID !== "x1") ? void 0 : "";
+			return tooltipItems.some((item) => item.dataset.xAxisID !== TREND_LINE_XAXIS_ID) ? void 0 : "";
 		};
 	}
 	return {
 		chartJsConfig: config,
-		background: chart.background || "#FFFFFF"
+		background: chart.background || BACKGROUND_CHART_COLOR
 	};
 }
 
@@ -25688,7 +25755,7 @@ function createLineOrScatterChartRuntime(chart, getters) {
 		config.options.plugins.tooltip.callbacks.label = (tooltipItem) => {
 			let dataSetPoint;
 			let label;
-			if (tooltipItem.dataset.xAxisID === "x1") {
+			if (tooltipItem.dataset.xAxisID === TREND_LINE_XAXIS_ID) {
 				dataSetPoint = dataSetsValues[tooltipItem.datasetIndex].data[tooltipItem.dataIndex].y;
 				label = "";
 			} else {
@@ -25759,23 +25826,23 @@ function createLineOrScatterChartRuntime(chart, getters) {
 		}
 	}
 	if (trendDatasets.length) {
-		config.options.scales["x1"] = {
+		config.options.scales[TREND_LINE_XAXIS_ID] = {
 			...xAxis,
 			display: false
 		};
 		if (axisType === "category" || axisType === "time") {
-			config.options.scales["x1"]["type"] = "category";
-			config.options.scales["x1"]["labels"] = range(0, maxLength).map((x) => x.toString());
-			config.options.scales["x1"]["offset"] = false;
+			config.options.scales[TREND_LINE_XAXIS_ID]["type"] = "category";
+			config.options.scales[TREND_LINE_XAXIS_ID]["labels"] = range(0, maxLength).map((x) => x.toString());
+			config.options.scales[TREND_LINE_XAXIS_ID]["offset"] = false;
 		}
 		trendDatasets.forEach((x) => config.data.datasets.push(x));
 	}
 	config.options.plugins.tooltip.callbacks.title = function(tooltipItems) {
-		return axisType !== "linear" && tooltipItems.some((item) => item.dataset.xAxisID !== "x1") ? void 0 : "";
+		return axisType !== "linear" && tooltipItems.some((item) => item.dataset.xAxisID !== TREND_LINE_XAXIS_ID) ? void 0 : "";
 	};
 	return {
 		chartJsConfig: config,
-		background: chart.background || "#FFFFFF"
+		background: chart.background || BACKGROUND_CHART_COLOR
 	};
 }
 
@@ -25851,7 +25918,7 @@ var ComboChart = class ComboChart extends AbstractChart {
 		const definition = this.getDefinition();
 		return {
 			...definition,
-			backgroundColor: toXlsxHexColor(this.background || "#FFFFFF"),
+			backgroundColor: toXlsxHexColor(this.background || BACKGROUND_CHART_COLOR),
 			fontColor: toXlsxHexColor(chartFontColor(this.background)),
 			dataSets,
 			labelRange,
@@ -25991,19 +26058,19 @@ function createComboChartRuntime(chart, getters) {
 	}
 	if (trendDatasets.length) {
 		const trendLinesMaxLength = Math.max(...trendDatasets.map((trend) => trend.data.length));
-		config.options.scales["x1"] = {
+		config.options.scales[TREND_LINE_XAXIS_ID] = {
 			labels: Array(Math.round(trendLinesMaxLength)).fill(""),
 			offset: false,
 			display: false
 		};
 		trendDatasets.forEach((x) => config.data.datasets.push(x));
 		config.options.plugins.tooltip.callbacks.title = function(tooltipItems) {
-			return tooltipItems.some((item) => item.dataset.xAxisID !== "x1") ? void 0 : "";
+			return tooltipItems.some((item) => item.dataset.xAxisID !== TREND_LINE_XAXIS_ID) ? void 0 : "";
 		};
 	}
 	return {
 		chartJsConfig: config,
-		background: chart.background || "#FFFFFF"
+		background: chart.background || BACKGROUND_CHART_COLOR
 	};
 }
 
@@ -26327,7 +26394,7 @@ var LineChart = class LineChart extends AbstractChart {
 		const definition = this.getDefinition();
 		return {
 			...definition,
-			backgroundColor: toXlsxHexColor(this.background || "#FFFFFF"),
+			backgroundColor: toXlsxHexColor(this.background || BACKGROUND_CHART_COLOR),
 			fontColor: toXlsxHexColor(chartFontColor(this.background)),
 			dataSets,
 			labelRange,
@@ -26424,7 +26491,7 @@ var PieChart = class PieChart extends AbstractChart {
 		const labelRange = toExcelLabelRange(this.getters, this.labelRange, shouldRemoveFirstLabel(this.labelRange, this.dataSets[0], this.dataSetsHaveTitle));
 		return {
 			...this.getDefinition(),
-			backgroundColor: toXlsxHexColor(this.background || "#FFFFFF"),
+			backgroundColor: toXlsxHexColor(this.background || BACKGROUND_CHART_COLOR),
 			fontColor: toXlsxHexColor(chartFontColor(this.background)),
 			dataSets,
 			labelRange
@@ -26528,7 +26595,7 @@ function createPieChartRuntime(chart, getters) {
 	if (chart.isDoughnut) config.type = "doughnut";
 	return {
 		chartJsConfig: config,
-		background: chart.background || "#FFFFFF"
+		background: chart.background || BACKGROUND_CHART_COLOR
 	};
 }
 
@@ -26660,7 +26727,7 @@ function createPyramidChartRuntime(chart, getters) {
 	config.options.plugins.chartShowValuesPlugin.callback = (value, dataset, index) => callback(Math.abs(value), dataset, index);
 	return {
 		chartJsConfig: config,
-		background: chart.background || "#FFFFFF"
+		background: chart.background || BACKGROUND_CHART_COLOR
 	};
 }
 
@@ -26758,7 +26825,7 @@ var ScatterChart = class ScatterChart extends AbstractChart {
 		const definition = this.getDefinition();
 		return {
 			...definition,
-			backgroundColor: toXlsxHexColor(this.background || "#FFFFFF"),
+			backgroundColor: toXlsxHexColor(this.background || BACKGROUND_CHART_COLOR),
 			fontColor: toXlsxHexColor(chartFontColor(this.background)),
 			dataSets,
 			labelRange,
@@ -26907,9 +26974,9 @@ function getWaterfallConfiguration(chart, labels, dataSeriesLabels, localeFormat
 	const { locale, format } = localeFormat;
 	const fontColor = chartFontColor(chart.background);
 	const config = getDefaultChartJsRuntime(chart, labels, fontColor, localeFormat);
-	const negativeColor = chart.negativeValuesColor || "#EA6175";
-	const positiveColor = chart.positiveValuesColor || "#4EA7F2";
-	const subTotalColor = chart.subTotalValuesColor || "#AAAAAA";
+	const negativeColor = chart.negativeValuesColor || CHART_WATERFALL_NEGATIVE_COLOR;
+	const positiveColor = chart.positiveValuesColor || CHART_WATERFALL_POSITIVE_COLOR;
+	const subTotalColor = chart.subTotalValuesColor || CHART_WATERFALL_SUBTOTAL_COLOR;
 	const legend = { labels: { generateLabels: () => {
 		const legendValues = [{
 			text: _t("Positive values"),
@@ -27013,9 +27080,9 @@ function createWaterfallChartRuntime(chart, getters) {
 		locale
 	}, dataSetsValues);
 	config.type = "bar";
-	const negativeColor = chart.negativeValuesColor || "#EA6175";
-	const positiveColor = chart.positiveValuesColor || "#4EA7F2";
-	const subTotalColor = chart.subTotalValuesColor || "#AAAAAA";
+	const negativeColor = chart.negativeValuesColor || CHART_WATERFALL_NEGATIVE_COLOR;
+	const positiveColor = chart.positiveValuesColor || CHART_WATERFALL_POSITIVE_COLOR;
+	const subTotalColor = chart.subTotalValuesColor || CHART_WATERFALL_SUBTOTAL_COLOR;
 	const backgroundColor = [];
 	const datasetValues = [];
 	const dataset = {
@@ -27050,7 +27117,7 @@ function createWaterfallChartRuntime(chart, getters) {
 	config.data.labels = labelsWithSubTotals.map(truncateLabel);
 	return {
 		chartJsConfig: config,
-		background: chart.background || "#FFFFFF"
+		background: chart.background || BACKGROUND_CHART_COLOR
 	};
 }
 
@@ -27779,7 +27846,7 @@ const CSS = css`
     .o-filter-menu-item {
       display: flex;
       box-sizing: border-box;
-      height: ${26}px;
+      height: ${MENU_ITEM_HEIGHT}px;
       padding: 4px 4px 4px 0px;
       cursor: pointer;
       user-select: none;
@@ -28214,7 +28281,7 @@ var LinkDisplay = class extends Component {
 			col,
 			row
 		});
-		const textColor = style?.textColor === "#017E84" ? void 0 : style?.textColor;
+		const textColor = style?.textColor === LINK_COLOR ? void 0 : style?.textColor;
 		this.env.model.dispatch("UPDATE_CELL", {
 			col,
 			row,
@@ -28621,15 +28688,15 @@ var TopRightPopoverContext = class extends PopoverPositionContext {
 css`
   .o-menu {
     background-color: white;
-    padding: ${6}px 0px;
-    width: ${250}px;
+    padding: ${MENU_VERTICAL_PADDING}px 0px;
+    width: ${MENU_WIDTH}px;
     box-sizing: border-box !important;
     user-select: none;
 
     .o-menu-item {
       box-sizing: border-box;
-      height: ${26}px;
-      padding: ${4}px ${11}px;
+      height: ${MENU_ITEM_HEIGHT}px;
+      padding: ${MENU_ITEM_PADDING_VERTICAL}px ${MENU_ITEM_PADDING_HORIZONTAL}px;
       cursor: pointer;
       user-select: none;
 
@@ -28640,8 +28707,8 @@ css`
       .o-menu-item-icon {
         display: inline-block;
         margin: 0px 8px 0px 0px;
-        width: ${26 - 2 * 4}px;
-        line-height: ${26 - 2 * 4}px;
+        width: ${MENU_ITEM_HEIGHT - 2 * MENU_ITEM_PADDING_VERTICAL}px;
+        line-height: ${MENU_ITEM_HEIGHT - 2 * MENU_ITEM_PADDING_VERTICAL}px;
       }
 
       &:not(.disabled) {
@@ -28746,11 +28813,11 @@ var Menu = class Menu extends Component {
 			anchorRect: {
 				x: this.props.position.x,
 				y: this.props.position.y,
-				width: isRoot ? 0 : this.props.width || 250,
-				height: isRoot ? 0 : 26
+				width: isRoot ? 0 : this.props.width || MENU_WIDTH,
+				height: isRoot ? 0 : MENU_ITEM_HEIGHT
 			},
 			positioning: "TopRight",
-			verticalOffset: isRoot ? 0 : 6,
+			verticalOffset: isRoot ? 0 : MENU_VERTICAL_PADDING,
 			onPopoverHidden: () => this.closeSubMenu(),
 			onPopoverMoved: () => this.closeSubMenu()
 		};
@@ -29431,8 +29498,8 @@ const CREATE_CHART = (env) => {
 	const sheetId = getters.getActiveSheetId();
 	if (getZoneArea(env.model.getters.getSelectedZone()) === 1) env.model.selection.selectTableAroundSelection();
 	const size = {
-		width: 536,
-		height: 335
+		width: DEFAULT_FIGURE_WIDTH,
+		height: DEFAULT_FIGURE_HEIGHT
 	};
 	const position = getChartPositionAtCenterOfViewport(getters, size);
 	if (env.model.dispatch("CREATE_CHART", {
@@ -31256,7 +31323,7 @@ function getVisiblePivotCellPositions(getters, pivotId) {
 function drawHighlight(renderingContext, highlight, rect) {
 	const { x, y, width, height } = rect;
 	if (width < 0 || height < 0) return;
-	const color = highlight.color || "#37A850";
+	const color = highlight.color || HIGHLIGHT_COLOR;
 	const { ctx } = renderingContext;
 	ctx.save();
 	if (!highlight.noBorder) {
@@ -31751,8 +31818,8 @@ css`
       -webkit-appearance: none;
       -moz-appearance: none;
       border-radius: 0;
-      width: ${14}px;
-      height: ${14}px;
+      width: ${CHECKBOX_WIDTH}px;
+      height: ${CHECKBOX_WIDTH}px;
       vertical-align: top;
       box-sizing: border-box;
       outline: none;
@@ -32694,7 +32761,7 @@ function dragAndDropBeyondTheViewport(env, cbMouseMove, cbMouseUp, only = false)
 		let { scrollX, scrollY } = getters.getActiveSheetDOMScrollInfo();
 		const { xSplit, ySplit } = getters.getPaneDivisions(sheetId);
 		let canEdgeScroll = false;
-		let timeoutDelay = 140;
+		let timeoutDelay = MAX_DELAY;
 		const x = currentEv.clientX - position.left;
 		colIndex = getters.getColIndex(x);
 		if (only !== "vertical") {
@@ -32860,9 +32927,9 @@ css`
       }
     }
     .o-separator {
-      border-bottom: ${1}px solid ${SEPARATOR_COLOR};
-      margin-top: ${5}px;
-      margin-bottom: ${5}px;
+      border-bottom: ${MENU_SEPARATOR_BORDER_WIDTH}px solid ${SEPARATOR_COLOR};
+      margin-top: ${MENU_SEPARATOR_PADDING}px;
+      margin-bottom: ${MENU_SEPARATOR_PADDING}px;
     }
 
     .o-custom-selector {
@@ -33004,7 +33071,7 @@ var ColorPicker = class extends Component {
 	}
 	get sliderStyle() {
 		const hue = this.state.currentHslaColor?.h || 0;
-		return cssPropertiesToCss({ "margin-left": `${clip(Math.round(hue / 360 * INNER_GRADIENT_WIDTH), 1, INNER_GRADIENT_WIDTH) - 18 / 2}px` });
+		return cssPropertiesToCss({ "margin-left": `${clip(Math.round(hue / 360 * INNER_GRADIENT_WIDTH), 1, INNER_GRADIENT_WIDTH) - ICON_EDGE_LENGTH / 2}px` });
 	}
 	get pointerStyle() {
 		const { s, l } = this.state.currentHslaColor || {
@@ -34129,13 +34196,13 @@ var WaterfallChartDesignPanel = class extends Component {
 		}];
 	}
 	get positiveValuesColor() {
-		return this.props.definition.positiveValuesColor || "#4EA7F2";
+		return this.props.definition.positiveValuesColor || CHART_WATERFALL_POSITIVE_COLOR;
 	}
 	get negativeValuesColor() {
-		return this.props.definition.negativeValuesColor || "#EA6175";
+		return this.props.definition.negativeValuesColor || CHART_WATERFALL_NEGATIVE_COLOR;
 	}
 	get subTotalValuesColor() {
-		return this.props.definition.subTotalValuesColor || "#AAAAAA";
+		return this.props.definition.subTotalValuesColor || CHART_WATERFALL_SUBTOTAL_COLOR;
 	}
 	updateLegendPosition(ev) {
 		this.props.updateChart(this.props.figureId, { legendPosition: ev.target.value });
@@ -35409,8 +35476,8 @@ css`
       height: 50px;
       width: 50px;
       .o-icon {
-        width: ${15}px;
-        height: ${15}px;
+        width: ${CF_ICON_EDGE_LENGTH}px;
+        height: ${CF_ICON_EDGE_LENGTH}px;
       }
     }
     .o-cf-preview-description {
@@ -35588,8 +35655,8 @@ css`
           background-color: ${BADGE_SELECTED_COLOR};
         }
         .o-icon {
-          width: ${15}px;
-          height: ${15}px;
+          width: ${CF_ICON_EDGE_LENGTH}px;
+          height: ${CF_ICON_EDGE_LENGTH}px;
         }
       }
       .o-cf-iconsets {
@@ -35863,7 +35930,7 @@ var ConditionalFormattingEditor = class extends Component {
 	getPreviewGradient() {
 		const rule = this.state.rules.colorScale;
 		const minColor = colorNumberString(rule.minimum.color);
-		const midColor = colorNumberString(rule.midpoint?.color || 11982760);
+		const midColor = colorNumberString(rule.midpoint?.color || DEFAULT_COLOR_SCALE_MIDPOINT_COLOR);
 		const maxColor = colorNumberString(rule.maximum.color);
 		const baseString = "background-image: linear-gradient(to right, ";
 		return rule.midpoint === void 0 ? baseString + minColor + ", " + maxColor + ")" : baseString + minColor + ", " + midColor + ", " + maxColor + ")";
@@ -37862,7 +37929,7 @@ var PivotMeasureDisplayPanelStore = class extends SpreadsheetStore {
 				return {
 					type: measureDisplayType,
 					fieldNameWithGranularity,
-					value: value ?? "(previous)"
+					value: value ?? PREVIOUS_VALUE
 				};
 		}
 	}
@@ -40057,7 +40124,7 @@ var PivotSpreadsheetSidePanel = class extends Component {
 		return this.pivot.isInvalidRange;
 	}
 	get ranges() {
-		if (this.state.range) return [this.state.range];
+		if (this.state.rangeHasChanged) return this.state.range ? [this.state.range] : [];
 		if (this.definition.range) return [this.env.model.getters.getRangeString(this.definition.range, "forceSheetReference")];
 		return [];
 	}
@@ -40072,25 +40139,23 @@ var PivotSpreadsheetSidePanel = class extends Component {
 	}
 	onSelectionChanged(ranges) {
 		this.state.rangeHasChanged = true;
-		if (ranges.length === 0) {
-			this.state.range = void 0;
-			return;
-		}
-		const sheetId = this.env.model.getters.getActiveSheetId();
-		const range = this.env.model.getters.getRangeFromSheetXC(sheetId, ranges[0]);
-		this.state.range = this.env.model.getters.getRangeString(range, "forceSheetReference", { useBoundedReference: true });
+		this.state.range = ranges[0];
 	}
 	onSelectionConfirmed() {
-		if (this.state.range) {
-			const range = this.env.model.getters.getRangeFromSheetXC(this.env.model.getters.getActiveSheetId(), this.state.range);
-			if (range.invalidSheetName || range.invalidXc) return;
-			const dataSet = {
-				sheetId: range.sheetId,
-				zone: range.zone
-			};
-			this.store.update({ dataSet });
-			this.store.applyUpdate();
+		if (!this.state.range) {
+			const pivotRange = this.definition.range;
+			this.state.range = pivotRange ? this.env.model.getters.getRangeString(pivotRange, "forceSheetReference") : void 0;
+			return;
 		}
+		const range = this.env.model.getters.getRangeFromSheetXC(this.env.model.getters.getActiveSheetId(), this.state.range);
+		if (range.invalidSheetName || range.invalidXc) return;
+		this.state.range = this.env.model.getters.getRangeString(range, "forceSheetReference", { useBoundedReference: true });
+		const dataSet = {
+			sheetId: range.sheetId,
+			zone: range.zone
+		};
+		this.store.update({ dataSet });
+		this.store.applyUpdate();
 	}
 	flipAxis() {
 		const { rows, columns } = this.definition;
@@ -40331,7 +40396,7 @@ const SEPARATORS = [
 	},
 	{
 		name: _t("Line Break"),
-		value: "\n"
+		value: NEWLINE
 	}
 ];
 var SplitIntoColumnsPanel = class extends Component {
@@ -41579,7 +41644,7 @@ var FigureComponent = class extends Component {
 	showMenu() {
 		const { x, y, width } = this.menuButtonRect;
 		const menuPosition = {
-			x: x >= 250 ? x - 250 : x + width,
+			x: x >= MENU_WIDTH ? x - MENU_WIDTH : x + width,
 			y
 		};
 		this.openContextMenu(menuPosition);
@@ -41717,8 +41782,8 @@ var ArrayFormulaHighlight = class extends SpreadsheetStore {
 css`
   .o-autofill {
     position: absolute;
-    height: ${8}px;
-    width: ${8}px;
+    height: ${AUTOFILL_EDGE_LENGTH}px;
+    width: ${AUTOFILL_EDGE_LENGTH}px;
     border: 1px solid white;
     box-sizing: border-box !important;
     background-color: #1a73e8;
@@ -41726,8 +41791,8 @@ css`
 
   .o-autofill-handler {
     position: absolute;
-    height: ${8}px;
-    width: ${8}px;
+    height: ${AUTOFILL_EDGE_LENGTH}px;
+    width: ${AUTOFILL_EDGE_LENGTH}px;
     &:hover {
       cursor: crosshair;
     }
@@ -42275,8 +42340,8 @@ var GridComposer = class extends Component {
 //#region src/components/grid_cell_icon/grid_cell_icon.ts
 css`
   .o-grid-cell-icon {
-    width: ${17}px;
-    height: ${17}px;
+    width: ${GRID_ICON_EDGE_LENGTH}px;
+    height: ${GRID_ICON_EDGE_LENGTH}px;
   }
 `;
 var GridCellIcon = class extends Component {
@@ -42308,11 +42373,11 @@ var GridCellIcon = class extends Component {
 		const end = rect.y + rect.height;
 		const cell = this.env.model.getters.getCell(cellPosition);
 		switch (this.props.verticalAlign || cell?.style?.verticalAlign || DEFAULT_VERTICAL_ALIGN) {
-			case "bottom": return end - 2 - 17;
-			case "top": return start + 2;
+			case "bottom": return end - GRID_ICON_MARGIN - GRID_ICON_EDGE_LENGTH;
+			case "top": return start + GRID_ICON_MARGIN;
 			default:
-				const centeringOffset = Math.floor((end - start - 17) / 2);
-				return end - 17 - centeringOffset;
+				const centeringOffset = Math.floor((end - start - GRID_ICON_EDGE_LENGTH) / 2);
+				return end - GRID_ICON_EDGE_LENGTH - centeringOffset;
 		}
 	}
 	getIconHorizontalPosition(rect, cellPosition) {
@@ -42321,11 +42386,11 @@ var GridCellIcon = class extends Component {
 		const cell = this.env.model.getters.getCell(cellPosition);
 		const evaluatedCell = this.env.model.getters.getEvaluatedCell(cellPosition);
 		switch (this.props.horizontalAlign || cell?.style?.align || evaluatedCell.defaultAlign) {
-			case "right": return end - 2 - 17;
-			case "left": return start + 2;
+			case "right": return end - GRID_ICON_MARGIN - GRID_ICON_EDGE_LENGTH;
+			case "left": return start + GRID_ICON_MARGIN;
 			default:
-				const centeringOffset = Math.floor((end - start - 17) / 2);
-				return end - 17 - centeringOffset;
+				const centeringOffset = Math.floor((end - start - GRID_ICON_EDGE_LENGTH) / 2);
+				return end - GRID_ICON_EDGE_LENGTH - centeringOffset;
 		}
 	}
 	isPositionVisible(position) {
@@ -42340,7 +42405,7 @@ css`
   .o-dv-checkbox {
     box-sizing: border-box !important;
     accent-color: #808080;
-    margin: ${(17 - 14) / 2}px;
+    margin: ${(GRID_ICON_EDGE_LENGTH - CHECKBOX_WIDTH) / 2}px;
     /** required to prevent the checkbox position to be sensible to the font-size (affects Firefox) */
     position: absolute;
   }
@@ -42375,8 +42440,8 @@ css`
   .o-dv-list-icon {
     color: ${TEXT_BODY_MUTED};
     border-radius: 1px;
-    height: ${17}px;
-    width: ${17}px;
+    height: ${GRID_ICON_EDGE_LENGTH}px;
+    width: ${GRID_ICON_EDGE_LENGTH}px;
 
     &:hover {
       color: #ffffff;
@@ -42691,19 +42756,19 @@ function getAxis(fig, axisType) {
 			position = fig.y;
 			break;
 		case "bottom":
-			position = fig.y + fig.height - 1;
+			position = fig.y + fig.height - FIGURE_BORDER_WIDTH;
 			break;
 		case "vCenter":
-			position = fig.y + Math.floor(fig.height / 2) - 1;
+			position = fig.y + Math.floor(fig.height / 2) - FIGURE_BORDER_WIDTH;
 			break;
 		case "left":
 			position = fig.x;
 			break;
 		case "right":
-			position = fig.x + fig.width - 1;
+			position = fig.x + fig.width - FIGURE_BORDER_WIDTH;
 			break;
 		case "hCenter":
-			position = fig.x + Math.floor(fig.width / 2) - 1;
+			position = fig.x + Math.floor(fig.width / 2) - FIGURE_BORDER_WIDTH;
 			break;
 	}
 	return {
@@ -42960,7 +43025,7 @@ var FiguresContainer = class extends Component {
 			y
 		};
 		const keepRatio = figureRegistry.get(figure.tag).keepRatio || false;
-		const minFigSize = figureRegistry.get(figure.tag).minFigSize || 80;
+		const minFigSize = figureRegistry.get(figure.tag).minFigSize || MIN_FIG_SIZE;
 		const onMouseMove = (ev) => {
 			const draggedFigure = dragFigureForResize(initialFig, dirX, dirY, {
 				x: ev.clientX,
@@ -43051,8 +43116,8 @@ css`
     display: flex;
     align-items: center;
     justify-content: center;
-    width: ${17}px;
-    height: ${17}px;
+    width: ${GRID_ICON_EDGE_LENGTH}px;
+    height: ${GRID_ICON_EDGE_LENGTH}px;
 
     &:hover {
       background: ${FILTERS_COLOR};
@@ -43679,9 +43744,9 @@ css`
   .o-col-resizer {
     position: absolute;
     top: 0;
-    left: ${48}px;
-    right: ${15}px;
-    height: ${26}px;
+    left: ${HEADER_WIDTH}px;
+    right: ${SCROLLBAR_WIDTH}px;
+    height: ${HEADER_HEIGHT}px;
     &.o-dragging {
       cursor: grabbing;
     }
@@ -43689,14 +43754,14 @@ css`
       cursor: grab;
     }
     .dragging-col-line {
-      top: ${26}px;
+      top: ${HEADER_HEIGHT}px;
       position: absolute;
       width: 2px;
       height: 10000px;
       background-color: black;
     }
     .dragging-col-shadow {
-      top: ${26}px;
+      top: ${HEADER_HEIGHT}px;
       position: absolute;
       height: 10000px;
       background-color: black;
@@ -43704,13 +43769,13 @@ css`
     }
     .o-handle {
       position: absolute;
-      height: ${26}px;
+      height: ${HEADER_HEIGHT}px;
       width: 4px;
       cursor: e-resize;
       background-color: ${SELECTION_BORDER_COLOR};
     }
     .dragging-resizer {
-      top: ${26}px;
+      top: ${HEADER_HEIGHT}px;
       position: absolute;
       margin-left: 2px;
       width: 1px;
@@ -43735,7 +43800,7 @@ var ColResizer = class extends AbstractResizer {
 		this.colResizerRef = useRef("colResizer");
 		this.PADDING = 15;
 		this.MAX_SIZE_MARGIN = 90;
-		this.MIN_ELEMENT_SIZE = 5;
+		this.MIN_ELEMENT_SIZE = MIN_COL_WIDTH;
 	}
 	get sheetId() {
 		return this.env.model.getters.getActiveSheetId();
@@ -43834,10 +43899,10 @@ var ColResizer = class extends AbstractResizer {
 css`
   .o-row-resizer {
     position: absolute;
-    top: ${26}px;
+    top: ${HEADER_HEIGHT}px;
     left: 0;
-    bottom: ${15}px;
-    width: ${48}px;
+    bottom: ${SCROLLBAR_WIDTH}px;
+    width: ${HEADER_WIDTH}px;
     &.o-dragging {
       cursor: grabbing;
     }
@@ -43845,14 +43910,14 @@ css`
       cursor: grab;
     }
     .dragging-row-line {
-      left: ${48}px;
+      left: ${HEADER_WIDTH}px;
       position: absolute;
       width: 10000px;
       height: 2px;
       background-color: black;
     }
     .dragging-row-shadow {
-      left: ${48}px;
+      left: ${HEADER_WIDTH}px;
       position: absolute;
       width: 10000px;
       background-color: black;
@@ -43861,12 +43926,12 @@ css`
     .o-handle {
       position: absolute;
       height: 4px;
-      width: ${48}px;
+      width: ${HEADER_WIDTH}px;
       cursor: n-resize;
       background-color: ${SELECTION_BORDER_COLOR};
     }
     .dragging-resizer {
-      left: ${48}px;
+      left: ${HEADER_WIDTH}px;
       position: absolute;
       margin-top: 2px;
       width: 10000px;
@@ -43890,7 +43955,7 @@ var RowResizer = class extends AbstractResizer {
 		this.rowResizerRef = useRef("rowResizer");
 		this.PADDING = 5;
 		this.MAX_SIZE_MARGIN = 60;
-		this.MIN_ELEMENT_SIZE = 10;
+		this.MIN_ELEMENT_SIZE = MIN_ROW_HEIGHT;
 	}
 	rowResizerRef;
 	get sheetId() {
@@ -43997,8 +44062,8 @@ css`
       top: 0;
       left: 0;
       right: 0;
-      width: ${48}px;
-      height: ${26}px;
+      width: ${HEADER_WIDTH}px;
+      height: ${HEADER_HEIGHT}px;
     }
   }
 `;
@@ -44033,7 +44098,7 @@ var GridRenderer = class {
 	*/
 	getHeaderOffset(dimension, start, index) {
 		let size = this.getters.getColRowOffsetInViewport(dimension, start, index);
-		if (!this.getters.isDashboard()) size += dimension === "ROW" ? 26 : 48;
+		if (!this.getters.isDashboard()) size += dimension === "ROW" ? HEADER_HEIGHT : HEADER_WIDTH;
 		return size;
 	}
 	drawLayer(renderingContext, layer) {
@@ -44215,8 +44280,8 @@ var GridRenderer = class {
 			}
 			ctx.fillStyle = style.textColor || "#000";
 			let x = box.x;
-			if (align === "left") x += 4 + (box.image ? box.image.size + 4 : 0);
-			else if (align === "right") x += box.width - 4 - (box.hasIcon ? 17 + 2 : 0);
+			if (align === "left") x += MIN_CELL_TEXT_MARGIN + (box.image ? box.image.size + MIN_CF_ICON_MARGIN : 0);
+			else if (align === "right") x += box.width - MIN_CELL_TEXT_MARGIN - (box.hasIcon ? GRID_ICON_EDGE_LENGTH + GRID_ICON_MARGIN : 0);
 			else x += box.width / 2;
 			ctx.textAlign = align;
 			if (box.clipRect) {
@@ -44234,7 +44299,7 @@ var GridRenderer = class {
 					x: Math.round(x),
 					y: Math.round(y)
 				}, style.underline, style.strikethrough);
-				y += 4 + textLineHeight;
+				y += MIN_CELL_TEXT_MARGIN + textLineHeight;
 			}
 			if (box.clipRect) ctx.restore();
 		}
@@ -44252,7 +44317,7 @@ var GridRenderer = class {
 			}
 			const iconSize = box.image.size;
 			const y = this.computeTextYCoordinate(box, iconSize);
-			ctx.drawImage(icon, box.x + 4, y, iconSize, iconSize);
+			ctx.drawImage(icon, box.x + MIN_CF_ICON_MARGIN, y, iconSize, iconSize);
 			if (box.image.clipIcon) ctx.restore();
 		}
 	}
@@ -44264,13 +44329,13 @@ var GridRenderer = class {
 	computeTextYCoordinate(box, textLineHeight, numberOfLines = 1) {
 		const y = box.y + 1;
 		const textHeight = computeTextLinesHeight(textLineHeight, numberOfLines);
-		const hasEnoughSpaces = box.height > textHeight + 4 * 2;
+		const hasEnoughSpaces = box.height > textHeight + MIN_CELL_TEXT_MARGIN * 2;
 		const verticalAlign = box.verticalAlign || DEFAULT_VERTICAL_ALIGN;
 		if (hasEnoughSpaces) {
 			if (verticalAlign === "middle") return y + (box.height - textHeight) / 2;
-			if (verticalAlign === "bottom") return y + box.height - textHeight - 4;
+			if (verticalAlign === "bottom") return y + box.height - textHeight - MIN_CELL_TEXT_MARGIN;
 		}
-		return y + 4;
+		return y + MIN_CELL_TEXT_MARGIN;
 	}
 	drawHeaders(renderingContext) {
 		const { ctx, thinLineWidth } = renderingContext;
@@ -44287,7 +44352,7 @@ var GridRenderer = class {
 		const numberOfRows = this.getters.getNumberRows(sheetId);
 		const activeCols = this.getters.getActiveCols();
 		const activeRows = this.getters.getActiveRows();
-		ctx.font = `400 ${11}px ${DEFAULT_FONT}`;
+		ctx.font = `400 ${HEADER_FONT_SIZE}px ${DEFAULT_FONT}`;
 		ctx.textAlign = "center";
 		ctx.textBaseline = "middle";
 		ctx.lineWidth = thinLineWidth;
@@ -44305,7 +44370,7 @@ var GridRenderer = class {
 			if (isColActive) ctx.fillStyle = BACKGROUND_HEADER_ACTIVE_COLOR;
 			else if (isColSelected) ctx.fillStyle = BACKGROUND_HEADER_SELECTED_COLOR;
 			else ctx.fillStyle = BACKGROUND_HEADER_COLOR;
-			ctx.fillRect(x, 0, width, 26);
+			ctx.fillRect(x, 0, width, HEADER_HEIGHT);
 		}
 		for (const row of visibleRows) {
 			const rowZone = {
@@ -44320,13 +44385,13 @@ var GridRenderer = class {
 			if (isRowActive) ctx.fillStyle = BACKGROUND_HEADER_ACTIVE_COLOR;
 			else if (isRowSelected) ctx.fillStyle = BACKGROUND_HEADER_SELECTED_COLOR;
 			else ctx.fillStyle = BACKGROUND_HEADER_COLOR;
-			ctx.fillRect(0, y, 48, height);
+			ctx.fillRect(0, y, HEADER_WIDTH, height);
 		}
 		ctx.beginPath();
-		ctx.moveTo(48, 0);
-		ctx.lineTo(48, height);
-		ctx.moveTo(0, 26);
-		ctx.lineTo(width, 26);
+		ctx.moveTo(HEADER_WIDTH, 0);
+		ctx.lineTo(HEADER_WIDTH, height);
+		ctx.moveTo(0, HEADER_HEIGHT);
+		ctx.lineTo(width, HEADER_HEIGHT);
 		ctx.strokeStyle = HEADER_BORDER_COLOR;
 		ctx.stroke();
 		ctx.beginPath();
@@ -44335,25 +44400,25 @@ var GridRenderer = class {
 			const colName = numberToLetters(col);
 			ctx.fillStyle = activeCols.has(col) ? "#fff" : TEXT_HEADER_COLOR;
 			const colStart = this.getHeaderOffset("COL", left, col);
-			ctx.fillText(colName, colStart + colSize / 2, 26 / 2);
+			ctx.fillText(colName, colStart + colSize / 2, HEADER_HEIGHT / 2);
 			ctx.moveTo(colStart + colSize, 0);
-			ctx.lineTo(colStart + colSize, 26);
+			ctx.lineTo(colStart + colSize, HEADER_HEIGHT);
 		}
 		for (const row of visibleRows) {
 			const rowSize = this.getters.getRowSize(sheetId, row);
 			ctx.fillStyle = activeRows.has(row) ? "#fff" : TEXT_HEADER_COLOR;
 			const rowStart = this.getHeaderOffset("ROW", top, row);
-			ctx.fillText(String(row + 1), 48 / 2, rowStart + rowSize / 2);
+			ctx.fillText(String(row + 1), HEADER_WIDTH / 2, rowStart + rowSize / 2);
 			ctx.moveTo(0, rowStart + rowSize);
-			ctx.lineTo(48, rowStart + rowSize);
+			ctx.lineTo(HEADER_WIDTH, rowStart + rowSize);
 		}
 		ctx.stroke();
 	}
 	drawFrozenPanesHeaders(renderingContext) {
 		const { ctx, thinLineWidth } = renderingContext;
 		const { x: offsetCorrectionX, y: offsetCorrectionY } = this.getters.getMainViewportCoordinates();
-		const widthCorrection = this.getters.isDashboard() ? 0 : 48;
-		const heightCorrection = this.getters.isDashboard() ? 0 : 26;
+		const widthCorrection = this.getters.isDashboard() ? 0 : HEADER_WIDTH;
+		const heightCorrection = this.getters.isDashboard() ? 0 : HEADER_HEIGHT;
 		ctx.lineWidth = 6 * thinLineWidth;
 		ctx.strokeStyle = FROZEN_PANE_HEADER_BORDER_COLOR;
 		ctx.beginPath();
@@ -44381,8 +44446,8 @@ var GridRenderer = class {
 			bottom: visibleRows[visibleRows.length - 1]
 		};
 		const rect = this.getters.getVisibleRect(viewport);
-		const widthCorrection = this.getters.isDashboard() ? 0 : 48;
-		const heightCorrection = this.getters.isDashboard() ? 0 : 26;
+		const widthCorrection = this.getters.isDashboard() ? 0 : HEADER_WIDTH;
+		const heightCorrection = this.getters.isDashboard() ? 0 : HEADER_HEIGHT;
 		ctx.lineWidth = 6 * thinLineWidth;
 		ctx.strokeStyle = FROZEN_PANE_BORDER_COLOR;
 		ctx.beginPath();
@@ -44466,7 +44531,7 @@ var GridRenderer = class {
 		/** Icon */
 		const iconSrc = this.getters.getCellIconSrc(position);
 		const fontSizePX = computeTextFontSizeInPixels(box.style);
-		const iconBoxWidth = iconSrc ? 4 + fontSizePX : 0;
+		const iconBoxWidth = iconSrc ? MIN_CF_ICON_MARGIN + fontSizePX : 0;
 		if (iconSrc) {
 			const imageHtmlElement = loadIconImage(iconSrc);
 			box.image = {
@@ -44484,19 +44549,19 @@ var GridRenderer = class {
 		if (cell.type === "empty" || this.getters.isCellValidCheckbox(position)) return box;
 		/** Filter Header or data validation icon */
 		box.hasIcon = this.getters.doesCellHaveGridIcon(position);
-		const headerIconWidth = box.hasIcon ? 17 + 2 : 0;
+		const headerIconWidth = box.hasIcon ? GRID_ICON_EDGE_LENGTH + GRID_ICON_MARGIN : 0;
 		/** Content */
 		const style = this.getters.getCellComputedStyle(position);
 		const wrapping = style.wrapping || "overflow";
 		const wrapText = wrapping === "wrap" && !showFormula;
-		const maxWidth = width - 2 * 4;
+		const maxWidth = width - 2 * MIN_CELL_TEXT_MARGIN;
 		const formatWidth = style.align ? 0 : maxWidth;
 		const multiLineText = this.getters.getCellMultiLineText(position, {
 			maxWidth,
 			formatWidth,
 			wrapText
 		});
-		const textWidth = Math.max(...multiLineText.map((line) => this.getters.getTextWidth(line, style) + 4));
+		const textWidth = Math.max(...multiLineText.map((line) => this.getters.getTextWidth(line, style) + MIN_CELL_TEXT_MARGIN));
 		const contentWidth = iconBoxWidth + textWidth + headerIconWidth;
 		const align = this.computeCellAlignment(position, contentWidth > width);
 		box.content = {
@@ -44708,7 +44773,7 @@ function useTouchScroll(ref, updateScroll, canMoveUp) {
 		resetTimeout = setTimeout(() => {
 			velocityX = 0;
 			velocityY = 0;
-		}, 100);
+		}, resetTimeoutDuration);
 		updateScroll(deltaX * horizontalScrollFactor, deltaY * verticalScrollFactor);
 	}
 	function onTouchEnd(ev) {
@@ -44739,7 +44804,7 @@ function useTouchScroll(ref, updateScroll, canMoveUp) {
 //#region src/components/helpers/wheel_hook.ts
 function useWheelHandler(handler) {
 	function normalize(val, deltaMode) {
-		return val * (deltaMode === 0 ? 1 : 23);
+		return val * (deltaMode === 0 ? 1 : DEFAULT_CELL_HEIGHT);
 	}
 	const onMouseWheel = (ev) => {
 		handler(normalize(ev.shiftKey && !isMacOS() ? ev.deltaY : ev.deltaX, ev.deltaMode), normalize(ev.shiftKey && !isMacOS() ? ev.deltaX : ev.deltaY, ev.deltaMode));
@@ -44855,8 +44920,8 @@ var Corner = class extends Component {
 		const leftValue = this.isLeft ? rect.x : rect.x + rect.width;
 		const topValue = this.isTop ? rect.y : rect.y + rect.height;
 		return cssPropertiesToCss({
-			left: `${leftValue - 8 / 2}px`,
-			top: `${topValue - 8 / 2}px`,
+			left: `${leftValue - AUTOFILL_EDGE_LENGTH / 2}px`,
+			top: `${topValue - AUTOFILL_EDGE_LENGTH / 2}px`,
 			"background-color": this.props.color
 		});
 	}
@@ -44996,8 +45061,8 @@ css`
     &.corner {
       right: 0px;
       bottom: 0px;
-      height: ${15}px;
-      width: ${15}px;
+      height: ${SCROLLBAR_WIDTH}px;
+      width: ${SCROLLBAR_WIDTH}px;
       border-top: 1px solid #e2e3e3;
       border-left: 1px solid #e2e3e3;
     }
@@ -45090,7 +45155,7 @@ var HorizontalScrollBar = class extends Component {
 		return {
 			left: `${this.props.leftOffset + x}px`,
 			bottom: "0px",
-			height: `${15}px`,
+			height: `${SCROLLBAR_WIDTH}px`,
 			right: `0px`
 		};
 	}
@@ -45136,7 +45201,7 @@ var VerticalScrollBar = class extends Component {
 		return {
 			top: `${this.props.topOffset + y}px`,
 			right: "0px",
-			width: `${15}px`,
+			width: `${SCROLLBAR_WIDTH}px`,
 			bottom: `0px`
 		};
 	}
@@ -45163,7 +45228,7 @@ var SidePanelStore = class extends SpreadsheetStore {
 	];
 	currentPanelProps = {};
 	componentTag = "";
-	panelSize = 350;
+	panelSize = DEFAULT_SIDE_PANEL_SIZE;
 	get isOpen() {
 		if (!this.componentTag) return false;
 		return this.computeState(this.componentTag, this.currentPanelProps).isOpen;
@@ -45194,12 +45259,12 @@ var SidePanelStore = class extends SpreadsheetStore {
 		this.componentTag = "";
 	}
 	changePanelSize(size, spreadsheetElWidth) {
-		if (size < 350) this.panelSize = 350;
-		else if (size > spreadsheetElWidth - 150) this.panelSize = Math.max(spreadsheetElWidth - 150, 350);
+		if (size < DEFAULT_SIDE_PANEL_SIZE) this.panelSize = DEFAULT_SIDE_PANEL_SIZE;
+		else if (size > spreadsheetElWidth - MIN_SHEET_VIEW_WIDTH) this.panelSize = Math.max(spreadsheetElWidth - MIN_SHEET_VIEW_WIDTH, DEFAULT_SIDE_PANEL_SIZE);
 		else this.panelSize = size;
 	}
 	resetPanelSize() {
-		this.panelSize = 350;
+		this.panelSize = DEFAULT_SIDE_PANEL_SIZE;
 	}
 	computeState(componentTag, panelProps) {
 		const customComputeState = sidePanelRegistry.get(componentTag).computeState;
@@ -45315,8 +45380,8 @@ var Grid = class extends Component {
 		HorizontalScrollBar,
 		TableResizer
 	};
-	HEADER_HEIGHT = 26;
-	HEADER_WIDTH = 48;
+	HEADER_HEIGHT = HEADER_HEIGHT;
+	HEADER_WIDTH = HEADER_WIDTH;
 	menuState;
 	gridRef;
 	highlightStore;
@@ -45374,10 +45439,10 @@ var Grid = class extends Component {
 	}
 	get gridOverlayDimensions() {
 		return cssPropertiesToCss({
-			top: `${26}px`,
-			left: `${48}px`,
-			height: `calc(100% - ${26 + 15}px)`,
-			width: `calc(100% - ${48 + 15}px)`
+			top: `${HEADER_HEIGHT}px`,
+			left: `${HEADER_WIDTH}px`,
+			height: `calc(100% - ${HEADER_HEIGHT + SCROLLBAR_WIDTH}px)`,
+			width: `calc(100% - ${HEADER_WIDTH + SCROLLBAR_WIDTH}px)`
 		});
 	}
 	onClosePopover() {
@@ -45550,8 +45615,8 @@ var Grid = class extends Component {
 		const zone = this.env.model.getters.getSelectedZone();
 		const rect = this.env.model.getters.getVisibleRect(zone);
 		return {
-			left: rect.x + rect.width - 8 / 2,
-			top: rect.y + rect.height - 8 / 2
+			left: rect.x + rect.width - AUTOFILL_EDGE_LENGTH / 2,
+			top: rect.y + rect.height - AUTOFILL_EDGE_LENGTH / 2
 		};
 	}
 	get isAutofillVisible() {
@@ -45568,8 +45633,8 @@ var Grid = class extends Component {
 		this.env.model.dispatch("RESIZE_SHEETVIEW", {
 			width,
 			height,
-			gridOffsetX: 48,
-			gridOffsetY: 26
+			gridOffsetX: HEADER_WIDTH,
+			gridOffsetY: HEADER_HEIGHT
 		});
 	}
 	moveCanvas(deltaX, deltaY) {
@@ -47305,8 +47370,8 @@ var ChartPlugin = class extends CorePlugin {
 			case "DUPLICATE_SHEET": {
 				const sheetFiguresFrom = this.getters.getFigures(cmd.sheetId);
 				for (const fig of sheetFiguresFrom) if (fig.tag === "chart") {
-					const figureIdBase = fig.id.split("??").pop();
-					const duplicatedFigureId = `${cmd.sheetIdTo}${"??"}${figureIdBase}`;
+					const figureIdBase = fig.id.split(FIGURE_ID_SPLITTER).pop();
+					const duplicatedFigureId = `${cmd.sheetIdTo}${FIGURE_ID_SPLITTER}${figureIdBase}`;
 					const chart = this.charts[fig.id]?.copyForSheetId(cmd.sheetIdTo);
 					if (chart) this.dispatch("CREATE_CHART", {
 						id: duplicatedFigureId,
@@ -47383,8 +47448,8 @@ var ChartPlugin = class extends CorePlugin {
 		x: 0,
 		y: 0
 	}, size = {
-		width: 536,
-		height: 335
+		width: DEFAULT_FIGURE_WIDTH,
+		height: DEFAULT_FIGURE_HEIGHT
 	}) {
 		if (this.getters.getFigure(sheetId, id)) return;
 		const figure = {
@@ -48026,7 +48091,7 @@ var FigurePlugin = class extends CorePlugin {
 	onRowDeletion(sheetId) {
 		const numHeader = this.getters.getNumberRows(sheetId);
 		let gridHeight = 0;
-		for (let i = 0; i < numHeader; i++) gridHeight += this.getters.getUserRowSize(sheetId, i) || 23;
+		for (let i = 0; i < numHeader; i++) gridHeight += this.getters.getUserRowSize(sheetId, i) || DEFAULT_CELL_HEIGHT;
 		const figures = this.getters.getFigures(sheetId);
 		for (const figure of figures) {
 			const newY = Math.min(figure.y, gridHeight - figure.height);
@@ -48157,7 +48222,7 @@ var HeaderSizePlugin = class extends CorePlugin {
 		}
 	}
 	getColSize(sheetId, index) {
-		return Math.round(this.sizes[sheetId]?.["COL"][index] || 96);
+		return Math.round(this.sizes[sheetId]?.["COL"][index] || DEFAULT_CELL_WIDTH);
 	}
 	getUserRowSize(sheetId, index) {
 		const rowSize = this.sizes[sheetId]?.["ROW"][index];
@@ -48190,7 +48255,7 @@ var HeaderSizePlugin = class extends CorePlugin {
 			if (sheet.rows === void 0) sheet.rows = {};
 			for (const row of range(0, this.getters.getNumberRows(sheet.id))) if (exportDefaults || this.sizes[sheet.id]["ROW"][row]) sheet.rows[row] = {
 				...sheet.rows[row],
-				size: this.getUserRowSize(sheet.id, row) ?? 23
+				size: this.getUserRowSize(sheet.id, row) ?? DEFAULT_CELL_HEIGHT
 			};
 			if (sheet.cols === void 0) sheet.cols = {};
 			for (const col of range(0, this.getters.getNumberCols(sheet.id))) if (exportDefaults || this.sizes[sheet.id]["COL"][col]) sheet.cols[col] = {
@@ -48371,8 +48436,8 @@ var ImagePlugin = class extends CorePlugin {
 			case "DUPLICATE_SHEET": {
 				const sheetFiguresFrom = this.getters.getFigures(cmd.sheetId);
 				for (const fig of sheetFiguresFrom) if (fig.tag === "image") {
-					const figureIdBase = fig.id.split("??").pop();
-					const duplicatedFigureId = `${cmd.sheetIdTo}${"??"}${figureIdBase}`;
+					const figureIdBase = fig.id.split(FIGURE_ID_SPLITTER).pop();
+					const duplicatedFigureId = `${cmd.sheetIdTo}${FIGURE_ID_SPLITTER}${figureIdBase}`;
 					const image = this.getImage(fig.id);
 					if (image) {
 						const size = {
@@ -52679,7 +52744,7 @@ var EvaluationChartPlugin = class extends UIPlugin {
 			col,
 			row
 		});
-		const background = style.fillColor || "#FFFFFF";
+		const background = style.fillColor || BACKGROUND_CHART_COLOR;
 		return {
 			background,
 			fontColor: style.textColor || chartFontColor(background)
@@ -53376,7 +53441,7 @@ var HeaderSizeUIPlugin = class extends UIPlugin {
 		}
 	}
 	getRowSize(sheetId, row) {
-		return Math.round(this.getters.getUserRowSize(sheetId, row) ?? this.tallestCellInRow[sheetId][row]?.size ?? 23);
+		return Math.round(this.getters.getUserRowSize(sheetId, row) ?? this.tallestCellInRow[sheetId][row]?.size ?? DEFAULT_CELL_HEIGHT);
 	}
 	getHeaderSize(sheetId, dimension, index) {
 		if (this.getters.isHeaderHidden(sheetId, dimension, index)) return 0;
@@ -53393,8 +53458,8 @@ var HeaderSizeUIPlugin = class extends UIPlugin {
 			col,
 			row
 		});
-		if (updatedCellHeight <= 23) return;
-		if (!tallestCellInRow && updatedCellHeight > 23 || tallestCellInRow && updatedCellHeight > tallestCellInRow.size) {
+		if (updatedCellHeight <= DEFAULT_CELL_HEIGHT) return;
+		if (!tallestCellInRow && updatedCellHeight > DEFAULT_CELL_HEIGHT || tallestCellInRow && updatedCellHeight > tallestCellInRow.size) {
 			const newTallestCell = {
 				cell: {
 					sheetId,
@@ -53419,7 +53484,7 @@ var HeaderSizeUIPlugin = class extends UIPlugin {
 	* merge, or the height of the cell computed based on its style/content.
 	*/
 	getCellHeight(position) {
-		if (this.isInMultiRowMerge(position)) return 23;
+		if (this.isInMultiRowMerge(position)) return DEFAULT_CELL_HEIGHT;
 		const cell = this.getters.getCell(position);
 		const colSize = this.getters.getColSize(position.sheetId, position.col);
 		return getDefaultCellHeight(this.ctx, cell, this.getters.getLocale(), colSize);
@@ -53441,7 +53506,7 @@ var HeaderSizeUIPlugin = class extends UIPlugin {
 			if (!cell) continue;
 			const position = this.getters.getCellPosition(cell.id);
 			const cellHeight = this.getCellHeight(position);
-			if (cellHeight > maxHeight && cellHeight > 23) {
+			if (cellHeight > maxHeight && cellHeight > DEFAULT_CELL_HEIGHT) {
 				maxHeight = cellHeight;
 				tallestCell = {
 					cell: position,
@@ -53449,7 +53514,7 @@ var HeaderSizeUIPlugin = class extends UIPlugin {
 				};
 			}
 		}
-		if (tallestCell && tallestCell.size > 23) return tallestCell;
+		if (tallestCell && tallestCell.size > DEFAULT_CELL_HEIGHT) return tallestCell;
 	}
 };
 
@@ -53837,7 +53902,7 @@ function pivot_presentation_default(PivotClass) {
 		* @returns the value of the cell in the pivot with the new domain, or "sameValue" if the domain is the same
 		*/
 		getComparisonValue(measure, domain, fieldNameWithGranularity, valueToCompare) {
-			const comparedDomain = valueToCompare === "(previous)" || valueToCompare === "(next)" ? getPreviousOrNextValueDomain(this, domain, fieldNameWithGranularity, valueToCompare) : replaceFieldValueInDomain(domain, fieldNameWithGranularity, valueToCompare);
+			const comparedDomain = valueToCompare === PREVIOUS_VALUE || valueToCompare === NEXT_VALUE ? getPreviousOrNextValueDomain(this, domain, fieldNameWithGranularity, valueToCompare) : replaceFieldValueInDomain(domain, fieldNameWithGranularity, valueToCompare);
 			if (deepEquals(comparedDomain, domain)) return "sameValue";
 			if (!comparedDomain || !isDomainIsInPivot(this, comparedDomain)) throw new NotAvailableError();
 			const comparedValue = this._getPivotCellValueAndFormat(measure.id, comparedDomain);
@@ -55312,7 +55377,7 @@ var Session = class extends EventBus {
 		this.revisions = revisions;
 		this.transportService = transportService;
 		this.serverRevisionId = serverRevisionId;
-		this.debouncedMove = debounce(this._move.bind(this), 200);
+		this.debouncedMove = debounce(this._move.bind(this), DEBOUNCE_TIME);
 	}
 	canApplyOptimisticUpdate() {
 		return !this.waitingUndoRedoAck;
@@ -55329,7 +55394,7 @@ var Session = class extends EventBus {
 		this.trigger("new-local-state-update", { id: revision.id });
 		this.sendUpdateMessage({
 			type: "REMOTE_REVISION",
-			version: 1,
+			version: MESSAGE_VERSION,
 			serverRevisionId: this.serverRevisionId,
 			nextRevisionId: revision.id,
 			clientId: revision.clientId,
@@ -55340,7 +55405,7 @@ var Session = class extends EventBus {
 		this.waitingUndoRedoAck = true;
 		this.sendUpdateMessage({
 			type: "REVISION_UNDONE",
-			version: 1,
+			version: MESSAGE_VERSION,
 			serverRevisionId: this.serverRevisionId,
 			nextRevisionId: this.uuidGenerator.uuidv4(),
 			undoneRevisionId: revisionId
@@ -55350,7 +55415,7 @@ var Session = class extends EventBus {
 		this.waitingUndoRedoAck = true;
 		this.sendUpdateMessage({
 			type: "REVISION_REDONE",
-			version: 1,
+			version: MESSAGE_VERSION,
 			serverRevisionId: this.serverRevisionId,
 			nextRevisionId: this.uuidGenerator.uuidv4(),
 			redoneRevisionId: revisionId
@@ -55393,7 +55458,7 @@ var Session = class extends EventBus {
 		this.transportService.sendMessage({
 			type: "CLIENT_LEFT",
 			clientId: this.clientId,
-			version: 1
+			version: MESSAGE_VERSION
 		});
 	}
 	/**
@@ -55410,7 +55475,7 @@ var Session = class extends EventBus {
 				...data,
 				revisionId: snapshotId
 			},
-			version: 1
+			version: MESSAGE_VERSION
 		});
 	}
 	getClient() {
@@ -55445,7 +55510,7 @@ var Session = class extends EventBus {
 		};
 		this.transportService.sendMessage({
 			type,
-			version: 1,
+			version: MESSAGE_VERSION,
 			client: {
 				...client,
 				position
@@ -55522,7 +55587,7 @@ var Session = class extends EventBus {
 				const { position } = client;
 				if (position) this.transportService.sendMessage({
 					type: "CLIENT_MOVED",
-					version: 1,
+					version: MESSAGE_VERSION,
 					client: {
 						...client,
 						position
@@ -56442,9 +56507,9 @@ var SheetUIPlugin = class extends UIPlugin {
 			contentWidth += Math.max(...multiLineText.map((line) => computeTextWidth(this.ctx, line, style)));
 		}
 		if (this.getters.getCellIconSrc(position)) contentWidth += computeIconWidth(style);
-		if (this.getters.doesCellHaveGridIcon(position)) contentWidth += 18 + 2;
+		if (this.getters.doesCellHaveGridIcon(position)) contentWidth += ICON_EDGE_LENGTH + GRID_ICON_MARGIN;
 		if (contentWidth === 0) return 0;
-		contentWidth += 2 * 4;
+		contentWidth += 2 * PADDING_AUTORESIZE_HORIZONTAL;
 		if (style.wrapping === "wrap") {
 			const colWidth = this.getters.getColSize(position.sheetId, position.col);
 			return Math.min(colWidth, contentWidth);
@@ -56600,11 +56665,11 @@ var SheetUIPlugin = class extends UIPlugin {
 				if (cell.isFormula || this.getters.getArrayFormulaSpreadingOn(position)) {
 					const content = this.getters.getEvaluatedCell(position).formattedValue;
 					const evaluatedSize = getCellContentHeight(this.ctx, content, cell?.style, colSize);
-					if (evaluatedSize > evaluatedRowSize && evaluatedSize > 23) evaluatedRowSize = evaluatedSize;
+					if (evaluatedSize > evaluatedRowSize && evaluatedSize > DEFAULT_CELL_HEIGHT) evaluatedRowSize = evaluatedSize;
 				} else {
 					const content = cell.content;
 					const dynamicRowSize = getCellContentHeight(this.ctx, content, cell?.style, colSize);
-					if (dynamicRowSize >= evaluatedRowSize && dynamicRowSize > 23) evaluatedRowSize = 0;
+					if (dynamicRowSize >= evaluatedRowSize && dynamicRowSize > DEFAULT_CELL_HEIGHT) evaluatedRowSize = 0;
 				}
 			}
 			rowSizes.push(evaluatedRowSize || null);
@@ -57144,7 +57209,7 @@ var HistoryPlugin = class extends UIPlugin {
 	onNewLocalStateUpdate({ id }) {
 		this.undoStack.push(id);
 		this.redoStack = [];
-		if (this.undoStack.length > 99) this.undoStack.shift();
+		if (this.undoStack.length > MAX_HISTORY_STEPS) this.undoStack.shift();
 	}
 	/**
 	* Fetch the last revision which is not empty and not a repeated command
@@ -57239,7 +57304,7 @@ var SplitToColumnsPlugin = class extends UIPlugin {
 	}
 	getAutoSeparatorForString(str) {
 		const separators = [
-			"\n",
+			NEWLINE,
 			";",
 			",",
 			" ",
@@ -57564,7 +57629,7 @@ var ClipboardPlugin = class extends UIPlugin {
 			case "PASTE_FROM_OS_CLIPBOARD": {
 				this._isCutOperation = false;
 				let contentToPaste = cmd.clipboardContent;
-				if (contentToPaste.data?.version !== 22) {
+				if (contentToPaste.data?.version !== CURRENT_VERSION) {
 					contentToPaste = { ...contentToPaste };
 					delete contentToPaste.data;
 				}
@@ -57799,7 +57864,7 @@ var ClipboardPlugin = class extends UIPlugin {
 	}
 	getSheetData() {
 		const data = {
-			version: 22,
+			version: CURRENT_VERSION,
 			clipboardId: this.clipboardId
 		};
 		if (this.copiedData && "figureId" in this.copiedData) return data;
@@ -58522,7 +58587,7 @@ var GridSelectionPlugin = class extends UIPlugin {
 		const toRemove = isBasedBefore ? cmd.elements.map((el) => el + thickness) : cmd.elements;
 		const originalSize = Object.fromEntries(toRemove.map((element) => {
 			const size = isCol ? this.getters.getColSize(cmd.sheetId, element) : this.getters.getUserRowSize(cmd.sheetId, element);
-			return [element, isCol && size === 96 || size === void 0 ? null : size];
+			return [element, isCol && size === DEFAULT_CELL_WIDTH || size === void 0 ? null : size];
 		}));
 		const target = [{
 			left: isCol ? start + deltaCol : 0,
@@ -58737,14 +58802,14 @@ var InternalViewport = class {
 		const topRowSize = this.getters.getRowSize(this.sheetId, topRowIndex);
 		let width = lastColEnd - this.offsetCorrectionX;
 		if (this.canScrollHorizontally) {
-			width += Math.max(96, Math.min(leftColSize, this.viewportWidth - lastColSize));
+			width += Math.max(DEFAULT_CELL_WIDTH, Math.min(leftColSize, this.viewportWidth - lastColSize));
 			width = Math.max(width, this.viewportWidth);
 		}
 		let height = lastRowEnd - this.offsetCorrectionY;
 		if (this.canScrollVertically) {
-			height += Math.max(23 + 5, Math.min(topRowSize, this.viewportHeight - lastRowSize));
+			height += Math.max(DEFAULT_CELL_HEIGHT + 5, Math.min(topRowSize, this.viewportHeight - lastRowSize));
 			height = Math.max(height, this.viewportHeight);
-			if (lastRowEnd + 46 > height && !this.getters.isReadonly()) height += 46;
+			if (lastRowEnd + FOOTER_HEIGHT > height && !this.getters.isReadonly()) height += FOOTER_HEIGHT;
 		}
 		return {
 			width,
@@ -60045,7 +60110,7 @@ css`
   .o-sheet {
     padding: 0 15px;
     padding-right: 10px;
-    height: ${36}px;
+    height: ${BOTTOMBAR_HEIGHT}px;
     border-left: 1px solid #c1c1c1;
     border-right: 1px solid #c1c1c1;
     margin-left: -1px;
@@ -60418,7 +60483,7 @@ const MENU_MAX_HEIGHT = 250;
 css`
   .o-spreadsheet-bottom-bar {
     background-color: ${BACKGROUND_GRAY_COLOR};
-    padding-left: ${48}px;
+    padding-left: ${HEADER_WIDTH}px;
     font-size: 15px;
     border-top: 1px solid lightgrey;
 
@@ -60918,16 +60983,16 @@ var RowGroup = class extends AbstractHeaderGroup {
 		const startCoordinates = this.env.model.getters.getRowDimensions(sheetId, startRow).start;
 		const endCoordinates = this.env.model.getters.getRowDimensions(sheetId, endRow).end;
 		let groupHeaderY = 0;
-		let groupHeaderHeight = 26;
+		let groupHeaderHeight = HEADER_HEIGHT;
 		if (startRow !== 0) {
 			const headerRowDims = this.env.model.getters.getRowDimensions(sheetId, startRow - 1);
-			groupHeaderY = 26 + headerRowDims.start;
+			groupHeaderY = HEADER_HEIGHT + headerRowDims.start;
 			groupHeaderHeight = headerRowDims.end - headerRowDims.start;
 		}
 		const headerRect = {
 			x: this.props.layerOffset,
 			y: groupHeaderY,
-			width: 21,
+			width: GROUP_LAYER_WIDTH,
 			height: groupHeaderHeight
 		};
 		return {
@@ -60935,7 +61000,7 @@ var RowGroup = class extends AbstractHeaderGroup {
 			groupRect: {
 				x: this.props.layerOffset,
 				y: headerRect.y,
-				width: 21,
+				width: GROUP_LAYER_WIDTH,
 				height: headerRect.height + (endCoordinates - startCoordinates)
 			},
 			isEndHidden: this.env.model.getters.isRowHidden(sheetId, endRow)
@@ -60968,17 +61033,17 @@ var ColGroup = class extends AbstractHeaderGroup {
 		const startCoordinates = this.env.model.getters.getColDimensions(sheetId, startCol).start;
 		const endCoordinates = this.env.model.getters.getColDimensions(sheetId, endCol).end;
 		let groupHeaderX = 0;
-		let groupHeaderWidth = 48;
+		let groupHeaderWidth = HEADER_WIDTH;
 		if (startCol !== 0) {
 			const headerRowDims = this.env.model.getters.getColDimensions(sheetId, startCol - 1);
-			groupHeaderX = 48 + headerRowDims.start;
+			groupHeaderX = HEADER_WIDTH + headerRowDims.start;
 			groupHeaderWidth = headerRowDims.end - headerRowDims.start;
 		}
 		const headerRect = {
 			x: groupHeaderX,
 			y: this.props.layerOffset,
 			width: groupHeaderWidth,
-			height: 21
+			height: GROUP_LAYER_WIDTH
 		};
 		return {
 			headerRect,
@@ -60986,7 +61051,7 @@ var ColGroup = class extends AbstractHeaderGroup {
 				x: headerRect.x,
 				y: this.props.layerOffset,
 				width: headerRect.width + (endCoordinates - startCoordinates),
-				height: 21
+				height: GROUP_LAYER_WIDTH
 			},
 			isEndHidden: this.env.model.getters.isColHidden(sheetId, endCol)
 		};
@@ -61033,7 +61098,7 @@ var HeaderGroupContainer = class extends Component {
 		menuItems: []
 	});
 	getLayerOffset(layerIndex) {
-		return layerIndex * 21;
+		return layerIndex * GROUP_LAYER_WIDTH;
 	}
 	onContextMenu(event) {
 		const sheetId = this.env.model.getters.getActiveSheetId();
@@ -61077,8 +61142,8 @@ var HeaderGroupContainer = class extends Component {
 	get frozenPaneContainerSize() {
 		if (!this.hasFrozenPane) return 0;
 		const viewportCoordinates = this.env.model.getters.getMainViewportCoordinates();
-		if (this.props.dimension === "COL") return 48 + viewportCoordinates.x;
-		else return 26 + viewportCoordinates.y;
+		if (this.props.dimension === "COL") return HEADER_WIDTH + viewportCoordinates.x;
+		else return HEADER_HEIGHT + viewportCoordinates.y;
 	}
 };
 
@@ -61597,7 +61662,7 @@ var TopBarComposer = class extends Component {
 			"max-height": `${COMPOSER_MAX_HEIGHT}px`,
 			"line-height": "24px"
 		};
-		style.height = this.focus === "inactive" ? `${34}px` : "fit-content";
+		style.height = this.focus === "inactive" ? `${TOPBAR_TOOLBAR_HEIGHT}px` : "fit-content";
 		return cssPropertiesToCss(style);
 	}
 	get containerStyle() {
@@ -61805,7 +61870,7 @@ css`
 
     /* Toolbar */
     .o-topbar-toolbar {
-      height: ${34}px;
+      height: ${TOPBAR_TOOLBAR_HEIGHT}px;
 
       .o-readonly-toolbar {
         background-color: ${BACKGROUND_HEADER_COLOR};
@@ -62072,9 +62137,9 @@ css`
       direction: ltr;
     }
     .o-separator {
-      border-bottom: ${1}px solid ${SEPARATOR_COLOR};
-      margin-top: ${5}px;
-      margin-bottom: ${5}px;
+      border-bottom: ${MENU_SEPARATOR_BORDER_WIDTH}px solid ${SEPARATOR_COLOR};
+      margin-top: ${MENU_SEPARATOR_PADDING}px;
+      margin-bottom: ${MENU_SEPARATOR_PADDING}px;
     }
     .o-hoverable-button {
       border-radius: 2px;
@@ -62201,8 +62266,8 @@ css`
       &.corner {
         right: 0px;
         bottom: 0px;
-        height: ${15}px;
-        width: ${15}px;
+        height: ${SCROLLBAR_WIDTH}px;
+        width: ${SCROLLBAR_WIDTH}px;
         border-top: 1px solid #e2e3e3;
         border-left: 1px solid #e2e3e3;
       }
@@ -62328,7 +62393,7 @@ var Spreadsheet = class extends Component {
 	getStyle() {
 		const properties = {};
 		if (this.env.isDashboard()) properties["grid-template-rows"] = `auto`;
-		else properties["grid-template-rows"] = `${63}px auto ${36 + 1}px`;
+		else properties["grid-template-rows"] = `${TOPBAR_HEIGHT}px auto ${BOTTOMBAR_HEIGHT + 1}px`;
 		properties["grid-template-columns"] = `auto ${this.sidePanel.panelSize}px`;
 		return cssPropertiesToCss(properties);
 	}
@@ -62405,7 +62470,7 @@ var Spreadsheet = class extends Component {
 	checkViewportSize() {
 		const { xRatio, yRatio } = this.env.model.getters.getFrozenSheetViewRatio(this.env.model.getters.getActiveSheetId());
 		if (!isFinite(xRatio) || !isFinite(yRatio)) return;
-		if (yRatio > .85 || xRatio > .85) {
+		if (yRatio > MAXIMAL_FREEZABLE_RATIO || xRatio > MAXIMAL_FREEZABLE_RATIO) {
 			if (this.isViewportTooSmall) return;
 			this.notificationStore.notifyUser({
 				text: _t("The current window is too small to display this sheet properly. Consider resizing your browser window or adjusting frozen rows and columns."),
@@ -62436,8 +62501,8 @@ var Spreadsheet = class extends Component {
 		return height;
 	}
 	get gridContainerStyle() {
-		const gridColSize = 21 * this.rowLayers.length;
-		const gridRowSize = 21 * this.colLayers.length;
+		const gridColSize = GROUP_LAYER_WIDTH * this.rowLayers.length;
+		const gridRowSize = GROUP_LAYER_WIDTH * this.colLayers.length;
 		return cssPropertiesToCss({
 			"grid-template-columns": `${gridColSize ? gridColSize + 2 : 0}px auto`,
 			"grid-template-rows": `${gridRowSize ? gridRowSize + 2 : 0}px auto`
@@ -63973,7 +64038,7 @@ function createChart(chart, chartSheetIndex, data) {
 		const color = chart.data.title.color ? toXlsxHexColor(chart.data.title.color) : chart.data.fontColor;
 		title = escapeXml`
       <c:title>
-        ${insertText(chart.data.title.text, color, 22, chart.data.title)}
+        ${insertText(chart.data.title.text, color, DEFAULT_CHART_FONT_SIZE, chart.data.title)}
         <c:overlay val="0" />
       </c:title>
     `;
@@ -64057,7 +64122,7 @@ function lineAttributes(params) {
     </a:ln>
   `;
 }
-function insertText(text, fontColor = "000000", fontsize = 22, style = {}) {
+function insertText(text, fontColor = "000000", fontsize = DEFAULT_CHART_FONT_SIZE, style = {}) {
 	return escapeXml`
     <c:tx>
       <c:rich>
@@ -65009,12 +65074,12 @@ function figureCoordinates(headers, position) {
 	let currentPosition = 0;
 	for (const [headerIndex, header] of headers.entries()) if (currentPosition <= position && position < currentPosition + header.size) return {
 		index: headerIndex,
-		offset: convertDotValueToEMU(position - currentPosition + 1)
+		offset: convertDotValueToEMU(position - currentPosition + FIGURE_BORDER_WIDTH)
 	};
 	else if (headerIndex < headers.length - 1) currentPosition += header.size;
 	return {
 		index: headers.length - 1,
-		offset: convertDotValueToEMU(position - currentPosition + 1)
+		offset: convertDotValueToEMU(position - currentPosition + FIGURE_BORDER_WIDTH)
 	};
 }
 function createChartDrawing(figure, sheet, chartRelId) {
@@ -65113,7 +65178,7 @@ function createImageDrawing(figure, sheet, imageRelId) {
 function addNumberFormats(numFmts) {
 	const numFmtNodes = [];
 	for (const [index, numFmt] of Object.entries(numFmts)) {
-		const numFmtAttrs = [["numFmtId", parseInt(index) + 164], ["formatCode", numFmt.format]];
+		const numFmtAttrs = [["numFmtId", parseInt(index) + FIRST_NUMFMT_ID], ["formatCode", numFmt.format]];
 		numFmtNodes.push(escapeXml`
       <numFmt ${formatAttributes(numFmtAttrs)}/>
     `);
@@ -65345,7 +65410,7 @@ function addColumns(cols) {
 		const attributes = [
 			["min", parseInt(id) + 1],
 			["max", parseInt(id) + 1],
-			["width", convertWidthToExcel(col.size || 96)],
+			["width", convertWidthToExcel(col.size || DEFAULT_CELL_WIDTH)],
 			["customWidth", 1],
 			["hidden", col.isHidden ? 1 : 0]
 		];
@@ -65366,7 +65431,7 @@ function addRows(construct, data, sheet) {
 	for (let r = 0; r < sheet.rowNumber; r++) {
 		const rowAttrs = [["r", r + 1]];
 		const row = sheet.rows[r] || {};
-		if (row.size && row.size !== 23) rowAttrs.push(["ht", convertHeightToExcel(row.size)], ["customHeight", 1]);
+		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]);
@@ -65399,7 +65464,7 @@ function addRows(construct, data, sheet) {
 </c>`);
 			}
 		}
-		if (cellNodes.length || row.size !== 23 || row.isHidden || row.outlineLevel || row.collapsed) rowNodes.push(escapeXml`
+		if (cellNodes.length || row.size !== DEFAULT_CELL_HEIGHT || row.isHidden || row.outlineLevel || row.collapsed) rowNodes.push(escapeXml`
         <row ${formatAttributes(rowAttrs)}>
           ${joinXmlNodes(cellNodes)}
         </row>
@@ -65572,7 +65637,7 @@ function createWorksheets(data, construct) {
 	let currentTableIndex = 1;
 	for (const [sheetIndex, sheet] of Object.entries(data.sheets)) {
 		const namespaces = [["xmlns", NAMESPACE["worksheet"]], ["xmlns:r", RELATIONSHIP_NSR]];
-		const sheetFormatAttributes = [["defaultRowHeight", convertHeightToExcel(23)], ["defaultColWidth", convertWidthToExcel(96)]];
+		const sheetFormatAttributes = [["defaultRowHeight", convertHeightToExcel(DEFAULT_CELL_HEIGHT)], ["defaultColWidth", convertWidthToExcel(DEFAULT_CELL_WIDTH)]];
 		const tablesNode = createTablesForSheet(sheet, sheetIndex, currentTableIndex, construct, files);
 		currentTableIndex += sheet.tables.length;
 		let drawingNode = escapeXml``;
@@ -66200,7 +66265,7 @@ var Model = class extends EventBus {
 	exportData() {
 		let data = createEmptyWorkbookData();
 		for (const handler of this.handlers) if (handler instanceof CorePlugin) handler.export(data);
-		data.revisionId = this.session.getRevisionId() || "START_REVISION";
+		data.revisionId = this.session.getRevisionId() || DEFAULT_REVISION_ID;
 		data = deepCopy(data);
 		return data;
 	}
@@ -66244,15 +66309,15 @@ function createCommand(type, payload = {}) {
 */
 const __info__ = {};
 const SPREADSHEET_DIMENSIONS = {
-	MIN_ROW_HEIGHT: 10,
-	MIN_COL_WIDTH: 5,
-	HEADER_HEIGHT: 26,
-	HEADER_WIDTH: 48,
-	TOPBAR_HEIGHT: 63,
-	BOTTOMBAR_HEIGHT: 36,
-	DEFAULT_CELL_WIDTH: 96,
-	DEFAULT_CELL_HEIGHT: 23,
-	SCROLLBAR_WIDTH: 15
+	MIN_ROW_HEIGHT,
+	MIN_COL_WIDTH,
+	HEADER_HEIGHT,
+	HEADER_WIDTH,
+	TOPBAR_HEIGHT,
+	BOTTOMBAR_HEIGHT,
+	DEFAULT_CELL_WIDTH,
+	DEFAULT_CELL_HEIGHT,
+	SCROLLBAR_WIDTH
 };
 const registries = {
 	autoCompleteProviders,
@@ -66337,6 +66402,7 @@ const helpers = {
 	overlap,
 	union,
 	isInside,
+	addStyleToWorkbookData,
 	deepCopy,
 	expandZoneOnInsertion,
 	reduceZoneOnDeletion,
@@ -66444,7 +66510,7 @@ const constants = {
 	DEFAULT_LOCALE,
 	HIGHLIGHT_COLOR,
 	PIVOT_TABLE_CONFIG,
-	TREND_LINE_XAXIS_ID: "x1",
+	TREND_LINE_XAXIS_ID,
 	CHART_AXIS_CHOICES,
 	ChartTerms
 };
@@ -66452,6 +66518,6 @@ const constants = {
 //#endregion
 export { AbstractCellClipboardHandler, AbstractChart, AbstractFigureClipboardHandler, CellErrorType, CommandResult, CorePlugin, DispatchResult, EvaluationError, Model, PivotRuntimeDefinition, Registry, Revision, SPREADSHEET_DIMENSIONS, Spreadsheet, SpreadsheetPivotTable, UIPlugin, __info__, addFunction, addRenderingLayer, astToFormula, compile, compileTokens, components, constants, convertAstNodes, coreTypes, findCellInNewZone, functionCache, helpers, hooks, invalidateCFEvaluationCommands, invalidateDependenciesCommands, invalidateEvaluationCommands, iterateAstNodes, links, load, parse, parseTokens, readonlyAllowedCommands, registries, setDefaultSheetViewSize, setTranslationMethod, stores, tokenColors, tokenize };
 
-__info__.version = "18.0.82";
-__info__.date = "2026-09-10T05:35:40.438Z";
-__info__.hash = "d0329aa";
+__info__.version = "18.0.84";
+__info__.date = "2026-10-14T06:49:38.664Z";
+__info__.hash = "56a1fca";