@dxos/react-client 0.6.13-main.ed424a1 → 0.6.13

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

@@ -1,3 +1,3 @@
-declare const _default: import("@playwright/test").PlaywrightTestConfig<{}, {}>;
-export default _default;
+import { defaultPlaywrightConfig } from '@dxos/test/playwright';
+export default defaultPlaywrightConfig;
 //# sourceMappingURL=playwright.config.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"playwright.config.d.ts","sourceRoot":"","sources":["../../../../src/playwright/playwright.config.ts"],"names":[],"mappings":";AASA,wBAQG"}
+{"version":3,"file":"playwright.config.d.ts","sourceRoot":"","sources":["../../../../src/playwright/playwright.config.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAC;AAEhE,eAAe,uBAAuB,CAAC"}

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

@@ -1,28 +1,31 @@
-import { type Schema as S } from '@effect/schema';
 import React, { type FC } from 'react';
 import { Client, type PublicKey } from '@dxos/client';
-import { type WithClientProviderProps } from './withClientProvider';
+import { type Space } from '@dxos/client/echo';
+import { type S } from '@dxos/echo-schema';
+import { type MaybePromise } from '@dxos/util';
 export type ClientRepeatedComponentProps = {
     id: number;
     count: number;
     spaceKey?: PublicKey;
 };
-export type ClientRepeaterControlsProps = {
-    clients: Client[];
-};
 export type ClientRepeaterProps<P extends ClientRepeatedComponentProps> = {
     className?: string;
     component: FC<ClientRepeatedComponentProps>;
-    controls?: FC<ClientRepeaterControlsProps>;
-    count?: number;
+    controls?: FC<{
+        clients: Client[];
+    }>;
     clients?: Client[];
+    count?: number;
+    registerSignalFactory?: boolean;
     types?: S.Schema<any>[];
+    createIdentity?: boolean;
+    createSpace?: boolean;
+    onCreateSpace?: (space: Space) => MaybePromise<void>;
     args?: Omit<P, 'id' | 'count'>;
-} & Pick<WithClientProviderProps, 'createIdentity' | 'createSpace' | 'onSpaceCreated'>;
+};
 /**
  * Utility component for Storybook stories which sets up clients for n peers.
  * The `Component` property is rendered n times, once for each peer.
- * @deprecated use `withClientProvider`.
  */
 export declare const ClientRepeater: <P extends ClientRepeatedComponentProps>(props: ClientRepeaterProps<P>) => React.JSX.Element | null;
 //# sourceMappingURL=ClientRepeater.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ClientRepeater.d.ts","sourceRoot":"","sources":["../../../../src/testing/ClientRepeater.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,MAAM,IAAI,CAAC,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,KAAK,EAAE,EAAY,KAAK,EAAE,EAAqB,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,MAAM,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAKtD,OAAO,EAAE,KAAK,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AAGpE,MAAM,MAAM,4BAA4B,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC;AAE/F,MAAM,MAAM,2BAA2B,GAAG;IAAE,OAAO,EAAE,MAAM,EAAE,CAAA;CAAE,CAAC;AAGhE,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,4BAA4B,IAAI;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,EAAE,CAAC,4BAA4B,CAAC,CAAC;IAC5C,QAAQ,CAAC,EAAE,EAAE,CAAC,2BAA2B,CAAC,CAAC;IAC3C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,KAAK,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC;IACxB,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,GAAG,OAAO,CAAC,CAAC;CAChC,GAAG,IAAI,CAAC,uBAAuB,EAAE,gBAAgB,GAAG,aAAa,GAAG,gBAAgB,CAAC,CAAC;AAEvF;;;;GAIG;AAMH,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,4BAA4B,SAAS,mBAAmB,CAAC,CAAC,CAAC,6BA2DnG,CAAC"}
+{"version":3,"file":"ClientRepeater.d.ts","sourceRoot":"","sources":["../../../../src/testing/ClientRepeater.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,EAAY,KAAK,EAAE,EAAqB,MAAM,OAAO,CAAC;AAEpE,OAAO,EAAE,MAAM,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AACtD,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EAAE,KAAK,CAAC,EAAE,MAAM,mBAAmB,CAAC;AAG3C,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAI/C,MAAM,MAAM,4BAA4B,GAAG;IAAE,EAAE,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,EAAE,SAAS,CAAA;CAAE,CAAC;AAE/F,MAAM,MAAM,mBAAmB,CAAC,CAAC,SAAS,4BAA4B,IAAI;IACxE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,EAAE,CAAC,4BAA4B,CAAC,CAAC;IAC5C,QAAQ,CAAC,EAAE,EAAE,CAAC;QAAE,OAAO,EAAE,MAAM,EAAE,CAAA;KAAE,CAAC,CAAC;IACrC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,KAAK,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,EAAE,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC;IACrD,IAAI,CAAC,EAAE,IAAI,CAAC,CAAC,EAAE,IAAI,GAAG,OAAO,CAAC,CAAC;CAChC,CAAC;AAEF;;;GAGG;AAMH,eAAO,MAAM,cAAc,GAAI,CAAC,SAAS,4BAA4B,SAAS,mBAAmB,CAAC,CAAC,CAAC,6BA2DnG,CAAC"}

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

@@ -1,14 +1,12 @@
 import React from 'react';
-import { Client, type Config } from '@dxos/client';
+import { Client } from '@dxos/client';
 import { type Space } from '@dxos/client/echo';
-export declare const createClient: ({ config, createIdentity, createSpace, }?: {
-    config?: Config;
+export declare const createClient: ({ createIdentity, createSpace, }?: {
     createIdentity?: boolean;
     createSpace?: boolean;
 }) => Promise<{
     client: Client;
     space: Space | undefined;
 }>;
-export declare const createClientContextProvider: (client: Client) => Promise<({ children }: any) => React.JSX.Element>;
-export declare const createClientProvider: (client: Client) => Promise<({ children }: any) => React.JSX.Element>;
+export declare const createContextProvider: (client: Client) => Promise<({ children }: any) => React.JSX.Element>;
 //# sourceMappingURL=util.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../../src/testing/util.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAE,KAAK,MAAM,EAAY,MAAM,cAAc,CAAC;AAC7D,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAK/C,eAAO,MAAM,YAAY,8CAItB;IAAE,MAAM,CAAC,EAAE,MAAM,CAAC;IAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE;;;EActE,CAAC;AAEF,eAAO,MAAM,2BAA2B,WAAkB,MAAM,4BACxC,GAAG,uBAC1B,CAAC;AAEF,eAAO,MAAM,oBAAoB,WAAkB,MAAM,4BACjC,GAAG,uBAC1B,CAAC"}
+{"version":3,"file":"util.d.ts","sourceRoot":"","sources":["../../../../src/testing/util.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,MAAM,EAAY,MAAM,cAAc,CAAC;AAChD,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAI/C,eAAO,MAAM,YAAY,sCAGtB;IAAE,cAAc,CAAC,EAAE,OAAO,CAAC;IAAC,WAAW,CAAC,EAAE,OAAO,CAAA;CAAE;;;EAcrD,CAAC;AAGF,eAAO,MAAM,qBAAqB,WAAkB,MAAM,4BAClC,GAAG,uBAC1B,CAAC"}

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

@@ -6,10 +6,7 @@ import { type ClientProviderProps } from '../client';
 type InitializeProps = {
     createIdentity?: boolean;
     createSpace?: boolean;
-    onSpaceCreated?: (props: {
-        client: Client;
-        space: Space;
-    }) => MaybePromise<void>;
+    onSpaceCreated?: (client: Client, space: Space) => MaybePromise<void>;
 };
 export type WithClientProviderProps = InitializeProps & ClientProviderProps;
 /**

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

@@ -1 +1 @@
-{"version":3,"file":"withClientProvider.d.ts","sourceRoot":"","sources":["../../../../src/testing/withClientProvider.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAKlD,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,WAAW,CAAC;AAErE,KAAK,eAAe,GAAG;IACrB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,KAAK,CAAA;KAAE,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC;CAClF,CAAC;AA8BF,MAAM,MAAM,uBAAuB,GAAG,eAAe,GAAG,mBAAmB,CAAC;AAE5E;;GAEG;AACH,eAAO,MAAM,kBAAkB,8EAM5B,uBAAuB,KAAQ,SAcjC,CAAC;AAKF,MAAM,MAAM,4BAA4B,GAAG,eAAe,GAAG,mBAAmB,GAAG;IAAE,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAE3G;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,yFAOjC,4BAA4B,KAAG,SAuCjC,CAAC"}
+{"version":3,"file":"withClientProvider.d.ts","sourceRoot":"","sources":["../../../../src/testing/withClientProvider.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAKlD,OAAO,EAAE,KAAK,MAAM,EAAE,MAAM,cAAc,CAAC;AAC3C,OAAO,EAAE,KAAK,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE/C,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,YAAY,CAAC;AAE/C,OAAO,EAAkB,KAAK,mBAAmB,EAAE,MAAM,WAAW,CAAC;AAErE,KAAK,eAAe,GAAG;IACrB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,KAAK,YAAY,CAAC,IAAI,CAAC,CAAC;CACvE,CAAC;AA4BF,MAAM,MAAM,uBAAuB,GAAG,eAAe,GAAG,mBAAmB,CAAC;AAE5E;;GAEG;AACH,eAAO,MAAM,kBAAkB,8EAM5B,uBAAuB,KAAQ,SAYjC,CAAC;AAKF,MAAM,MAAM,4BAA4B,GAAG,eAAe,GAAG,mBAAmB,GAAG;IAAE,UAAU,CAAC,EAAE,MAAM,CAAA;CAAE,CAAC;AAE3G;;;;GAIG;AACH,eAAO,MAAM,uBAAuB,yFAOjC,4BAA4B,KAAG,SAuCjC,CAAC"}

package/dist/types/src/testing/withClientProvider.stories.d.ts

@@ -2,12 +2,11 @@ import '@dxos-theme';
 import React from 'react';
 declare const _default: {
     title: string;
-    render: () => React.JSX.Element | null;
-};
-export default _default;
-export declare const Default: {
+    component: () => React.JSX.Element | null;
     decorators: import("@storybook/react/*").Decorator[];
 };
+export default _default;
+export declare const Default: {};
 export declare const Multiple: {
     decorators: import("@storybook/react/*").Decorator[];
 };

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

@@ -1 +1 @@
-{"version":3,"file":"withClientProvider.stories.d.ts","sourceRoot":"","sources":["../../../../src/testing/withClientProvider.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;AAgC1B,wBAGE;AAaF,eAAO,MAAM,OAAO;;CAEnB,CAAC;AAEF,eAAO,MAAM,QAAQ;;CAMpB,CAAC"}
+{"version":3,"file":"withClientProvider.stories.d.ts","sourceRoot":"","sources":["../../../../src/testing/withClientProvider.stories.tsx"],"names":[],"mappings":"AAIA,OAAO,aAAa,CAAC;AAErB,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;AA+B1B,wBAIE;AAEF,eAAO,MAAM,OAAO,IAAK,CAAC;AAE1B,eAAO,MAAM,QAAQ;;CAUpB,CAAC"}

package/package.json

@@ -1,73 +1,65 @@
 {
   "name": "@dxos/react-client",
-  "version": "0.6.13-main.ed424a1",
+  "version": "0.6.13",
   "description": "React client API",
   "homepage": "https://dxos.org",
   "bugs": "https://github.com/dxos/dxos/issues",
   "license": "MIT",
   "author": "DXOS.org",
   "exports": {
+    ".": {
+      "browser": "./dist/lib/browser/index.mjs",
+      "node": {
+        "default": "./dist/lib/node/index.cjs"
+      },
+      "types": "./dist/types/src/index.d.ts"
+    },
     "./devtools": {
       "browser": "./dist/lib/browser/devtools/index.mjs",
       "node": {
-        "require": "./dist/lib/node/devtools/index.cjs",
-        "default": "./dist/lib/node-esm/devtools/index.mjs"
+        "default": "./dist/lib/node/devtools/index.cjs"
       },
       "types": "./dist/types/src/devtools/index.d.ts"
     },
     "./echo": {
       "browser": "./dist/lib/browser/echo/index.mjs",
       "node": {
-        "require": "./dist/lib/node/echo/index.cjs",
-        "default": "./dist/lib/node-esm/echo/index.mjs"
+        "default": "./dist/lib/node/echo/index.cjs"
       },
       "types": "./dist/types/src/echo/index.d.ts"
     },
     "./halo": {
       "browser": "./dist/lib/browser/halo/index.mjs",
       "node": {
-        "require": "./dist/lib/node/halo/index.cjs",
-        "default": "./dist/lib/node-esm/halo/index.mjs"
+        "default": "./dist/lib/node/halo/index.cjs"
       },
       "types": "./dist/types/src/halo/index.d.ts"
     },
-    ".": {
-      "browser": "./dist/lib/browser/index.mjs",
-      "node": {
-        "require": "./dist/lib/node/index.cjs",
-        "default": "./dist/lib/node-esm/index.mjs"
-      },
-      "types": "./dist/types/src/index.d.ts"
-    },
     "./invitations": {
       "browser": "./dist/lib/browser/invitations/index.mjs",
       "node": {
-        "require": "./dist/lib/node/invitations/index.cjs",
-        "default": "./dist/lib/node-esm/invitations/index.mjs"
+        "default": "./dist/lib/node/invitations/index.cjs"
       },
       "types": "./dist/types/src/invitations/index.d.ts"
     },
     "./mesh": {
       "browser": "./dist/lib/browser/mesh/index.mjs",
       "node": {
-        "require": "./dist/lib/node/mesh/index.cjs",
-        "default": "./dist/lib/node-esm/mesh/index.mjs"
+        "default": "./dist/lib/node/mesh/index.cjs"
       },
       "types": "./dist/types/src/mesh/index.d.ts"
     },
     "./testing": {
       "browser": "./dist/lib/browser/testing/index.mjs",
       "node": {
-        "require": "./dist/lib/node/testing/index.cjs",
-        "default": "./dist/lib/node-esm/testing/index.mjs"
+        "default": "./dist/lib/node/testing/index.cjs"
       },
       "types": "./dist/types/src/testing/index.d.ts"
     },
     "./worker": {
       "browser": "./dist/lib/browser/worker.mjs",
       "node": {
-        "require": "./dist/lib/node/worker.cjs",
-        "default": "./dist/lib/node-esm/worker.mjs"
+        "default": "./dist/lib/node/worker.cjs"
       },
       "types": "./dist/types/src/worker.d.ts"
     }
@@ -100,19 +92,19 @@
   },
   "dependencies": {
     "react-error-boundary": "^4.0.13",
-    "@dxos/async": "0.6.13-main.ed424a1",
-    "@dxos/client": "0.6.13-main.ed424a1",
-    "@dxos/codec-protobuf": "0.6.13-main.ed424a1",
-    "@dxos/debug": "0.6.13-main.ed424a1",
-    "@dxos/echo-schema": "0.6.13-main.ed424a1",
-    "@dxos/config": "0.6.13-main.ed424a1",
-    "@dxos/echo-signals": "0.6.13-main.ed424a1",
-    "@dxos/log": "0.6.13-main.ed424a1",
-    "@dxos/invariant": "0.6.13-main.ed424a1",
-    "@dxos/node-std": "0.6.13-main.ed424a1",
-    "@dxos/protocols": "0.6.13-main.ed424a1",
-    "@dxos/util": "0.6.13-main.ed424a1",
-    "@dxos/react-hooks": "0.6.13-main.ed424a1"
+    "@dxos/async": "0.6.13",
+    "@dxos/codec-protobuf": "0.6.13",
+    "@dxos/debug": "0.6.13",
+    "@dxos/config": "0.6.13",
+    "@dxos/client": "0.6.13",
+    "@dxos/echo-schema": "0.6.13",
+    "@dxos/echo-signals": "0.6.13",
+    "@dxos/invariant": "0.6.13",
+    "@dxos/protocols": "0.6.13",
+    "@dxos/node-std": "0.6.13",
+    "@dxos/log": "0.6.13",
+    "@dxos/react-hooks": "0.6.13",
+    "@dxos/util": "0.6.13"
   },
   "devDependencies": {
     "@testing-library/dom": "^8.17.1",
@@ -122,21 +114,20 @@
     "@types/react-dom": "~18.2.0",
     "react": "~18.2.0",
     "react-dom": "~18.2.0",
-    "@dxos/random": "0.6.13-main.ed424a1",
-    "@dxos/react-ui": "0.6.13-main.ed424a1",
-    "@dxos/react-ui-syntax-highlighter": "0.6.13-main.ed424a1",
-    "@dxos/react-ui-theme": "0.6.13-main.ed424a1",
-    "@dxos/storybook-utils": "0.6.13-main.ed424a1",
-    "@dxos/test-utils": "0.6.13-main.ed424a1"
+    "@dxos/react-ui-syntax-highlighter": "0.6.13",
+    "@dxos/react-ui": "0.6.13",
+    "@dxos/random": "0.6.13",
+    "@dxos/react-ui-theme": "0.6.13",
+    "@dxos/storybook-utils": "0.6.13"
   },
   "peerDependencies": {
-    "react": "~18.2.0",
-    "react-dom": "~18.2.0",
-    "@dxos/react-ui": "0.6.13-main.ed424a1",
-    "@dxos/react-ui-theme": "0.6.13-main.ed424a1"
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "@dxos/react-ui": "0.6.13",
+    "@dxos/react-ui-theme": "0.6.13"
   },
   "optionalDependencies": {
-    "@dxos/random": "0.6.13-main.ed424a1"
+    "@dxos/random": "0.6.13"
   },
   "publishConfig": {
     "access": "public"

package/project.json

@@ -26,13 +26,32 @@
       "dependsOn": [
         "^compile",
         "stories:mkdist"
-      ]
+      ],
+      "options": {
+        "playwrightConfigPath": "{projectRoot}/src/playwright/playwright.config.ts",
+        "serve": "stories:storybook-e2e",
+        "testPatterns": [
+          "{projectRoot}/src/playwright/**/*.spec.{ts,js}"
+        ],
+        "timeout": 60000,
+        "watchPatterns": [
+          "{projectRoot}/src/**/*"
+        ]
+      }
     },
     "lint": {},
-    "test": {}
+    "test": {
+      "options": {
+        "ciEnvironments": [
+          "nodejs"
+        ],
+        "domRequired": true,
+        "forceExit": true
+      }
+    }
   },
   "implicitDependencies": [
     "esbuild",
-    "node-std"
+    "test"
   ]
 }

package/src/client/ClientProvider.test.tsx

@@ -2,13 +2,14 @@
 // Copyright 2020 DXOS.org
 //
 
-import { renderHook, screen, render, act, cleanup } from '@testing-library/react';
+import { renderHook, screen, render, act } from '@testing-library/react';
+import expect from 'expect';
 import React, { Component, type PropsWithChildren } from 'react';
-import { afterEach, beforeEach, describe, expect, test } from 'vitest';
 
 import { waitForCondition } from '@dxos/async';
 import { Client, Config, SystemStatus, fromHost } from '@dxos/client';
 import { log } from '@dxos/log';
+import { describe, test } from '@dxos/test';
 
 import { ClientProvider } from './ClientProvider';
 import { useClient } from './useClient';
@@ -96,10 +97,6 @@ describe('ClientProvider', () => {
     await client.halo.createIdentity({ displayName: 'test-user' });
   });
 
-  afterEach(() => {
-    cleanup();
-  });
-
   test('Renders with children', async () => {
     render(
       <ClientProvider client={client}>
@@ -151,7 +148,7 @@ describe('ClientProvider', () => {
 
     await act(async () => {
       await waitForCondition({
-        condition: () => !client.initialized && newClient.status.get() === SystemStatus.ACTIVE,
+        condition: () => newClient.status.get() === SystemStatus.ACTIVE && !client.initialized,
       });
     });
     expect(client.initialized).toBe(false);

package/src/client/ClientProvider.tsx

@@ -2,18 +2,12 @@
 // Copyright 2020 DXOS.org
 //
 
-import React, {
-  type FunctionComponent,
-  type PropsWithChildren,
-  forwardRef,
-  useEffect,
-  useImperativeHandle,
-  useState,
-} from 'react';
+import React, { type FunctionComponent, type ReactNode, useEffect, useMemo, useState } from 'react';
 
 import { Client, type ClientOptions, type ClientServicesProvider, SystemStatus } from '@dxos/client';
 import { type Config } from '@dxos/config';
-import { registerSignalsRuntime } from '@dxos/echo-signals/react';
+import { type S } from '@dxos/echo-schema';
+import { registerSignalFactory } from '@dxos/echo-signals/react';
 import { log } from '@dxos/log';
 import { useControlledValue } from '@dxos/react-hooks';
 import { getAsyncProviderValue, type MaybePromise, type Provider } from '@dxos/util';
@@ -24,47 +18,47 @@ import { printBanner } from '../banner';
 /**
  * Properties for the ClientProvider.
  */
-export type ClientProviderProps = Omit<ClientOptions, 'config' | 'services'> &
-  Pick<ClientContextProps, 'status'> &
-  PropsWithChildren<{
+export type ClientProviderProps = Pick<ClientContextProps, 'status'> &
+  Omit<ClientOptions, 'config' | 'services'> & {
+    children?: ReactNode;
+
     /**
-     * Client object or async provider to enable to caller to do custom initialization.
-     *
-     * NOTE: For advanced use cases only.
+     * Config object or async provider.
      */
-    client?: Client | Provider<Promise<Client>>;
+    config?: Config | Provider<Promise<Config>>;
 
     /**
-     * Config object or async provider.
+     * Client object or async provider to enable to caller to do custom initialization.
      *
-     * NOTE: If a `client` is provided then `config` is ignored.
+     * Most apps won't need this.
      */
-    // TODO(burdon): Reconcile with ClientOptions.
-    config?: Config | Provider<Promise<Config>>;
+    // TODO(wittjosiah): Remove async and just use to keep reference to client?
+    //   (Preferring `onInitialized` for custom initialization.)
+    // TODO(burdon): Use useImperativeHandle to expose client.
+    client?: Client | Provider<Promise<Client>>;
 
     /**
      * Callback to enable the caller to create a custom ClientServicesProvider.
      *
-     * NOTE: If a `client` is provided then `services` is ignored.
+     * Most apps won't need this.
      */
-    // TODO(burdon): Reconcile with ClientOptions.
     services?: ClientServicesProvider | ((config?: Config) => MaybePromise<ClientServicesProvider>);
 
     /**
-     * ReactNode to display until the client is available.
+     * List of schema to register.
      */
-    fallback?: FunctionComponent<Partial<ClientContextProps>>;
+    types?: S.Schema<any>[];
 
     /**
-     * Enable (by default) registration of Preact signals runtime for reactive ECHO objects.
-     * @see https://www.npmjs.com/package/@preact/signals-react
+     * ReactNode to display until the client is available.
      */
-    signalsRuntime?: boolean;
+    fallback?: FunctionComponent<Partial<ClientContextProps>>;
 
     /**
-     * Skip the DXOS banner.
+     * Set to false to stop default signal factory from being registered.
      */
-    noBanner?: boolean;
+    // TODO(burdon): Move to options.
+    registerSignalFactory?: boolean;
 
     /**
      * Post initialization hook to enable to caller to do custom initialization.
@@ -72,111 +66,91 @@ export type ClientProviderProps = Omit<ClientOptions, 'config' | 'services'> &
      * @param Client
      */
     onInitialized?: (client: Client) => MaybePromise<void>;
-  }>;
+  };
 
 /**
  * Root component that provides the DXOS client instance to child components.
  * To be used with the `useClient` hook.
  */
-export const ClientProvider = forwardRef<Client | undefined, ClientProviderProps>(
-  (
-    {
-      children,
-      config: configProvider,
-      client: clientProvider,
-      services: servicesProvider,
-      status: controlledStatus,
-      fallback: Fallback = () => null,
-      signalsRuntime = true,
-      noBanner,
-      onInitialized,
-      ...options
-    },
-    forwardedRef,
-  ) => {
-    useEffect(() => {
-      // TODO(wittjosiah): Ideally this should be imported asynchronously because it is optional.
-      //   Unfortunately, async import seemed to break signals React instrumentation.
-      signalsRuntime && registerSignalsRuntime();
-    }, []);
-
-    // The client is initialized asynchronously.
-    // If an error occurs during initialization, it is caught and the state is set.
-    // This allows the error to be thrown in the render method.
-    // The assumption is that a client initialization error is fatal to the app.
-    // This error will be caught by the nearest error boundary.
-    const [error, setError] = useState();
-    if (error) {
-      throw error;
+export const ClientProvider = ({
+  children,
+  config: configProvider,
+  client: clientProvider,
+  services: servicesProvider,
+  types,
+  status: controlledStatus,
+  fallback: Fallback = () => null,
+  registerSignalFactory: _registerSignalFactory = true,
+  onInitialized,
+  ...options
+}: ClientProviderProps) => {
+  useMemo(() => {
+    // TODO(wittjosiah): Ideally this should be imported asynchronously because it is optional.
+    //   Unfortunately, async import seemed to break signals React instrumentation.
+    _registerSignalFactory && registerSignalFactory();
+  }, []);
+
+  const [client, setClient] = useState(clientProvider instanceof Client ? clientProvider : undefined);
+
+  const [error, setError] = useState();
+  if (error) {
+    throw error;
+  }
+
+  // Status subscription.
+  const [status, setStatus] = useControlledValue(controlledStatus);
+  useEffect(() => {
+    if (!client) {
+      return;
     }
 
-    const [client, setClient] = useState(clientProvider instanceof Client ? clientProvider : undefined);
-
-    // Provide external access.
-    useImperativeHandle(forwardedRef, () => client, [client]);
+    const subscription = client.status.subscribe((status) => setStatus(status));
+    return () => subscription.unsubscribe();
+  }, [client, setStatus]);
+
+  // Initialize client.
+  useEffect(() => {
+    const done = async (client: Client) => {
+      await client.initialize().catch(setError);
+      log('client ready');
+      await onInitialized?.(client);
+      log('initialization complete');
+      if (types) {
+        client.addTypes(types);
+      }
 
-    // Client status subscription.
-    const [status, setStatus] = useControlledValue(controlledStatus);
-    useEffect(() => {
-      if (!client) {
-        return;
+      setClient(client);
+      setStatus(client.status.get() ?? SystemStatus.ACTIVE);
+      printBanner(client);
+    };
+
+    const t = setTimeout(async () => {
+      if (clientProvider) {
+        // Asynchronously request client.
+        const client = await getAsyncProviderValue(clientProvider);
+        await done(client);
+      } else {
+        // Asynchronously construct client (config may be undefined).
+        const config = await getAsyncProviderValue(configProvider);
+        log('resolved config', { config });
+        const services = await getAsyncProviderValue(servicesProvider, config);
+        log('created services', { services });
+        const client = new Client({ config, services, ...options });
+        log('created client');
+        await done(client);
       }
+    });
 
-      const subscription = client.status.subscribe((status) => setStatus(status));
-      return () => subscription.unsubscribe();
-    }, [client]);
-
-    // Create and/or initialize client.
-    useEffect(() => {
-      const initialize = async (client: Client) => {
-        if (!client.initialized) {
-          await client.initialize().catch(setError);
-          log('client ready');
-          await onInitialized?.(client);
-          log('initialization complete');
-        }
-
-        setClient(client);
-
-        if (!noBanner) {
-          printBanner(client);
-        }
-      };
-
-      let client: Client;
-      const t = setTimeout(async () => {
-        if (clientProvider) {
-          // Asynchronously request client.
-          client = await getAsyncProviderValue(clientProvider);
-          await initialize(client);
-        } else {
-          // Asynchronously construct client (config may be undefined).
-          const config = await getAsyncProviderValue(configProvider);
-          log('resolved config', { config });
-          const services = await getAsyncProviderValue(servicesProvider, config);
-          log('created services', { services });
-          client = new Client({ config, services, ...options });
-          log('created client');
-          await initialize(client);
-        }
-      });
-
-      return () => {
-        log('clean up');
-        clearTimeout(t);
-        void client
-          ?.destroy()
-          .then(() => {
-            log('destroyed');
-          })
-          .catch((err) => log.catch(err));
-      };
-    }, [configProvider, clientProvider, servicesProvider, noBanner]);
-
-    if (!client?.initialized || status !== SystemStatus.ACTIVE) {
-      return <Fallback client={client} status={status} />;
-    }
+    return () => {
+      log('clean up');
+      clearTimeout(t);
+      void client?.destroy().catch((err) => log.catch(err));
+    };
+  }, [clientProvider, configProvider, servicesProvider]);
+
+  if (!client || status !== SystemStatus.ACTIVE) {
+    return <Fallback client={client} status={status} />;
+  }
 
-    return <ClientContext.Provider value={{ client, status }}>{children}</ClientContext.Provider>;
-  },
-);
+  return <ClientContext.Provider value={{ client, status }}>{children}</ClientContext.Provider>;
+};