pmx-canvas 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (226) hide show
  1. package/CHANGELOG.md +38 -0
  2. package/LICENSE +21 -0
  3. package/Readme.md +865 -0
  4. package/dist/canvas/global.css +3173 -0
  5. package/dist/canvas/index.js +183 -0
  6. package/dist/json-render/index.css +2 -0
  7. package/dist/json-render/index.js +389 -0
  8. package/dist/types/cli/agent.d.ts +13 -0
  9. package/dist/types/cli/index.d.ts +2 -0
  10. package/dist/types/cli/watch.d.ts +5 -0
  11. package/dist/types/client/App.d.ts +1 -0
  12. package/dist/types/client/canvas/AttentionHistory.d.ts +1 -0
  13. package/dist/types/client/canvas/AttentionToast.d.ts +1 -0
  14. package/dist/types/client/canvas/CanvasNode.d.ts +8 -0
  15. package/dist/types/client/canvas/CanvasViewport.d.ts +8 -0
  16. package/dist/types/client/canvas/CommandPalette.d.ts +4 -0
  17. package/dist/types/client/canvas/ContextMenu.d.ts +24 -0
  18. package/dist/types/client/canvas/ContextPinBar.d.ts +1 -0
  19. package/dist/types/client/canvas/ContextPinHud.d.ts +1 -0
  20. package/dist/types/client/canvas/DockedNode.d.ts +4 -0
  21. package/dist/types/client/canvas/EdgeLayer.d.ts +8 -0
  22. package/dist/types/client/canvas/ExpandedNodeOverlay.d.ts +1 -0
  23. package/dist/types/client/canvas/FocusFieldLayer.d.ts +1 -0
  24. package/dist/types/client/canvas/Minimap.d.ts +23 -0
  25. package/dist/types/client/canvas/SelectionBar.d.ts +1 -0
  26. package/dist/types/client/canvas/ShortcutOverlay.d.ts +3 -0
  27. package/dist/types/client/canvas/SnapshotPanel.d.ts +7 -0
  28. package/dist/types/client/canvas/snap-guides.d.ts +23 -0
  29. package/dist/types/client/canvas/use-node-drag.d.ts +15 -0
  30. package/dist/types/client/canvas/use-node-resize.d.ts +15 -0
  31. package/dist/types/client/canvas/use-pan-zoom.d.ts +16 -0
  32. package/dist/types/client/ext-app/bridge.d.ts +161 -0
  33. package/dist/types/client/icons.d.ts +70 -0
  34. package/dist/types/client/index.d.ts +1 -0
  35. package/dist/types/client/nodes/ContextNode.d.ts +34 -0
  36. package/dist/types/client/nodes/ExtAppFrame.d.ts +18 -0
  37. package/dist/types/client/nodes/FileNode.d.ts +5 -0
  38. package/dist/types/client/nodes/GroupNode.d.ts +6 -0
  39. package/dist/types/client/nodes/ImageNode.d.ts +10 -0
  40. package/dist/types/client/nodes/InlineFormatBar.d.ts +7 -0
  41. package/dist/types/client/nodes/InlineMarkdownEditor.d.ts +14 -0
  42. package/dist/types/client/nodes/LedgerNode.d.ts +4 -0
  43. package/dist/types/client/nodes/MarkdownNode.d.ts +6 -0
  44. package/dist/types/client/nodes/McpAppNode.d.ts +4 -0
  45. package/dist/types/client/nodes/MdFormatBar.d.ts +8 -0
  46. package/dist/types/client/nodes/PromptNode.d.ts +5 -0
  47. package/dist/types/client/nodes/ResponseNode.d.ts +5 -0
  48. package/dist/types/client/nodes/StatusNode.d.ts +4 -0
  49. package/dist/types/client/nodes/StatusSummary.d.ts +4 -0
  50. package/dist/types/client/nodes/TraceNode.d.ts +4 -0
  51. package/dist/types/client/nodes/WebpageNode.d.ts +5 -0
  52. package/dist/types/client/nodes/image-warnings.d.ts +6 -0
  53. package/dist/types/client/nodes/inline-editor-commands.d.ts +11 -0
  54. package/dist/types/client/nodes/md-format.d.ts +25 -0
  55. package/dist/types/client/state/attention-bridge.d.ts +3 -0
  56. package/dist/types/client/state/attention-store.d.ts +25 -0
  57. package/dist/types/client/state/canvas-store.d.ts +74 -0
  58. package/dist/types/client/state/intent-bridge.d.ts +158 -0
  59. package/dist/types/client/state/sse-bridge.d.ts +5 -0
  60. package/dist/types/client/theme/tokens.d.ts +27 -0
  61. package/dist/types/client/types.d.ts +40 -0
  62. package/dist/types/client/utils/ext-app-tool-result.d.ts +1 -0
  63. package/dist/types/client/utils/placement.d.ts +1 -0
  64. package/dist/types/client/utils/platform.d.ts +2 -0
  65. package/dist/types/json-render/catalog.d.ts +815 -0
  66. package/dist/types/json-render/charts/components.d.ts +54 -0
  67. package/dist/types/json-render/charts/definitions.d.ts +103 -0
  68. package/dist/types/json-render/charts/extra-components.d.ts +58 -0
  69. package/dist/types/json-render/charts/extra-definitions.d.ts +181 -0
  70. package/dist/types/json-render/renderer/index.d.ts +16 -0
  71. package/dist/types/json-render/schema.d.ts +46 -0
  72. package/dist/types/json-render/server.d.ts +55 -0
  73. package/dist/types/mcp/server.d.ts +22 -0
  74. package/dist/types/server/agent-context.d.ts +21 -0
  75. package/dist/types/server/artifact-paths.d.ts +3 -0
  76. package/dist/types/server/canvas-operations.d.ts +154 -0
  77. package/dist/types/server/canvas-provenance.d.ts +13 -0
  78. package/dist/types/server/canvas-schema.d.ts +49 -0
  79. package/dist/types/server/canvas-serialization.d.ts +25 -0
  80. package/dist/types/server/canvas-state.d.ts +174 -0
  81. package/dist/types/server/canvas-validation.d.ts +33 -0
  82. package/dist/types/server/chart-template.d.ts +29 -0
  83. package/dist/types/server/code-graph.d.ts +67 -0
  84. package/dist/types/server/context-cards.d.ts +24 -0
  85. package/dist/types/server/diagram-presets.d.ts +28 -0
  86. package/dist/types/server/ext-app-call-registry.d.ts +16 -0
  87. package/dist/types/server/ext-app-tool-result.d.ts +1 -0
  88. package/dist/types/server/file-watcher.d.ts +16 -0
  89. package/dist/types/server/index.d.ts +243 -0
  90. package/dist/types/server/mcp-app-candidate.d.ts +25 -0
  91. package/dist/types/server/mcp-app-host.d.ts +65 -0
  92. package/dist/types/server/mcp-app-runtime.d.ts +47 -0
  93. package/dist/types/server/mutation-history.d.ts +105 -0
  94. package/dist/types/server/placement.d.ts +37 -0
  95. package/dist/types/server/server.d.ts +103 -0
  96. package/dist/types/server/spatial-analysis.d.ts +87 -0
  97. package/dist/types/server/trace-manager.d.ts +48 -0
  98. package/dist/types/server/web-artifacts.d.ts +50 -0
  99. package/dist/types/server/webpage-node.d.ts +25 -0
  100. package/dist/types/shared/auto-arrange.d.ts +29 -0
  101. package/dist/types/shared/ext-app-tool-result.d.ts +9 -0
  102. package/dist/types/shared/placement.d.ts +26 -0
  103. package/dist/types/shared/semantic-attention.d.ts +97 -0
  104. package/package.json +109 -0
  105. package/skills/data-analysis/SKILL.md +324 -0
  106. package/skills/doc-coauthoring/SKILL.md +375 -0
  107. package/skills/frontend-design/SKILL.md +45 -0
  108. package/skills/json-render-codegen/SKILL.md +112 -0
  109. package/skills/json-render-core/SKILL.md +265 -0
  110. package/skills/json-render-ink/SKILL.md +273 -0
  111. package/skills/json-render-mcp/SKILL.md +132 -0
  112. package/skills/json-render-react/SKILL.md +264 -0
  113. package/skills/json-render-shadcn/SKILL.md +159 -0
  114. package/skills/playwright-cli/SKILL.md +67 -0
  115. package/skills/pmx-canvas/SKILL.md +668 -0
  116. package/skills/pmx-canvas/evals/evals.json +186 -0
  117. package/skills/pmx-canvas-testing/SKILL.md +78 -0
  118. package/skills/published-consumer-e2e/SKILL.md +43 -0
  119. package/skills/published-consumer-e2e/scripts/run-published-consumer-e2e.sh +241 -0
  120. package/skills/web-artifacts-builder/SKILL.md +80 -0
  121. package/skills/web-artifacts-builder/scripts/bundle-artifact.sh +167 -0
  122. package/skills/web-artifacts-builder/scripts/init-artifact.sh +425 -0
  123. package/skills/web-artifacts-builder/scripts/shadcn-components.tar.gz +0 -0
  124. package/skills/web-design-guidelines/SKILL.md +39 -0
  125. package/src/cli/agent.ts +2144 -0
  126. package/src/cli/index.ts +622 -0
  127. package/src/cli/watch.ts +88 -0
  128. package/src/client/App.tsx +507 -0
  129. package/src/client/canvas/AttentionHistory.tsx +81 -0
  130. package/src/client/canvas/AttentionToast.tsx +19 -0
  131. package/src/client/canvas/CanvasNode.tsx +363 -0
  132. package/src/client/canvas/CanvasViewport.tsx +590 -0
  133. package/src/client/canvas/CommandPalette.tsx +302 -0
  134. package/src/client/canvas/ContextMenu.tsx +601 -0
  135. package/src/client/canvas/ContextPinBar.tsx +25 -0
  136. package/src/client/canvas/ContextPinHud.tsx +22 -0
  137. package/src/client/canvas/DockedNode.tsx +66 -0
  138. package/src/client/canvas/EdgeLayer.tsx +280 -0
  139. package/src/client/canvas/ExpandedNodeOverlay.tsx +260 -0
  140. package/src/client/canvas/FocusFieldLayer.tsx +107 -0
  141. package/src/client/canvas/Minimap.tsx +301 -0
  142. package/src/client/canvas/SelectionBar.tsx +69 -0
  143. package/src/client/canvas/ShortcutOverlay.tsx +69 -0
  144. package/src/client/canvas/SnapshotPanel.tsx +236 -0
  145. package/src/client/canvas/snap-guides.ts +170 -0
  146. package/src/client/canvas/use-node-drag.ts +51 -0
  147. package/src/client/canvas/use-node-resize.ts +59 -0
  148. package/src/client/canvas/use-pan-zoom.ts +191 -0
  149. package/src/client/ext-app/bridge.ts +542 -0
  150. package/src/client/icons.tsx +424 -0
  151. package/src/client/index.tsx +7 -0
  152. package/src/client/nodes/ContextNode.tsx +412 -0
  153. package/src/client/nodes/ExtAppFrame.tsx +509 -0
  154. package/src/client/nodes/FileNode.tsx +256 -0
  155. package/src/client/nodes/GroupNode.tsx +39 -0
  156. package/src/client/nodes/ImageNode.tsx +160 -0
  157. package/src/client/nodes/InlineFormatBar.tsx +169 -0
  158. package/src/client/nodes/InlineMarkdownEditor.tsx +123 -0
  159. package/src/client/nodes/LedgerNode.tsx +37 -0
  160. package/src/client/nodes/MarkdownNode.tsx +359 -0
  161. package/src/client/nodes/McpAppNode.tsx +85 -0
  162. package/src/client/nodes/MdFormatBar.tsx +109 -0
  163. package/src/client/nodes/PromptNode.tsx +597 -0
  164. package/src/client/nodes/ResponseNode.tsx +153 -0
  165. package/src/client/nodes/StatusNode.tsx +84 -0
  166. package/src/client/nodes/StatusSummary.tsx +38 -0
  167. package/src/client/nodes/TraceNode.tsx +120 -0
  168. package/src/client/nodes/WebpageNode.tsx +288 -0
  169. package/src/client/nodes/image-warnings.ts +95 -0
  170. package/src/client/nodes/inline-editor-commands.ts +37 -0
  171. package/src/client/nodes/md-format.ts +206 -0
  172. package/src/client/state/attention-bridge.ts +328 -0
  173. package/src/client/state/attention-store.ts +73 -0
  174. package/src/client/state/canvas-store.ts +631 -0
  175. package/src/client/state/intent-bridge.ts +315 -0
  176. package/src/client/state/sse-bridge.ts +965 -0
  177. package/src/client/theme/global.css +3173 -0
  178. package/src/client/theme/tokens.ts +72 -0
  179. package/src/client/types-shims.d.ts +5 -0
  180. package/src/client/types.ts +81 -0
  181. package/src/client/utils/ext-app-tool-result.ts +4 -0
  182. package/src/client/utils/placement.ts +4 -0
  183. package/src/client/utils/platform.ts +2 -0
  184. package/src/json-render/catalog.ts +256 -0
  185. package/src/json-render/charts/components.tsx +198 -0
  186. package/src/json-render/charts/definitions.ts +81 -0
  187. package/src/json-render/charts/extra-components.tsx +267 -0
  188. package/src/json-render/charts/extra-definitions.ts +145 -0
  189. package/src/json-render/renderer/index.css +174 -0
  190. package/src/json-render/renderer/index.tsx +86 -0
  191. package/src/json-render/schema.ts +62 -0
  192. package/src/json-render/server.ts +597 -0
  193. package/src/mcp/server.ts +1377 -0
  194. package/src/server/agent-context.ts +242 -0
  195. package/src/server/artifact-paths.ts +17 -0
  196. package/src/server/canvas-operations.ts +1279 -0
  197. package/src/server/canvas-provenance.ts +243 -0
  198. package/src/server/canvas-schema.ts +432 -0
  199. package/src/server/canvas-serialization.ts +95 -0
  200. package/src/server/canvas-state.ts +1134 -0
  201. package/src/server/canvas-validation.ts +114 -0
  202. package/src/server/chart-template.ts +449 -0
  203. package/src/server/code-graph.ts +370 -0
  204. package/src/server/context-cards.ts +31 -0
  205. package/src/server/diagram-presets.ts +71 -0
  206. package/src/server/ext-app-call-registry.ts +77 -0
  207. package/src/server/ext-app-tool-result.ts +4 -0
  208. package/src/server/file-watcher.ts +121 -0
  209. package/src/server/index.ts +647 -0
  210. package/src/server/mcp-app-candidate.ts +174 -0
  211. package/src/server/mcp-app-host.ts +814 -0
  212. package/src/server/mcp-app-runtime.ts +459 -0
  213. package/src/server/mutation-history.ts +350 -0
  214. package/src/server/placement.ts +125 -0
  215. package/src/server/server.ts +3846 -0
  216. package/src/server/spatial-analysis.ts +356 -0
  217. package/src/server/trace-manager.ts +333 -0
  218. package/src/server/web-artifacts/scripts/bundle-artifact.sh +167 -0
  219. package/src/server/web-artifacts/scripts/init-artifact.sh +426 -0
  220. package/src/server/web-artifacts/scripts/shadcn-components.tar.gz +0 -0
  221. package/src/server/web-artifacts.ts +442 -0
  222. package/src/server/webpage-node.ts +328 -0
  223. package/src/shared/auto-arrange.ts +439 -0
  224. package/src/shared/ext-app-tool-result.ts +76 -0
  225. package/src/shared/placement.ts +81 -0
  226. package/src/shared/semantic-attention.ts +598 -0
@@ -0,0 +1,13 @@
1
+ #!/usr/bin/env bun
2
+ /**
3
+ * Agent-native CLI for pmx-canvas.
4
+ *
5
+ * Designed for non-interactive use by coding agents:
6
+ * - Every input is a flag (no interactive prompts)
7
+ * - JSON output by default
8
+ * - Progressive --help discovery
9
+ * - Fail fast with actionable errors
10
+ * - Idempotent operations where possible
11
+ * - --yes for destructive actions, --dry-run for preview
12
+ */
13
+ export declare function runAgentCli(args: string[]): Promise<void>;
@@ -0,0 +1,2 @@
1
+ #!/usr/bin/env bun
2
+ export {};
@@ -0,0 +1,5 @@
1
+ import { ALL_SEMANTIC_WATCH_EVENT_TYPES, formatCompactWatchEvent, SemanticWatchReducer, type SemanticWatchEvent, type SemanticWatchEventType, type SseMessage } from '../shared/semantic-attention.js';
2
+ export { ALL_SEMANTIC_WATCH_EVENT_TYPES, formatCompactWatchEvent, SemanticWatchReducer, };
3
+ export type { SemanticWatchEvent, SemanticWatchEventType, SseMessage, };
4
+ export declare function parseSemanticEventFilter(raw: string | undefined): Set<SemanticWatchEventType>;
5
+ export declare function parseSseStream(stream: ReadableStream<Uint8Array>): AsyncGenerator<SseMessage>;
@@ -0,0 +1 @@
1
+ export declare function App(): import("preact").JSX.Element;
@@ -0,0 +1 @@
1
+ export declare function AttentionHistory(): import("preact/src").JSX.Element | null;
@@ -0,0 +1 @@
1
+ export declare function AttentionToast(): import("preact/src").JSX.Element | null;
@@ -0,0 +1,8 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ interface CanvasNodeProps {
3
+ node: CanvasNodeState;
4
+ children: preact.ComponentChildren;
5
+ onContextMenu?: (e: MouseEvent, nodeId: string) => void;
6
+ }
7
+ export declare function CanvasNode({ node, children, onContextMenu }: CanvasNodeProps): import("preact/src").JSX.Element;
8
+ export {};
@@ -0,0 +1,8 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ interface CanvasViewportProps {
3
+ onNodeContextMenu?: (e: MouseEvent, nodeId: string) => void;
4
+ onCanvasContextMenu?: (e: MouseEvent, canvasX: number, canvasY: number) => void;
5
+ }
6
+ export declare function getRenderableWorldNodes(allNodes: Iterable<CanvasNodeState>, focusedNodeId: string | null): CanvasNodeState[];
7
+ export declare function CanvasViewport({ onNodeContextMenu, onCanvasContextMenu }: CanvasViewportProps): import("preact/src").JSX.Element;
8
+ export {};
@@ -0,0 +1,4 @@
1
+ export declare function CommandPalette({ onClose, onToggleMinimap, }: {
2
+ onClose: () => void;
3
+ onToggleMinimap: () => void;
4
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,24 @@
1
+ export type MenuState = {
2
+ kind: 'node';
3
+ x: number;
4
+ y: number;
5
+ nodeId: string;
6
+ } | {
7
+ kind: 'canvas';
8
+ x: number;
9
+ y: number;
10
+ canvasX: number;
11
+ canvasY: number;
12
+ };
13
+ export declare function useContextMenu(): {
14
+ menu: MenuState | null;
15
+ openNodeMenu: (e: MouseEvent, nodeId: string) => void;
16
+ openCanvasMenu: (e: MouseEvent, canvasX: number, canvasY: number) => void;
17
+ closeMenu: () => void;
18
+ };
19
+ interface ContextMenuProps {
20
+ menu: MenuState;
21
+ onClose: () => void;
22
+ }
23
+ export declare function ContextMenu({ menu, onClose }: ContextMenuProps): import("preact").JSX.Element | null;
24
+ export {};
@@ -0,0 +1 @@
1
+ export declare function ContextPinBar(): import("preact/src").JSX.Element | null;
@@ -0,0 +1 @@
1
+ export declare function ContextPinHud(): import("preact/src").JSX.Element | null;
@@ -0,0 +1,4 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function DockedNode({ node }: {
3
+ node: CanvasNodeState;
4
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,8 @@
1
+ import type { Signal } from '@preact/signals';
2
+ import type { CanvasEdge, CanvasNodeState } from '../types';
3
+ interface EdgeLayerProps {
4
+ nodes: Signal<Map<string, CanvasNodeState>>;
5
+ edges: Signal<Map<string, CanvasEdge>>;
6
+ }
7
+ export declare function EdgeLayer({ nodes, edges }: EdgeLayerProps): import("preact/src").JSX.Element | null;
8
+ export {};
@@ -0,0 +1 @@
1
+ export declare function ExpandedNodeOverlay(): import("preact/src").JSX.Element | null;
@@ -0,0 +1 @@
1
+ export declare function FocusFieldLayer(): import("preact/src").JSX.Element | null;
@@ -0,0 +1,23 @@
1
+ import type { Signal } from '@preact/signals';
2
+ import type { CanvasEdge, CanvasNodeState, ViewportState } from '../types';
3
+ interface MinimapBounds {
4
+ minX: number;
5
+ minY: number;
6
+ maxX: number;
7
+ maxY: number;
8
+ }
9
+ interface MinimapFrame {
10
+ bounds: MinimapBounds;
11
+ scale: number;
12
+ }
13
+ export declare function computeMinimapFrame(nodeMap: Map<string, CanvasNodeState>, currentViewport: ViewportState, containerWidth: number, containerHeight: number): MinimapFrame;
14
+ interface MinimapProps {
15
+ viewport: Signal<ViewportState>;
16
+ nodes: Signal<Map<string, CanvasNodeState>>;
17
+ edges: Signal<Map<string, CanvasEdge>>;
18
+ onNavigate: (x: number, y: number) => void;
19
+ containerWidth: number;
20
+ containerHeight: number;
21
+ }
22
+ export declare function Minimap({ viewport, nodes, edges, onNavigate, containerWidth, containerHeight, }: MinimapProps): import("preact/src").JSX.Element;
23
+ export {};
@@ -0,0 +1 @@
1
+ export declare function SelectionBar(): import("preact/src").JSX.Element | null;
@@ -0,0 +1,3 @@
1
+ export declare function ShortcutOverlay({ onClose }: {
2
+ onClose: () => void;
3
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,7 @@
1
+ export declare function SnapshotPanel({ open, onClose, anchorRef, }: {
2
+ open: boolean;
3
+ onClose: () => void;
4
+ anchorRef: {
5
+ current: HTMLButtonElement | null;
6
+ };
7
+ }): import("preact/src").JSX.Element | null;
@@ -0,0 +1,23 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export interface GuideLine {
3
+ axis: 'x' | 'y';
4
+ pos: number;
5
+ from: number;
6
+ to: number;
7
+ }
8
+ export interface SnapResult {
9
+ x: number;
10
+ y: number;
11
+ guides: GuideLine[];
12
+ }
13
+ /** Active guide lines to render. Null when not dragging. */
14
+ export declare const activeGuides: import("@preact/signals-core").Signal<GuideLine[] | null>;
15
+ /** Call at drag-start to pre-compute reference edges from stationary nodes. */
16
+ export declare function buildSnapCache(dragId: string, allNodes: Iterable<CanvasNodeState>): void;
17
+ /** Call at drag-end to clear the cache. */
18
+ export declare function clearSnapCache(): void;
19
+ /**
20
+ * Snap a dragging node's proposed position to cached reference edges.
21
+ * Must call buildSnapCache() before the first call in a drag session.
22
+ */
23
+ export declare function snapToGuides(proposedX: number, proposedY: number, nodeW: number, nodeH: number): SnapResult;
@@ -0,0 +1,15 @@
1
+ import type { Signal } from '@preact/signals';
2
+ import type { ViewportState } from '../types';
3
+ interface NodeDragOptions {
4
+ nodeId: string;
5
+ viewport: Signal<ViewportState>;
6
+ onMove: (id: string, x: number, y: number) => void;
7
+ onDragEnd: () => void;
8
+ }
9
+ /**
10
+ * Hook for dragging canvas nodes by their title bar.
11
+ * Converts screen-space pointer delta to canvas-space position delta
12
+ * (accounting for current viewport scale).
13
+ */
14
+ export declare function useNodeDrag({ nodeId, viewport, onMove, onDragEnd }: NodeDragOptions): (e: PointerEvent, currentX: number, currentY: number) => void;
15
+ export {};
@@ -0,0 +1,15 @@
1
+ import type { Signal } from '@preact/signals';
2
+ import type { ViewportState } from '../types';
3
+ interface NodeResizeOptions {
4
+ nodeId: string;
5
+ viewport: Signal<ViewportState>;
6
+ onResize: (id: string, width: number, height: number) => void;
7
+ onResizeEnd: () => void;
8
+ }
9
+ /**
10
+ * Hook for resizing canvas nodes via a corner drag handle.
11
+ * Converts screen-space pointer delta to canvas-space size delta
12
+ * (accounting for current viewport scale).
13
+ */
14
+ export declare function useNodeResize({ nodeId, viewport, onResize, onResizeEnd }: NodeResizeOptions): (e: PointerEvent, currentWidth: number, currentHeight: number) => void;
15
+ export {};
@@ -0,0 +1,16 @@
1
+ import type { Signal } from '@preact/signals';
2
+ import type { ViewportState } from '../types';
3
+ interface PanZoomOptions {
4
+ viewport: Signal<ViewportState>;
5
+ onViewportChange: (v: ViewportState) => void;
6
+ onViewportCommit: (v: ViewportState) => void;
7
+ }
8
+ /**
9
+ * Hook that wires up pan/zoom interactions on a container element.
10
+ * - Wheel + Ctrl/Cmd: zoom centered on pointer
11
+ * - Wheel without modifier: pan
12
+ * - Pointer drag on background: pan
13
+ * - Pinch (touch): zoom
14
+ */
15
+ export declare function usePanZoom({ viewport, onViewportChange, onViewportCommit }: PanZoomOptions): import("preact/src").RefObject<HTMLDivElement>;
16
+ export {};
@@ -0,0 +1,161 @@
1
+ type JsonRpcId = string | number | null;
2
+ interface JsonRpcBase {
3
+ jsonrpc: '2.0';
4
+ }
5
+ interface JsonRpcRequestMessage extends JsonRpcBase {
6
+ id: JsonRpcId;
7
+ method: string;
8
+ params?: unknown;
9
+ }
10
+ interface JsonRpcNotificationMessage extends JsonRpcBase {
11
+ method: string;
12
+ params?: unknown;
13
+ }
14
+ interface JsonRpcSuccessResponse extends JsonRpcBase {
15
+ id: JsonRpcId;
16
+ result: unknown;
17
+ }
18
+ interface JsonRpcErrorObject {
19
+ code: number;
20
+ message: string;
21
+ data?: unknown;
22
+ }
23
+ interface JsonRpcErrorResponse extends JsonRpcBase {
24
+ id: JsonRpcId;
25
+ error: JsonRpcErrorObject;
26
+ }
27
+ type JsonRpcResponseMessage = JsonRpcSuccessResponse | JsonRpcErrorResponse;
28
+ type JsonRpcMessage = JsonRpcRequestMessage | JsonRpcNotificationMessage | JsonRpcResponseMessage;
29
+ type DisplayMode = 'inline' | 'fullscreen' | 'pip';
30
+ interface ImplementationInfo {
31
+ name: string;
32
+ version: string;
33
+ }
34
+ type HostCapabilities = Record<string, unknown>;
35
+ interface HostContext {
36
+ theme?: 'light' | 'dark';
37
+ platform?: string;
38
+ displayMode?: DisplayMode;
39
+ containerDimensions?: {
40
+ maxHeight?: number;
41
+ width?: number;
42
+ height?: number;
43
+ };
44
+ [key: string]: unknown;
45
+ }
46
+ interface HostOptions {
47
+ hostContext?: HostContext;
48
+ }
49
+ interface RequestExtra {
50
+ signal: AbortSignal;
51
+ sessionId?: string;
52
+ }
53
+ interface SizeChangedParams {
54
+ width?: number;
55
+ height?: number;
56
+ }
57
+ interface OpenLinkParams {
58
+ url: string;
59
+ }
60
+ interface DownloadFileParams {
61
+ contents?: unknown[];
62
+ }
63
+ interface RequestDisplayModeParams {
64
+ mode: DisplayMode;
65
+ }
66
+ interface RequestDisplayModeResult {
67
+ mode: DisplayMode;
68
+ }
69
+ interface ToolCallParams {
70
+ name: string;
71
+ arguments?: Record<string, unknown>;
72
+ }
73
+ interface ToolInputParams {
74
+ arguments?: Record<string, unknown>;
75
+ }
76
+ interface ToolCancelledParams {
77
+ reason?: string;
78
+ }
79
+ interface SandboxReadyParams {
80
+ html?: string;
81
+ sandbox?: string;
82
+ }
83
+ interface LoggingMessageParams {
84
+ level?: string;
85
+ logger?: string;
86
+ data?: unknown;
87
+ }
88
+ type RequestHandler<TParams = unknown, TResult = unknown> = (params: TParams, extra: RequestExtra) => Promise<TResult> | TResult;
89
+ export declare class PostMessageTransport {
90
+ private readonly eventTarget;
91
+ private readonly eventSource;
92
+ private messageListener;
93
+ onclose?: () => void;
94
+ onerror?: (error: Error) => void;
95
+ onmessage?: (message: JsonRpcMessage, extra?: {
96
+ sessionId?: string;
97
+ }) => void;
98
+ sessionId?: string;
99
+ setProtocolVersion?: (version: string) => void;
100
+ constructor(eventTarget: Window | undefined, eventSource: MessageEventSource | null);
101
+ start(): Promise<void>;
102
+ send(message: JsonRpcMessage): Promise<void>;
103
+ close(): Promise<void>;
104
+ }
105
+ export declare class AppBridge {
106
+ private readonly client;
107
+ private readonly hostInfo;
108
+ private readonly capabilities;
109
+ private readonly requestHandlers;
110
+ private readonly notificationHandlers;
111
+ private readonly pendingRequests;
112
+ private transport;
113
+ private nextRequestId;
114
+ private appCapabilities?;
115
+ private hostContext;
116
+ private appInfo?;
117
+ onping?: (params: Record<string, never>, extra: RequestExtra) => void;
118
+ constructor(client: null, hostInfo: ImplementationInfo, capabilities: HostCapabilities, options?: HostOptions);
119
+ getAppCapabilities(): Record<string, unknown> | undefined;
120
+ getAppVersion(): ImplementationInfo | undefined;
121
+ private setNotificationHandler;
122
+ private setRequestHandler;
123
+ set onsizechange(callback: (params: SizeChangedParams) => void);
124
+ set onsandboxready(callback: (params: Record<string, never>) => void);
125
+ set oninitialized(callback: (params: Record<string, never>) => void);
126
+ set onmessage(callback: RequestHandler<Record<string, unknown>, Record<string, unknown>>);
127
+ set onopenlink(callback: RequestHandler<OpenLinkParams, Record<string, unknown>>);
128
+ set ondownloadfile(callback: RequestHandler<DownloadFileParams, Record<string, unknown>>);
129
+ set onrequestteardown(callback: (params: Record<string, never>) => void);
130
+ set onrequestdisplaymode(callback: RequestHandler<RequestDisplayModeParams, RequestDisplayModeResult>);
131
+ set onloggingmessage(callback: (params: LoggingMessageParams) => void);
132
+ set onupdatemodelcontext(callback: RequestHandler<Record<string, unknown>, Record<string, unknown>>);
133
+ set oncalltool(callback: RequestHandler<ToolCallParams, unknown>);
134
+ set onlisttools(callback: RequestHandler<Record<string, unknown>, unknown>);
135
+ set onlistresources(callback: RequestHandler<Record<string, unknown>, unknown>);
136
+ set onlistresourcetemplates(callback: RequestHandler<Record<string, unknown>, unknown>);
137
+ set onreadresource(callback: RequestHandler<Record<string, unknown>, unknown>);
138
+ set onlistprompts(callback: RequestHandler<Record<string, unknown>, unknown>);
139
+ getCapabilities(): HostCapabilities;
140
+ setHostContext(hostContext: HostContext): void;
141
+ sendHostContextChange(params: HostContext): Promise<void>;
142
+ sendToolInput(params: ToolInputParams): Promise<void>;
143
+ sendToolInputPartial(params: ToolInputParams): Promise<void>;
144
+ sendToolResult(params: unknown): Promise<void>;
145
+ sendToolCancelled(params: ToolCancelledParams): Promise<void>;
146
+ sendSandboxResourceReady(params: SandboxReadyParams): Promise<void>;
147
+ teardownResource(params: Record<string, never>): Promise<Record<string, unknown>>;
148
+ sendResourceTeardown: (params: Record<string, never>) => Promise<Record<string, unknown>>;
149
+ sendToolListChanged(params?: Record<string, unknown>): Promise<void>;
150
+ sendResourceListChanged(params?: Record<string, unknown>): Promise<void>;
151
+ sendPromptListChanged(params?: Record<string, unknown>): Promise<void>;
152
+ connect(transport: PostMessageTransport): Promise<void>;
153
+ private handleIncomingMessage;
154
+ private handleRequest;
155
+ private handleInitialize;
156
+ private sendSuccess;
157
+ private sendError;
158
+ private notification;
159
+ private request;
160
+ }
161
+ export {};
@@ -0,0 +1,70 @@
1
+ import type { JSX } from 'preact';
2
+ interface IconProps {
3
+ size?: number;
4
+ class?: string;
5
+ }
6
+ /** Expand-arrows — fit all nodes */
7
+ export declare function IconFitAll(p: IconProps): JSX.Element;
8
+ /** Framed crosshair — reset view 1:1 */
9
+ export declare function IconResetView(p: IconProps): JSX.Element;
10
+ /** Magnifier with + */
11
+ export declare function IconZoomIn(p: IconProps): JSX.Element;
12
+ /** Magnifier with - */
13
+ export declare function IconZoomOut(p: IconProps): JSX.Element;
14
+ /** 2x2 grid with links — auto-arrange */
15
+ export declare function IconArrange(p: IconProps): JSX.Element;
16
+ /** Frame with focused inner corner — minimap */
17
+ export declare function IconMinimap(p: IconProps): JSX.Element;
18
+ /** Sun with rays */
19
+ export declare function IconSun(p: IconProps): JSX.Element;
20
+ /** Crescent moon */
21
+ export declare function IconMoon(p: IconProps): JSX.Element;
22
+ /** Camera — snapshots */
23
+ export declare function IconSnapshot(p: IconProps): JSX.Element;
24
+ /** Bullseye — trace toggle */
25
+ export declare function IconTrace(p: IconProps): JSX.Element;
26
+ /** X in circle — clear trace */
27
+ export declare function IconClearTrace(p: IconProps): JSX.Element;
28
+ /** Magnifying glass — search */
29
+ export declare function IconSearch(p: IconProps): JSX.Element;
30
+ /** Keyboard — shortcuts */
31
+ export declare function IconShortcuts(p: IconProps): JSX.Element;
32
+ /** Half-lit circle — theme toggle (generic). */
33
+ export declare function IconTheme(p: IconProps): JSX.Element;
34
+ /** Framed pin — context pinning. */
35
+ export declare function IconPin(p: IconProps): JSX.Element;
36
+ /** Focus Field — PMX Canvas brand mark (concentric rounded squares → lit core). */
37
+ export declare function IconLogo({ size, class: className }: IconProps): JSX.Element;
38
+ /** Framed document with lines — markdown */
39
+ export declare function IconNodeMarkdown(p: IconProps): JSX.Element;
40
+ /** Framed prompt with chevron and reply tail — prompt */
41
+ export declare function IconNodePrompt(p: IconProps): JSX.Element;
42
+ /** Framed response with three dots and reply tail — response */
43
+ export declare function IconNodeResponse(p: IconProps): JSX.Element;
44
+ /** Dog-eared document — file */
45
+ export declare function IconNodeFile(p: IconProps): JSX.Element;
46
+ /** Framed landscape with sun — image */
47
+ export declare function IconNodeImage(p: IconProps): JSX.Element;
48
+ /** Browser-chrome frame — webpage */
49
+ export declare function IconNodeWebpage(p: IconProps): JSX.Element;
50
+ /** Card with a pushpin — context */
51
+ export declare function IconNodeContext(p: IconProps): JSX.Element;
52
+ /** Dashed frame with three child cards — group */
53
+ export declare function IconNodeGroup(p: IconProps): JSX.Element;
54
+ /** Framed list with leading dot — status */
55
+ export declare function IconNodeStatus(p: IconProps): JSX.Element;
56
+ /** Framed spike chart with end dot — trace node */
57
+ export declare function IconNodeTrace(p: IconProps): JSX.Element;
58
+ /** Ledger book with spine — ledger */
59
+ export declare function IconNodeLedger(p: IconProps): JSX.Element;
60
+ /** Framed MCP wordmark — mcp-app */
61
+ export declare function IconNodeMcpApp(p: IconProps): JSX.Element;
62
+ /** Framed arrow-out — ext-app */
63
+ export declare function IconNodeExtApp(p: IconProps): JSX.Element;
64
+ /** Framed braces — json-render */
65
+ export declare function IconNodeJsonRender(p: IconProps): JSX.Element;
66
+ /** Framed nodes & edges — graph */
67
+ export declare function IconNodeGraph(p: IconProps): JSX.Element;
68
+ /** Map a node type → its Focus Field icon component. */
69
+ export declare function getNodeIcon(type: string): (p: IconProps) => JSX.Element;
70
+ export {};
@@ -0,0 +1 @@
1
+ export {};
@@ -0,0 +1,34 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ interface ContextCard {
3
+ key?: string;
4
+ title?: string;
5
+ label?: string;
6
+ summary?: string;
7
+ path?: string;
8
+ pathDisplay?: string;
9
+ category?: string;
10
+ sourceKind?: string;
11
+ state?: string;
12
+ required?: boolean;
13
+ }
14
+ export interface ContextCardDisplay {
15
+ title: string;
16
+ summary: string;
17
+ pathDisplay: string;
18
+ category?: string;
19
+ sourceKind: string;
20
+ status: string;
21
+ required: boolean;
22
+ }
23
+ export interface ContextNodeFallbackDisplay {
24
+ title: string;
25
+ summary: string;
26
+ path: string;
27
+ }
28
+ export declare function normalizeContextCardDisplay(card: ContextCard): ContextCardDisplay;
29
+ export declare function normalizeContextNodeFallback(nodeData: Record<string, unknown>): ContextNodeFallbackDisplay | null;
30
+ export declare function ContextNode({ node, expanded, }: {
31
+ node: CanvasNodeState;
32
+ expanded?: boolean;
33
+ }): import("preact/src").JSX.Element;
34
+ export {};
@@ -0,0 +1,18 @@
1
+ import type { CallToolResult } from '@modelcontextprotocol/sdk/types.js';
2
+ import { AppBridge } from '@modelcontextprotocol/ext-apps/app-bridge';
3
+ import type { CanvasNodeState } from '../types';
4
+ type IframeLoadTarget = Pick<HTMLIFrameElement, 'addEventListener' | 'removeEventListener' | 'contentDocument'>;
5
+ type ExtAppBridgeNotifications = Pick<AppBridge, 'sendToolInput' | 'sendToolResult'>;
6
+ type DisplayMode = 'inline' | 'fullscreen' | 'pip';
7
+ export declare function waitForExtAppFrameLoad(target: IframeLoadTarget): Promise<void>;
8
+ export declare function getExtAppBridgeInitKey(node: CanvasNodeState, retryKey: number): string;
9
+ export declare function resolveExtAppDisplayModeRequest(requestedMode: DisplayMode, isExpanded: boolean): {
10
+ nextMode: DisplayMode;
11
+ shouldExpand: boolean;
12
+ shouldCollapse: boolean;
13
+ };
14
+ export declare function sendExtAppBootstrapState(bridge: ExtAppBridgeNotifications, toolInput: Record<string, unknown>, toolResult: CallToolResult | undefined): Promise<void>;
15
+ export declare function ExtAppFrame({ node }: {
16
+ node: CanvasNodeState;
17
+ }): import("preact/src").JSX.Element;
18
+ export {};
@@ -0,0 +1,5 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function FileNode({ node, expanded, }: {
3
+ node: CanvasNodeState;
4
+ expanded?: boolean;
5
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,6 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ interface GroupNodeProps {
3
+ node: CanvasNodeState;
4
+ }
5
+ export declare function GroupNode({ node }: GroupNodeProps): import("preact/src").JSX.Element;
6
+ export {};
@@ -0,0 +1,10 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ /**
3
+ * Image node renderer.
4
+ * Supports: file paths (served via /api/canvas/image/:nodeId), data URIs, and URLs.
5
+ * Features: fit-to-container, zoom in/out within node, pan when zoomed.
6
+ */
7
+ export declare function ImageNode({ node, expanded, }: {
8
+ node: CanvasNodeState;
9
+ expanded?: boolean;
10
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,7 @@
1
+ import type { RefObject } from 'preact';
2
+ /** Floating selection toolbar for a contentEditable host. Mounts once; while
3
+ * visible, positions itself above the current selection's viewport rect. */
4
+ export declare function InlineFormatBar({ hostRef, onChange, }: {
5
+ hostRef: RefObject<HTMLElement>;
6
+ onChange: () => void;
7
+ }): import("preact").JSX.Element | null;
@@ -0,0 +1,14 @@
1
+ /** Fully inline WYSIWYG editor. The rendered HTML is the editor.
2
+ *
3
+ * Two persistence signals:
4
+ * - `onChange(md)` — fires on every input. Caller typically debounces.
5
+ * - `onSave(md)` — fires on ⌘S and blur. Caller should persist immediately
6
+ * and cancel any pending debounced save, since `md` is the authoritative
7
+ * latest content. Both receive freshly-serialized markdown so the caller
8
+ * never reads a stale state snapshot. */
9
+ export declare function InlineMarkdownEditor({ initialHtml, className, onChange, onSave, }: {
10
+ initialHtml: string;
11
+ className?: string;
12
+ onChange: (markdown: string) => void;
13
+ onSave?: (markdown: string) => void;
14
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,4 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function LedgerNode({ node }: {
3
+ node: CanvasNodeState;
4
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,6 @@
1
+ import type { JSX } from 'preact';
2
+ import type { CanvasNodeState } from '../types';
3
+ export declare function MarkdownNode({ node, expanded, }: {
4
+ node: CanvasNodeState;
5
+ expanded?: boolean;
6
+ }): JSX.Element;
@@ -0,0 +1,4 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function McpAppNode({ node }: {
3
+ node: CanvasNodeState;
4
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,8 @@
1
+ /**
2
+ * Floating format toolbar that appears above text selections in markdown textareas.
3
+ */
4
+ export declare function MdFormatBar({ textareaRef }: {
5
+ textareaRef: {
6
+ current: HTMLTextAreaElement | null;
7
+ };
8
+ }): import("preact/src").JSX.Element | null;
@@ -0,0 +1,5 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function PromptNode({ node, expanded, }: {
3
+ node: CanvasNodeState;
4
+ expanded?: boolean;
5
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,5 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function ResponseNode({ node, expanded, }: {
3
+ node: CanvasNodeState;
4
+ expanded?: boolean;
5
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,4 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function StatusNode({ node }: {
3
+ node: CanvasNodeState;
4
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,4 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function StatusSummary({ node }: {
3
+ node: CanvasNodeState;
4
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,4 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function TraceNode({ node }: {
3
+ node: CanvasNodeState;
4
+ }): import("preact/src").JSX.Element;
@@ -0,0 +1,5 @@
1
+ import type { CanvasNodeState } from '../types';
2
+ export declare function WebpageNode({ node, expanded }: {
3
+ node: CanvasNodeState;
4
+ expanded?: boolean;
5
+ }): import("preact/src").JSX.Element;