playhtml 2.4.0 → 2.5.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/dist/main.d.ts +41 -20
- package/dist/playhtml.css +1 -0
- package/dist/playhtml.es.js +2700 -2535
- package/package.json +3 -4
- package/dist/style.css +0 -1
package/dist/main.d.ts
CHANGED
|
@@ -1,3 +1,6 @@
|
|
|
1
|
+
import { Cursor } from '../../common/src';
|
|
2
|
+
import { CursorEvents } from '../../../common/src';
|
|
3
|
+
import { CursorPresence } from '../../common/src';
|
|
1
4
|
import { default as default_2 } from 'y-partykit/provider';
|
|
2
5
|
import { ElementAwarenessEventHandlerData } from '../../common/src';
|
|
3
6
|
import { ElementData } from '../../common/src';
|
|
@@ -7,11 +10,14 @@ import { ElementSetupData } from '../../common/src';
|
|
|
7
10
|
import { EventMessage } from '../../common/src';
|
|
8
11
|
import { MappedTypeDescription } from '@syncedstore/core/types/doc';
|
|
9
12
|
import { ModifierKey } from '../../common/src';
|
|
13
|
+
import { PlayerIdentity } from '../../common/src';
|
|
10
14
|
import { PlayEvent } from '../../common/src';
|
|
11
15
|
import { RegisteredPlayEvent } from '../../common/src';
|
|
12
16
|
import { TagType } from '../../common/src';
|
|
13
17
|
import * as Y from 'yjs';
|
|
14
18
|
|
|
19
|
+
export { Cursor }
|
|
20
|
+
|
|
15
21
|
declare class CursorClientAwareness {
|
|
16
22
|
private provider;
|
|
17
23
|
private options;
|
|
@@ -46,6 +52,7 @@ declare class CursorClientAwareness {
|
|
|
46
52
|
private getTouchCursorSVG;
|
|
47
53
|
private getCustomCursorSVG;
|
|
48
54
|
private removeCursor;
|
|
55
|
+
private savePlayerIdentityToStorage;
|
|
49
56
|
private setupGlobalAPI;
|
|
50
57
|
private emitGlobalEvent;
|
|
51
58
|
private updateGlobalColors;
|
|
@@ -67,15 +74,18 @@ declare class CursorClientAwareness {
|
|
|
67
74
|
gridCells: number;
|
|
68
75
|
avgCursorsPerCell: number;
|
|
69
76
|
};
|
|
77
|
+
on<K extends keyof CursorEvents>(event: K, callback: (value: CursorEvents[K]) => void): void;
|
|
78
|
+
off<K extends keyof CursorEvents>(event: K, callback: (value: CursorEvents[K]) => void): void;
|
|
79
|
+
getSnapshot(): CursorEvents;
|
|
70
80
|
}
|
|
71
81
|
|
|
72
82
|
export declare interface CursorOptions {
|
|
73
83
|
enabled?: boolean;
|
|
74
|
-
playerIdentity?:
|
|
84
|
+
playerIdentity?: PlayerIdentity;
|
|
75
85
|
proximityThreshold?: number;
|
|
76
86
|
visibilityThreshold?: number;
|
|
77
87
|
cursorStyle?: string;
|
|
78
|
-
onProximityEntered?: (playerIdentity?:
|
|
88
|
+
onProximityEntered?: (playerIdentity?: PlayerIdentity, positions?: {
|
|
79
89
|
ours: {
|
|
80
90
|
x: number;
|
|
81
91
|
y: number;
|
|
@@ -90,6 +100,12 @@ export declare interface CursorOptions {
|
|
|
90
100
|
enableChat?: boolean;
|
|
91
101
|
}
|
|
92
102
|
|
|
103
|
+
export { CursorPresence }
|
|
104
|
+
|
|
105
|
+
declare interface DefaultRoomOptions {
|
|
106
|
+
includeSearch?: boolean;
|
|
107
|
+
}
|
|
108
|
+
|
|
93
109
|
declare function dispatchPlayEvent(message: EventMessage): void;
|
|
94
110
|
|
|
95
111
|
declare class ElementHandler<T = any, U = any, V = any> {
|
|
@@ -159,7 +175,7 @@ declare class ElementHandler<T = any, U = any, V = any> {
|
|
|
159
175
|
|
|
160
176
|
declare let globalData: Y.Map<any>;
|
|
161
177
|
|
|
162
|
-
export declare interface InitOptions<T =
|
|
178
|
+
export declare interface InitOptions<T = unknown> {
|
|
163
179
|
/**
|
|
164
180
|
* The room to connect users to (this should be a string that matches the other users
|
|
165
181
|
* that you want a given user to connect with).
|
|
@@ -187,12 +203,7 @@ export declare interface InitOptions<T = any> {
|
|
|
187
203
|
/**
|
|
188
204
|
* configuration for the default room which is based on the window's url
|
|
189
205
|
*/
|
|
190
|
-
defaultRoomOptions?:
|
|
191
|
-
/**
|
|
192
|
-
* defaults to false
|
|
193
|
-
*/
|
|
194
|
-
includeSearch?: boolean;
|
|
195
|
-
};
|
|
206
|
+
defaultRoomOptions?: DefaultRoomOptions;
|
|
196
207
|
/**
|
|
197
208
|
* Runs if playhtml fails to connect. Useful to show error messages and debugging.
|
|
198
209
|
*/
|
|
@@ -209,9 +220,11 @@ export declare interface InitOptions<T = any> {
|
|
|
209
220
|
|
|
210
221
|
declare function initPlayHTML({ host, extraCapabilities, events, defaultRoomOptions, room: inputRoom, onError, developmentMode, cursors, }?: InitOptions): Promise<default_2 | undefined>;
|
|
211
222
|
|
|
223
|
+
export { PlayerIdentity }
|
|
224
|
+
|
|
212
225
|
export declare const playhtml: PlayHTMLComponents;
|
|
213
226
|
|
|
214
|
-
declare interface PlayHTMLComponents {
|
|
227
|
+
export declare interface PlayHTMLComponents {
|
|
215
228
|
init: typeof initPlayHTML;
|
|
216
229
|
setupPlayElements: typeof setupElements;
|
|
217
230
|
setupPlayElement: typeof setupPlayElement;
|
|
@@ -219,12 +232,22 @@ declare interface PlayHTMLComponents {
|
|
|
219
232
|
setupPlayElementForTag: typeof setupPlayElementForTag;
|
|
220
233
|
syncedStore: (typeof store)["play"];
|
|
221
234
|
globalData: typeof globalData;
|
|
222
|
-
elementHandlers: Map<string, Map<string, ElementHandler
|
|
223
|
-
eventHandlers: Map<string, Array<RegisteredPlayEvent
|
|
235
|
+
elementHandlers: Map<string, Map<string, ElementHandler>>;
|
|
236
|
+
eventHandlers: Map<string, Array<RegisteredPlayEvent>>;
|
|
224
237
|
dispatchPlayEvent: typeof dispatchPlayEvent;
|
|
225
238
|
registerPlayEventListener: typeof registerPlayEventListener;
|
|
226
239
|
removePlayEventListener: typeof removePlayEventListener;
|
|
227
240
|
cursorClient: CursorClientAwareness | null;
|
|
241
|
+
roomId: string;
|
|
242
|
+
host: string;
|
|
243
|
+
listSharedElements: () => Array<{
|
|
244
|
+
type: "source" | "consumer";
|
|
245
|
+
elementId: string;
|
|
246
|
+
dataSource: string;
|
|
247
|
+
normalized: string;
|
|
248
|
+
permissions?: "read-only" | "read-write";
|
|
249
|
+
element: HTMLElement;
|
|
250
|
+
}>;
|
|
228
251
|
}
|
|
229
252
|
|
|
230
253
|
/**
|
|
@@ -257,24 +280,22 @@ declare function setupPlayElement(element: Element, { ignoreIfAlreadySetup }?: {
|
|
|
257
280
|
*/
|
|
258
281
|
declare function setupPlayElementForTag<T extends TagType | string>(element: HTMLElement, tag: T): Promise<void>;
|
|
259
282
|
|
|
283
|
+
export declare const sharedPermissions: Map<string, "read-only" | "read-write">;
|
|
284
|
+
|
|
260
285
|
declare const store: MappedTypeDescription<StoreShape>;
|
|
261
286
|
|
|
262
287
|
declare type StoreShape = {
|
|
263
|
-
play: Record<string, Record<string,
|
|
288
|
+
play: Record<string, Record<string, unknown>>;
|
|
264
289
|
};
|
|
265
290
|
|
|
291
|
+
export { TagType }
|
|
292
|
+
|
|
266
293
|
export { }
|
|
267
294
|
|
|
268
295
|
|
|
269
296
|
declare global {
|
|
270
297
|
interface Window {
|
|
271
|
-
cursors?: {
|
|
272
|
-
color: string;
|
|
273
|
-
name: string;
|
|
274
|
-
allColors: string[];
|
|
275
|
-
count: number;
|
|
276
|
-
setColor?: (color: string) => void;
|
|
277
|
-
setName?: (name: string) => void;
|
|
298
|
+
cursors?: CursorEvents & {
|
|
278
299
|
on: CursorEventEmitter["on"];
|
|
279
300
|
off: CursorEventEmitter["off"];
|
|
280
301
|
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
[can-move]{cursor:grab;transition:transform .15s;will-change:transform}[can-move].cursordown{cursor:grabbing}[can-spin]{cursor:grab;transition:transform .25s;will-change:transform}[can-spin].cursordown{cursor:grabbing}[can-grow]{cursor:pointer;transition:transform .25s;will-change:transform}[can-toggle]{cursor:pointer}[data-source][data-source-read-only]{cursor:not-allowed!important;opacity:.9}body .__playhtml-element.editing:nth-child(2n){animation-name:jiggle1;animation-iteration-count:infinite;transform-origin:50% 10%;animation-duration:.25s;animation-delay:var(--jiggle-delay)}body .__playhtml-element.editing:nth-child(2n-1){animation-name:jiggle2;animation-iteration-count:infinite;animation-direction:alternate;transform-origin:30% 5%;animation-duration:.45s;animation-delay:var(--jiggle-delay)}@keyframes jiggle1{0%{transform:rotate(-1deg);animation-timing-function:ease-in}50%{transform:rotate(1.5deg);animation-timing-function:ease-out}}@keyframes jiggle2{0%{transform:rotate(1deg);animation-timing-function:ease-in}50%{transform:rotate(-1.5deg);animation-timing-function:ease-out}}.playhtml-loading{pointer-events:none}.playhtml-loading[data-loading-behavior=hidden]{opacity:0;visibility:hidden}.playhtml-loading[data-loading-style=breathing],.playhtml-loading[can-move],.playhtml-loading[can-toggle],.playhtml-loading[can-spin],.playhtml-loading[can-grow],.playhtml-loading[can-duplicate],.playhtml-loading[can-mirror],.playhtml-loading[can-draw],.playhtml-loading [loading-behavior=animate].playhtml-loading{animation:playhtml-breathing 2s infinite ease-in-out}.playhtml-loading[loading-style=fade]{opacity:.4!important;animation:none!important;transform:none!important}.playhtml-loading[loading-style=none],.playhtml-loading[loading-behavior=none]{opacity:1!important;animation:none!important;transform:none!important;visibility:visible!important;pointer-events:auto!important}@keyframes playhtml-breathing{0%,to{opacity:.7;transform:scale(1)}50%{opacity:.4;transform:scale(1.01)}}@keyframes playhtml-pulse{0%,to{opacity:.7;transform:scale(1)}50%{opacity:.3;transform:scale(1)}}
|