@dxos/plugin-debug 0.6.13 → 0.6.14-main.69511f5

package/dist/types/src/components/ObjectCreator.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ObjectCreator.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ObjectCreator.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,KAA6B,MAAM,OAAO,CAAC;AAGlD,OAAO,EAAE,KAAK,cAAc,EAAa,MAAM,yBAAyB,CAAC;;;;;;;;;;;;AAyBzE,wBAOE;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC"}
+{"version":3,"file":"ObjectCreator.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/ObjectCreator.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,KAAK,IAAI,EAAE,MAAM,kBAAkB,CAAC;AA6B7C,eAAO,MAAM,OAAO,IAAK,CAAC;AAE1B,QAAA,MAAM,IAAI,EAAE,IAOX,CAAC;AAEF,eAAe,IAAI,CAAC"}

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

@@ -0,0 +1,9 @@
+import React from 'react';
+import { type ThemedClassName } from '@dxos/react-ui';
+export type SurfaceDebugProps = ThemedClassName<{}>;
+/**
+ * Show surface info.
+ * NOTE: Remove from @dxos/app-framework if removing this.
+ */
+export declare const SurfaceDebug: ({ classNames }: SurfaceDebugProps) => React.JSX.Element;
+//# sourceMappingURL=SurfaceDebug.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SurfaceDebug.d.ts","sourceRoot":"","sources":["../../../../src/components/SurfaceDebug.tsx"],"names":[],"mappings":"AAIA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,OAAO,EAAgB,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAKpE,MAAM,MAAM,iBAAiB,GAAG,eAAe,CAAC,EAAE,CAAC,CAAC;AAEpD;;;GAGG;AACH,eAAO,MAAM,YAAY,mBAAoB,iBAAiB,sBAoC7D,CAAC"}

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

@@ -1,7 +1,8 @@
 import React from 'react';
-export declare const Wireframe: ({ label, data, className }: {
+import { type ThemedClassName } from '@dxos/react-ui';
+export type WireframeProps = ThemedClassName<{
     label?: string;
-    data?: any;
-    className?: string;
-}) => React.JSX.Element;
+    object?: any;
+}>;
+export declare const Wireframe: ({ classNames, label, object }: WireframeProps) => React.JSX.Element;
 //# sourceMappingURL=Wireframe.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"Wireframe.d.ts","sourceRoot":"","sources":["../../../../src/components/Wireframe.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,eAAO,MAAM,SAAS,+BAAgC;IAAE,KAAK,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,GAAG,CAAC;IAAC,SAAS,CAAC,EAAE,MAAM,CAAA;CAAE,sBAuBvG,CAAC"}
+{"version":3,"file":"Wireframe.d.ts","sourceRoot":"","sources":["../../../../src/components/Wireframe.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAMtD,MAAM,MAAM,cAAc,GAAG,eAAe,CAAC;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,GAAG,CAAC;CACd,CAAC,CAAC;AAGH,eAAO,MAAM,SAAS,kCAAmC,cAAc,sBAuBtE,CAAC"}

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

@@ -1,12 +1,11 @@
-import React from 'react';
-export declare const DebugGlobal: React.LazyExoticComponent<React.FC<{
+export declare const DebugGlobal: import("react").LazyExoticComponent<import("react").FC<{
     graph: import("packages/sdk/app-graph/dist/types/src").Graph;
 }>>;
-export declare const DebugSpace: React.LazyExoticComponent<React.FC<{
+export declare const DebugSpace: import("react").LazyExoticComponent<import("react").FC<{
     space: import("packages/sdk/client-protocol/dist/types/src").Space;
     onAddObjects?: (objects: import("packages/core/echo/echo-schema/dist/types/src").ReactiveObject<any>[]) => void;
 }>>;
-export declare const DevtoolsMain: React.LazyExoticComponent<() => React.JSX.Element>;
+export * from './DebugObjectPanel';
 export * from './DebugSettings';
 export * from './DebugStatus';
 export * from './Wireframe';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,eAAO,MAAM,WAAW;;GAA4C,CAAC;AACrE,eAAO,MAAM,UAAU;;;GAA2C,CAAC;AACnE,eAAO,MAAM,YAAY,oDAA6C,CAAC;AAEvE,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/index.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,WAAW;;GAAsC,CAAC;AAC/D,eAAO,MAAM,UAAU;;;GAAqC,CAAC;AAE7D,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC"}

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

@@ -1,15 +1,10 @@
-import { type IconProps } from '@phosphor-icons/react';
-import React from 'react';
 export declare const DEBUG_PLUGIN = "dxos.org/plugin/debug";
 declare const _default: {
     id: string;
-    shortId?: string;
-    name?: string;
-    description?: string;
-    homePage?: string;
-    tags?: string[];
-    iconComponent?: React.FC<IconProps>;
-    iconSymbol?: string;
+    name: string;
+    description: string;
+    tags: string[];
+    icon: string;
 };
 export default _default;
 //# sourceMappingURL=meta.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/meta.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAO,KAAK,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,eAAO,MAAM,YAAY,0BAA0B,CAAC;;;;;;;;;;;AAEpD,wBAOG"}
+{"version":3,"file":"meta.d.ts","sourceRoot":"","sources":["../../../src/meta.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,YAAY,0BAA0B,CAAC;;;;;;;;AAEpD,wBAMuB"}

package/dist/types/src/scaffolding/generator.d.ts

@@ -2,8 +2,7 @@ import { SpaceObjectGenerator, type TestGeneratorMap, type TestMutationsMap, typ
 import { type Space } from '@dxos/react-client/echo';
 export declare enum SchemasNames {
     document = "dxos.org/type/Document",
-    diagram = "dxos.org/type/Diagram",
-    sheet = "dxos.org/type/SheetType"
+    diagram = "dxos.org/type/Diagram"
 }
 export declare const SchemasMap: TestSchemaMap<SchemasNames>;
 export declare const ObjectGenerators: TestGeneratorMap<SchemasNames>;

package/dist/types/src/scaffolding/generator.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"generator.d.ts","sourceRoot":"","sources":["../../../../src/scaffolding/generator.ts"],"names":[],"mappings":"AAeA,OAAO,EACL,oBAAoB,EACpB,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACrB,KAAK,aAAa,EACnB,MAAM,sBAAsB,CAAC;AAS9B,OAAO,EAAqB,KAAK,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAGxE,oBAAY,YAAY;IACtB,QAAQ,2BAA2B;IACnC,OAAO,0BAA0B;IACjC,KAAK,4BAA4B;CAClC;AAED,eAAO,MAAM,UAAU,EAAE,aAAa,CAAC,YAAY,CAIlD,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,gBAAgB,CAAC,YAAY,CAkB3D,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,gBAAgB,CAAC,YAAY,CAyF9D,CAAC;AAEF,eAAO,MAAM,0BAA0B,UAAW,KAAK,uCAC6B,CAAC"}
+{"version":3,"file":"generator.d.ts","sourceRoot":"","sources":["../../../../src/scaffolding/generator.ts"],"names":[],"mappings":"AAeA,OAAO,EACL,oBAAoB,EACpB,KAAK,gBAAgB,EACrB,KAAK,gBAAgB,EACrB,KAAK,aAAa,EACnB,MAAM,sBAAsB,CAAC;AAO9B,OAAO,EAAqB,KAAK,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAKxE,oBAAY,YAAY;IACtB,QAAQ,2BAA2B;IACnC,OAAO,0BAA0B;CAClC;AAED,eAAO,MAAM,UAAU,EAAE,aAAa,CAAC,YAAY,CAGlD,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,gBAAgB,CAAC,YAAY,CAa3D,CAAC;AAEF,eAAO,MAAM,mBAAmB,EAAE,gBAAgB,CAAC,YAAY,CAqF9D,CAAC;AAEF,eAAO,MAAM,0BAA0B,UAAW,KAAK,uCAC6B,CAAC"}

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

@@ -1,6 +1,7 @@
 import { type Context } from 'react';
 import type { GraphBuilderProvides, IntentResolverProvides, SettingsProvides, SurfaceProvides, TranslationsProvides } from '@dxos/app-framework';
 import type { TimerCallback, TimerOptions } from '@dxos/async';
+import { S } from '@dxos/echo-schema';
 export declare enum DebugAction {
     OPEN_DEVTOOLS = "dxos.org/plugin/debug/action/open-devtools"
 }
@@ -10,10 +11,12 @@ export type DebugContextType = {
     stop: () => void;
 };
 export declare const DebugContext: Context<DebugContextType>;
-export type DebugSettingsProps = {
-    devtools?: boolean;
-    debug?: boolean;
-    wireframe?: boolean;
-};
+export declare const DebugSettingsSchema: S.mutable<S.Struct<{
+    devtools: S.optional<typeof S.Boolean>;
+    debug: S.optional<typeof S.Boolean>;
+    wireframe: S.optional<typeof S.Boolean>;
+}>>;
+export interface DebugSettingsProps extends S.Schema.Type<typeof DebugSettingsSchema> {
+}
 export type DebugPluginProvides = SurfaceProvides & IntentResolverProvides & GraphBuilderProvides & SettingsProvides<DebugSettingsProps> & TranslationsProvides;
 //# sourceMappingURL=types.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,OAAO,EAAiB,MAAM,OAAO,CAAC;AAEpD,OAAO,KAAK,EACV,oBAAoB,EACpB,sBAAsB,EACtB,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACrB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAK/D,oBAAY,WAAW;IACrB,aAAa,+CAAkC;CAChD;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,CAAC,EAAE,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1D,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,OAAO,CAAC,gBAAgB,CAIjD,CAAC;AAEH,MAAM,MAAM,kBAAkB,GAAG;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,eAAe,GAC/C,sBAAsB,GACtB,oBAAoB,GACpB,gBAAgB,CAAC,kBAAkB,CAAC,GACpC,oBAAoB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,OAAO,EAAiB,MAAM,OAAO,CAAC;AAEpD,OAAO,KAAK,EACV,oBAAoB,EACpB,sBAAsB,EACtB,gBAAgB,EAChB,eAAe,EACf,oBAAoB,EACrB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAC/D,OAAO,EAAE,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAKtC,oBAAY,WAAW;IACrB,aAAa,+CAAkC;CAChD;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,OAAO,EAAE,OAAO,CAAC;IACjB,KAAK,EAAE,CAAC,EAAE,EAAE,aAAa,EAAE,OAAO,EAAE,YAAY,KAAK,IAAI,CAAC;IAC1D,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,YAAY,EAAE,OAAO,CAAC,gBAAgB,CAIjD,CAAC;AAEH,eAAO,MAAM,mBAAmB;;;;GAM/B,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,OAAO,mBAAmB,CAAC;CAAG;AAExF,MAAM,MAAM,mBAAmB,GAAG,eAAe,GAC/C,sBAAsB,GACtB,oBAAoB,GACpB,gBAAgB,CAAC,kBAAkB,CAAC,GACpC,oBAAoB,CAAC"}

package/package.json

@@ -1,19 +1,20 @@
 {
   "name": "@dxos/plugin-debug",
-  "version": "0.6.13",
+  "version": "0.6.14-main.69511f5",
   "description": "DXOS Surface plugin for testing.",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
   "license": "MIT",
   "author": "DXOS.org",
+  "sideEffects": true,
   "exports": {
     ".": {
-      "browser": "./dist/lib/browser/index.mjs",
-      "types": "./dist/types/src/index.d.ts"
+      "types": "./dist/types/src/index.d.ts",
+      "browser": "./dist/lib/browser/index.mjs"
     },
     "./meta": {
-      "browser": "./dist/lib/browser/meta.mjs",
-      "types": "./dist/types/src/meta.d.ts"
+      "types": "./dist/types/src/meta.d.ts",
+      "browser": "./dist/lib/browser/meta.mjs"
     }
   },
   "types": "dist/types/src/index.d.ts",
@@ -35,59 +36,56 @@
     "lodash.get": "^4.4.2",
     "react-json-tree": "^0.18.0",
     "react-resize-detector": "^11.0.1",
-    "react-syntax-highlighter": "^15.5.0",
-    "@dxos/app-framework": "0.6.13",
-    "@dxos/async": "0.6.13",
-    "@dxos/client-services": "0.6.13",
-    "@dxos/config": "0.6.13",
-    "@dxos/automerge": "0.6.13",
-    "@dxos/devtools": "0.6.13",
-    "@dxos/echo-generator": "0.6.13",
-    "@dxos/echo-pipeline": "0.6.13",
-    "@dxos/invariant": "0.6.13",
-    "@dxos/echo-schema": "0.6.13",
-    "@dxos/keys": "0.6.13",
-    "@dxos/local-storage": "0.6.13",
-    "@dxos/plugin-client": "0.6.13",
-    "@dxos/plugin-graph": "0.6.13",
-    "@dxos/log": "0.6.13",
-    "@dxos/plugin-markdown": "0.6.13",
-    "@dxos/plugin-settings": "0.6.13",
-    "@dxos/plugin-sheet": "0.6.13",
-    "@dxos/plugin-sketch": "0.6.13",
-    "@dxos/plugin-status-bar": "0.6.13",
-    "@dxos/plugin-space": "0.6.13",
-    "@dxos/plugin-table": "0.6.13",
-    "@dxos/protocols": "0.6.13",
-    "@dxos/random": "0.6.13",
-    "@dxos/react-client": "0.6.13",
-    "@dxos/react-hooks": "0.6.13",
-    "@dxos/react-ui-attention": "0.6.13",
-    "@dxos/react-ui-syntax-highlighter": "0.6.13",
-    "@dxos/react-ui-table": "0.6.13",
-    "@dxos/plugin-theme": "0.6.13",
-    "@dxos/util": "0.6.13"
+    "@dxos/app-framework": "0.6.14-main.69511f5",
+    "@dxos/automerge": "0.6.14-main.69511f5",
+    "@dxos/client-services": "0.6.14-main.69511f5",
+    "@dxos/async": "0.6.14-main.69511f5",
+    "@dxos/config": "0.6.14-main.69511f5",
+    "@dxos/devtools": "0.6.14-main.69511f5",
+    "@dxos/echo-generator": "0.6.14-main.69511f5",
+    "@dxos/echo-pipeline": "0.6.14-main.69511f5",
+    "@dxos/echo-schema": "0.6.14-main.69511f5",
+    "@dxos/invariant": "0.6.14-main.69511f5",
+    "@dxos/log": "0.6.14-main.69511f5",
+    "@dxos/keys": "0.6.14-main.69511f5",
+    "@dxos/local-storage": "0.6.14-main.69511f5",
+    "@dxos/plugin-graph": "0.6.14-main.69511f5",
+    "@dxos/plugin-client": "0.6.14-main.69511f5",
+    "@dxos/plugin-markdown": "0.6.14-main.69511f5",
+    "@dxos/plugin-status-bar": "0.6.14-main.69511f5",
+    "@dxos/plugin-sketch": "0.6.14-main.69511f5",
+    "@dxos/plugin-space": "0.6.14-main.69511f5",
+    "@dxos/protocols": "0.6.14-main.69511f5",
+    "@dxos/plugin-table": "0.6.14-main.69511f5",
+    "@dxos/plugin-theme": "0.6.14-main.69511f5",
+    "@dxos/random": "0.6.14-main.69511f5",
+    "@dxos/react-client": "0.6.14-main.69511f5",
+    "@dxos/react-hooks": "0.6.14-main.69511f5",
+    "@dxos/react-ui-attention": "0.6.14-main.69511f5",
+    "@dxos/react-ui-data": "0.6.14-main.69511f5",
+    "@dxos/react-ui-syntax-highlighter": "0.6.14-main.69511f5",
+    "@dxos/react-ui-table": "0.6.14-main.69511f5",
+    "@dxos/util": "0.6.14-main.69511f5"
   },
   "devDependencies": {
     "@phosphor-icons/react": "^2.1.5",
     "@types/lodash.get": "^4.4.7",
     "@types/react": "~18.2.0",
     "@types/react-dom": "~18.2.0",
-    "@types/react-syntax-highlighter": "^15.5.13",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "vite": "^5.3.4",
-    "@dxos/random": "0.6.13",
-    "@dxos/react-ui": "0.6.13",
-    "@dxos/react-ui-theme": "0.6.13",
-    "@dxos/storybook-utils": "0.6.13"
+    "vite": "5.4.7",
+    "@dxos/react-ui": "0.6.14-main.69511f5",
+    "@dxos/react-ui-theme": "0.6.14-main.69511f5",
+    "@dxos/storybook-utils": "0.6.14-main.69511f5"
   },
   "peerDependencies": {
     "@phosphor-icons/react": "^2.1.5",
-    "react": "^18.0.0",
-    "react-dom": "^18.0.0",
-    "@dxos/react-ui": "0.6.13",
-    "@dxos/react-ui-theme": "0.6.13"
+    "react": "~18.2.0",
+    "react-dom": "~18.2.0",
+    "@dxos/react-ui": "0.6.14-main.69511f5",
+    "@dxos/random": "0.6.14-main.69511f5",
+    "@dxos/react-ui-theme": "0.6.14-main.69511f5"
   },
   "publishConfig": {
     "access": "public"

package/src/DebugPlugin.tsx

@@ -2,53 +2,59 @@
 // Copyright 2023 DXOS.org
 //
 
-import { Bug, Hammer, type IconProps } from '@phosphor-icons/react';
 import React, { type ReactNode, useEffect, useState } from 'react';
 
 import {
-  getPlugin,
+  definePlugin,
   parseGraphPlugin,
   parseIntentPlugin,
+  parseMetadataResolverPlugin,
+  parseSettingsPlugin,
   resolvePlugin,
-  type IntentPluginProvides,
-  type Plugin,
-  type PluginDefinition,
 } from '@dxos/app-framework';
 import { Timer } from '@dxos/async';
-import { LocalStorageStore } from '@dxos/local-storage';
-import { type ClientPluginProvides } from '@dxos/plugin-client';
-import { createExtension, Graph, type Node } from '@dxos/plugin-graph';
+import { Devtools } from '@dxos/devtools';
+import { invariant } from '@dxos/invariant';
+import { type ClientPluginProvides, parseClientPlugin } from '@dxos/plugin-client';
+import { createExtension, Graph, type Node, toSignal } from '@dxos/plugin-graph';
 import { SpaceAction } from '@dxos/plugin-space';
 import { CollectionType } from '@dxos/plugin-space/types';
 import { type Client } from '@dxos/react-client';
-import { type Space, SpaceState, isSpace } from '@dxos/react-client/echo';
+import { create, getTypename, isEchoObject, isSpace, parseId, type Space, SpaceState } from '@dxos/react-client/echo';
 import { Main } from '@dxos/react-ui';
 import {
   baseSurface,
-  topbarBlockPaddingStart,
-  fixedInsetFlexLayout,
   bottombarBlockPaddingEnd,
+  fixedInsetFlexLayout,
+  topbarBlockPaddingStart,
 } from '@dxos/react-ui-theme';
 
-import { DebugGlobal, DebugSettings, DebugSpace, DebugStatus, DevtoolsMain, Wireframe } from './components';
+import { DebugGlobal, DebugObjectPanel, DebugSettings, DebugSpace, DebugStatus, Wireframe } from './components';
 import meta, { DEBUG_PLUGIN } from './meta';
 import translations from './translations';
-import { DebugContext, type DebugSettingsProps, type DebugPluginProvides, DebugAction } from './types';
-
-export const SETTINGS_KEY = DEBUG_PLUGIN + '/settings';
+import {
+  DebugAction,
+  DebugContext,
+  type DebugPluginProvides,
+  type DebugSettingsProps,
+  DebugSettingsSchema,
+} from './types';
 
-export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
-  const settings = new LocalStorageStore<DebugSettingsProps>(DEBUG_PLUGIN, { debug: true, devtools: true });
-  let intentPlugin: Plugin<IntentPluginProvides>;
+export const DebugPlugin = definePlugin<DebugPluginProvides>((context) => {
+  const settings = create<DebugSettingsProps>({
+    debug: true,
+    devtools: true,
+  });
 
   return {
     meta,
     ready: async (plugins) => {
-      intentPlugin = resolvePlugin(plugins, parseIntentPlugin)!;
-      settings
-        .prop({ key: 'debug', type: LocalStorageStore.bool({ allowUndefined: true }) })
-        .prop({ key: 'devtools', type: LocalStorageStore.bool({ allowUndefined: true }) })
-        .prop({ key: 'wireframe', type: LocalStorageStore.bool({ allowUndefined: true }) });
+      context.init(plugins);
+      context.resolvePlugin(parseSettingsPlugin).provides.settingsStore.createStore({
+        schema: DebugSettingsSchema,
+        prefix: DEBUG_PLUGIN,
+        value: settings,
+      });
 
       // TODO(burdon): Remove hacky dependency on global variable.
       // Used to test how composer handles breaking protocol changes.
@@ -65,10 +71,10 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
       };
     },
     unload: async () => {
-      settings.close();
+      context.dispose();
     },
     provides: {
-      settings: settings.values,
+      settings,
       translations,
       context: ({ children }) => {
         const [timer, setTimer] = useState<Timer>();
@@ -94,15 +100,19 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
       },
       graph: {
         builder: (plugins) => {
+          const clientPlugin = resolvePlugin(plugins, parseClientPlugin);
+          const metadataPlugin = resolvePlugin(plugins, parseMetadataResolverPlugin);
           const graphPlugin = resolvePlugin(plugins, parseGraphPlugin);
-
-          // TODO(burdon): Combine nodes into single subtree.
+          const resolve = metadataPlugin?.provides.metadata.resolver;
+          const client = clientPlugin?.provides.client;
+          invariant(resolve);
+          invariant(client);
 
           return [
             // Devtools node.
             createExtension({
               id: 'dxos.org/plugin/debug/devtools',
-              filter: (node): node is Node<null> => !!settings.values.devtools && node.id === 'root',
+              filter: (node): node is Node<null> => !!settings.devtools && node.id === 'root',
               connector: () => [
                 {
                   // TODO(zan): Removed `/` because it breaks deck layout reload. Fix?
@@ -111,8 +121,7 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
                   type: 'dxos.org/plugin/debug/devtools',
                   properties: {
                     label: ['devtools label', { ns: DEBUG_PLUGIN }],
-                    icon: (props: IconProps) => <Hammer {...props} />,
-                    iconSymbol: 'ph--hammer--regular',
+                    icon: 'ph--hammer--regular',
                   },
                 },
               ],
@@ -121,7 +130,7 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
             // Debug node.
             createExtension({
               id: 'dxos.org/plugin/debug/debug',
-              filter: (node): node is Node<null> => !!settings.values.debug && node.id === 'root',
+              filter: (node): node is Node<null> => !!settings.debug && node.id === 'root',
               connector: () => [
                 {
                   id: 'dxos.org/plugin/debug/debug',
@@ -129,8 +138,7 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
                   data: { graph: graphPlugin?.provides.graph },
                   properties: {
                     label: ['debug label', { ns: DEBUG_PLUGIN }],
-                    icon: (props: IconProps) => <Bug {...props} />,
-                    iconSymbol: 'ph--bug--regular',
+                    icon: 'ph--bug--regular',
                   },
                 },
               ],
@@ -139,23 +147,93 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
             // Space debug nodes.
             createExtension({
               id: 'dxos.org/plugin/debug/spaces',
-              filter: (node): node is Node<Space> => !!settings.values.debug && isSpace(node.data),
+              filter: (node): node is Node<Space> => !!settings.debug && isSpace(node.data),
               connector: ({ node }) => {
                 const space = node.data;
                 return [
                   {
-                    id: `${space.id}-debug`,
+                    id: `${space.id}-debug`, // TODO(burdon): Change to slashes consistently.
                     type: 'dxos.org/plugin/debug/space',
                     data: { space },
                     properties: {
                       label: ['debug label', { ns: DEBUG_PLUGIN }],
-                      icon: (props: IconProps) => <Bug {...props} />,
-                      iconSymbol: 'ph--bug--regular',
+                      icon: 'ph--bug--regular',
                     },
                   },
                 ];
               },
             }),
+
+            // Create nodes for debug sidebar.
+            createExtension({
+              id: `${DEBUG_PLUGIN}/debug-for-subject`,
+              resolver: ({ id }) => {
+                // TODO(Zan): Find util (or make one).
+                if (!id.endsWith('~debug')) {
+                  return;
+                }
+
+                const type = 'orphan-settings-for-subject';
+                const icon = 'ph--bug--regular';
+
+                const [subjectId] = id.split('~');
+                const { spaceId, objectId } = parseId(subjectId);
+                const space = client.spaces.get().find((space) => space.id === spaceId);
+                if (!objectId) {
+                  // TODO(burdon): Ref SPACE_PLUGIN ns.
+                  const label = space
+                    ? space.properties.name || ['unnamed space label', { ns: DEBUG_PLUGIN }]
+                    : ['unnamed object settings label', { ns: DEBUG_PLUGIN }];
+
+                  // TODO(wittjosiah): Support comments for arbitrary subjects.
+                  //   This is to ensure that the comments panel is not stuck on an old object.
+                  return {
+                    id,
+                    type,
+                    data: null,
+                    properties: {
+                      icon,
+                      label,
+                      showResolvedThreads: false,
+                      object: null,
+                      space,
+                    },
+                  };
+                }
+
+                const object = toSignal(
+                  (onChange) => {
+                    const timeout = setTimeout(async () => {
+                      await space?.db.loadObjectById(objectId);
+                      onChange();
+                    });
+
+                    return () => clearTimeout(timeout);
+                  },
+                  () => space?.db.getObjectById(objectId),
+                  subjectId,
+                );
+                if (!object || !subjectId) {
+                  return;
+                }
+
+                const meta = resolve(getTypename(object) ?? '');
+                const label = meta.label?.(object) ||
+                  object.name ||
+                  meta.placeholder || ['unnamed object settings label', { ns: DEBUG_PLUGIN }];
+
+                return {
+                  id,
+                  type,
+                  data: null,
+                  properties: {
+                    icon,
+                    label,
+                    object,
+                  },
+                };
+              },
+            }),
           ];
         },
       },
@@ -163,7 +241,7 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
         resolver: async (intent, plugins) => {
           switch (intent.action) {
             case DebugAction.OPEN_DEVTOOLS: {
-              const clientPlugin = getPlugin<ClientPluginProvides>(plugins, 'dxos.org/plugin/client');
+              const clientPlugin = context.getPlugin<ClientPluginProvides>('dxos.org/plugin/client');
               const client = clientPlugin.provides.client;
               const vaultUrl = client.config.values?.runtime?.client?.remoteSource ?? 'https://halo.dxos.org';
 
@@ -188,17 +266,19 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
         component: ({ name, data, role }) => {
           switch (role) {
             case 'settings':
-              return data.plugin === meta.id ? <DebugSettings settings={settings.values} /> : null;
+              return data.plugin === meta.id ? <DebugSettings settings={settings} /> : null;
             case 'status':
               return <DebugStatus />;
+            case 'complementary--debug':
+              return isEchoObject(data.subject) ? <DebugObjectPanel object={data.subject} /> : null;
           }
 
           const primary = data.active ?? data.object;
           let component: ReactNode;
           if (role === 'main' || role === 'article') {
-            if (primary === 'devtools' && settings.values.devtools) {
-              component = <DevtoolsMain />;
-            } else if (!primary || typeof primary !== 'object' || !settings.values.debug) {
+            if (primary === 'devtools' && settings.devtools) {
+              component = <Devtools />;
+            } else if (!primary || typeof primary !== 'object' || !settings.debug) {
               component = null;
             } else if ('space' in primary && isSpace(primary.space)) {
               component = (
@@ -216,7 +296,7 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
                       return;
                     }
 
-                    void intentPlugin?.provides.intent.dispatch(
+                    void context.resolvePlugin(parseIntentPlugin).provides.intent.dispatch(
                       objects.map((object) => ({
                         action: SpaceAction.ADD_OBJECT,
                         data: { target: collection, object },
@@ -233,11 +313,18 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
           }
 
           if (!component) {
-            if (settings.values.wireframe) {
+            if (settings.wireframe) {
               if (role === 'main' || role === 'article' || role === 'section') {
                 const primary = data.active ?? data.object;
-                if (!(primary instanceof CollectionType)) {
-                  return <Wireframe label={role} data={data} className='row-span-2 overflow-hidden' />;
+                const isCollection = primary instanceof CollectionType;
+                // TODO(burdon): Move into Container abstraction.
+                if (!isCollection) {
+                  return {
+                    node: (
+                      <Wireframe label={`${role}:${name}`} object={primary} classNames='row-span-2 overflow-hidden' />
+                    ),
+                    disposition: 'hoist',
+                  };
                 }
               }
             }
@@ -267,4 +354,4 @@ export const DebugPlugin = (): PluginDefinition<DebugPluginProvides> => {
       },
     },
   };
-};
+});

package/src/components/DebugObjectPanel.tsx

@@ -0,0 +1,22 @@
+//
+// Copyright 2024 DXOS.org
+//
+
+import React from 'react';
+
+import { type EchoReactiveObject } from '@dxos/client/echo';
+import { SyntaxHighlighter } from '@dxos/react-ui-syntax-highlighter';
+
+export type DebugObjectPanelProps = {
+  object: EchoReactiveObject<any>;
+};
+
+export const DebugObjectPanel = ({ object }: DebugObjectPanelProps) => {
+  return (
+    <div role='form' className='flex flex-col'>
+      <SyntaxHighlighter classNames='flex text-xs' language='json'>
+        {JSON.stringify(object, null, 2)}
+      </SyntaxHighlighter>
+    </div>
+  );
+};

package/src/components/DebugPanel.tsx

@@ -3,29 +3,24 @@
 //
 
 import { formatDistance } from 'date-fns';
-import React, { type FC, type PropsWithChildren, type ReactNode } from 'react';
+import React, { type PropsWithChildren, type ReactNode } from 'react';
 
 import { useConfig } from '@dxos/react-client';
-import { DensityProvider } from '@dxos/react-ui';
 
-export const DebugPanel: FC<PropsWithChildren<{ menu: ReactNode }>> = ({ menu, children }) => {
+export const DebugPanel = ({ menu, children }: PropsWithChildren<{ menu: ReactNode }>) => {
   const config = useConfig();
   return (
     <>
-      <div className='flex shrink-0 p-2 space-x-2'>
-        <DensityProvider density='fine'>{menu}</DensityProvider>
-      </div>
+      <div className='flex shrink-0 p-2 space-x-2'>{menu}</div>
       <div className='flex flex-col grow px-2 overflow-hidden'>
         <div className='flex flex-col grow overflow-auto'>{children}</div>
-
         {config.values?.runtime?.app?.build?.timestamp && (
           <div className='p-2 text-sm font-mono'>
-            {config.values?.runtime?.app?.build?.version} (
+            {config.values?.runtime?.app?.build?.version}
             {formatDistance(new Date(config.values?.runtime?.app?.build?.timestamp), new Date(), {
               addSuffix: true,
               includeSeconds: true,
             })}
-            )
           </div>
         )}
       </div>