@stream-io/video-react-sdk 0.0.1-alpha.9

package/dist/src/components/Moderation/Restricted.d.ts

@@ -0,0 +1,19 @@
+import { PropsWithChildren } from 'react';
+import { OwnCapability } from '@stream-io/video-client';
+type RestrictedProps = PropsWithChildren<{
+    /**
+     * OwnCapabilities of the participant - grants they have available
+     */
+    availableGrants?: OwnCapability[];
+    /**
+     * Required grants for the component to be able to render supplied children elements
+     */
+    requiredGrants: OwnCapability[];
+    /**
+     * Require all grants specified in `requiredGrants` to be available in the `availableGrants`,
+     * component by default requires only one grant to appear in both arrays to render its children
+     */
+    requireAll?: boolean;
+}>;
+export declare const Restricted: ({ availableGrants: availableGrantsFromProps, requiredGrants, requireAll, children, }: RestrictedProps) => JSX.Element | null;
+export {};

package/dist/src/components/Moderation/Restricted.js

@@ -0,0 +1,13 @@
+import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
+import { useCall, useOwnCapabilities } from '@stream-io/video-react-bindings';
+export const Restricted = ({ availableGrants: availableGrantsFromProps, requiredGrants, requireAll = true, children, }) => {
+    const call = useCall();
+    const ownCapabilities = useOwnCapabilities();
+    const availableGrants = availableGrantsFromProps || ownCapabilities;
+    const hasPermissions = requiredGrants[requireAll ? 'every' : 'some']((capability) => availableGrants.includes(capability));
+    const canRequest = requiredGrants.some((capability) => !!call && call.permissionsContext.canRequest(capability));
+    if (hasPermissions || canRequest)
+        return _jsx(_Fragment, { children: children });
+    return null;
+};
+//# sourceMappingURL=Restricted.js.map

package/dist/src/components/Moderation/Restricted.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Restricted.js","sourceRoot":"","sources":["../../../../src/components/Moderation/Restricted.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,OAAO,EAAE,kBAAkB,EAAE,MAAM,iCAAiC,CAAC;AAkB9E,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,EACzB,eAAe,EAAE,wBAAwB,EACzC,cAAc,EACd,UAAU,GAAG,IAAI,EACjB,QAAQ,GACQ,EAAE,EAAE;IACpB,MAAM,IAAI,GAAG,OAAO,EAAE,CAAC;IACvB,MAAM,eAAe,GAAG,kBAAkB,EAAE,CAAC;IAC7C,MAAM,eAAe,GAAG,wBAAwB,IAAI,eAAe,CAAC;IACpE,MAAM,cAAc,GAAG,cAAc,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAClE,CAAC,UAAU,EAAE,EAAE,CAAC,eAAe,CAAC,QAAQ,CAAC,UAAU,CAAC,CACrD,CAAC;IACF,MAAM,UAAU,GAAG,cAAc,CAAC,IAAI,CACpC,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,IAAI,IAAI,CAAC,kBAAkB,CAAC,UAAU,CAAC,UAAU,CAAC,CACzE,CAAC;IACF,IAAI,cAAc,IAAI,UAAU;QAAE,OAAO,4BAAG,QAAQ,GAAI,CAAC;IACzD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC"}

package/dist/src/components/Moderation/index.d.ts

@@ -0,0 +1 @@
+export * from './Restricted';

package/dist/src/components/Moderation/index.js

@@ -0,0 +1,2 @@
+export * from './Restricted';
+//# sourceMappingURL=index.js.map

package/dist/src/components/Moderation/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Moderation/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/src/components/Notification/Notification.d.ts

@@ -0,0 +1,11 @@
+import { PropsWithChildren, ReactNode } from 'react';
+import { Placement } from '@floating-ui/react';
+export type NotificationProps = {
+    message?: ReactNode;
+    isVisible?: boolean;
+    visibilityTimeout?: number;
+    resetIsVisible?: () => void;
+    placement?: Placement;
+    iconClassName?: string | null;
+};
+export declare const Notification: (props: PropsWithChildren<NotificationProps>) => JSX.Element;

package/dist/src/components/Notification/Notification.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect } from 'react';
+import { useFloatingUIPreset } from '../../hooks';
+export const Notification = (props) => {
+    const { isVisible, message, children, visibilityTimeout, resetIsVisible, placement = 'top', iconClassName = 'str-video__notification__icon', } = props;
+    const { refs, x, y, strategy } = useFloatingUIPreset({
+        placement,
+        strategy: 'absolute',
+    });
+    useEffect(() => {
+        if (!isVisible || !visibilityTimeout || !resetIsVisible)
+            return;
+        const timeout = setTimeout(() => {
+            resetIsVisible();
+        }, visibilityTimeout);
+        return () => clearTimeout(timeout);
+    }, [isVisible, resetIsVisible, visibilityTimeout]);
+    return (_jsxs("div", Object.assign({ ref: refs.setReference }, { children: [isVisible && (_jsxs("div", Object.assign({ className: "str-video__notification", ref: refs.setFloating, style: {
+                    position: strategy,
+                    top: y !== null && y !== void 0 ? y : 0,
+                    left: x !== null && x !== void 0 ? x : 0,
+                    overflowY: 'auto',
+                } }, { children: [iconClassName && _jsx("i", { className: iconClassName }), _jsx("span", Object.assign({ className: "str-video__notification__message" }, { children: message }))] }))), children] })));
+};
+//# sourceMappingURL=Notification.js.map

package/dist/src/components/Notification/Notification.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Notification.js","sourceRoot":"","sources":["../../../../src/components/Notification/Notification.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAgC,SAAS,EAAE,MAAM,OAAO,CAAC;AAGhE,OAAO,EAAE,mBAAmB,EAAE,MAAM,aAAa,CAAC;AAWlD,MAAM,CAAC,MAAM,YAAY,GAAG,CAAC,KAA2C,EAAE,EAAE;IAC1E,MAAM,EACJ,SAAS,EACT,OAAO,EACP,QAAQ,EACR,iBAAiB,EACjB,cAAc,EACd,SAAS,GAAG,KAAK,EACjB,aAAa,GAAG,+BAA+B,GAChD,GAAG,KAAK,CAAC;IAEV,MAAM,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,mBAAmB,CAAC;QACnD,SAAS;QACT,QAAQ,EAAE,UAAU;KACrB,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,IAAI,CAAC,iBAAiB,IAAI,CAAC,cAAc;YAAE,OAAO;QAEhE,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YAC9B,cAAc,EAAE,CAAC;QACnB,CAAC,EAAE,iBAAiB,CAAC,CAAC;QAEtB,OAAO,GAAG,EAAE,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC;IACrC,CAAC,EAAE,CAAC,SAAS,EAAE,cAAc,EAAE,iBAAiB,CAAC,CAAC,CAAC;IAEnD,OAAO,CACL,6BAAK,GAAG,EAAE,IAAI,CAAC,YAAY,iBACxB,SAAS,IAAI,CACZ,6BACE,SAAS,EAAC,yBAAyB,EACnC,GAAG,EAAE,IAAI,CAAC,WAAW,EACrB,KAAK,EAAE;oBACL,QAAQ,EAAE,QAAQ;oBAClB,GAAG,EAAE,CAAC,aAAD,CAAC,cAAD,CAAC,GAAI,CAAC;oBACX,IAAI,EAAE,CAAC,aAAD,CAAC,cAAD,CAAC,GAAI,CAAC;oBACZ,SAAS,EAAE,MAAM;iBAClB,iBAEA,aAAa,IAAI,YAAG,SAAS,EAAE,aAAa,GAAI,EACjD,6BAAM,SAAS,EAAC,kCAAkC,gBAAE,OAAO,IAAQ,KAC/D,CACP,EACA,QAAQ,KACL,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/src/components/Notification/PermissionNotification.d.ts

@@ -0,0 +1,33 @@
+import { OwnCapability } from '@stream-io/video-client';
+import { PropsWithChildren } from 'react';
+export type PermissionNotificationProps = PropsWithChildren<{
+    /**
+     * The permission to check for.
+     */
+    permission: OwnCapability;
+    /**
+     * Set this to true if there is ongoing request for the permission.
+     */
+    isAwaitingApproval: boolean;
+    /**
+     * The message to display in the notification once
+     * the requested permission is granted.
+     */
+    messageApproved: string;
+    /**
+     * The message to display in the notification once a permission
+     * is revoked.
+     */
+    messageRevoked: string;
+    /**
+     * The message to display in the notification while
+     * the requested permission is awaiting approval.
+     */
+    messageAwaitingApproval: string;
+    /**
+     * The time in milliseconds to display the notification.
+     * Defaults to 3500ms.
+     */
+    visibilityTimeout?: number;
+}>;
+export declare const PermissionNotification: (props: PermissionNotificationProps) => JSX.Element;

package/dist/src/components/Notification/PermissionNotification.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Notification } from './Notification';
+import { useCallback, useEffect, useRef, useState, } from 'react';
+import { useHasPermissions } from '@stream-io/video-react-bindings';
+export const PermissionNotification = (props) => {
+    const { permission, isAwaitingApproval, messageApproved, messageAwaitingApproval, messageRevoked, visibilityTimeout = 3500, children, } = props;
+    const hasPermission = useHasPermissions(permission);
+    const prevHasPermission = useRef(hasPermission);
+    const [showNotification, setShowNotification] = useState();
+    useEffect(() => {
+        if (hasPermission && !prevHasPermission.current) {
+            setShowNotification('granted');
+            prevHasPermission.current = true;
+        }
+        else if (!hasPermission && prevHasPermission.current) {
+            setShowNotification('revoked');
+            prevHasPermission.current = false;
+        }
+    }, [hasPermission]);
+    const resetIsVisible = useCallback(() => setShowNotification(undefined), []);
+    if (isAwaitingApproval) {
+        return (_jsx(Notification, Object.assign({ isVisible: isAwaitingApproval && !hasPermission, message: messageAwaitingApproval }, { children: children })));
+    }
+    return (_jsx(Notification, Object.assign({ isVisible: !!showNotification, visibilityTimeout: visibilityTimeout, resetIsVisible: resetIsVisible, message: showNotification === 'granted' ? messageApproved : messageRevoked }, { children: children })));
+};
+//# sourceMappingURL=PermissionNotification.js.map

package/dist/src/components/Notification/PermissionNotification.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PermissionNotification.js","sourceRoot":"","sources":["../../../../src/components/Notification/PermissionNotification.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAE9C,OAAO,EAEL,WAAW,EACX,SAAS,EACT,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAC;AACf,OAAO,EAAE,iBAAiB,EAAE,MAAM,iCAAiC,CAAC;AAsCpE,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,KAAkC,EAAE,EAAE;IAC3E,MAAM,EACJ,UAAU,EACV,kBAAkB,EAClB,eAAe,EACf,uBAAuB,EACvB,cAAc,EACd,iBAAiB,GAAG,IAAI,EACxB,QAAQ,GACT,GAAG,KAAK,CAAC;IACV,MAAM,aAAa,GAAG,iBAAiB,CAAC,UAAU,CAAC,CAAC;IACpD,MAAM,iBAAiB,GAAG,MAAM,CAAC,aAAa,CAAC,CAAC;IAChD,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,EAErD,CAAC;IACJ,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,aAAa,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE;YAC/C,mBAAmB,CAAC,SAAS,CAAC,CAAC;YAC/B,iBAAiB,CAAC,OAAO,GAAG,IAAI,CAAC;SAClC;aAAM,IAAI,CAAC,aAAa,IAAI,iBAAiB,CAAC,OAAO,EAAE;YACtD,mBAAmB,CAAC,SAAS,CAAC,CAAC;YAC/B,iBAAiB,CAAC,OAAO,GAAG,KAAK,CAAC;SACnC;IACH,CAAC,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC;IAEpB,MAAM,cAAc,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,mBAAmB,CAAC,SAAS,CAAC,EAAE,EAAE,CAAC,CAAC;IAC7E,IAAI,kBAAkB,EAAE;QACtB,OAAO,CACL,KAAC,YAAY,kBACX,SAAS,EAAE,kBAAkB,IAAI,CAAC,aAAa,EAC/C,OAAO,EAAE,uBAAuB,gBAE/B,QAAQ,IACI,CAChB,CAAC;KACH;IAED,OAAO,CACL,KAAC,YAAY,kBACX,SAAS,EAAE,CAAC,CAAC,gBAAgB,EAC7B,iBAAiB,EAAE,iBAAiB,EACpC,cAAc,EAAE,cAAc,EAC9B,OAAO,EACL,gBAAgB,KAAK,SAAS,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,cAAc,gBAGlE,QAAQ,IACI,CAChB,CAAC;AACJ,CAAC,CAAC"}

package/dist/src/components/Notification/SpeakingWhileMutedNotification.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+import { ChildrenOnly } from '../../types';
+export declare const SpeakingWhileMutedNotification: ({ children }: ChildrenOnly) => JSX.Element;

package/dist/src/components/Notification/SpeakingWhileMutedNotification.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { createSoundDetector, SfuModels } from '@stream-io/video-client';
+import { useLocalParticipant } from '@stream-io/video-react-bindings';
+import { useMediaDevices } from '../../core/contexts';
+import { Notification } from './Notification';
+export const SpeakingWhileMutedNotification = ({ children }) => {
+    const localParticipant = useLocalParticipant();
+    const { getAudioStream } = useMediaDevices();
+    const isAudioMute = !(localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.publishedTracks.includes(SfuModels.TrackType.AUDIO));
+    const audioDeviceId = localParticipant === null || localParticipant === void 0 ? void 0 : localParticipant.audioDeviceId;
+    const [isSpeakingWhileMuted, setIsSpeakingWhileMuted] = useState(false);
+    useEffect(() => {
+        // do nothing when not muted
+        if (!isAudioMute)
+            return;
+        const disposeSoundDetector = getAudioStream(audioDeviceId).then((audioStream) => createSoundDetector(audioStream, (isSpeechDetected) => {
+            setIsSpeakingWhileMuted((isNotified) => isNotified ? isNotified : isSpeechDetected);
+        }));
+        disposeSoundDetector.catch((err) => {
+            console.error('Error while creating sound detector', err);
+        });
+        return () => {
+            disposeSoundDetector
+                .then((dispose) => dispose())
+                .catch((err) => {
+                console.error('Error while disposing sound detector', err);
+            });
+            setIsSpeakingWhileMuted(false);
+        };
+    }, [audioDeviceId, getAudioStream, isAudioMute]);
+    useEffect(() => {
+        if (!isSpeakingWhileMuted)
+            return;
+        const timeout = setTimeout(() => {
+            setIsSpeakingWhileMuted(false);
+        }, 3500);
+        return () => {
+            clearTimeout(timeout);
+            setIsSpeakingWhileMuted(false);
+        };
+    }, [isSpeakingWhileMuted]);
+    return (_jsx(Notification, Object.assign({ message: "You are muted. Unmute to speak.", isVisible: isSpeakingWhileMuted }, { children: children })));
+};
+//# sourceMappingURL=SpeakingWhileMutedNotification.js.map

package/dist/src/components/Notification/SpeakingWhileMutedNotification.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SpeakingWhileMutedNotification.js","sourceRoot":"","sources":["../../../../src/components/Notification/SpeakingWhileMutedNotification.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,mBAAmB,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACzE,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAC;AAEtE,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C,MAAM,CAAC,MAAM,8BAA8B,GAAG,CAAC,EAAE,QAAQ,EAAgB,EAAE,EAAE;IAC3E,MAAM,gBAAgB,GAAG,mBAAmB,EAAE,CAAC;IAC/C,MAAM,EAAE,cAAc,EAAE,GAAG,eAAe,EAAE,CAAC;IAE7C,MAAM,WAAW,GAAG,CAAC,CAAA,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,eAAe,CAAC,QAAQ,CAC7D,SAAS,CAAC,SAAS,CAAC,KAAK,CAC1B,CAAA,CAAC;IACF,MAAM,aAAa,GAAG,gBAAgB,aAAhB,gBAAgB,uBAAhB,gBAAgB,CAAE,aAAa,CAAC;IACtD,MAAM,CAAC,oBAAoB,EAAE,uBAAuB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxE,SAAS,CAAC,GAAG,EAAE;QACb,4BAA4B;QAC5B,IAAI,CAAC,WAAW;YAAE,OAAO;QACzB,MAAM,oBAAoB,GAAG,cAAc,CAAC,aAAa,CAAC,CAAC,IAAI,CAC7D,CAAC,WAAW,EAAE,EAAE,CACd,mBAAmB,CAAC,WAAW,EAAE,CAAC,gBAAgB,EAAE,EAAE;YACpD,uBAAuB,CAAC,CAAC,UAAU,EAAE,EAAE,CACrC,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,gBAAgB,CAC3C,CAAC;QACJ,CAAC,CAAC,CACL,CAAC;QACF,oBAAoB,CAAC,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE;YACjC,OAAO,CAAC,KAAK,CAAC,qCAAqC,EAAE,GAAG,CAAC,CAAC;QAC5D,CAAC,CAAC,CAAC;QACH,OAAO,GAAG,EAAE;YACV,oBAAoB;iBACjB,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,OAAO,EAAE,CAAC;iBAC5B,KAAK,CAAC,CAAC,GAAG,EAAE,EAAE;gBACb,OAAO,CAAC,KAAK,CAAC,sCAAsC,EAAE,GAAG,CAAC,CAAC;YAC7D,CAAC,CAAC,CAAC;YACL,uBAAuB,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,aAAa,EAAE,cAAc,EAAE,WAAW,CAAC,CAAC,CAAC;IAEjD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,oBAAoB;YAAE,OAAO;QAClC,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE;YAC9B,uBAAuB,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,EAAE,IAAI,CAAC,CAAC;QACT,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,OAAO,CAAC,CAAC;YACtB,uBAAuB,CAAC,KAAK,CAAC,CAAC;QACjC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,oBAAoB,CAAC,CAAC,CAAC;IAC3B,OAAO,CACL,KAAC,YAAY,kBACX,OAAO,EAAC,iCAAiC,EACzC,SAAS,EAAE,oBAAoB,gBAE9B,QAAQ,IACI,CAChB,CAAC;AACJ,CAAC,CAAC"}

package/dist/src/components/Notification/index.d.ts

@@ -0,0 +1,3 @@
+export * from './Notification';
+export * from './PermissionNotification';
+export * from './SpeakingWhileMutedNotification';

package/dist/src/components/Notification/index.js

@@ -0,0 +1,4 @@
+export * from './Notification';
+export * from './PermissionNotification';
+export * from './SpeakingWhileMutedNotification';
+//# sourceMappingURL=index.js.map

package/dist/src/components/Notification/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Notification/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,0BAA0B,CAAC;AACzC,cAAc,kCAAkC,CAAC"}

package/dist/src/components/Permissions/PermissionRequests.d.ts

@@ -0,0 +1,8 @@
+import { ComponentProps } from 'react';
+import { PermissionRequestEvent } from '@stream-io/video-client';
+export declare const PermissionRequests: () => JSX.Element | null;
+export type PermissionRequestListProps = ComponentProps<'div'> & {
+    permissionRequests: PermissionRequestEvent[];
+    handleUpdatePermission: (request: PermissionRequestEvent, allow: boolean) => () => Promise<void>;
+};
+export declare const PermissionRequestList: import("react").ForwardRefExoticComponent<Omit<PermissionRequestListProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/src/components/Permissions/PermissionRequests.js

@@ -0,0 +1,109 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { forwardRef, Fragment, useEffect, useState, } from 'react';
+import { OwnCapability, } from '@stream-io/video-client';
+import { useCall, useHasPermissions } from '@stream-io/video-react-bindings';
+import clsx from 'clsx';
+import { useFloatingUIPreset } from '../../hooks';
+const byNameOrId = (a, b) => {
+    if (a.name && b.name && a.name < b.name)
+        return -1;
+    if (a.name && b.name && a.name > b.name)
+        return 1;
+    if (a.id < b.id)
+        return -1;
+    if (a.id > b.id)
+        return 1;
+    return 0;
+};
+export const PermissionRequests = () => {
+    const call = useCall();
+    const [expanded, setExpanded] = useState(false);
+    const [permissionRequests, setPermissionRequests] = useState([]);
+    const canUpdateCallPermissions = useHasPermissions(OwnCapability.UPDATE_CALL_PERMISSIONS);
+    useEffect(() => {
+        if (!call || !canUpdateCallPermissions)
+            return;
+        return call.on('call.permission_request', (event) => {
+            if (event.type !== 'call.permission_request')
+                return;
+            setPermissionRequests((requests) => [...requests, event].sort((a, b) => byNameOrId(a.user, b.user)));
+        });
+    }, [call, canUpdateCallPermissions]);
+    const handleUpdatePermission = (request, allow) => {
+        return () => __awaiter(void 0, void 0, void 0, function* () {
+            const { user, permissions } = request;
+            if (allow) {
+                yield (call === null || call === void 0 ? void 0 : call.updateUserPermissions({
+                    user_id: user.id,
+                    grant_permissions: permissions,
+                }));
+            }
+            else {
+                yield (call === null || call === void 0 ? void 0 : call.updateUserPermissions({
+                    user_id: user.id,
+                    revoke_permissions: permissions,
+                }));
+            }
+            setPermissionRequests((requests) => requests.filter((r) => r !== request));
+        });
+    };
+    const { refs, x, y, strategy } = useFloatingUIPreset({
+        placement: 'bottom',
+        strategy: 'absolute',
+    });
+    // don't render anything if there are no permission requests
+    if (permissionRequests.length === 0)
+        return null;
+    return (_jsxs("div", Object.assign({ className: "str-video__permission-requests", ref: refs.setReference }, { children: [_jsxs("div", Object.assign({ className: "str-video__permission-requests__notification" }, { children: [_jsxs("span", Object.assign({ className: "str-video__permission-requests__notification__message" }, { children: [permissionRequests.length, " pending permission requests"] })), _jsx(Button, Object.assign({ type: "button", onClick: () => {
+                            setExpanded((e) => !e);
+                        } }, { children: expanded ? 'Hide requests' : 'Show requests' }))] })), expanded && (_jsx(PermissionRequestList, { ref: refs.setFloating, style: {
+                    position: strategy,
+                    top: y !== null && y !== void 0 ? y : 0,
+                    left: x !== null && x !== void 0 ? x : 0,
+                    overflowY: 'auto',
+                }, permissionRequests: permissionRequests, handleUpdatePermission: handleUpdatePermission }))] })));
+};
+export const PermissionRequestList = forwardRef((props, ref) => {
+    const { permissionRequests, handleUpdatePermission } = props, rest = __rest(props, ["permissionRequests", "handleUpdatePermission"]);
+    return (_jsx("div", Object.assign({ className: "str-video__permission-requests-list", ref: ref }, rest, { children: permissionRequests.map((request, reqIndex) => {
+            const { user, permissions } = request;
+            return (_jsx(Fragment, { children: permissions.map((permission) => (_jsxs("div", Object.assign({ className: "str-video__permission-request" }, { children: [_jsx("div", Object.assign({ className: "str-video__permission-request__message" }, { children: messageForPermission(user.name || user.id, permission) })), _jsx(Button, Object.assign({ className: "str-video__permission-request__button--allow", type: "button", onClick: handleUpdatePermission(request, true) }, { children: "Allow" })), _jsx(Button, Object.assign({ className: "str-video__permission-request__button--reject", type: "button", onClick: handleUpdatePermission(request, false) }, { children: "Reject" }))] }), permission))) }, `${user.id}/${reqIndex}`));
+        }) })));
+});
+const Button = (props) => {
+    const { className } = props, rest = __rest(props, ["className"]);
+    return (_jsx("button", Object.assign({ className: clsx('str-video__permission-request__button', className) }, rest)));
+};
+const messageForPermission = (userName, permission) => {
+    switch (permission) {
+        case OwnCapability.SEND_AUDIO:
+            return `${userName} is requesting to speak`;
+        case OwnCapability.SEND_VIDEO:
+            return `${userName} is requesting to share their camera`;
+        case OwnCapability.SCREENSHARE:
+            return `${userName} is requesting to present their screen`;
+        default:
+            return `${userName} is requesting permission: ${permission}`;
+    }
+};
+//# sourceMappingURL=PermissionRequests.js.map

package/dist/src/components/Permissions/PermissionRequests.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PermissionRequests.js","sourceRoot":"","sources":["../../../../src/components/Permissions/PermissionRequests.tsx"],"names":[],"mappings":"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"}

package/dist/src/components/Permissions/index.d.ts

@@ -0,0 +1 @@
+export * from './PermissionRequests';

package/dist/src/components/Permissions/index.js

@@ -0,0 +1,2 @@
+export * from './PermissionRequests';
+//# sourceMappingURL=index.js.map

package/dist/src/components/Permissions/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Permissions/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAC"}

package/dist/src/components/Reaction/Reaction.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { Call, StreamReaction } from '@stream-io/video-client';
+export type ReactionProps = {
+    reaction: StreamReaction;
+    sessionId: string;
+    call: Call;
+    hideAfterTimeoutInMs?: number;
+};
+export declare const defaultEmojiReactions: Record<string, string>;
+export declare const Reaction: (props: ReactionProps) => JSX.Element;

package/dist/src/components/Reaction/Reaction.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import clsx from 'clsx';
+export const defaultEmojiReactions = {
+    ':like:': '👍',
+    ':raise-hand:': '✋',
+    ':fireworks:': '🎉',
+};
+export const Reaction = (props) => {
+    const { reaction, sessionId, call, hideAfterTimeoutInMs = 5500 } = props;
+    const [isShowing, setIsShowing] = useState(false);
+    useEffect(() => {
+        let timeoutId;
+        if (reaction) {
+            setIsShowing(true);
+            timeoutId = setTimeout(() => {
+                setIsShowing(false);
+                call.resetReaction(sessionId);
+            }, hideAfterTimeoutInMs);
+        }
+        return () => {
+            clearTimeout(timeoutId);
+        };
+    }, [call, hideAfterTimeoutInMs, reaction, sessionId]);
+    const { emoji_code } = reaction;
+    return (_jsx("div", Object.assign({ className: clsx('str-video__reaction', isShowing && 'str-video__reaction--visible') }, { children: _jsx("span", Object.assign({ className: "str-video__reaction__emoji" }, { children: emoji_code && defaultEmojiReactions[emoji_code] })) })));
+};
+//# sourceMappingURL=Reaction.js.map

package/dist/src/components/Reaction/Reaction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Reaction.js","sourceRoot":"","sources":["../../../../src/components/Reaction/Reaction.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAE5C,OAAO,IAAI,MAAM,MAAM,CAAC;AASxB,MAAM,CAAC,MAAM,qBAAqB,GAA2B;IAC3D,QAAQ,EAAE,IAAI;IACd,cAAc,EAAE,GAAG;IACnB,aAAa,EAAE,IAAI;CACpB,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE;IAC/C,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,oBAAoB,GAAG,IAAI,EAAE,GAAG,KAAK,CAAC;IACzE,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAyB,CAAC;QAC9B,IAAI,QAAQ,EAAE;YACZ,YAAY,CAAC,IAAI,CAAC,CAAC;YACnB,SAAS,GAAG,UAAU,CAAC,GAAG,EAAE;gBAC1B,YAAY,CAAC,KAAK,CAAC,CAAC;gBACpB,IAAI,CAAC,aAAa,CAAC,SAAS,CAAC,CAAC;YAChC,CAAC,EAAE,oBAAoB,CAAC,CAAC;SAC1B;QACD,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,SAAS,CAAC,CAAC;QAC1B,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,IAAI,EAAE,oBAAoB,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC;IAEtD,MAAM,EAAE,UAAU,EAAE,GAAG,QAAQ,CAAC;IAChC,OAAO,CACL,4BACE,SAAS,EAAE,IAAI,CACb,qBAAqB,EACrB,SAAS,IAAI,8BAA8B,CAC5C,gBAED,6BAAM,SAAS,EAAC,4BAA4B,gBACzC,UAAU,IAAI,qBAAqB,CAAC,UAAU,CAAC,IAC3C,IACH,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/src/components/Reaction/index.d.ts

@@ -0,0 +1 @@
+export * from './Reaction';

package/dist/src/components/Reaction/index.js

@@ -0,0 +1,2 @@
+export * from './Reaction';
+//# sourceMappingURL=index.js.map

package/dist/src/components/Reaction/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Reaction/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC"}

package/dist/src/components/Search/SearchInput.d.ts

@@ -0,0 +1,14 @@
+import { ComponentProps } from 'react';
+type SearchInputProps = ComponentProps<'input'> & {
+    /**
+     * Resets the search to its initial state.
+     * The function is called when Esc key or inputs clear button are pressed
+     */
+    exitSearch: () => void;
+    /**
+     * Flag to signal, whether search input elements should be rendered as active
+     */
+    isActive: boolean;
+};
+export declare const SearchInput: ({ exitSearch, isActive, ...rest }: SearchInputProps) => JSX.Element;
+export {};

package/dist/src/components/Search/SearchInput.js

@@ -0,0 +1,34 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import clsx from 'clsx';
+export const SearchInput = (_a) => {
+    var { exitSearch, isActive } = _a, rest = __rest(_a, ["exitSearch", "isActive"]);
+    const [inputElement, setInputElement] = useState(null);
+    useEffect(() => {
+        if (!inputElement)
+            return;
+        const handleKeyDown = (e) => {
+            if (e.key.toLowerCase() === 'escape')
+                exitSearch();
+        };
+        inputElement.addEventListener('keydown', handleKeyDown);
+        return () => {
+            inputElement.removeEventListener('keydown', handleKeyDown);
+        };
+    }, [exitSearch, inputElement]);
+    return (_jsxs("div", Object.assign({ className: clsx('str-video__search-input__container', {
+            'str-video__search-input__container--active': isActive,
+        }) }, { children: [_jsx("input", Object.assign({ placeholder: "Search" }, rest, { ref: setInputElement })), isActive ? (_jsx("button", Object.assign({ className: "str-video__search-input__clear-btn", onClick: exitSearch }, { children: _jsx("span", { className: "str-video__search-input__icon--active" }) }))) : (_jsx("span", { className: "str-video__search-input__icon" }))] })));
+};
+//# sourceMappingURL=SearchInput.js.map

package/dist/src/components/Search/SearchInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../../src/components/Search/SearchInput.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAAA,OAAO,EAAkB,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5D,OAAO,IAAI,MAAM,MAAM,CAAC;AAaxB,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAIT,EAAE,EAAE;QAJK,EAC1B,UAAU,EACV,QAAQ,OAES,EADd,IAAI,cAHmB,0BAI3B,CADQ;IAEP,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAC9C,IAAI,CACL,CAAC;IACF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,YAAY;YAAE,OAAO;QAE1B,MAAM,aAAa,GAAG,CAAC,CAAgB,EAAE,EAAE;YACzC,IAAI,CAAC,CAAC,GAAG,CAAC,WAAW,EAAE,KAAK,QAAQ;gBAAE,UAAU,EAAE,CAAC;QACrD,CAAC,CAAC;QAEF,YAAY,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;QAExD,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAC;QAC7D,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC;IAE/B,OAAO,CACL,6BACE,SAAS,EAAE,IAAI,CAAC,oCAAoC,EAAE;YACpD,4CAA4C,EAAE,QAAQ;SACvD,CAAC,iBAEF,8BAAO,WAAW,EAAC,QAAQ,IAAK,IAAI,IAAE,GAAG,EAAE,eAAe,IAAI,EAC7D,QAAQ,CAAC,CAAC,CAAC,CACV,+BACE,SAAS,EAAC,oCAAoC,EAC9C,OAAO,EAAE,UAAU,gBAEnB,eAAM,SAAS,EAAC,uCAAuC,GAAG,IACnD,CACV,CAAC,CAAC,CAAC,CACF,eAAM,SAAS,EAAC,+BAA+B,GAAG,CACnD,KACG,CACP,CAAC;AACJ,CAAC,CAAC"}

package/dist/src/components/Search/SearchResults.d.ts

@@ -0,0 +1,14 @@
+import { ComponentType } from 'react';
+import { SearchController } from './hooks';
+export type SearchResultListProps<T> = {
+    data: T[];
+};
+export type SearchResultsProps<T> = Pick<SearchController<T>, 'searchResults' | 'searchQueryInProgress'> & {
+    /** Component to be displayed, when empty array of search results is provided */
+    EmptySearchResultComponent: ComponentType;
+    /** Component will be used to render non-empty array of search results  */
+    SearchResultList: ComponentType<SearchResultListProps<T>>;
+    /** Component to be displayed while the search query request is in progress */
+    LoadingIndicator?: ComponentType;
+};
+export declare const SearchResults: <T extends unknown>({ EmptySearchResultComponent, LoadingIndicator, searchQueryInProgress, searchResults, SearchResultList, }: SearchResultsProps<T>) => JSX.Element;

package/dist/src/components/Search/SearchResults.js

@@ -0,0 +1,12 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { LoadingIndicator as DefaultLoadingIndicator } from '../LoadingIndicator';
+export const SearchResults = ({ EmptySearchResultComponent, LoadingIndicator = DefaultLoadingIndicator, searchQueryInProgress, searchResults, SearchResultList, }) => {
+    if (searchQueryInProgress) {
+        return (_jsx("div", Object.assign({ className: "str-video__search-results--loading" }, { children: _jsx(LoadingIndicator, {}) })));
+    }
+    if (!searchResults.length) {
+        return _jsx(EmptySearchResultComponent, {});
+    }
+    return _jsx(SearchResultList, { data: searchResults });
+};
+//# sourceMappingURL=SearchResults.js.map

package/dist/src/components/Search/SearchResults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchResults.js","sourceRoot":"","sources":["../../../../src/components/Search/SearchResults.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,gBAAgB,IAAI,uBAAuB,EAAE,MAAM,qBAAqB,CAAC;AAmBlF,MAAM,CAAC,MAAM,aAAa,GAAG,CAAoB,EAC/C,0BAA0B,EAC1B,gBAAgB,GAAG,uBAAuB,EAC1C,qBAAqB,EACrB,aAAa,EACb,gBAAgB,GACM,EAAE,EAAE;IAC1B,IAAI,qBAAqB,EAAE;QACzB,OAAO,CACL,4BAAK,SAAS,EAAC,oCAAoC,gBACjD,KAAC,gBAAgB,KAAG,IAChB,CACP,CAAC;KACH;IACD,IAAI,CAAC,aAAa,CAAC,MAAM,EAAE;QACzB,OAAO,KAAC,0BAA0B,KAAG,CAAC;KACvC;IAED,OAAO,KAAC,gBAAgB,IAAC,IAAI,EAAE,aAAa,GAAI,CAAC;AACnD,CAAC,CAAC"}

package/dist/src/components/Search/hooks/index.d.ts

@@ -0,0 +1 @@
+export * from './useSearch';

package/dist/src/components/Search/hooks/index.js

@@ -0,0 +1,2 @@
+export * from './useSearch';
+//# sourceMappingURL=index.js.map

package/dist/src/components/Search/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/components/Search/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC"}

package/dist/src/components/Search/hooks/useSearch.d.ts

@@ -0,0 +1,15 @@
+export type SearchController<T> = {
+    /** Flag signals that the search request is flight await the response */
+    searchQueryInProgress: boolean;
+    /** Array of items returned by the search query */
+    searchResults: T[];
+};
+export type UseSearchParams<T> = {
+    /** Search function performing the search request */
+    searchFn: (searchQuery: string) => Promise<T[]>;
+    /** Debounce interval applied to the search function */
+    debounceInterval: number;
+    /** Search query string */
+    searchQuery?: string;
+};
+export declare const useSearch: <T>({ debounceInterval, searchFn, searchQuery, }: UseSearchParams<T>) => SearchController<T>;

package/dist/src/components/Search/hooks/useSearch.js

@@ -0,0 +1,39 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+import { useEffect, useState } from 'react';
+export const useSearch = ({ debounceInterval, searchFn, searchQuery = '', }) => {
+    const [searchResults, setSearchResults] = useState([]);
+    const [searchQueryInProgress, setSearchQueryInProgress] = useState(false);
+    useEffect(() => {
+        if (!searchQuery.length)
+            return setSearchResults([]);
+        setSearchQueryInProgress(true);
+        const timeout = setTimeout(() => __awaiter(void 0, void 0, void 0, function* () {
+            try {
+                const results = yield searchFn(searchQuery);
+                setSearchResults(results);
+            }
+            catch (error) {
+                console.error(error);
+            }
+            finally {
+                setSearchQueryInProgress(false);
+            }
+        }), debounceInterval);
+        return () => {
+            clearTimeout(timeout);
+        };
+    }, [debounceInterval, searchFn, searchQuery]);
+    return {
+        searchQueryInProgress,
+        searchResults,
+    };
+};
+//# sourceMappingURL=useSearch.js.map

package/dist/src/components/Search/hooks/useSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSearch.js","sourceRoot":"","sources":["../../../../../src/components/Search/hooks/useSearch.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAkB5C,MAAM,CAAC,MAAM,SAAS,GAAG,CAAI,EAC3B,gBAAgB,EAChB,QAAQ,EACR,WAAW,GAAG,EAAE,GACG,EAAuB,EAAE;IAC5C,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAM,EAAE,CAAC,CAAC;IAC5D,MAAM,CAAC,qBAAqB,EAAE,wBAAwB,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE1E,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,WAAW,CAAC,MAAM;YAAE,OAAO,gBAAgB,CAAC,EAAE,CAAC,CAAC;QAErD,wBAAwB,CAAC,IAAI,CAAC,CAAC;QAE/B,MAAM,OAAO,GAAG,UAAU,CAAC,GAAS,EAAE;YACpC,IAAI;gBACF,MAAM,OAAO,GAAG,MAAM,QAAQ,CAAC,WAAW,CAAC,CAAC;gBAC5C,gBAAgB,CAAC,OAAO,CAAC,CAAC;aAC3B;YAAC,OAAO,KAAK,EAAE;gBACd,OAAO,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC;aACtB;oBAAS;gBACR,wBAAwB,CAAC,KAAK,CAAC,CAAC;aACjC;QACH,CAAC,CAAA,EAAE,gBAAgB,CAAC,CAAC;QAErB,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,OAAO,CAAC,CAAC;QACxB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,gBAAgB,EAAE,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAC;IAE9C,OAAO;QACL,qBAAqB;QACrB,aAAa;KACd,CAAC;AACJ,CAAC,CAAC"}

package/dist/src/components/Search/index.d.ts

@@ -0,0 +1,2 @@
+export * from './SearchInput';
+export * from './SearchResults';

package/dist/src/components/Search/index.js

@@ -0,0 +1,3 @@
+export * from './SearchInput';
+export * from './SearchResults';
+//# sourceMappingURL=index.js.map

package/dist/src/components/Search/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Search/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC"}

package/dist/src/components/StreamCall/CallParticipantsScreenView.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { Call } from '@stream-io/video-client';
+export declare const CallParticipantsScreenView: (props: {
+    call: Call;
+}) => JSX.Element;