@dxos/plugin-sheet 0.6.11 → 0.6.12-main.15a606f

package/dist/lib/node/SheetContainer-3ZY7MPWJ.cjs

@@ -0,0 +1,279 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var SheetContainer_3ZY7MPWJ_exports = {};
+__export(SheetContainer_3ZY7MPWJ_exports, {
+  default: () => SheetContainer_default,
+  sectionToolbarLayout: () => sectionToolbarLayout
+});
+module.exports = __toCommonJS(SheetContainer_3ZY7MPWJ_exports);
+var import_chunk_OTTD7FBK = require("./chunk-OTTD7FBK.cjs");
+var import_chunk_Q3HBHPRL = require("./chunk-Q3HBHPRL.cjs");
+var import_chunk_BNARJ5GM = require("./chunk-BNARJ5GM.cjs");
+var import_chunk_DD6FIXWC = require("./chunk-DD6FIXWC.cjs");
+var import_react = __toESM(require("react"));
+var import_app_framework = require("@dxos/app-framework");
+var import_echo = require("@dxos/react-client/echo");
+var import_react_ui_attention = require("@dxos/react-ui-attention");
+var import_react_ui_theme = require("@dxos/react-ui-theme");
+var import_react2 = require("@phosphor-icons/react");
+var import_react_context = require("@radix-ui/react-context");
+var import_react3 = __toESM(require("react"));
+var import_react_ui = require("@dxos/react-ui");
+var import_util = require("@dxos/util");
+var import_react4 = __toESM(require("react"));
+var import_react_ui2 = require("@dxos/react-ui");
+var import_react_ui_theme2 = require("@dxos/react-ui-theme");
+var iconStyles = (0, import_react_ui_theme2.getSize)(5);
+var buttonStyles = "min-bs-0 p-2";
+var tooltipProps = {
+  side: "top",
+  classNames: "z-10"
+};
+var ToolbarSeparator = () => /* @__PURE__ */ import_react4.default.createElement("div", {
+  role: "separator",
+  className: "grow"
+});
+var ToolbarButton = ({ Icon, children, ...props }) => {
+  return /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Root, null, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Trigger, {
+    asChild: true
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Toolbar.Button, {
+    variant: "ghost",
+    ...props,
+    classNames: buttonStyles
+  }, /* @__PURE__ */ import_react4.default.createElement(Icon, {
+    className: iconStyles
+  }), /* @__PURE__ */ import_react4.default.createElement("span", {
+    className: "sr-only"
+  }, children))), /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Portal, null, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Content, tooltipProps, children, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Arrow, null))));
+};
+var ToolbarToggleButton = ({ Icon, children, ...props }) => {
+  return /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Root, null, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Trigger, {
+    asChild: true
+  }, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Toolbar.ToggleGroupItem, {
+    variant: "ghost",
+    ...props,
+    classNames: buttonStyles
+  }, /* @__PURE__ */ import_react4.default.createElement(Icon, {
+    className: iconStyles
+  }), /* @__PURE__ */ import_react4.default.createElement("span", {
+    className: "sr-only"
+  }, children))), /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Portal, null, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Content, tooltipProps, children, /* @__PURE__ */ import_react4.default.createElement(import_react_ui2.Tooltip.Arrow, null))));
+};
+var [ToolbarContextProvider, useToolbarContext] = (0, import_react_context.createContext)("Toolbar");
+var ToolbarRoot = ({ children, onAction, classNames }) => {
+  return /* @__PURE__ */ import_react3.default.createElement(ToolbarContextProvider, {
+    onAction
+  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.DensityProvider, {
+    density: "fine"
+  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.ElevationProvider, {
+    elevation: "chrome"
+  }, /* @__PURE__ */ import_react3.default.createElement(import_react_ui.Toolbar.Root, {
+    classNames: [
+      "is-full shrink-0 overflow-x-auto overflow-y-hidden p-1",
+      classNames
+    ]
+  }, children))));
+};
+var formatOptions = [
+  {
+    type: "date",
+    Icon: import_react2.Calendar,
+    getState: (state) => false
+  },
+  {
+    type: "currency",
+    Icon: import_react2.CurrencyDollar,
+    getState: (state) => false
+  }
+];
+var Format = () => {
+  const { onAction } = useToolbarContext("Format");
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_BNARJ5GM.SHEET_PLUGIN);
+  return /* @__PURE__ */ import_react3.default.createElement(import_react_ui.Toolbar.ToggleGroup, {
+    type: "single"
+  }, formatOptions.map(({ type, getState, Icon }) => /* @__PURE__ */ import_react3.default.createElement(ToolbarToggleButton, {
+    key: type,
+    value: type,
+    Icon,
+    // disabled={state?.blockType === 'codeblock'}
+    // onClick={state ? () => onAction?.({ type, data: !getState(state) }) : undefined}
+    onClick: () => onAction?.({
+      type
+    })
+  }, t(`toolbar ${type} label`))));
+};
+var alignmentOptions = [
+  {
+    type: "left",
+    Icon: import_react2.TextAlignLeft,
+    getState: (state) => false
+  },
+  {
+    type: "center",
+    Icon: import_react2.TextAlignCenter,
+    getState: (state) => false
+  },
+  {
+    type: "right",
+    Icon: import_react2.TextAlignRight,
+    getState: (state) => false
+  }
+];
+var Alignment = () => {
+  const { onAction } = useToolbarContext("Alignment");
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_BNARJ5GM.SHEET_PLUGIN);
+  return /* @__PURE__ */ import_react3.default.createElement(import_react_ui.Toolbar.ToggleGroup, {
+    type: "single"
+  }, alignmentOptions.map(({ type, getState, Icon }) => /* @__PURE__ */ import_react3.default.createElement(ToolbarToggleButton, {
+    key: type,
+    value: type,
+    Icon,
+    // disabled={state?.blockType === 'codeblock'}
+    // onClick={state ? () => onAction?.({ type, data: !getState(state) }) : undefined}
+    onClick: () => onAction?.({
+      type
+    })
+  }, t(`toolbar ${type} label`))));
+};
+var styleOptions = [
+  {
+    type: "clear",
+    Icon: import_react2.Eraser,
+    getState: (state) => false
+  },
+  {
+    type: "highlight",
+    Icon: import_react2.HighlighterCircle,
+    getState: (state) => false
+  }
+];
+var Styles = () => {
+  const { onAction } = useToolbarContext("Alignment");
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_BNARJ5GM.SHEET_PLUGIN);
+  return /* @__PURE__ */ import_react3.default.createElement(import_react_ui.Toolbar.ToggleGroup, {
+    type: "single"
+  }, styleOptions.map(({ type, getState, Icon }) => /* @__PURE__ */ import_react3.default.createElement(ToolbarToggleButton, {
+    key: type,
+    value: type,
+    Icon,
+    // disabled={state?.blockType === 'codeblock'}
+    // onClick={state ? () => onAction?.({ type, data: !getState(state) }) : undefined}
+    onClick: () => onAction?.({
+      type
+    })
+  }, t(`toolbar ${type} label`))));
+};
+var Actions = () => {
+  const { onAction } = useToolbarContext("Actions");
+  const { cursor, range, model } = (0, import_chunk_OTTD7FBK.useSheetContext)();
+  const { t } = (0, import_react_ui.useTranslation)(import_chunk_BNARJ5GM.SHEET_PLUGIN);
+  const overlapsCommentAnchor = (model.sheet.threads ?? []).filter(import_util.nonNullable).filter((thread) => thread.status !== "resolved").some((thread) => {
+    if (!cursor) {
+      return false;
+    }
+    return (0, import_chunk_OTTD7FBK.addressToIndex)(model.sheet, cursor) === thread.anchor;
+  });
+  const hasCursor = !!cursor;
+  const cursorOnly = hasCursor && !range && !overlapsCommentAnchor;
+  const tooltipLabelKey = !hasCursor ? "no cursor label" : overlapsCommentAnchor ? "selection overlaps existing comment label" : range ? "comment ranges not supported label" : "comment label";
+  return /* @__PURE__ */ import_react3.default.createElement(ToolbarButton, {
+    value: "comment",
+    Icon: import_react2.ChatText,
+    "data-testid": "editor.toolbar.comment",
+    onClick: () => {
+      if (!cursor) {
+        return;
+      }
+      return onAction?.({
+        type: "comment",
+        anchor: (0, import_chunk_OTTD7FBK.addressToIndex)(model.sheet, cursor),
+        cellContent: model.getCellText(cursor)
+      });
+    },
+    disabled: !cursorOnly || overlapsCommentAnchor
+  }, t(tooltipLabelKey));
+};
+var Toolbar = {
+  Root: ToolbarRoot,
+  Separator: ToolbarSeparator,
+  Alignment,
+  Format,
+  Styles,
+  Actions
+};
+var attentionFragment = (0, import_react_ui_theme.mx)("group-focus-within/editor:attention-surface group-[[aria-current]]/editor:attention-surface", "group-focus-within/editor:border-separator");
+var sectionToolbarLayout = "bs-[--rail-action] bg-[--sticky-bg] sticky block-start-0 __-block-start-px transition-opacity";
+var SheetContainer = ({ sheet, space, role }) => {
+  const dispatch = (0, import_app_framework.useIntentDispatcher)();
+  const id = (0, import_echo.fullyQualifiedId)(sheet);
+  const isDirectlyAttended = (0, import_react_ui_attention.useIsDirectlyAttended)(id);
+  const handleAction = (0, import_react.useCallback)((action) => {
+    switch (action.type) {
+      case "comment": {
+        void dispatch({
+          action: "dxos.org/plugin/thread/action/create",
+          data: {
+            cursor: action.anchor,
+            name: action.cellContent,
+            subject: sheet
+          }
+        });
+      }
+    }
+  }, [
+    sheet,
+    dispatch
+  ]);
+  return /* @__PURE__ */ import_react.default.createElement("div", {
+    role: "none",
+    className: role === "article" ? "row-span-2 grid grid-rows-subgrid" : void 0
+  }, /* @__PURE__ */ import_react.default.createElement(import_chunk_OTTD7FBK.Sheet.Root, {
+    space,
+    sheet
+  }, /* @__PURE__ */ import_react.default.createElement("div", {
+    role: "none",
+    className: (0, import_react_ui_theme.mx)("flex flex-0 justify-center overflow-x-auto")
+  }, /* @__PURE__ */ import_react.default.createElement(Toolbar.Root, {
+    onAction: handleAction,
+    classNames: (0, import_react_ui_theme.mx)(role === "section" ? [
+      "z-[2] group-focus-within/section:visible",
+      !isDirectlyAttended && "invisible",
+      sectionToolbarLayout
+    ] : "group-focus-within/editor:border-separator group-[[aria-current]]/editor:border-separator")
+  }, /* @__PURE__ */ import_react.default.createElement(Toolbar.Separator, null), /* @__PURE__ */ import_react.default.createElement(Toolbar.Actions, null))), /* @__PURE__ */ import_react.default.createElement("div", {
+    role: "none",
+    className: (0, import_react_ui_theme.mx)(role === "section" && "aspect-square border-is border-bs border-be border-separator", role === "article" && "flex is-full overflow-hidden focus-visible:ring-inset row-span-1 data-[toolbar=disabled]:pbs-2 data-[toolbar=disabled]:row-span-2 border-bs border-separator", import_react_ui_theme.focusRing, attentionFragment)
+  }, /* @__PURE__ */ import_react.default.createElement(import_chunk_OTTD7FBK.Sheet.Main, null))));
+};
+var SheetContainer_default = SheetContainer;
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  sectionToolbarLayout
+});
+//# sourceMappingURL=SheetContainer-3ZY7MPWJ.cjs.map

package/dist/lib/node/SheetContainer-3ZY7MPWJ.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/components/SheetContainer.tsx", "../../../src/components/Toolbar/Toolbar.tsx", "../../../src/components/Toolbar/common.tsx"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport React, { useCallback } from 'react';\n\nimport { useIntentDispatcher } from '@dxos/app-framework';\nimport { fullyQualifiedId } from '@dxos/react-client/echo';\nimport { useIsDirectlyAttended } from '@dxos/react-ui-attention';\nimport { focusRing, mx } from '@dxos/react-ui-theme';\n\nimport { Sheet, type SheetRootProps } from './Sheet';\nimport { Toolbar, type ToolbarAction } from './Toolbar';\n\n// TODO(Zan): Factor out, copied this from MarkdownPlugin.\nconst attentionFragment = mx(\n  'group-focus-within/editor:attention-surface group-[[aria-current]]/editor:attention-surface',\n  'group-focus-within/editor:border-separator',\n);\n\n// TODO(Zan): Factor out, copied this from MarkdownPlugin.\nexport const sectionToolbarLayout =\n  'bs-[--rail-action] bg-[--sticky-bg] sticky block-start-0 __-block-start-px transition-opacity';\n\nconst SheetContainer = ({ sheet, space, role }: SheetRootProps & { role?: string }) => {\n  const dispatch = useIntentDispatcher();\n\n  const id = fullyQualifiedId(sheet);\n  const isDirectlyAttended = useIsDirectlyAttended(id);\n\n  // TODO(Zan): Centralise the toolbar action handler. Current implementation in stories.\n  const handleAction = useCallback(\n    (action: ToolbarAction) => {\n      switch (action.type) {\n        case 'comment': {\n          // TODO(Zan): We shouldn't hardcode the action ID.\n          void dispatch({\n            action: 'dxos.org/plugin/thread/action/create',\n            data: {\n              cursor: action.anchor,\n              name: action.cellContent,\n              subject: sheet,\n            },\n          });\n        }\n      }\n    },\n    [sheet, dispatch],\n  );\n\n  return (\n    <div role='none' className={role === 'article' ? 'row-span-2 grid grid-rows-subgrid' : undefined}>\n      <Sheet.Root space={space} sheet={sheet}>\n        <div role='none' className={mx('flex flex-0 justify-center overflow-x-auto')}>\n          <Toolbar.Root\n            onAction={handleAction}\n            classNames={mx(\n              role === 'section'\n                ? ['z-[2] group-focus-within/section:visible', !isDirectlyAttended && 'invisible', sectionToolbarLayout]\n                : 'group-focus-within/editor:border-separator group-[[aria-current]]/editor:border-separator',\n            )}\n          >\n            {/* TODO(Zan): Restore some of this functionality */}\n            {/* <Toolbar.Styles /> */}\n            {/* <Toolbar.Format /> */}\n            {/* <Toolbar.Alignment /> */}\n            <Toolbar.Separator />\n            <Toolbar.Actions />\n          </Toolbar.Root>\n        </div>\n        <div\n          role='none'\n          className={mx(\n            role === 'section' && 'aspect-square border-is border-bs border-be border-separator',\n            role === 'article' &&\n              'flex is-full overflow-hidden focus-visible:ring-inset row-span-1 data-[toolbar=disabled]:pbs-2 data-[toolbar=disabled]:row-span-2 border-bs border-separator',\n            focusRing,\n            attentionFragment,\n          )}\n        >\n          <Sheet.Main />\n        </div>\n      </Sheet.Root>\n    </div>\n  );\n};\n\nexport default SheetContainer;\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport {\n  type Icon,\n  Calendar,\n  ChatText,\n  CurrencyDollar,\n  Eraser,\n  HighlighterCircle,\n  TextAlignCenter,\n  TextAlignLeft,\n  TextAlignRight,\n} from '@phosphor-icons/react';\nimport { createContext } from '@radix-ui/react-context';\nimport React, { type PropsWithChildren } from 'react';\n\nimport {\n  DensityProvider,\n  ElevationProvider,\n  Toolbar as NaturalToolbar,\n  type ThemedClassName,\n  useTranslation,\n} from '@dxos/react-ui';\nimport { nonNullable } from '@dxos/util';\n\nimport { ToolbarButton, ToolbarSeparator, ToolbarToggleButton } from './common';\nimport { addressToIndex } from '../../defs';\nimport { SHEET_PLUGIN } from '../../meta';\nimport { type Formatting } from '../../types';\nimport { useSheetContext } from '../Sheet/sheet-context';\n\n//\n// Root\n//\n\nexport type ToolbarAction =\n  | { type: 'clear' }\n  | { type: 'highlight' }\n  | { type: 'left' }\n  | { type: 'center' }\n  | { type: 'right' }\n  | { type: 'date' }\n  | { type: 'currency' }\n  | { type: 'comment'; anchor: string; cellContent?: string };\n\nexport type ToolbarActionType = ToolbarAction['type'];\n\nexport type ToolbarActionHandler = (action: ToolbarAction) => void;\n\nexport type ToolbarProps = ThemedClassName<\n  PropsWithChildren<{\n    onAction?: ToolbarActionHandler;\n  }>\n>;\n\nconst [ToolbarContextProvider, useToolbarContext] = createContext<ToolbarProps>('Toolbar');\n\nconst ToolbarRoot = ({ children, onAction, classNames }: ToolbarProps) => {\n  return (\n    <ToolbarContextProvider onAction={onAction}>\n      <DensityProvider density='fine'>\n        <ElevationProvider elevation='chrome'>\n          <NaturalToolbar.Root classNames={['is-full shrink-0 overflow-x-auto overflow-y-hidden p-1', classNames]}>\n            {children}\n          </NaturalToolbar.Root>\n        </ElevationProvider>\n      </DensityProvider>\n    </ToolbarContextProvider>\n  );\n};\n\n// TODO(burdon): Generalize.\n// TODO(burdon): Detect and display current state.\ntype ButtonProps = {\n  type: ToolbarActionType;\n  Icon: Icon;\n  getState: (state: Formatting) => boolean;\n  disabled?: (state: Formatting) => boolean;\n};\n\n//\n// Alignment\n//\n\nconst formatOptions: ButtonProps[] = [\n  { type: 'date', Icon: Calendar, getState: (state) => false },\n  { type: 'currency', Icon: CurrencyDollar, getState: (state) => false },\n];\n\nconst Format = () => {\n  const { onAction } = useToolbarContext('Format');\n  const { t } = useTranslation(SHEET_PLUGIN);\n\n  return (\n    <NaturalToolbar.ToggleGroup\n      type='single'\n      // value={cellStyles.filter(({ getState }) => state && getState(state)).map(({ type }) => type)}\n    >\n      {formatOptions.map(({ type, getState, Icon }) => (\n        <ToolbarToggleButton\n          key={type}\n          value={type}\n          Icon={Icon}\n          // disabled={state?.blockType === 'codeblock'}\n          // onClick={state ? () => onAction?.({ type, data: !getState(state) }) : undefined}\n          onClick={() => onAction?.({ type: type as Exclude<typeof type, 'comment'> })}\n        >\n          {t(`toolbar ${type} label`)}\n        </ToolbarToggleButton>\n      ))}\n    </NaturalToolbar.ToggleGroup>\n  );\n};\n\nconst alignmentOptions: ButtonProps[] = [\n  { type: 'left', Icon: TextAlignLeft, getState: (state) => false },\n  { type: 'center', Icon: TextAlignCenter, getState: (state) => false },\n  { type: 'right', Icon: TextAlignRight, getState: (state) => false },\n];\n\nconst Alignment = () => {\n  const { onAction } = useToolbarContext('Alignment');\n  const { t } = useTranslation(SHEET_PLUGIN);\n\n  return (\n    <NaturalToolbar.ToggleGroup\n      type='single'\n      // value={cellStyles.filter(({ getState }) => state && getState(state)).map(({ type }) => type)}\n    >\n      {alignmentOptions.map(({ type, getState, Icon }) => (\n        <ToolbarToggleButton\n          key={type}\n          value={type}\n          Icon={Icon}\n          // disabled={state?.blockType === 'codeblock'}\n          // onClick={state ? () => onAction?.({ type, data: !getState(state) }) : undefined}\n          onClick={() => onAction?.({ type: type as Exclude<typeof type, 'comment'> })}\n        >\n          {t(`toolbar ${type} label`)}\n        </ToolbarToggleButton>\n      ))}\n    </NaturalToolbar.ToggleGroup>\n  );\n};\n\nconst styleOptions: ButtonProps[] = [\n  { type: 'clear', Icon: Eraser, getState: (state) => false },\n  { type: 'highlight', Icon: HighlighterCircle, getState: (state) => false },\n];\n\nconst Styles = () => {\n  const { onAction } = useToolbarContext('Alignment');\n  const { t } = useTranslation(SHEET_PLUGIN);\n\n  return (\n    <NaturalToolbar.ToggleGroup\n      type='single'\n      // value={cellStyles.filter(({ getState }) => state && getState(state)).map(({ type }) => type)}\n    >\n      {styleOptions.map(({ type, getState, Icon }) => (\n        <ToolbarToggleButton\n          key={type}\n          value={type}\n          Icon={Icon}\n          // disabled={state?.blockType === 'codeblock'}\n          // onClick={state ? () => onAction?.({ type, data: !getState(state) }) : undefined}\n          onClick={() => onAction?.({ type: type as Exclude<typeof type, 'comment'> })}\n        >\n          {t(`toolbar ${type} label`)}\n        </ToolbarToggleButton>\n      ))}\n    </NaturalToolbar.ToggleGroup>\n  );\n};\n\n//\n// Actions\n//\n\nconst Actions = () => {\n  const { onAction } = useToolbarContext('Actions');\n  const { cursor, range, model } = useSheetContext();\n  const { t } = useTranslation(SHEET_PLUGIN);\n\n  const overlapsCommentAnchor = (model.sheet.threads ?? [])\n    .filter(nonNullable)\n    .filter((thread) => thread.status !== 'resolved')\n    .some((thread) => {\n      if (!cursor) {\n        return false;\n      }\n      return addressToIndex(model.sheet, cursor) === thread.anchor;\n    });\n\n  const hasCursor = !!cursor;\n  const cursorOnly = hasCursor && !range && !overlapsCommentAnchor;\n\n  const tooltipLabelKey = !hasCursor\n    ? 'no cursor label'\n    : overlapsCommentAnchor\n      ? 'selection overlaps existing comment label'\n      : range\n        ? 'comment ranges not supported label'\n        : 'comment label';\n\n  return (\n    <ToolbarButton\n      value='comment'\n      Icon={ChatText}\n      data-testid='editor.toolbar.comment'\n      onClick={() => {\n        if (!cursor) {\n          return;\n        }\n        return onAction?.({\n          type: 'comment',\n          anchor: addressToIndex(model.sheet, cursor),\n          cellContent: model.getCellText(cursor),\n        });\n      }}\n      disabled={!cursorOnly || overlapsCommentAnchor}\n    >\n      {t(tooltipLabelKey)}\n    </ToolbarButton>\n  );\n};\n\nexport const Toolbar = {\n  Root: ToolbarRoot,\n  Separator: ToolbarSeparator,\n  Alignment,\n  Format,\n  Styles,\n  Actions,\n};\n\nexport { useToolbarContext };\n", "//\n// Copyright 2024 DXOS.org\n//\n\nimport { type Icon } from '@phosphor-icons/react';\nimport React from 'react';\n\nimport {\n  Toolbar as NaturalToolbar,\n  Tooltip,\n  type ToolbarButtonProps as NaturalToolbarButtonProps,\n  type ToolbarToggleGroupItemProps as NaturalToolbarToggleGroupItemProps,\n} from '@dxos/react-ui';\nimport { getSize } from '@dxos/react-ui-theme';\n\n// TODO(burdon): Factor out in common with react-ui-editor.\n\nexport const iconStyles = getSize(5);\nexport const buttonStyles = 'min-bs-0 p-2';\nexport const tooltipProps = { side: 'top' as const, classNames: 'z-10' };\n\nexport const ToolbarSeparator = () => <div role='separator' className='grow' />;\n\n//\n// ToolbarButton\n//\n\ntype ToolbarButtonProps = NaturalToolbarButtonProps & { Icon: Icon };\n\nexport const ToolbarButton = ({ Icon, children, ...props }: ToolbarButtonProps) => {\n  return (\n    <Tooltip.Root>\n      <Tooltip.Trigger asChild>\n        <NaturalToolbar.Button variant='ghost' {...props} classNames={buttonStyles}>\n          <Icon className={iconStyles} />\n          <span className='sr-only'>{children}</span>\n        </NaturalToolbar.Button>\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// ToolbarToggleButton\n//\n\nexport type ToolbarToggleButtonProps = NaturalToolbarToggleGroupItemProps & { Icon: Icon };\n\nexport const ToolbarToggleButton = ({ Icon, children, ...props }: ToolbarToggleButtonProps) => {\n  return (\n    <Tooltip.Root>\n      <Tooltip.Trigger asChild>\n        <NaturalToolbar.ToggleGroupItem variant='ghost' {...props} classNames={buttonStyles}>\n          <Icon className={iconStyles} />\n          <span className='sr-only'>{children}</span>\n        </NaturalToolbar.ToggleGroupItem>\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"],
+  "mappings": "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",
+  "names": ["import_react", "import_react_ui", "import_react_ui_theme", "iconStyles", "getSize", "buttonStyles", "tooltipProps", "side", "classNames", "ToolbarSeparator", "React", "div", "role", "className", "ToolbarButton", "Icon", "children", "props", "Tooltip", "Root", "Trigger", "asChild", "NaturalToolbar", "Button", "variant", "span", "Portal", "Content", "Arrow", "ToolbarToggleButton", "ToggleGroupItem", "ToolbarContextProvider", "useToolbarContext", "createContext", "ToolbarRoot", "onAction", "DensityProvider", "density", "ElevationProvider", "elevation", "formatOptions", "type", "Calendar", "getState", "state", "CurrencyDollar", "Format", "t", "useTranslation", "SHEET_PLUGIN", "ToggleGroup", "map", "key", "value", "onClick", "alignmentOptions", "TextAlignLeft", "TextAlignCenter", "TextAlignRight", "Alignment", "styleOptions", "Eraser", "HighlighterCircle", "Styles", "Actions", "cursor", "range", "model", "useSheetContext", "overlapsCommentAnchor", "sheet", "threads", "filter", "nonNullable", "thread", "status", "some", "addressToIndex", "anchor", "hasCursor", "cursorOnly", "tooltipLabelKey", "ChatText", "data-testid", "cellContent", "getCellText", "disabled", "Toolbar", "Separator", "attentionFragment", "mx", "sectionToolbarLayout", "SheetContainer", "space", "dispatch", "useIntentDispatcher", "id", "fullyQualifiedId", "isDirectlyAttended", "useIsDirectlyAttended", "handleAction", "useCallback", "action", "data", "name", "subject", "undefined", "Sheet", "focusRing", "Main"]
+}

package/dist/lib/node/{chunk-BJ6ZD7MN.cjs → chunk-BNARJ5GM.cjs}

@@ -1,9 +1,7 @@
 "use strict";
-var __create = Object.create;
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __getOwnPropNames = Object.getOwnPropertyNames;
-var __getProtoOf = Object.getPrototypeOf;
 var __hasOwnProp = Object.prototype.hasOwnProperty;
 var __export = (target, all) => {
   for (var name in all)
@@ -17,35 +15,24 @@ var __copyProps = (to, from, except, desc) => {
   }
   return to;
 };
-var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
-  // If the importer is in node compatibility mode or this is not an ESM
-  // file that has been converted to a CommonJS file using a Babel-
-  // compatible transform (i.e. "__esModule" has not been set), then set
-  // "default" to the CommonJS "module.exports" for node compatibility.
-  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
-  mod
-));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var chunk_BJ6ZD7MN_exports = {};
-__export(chunk_BJ6ZD7MN_exports, {
+var chunk_BNARJ5GM_exports = {};
+__export(chunk_BNARJ5GM_exports, {
   SHEET_PLUGIN: () => SHEET_PLUGIN,
   meta_default: () => meta_default
 });
-module.exports = __toCommonJS(chunk_BJ6ZD7MN_exports);
-var import_react = require("@phosphor-icons/react");
-var import_react2 = __toESM(require("react"));
+module.exports = __toCommonJS(chunk_BNARJ5GM_exports);
 var import_app_framework = require("@dxos/app-framework");
 var SHEET_PLUGIN = "dxos.org/plugin/sheet";
 var meta_default = (0, import_app_framework.pluginMeta)({
   id: SHEET_PLUGIN,
   name: "Sheet",
   description: "A simple spreadsheet plugin.",
-  iconComponent: (props) => /* @__PURE__ */ import_react2.default.createElement(import_react.GridNine, props),
-  iconSymbol: "ph--grid-nine--regular"
+  icon: "ph--grid-nine--regular"
 });
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   SHEET_PLUGIN,
   meta_default
 });
-//# sourceMappingURL=chunk-BJ6ZD7MN.cjs.map
+//# sourceMappingURL=chunk-BNARJ5GM.cjs.map

package/dist/lib/node/chunk-BNARJ5GM.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/meta.tsx"],
+  "sourcesContent": ["//\n// Copyright 2023 DXOS.org\n//\n\nimport { pluginMeta } from '@dxos/app-framework';\n\nexport const SHEET_PLUGIN = 'dxos.org/plugin/sheet';\n\nexport default pluginMeta({\n  id: SHEET_PLUGIN,\n  name: 'Sheet',\n  description: 'A simple spreadsheet plugin.',\n  icon: 'ph--grid-nine--regular',\n});\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAIA,2BAA2B;AAEpB,IAAMA,eAAe;AAE5B,IAAA,mBAAeC,iCAAW;EACxBC,IAAIF;EACJG,MAAM;EACNC,aAAa;EACbC,MAAM;AACR,CAAA;",
+  "names": ["SHEET_PLUGIN", "pluginMeta", "id", "name", "description", "icon"]
+}