@100mslive/react-sdk 0.8.7 → 0.8.8

package/dist/hooks/types.d.ts

@@ -0,0 +1,6 @@
+/**
+ * use this to control how errors are handled within a function exposed by a hook. By default this
+ * only logs the error to the console, and can be overridden for any other behaviour. For e.g.
+ * `(err) => throw err;` will ensure that any error is thrown back to the caller when the function is called.
+ */
+export declare type hooksErrHandler = (err: Error, method?: string) => void;

package/dist/hooks/useAVToggle.d.ts

@@ -0,0 +1,24 @@
+import { hooksErrHandler } from '../hooks/types';
+export interface useAVToggleResult {
+    /**
+     * true if unmuted and vice versa
+     */
+    isLocalAudioEnabled: boolean;
+    isLocalVideoEnabled: boolean;
+    /**
+     * use this function to toggle audio state, the function will only be present if the user
+     * has permission to unmute audio
+     */
+    toggleAudio?: () => void;
+    /**
+     * use this function to toggle video state, the function will only be present if the user
+     * has permission to unmute video
+     */
+    toggleVideo?: () => void;
+}
+/**
+ * Use this hook to implement mute/unmute for audio and video.
+ * isAllowedToPublish can be used to decide whether to show the toggle buttons in the UI.
+ * @param handleError to handle any error during toggle of audio/video
+ */
+export declare const useAVToggle: (handleError?: hooksErrHandler) => useAVToggleResult;

package/dist/hooks/useAVToggle.js

@@ -0,0 +1,2 @@
+import{__awaiter as o}from"../node_modules/tslib/tslib.es6.js";import{useCallback as i}from"react";import{selectIsLocalAudioEnabled as d,selectIsLocalVideoEnabled as e,selectIsInPreview as t,selectIsAllowedToPreviewMedia as l,selectIsAllowedToPublish as r}from"@100mslive/hms-video-store";import{useHMSStore as s,useHMSActions as m}from"../primitives/HmsRoomProvider.js";import{logErrorHandler as n}from"../utils/commons.js";const v=(v=n)=>{const c=s(d),a=s(e),u=s(t),g=s(u?l:r),f=m(),p=i((()=>o(void 0,void 0,void 0,(function*(){try{yield f.setLocalAudioEnabled(!c)}catch(o){v(o,"toggleAudio")}}))),[f,c,v]),b=i((()=>o(void 0,void 0,void 0,(function*(){try{yield f.setLocalVideoEnabled(!a)}catch(o){v(o,"toggleVideo")}}))),[f,a,v]);return{isLocalAudioEnabled:c,isLocalVideoEnabled:a,toggleAudio:(null==g?void 0:g.audio)?p:void 0,toggleVideo:(null==g?void 0:g.video)?b:void 0}};export{v as useAVToggle};
+//# sourceMappingURL=useAVToggle.js.map

package/dist/hooks/useAVToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAVToggle.js","sources":["../../src/hooks/useAVToggle.ts"],"sourcesContent":[null],"names":["useAVToggle","handleError","logErrorHandler","isLocalAudioEnabled","useHMSStore","selectIsLocalAudioEnabled","isLocalVideoEnabled","selectIsLocalVideoEnabled","isInPreview","selectIsInPreview","isAllowedToPublish","selectIsAllowedToPreviewMedia","selectIsAllowedToPublish","actions","useHMSActions","toggleAudio","useCallback","__awaiter","setLocalAudioEnabled","err","toggleVideo","setLocalVideoEnabled","audio","video"],"mappings":"yaAmCa,MAAAA,EAAc,CAACC,EAA+BC,KACzD,MAAMC,EAAsBC,EAAYC,GAClCC,EAAsBF,EAAYG,GAClCC,EAAcJ,EAAYK,GAE1BC,EAAqBN,EADLI,EAAcG,EAAgCC,GAE9DC,EAAUC,IAEVC,EAAcC,GAAY,IAAWC,OAAA,OAAA,OAAA,GAAA,YACrC,UACIJ,EAAQK,sBAAsBf,EAEV,CAFU,MAC7BgB,GACPlB,EAAYkB,EAAc,cAAA,CAE3B,KAAA,CAACN,EAASV,EAAqBF,IAE5BmB,EAAcJ,GAAY,IAAWC,OAAA,OAAA,OAAA,GAAA,YACrC,UACIJ,EAAQQ,sBAAsBf,EAEV,CAFU,MAC7Ba,GACPlB,EAAYkB,EAAc,cAAA,CAE3B,KAAA,CAACN,EAASP,EAAqBL,IAE3B,MAAA,CACLE,sBACAG,sBACAS,4BAAaL,EAAoBY,OAAQP,OAAc,EACvDK,4BAAaV,EAAoBa,OAAQH,OAAc,EAAA"}

package/dist/hooks/useAudioLevelStyles.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+/**
+ * This hook can be used to apply css properties on an element based on the current audio level for the passed in track.
+ * It doesn't return the audio level as it's optimised for performance. As audio level could be changing frequently we
+ * want to minimise the number of components an audio level change causes to re render.
+ * An e.g. use of this hook will be to apply box-shadow on parent tile based on audio level.
+ * @param trackId is the audio track id for which audio level needs to be used
+ * @param getStyle is a function which can take in current audio level and return the style to apply for the ref
+ * @param ref is the ref of the element on which you want the css to apply
+ */
+export declare function useAudioLevelStyles({ trackId, getStyle, ref, }: {
+    trackId?: string;
+    getStyle: (level: number) => Record<string, string>;
+    ref: React.RefObject<any>;
+}): void;

package/dist/hooks/useAudioLevelStyles.js

@@ -0,0 +1,2 @@
+import{useEffect as r}from"react";import{selectTrackAudioByID as t}from"@100mslive/hms-video-store";import{useHMSVanillaStore as o}from"../primitives/HmsRoomProvider.js";function e({trackId:e,getStyle:i,ref:s}){const m=o();r((()=>m.subscribe((r=>{if(!s.current)return;const t=i(r);for(const r in t)s.current.style[r]=t[r]}),t(e))),[i,s,m,e])}export{e as useAudioLevelStyles};
+//# sourceMappingURL=useAudioLevelStyles.js.map

package/dist/hooks/useAudioLevelStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAudioLevelStyles.js","sources":["../../src/hooks/useAudioLevelStyles.ts"],"sourcesContent":[null],"names":["useAudioLevelStyles","trackId","getStyle","ref","store","useHMSVanillaStore","useEffect","subscribe","level","current","styles","key","style","selectTrackAudioByID"],"mappings":"0KAaM,SAA8BA,GAAAC,QAClCA,EACAC,SAAAA,EAAAC,IACAA,IAMA,MAAMC,EAAQC,IAEZC,GAAA,IACEF,EAAMG,WAAkBC,IAClB,IAACL,EAAIM,QACP,OAEF,MAAMC,EAASR,EAASM,GACxB,IAAA,MAAWG,KAAOD,EACZP,EAAAM,QAAQG,MAAMD,GAAOD,EAAOC,EAAA,GAEjCE,EAAqBZ,KAC1B,CAACC,EAAUC,EAAKC,EAAOH,GAAA"}

package/dist/hooks/useAutoplayError.d.ts

@@ -0,0 +1,17 @@
+export interface useAutoplayErrorResult {
+    error: string;
+    /**
+     * call this method on a UI element click to unblock the blocked audio autoplay.
+     */
+    unblockAudio: () => Promise<void>;
+    /**
+     * Call this method to reset(hide) the UI that is rendered when there was an error
+     */
+    resetError: () => void;
+}
+/**
+ * Use this hook to show a UI(modal or a toast) when autoplay is blocked by browser and allow the user to
+ * unblock the browser autoplay block
+ * @returns {useAutoplayErrorResult}
+ */
+export declare const useAutoplayError: () => useAutoplayErrorResult;

package/dist/hooks/useAutoplayError.js

@@ -0,0 +1,2 @@
+import{__awaiter as o}from"../node_modules/tslib/tslib.es6.js";import{useState as r,useCallback as i,useEffect as e}from"react";import{HMSNotificationTypes as t}from"@100mslive/hms-video-store";import{useHMSNotifications as s,useHMSActions as d}from"../primitives/HmsRoomProvider.js";const m=()=>{const m=s(t.ERROR),[l,n]=r(""),u=d(),v=i((()=>o(void 0,void 0,void 0,(function*(){yield u.unblockAudio()}))),[u]);return e((()=>{3008===(null==m?void 0:m.data.code)&&n(null==m?void 0:m.data.message)}),[m]),{error:l,unblockAudio:v,resetError:()=>n("")}};export{m as useAutoplayError};
+//# sourceMappingURL=useAutoplayError.js.map

package/dist/hooks/useAutoplayError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAutoplayError.js","sources":["../../src/hooks/useAutoplayError.ts"],"sourcesContent":[null],"names":["useAutoplayError","notification","useHMSNotifications","HMSNotificationTypes","ERROR","error","setError","useState","actions","useHMSActions","unblockAudio","useCallback","__awaiter","useEffect","data","code","message","resetError"],"mappings":"4RAwBO,MAAMA,EAAmB,KACxB,MAAAC,EAAeC,EAAoBC,EAAqBC,QACvDC,EAAOC,GAAYC,EAAS,IAC7BC,EAAUC,IAEVC,EAAeC,GAAY,IAAWC,OAAA,OAAA,OAAA,GAAA,kBACpCJ,EAAQE,cAAA,KACb,CAACF,IAQJ,OANAK,GAAU,KACwB,QAA5BZ,aAAA,EAAAA,EAAca,KAAKC,OACrBT,EAASL,aAAY,EAAZA,EAAca,KAAKE,QAAA,GAE7B,CAACf,IAEG,CAAEI,QAAOK,eAAcO,WAAY,IAAMX,EAAS,IAAA"}

package/dist/hooks/useCustomEvent.d.ts

@@ -0,0 +1,58 @@
+import { HMSPeerID, HMSRoleName } from '@100mslive/hms-video-store';
+import { hooksErrHandler } from './types';
+export interface useCustomEventInput<T> {
+    /**
+     * type of the event, for example, MODERATOR_EVENT, EMOJI_REACTIONS etc.
+     */
+    type: string;
+    /**
+     * the handler function for when the custom event comes. It's recommended
+     * to use `useCallback` for the function passed in here for performance
+     * reasons.
+     * The callback is optional in case you want to decouple sending event and
+     * handling event in the UI.
+     */
+    onEvent?: (data: T) => void;
+    /**
+     * flag to treat event payload as json.
+     * If true, the payload will be stringified before sending and
+     * parsed before calling the onEvent handler function.
+     *
+     * Set it to `false` if you want to send/receive only string messages
+     *
+     * Set it to `true` if you want to send/receive objects
+     *
+     * default value is true
+     */
+    json?: boolean;
+    /**
+     * function to handle errors happening during sending the event
+     */
+    handleError?: hooksErrHandler;
+}
+export interface EventReceiver {
+    peerId?: HMSPeerID;
+    roleNames?: HMSRoleName[];
+}
+export interface useCustomEventResult<T> {
+    /**
+     * sends the event data to others in the room who will receive it in onEvent
+     *
+     * @example to send message to peers of specific roles
+     * ```js
+     * sendEvent(data, {roleNames: ['host','guest']})
+     * ```
+     *
+     * @example to send message to single peer
+     * ```js
+     * sendEvent(data, {peerId})
+     * ```
+     */
+    sendEvent: (data: T, receiver?: EventReceiver) => void;
+}
+/**
+ * A generic function to implement [custom events](https://www.100ms.live/docs/javascript/v2/features/chat#custom-events) in your UI.
+ * The data to be sent to remote is expected to be a serializable JSON. The serialization
+ * and deserialization is taken care of by the hook.
+ */
+export declare const useCustomEvent: <T>({ type, json, onEvent, handleError, }: useCustomEventInput<T>) => useCustomEventResult<T>;

package/dist/hooks/useCustomEvent.js

@@ -0,0 +1,2 @@
+import{__awaiter as e}from"../node_modules/tslib/tslib.es6.js";import{useEffect as s,useCallback as o}from"react";import{HMSNotificationTypes as r}from"@100mslive/hms-video-store";import{useHMSActions as t,useHMSVanillaNotifications as i}from"../primitives/HmsRoomProvider.js";import{logErrorHandler as n}from"../utils/commons.js";const m=({type:m,json:d=!0,onEvent:a,handleError:l=n})=>{const c=t(),p=i();s((()=>{c.ignoreMessageTypes([m])}),[c,m]),s((()=>{if(!p)return;return p.onNotification((e=>{const s=e.data;if(s&&s.type===m)try{const e=d?JSON.parse(s.message):s.message;null==a||a(e)}catch(e){l(e,"handleCustomEvent")}}),r.NEW_MESSAGE)}),[p,m,d,a,l]);return{sendEvent:o(((s,o)=>e(void 0,void 0,void 0,(function*(){try{const e=((e,s)=>s?JSON.stringify(e||""):e)(s,d);o&&Array.isArray(null==o?void 0:o.roleNames)?yield c.sendGroupMessage(e,o.roleNames,m):"string"==typeof(null==o?void 0:o.peerId)?yield c.sendDirectMessage(e,o.peerId,m):yield c.sendBroadcastMessage(e,m),null==a||a(s)}catch(e){l(e,"sendCustomEvent")}}))),[c,l,a,m,d])}};export{m as useCustomEvent};
+//# sourceMappingURL=useCustomEvent.js.map

package/dist/hooks/useCustomEvent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCustomEvent.js","sources":["../../src/hooks/useCustomEvent.ts"],"sourcesContent":[null],"names":["useCustomEvent","type","json","onEvent","handleError","logErrorHandler","actions","useHMSActions","notifications","useHMSVanillaNotifications","useEffect","ignoreMessageTypes","onNotification","notification","msg","data","JSON","parse","message","err","HMSNotificationTypes","NEW_MESSAGE","sendEvent","useCallback","receiver","__awaiter","dataStr","stringify","stringifyData","Array","isArray","roleNames","sendGroupMessage","peerId","sendDirectMessage","sendBroadcastMessage"],"mappings":"2UA2DA,MAOaA,EAAiB,EAC5BC,OACAC,QAAO,EACPC,UACAC,cAAcC,MAEd,MAAMC,EAAUC,IACVC,EAAgBC,IAEtBC,GAAU,KAERJ,EAAQK,mBAAmB,CAACV,GAAA,GAC3B,CAACK,EAASL,IAGbS,GAAU,KACR,IAAKF,EACH,OAaK,OAXaA,EAAcI,gBAA8BC,IAC9D,MAAMC,EAAMD,EAAaE,KACrB,GAAAD,GAAOA,EAAIb,OAASA,EAClB,IACF,MAAMc,EAAOb,EAAOc,KAAKC,MAAMH,EAAII,SAAWJ,EAAII,QAClDf,SAAAA,EAAUY,EAEgB,CAFhB,MACHI,GACPf,EAAYe,EAAc,oBAAA,CAAA,GAG7BC,EAAqBC,YACjB,GACN,CAACb,EAAeP,EAAMC,EAAMC,EAASC,IAsBxC,MAAO,CAAEkB,UAnBSC,GAChB,CAAOR,EAASS,IAA4BC,OAAA,OAAA,OAAA,GAAA,YACtC,IACI,MAAAC,EA5CQ,EAAIX,EAASb,IAAmBA,EAAOc,KAAKW,UAAUZ,GAAQ,IAAOA,EA4CnEa,CAAiBb,EAAMb,GACnCsB,GAAYK,MAAMC,QAAQN,aAAA,EAAAA,EAAUO,iBAChCzB,EAAQ0B,iBAAiBN,EAASF,EAASO,UAAW9B,GACvB,8BAAb,EAARuB,EAAUS,cACpB3B,EAAQ4B,kBAAkBR,EAASF,EAASS,OAAQhC,SAEpDK,EAAQ6B,qBAAqBT,EAASzB,GAE9CE,SAAAA,EAAUY,EAEgB,CAFhB,MACHI,GACPf,EAAYe,EAAc,kBAAA,CAAA,KAG9B,CAACb,EAASF,EAAaD,EAASF,EAAMC,IAG/B"}

package/dist/hooks/useDevices.d.ts

@@ -0,0 +1,36 @@
+import { DeviceType } from '@100mslive/hms-video-store';
+import { hooksErrHandler } from '../hooks/types';
+export declare type DeviceTypeAndInfo<T> = {
+    [key in DeviceType]?: T;
+};
+export interface useDevicesResult {
+    /**
+     * list of all devices by type
+     */
+    allDevices: DeviceTypeAndInfo<MediaDeviceInfo[]>;
+    /**
+     * selected device ids for all types
+     */
+    selectedDeviceIDs: DeviceTypeAndInfo<string>;
+    /**
+     * function to call to update device
+     */
+    updateDevice: ({ deviceType, deviceId }: {
+        deviceType: DeviceType;
+        deviceId: string;
+    }) => Promise<void>;
+}
+/**
+ * This hook can be used to implement a UI component which allows the user to manually change their
+ * audio/video device. It returns the list of all devices as well as the currently selected one. The input
+ * devices will be returned based on what the user is allowed to publish, so a audio only user won't get
+ * the audioInput field. This can be used to show the UI dropdowns properly.
+ *
+ * Note:
+ * - Browsers give access to the list of devices only if the user has given permission to access them
+ * - Changing devices manually work best in combination with remembering the user's selection for the next time, do
+ *   pass the rememberDeviceSelection flag at time of join for this to happen.
+ *
+ * @param handleError error handler for any errors during device change
+ */
+export declare const useDevices: (handleError?: hooksErrHandler) => useDevicesResult;

package/dist/hooks/useDevices.js

@@ -0,0 +1,2 @@
+import{__awaiter as e}from"../node_modules/tslib/tslib.es6.js";import{useCallback as i}from"react";import{selectDevices as t,selectLocalMediaSettings as o,selectIsAllowedToPublish as d,DeviceType as u}from"@100mslive/hms-video-store";import{useHMSActions as s,useHMSStore as p}from"../primitives/HmsRoomProvider.js";import{logErrorHandler as v}from"../utils/commons.js";const c=(c=v)=>{const a=s(),r=p(t),n=p(o),m=p(d),I={[u.audioOutput]:n.audioOutputDeviceId},l={[u.audioOutput]:r.audioOutput};m.video&&(l[u.videoInput]=r.videoInput,I[u.videoInput]=n.videoInputDeviceId),m.audio&&(l[u.audioInput]=r.audioInput,I[u.audioInput]=n.audioInputDeviceId);return{allDevices:l,selectedDeviceIDs:I,updateDevice:i((({deviceType:i,deviceId:t})=>e(void 0,void 0,void 0,(function*(){try{switch(i){case u.audioInput:yield a.setAudioSettings({deviceId:t});break;case u.videoInput:yield a.setVideoSettings({deviceId:t});break;case u.audioOutput:yield a.setAudioOutputDevice(t)}}catch(e){c(e,"updateDevices")}}))),[c,a])}};export{c as useDevices};
+//# sourceMappingURL=useDevices.js.map

package/dist/hooks/useDevices.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDevices.js","sources":["../../src/hooks/useDevices.ts"],"sourcesContent":[null],"names":["useDevices","handleError","logErrorHandler","actions","useHMSActions","sdkAllDevices","useHMSStore","selectDevices","sdkSelectedDevices","selectLocalMediaSettings","isAllowedToPublish","selectIsAllowedToPublish","selectedDeviceIDs","DeviceType","audioOutput","audioOutputDeviceId","allDevices","video","videoInput","videoInputDeviceId","audio","audioInput","audioInputDeviceId","updateDevice","useCallback","deviceType","deviceId","__awaiter","setAudioSettings","setVideoSettings","setAudioOutputDevice","err"],"mappings":"kXA2Ca,MAAAA,EAAa,CAACC,EAA+BC,KACxD,MAAMC,EAAUC,IACVC,EAAsDC,EAAYC,GAClEC,EAAqBF,EAAYG,GACjCC,EAAqBJ,EAAYK,GAEjCC,EAA+C,CAClD,CAAAC,EAAWC,aAAcN,EAAmBO,qBAEzCC,EAAmD,CACtD,CAAAH,EAAWC,aAAcT,EAAcS,aAGtCJ,EAAmBO,QACVD,EAAAH,EAAWK,YAAcb,EAAca,WAChCN,EAAAC,EAAWK,YAAcV,EAAmBW,oBAE5DT,EAAmBU,QACVJ,EAAAH,EAAWQ,YAAchB,EAAcgB,WAChCT,EAAAC,EAAWQ,YAAcb,EAAmBc,oBAwBzD,MAAA,CACLN,aACAJ,oBACAW,aAxBmBC,GACnB,EAASC,aAAYC,cAA4DC,OAAA,OAAA,OAAA,GAAA,YAC3E,IACM,OAAAF,GAAA,KACDZ,EAAWQ,iBACRlB,EAAQyB,iBAAiB,CAAEF,aACjC,MAAA,KACGb,EAAWK,iBACRf,EAAQ0B,iBAAiB,CAAEH,aACjC,MAAA,KACGb,EAAWC,kBACRX,EAAQ2B,qBAAqBJ,GAIb,CAHtB,MAEGK,GACP9B,EAAY8B,EAAc,gBAAA,CAAA,KAG9B,CAAC9B,EAAaE,IAMd"}

package/dist/hooks/useParticipantList.d.ts

@@ -0,0 +1,13 @@
+import { HMSPeer, HMSRoleName } from '@100mslive/hms-video-store';
+export interface useParticipantListResult {
+    roles: HMSRoleName[];
+    participantsByRoles: Record<string, HMSPeer[]>;
+    peerCount: number;
+    isConnected: boolean;
+}
+export declare const useParticipantList: () => {
+    roles: string[];
+    participantsByRoles: Record<string, HMSPeer[]>;
+    peerCount: number;
+    isConnected: boolean | undefined;
+};

package/dist/hooks/useParticipantList.js

@@ -0,0 +1,2 @@
+import{useMemo as o}from"react";import{selectIsConnectedToRoom as r,selectPeers as t,selectRemotePeers as e,selectPeerCount as s}from"@100mslive/hms-video-store";import{useHMSStore as i}from"../primitives/HmsRoomProvider.js";import{groupByRoles as m}from"../utils/groupBy.js";const p=()=>{const p=i(r),n=i(p?t:e),c=i(s),f=o((()=>m(n)),[n]);return{roles:Object.keys(f),participantsByRoles:f,peerCount:c,isConnected:p}};export{p as useParticipantList};
+//# sourceMappingURL=useParticipantList.js.map

package/dist/hooks/useParticipantList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useParticipantList.js","sources":["../../src/hooks/useParticipantList.ts"],"sourcesContent":[null],"names":["useParticipantList","isConnected","useHMSStore","selectIsConnectedToRoom","participantList","selectPeers","selectRemotePeers","peerCount","selectPeerCount","participantsByRoles","useMemo","groupByRoles","roles","Object","keys"],"mappings":"oRAmBO,MAAMA,EAAqB,KAChC,MAAMC,EAAcC,EAAYC,GAC1BC,EAAkBF,EAAYD,EAAcI,EAAcC,GAC1DC,EAAYL,EAAYM,GACxBC,EAAsBC,GAAQ,IAAMC,EAAaP,IAAkB,CAACA,IAEnE,MAAA,CAAEQ,MADKC,OAAOC,KAAKL,GACVA,sBAAqBF,YAAWN,cAAA"}

package/dist/hooks/useParticipants.d.ts

@@ -0,0 +1,42 @@
+import { HMSPeer, HMSRoleName } from '@100mslive/hms-video-store';
+export interface useParticipantsResult {
+    /**
+     * list of participants that match the given filters
+     */
+    participants: HMSPeer[];
+    /**
+     * Total number of participants in the room
+     */
+    peerCount: number;
+    /**
+     * is joined in the room
+     */
+    isConnected: boolean;
+    /**
+     * role names with at least one participant present with that role
+     */
+    rolesWithParticipants: HMSRoleName[];
+}
+export declare type useParticipantsParams = {
+    /** To filter by particular role */
+    role: HMSRoleName;
+    /**
+     * To filter by particular by metadata. only supports `{ isHandRaised: true }` for now
+     * @beta
+     */
+    metadata: Record<string, any>;
+    /** To filter by name/role (partial match) */
+    search: string;
+};
+/**
+ * This can be used to get the total count of participants in the room, participants
+ * filtered by role or metadata with isHandRaised or the entire participants if no params are passed
+ * @param {useParticipantsParams} params
+ * @returns {useParticipantsResult}
+ */
+export declare const useParticipants: (params?: useParticipantsParams) => {
+    participants: HMSPeer[];
+    isConnected: boolean | undefined;
+    peerCount: number;
+    rolesWithParticipants: (string | undefined)[];
+};

package/dist/hooks/useParticipants.js

@@ -0,0 +1,2 @@
+import{selectIsConnectedToRoom as e,selectPeerCount as o,selectAvailableRoleNames as r,selectPeers as i,selectRemotePeers as t,selectPeerMetadata as s}from"@100mslive/hms-video-store";import{useHMSStore as a,useHMSVanillaStore as l}from"../primitives/HmsRoomProvider.js";const n=n=>{var d;const m=a(e),v=a(o),c=a(r);let u=a(m?i:t);const p=Array.from(new Set(u.map((e=>e.roleName)))),f=l();if((null===(d=null==n?void 0:n.metadata)||void 0===d?void 0:d.isHandRaised)&&(u=u.filter((e=>f.getState(s(e.id)).isHandRaised))),(null==n?void 0:n.role)&&c.includes(n.role)&&(u=u.filter((e=>e.roleName===n.role))),null==n?void 0:n.search){const e=n.search.toLowerCase();u=u.filter((o=>{var r;return(null===(r=o.roleName)||void 0===r?void 0:r.toLowerCase().includes(e))||o.name.toLowerCase().includes(e)}))}return{participants:u,isConnected:m,peerCount:v,rolesWithParticipants:p}};export{n as useParticipants};
+//# sourceMappingURL=useParticipants.js.map

package/dist/hooks/useParticipants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useParticipants.js","sources":["../../src/hooks/useParticipants.ts"],"sourcesContent":[null],"names":["useParticipants","params","isConnected","useHMSStore","selectIsConnectedToRoom","peerCount","selectPeerCount","availableRoles","selectAvailableRoleNames","participantList","selectPeers","selectRemotePeers","rolesWithParticipants","Array","from","Set","map","peer","roleName","vanillaStore","useHMSVanillaStore","_a","metadata","isHandRaised","filter","getState","selectPeerMetadata","id","role","includes","search","toLowerCase","_a2","name","participants"],"mappings":"+QAiDa,MAAAA,EAAmBC,UAC9B,MAAMC,EAAcC,EAAYC,GAC1BC,EAAYF,EAAYG,GACxBC,EAAiBJ,EAAYK,GAC/B,IAAAC,EAAkBN,EAAYD,EAAcQ,EAAcC,GACxD,MAAAC,EAAwBC,MAAMC,KAAK,IAAIC,IAAIN,EAAgBO,QAAYC,EAAKC,aAC5EC,EAAeC,IASrB,IARsB,QAAlBC,EAAApB,aAAM,EAANA,EAAQqB,gBAAU,IAAAD,OAAA,EAAAA,EAAAE,gBACFd,EAAAA,EAAgBe,QAAcP,GACvCE,EAAaM,SAASC,EAAmBT,EAAKU,KAAKJ,iBAG1DtB,aAAM,EAANA,EAAQ2B,OAAQrB,EAAesB,SAAS5B,EAAO2B,QACjDnB,EAAkBA,EAAgBe,QAAeP,GAAAA,EAAKC,WAAajB,EAAO2B,QAExE3B,eAAAA,EAAQ6B,OAAQ,CACZ,MAAAA,EAAS7B,EAAO6B,OAAOC,cACXtB,EAAAA,EAAgBe,QACxBP,IAAA,IAAAe,EAAA,eAAAA,EAAAf,EAAKC,+BAAUa,cAAcF,SAASC,KAAWb,EAAKgB,KAAKF,cAAcF,SAASC,EAAA,GAAA,CAG9F,MAAO,CAAEI,aAAczB,EAAiBP,cAAaG,YAAWO,wBAAA"}

package/dist/hooks/usePreviewJoin.d.ts

@@ -0,0 +1,70 @@
+import { HMSConfigInitialSettings } from '@100mslive/hms-video-store';
+import { hooksErrHandler } from './types';
+export interface usePreviewInput {
+    /**
+     * name of user who is joining, this is only required if join is called
+     */
+    name?: string;
+    /**
+     * app side authentication token
+     */
+    token: string;
+    /**
+     * any extra metadata info for the peer
+     */
+    metadata?: string;
+    /**
+     * function to handle errors happening during preview
+     */
+    handleError?: hooksErrHandler;
+    initEndpoint?: string;
+    /**
+     * initial settings for audio/video and device to be used.
+     */
+    initialSettings?: HMSConfigInitialSettings;
+    /**
+     * Enable to get a network quality score while in preview. The score ranges from -1 to 5.
+     * -1 when we are not able to connect to 100ms servers within an expected time limit
+     * 0 when there is a timeout/failure when measuring the quality
+     * 1-5 ranges from poor to good quality.
+     */
+    captureNetworkQualityInPreview?: boolean;
+    asRole?: string;
+    /**
+     * if this flag is enabled, the SDK takes care of unsubscribing to the video when it goes out of view.
+     * Additionally if simulcast is enabled, it takes care of auto managing simulcast layers based on the
+     * dimensions of the video element to conserve bandwidth.
+     */
+    autoManageVideo?: boolean;
+    /**
+     * if this flag is enabled, wake lock will be acquired automatically(if supported) when joining the room, so the device
+     * will be kept awake.
+     */
+    autoManageWakeLock?: boolean;
+}
+export interface usePreviewResult {
+    /**
+     * enable the join button for the user only when this is true
+     */
+    enableJoin: boolean;
+    /**
+     * call this function to join the room
+     */
+    join: () => Promise<void>;
+    /**
+     * once the user has joined the room, till leave happens this flag will be true. It can be used
+     * to decide to show between preview form and conferencing component/video tiles.
+     */
+    isConnected: boolean;
+    /**
+     * call this function to join the room
+     */
+    preview: () => Promise<void>;
+}
+/**
+ * This hook can be used to build a preview UI component, this lets you call preview every time the passed in
+ * token changes. This hook is best used in combination with useDevices for changing devices, useAVToggle for
+ * muting/unmuting and useAudioLevelStyles for showing mic audio level to the user.
+ * Any device change or mute/unmute will be carried across to join.
+ */
+export declare const usePreviewJoin: ({ name, token, metadata, handleError, initEndpoint, initialSettings, captureNetworkQualityInPreview, asRole, autoManageVideo, autoManageWakeLock, }: usePreviewInput) => usePreviewResult;

package/dist/hooks/usePreviewJoin.js

@@ -0,0 +1,2 @@
+import{__awaiter as e}from"../node_modules/tslib/tslib.es6.js";import{useMemo as i,useCallback as o}from"react";import{selectRoomState as t,selectIsConnectedToRoom as n,HMSRoomState as a}from"@100mslive/hms-video-store";import{useHMSActions as r,useHMSStore as m}from"../primitives/HmsRoomProvider.js";import{logErrorHandler as s}from"../utils/commons.js";const d=({name:d="",token:c,metadata:v,handleError:l=s,initEndpoint:u,initialSettings:p,captureNetworkQualityInPreview:f,asRole:k,autoManageVideo:w,autoManageWakeLock:y})=>{const g=r(),j=m(t),h=m(n)||!1,b=j===a.Preview,M=i((()=>({userName:d,authToken:c,metaData:v,rememberDeviceSelection:!0,settings:p,initEndpoint:u,asRole:k,captureNetworkQualityInPreview:f,autoManageVideo:w,autoManageWakeLock:y})),[d,c,v,u,p,f,k,w,y]),P=o((()=>e(void 0,void 0,void 0,(function*(){if(c&&j===a.Disconnected){h&&(yield g.leave());try{yield g.preview(M)}catch(e){l(e,"preview")}}}))),[g,l,c,j,M,h]);return{enableJoin:b,join:o((()=>e(void 0,void 0,void 0,(function*(){if(c)try{yield g.join(M)}catch(e){l(e,"join")}}))),[g,M,l,c]),isConnected:h,preview:P}};export{d as usePreviewJoin};
+//# sourceMappingURL=usePreviewJoin.js.map

package/dist/hooks/usePreviewJoin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePreviewJoin.js","sources":["../../src/hooks/usePreviewJoin.ts"],"sourcesContent":[null],"names":["usePreviewJoin","name","token","metadata","handleError","logErrorHandler","initEndpoint","initialSettings","captureNetworkQualityInPreview","asRole","autoManageVideo","autoManageWakeLock","actions","useHMSActions","roomState","useHMSStore","selectRoomState","isConnected","selectIsConnectedToRoom","enableJoin","HMSRoomState","Preview","config","useMemo","userName","authToken","metaData","rememberDeviceSelection","settings","preview","useCallback","__awaiter","Disconnected","leave","err","join"],"mappings":"oWAiFO,MAAMA,EAAiB,EAC5BC,OAAO,GACPC,QACAC,WACAC,cAAcC,EACdC,eACAC,kBACAC,iCACAC,SACAC,kBACAC,yBAEA,MAAMC,EAAUC,IACVC,EAAYC,EAAYC,GACxBC,EAAcF,EAAYG,KAA4B,EACtDC,EAAaL,IAAcM,EAAaC,QAExCC,EAA2BC,GAAQ,KAChC,CACLC,SAAUvB,EACVwB,UAAWvB,EACXwB,SAAUvB,EACVwB,yBAAyB,EACzBC,SAAUrB,EACVD,eACAG,SACAD,iCACAE,kBACAC,wBAED,CACDV,EACAC,EACAC,EACAG,EACAC,EACAC,EACAC,EACAC,EACAC,IAGIkB,EAAUC,GAAY,IAAWC,OAAA,OAAA,OAAA,GAAA,YACrC,GAAK7B,GAGDY,IAAcM,EAAaY,aAA3B,CAGAf,UACIL,EAAQqB,SAEZ,UACIrB,EAAQiB,QAAQP,EAEI,CAFJ,MACfY,GACP9B,EAAY8B,EAAc,UAAA,CAR1B,CAQ0B,KAE3B,CAACtB,EAASR,EAAaF,EAAOY,EAAWQ,EAAQL,IAa7C,MAAA,CACLE,aACAgB,KAbWL,GAAY,IAAWC,OAAA,OAAA,OAAA,GAAA,YAClC,GAAK7B,EAGD,UACIU,EAAQuB,KAAKb,EAEO,CAFP,MACZY,GACP9B,EAAY8B,EAAc,OAAA,CAAA,KAE3B,CAACtB,EAASU,EAAQlB,EAAaF,IAKhCe,cACAY,UAAA"}

package/dist/hooks/useRecordingStreaming.d.ts

@@ -0,0 +1,10 @@
+export interface useRecordingStreamingResult {
+    isServerRecordingOn: boolean;
+    isBrowserRecordingOn: boolean;
+    isHLSRecordingOn: boolean;
+    isStreamingOn: boolean;
+    isHLSRunning: boolean;
+    isRTMPRunning: boolean;
+    isRecordingOn: boolean;
+}
+export declare const useRecordingStreaming: () => useRecordingStreamingResult;

package/dist/hooks/useRecordingStreaming.js

@@ -0,0 +1,2 @@
+import{selectRecordingState as n,selectRTMPState as r,selectHLSState as i}from"@100mslive/hms-video-store";import{useHMSStore as s}from"../primitives/HmsRoomProvider.js";const e=()=>{const e=s(n),o=s(r),g=s(i),m=e.server.running,u=e.browser.running,t=e.hls.running,R=m||u||t;return{isServerRecordingOn:m,isBrowserRecordingOn:u,isHLSRecordingOn:t,isStreamingOn:g.running||o.running,isHLSRunning:g.running,isRTMPRunning:o.running,isRecordingOn:R}};export{e as useRecordingStreaming};
+//# sourceMappingURL=useRecordingStreaming.js.map

package/dist/hooks/useRecordingStreaming.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRecordingStreaming.js","sources":["../../src/hooks/useRecordingStreaming.ts"],"sourcesContent":[null],"names":["useRecordingStreaming","recording","useHMSStore","selectRecordingState","rtmp","selectRTMPState","hls","selectHLSState","isServerRecordingOn","server","running","isBrowserRecordingOn","browser","isHLSRecordingOn","isRecordingOn","isStreamingOn","isHLSRunning","isRTMPRunning"],"mappings":"0KAaO,MAAMA,EAAwB,KACnC,MAAMC,EAAYC,EAAYC,GACxBC,EAAOF,EAAYG,GACnBC,EAAMJ,EAAYK,GAElBC,EAAsBP,EAAUQ,OAAOC,QACvCC,EAAuBV,EAAUW,QAAQF,QACzCG,EAAmBZ,EAAUK,IAAII,QAEjCI,EAAgBN,GAAuBG,GAAwBE,EAE9D,MAAA,CACLL,sBACAG,uBACAE,mBACAE,cAPoBT,EAAII,SAAWN,EAAKM,QAQxCM,aAAcV,EAAII,QAClBO,cAAeb,EAAKM,QACpBI,gBAAA"}

package/dist/hooks/useRemoteAVToggle.d.ts

@@ -0,0 +1,36 @@
+import { HMSTrackID } from '@100mslive/hms-video-store';
+import { hooksErrHandler } from './types';
+export interface useRemoteAVToggleResult {
+    /**
+     * true if unmuted and vice versa
+     */
+    isAudioEnabled: boolean;
+    isVideoEnabled: boolean;
+    /**
+     * current volume of the audio track
+     */
+    volume?: number;
+    /**
+     * use this function to toggle audio state, the function will only be present if the user
+     * has permission to mute/unmute remote audio
+     */
+    toggleAudio?: () => void;
+    /**
+     * use this function to toggle video state, the function will only be present if the user
+     * has permission to mute/unmute remote video
+     */
+    toggleVideo?: () => void;
+    /**
+     * use this function to set the volume of peer's audio track for the local user, the function will
+     * only be present if the remote peer has an audio track to change volume for
+     */
+    setVolume?: (volume: number) => void;
+}
+/**
+ * This hook can be used to implement remote mute/unmute + audio volume changer on tile level.
+ * @param peerId of the peer whose tracks need to be managed
+ * @param audioTrackId of the peer whose tracks need to be managed
+ * @param videoTrackId of the peer whose tracks need to be managed
+ * @param handleError to handle any error during toggle of audio/video
+ */
+export declare const useRemoteAVToggle: (audioTrackId: HMSTrackID, videoTrackId: HMSTrackID, handleError?: hooksErrHandler) => useRemoteAVToggleResult;

package/dist/hooks/useRemoteAVToggle.js

@@ -0,0 +1,2 @@
+import{__awaiter as o}from"../node_modules/tslib/tslib.es6.js";import{useCallback as i}from"react";import{selectAudioTrackByID as e,selectVideoTrackByID as d,selectAudioTrackVolume as l,selectPermissions as n}from"@100mslive/hms-video-store";import{useHMSActions as t,useHMSStore as u}from"../primitives/HmsRoomProvider.js";import{logErrorHandler as m}from"../utils/commons.js";const v=(i,e,d)=>o(void 0,void 0,void 0,(function*(){if(e)try{yield i.setRemoteTrackEnabled(e.id,!e.enabled)}catch(o){d(o,"remoteToggle")}})),r=(r,s,a=m)=>{const c=t(),b=u(e(r)),f=u(d(s)),g=u(l(null==b?void 0:b.id)),p=u(n),y=(null==f?void 0:f.enabled)?null==p?void 0:p.mute:null==p?void 0:p.unmute,V=(null==b?void 0:b.enabled)?null==p?void 0:p.mute:null==p?void 0:p.unmute,j=i((()=>o(void 0,void 0,void 0,(function*(){yield v(c,b,a)}))),[c,b,a]),E=i((()=>o(void 0,void 0,void 0,(function*(){yield v(c,f,a)}))),[c,a,f]),h=i((o=>{b&&c.setVolume(o,b.id)}),[c,b]);return{isAudioEnabled:!!(null==b?void 0:b.enabled),isVideoEnabled:!!(null==f?void 0:f.enabled),volume:g,toggleAudio:b&&V?j:void 0,toggleVideo:"regular"===(null==f?void 0:f.source)&&y?E:void 0,setVolume:b?h:void 0}};export{r as useRemoteAVToggle};
+//# sourceMappingURL=useRemoteAVToggle.js.map

package/dist/hooks/useRemoteAVToggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useRemoteAVToggle.js","sources":["../../src/hooks/useRemoteAVToggle.ts"],"sourcesContent":[null],"names":["toggleTrackEnabled","actions","track","handleError","__awaiter","setRemoteTrackEnabled","id","enabled","err","useRemoteAVToggle","audioTrackId","videoTrackId","logErrorHandler","useHMSActions","audioTrack","useHMSStore","selectAudioTrackByID","videoTrack","selectVideoTrackByID","volume","selectAudioTrackVolume","permissions","selectPermissions","canToggleVideo","mute","unmute","canToggleAudio","toggleAudio","useCallback","toggleVideo","setVolume","volume2","isAudioEnabled","isVideoEnabled","source"],"mappings":"0XA0CA,MAAMA,EAAqB,CACzBC,EACAC,EACAC,IACEC,OAAA,OAAA,OAAA,GAAA,YACF,GAAIF,EACE,UACID,EAAQI,sBAAsBH,EAAMI,IAAKJ,EAAMK,QAE3B,CAF2B,MAC9CC,GACPL,EAAYK,EAAc,eAAA,CAAA,IAYnBC,EAAoB,CAC/BC,EACAC,EACAR,EAA+BS,KAE/B,MAAMX,EAAUY,IACVC,EAAaC,EAAYC,EAAqBN,IAC9CO,EAAaF,EAAYG,EAAqBP,IAC9CQ,EAASJ,EAAYK,EAAuBN,eAAAA,EAAYR,KACxDe,EAAcN,EAAYO,GAC1BC,gBAAiB,EAAAN,EAAYV,SAAUc,aAAW,EAAXA,EAAaG,KAAOH,aAAW,EAAXA,EAAaI,OACxEC,gBAAiB,EAAAZ,EAAYP,SAAUc,aAAW,EAAXA,EAAaG,KAAOH,aAAW,EAAXA,EAAaI,OAExEE,EAAcC,GAAY,IAAWxB,OAAA,OAAA,OAAA,GAAA,kBACnCJ,EAAmBC,EAASa,EAAYX,EAC7C,KAAA,CAACF,EAASa,EAAYX,IAEnB0B,EAAcD,GAAY,IAAWxB,OAAA,OAAA,OAAA,GAAA,kBACnCJ,EAAmBC,EAASgB,EAAYd,EAC7C,KAAA,CAACF,EAASE,EAAac,IAEpBa,EAAYF,GACfG,IACKjB,GACMb,EAAA6B,UAAUC,EAAQjB,EAAWR,GAAA,GAGzC,CAACL,EAASa,IAGL,MAAA,CACLkB,kBAAkBlB,aAAA,EAAAA,EAAYP,SAC9B0B,kBAAkBhB,aAAA,EAAAA,EAAYV,SAC9BY,SACAQ,YAAab,GAAcY,EAAiBC,OAAc,EAC1DE,YAAoC,aAAbZ,aAAV,EAAAA,EAAYiB,SAAwBX,EAAiBM,OAAc,EAChFC,UAAWhB,EAAagB,OAAY,EAAA"}

package/dist/hooks/useScreenShare.d.ts

@@ -0,0 +1,40 @@
+import { HMSPeerID, HMSScreenShareConfig, HMSTrackID } from '@100mslive/hms-video-store';
+import { hooksErrHandler } from '../hooks/types';
+export interface useScreenShareResult {
+    /**
+     * true if the local user is sharing screen, false otherwise
+     */
+    amIScreenSharing: boolean;
+    /**
+     * toggle screenshare for the local user, will only be present if the user has the permission to toggle
+     */
+    toggleScreenShare?: (config?: HMSScreenShareConfig) => Promise<void>;
+    /**
+     * the id of the peer who is currently sharing screen, will only be present if there is a screenshare in the room.
+     * In case of multiple screenshares, the behaviour of which one is picked is not defined.
+     */
+    screenSharingPeerId?: HMSPeerID;
+    /**
+     * the name of the peer who is currently sharing screen. Will be undefined if no one is sharing the screen.
+     * In case of multiple screenshares, the behavior of which one is picked is not defined.
+     */
+    screenSharingPeerName?: string;
+    /**
+     * screenShare audio track id, will only be present if there is a screenshare with video track
+     */
+    screenShareVideoTrackId?: HMSTrackID;
+    /**
+     * screenShare audio track id, will only be present if there is a screenshare with audio track
+     */
+    screenShareAudioTrackId?: HMSTrackID;
+}
+/**
+ * This hook can be used to implement a screenshare toggle button as well as know about the screenshare in the room.
+ * This works best if your application only needs to show one screenshare in large view at a time with other screenshares
+ * similar to normal user tiles.
+ * For any complicated requirement with multiple screenshares it's best to use the store directly.
+ * For viewing the screenshare this hook is best used in combination with useVideo.
+ * For implementing control bar for local peer, this is used based with useAVToggle.
+ * @param handleError to handle any errors during screenshare toggle
+ */
+export declare const useScreenShare: (handleError?: hooksErrHandler) => useScreenShareResult;

package/dist/hooks/useScreenShare.js

@@ -0,0 +1,2 @@
+import{__awaiter as e}from"../node_modules/tslib/tslib.es6.js";import{useCallback as o}from"react";import{selectIsLocalScreenShared as r,selectPeerScreenSharing as i,selectScreenSharesByPeerId as d}from"@100mslive/hms-video-store";import{useHMSActions as n,useHMSStore as l}from"../primitives/HmsRoomProvider.js";import{logErrorHandler as m}from"../utils/commons.js";const s=(s=m)=>{var t,a;const v=n(),c=l(r),u=l(i),S=l(d(null==u?void 0:u.id)),h=o((o=>e(void 0,void 0,void 0,(function*(){try{yield v.setScreenShareEnabled(!c,o)}catch(e){s(e,"toggleScreenShare")}}))),[v,c,s]);return{amIScreenSharing:c,screenSharingPeerId:null==u?void 0:u.id,screenSharingPeerName:null==u?void 0:u.name,screenShareVideoTrackId:null===(t=null==S?void 0:S.video)||void 0===t?void 0:t.id,screenShareAudioTrackId:null===(a=null==S?void 0:S.audio)||void 0===a?void 0:a.id,toggleScreenShare:h}};export{s as useScreenShare};
+//# sourceMappingURL=useScreenShare.js.map

package/dist/hooks/useScreenShare.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScreenShare.js","sources":["../../src/hooks/useScreenShare.ts"],"sourcesContent":[null],"names":["useScreenShare","handleError","logErrorHandler","actions","useHMSActions","amIScreenSharing","useHMSStore","selectIsLocalScreenShared","screenSharePeer","selectPeerScreenSharing","screenShare","selectScreenSharesByPeerId","id","toggleScreenShare","useCallback","config","__awaiter","setScreenShareEnabled","err","screenSharingPeerId","screenSharingPeerName","name","screenShareVideoTrackId","_a","video","screenShareAudioTrackId","_b","audio"],"mappings":"+WAmDa,MAAAA,EAAiB,CAACC,EAA+BC,aAC5D,MAAMC,EAAUC,IACVC,EAAmBC,EAAYC,GAC/BC,EAAkBF,EAAYG,GAC9BC,EAAcJ,EAAYK,EAA2BH,eAAAA,EAAiBI,KAEtEC,EAAoBC,GACjBC,GAAiCC,OAAA,OAAA,OAAA,GAAA,YAClC,UACIb,EAAQc,uBAAuBZ,EAAkBU,EAE7B,CAF6B,MAChDG,GACPjB,EAAYiB,EAAc,oBAAA,CAG9B,KAAA,CAACf,EAASE,EAAkBJ,IAGvB,MAAA,CACLI,mBACAc,oBAAqBX,aAAA,EAAAA,EAAiBI,GACtCQ,sBAAuBZ,aAAA,EAAAA,EAAiBa,KACxCC,wBAA2C,QAAlBC,EAAAb,eAAAA,EAAac,aAAK,IAAAD,OAAA,EAAAA,EAAEX,GAC7Ca,wBAA2C,QAAlBC,EAAAhB,eAAAA,EAAaiB,aAAK,IAAAD,OAAA,EAAAA,EAAEd,GAC7CC,oBAAA"}

package/dist/hooks/useVideo.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { HMSTrackID } from '@100mslive/hms-video-store';
+export interface useVideoInput {
+    /**
+     * TrackId that is to be rendered
+     */
+    trackId?: HMSTrackID;
+    /**
+     * Boolean stating whether to override the internal behaviour.
+     * when attach is false, even if tile is inView or enabled, it won't be rendered
+     */
+    attach?: boolean;
+}
+export interface useVideoOutput {
+    videoRef: React.RefCallback<HTMLVideoElement>;
+}
+/**
+ * This hooks can be used to implement a video tile component. Given a track id it will return a ref.
+ * The returned ref can be used to set on a video element meant to display the video.
+ * The hook will take care of attaching and detaching video, and will automatically detach when the video
+ * goes out of view to save on bandwidth.
+ */
+export declare const useVideo: ({ trackId, attach }: useVideoInput) => useVideoOutput;

package/dist/hooks/useVideo.js

@@ -0,0 +1,2 @@
+import{__awaiter as r}from"../node_modules/tslib/tslib.es6.js";import{useRef as i,useCallback as e,useEffect as t}from"react";import{selectVideoTrackByID as d}from"@100mslive/hms-video-store";import{useHMSActions as o,useHMSStore as c}from"../primitives/HmsRoomProvider.js";import n from"../utils/logger.js";const u=({trackId:u,attach:l})=>{const v=o(),a=i(null),s=c(d(u)),m=i(),f=e((r=>{r&&(a.current=r)}),[]);return t((()=>{m.current?(null==s?void 0:s.id)&&m.current!==(null==s?void 0:s.id)&&r(void 0,void 0,void 0,(function*(){if(a.current)try{n.d("detaching because different track is passed"),yield v.detachVideo(m.current,a.current)}catch(r){n.w("detach video error for track",m.current,r)}m.current=null==s?void 0:s.id})):m.current=null==s?void 0:s.id}),[null==s?void 0:s.id,v]),t((()=>{r(void 0,void 0,void 0,(function*(){(null==s?void 0:s.id)&&a.current&&(!1!==l?yield v.attachVideo(s.id,a.current):yield v.detachVideo(s.id,a.current))}))}),[s,l,v]),t((()=>()=>{r(void 0,void 0,void 0,(function*(){if(a.current&&s)try{yield v.detachVideo(s.id,a.current)}catch(r){n.w("detach video error for track",s.id,r)}}))}),[]),{videoRef:f}};export{u as useVideo};
+//# sourceMappingURL=useVideo.js.map

package/dist/hooks/useVideo.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useVideo.js","sources":["../../src/hooks/useVideo.ts"],"sourcesContent":[null],"names":["useVideo","trackId","attach","actions","useHMSActions","videoRef","useRef","track","useHMSStore","selectVideoTrackByID","prevTrackId","setRefs","useCallback","node","current","useEffect","id","__awaiter","HMSLogger","d","detachVideo","err","w","attachVideo"],"mappings":"oTAyBO,MAAMA,EAAW,EAAGC,UAASC,aAClC,MAAMC,EAAUC,IACVC,EAAWC,EAAgC,MAC3CC,EAAQC,EAAYC,EAAqBR,IACzCS,EAAcJ,IAEdK,EAAUC,GAAaC,IACvBA,IACFR,EAASS,QAAUD,EAAA,GAEpB,IAkDH,OAhDAE,GAAU,KACHL,EAAYI,SAENP,eAAAA,EAAOS,KAAMN,EAAYI,0BAAYP,EAAOS,KAEzCC,OAAA,OAAA,OAAA,GAAA,YACV,GAAIZ,EAASS,QACP,IACFI,EAAUC,EAAE,qDACNhB,EAAQiB,YAAYV,EAAYI,QAAUT,EAASS,QAEQ,CAFR,MAClDO,GACGH,EAAAI,EAAE,+BAAgCZ,EAAYI,QAASO,EAAA,CAGrEX,EAAYI,QAAUP,aAAA,EAAAA,EAAOS,EAAA,IAZ/BN,EAAYI,QAAUP,aAAA,EAAAA,EAAOS,EAYE,GAGhC,CAACT,aAAK,EAALA,EAAOS,GAAIb,IAEfY,GAAU,KACIE,OAAA,OAAA,OAAA,GAAA,aACNV,aAAA,EAAAA,EAAOS,KAAMX,EAASS,WACT,IAAXZ,QACIC,EAAQoB,YAAYhB,EAAMS,GAAIX,EAASS,eAEvCX,EAAQiB,YAAYb,EAAMS,GAAIX,EAASS,SAAA,GAAA,GAIlD,CAACP,EAAOL,EAAQC,IAGnBY,GAAU,IACD,KACOE,OAAA,OAAA,OAAA,GAAA,YACN,GAAAZ,EAASS,SAAWP,EAClB,UAEIJ,EAAQiB,YAAYb,EAAMS,GAAIX,EAASS,QAES,CAFT,MACtCO,GACGH,EAAAI,EAAE,+BAAgCf,EAAMS,GAAIK,EAAA,CAAA,GAAA,GAM7D,IAEI,CAAEhB,SAAUM,EAAA"}

package/dist/hooks/useVideoList.d.ts

@@ -0,0 +1,68 @@
+import React from 'react';
+import { HMSPeer } from '@100mslive/hms-video-store';
+import { TrackWithPeer } from '../utils/layout';
+export interface useVideoListInput {
+    /**
+     * peers is the list of all peers you need to display
+     */
+    peers: HMSPeer[];
+    /**
+     * Max tiles in a  page. Overrides maxRowCount and maxColCount
+     */
+    maxTileCount?: number;
+    /**
+     * Max rows in a  page. Only applied if maxTileCount is not present
+     */
+    maxRowCount?: number;
+    /**
+     * Max columns in a  page. Only applied if maxTileCount and maxRowCount are not present
+     */
+    maxColCount?: number;
+    /**
+     * A function which tells whether to show the screenshare for a peer who is sharing their screen. A peer is passed
+     * and a boolean value is expected.
+     * This can be useful if there are multiple screenShares in the room where you may want to show the main one in the
+     * center view and others in video list along side other tiles. No screenShare is included by default.
+     * for example. includeScreenShare = (peer) => return peer.id !== mainScreenSharingPeer.id
+     */
+    includeScreenShareForPeer?: (peer: HMSPeer) => boolean;
+    /**
+     * Aspect ratio of VideoTiles, ideally this should be the same as the aspect ratio selected for
+     * capture in the dashboard template.
+     */
+    aspectRatio?: {
+        width: number;
+        height: number;
+    };
+    /**
+     * By default this will be true. Only publishing(audio/video/screen) peers in the passed in peer list
+     * will be filtered. If you wish to show all peers, pass false for this.
+     */
+    filterNonPublishingPeers?: boolean;
+    /**
+     * Height that would be subtracted from the parent's height to give the available height, use case: if your pagination is inside the parent component then offsetY would be the height of pagination
+     */
+    offsetY?: number;
+}
+export interface useVideoListTile extends TrackWithPeer {
+    width: number;
+    height: number;
+}
+export interface useVideoResult {
+    /**
+     * This returns a list of all pages with every page containing the list of all tiles on it.
+     */
+    pagesWithTiles: useVideoListTile[][];
+    /**
+     * add the ref to the element going to render the video list, this is used to measure the available
+     * space/dimensions in order to calculate the best fit
+     */
+    ref: React.MutableRefObject<any>;
+}
+/**
+ * This hook can be used to build a paginated gallery view of video tiles. You can give the hook
+ * a list of all the peers which need to be shown and it tells you how to structure the UI by giving
+ * a list of pages with every page having a list of video tiles.
+ * Please check the documentation of input and output types for more details.
+ */
+export declare const useVideoList: ({ peers, maxTileCount, maxColCount, maxRowCount, includeScreenShareForPeer, aspectRatio, filterNonPublishingPeers, offsetY, }: useVideoListInput) => useVideoResult;

package/dist/hooks/useVideoList.js

@@ -0,0 +1,2 @@
+import{useMemo as t}from"react";import{useResizeDetector as e}from"react-resize-detector";import{selectTracksMap as i}from"@100mslive/hms-video-store";import{useHMSVanillaStore as r}from"../primitives/HmsRoomProvider.js";import{getVideoTracksFromPeers as o,getModeAspectRatio as a,calculateLayoutSizes as s,chunkElements as h}from"../utils/layout.js";const n={width:1,height:1},l=({peers:l,maxTileCount:m,maxColCount:g,maxRowCount:f,includeScreenShareForPeer:u=(()=>!1),aspectRatio:d=n,filterNonPublishingPeers:P=!0,offsetY:p=0})=>{const{width:c=0,height:C=0,ref:x}=e(),F=r().getState(i),H=o(l,F,u,P),W=t((()=>{if(d)return d;return{width:a(H)||1,height:1}}),[d,H]),w=H.length,{tilesInFirstPage:R,defaultWidth:v,defaultHeight:M,lastPageWidth:S,lastPageHeight:T,isLastPageDifferentFromFirstPage:j}=t((()=>s({count:w,parentWidth:Math.floor(c),parentHeight:Math.floor(C)-Math.min(C,p),maxTileCount:m,maxRowCount:f,maxColCount:g,aspectRatio:W})),[w,c,C,m,f,g,W,p]);return{pagesWithTiles:t((()=>h({elements:H,tilesInFirstPage:R,onlyOnePage:!1,isLastPageDifferentFromFirstPage:j,defaultWidth:v,defaultHeight:M,lastPageWidth:S,lastPageHeight:T})),[H,R,j,v,M,S,T]),ref:x}};export{l as useVideoList};
+//# sourceMappingURL=useVideoList.js.map

package/dist/hooks/useVideoList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useVideoList.js","sources":["../../src/hooks/useVideoList.ts"],"sourcesContent":[null],"names":["DEFAULTS","width","height","useVideoList","peers","maxTileCount","maxColCount","maxRowCount","includeScreenShareForPeer","aspectRatio","filterNonPublishingPeers","offsetY","ref","useResizeDetector","tracksMap","useHMSVanillaStore","getState","selectTracksMap","tracksWithPeer","getVideoTracksFromPeers","finalAspectRatio","useMemo","getModeAspectRatio","count","length","tilesInFirstPage","defaultWidth","defaultHeight","lastPageWidth","lastPageHeight","isLastPageDifferentFromFirstPage","calculateLayoutSizes","parentWidth","Math","floor","parentHeight","min","pagesWithTiles","chunkElements","elements","onlyOnePage"],"mappings":"+VAsEA,MAAMA,EACS,CACXC,MAAO,EACPC,OAAQ,GAUCC,EAAe,EAC1BC,QACAC,eACAC,cACAC,cACAC,4BAA4B,MAAM,GAClCC,cAAcT,EACdU,4BAA2B,EAC3BC,UAAU,MAEV,MAAMV,MAAEA,EAAQ,EAAGC,OAAAA,EAAS,MAAGU,GAAQC,IAGjCC,EAFQC,IAEwCC,SAASC,GACzDC,EAAkCC,EACtCf,EACAU,EACAN,EACAE,GAEIU,EAAmBC,GAAQ,KAC/B,GAAIZ,EACK,OAAAA,EAIF,MAAA,CACLR,MAHsBqB,EAAmBJ,IAGf,EAC1BhB,OAAQ,EAAA,GAET,CAACO,EAAaS,IACXK,EAAQL,EAAeM,QACvBC,iBACJA,eACAC,EACAC,cAAAA,EAAAC,cACAA,iBACAC,EACAC,iCAAAA,GACET,GACF,IACEU,EAAqB,CACnBR,QACAS,YAAaC,KAAKC,MAAMjC,GACxBkC,aAAcF,KAAKC,MAAMhC,GAAU+B,KAAKG,IAAIlC,EAAQS,GACpDN,eACAE,cACAD,cACAG,YAAaW,KAEjB,CAACG,EAAOtB,EAAOC,EAAQG,EAAcE,EAAaD,EAAac,EAAkBT,IAwB5E,MAAA,CACL0B,eAvB4BhB,GAC5B,IACEiB,EAA6B,CAC3BC,SAAUrB,EACVO,mBACAe,aAAa,EACbV,mCACAJ,eACAC,gBACAC,gBACAC,oBAEJ,CACEX,EACAO,EACAK,EACAJ,EACAC,EACAC,EACAC,IAKFjB,MAAA"}