@dxos/plugin-sheet 0.7.2 → 0.7.3-staging.971cd8d

package/dist/lib/node/{SheetContainer-BSDHHYXE.cjs → SheetContainer-VVVRYTQG.cjs}

@@ -26,14 +26,14 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
   mod
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var SheetContainer_BSDHHYXE_exports = {};
-__export(SheetContainer_BSDHHYXE_exports, {
+var SheetContainer_VVVRYTQG_exports = {};
+__export(SheetContainer_VVVRYTQG_exports, {
   default: () => SheetContainer_default
 });
-module.exports = __toCommonJS(SheetContainer_BSDHHYXE_exports);
-var import_chunk_J5ZFWMOD = require("./chunk-J5ZFWMOD.cjs");
-var import_chunk_O7XR4R7Y = require("./chunk-O7XR4R7Y.cjs");
-var import_chunk_AWKOWDMI = require("./chunk-AWKOWDMI.cjs");
+module.exports = __toCommonJS(SheetContainer_VVVRYTQG_exports);
+var import_chunk_45YW2DX2 = require("./chunk-45YW2DX2.cjs");
+var import_chunk_KSEEI5VC = require("./chunk-KSEEI5VC.cjs");
+var import_chunk_OWH2EUHZ = require("./chunk-OWH2EUHZ.cjs");
 var import_chunk_2ZVZI2KJ = require("./chunk-2ZVZI2KJ.cjs");
 var import_react = __toESM(require("react"));
 var import_react_ui_stack = require("@dxos/react-ui-stack");
@@ -46,13 +46,13 @@ var import_react_ui2 = require("@dxos/react-ui");
 var import_react_ui_attention = require("@dxos/react-ui-attention");
 var import_util = require("@dxos/util");
 var FunctionEditor = () => {
-  const { model, cursor, range } = (0, import_chunk_J5ZFWMOD.useSheetContext)();
+  const { model, cursor, range } = (0, import_chunk_45YW2DX2.useSheetContext)();
   let value;
   let formula = false;
   if (cursor) {
     value = model.getCellValue(cursor);
-    if ((0, import_chunk_O7XR4R7Y.isFormula)(value)) {
-      value = model.graph.mapFunctionBindingFromId(model.mapFormulaIndicesToRefs(value));
+    if ((0, import_chunk_KSEEI5VC.isFormula)(value)) {
+      value = model.graph.mapFunctionBindingFromId((0, import_chunk_KSEEI5VC.mapFormulaIndicesToRefs)(model.sheet, value));
       formula = true;
     } else if (value != null) {
       value = String(value);
@@ -64,7 +64,7 @@ var FunctionEditor = () => {
     className: "flex gap-4 items-center"
   }, /* @__PURE__ */ import_react2.default.createElement("div", {
     className: "flex w-16 items-center font-mono"
-  }, range && (0, import_chunk_O7XR4R7Y.rangeToA1Notation)(range) || cursor && (0, import_chunk_O7XR4R7Y.addressToA1Notation)(cursor)), /* @__PURE__ */ import_react2.default.createElement("div", {
+  }, range && (0, import_chunk_KSEEI5VC.rangeToA1Notation)(range) || cursor && (0, import_chunk_KSEEI5VC.addressToA1Notation)(cursor)), /* @__PURE__ */ import_react2.default.createElement("div", {
     className: "flex gap-2 items-center"
   }, /* @__PURE__ */ import_react2.default.createElement(import_react_ui.Icon, {
     icon: "ph--function--regular",
@@ -102,16 +102,16 @@ var ToolbarItem = ({ itemType, icon, children, ...props }) => {
 };
 var [ToolbarContextProvider, useToolbarContext] = (0, import_react_context.createContext)("Toolbar");
 var ToolbarRoot = ({ children, role, classNames }) => {
-  const { id, model, cursorFallbackRange, cursor } = (0, import_chunk_J5ZFWMOD.useSheetContext)();
+  const { id, model, cursorFallbackRange, cursor } = (0, import_chunk_45YW2DX2.useSheetContext)();
   const { hasAttention } = (0, import_react_ui_attention.useAttention)(id);
   const dispatch = (0, import_app_framework.useIntentDispatcher)();
   const handleAction = (0, import_react3.useCallback)((action) => {
     switch (action.key) {
       case "alignment":
         if (cursorFallbackRange) {
-          const index = model.sheet.ranges?.findIndex((range) => range.key === action.key && (0, import_chunk_O7XR4R7Y.inRange)((0, import_chunk_O7XR4R7Y.rangeFromIndex)(model.sheet, range.range), cursorFallbackRange.from)) ?? -1;
+          const index = model.sheet.ranges?.findIndex((range) => range.key === action.key && (0, import_chunk_KSEEI5VC.inRange)((0, import_chunk_KSEEI5VC.rangeFromIndex)(model.sheet, range.range), cursorFallbackRange.from)) ?? -1;
           const nextRangeEntity = {
-            range: (0, import_chunk_O7XR4R7Y.rangeToIndex)(model.sheet, cursorFallbackRange),
+            range: (0, import_chunk_KSEEI5VC.rangeToIndex)(model.sheet, cursorFallbackRange),
             key: action.key,
             value: action.value
           };
@@ -126,13 +126,13 @@ var ToolbarRoot = ({ children, role, classNames }) => {
         break;
       case "style":
         if (action.unset) {
-          const index = model.sheet.ranges?.findIndex((range) => range.key === action.key && cursorFallbackRange && (0, import_chunk_O7XR4R7Y.inRange)((0, import_chunk_O7XR4R7Y.rangeFromIndex)(model.sheet, range.range), cursorFallbackRange.from));
+          const index = model.sheet.ranges?.findIndex((range) => range.key === action.key && cursorFallbackRange && (0, import_chunk_KSEEI5VC.inRange)((0, import_chunk_KSEEI5VC.rangeFromIndex)(model.sheet, range.range), cursorFallbackRange.from));
           if (index >= 0) {
             model.sheet.ranges?.splice(index, 1);
           }
         } else if (cursorFallbackRange) {
           model.sheet.ranges?.push({
-            range: (0, import_chunk_O7XR4R7Y.rangeToIndex)(model.sheet, cursorFallbackRange),
+            range: (0, import_chunk_KSEEI5VC.rangeToIndex)(model.sheet, cursorFallbackRange),
             key: action.key,
             value: action.value
           });
@@ -143,7 +143,7 @@ var ToolbarRoot = ({ children, role, classNames }) => {
           void dispatch({
             action: "dxos.org/plugin/thread/action/create",
             data: {
-              cursor: (0, import_chunk_J5ZFWMOD.completeCellRangeToThreadCursor)(cursorFallbackRange),
+              cursor: (0, import_chunk_45YW2DX2.completeCellRangeToThreadCursor)(cursorFallbackRange),
               name: action.cellContent,
               subject: model.sheet
             }
@@ -182,10 +182,10 @@ var alignmentOptions = [
   }
 ];
 var Alignment = () => {
-  const { cursor, model } = (0, import_chunk_J5ZFWMOD.useSheetContext)();
+  const { cursor, model } = (0, import_chunk_45YW2DX2.useSheetContext)();
   const { onAction } = useToolbarContext("Alignment");
   const { t } = (0, import_react_ui2.useTranslation)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN);
-  const value = cursor ? model.sheet.ranges?.findLast(({ range, key }) => key === import_chunk_O7XR4R7Y.alignKey && (0, import_chunk_O7XR4R7Y.inRange)((0, import_chunk_O7XR4R7Y.rangeFromIndex)(model.sheet, range), cursor))?.value : void 0;
+  const value = cursor ? model.sheet.ranges?.findLast(({ range, key }) => key === import_chunk_KSEEI5VC.alignKey && (0, import_chunk_KSEEI5VC.inRange)((0, import_chunk_KSEEI5VC.rangeFromIndex)(model.sheet, range), cursor))?.value : void 0;
   return /* @__PURE__ */ import_react3.default.createElement(import_react_ui2.Toolbar.ToggleGroup, {
     type: "single",
     value: (
@@ -193,16 +193,17 @@ var Alignment = () => {
       value ?? "never"
     ),
     onValueChange: (value2) => onAction?.({
-      key: import_chunk_O7XR4R7Y.alignKey,
+      key: import_chunk_KSEEI5VC.alignKey,
       value: value2
     })
   }, alignmentOptions.map(({ value: value2, icon }) => /* @__PURE__ */ import_react3.default.createElement(ToolbarItem, {
     itemType: "toggleGroupItem",
     key: value2,
     value: value2,
-    icon
+    icon,
+    "data-testid": `grid.toolbar.${import_chunk_KSEEI5VC.alignKey}.${value2}`
   }, t("toolbar action label", {
-    key: t(`range key ${import_chunk_O7XR4R7Y.alignKey} label`),
+    key: t(`range key ${import_chunk_KSEEI5VC.alignKey} label`),
     value: t(`range value ${value2} label`)
   }))));
 };
@@ -217,10 +218,10 @@ var styleOptions = [
   }
 ];
 var Styles = () => {
-  const { cursorFallbackRange, model } = (0, import_chunk_J5ZFWMOD.useSheetContext)();
+  const { cursorFallbackRange, model } = (0, import_chunk_45YW2DX2.useSheetContext)();
   const { onAction } = useToolbarContext("Styles");
   const { t } = (0, import_react_ui2.useTranslation)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN);
-  const activeValues = cursorFallbackRange ? model.sheet.ranges?.filter(({ range, key }) => key === "style" && (0, import_chunk_O7XR4R7Y.inRange)((0, import_chunk_O7XR4R7Y.rangeFromIndex)(model.sheet, range), cursorFallbackRange.from)).reduce((acc, { value }) => {
+  const activeValues = cursorFallbackRange ? model.sheet.ranges?.filter(({ range, key }) => key === "style" && (0, import_chunk_KSEEI5VC.inRange)((0, import_chunk_KSEEI5VC.rangeFromIndex)(model.sheet, range), cursorFallbackRange.from)).reduce((acc, { value }) => {
     acc.add(value);
     return acc;
   }, /* @__PURE__ */ new Set()) : void 0;
@@ -237,19 +238,19 @@ var Styles = () => {
     },
     icon
   }, t("toolbar action label", {
-    key: t(`range key ${import_chunk_O7XR4R7Y.styleKey} label`),
+    key: t(`range key ${import_chunk_KSEEI5VC.styleKey} label`),
     value: t(`range value ${value} label`)
   }))));
 };
 var Actions = () => {
   const { onAction } = useToolbarContext("Actions");
-  const { cursorFallbackRange, cursor, model } = (0, import_chunk_J5ZFWMOD.useSheetContext)();
+  const { cursorFallbackRange, cursor, model } = (0, import_chunk_45YW2DX2.useSheetContext)();
   const { t } = (0, import_react_ui2.useTranslation)(import_chunk_2ZVZI2KJ.SHEET_PLUGIN);
   const overlapsCommentAnchor = (model.sheet.threads ?? []).filter(import_util.nonNullable).filter((thread) => thread.status !== "resolved").some((thread) => {
     if (!cursorFallbackRange) {
       return false;
     }
-    return (0, import_chunk_O7XR4R7Y.rangeToIndex)(model.sheet, cursorFallbackRange) === thread.anchor;
+    return (0, import_chunk_KSEEI5VC.rangeToIndex)(model.sheet, cursorFallbackRange) === thread.anchor;
   });
   const tooltipLabelKey = !cursor ? "no cursor label" : overlapsCommentAnchor ? "selection overlaps existing comment label" : "comment label";
   return /* @__PURE__ */ import_react3.default.createElement(ToolbarItem, {
@@ -263,7 +264,7 @@ var Actions = () => {
       }
       return onAction?.({
         key: "comment",
-        value: (0, import_chunk_O7XR4R7Y.rangeToIndex)(model.sheet, cursorFallbackRange),
+        value: (0, import_chunk_KSEEI5VC.rangeToIndex)(model.sheet, cursorFallbackRange),
         cellContent: model.getCellText(cursorFallbackRange.from)
       });
     },
@@ -278,8 +279,8 @@ var Toolbar = {
   Actions
 };
 var SheetContainer = ({ space, sheet, role, ignoreAttention }) => {
-  const graph = (0, import_chunk_J5ZFWMOD.useComputeGraph)(space);
-  return graph ? /* @__PURE__ */ import_react.default.createElement(import_chunk_J5ZFWMOD.SheetProvider, {
+  const graph = (0, import_chunk_45YW2DX2.useComputeGraph)(space);
+  return graph ? /* @__PURE__ */ import_react.default.createElement(import_chunk_45YW2DX2.SheetProvider, {
     sheet,
     graph,
     ignoreAttention
@@ -291,7 +292,7 @@ var SheetContainer = ({ space, sheet, role, ignoreAttention }) => {
     }
   }, /* @__PURE__ */ import_react.default.createElement(Toolbar.Root, {
     role
-  }, /* @__PURE__ */ import_react.default.createElement(Toolbar.Styles, null), /* @__PURE__ */ import_react.default.createElement(Toolbar.Alignment, null), /* @__PURE__ */ import_react.default.createElement(Toolbar.Separator, null), /* @__PURE__ */ import_react.default.createElement(Toolbar.Actions, null)), /* @__PURE__ */ import_react.default.createElement(import_chunk_J5ZFWMOD.GridSheet, null), /* @__PURE__ */ import_react.default.createElement(FunctionEditor, null))) : null;
+  }, /* @__PURE__ */ import_react.default.createElement(Toolbar.Styles, null), /* @__PURE__ */ import_react.default.createElement(Toolbar.Alignment, null), /* @__PURE__ */ import_react.default.createElement(Toolbar.Separator, null), /* @__PURE__ */ import_react.default.createElement(Toolbar.Actions, null)), /* @__PURE__ */ import_react.default.createElement(import_chunk_45YW2DX2.GridSheet, null), /* @__PURE__ */ import_react.default.createElement(FunctionEditor, null))) : null;
 };
 var SheetContainer_default = SheetContainer;
-//# sourceMappingURL=SheetContainer-BSDHHYXE.cjs.map
+//# sourceMappingURL=SheetContainer-VVVRYTQG.cjs.map

package/dist/lib/node/SheetContainer-VVVRYTQG.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/SheetContainer/SheetContainer.tsx", "../../../src/components/FunctionEditor/FunctionEditor.tsx", "../../../src/components/Toolbar/Toolbar.tsx", "../../../src/components/SheetContainer/index.ts"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React from 'react';\n\nimport { type Space } from '@dxos/react-client/echo';\nimport { StackItem } from '@dxos/react-ui-stack';\n\nimport { type SheetType } from '../../types';\nimport { useComputeGraph } from '../ComputeGraph';\nimport { FunctionEditor } from '../FunctionEditor';\nimport { GridSheet } from '../GridSheet';\nimport { SheetProvider } from '../SheetContext';\nimport { Toolbar } from '../Toolbar';\n\nexport const SheetContainer = ({\n  space,\n  sheet,\n  role,\n  ignoreAttention,\n}: {\n  space: Space;\n  sheet: SheetType;\n  role?: string;\n  ignoreAttention?: boolean;\n}) => {\n  const graph = useComputeGraph(space);\n\n  return graph ? (\n    <SheetProvider sheet={sheet} graph={graph} ignoreAttention={ignoreAttention}>\n      <StackItem.Content toolbar statusbar {...(role === 'section' && { classNames: 'aspect-video' })}>\n        <Toolbar.Root role={role}>\n          <Toolbar.Styles />\n          <Toolbar.Alignment />\n          <Toolbar.Separator />\n          <Toolbar.Actions />\n        </Toolbar.Root>\n        <GridSheet />\n        <FunctionEditor />\n      </StackItem.Content>\n    </SheetProvider>\n  ) : null;\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport React from 'react';\n\nimport { Icon } from '@dxos/react-ui';\n\nimport { addressToA1Notation, isFormula, mapFormulaIndicesToRefs, rangeToA1Notation } from '../../defs';\nimport { useSheetContext } from '../SheetContext';\n\nexport const FunctionEditor = () => {\n  const { model, cursor, range } = useSheetContext();\n\n  let value;\n  let formula = false;\n  if (cursor) {\n    value = model.getCellValue(cursor);\n    if (isFormula(value)) {\n      value = model.graph.mapFunctionBindingFromId(mapFormulaIndicesToRefs(model.sheet, value));\n      formula = true;\n    } else if (value != null) {\n      value = String(value);\n    }\n  }\n\n  return (\n    <div className='flex shrink-0 justify-between items-center px-4 py-1 text-sm attention-surface border-bs !border-separator'>\n      <div className='flex gap-4 items-center'>\n        <div className='flex w-16 items-center font-mono'>\n          {(range && rangeToA1Notation(range)) || (cursor && addressToA1Notation(cursor))}\n        </div>\n        <div className='flex gap-2 items-center'>\n          <Icon icon='ph--function--regular' classNames={['text-greenText', formula ? 'visible' : 'invisible']} />\n          <span className='font-mono'>{value}</span>\n        </div>\n      </div>\n    </div>\n  );\n};\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { createContext } from '@radix-ui/react-context';\nimport React, { type PropsWithChildren, useCallback } from 'react';\n\nimport { useIntentDispatcher } from '@dxos/app-framework';\nimport {\n  Icon,\n  type ThemedClassName,\n  Toolbar as NaturalToolbar,\n  type ToolbarButtonProps as NaturalToolbarButtonProps,\n  type ToolbarToggleGroupItemProps as NaturalToolbarToggleGroupItemProps,\n  type ToolbarToggleProps as NaturalToolbarToggleProps,\n  Tooltip,\n  useTranslation,\n} from '@dxos/react-ui';\nimport { useAttention } from '@dxos/react-ui-attention';\nimport { nonNullable } from '@dxos/util';\n\nimport {\n  alignKey,\n  type AlignKey,\n  type AlignValue,\n  type CommentKey,\n  type CommentValue,\n  inRange,\n  rangeFromIndex,\n  rangeToIndex,\n  styleKey,\n  type StyleKey,\n  type StyleValue,\n} from '../../defs';\nimport { completeCellRangeToThreadCursor } from '../../integrations';\nimport { SHEET_PLUGIN } from '../../meta';\nimport { type SheetType } from '../../types';\nimport { useSheetContext } from '../SheetContext';\n\n//\n// Buttons\n//\n\nconst buttonStyles = 'min-bs-0 p-2';\nconst tooltipProps = { side: 'bottom' as const, classNames: 'z-10' };\n\nconst ToolbarSeparator = () => <div role='separator' className='grow' />;\n\n//\n// ToolbarItem\n//\n\ntype ToolbarItemProps =\n  | (NaturalToolbarButtonProps & { itemType: 'button'; icon: string })\n  | (NaturalToolbarToggleGroupItemProps & { itemType: 'toggleGroupItem'; icon: string })\n  | (NaturalToolbarToggleProps & { itemType: 'toggle'; icon: string });\n\nexport const ToolbarItem = ({ itemType, icon, children, ...props }: ToolbarItemProps) => {\n  const Invoker =\n    itemType === 'toggleGroupItem'\n      ? NaturalToolbar.ToggleGroupItem\n      : itemType === 'toggle'\n        ? NaturalToolbar.Toggle\n        : NaturalToolbar.Button;\n  return (\n    <Tooltip.Root>\n      <Tooltip.Trigger asChild>\n        {/* TODO(thure): type the props spread better. */}\n        <Invoker variant='ghost' {...(props as any)} classNames={buttonStyles}>\n          <Icon icon={icon} size={5} />\n          <span className='sr-only'>{children}</span>\n        </Invoker>\n      </Tooltip.Trigger>\n      <Tooltip.Portal>\n        <Tooltip.Content {...tooltipProps}>\n          {children}\n          <Tooltip.Arrow />\n        </Tooltip.Content>\n      </Tooltip.Portal>\n    </Tooltip.Root>\n  );\n};\n\n//\n// Root\n//\n\ntype AlignAction = { key: AlignKey; value: AlignValue };\ntype CommentAction = { key: CommentKey; value: CommentValue; cellContent?: string };\ntype StyleAction = { key: StyleKey; value: StyleValue };\n\nexport type ToolbarAction = StyleAction | AlignAction | CommentAction;\nexport type ToolbarActionAnnotated = ToolbarAction & { unset?: boolean };\n\nexport type ToolbarActionType = ToolbarAction['key'];\n\nexport type ToolbarActionHandler = (action: ToolbarActionAnnotated) => void;\n\nexport type ToolbarProps = ThemedClassName<\n  PropsWithChildren<{\n    role?: string;\n  }>\n>;\n\nconst [ToolbarContextProvider, useToolbarContext] = createContext<{\n  onAction: (action: ToolbarActionAnnotated) => void;\n}>('Toolbar');\n\ntype Range = SheetType['ranges'][number];\n\nconst ToolbarRoot = ({ children, role, classNames }: ToolbarProps) => {\n  const { id, model, cursorFallbackRange, cursor } = useSheetContext();\n  const { hasAttention } = useAttention(id);\n  const dispatch = useIntentDispatcher();\n\n  // TODO(Zan): Externalize the toolbar action handler. E.g., Toolbar/keys should both fire events.\n  const handleAction = useCallback(\n    (action: ToolbarActionAnnotated) => {\n      switch (action.key) {\n        case 'alignment':\n          if (cursorFallbackRange) {\n            const index =\n              model.sheet.ranges?.findIndex(\n                (range) =>\n                  range.key === action.key &&\n                  inRange(rangeFromIndex(model.sheet, range.range), cursorFallbackRange.from),\n              ) ?? -1;\n            const nextRangeEntity = {\n              range: rangeToIndex(model.sheet, cursorFallbackRange),\n              key: action.key,\n              value: action.value,\n            };\n            if (index < 0) {\n              model.sheet.ranges?.push(nextRangeEntity);\n            } else if (model.sheet.ranges![index].value === action.value) {\n              model.sheet.ranges?.splice(index, 1);\n            } else {\n              model.sheet.ranges?.splice(index, 1, nextRangeEntity);\n            }\n          }\n          break;\n        case 'style':\n          if (action.unset) {\n            const index = model.sheet.ranges?.findIndex(\n              (range) =>\n                range.key === action.key &&\n                cursorFallbackRange &&\n                inRange(rangeFromIndex(model.sheet, range.range), cursorFallbackRange.from),\n            );\n            if (index >= 0) {\n              model.sheet.ranges?.splice(index, 1);\n            }\n          } else if (cursorFallbackRange) {\n            model.sheet.ranges?.push({\n              range: rangeToIndex(model.sheet, cursorFallbackRange),\n              key: action.key,\n              value: action.value,\n            });\n          }\n          break;\n        case 'comment': {\n          // TODO(Zan): We shouldn't hardcode the action ID.\n          if (cursorFallbackRange) {\n            void dispatch({\n              action: 'dxos.org/plugin/thread/action/create',\n              data: {\n                cursor: completeCellRangeToThreadCursor(cursorFallbackRange),\n                name: action.cellContent,\n                subject: model.sheet,\n              },\n            });\n          }\n        }\n      }\n    },\n    [model.sheet, cursorFallbackRange, cursor, dispatch],\n  );\n\n  return (\n    <ToolbarContextProvider onAction={handleAction}>\n      <NaturalToolbar.Root classNames={['pli-0.5 attention-surface', !hasAttention && 'opacity-20', classNames]}>\n        {children}\n      </NaturalToolbar.Root>\n    </ToolbarContextProvider>\n  );\n};\n\n// TODO(burdon): Generalize.\n// TODO(burdon): Detect and display current state.\ntype ButtonProps<T> = {\n  value: T;\n  icon: string;\n  disabled?: (state: Range) => boolean;\n};\n\n//\n// Alignment\n//\n\nconst alignmentOptions: ButtonProps<AlignValue>[] = [\n  { value: 'start', icon: 'ph--text-align-left--regular' },\n  { value: 'center', icon: 'ph--text-align-center--regular' },\n  { value: 'end', icon: 'ph--text-align-right--regular' },\n];\n\nconst Alignment = () => {\n  const { cursor, model } = useSheetContext();\n  const { onAction } = useToolbarContext('Alignment');\n  const { t } = useTranslation(SHEET_PLUGIN);\n\n  // TODO(thure): Can this O(n) call be memoized?\n  const value = cursor\n    ? model.sheet.ranges?.findLast(\n        ({ range, key }) => key === alignKey && inRange(rangeFromIndex(model.sheet, range), cursor),\n      )?.value\n    : undefined;\n\n  return (\n    <NaturalToolbar.ToggleGroup\n      type='single'\n      value={\n        // TODO(thure): providing `undefined` leaves the last item active which was active rather than showing none.\n        value ?? 'never'\n      }\n      onValueChange={(value: AlignValue) => onAction?.({ key: alignKey, value })}\n    >\n      {alignmentOptions.map(({ value, icon }) => (\n        <ToolbarItem\n          itemType='toggleGroupItem'\n          key={value}\n          value={value}\n          icon={icon}\n          data-testid={`grid.toolbar.${alignKey}.${value}`}\n        >\n          {t('toolbar action label', {\n            key: t(`range key ${alignKey} label`),\n            value: t(`range value ${value} label`),\n          })}\n        </ToolbarItem>\n      ))}\n    </NaturalToolbar.ToggleGroup>\n  );\n};\n\nconst styleOptions: ButtonProps<StyleValue>[] = [\n  { value: 'highlight', icon: 'ph--highlighter--regular' },\n  { value: 'softwrap', icon: 'ph--paragraph--regular' },\n];\n\nconst Styles = () => {\n  const { cursorFallbackRange, model } = useSheetContext();\n  const { onAction } = useToolbarContext('Styles');\n  const { t } = useTranslation(SHEET_PLUGIN);\n\n  // TODO(thure): Can this O(n) call be memoized?\n  const activeValues = cursorFallbackRange\n    ? model.sheet.ranges\n        ?.filter(\n          ({ range, key }) => key === 'style' && inRange(rangeFromIndex(model.sheet, range), cursorFallbackRange.from),\n        )\n        .reduce((acc, { value }) => {\n          acc.add(value);\n          return acc;\n        }, new Set())\n    : undefined;\n\n  return (\n    <>\n      {styleOptions.map(({ value, icon }) => (\n        <ToolbarItem\n          itemType='toggle'\n          key={value}\n          pressed={activeValues?.has(value)}\n          onPressedChange={(nextPressed: boolean) => {\n            onAction?.({ key: 'style', value, unset: !nextPressed });\n          }}\n          icon={icon}\n        >\n          {t('toolbar action label', {\n            key: t(`range key ${styleKey} label`),\n            value: t(`range value ${value} label`),\n          })}\n        </ToolbarItem>\n      ))}\n    </>\n  );\n};\n\n//\n// Actions\n//\n\nconst Actions = () => {\n  const { onAction } = useToolbarContext('Actions');\n  const { cursorFallbackRange, cursor, model } = useSheetContext();\n  const { t } = useTranslation(SHEET_PLUGIN);\n\n  // TODO(thure): Can this O(n) call be memoized?\n  const overlapsCommentAnchor = (model.sheet.threads ?? [])\n    .filter(nonNullable)\n    .filter((thread) => thread.status !== 'resolved')\n    .some((thread) => {\n      if (!cursorFallbackRange) {\n        return false;\n      }\n      return rangeToIndex(model.sheet, cursorFallbackRange) === thread.anchor;\n    });\n\n  const tooltipLabelKey = !cursor\n    ? 'no cursor label'\n    : overlapsCommentAnchor\n      ? 'selection overlaps existing comment label'\n      : 'comment label';\n\n  return (\n    <ToolbarItem\n      itemType='button'\n      value='comment'\n      icon='ph--chat-text--regular'\n      data-testid='editor.toolbar.comment'\n      onClick={() => {\n        if (!cursorFallbackRange) {\n          return;\n        }\n        return onAction?.({\n          key: 'comment',\n          value: rangeToIndex(model.sheet, cursorFallbackRange),\n          cellContent: model.getCellText(cursorFallbackRange.from),\n        });\n      }}\n      disabled={!cursorFallbackRange || overlapsCommentAnchor}\n    >\n      {t(tooltipLabelKey)}\n    </ToolbarItem>\n  );\n};\n\nexport const Toolbar = {\n  Root: ToolbarRoot,\n  Separator: ToolbarSeparator,\n  Alignment,\n  Styles,\n  Actions,\n};\n\nexport { useToolbarContext };\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { SheetContainer } from './SheetContainer';\n\nexport default SheetContainer;\n"],
+  "mappings": "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",
+  "names": ["import_react", "import_react_ui", "FunctionEditor", "model", "cursor", "range", "useSheetContext", "value", "formula", "getCellValue", "isFormula", "graph", "mapFunctionBindingFromId", "mapFormulaIndicesToRefs", "sheet", "String", "React", "div", "className", "rangeToA1Notation", "addressToA1Notation", "Icon", "icon", "classNames", "span", "buttonStyles", "tooltipProps", "side", "ToolbarSeparator", "role", "ToolbarItem", "itemType", "children", "props", "Invoker", "NaturalToolbar", "ToggleGroupItem", "Toggle", "Button", "Tooltip", "Root", "Trigger", "asChild", "variant", "size", "Portal", "Content", "Arrow", "ToolbarContextProvider", "useToolbarContext", "createContext", "ToolbarRoot", "id", "cursorFallbackRange", "hasAttention", "useAttention", "dispatch", "useIntentDispatcher", "handleAction", "useCallback", "action", "key", "index", "ranges", "findIndex", "inRange", "rangeFromIndex", "from", "nextRangeEntity", "rangeToIndex", "push", "splice", "unset", "data", "completeCellRangeToThreadCursor", "name", "cellContent", "subject", "onAction", "alignmentOptions", "Alignment", "t", "useTranslation", "SHEET_PLUGIN", "findLast", "alignKey", "undefined", "ToggleGroup", "type", "onValueChange", "map", "data-testid", "styleOptions", "Styles", "activeValues", "filter", "reduce", "acc", "add", "Set", "pressed", "has", "onPressedChange", "nextPressed", "styleKey", "Actions", "overlapsCommentAnchor", "threads", "nonNullable", "thread", "status", "some", "anchor", "tooltipLabelKey", "onClick", "getCellText", "disabled", "Toolbar", "Separator", "SheetContainer", "space", "ignoreAttention", "useComputeGraph", "SheetProvider", "StackItem", "toolbar", "statusbar", "GridSheet"]
+}