@odoo/o-spreadsheet 19.1.0-alpha.11 → 19.1.0-alpha.12

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 19.1.0-alpha.11
- * @date 2025-11-03T12:34:28.925Z
- * @hash d9230f3
+ * @version 19.1.0-alpha.12
+ * @date 2025-11-12T14:17:07.713Z
+ * @hash 6fefc9c
  */
 
 import { useEnv, useSubEnv, onWillUnmount, useComponent, status, Component, useRef, onMounted, useEffect, App, blockDom, useState, onPatched, useExternalListener, onWillUpdateProps, onWillStart, onWillPatch, xml, useChildSubEnv, markRaw, toRaw } from '@odoo/owl';
@@ -247,7 +247,7 @@ const DEFAULT_CAROUSEL_TITLE_STYLE = {
     fontSize: CHART_TITLE_FONT_SIZE,
     color: TEXT_BODY,
 };
-const DEFAULT_TOKEN_COLOR = "#000000";
+const DEFAULT_TOKEN_COLOR = "light-dark(#000000, #ffffff)";
 const functionColor = DEFAULT_TOKEN_COLOR;
 const operatorColor = "#3da4ab";
 const tokenColors = {
@@ -1775,7 +1775,10 @@ function isInside(col, row, zone) {
  * Check if a zone is inside another
  */
 function isZoneInside(smallZone, biggerZone) {
-    return isEqual(union(biggerZone, smallZone), biggerZone);
+    return (smallZone.left >= biggerZone.left &&
+        smallZone.right <= biggerZone.right &&
+        smallZone.top >= biggerZone.top &&
+        smallZone.bottom <= biggerZone.bottom);
 }
 function zoneToDimension(zone) {
     return {
@@ -18389,12 +18392,10 @@ const colors = [
     "#00a3a3",
     "#f012be",
     "#3d9970",
-    "#111111",
     "#62A300",
     "#ff4136",
     "#949494",
-    "#85144b",
-    "#001f3f",
+    "#ff5c9d",
 ];
 /*
  * transform a color number (R * 256^2 + G * 256 + B) into classic hex (+alpha) value
@@ -19419,7 +19420,7 @@ function getRangeString(range, forSheetId, getSheetName, options = { useBoundedR
     let sheetName = "";
     if (prefixSheet) {
         if (range.invalidSheetName) {
-            sheetName = range.invalidSheetName;
+            sheetName = getCanonicalSymbolName(range.invalidSheetName);
         }
         else {
             sheetName = getCanonicalSymbolName(getSheetName(range.sheetId));
@@ -22396,7 +22397,7 @@ let ScorecardChart$1 = class ScorecardChart extends AbstractChart {
         return {
             background: context.background,
             type: "scorecard",
-            keyValue: context.range ? context.range[0].dataRange : undefined,
+            keyValue: context.range?.[0]?.dataRange,
             title: context.title || { text: "" },
             baselineMode: DEFAULT_SCORECARD_BASELINE_MODE,
             baselineColorUp: DEFAULT_SCORECARD_BASELINE_COLOR_UP,
@@ -23320,8 +23321,7 @@ function generateMasterChartConfig(chartJsConfig) {
                 .filter((ds) => !isTrendLineAxis(ds["xAxisID"]))
                 .map((ds) => ({
                 ...ds,
-                pointRadius: 0,
-                showLine: true,
+                pointRadius: ds.showLine === false ? 2 : 0, // Show points only for scatter plots
             })),
         },
         options: {
@@ -23884,9 +23884,13 @@ async function canvasToObjectUrl(canvas) {
     if (!blob) {
         return undefined;
     }
-    if (!URL.createObjectURL)
-        throw new Error("URL.createObjectURL is not supported in this environment");
-    return URL.createObjectURL(blob);
+    return new Promise((resolve) => {
+        const f = new FileReader();
+        f.addEventListener("load", () => {
+            resolve(f.result);
+        });
+        f.readAsDataURL(blob);
+    });
 }
 
 /**
@@ -56920,7 +56924,7 @@ class GaugeChart extends AbstractChart {
             background: context.background,
             title: context.title || { text: "" },
             type: "gauge",
-            dataRange: context.range ? context.range[0].dataRange : undefined,
+            dataRange: context.range?.[0]?.dataRange,
             sectionRule: {
                 colors: {
                     lowerColor: DEFAULT_GAUGE_LOWER_COLOR,
@@ -61730,7 +61734,7 @@ class TextValueProvider extends Component {
     }
     getCss(html) {
         return cssPropertiesToCss({
-            color: html.color || "#000000",
+            color: html.color,
             background: html.backgroundColor,
         });
     }
@@ -61885,6 +61889,9 @@ class ContentEditableHelper {
                 const span = document.createElement("span");
                 span.innerText = content.value;
                 span.style.color = content.color || "";
+                if (content.opacity !== undefined && content.opacity !== 1) {
+                    span.style.opacity = content.opacity.toString();
+                }
                 span.addEventListener("mousemove", () => {
                     content.onHover?.(getBoundingRectAsPOJO(span));
                 });
@@ -61980,12 +61987,14 @@ class ContentEditableHelper {
     }
 }
 function compareContentToSpanElement(content, node) {
-    const contentColor = content.color ? toHex(content.color) : "";
-    const nodeColor = node.style?.color ? toHex(node.style.color) : "";
+    const contentColor = content.color || "";
+    const nodeColor = node.style?.color || "";
+    const nodeOpacity = node.style?.opacity || "1";
     const sameColor = contentColor === nodeColor;
     const sameClass = deepEquals$1(content.classes, [...node.classList]);
     const sameContent = node.innerText === content.value;
-    return sameColor && sameClass && sameContent;
+    const sameOpacity = (content.opacity ?? 1).toString() === nodeOpacity;
+    return sameColor && sameClass && sameContent && sameOpacity;
 }
 const doc = new DOMParser();
 const brNode = doc.parseFromString("<br>", "text/html").body.firstChild;
@@ -62591,10 +62600,6 @@ class Composer extends Component {
         const { end, start } = this.props.composerStore.composerSelection;
         for (let index = 0; index < tokens.length; index++) {
             const token = tokens[index];
-            let color = token.color || DEFAULT_TOKEN_COLOR;
-            if (token.isBlurred) {
-                color = setColorAlpha(color, 0.5);
-            }
             const classes = [];
             if (token.type === "REFERENCE" &&
                 this.props.composerStore.tokenAtCursor === token &&
@@ -62612,7 +62617,8 @@ class Composer extends Component {
             }
             result.push({
                 value: token.value,
-                color,
+                color: token.color || DEFAULT_TOKEN_COLOR,
+                opacity: token.isBlurred ? 0.5 : 1,
                 classes,
                 onHover: (rect) => this.onTokenHover(index, rect),
                 onStopHover: () => this.onTokenHover(undefined),
@@ -63169,6 +63175,7 @@ class AbstractComposerStore extends SpreadsheetStore {
         this.highlightStore.register(this);
         this.onDispose(() => {
             this.highlightStore.unRegister(this);
+            this._cancelEdition();
         });
     }
     handleEvent(event) {
@@ -72287,6 +72294,9 @@ class GridRenderer extends SpreadsheetStore {
                 break;
         }
     }
+    finalize() {
+        this.zonesWithPreventedAnimationsInNextFrame = recomputeZones(this.zonesWithPreventedAnimationsInNextFrame);
+    }
     get renderingLayers() {
         return ["Background", "Headers"];
     }
@@ -76890,15 +76900,19 @@ class ConditionalFormattingEditor extends Component {
         this.updateConditionalFormat({ rule: this.state.rules.colorScale });
         this.closeMenus();
     }
-    getPreviewGradient() {
+    getColorScalePreviewStyle() {
         const rule = this.state.rules.colorScale;
         const minColor = colorNumberToHex(rule.minimum.color);
         const midColor = colorNumberToHex(rule.midpoint?.color || DEFAULT_COLOR_SCALE_MIDPOINT_COLOR);
         const maxColor = colorNumberToHex(rule.maximum.color);
-        const baseString = "background-image: linear-gradient(to right, ";
-        return rule.midpoint === undefined
+        const baseString = "linear-gradient(to right, ";
+        const backgroundImage = rule.midpoint === undefined
             ? baseString + minColor + ", " + maxColor + ")"
             : baseString + minColor + ", " + midColor + ", " + maxColor + ")";
+        return cssPropertiesToCss({
+            "background-image": backgroundImage,
+            color: "#000",
+        });
     }
     getThresholdColor(threshold) {
         return threshold
@@ -79244,11 +79258,15 @@ pivotSidePanelRegistry.add("SPREADSHEET", {
 class PivotDesignPanel extends Component {
     static template = "o-spreadsheet-PivotDesignPanel";
     static props = { pivotId: String };
-    static components = { Section, Checkbox };
+    static components = { Section, Checkbox, NumberInput };
     store;
     setup() {
         this.store = useLocalStore(PivotSidePanelStore, this.props.pivotId, "neverDefer");
     }
+    updatePivotStyleNumberProperty(valueStr, key) {
+        const value = parseInt(valueStr);
+        this.store.update({ style: { ...this.pivotStyle, [key]: isNaN(value) ? undefined : value } });
+    }
     updatePivotStyleProperty(key, value) {
         this.store.update({ style: { ...this.pivotStyle, [key]: value } });
     }
@@ -82055,7 +82073,7 @@ autoCompleteProviders.add("dataValidation", {
                 htmlContent: [
                     {
                         value: value.label,
-                        color: color ? chipTextColor(color) : undefined,
+                        color: chipTextColor(color || GRAY_200),
                         backgroundColor: color || GRAY_200,
                         classes: ["badge rounded-pill fs-6 fw-normal w-100 mt-1 text-start"],
                     },
@@ -82739,6 +82757,7 @@ topbarMenuRegistry
     .add("file", {
     name: _t$1("File"),
     sequence: 10,
+    isReadonlyAllowed: true,
 })
     .addChild("settings", ["file"], {
     name: _t$1("Settings"),
@@ -82753,6 +82772,7 @@ topbarMenuRegistry
     .add("edit", {
     name: _t$1("Edit"),
     sequence: 20,
+    isReadonlyAllowed: true,
 })
     .addChild("undo", ["edit"], {
     ...undo,
@@ -82837,6 +82857,7 @@ topbarMenuRegistry
     .add("view", {
     name: _t$1("View"),
     sequence: 30,
+    isReadonlyAllowed: true,
 })
     .addChild("unfreeze_panes", ["view"], {
     ...unFreezePane,
@@ -82933,6 +82954,7 @@ topbarMenuRegistry
     .add("insert", {
     name: _t$1("Insert"),
     sequence: 40,
+    isReadonlyAllowed: true,
 })
     .addChild("insert_row", ["insert"], {
     ...insertRow,
@@ -83044,7 +83066,11 @@ topbarMenuRegistry
     // ---------------------------------------------------------------------
     // FORMAT MENU ITEMS
     // ---------------------------------------------------------------------
-    .add("format", { name: _t$1("Format"), sequence: 50 })
+    .add("format", {
+    name: _t$1("Format"),
+    sequence: 50,
+    isReadonlyAllowed: true,
+})
     .addChild("format_number", ["format"], {
     ...formatNumberMenuItemSpec,
     name: _t$1("Number"),
@@ -83136,6 +83162,7 @@ topbarMenuRegistry
     .add("data", {
     name: _t$1("Data"),
     sequence: 60,
+    isReadonlyAllowed: true,
 })
     .addChild("sort_range", ["data"], {
     ...sortRange,
@@ -85823,6 +85850,7 @@ class Spreadsheet extends Component {
         notifyUser: { type: Function, optional: true },
         raiseError: { type: Function, optional: true },
         askConfirmation: { type: Function, optional: true },
+        colorScheme: { type: String, optional: true },
     };
     static components = {
         TopBar,
@@ -85858,6 +85886,7 @@ class Spreadsheet extends Component {
             : "auto";
         properties["grid-template-columns"] = `auto ${columnWidth}`;
         properties["--os-scrollbar-width"] = `${scrollbarWidth}px`;
+        properties["color-scheme"] = this.props.colorScheme;
         return cssPropertiesToCss(properties);
     }
     setup() {
@@ -86021,6 +86050,12 @@ class Spreadsheet extends Component {
             height: Math.max(gridHeight / zoom - scrollbarWidth, 0),
         };
     }
+    getSpreadSheetClasses() {
+        return [
+            this.env.isSmall ? "o-spreadsheet-mobile" : "",
+            this.props.colorScheme === "dark" ? "dark" : "",
+        ].join(" ");
+    }
 }
 
 class ComboChart extends AbstractChart {
@@ -88468,6 +88503,7 @@ const components = {
     ChartDashboardMenu,
     FullScreenFigure,
     NumberInput,
+    TopBar,
 };
 const hooks = {
     useDragAndDropListItems,
@@ -88517,6 +88553,6 @@ const chartHelpers = { ...CHART_HELPERS, ...CHART_RUNTIME_HELPERS };
 export { AbstractCellClipboardHandler, AbstractChart, AbstractFigureClipboardHandler, CellErrorType$1 as CellErrorType, ClientDisconnectedError, CommandResult, CorePlugin, CoreViewPlugin, DEFAULT_LOCALE, DEFAULT_LOCALES, DispatchResult, EvaluationError, LocalTransportService, Model, PivotRuntimeDefinition, Registry, Revision, SPREADSHEET_DIMENSIONS, Spreadsheet, SpreadsheetPivotTable, UIPlugin, __info__, addFunction, addRenderingLayer, astToFormula, categories, chartHelpers, compile, compileTokens, components, constants, convertAstNodes, coreTypes, createAutocompleteArgumentsProvider, findCellInNewZone, functionCache, getCaretDownSvg, getCaretUpSvg, helpers, hooks, invalidateCFEvaluationCommands, invalidateChartEvaluationCommands, invalidateDependenciesCommands, invalidateEvaluationCommands, iterateAstNodes, links, load, parse, parseTokens, readonlyAllowedCommands, registries, setDefaultSheetViewSize, setTranslationMethod, stores, tokenColors, tokenize };
 
 
-__info__.version = "19.1.0-alpha.11";
-__info__.date = "2025-11-03T12:34:28.925Z";
-__info__.hash = "d9230f3";
+__info__.version = "19.1.0-alpha.12";
+__info__.date = "2025-11-12T14:17:07.713Z";
+__info__.hash = "6fefc9c";

package/dist/o_spreadsheet.iife.js

@@ -2,9 +2,9 @@
 /**
  * This file is generated by o-spreadsheet build tools. Do not edit it.
  * @see https://github.com/odoo/o-spreadsheet
- * @version 19.1.0-alpha.11
- * @date 2025-11-03T12:34:28.925Z
- * @hash d9230f3
+ * @version 19.1.0-alpha.12
+ * @date 2025-11-12T14:17:07.713Z
+ * @hash 6fefc9c
  */
 
 (function (exports, owl) {
@@ -248,7 +248,7 @@
         fontSize: CHART_TITLE_FONT_SIZE,
         color: TEXT_BODY,
     };
-    const DEFAULT_TOKEN_COLOR = "#000000";
+    const DEFAULT_TOKEN_COLOR = "light-dark(#000000, #ffffff)";
     const functionColor = DEFAULT_TOKEN_COLOR;
     const operatorColor = "#3da4ab";
     const tokenColors = {
@@ -1776,7 +1776,10 @@
      * Check if a zone is inside another
      */
     function isZoneInside(smallZone, biggerZone) {
-        return isEqual(union(biggerZone, smallZone), biggerZone);
+        return (smallZone.left >= biggerZone.left &&
+            smallZone.right <= biggerZone.right &&
+            smallZone.top >= biggerZone.top &&
+            smallZone.bottom <= biggerZone.bottom);
     }
     function zoneToDimension(zone) {
         return {
@@ -18390,12 +18393,10 @@ stores.inject(MyMetaStore, storeInstance);
         "#00a3a3",
         "#f012be",
         "#3d9970",
-        "#111111",
         "#62A300",
         "#ff4136",
         "#949494",
-        "#85144b",
-        "#001f3f",
+        "#ff5c9d",
     ];
     /*
      * transform a color number (R * 256^2 + G * 256 + B) into classic hex (+alpha) value
@@ -19420,7 +19421,7 @@ stores.inject(MyMetaStore, storeInstance);
         let sheetName = "";
         if (prefixSheet) {
             if (range.invalidSheetName) {
-                sheetName = range.invalidSheetName;
+                sheetName = getCanonicalSymbolName(range.invalidSheetName);
             }
             else {
                 sheetName = getCanonicalSymbolName(getSheetName(range.sheetId));
@@ -22397,7 +22398,7 @@ stores.inject(MyMetaStore, storeInstance);
             return {
                 background: context.background,
                 type: "scorecard",
-                keyValue: context.range ? context.range[0].dataRange : undefined,
+                keyValue: context.range?.[0]?.dataRange,
                 title: context.title || { text: "" },
                 baselineMode: DEFAULT_SCORECARD_BASELINE_MODE,
                 baselineColorUp: DEFAULT_SCORECARD_BASELINE_COLOR_UP,
@@ -23321,8 +23322,7 @@ stores.inject(MyMetaStore, storeInstance);
                     .filter((ds) => !isTrendLineAxis(ds["xAxisID"]))
                     .map((ds) => ({
                     ...ds,
-                    pointRadius: 0,
-                    showLine: true,
+                    pointRadius: ds.showLine === false ? 2 : 0, // Show points only for scatter plots
                 })),
             },
             options: {
@@ -23885,9 +23885,13 @@ stores.inject(MyMetaStore, storeInstance);
         if (!blob) {
             return undefined;
         }
-        if (!URL.createObjectURL)
-            throw new Error("URL.createObjectURL is not supported in this environment");
-        return URL.createObjectURL(blob);
+        return new Promise((resolve) => {
+            const f = new FileReader();
+            f.addEventListener("load", () => {
+                resolve(f.result);
+            });
+            f.readAsDataURL(blob);
+        });
     }
 
     /**
@@ -56921,7 +56925,7 @@ stores.inject(MyMetaStore, storeInstance);
                 background: context.background,
                 title: context.title || { text: "" },
                 type: "gauge",
-                dataRange: context.range ? context.range[0].dataRange : undefined,
+                dataRange: context.range?.[0]?.dataRange,
                 sectionRule: {
                     colors: {
                         lowerColor: DEFAULT_GAUGE_LOWER_COLOR,
@@ -61731,7 +61735,7 @@ stores.inject(MyMetaStore, storeInstance);
         }
         getCss(html) {
             return cssPropertiesToCss({
-                color: html.color || "#000000",
+                color: html.color,
                 background: html.backgroundColor,
             });
         }
@@ -61886,6 +61890,9 @@ stores.inject(MyMetaStore, storeInstance);
                     const span = document.createElement("span");
                     span.innerText = content.value;
                     span.style.color = content.color || "";
+                    if (content.opacity !== undefined && content.opacity !== 1) {
+                        span.style.opacity = content.opacity.toString();
+                    }
                     span.addEventListener("mousemove", () => {
                         content.onHover?.(getBoundingRectAsPOJO(span));
                     });
@@ -61981,12 +61988,14 @@ stores.inject(MyMetaStore, storeInstance);
         }
     }
     function compareContentToSpanElement(content, node) {
-        const contentColor = content.color ? toHex(content.color) : "";
-        const nodeColor = node.style?.color ? toHex(node.style.color) : "";
+        const contentColor = content.color || "";
+        const nodeColor = node.style?.color || "";
+        const nodeOpacity = node.style?.opacity || "1";
         const sameColor = contentColor === nodeColor;
         const sameClass = deepEquals$1(content.classes, [...node.classList]);
         const sameContent = node.innerText === content.value;
-        return sameColor && sameClass && sameContent;
+        const sameOpacity = (content.opacity ?? 1).toString() === nodeOpacity;
+        return sameColor && sameClass && sameContent && sameOpacity;
     }
     const doc = new DOMParser();
     const brNode = doc.parseFromString("<br>", "text/html").body.firstChild;
@@ -62592,10 +62601,6 @@ stores.inject(MyMetaStore, storeInstance);
             const { end, start } = this.props.composerStore.composerSelection;
             for (let index = 0; index < tokens.length; index++) {
                 const token = tokens[index];
-                let color = token.color || DEFAULT_TOKEN_COLOR;
-                if (token.isBlurred) {
-                    color = setColorAlpha(color, 0.5);
-                }
                 const classes = [];
                 if (token.type === "REFERENCE" &&
                     this.props.composerStore.tokenAtCursor === token &&
@@ -62613,7 +62618,8 @@ stores.inject(MyMetaStore, storeInstance);
                 }
                 result.push({
                     value: token.value,
-                    color,
+                    color: token.color || DEFAULT_TOKEN_COLOR,
+                    opacity: token.isBlurred ? 0.5 : 1,
                     classes,
                     onHover: (rect) => this.onTokenHover(index, rect),
                     onStopHover: () => this.onTokenHover(undefined),
@@ -63170,6 +63176,7 @@ stores.inject(MyMetaStore, storeInstance);
             this.highlightStore.register(this);
             this.onDispose(() => {
                 this.highlightStore.unRegister(this);
+                this._cancelEdition();
             });
         }
         handleEvent(event) {
@@ -72288,6 +72295,9 @@ stores.inject(MyMetaStore, storeInstance);
                     break;
             }
         }
+        finalize() {
+            this.zonesWithPreventedAnimationsInNextFrame = recomputeZones(this.zonesWithPreventedAnimationsInNextFrame);
+        }
         get renderingLayers() {
             return ["Background", "Headers"];
         }
@@ -76891,15 +76901,19 @@ stores.inject(MyMetaStore, storeInstance);
             this.updateConditionalFormat({ rule: this.state.rules.colorScale });
             this.closeMenus();
         }
-        getPreviewGradient() {
+        getColorScalePreviewStyle() {
             const rule = this.state.rules.colorScale;
             const minColor = colorNumberToHex(rule.minimum.color);
             const midColor = colorNumberToHex(rule.midpoint?.color || DEFAULT_COLOR_SCALE_MIDPOINT_COLOR);
             const maxColor = colorNumberToHex(rule.maximum.color);
-            const baseString = "background-image: linear-gradient(to right, ";
-            return rule.midpoint === undefined
+            const baseString = "linear-gradient(to right, ";
+            const backgroundImage = rule.midpoint === undefined
                 ? baseString + minColor + ", " + maxColor + ")"
                 : baseString + minColor + ", " + midColor + ", " + maxColor + ")";
+            return cssPropertiesToCss({
+                "background-image": backgroundImage,
+                color: "#000",
+            });
         }
         getThresholdColor(threshold) {
             return threshold
@@ -79245,11 +79259,15 @@ stores.inject(MyMetaStore, storeInstance);
     class PivotDesignPanel extends owl.Component {
         static template = "o-spreadsheet-PivotDesignPanel";
         static props = { pivotId: String };
-        static components = { Section, Checkbox };
+        static components = { Section, Checkbox, NumberInput };
         store;
         setup() {
             this.store = useLocalStore(PivotSidePanelStore, this.props.pivotId, "neverDefer");
         }
+        updatePivotStyleNumberProperty(valueStr, key) {
+            const value = parseInt(valueStr);
+            this.store.update({ style: { ...this.pivotStyle, [key]: isNaN(value) ? undefined : value } });
+        }
         updatePivotStyleProperty(key, value) {
             this.store.update({ style: { ...this.pivotStyle, [key]: value } });
         }
@@ -82056,7 +82074,7 @@ stores.inject(MyMetaStore, storeInstance);
                     htmlContent: [
                         {
                             value: value.label,
-                            color: color ? chipTextColor(color) : undefined,
+                            color: chipTextColor(color || GRAY_200),
                             backgroundColor: color || GRAY_200,
                             classes: ["badge rounded-pill fs-6 fw-normal w-100 mt-1 text-start"],
                         },
@@ -82740,6 +82758,7 @@ stores.inject(MyMetaStore, storeInstance);
         .add("file", {
         name: _t$1("File"),
         sequence: 10,
+        isReadonlyAllowed: true,
     })
         .addChild("settings", ["file"], {
         name: _t$1("Settings"),
@@ -82754,6 +82773,7 @@ stores.inject(MyMetaStore, storeInstance);
         .add("edit", {
         name: _t$1("Edit"),
         sequence: 20,
+        isReadonlyAllowed: true,
     })
         .addChild("undo", ["edit"], {
         ...undo,
@@ -82838,6 +82858,7 @@ stores.inject(MyMetaStore, storeInstance);
         .add("view", {
         name: _t$1("View"),
         sequence: 30,
+        isReadonlyAllowed: true,
     })
         .addChild("unfreeze_panes", ["view"], {
         ...unFreezePane,
@@ -82934,6 +82955,7 @@ stores.inject(MyMetaStore, storeInstance);
         .add("insert", {
         name: _t$1("Insert"),
         sequence: 40,
+        isReadonlyAllowed: true,
     })
         .addChild("insert_row", ["insert"], {
         ...insertRow,
@@ -83045,7 +83067,11 @@ stores.inject(MyMetaStore, storeInstance);
         // ---------------------------------------------------------------------
         // FORMAT MENU ITEMS
         // ---------------------------------------------------------------------
-        .add("format", { name: _t$1("Format"), sequence: 50 })
+        .add("format", {
+        name: _t$1("Format"),
+        sequence: 50,
+        isReadonlyAllowed: true,
+    })
         .addChild("format_number", ["format"], {
         ...formatNumberMenuItemSpec,
         name: _t$1("Number"),
@@ -83137,6 +83163,7 @@ stores.inject(MyMetaStore, storeInstance);
         .add("data", {
         name: _t$1("Data"),
         sequence: 60,
+        isReadonlyAllowed: true,
     })
         .addChild("sort_range", ["data"], {
         ...sortRange,
@@ -85824,6 +85851,7 @@ stores.inject(MyMetaStore, storeInstance);
             notifyUser: { type: Function, optional: true },
             raiseError: { type: Function, optional: true },
             askConfirmation: { type: Function, optional: true },
+            colorScheme: { type: String, optional: true },
         };
         static components = {
             TopBar,
@@ -85859,6 +85887,7 @@ stores.inject(MyMetaStore, storeInstance);
                 : "auto";
             properties["grid-template-columns"] = `auto ${columnWidth}`;
             properties["--os-scrollbar-width"] = `${scrollbarWidth}px`;
+            properties["color-scheme"] = this.props.colorScheme;
             return cssPropertiesToCss(properties);
         }
         setup() {
@@ -86022,6 +86051,12 @@ stores.inject(MyMetaStore, storeInstance);
                 height: Math.max(gridHeight / zoom - scrollbarWidth, 0),
             };
         }
+        getSpreadSheetClasses() {
+            return [
+                this.env.isSmall ? "o-spreadsheet-mobile" : "",
+                this.props.colorScheme === "dark" ? "dark" : "",
+            ].join(" ");
+        }
     }
 
     class ComboChart extends AbstractChart {
@@ -88469,6 +88504,7 @@ stores.inject(MyMetaStore, storeInstance);
         ChartDashboardMenu,
         FullScreenFigure,
         NumberInput,
+        TopBar,
     };
     const hooks = {
         useDragAndDropListItems,
@@ -88572,9 +88608,9 @@ stores.inject(MyMetaStore, storeInstance);
     exports.tokenize = tokenize;
 
 
-    __info__.version = "19.1.0-alpha.11";
-    __info__.date = "2025-11-03T12:34:28.925Z";
-    __info__.hash = "d9230f3";
+    __info__.version = "19.1.0-alpha.12";
+    __info__.date = "2025-11-12T14:17:07.713Z";
+    __info__.hash = "6fefc9c";
 
 
 })(this.o_spreadsheet = this.o_spreadsheet || {}, owl);