playhtml 2.4.1 → 2.5.1

package/dist/main.d.ts

@@ -1,4 +1,5 @@
 import { Cursor } from '../../common/src';
+import { CursorEvents } from '../../../common/src';
 import { CursorPresence } from '../../common/src';
 import { default as default_2 } from 'y-partykit/provider';
 import { ElementAwarenessEventHandlerData } from '../../common/src';
@@ -73,15 +74,18 @@ declare class CursorClientAwareness {
         gridCells: number;
         avgCursorsPerCell: number;
     };
+    on<K extends keyof CursorEvents>(event: K, callback: (value: CursorEvents[K]) => void): void;
+    off<K extends keyof CursorEvents>(event: K, callback: (value: CursorEvents[K]) => void): void;
+    getSnapshot(): CursorEvents;
 }
 
 export declare interface CursorOptions {
     enabled?: boolean;
-    playerIdentity?: any;
+    playerIdentity?: PlayerIdentity;
     proximityThreshold?: number;
     visibilityThreshold?: number;
     cursorStyle?: string;
-    onProximityEntered?: (playerIdentity?: any, positions?: {
+    onProximityEntered?: (playerIdentity?: PlayerIdentity, positions?: {
         ours: {
             x: number;
             y: number;
@@ -94,10 +98,23 @@ export declare interface CursorOptions {
     onProximityLeft?: (connectionId: string) => void;
     onCustomCursorRender?: (connectionId: string, element: HTMLElement) => HTMLElement | null;
     enableChat?: boolean;
+    room?: CursorRoom;
+    shouldRenderCursor?: (presence: CursorPresence) => boolean;
+    getCursorStyle?: (presence: CursorPresence) => Partial<CSSStyleDeclaration> | Record<string, string>;
 }
 
 export { CursorPresence }
 
+export declare type CursorRoom = "page" | "domain" | "section" | ((context: {
+    domain: string;
+    pathname: string;
+    search: string;
+}) => string);
+
+declare interface DefaultRoomOptions {
+    includeSearch?: boolean;
+}
+
 declare function dispatchPlayEvent(message: EventMessage): void;
 
 declare class ElementHandler<T = any, U = any, V = any> {
@@ -167,7 +184,7 @@ declare class ElementHandler<T = any, U = any, V = any> {
 
 declare let globalData: Y.Map<any>;
 
-export declare interface InitOptions<T = any> {
+export declare interface InitOptions<T = unknown> {
     /**
      * The room to connect users to (this should be a string that matches the other users
      * that you want a given user to connect with).
@@ -195,12 +212,7 @@ export declare interface InitOptions<T = any> {
     /**
      * configuration for the default room which is based on the window's url
      */
-    defaultRoomOptions?: {
-        /**
-         * defaults to false
-         */
-        includeSearch?: boolean;
-    };
+    defaultRoomOptions?: DefaultRoomOptions;
     /**
      * Runs if playhtml fails to connect. Useful to show error messages and debugging.
      */
@@ -221,7 +233,7 @@ export { PlayerIdentity }
 
 export declare const playhtml: PlayHTMLComponents;
 
-declare interface PlayHTMLComponents {
+export declare interface PlayHTMLComponents {
     init: typeof initPlayHTML;
     setupPlayElements: typeof setupElements;
     setupPlayElement: typeof setupPlayElement;
@@ -229,12 +241,22 @@ declare interface PlayHTMLComponents {
     setupPlayElementForTag: typeof setupPlayElementForTag;
     syncedStore: (typeof store)["play"];
     globalData: typeof globalData;
-    elementHandlers: Map<string, Map<string, ElementHandler>> | undefined;
-    eventHandlers: Map<string, Array<RegisteredPlayEvent>> | undefined;
+    elementHandlers: Map<string, Map<string, ElementHandler>>;
+    eventHandlers: Map<string, Array<RegisteredPlayEvent>>;
     dispatchPlayEvent: typeof dispatchPlayEvent;
     registerPlayEventListener: typeof registerPlayEventListener;
     removePlayEventListener: typeof removePlayEventListener;
     cursorClient: CursorClientAwareness | null;
+    roomId: string;
+    host: string;
+    listSharedElements: () => Array<{
+        type: "source" | "consumer";
+        elementId: string;
+        dataSource: string;
+        normalized: string;
+        permissions?: "read-only" | "read-write";
+        element: HTMLElement;
+    }>;
 }
 
 /**
@@ -267,10 +289,12 @@ declare function setupPlayElement(element: Element, { ignoreIfAlreadySetup }?: {
  */
 declare function setupPlayElementForTag<T extends TagType | string>(element: HTMLElement, tag: T): Promise<void>;
 
+export declare const sharedPermissions: Map<string, "read-only" | "read-write">;
+
 declare const store: MappedTypeDescription<StoreShape>;
 
 declare type StoreShape = {
-    play: Record<string, Record<string, any>>;
+    play: Record<string, Record<string, unknown>>;
 };
 
 export { TagType }
@@ -280,11 +304,7 @@ export { }
 
 declare global {
     interface Window {
-        cursors?: {
-            color: string;
-            name: string;
-            allColors: string[];
-            count: number;
+        cursors?: CursorEvents & {
             on: CursorEventEmitter["on"];
             off: CursorEventEmitter["off"];
         };

package/dist/playhtml.css

@@ -0,0 +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)}}