@dxos/plugin-sheet 0.7.5-main.9d26e3a → 0.7.5-main.9d2a38b

package/dist/lib/node/{chunk-FDEQ2PGJ.cjs → chunk-ZPWW4LPY.cjs}

@@ -26,71 +26,53 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var chunk_FDEQ2PGJ_exports = {};
-__export(chunk_FDEQ2PGJ_exports, {
+var chunk_ZPWW4LPY_exports = {};
+__export(chunk_ZPWW4LPY_exports, {
   ComputeGraphContextProvider: () => ComputeGraphContextProvider,
   GridSheet: () => GridSheet,
+  RangeList: () => RangeList,
   SheetContainer: () => SheetContainer,
-  SheetObjectSettings: () => SheetObjectSettings,
   SheetProvider: () => SheetProvider,
   completeCellRangeToThreadCursor: () => completeCellRangeToThreadCursor,
-  computeGraphFacet: () => computeGraphFacet,
   useComputeGraph: () => useComputeGraph,
   useSheetContext: () => useSheetContext
 });
-module.exports = __toCommonJS(chunk_FDEQ2PGJ_exports);
-var import_chunk_TQOJ7DG2 = require("./chunk-TQOJ7DG2.cjs");
-var import_chunk_2ZVZI2KJ = require("./chunk-2ZVZI2KJ.cjs");
+module.exports = __toCommonJS(chunk_ZPWW4LPY_exports);
+var import_chunk_E3RXOEL6 = require("./chunk-E3RXOEL6.cjs");
+var import_chunk_P4KSGZSS = require("./chunk-P4KSGZSS.cjs");
+var import_chunk_NLDXUFDG = require("./chunk-NLDXUFDG.cjs");
 var import_react = __toESM(require("react"));
 var import_debug = require("@dxos/debug");
 var import_react_hooks = require("@dxos/react-hooks");
-var import_language = require("@codemirror/language");
-var import_state = require("@codemirror/state");
-var import_view = require("@codemirror/view");
-var import_async = require("@dxos/async");
+var import_react2 = __toESM(require("react"));
 var import_compute = require("@dxos/compute");
-var import_invariant = require("@dxos/invariant");
-var import_react_ui_editor = require("@dxos/react-ui-editor");
-var import_autocomplete = require("@codemirror/autocomplete");
-var import_language2 = require("@codemirror/language");
-var import_view2 = require("@codemirror/view");
-var import_highlight = require("@lezer/highlight");
-var import_codemirror_lang_spreadsheet = require("codemirror-lang-spreadsheet");
-var import_compute2 = require("@dxos/compute");
-var import_react_ui_editor2 = require("@dxos/react-ui-editor");
+var import_echo_schema = require("@dxos/echo-schema");
+var import_react_ui = require("@dxos/react-ui");
+var import_react_ui_list = require("@dxos/react-ui-list");
 var import_react_ui_theme = require("@dxos/react-ui-theme");
-var import_react2 = __toESM(require("react"));
-var import_invariant2 = require("@dxos/invariant");
-var import_echo = require("@dxos/react-client/echo");
-var import_react_ui_grid = require("@dxos/react-ui-grid");
-var import_react3 = __toESM(require("react"));
+var import_react3 = require("react");
+var import_react4 = __toESM(require("react"));
 var import_app_framework = require("@dxos/app-framework");
-var import_compute3 = require("@dxos/compute");
-var import_react_ui = require("@dxos/react-ui");
+var import_compute2 = require("@dxos/compute");
+var import_react_ui2 = require("@dxos/react-ui");
 var import_react_ui_attention = require("@dxos/react-ui-attention");
-var import_react_ui_grid2 = require("@dxos/react-ui-grid");
-var import_react4 = require("react");
-var import_compute4 = require("@dxos/compute");
-var import_echo2 = require("@dxos/react-client/echo");
+var import_react_ui_grid = require("@dxos/react-ui-grid");
+var import_react5 = require("react");
+var import_compute3 = require("@dxos/compute");
+var import_echo = require("@dxos/react-client/echo");
 var import_react_ui_form = require("@dxos/react-ui-form");
-var import_react_ui_grid3 = require("@dxos/react-ui-grid");
+var import_react_ui_grid2 = require("@dxos/react-ui-grid");
 var import_react_ui_theme2 = require("@dxos/react-ui-theme");
-var import_react5 = require("react");
+var import_react6 = require("react");
 var import_app_framework2 = require("@dxos/app-framework");
-var import_async2 = require("@dxos/async");
-var import_compute5 = require("@dxos/compute");
+var import_async = require("@dxos/async");
+var import_compute4 = require("@dxos/compute");
 var import_types = require("@dxos/plugin-thread/types");
-var import_echo3 = require("@dxos/react-client/echo");
-var import_react6 = require("react");
+var import_echo2 = require("@dxos/react-client/echo");
 var import_react7 = __toESM(require("react"));
-var import_compute6 = require("@dxos/compute");
-var import_echo_schema = 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 import_react8 = __toESM(require("react"));
-var import_meta = require("@dxos/plugin-space/meta");
-var import_react_ui3 = require("@dxos/react-ui");
+var import_invariant = require("@dxos/invariant");
+var import_echo3 = require("@dxos/react-client/echo");
+var import_react_ui_grid3 = require("@dxos/react-ui-grid");
 var ComputeGraphContext = /* @__PURE__ */ (0, import_react.createContext)(void 0);
 var ComputeGraphContextProvider = ({ registry, children }) => {
   return /* @__PURE__ */ import_react.default.createElement(ComputeGraphContext.Provider, {
@@ -113,328 +95,38 @@ var useComputeGraph = (space) => {
   ]);
   return graph;
 };
-var updateAllDecorations = import_state.StateEffect.define();
-var computeGraphFacet = (0, import_react_ui_editor.singleValueFacet)();
-var highlightStyles = import_language2.HighlightStyle.define([
-  // Function.
-  {
-    tag: import_highlight.tags.name,
-    class: "text-accentText"
-  },
-  // Range.
-  {
-    tag: import_highlight.tags.tagName,
-    class: "text-pinkText"
-  },
-  // Values.
-  {
-    tag: import_highlight.tags.number,
-    class: "text-tealText"
-  },
-  {
-    tag: import_highlight.tags.bool,
-    class: "text-tealText"
-  },
-  {
-    tag: import_highlight.tags.string,
-    class: "text-tealText"
-  },
-  // Error.
-  {
-    tag: import_highlight.tags.invalid,
-    class: "text-unAccent"
-  }
-]);
-var languageFacet = (0, import_react_ui_editor2.singleValueFacet)();
-var sheetExtension = ({ debug, functions = [] }) => {
-  const { extension, language } = (0, import_codemirror_lang_spreadsheet.spreadsheet)({
-    idiom: "en-US",
-    decimalSeparator: "."
-  });
-  const createCompletion = (name) => {
-    const { section = "Custom", description, syntax } = functions.find((value) => value.name === name) ?? {};
-    return {
-      section,
-      label: name,
-      info: () => {
-        if (!description && !syntax) {
-          return null;
-        }
-        const root = document.createElement("div");
-        root.className = "flex flex-col gap-2 text-sm";
-        const title = document.createElement("h2");
-        title.innerText = name;
-        title.className = "text-lg font-mono text-accentText";
-        root.appendChild(title);
-        if (description) {
-          const info = document.createElement("p");
-          info.innerText = description;
-          info.className = "text-subdued";
-          root.appendChild(info);
-        }
-        if (syntax) {
-          const detail = document.createElement("pre");
-          detail.innerText = syntax;
-          detail.className = "whitespace-pre-wrap text-greenText";
-          root.appendChild(detail);
-        }
-        return root;
-      },
-      apply: (view, completion, from, to) => {
-        const insertParens = to === view.state.doc.toString().length;
-        view.dispatch(view.state.update({
-          changes: {
-            from,
-            to,
-            insert: completion.label + (insertParens ? "()" : "")
-          },
-          selection: {
-            anchor: from + completion.label.length + 1
-          }
-        }));
-      }
-    };
-  };
-  return [
-    extension,
-    languageFacet.of(language),
-    language.data.of({
-      autocomplete: (context) => {
-        if (context.state.doc.toString()[0] !== "=") {
-          return null;
-        }
-        const match = context.matchBefore(/\w*/);
-        if (!match || match.from === match.to) {
-          return null;
-        }
-        const text = match.text.toUpperCase();
-        if (!context.explicit && match.text.length < 2) {
-          return null;
-        }
-        return {
-          from: match.from,
-          options: functions?.filter(({ name }) => name.startsWith(text)).map(({ name }) => createCompletion(name)) ?? []
-        };
-      }
-    }),
-    (0, import_language2.syntaxHighlighting)(highlightStyles),
-    (0, import_autocomplete.autocompletion)({
-      aboveCursor: false,
-      defaultKeymap: true,
-      activateOnTyping: true,
-      closeOnBlur: !debug,
-      icons: false,
-      tooltipClass: () => (0, import_react_ui_theme.mx)("!-left-[1px] !top-[33px] !-m-0 border !border-t-0 [&>ul]:!min-w-[198px]", "[&>ul>li[aria-selected]]:!bg-accentSurface", "border-separator")
-    }),
-    import_view2.keymap.of([
-      {
-        key: "Tab",
-        run: (view) => {
-          return (0, import_autocomplete.completionStatus)(view.state) === "active" ? (0, import_autocomplete.acceptCompletion)(view) : (0, import_autocomplete.startCompletion)(view);
-        }
-      }
-    ])
-  ];
-};
-var rangeExtension = ({ onInit, onStateChange }) => {
-  let view;
-  let activeRange;
-  const notifier = {
-    setRange: (range) => {
-      if (activeRange) {
-        view.dispatch(view.state.update({
-          changes: {
-            ...activeRange,
-            insert: range.toString()
-          },
-          selection: {
-            anchor: activeRange.from + range.length
-          }
-        }));
-      }
-      view.focus();
-    }
-  };
-  return import_view2.ViewPlugin.fromClass(class {
-    constructor(_view) {
-      view = _view;
-      onInit?.(notifier);
-    }
-    update(view2) {
-      const { anchor } = view2.state.selection.ranges[0];
-      activeRange = void 0;
-      const language = view2.state.facet(languageFacet);
-      const { topNode } = language.parser.parse(view2.state.doc.toString());
-      visitTree(topNode, ({ type, from, to }) => {
-        if (from <= anchor && to >= anchor) {
-          switch (type.name) {
-            case "Function":
-              activeRange = {
-                from: to,
-                to
-              };
-              break;
-            case "CloseParen":
-              activeRange = {
-                from,
-                to: from
-              };
-              break;
-            case "RangeToken":
-            case "CellToken":
-              activeRange = {
-                from,
-                to
-              };
-              return true;
-          }
-        }
-        return false;
-      });
-      if (!activeRange && view2.state.doc.toString()[0] === "=") {
-        const str = view2.state.doc.sliceString(1);
-        if (import_compute2.RANGE_NOTATION.test(str)) {
-          activeRange = {
-            from: 1,
-            to: str.length + 1
-          };
-        }
-      }
-      onStateChange?.({
-        activeRange: activeRange ? view2.state.doc.sliceString(activeRange.from, activeRange.to) : void 0
-      });
-    }
-  });
-};
-var visitTree = (node, callback) => {
-  if (callback(node)) {
-    return true;
-  }
-  for (let child = node.firstChild; child !== null; child = child.nextSibling) {
-    if (visitTree(child, callback)) {
-      return true;
-    }
-  }
-  return false;
-};
-var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-sheet/src/components/SheetContext/SheetContext.tsx";
-var SheetContext = /* @__PURE__ */ (0, import_react2.createContext)(void 0);
-var useSheetContext = () => {
-  const context = (0, import_react2.useContext)(SheetContext);
-  (0, import_invariant2.invariant)(context, void 0, {
-    F: __dxlog_file,
-    L: 54,
-    S: void 0,
-    A: [
-      "context",
-      ""
-    ]
-  });
-  return context;
-};
-var SheetProviderImpl = ({ model, onInfo, ignoreAttention, children, __gridScope }) => {
-  const { id, editing, setEditing } = (0, import_react_ui_grid.useGridContext)("SheetProvider", __gridScope);
-  const [cursor, setCursorInternal] = (0, import_react2.useState)();
-  const [range, setRangeInternal] = (0, import_react2.useState)();
-  const [cursorFallbackRange, setCursorFallbackRange] = (0, import_react2.useState)();
-  const [activeRefs, setActiveRefs] = (0, import_react2.useState)("");
-  const setCursor = (0, import_react2.useCallback)((nextCursor) => {
-    setCursorInternal(nextCursor);
-    setCursorFallbackRange(range?.to ? range : nextCursor ? {
-      from: nextCursor,
-      to: nextCursor
-    } : void 0);
-  }, [
-    range
-  ]);
-  const setRange = (0, import_react2.useCallback)((nextRange) => {
-    setRangeInternal(nextRange);
-    setCursorFallbackRange(nextRange?.to ? nextRange : cursor ? {
-      from: cursor,
-      to: cursor
-    } : void 0);
-  }, [
-    cursor
-  ]);
-  return /* @__PURE__ */ import_react2.default.createElement(SheetContext.Provider, {
-    value: {
-      id,
-      model,
-      editing,
-      setEditing,
-      cursor,
-      setCursor,
-      range,
-      setRange,
-      cursorFallbackRange,
-      activeRefs,
-      setActiveRefs,
-      // TODO(burdon): Change to event.
-      onInfo,
-      ignoreAttention
-    }
-  }, children);
-};
-var SheetProvider = ({ children, graph, sheet, readonly, ignoreAttention, onInfo }) => {
-  const model = (0, import_chunk_TQOJ7DG2.useSheetModel)(graph, sheet, {
-    readonly
-  });
-  return !model ? null : /* @__PURE__ */ import_react2.default.createElement(import_react_ui_grid.Grid.Root, {
-    id: (0, import_echo.fullyQualifiedId)(sheet)
-  }, /* @__PURE__ */ import_react2.default.createElement(SheetProviderImpl, {
-    model,
-    onInfo,
-    ignoreAttention
-  }, children));
-};
 var RangeList = ({ sheet }) => {
-  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN);
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_NLDXUFDG.SHEET_PLUGIN);
   const handleSelectRange = (range) => {
   };
-  const handleDeleteRange = (0, import_react7.useCallback)((range) => {
+  const handleDeleteRange = (0, import_react2.useCallback)((range) => {
     const index = sheet.ranges.findIndex((sheetRange) => sheetRange === range);
     sheet.ranges.splice(index, 1);
   }, [
     sheet
   ]);
-  return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, /* @__PURE__ */ import_react7.default.createElement("h2", {
+  return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement("h2", {
     className: "p-2 text-sm font-semibold"
-  }, t("range list heading")), /* @__PURE__ */ import_react7.default.createElement(import_react_ui_list.List.Root, {
+  }, t("range list heading")), /* @__PURE__ */ import_react2.default.createElement(import_react_ui_list.List.Root, {
     items: sheet.ranges,
-    isItem: import_echo_schema.S.is(import_chunk_TQOJ7DG2.Range)
-  }, ({ items: ranges }) => ranges.map((range, i) => /* @__PURE__ */ import_react7.default.createElement(import_react_ui_list.List.Item, {
+    isItem: import_echo_schema.S.is(import_chunk_E3RXOEL6.Range)
+  }, ({ items: ranges }) => ranges.map((range, i) => /* @__PURE__ */ import_react2.default.createElement(import_react_ui_list.List.Item, {
     key: i,
     item: range,
     classNames: [
       "p-2",
-      import_react_ui_theme3.ghostHover
+      import_react_ui_theme.ghostHover
     ]
-  }, /* @__PURE__ */ import_react7.default.createElement(import_react_ui_list.List.ItemDragHandle, null), /* @__PURE__ */ import_react7.default.createElement(import_react_ui_list.List.ItemTitle, {
+  }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui_list.List.ItemDragHandle, null), /* @__PURE__ */ import_react2.default.createElement(import_react_ui_list.List.ItemTitle, {
     onClick: () => handleSelectRange(range)
   }, t("range title", {
-    position: (0, import_compute6.rangeToA1Notation)((0, import_chunk_TQOJ7DG2.rangeFromIndex)(sheet, range.range)),
+    position: (0, import_compute.rangeToA1Notation)((0, import_chunk_E3RXOEL6.rangeFromIndex)(sheet, range.range)),
     key: t(`range key ${range.key} label`),
     value: t(`range value ${range.value} label`)
-  })), /* @__PURE__ */ import_react7.default.createElement(import_react_ui_list.List.ItemDeleteButton, {
+  })), /* @__PURE__ */ import_react2.default.createElement(import_react_ui_list.List.ItemDeleteButton, {
     onClick: () => handleDeleteRange(range)
   })))));
 };
-var SheetObjectSettings = ({ sheet }) => {
-  const { t } = (0, import_react_ui3.useTranslation)(import_meta.SPACE_PLUGIN);
-  return /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, /* @__PURE__ */ import_react8.default.createElement("div", {
-    role: "form",
-    className: "flex flex-col w-full p-2 gap-1"
-  }, /* @__PURE__ */ import_react8.default.createElement(import_react_ui3.Input.Root, null, /* @__PURE__ */ import_react8.default.createElement(import_react_ui3.Input.Label, null, t("name label")), /* @__PURE__ */ import_react8.default.createElement(import_react_ui3.Input.TextInput, {
-    placeholder: t("name placeholder"),
-    value: sheet.name ?? "",
-    onChange: (event) => {
-      sheet.name = event.target.value;
-    }
-  }))), /* @__PURE__ */ import_react8.default.createElement(RangeList, {
-    sheet
-  }));
-};
-var SheetContainer = (0, import_react6.lazy)(() => import("./SheetContainer-TP4GYXZB.cjs"));
 var completeCellRangeToThreadCursor = (range) => {
   return `${range.from.col},${range.from.row},${range.to.col},${range.to.row}`;
 };
@@ -458,7 +150,7 @@ var parseThreadAnchorAsCellRange = (cursor) => {
 };
 var useUpdateFocusedCellOnThreadSelection = (grid) => {
   const { model, setActiveRefs } = useSheetContext();
-  const scrollIntoViewResolver = (0, import_react5.useMemo)(() => (0, import_app_framework2.createResolver)(import_app_framework2.LayoutAction.ScrollIntoView, ({ cursor, ref }) => {
+  const scrollIntoViewResolver = (0, import_react6.useMemo)(() => (0, import_app_framework2.createResolver)(import_app_framework2.LayoutAction.ScrollIntoView, ({ cursor, ref }) => {
     setActiveRefs(ref);
     const range = parseThreadAnchorAsCellRange(cursor);
     range && grid?.setFocus({
@@ -467,47 +159,47 @@ var useUpdateFocusedCellOnThreadSelection = (grid) => {
     }, true);
   }, {
     disposition: "hoist",
-    filter: (data) => data.id === (0, import_echo3.fullyQualifiedId)(model.sheet) && !!data.cursor
+    filter: (data) => data.id === (0, import_echo2.fullyQualifiedId)(model.sheet) && !!data.cursor
   }), [
     model.sheet,
     setActiveRefs
   ]);
-  (0, import_app_framework2.useIntentResolver)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN, scrollIntoViewResolver);
+  (0, import_app_framework2.useIntentResolver)(import_chunk_NLDXUFDG.SHEET_PLUGIN, scrollIntoViewResolver);
 };
 var useSelectThreadOnCellFocus = () => {
   const { model, cursor } = useSheetContext();
   const { dispatchPromise: dispatch } = (0, import_app_framework2.useIntentDispatcher)();
-  const threads = (0, import_react5.useMemo)(() => model.sheet.threads?.filter((thread) => !!thread) ?? [], [
+  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)
   ]);
-  const selectClosestThread = (0, import_react5.useCallback)((cellAddress) => {
+  const selectClosestThread = (0, import_react6.useCallback)((cellAddress) => {
     if (!cellAddress || !threads) {
       return;
     }
     const closestThread = threads?.find((ref) => {
       if (ref.target?.anchor) {
         const range = parseThreadAnchorAsCellRange(ref.target.anchor);
-        return range ? (0, import_compute5.inRange)(range, cellAddress) : false;
+        return range ? (0, import_compute4.inRange)(range, cellAddress) : false;
       } else {
         return false;
       }
     });
     if (closestThread) {
       void dispatch((0, import_app_framework2.createIntent)(import_types.ThreadAction.Select, {
-        current: (0, import_echo3.fullyQualifiedId)(closestThread)
+        current: (0, import_echo2.fullyQualifiedId)(closestThread)
       }));
     }
   }, [
     dispatch,
     threads
   ]);
-  const debounced = (0, import_react5.useMemo)(() => {
-    return (0, import_async2.debounce)((cellCoords) => requestAnimationFrame(() => selectClosestThread(cellCoords)), 50);
+  const debounced = (0, import_react6.useMemo)(() => {
+    return (0, import_async.debounce)((cellCoords) => requestAnimationFrame(() => selectClosestThread(cellCoords)), 50);
   }, [
     selectClosestThread
   ]);
-  (0, import_react5.useEffect)(() => {
+  (0, import_react6.useEffect)(() => {
     if (!cursor) {
       return;
     }
@@ -549,15 +241,15 @@ var projectCellProps = (model, col, row) => {
     row
   };
   const rawValue = model.getValue(address);
-  const ranges = model.sheet.ranges?.filter(({ range }) => (0, import_compute4.inRange)((0, import_chunk_TQOJ7DG2.rangeFromIndex)(model.sheet, range), address));
+  const ranges = model.sheet.ranges?.filter(({ range }) => (0, import_compute3.inRange)((0, import_chunk_E3RXOEL6.rangeFromIndex)(model.sheet, range), address));
   const threadRefs = model.sheet.threads?.filter((thread) => {
     const range = thread.target?.anchor && parseThreadAnchorAsCellRange(thread.target.anchor);
-    return thread && range ? (0, import_compute4.inRange)(range, address) : false;
-  }).map((thread) => (0, import_echo2.fullyQualifiedId)(thread)).join(" ");
+    return thread && range ? (0, import_compute3.inRange)(range, address) : false;
+  }).map((thread) => (0, import_echo.fullyQualifiedId)(thread)).join(" ");
   const description = model.getValueDescription(address);
   const type = description?.type;
   const format = description?.format;
-  const classNames = ranges?.map(import_chunk_TQOJ7DG2.cellClassNameForRange).reverse();
+  const classNames = ranges?.map(import_chunk_E3RXOEL6.cellClassNameForRange).reverse();
   return {
     value: (0, import_react_ui_form.parseValue)({
       type,
@@ -567,7 +259,7 @@ var projectCellProps = (model, col, row) => {
     className: (0, import_react_ui_theme2.mx)((0, import_react_ui_form.cellClassesForFieldType)({
       type,
       format
-    }), threadRefs && import_react_ui_grid3.commentedClassName, classNames),
+    }), threadRefs && import_react_ui_grid2.commentedClassName, classNames),
     dataRefs: threadRefs
   };
 };
@@ -589,12 +281,12 @@ var gridCellGetter = (model) => {
   };
 };
 var rowLabelCell = (row) => ({
-  value: (0, import_react_ui_grid3.rowToA1Notation)(row),
+  value: (0, import_react_ui_grid2.rowToA1Notation)(row),
   className: "text-end !pie-1 text-subdued",
   resizeHandle: "row"
 });
 var colLabelCell = (col) => ({
-  value: (0, import_react_ui_grid3.colToA1Notation)(col),
+  value: (0, import_react_ui_grid2.colToA1Notation)(col),
   className: "text-subdued",
   resizeHandle: "col"
 });
@@ -626,10 +318,10 @@ var cellGetter = (model) => {
   };
 };
 var useSheetModelDxGridProps = (dxGrid, model) => {
-  const [columns, setColumns] = (0, import_react4.useState)(createDxGridColumns(model));
-  const [rows, setRows] = (0, import_react4.useState)(createDxGridRows(model));
-  (0, import_react4.useEffect)(() => {
-    const cellsAccessor = (0, import_echo2.createDocAccessor)(model.sheet, [
+  const [columns, setColumns] = (0, import_react5.useState)(createDxGridColumns(model));
+  const [rows, setRows] = (0, import_react5.useState)(createDxGridRows(model));
+  (0, import_react5.useEffect)(() => {
+    const cellsAccessor = (0, import_echo.createDocAccessor)(model.sheet, [
       "cells"
     ]);
     if (dxGrid) {
@@ -648,11 +340,11 @@ var useSheetModelDxGridProps = (dxGrid, model) => {
     model,
     dxGrid
   ]);
-  (0, import_react4.useEffect)(() => {
-    const columnMetaAccessor = (0, import_echo2.createDocAccessor)(model.sheet, [
+  (0, import_react5.useEffect)(() => {
+    const columnMetaAccessor = (0, import_echo.createDocAccessor)(model.sheet, [
       "columnMeta"
     ]);
-    const rowMetaAccessor = (0, import_echo2.createDocAccessor)(model.sheet, [
+    const rowMetaAccessor = (0, import_echo.createDocAccessor)(model.sheet, [
       "rowMeta"
     ]);
     const handleColumnMetaUpdate = () => {
@@ -676,6 +368,76 @@ var useSheetModelDxGridProps = (dxGrid, model) => {
     rows
   };
 };
+var __dxlog_file = "/home/runner/work/dxos/dxos/packages/plugins/plugin-sheet/src/components/SheetContext/SheetContext.tsx";
+var SheetContext = /* @__PURE__ */ (0, import_react7.createContext)(void 0);
+var useSheetContext = () => {
+  const context = (0, import_react7.useContext)(SheetContext);
+  (0, import_invariant.invariant)(context, void 0, {
+    F: __dxlog_file,
+    L: 54,
+    S: void 0,
+    A: [
+      "context",
+      ""
+    ]
+  });
+  return context;
+};
+var SheetProviderImpl = ({ model, onInfo, ignoreAttention, children, __gridScope }) => {
+  const { id, editing, setEditing } = (0, import_react_ui_grid3.useGridContext)("SheetProvider", __gridScope);
+  const [cursor, setCursorInternal] = (0, import_react7.useState)();
+  const [range, setRangeInternal] = (0, import_react7.useState)();
+  const [cursorFallbackRange, setCursorFallbackRange] = (0, import_react7.useState)();
+  const [activeRefs, setActiveRefs] = (0, import_react7.useState)("");
+  const setCursor = (0, import_react7.useCallback)((nextCursor) => {
+    setCursorInternal(nextCursor);
+    setCursorFallbackRange(range?.to ? range : nextCursor ? {
+      from: nextCursor,
+      to: nextCursor
+    } : void 0);
+  }, [
+    range
+  ]);
+  const setRange = (0, import_react7.useCallback)((nextRange) => {
+    setRangeInternal(nextRange);
+    setCursorFallbackRange(nextRange?.to ? nextRange : cursor ? {
+      from: cursor,
+      to: cursor
+    } : void 0);
+  }, [
+    cursor
+  ]);
+  return /* @__PURE__ */ import_react7.default.createElement(SheetContext.Provider, {
+    value: {
+      id,
+      model,
+      editing,
+      setEditing,
+      cursor,
+      setCursor,
+      range,
+      setRange,
+      cursorFallbackRange,
+      activeRefs,
+      setActiveRefs,
+      // TODO(burdon): Change to event.
+      onInfo,
+      ignoreAttention
+    }
+  }, children);
+};
+var SheetProvider = ({ children, graph, sheet, readonly, ignoreAttention, onInfo }) => {
+  const model = (0, import_chunk_E3RXOEL6.useSheetModel)(graph, sheet, {
+    readonly
+  });
+  return !model ? null : /* @__PURE__ */ import_react7.default.createElement(import_react_ui_grid3.Grid.Root, {
+    id: (0, import_echo3.fullyQualifiedId)(sheet)
+  }, /* @__PURE__ */ import_react7.default.createElement(SheetProviderImpl, {
+    model,
+    onInfo,
+    ignoreAttention
+  }, children));
+};
 var inertPosition = {
   plane: "grid",
   col: 0,
@@ -702,11 +464,11 @@ var frozen = {
 };
 var sheetRowDefault = {
   frozenRowsStart: {
-    size: import_react_ui_grid2.defaultSizeRow,
+    size: import_react_ui_grid.defaultSizeRow,
     readonly: true
   },
   grid: {
-    size: import_react_ui_grid2.defaultSizeRow,
+    size: import_react_ui_grid.defaultSizeRow,
     resizeable: true
   }
 };
@@ -721,16 +483,16 @@ var sheetColDefault = {
   }
 };
 var GridSheet = () => {
-  const { t } = (0, import_react_ui.useTranslation)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN);
+  const { t } = (0, import_react_ui2.useTranslation)(import_chunk_NLDXUFDG.SHEET_PLUGIN);
   const { id, model, editing, setCursor, setRange, cursor, cursorFallbackRange, activeRefs, ignoreAttention } = useSheetContext();
-  const [dxGrid, setDxGrid] = (0, import_react3.useState)(null);
-  const [extraplanarFocus, setExtraplanarFocus] = (0, import_react3.useState)(null);
+  const [dxGrid, setDxGrid] = (0, import_react4.useState)(null);
+  const [extraplanarFocus, setExtraplanarFocus] = (0, import_react4.useState)(null);
   const { dispatchPromise: dispatch } = (0, import_app_framework.useIntentDispatcher)();
-  const rangeController = (0, import_react3.useRef)();
+  const rangeController = (0, import_react4.useRef)();
   const { hasAttention } = (0, import_react_ui_attention.useAttention)(id);
-  const handleFocus = (0, import_react3.useCallback)((event) => {
+  const handleFocus = (0, import_react4.useCallback)((event) => {
     if (!editing) {
-      const cell = (0, import_react_ui_grid2.closestCell)(event.target);
+      const cell = (0, import_react_ui_grid.closestCell)(event.target);
       if (cell) {
         if (cell.plane === "grid") {
           setCursor({
@@ -748,7 +510,7 @@ var GridSheet = () => {
   }, [
     editing
   ]);
-  const handleClose = (0, import_react3.useCallback)((_value, event) => {
+  const handleClose = (0, import_react4.useCallback)((_value, event) => {
     if (event) {
       const { key, shift } = event;
       const axis = [
@@ -771,15 +533,15 @@ var GridSheet = () => {
     editing,
     dxGrid
   ]);
-  const handleBlur = (0, import_react3.useCallback)((value) => {
+  const handleBlur = (0, import_react4.useCallback)((value) => {
     if (value !== void 0) {
-      model.setValue((0, import_react_ui_grid2.parseCellIndex)(editing.index), value);
+      model.setValue((0, import_react_ui_grid.parseCellIndex)(editing.index), value);
     }
   }, [
     model,
     editing
   ]);
-  const handleAxisResize = (0, import_react3.useCallback)(({ axis, size, index: numericIndex }) => {
+  const handleAxisResize = (0, import_react4.useCallback)(({ axis, size, index: numericIndex }) => {
     if (axis === "row") {
       const rowId = model.sheet.rows[parseInt(numericIndex)];
       model.sheet.rowMeta[rowId] ??= {};
@@ -792,7 +554,7 @@ var GridSheet = () => {
   }, [
     model
   ]);
-  const handleSelect = (0, import_react3.useCallback)(({ minCol, maxCol, minRow, maxRow }) => {
+  const handleSelect = (0, import_react4.useCallback)(({ minCol, maxCol, minRow, maxRow }) => {
     const range = {
       from: {
         col: minCol,
@@ -806,14 +568,14 @@ var GridSheet = () => {
       };
     }
     if (editing) {
-      rangeController.current?.setRange((0, import_compute3.rangeToA1Notation)(range));
+      rangeController.current?.setRange((0, import_compute2.rangeToA1Notation)(range));
     } else {
       setRange(range.to ? range : void 0);
     }
   }, [
     editing
   ]);
-  const handleWheel = (0, import_react3.useCallback)((event) => {
+  const handleWheel = (0, import_react4.useCallback)((event) => {
     if (!ignoreAttention && !hasAttention) {
       event.stopPropagation();
     }
@@ -821,7 +583,7 @@ var GridSheet = () => {
     hasAttention,
     ignoreAttention
   ]);
-  const selectEntireAxis = (0, import_react3.useCallback)((pos) => {
+  const selectEntireAxis = (0, import_react4.useCallback)((pos) => {
     switch (pos.plane) {
       case "frozenRowsStart":
         return dxGrid?.setSelection({
@@ -854,15 +616,15 @@ var GridSheet = () => {
     dxGrid,
     model.sheet
   ]);
-  const handleClick = (0, import_react3.useCallback)((event) => {
-    const cell = (0, import_react_ui_grid2.closestCell)(event.target);
+  const handleClick = (0, import_react4.useCallback)((event) => {
+    const cell = (0, import_react_ui_grid.closestCell)(event.target);
     if (cell) {
       selectEntireAxis(cell);
     }
   }, [
     selectEntireAxis
   ]);
-  const handleKeyDown = (0, import_react3.useCallback)((event) => {
+  const handleKeyDown = (0, import_react4.useCallback)((event) => {
     switch (event.key) {
       case "Backspace":
       case "Delete":
@@ -909,28 +671,28 @@ var GridSheet = () => {
     extraplanarFocus,
     selectEntireAxis
   ]);
-  const contextMenuAnchorRef = (0, import_react3.useRef)(null);
-  const [contextMenuOpen, setContextMenuOpen] = (0, import_react3.useState)(null);
+  const contextMenuAnchorRef = (0, import_react4.useRef)(null);
+  const [contextMenuOpen, setContextMenuOpen] = (0, import_react4.useState)(null);
   const contextMenuAxis = contextMenuOpen?.plane.startsWith("frozenRows") ? "col" : "row";
-  const handleContextMenu = (0, import_react3.useCallback)((event) => {
-    const cell = (0, import_react_ui_grid2.closestCell)(event.target);
+  const handleContextMenu = (0, import_react4.useCallback)((event) => {
+    const cell = (0, import_react_ui_grid.closestCell)(event.target);
     if (cell && cell.plane.startsWith("frozen")) {
       event.preventDefault();
       contextMenuAnchorRef.current = event.target;
       setContextMenuOpen(cell);
     }
   }, []);
-  const handleAxisMenuAction = (0, import_react3.useCallback)((operation) => {
+  const handleAxisMenuAction = (0, import_react4.useCallback)((operation) => {
     switch (operation) {
       case "insert-before":
       case "insert-after":
-        return dispatch((0, import_app_framework.createIntent)(import_chunk_TQOJ7DG2.SheetAction.InsertAxis, {
+        return dispatch((0, import_app_framework.createIntent)(import_chunk_E3RXOEL6.SheetAction.InsertAxis, {
           model,
           axis: contextMenuAxis,
           index: contextMenuOpen[contextMenuAxis] + (operation === "insert-before" ? 0 : 1)
         }));
       case "drop":
-        return dispatch((0, import_app_framework.createIntent)(import_chunk_TQOJ7DG2.SheetAction.DropAxis, {
+        return dispatch((0, import_app_framework.createIntent)(import_chunk_E3RXOEL6.SheetAction.DropAxis, {
           model,
           axis: contextMenuAxis,
           axisIndex: model.sheet[contextMenuAxis === "row" ? "rows" : "columns"][contextMenuOpen[contextMenuAxis]]
@@ -943,17 +705,17 @@ var GridSheet = () => {
     dispatch
   ]);
   const { columns, rows } = useSheetModelDxGridProps(dxGrid, model);
-  const extension = (0, import_react3.useMemo)(() => [
-    (0, import_react_ui_grid2.editorKeys)({
+  const extension = (0, import_react4.useMemo)(() => [
+    (0, import_react_ui_grid.editorKeys)({
       onClose: handleClose,
       ...editing?.initialContent && {
         onNav: handleClose
       }
     }),
-    sheetExtension({
+    (0, import_chunk_P4KSGZSS.sheetExtension)({
       functions: model.graph.getFunctions()
     }),
-    rangeExtension({
+    (0, import_chunk_P4KSGZSS.rangeExtension)({
       onInit: (fn) => rangeController.current = fn,
       onStateChange: (state) => {
         if (dxGrid) {
@@ -966,24 +728,24 @@ var GridSheet = () => {
     handleClose,
     editing
   ]);
-  const getCellContent = (0, import_react3.useCallback)((index) => {
-    return model.getCellText((0, import_react_ui_grid2.parseCellIndex)(index));
+  const getCellContent = (0, import_react4.useCallback)((index) => {
+    return model.getCellText((0, import_react_ui_grid.parseCellIndex)(index));
   }, [
     model
   ]);
   useUpdateFocusedCellOnThreadSelection(dxGrid);
   useSelectThreadOnCellFocus();
-  return /* @__PURE__ */ import_react3.default.createElement("div", {
+  return /* @__PURE__ */ import_react4.default.createElement("div", {
     role: "none",
     className: "relative min-bs-0"
-  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui_grid2.GridCellEditor, {
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui_grid.GridCellEditor, {
     getCellContent,
     extension,
     onBlur: handleBlur
-  }), /* @__PURE__ */ import_react3.default.createElement(import_react_ui_grid2.Grid.Content, {
+  }), /* @__PURE__ */ import_react4.default.createElement(import_react_ui_grid.Grid.Content, {
     initialCells,
-    limitColumns: import_chunk_TQOJ7DG2.DEFAULT_COLS,
-    limitRows: import_chunk_TQOJ7DG2.DEFAULT_ROWS,
+    limitColumns: import_chunk_E3RXOEL6.DEFAULT_COLS,
+    limitRows: import_chunk_E3RXOEL6.DEFAULT_ROWS,
     columns,
     rows,
     onAxisResize: handleAxisResize,
@@ -1000,46 +762,46 @@ var GridSheet = () => {
     className: "[--dx-grid-base:var(--surface-bg)] [&_.dx-grid]:border-bs [&_.dx-grid]:absolute [&_.dx-grid]:inset-0 [&_.dx-grid]:border-separator",
     activeRefs,
     ref: setDxGrid
-  }), /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DropdownMenu.Root, {
+  }), /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.DropdownMenu.Root, {
     modal: false,
     open: !!contextMenuOpen,
     onOpenChange: (nextOpen) => setContextMenuOpen(nextOpen ? inertPosition : null)
-  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DropdownMenu.VirtualTrigger, {
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.DropdownMenu.VirtualTrigger, {
     virtualRef: contextMenuAnchorRef
-  }), /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DropdownMenu.Content, {
+  }), /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.DropdownMenu.Content, {
     side: contextMenuAxis === "col" ? "bottom" : "right",
     sideOffset: 4,
     collisionPadding: 8
-  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DropdownMenu.Viewport, null, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DropdownMenu.Item, {
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.DropdownMenu.Viewport, null, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.DropdownMenu.Item, {
     onClick: () => handleAxisMenuAction("insert-before"),
     "data-testid": `grid.${contextMenuAxis}.insert-before`
-  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.Icon, {
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Icon, {
     size: 5,
     icon: contextMenuAxis === "col" ? "ph--columns-plus-left--regular" : "ph--rows-plus-top--regular"
-  }), /* @__PURE__ */ import_react3.default.createElement("span", null, t(`add ${contextMenuAxis} before label`))), /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DropdownMenu.Item, {
+  }), /* @__PURE__ */ import_react4.default.createElement("span", null, t(`add ${contextMenuAxis} before label`))), /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.DropdownMenu.Item, {
     onClick: () => handleAxisMenuAction("insert-after"),
     "data-testid": `grid.${contextMenuAxis}.insert-after`
-  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.Icon, {
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Icon, {
     size: 5,
     icon: contextMenuAxis === "col" ? "ph--columns-plus-right--regular" : "ph--rows-plus-bottom--regular"
-  }), /* @__PURE__ */ import_react3.default.createElement("span", null, t(`add ${contextMenuAxis} after label`))), /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DropdownMenu.Item, {
+  }), /* @__PURE__ */ import_react4.default.createElement("span", null, t(`add ${contextMenuAxis} after label`))), /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.DropdownMenu.Item, {
     onClick: () => handleAxisMenuAction("drop"),
     "data-testid": `grid.${contextMenuAxis}.drop`
-  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.Icon, {
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Icon, {
     size: 5,
     icon: "ph--backspace--regular"
-  }), /* @__PURE__ */ import_react3.default.createElement("span", null, t(`delete ${contextMenuAxis} label`)))), /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DropdownMenu.Arrow, null))));
+  }), /* @__PURE__ */ import_react4.default.createElement("span", null, t(`delete ${contextMenuAxis} label`)))), /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.DropdownMenu.Arrow, null))));
 };
+var SheetContainer = (0, import_react3.lazy)(() => import("./SheetContainer-TJ3JQLWM.cjs"));
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   ComputeGraphContextProvider,
   GridSheet,
+  RangeList,
   SheetContainer,
-  SheetObjectSettings,
   SheetProvider,
   completeCellRangeToThreadCursor,
-  computeGraphFacet,
   useComputeGraph,
   useSheetContext
 });
-//# sourceMappingURL=chunk-FDEQ2PGJ.cjs.map
+//# sourceMappingURL=chunk-ZPWW4LPY.cjs.map