@dxos/plugin-sheet 0.6.14-staging.9e90729 → 0.6.14-staging.c117501

package/dist/lib/node/{chunk-7AWAC3R3.cjs → chunk-OO24XJBV.cjs}

@@ -26,8 +26,8 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var chunk_7AWAC3R3_exports = {};
-__export(chunk_7AWAC3R3_exports, {
+var chunk_OO24XJBV_exports = {};
+__export(chunk_OO24XJBV_exports, {
   ComputeGraphContextProvider: () => ComputeGraphContextProvider,
   GridSheet: () => GridSheet,
   RangeList: () => RangeList,
@@ -38,10 +38,10 @@ __export(chunk_7AWAC3R3_exports, {
   useComputeGraph: () => useComputeGraph,
   useSheetContext: () => useSheetContext
 });
-module.exports = __toCommonJS(chunk_7AWAC3R3_exports);
-var import_chunk_QNFMTK3X = require("./chunk-QNFMTK3X.cjs");
-var import_chunk_V7E5JZBD = require("./chunk-V7E5JZBD.cjs");
-var import_chunk_QIFIGEKV = require("./chunk-QIFIGEKV.cjs");
+module.exports = __toCommonJS(chunk_OO24XJBV_exports);
+var import_chunk_O7XR4R7Y = require("./chunk-O7XR4R7Y.cjs");
+var import_chunk_AWKOWDMI = require("./chunk-AWKOWDMI.cjs");
+var import_chunk_2ZVZI2KJ = require("./chunk-2ZVZI2KJ.cjs");
 var import_react = __toESM(require("react"));
 var import_debug = require("@dxos/debug");
 var import_react_hooks = require("@dxos/react-hooks");
@@ -68,10 +68,10 @@ var import_echo_schema = require("@dxos/echo-schema");
 var import_invariant3 = require("@dxos/invariant");
 var import_keys = require("@dxos/keys");
 var import_log = require("@dxos/log");
-var import_schema = require("@dxos/schema");
 var import_hyperformula = require("#hyperformula");
 var import_react3 = require("react");
 var import_react4 = __toESM(require("react"));
+var import_app_framework = require("@dxos/app-framework");
 var import_react_ui = require("@dxos/react-ui");
 var import_react_ui_attention = require("@dxos/react-ui-attention");
 var import_react_ui_grid2 = require("@dxos/react-ui-grid");
@@ -81,12 +81,13 @@ var import_react_ui_data = require("@dxos/react-ui-data");
 var import_react_ui_grid3 = require("@dxos/react-ui-grid");
 var import_react_ui_theme2 = require("@dxos/react-ui-theme");
 var import_react6 = require("react");
-var import_app_framework = require("@dxos/app-framework");
+var import_app_framework2 = require("@dxos/app-framework");
 var import_async3 = require("@dxos/async");
 var import_echo3 = require("@dxos/react-client/echo");
 var import_react7 = require("react");
 var import_react8 = __toESM(require("react"));
 var import_echo_schema2 = require("@dxos/echo-schema");
+var import_react_ui2 = require("@dxos/react-ui");
 var import_react_ui_list = require("@dxos/react-ui-list");
 var import_react_ui_theme3 = require("@dxos/react-ui-theme");
 var ComputeGraphContext = /* @__PURE__ */ (0, import_react.createContext)(void 0);
@@ -292,7 +293,7 @@ var rangeExtension = ({ onInit, onStateChange }) => {
       });
       if (!activeRange && view2.state.doc.toString()[0] === "=") {
         const str = view2.state.doc.sliceString(1);
-        if (import_chunk_QNFMTK3X.RANGE_NOTATION.test(str)) {
+        if (import_chunk_O7XR4R7Y.RANGE_NOTATION.test(str)) {
           activeRange = {
             from: 1,
             to: str.length + 1
@@ -318,13 +319,32 @@ var visitTree = (node, callback) => {
 };
 var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-sheet/src/model/sheet-model.ts";
 var typeMap = {
-  BOOLEAN: import_schema.FieldValueType.Boolean,
-  NUMBER_RAW: import_schema.FieldValueType.Number,
-  NUMBER_PERCENT: import_schema.FieldValueType.Percent,
-  NUMBER_CURRENCY: import_schema.FieldValueType.Currency,
-  NUMBER_DATETIME: import_schema.FieldValueType.DateTime,
-  NUMBER_DATE: import_schema.FieldValueType.Date,
-  NUMBER_TIME: import_schema.FieldValueType.Time
+  BOOLEAN: {
+    type: import_echo_schema.TypeEnum.Boolean
+  },
+  NUMBER_RAW: {
+    type: import_echo_schema.TypeEnum.Number
+  },
+  NUMBER_PERCENT: {
+    type: import_echo_schema.TypeEnum.Number,
+    format: import_echo_schema.FormatEnum.Percent
+  },
+  NUMBER_CURRENCY: {
+    type: import_echo_schema.TypeEnum.Number,
+    format: import_echo_schema.FormatEnum.Currency
+  },
+  NUMBER_DATETIME: {
+    type: import_echo_schema.TypeEnum.String,
+    format: import_echo_schema.FormatEnum.DateTime
+  },
+  NUMBER_DATE: {
+    type: import_echo_schema.TypeEnum.String,
+    format: import_echo_schema.FormatEnum.Date
+  },
+  NUMBER_TIME: {
+    type: import_echo_schema.TypeEnum.String,
+    format: import_echo_schema.FormatEnum.Time
+  }
 };
 var getTopLeft = (range) => {
   const to = range.to ?? range.from;
@@ -374,12 +394,17 @@ var SheetModel = class extends import_context.Resource {
       id: this.id
     }, {
       F: __dxlog_file,
-      L: 111,
+      L: 113,
       S: this,
       C: (f, a) => f(...a)
     });
-    (0, import_chunk_QNFMTK3X.initialize)(this._sheet);
-    this._node = this._graph.getOrCreateNode((0, import_chunk_QNFMTK3X.createSheetName)({
+    (0, import_chunk_O7XR4R7Y.initialize)(this._sheet);
+    this._graph.update.on((event) => {
+      if (event.type === "functionsUpdated") {
+        this.reset();
+      }
+    });
+    this._node = this._graph.getOrCreateNode((0, import_chunk_O7XR4R7Y.createSheetName)({
       type: (0, import_echo_schema.getTypename)(this._sheet),
       id: this._sheet.id
     }));
@@ -396,7 +421,7 @@ var SheetModel = class extends import_context.Resource {
   reset() {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 131,
+      L: 139,
       S: this,
       A: [
         "this._node",
@@ -407,16 +432,21 @@ var SheetModel = class extends import_context.Resource {
     Object.entries(this._sheet.cells).forEach(([key, { value }]) => {
       (0, import_invariant3.invariant)(this._node, void 0, {
         F: __dxlog_file,
-        L: 134,
+        L: 142,
         S: this,
         A: [
           "this._node",
           ""
         ]
       });
-      const { col, row } = (0, import_chunk_QNFMTK3X.addressFromIndex)(this._sheet, key);
-      if ((0, import_chunk_QNFMTK3X.isFormula)(value)) {
-        value = this._graph.mapFormulaToNative(this._graph.mapFunctionBindingFromId(this.mapFormulaIndicesToRefs(value)));
+      const { col, row } = (0, import_chunk_O7XR4R7Y.addressFromIndex)(this._sheet, key);
+      if ((0, import_chunk_O7XR4R7Y.isFormula)(value)) {
+        const binding = this._graph.mapFunctionBindingFromId(this.mapFormulaIndicesToRefs(value));
+        if (binding) {
+          value = this._graph.mapFormulaToNative(binding);
+        } else {
+          value = "";
+        }
       }
       this._node.graph.hf.setCellContents({
         sheet: this._node.sheetId,
@@ -436,11 +466,79 @@ var SheetModel = class extends import_context.Resource {
     this._node?.graph.hf.rebuildAndRecalculate();
   }
   insertRows(i, n = 1) {
-    (0, import_chunk_QNFMTK3X.insertIndices)(this._sheet.rows, i, n, import_chunk_QNFMTK3X.MAX_ROWS);
+    const idx = (0, import_chunk_O7XR4R7Y.insertIndices)(this._sheet.rows, i, n, import_chunk_O7XR4R7Y.MAX_ROWS);
     this.reset();
+    return idx;
   }
   insertColumns(i, n = 1) {
-    (0, import_chunk_QNFMTK3X.insertIndices)(this._sheet.columns, i, n, import_chunk_QNFMTK3X.MAX_COLUMNS);
+    const idx = (0, import_chunk_O7XR4R7Y.insertIndices)(this._sheet.columns, i, n, import_chunk_O7XR4R7Y.MAX_COLUMNS);
+    this.reset();
+    return idx;
+  }
+  dropRow(rowIndex) {
+    const range = {
+      from: (0, import_chunk_O7XR4R7Y.addressFromIndex)(this._sheet, `${this._sheet.columns[0]}@${rowIndex}`),
+      to: (0, import_chunk_O7XR4R7Y.addressFromIndex)(this._sheet, `${this._sheet.columns[this._sheet.columns.length - 1]}@${rowIndex}`)
+    };
+    const values = this.getCellValues(range).flat();
+    const index = this._sheet.rows.indexOf(rowIndex);
+    this.clear(range);
+    this._sheet.rows.splice(index, 1);
+    delete this._sheet.rowMeta[rowIndex];
+    this.reset();
+    return {
+      axis: "row",
+      index,
+      axisIndex: rowIndex,
+      axisMeta: this._sheet.rowMeta[rowIndex],
+      values
+    };
+  }
+  dropColumn(colIndex) {
+    const range = {
+      from: (0, import_chunk_O7XR4R7Y.addressFromIndex)(this._sheet, `${colIndex}@${this._sheet.rows[0]}`),
+      to: (0, import_chunk_O7XR4R7Y.addressFromIndex)(this._sheet, `${colIndex}@${this._sheet.rows[this._sheet.rows.length - 1]}`)
+    };
+    const values = this.getCellValues(range).flat();
+    const index = this._sheet.columns.indexOf(colIndex);
+    this.clear(range);
+    this._sheet.columns.splice(index, 1);
+    delete this._sheet.columnMeta[colIndex];
+    this.reset();
+    return {
+      axis: "col",
+      index,
+      axisIndex: colIndex,
+      axisMeta: this._sheet.rowMeta[colIndex],
+      values
+    };
+  }
+  restoreRow({ index, axisIndex, axisMeta, values }) {
+    this._sheet.rows.splice(index, 0, axisIndex);
+    values.forEach((value, col) => {
+      if (value) {
+        this._sheet.cells[`${this._sheet.columns[col]}@${axisIndex}`] = {
+          value
+        };
+      }
+    });
+    if (axisMeta) {
+      this._sheet.rowMeta[axisIndex] = axisMeta;
+    }
+    this.reset();
+  }
+  restoreColumn({ index, axisIndex, axisMeta, values }) {
+    this._sheet.columns.splice(index, 0, axisIndex);
+    values.forEach((value, row) => {
+      if (value) {
+        this._sheet.cells[`${axisIndex}@${this._sheet.rows[row]}`] = {
+          value
+        };
+      }
+    });
+    if (axisMeta) {
+      this._sheet.columnMeta[axisIndex] = axisMeta;
+    }
     this.reset();
   }
   //
@@ -453,7 +551,7 @@ var SheetModel = class extends import_context.Resource {
   clear(range) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 176,
+      L: 245,
       S: this,
       A: [
         "this._node",
@@ -464,14 +562,14 @@ var SheetModel = class extends import_context.Resource {
     const values = this._iterRange(range, () => null);
     this._node.graph.hf.setCellContents(toSimpleCellAddress(this._node.sheetId, topLeft), values);
     this._iterRange(range, (cell) => {
-      const idx = (0, import_chunk_QNFMTK3X.addressToIndex)(this._sheet, cell);
+      const idx = (0, import_chunk_O7XR4R7Y.addressToIndex)(this._sheet, cell);
       delete this._sheet.cells[idx];
     });
   }
   cut(range) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 187,
+      L: 256,
       S: this,
       A: [
         "this._node",
@@ -480,14 +578,14 @@ var SheetModel = class extends import_context.Resource {
     });
     this._node.graph.hf.cut(toModelRange(this._node.sheetId, range));
     this._iterRange(range, (cell) => {
-      const idx = (0, import_chunk_QNFMTK3X.addressToIndex)(this._sheet, cell);
+      const idx = (0, import_chunk_O7XR4R7Y.addressToIndex)(this._sheet, cell);
       delete this._sheet.cells[idx];
     });
   }
   copy(range) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 196,
+      L: 265,
       S: this,
       A: [
         "this._node",
@@ -499,7 +597,7 @@ var SheetModel = class extends import_context.Resource {
   paste(cell) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 201,
+      L: 270,
       S: this,
       A: [
         "this._node",
@@ -511,7 +609,7 @@ var SheetModel = class extends import_context.Resource {
       for (const change of changes) {
         if (change instanceof import_hyperformula.ExportedCellChange) {
           const { address, newValue } = change;
-          const idx = (0, import_chunk_QNFMTK3X.addressToIndex)(this._sheet, {
+          const idx = (0, import_chunk_O7XR4R7Y.addressToIndex)(this._sheet, {
             row: address.row,
             col: address.col
           });
@@ -526,7 +624,7 @@ var SheetModel = class extends import_context.Resource {
   undo() {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 216,
+      L: 285,
       S: this,
       A: [
         "this._node",
@@ -540,7 +638,7 @@ var SheetModel = class extends import_context.Resource {
   redo() {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 224,
+      L: 293,
       S: this,
       A: [
         "this._node",
@@ -555,7 +653,7 @@ var SheetModel = class extends import_context.Resource {
   * Get value from sheet.
   */
   getCellValue(cell) {
-    const idx = (0, import_chunk_QNFMTK3X.addressToIndex)(this._sheet, cell);
+    const idx = (0, import_chunk_O7XR4R7Y.addressToIndex)(this._sheet, cell);
     return this._sheet.cells[idx]?.value ?? null;
   }
   /**
@@ -566,7 +664,7 @@ var SheetModel = class extends import_context.Resource {
     if (value == null) {
       return void 0;
     }
-    if ((0, import_chunk_QNFMTK3X.isFormula)(value)) {
+    if ((0, import_chunk_O7XR4R7Y.isFormula)(value)) {
       return this._graph.mapFunctionBindingFromId(this.mapFormulaIndicesToRefs(value));
     } else {
       return String(value);
@@ -584,15 +682,25 @@ var SheetModel = class extends import_context.Resource {
   getValue(cell) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 267,
+      L: 336,
       S: this,
       A: [
         "this._node",
         ""
       ]
     });
-    const value = this._node.graph.hf.getCellValue(toSimpleCellAddress(this._node.sheetId, cell));
+    const address = toSimpleCellAddress(this._node.sheetId, cell);
+    const value = this._node.graph.hf.getCellValue(address);
     if (value instanceof import_hyperformula.DetailedCellError) {
+      import_log.log.info("cell error", {
+        cell,
+        error: value
+      }, {
+        F: __dxlog_file,
+        L: 341,
+        S: this,
+        C: (f, a) => f(...a)
+      });
       return value.toString();
     }
     return value;
@@ -600,10 +708,10 @@ var SheetModel = class extends import_context.Resource {
   /**
   * Get value type.
   */
-  getValueType(cell) {
+  getValueDescription(cell) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 280,
+      L: 352,
       S: this,
       A: [
         "this._node",
@@ -620,7 +728,7 @@ var SheetModel = class extends import_context.Resource {
   setValue(cell, value) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 290,
+      L: 362,
       S: this,
       A: [
         "this._node",
@@ -628,15 +736,15 @@ var SheetModel = class extends import_context.Resource {
       ]
     });
     if (this._options.readonly) {
-      throw new import_chunk_QNFMTK3X.ReadonlyException();
+      throw new import_chunk_O7XR4R7Y.ReadonlyException();
     }
     let refresh = false;
     if (cell.row >= this._sheet.rows.length) {
-      (0, import_chunk_QNFMTK3X.insertIndices)(this._sheet.rows, cell.row, 1, import_chunk_QNFMTK3X.MAX_ROWS);
+      (0, import_chunk_O7XR4R7Y.insertIndices)(this._sheet.rows, cell.row, 1, import_chunk_O7XR4R7Y.MAX_ROWS);
       refresh = true;
     }
     if (cell.col >= this._sheet.columns.length) {
-      (0, import_chunk_QNFMTK3X.insertIndices)(this._sheet.columns, cell.col, 1, import_chunk_QNFMTK3X.MAX_COLUMNS);
+      (0, import_chunk_O7XR4R7Y.insertIndices)(this._sheet.columns, cell.col, 1, import_chunk_O7XR4R7Y.MAX_COLUMNS);
       refresh = true;
     }
     if (refresh) {
@@ -648,14 +756,14 @@ var SheetModel = class extends import_context.Resource {
       col: cell.col
     }, [
       [
-        (0, import_chunk_QNFMTK3X.isFormula)(value) ? this._graph.mapFormulaToNative(value) : value
+        (0, import_chunk_O7XR4R7Y.isFormula)(value) ? this._graph.mapFormulaToNative(value) : value
       ]
     ]);
-    const idx = (0, import_chunk_QNFMTK3X.addressToIndex)(this._sheet, cell);
+    const idx = (0, import_chunk_O7XR4R7Y.addressToIndex)(this._sheet, cell);
     if (value === void 0 || value === null) {
       delete this._sheet.cells[idx];
     } else {
-      if ((0, import_chunk_QNFMTK3X.isFormula)(value)) {
+      if ((0, import_chunk_O7XR4R7Y.isFormula)(value)) {
         value = this._graph.mapFunctionBindingToId(this.mapFormulaRefsToIndices(value));
       }
       this._sheet.cells[idx] = {
@@ -668,7 +776,7 @@ var SheetModel = class extends import_context.Resource {
   */
   setValues(values) {
     Object.entries(values).forEach(([key, { value }]) => {
-      this.setValue((0, import_chunk_QNFMTK3X.addressFromA1Notation)(key), value);
+      this.setValue((0, import_chunk_O7XR4R7Y.addressFromA1Notation)(key), value);
     });
   }
   /**
@@ -715,9 +823,9 @@ var SheetModel = class extends import_context.Resource {
   * Map from A1 notation to indices.
   */
   mapFormulaRefsToIndices(formula) {
-    (0, import_invariant3.invariant)((0, import_chunk_QNFMTK3X.isFormula)(formula), void 0, {
+    (0, import_invariant3.invariant)((0, import_chunk_O7XR4R7Y.isFormula)(formula), void 0, {
       F: __dxlog_file,
-      L: 379,
+      L: 451,
       S: this,
       A: [
         "isFormula(formula)",
@@ -725,16 +833,16 @@ var SheetModel = class extends import_context.Resource {
       ]
     });
     return formula.replace(/([a-zA-Z]+)([0-9]+)/g, (match) => {
-      return (0, import_chunk_QNFMTK3X.addressToIndex)(this._sheet, (0, import_chunk_QNFMTK3X.addressFromA1Notation)(match));
+      return (0, import_chunk_O7XR4R7Y.addressToIndex)(this._sheet, (0, import_chunk_O7XR4R7Y.addressFromA1Notation)(match));
     });
   }
   /**
   * Map from indices to A1 notation.
   */
   mapFormulaIndicesToRefs(formula) {
-    (0, import_invariant3.invariant)((0, import_chunk_QNFMTK3X.isFormula)(formula), void 0, {
+    (0, import_invariant3.invariant)((0, import_chunk_O7XR4R7Y.isFormula)(formula), void 0, {
       F: __dxlog_file,
-      L: 389,
+      L: 461,
       S: this,
       A: [
         "isFormula(formula)",
@@ -742,7 +850,7 @@ var SheetModel = class extends import_context.Resource {
       ]
     });
     return formula.replace(/([a-zA-Z0-9]+)@([a-zA-Z0-9]+)/g, (idx) => {
-      return (0, import_chunk_QNFMTK3X.addressToA1Notation)((0, import_chunk_QNFMTK3X.addressFromIndex)(this._sheet, idx));
+      return (0, import_chunk_O7XR4R7Y.addressToA1Notation)((0, import_chunk_O7XR4R7Y.addressFromIndex)(this._sheet, idx));
     });
   }
   //
@@ -760,7 +868,7 @@ var SheetModel = class extends import_context.Resource {
   toDateTime(num) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 410,
+      L: 482,
       S: this,
       A: [
         "this._node",
@@ -772,7 +880,7 @@ var SheetModel = class extends import_context.Resource {
   toDate(num) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 415,
+      L: 487,
       S: this,
       A: [
         "this._node",
@@ -784,7 +892,7 @@ var SheetModel = class extends import_context.Resource {
   toTime(num) {
     (0, import_invariant3.invariant)(this._node, void 0, {
       F: __dxlog_file,
-      L: 420,
+      L: 492,
       S: this,
       A: [
         "this._node",
@@ -887,26 +995,39 @@ var SheetProvider = ({ children, graph, sheet, readonly, onInfo }) => {
     onInfo
   }, children));
 };
-var RangeList = ({ sheet, onSelect, onDelete }) => {
-  return /* @__PURE__ */ import_react8.default.createElement("div", {
-    className: "flex flex-col"
-  }, /* @__PURE__ */ import_react8.default.createElement(import_react_ui_list.List.Root, {
+var RangeList = ({ sheet }) => {
+  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN);
+  const handleSelectRange = (range) => {
+  };
+  const handleDeleteRange = (0, import_react8.useCallback)((range) => {
+    const index = sheet.ranges.findIndex((sheetRange) => sheetRange === range);
+    sheet.ranges.splice(index, 1);
+  }, [
+    sheet
+  ]);
+  return /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, /* @__PURE__ */ import_react8.default.createElement("h2", {
+    className: "p-2 text-sm font-semibold"
+  }, t("range list heading")), /* @__PURE__ */ import_react8.default.createElement(import_react_ui_list.List.Root, {
     items: sheet.ranges,
-    isItem: import_echo_schema2.S.is(import_chunk_V7E5JZBD.Range)
-  }, ({ items }) => items.map((item, i) => /* @__PURE__ */ import_react8.default.createElement(import_react_ui_list.List.Item, {
+    isItem: import_echo_schema2.S.is(import_chunk_AWKOWDMI.Range)
+  }, ({ items: ranges }) => ranges.map((range, i) => /* @__PURE__ */ import_react8.default.createElement(import_react_ui_list.List.Item, {
     key: i,
-    item,
+    item: range,
     classNames: [
       "p-2",
       import_react_ui_theme3.ghostHover
     ]
   }, /* @__PURE__ */ import_react8.default.createElement(import_react_ui_list.List.ItemDragHandle, null), /* @__PURE__ */ import_react8.default.createElement(import_react_ui_list.List.ItemTitle, {
-    onClick: () => onSelect?.(item)
-  }, (0, import_chunk_QNFMTK3X.rangeToA1Notation)((0, import_chunk_QNFMTK3X.rangeFromIndex)(sheet, item.range))), onDelete && /* @__PURE__ */ import_react8.default.createElement(import_react_ui_list.List.ItemDeleteButton, {
-    onClick: () => onDelete(item)
+    onClick: () => handleSelectRange(range)
+  }, t("range title", {
+    position: (0, import_chunk_O7XR4R7Y.rangeToA1Notation)((0, import_chunk_O7XR4R7Y.rangeFromIndex)(sheet, range.range)),
+    key: t(`range key ${range.key} label`),
+    value: t(`range value ${range.value} label`)
+  })), /* @__PURE__ */ import_react8.default.createElement(import_react_ui_list.List.ItemDeleteButton, {
+    onClick: () => handleDeleteRange(range)
   })))));
 };
-var SheetContainer = (0, import_react7.lazy)(() => import("./SheetContainer-L37HUFCF.cjs"));
+var SheetContainer = (0, import_react7.lazy)(() => import("./SheetContainer-MPFKXY26.cjs"));
 var completeCellRangeToThreadCursor = (range) => {
   return `${range.from.col},${range.from.row},${range.to.col},${range.to.row}`;
 };
@@ -932,13 +1053,13 @@ var useUpdateFocusedCellOnThreadSelection = (grid) => {
   const { model, setActiveRefs } = useSheetContext();
   const handleScrollIntoView = (0, import_react6.useCallback)(({ action, data }) => {
     switch (action) {
-      case import_app_framework.LayoutAction.SCROLL_INTO_VIEW: {
+      case import_app_framework2.LayoutAction.SCROLL_INTO_VIEW: {
         if (!data?.id || data?.cursor === void 0 || data?.id !== (0, import_echo3.fullyQualifiedId)(model.sheet)) {
           return;
         }
         setActiveRefs(data.thread);
         const range = parseThreadAnchorAsCellRange(data.cursor);
-        range && grid.current?.setFocus({
+        range && grid?.setFocus({
           ...range.to,
           plane: "grid"
         }, true);
@@ -948,11 +1069,11 @@ var useUpdateFocusedCellOnThreadSelection = (grid) => {
     model.sheet,
     setActiveRefs
   ]);
-  (0, import_app_framework.useIntentResolver)(import_chunk_QIFIGEKV.SHEET_PLUGIN, handleScrollIntoView);
+  (0, import_app_framework2.useIntentResolver)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN, handleScrollIntoView);
 };
 var useSelectThreadOnCellFocus = () => {
   const { model, cursor } = useSheetContext();
-  const dispatch = (0, import_app_framework.useIntentDispatcher)();
+  const dispatch = (0, import_app_framework2.useIntentDispatcher)();
   const threads = (0, import_react6.useMemo)(() => model.sheet.threads?.filter((thread) => !!thread) ?? [], [
     // TODO(thure): Surely we can find a better dependency for this…
     JSON.stringify(model.sheet.threads)
@@ -964,7 +1085,7 @@ var useSelectThreadOnCellFocus = () => {
     const closestThread = threads?.find(({ anchor }) => {
       if (anchor) {
         const range = parseThreadAnchorAsCellRange(anchor);
-        return range ? (0, import_chunk_QNFMTK3X.inRange)(range, cellAddress) : false;
+        return range ? (0, import_chunk_O7XR4R7Y.inRange)(range, cellAddress) : false;
       } else {
         return false;
       }
@@ -1037,16 +1158,25 @@ var projectCellProps = (model, col, row) => {
     row
   };
   const rawValue = model.getValue(address);
-  const ranges = model.sheet.ranges?.filter(({ range }) => (0, import_chunk_QNFMTK3X.inRange)((0, import_chunk_QNFMTK3X.rangeFromIndex)(model.sheet, range), address));
+  const ranges = model.sheet.ranges?.filter(({ range }) => (0, import_chunk_O7XR4R7Y.inRange)((0, import_chunk_O7XR4R7Y.rangeFromIndex)(model.sheet, range), address));
   const threadRefs = model.sheet.threads?.filter((thread) => {
     const range = thread?.anchor && parseThreadAnchorAsCellRange(thread.anchor);
-    return thread && range ? (0, import_chunk_QNFMTK3X.inRange)(range, address) : false;
+    return thread && range ? (0, import_chunk_O7XR4R7Y.inRange)(range, address) : false;
   }).map((thread) => (0, import_echo2.fullyQualifiedId)(thread)).join(" ");
-  const type = model.getValueType(address);
-  const classNames = ranges?.map(import_chunk_QNFMTK3X.cellClassNameForRange).reverse();
+  const description = model.getValueDescription(address);
+  const type = description?.type;
+  const format = description?.format;
+  const classNames = ranges?.map(import_chunk_O7XR4R7Y.cellClassNameForRange).reverse();
   return {
-    value: (0, import_react_ui_data.parseValue)(type, rawValue),
-    className: (0, import_react_ui_theme2.mx)((0, import_react_ui_data.cellClassesForFieldType)(type), threadRefs && import_react_ui_grid3.commentedClassName, classNames),
+    value: (0, import_react_ui_data.parseValue)({
+      type,
+      format,
+      value: rawValue
+    }),
+    className: (0, import_react_ui_theme2.mx)((0, import_react_ui_data.cellClassesForFieldType)({
+      type,
+      format
+    }), threadRefs && import_react_ui_grid3.commentedClassName, classNames),
     dataRefs: threadRefs
   };
 };
@@ -1069,11 +1199,12 @@ var gridCellGetter = (model) => {
 };
 var rowLabelCell = (row) => ({
   value: (0, import_react_ui_grid3.rowToA1Notation)(row),
-  className: "text-end !pie-1",
+  className: "text-end !pie-1 text-subdued",
   resizeHandle: "row"
 });
 var colLabelCell = (col) => ({
   value: (0, import_react_ui_grid3.colToA1Notation)(col),
+  className: "text-subdued",
   resizeHandle: "col"
 });
 var cellGetter = (model) => {
@@ -1103,23 +1234,28 @@ var cellGetter = (model) => {
     }
   };
 };
-var useSheetModelDxGridProps = (dxGridRef, model) => {
+var useSheetModelDxGridProps = (dxGrid, model) => {
   const [columns, setColumns] = (0, import_react5.useState)(createDxGridColumns(model));
-  const [rows, setRows] = (0, import_react5.useState)(createDxGridColumns(model));
-  (0, import_react5.useLayoutEffect)(() => {
+  const [rows, setRows] = (0, import_react5.useState)(createDxGridRows(model));
+  (0, import_react5.useEffect)(() => {
     const cellsAccessor = (0, import_echo2.createDocAccessor)(model.sheet, [
       "cells"
     ]);
-    if (dxGridRef.current) {
-      dxGridRef.current.getCells = cellGetter(model);
+    if (dxGrid) {
+      dxGrid.getCells = cellGetter(model);
     }
     const handleCellsUpdate = () => {
-      dxGridRef.current?.requestUpdate("initialCells");
+      dxGrid?.requestUpdate("initialCells");
     };
     cellsAccessor.handle.addListener("change", handleCellsUpdate);
-    return () => cellsAccessor.handle.removeListener("change", handleCellsUpdate);
+    const unsubscribe = model.graph.update.on(handleCellsUpdate);
+    return () => {
+      cellsAccessor.handle.removeListener("change", handleCellsUpdate);
+      unsubscribe();
+    };
   }, [
-    model
+    model,
+    dxGrid
   ]);
   (0, import_react5.useEffect)(() => {
     const columnMetaAccessor = (0, import_echo2.createDocAccessor)(model.sheet, [
@@ -1141,7 +1277,8 @@ var useSheetModelDxGridProps = (dxGridRef, model) => {
       rowMetaAccessor.handle.removeListener("change", handleRowMetaUpdate);
     };
   }, [
-    model
+    model,
+    dxGrid
   ]);
   return {
     columns,
@@ -1174,11 +1311,11 @@ var frozen = {
 };
 var sheetRowDefault = {
   frozenRowsStart: {
-    size: 32,
+    size: import_react_ui_grid2.defaultSizeRow,
     readonly: true
   },
   grid: {
-    size: 32,
+    size: import_react_ui_grid2.defaultSizeRow,
     resizeable: true
   }
 };
@@ -1193,52 +1330,60 @@ var sheetColDefault = {
   }
 };
 var GridSheet = () => {
-  const { t } = (0, import_react_ui.useTranslation)(import_chunk_QIFIGEKV.SHEET_PLUGIN);
-  const { id, model, editing, setEditing, setCursor, setRange, cursor, cursorFallbackRange, activeRefs } = useSheetContext();
-  const dxGrid = (0, import_react4.useRef)(null);
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN);
+  const { id, model, editing, setCursor, setRange, cursor, cursorFallbackRange, activeRefs } = useSheetContext();
+  const [dxGrid, setDxGrid] = (0, import_react4.useState)(null);
+  const [extraplanarFocus, setExtraplanarFocus] = (0, import_react4.useState)(null);
+  const dispatch = (0, import_app_framework.useIntentDispatcher)();
   const rangeController = (0, import_react4.useRef)();
   const { hasAttention } = (0, import_react_ui_attention.useAttention)(id);
   const handleFocus = (0, import_react4.useCallback)((event) => {
     if (!editing) {
       const cell = (0, import_react_ui_grid2.closestCell)(event.target);
-      if (cell && cell.plane === "grid") {
-        setCursor({
-          col: cell.col,
-          row: cell.row
-        });
+      if (cell) {
+        if (cell.plane === "grid") {
+          setCursor({
+            col: cell.col,
+            row: cell.row
+          });
+          setExtraplanarFocus(null);
+        } else {
+          setExtraplanarFocus(cell);
+        }
+      } else {
+        setExtraplanarFocus(null);
       }
     }
   }, [
     editing
   ]);
-  const handleClose = (0, import_react4.useCallback)((value, { key, shift }) => {
-    if (value !== void 0) {
-      model.setValue(dxGridCellIndexToSheetCellAddress(editing.index), value);
+  const handleClose = (0, import_react4.useCallback)((_value, event) => {
+    if (event) {
+      const { key, shift } = event;
+      const axis = [
+        "Enter",
+        "ArrowUp",
+        "ArrowDown"
+      ].includes(key) ? "row" : [
+        "Tab",
+        "ArrowLeft",
+        "ArrowRight"
+      ].includes(key) ? "col" : void 0;
+      const delta = key.startsWith("Arrow") ? [
+        "ArrowUp",
+        "ArrowLeft"
+      ].includes(key) ? -1 : 1 : shift ? -1 : 1;
+      dxGrid?.refocus(axis, delta);
     }
-    setEditing(null);
-    const axis = [
-      "Enter",
-      "ArrowUp",
-      "ArrowDown"
-    ].includes(key) ? "row" : [
-      "Tab",
-      "ArrowLeft",
-      "ArrowRight"
-    ].includes(key) ? "col" : void 0;
-    const delta = key.startsWith("Arrow") ? [
-      "ArrowUp",
-      "ArrowLeft"
-    ].includes(key) ? -1 : 1 : shift ? -1 : 1;
-    dxGrid.current?.refocus(axis, delta);
   }, [
     model,
-    editing
+    editing,
+    dxGrid
   ]);
   const handleBlur = (0, import_react4.useCallback)((value) => {
     if (value !== void 0) {
       model.setValue(dxGridCellIndexToSheetCellAddress(editing.index), value);
     }
-    setEditing(null);
   }, [
     model,
     editing
@@ -1270,7 +1415,7 @@ var GridSheet = () => {
       };
     }
     if (editing) {
-      rangeController.current?.setRange((0, import_chunk_QNFMTK3X.rangeToA1Notation)(range));
+      rangeController.current?.setRange((0, import_chunk_O7XR4R7Y.rangeToA1Notation)(range));
     } else {
       setRange(range.to ? range : void 0);
     }
@@ -1284,12 +1429,63 @@ var GridSheet = () => {
   }, [
     hasAttention
   ]);
+  const selectEntireAxis = (0, import_react4.useCallback)((pos) => {
+    switch (pos.plane) {
+      case "frozenRowsStart":
+        return dxGrid?.setSelection({
+          start: {
+            col: pos.col,
+            row: 0,
+            plane: "grid"
+          },
+          end: {
+            col: pos.col,
+            row: model.sheet.rows.length - 1,
+            plane: "grid"
+          }
+        });
+      case "frozenColsStart":
+        return dxGrid?.setSelection({
+          start: {
+            row: pos.row,
+            col: 0,
+            plane: "grid"
+          },
+          end: {
+            row: pos.row,
+            col: model.sheet.columns.length - 1,
+            plane: "grid"
+          }
+        });
+    }
+  }, [
+    dxGrid,
+    model.sheet
+  ]);
+  const handleClick = (0, import_react4.useCallback)((event) => {
+    const cell = (0, import_react_ui_grid2.closestCell)(event.target);
+    if (cell) {
+      selectEntireAxis(cell);
+    }
+  }, [
+    selectEntireAxis
+  ]);
   const handleKeyDown = (0, import_react4.useCallback)((event) => {
     switch (event.key) {
       case "Backspace":
       case "Delete":
         event.preventDefault();
         return cursorFallbackRange && model.clear(cursorFallbackRange);
+      case "Enter":
+      case "Space":
+        if (dxGrid && extraplanarFocus) {
+          switch (extraplanarFocus.plane) {
+            case "frozenRowsStart":
+            case "frozenColsStart":
+              event.preventDefault();
+              return selectEntireAxis(extraplanarFocus);
+          }
+        }
     }
     if (event.metaKey || event.ctrlKey) {
       switch (event.key) {
@@ -1317,7 +1513,9 @@ var GridSheet = () => {
   }, [
     cursorFallbackRange,
     model,
-    cursor
+    cursor,
+    extraplanarFocus,
+    selectEntireAxis
   ]);
   const contextMenuAnchorRef = (0, import_react4.useRef)(null);
   const [contextMenuOpen, setContextMenuOpen] = (0, import_react4.useState)(null);
@@ -1332,16 +1530,32 @@ var GridSheet = () => {
   }, []);
   const handleAxisMenuAction = (0, import_react4.useCallback)((operation) => {
     switch (operation) {
-      case "add-before":
-      case "add-after":
-        model[contextMenuAxis === "col" ? "insertColumns" : "insertRows"](contextMenuOpen[contextMenuAxis] + (operation === "add-before" ? 0 : 1), 1);
+      case "insert-before":
+      case "insert-after":
+        return dispatch({
+          action: import_chunk_AWKOWDMI.SheetAction.INSERT_AXIS,
+          data: {
+            model,
+            axis: contextMenuAxis,
+            index: contextMenuOpen[contextMenuAxis] + (operation === "insert-before" ? 0 : 1)
+          }
+        });
         break;
-      case "remove":
+      case "drop":
+        return dispatch({
+          action: import_chunk_AWKOWDMI.SheetAction.DROP_AXIS,
+          data: {
+            model,
+            axis: contextMenuAxis,
+            axisIndex: model.sheet[contextMenuAxis === "row" ? "rows" : "columns"][contextMenuOpen[contextMenuAxis]]
+          }
+        });
     }
   }, [
     contextMenuAxis,
     contextMenuOpen,
-    model
+    model,
+    dispatch
   ]);
   const { columns, rows } = useSheetModelDxGridProps(dxGrid, model);
   const extension = (0, import_react4.useMemo)(() => [
@@ -1357,8 +1571,8 @@ var GridSheet = () => {
     rangeExtension({
       onInit: (fn) => rangeController.current = fn,
       onStateChange: (state) => {
-        if (dxGrid.current) {
-          dxGrid.current.mode = typeof state.activeRange === "undefined" ? "edit" : "edit-select";
+        if (dxGrid) {
+          dxGrid.mode = typeof state.activeRange === "undefined" ? "edit" : "edit-select";
         }
       }
     })
@@ -1381,8 +1595,8 @@ var GridSheet = () => {
     onBlur: handleBlur
   }), /* @__PURE__ */ import_react4.default.createElement(import_react_ui_grid2.Grid.Content, {
     initialCells,
-    limitColumns: import_chunk_QNFMTK3X.DEFAULT_COLUMNS,
-    limitRows: import_chunk_QNFMTK3X.DEFAULT_ROWS,
+    limitColumns: import_chunk_O7XR4R7Y.DEFAULT_COLUMNS,
+    limitRows: import_chunk_O7XR4R7Y.DEFAULT_ROWS,
     columns,
     rows,
     onAxisResize: handleAxisResize,
@@ -1394,10 +1608,11 @@ var GridSheet = () => {
     onWheelCapture: handleWheel,
     onKeyDown: handleKeyDown,
     onContextMenu: handleContextMenu,
-    overscroll: "inline",
-    className: "[--dx-grid-base:var(--surface-bg)]",
+    onClick: handleClick,
+    overscroll: "trap",
+    className: "[--dx-grid-base:var(--surface-bg)] [&_.dx-grid]:border-bs [&_.dx-grid]:border-separator",
     activeRefs,
-    ref: dxGrid
+    ref: setDxGrid
   }), /* @__PURE__ */ import_react4.default.createElement(import_react_ui.DropdownMenu.Root, {
     modal: false,
     open: !!contextMenuOpen,
@@ -1409,18 +1624,17 @@ var GridSheet = () => {
     sideOffset: 4,
     collisionPadding: 8
   }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui.DropdownMenu.Viewport, null, /* @__PURE__ */ import_react4.default.createElement(import_react_ui.DropdownMenu.Item, {
-    onClick: () => handleAxisMenuAction("add-before")
+    onClick: () => handleAxisMenuAction("insert-before")
   }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui.Icon, {
     size: 5,
     icon: contextMenuAxis === "col" ? "ph--columns-plus-left--regular" : "ph--rows-plus-top--regular"
   }), /* @__PURE__ */ import_react4.default.createElement("span", null, t(`add ${contextMenuAxis} before label`))), /* @__PURE__ */ import_react4.default.createElement(import_react_ui.DropdownMenu.Item, {
-    onClick: () => handleAxisMenuAction("add-after")
+    onClick: () => handleAxisMenuAction("insert-after")
   }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui.Icon, {
     size: 5,
     icon: contextMenuAxis === "col" ? "ph--columns-plus-right--regular" : "ph--rows-plus-bottom--regular"
   }), /* @__PURE__ */ import_react4.default.createElement("span", null, t(`add ${contextMenuAxis} after label`))), /* @__PURE__ */ import_react4.default.createElement(import_react_ui.DropdownMenu.Item, {
-    disabled: true,
-    onClick: () => handleAxisMenuAction("remove")
+    onClick: () => handleAxisMenuAction("drop")
   }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui.Icon, {
     size: 5,
     icon: "ph--backspace--regular"
@@ -1438,4 +1652,4 @@ var GridSheet = () => {
   useComputeGraph,
   useSheetContext
 });
-//# sourceMappingURL=chunk-7AWAC3R3.cjs.map
+//# sourceMappingURL=chunk-OO24XJBV.cjs.map