@dxos/plugin-sheet 0.6.8-staging.77f93a3 → 0.6.8-staging.c55b37f

package/src/components/ComputeGraph/graph.ts

@@ -2,27 +2,31 @@
 // Copyright 2024 DXOS.org
 //
 
-import { HyperFormula } from 'hyperformula';
+import { type FunctionPluginDefinition, HyperFormula } from 'hyperformula';
+import { type FunctionTranslationsPackage } from 'hyperformula/typings/interpreter';
 
 import { Event } from '@dxos/async';
 import { type Space } from '@dxos/client/echo';
 import { PublicKey } from '@dxos/keys';
 import { log } from '@dxos/log';
 
-import { FunctionContext } from './async-function';
-import { CustomPlugin, CustomPluginTranslations } from './custom';
-import { EdgeFunctionPlugin, EdgeFunctionPluginTranslations } from './edge-function';
+import { FunctionContext, type FunctionContextOptions } from './async-function';
 
 /**
  * Create root graph for space.
  */
-export const createComputeGraph = (space?: Space): ComputeGraph => {
-  // TODO(burdon): Configure.
-  HyperFormula.registerFunctionPlugin(CustomPlugin, CustomPluginTranslations);
-  HyperFormula.registerFunctionPlugin(EdgeFunctionPlugin, EdgeFunctionPluginTranslations);
+export const createComputeGraph = (
+  // TODO(wittjosiah): Factor out this type to make these easier to define.
+  functionPlugins: { plugin: FunctionPluginDefinition; translations: FunctionTranslationsPackage }[] = [],
+  space?: Space,
+  options?: Partial<FunctionContextOptions>,
+): ComputeGraph => {
+  functionPlugins.forEach(({ plugin, translations }) => {
+    HyperFormula.registerFunctionPlugin(plugin, translations);
+  });
 
   const hf = HyperFormula.buildEmpty({ licenseKey: 'gpl-v3' });
-  return new ComputeGraph(hf, space);
+  return new ComputeGraph(hf, space, options);
 };
 
 /**
@@ -34,13 +38,19 @@ export class ComputeGraph {
   public readonly update = new Event();
 
   // The context is passed to all functions.
-  public readonly context = new FunctionContext(this.hf, this._space, () => {
-    this.refresh();
-  });
+  public readonly context = new FunctionContext(
+    this.hf,
+    this._space,
+    () => {
+      this.refresh();
+    },
+    this._options,
+  );
 
   constructor(
     public readonly hf: HyperFormula,
     private readonly _space?: Space,
+    private readonly _options?: Partial<FunctionContextOptions>,
   ) {
     this.hf.updateConfig({ context: this.context });
   }

package/src/components/ComputeGraph/index.ts

@@ -2,6 +2,6 @@
 // Copyright 2024 DXOS.org
 //
 
+export * from './async-function';
 export * from './custom';
 export * from './graph';
-export * from './graph-context';

package/src/components/Sheet/Sheet.stories.tsx

@@ -20,13 +20,9 @@ import { type SizeMap } from './grid';
 import { useSheetContext } from './sheet-context';
 import { SheetModel } from '../../model';
 import { ValueTypeEnum, type CellValue, createSheet, SheetType } from '../../types';
-import {
-  type ComputeGraph,
-  ComputeGraphContext,
-  ComputeGraphContextProvider,
-  createComputeGraph,
-  useComputeGraph,
-} from '../ComputeGraph';
+import { type ComputeGraph, createComputeGraph } from '../ComputeGraph';
+// TODO(wittjosiah): Refactor. This is not exported from ./components due to depending on ECHO.
+import { ComputeGraphContext, ComputeGraphContextProvider, useComputeGraph } from '../ComputeGraph/graph-context';
 import { Toolbar, type ToolbarActionHandler } from '../Toolbar';
 
 // TODO(burdon): Allow toolbar to access sheet context; provide state for current cursor/range.

package/src/components/Sheet/Sheet.tsx

@@ -29,6 +29,7 @@ import React, {
   forwardRef,
   useEffect,
   useImperativeHandle,
+  useMemo,
   useRef,
   useState,
 } from 'react';
@@ -1049,13 +1050,14 @@ const GridCellEditor = ({ style, value, onNav, onClose }: GridCellEditorProps) =
       notifier.current?.(rangeToA1Notation(range));
     }
   }, [range]);
-  const [extension] = useState(() => {
-    return [
+  const extension = useMemo(
+    () => [
       editorKeys({ onNav, onClose }),
       sheetExtension({ functions: model.functions }),
       rangeExtension((fn) => (notifier.current = fn)),
-    ];
-  });
+    ],
+    [model],
+  );
 
   return (
     <div
@@ -1080,7 +1082,7 @@ const SheetStatusBar = () => {
   if (cursor) {
     value = model.getCellValue(cursor);
     if (typeof value === 'string' && value.charAt(0) === '=') {
-      value = model.mapFormulaIndicesToRefs(value);
+      value = model.mapFormulaBindingFromId(model.mapFormulaIndicesToRefs(value));
       isFormula = true;
     } else if (value != null) {
       value = String(value);

package/src/components/Sheet/sheet-context.tsx

@@ -5,12 +5,18 @@
 import React, { type PropsWithChildren, createContext, useContext, useState, useEffect } from 'react';
 
 import { invariant } from '@dxos/invariant';
-import { type Space } from '@dxos/react-client/echo';
+import { type FunctionType } from '@dxos/plugin-script';
+import { fullyQualifiedId, type Space } from '@dxos/react-client/echo';
 
 import { FormattingModel } from './formatting';
-import { type CellAddress, type CellRange, SheetModel } from '../../model';
+import { type CellAddress, type CellRange, defaultFunctions, SheetModel } from '../../model';
 import { type SheetType } from '../../types';
-import { useComputeGraph } from '../ComputeGraph';
+import { type FunctionContextOptions } from '../ComputeGraph';
+// TODO(wittjosiah): Refactor. This is not exported from ./components due to depending on ECHO.
+import { useComputeGraph } from '../ComputeGraph/graph-context';
+
+// TODO(wittjosiah): Factor out.
+const OBJECT_ID_LENGTH = 60; // 33 (space id) + 26 (object id) + 1 (separator).
 
 export type SheetContextType = {
   model: SheetModel;
@@ -44,7 +50,49 @@ export type SheetContextProps = {
   sheet: SheetType;
   space: Space;
   readonly?: boolean;
-} & Pick<SheetContextType, 'onInfo'>;
+} & Pick<SheetContextType, 'onInfo'> &
+  Partial<FunctionContextOptions>;
+
+/**
+ * Map from binding to fully qualified ECHO ID.
+ */
+const mapFormulaBindingToId =
+  (functions: FunctionType[]) =>
+  (formula: string): string => {
+    return formula.replace(/([a-zA-Z0-9]+)\((.*)\)/g, (match, binding, args) => {
+      if (defaultFunctions.find((fn) => fn.name === binding) || binding === 'EDGE') {
+        return match;
+      }
+
+      const fn = functions.find((fn) => fn.binding === binding);
+      if (fn) {
+        return `${fullyQualifiedId(fn)}(${args})`;
+      } else {
+        return match;
+      }
+    });
+  };
+
+/**
+ * Map from fully qualified ECHO ID to binding.
+ */
+const mapFormulaBindingFromId =
+  (functions: FunctionType[]) =>
+  (formula: string): string => {
+    return formula.replace(/([a-zA-Z0-9]+):([a-zA-Z0-9]+)\((.*)\)/g, (match, spaceId, objectId, args) => {
+      const id = `${spaceId}:${objectId}`;
+      if (id.length !== OBJECT_ID_LENGTH) {
+        return match;
+      }
+
+      const fn = functions.find((fn) => fullyQualifiedId(fn) === id);
+      if (fn?.binding) {
+        return `${fn.binding}(${args})`;
+      } else {
+        return match;
+      }
+    });
+  };
 
 export const SheetContextProvider = ({
   children,
@@ -52,8 +100,9 @@ export const SheetContextProvider = ({
   space,
   readonly,
   onInfo,
+  ...options
 }: PropsWithChildren<SheetContextProps>) => {
-  const graph = useComputeGraph(space);
+  const graph = useComputeGraph(space, options);
 
   const [cursor, setCursor] = useState<CellAddress>();
   const [range, setRange] = useState<CellRange>();
@@ -64,7 +113,7 @@ export const SheetContextProvider = ({
     let model: SheetModel | undefined;
     let formatting;
     const t = setTimeout(async () => {
-      model = new SheetModel(graph, sheet, { readonly });
+      model = new SheetModel(graph, sheet, space, { readonly, mapFormulaBindingToId, mapFormulaBindingFromId });
       await model.initialize();
       formatting = new FormattingModel(model);
       setModels([model, formatting]);