@dxos/react-ui-menu 0.8.2-main.fbd8ed0 → 0.8.2-staging.7ac8446

package/dist/types/src/components/ToolbarMenu.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { type ToolbarRootProps } from '@dxos/react-ui';
 import { type MenuScopedProps } from './MenuContext';
-import { type MenuAction, type MenuItem, type MenuItemGroup, type MenuActionProperties, type MenuMultipleSelectActionGroup, type MenuSingleSelectActionGroup } from '../types';
+import { type MenuItem, type MenuItemGroup, type MenuActionProperties, type MenuMultipleSelectActionGroup, type MenuSingleSelectActionGroup } from '../defs';
 export type ToolbarMenuDropdownMenuActionGroup = Omit<MenuActionProperties, 'variant' | 'icon'> & {
     variant: 'dropdownMenu';
     icon: string;
@@ -16,9 +16,5 @@ export type ToolbarMenuActionGroupProps = {
     group: MenuItemGroup<ToolbarMenuActionGroupProperties>;
     items?: MenuItem[];
 };
-export type ToolbarMenuActionProps = {
-    group: MenuItemGroup<ToolbarMenuActionGroupProperties>;
-    action: MenuAction;
-};
 export declare const ToolbarMenu: ({ __menuScope, classNames, ...props }: MenuScopedProps<ToolbarMenuProps>) => React.JSX.Element;
 //# sourceMappingURL=ToolbarMenu.d.ts.map

package/dist/types/src/components/ToolbarMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToolbarMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/ToolbarMenu.tsx"],"names":[],"mappings":"AAIA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAmC,KAAK,gBAAgB,EAAkB,MAAM,gBAAgB,CAAC;AAKxG,OAAO,EAAE,KAAK,eAAe,EAAyB,MAAM,eAAe,CAAC;AAE5E,OAAO,EACL,KAAK,UAAU,EACf,KAAK,QAAQ,EAGb,KAAK,aAAa,EAClB,KAAK,oBAAoB,EACzB,KAAK,6BAA6B,EAClC,KAAK,2BAA2B,EACjC,MAAM,UAAU,CAAC;AAElB,MAAM,MAAM,kCAAkC,GAAG,IAAI,CAAC,oBAAoB,EAAE,SAAS,GAAG,MAAM,CAAC,GAAG;IAChG,OAAO,EAAE,cAAc,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,iCAAiC,GAAG,IAAI,CAAC,oBAAoB,EAAE,SAAS,CAAC,GAAG;IACtF,OAAO,EAAE,aAAa,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG,CAC3C,kCAAkC,GAClC,iCAAiC,CACpC,GACC,CAAC,2BAA2B,GAAG,6BAA6B,CAAC,CAAC;AAEhE,MAAM,MAAM,gBAAgB,GAAG,gBAAgB,CAAC;AAEhD,MAAM,MAAM,2BAA2B,GAAG;IACxC,KAAK,EAAE,aAAa,CAAC,gCAAgC,CAAC,CAAC;IACvD,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG;IACnC,KAAK,EAAE,aAAa,CAAC,gCAAgC,CAAC,CAAC;IACvD,MAAM,EAAE,UAAU,CAAC;CACpB,CAAC;AAyGF,eAAO,MAAM,WAAW,GAAI,uCAAuC,eAAe,CAAC,gBAAgB,CAAC,sBA2BnG,CAAC"}
+{"version":3,"file":"ToolbarMenu.d.ts","sourceRoot":"","sources":["../../../../src/components/ToolbarMenu.tsx"],"names":[],"mappings":"AAIA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAEnD,OAAO,EAAyD,KAAK,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAK9G,OAAO,EAAE,KAAK,eAAe,EAAyB,MAAM,eAAe,CAAC;AAC5E,OAAO,EAEL,KAAK,QAAQ,EAGb,KAAK,aAAa,EAClB,KAAK,oBAAoB,EACzB,KAAK,6BAA6B,EAClC,KAAK,2BAA2B,EACjC,MAAM,SAAS,CAAC;AAEjB,MAAM,MAAM,kCAAkC,GAAG,IAAI,CAAC,oBAAoB,EAAE,SAAS,GAAG,MAAM,CAAC,GAAG;IAChG,OAAO,EAAE,cAAc,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,MAAM,MAAM,iCAAiC,GAAG,IAAI,CAAC,oBAAoB,EAAE,SAAS,CAAC,GAAG;IACtF,OAAO,EAAE,aAAa,CAAC;CACxB,CAAC;AAEF,MAAM,MAAM,gCAAgC,GAAG,CAC3C,kCAAkC,GAClC,iCAAiC,CACpC,GACC,CAAC,2BAA2B,GAAG,6BAA6B,CAAC,CAAC;AAEhE,MAAM,MAAM,gBAAgB,GAAG,gBAAgB,CAAC;AAEhD,MAAM,MAAM,2BAA2B,GAAG;IACxC,KAAK,EAAE,aAAa,CAAC,gCAAgC,CAAC,CAAC;IACvD,KAAK,CAAC,EAAE,QAAQ,EAAE,CAAC;CACpB,CAAC;AAiHF,eAAO,MAAM,WAAW,0CAA2C,eAAe,CAAC,gBAAgB,CAAC,sBA2BnG,CAAC"}

package/dist/types/src/{types.d.ts → defs.d.ts}

@@ -18,6 +18,7 @@ export type MenuItemGroupProperties = {
     iconOnly?: boolean;
 };
 export type MenuAction<P extends {} = {}> = Action<P & MenuActionProperties>;
+export type MenuActionHandler<A extends Node = MenuAction> = (action: A) => void;
 export declare const MenuSeparatorType: "@dxos/react-ui-toolbar/separator";
 export type MenuSeparator = Node<never, Pick<ToolbarSeparatorProps, 'variant'>> & {
     type: typeof MenuSeparatorType;
@@ -35,9 +36,10 @@ export type MenuItemGroup<P extends Record<string, any> = Record<string, any>> =
 export declare const isMenuGroup: (node: Node) => node is MenuItemGroup;
 export type MenuItem = MenuSeparator | MenuAction | MenuItemGroup;
 export type MenuItemsResolver = (group?: MenuItemGroup) => MenuItem[] | null;
-export type MenuContextValue = {
-    useGroupItems: MenuItemsResolver;
+export type MenuContextValue<A extends Node = MenuAction> = {
+    resolveGroupItems: MenuItemsResolver;
     iconSize: IconButtonProps['size'];
+    onAction: MenuActionHandler<A>;
     attendableId?: string;
 };
-//# sourceMappingURL=types.d.ts.map
+//# sourceMappingURL=defs.d.ts.map

package/dist/types/src/defs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defs.d.ts","sourceRoot":"","sources":["../../../src/defs.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,IAAI,EAAE,KAAK,MAAM,EAAE,KAAK,WAAW,EAAqB,MAAM,iBAAiB,CAAC;AAC9F,OAAO,EAAE,KAAK,qBAAqB,EAAE,KAAK,KAAK,EAAE,KAAK,eAAe,EAAE,KAAK,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAEnH,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,QAAQ,GAAG,QAAQ,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,cAAc,CAAC;CAC7B,CAAC;AAEF,MAAM,MAAM,uBAAuB,GAAG;IACpC,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,EAAE,GAAG,EAAE,IAAI,MAAM,CAAC,CAAC,GAAG,oBAAoB,CAAC,CAAC;AAE7E,MAAM,MAAM,iBAAiB,CAAC,CAAC,SAAS,IAAI,GAAG,UAAU,IAAI,CAAC,MAAM,EAAE,CAAC,KAAK,IAAI,CAAC;AAEjF,eAAO,MAAM,iBAAiB,EAAG,kCAA2C,CAAC;AAE7E,MAAM,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,qBAAqB,EAAE,SAAS,CAAC,CAAC,GAAG;IAChF,IAAI,EAAE,OAAO,iBAAiB,CAAC;CAChC,CAAC;AAEF,eAAO,MAAM,WAAW,SAAU,IAAI,KAAG,IAAI,IAAI,aAAgD,CAAC;AAElG,MAAM,MAAM,2BAA2B,GAAG;IAAE,iBAAiB,EAAE,QAAQ,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC;AACzF,MAAM,MAAM,6BAA6B,GAAG;IAAE,iBAAiB,EAAE,UAAU,CAAC;IAAC,KAAK,EAAE,MAAM,EAAE,CAAA;CAAE,CAAC;AAE/F,MAAM,MAAM,aAAa,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,GAAG,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,IAAI,WAAW,CAAC,CAAC,CAAC,CAAC;AAEhG,eAAO,MAAM,WAAW,SAAU,IAAI,KAAG,IAAI,IAAI,aAAgD,CAAC;AAElG,MAAM,MAAM,QAAQ,GAAG,aAAa,GAAG,UAAU,GAAG,aAAa,CAAC;AAElE,MAAM,MAAM,iBAAiB,GAAG,CAAC,KAAK,CAAC,EAAE,aAAa,KAAK,QAAQ,EAAE,GAAG,IAAI,CAAC;AAE7E,MAAM,MAAM,gBAAgB,CAAC,CAAC,SAAS,IAAI,GAAG,UAAU,IAAI;IAC1D,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,QAAQ,EAAE,eAAe,CAAC,MAAM,CAAC,CAAC;IAClC,QAAQ,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB,CAAC"}

package/dist/types/src/hooks.d.ts

@@ -0,0 +1,17 @@
+import { type NodeArg } from '@dxos/app-graph';
+import { type MenuItem, type MenuItemGroup } from './defs';
+type Edge = {
+    source: string;
+    target: string;
+};
+export type ActionGraphNodes = NodeArg<any>[];
+export type ActionGraphEdges = Edge[];
+export type ActionGraphProps = {
+    nodes: ActionGraphNodes;
+    edges: ActionGraphEdges;
+};
+export declare const useMenuActions: (actionCreator: () => ActionGraphProps) => {
+    resolveGroupItems: (sourceNode?: MenuItemGroup) => MenuItem[] | null;
+};
+export {};
+//# sourceMappingURL=hooks.d.ts.map

package/dist/types/src/hooks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hooks.d.ts","sourceRoot":"","sources":["../../../src/hooks.ts"],"names":[],"mappings":"AAOA,OAAO,EAAS,KAAK,OAAO,EAAa,MAAM,iBAAiB,CAAC;AAEjE,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,QAAQ,CAAC;AAE3D,KAAK,IAAI,GAAG;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AA6B/C,MAAM,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,CAAC,EAAE,CAAC;AAC9C,MAAM,MAAM,gBAAgB,GAAG,IAAI,EAAE,CAAC;AACtC,MAAM,MAAM,gBAAgB,GAAG;IAAE,KAAK,EAAE,gBAAgB,CAAC;IAAC,KAAK,EAAE,gBAAgB,CAAA;CAAE,CAAC;AAEpF,eAAO,MAAM,cAAc,kBAAmB,MAAM,gBAAgB;qCAgBnD,aAAa;CAW7B,CAAC"}

package/dist/types/src/index.d.ts

@@ -1,5 +1,5 @@
 export * from './components';
+export * from './defs';
 export * from './hooks';
-export * from './types';
 export { createMenuAction, createMenuItemGroup, createLineSeparator, createGapSeparator } from './util';
 //# sourceMappingURL=index.d.ts.map

package/dist/types/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAIA,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,OAAO,EAAE,gBAAgB,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,QAAQ,CAAC"}

package/dist/types/src/{components → testing}/Menus.stories.d.ts

@@ -2,7 +2,7 @@ import '@dxos-theme';
 import React from 'react';
 declare const _default: {
     title: string;
-    component: ({ __menuScope, classNames, ...props }: import("./MenuContext").MenuScopedProps<import("./ToolbarMenu").ToolbarMenuProps>) => React.JSX.Element;
+    component: ({ __menuScope, classNames, ...props }: import("..").MenuScopedProps<import("..").ToolbarMenuProps>) => React.JSX.Element;
     decorators: import("@storybook/react").Decorator[];
     parameters: {
         translations: readonly [{

package/dist/types/src/testing/Menus.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Menus.stories.d.ts","sourceRoot":"","sources":["../../../../src/testing/Menus.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AACrB,OAAO,KAAsB,MAAM,OAAO,CAAC;;;;;;;;;;;;;AAc3C,wBAKE;AAOF,eAAO,MAAM,YAAY;;CAcxB,CAAC;AAEF,eAAO,MAAM,OAAO;;CAQnB,CAAC;AAEF,eAAO,MAAM,qBAAqB;;CASjC,CAAC"}

package/dist/types/src/testing/index.d.ts

@@ -1,2 +1,26 @@
-export * from './generator';
+import { type Action, ACTION_TYPE, ACTION_GROUP_TYPE } from '@dxos/app-graph';
+import { type MenuAction, type MenuItemGroup, type MenuItem } from '../defs';
+import { type ActionGraphProps } from '../hooks';
+export type CreateActionsParams = Partial<{
+    type?: typeof ACTION_TYPE | typeof ACTION_GROUP_TYPE;
+    callback: () => void;
+    count: number;
+}>;
+export declare const createActions: (params?: CreateActionsParams) => import("@dxos/live-object").ReactiveObject<{
+    id: string;
+    type: "dxos.org/type/GraphActionGroup" | "dxos.org/type/GraphAction";
+    data: symbol | (() => void);
+    properties: {
+        variant?: string | undefined;
+        label: string;
+        icon: string;
+        disabled: boolean;
+    };
+}>[];
+export declare const createNestedActions: () => ActionGraphProps;
+export declare const createNestedActionsResolver: (groupParams?: CreateActionsParams, params?: CreateActionsParams) => {
+    resolveGroupItems: (groupNode?: MenuItemGroup) => MenuItem[] | null;
+};
+export declare const mutateActionsOnInterval: (actions: Action[]) => NodeJS.Timeout;
+export declare const useMutateActions: (actions: MenuAction[]) => void;
 //# sourceMappingURL=index.d.ts.map

package/dist/types/src/testing/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/testing/index.ts"],"names":[],"mappings":"AAIA,cAAc,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/testing/index.ts"],"names":[],"mappings":"AAMA,OAAO,EAAE,KAAK,MAAM,EAAuB,WAAW,EAAE,iBAAiB,EAAqB,MAAM,iBAAiB,CAAC;AAKtH,OAAO,EAAE,KAAK,UAAU,EAAE,KAAK,aAAa,EAAE,KAAK,QAAQ,EAAE,MAAM,SAAS,CAAC;AAC7E,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAEjD,MAAM,MAAM,mBAAmB,GAAG,OAAO,CAAC;IACxC,IAAI,CAAC,EAAE,OAAO,WAAW,GAAG,OAAO,iBAAiB,CAAC;IACrD,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;CACf,CAAC,CAAC;AAqBH,eAAO,MAAM,aAAa,YAAa,mBAAmB;;;0BAvBxC,IAAI;;;;;;;IAyCrB,CAAC;AAEF,eAAO,MAAM,mBAAmB,wBAY/B,CAAC;AAEF,eAAO,MAAM,2BAA2B,iBAAkB,mBAAmB,WAAW,mBAAmB;oCAgBlE,aAAa,KACE,QAAQ,EAAE,GAAG,IAAI;CAExE,CAAC;AAEF,eAAO,MAAM,uBAAuB,YAAa,MAAM,EAAE,mBAUxD,CAAC;AAEF,eAAO,MAAM,gBAAgB,YAAa,UAAU,EAAE,SAI9C,CAAC"}

package/dist/types/src/util.d.ts

@@ -1,8 +1,8 @@
 import { actionGroupSymbol, type ActionLike } from '@dxos/app-graph';
-import { type MenuActionProperties, type MenuItemGroupProperties } from './types';
+import { type MenuActionProperties, type MenuItemGroupProperties } from './defs';
 export declare const getShortcut: (action: ActionLike) => any;
 export declare const fallbackIcon = "ph--placeholder--regular";
-export declare const createMenuAction: <P extends {} = {}>(id: string, invoke: () => void, properties: P & MenuActionProperties) => {
+export declare const createMenuAction: <P extends {} = {}>(id: string, properties: P & MenuActionProperties) => {
     id: string;
     type: string;
     properties: P & MenuActionProperties;

package/dist/types/src/util.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../src/util.ts"],"names":[],"mappings":"AAIA,OAAO,EAAkC,iBAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGrG,OAAO,EAEL,KAAK,oBAAoB,EAEzB,KAAK,uBAAuB,EAE7B,MAAM,SAAS,CAAC;AAEjB,eAAO,MAAM,WAAW,GAAI,QAAQ,UAAU,QAI7C,CAAC;AAEF,eAAO,MAAM,YAAY,6BAA6B,CAAC;AAEvD,eAAO,MAAM,gBAAgB,GAAI,CAAC,SAAS,EAAE,GAAG,EAAE,EAChD,IAAI,MAAM,EACV,QAAQ,MAAM,IAAI,EAClB,YAAY,CAAC,GAAG,oBAAoB;;;;gBADtB,IAAI;CAQK,CAAC;AAE1B,eAAO,MAAM,mBAAmB,GAC9B,CAAC,SAAS,uBAAuB,GAAG,uBAAuB,GAAG,OAAO,CAAC,oBAAoB,CAAC,EAE3F,IAAI,MAAM,EACV,YAAY,CAAC;;;;;CAOa,CAAC;AAE7B,eAAO,MAAM,kBAAkB,GAAI,KAAI,MAAc,EAAE,SAAQ,MAAe;;;;;;;cAMrD,KAAK;;;;;;CAI5B,CAAC;AAEH,eAAO,MAAM,mBAAmB,GAAI,KAAI,MAAe,EAAE,SAAQ,MAAe;;;;;;;cAMvD,KAAK;;;;;;CAI5B,CAAC"}
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../src/util.ts"],"names":[],"mappings":"AAIA,OAAO,EAAkC,iBAAiB,EAAE,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAGrG,OAAO,EAEL,KAAK,oBAAoB,EAEzB,KAAK,uBAAuB,EAE7B,MAAM,QAAQ,CAAC;AAEhB,eAAO,MAAM,WAAW,WAAY,UAAU,QAI7C,CAAC;AAEF,eAAO,MAAM,YAAY,6BAA6B,CAAC;AAMvD,eAAO,MAAM,gBAAgB,GAAI,CAAC,SAAS,EAAE,WAAW,MAAM,cAAc,CAAC,GAAG,oBAAoB;;;;;CAM3E,CAAC;AAE1B,eAAO,MAAM,mBAAmB,GAC9B,CAAC,SAAS,uBAAuB,gEAE7B,MAAM,cACE,CAAC;;;;;CAOa,CAAC;AAE7B,eAAO,MAAM,kBAAkB,QAAQ,MAAM,WAAkB,MAAM;;;;;;;cAM5C,KAAK;;;;;;CAI5B,CAAC;AAEH,eAAO,MAAM,mBAAmB,QAAQ,MAAM,WAAmB,MAAM;;;;;;;cAM9C,KAAK;;;;;;CAI5B,CAAC"}

package/dist/types/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"version":"5.8.3"}
+{"version":"5.7.3"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dxos/react-ui-menu",
-  "version": "0.8.2-main.fbd8ed0",
+  "version": "0.8.2-staging.7ac8446",
   "description": "Components for facilitating reactive and consistent menus.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
@@ -27,34 +27,28 @@
     "@preact/signals-react": "^1.3.8",
     "@radix-ui/react-context": "1.1.1",
     "@radix-ui/react-use-controllable-state": "1.1.0",
-    "@dxos/app-graph": "0.8.2-main.fbd8ed0",
-    "@dxos/keyboard": "0.8.2-main.fbd8ed0",
-    "@dxos/react-ui-attention": "0.8.2-main.fbd8ed0",
-    "@dxos/util": "0.8.2-main.fbd8ed0"
+    "@dxos/app-graph": "0.8.2-staging.7ac8446",
+    "@dxos/keyboard": "0.8.2-staging.7ac8446",
+    "@dxos/react-ui-attention": "0.8.2-staging.7ac8446",
+    "@dxos/util": "0.8.2-staging.7ac8446"
   },
   "devDependencies": {
-    "@effect-rx/rx-react": "^0.34.1",
-    "@effect/platform": "0.80.12",
     "@types/react": "~18.2.0",
     "@types/react-dom": "~18.2.0",
-    "effect": "3.14.21",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
     "vite": "5.4.7",
-    "@dxos/live-object": "0.8.2-main.fbd8ed0",
-    "@dxos/react-ui": "0.8.2-main.fbd8ed0",
-    "@dxos/random": "0.8.2-main.fbd8ed0",
-    "@dxos/react-ui-theme": "0.8.2-main.fbd8ed0",
-    "@dxos/storybook-utils": "0.8.2-main.fbd8ed0"
+    "@dxos/live-object": "0.8.2-staging.7ac8446",
+    "@dxos/random": "0.8.2-staging.7ac8446",
+    "@dxos/react-ui": "0.8.2-staging.7ac8446",
+    "@dxos/react-ui-theme": "0.8.2-staging.7ac8446",
+    "@dxos/storybook-utils": "0.8.2-staging.7ac8446"
   },
   "peerDependencies": {
-    "@effect-rx/rx-react": "^0.34.1",
-    "@effect/platform": "0.80.12",
-    "effect": "^3.13.3",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/react-ui-theme": "0.8.2-main.fbd8ed0",
-    "@dxos/react-ui": "0.8.2-main.fbd8ed0"
+    "@dxos/react-ui": "0.8.2-staging.7ac8446",
+    "@dxos/react-ui-theme": "0.8.2-staging.7ac8446"
   },
   "publishConfig": {
     "access": "public"

package/src/components/ActionLabel.tsx

@@ -4,18 +4,20 @@
 
 import React from 'react';
 
-import { type Action as GraphAction, type ActionGroup } from '@dxos/app-graph';
+import { type Action, type ActionGroup } from '@dxos/app-graph';
 import { keySymbols } from '@dxos/keyboard';
-import { toLocalizedString, useTranslation, type TFunction } from '@dxos/react-ui';
+import { toLocalizedString, useTranslation } from '@dxos/react-ui';
 import { mx, descriptionText } from '@dxos/react-ui-theme';
 
+import { type MenuActionProperties } from '../defs';
 import { translationKey } from '../translations';
-import { type MenuActionProperties } from '../types';
 import { getShortcut } from '../util';
 
-type Action = GraphAction<MenuActionProperties> | ActionGroup<Omit<MenuActionProperties, 'variant'>>;
-
-export const ActionLabel = ({ action }: { action: Action }) => {
+export const ActionLabel = ({
+  action,
+}: {
+  action: Action<MenuActionProperties> | ActionGroup<Omit<MenuActionProperties, 'variant'>>;
+}) => {
   const shortcut = getShortcut(action);
   const { t } = useTranslation(translationKey);
 
@@ -26,8 +28,3 @@ export const ActionLabel = ({ action }: { action: Action }) => {
     </>
   );
 };
-
-export const actionLabel = (action: Action, t: TFunction) => {
-  const shortcut = getShortcut(action);
-  return `${toLocalizedString(action.properties!.label, t)}${shortcut ? ` (${keySymbols(shortcut).join('')})` : ''}`;
-};

package/src/components/DropdownMenu.tsx

@@ -9,13 +9,12 @@ import { DropdownMenu as NaturalDropdownMenu, Icon, type DropdownMenuRootProps }
 
 import { ActionLabel } from './ActionLabel';
 import { type MenuScopedProps, useMenu, useMenuItems } from './MenuContext';
-import { type MenuAction, type MenuItem, type MenuItemGroup } from '../types';
+import { type MenuAction, type MenuItem, type MenuItemGroup } from '../defs';
 
 export type DropdownMenuProps = DropdownMenuRootProps & {
   group?: MenuItemGroup;
   items?: MenuItem[];
   suppressNextTooltip?: MutableRefObject<boolean>;
-  caller?: string;
 };
 
 const DropdownMenuItem = ({
@@ -50,7 +49,6 @@ const DropdownMenuRoot = ({
   defaultOpen,
   onOpenChange,
   suppressNextTooltip,
-  caller,
   children,
   __menuScope,
   ...naturalProps
@@ -61,6 +59,8 @@ const DropdownMenuRoot = ({
     onChange: onOpenChange,
   });
 
+  const { onAction } = useMenu('DropdownMenuRoot', __menuScope);
+
   const handleActionClick = useCallback(
     (action: MenuAction, event: MouseEvent) => {
       if (action.properties?.disabled) {
@@ -72,9 +72,9 @@ const DropdownMenuRoot = ({
         suppressNextTooltip.current = true;
       }
       setOptionsMenuOpen(false);
-      void action.data?.({ parent: group, caller });
+      onAction?.(action);
     },
-    [suppressNextTooltip, group, caller],
+    [onAction],
   );
 
   const items = useMenuItems(group, propsItems);

package/src/components/MenuContext.tsx

@@ -5,7 +5,15 @@
 import { createContextScope, type Scope } from '@radix-ui/react-context';
 import React, { type PropsWithChildren, useMemo } from 'react';
 
-import { type MenuContextValue, type MenuItem, type MenuItemGroup } from '../types';
+import { type Node } from '@dxos/app-graph';
+
+import {
+  type MenuActionHandler,
+  type MenuAction,
+  type MenuContextValue,
+  type MenuItem,
+  type MenuItemGroup,
+} from '../defs';
 
 export type MenuScopedProps<P> = P & { __menuScope?: Scope };
 
@@ -13,24 +21,32 @@ const MENU_NAME = 'GraphMenu';
 
 const [createMenuContext, createMenuScope] = createContextScope(MENU_NAME, []);
 
-const [MenuContextProvider, useMenu] = createMenuContext<MenuContextValue>(MENU_NAME);
+const [MenuContextProvider, useMenu] = createMenuContext<MenuContextValue<any>>(MENU_NAME);
 
-export const menuContextDefaults: MenuContextValue = {
+export const menuContextDefaults: MenuContextValue<MenuAction> = {
   iconSize: 5,
-  useGroupItems: () => null,
+  onAction: () => {},
+  resolveGroupItems: () => null,
 };
 
 const useMenuScope = createMenuScope();
 
-const MenuProvider = ({
+const MenuProvider = <A extends Node = MenuAction>({
   children,
-  useGroupItems = menuContextDefaults.useGroupItems,
+  resolveGroupItems = menuContextDefaults.resolveGroupItems,
+  onAction = menuContextDefaults.onAction as MenuActionHandler<A>,
   iconSize = menuContextDefaults.iconSize,
   attendableId,
-}: PropsWithChildren<Partial<MenuContextValue>>) => {
+}: PropsWithChildren<Partial<MenuContextValue<A>>>) => {
   const { scope } = useMenuScope(undefined);
   return (
-    <MenuContextProvider useGroupItems={useGroupItems} iconSize={iconSize} attendableId={attendableId} scope={scope}>
+    <MenuContextProvider
+      resolveGroupItems={resolveGroupItems}
+      onAction={onAction}
+      iconSize={iconSize}
+      attendableId={attendableId}
+      scope={scope}
+    >
       {children}
     </MenuContextProvider>
   );
@@ -42,9 +58,8 @@ export const useMenuItems = (
   consumerName: string = 'useMenuItemConsumer',
   __menuScope?: Scope,
 ) => {
-  const { useGroupItems } = useMenu(consumerName, __menuScope);
-  const groupItems = useGroupItems(group);
-  return useMemo(() => propsItems ?? groupItems ?? undefined, [propsItems, groupItems]);
+  const { resolveGroupItems } = useMenu(consumerName, __menuScope);
+  return useMemo(() => propsItems ?? resolveGroupItems?.(group) ?? undefined, [propsItems, group, resolveGroupItems]);
 };
 
 export { useMenu, createMenuScope, MenuProvider };

package/src/components/ToolbarMenu.tsx

@@ -4,13 +4,12 @@
 
 import React, { useCallback, useRef } from 'react';
 
-import { Icon, Toolbar as NaturalToolbar, type ToolbarRootProps, useTranslation } from '@dxos/react-ui';
+import { Icon, type IconButtonProps, Toolbar as NaturalToolbar, type ToolbarRootProps } from '@dxos/react-ui';
 import { useAttention } from '@dxos/react-ui-attention';
 
-import { actionLabel, ActionLabel } from './ActionLabel';
+import { ActionLabel } from './ActionLabel';
 import { DropdownMenu } from './DropdownMenu';
 import { type MenuScopedProps, useMenu, useMenuItems } from './MenuContext';
-import { translationKey } from '../translations';
 import {
   type MenuAction,
   type MenuItem,
@@ -20,7 +19,7 @@ import {
   type MenuActionProperties,
   type MenuMultipleSelectActionGroup,
   type MenuSingleSelectActionGroup,
-} from '../types';
+} from '../defs';
 
 export type ToolbarMenuDropdownMenuActionGroup = Omit<MenuActionProperties, 'variant' | 'icon'> & {
   variant: 'dropdownMenu';
@@ -45,19 +44,15 @@ export type ToolbarMenuActionGroupProps = {
   items?: MenuItem[];
 };
 
-export type ToolbarMenuActionProps = {
-  group: MenuItemGroup<ToolbarMenuActionGroupProperties>;
-  action: MenuAction;
-};
-
 const ActionToolbarItem = ({ action, __menuScope }: MenuScopedProps<{ action: MenuAction }>) => {
-  const { iconSize } = useMenu('ActionToolbarItem', __menuScope);
-  const { t } = useTranslation(translationKey);
-  const handleClick = useCallback(() => action.data?.(), [action]);
+  const { onAction, iconSize } = useMenu('ActionToolbarItem', __menuScope);
+  const handleClick = useCallback(() => {
+    onAction?.(action);
+  }, [action, onAction]);
   const { icon, iconOnly = true, disabled, testId, hidden, classNames } = action.properties;
   const Root = icon ? NaturalToolbar.IconButton : NaturalToolbar.Button;
   const rootProps = icon
-    ? { icon, size: iconSize, iconOnly, label: actionLabel(action, t) }
+    ? { icon, size: iconSize, iconOnly, label: <ActionLabel action={action} /> }
     : { children: <ActionLabel action={action} /> };
   return hidden ? null : (
     <Root
@@ -66,7 +61,7 @@ const ActionToolbarItem = ({ action, __menuScope }: MenuScopedProps<{ action: Me
       onClick={handleClick}
       variant='ghost'
       {...(testId && { 'data-testid': testId })}
-      {...(rootProps as any)}
+      {...(rootProps as IconButtonProps)}
       classNames={classNames}
     />
   );
@@ -79,7 +74,6 @@ const DropdownMenuToolbarItem = ({
 }: MenuScopedProps<ToolbarMenuActionGroupProps>) => {
   const { iconOnly, disabled, testId } = group.properties;
   const suppressNextTooltip = useRef(false);
-  const { t } = useTranslation(translationKey);
   const { iconSize } = useMenu('DropdownMenuToolbarItem', __menuScope);
   const items = useMenuItems(group, propsItems, 'DropdownMenuToolbarItem', __menuScope);
   const activeItem = items?.find((item) => !!(item as MenuAction).properties.checked);
@@ -89,13 +83,15 @@ const DropdownMenuToolbarItem = ({
       (activeItem as MenuAction)?.properties.icon) ||
     group.properties.icon;
   const Root = icon ? NaturalToolbar.IconButton : NaturalToolbar.Button;
-  const labelAction = (group.properties as any).applyActive && activeItem ? (activeItem as MenuAction) : group;
+  const label = (
+    <ActionLabel action={(group.properties as any).applyActive && activeItem ? (activeItem as MenuAction) : group} />
+  );
   const rootProps = icon
-    ? { icon, size: iconSize, iconOnly, label: actionLabel(labelAction, t), caretDown: true, suppressNextTooltip }
+    ? { icon, size: iconSize, iconOnly, label, caretDown: true, suppressNextTooltip }
     : {
         children: (
           <>
-            <ActionLabel action={labelAction} />
+            {label}
             <Icon size={3} icon='ph--caret-down--bold' classNames='mis-1' />
           </>
         ),
@@ -103,20 +99,26 @@ const DropdownMenuToolbarItem = ({
   return (
     <DropdownMenu.Root group={group} items={items} suppressNextTooltip={suppressNextTooltip}>
       <DropdownMenu.Trigger asChild>
-        <Root variant='ghost' disabled={disabled} {...(rootProps as any)} {...(testId && { 'data-testid': testId })} />
+        <Root
+          variant='ghost'
+          disabled={disabled}
+          {...(rootProps as IconButtonProps)}
+          {...(testId && { 'data-testid': testId })}
+        />
       </DropdownMenu.Trigger>
     </DropdownMenu.Root>
   );
 };
 
-const ToggleGroupItem = ({ group, action, __menuScope }: MenuScopedProps<ToolbarMenuActionProps>) => {
-  const { iconSize } = useMenu('ToggleGroupItem', __menuScope);
-  const { t } = useTranslation(translationKey);
+const ToggleGroupItem = ({ action, __menuScope }: MenuScopedProps<{ action: MenuAction }>) => {
+  const { iconSize, onAction } = useMenu('ToggleGroupItem', __menuScope);
   const { icon, iconOnly = true, disabled, testId, hidden, classNames } = action.properties;
-  const handleClick = useCallback(() => action.data?.({ parent: group }), [action, group]);
+  const handleClick = useCallback(() => {
+    onAction?.(action);
+  }, [action, onAction]);
   const Root = icon ? NaturalToolbar.ToggleGroupIconItem : NaturalToolbar.ToggleGroupItem;
   const rootProps = icon
-    ? { icon, size: iconSize, iconOnly, label: actionLabel(action, t) }
+    ? { icon, size: iconSize, iconOnly, label: <ActionLabel action={action} /> }
     : { children: <ActionLabel action={action} /> };
   return hidden ? null : (
     <Root
@@ -126,7 +128,7 @@ const ToggleGroupItem = ({ group, action, __menuScope }: MenuScopedProps<Toolbar
       onClick={handleClick}
       variant='ghost'
       {...(testId && { 'data-testid': testId })}
-      {...(rootProps as any)}
+      {...(rootProps as IconButtonProps)}
       classNames={classNames}
     />
   );
@@ -146,7 +148,7 @@ const ToggleGroupToolbarItem = ({
       {
         // TODO(thure): Handle other menu item types.
         (items as MenuAction[]).map((action) => (
-          <ToggleGroupItem key={action.id} group={group} action={action} />
+          <ToggleGroupItem key={action.id} action={action} />
         ))
       }
     </NaturalToolbar.ToggleGroup>
@@ -160,7 +162,7 @@ export const ToolbarMenu = ({ __menuScope, classNames, ...props }: MenuScopedPro
   return (
     <NaturalToolbar.Root
       {...props}
-      classNames={['p-1', !hasAttention && '[&>*]:opacity-20 !bg-transparent', classNames]}
+      classNames={['p-0 pointer-fine:p-1 attention-surface', !hasAttention && 'opacity-20', classNames]}
     >
       {items?.map((item: MenuItem, i: number) =>
         isSeparator(item) ? (

package/src/{types.ts → defs.ts}

@@ -26,6 +26,8 @@ export type MenuItemGroupProperties = {
 
 export type MenuAction<P extends {} = {}> = Action<P & MenuActionProperties>;
 
+export type MenuActionHandler<A extends Node = MenuAction> = (action: A) => void;
+
 export const MenuSeparatorType = '@dxos/react-ui-toolbar/separator' as const;
 
 export type MenuSeparator = Node<never, Pick<ToolbarSeparatorProps, 'variant'>> & {
@@ -45,8 +47,9 @@ export type MenuItem = MenuSeparator | MenuAction | MenuItemGroup;
 
 export type MenuItemsResolver = (group?: MenuItemGroup) => MenuItem[] | null;
 
-export type MenuContextValue = {
-  useGroupItems: MenuItemsResolver;
+export type MenuContextValue<A extends Node = MenuAction> = {
+  resolveGroupItems: MenuItemsResolver;
   iconSize: IconButtonProps['size'];
+  onAction: MenuActionHandler<A>;
   attendableId?: string;
 };

package/src/{hooks/useMenuActions.ts → hooks.ts}

@@ -2,15 +2,16 @@
 // Copyright 2025 DXOS.org
 //
 
-import { RegistryContext, useRxValue } from '@effect-rx/rx-react';
 import { useSignalEffect } from '@preact/signals-react';
-import { useCallback, useContext, useState } from 'react';
+import { useCallback, useState } from 'react';
 
-import { type Edge, type Edges, Graph, type NodeArg, type Node, ROOT_ID } from '@dxos/app-graph';
+import { Graph, type NodeArg, type Node } from '@dxos/app-graph';
 
-import { type MenuItem, type MenuItemGroup } from '../types';
+import { type MenuItem, type MenuItemGroup } from './defs';
 
-const edgesArrayToRecord = (edges: Edge[]): Record<string, Edges> => {
+type Edge = { source: string; target: string };
+
+const edgesArrayToRecord = (edges: { source: string; target: string }[]): Record<string, string[]> => {
   return Object.fromEntries(
     Object.entries(
       edges.reduce((acc: Record<string, { inbound: string[]; outbound: string[] }>, { source, target }) => {
@@ -33,7 +34,7 @@ const edgesArrayToRecord = (edges: Edge[]): Record<string, Edges> => {
 
         return acc;
       }, {}),
-    ),
+    ).map(([id, { outbound }]): [string, string[]] => [id, outbound]),
   );
 };
 
@@ -42,31 +43,30 @@ export type ActionGraphEdges = Edge[];
 export type ActionGraphProps = { nodes: ActionGraphNodes; edges: ActionGraphEdges };
 
 export const useMenuActions = (actionCreator: () => ActionGraphProps) => {
-  const registry = useContext(RegistryContext);
   const initialMenuGraphProps = actionCreator();
 
   const [graph] = useState(
-    new Graph({
-      registry,
-      nodes: initialMenuGraphProps.nodes as Node[],
-      edges: edgesArrayToRecord(initialMenuGraphProps.edges),
-    }),
+    new Graph({ nodes: initialMenuGraphProps.nodes as Node[], edges: edgesArrayToRecord(initialMenuGraphProps.edges) }),
   );
 
-  // TODO(wittjosiah): Remove dependence on signals.
   useSignalEffect(() => {
     const menuGraphProps = actionCreator();
-    graph.addNodes(menuGraphProps.nodes);
-    graph.addEdges(menuGraphProps.edges);
+    // @ts-ignore
+    graph._addNodes(menuGraphProps.nodes);
+    // @ts-ignore
+    graph._addEdges(menuGraphProps.edges);
   });
 
-  const useGroupItems = useCallback(
-    (sourceNode?: MenuItemGroup) => {
-      const items = useRxValue(graph.connections(sourceNode?.id || ROOT_ID)) as MenuItem[];
-      return items;
+  const resolveGroupItems = useCallback(
+    (sourceNode: MenuItemGroup = graph.root as MenuItemGroup) => {
+      if (graph) {
+        return (graph.nodes(sourceNode, { filter: (n): n is any => true }) || null) as MenuItem[] | null;
+      } else {
+        return null;
+      }
     },
     [graph],
   );
 
-  return { useGroupItems };
+  return { resolveGroupItems };
 };

package/src/index.ts

@@ -3,6 +3,6 @@
 //
 
 export * from './components';
+export * from './defs';
 export * from './hooks';
-export * from './types';
 export { createMenuAction, createMenuItemGroup, createLineSeparator, createGapSeparator } from './util';