@pluv/react 0.5.10 → 0.6.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.
- package/.turbo/turbo-build.log +8 -8
- package/CHANGELOG.md +58 -0
- package/dist/index.d.ts +6 -5
- package/dist/index.js +2 -3
- package/dist/index.mjs +2 -3
- package/package.json +10 -9
- package/src/createBundle.tsx +2 -2
- package/src/createRoomBundle.tsx +8 -6
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,17 +1,17 @@
|
|
|
1
1
|
|
|
2
|
-
> @pluv/react@0.
|
|
2
|
+
> @pluv/react@0.6.0 build /home/runner/work/pluv/pluv/packages/react
|
|
3
3
|
> tsup src/index.ts --format esm,cjs --dts --external react
|
|
4
4
|
|
|
5
5
|
[34mCLI[39m Building entry: src/index.ts
|
|
6
6
|
[34mCLI[39m Using tsconfig: tsconfig.json
|
|
7
|
-
[34mCLI[39m tsup
|
|
7
|
+
[34mCLI[39m tsup v7.0.0
|
|
8
8
|
[34mCLI[39m Target: es6
|
|
9
9
|
[34mESM[39m Build start
|
|
10
10
|
[34mCJS[39m Build start
|
|
11
|
-
[32mESM[39m [1mdist/index.mjs [22m[32m8.
|
|
12
|
-
[32mESM[39m ⚡️ Build success in
|
|
13
|
-
[32mCJS[39m [1mdist/index.js [22m[32m11.
|
|
14
|
-
[32mCJS[39m ⚡️ Build success in
|
|
11
|
+
[32mESM[39m [1mdist/index.mjs [22m[32m8.63 KB[39m
|
|
12
|
+
[32mESM[39m ⚡️ Build success in 185ms
|
|
13
|
+
[32mCJS[39m [1mdist/index.js [22m[32m11.10 KB[39m
|
|
14
|
+
[32mCJS[39m ⚡️ Build success in 186ms
|
|
15
15
|
[34mDTS[39m Build start
|
|
16
|
-
[32mDTS[39m ⚡️ Build success in
|
|
17
|
-
[32mDTS[39m [1mdist/index.d.ts [22m[32m4.
|
|
16
|
+
[32mDTS[39m ⚡️ Build success in 9598ms
|
|
17
|
+
[32mDTS[39m [1mdist/index.d.ts [22m[32m4.47 KB[39m
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,63 @@
|
|
|
1
1
|
# @pluv/react
|
|
2
2
|
|
|
3
|
+
## 0.6.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 829d31b: Added support for defining persistant frontend storage for rooms via a new `addons` option on rooms.
|
|
8
|
+
|
|
9
|
+
This also introduces the first new addon `@pluv/addon-indexeddb`, which is more-or-less the equivalent to `y-indexeddb` which you can install like so:
|
|
10
|
+
|
|
11
|
+
```
|
|
12
|
+
npm install @pluv/addon-indexeddb
|
|
13
|
+
```
|
|
14
|
+
|
|
15
|
+
To use this new addon, simply pass it to options when creating a room:
|
|
16
|
+
|
|
17
|
+
```ts
|
|
18
|
+
import { addonIndexedDB } from "@pluv/addon-indexeddb";
|
|
19
|
+
import { createClient } from "@pluv/client";
|
|
20
|
+
|
|
21
|
+
const client = createClient({
|
|
22
|
+
// ...
|
|
23
|
+
});
|
|
24
|
+
|
|
25
|
+
const room = client.createRoom("my-new-room", {
|
|
26
|
+
addons: [
|
|
27
|
+
// Define your addons in an array like so
|
|
28
|
+
addonIndexedDB(),
|
|
29
|
+
],
|
|
30
|
+
});
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
Or when using `@pluv/react`:
|
|
34
|
+
|
|
35
|
+
```ts
|
|
36
|
+
const PluvRoom = createRoomBundle({
|
|
37
|
+
// ...
|
|
38
|
+
addons: [
|
|
39
|
+
// Define your addons in an array like so
|
|
40
|
+
addonIndexedDB(),
|
|
41
|
+
],
|
|
42
|
+
});
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
### Patch Changes
|
|
46
|
+
|
|
47
|
+
- 8d11672: bumped dependencies to latest
|
|
48
|
+
- Updated dependencies [8d11672]
|
|
49
|
+
- Updated dependencies [829d31b]
|
|
50
|
+
- @pluv/client@0.9.0
|
|
51
|
+
- @pluv/types@0.2.1
|
|
52
|
+
|
|
53
|
+
## 0.5.11
|
|
54
|
+
|
|
55
|
+
### Patch Changes
|
|
56
|
+
|
|
57
|
+
- 2c9c5c3: changed my-presence to be non-nullable
|
|
58
|
+
- Updated dependencies [2c9c5c3]
|
|
59
|
+
- @pluv/client@0.8.1
|
|
60
|
+
|
|
3
61
|
## 0.5.10
|
|
4
62
|
|
|
5
63
|
### Patch Changes
|
package/dist/index.d.ts
CHANGED
|
@@ -1,12 +1,13 @@
|
|
|
1
|
-
import { PluvRoomDebug, WebSocketConnection, UserInfo, AbstractRoom, InferYjsSharedTypeJson, MockedRoomEvents, PluvClient } from '@pluv/client';
|
|
1
|
+
import { PluvRoomAddon, PluvRoomDebug, WebSocketConnection, UserInfo, AbstractRoom, InferYjsSharedTypeJson, MockedRoomEvents, PluvClient } from '@pluv/client';
|
|
2
2
|
export { AbstractType, ConnectionState, createClient, y } from '@pluv/client';
|
|
3
3
|
import * as _pluv_types from '@pluv/types';
|
|
4
|
-
import { JsonObject, InputZodLike,
|
|
4
|
+
import { IOLike, JsonObject, InputZodLike, InferIOInput, Id, InferIOOutput, IOEventMessage } from '@pluv/types';
|
|
5
5
|
export { BaseUser, EventMessage, EventRecord, IOEventMessage } from '@pluv/types';
|
|
6
6
|
import { FC, Dispatch, ReactNode } from 'react';
|
|
7
7
|
import { AbstractType } from 'yjs';
|
|
8
8
|
|
|
9
|
-
interface CreateRoomBundleOptions<TPresence extends JsonObject = {}, TStorage extends Record<string, AbstractType<any>> = {}> {
|
|
9
|
+
interface CreateRoomBundleOptions<TIO extends IOLike, TPresence extends JsonObject = {}, TStorage extends Record<string, AbstractType<any>> = {}> {
|
|
10
|
+
addons?: readonly PluvRoomAddon<TIO, TPresence, TStorage>[];
|
|
10
11
|
initialStorage?: () => TStorage;
|
|
11
12
|
presence?: InputZodLike<TPresence>;
|
|
12
13
|
}
|
|
@@ -37,7 +38,7 @@ interface CreateRoomBundle<TIO extends IOLike, TPresence extends JsonObject, TSt
|
|
|
37
38
|
usePluvConnection: <T extends unknown = WebSocketConnection>(selector: (connection: WebSocketConnection) => T, options?: SubscriptionHookOptions<Id<T>>) => Id<T>;
|
|
38
39
|
usePluvEvent: <TType extends keyof InferIOOutput<TIO>>(type: TType, callback: (data: Id<IOEventMessage<TIO, TType>>) => void) => void;
|
|
39
40
|
usePluvMyPresence: <T extends unknown = TPresence>(selector?: (myPresence: TPresence) => T, options?: SubscriptionHookOptions<Id<T> | null>) => [
|
|
40
|
-
myPresence: Id<T
|
|
41
|
+
myPresence: Id<T>,
|
|
41
42
|
updateMyPresence: Dispatch<UpdateMyPresenceAction<TPresence>>
|
|
42
43
|
];
|
|
43
44
|
usePluvMyself: <T extends unknown = UserInfo<TIO, TPresence>>(selector?: (myself: Id<UserInfo<TIO, TPresence>>) => T, options?: SubscriptionHookOptions<Id<T> | null>) => Id<T> | null;
|
|
@@ -51,7 +52,7 @@ interface PluvProviderProps {
|
|
|
51
52
|
children?: ReactNode;
|
|
52
53
|
}
|
|
53
54
|
interface CreateBundle<TIO extends IOLike> {
|
|
54
|
-
createRoomBundle: <TPresence extends JsonObject = {}, TStorage extends Record<string, AbstractType<any>> = {}>(options?: CreateRoomBundleOptions<TPresence, TStorage>) => CreateRoomBundle<TIO, TPresence, TStorage>;
|
|
55
|
+
createRoomBundle: <TPresence extends JsonObject = {}, TStorage extends Record<string, AbstractType<any>> = {}>(options?: CreateRoomBundleOptions<TIO, TPresence, TStorage>) => CreateRoomBundle<TIO, TPresence, TStorage>;
|
|
55
56
|
PluvProvider: FC<PluvProviderProps>;
|
|
56
57
|
usePluvClient: () => PluvClient<TIO>;
|
|
57
58
|
}
|
package/dist/index.js
CHANGED
|
@@ -104,6 +104,7 @@ var createRoomBundle = (client, options = {}) => {
|
|
|
104
104
|
const { room: mockedRoom } = (0, import_react2.useContext)(MockedRoomContext);
|
|
105
105
|
const [room] = (0, import_react2.useState)(() => {
|
|
106
106
|
return client.createRoom(_room, {
|
|
107
|
+
addons: options.addons,
|
|
107
108
|
debug,
|
|
108
109
|
initialPresence,
|
|
109
110
|
initialStorage: typeof initialStorage === "function" ? initialStorage : options.initialStorage,
|
|
@@ -180,9 +181,7 @@ var createRoomBundle = (client, options = {}) => {
|
|
|
180
181
|
);
|
|
181
182
|
const getSnapshot = room.getMyPresence;
|
|
182
183
|
const _selector = (0, import_react2.useCallback)(
|
|
183
|
-
(snapshot) =>
|
|
184
|
-
return !snapshot ? null : selector(snapshot);
|
|
185
|
-
},
|
|
184
|
+
(snapshot) => selector(snapshot),
|
|
186
185
|
[selector]
|
|
187
186
|
);
|
|
188
187
|
const myPresence = (0, import_with_selector.useSyncExternalStoreWithSelector)(
|
package/dist/index.mjs
CHANGED
|
@@ -74,6 +74,7 @@ var createRoomBundle = (client, options = {}) => {
|
|
|
74
74
|
const { room: mockedRoom } = useContext(MockedRoomContext);
|
|
75
75
|
const [room] = useState2(() => {
|
|
76
76
|
return client.createRoom(_room, {
|
|
77
|
+
addons: options.addons,
|
|
77
78
|
debug,
|
|
78
79
|
initialPresence,
|
|
79
80
|
initialStorage: typeof initialStorage === "function" ? initialStorage : options.initialStorage,
|
|
@@ -150,9 +151,7 @@ var createRoomBundle = (client, options = {}) => {
|
|
|
150
151
|
);
|
|
151
152
|
const getSnapshot = room.getMyPresence;
|
|
152
153
|
const _selector = useCallback2(
|
|
153
|
-
(snapshot) =>
|
|
154
|
-
return !snapshot ? null : selector(snapshot);
|
|
155
|
-
},
|
|
154
|
+
(snapshot) => selector(snapshot),
|
|
156
155
|
[selector]
|
|
157
156
|
);
|
|
158
157
|
const myPresence = useSyncExternalStoreWithSelector(
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pluv/react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.6.0",
|
|
4
4
|
"description": "@pluv/client React.js bindings",
|
|
5
5
|
"author": "leedavidcs",
|
|
6
6
|
"license": "MIT",
|
|
@@ -17,24 +17,25 @@
|
|
|
17
17
|
"access": "public"
|
|
18
18
|
},
|
|
19
19
|
"dependencies": {
|
|
20
|
+
"@playwright/test": "^1.35.1",
|
|
20
21
|
"@types/use-sync-external-store": "^0.0.3",
|
|
21
22
|
"fast-deep-equal": "^3.1.3",
|
|
22
23
|
"use-sync-external-store": "^1.2.0",
|
|
23
|
-
"@pluv/client": "^0.
|
|
24
|
-
"@pluv/types": "^0.2.
|
|
24
|
+
"@pluv/client": "^0.9.0",
|
|
25
|
+
"@pluv/types": "^0.2.1"
|
|
25
26
|
},
|
|
26
27
|
"peerDependencies": {
|
|
27
28
|
"react": "^17.0.0 || ^18.0.0",
|
|
28
29
|
"yjs": "^13.0.0"
|
|
29
30
|
},
|
|
30
31
|
"devDependencies": {
|
|
31
|
-
"@types/react": "18.2.
|
|
32
|
+
"@types/react": "18.2.13",
|
|
32
33
|
"react": "18.2.0",
|
|
33
|
-
"tsup": "^
|
|
34
|
-
"typescript": "^5.
|
|
35
|
-
"yjs": "^13.6.
|
|
36
|
-
"@pluv/tsconfig": "^0.1.
|
|
37
|
-
"eslint-config-pluv": "^0.1.
|
|
34
|
+
"tsup": "^7.0.0",
|
|
35
|
+
"typescript": "^5.1.3",
|
|
36
|
+
"yjs": "^13.6.4",
|
|
37
|
+
"@pluv/tsconfig": "^0.1.7",
|
|
38
|
+
"eslint-config-pluv": "^0.1.13"
|
|
38
39
|
},
|
|
39
40
|
"scripts": {
|
|
40
41
|
"build": "tsup src/index.ts --format esm,cjs --dts --external react",
|
package/src/createBundle.tsx
CHANGED
|
@@ -19,7 +19,7 @@ export interface CreateBundle<TIO extends IOLike> {
|
|
|
19
19
|
TPresence extends JsonObject = {},
|
|
20
20
|
TStorage extends Record<string, AbstractType<any>> = {}
|
|
21
21
|
>(
|
|
22
|
-
options?: CreateRoomBundleOptions<TPresence, TStorage>
|
|
22
|
+
options?: CreateRoomBundleOptions<TIO, TPresence, TStorage>
|
|
23
23
|
) => CreateRoomBundle<TIO, TPresence, TStorage>;
|
|
24
24
|
|
|
25
25
|
// components
|
|
@@ -59,7 +59,7 @@ export const createBundle = <TIO extends IOLike>(
|
|
|
59
59
|
TPresence extends JsonObject = {},
|
|
60
60
|
TStorage extends Record<string, AbstractType<any>> = {}
|
|
61
61
|
>(
|
|
62
|
-
options: CreateRoomBundleOptions<TPresence, TStorage> = {}
|
|
62
|
+
options: CreateRoomBundleOptions<TIO, TPresence, TStorage> = {}
|
|
63
63
|
): CreateRoomBundle<TIO, TPresence, TStorage> =>
|
|
64
64
|
_createRoomBundle(client, options);
|
|
65
65
|
|
package/src/createRoomBundle.tsx
CHANGED
|
@@ -4,6 +4,7 @@ import type {
|
|
|
4
4
|
MockedRoomEvents,
|
|
5
5
|
PluvClient,
|
|
6
6
|
PluvRoom,
|
|
7
|
+
PluvRoomAddon,
|
|
7
8
|
PluvRoomDebug,
|
|
8
9
|
UserInfo,
|
|
9
10
|
WebSocketConnection,
|
|
@@ -37,9 +38,11 @@ import {
|
|
|
37
38
|
} from "./internal";
|
|
38
39
|
|
|
39
40
|
export interface CreateRoomBundleOptions<
|
|
41
|
+
TIO extends IOLike,
|
|
40
42
|
TPresence extends JsonObject = {},
|
|
41
43
|
TStorage extends Record<string, AbstractType<any>> = {}
|
|
42
44
|
> {
|
|
45
|
+
addons?: readonly PluvRoomAddon<TIO, TPresence, TStorage>[];
|
|
43
46
|
initialStorage?: () => TStorage;
|
|
44
47
|
presence?: InputZodLike<TPresence>;
|
|
45
48
|
}
|
|
@@ -106,7 +109,7 @@ export interface CreateRoomBundle<
|
|
|
106
109
|
selector?: (myPresence: TPresence) => T,
|
|
107
110
|
options?: SubscriptionHookOptions<Id<T> | null>
|
|
108
111
|
) => [
|
|
109
|
-
myPresence: Id<T
|
|
112
|
+
myPresence: Id<T>,
|
|
110
113
|
updateMyPresence: Dispatch<UpdateMyPresenceAction<TPresence>>
|
|
111
114
|
];
|
|
112
115
|
usePluvMyself: <T extends unknown = UserInfo<TIO, TPresence>>(
|
|
@@ -139,7 +142,7 @@ export const createRoomBundle = <
|
|
|
139
142
|
TStorage extends Record<string, AbstractType<any>> = {}
|
|
140
143
|
>(
|
|
141
144
|
client: PluvClient<TIO>,
|
|
142
|
-
options: CreateRoomBundleOptions<TPresence, TStorage> = {}
|
|
145
|
+
options: CreateRoomBundleOptions<TIO, TPresence, TStorage> = {}
|
|
143
146
|
): CreateRoomBundle<TIO, TPresence, TStorage> => {
|
|
144
147
|
/**
|
|
145
148
|
* !HACK
|
|
@@ -207,6 +210,7 @@ export const createRoomBundle = <
|
|
|
207
210
|
|
|
208
211
|
const [room] = useState<PluvRoom<TIO, TPresence, TStorage>>(() => {
|
|
209
212
|
return client.createRoom<TPresence, TStorage>(_room, {
|
|
213
|
+
addons: options.addons,
|
|
210
214
|
debug,
|
|
211
215
|
initialPresence,
|
|
212
216
|
initialStorage:
|
|
@@ -311,7 +315,7 @@ export const createRoomBundle = <
|
|
|
311
315
|
const usePluvMyPresence = <T extends unknown = TPresence>(
|
|
312
316
|
selector = identity as (myPresence: TPresence) => T,
|
|
313
317
|
options?: SubscriptionHookOptions<Id<T> | null>
|
|
314
|
-
): [Id<T
|
|
318
|
+
): [Id<T>, Dispatch<UpdateMyPresenceAction<TPresence>>] => {
|
|
315
319
|
const room = usePluvRoom();
|
|
316
320
|
|
|
317
321
|
const subscribe = useCallback(
|
|
@@ -324,9 +328,7 @@ export const createRoomBundle = <
|
|
|
324
328
|
const getSnapshot = room.getMyPresence;
|
|
325
329
|
|
|
326
330
|
const _selector = useCallback(
|
|
327
|
-
(snapshot: TPresence
|
|
328
|
-
return !snapshot ? null : (selector(snapshot) as Id<T>);
|
|
329
|
-
},
|
|
331
|
+
(snapshot: TPresence) => selector(snapshot) as Id<T>,
|
|
330
332
|
[selector]
|
|
331
333
|
);
|
|
332
334
|
|